@font-face{font-family:Manrope;src:url('/assets/fonts/manrope-400.woff') format('woff');font-weight:400;font-display:swap}
@font-face{font-family:Manrope;src:url('/assets/fonts/manrope-700.woff') format('woff');font-weight:700;font-display:swap}
:root{color-scheme:dark;--bg:#050a18;--surface:#0c1630;--text:#f7faff;--muted:#91a1bd;--blue:#3977ff;--green:#39e79b}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 80% 0,rgba(57,119,255,.13),transparent 52%),var(--bg);color:var(--text);font-family:Manrope,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button,input,a{-webkit-tap-highlight-color:transparent}
button,input{font:inherit}
button,a{touch-action:manipulation}
a{color:inherit;text-decoration:none}
button{cursor:pointer}
button:disabled{opacity:.5;cursor:default}
button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #21d7ff;outline-offset:4px}
.header{max-width:1200px;margin:auto;padding:26px 32px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff0d}
.brand{font-size:23px;font-weight:700;letter-spacing:-1px;display:flex;gap:15px;align-items:center}
.brand span{font-size:12px;color:var(--muted);letter-spacing:0;font-weight:400}
.brand img{width:38px;height:38px;object-fit:contain}
.home{font-size:13px;color:var(--muted)}
main{max-width:1140px;margin:auto;padding:60px 28px 90px}
.auth{max-width:500px;margin:10px auto;text-align:center;animation:enter .45s ease both}
.eyebrow{font-size:11px;color:#829dcd;letter-spacing:2.5px;font-weight:700}
h1{font-size:clamp(32px,4.2vw,52px);line-height:1.14;letter-spacing:-2px;margin:20px 0}
h1 span{color:var(--muted)}
.intro{color:var(--muted);font-size:14px;line-height:1.8;max-width:420px;margin:0 auto 28px}
.card{border:1px solid #ffffff19;border-radius:28px;background:linear-gradient(140deg,#132443,#0c1630 65%);box-shadow:0 30px 80px #0005,0 1px 0 #ffffff0d inset}
.auth-card{padding:30px;text-align:left}
label{display:block;margin-bottom:12px;font-size:13px;font-weight:700}
input{display:block;width:100%;min-width:0;background:#050d20;border:1px solid #ffffff24;color:var(--text);border-radius:14px;padding:17px 16px;margin-bottom:16px}
input::placeholder{color:#667894}
.primary,.secondary{display:inline-flex;align-items:center;justify-content:center;border-radius:14px;min-height:50px;padding:14px 22px;font-weight:700;font-size:14px;transition:transform .2s,background .2s}
.primary{background:var(--blue);color:white;border:1px solid #6092ff;box-shadow:0 8px 28px #1555f526}
.primary:hover{background:#4a83ff;transform:translateY(-1px)}
.auth-card .primary{width:100%}
.secondary{background:#ffffff08;color:var(--text);border:1px solid #ffffff25}
.secondary:hover{background:#ffffff12}
.hint{color:var(--muted);font-size:12px;line-height:1.8}
.auth-card .hint{margin:15px 0 0}
.message{font-size:13px;line-height:1.6;color:#a4c3ff;overflow-wrap:anywhere}
.message:empty{display:none}
.error{color:#ff8a9d}
.code{font-size:28px;letter-spacing:9px;text-align:center;margin-top:18px}
.form-links{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:15px}
.text-button{border:0;background:none;padding:10px 0;color:#a9bde0;font-size:12px}
.trial{margin:28px auto 0;border-top:1px solid #ffffff12;padding:24px}
.trial>span{display:block;color:var(--muted);font-size:10px;letter-spacing:2px;margin-bottom:10px}
.trial strong{font-size:24px;letter-spacing:-.5px}
.trial p{font-size:12px;color:var(--muted);line-height:1.7}
.dashboard{animation:enter .45s ease both}
.heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:30px}
.heading h1{margin-bottom:0}
.subscription{padding:34px;position:relative;overflow:hidden;box-shadow:0 40px 100px #0007,0 0 65px #3977ff0c}
.profile{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-bottom:28px;border-bottom:1px solid #ffffff14}
.profile .hint{margin:0 0 8px;font-size:10px;letter-spacing:2px}
h2{margin:0;font-size:clamp(17px,2.6vw,25px);letter-spacing:-.7px;overflow-wrap:anywhere}
.identifier{color:#7588aa;font-size:11px;overflow-wrap:anywhere;line-height:1.6}
.status{flex-shrink:0;font-size:11px;padding:10px 14px;border:1px solid #ffffff25;border-radius:100px;color:#b8c7df}
.status.active{color:#70f0b9;border-color:#39e79b33;background:#39e79b0c}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:28px 0}
.stat{padding:25px 20px;background:#050a183d;border:1px solid #ffffff0d;border-radius:19px}
.stat>span,.stat small{display:block;color:var(--muted);font-size:12px;line-height:1.6}
.stat strong{display:block;font-size:clamp(25px,3.2vw,40px);letter-spacing:-1px;margin:12px 0}
.stat small{font-size:11px}
.actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.subscription>.hint{margin-top:22px}
.footer-note{display:flex;gap:9px;align-items:center;justify-content:center;color:#7588aa;font-size:11px;margin-top:24px}
.dot{width:5px;height:5px;background:#3977ff;border-radius:50%;flex-shrink:0}
.spinner{width:30px;height:30px;border:2px solid #ffffff15;border-top-color:var(--blue);border-radius:50%;margin:50px auto 20px;animation:spin 1s linear infinite}
@keyframes enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:650px){.header{padding:20px}.brand span{display:none}main{padding:38px 18px 60px}h1{letter-spacing:-1.3px}.auth-card{padding:23px}.heading{align-items:flex-start}.heading>.secondary{padding:10px 14px;min-height:40px}.subscription{padding:22px;border-radius:23px}.profile{align-items:flex-start;flex-direction:column;gap:10px}.stats{grid-template-columns:1fr;gap:10px;margin:22px 0}.stat{padding:18px}.stat strong{font-size:30px;margin:7px 0}.actions>.primary,.actions>.secondary{width:100%}.footer-note{font-size:10px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* TORVPN STATUS SIZE V2 */
#status{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  min-height:38px;
  padding:9px 16px;
  font-size:14px;
  font-weight:700;
  line-height:1.3;
  border-radius:12px;
}


