/* ============ Mail Tester — "deliverability control room" ============ */
:root{
  --bg:#06080d; --bg-2:#0a0e17;
  --panel:rgba(150,185,255,.045); --panel-2:rgba(150,185,255,.08);
  --line:rgba(150,185,255,.13); --line-2:rgba(150,185,255,.22);
  --text:#dde6f6; --dim:#8a98b8; --faint:#586483;
  --cyan:#3df0e0; --violet:#9d7bff;
  --ok:#37e08c; --warn:#ffc24b; --bad:#ff6b81; --info:#6b7a9c;
  --mono:'JetBrains Mono',ui-monospace,monospace;
  --display:'Chakra Petch',sans-serif;
  --body:'Sora',system-ui,sans-serif;
  --glow:0 0 0 1px var(--line), 0 18px 50px -20px rgba(0,0,0,.8);
}
*{margin:0;padding:0;box-sizing:border-box}
/* never allow horizontal page scroll (iOS Safari backstop; clip where supported) */
html,body{max-width:100%;overflow-x:hidden}
html{overflow-x:clip}
html{-webkit-text-size-adjust:100%}
body{
  font-family:var(--body); color:var(--text); min-height:100vh;
  background:
    radial-gradient(1000px 560px at 50% -12%, rgba(61,240,224,.10), transparent 60%),
    radial-gradient(760px 520px at 92% -6%, rgba(157,123,255,.09), transparent 55%),
    var(--bg);
  background-attachment:fixed;
}
.grid-bg{position:fixed;inset:0;z-index:0;pointer-events:none;
  background-image:linear-gradient(rgba(150,185,255,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(150,185,255,.05) 1px,transparent 1px);
  background-size:46px 46px;
  -webkit-mask:radial-gradient(120% 80% at 50% 0%,#000,transparent 72%);
          mask:radial-gradient(120% 80% at 50% 0%,#000,transparent 72%)}
.shell{position:relative;z-index:1;max-width:980px;margin:0 auto;padding:26px 20px 70px}
a{color:inherit}

/* ---- top bar ---- */
.topbar{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:10px;padding:14px 24px;border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,rgba(10,14,23,.7),transparent);backdrop-filter:blur(6px)}
.brand{font-family:var(--display);font-weight:700;font-size:17px;letter-spacing:3px;text-decoration:none;
  color:var(--text);display:flex;align-items:center;gap:9px}
.brand-mark{color:var(--cyan);text-shadow:0 0 14px rgba(61,240,224,.8);font-size:19px}
.brand-dim{color:var(--cyan)}
.topbar nav{display:flex;align-items:center;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.topbar nav a{font-family:var(--mono);font-size:12.5px;letter-spacing:.5px;color:var(--dim);
  text-decoration:none;padding:7px 13px;border:1px solid transparent;border-radius:8px;transition:.18s}
.topbar nav a:hover{color:var(--text);border-color:var(--line);background:var(--panel)}

/* ---- landing scanner ---- */
.scanner{max-width:660px;margin:8vh auto 0;text-align:center;animation:rise .6s ease both}
.scanner-eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:4px;color:var(--cyan);
  text-transform:uppercase;margin-bottom:18px;opacity:.9}
.scanner h1{font-family:var(--display);font-weight:600;font-size:clamp(30px,5.2vw,50px);line-height:1.06;
  letter-spacing:.5px;background:linear-gradient(180deg,#fff,#9fb2d8);-webkit-background-clip:text;
  background-clip:text;color:transparent}
.scanner .sub{color:var(--dim);font-size:16px;margin-top:14px}
.pill{display:flex;align-items:center;gap:10px;max-width:560px;margin:30px auto 0;
  background:var(--panel-2);border:1px solid var(--line-2);border-radius:14px;padding:6px 6px 6px 16px;
  box-shadow:0 0 0 1px rgba(61,240,224,.06), 0 22px 60px -28px rgba(61,240,224,.4)}
.pill-tag{font-family:var(--mono);font-size:11px;letter-spacing:1px;color:var(--cyan);
  border:1px solid rgba(61,240,224,.4);border-radius:6px;padding:3px 7px}
.pill input{flex:1;background:transparent;border:0;color:var(--text);font-family:var(--mono);
  font-size:clamp(13px,2.2vw,16px);letter-spacing:.3px;padding:12px 4px}
.pill input:focus{outline:none}
.pill button,.copy-mini{background:var(--panel-2);border:1px solid var(--line);color:var(--dim);
  border-radius:10px;padding:11px 14px;cursor:pointer;font-size:15px;transition:.18s}
.pill button:hover,.copy-mini:hover{color:var(--cyan);border-color:var(--line-2);box-shadow:0 0 16px -4px rgba(61,240,224,.5)}
.cta{display:inline-block;margin-top:18px;font-family:var(--display);font-weight:600;letter-spacing:1px;
  font-size:16px;text-decoration:none;color:#04121a;padding:14px 28px;border-radius:12px;
  background:linear-gradient(120deg,var(--cyan),var(--violet));
  box-shadow:0 14px 40px -12px rgba(61,240,224,.6);transition:.2s}
.cta:hover{transform:translateY(-1px);box-shadow:0 18px 46px -10px rgba(157,123,255,.7)}
.waiting{margin-top:30px;font-family:var(--mono);font-size:13.5px;color:var(--dim);letter-spacing:.4px}
.spinner{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--cyan);
  box-shadow:0 0 12px var(--cyan);animation:pulse 1.3s ease-in-out infinite;vertical-align:1px;margin-right:7px}
@keyframes pulse{0%,100%{opacity:.35;transform:scale(.8)}50%{opacity:1;transform:scale(1.15)}}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* ---- result header: gauge + meta ---- */
.result-head{display:flex;gap:30px;align-items:center;flex-wrap:wrap;
  background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:28px 32px;
  box-shadow:var(--glow);animation:rise .5s ease both}
.gauge{position:relative;width:140px;height:140px;flex:none;margin:4px}
.gauge svg{width:100%;height:100%;transform:rotate(-90deg);overflow:visible}
.gauge .track{fill:none;stroke:rgba(150,185,255,.1);stroke-width:9}
.gauge .prog{fill:none;stroke:var(--g);stroke-width:9;stroke-linecap:round;
  filter:drop-shadow(0 0 8px var(--g));transition:stroke-dashoffset 1.1s cubic-bezier(.2,.8,.2,1)}
.gauge .gauge-num{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;
  justify-content:center;font-family:var(--display);font-weight:700;font-size:38px;color:var(--text)}
.gauge .gauge-num span{font-family:var(--mono);font-size:13px;color:var(--faint);font-weight:400;margin-top:-2px}
.gauge.g-ok{--g:var(--cyan)} .gauge.g-warn{--g:var(--warn)} .gauge.g-bad{--g:var(--bad)}
.result-meta{flex:1;min-width:240px}
.verdict{font-family:var(--display);font-weight:600;font-size:clamp(18px,2.6vw,25px);line-height:1.15;
  color:var(--text)}
.addr-line{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:12px}
.addr-mini{font-family:var(--mono);font-size:13px;color:var(--cyan);background:rgba(61,240,224,.07);
  border:1px solid rgba(61,240,224,.2);border-radius:8px;padding:6px 10px;word-break:break-all}
.copy-mini{padding:6px 11px;font-size:13px}
.recv{font-family:var(--mono);font-size:12px;color:var(--faint);letter-spacing:.3px}
.actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.actions form{display:inline}

/* buttons */
.btn{font-family:var(--mono);font-size:12.5px;letter-spacing:.4px;border:1px solid var(--line);
  background:var(--panel-2);color:var(--text);border-radius:9px;padding:9px 14px;cursor:pointer;
  text-decoration:none;display:inline-flex;align-items:center;gap:6px;transition:.16s}
.btn:hover{border-color:var(--line-2);box-shadow:0 0 18px -6px rgba(61,240,224,.5);color:var(--cyan)}
.btn-primary{background:linear-gradient(120deg,rgba(61,240,224,.22),rgba(157,123,255,.22));
  border-color:rgba(61,240,224,.4);color:#eafffb}
.btn-primary:hover{color:#eafffb}
.btn-danger{border-color:rgba(255,107,129,.35);color:var(--bad)}
.btn-danger:hover{color:var(--bad);box-shadow:0 0 18px -6px rgba(255,107,129,.6)}

.watch-banner{margin-top:14px;font-family:var(--mono);font-size:13px;color:var(--cyan);
  background:rgba(61,240,224,.06);border:1px solid rgba(61,240,224,.22);border-radius:10px;padding:11px 14px}

/* ---- section stat strip ---- */
.stat-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-top:16px}
.stat{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.stat b{display:block;font-family:var(--display);font-weight:700;font-size:26px;color:var(--text)}
.stat b span{font-family:var(--mono);font-size:13px;color:var(--faint);font-weight:400}
.stat label{font-family:var(--mono);font-size:11px;letter-spacing:1.2px;text-transform:uppercase;color:var(--dim)}

/* ---- breakdown ---- */
.breakdown{margin-top:18px;background:var(--panel);border:1px solid var(--line);border-radius:16px;
  padding:8px 20px 18px;box-shadow:var(--glow)}
.cat{padding-top:14px}
.cat h3{font-family:var(--mono);font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--dim);
  border-bottom:1px solid var(--line);padding-bottom:9px;margin-bottom:4px;
  display:flex;justify-content:space-between;align-items:center;gap:12px}
.cat-title{display:flex;align-items:center;gap:10px}
.cat-score{font-family:var(--mono);font-size:12px;color:var(--cyan);background:rgba(61,240,224,.08);
  border:1px solid rgba(61,240,224,.22);border-radius:999px;padding:2px 10px;letter-spacing:.5px}
.toggle-all{font-family:var(--mono);font-size:11px;letter-spacing:.5px;color:var(--dim);
  background:var(--panel-2);border:1px solid var(--line);border-radius:7px;padding:4px 11px;cursor:pointer}
.toggle-all:hover{color:var(--cyan);border-color:var(--line-2)}

.check{border-bottom:1px solid rgba(150,185,255,.07)}
.check:last-child{border-bottom:0}
.check>summary{display:flex;align-items:center;gap:12px;padding:12px 2px;cursor:pointer;list-style:none}
.check>summary::-webkit-details-marker{display:none}
.check .label{flex:1;font-weight:500;font-size:15px}
.dot{width:8px;height:8px;border-radius:50%;flex:none}
.s-pass{background:var(--ok)} .s-warn{background:var(--warn)} .s-fail{background:var(--bad)} .s-info{background:var(--info)}
.dot.s-pass{box-shadow:0 0 9px var(--ok)} .dot.s-warn{box-shadow:0 0 9px var(--warn)}
.dot.s-fail{box-shadow:0 0 9px var(--bad)} .dot.s-info{box-shadow:0 0 7px rgba(107,122,156,.7)}
.tag{font-family:var(--mono);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;
  padding:3px 9px;border-radius:6px}
.tag.s-pass{background:rgba(55,224,140,.13);color:var(--ok)} .tag.s-warn{background:rgba(255,194,75,.14);color:var(--warn)}
.tag.s-fail{background:rgba(255,107,129,.14);color:var(--bad)} .tag.s-info{background:rgba(107,122,156,.16);color:#9fb0cf}
.caret{color:var(--faint);font-size:11px;transition:transform .15s}
.check[open]>summary .caret{transform:rotate(90deg)}
.check-body{padding:0 2px 16px 20px}
.explain{color:var(--dim);font-size:14px;margin-bottom:9px;line-height:1.5}
.advice{font-size:14px;color:#d8e6c9;background:rgba(55,224,140,.06);border-left:2px solid var(--ok);
  padding:10px 13px;border-radius:0 8px 8px 0;margin-bottom:10px;line-height:1.5}
.advice .rec{margin:9px 0 0;padding:10px 13px;background:#04070d;border:1px solid rgba(95,240,226,.18);border-radius:8px;
  font-family:var(--mono);font-size:13px;color:#5ff0e2;white-space:pre-wrap;word-break:break-word;user-select:all}
.evidence{display:grid;grid-template-columns:max-content 1fr;gap:4px 16px;font-size:13px;font-family:var(--mono);margin-top:4px}
.evidence dt{color:var(--faint)}
.evidence dd{color:var(--text);word-break:break-word}
.sa{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:12.5px;margin:4px 0 10px}
.sa th{text-align:left;color:var(--faint);font-size:10.5px;text-transform:uppercase;letter-spacing:.5px;
  border-bottom:1px solid var(--line);padding:4px 7px}
.sa td{padding:4px 7px;border-bottom:1px solid rgba(150,185,255,.06);vertical-align:top;color:var(--dim)}
.sa td:first-child{font-weight:700;color:var(--cyan);white-space:nowrap}

/* on-demand blocklist */
.bl-hint{color:var(--dim);font-size:14px;margin:8px 0 12px;line-height:1.5}
.bl-result{margin-top:12px}
.bl-clean{font-family:var(--mono);font-size:13px;background:rgba(55,224,140,.08);color:var(--ok);
  border:1px solid rgba(55,224,140,.25);border-radius:9px;padding:11px 14px}
.bl-listed{font-family:var(--mono);font-size:13px;background:rgba(255,107,129,.09);color:var(--bad);
  border:1px solid rgba(255,107,129,.3);border-radius:9px;padding:11px 14px;word-break:break-word}

/* ---- saved list ---- */
.wrap{max-width:760px;margin:18px auto 0}
.wrap h1{font-family:var(--display);font-weight:600;letter-spacing:1px;color:var(--text);margin-bottom:18px;font-size:26px}
.saved-card{display:flex;align-items:center;gap:18px;background:var(--panel);border:1px solid var(--line);
  border-radius:13px;padding:16px 20px;margin-bottom:11px;text-decoration:none;color:inherit;transition:.16s}
.saved-card:hover{border-color:var(--line-2);box-shadow:0 0 24px -10px rgba(61,240,224,.4);transform:translateY(-1px)}
.saved-score{font-family:var(--display);font-weight:700;font-size:26px;color:var(--cyan);min-width:64px}
.saved-score small{font-family:var(--mono);font-size:12px;color:var(--faint)}
.saved-meta .t{font-weight:600;font-size:16px}
.saved-meta .d{font-family:var(--mono);font-size:12px;color:var(--faint);margin-top:2px}
.empty{font-family:var(--mono);color:var(--dim);background:var(--panel);border:1px solid var(--line);
  border-radius:13px;padding:34px;text-align:center}

/* ---- login ---- */
.login-card{max-width:360px;margin:14vh auto 0;background:var(--panel);border:1px solid var(--line);
  border-radius:16px;padding:32px;text-align:center;box-shadow:var(--glow);animation:rise .5s ease both}
.login-card h2{font-family:var(--display);font-weight:700;letter-spacing:2px;color:var(--text);margin-bottom:18px}
.login-card .brand-mark{font-size:22px}
.login-card input{width:100%;background:var(--bg-2);border:1px solid var(--line);color:var(--text);
  font-family:var(--mono);font-size:15px;padding:13px;border-radius:10px;margin-bottom:12px}
.login-card input:focus{outline:none;border-color:var(--line-2);box-shadow:0 0 18px -6px rgba(61,240,224,.4)}
.login-card button{width:100%;font-family:var(--display);font-weight:600;letter-spacing:1px;font-size:15px;
  color:#04121a;border:0;border-radius:10px;padding:13px;cursor:pointer;
  background:linear-gradient(120deg,var(--cyan),var(--violet))}
.err{color:var(--bad);font-family:var(--mono);font-size:13px;margin-bottom:10px}

/* waiting (mid-scan) */
.scan-wait{max-width:560px;margin:12vh auto 0;text-align:center}
.scan-wait h1{font-family:var(--display);font-weight:600;font-size:30px;color:var(--text)}
.scan-wait .waiting{margin-top:18px}

.toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%) translateY(10px);
  font-family:var(--mono);font-size:13px;letter-spacing:.5px;background:#0c1220;color:var(--cyan);
  border:1px solid rgba(61,240,224,.3);padding:11px 20px;border-radius:10px;opacity:0;transition:.25s;pointer-events:none}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

.theme-toggle{font-size:15px;line-height:1;background:var(--panel-2);border:1px solid var(--line);
  color:var(--dim);border-radius:8px;width:36px;height:33px;cursor:pointer;transition:.18s;margin-left:6px}
.theme-toggle:hover{color:var(--cyan);border-color:var(--line-2)}

/* ---- tron heading glow (homepage) ---- */
.tron{-webkit-text-fill-color:#d8fffa;color:#d8fffa;white-space:nowrap;
  text-shadow:0 0 7px var(--cyan),0 0 18px rgba(61,240,224,.85),0 0 42px rgba(61,240,224,.5);
  animation:tronFlicker 4.5s ease-in-out infinite}
@keyframes tronFlicker{
  0%,100%{text-shadow:0 0 7px var(--cyan),0 0 18px rgba(61,240,224,.85),0 0 42px rgba(61,240,224,.5)}
  47%{text-shadow:0 0 10px var(--cyan),0 0 28px rgba(61,240,224,1),0 0 62px rgba(61,240,224,.7)}
  49%{opacity:.82} 50%{opacity:1}}

/* ---- traveling grid beams (homepage only) ---- */
.beams{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.beam{position:absolute;opacity:0;border-radius:2px;will-change:transform,opacity}
.beam.h{height:2px;width:220px;left:-220px;
  background:linear-gradient(90deg,transparent,var(--cyan),transparent);
  box-shadow:0 0 14px 1px rgba(61,240,224,.6);
  animation:beamH var(--d,9s) linear var(--delay,0s) infinite}
.beam.v{width:2px;height:220px;top:-220px;
  background:linear-gradient(180deg,transparent,var(--violet),transparent);
  box-shadow:0 0 14px 1px rgba(157,123,255,.55);
  animation:beamV var(--d,11s) linear var(--delay,0s) infinite}
@keyframes beamH{
  0%{transform:translateX(0);opacity:0} 10%{opacity:.9} 45%{opacity:.9}
  60%{opacity:.35} 75%{opacity:.85} 100%{transform:translateX(calc(100vw + 220px));opacity:0}}
@keyframes beamV{
  0%{transform:translateY(0);opacity:0} 10%{opacity:.85} 50%{opacity:.85}
  65%{opacity:.3} 80%{opacity:.8} 100%{transform:translateY(calc(100vh + 220px));opacity:0}}
@media (prefers-reduced-motion:reduce){
  .beam{animation:none;opacity:0} .tron{animation:none}}

/* Encom — the Tron display face, self-hosted, for the hero heading */
@font-face{font-family:'Encom';src:url(/static/fonts/encom.ttf) format('truetype');
  font-weight:400;font-style:normal;font-display:swap}

/* ---- login backdrop: just the grid + neon title (image/figure removed) ---- */
.hero-bg{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;
  height:100vh;height:100lvh;            /* cover the true bottom even when iOS toolbars retract */
  background:#02060c;animation:heroIn 1.1s ease both}
@keyframes heroIn{from{opacity:0}to{opacity:1}}
/* neon title — flows in the centred column above the form */
.hero-title{display:flex;flex-direction:column;align-items:center;gap:.02em;text-align:center;
  font-family:var(--display);font-weight:700;letter-spacing:2px;line-height:.94}
.hero-title .ht-line{font-family:'Encom',var(--display),sans-serif;font-weight:400;
  font-size:clamp(30px,7.6vw,104px);color:#cdf4ff;
  text-shadow:0 0 7px #3df0e0,0 0 22px rgba(61,240,224,.85),0 0 55px rgba(61,240,224,.5)}
.hero-title .ht-line{animation:titleFlicker 7s linear infinite}
.hero-title .ht-line:nth-child(2){animation-delay:.5s}
.hero-title .ht-line:nth-child(3){animation-delay:1.1s}
@keyframes titleFlicker{
  0%,40%,100%{opacity:1} 41%{opacity:.62} 42%{opacity:1}
  72%{opacity:1} 72.6%{opacity:.55} 73.4%{opacity:1}}
/* enhanced grid on the login page — brighter cyan lines, wider coverage + soft glow */
body.has-hero .grid-bg{
  background-image:linear-gradient(rgba(96,196,255,.15) 1px,transparent 1px),
    linear-gradient(90deg,rgba(96,196,255,.15) 1px,transparent 1px);
  background-size:52px 52px;
  filter:drop-shadow(0 0 1px rgba(61,240,224,.5));
  -webkit-mask:radial-gradient(135% 108% at 50% 34%,#000 38%,transparent 90%);
          mask:radial-gradient(135% 108% at 50% 34%,#000 38%,transparent 90%)}
/* centre the heading + form as one vertical column filling the viewport */
body.has-hero .shell{min-height:100vh;min-height:100lvh;max-width:none;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:clamp(24px,5vh,56px);padding:24px 20px}
body.has-hero .login-card{margin:0;padding:0;width:min(380px,92vw);
  animation:none;background:transparent;border-color:transparent;box-shadow:none}

/* ---- responsive: tables scroll inside their own box, not the page ---- */
.tscroll{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
@media (max-width:600px){
  /* keep the topbar on as few rows as possible: drop the email chip + divider */
  .topbar{padding:12px 16px}
  .who,.nav-sep{display:none}
  .admin-wrap{padding-left:14px;padding-right:14px}
}
/* frosted-glass inputs */
body.has-hero .login-card input{background:rgba(11,17,30,.55);
  -webkit-backdrop-filter:blur(10px) saturate(1.25);backdrop-filter:blur(10px) saturate(1.25);
  border:1px solid rgba(120,200,255,.3);color:#eaf2ff;box-shadow:0 6px 24px -14px rgba(0,0,0,.9)}
body.has-hero .login-card input::placeholder{color:rgba(220,232,255,.5)}
body.has-hero .login-card input:focus{border-color:rgba(61,240,224,.6);
  box-shadow:0 0 22px -6px rgba(61,240,224,.55)}
/* password (80%) + icon submit (20%) on one row */
.login-row{display:flex;gap:10px;align-items:stretch}
.login-row .login-pass{flex:4 1 0;min-width:0;margin-bottom:0}
.login-row .login-go{flex:1 1 0;width:auto;padding:0;display:flex;align-items:center;justify-content:center;
  color:#04121a;border:0;border-radius:10px;cursor:pointer;
  background:linear-gradient(120deg,var(--cyan),var(--violet));
  box-shadow:0 0 22px -8px rgba(61,240,224,.7);transition:.18s}
.login-row .login-go:hover{filter:brightness(1.06);box-shadow:0 0 26px -6px rgba(157,123,255,.8)}
.login-row .login-go:active{transform:translateY(1px)}

/* ---- drifting low ground-smoke at the bottom (login) ---- */
.smoke{position:fixed;left:0;right:0;bottom:0;height:30vh;z-index:0;pointer-events:none;overflow:hidden}
.smoke::before{content:"";position:absolute;left:0;right:0;bottom:0;height:55%;
  background:linear-gradient(0deg, rgba(74,164,255,.16), rgba(74,164,255,.05) 55%, transparent);
  filter:blur(12px)}
.smoke span{position:absolute;bottom:-18%;width:var(--w,340px);height:var(--w,340px);border-radius:50%;
  mix-blend-mode:screen;
  background:radial-gradient(circle at 50% 50%, rgba(110,185,255,.30), rgba(58,142,238,.12) 48%, transparent 72%);
  filter:blur(30px);opacity:0;animation:smokeDrift var(--sd,19s) ease-in-out var(--delay,0s) infinite}
@keyframes smokeDrift{
  0%{transform:translate(0,18%) scale(.9);opacity:0}
  25%{opacity:.5} 60%{transform:translate(var(--dx,18px),-6%) scale(1.18);opacity:.38}
  85%{opacity:.28} 100%{transform:translate(0,-16%) scale(1.35);opacity:0}}
@media (prefers-reduced-motion:reduce){.smoke span{animation:none;opacity:.28}}

/* ---- custom sci-fi cursors (OS-rendered PNG; applied to * so the native
   pointer is never exposed). default = arrow (hotspot at tip); interactive =
   HUD lock-on reticle (hotspot centred). text fields keep the I-beam. ---- */
*{cursor:url(/static/cur-copper-arrow.png) 2 0, auto}
a,button,summary,select,label[for],[role="button"],.btn,.btn-share,.theme-toggle,.login-go,
.copy-mini,.pill button,#copy,#refresh,#blcheck,.admin-tabs a,.toggle-all,
details.check>summary,input[type="submit"],input[type="button"]{cursor:url(/static/cur-copper-link.png) 16 13, pointer}
input,textarea{cursor:text}

/* ============ LIGHT THEME ("lab") ============ */
html[data-theme="light"]{
  --bg:#eef2f8; --bg-2:#ffffff;
  --panel:rgba(255,255,255,.72); --panel-2:#ffffff;
  --line:rgba(28,48,88,.13); --line-2:rgba(28,48,88,.24);
  --text:#15233e; --dim:#4d5e80; --faint:#6e7d9c;
  --cyan:#0b7682; --violet:#6b46ff;
  --ok:#15a661; --warn:#c2710a; --bad:#dc2f44; --info:#5a6b8c;
  --glow:0 0 0 1px var(--line), 0 16px 40px -24px rgba(28,48,88,.28);
}
html[data-theme="light"] body{
  background:
    radial-gradient(1000px 560px at 50% -12%, rgba(14,154,167,.13), transparent 60%),
    radial-gradient(760px 520px at 92% -6%, rgba(107,70,255,.10), transparent 55%),
    var(--bg);
}
html[data-theme="light"] .grid-bg{
  background-image:linear-gradient(rgba(28,48,88,.06) 1px,transparent 1px),
    linear-gradient(90deg,rgba(28,48,88,.06) 1px,transparent 1px)}
html[data-theme="light"] .topbar{background:linear-gradient(180deg,rgba(255,255,255,.85),transparent)}
html[data-theme="light"] .scanner h1{background:linear-gradient(180deg,#16233e,#3f5a86);
  -webkit-background-clip:text;background-clip:text}
html[data-theme="light"] .btn-primary{background:linear-gradient(120deg,var(--cyan),var(--violet));
  color:#fff;border-color:transparent}
/* gradient buttons get white text in light mode (the deepened gradient is dark enough) */
html[data-theme="light"] .cta,html[data-theme="light"] .login-card button{color:#fff}
html[data-theme="light"] .tron{-webkit-text-fill-color:#0a6d78;color:#0a6d78}
html[data-theme="light"] .advice{color:#2b5a3c}
html[data-theme="light"] .gauge .gauge-num,html[data-theme="light"] .stat b,
html[data-theme="light"] .verdict{color:var(--text)}
html[data-theme="light"] .toast{background:#15233e;color:#fff;border-color:transparent}
html[data-theme="light"] .brand-mark{text-shadow:0 0 12px rgba(14,154,167,.45)}

/* ---- public sharing ---- */
.btn-share.on{color:var(--cyan);border-color:rgba(61,240,224,.4)}
.shared-badge{color:var(--cyan);border-color:rgba(61,240,224,.35);cursor:default}
.share-bar{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:12px;padding:11px 14px;
  background:var(--panel-2);border:1px solid rgba(61,240,224,.28);border-radius:10px}
.share-bar-label{font-size:13px;color:var(--dim)}
.share-bar .link-input{flex:1;min-width:220px;background:#04070d;border:1px solid var(--line);
  color:#5ff0e2;font-family:var(--mono);font-size:12.5px;padding:8px 11px;border-radius:8px}

/* ============ ACCOUNTS / ADMIN ============ */
.nav-sep{width:1px;height:18px;background:var(--line);margin:0 3px}
.who{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:12px;
  color:var(--dim);padding:0 2px}
.who-dot{width:6px;height:6px;border-radius:50%;background:var(--ok);
  box-shadow:0 0 7px rgba(55,224,140,.75);flex:none}
.who-email{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.logout-form{display:inline}
.btn-logout{font-family:var(--mono);font-size:12.5px;color:var(--dim);background:var(--panel-2);
  border:1px solid var(--line);border-radius:8px;padding:7px 12px;cursor:pointer;transition:.15s}
.btn-logout:hover{color:var(--cyan);border-color:var(--line-2)}

.admin-wrap{max-width:920px;margin:0 auto;padding:8px 4px 60px}
.admin-head{display:flex;align-items:baseline;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-bottom:22px}
.admin-head h1{font-family:var(--display);font-weight:600;letter-spacing:.5px;font-size:26px;margin:0}
.admin-tabs{display:flex;gap:6px}
.admin-tabs a{font-family:var(--mono);font-size:12px;letter-spacing:.5px;text-transform:uppercase;
  color:var(--dim);text-decoration:none;padding:7px 13px;border:1px solid var(--line);border-radius:8px}
.admin-tabs a.on{color:var(--cyan);border-color:var(--line-2);background:var(--panel-2)}
.admin-tabs a:hover{color:var(--text)}

.link-banner{background:var(--panel-2);border:1px solid rgba(61,240,224,.3);border-radius:12px;
  padding:14px 16px;margin-bottom:20px}
.link-banner-label{font-size:13.5px;color:var(--dim);margin-bottom:9px}
.link-row{display:flex;gap:8px}
.link-input{flex:1;min-width:0;background:#04070d;border:1px solid var(--line);color:#5ff0e2;
  font-family:var(--mono);font-size:13px;padding:9px 12px;border-radius:8px}

.admin-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:16px}
.admin-create{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:20px}
.admin-create input,.admin-create select{background:var(--bg-2);border:1px solid var(--line);
  color:var(--text);font-family:var(--mono);font-size:14px;padding:10px 12px;border-radius:9px}
.admin-create input{flex:1;min-width:200px}

.admin-table{width:100%;border-collapse:collapse;font-size:14px}
.admin-table th{text-align:left;font-family:var(--mono);font-size:11px;letter-spacing:1px;
  text-transform:uppercase;color:var(--dim);border-bottom:1px solid var(--line);padding:9px 8px;font-weight:500}
.admin-table td{padding:11px 8px;border-bottom:1px solid rgba(150,185,255,.07);vertical-align:middle}
.admin-table td.mono{font-family:var(--mono);font-size:13px}
.admin-table tr.stuck td{color:var(--warn)}
.warn-mark{color:var(--warn)}
.admin-actions{display:flex;gap:6px}.admin-actions form{display:inline}
.badge{font-family:var(--mono);font-size:11px;letter-spacing:.5px;text-transform:uppercase;
  padding:3px 9px;border-radius:20px;border:1px solid var(--line)}
.badge.b-active{color:var(--ok);border-color:rgba(55,224,140,.35)}
.badge.b-invited{color:var(--warn);border-color:rgba(255,179,71,.35)}
.badge.b-disabled{color:var(--faint);border-color:var(--line)}