:root{color-scheme:dark;--bg:#080a0b;--panel:#101416;--line:#2b343a;--text:#ecf0f2;--muted:#96a3ac;--accent:#fb7185;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-synthesis:none;background:var(--bg);color:var(--text)}
*{box-sizing:border-box}body{margin:0;min-width:280px;-webkit-font-smoothing:antialiased;background:radial-gradient(ellipse 550px 350px at 50% 28%,#fb718507,transparent 75%),var(--bg)}a{color:inherit;text-decoration:none}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{cursor:pointer}svg{display:block;width:18px;height:18px;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}[hidden]{display:none!important}
.login-layout{width:min(100%,460px);padding:52px 20px 26px;margin:auto;min-height:100svh;display:flex;flex-direction:column;justify-content:center;align-items:center}.brand{display:inline-flex;align-items:center;gap:12px;font-size:32px;line-height:1;font-weight:750;letter-spacing:-1.3px}.accent{color:var(--accent)}.brand-mark{color:var(--accent);width:39px;height:39px;background:#fb718508;border:1px solid #fb718522;display:grid;place-items:center;border-radius:7px}.brand-mark svg{height:26px;width:26px;stroke-width:1.9}.brand-note{font-size:11px;color:#78858e;letter-spacing:.15px;margin:14px 0 30px}
.login-card{width:100%;border:1px solid var(--line);border-radius:9px;background:linear-gradient(145deg,#151a1d,#0d1113);padding:22px;box-shadow:0 24px 70px #00000030;position:relative;overflow:hidden}.login-card::before{content:"";position:absolute;top:0;left:22px;height:2px;width:35px;background:var(--accent)}.tabs{display:flex;gap:4px;background:#080c0e;border:1px solid #232b30;border-radius:5px;padding:4px;margin-bottom:28px}.tabs button{display:flex;align-items:center;justify-content:center;gap:7px;min-height:39px;padding:10px 8px;border:1px solid transparent;border-radius:3px;background:transparent;color:#89969f;font-size:10px;font-weight:600;flex:1;white-space:nowrap}.tabs button:last-child{flex:1.3}.tabs button svg{width:14px;height:14px}.tabs button[aria-selected="true"]{background:#e8edef;color:#101416;border-color:#f1f4f5;box-shadow:0 2px 8px #00000020}.eyebrow{font:8px ui-monospace,"SFMono-Regular",Consolas,monospace;letter-spacing:1.5px;color:#8c9aa4}h1,h2{font-size:24px;line-height:1.3;font-weight:650;letter-spacing:-.8px;margin:12px 0 10px}.description{font-size:12px;line-height:1.85;color:var(--muted);margin:0 0 24px;max-width:340px}label{display:block;font-size:10px;color:#bac5cc;margin-bottom:9px;font-weight:500}.code-input-wrap{position:relative}input{color:var(--text);border:1px solid #344049;border-radius:4px;background:#090e11;width:100%;min-width:0;padding:13px;font:12px ui-monospace,"SFMono-Regular",Consolas,monospace;letter-spacing:1px;line-height:1.5}#account-code{padding-right:46px}input::placeholder{color:#586773;letter-spacing:1.1px;font-size:11px}input:focus-visible{outline-offset:2px}.toggle-code{position:absolute;right:2px;top:2px;bottom:2px;width:42px;display:grid;place-items:center;border:0;background:transparent;color:#7f909c}.toggle-code:hover{color:var(--text)}.toggle-code svg{width:16px;height:16px}.primary-button{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;min-height:47px;padding:13px 15px;margin-top:20px;border:1px solid #e8edef;border-radius:4px;background:#e8edef;color:#101416;font:600 11px ui-monospace,"SFMono-Regular",Consolas,monospace;text-align:left;transition:background .15s,border-color .15s}.primary-button:hover{background:#f5f7f8;border-color:var(--accent)}.primary-button:disabled{color:#71808b;border-color:#2e3a43;background:#1a2228;cursor:wait}.form-error{font-size:11px;line-height:1.7;color:#f093a2;margin:10px 0 0}.form-error:empty{display:none}.connection-status{font-size:10px;line-height:1.7;color:#84949f;margin:14px 0 0}.connection-status:empty{display:none}.code-explanation{display:flex;gap:12px;background:#090f12;border:1px solid #27333b;border-radius:4px;padding:14px;margin:5px 0 21px}.code-explanation svg{flex-shrink:0;width:16px;height:16px;color:#bbc7ce;margin-top:2px}.code-explanation p{font-size:11px;line-height:1.8;color:#95a4ae;margin:0}.generated-code{font-size:17px;color:#ffc2cb;letter-spacing:.8px;padding:15px 11px;background:#fb718508;border-color:#fb718535;text-align:center}.copy-button{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;padding:11px;border:1px solid #344049;border-radius:4px;background:#11191e;color:#c0ccd4;font-size:10px;min-height:41px;margin-top:9px}.copy-button svg{height:13px;width:13px}.copy-button:hover{border-color:#647580}.save-note{font-size:11px;line-height:1.8;color:#9eabb4;margin:15px 0 0}.copy-status{font-size:10px;line-height:1.7;color:#59c9a4;margin:7px 0 0}.copy-status:empty{display:none}.telegram-note{display:flex;align-items:flex-start;gap:10px;border-top:1px solid #263139;padding-top:18px;margin-top:24px}.telegram-note>svg{width:15px;height:15px;color:#fb7185;flex-shrink:0;margin-top:3px}.telegram-note p{font-size:10px;line-height:1.85;color:#7f909c;margin:0}.telegram-note a{color:#c9d2d9}.telegram-note strong{color:#c9d2d9;font-weight:500;font-family:ui-monospace,Consolas,monospace}.page-footer{display:flex;gap:9px;align-items:center;justify-content:center;font:8px ui-monospace,"SFMono-Regular",Consolas,monospace;color:#5e6c76;margin:24px 0 0}.skip-link{position:fixed;top:-70px;left:20px;background:#e8edef;color:#101416;padding:12px;z-index:2}.skip-link:focus{top:15px}
@media(max-width:380px){.login-layout{padding:32px 15px 23px}.login-card{padding:19px}.generated-code{font-size:14px;letter-spacing:.5px}.tabs button{font-size:9px;gap:5px;padding:10px 6px}h1,h2{font-size:22px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
