:root{
  color-scheme: light;
  --page:#f6f6f3; --surface:#fcfcfb; --surface-2:#f0efec; --hover:rgba(11,11,11,.04);
  --ink:#0b0b0b; --ink-2:#52514e; --muted:#7a7873; --hair:#e1e0d9; --border:rgba(11,11,11,.10);
  --brand:#234d66; --brand-ink:#fff; --accent:#2a78d6;
  --good:#0ca30c; --good-ink:#006300; --crit:#d03b3b; --crit-bg:#fbe3e1;
  --shadow:0 1px 2px rgba(0,0,0,.04),0 1px 0 rgba(0,0,0,.02);
  --r:10px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme: dark;
    --page:#0f0f0e; --surface:#1a1a19; --surface-2:#232321; --hover:rgba(255,255,255,.04);
    --ink:#f0efec; --ink-2:#c3c2b7; --muted:#8f8d86; --hair:#2c2c2a; --border:rgba(255,255,255,.10);
    --brand:#7fb3d1; --brand-ink:#0b1a23; --accent:#3987e5; --good-ink:#3fc23f; --crit-bg:#3a1d1c;
  }
}
:root[data-theme="dark"]{
  color-scheme: dark;
  --page:#0f0f0e; --surface:#1a1a19; --surface-2:#232321; --hover:rgba(255,255,255,.04);
  --ink:#f0efec; --ink-2:#c3c2b7; --muted:#8f8d86; --hair:#2c2c2a; --border:rgba(255,255,255,.10);
  --brand:#7fb3d1; --brand-ink:#0b1a23; --accent:#3987e5; --good-ink:#3fc23f; --crit-bg:#3a1d1c;
}
*{box-sizing:border-box}
[hidden]{display:none !important}
html,body{margin:0}
body{background:var(--page);color:var(--ink);font:14px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-font-smoothing:antialiased}
button,input,select{font:inherit;color:inherit}
a{color:inherit}
.wrap{max-width:1100px;margin:0 auto;padding:0 24px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:36px;padding:0 14px;border-radius:8px;border:1px solid var(--border);background:var(--surface);cursor:pointer;white-space:nowrap;font-weight:520;text-decoration:none}
.btn:hover{background:var(--hover)}
.btn.primary{background:var(--brand);color:var(--brand-ink);border-color:transparent}
.btn.primary:hover{filter:brightness(1.08)}
.btn.danger{color:var(--crit)}
.btn[disabled]{opacity:.55;cursor:default}
.btn svg{width:15px;height:15px;flex:none}
.btn:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
input[type=text],input[type=password],input[type=search]{height:38px;border:1px solid var(--border);background:var(--surface);border-radius:8px;padding:0 11px;width:100%}
.field{display:flex;flex-direction:column;gap:5px}
.field>span{font-size:11.5px;color:var(--muted);font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.check{display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-size:13.5px;color:var(--ink-2)}
.check input{width:16px;height:16px;accent-color:var(--brand)}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow)}
.err{color:var(--crit);background:var(--crit-bg);border-radius:8px;padding:8px 11px;font-size:13px}
.muted{color:var(--muted)}
.brand-mark{width:32px;height:32px;border-radius:8px;background:var(--brand);display:grid;place-items:center;flex:none}
.brand-mark svg{width:18px;height:18px}