@font-face{font-family:Inter;src:url(/static/fonts/inter-cyrillic.woff2) format("woff2");font-weight:400 600;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Inter;src:url(/static/fonts/inter-latin.woff2) format("woff2");font-weight:400 600;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+2212,U+FEFF}
:root{color-scheme:light;--page:#fff;--ink:#070709;--muted:#60606c;--cloud:#f5f5f5;--line:#8b8b98;--focus:#285eaa;--error:#9b2428;--good:#20603c}
*{box-sizing:border-box}
body{margin:0;background:var(--page);color:var(--ink);font:400 16px/1.55 Inter,-apple-system,"Segoe UI",Arial,sans-serif}
header,main{max-width:760px;margin:auto;padding:24px}
header{display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line)}
header a{font-weight:600;font-size:20px;text-decoration:none;color:var(--ink);min-height:44px;display:flex;align-items:center}
header span{color:var(--muted);font-size:14px;text-align:right}
main{padding-top:32px;padding-bottom:max(40px,env(safe-area-inset-bottom))}
h1,h2{font-weight:600;line-height:1.2;letter-spacing:-.025em;margin:0 0 12px}
h1{font-size:32px}h2{font-size:20px}
p{margin:0 0 16px;max-width:70ch}.intro{font-size:18px}.privacy{color:var(--muted);font-size:14px;margin-bottom:32px}
section{margin-top:28px}.problem{display:grid;grid-template-columns:1fr 1.25fr 1fr;gap:14px}
label{display:grid;align-content:start;gap:8px;font-weight:500;min-width:0}
input,select,button{font:inherit;line-height:1.4;min-height:48px;border-radius:10px}
input,select{width:100%;padding:10px 12px;color:var(--ink);border:1px solid var(--line);background:var(--page);caret-color:var(--focus);font-variant-numeric:tabular-nums}
input::placeholder{color:var(--muted);font-size:14px}
input[aria-invalid=true]{border:2px solid var(--error);padding:9px 11px}
button{padding:11px 18px;border:1px solid var(--ink);background:var(--ink);color:var(--page);font-weight:500;cursor:pointer;transition:background-color .15s,color .15s}
button:hover{background:#34343c}button:active{transform:translateY(1px)}button:disabled{cursor:default;background:var(--cloud);color:var(--muted);border-color:var(--line);transform:none}
:focus-visible{outline:3px solid var(--focus);outline-offset:4px}
::selection{background:#d7e6f5;color:#070709}
.note,.footnote{font-size:14px;color:var(--muted);margin:10px 0 20px}.footnote{margin-top:24px}
.answer-row{display:grid;grid-template-columns:1fr auto;align-items:end;gap:14px}
#feedback{min-height:25px;margin:14px 0 0;font-weight:500}#feedback[data-state=error]{color:var(--error)}#feedback[data-state=correct]{color:var(--good)}
.help{padding:24px;background:var(--cloud);border-radius:14px}.actions{display:flex;gap:12px;flex-wrap:wrap}
.secondary{background:var(--page);color:var(--ink);border-color:var(--line)}.secondary:hover{background:var(--cloud)}
ol{padding-left:24px;margin:20px 0 0}ol:empty{display:none}li+li{margin-top:12px}#worked{margin:20px 0 0}#worked:empty{display:none}
.text-button{background:none;color:var(--ink);border:0;text-decoration:underline;text-underline-offset:4px;margin-top:18px;padding-left:0}.text-button:hover{background:var(--cloud)}
noscript{display:block;padding:16px;border:1px solid var(--error)}
@media(max-width:480px){header,main{padding-left:20px;padding-right:20px}h1{font-size:28px}.problem{grid-template-columns:1fr 1fr}.problem label:nth-child(2){grid-column:1/-1;grid-row:2}.answer-row{grid-template-columns:1fr}.answer-row button{width:100%}.help{padding:20px}.actions{display:grid}.privacy{margin-bottom:24px}}
@media(prefers-color-scheme:dark){:root{color-scheme:dark;--page:#151515;--ink:#fff;--muted:#bebecc;--cloud:#222228;--line:#8b8b98;--focus:#9abfda;--error:#ffb3b3;--good:#9ed6b3}button:hover{background:#d7d7df}button:disabled{background:var(--cloud)}.secondary:hover,.text-button:hover{background:#34343c}}
@media(prefers-reduced-motion:reduce){button{transition:none}button:active{transform:none}}

.practice-controls{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:end;margin-top:24px}
@media(max-width:480px){.practice-controls{grid-template-columns:1fr}.practice-controls button{width:100%}}
