:root {
    --bg:#070a0f;
    --panel:#10151c;
    --panel-soft:#151c25;
    --line:#263241;
    --text:#f8fafc;
    --muted:#94a3b8;
    --accent:#f97316;
    --accent-hover:#fb923c;
    --danger:#f87171;
}

* { box-sizing:border-box; }
[hidden] { display:none !important; }
html, body { min-height:100%; }
body {
    margin:0;
    background:
        radial-gradient(circle at 18% 12%, rgba(249,115,22,.12), transparent 26%),
        linear-gradient(135deg, #070a0f 0%, #0d1118 58%, #10151c 100%);
    color:var(--text);
    font-family:Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif;
    -webkit-font-smoothing:antialiased;
}
button, input { font:inherit; }
button { cursor:pointer; }
svg { width:17px; height:17px; stroke-width:2.3; }

.auth-shell {
    min-height:100vh;
    display:grid;
    place-items:center;
    padding:24px;
}
.auth-panel {
    width:min(430px, 100%);
    border:1px solid rgba(148,163,184,.22);
    border-radius:12px;
    background:rgba(16,21,28,.94);
    box-shadow:0 28px 90px rgba(0,0,0,.46);
    padding:22px;
}
.brand {
    display:flex;
    align-items:center;
    gap:12px;
}
.brand-mark {
    width:42px;
    height:42px;
    border-radius:10px;
    display:grid;
    place-items:center;
    background:transparent;
    color:#fff;
    overflow:hidden;
}
.brand-mark img {
    width:42px;
    height:42px;
    display:block;
    object-fit:contain;
    filter:none;
}
.brand h1 {
    margin:0;
    font-size:24px;
    line-height:1.1;
    font-weight:950;
    letter-spacing:0;
}
.brand p {
    margin:5px 0 0;
    color:var(--muted);
    font-size:12px;
    font-weight:760;
}
.auth-tabs {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:3px;
    margin-top:18px;
    padding:3px;
    border:1px solid rgba(148,163,184,.16);
    border-radius:10px;
    background:var(--panel-soft);
}
.auth-tabs button {
    min-height:36px;
    border:0;
    border-radius:8px;
    background:transparent;
    color:var(--muted);
    font-size:12px;
    font-weight:900;
}
.auth-tabs button.active {
    background:var(--accent);
    color:#06130b;
}
.auth-form {
    display:grid;
    gap:13px;
    margin-top:18px;
}
label {
    display:grid;
    gap:7px;
    color:var(--muted);
    font-size:12px;
    font-weight:850;
}
input {
    width:100%;
    min-height:43px;
    border:1px solid rgba(148,163,184,.22);
    border-radius:10px;
    background:#111827;
    color:var(--text);
    outline:none;
    padding:0 12px;
    font-size:14px;
    font-weight:760;
}
input:focus {
    border-color:rgba(249,115,22,.72);
    box-shadow:0 0 0 3px rgba(249,115,22,.15);
}
.auth-primary,
.auth-secondary {
    min-height:43px;
    border-radius:10px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    border:0;
    font-size:13px;
    font-weight:930;
}
.auth-primary {
    background:var(--accent);
    color:#06130b;
}
.auth-primary:hover { background:var(--accent-hover); }
.auth-secondary {
    border:1px solid rgba(148,163,184,.22);
    background:#151d27;
    color:#dbe4ef;
}
.auth-secondary:hover { border-color:rgba(249,115,22,.45); color:#fff; }
.auth-secondary.quiet {
    background:transparent;
    color:#94a3b8;
}
.auth-message {
    margin-top:16px;
    padding:10px 12px;
    border-radius:10px;
    border:1px solid rgba(249,115,22,.3);
    background:rgba(249,115,22,.12);
    color:#fed7aa;
    font-size:12px;
    font-weight:780;
    line-height:1.45;
}
.auth-message.error {
    border-color:rgba(248,113,113,.35);
    background:rgba(248,113,113,.12);
    color:#fecaca;
}
.verify-card {
    margin-top:18px;
    padding:13px;
    display:flex;
    align-items:flex-start;
    gap:11px;
    border:1px solid rgba(249,115,22,.28);
    border-radius:11px;
    background:rgba(249,115,22,.1);
}
.verify-card svg { color:#fdba74; flex:0 0 auto; margin-top:2px; }
.verify-card strong {
    display:block;
    font-size:14px;
    font-weight:950;
}
.verify-card span {
    display:block;
    margin-top:4px;
    color:var(--muted);
    font-size:12px;
    line-height:1.45;
    word-break:break-all;
}

@media (max-width:520px) {
    .auth-shell { padding:14px; }
    .auth-panel { padding:18px; }
}