/* Shared colors and type tokens are owned by site.css. */
* { box-sizing:border-box; }
html,body { min-height:100%; }
[hidden] { display:none !important; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"Source Han Sans SC",sans-serif; }
button,input { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
.auth-noise { position:fixed; inset:0; pointer-events:none; opacity:.13; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.33'/%3E%3C/svg%3E"); }
.auth-layout { min-height:100vh; width:min(1220px,100%); margin:auto; padding:clamp(30px,6vw,82px) clamp(22px,7vw,100px); display:grid; grid-template-columns:minmax(0,1fr) minmax(360px,470px); gap:clamp(42px,9vw,150px); align-items:center; position:relative; }
.auth-intro { align-self:stretch; display:flex; flex-direction:column; justify-content:center; max-width:570px; }
.auth-brand { align-self:flex-start; color:var(--ink); text-decoration:none; font:700 25px "Noto Serif SC",serif; letter-spacing:-2px; }
.auth-brand span { display:inline-grid; place-items:center; width:31px; height:31px; margin-right:8px; border-radius:50%; color:#fff; background:var(--accent); font:22px Georgia; letter-spacing:0; }
.auth-kicker,.auth-card-kicker,.auth-rule span { color:var(--muted); font:500 10px "DM Mono",monospace; letter-spacing:.12em; }
.auth-kicker { margin:clamp(55px,10vh,125px) 0 24px; }
.auth-intro h1 { margin:0; font:600 clamp(42px,6.2vw,82px)/1.08 "Noto Serif SC",serif; letter-spacing:-6px; }
.auth-intro h1 em { color:var(--accent); font-style:normal; }
.auth-lead { max-width:430px; margin:28px 0 0; color:var(--muted); font-size:14px; line-height:1.9; }
.auth-rule { display:flex; align-items:center; gap:13px; margin:62px 0 22px; }
.auth-rule i { width:38px; height:2px; background:var(--accent); }
.auth-points { display:grid; gap:12px; list-style:none; padding:0; margin:0; color:var(--muted); font-size:12px; }
.auth-points li { display:flex; align-items:center; gap:14px; }
.auth-points b { color:var(--accent); font:500 10px "DM Mono",monospace; }
.auth-card { position:relative; width:100%; padding:27px 30px 24px; border:1px solid var(--line); background:color-mix(in srgb, var(--card) 93%, transparent); box-shadow:16px 18px 0 color-mix(in srgb, var(--sage) 11%, transparent); }
.auth-language-toggle { position:absolute; top:24px; right:30px; }
.auth-back { display:inline-block; color:var(--muted); text-decoration:none; font:500 10px "DM Mono",monospace; }
.auth-back:hover,.guest-link:hover { color:var(--accent); }
.account-banner { display:flex; align-items:center; gap:10px; margin:24px 0 -2px; padding:10px; border:1px solid color-mix(in srgb, var(--sage) 40%, var(--line)); background:color-mix(in srgb, var(--sage) 8%, transparent); }
.account-banner-dot { width:7px; height:7px; flex:0 0 auto; border-radius:50%; background:var(--sage); }
.account-banner div { min-width:0; display:flex; flex-direction:column; gap:2px; }
.account-banner strong,.account-banner small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.account-banner strong { font-size:12px; }
.account-banner small { color:var(--muted); font:10px "DM Mono",monospace; }
.account-banner button { margin-left:auto; border:0; background:transparent; color:var(--muted); font-size:11px; cursor:pointer; }
.auth-heading { margin:43px 0 25px; }
.auth-card-kicker { margin:0 0 9px; }
.auth-heading h2 { margin:0; font:600 29px "Noto Serif SC",serif; letter-spacing:-1px; }
.auth-heading p:last-child { margin:9px 0 0; color:var(--muted); font-size:12px; line-height:1.6; }
.auth-tabs { display:flex; gap:20px; border-bottom:1px solid var(--line); }
.auth-tab { position:relative; padding:0 0 11px; border:0; background:transparent; color:var(--muted); font-size:13px; cursor:pointer; }
.auth-tab::after { content:""; position:absolute; right:0; bottom:-1px; left:0; height:2px; background:transparent; }
.auth-tab.is-active { color:var(--ink); font-weight:600; }
.auth-tab.is-active::after { background:var(--accent); }
.auth-form { display:grid; gap:16px; padding-top:24px; }
.auth-form label { display:grid; gap:7px; color:var(--muted); font-size:11px; }
.auth-form .optional { color:var(--muted); font:10px "DM Mono",monospace; }
.auth-form input { width:100%; height:43px; border:1px solid var(--line); border-radius:2px; padding:0 12px; outline:0; color:var(--ink); background:rgba(255,255,255,.42); font-size:13px; transition:border-color .18s,box-shadow .18s; }
.auth-form input:focus { border-color:var(--sage); box-shadow:0 0 0 3px color-mix(in srgb, var(--sage) 15%, transparent); }
.password-field { position:relative; }
.password-field input { padding-right:58px; }
.password-toggle { position:absolute; top:50%; right:9px; transform:translateY(-50%); border:0; background:transparent; color:var(--muted); font:10px "DM Mono",monospace; cursor:pointer; }
.password-toggle:hover { color:var(--accent); }
.auth-submit { height:46px; margin-top:4px; border:1px solid var(--ink); border-radius:2px; color:var(--paper); background:var(--ink); text-align:left; padding:0 14px; font-weight:600; cursor:pointer; transition:background .18s,border-color .18s,transform .18s; }
.auth-submit .submit-label { float:none; }
.auth-submit .submit-arrow { float:right; font:16px "DM Mono",monospace; }
.auth-submit:hover { border-color:var(--accent); background:var(--accent); transform:translateY(-1px); }
.auth-submit:disabled { cursor:wait; opacity:.6; transform:none; }
.auth-status { min-height:19px; margin:14px 0 0; color:var(--accent); font-size:11px; line-height:1.6; }
.auth-status.is-success { color:var(--sage); }
.guest-link { display:block; color:var(--sage); text-align:center; text-underline-offset:3px; font-size:11px; }
.auth-footnote { margin:25px 0 0; padding-top:14px; border-top:1px solid var(--line); color:var(--muted); font-size:10px; line-height:1.65; }
@media (max-width:820px) { .auth-layout { grid-template-columns:1fr; gap:34px; padding-top:34px; padding-bottom:34px; } .auth-intro { min-height:auto; } .auth-kicker { margin-top:48px; } .auth-intro h1 { font-size:clamp(42px,12vw,70px); } .auth-rule { margin-top:38px; } .auth-card { max-width:500px; justify-self:center; } }
@media (max-width:480px) { .auth-layout { padding:24px 18px 30px; } .auth-intro h1 { letter-spacing:-3px; } .auth-lead { font-size:13px; } .auth-card { padding:22px 19px 20px; box-shadow:9px 11px 0 color-mix(in srgb, var(--sage) 11%, transparent); } .auth-language-toggle { top:19px; right:19px; } .auth-heading { margin-top:34px; } }

html[data-theme="dark"] {
  & { color-scheme:dark; --ink:#e7ece8; --muted:#a3ada6; --paper:#0c1513; --card:#121f1b; --line:#304139; --accent:#ed7357; --sage:#8ca89b; }
  .auth-noise { opacity:.055; filter:invert(1); }
  .auth-card { background:color-mix(in srgb,var(--card) 93%,transparent); box-shadow:16px 18px 0 rgba(140,168,155,.1); }
  .auth-form input { color-scheme:dark; background:rgba(255,255,255,.04); color:var(--ink); border-color:var(--line); }
  .auth-form input::placeholder { color:#718078; opacity:1; }
  .account-banner { background:rgba(140,168,155,.1); border-color:rgba(140,168,155,.38); }
  .auth-submit { color:var(--paper); background:var(--ink); border-color:var(--ink); }
  .auth-submit:hover { color:#0c1513; background:var(--accent); border-color:var(--accent); }
}