:root{
    color-scheme:dark;
    --bg:#06101d;
    --panel:#0b1728;
    --text:#f5f8fc;
    --muted:#93a6bd;
    --line:rgba(255,255,255,.08);
    --accent:#4dd7ff;
    --accent2:#6b7cff;
    --good:#48e39a;
    --danger:#ff7087;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:radial-gradient(circle at 50% 0%,#102743 0,#081626 34%,var(--bg) 72%);color:var(--text)}
body{min-height:100vh}
button{font:inherit}
.app-shell{width:min(980px,calc(100% - 28px));margin:0 auto;min-height:100vh;display:flex;flex-direction:column;padding:22px 0 18px}
.brand{display:flex;align-items:center;gap:18px;padding:2px 4px 16px;min-height:72px}.brand-logo{display:block;width:clamp(205px,27vw,270px);height:auto;object-fit:contain;filter:drop-shadow(0 8px 24px rgba(27,144,255,.12))}.brand-tagline{font-size:12px;color:var(--muted);line-height:1.35;padding-left:16px;border-left:1px solid rgba(255,255,255,.09);max-width:230px}
.tester{flex:1;background:linear-gradient(180deg,rgba(14,30,50,.96),rgba(7,17,30,.96));border:1px solid var(--line);border-radius:26px;box-shadow:0 30px 70px rgba(0,0,0,.28);padding:18px clamp(16px,4vw,42px) 24px;overflow:hidden;position:relative}.tester:before{content:"";position:absolute;width:360px;height:360px;border-radius:50%;background:rgba(77,215,255,.055);filter:blur(20px);top:-220px;left:50%;transform:translateX(-50%);pointer-events:none}
.status-row{display:flex;justify-content:center;align-items:center;gap:8px;color:var(--muted);font-size:13px;min-height:24px}.status-dot{width:8px;height:8px;border-radius:50%;background:#5d7088;box-shadow:0 0 0 5px rgba(93,112,136,.09)}.status-dot.active{background:var(--accent);box-shadow:0 0 0 5px rgba(77,215,255,.10),0 0 18px rgba(77,215,255,.75);animation:statusPulse 1.25s ease-in-out infinite}.status-dot.done{background:var(--good);box-shadow:0 0 0 5px rgba(72,227,154,.10)}.status-dot.error{background:var(--danger);box-shadow:0 0 0 5px rgba(255,112,135,.10)}
.phases{display:flex;align-items:center;justify-content:center;gap:8px;margin:8px auto -4px;position:relative;z-index:2}.phase-step{display:flex;align-items:center;gap:6px;color:#60758e;font-size:10px;font-weight:700;letter-spacing:.3px;padding:5px 8px;border:1px solid rgba(255,255,255,.055);border-radius:999px;background:rgba(255,255,255,.018);transition:.25s ease}.phase-step i{width:5px;height:5px;border-radius:50%;background:#50637a;transition:.25s ease}.phase-step.active{color:#bcefff;border-color:rgba(77,215,255,.16);background:rgba(77,215,255,.05)}.phase-step.active i{background:var(--accent);box-shadow:0 0 10px rgba(77,215,255,.8)}.phase-step.done{color:#9eeec8;border-color:rgba(72,227,154,.12)}.phase-step.done i{background:var(--good)}
.gauge-wrap{position:relative;pointer-events:none;width:min(520px,100%);margin:0 auto;height:285px}.gauge{width:100%;height:auto;display:block;filter:drop-shadow(0 8px 24px rgba(0,0,0,.22))}.gauge-track,.gauge-progress{fill:none;stroke-width:14;stroke-linecap:round}.gauge-track{stroke:rgba(255,255,255,.08)}.gauge-progress{stroke:var(--accent);stroke-dasharray:100;stroke-dashoffset:100;transition:stroke-dashoffset .16s linear;filter:drop-shadow(0 0 8px rgba(77,215,255,.45))}.ticks text{fill:#6f849d;font-size:10px;text-anchor:middle}.gauge-value{position:absolute;left:50%;top:52%;transform:translate(-50%,-50%);text-align:center;white-space:nowrap}.gauge-value span{font-size:clamp(50px,10vw,76px);font-weight:750;letter-spacing:-4px;line-height:1;font-variant-numeric:tabular-nums}.gauge-value small{display:block;margin-top:8px;color:var(--muted);font-size:14px;letter-spacing:.4px}.phase-label{position:absolute;left:50%;top:76%;transform:translateX(-50%);font-size:11px;letter-spacing:2px;color:#7287a0;font-weight:700}
.start-btn{margin:-34px auto 22px;position:relative;z-index:5;pointer-events:auto;touch-action:manipulation;display:flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:999px;padding:14px 24px;color:#04101c;background:linear-gradient(135deg,#7fe7ff,#68a8ff);font-weight:800;cursor:pointer;box-shadow:0 14px 30px rgba(77,215,255,.18);transition:transform .18s ease,filter .18s ease,opacity .18s ease}.start-btn:hover{transform:translateY(-1px);filter:brightness(1.05)}.start-btn:active,.start-btn.clicked{transform:translateY(1px) scale(.985);filter:brightness(.96)}.start-btn:disabled{cursor:not-allowed;opacity:.62;transform:none}.start-icon{font-size:12px}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.metric-card{background:rgba(255,255,255,.035);border:1px solid var(--line);border-radius:17px;padding:14px 15px;min-width:0;transition:border-color .3s ease,background .3s ease,transform .3s ease}.metric-label{display:block;color:var(--muted);font-size:12px;margin-bottom:7px}.metric-card strong{font-size:22px;letter-spacing:-.5px;font-variant-numeric:tabular-nums}.metric-card small{font-size:11px;color:#8196af;font-weight:600}.metric-card.featured{background:linear-gradient(180deg,rgba(77,215,255,.055),rgba(255,255,255,.025))}.metric-card.measured{border-color:rgba(77,215,255,.16);background:rgba(77,215,255,.055);animation:metricIn .45s ease}
.result-summary{margin-top:12px;border:1px solid rgba(72,227,154,.16);background:rgba(72,227,154,.055);border-radius:15px;padding:12px 14px;display:flex;align-items:flex-start;gap:11px}.result-summary[hidden]{display:none}.result-badge{width:26px;height:26px;flex:0 0 26px;border-radius:50%;display:grid;place-items:center;background:rgba(72,227,154,.13);color:var(--good);font-weight:900}.result-summary strong,.result-summary span{display:block}.result-summary strong{font-size:14px}.result-summary span{color:var(--muted);font-size:12px;margin-top:3px;line-height:1.45}
footer{display:flex;justify-content:space-between;gap:18px;color:#61758d;font-size:11px;padding:14px 5px 0}
@keyframes statusPulse{50%{opacity:.55;transform:scale(.86)}}
@keyframes metricIn{0%{transform:translateY(3px)}55%{transform:translateY(-1px)}100%{transform:translateY(0)}}
@media(max-width:720px){.metrics{grid-template-columns:repeat(2,1fr)}.gauge-wrap{height:260px}.start-btn{margin-top:-45px}}
@media(max-width:430px){.app-shell{width:min(100% - 16px,980px);padding-top:8px}.brand{padding-left:5px;gap:10px;min-height:62px}.brand-logo{width:190px}.brand-tagline{font-size:10px;padding-left:9px;max-width:130px}.tester{border-radius:21px;padding-left:12px;padding-right:12px}.phases{gap:4px}.phase-step{padding:4px 6px;font-size:9px}.gauge-wrap{height:230px}.gauge-value{top:49%}.phase-label{top:73%}.start-btn{margin-top:-38px}.metric-card strong{font-size:19px}footer{flex-direction:column;gap:3px;padding-left:8px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
