:root{color-scheme:dark;font:16px system-ui,sans-serif;background:#101724;color:#fff2ba;font-synthesis:none}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;background:linear-gradient(135deg,#182344 0%,#101724 50%,#3f191c 100%)}
main{max-width:1280px;min-height:100vh;margin:auto;padding:65px 6vw 75px;display:grid;grid-template-columns:1.2fr 1fr;gap:80px;align-items:center}
main>*{min-width:0}
h1{font:800 clamp(62px,7.4vw,108px)/.9 Impact,monospace;text-transform:uppercase;margin:0 0 16px;text-shadow:5px 5px #a02c2a}
h1 em{font-style:normal;color:#efb841}
.lede{color:#c9cbd5;font-size:15px;line-height:1.8}
.panel{background:#eee1b9;border:3px solid #171b26;box-shadow:7px 7px #0008;padding:35px;color:#171b26;font-family:monospace}
.number{display:block;background:#233f80;color:#fff1bc;padding:12px;margin:-35px -35px 25px;border-bottom:3px solid #171b26;font-size:10px;letter-spacing:1.7px;font-weight:900}
label{display:block;font-size:11px;margin:19px 0 9px;color:#3d403e}
input{width:100%;min-width:0;background:#fff8dc;color:#171b26;border:2px solid #303747;border-radius:0;padding:14px;font:13px monospace}
input::placeholder{color:#687267}
button{cursor:pointer;min-height:44px;width:100%;padding:16px 18px;margin-top:26px;background:#b82c29;color:#fff2be;border:2px solid #171b26;box-shadow:3px 3px #171b26;border-radius:0;font:700 12px monospace;text-align:left;overflow-wrap:anywhere}
button:hover{background:#d33c31}
button:disabled{opacity:.5;cursor:wait}
button,input,a{touch-action:manipulation}
button:focus-visible,input:focus-visible,a:focus-visible{outline:2px solid #233f80;outline-offset:4px}
.text-button{width:auto;background:transparent;color:#233f80;padding:10px 14px}
.text-button:hover{background:#ded0a7}
.status{color:#982522;margin:15px 0 0;font-size:12px;line-height:1.7;overflow-wrap:anywhere}
.status:empty,[hidden]{display:none!important}
#phone-consent{font-size:12px;line-height:1.7;color:#3d403e}
a{color:#233f80}
#phone-code{font-size:26px;letter-spacing:6px}
#phone-back,#phone-resend,#phone-verify{display:inline-flex;width:auto;min-height:44px;padding:4px 0;margin:14px 18px 0 0;background:none;border:0;box-shadow:none;color:#233f80;font-size:12px}
#phone-code-form:not([hidden])~#login-status{color:#3d403e}
@media(max-width:800px){
  main{grid-template-columns:1fr;gap:28px;padding:28px 5vw 40px;align-items:start}
  h1{font-size:clamp(38px,9vw,62px);line-height:1;text-shadow:3px 3px #a02c2a}
  .lede{font-size:14px;margin-bottom:0}
  .panel{padding:24px}
  .number{margin:-24px -24px 24px;line-height:1.6}
  input{font-size:16px;min-height:46px}
}
@media(max-width:360px){h1{font-size:36px}}
