:root{
  --bg:#060608; --panel:#0a0b11; --panel2:#0f1119;
  --border:#23262f; --border2:#2b2f3a; --row:#1b1e27;
  --txt:#c4c8ce; --txt2:#878d96; --txt3:#565c65; --white:#e9ebef;
  --accent:#25d07f; --green:#22c07c; --red:#f2606c; --yellow:#e6b93d;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; background:var(--bg); color:var(--txt);
  font-family:'Inter',system-ui,-apple-system,sans-serif; font-size:13px;
  -webkit-font-smoothing:antialiased; font-variant-numeric:tabular-nums;
  display:flex; align-items:center; justify-content:center; padding:24px;
}

.bg-glow,.bg-particles,.aurora-bg,.aurora-orb{display:none}
.bg-grid{
  position:fixed; inset:0; pointer-events:none; z-index:0; opacity:.5;
  background-image:linear-gradient(#0e1117 1px,transparent 1px),
                   linear-gradient(90deg,#0e1117 1px,transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(ellipse 80% 60% at 50% 40%,#000 40%,transparent 100%);
}

.card,.reg-container{
  position:relative; z-index:1; width:min(1080px,100%);
  background:var(--panel); border:1px solid var(--border); border-radius:10px;
  box-shadow:0 30px 80px rgba(0,0,0,.55); overflow:hidden;
}
.card{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,420px)}
.corner,.corner-tl,.corner-br{display:none}

.panel-left{padding:44px 44px 40px; border-right:1px solid var(--border); background:#080a0e; min-width:0}
.panel-right,.reg-card{padding:44px 40px 40px; background:var(--panel); min-width:0}
.reg-container{max-width:460px}

.tt-logo,.brand-mark{display:flex; align-items:center; gap:11px; margin-bottom:30px}
.tt-logo-t,.brand-mark-t{font-size:25px; font-weight:800; color:#fff; line-height:1; letter-spacing:.02em}
.tt-logo-bar,.brand-mark-sep{width:2px; height:21px; background:#4fe6a6; border-radius:2px}
.tt-logo-word,.brand-mark-word{
  font-size:16px; font-weight:600; letter-spacing:.34em; color:#fff; text-transform:uppercase;
}

.badge{
  display:inline-flex; align-items:center; gap:7px; padding:4px 10px; margin-bottom:22px;
  border:1px solid #1e3a2c; border-radius:5px; background:#0d1a14;
  color:var(--accent); font-size:9px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
}
.badge-dot{width:5px; height:5px; border-radius:50%; background:var(--accent); box-shadow:0 0 6px var(--accent)}

.left-title{
  margin:0 0 14px; font-size:32px; line-height:1.16; font-weight:700;
  color:var(--white); letter-spacing:-.02em;
}
.left-title span{color:var(--accent)}
.left-sub{margin:0 0 30px; color:var(--txt2); font-size:12.5px; line-height:1.65; max-width:44ch}
.brand-sub{color:var(--txt2); font-size:12px; line-height:1.6; margin:0 0 24px}

.metrics{display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-bottom:28px}
.metric{background:var(--panel2); border:1px solid var(--border); border-radius:7px; padding:13px 14px}
.metric-val{font-size:20px; font-weight:700; color:var(--white); line-height:1.1; letter-spacing:-.01em}
.metric-val .acc,.acc{color:var(--accent)}
.metric-lbl{
  margin-top:4px; color:var(--txt3); font-size:8.5px; font-weight:700;
  letter-spacing:.13em; text-transform:uppercase;
}

.features{display:grid; gap:11px}
.feature{display:flex; align-items:center; gap:11px; color:var(--txt2); font-size:11.5px}
.feat-icon{
  width:24px; height:24px; flex:none; display:flex; align-items:center; justify-content:center;
  border:1px solid #1e3a2c; border-radius:6px; background:#0d1a14; color:var(--accent);
}
.feat-icon svg{width:12px; height:12px}

.form-eyebrow{
  color:var(--accent); font-size:9px; font-weight:700; letter-spacing:.16em;
  text-transform:uppercase; margin-bottom:9px;
}
.form-title,.reg-title{
  margin:0 0 6px; font-size:23px; font-weight:700; color:var(--white); letter-spacing:-.015em;
}
.form-sub{margin:0 0 26px; color:var(--txt2); font-size:12px}
.form-sub a,.reg-footer a,.forgot{color:var(--accent); text-decoration:none; font-weight:600}
.form-sub a:hover,.reg-footer a:hover,.forgot:hover{text-decoration:underline}

.fgroup,.form-group{margin-bottom:16px}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.flabel,.form-label{
  display:block; margin-bottom:6px; color:var(--txt3);
  font-size:9px; font-weight:700; letter-spacing:.13em; text-transform:uppercase;
}
.finput,.form-input{
  width:100%; background:#0f1017; border:1px solid var(--border2); border-radius:7px;
  color:var(--txt); font-family:inherit; font-size:12.5px; padding:11px 13px;
  transition:border-color .14s, background .14s;
}
.finput::placeholder,.form-input::placeholder{color:#41464f}
.finput:focus,.form-input:focus{outline:none; border-color:#2f6f52; background:#111319}
.finput:-webkit-autofill{-webkit-text-fill-color:var(--txt); -webkit-box-shadow:0 0 0 40px #0f1017 inset}

.pw-wrap{position:relative}
.pw-btn{
  position:absolute; right:9px; top:50%; transform:translateY(-50%);
  background:none; border:none; color:var(--txt3); cursor:pointer; padding:5px;
  display:flex; align-items:center;
}
.pw-btn:hover{color:var(--txt)}

.form-opts{display:flex; align-items:center; justify-content:space-between; gap:12px; margin:4px 0 20px}
.remember,.reg-checkbox{
  display:flex; align-items:center; gap:8px; color:var(--txt2); font-size:11.5px; cursor:pointer;
}
.remember input,.reg-checkbox input{
  appearance:none; width:15px; height:15px; flex:none; border:1px solid var(--border2);
  border-radius:4px; background:#0f1017; cursor:pointer; position:relative;
}
.remember input:checked,.reg-checkbox input:checked{background:var(--accent); border-color:var(--accent)}
.remember input:checked::after,.reg-checkbox input:checked::after{
  content:'✓'; position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  color:#04120c; font-size:10px; font-weight:800;
}
.reg-checkbox__text{color:var(--txt2); font-size:11px; line-height:1.5}
.forgot{font-size:11.5px}

.submit,.reg-btn{
  width:100%; border:none; border-radius:8px; cursor:pointer;
  background:linear-gradient(135deg,#25d07f,#1fae6a); color:#04120c;
  font-family:inherit; font-size:12.5px; font-weight:800; letter-spacing:.06em;
  padding:13px 16px; transition:filter .14s, transform .06s;
}
.submit:hover,.reg-btn:hover{filter:brightness(1.07)}
.submit:active,.reg-btn:active{transform:translateY(1px)}
.submit:disabled,.reg-btn:disabled{opacity:.6; cursor:wait; filter:none}
.submit-inner{display:flex; align-items:center; justify-content:center; gap:9px}

.divider{
  display:flex; align-items:center; gap:12px; margin:18px 0;
  color:var(--txt3); font-size:9px; font-weight:700; letter-spacing:.14em;
}
.divider::before,.divider::after{content:''; flex:1; height:1px; background:var(--border)}

.reg-btn.secondary,.card .reg-btn{
  background:transparent; border:1px solid var(--border2); color:var(--txt);
  font-weight:700; letter-spacing:.04em;
}
.reg-btn.secondary:hover,.card .reg-btn:hover{border-color:var(--accent); color:var(--accent); filter:none}

.spinner{
  width:14px; height:14px; border:2px solid rgba(4,18,12,.3); border-top-color:#04120c;
  border-radius:50%; animation:spin .7s linear infinite; display:none;
}

@keyframes spin{to{transform:rotate(360deg)}}

.err-inline,.reg-error{
  background:#1e1215; border:1px solid #6f2f38; border-radius:7px; color:var(--red);
  font-size:11.5px; padding:10px 12px; margin-bottom:16px; line-height:1.5;
}
.secure{
  display:flex; align-items:center; justify-content:center; gap:7px; margin-top:20px;
  color:var(--txt3); font-size:10px;
}
.secure svg{width:12px; height:12px}
.reg-footer{margin-top:22px; text-align:center; color:var(--txt2); font-size:11.5px}

.toast{
  position:fixed; top:18px; right:18px; z-index:80; min-width:260px; max-width:min(380px,calc(100vw - 36px));
  background:var(--panel2); border:1px solid #6f2f38; border-radius:9px; padding:13px 15px;
  box-shadow:0 18px 44px rgba(0,0,0,.6);
  transform:translateX(120%); opacity:0; pointer-events:none;
  transition:transform .35s cubic-bezier(.34,1.4,.64,1), opacity .3s ease;
}
.toast.show{transform:translateX(0); opacity:1; pointer-events:auto}
.toast-hd{display:flex; align-items:center; gap:9px}

.toast-ico{width:18px; height:18px; flex:none; color:var(--red)}
.toast-title{color:var(--white); font-size:12px; font-weight:700; flex:1}
.toast-x{background:none; border:none; color:var(--txt3); cursor:pointer; font-size:15px; line-height:1; padding:0 2px}
.toast-x:hover{color:var(--white)}
.toast-msg{color:var(--txt2); font-size:11.5px; margin-top:5px; line-height:1.5}

.success-ov{
  position:fixed; inset:0; z-index:70; background:rgba(6,6,8,.92); backdrop-filter:blur(4px);
  display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden; transition:opacity .3s ease, visibility .3s ease;
}
.success-ov.show{opacity:1; visibility:visible}
.success-cnt{text-align:center; opacity:0; transition:opacity .35s ease .1s}
.success-ov.show .success-cnt{opacity:1}
.success-ring{
  width:46px; height:46px; margin:0 auto 16px; border:2px solid var(--border2);
  border-top-color:var(--accent); border-radius:50%; animation:spin .8s linear infinite;
}
.success-spin{animation:spin .8s linear infinite}
.success-t{color:var(--white); font-size:15px; font-weight:700; margin-bottom:5px}
.success-m{color:var(--txt2); font-size:11.5px}

@media (max-width:900px){
  body{padding:0; align-items:stretch}
  .card,.reg-container{width:100%; min-height:100vh; border:none; border-radius:0; box-shadow:none}
  .card{grid-template-columns:minmax(0,1fr)}
  .panel-left{display:none}
  .panel-right,.reg-card{padding:34px 22px; display:flex; flex-direction:column; justify-content:center; min-height:100vh}
  .bg-grid{opacity:.3}
}
@media (max-width:420px){
  .form-title,.reg-title{font-size:20px}
  .form-row{grid-template-columns:minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce){
  .spinner,.success-ring,.success-spin{animation:none}
}

.lvhead{display:flex; align-items:center; gap:8px; margin:30px 0 12px}
.lvdot{width:6px; height:6px; border-radius:50%; background:var(--accent);
       box-shadow:0 0 0 3px rgba(0,255,178,.14); flex:none; animation:lvpulse 2.4s ease-in-out infinite}
@keyframes lvpulse{0%,100%{opacity:1} 50%{opacity:.45}}
@media (prefers-reduced-motion:reduce){.lvdot{animation:none}}
.lvlbl{font:700 9px/1 var(--font-m,monospace); letter-spacing:.18em; color:var(--txt2)}
.lvnote{margin-left:auto; font:500 9px/1 var(--font-m,monospace); letter-spacing:.06em; color:var(--txt4)}

.lvstrip{display:flex; flex-direction:column; border:1px solid var(--border);
         border-radius:10px; overflow:hidden; background:rgba(255,255,255,.015)}
.lvrow{display:grid; grid-template-columns:minmax(0,1fr) auto 62px; align-items:baseline; gap:12px;
       padding:10px 13px; border-bottom:1px solid var(--border)}
.lvrow:last-child{border-bottom:0}
.lvsym{font:500 11.5px/1.3 var(--font-b,sans-serif); color:var(--text-3,#8b93a7);
       overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.lvpx{font:600 12.5px/1.3 var(--font-m,monospace); color:var(--text-1,#fff);
      font-variant-numeric:tabular-nums}
.lvch{font:600 11px/1.3 var(--font-m,monospace); text-align:right; color:var(--text-4,#5a6070);
      font-variant-numeric:tabular-nums}
.lvch.up{color:var(--accent)}
.lvch.down{color:var(--red,#ef4444)}

.lvrow.skel .lvsym,.lvrow.skel .lvpx,.lvrow.skel .lvch{
  background:linear-gradient(90deg,rgba(255,255,255,.045),rgba(255,255,255,.09),rgba(255,255,255,.045));
  background-size:200% 100%; animation:lvshim 1.3s linear infinite; border-radius:3px; color:transparent}
.lvrow.skel .lvsym{width:64px} .lvrow.skel .lvpx{width:58px} .lvrow.skel .lvch{width:40px}
@keyframes lvshim{0%{background-position:200% 0} 100%{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){.lvrow.skel .lvsym,.lvrow.skel .lvpx,.lvrow.skel .lvch{animation:none}}

.lvtrust{display:flex; flex-wrap:wrap; gap:7px; margin:16px 0 0; padding:0; list-style:none}
.lvtrust li{padding:4px 9px; border-radius:5px; border:1px solid var(--border);
            font:500 10px/1.4 var(--font-b,sans-serif); color:var(--txt3,#565c65)}

@media (max-width:900px){
  .lvhead{margin-top:22px}
  .lvrow{padding:9px 11px}
}

.reg-brand{display:flex; flex-direction:column; gap:9px; margin-bottom:26px}
.reg-brand .brand-sub{color:var(--txt2); font-size:12px; letter-spacing:.01em}

.form-group--terms{margin:18px 0 20px}
.reg-checkbox{display:flex; align-items:flex-start; gap:10px; cursor:pointer; user-select:none}
.reg-checkbox input{position:absolute; opacity:0; width:0; height:0}
.reg-checkbox__box{
  flex:none; width:17px; height:17px; margin-top:1px; border-radius:5px;
  border:1px solid var(--border2); background:var(--panel2);
  display:flex; align-items:center; justify-content:center;
  transition:border-color .15s ease, background .15s ease;
}
.reg-checkbox__box::after{
  content:''; width:9px; height:5px; margin-top:-2px;
  border-left:2px solid #04120c; border-bottom:2px solid #04120c;
  transform:rotate(-45deg) scale(.6); opacity:0; transition:opacity .12s ease, transform .12s ease;
}
.reg-checkbox input:checked + .reg-checkbox__box{background:var(--accent); border-color:var(--accent)}
.reg-checkbox input:checked + .reg-checkbox__box::after{opacity:1; transform:rotate(-45deg) scale(1)}
.reg-checkbox input:focus-visible + .reg-checkbox__box{outline:2px solid var(--accent); outline-offset:2px}
.reg-checkbox__text{color:var(--txt2); font-size:11.5px; line-height:1.6}

.reg-checkbox__text a{color:var(--accent); text-decoration:none; font-weight:600}
.reg-checkbox__text a:hover{text-decoration:underline}

body:has(.reg-container){display:flex; align-items:center; justify-content:center; padding:32px 16px}

.reg-container{
  width:100%; max-width:440px; padding:0;
  background:none; border:none; border-radius:0; box-shadow:none; overflow:visible;
  min-height:0;
}

.reg-brand{display:block; text-align:center; margin:0 0 22px}
.reg-brand .brand-mark{display:inline-flex; justify-content:center; margin:0 0 9px}
.reg-brand .brand-sub{margin:0; font-size:12px; color:var(--txt2)}

.reg-card{
  display:block; min-height:0; justify-content:flex-start;
  background:var(--panel); border:1px solid var(--border); border-radius:12px;
  padding:28px 26px 26px; box-shadow:0 24px 60px rgba(0,0,0,.45);
}
.reg-title{margin:0 0 18px; text-align:center; font-size:19px}

@media (max-width:520px){
  body:has(.reg-container){padding:20px 12px}
  .reg-card{padding:22px 18px 20px}
  .reg-title{font-size:17px; margin-bottom:14px}
}

.reg-container{margin-left:auto; margin-right:auto}
