/* ============================================================
   ithouse — Speed test module options (v2 redesign)
   ============================================================ */

/* shared */
.st-note{font-size:12.5px;color:var(--fg-2);letter-spacing:-.01em;}
.st-err{font-size:13.5px;color:#f6788f;}
.st-phase{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:12.5px;
  letter-spacing:0;color:var(--fg-3);}
.st-spin{width:14px;height:14px;border-radius:99px;border:2px solid rgba(147,227,241,.25);
  border-top-color:var(--cyan);animation:st-spin .8s linear infinite;flex-shrink:0;}
@keyframes st-spin{to{transform:rotate(360deg);}}

/* ---------- A · editorial inline (typographic, no box) ---------- */
.sta{display:flex;flex-direction:column;gap:26px;max-width:600px;}
.sta-form{display:flex;align-items:flex-end;gap:18px;border-bottom:1px solid rgba(255,255,255,.18);
  padding-bottom:12px;transition:border-color .2s var(--ease);}
.sta-form:focus-within{border-color:rgba(147,227,241,.55);}
.sta-form .pre{font-family:var(--mono);font-size:13px;color:var(--fg-2);letter-spacing:0;padding-bottom:7px;white-space:nowrap;}
.sta-form input{flex:1;min-width:0;background:none;border:none;outline:none;color:#fff;
  font-family:var(--heading);font-size:28px;font-weight:500;letter-spacing:-.025em;padding:0;}
.sta-form input::placeholder{color:rgba(255,255,255,.22);}
.sta-go{width:46px;height:46px;border-radius:99px;background:var(--primary);color:#18181b;border:none;
  display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;
  transition:background .2s var(--ease);}
.sta-go:hover{background:var(--primary-hover);}
.sta-go:disabled{opacity:.5;cursor:default;}
.sta-go svg{fill:currentColor;}
.sta-stats{display:flex;gap:48px;}
.sta-stat{display:flex;flex-direction:column;gap:7px;}
.sta-stat .lbl{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-2);}
.sta-stat .val{font-family:var(--heading);font-size:38px;font-weight:600;letter-spacing:-.03em;color:#fff;line-height:1;}
.sta-stat .val em{font-style:normal;font-size:17px;color:var(--fg-3);margin-left:3px;}
.sta-stat.hl .val{color:var(--cyan);}
.sta-verdict{font-size:15px;color:var(--fg-4);letter-spacing:-.015em;max-width:520px;line-height:1.55;}
.sta-verdict b{color:#fff;font-weight:500;}

/* ---------- B · before / after gauge duel ---------- */
.stb{position:relative;background:var(--bg-deep);border:1px solid rgba(255,255,255,.09);border-radius:16px;
  padding:30px 32px 28px;display:flex;flex-direction:column;gap:24px;max-width:620px;width:100%;
  box-shadow:0 24px 64px rgba(0,0,0,.45);overflow:hidden;}
.stb::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(70% 60% at 85% -10%, rgba(147,227,241,.08) 0%, transparent 70%);}
.stb > *{position:relative;}
.stb-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;}
.stb h3{font-family:var(--heading);font-size:21px;font-weight:600;letter-spacing:-.025em;color:#fff;}
.stb-form{display:flex;align-items:center;gap:0;background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);border-radius:6px;padding:5px;
  transition:border-color .2s var(--ease);}
.stb-form:focus-within{border-color:rgba(147,227,241,.45);}
.stb-form input{flex:1;min-width:0;background:none;border:none;outline:none;color:#fff;
  font-family:var(--body);font-size:15px;letter-spacing:-.015em;padding:8px 14px;}
.stb-form input::placeholder{color:var(--fg-2);}
.stb-form button{display:inline-flex;align-items:center;gap:7px;background:var(--primary);color:#18181b;
  border:none;cursor:pointer;border-radius:4px;padding:9px 16px;font-family:var(--body);
  font-size:14px;font-weight:500;letter-spacing:-.02em;white-space:nowrap;}
.stb-form button:disabled{opacity:.55;cursor:default;}
.stb-duel{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:18px;padding:6px 0 2px;}
.stb-side{display:flex;flex-direction:column;align-items:center;gap:12px;}
.stb-ring{position:relative;width:108px;height:108px;}
.stb-ring svg{width:100%;height:100%;transform:rotate(-90deg);}
.stb-ring .track{stroke:rgba(255,255,255,.07);}
.stb-ring .arc{stroke-linecap:round;transition:stroke-dashoffset 1.2s var(--ease);}
.stb-ring-num{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;}
.stb-ring-num b{font-family:var(--heading);font-size:26px;font-weight:600;letter-spacing:-.03em;color:#fff;line-height:1;}
.stb-ring-num span{font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--fg-2);}
.stb-side .who{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-3);
  display:flex;align-items:center;gap:8px;}
.stb-side .who img{height:13px;}
.stb-vs{display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--fg-2);}
.stb-vs svg{fill:currentColor;}
.stb-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid rgba(255,255,255,.07);padding-top:18px;}
.stb-claim{font-size:14.5px;color:var(--fg-4);letter-spacing:-.015em;line-height:1.5;}
.stb-claim b{color:var(--cyan);font-weight:500;}

/* ---------- C · dashboard diagnostic panel ---------- */
.stc{background:#141416;border:1px solid rgba(255,255,255,.09);border-radius:12px;
  box-shadow:0 24px 64px rgba(0,0,0,.5);overflow:hidden;max-width:640px;width:100%;}
/* border-beam — sweeps the panel edge a few times on load, then fades */
@property --stc-angle{syntax:"<angle>";initial-value:0deg;inherits:false;}
.stc{position:relative;}
.stc::after{content:"";position:absolute;inset:0;border-radius:12px;padding:1.5px;pointer-events:none;
  background:linear-gradient(120deg,#00bf84,#93e3f1);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  mask-composite:exclude;
  animation:stc-blink 5s ease-in-out forwards;}
@keyframes stc-blink{0%{opacity:.2}8%{opacity:1}16%{opacity:.2}24%{opacity:1}32%{opacity:.2}40%{opacity:1}48%{opacity:.2}56%{opacity:1}72%{opacity:.25}100%{opacity:0}}
@media (prefers-reduced-motion: reduce){.stc::after{display:none;}}
.stc-head{display:flex;align-items:center;gap:10px;padding:14px 20px;border-bottom:1px solid rgba(255,255,255,.07);
  background:rgba(255,255,255,.02);}
.stc-head .ttl{font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-3);}
.stc-live{margin-left:auto;display:flex;align-items:center;gap:7px;font-size:12px;color:var(--green);}
.stc-body{display:flex;flex-direction:column;}
.stc-form{display:flex;align-items:center;gap:12px;padding:18px 20px;border-bottom:1px solid rgba(255,255,255,.06);}
.stc-form .pre{font-family:var(--mono);font-size:12.5px;color:var(--cyan);letter-spacing:0;white-space:nowrap;}
.stc-form input{flex:1;min-width:0;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);
  border-radius:4px;outline:none;color:#fff;font-family:var(--mono);font-size:13px;letter-spacing:0;
  padding:8px 12px;transition:border-color .2s var(--ease);}
.stc-form input:focus{border-color:rgba(147,227,241,.45);}
.stc-form input::placeholder{color:var(--fg-2);}
.stc-form button{background:var(--primary);color:#18181b;border:none;cursor:pointer;border-radius:4px;
  font-family:var(--mono);font-size:12px;letter-spacing:.02em;padding:8px 16px;font-weight:500;}
.stc-form button:disabled{opacity:.55;cursor:default;}
.stc-rows{display:flex;flex-direction:column;padding:6px 0;}
.stc-row{display:grid;grid-template-columns:138px 1fr auto;align-items:center;gap:14px;padding:11px 20px;}
.stc-row .lbl{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--fg-2);}
.stc-row .val{font-family:var(--mono);font-size:12.5px;color:#fff;text-align:right;letter-spacing:0;white-space:nowrap;}
.stc-val{display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:3px;min-width:64px;min-height:26px;}
.stc-tag{font-family:var(--mono);font-size:8.5px;font-weight:600;letter-spacing:.11em;text-transform:uppercase;line-height:1;white-space:nowrap;}
.stc-meter{position:relative;height:8px;background:rgba(255,255,255,.05);border-radius:99px;overflow:hidden;}
.stc-meter i{position:absolute;top:0;left:0;height:100%;border-radius:99px;width:0;transition:width 1s var(--ease);}
.stc-meter i.good{background:linear-gradient(90deg,#00bf84,#93e3f1);}
.stc-meter i.warn{background:rgba(246,170,80,.75);}
.stc-meter i.bad{background:rgba(246,120,143,.75);}
.stc-headline{margin:14px 20px 0;font-size:15px;letter-spacing:-.015em;color:var(--fg-3);line-height:1.45;}
.stc-headline b{color:#fff;font-weight:600;}
.stc-verdict{display:flex;align-items:center;gap:11px;margin:8px 20px 18px;padding:13px 16px;
  background:rgba(108,239,206,.06);border:1px solid rgba(108,239,206,.22);border-radius:8px;}
.stc-verdict .ic{display:flex;align-items:center;justify-content:center;width:24px;height:24px;flex-shrink:0;
  border-radius:99px;background:rgba(108,239,206,.12);}
.stc-verdict .ic svg{width:12px;height:12px;}
.stc-verdict p{font-size:13.5px;color:var(--fg-4);letter-spacing:-.015em;line-height:1.5;}
.stc-verdict p b{color:#fff;font-weight:500;}
.stc-idle{padding:18px 20px 22px;font-family:var(--mono);font-size:12px;color:var(--fg-2);letter-spacing:0;}
.stc-pad{padding:14px 20px 20px;}