/* OKAS system palette: keep this shared block identical in the three existing
   server-whitelisted stylesheets. No new asset route or theme-switch JS. */
:root {
  color-scheme: light dark;
  --canvas: #e9e9e9;
  --surface: #fafafa;
  --surface-soft: #e3e3e3;
  --surface-tint: #dcdcdc;
  --text: #242424;
  --muted: #555555;
  --border: #cacaca;
  --control-border: #777777;
  --accent: #1d4ed8;
  --accent-hover: #1e40af;
  --on-accent: #fafafa;
  --focus: #5e5e5e;
  --danger: #b42020;
  --danger-bg: #ededed;
  --success: #3c5c65;
  --success-bg: #ededed;
  --disabled-bg: #dedede;
  --disabled-text: #555555;
  --telegram: #24648c;
  --telegram-bg: #ededed;
  --shadow: 0 12px 40px #0000000a;
  --inverse: #171717;
  --inverse-text: #ededed;
  --inverse-muted: #bfbfbf;
  --inverse-surface: #232323;
  --inverse-border: #666666;
  --inverse-accent: #60a5fa;
  --bg: var(--canvas);
  --paper: var(--surface);
  --ink: var(--text);
  --brand: var(--accent);
  --brand-inverse: var(--inverse-accent);
  --line: var(--border);
}
@media (prefers-color-scheme: dark) {
  :root {
    --canvas: #161616;
    --surface: #1d1d1d;
    --surface-soft: #202020;
    --surface-tint: #232323;
    --text: #ededed;
    --muted: #b8b8b8;
    --border: #444444;
    --control-border: #858585;
    --accent: #60a5fa;
    --accent-hover: #93c5fd;
    --on-accent: #101010;
    --focus: #c6c6c6;
    --danger: #ff453a;
    --danger-bg: #202020;
    --success: #a9c9cf;
    --success-bg: #202020;
    --disabled-bg: #252525;
    --disabled-text: #b8b8b8;
    --telegram: #a7d5f1;
    --telegram-bg: #202020;
    --shadow: 0 12px 40px #00000026;
    --inverse: #171717;
    --inverse-text: #ededed;
    --inverse-muted: #bfbfbf;
    --inverse-surface: #232323;
    --inverse-border: #666666;
    --inverse-accent: #60a5fa;
  }
}
html { background: var(--canvas); -webkit-text-size-adjust: 100%; }
body { background: var(--canvas); color: var(--text); }
[hidden] { display: none !important; }
::selection { background: var(--accent); color: var(--on-accent); }
input, textarea, select { color-scheme: inherit; accent-color: var(--accent); }
input::placeholder, textarea::placeholder { color: var(--muted); opacity: 1; }
input:-webkit-autofill { -webkit-text-fill-color: var(--text); -webkit-box-shadow: 0 0 0 1000px var(--surface) inset; caret-color: var(--text); }
:where(button, input, select, textarea, a, summary):focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
:where(button, input, select, textarea):disabled { opacity: 1; cursor: not-allowed; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
@media (forced-colors: active) { button, input, textarea, select { border: 1px solid ButtonText; } }

/* Page components */
*{box-sizing:border-box} [hidden]{display:none!important}:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);background:var(--canvas);font-synthesis:none}body{margin:0;padding:0 20px 36px;font-size:15px;line-height:1.55}a{color:var(--accent);text-underline-offset:3px}.brand{max-width:1040px;margin:auto;display:flex;justify-content:space-between;align-items:center;padding:26px 0;gap:16px}.brand a{display:flex;align-items:center;gap:10px;font-size:19px;font-weight:700;text-decoration:none;color:inherit}.brand-mark{font-size:12px;display:grid;place-items:center;width:36px;height:36px;background:var(--accent);color:var(--on-accent);border-radius:10px}.environment{font-size:12px;color:var(--muted)}.auth-shell{max-width:440px;margin:24px auto}.auth-card{background:var(--surface);padding:30px;border-radius:12px;box-shadow:var(--shadow);border:1px solid var(--border)}.eyebrow{font-size:11px;letter-spacing:.12em;font-weight:700;color:var(--muted);margin:0 0 12px}h1{font-size:29px;line-height:1.2;letter-spacing:-.7px;margin:0 0 10px}.intro{color:var(--muted);margin:0 0 22px;font-size:14px}.auth-tabs{display:flex;gap:3px;padding:4px;background:var(--surface-soft);border-radius:10px;margin-bottom:22px}button{font:inherit;cursor:pointer;transition:background .15s,box-shadow .15s}.auth-tabs button{flex:1;min-width:0;min-height:42px;padding:8px 4px;border:0;background:transparent;border-radius:7px;font-size:12px;color:var(--muted)}.auth-tabs button[aria-current=page]{background:var(--surface);color:var(--accent);font-weight:650;box-shadow:0 1px 4px #0000000b}button:disabled{cursor:not-allowed;opacity:1}.telegram-option button{display:flex;gap:10px;justify-content:center;align-items:center;width:100%;min-height:48px;border:1px solid var(--control-border);background:var(--telegram-bg);border-radius:10px;color:var(--telegram);font-size:14px;font-weight:600}.telegram-option svg{width:20px;height:20px;fill:currentColor}.telegram-option p{font-size:11px;color:var(--muted);text-align:center;margin:7px 0 0}.divider{display:flex;align-items:center;gap:12px;font-size:11px;color:var(--muted);margin:20px 0}.divider:before,.divider:after{content:"";height:1px;background:var(--border);flex:1}.status{font-size:13px;color:var(--muted);margin:0 0 14px;overflow-wrap:anywhere}.status[data-kind=error]{color:var(--danger);background:var(--danger-bg);padding:12px;border-radius:9px}.status[data-kind=success]{color:var(--success);background:var(--success-bg);padding:12px;border-radius:9px}fieldset{border:0;padding:0;margin:0;min-width:0}legend{font-size:0;height:0;padding:0}label{display:block;font-size:13px;font-weight:550;margin:16px 0 7px}input{width:100%;min-width:0;min-height:48px;border:1px solid var(--control-border);border-radius:9px;padding:11px 12px;font:inherit;font-size:16px;color:var(--text);background:var(--surface);outline:none}input:focus{border-color:var(--focus);box-shadow:0 0 0 3px transparent}input:disabled{background:var(--disabled-bg)}.password-field{position:relative}.password-field input{padding-right:52px}.password-field button{position:absolute;right:3px;top:3px;width:42px;height:42px;min-height:42px;border:0;background:transparent;border-radius:7px;color:var(--muted);display:grid;place-items:center}.password-field button[aria-pressed=true]{background:var(--surface-tint);color:var(--accent)}.password-field svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.6}.password-field button:hover{background:var(--surface-soft)}form fieldset>button{width:100%;min-height:48px;border:0;background:var(--accent);color:var(--on-accent);border-radius:9px;margin-top:22px;font-size:14px;font-weight:600}form fieldset>button:hover{background:var(--accent-hover)}button:focus-visible,a:focus-visible{outline:3px solid var(--focus);outline-offset:3px}.hint{color:var(--muted);font-size:12px}.check{display:flex;align-items:flex-start;gap:10px;font-size:12px;font-weight:400}.check input{width:17px;height:17px;min-height:17px;flex:0 0 17px;margin-top:2px;accent-color:var(--accent)}.availability{margin:22px 0 0;padding-top:14px;border-top:1px solid var(--border);font-size:12px;color:var(--muted)}.support{margin-top:14px;color:var(--muted);font-size:11px;overflow-wrap:anywhere}.support summary{cursor:pointer}.auth-footer{text-align:center;color:var(--muted);font-size:11px;margin:20px 0}.auth-footer a{display:inline-block;margin-top:8px}#code-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}#code-actions button{border:1px solid var(--control-border);border-radius:8px;padding:9px 12px;background:var(--surface);color:var(--accent);font-size:12px}#captcha{margin-top:16px}input[name=otp]{letter-spacing:.3em;text-align:center;font-variant-numeric:tabular-nums}@media(max-width:480px){body{padding:0 16px 24px}.brand{padding:18px 0}.auth-shell{margin-top:8px}.auth-card{padding:23px 20px;border-radius:16px}h1{font-size:27px}.environment{font-size:10px}.auth-tabs button{font-size:11px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.auth-card form button.recovery-link{background:transparent;color:var(--accent);border:0;box-shadow:none;text-decoration:underline;font-size:13px;min-height:44px;padding:8px;margin-top:4px}

/* Native input sizing avoids iOS focus zoom; no theme-switch JS is needed. */
:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.auth-card{border-radius:12px}
.auth-tabs button{min-height:44px;font-size:13px}
.auth-tabs button[aria-current=page]{box-shadow:none;box-shadow:inset 0 -2px var(--accent)}
.auth-tabs button:not(:disabled):hover{background:var(--surface-tint)}
input:not([type=checkbox]):focus{outline:2px solid var(--focus);outline-offset:2px}
input[type=checkbox]:focus:not(:focus-visible){outline:none}
input:disabled{color:var(--disabled-text)}
button:disabled,form fieldset:disabled>button{background:var(--disabled-bg);color:var(--disabled-text);box-shadow:none}
.password-field button{width:44px;height:44px;min-height:44px;top:2px;right:2px}
/* Dedicated mail receivers use text visibility controls, not the login SVG. */
#password-form .password-field button{width:80px;white-space:nowrap;text-align:center;padding:0 6px}
#password-form .password-field input{padding-right:88px}
.password-field button:disabled{background:transparent;color:var(--disabled-text)}
.auth-card form button.recovery-link:disabled{background:transparent;color:var(--disabled-text)}
.auth-tabs button:disabled{background:transparent}
.status{border:1px solid transparent}
.status[data-kind=error]{border-color:var(--danger)}
.status[data-kind=success]{border-color:var(--success)}
.check{min-height:44px;align-items:center;margin:8px 0;line-height:1.5}
.check input{margin:0}
.support summary{min-height:44px;display:list-item;padding:12px 0}
.auth-footer a{min-height:44px;padding:12px 0}
.auth-footer,.support,.telegram-option p{font-size:12px}
#code-actions button{min-height:44px}
#captcha{--altcha-color-base:var(--surface);--altcha-color-base-content:var(--text);--altcha-border-color:var(--control-border);--altcha-checkbox-border-color:var(--control-border);--altcha-checkbox-outline-color:var(--focus);--altcha-color-primary:var(--accent);--altcha-color-primary-content:var(--on-accent);--altcha-color-neutral:var(--control-border);--altcha-color-neutral-content:var(--muted);--altcha-color-error:var(--danger);--altcha-color-success:var(--success);--altcha-border-radius:10px;--altcha-max-width:100%}
@media(max-width:480px){.auth-tabs button{font-size:13px}.environment{font-size:11px}.auth-card{padding:24px 20px}}

/* Error and confirmation are structurally distinct as well as labelled in text. */
.status[data-kind=error] { border: 3px double var(--danger); }
.status[data-kind=error]::before {
  content: "!"; display: inline-grid; place-items: center; width: 18px; height: 18px;
  margin-right: 8px; border: 1px solid currentColor; border-radius: 50%; font-weight: 700; line-height: 1;
}
.status[data-kind=success] { border-style: solid; }
.auth-tabs button[aria-current=page] { text-decoration: underline; text-underline-offset: 4px; }
.intro { line-height: 1.65; }
/* Secondary consent exit is distinct from acceptance and remains touch friendly. */
.consent-decline{display:block;min-height:44px;width:100%;margin-top:12px;padding:10px;border:1px solid var(--control-border);border-radius:10px;background:var(--surface);color:var(--text)}
/* Invalid fields are identifiable locally, without tinting the entire form red. */
.auth-card input[aria-invalid="true"]:not([type="checkbox"]){border:2px solid var(--danger);box-shadow:inset 4px 0 var(--danger);background:var(--surface)}
.auth-card .check:has(input[aria-invalid="true"]){border-left:3px solid var(--danger);padding-left:8px}
.field-error{color:var(--danger);font-size:13px;line-height:1.5;margin:6px 0 12px;overflow-wrap:anywhere}
.field-error::before{content:"! ";font-weight:700}
@media(forced-colors:active){.auth-card input[aria-invalid="true"]{outline:2px dashed CanvasText}}
