:root{--fon:#f4f2ee;--list:#fff;--tekst:#1d1c1a;--seryy:#6b665e;--liniya:#dcd7ce;--akcent:#1f5c4a;--akcent-fon:#e6f0ec;--vnim:#9a4a00;--vnim-fon:#fdf1e2}
*{box-sizing:border-box}
body{margin:0;background:var(--fon);color:var(--tekst);font:15px/1.45 -apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
header{padding:14px 24px;background:var(--akcent);color:#fff;display:flex;gap:16px;align-items:baseline;flex-wrap:wrap}
header h1{margin:0;font-size:20px;font-weight:600}
header span{opacity:.85;font-size:13px}
main{max-width:420px;margin:40px auto;padding:0 12px}
.blok{background:var(--list);border:1px solid var(--liniya);border-radius:8px;padding:20px;margin-bottom:16px}
.blok h2{margin:0 0 10px;font-size:16px;font-weight:600}
label{display:block;font-size:13px;color:var(--seryy);margin:10px 0 3px}
input[type=text]{width:100%;padding:10px;border:1px solid var(--liniya);border-radius:6px;font:inherit;background:#fff;color:inherit}
input.kod{font-size:22px;letter-spacing:.3em;text-align:center;font-variant-numeric:tabular-nums}
input:focus{outline:2px solid var(--akcent);outline-offset:-1px}
.podskazka{font-size:12px;color:var(--seryy);margin-top:4px}
.podskazka.niz{padding:0 4px;line-height:1.6}
.gl-knopka{width:100%;margin-top:14px;padding:11px;border:0;border-radius:6px;background:var(--akcent);color:#fff;font:inherit;font-weight:600;cursor:pointer}
.gl-knopka:disabled{opacity:.55;cursor:default}
.vt-knopka{width:100%;margin-top:8px;padding:8px;border:1px solid var(--liniya);border-radius:6px;background:#fff;color:var(--seryy);font:inherit;font-size:13px;cursor:pointer}
.vnim{background:var(--vnim-fon);color:var(--vnim);border-radius:6px;padding:8px 10px;font-size:13px;margin-top:12px}
.soobshchenie{background:var(--akcent-fon);color:var(--akcent);border-radius:6px;padding:8px 10px;font-size:13px}
[hidden]{display:none!important}