/* ============================================================
   PULSE · Design System v3
   ============================================================ */
:root{
  --bg:#040908; --bg-2:#071110;
  --surface:rgba(255,255,255,.030); --surface-2:rgba(255,255,255,.055);
  --surface-solid:#0A1413;
  --stroke:rgba(126,255,204,.10); --stroke-2:rgba(126,255,204,.20);
  --acid:#00F5A0; --acid-2:#34FFC0; --acid-deep:#00B87A;
  --acid-glow:rgba(0,245,160,.28); --acid-soft:rgba(0,245,160,.10);
  --text:#E4F5EE; --text-2:#9DB3AC; --text-3:#5F7772;
  --danger:#FF5F6D; --danger-soft:rgba(255,95,109,.12);
  --warn:#FFC24B; --warn-soft:rgba(255,194,75,.12);
  --info:#56C7FF;
  --r-sm:8px; --r:14px; --r-lg:20px;
  --rail:250px;
  --ease:cubic-bezier(.22,1,.36,1);
}
*,*::before,*::after{box-sizing:border-box;}
html,body{height:100%;}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:'Inter',system-ui,sans-serif; font-size:14px; line-height:1.5;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
h1,h2,h3,h4{font-family:'Space Grotesk',sans-serif; margin:0; font-weight:600; letter-spacing:-.02em;}
::selection{background:var(--acid); color:#00120C;}
*::-webkit-scrollbar{width:9px;height:9px;}
*::-webkit-scrollbar-track{background:transparent;}
*::-webkit-scrollbar-thumb{background:rgba(126,255,204,.14); border-radius:20px; border:2px solid transparent; background-clip:padding-box;}
*::-webkit-scrollbar-thumb:hover{background:rgba(126,255,204,.3); background-clip:padding-box;}

/* ---------- ambiente ---------- */
.bg{position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden;}
.bg-grid{
  position:absolute; inset:-2px;
  background-image:linear-gradient(rgba(126,255,204,.055) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(126,255,204,.055) 1px,transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(ellipse 90% 70% at 22% 0%,#000 5%,transparent 72%);
  -webkit-mask-image:radial-gradient(ellipse 90% 70% at 22% 0%,#000 5%,transparent 72%);
}
.bg-orb{position:absolute; border-radius:50%; filter:blur(120px); transition:transform .6s var(--ease);}
.orb-1{width:620px;height:620px; top:-280px; left:-140px; background:radial-gradient(circle,#00F5A0 0%,transparent 68%); opacity:.2;}
.orb-2{width:520px;height:520px; bottom:-260px; right:-120px; background:radial-gradient(circle,#00A8FF 0%,transparent 68%); opacity:.1;}
.orb-3{width:420px;height:420px; top:36%; left:52%; background:radial-gradient(circle,#8AFF00 0%,transparent 70%); opacity:.06;}
.bg-noise{
  position:absolute; inset:0; opacity:.035; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.bg-scan{
  position:absolute; left:0; right:0; height:180px; top:-180px;
  background:linear-gradient(180deg,transparent,rgba(0,245,160,.05),transparent);
  animation:scan 9s linear infinite;
}
@keyframes scan{to{transform:translateY(calc(100vh + 360px));}}

/* ============================================================
   GATE
   ============================================================ */
.gate{
  position:fixed; inset:0; z-index:300; display:grid; place-items:center; overflow:hidden;
  background:radial-gradient(ellipse 90% 80% at 50% 42%,#0A1715 0%,#030807 62%,#010403 100%);
  transition:opacity .85s var(--ease), transform .85s var(--ease), filter .85s var(--ease);
}
.gate.out{opacity:0; transform:scale(1.14); filter:blur(18px); pointer-events:none;}
.gate.gone{display:none;}
.gate-grid{
  position:absolute; inset:-2px; opacity:.5;
  background-image:linear-gradient(rgba(0,245,160,.07) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(0,245,160,.07) 1px,transparent 1px);
  background-size:44px 44px;
  mask-image:radial-gradient(circle at 50% 45%,#000 0%,transparent 62%);
  -webkit-mask-image:radial-gradient(circle at 50% 45%,#000 0%,transparent 62%);
  animation:gridDrift 26s linear infinite;
}
@keyframes gridDrift{to{background-position:44px 44px,44px 44px;}}
.gate-glow{
  position:absolute; width:900px;height:900px; border-radius:50%; left:50%; top:44%;
  transform:translate(-50%,-50%);
  background:radial-gradient(circle,rgba(0,245,160,.16) 0%,transparent 62%);
  animation:breathe 7s ease-in-out infinite;
}
@keyframes breathe{0%,100%{transform:translate(-50%,-50%) scale(1);opacity:.85}50%{transform:translate(-50%,-50%) scale(1.14);opacity:1}}
.rings{position:absolute; left:50%; top:44%; pointer-events:none;}
.rings i{
  position:absolute; left:0; top:0; width:300px;height:300px; margin:-150px 0 0 -150px;
  border:1px solid rgba(0,245,160,.22); border-radius:50%;
  animation:ringOut 5s cubic-bezier(.25,.6,.3,1) infinite;
}
.rings i:nth-child(2){animation-delay:1.25s}
.rings i:nth-child(3){animation-delay:2.5s}
.rings i:nth-child(4){animation-delay:3.75s}
@keyframes ringOut{0%{transform:scale(.35);opacity:0}14%{opacity:.75}100%{transform:scale(3.4);opacity:0}}
.dust{position:absolute; inset:0; pointer-events:none;}
.dust b{position:absolute; width:3px;height:3px; border-radius:50%; background:var(--acid);
  opacity:0; box-shadow:0 0 8px var(--acid); animation:float linear infinite;}
@keyframes float{0%{transform:translateY(30px) scale(.5);opacity:0}12%{opacity:.65}85%{opacity:.4}100%{transform:translateY(-140px) scale(1);opacity:0}}
.gate-inner{position:relative; z-index:2; text-align:center; padding:30px; width:min(430px,100%);}
.gate-mark{
  width:96px;height:96px; margin:0 auto 26px; border-radius:28px; display:grid; place-items:center;
  position:relative; background:linear-gradient(150deg,rgba(0,245,160,.16),rgba(0,245,160,.02));
  border:1px solid rgba(0,245,160,.3);
  box-shadow:0 0 0 1px rgba(0,245,160,.08),0 24px 70px -24px var(--acid-glow),inset 0 1px 0 rgba(255,255,255,.14);
  animation:markIn 1s var(--ease) both, markFloat 6s ease-in-out 1s infinite;
}
@keyframes markIn{from{opacity:0; transform:translateY(24px) scale(.85) rotate(-8deg);}to{opacity:1;}}
@keyframes markFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.gate-mark::after{
  content:''; position:absolute; inset:-1px; border-radius:28px; padding:1px;
  background:conic-gradient(from 0deg,transparent 0deg,var(--acid) 55deg,transparent 130deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude; animation:spin 4.5s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg);}}
.ecg path{stroke-dasharray:120; stroke-dashoffset:120;
  animation:draw 1.6s var(--ease) .35s forwards, ecgGlow 2.6s 2s ease-in-out infinite;}
@keyframes draw{to{stroke-dashoffset:0;}}
@keyframes ecgGlow{0%,100%{filter:drop-shadow(0 0 3px var(--acid))}50%{filter:drop-shadow(0 0 12px var(--acid))}}
.gate-title{
  font-family:'Space Grotesk'; font-size:52px; font-weight:700; letter-spacing:.22em;
  line-height:1; margin:0 0 12px; padding-left:.22em; perspective:600px;
}
.gate-title span{
  display:inline-block; opacity:0; transform:translateY(30px) rotateX(-55deg);
  animation:letterIn .85s var(--ease) forwards;
  background:linear-gradient(180deg,#FFFFFF,#7CF7C4 70%,#00B87A);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
@keyframes letterIn{to{opacity:1; transform:none;}}
.gate-sub{
  font-family:'JetBrains Mono'; font-size:10.5px; letter-spacing:.32em; text-transform:uppercase;
  color:var(--text-3); margin:0 0 34px; opacity:0; animation:fadeUp .8s var(--ease) .75s forwards;
}
.gate-line{height:1px; width:0; margin:0 auto 30px;
  background:linear-gradient(90deg,transparent,var(--acid),transparent);
  animation:lineGrow 1.1s var(--ease) .6s forwards;}
@keyframes lineGrow{to{width:100%;}}
@keyframes fadeUp{from{opacity:0; transform:translateY(12px);}to{opacity:1; transform:none;}}
.gate-form{opacity:0; animation:fadeUp .8s var(--ease) 1s forwards;}
.gate-field{position:relative; margin-bottom:14px;}
.gate-field input{
  width:100%; padding:15px 17px 15px 46px; border-radius:14px;
  background:rgba(0,0,0,.4); border:1px solid var(--stroke); color:var(--text);
  font-family:'Inter'; font-size:14.5px; transition:.25s var(--ease);
}
.gate-field input::placeholder{color:var(--text-3);}
.gate-field input:focus{outline:none; border-color:var(--acid); background:rgba(0,0,0,.55); box-shadow:0 0 0 4px var(--acid-soft);}
.gate-field svg{position:absolute; left:17px; top:50%; transform:translateY(-50%); color:var(--text-3); transition:.25s;}
.gate-field input:focus + svg{color:var(--acid);}
.gate-quick{display:flex; gap:7px; justify-content:center; flex-wrap:wrap; margin-bottom:14px;}
.btn-enter{
  position:relative; overflow:hidden; width:100%; padding:16px; border:none; border-radius:14px;
  background:linear-gradient(135deg,var(--acid),var(--acid-deep)); color:#00140D; cursor:pointer;
  font-family:'Space Grotesk'; font-size:13.5px; font-weight:700; letter-spacing:.2em; text-transform:uppercase;
  box-shadow:0 14px 40px -14px var(--acid-glow); transition:.28s var(--ease);
}
.btn-enter:hover{transform:translateY(-2px); box-shadow:0 20px 52px -14px var(--acid-glow);}
.btn-enter:active{transform:translateY(0) scale(.985);}
.btn-enter span{position:relative; z-index:2; display:inline-flex; align-items:center; gap:10px;}
.btn-enter::before{
  content:''; position:absolute; inset:0; z-index:1;
  background:linear-gradient(110deg,transparent 25%,rgba(255,255,255,.55) 50%,transparent 75%);
  transform:translateX(-130%); animation:sweep 3.4s ease-in-out 1.8s infinite;
}
@keyframes sweep{0%{transform:translateX(-130%)}55%,100%{transform:translateX(130%)}}
.gate-boot{margin-top:26px; text-align:left; font-family:'JetBrains Mono'; font-size:10.5px;
  color:var(--text-3); min-height:62px; letter-spacing:.03em;}
.gate-boot div{opacity:0; animation:bootIn .45s var(--ease) forwards; display:flex; gap:8px;}
.gate-boot em{color:var(--acid); font-style:normal;}
.gate-boot em.bad{color:var(--danger);}
@keyframes bootIn{from{opacity:0; transform:translateX(-8px);}to{opacity:.85; transform:none;}}
.gate-foot{position:absolute; bottom:26px; left:0; right:0; text-align:center;
  font-family:'JetBrains Mono'; font-size:9px; letter-spacing:.24em; text-transform:uppercase;
  color:rgba(95,119,114,.55); opacity:0; animation:fadeUp 1s 1.6s forwards;}

/* ============================================================
   SHELL
   ============================================================ */
.shell{position:relative; z-index:1; display:flex; min-height:100vh;}
.rail{
  width:var(--rail); flex:0 0 var(--rail); padding:22px 16px;
  border-right:1px solid var(--stroke);
  background:linear-gradient(180deg,rgba(10,20,19,.72),rgba(4,9,8,.55));
  backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px);
  display:flex; flex-direction:column; gap:6px; position:sticky; top:0; height:100vh;
}
.brand{display:flex; align-items:center; gap:11px; padding:6px 8px 20px;}
.brand-mark{
  width:38px;height:38px;border-radius:12px; flex:0 0 38px;
  background:linear-gradient(145deg,var(--acid),var(--acid-deep));
  display:grid; place-items:center; color:#00160E; position:relative; overflow:hidden;
  box-shadow:0 0 0 1px rgba(0,245,160,.35),0 8px 28px -6px var(--acid-glow);
}
.brand-mark::after{content:''; position:absolute; inset:0; background:linear-gradient(140deg,rgba(255,255,255,.45),transparent 55%);}
.brand-mark svg{position:relative; z-index:1;}
.brand-txt strong{display:block; font-family:'Space Grotesk'; font-size:16px; font-weight:700; letter-spacing:.16em; line-height:1;}
.brand-txt span{font-family:'JetBrains Mono'; font-size:9px; letter-spacing:.22em; color:var(--text-3); text-transform:uppercase;}
.nav-label{font-family:'JetBrains Mono'; font-size:9px; letter-spacing:.2em; text-transform:uppercase; color:var(--text-3); padding:12px 10px 6px;}
.nav-item{
  display:flex; align-items:center; gap:11px; width:100%; padding:10px 12px; border-radius:var(--r-sm);
  border:1px solid transparent; background:transparent; color:var(--text-2); cursor:pointer;
  font-family:'Inter'; font-size:13.5px; font-weight:500; text-align:left; transition:.18s var(--ease); position:relative; overflow:hidden;
}
.nav-item svg{flex:0 0 17px; opacity:.75; transition:.18s;}
.nav-item:hover{background:var(--surface); color:var(--text);}
.nav-item:hover svg{opacity:1;}
.nav-item span{transition:transform .22s var(--ease);}
.nav-item:hover span{transform:translateX(3px);}
.nav-item.on{background:linear-gradient(90deg,var(--acid-soft),transparent 80%); border-color:var(--stroke-2); color:var(--acid-2);}
.nav-item.on svg{opacity:1; color:var(--acid);}
.nav-item.on::before{content:''; position:absolute; left:-16px; top:50%; transform:translateY(-50%);
  width:3px;height:20px; border-radius:0 3px 3px 0; background:var(--acid); box-shadow:0 0 14px var(--acid);}
.nav-badge{margin-left:auto; font-family:'JetBrains Mono'; font-size:10px; font-weight:700;
  background:var(--warn-soft); color:var(--warn); padding:2px 7px; border-radius:20px;}
.nav-badge.ok{background:var(--acid-soft); color:var(--acid);}
.rail-foot{margin-top:auto; padding-top:14px; border-top:1px solid var(--stroke); display:flex; flex-direction:column; gap:8px;}
.status{
  display:flex; align-items:center; gap:9px; padding:10px 12px; border:1px solid var(--stroke);
  border-radius:var(--r-sm); background:var(--surface); font-size:12px; color:var(--text-2);
  width:100%; cursor:pointer; transition:.18s; text-align:left;
}
.status:hover{border-color:var(--stroke-2); color:var(--text);}
.status b{font-family:'JetBrains Mono'; font-size:11px; letter-spacing:.05em; color:var(--text); display:block;}
.status small{display:block; font-size:10px; color:var(--text-3); letter-spacing:.04em;}
.led{width:7px;height:7px;border-radius:50%; flex:0 0 7px; position:relative; background:var(--text-3);}
.led::after{content:''; position:absolute; inset:-4px; border-radius:50%; background:inherit; opacity:.28; animation:pulse 2.2s ease-out infinite;}
@keyframes pulse{0%{transform:scale(.6);opacity:.5}100%{transform:scale(1.7);opacity:0}}
.led.on{background:var(--acid);}
.led.off{background:var(--warn);}
.led.bad{background:var(--danger);}

/* ---------- topbar ---------- */
.main{flex:1; min-width:0; display:flex; flex-direction:column;}
.topbar{
  position:sticky; top:0; z-index:20; display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  padding:16px 30px; border-bottom:1px solid var(--stroke);
  background:rgba(4,9,8,.72); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
}
.crumb{font-family:'JetBrains Mono'; font-size:10px; letter-spacing:.18em; text-transform:uppercase; color:var(--text-3);}
.topbar h2{font-size:19px; margin-top:2px;}
.topbar-actions{margin-left:auto; display:flex; gap:9px; align-items:center; flex-wrap:wrap;}
.view{padding:26px 30px 90px; max-width:1500px; width:100%;}
.view.swap{animation:viewIn .5s var(--ease) both;}
@keyframes viewIn{from{opacity:0; transform:translateY(14px) scale(.995); filter:blur(3px);}to{opacity:1; transform:none; filter:none;}}
.shell.boot{animation:powerOn 1s var(--ease) both;}
@keyframes powerOn{0%{opacity:0; transform:scale(.985); filter:blur(8px) brightness(1.7);}55%{filter:blur(0) brightness(1.15);}100%{opacity:1; transform:none; filter:none;}}
.flash{position:fixed; inset:0; z-index:290; pointer-events:none;
  background:radial-gradient(circle at 50% 45%,rgba(0,245,160,.5),transparent 62%); animation:flashOut .85s var(--ease) forwards;}
@keyframes flashOut{from{opacity:1;}to{opacity:0;}}

/* ---------- botoes ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:9px 15px;
  border-radius:10px; border:1px solid var(--stroke); background:var(--surface); color:var(--text);
  cursor:pointer; font-family:'Inter'; font-size:13px; font-weight:500; white-space:nowrap;
  transition:.18s var(--ease); position:relative; overflow:hidden;
}
.btn:hover{background:var(--surface-2); border-color:var(--stroke-2); transform:translateY(-1px);}
.btn:active{transform:translateY(0);}
.btn-primary{background:linear-gradient(135deg,var(--acid),var(--acid-deep)); color:#00140D; border-color:transparent; font-weight:600; box-shadow:0 6px 22px -8px var(--acid-glow);}
.btn-primary:hover{background:linear-gradient(135deg,var(--acid-2),var(--acid)); box-shadow:0 10px 30px -8px var(--acid-glow);}
.btn-danger{color:var(--danger); border-color:rgba(255,95,109,.24); background:var(--danger-soft);}
.btn-danger:hover{background:rgba(255,95,109,.2);}
.btn-sm{padding:6px 11px; font-size:12px; border-radius:8px;}
.btn-icon{padding:9px; border-radius:10px;}
.btn:disabled{opacity:.4; cursor:not-allowed; transform:none;}
.rip{position:absolute; border-radius:50%; transform:scale(0); pointer-events:none; background:rgba(255,255,255,.32); animation:rip .6s ease-out forwards;}
@keyframes rip{to{transform:scale(2.6); opacity:0;}}

/* ---------- cards ---------- */
.card{
  position:relative; border:1px solid var(--stroke); border-radius:var(--r-lg);
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012));
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); padding:20px; overflow:hidden;
  --mx:50%; --my:50%;
}
.card::before{content:''; position:absolute; inset:0 0 auto; height:1px;
  background:linear-gradient(90deg,transparent,rgba(126,255,204,.35),transparent); animation:lineSlide 5s ease-in-out infinite;}
@keyframes lineSlide{0%,100%{opacity:.4}50%{opacity:1}}
.card::after{content:''; position:absolute; inset:0; pointer-events:none; opacity:0; transition:opacity .35s; border-radius:inherit;
  background:radial-gradient(320px circle at var(--mx) var(--my),rgba(0,245,160,.09),transparent 60%);}
.card:hover::after{opacity:1;}
.card > *{position:relative; z-index:1;}
.card-head{display:flex; align-items:center; gap:10px; margin-bottom:16px; flex-wrap:wrap;}
.card-head h3{font-size:15px;}
.card-head .btn{margin-left:auto;}
.card-sub{font-size:12px; color:var(--text-3); margin-top:2px;}
.split{display:grid; grid-template-columns:1.55fr 1fr; gap:16px; align-items:start;}
.stack{display:flex; flex-direction:column; gap:16px;}
.sep{height:1px; background:var(--stroke); margin:18px 0;}
.mono{font-family:'JetBrains Mono';}
.dim{color:var(--text-3);}

/* ---------- kpi ---------- */
.kpi-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:14px; margin-bottom:18px;}
.kpi{
  position:relative; border:1px solid var(--stroke); border-radius:var(--r);
  background:linear-gradient(160deg,rgba(255,255,255,.04),rgba(255,255,255,.01));
  padding:16px 18px; overflow:hidden; transition:.25s var(--ease); --mx:50%; --my:50%;
}
.kpi::after{content:''; position:absolute; inset:0; pointer-events:none; opacity:0; transition:opacity .35s;
  background:radial-gradient(300px circle at var(--mx) var(--my),rgba(0,245,160,.1),transparent 60%);}
.kpi:hover{border-color:var(--stroke-2); transform:translateY(-2px);}
.kpi:hover::after{opacity:1;}
.kpi > *{position:relative; z-index:1;}
.kpi-top{display:flex; align-items:center; gap:8px; margin-bottom:10px;}
.kpi-ico{width:28px;height:28px;border-radius:9px; display:grid; place-items:center; background:var(--acid-soft); color:var(--acid); flex:0 0 28px;}
.kpi-label{font-family:'JetBrains Mono'; font-size:9.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--text-3);}
.kpi-value{font-family:'Space Grotesk'; font-size:34px; font-weight:700; line-height:1; letter-spacing:-.03em; font-variant-numeric:tabular-nums; transition:color .3s;}
.kpi:hover .kpi-value{text-shadow:0 0 24px currentColor;}
.kpi-foot{margin-top:8px; font-size:11.5px; color:var(--text-3); display:flex; align-items:center; gap:6px; flex-wrap:wrap;}
.kpi.accent .kpi-value{color:var(--acid);}
.kpi.warn .kpi-ico{background:var(--warn-soft); color:var(--warn);} .kpi.warn .kpi-value{color:var(--warn);}
.kpi.danger .kpi-ico{background:var(--danger-soft); color:var(--danger);} .kpi.danger .kpi-value{color:var(--danger);}
.kpi.info .kpi-ico{background:rgba(86,199,255,.12); color:var(--info);} .kpi.info .kpi-value{color:var(--info);}
.kpi-spark{position:absolute; right:0; bottom:0; left:0; height:38px; opacity:.5; pointer-events:none; z-index:0;}

/* ---------- cards de tipo ---------- */
.band-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(258px,1fr)); gap:14px;}
.band{
  position:relative; border:1px solid var(--stroke); border-radius:var(--r);
  background:linear-gradient(165deg,rgba(255,255,255,.045),rgba(255,255,255,.012));
  padding:16px; overflow:hidden; transition:.25s var(--ease); cursor:pointer; --mx:50%; --my:50%;
}
.band:hover{transform:translateY(-3px); border-color:var(--band); box-shadow:0 18px 40px -22px var(--band);}
.band::after{content:''; position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg,var(--band),transparent 85%);}
.band .glow{position:absolute; inset:0; pointer-events:none; opacity:0; border-radius:inherit; transition:opacity .35s;
  background:radial-gradient(260px circle at var(--mx) var(--my),var(--band),transparent 62%);}
.band:hover .glow{opacity:.14;}
.band > *:not(.glow){position:relative; z-index:1;}
.band-head{display:flex; align-items:flex-start; gap:12px; margin-bottom:14px;}
.band-title{flex:1; min-width:0;}
.band-title h4{font-family:'Space Grotesk'; font-size:14.5px; font-weight:600; display:flex; align-items:center; gap:8px;}
.band-title .sku{font-family:'JetBrains Mono'; font-size:9.5px; letter-spacing:.14em; color:var(--text-3); text-transform:uppercase; margin-top:3px;}
.chip-dot{width:9px;height:9px;border-radius:3px; flex:0 0 9px; background:var(--band); box-shadow:0 0 10px var(--band);}
.band-main{display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin-bottom:12px;}
.band-stock{font-family:'Space Grotesk'; font-size:30px; font-weight:700; line-height:1; letter-spacing:-.03em; font-variant-numeric:tabular-nums;}
.band-stock small{font-size:11px; font-weight:500; color:var(--text-3); margin-left:5px; font-family:'Inter';}
.mini{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--stroke); border-radius:10px; overflow:hidden; border:1px solid var(--stroke);}
.mini div{background:var(--surface-solid); padding:8px 9px;}
.mini span{display:block; font-family:'JetBrains Mono'; font-size:8.5px; letter-spacing:.1em; color:var(--text-3); text-transform:uppercase;}
.mini b{font-family:'JetBrains Mono'; font-size:14px; font-weight:500; font-variant-numeric:tabular-nums;}
.mini b.bad{color:var(--danger);} .mini b.warm{color:var(--warn);} .mini b.good{color:var(--acid);}
.bar{height:4px; border-radius:4px; background:rgba(255,255,255,.06); overflow:hidden; margin-top:12px;}
.bar i{display:block; height:100%; border-radius:4px; background:var(--band,var(--acid)); transition:width .8s var(--ease); position:relative; overflow:hidden;}
.bar i::after{content:''; position:absolute; inset:0; background:linear-gradient(90deg,transparent,rgba(255,255,255,.6),transparent);
  transform:translateX(-100%); animation:barShine 2.8s ease-in-out infinite;}
@keyframes barShine{0%{transform:translateX(-100%)}60%,100%{transform:translateX(220%)}}
.bar.low i{background:var(--danger);}

/* ---------- PDV ---------- */
.pdv-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:16px;}
.pdv{
  position:relative; border:1px solid var(--stroke); border-radius:var(--r-lg); overflow:hidden;
  background:linear-gradient(168deg,rgba(255,255,255,.05),rgba(255,255,255,.012));
  padding:18px; transition:.28s var(--ease); --mx:50%; --my:50%; cursor:pointer;
}
.pdv::before{content:''; position:absolute; inset:0 0 auto; height:2px; background:linear-gradient(90deg,var(--pc),transparent 80%);}
.pdv::after{content:''; position:absolute; inset:0; opacity:0; transition:opacity .35s; pointer-events:none;
  background:radial-gradient(300px circle at var(--mx) var(--my),var(--pc),transparent 62%);}
.pdv:hover{transform:translateY(-3px); border-color:var(--pc); box-shadow:0 22px 50px -26px var(--pc);}
.pdv:hover::after{opacity:.1;}
.pdv > *{position:relative; z-index:1;}
.pdv.hit{animation:hit 1.1s var(--ease);}
@keyframes hit{
  0%{box-shadow:0 0 0 0 var(--pc); border-color:var(--pc);}
  30%{box-shadow:0 0 0 12px transparent; transform:scale(1.015);}
  100%{box-shadow:0 0 0 0 transparent;}
}
.pdv-head{display:flex; align-items:center; gap:12px; margin-bottom:16px;}
.pdv-av{
  width:44px;height:44px;border-radius:14px; flex:0 0 44px; display:grid; place-items:center;
  font-family:'Space Grotesk'; font-weight:700; font-size:17px; color:#00140D;
  background:linear-gradient(140deg,var(--pc),color-mix(in srgb,var(--pc) 55%,#000));
  box-shadow:0 8px 22px -8px var(--pc);
}
.pdv-name{flex:1; min-width:0;}
.pdv-name h4{font-size:16px;}
.pdv-name .s{font-family:'JetBrains Mono'; font-size:9.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--text-3); margin-top:2px;}
.pdv-total{text-align:right;}
.pdv-total b{display:block; font-family:'Space Grotesk'; font-size:26px; font-weight:700; line-height:1; font-variant-numeric:tabular-nums;}
.pdv-total span{font-family:'JetBrains Mono'; font-size:8.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--text-3);}
.pdv-lines{display:flex; flex-direction:column; gap:6px; margin-bottom:14px;}
.pdv-line{display:flex; align-items:center; gap:9px; font-size:12.5px;}
.pdv-line .nm{flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text-2);}
.pdv-line .qt{font-family:'JetBrains Mono'; font-size:13px; font-variant-numeric:tabular-nums; min-width:34px; text-align:right;}
.pdv-line .qt.zero{color:var(--danger);}
.pdv-line .qt.low{color:var(--warn);}
.pdv-line .tr{width:54px; height:3px; border-radius:3px; background:rgba(255,255,255,.07); overflow:hidden;}
.pdv-line .tr i{display:block; height:100%; background:var(--c); border-radius:3px; transition:width .7s var(--ease);}
.pdv-acts{display:flex; gap:7px;}
.pdv-acts .btn{flex:1;}
.pdv-new{
  border:1px dashed var(--stroke-2); background:rgba(0,245,160,.02); display:grid; place-items:center;
  min-height:190px; border-radius:var(--r-lg); cursor:pointer; transition:.25s var(--ease); color:var(--text-3);
}
.pdv-new:hover{background:var(--acid-soft); color:var(--acid); border-color:var(--acid); transform:translateY(-3px);}
.pdv-new div{text-align:center; font-size:13px;}
.pdv-new svg{margin-bottom:8px;}

/* ---------- pills, rows, tabela ---------- */
.pill{display:inline-flex; align-items:center; gap:6px; padding:3px 9px; border-radius:20px;
  font-family:'JetBrains Mono'; font-size:10px; letter-spacing:.05em; white-space:nowrap; border:1px solid transparent;}
.pill.ok{background:var(--acid-soft); color:var(--acid); border-color:rgba(0,245,160,.22);}
.pill.pend{background:var(--warn-soft); color:var(--warn); border-color:rgba(255,194,75,.22);}
.pill.bad{background:var(--danger-soft); color:var(--danger); border-color:rgba(255,95,109,.22);}
.pill.mute{background:var(--surface); color:var(--text-3); border-color:var(--stroke);}
.pill.info{background:rgba(86,199,255,.1); color:var(--info); border-color:rgba(86,199,255,.22);}
.row{display:flex; align-items:center; gap:14px; padding:12px 14px; border:1px solid var(--stroke);
  border-radius:var(--r); background:var(--surface); margin-bottom:8px; transition:.2s var(--ease);}
.row:hover{border-color:var(--stroke-2); background:var(--surface-2);}
.row-main{flex:1; min-width:0;}
.row-main .t{font-size:13.5px; font-weight:500; display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
.row-main .s{font-size:11.5px; color:var(--text-3); margin-top:3px;}
.row .qty{font-family:'Space Grotesk'; font-size:20px; font-weight:700; font-variant-numeric:tabular-nums;}
.row.novo{animation:rowIn .6s var(--ease);}
@keyframes rowIn{from{opacity:0; transform:translateX(-14px); background:var(--acid-soft);}to{opacity:1; transform:none;}}
.table-wrap{overflow-x:auto; margin:0 -20px; padding:0 20px;}
table{width:100%; border-collapse:collapse; font-size:13px; min-width:680px;}
th{text-align:left; padding:9px 12px; font-family:'JetBrains Mono'; font-weight:400; font-size:9.5px;
  letter-spacing:.14em; text-transform:uppercase; color:var(--text-3); border-bottom:1px solid var(--stroke); white-space:nowrap;}
td{padding:11px 12px; border-bottom:1px solid rgba(126,255,204,.06); vertical-align:middle;}
tbody tr{transition:.15s;} tbody tr:hover{background:var(--surface);}
tr:last-child td{border-bottom:none;}
td.num{font-family:'JetBrains Mono'; font-variant-numeric:tabular-nums;}
td.ts{font-family:'JetBrains Mono'; font-size:11.5px; color:var(--text-3); white-space:nowrap;}

/* ---------- forms ---------- */
.field{margin-bottom:15px;}
.field > label{display:block; font-family:'JetBrains Mono'; font-size:9.5px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--text-3); margin-bottom:7px;}
.input,select.input,textarea.input{
  width:100%; padding:11px 13px; border-radius:10px; border:1px solid var(--stroke);
  background:rgba(0,0,0,.28); color:var(--text); font-family:'Inter'; font-size:14px; transition:.18s; appearance:none;
}
select.input{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%235F7772' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 13px center; padding-right:34px;
}
.input::placeholder{color:var(--text-3);}
.input:focus{outline:none; border-color:var(--acid); box-shadow:0 0 0 3px var(--acid-soft); background:rgba(0,0,0,.4);}
.input.mono{font-family:'JetBrains Mono'; font-size:14px;}
.grid2{display:grid; grid-template-columns:1fr 1fr; gap:12px;}
.hint{font-size:11.5px; color:var(--text-3); margin-top:6px; line-height:1.5;}
.stepper{display:flex; align-items:center; gap:8px;}
.stepper .input{text-align:center; font-family:'Space Grotesk'; font-size:20px; font-weight:700; padding:9px;}
.stepper button{width:38px;height:42px;flex:0 0 38px; border-radius:10px; border:1px solid var(--stroke);
  background:var(--surface); color:var(--text); font-size:18px; cursor:pointer; transition:.15s;}
.stepper button:hover{background:var(--acid-soft); color:var(--acid); border-color:var(--stroke-2);}
.chips{display:flex; gap:7px; flex-wrap:wrap; margin-top:9px;}
.chip{padding:5px 11px; border-radius:20px; border:1px solid var(--stroke); background:var(--surface);
  font-family:'JetBrains Mono'; font-size:11px; color:var(--text-2); cursor:pointer; transition:.15s; position:relative; overflow:hidden;}
.chip:hover{border-color:var(--acid); color:var(--acid); background:var(--acid-soft);}
.chip.on{background:var(--acid); color:#00140D; border-color:var(--acid); font-weight:700;}
.swatches{display:flex; gap:8px; flex-wrap:wrap;}
.swatch{width:30px;height:30px;border-radius:9px; cursor:pointer; border:2px solid transparent; transition:.15s;}
.swatch:hover{transform:scale(1.12);}
.swatch.on{border-color:var(--text); box-shadow:0 0 0 3px rgba(255,255,255,.08);}
.seg{display:inline-flex; padding:3px; gap:3px; border:1px solid var(--stroke); border-radius:11px; background:rgba(0,0,0,.28);}
.seg button{padding:6px 13px; border-radius:8px; border:none; background:transparent; color:var(--text-3);
  font-family:'Inter'; font-size:12.5px; font-weight:500; cursor:pointer; transition:.18s;}
.seg button:hover{color:var(--text);}
.seg button.on{background:var(--acid-soft); color:var(--acid);}

/* linhas de transferencia */
.tline{display:flex; align-items:center; gap:10px; padding:9px 11px; border:1px solid var(--stroke);
  border-radius:12px; background:var(--surface); margin-bottom:8px; transition:.2s;}
.tline.ativa{border-color:var(--acid); background:var(--acid-soft);}
.tline .nm{flex:1; min-width:0;}
.tline .nm b{font-size:13px; font-weight:500; display:block;}
.tline .nm small{font-family:'JetBrains Mono'; font-size:10px; color:var(--text-3);}
.tline input{width:74px; text-align:center; padding:8px; border-radius:9px; border:1px solid var(--stroke);
  background:rgba(0,0,0,.3); color:var(--text); font-family:'Space Grotesk'; font-size:16px; font-weight:700;}
.tline input:focus{outline:none; border-color:var(--acid);}

/* ---------- drawer / modal / toasts ---------- */
.scrim{position:fixed; inset:0; z-index:90; background:rgba(2,6,5,.72); backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px); opacity:0; pointer-events:none; transition:opacity .3s var(--ease);}
.scrim.open{opacity:1; pointer-events:auto;}
.drawer{position:fixed; top:0; right:0; bottom:0; z-index:100; width:min(470px,100%);
  background:linear-gradient(180deg,#0A1413,#050B0A); border-left:1px solid var(--stroke-2);
  box-shadow:-30px 0 80px -30px rgba(0,0,0,.9); transform:translateX(102%);
  transition:transform .38s var(--ease); display:flex; flex-direction:column;}
.drawer.open{transform:none;}
.drawer-head{padding:20px 22px 16px; border-bottom:1px solid var(--stroke); display:flex; align-items:flex-start; gap:12px;}
.drawer-head h3{font-size:17px;}
.drawer-body{padding:20px 22px; overflow-y:auto; flex:1;}
.drawer-foot{padding:16px 22px; border-top:1px solid var(--stroke); display:flex; gap:9px; background:rgba(0,0,0,.24);}
.drawer-foot .btn{flex:1;}
.modal{position:fixed; z-index:110; inset:0; display:grid; place-items:center; padding:20px; opacity:0; pointer-events:none; transition:.25s var(--ease);}
.modal.open{opacity:1; pointer-events:auto;}
.modal-box{width:min(400px,100%); border:1px solid var(--stroke-2); border-radius:var(--r-lg);
  background:linear-gradient(180deg,#0C1716,#060D0C); padding:24px; transform:scale(.94);
  transition:.25s var(--ease); box-shadow:0 40px 90px -30px rgba(0,0,0,.9);}
.modal.open .modal-box{transform:none;}
.toasts{position:fixed; bottom:22px; left:50%; transform:translateX(-50%); z-index:200; display:flex;
  flex-direction:column; gap:8px; align-items:center; pointer-events:none;}
.toast{display:flex; align-items:center; gap:10px; padding:11px 17px; border-radius:12px;
  border:1px solid var(--stroke-2); background:rgba(10,20,19,.94); backdrop-filter:blur(18px);
  font-size:13px; font-weight:500; box-shadow:0 18px 45px -18px rgba(0,0,0,.9);
  transform:translateY(14px) scale(.96); opacity:0; transition:.3s var(--ease); max-width:min(420px,92vw);}
.toast.show{transform:none; opacity:1;}
.toast .led{animation:none;}
.toast.err{border-color:rgba(255,95,109,.3);}
.toast.warn{border-color:rgba(255,194,75,.3);}
.toast.venda{border-color:rgba(0,245,160,.4); box-shadow:0 0 40px -12px var(--acid-glow);}

.empty{padding:34px 20px; text-align:center; color:var(--text-3); font-size:13px;
  border:1px dashed var(--stroke); border-radius:var(--r); background:rgba(0,0,0,.15);}
.empty svg{opacity:.35; margin-bottom:10px;}
.empty b{display:block; color:var(--text-2); font-family:'Space Grotesk'; font-size:14px; margin-bottom:4px;}
.op-chip{display:flex; align-items:center; gap:9px; padding:6px 12px 6px 7px; border-radius:22px;
  border:1px solid var(--stroke); background:var(--surface); font-size:12.5px; cursor:pointer;}
.op-av{width:26px;height:26px;border-radius:50%; flex:0 0 26px; display:grid; place-items:center;
  background:linear-gradient(135deg,var(--acid),var(--acid-deep)); color:#00140D;
  font-family:'Space Grotesk'; font-weight:700; font-size:11px;}
.codebox{display:flex; align-items:center; gap:8px; padding:10px 12px; border-radius:10px;
  border:1px solid var(--stroke); background:rgba(0,0,0,.34); font-family:'JetBrains Mono';
  font-size:11.5px; word-break:break-all; color:var(--acid-2); line-height:1.6;}
.logline{display:flex; gap:9px; padding:6px 0; font-family:'JetBrains Mono'; font-size:11px; border-bottom:1px solid rgba(126,255,204,.05);}
.logline time{color:var(--text-3); flex:0 0 60px;}
.logline.erro{color:var(--danger);} .logline.warn{color:var(--warn);}
.zig-scraper-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:17px 0 13px;}
.zig-scraper-grid>div{padding:11px 10px;border:1px solid var(--stroke);border-radius:10px;background:rgba(0,0,0,.18);min-width:0;}
.zig-scraper-grid b{display:block;font-family:'Space Grotesk';font-size:20px;color:var(--text);line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.zig-scraper-grid span{display:block;margin-top:4px;color:var(--text-3);font-family:'JetBrains Mono';font-size:8.5px;line-height:1.3;}
.zig-scraper-error{margin-top:12px;padding:9px 11px;border:1px solid rgba(255,95,109,.28);border-radius:9px;background:var(--danger-soft);color:var(--danger);font-size:11px;}
.zig-login-fields{margin-top:16px;margin-bottom:4px;}

.fadein{animation:fadein .45s var(--ease) both;}
@keyframes fadein{from{opacity:0; transform:translateY(9px);}to{opacity:1; transform:none;}}
.stagger > *{animation:fadein .5s var(--ease) both;}
.stagger > *:nth-child(1){animation-delay:.02s} .stagger > *:nth-child(2){animation-delay:.06s}
.stagger > *:nth-child(3){animation-delay:.10s} .stagger > *:nth-child(4){animation-delay:.14s}
.stagger > *:nth-child(5){animation-delay:.18s} .stagger > *:nth-child(6){animation-delay:.22s}
.stagger > *:nth-child(7){animation-delay:.26s} .stagger > *:nth-child(8){animation-delay:.30s}

.mobilebar{display:none;}
@media (max-width:1180px){ .split{grid-template-columns:1fr;} }
@media (max-width:860px){
  .rail{display:none;}
  .topbar{padding:14px 18px;}
  .view{padding:18px 18px 110px;}
  .mobilebar{display:flex; position:fixed; bottom:0; left:0; right:0; z-index:60;
    padding:9px 10px calc(9px + env(safe-area-inset-bottom)); border-top:1px solid var(--stroke);
    background:rgba(6,13,12,.92); backdrop-filter:blur(20px); justify-content:space-around;}
  .mobilebar button{background:none; border:none; color:var(--text-3); display:flex; flex-direction:column;
    align-items:center; gap:3px; font-size:9.5px; font-family:'JetBrains Mono'; letter-spacing:.06em;
    cursor:pointer; padding:5px 8px; border-radius:9px; transition:.15s;}
  .mobilebar button.on{color:var(--acid); background:var(--acid-soft);}
  .grid2{grid-template-columns:1fr;}
  .kpi-value{font-size:28px;}
  .zig-scraper-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:560px){ .gate-title{font-size:40px;} }
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important;}
}

/* ============================================================
   LOGIN SPLIT - controles a esquerda, acesso a direita
   ============================================================ */
.gate-inner.gate-layout{
  width:min(1180px,calc(100vw - 72px)); max-width:none; max-height:calc(100vh - 44px);
  padding:22px 0 34px; text-align:left; display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(360px,.72fr); gap:clamp(38px,7vw,108px);
  align-items:center; overflow-y:auto;
}
.gate-showcase{min-width:0; padding:10px 0;}
.gate-brandline{display:flex; align-items:center; gap:16px; margin-bottom:clamp(48px,8vh,88px);}
.gate-brandline .gate-mark{margin:0; flex:0 0 78px; width:78px; height:78px; border-radius:23px;}
.gate-brandline .gate-mark::after{border-radius:23px;}
.gate-brandline .gate-title{font-size:43px; text-align:left; letter-spacing:.18em; margin:0; padding:0; line-height:.9;}
.gate-brandline .gate-title span{animation-delay:.15s !important;}
.gate-brandline .gate-sub{margin:8px 0 0; text-align:left; opacity:1; animation:none; font-size:9px; letter-spacing:.25em;}
.gate-hero{margin-bottom:26px;}
.gate-kicker{display:flex; align-items:center; gap:9px; color:var(--acid); font-family:'JetBrains Mono'; font-size:10px; letter-spacing:.18em; text-transform:uppercase; margin-bottom:14px;}
.gate-kicker span{width:7px; height:7px; border-radius:50%; background:var(--acid); box-shadow:0 0 14px var(--acid);}
.gate-hero h2{font-size:clamp(38px,5.1vw,68px); line-height:.98; letter-spacing:-.055em; font-weight:600;}
.gate-hero h2 em{font-style:normal; color:var(--acid); text-shadow:0 0 36px var(--acid-glow);}
.gate-hero p{max-width:430px; margin:20px 0 0; color:var(--text-2); font-size:14px;}
.gate-preview{max-width:570px; padding:19px 20px 16px; border:1px solid var(--stroke-2); border-radius:18px;
  background:linear-gradient(145deg,rgba(16,33,29,.86),rgba(5,13,12,.72)); box-shadow:0 24px 70px -36px rgba(0,245,160,.28),inset 0 1px 0 rgba(255,255,255,.06);}
.preview-head{display:flex; justify-content:space-between; align-items:flex-start; gap:12px; padding-bottom:15px; border-bottom:1px solid var(--stroke);}
.preview-head b{display:block; margin-top:4px; font-family:'Space Grotesk'; font-size:15px; font-weight:600;}
.preview-eyebrow{display:block; font-family:'JetBrains Mono'; font-size:8.5px; letter-spacing:.18em; color:var(--text-3);}
.preview-live{display:flex; align-items:center; gap:6px; padding:5px 8px; border-radius:20px; background:var(--acid-soft); color:var(--acid); font-family:'JetBrains Mono'; font-size:9px; white-space:nowrap;}
.preview-live i{width:6px; height:6px; border-radius:50%; background:var(--acid); box-shadow:0 0 8px var(--acid); animation:breathe 2.4s ease-in-out infinite;}
.preview-total{display:flex; align-items:baseline; gap:10px; padding:17px 0 12px;}
.preview-total strong{font-family:'Space Grotesk'; font-size:38px; line-height:1; color:var(--text);}
.preview-total span{color:var(--text-3); font-size:11px;}
.preview-list{display:flex; flex-direction:column; gap:3px;}
.preview-row{display:flex; align-items:center; gap:10px; min-height:31px; font-size:12px; color:var(--text-2);}
.preview-row>i{width:7px; height:7px; flex:0 0 7px; border-radius:50%; background:var(--c); box-shadow:0 0 10px var(--c);}
.preview-row span{flex:1; min-width:0;}
.preview-row b{font-family:'JetBrains Mono'; font-size:9.5px; font-weight:400; color:var(--text-3); text-transform:uppercase; letter-spacing:.06em;}
.preview-row em{font-style:normal; color:var(--acid); font-size:10px;}
.preview-actions{display:flex; gap:7px; flex-wrap:wrap; margin-top:14px; padding-top:14px; border-top:1px solid rgba(126,255,204,.06);}
.preview-actions span{padding:6px 9px; border:1px solid var(--stroke); border-radius:8px; color:var(--text-3); font-family:'JetBrains Mono'; font-size:9px;}
.gate-points{display:flex; gap:18px; flex-wrap:wrap; margin-top:17px; color:var(--text-3); font-family:'JetBrains Mono'; font-size:9px; letter-spacing:.02em;}
.gate-points i{font-style:normal; color:var(--acid); margin-right:5px;}
.gate-login-panel{width:100%; padding:29px 30px 25px; border:1px solid var(--stroke-2); border-radius:22px;
  background:linear-gradient(170deg,rgba(13,27,25,.9),rgba(4,10,9,.88)); box-shadow:0 30px 90px -30px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.07);}
.gate-login-top{display:flex; align-items:center; gap:8px; color:var(--text-3); font-family:'JetBrains Mono'; font-size:9px; letter-spacing:.16em;}
.login-dot{width:7px; height:7px; border-radius:50%; background:var(--acid); box-shadow:0 0 12px var(--acid);}
.login-lock{margin-left:auto; color:var(--text-3); font-size:15px;}
.gate-login-head{margin:48px 0 26px;}
.gate-login-kicker{font-family:'JetBrains Mono'; font-size:9px; letter-spacing:.18em; color:var(--acid); text-transform:uppercase; margin-bottom:10px;}
.gate-login-head h2{font-size:30px; letter-spacing:-.04em;}
.gate-login-head p{margin:8px 0 0; color:var(--text-3); font-size:12.5px;}
.gate-login-panel .gate-form{opacity:1; animation:none; text-align:left;}
.gate-login-panel .gate-field{display:block; margin-bottom:16px;}
.gate-login-panel .gate-field>span{display:block; margin:0 0 7px; color:var(--text-3); font-family:'JetBrains Mono'; font-size:9px; letter-spacing:.16em; text-transform:uppercase;}
.gate-login-panel .gate-field input{padding:14px 17px 14px 45px; background:rgba(0,0,0,.24);}
.gate-login-panel .btn-enter{margin-top:4px;}
.gate-error{min-height:20px; padding-top:11px; color:var(--danger); font-size:12px;}
.gate-login-panel .gate-boot{min-height:56px; margin-top:4px; padding-top:12px; border-top:1px solid rgba(126,255,204,.07);}
.gate-login-panel .gate-boot div{font-size:9.5px;}
.gate-login-foot{display:flex; gap:8px; margin-top:18px; color:var(--text-3); font-family:'JetBrains Mono'; font-size:9px; letter-spacing:.05em;}
.status-logout{margin-top:2px; color:var(--text-3);}
.status-logout:hover{color:var(--danger); border-color:rgba(255,95,109,.3); background:var(--danger-soft);}
.logout-icon{font-size:17px; line-height:1; color:currentColor;}
@media (max-width:900px){
  .gate-inner.gate-layout{width:min(620px,calc(100vw - 40px)); grid-template-columns:1fr; gap:26px; padding:26px 0 48px; align-items:start;}
  .gate-showcase{padding-top:0;}
  .gate-brandline{margin-bottom:32px;}
  .gate-hero h2{font-size:48px;}
  .gate-preview{max-width:none;}
  .gate-points{margin-bottom:3px;}
  .gate-login-panel{max-width:500px; justify-self:center;}
  .gate-foot{display:none;}
}
@media (max-width:560px){
  .gate-inner.gate-layout{width:calc(100vw - 28px); max-height:100vh; padding:22px 0 28px;}
  .gate-brandline .gate-mark{width:62px; height:62px; flex-basis:62px; border-radius:18px;}
  .gate-brandline .gate-mark::after{border-radius:18px;}
  .gate-brandline .gate-title{font-size:34px;}
  .gate-hero h2{font-size:42px;}
  .gate-hero p{font-size:13px;}
  .gate-preview{padding:16px;}
  .preview-actions span{font-size:8px;}
  .gate-login-panel{padding:23px 20px 20px;}
  .gate-login-head{margin:34px 0 22px;}
}