@charset "UTF-8";:root{--clr-bg:#f4f6f8;--clr-dots:#d0d0d0;--clr-ink:#111111;--clr-paper:#ffffff;--clr-accent:#00ff88;--clr-yellow:#ffd200;--clr-purple:#7d5fff;--clr-cyan:#00e5ff;--clr-error:#ff3860;--font-header:'Bangers',cursive;--font-body:'Comic Neue',cursive,sans-serif;--border-width:4px;--shadow-offset:6px;}*{box-sizing:border-box;margin:0;padding:0;}body{background-color:var(--clr-bg);color:var(--clr-ink);font-family:var(--font-body);min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px 16px;position:relative;overflow-x:hidden;}.bg-grid{position:fixed;top:0;left:0;width:100vw;height:100vh;background-image:radial-gradient(var(--clr-dots) 15%,transparent 16%),radial-gradient(var(--clr-dots) 15%,transparent 16%);background-size:20px 20px;background-position:0 0,10px 10px;z-index:-1;pointer-events:none;}.container{width:100%;max-width:680px;display:flex;flex-direction:column;gap:20px;}.header{text-align:center;background:var(--clr-paper);padding:20px;border:var(--border-width) solid var(--clr-ink);box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--clr-ink);transform:rotate(-1deg);}.logo-text{font-family:var(--font-header);font-size:3.5rem;color:var(--clr-accent);text-shadow:2px 2px 0 var(--clr-ink),-2px -2px 0 var(--clr-ink),2px -2px 0 var(--clr-ink),-2px 2px 0 var(--clr-ink),4px 4px 0 var(--clr-ink);letter-spacing:2px;}.tagline{font-weight:700;text-transform:uppercase;font-size:1.1rem;color:#555;margin:6px 0 0;}.card{background:var(--clr-paper);border:var(--border-width) solid var(--clr-ink);box-shadow:10px 10px 0 var(--clr-ink);width:100%;padding:24px;position:relative;box-sizing:border-box;}.home-link{position:absolute;top:-16px;left:16px;background:var(--clr-paper);border:3px solid var(--clr-ink);padding:2px 10px;font-weight:800;font-size:0.85rem;color:var(--clr-ink);text-decoration:none;box-shadow:3px 3px 0 var(--clr-ink);z-index:10;transition:all 0.1s ease;}.home-link:hover{background:var(--clr-yellow);transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--clr-ink);}.speed-tool-wrap{display:flex;flex-direction:column;gap:16px;margin-top:5px;}.stage-bar{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;background:#eef2f5;border:3px solid var(--clr-ink);padding:6px;box-shadow:3px 3px 0 var(--clr-ink);}.stage-step{display:flex;align-items:center;justify-content:center;gap:6px;padding:6px 4px;background:#fff;border:2px solid #ccc;font-weight:800;font-size:0.8rem;color:#888;text-transform:uppercase;transition:all 0.2s ease;}.stage-step .step-num{width:18px;height:18px;border-radius:50%;background:#eee;color:#666;display:inline-flex;align-items:center;justify-content:center;font-size:0.72rem;font-weight:900;}.stage-step.active{border-color:var(--clr-ink);background:var(--clr-yellow);color:var(--clr-ink);box-shadow:2px 2px 0 var(--clr-ink);}.stage-step.active .step-num{background:var(--clr-ink);color:#fff;}.stage-step.complete{border-color:var(--clr-ink);background:var(--clr-accent);color:var(--clr-ink);}.stage-step.complete .step-num{background:var(--clr-ink);color:var(--clr-accent);}.gauge-card{background:#fafafa;border:3px solid var(--clr-ink);box-shadow:4px 4px 0 var(--clr-ink);padding:16px 12px 10px;text-align:center;position:relative;overflow:hidden;max-height:400px;opacity:1;transform:translateY(0) scale(1);transition:max-height 0.45s cubic-bezier(0.4,0,0.2,1), opacity 0.35s ease, transform 0.4s cubic-bezier(0.4,0,0.2,1), padding 0.45s cubic-bezier(0.4,0,0.2,1), margin 0.45s cubic-bezier(0.4,0,0.2,1), border-width 0.45s cubic-bezier(0.4,0,0.2,1);}.gauge-card.faded{max-height:0;opacity:0;transform:translateY(-8px) scale(0.96);padding-top:0;padding-bottom:0;margin-top:0;margin-bottom:0;border-width:0;box-shadow:none;pointer-events:none;}.gauge-svg-wrap{position:relative;max-width:320px;margin:0 auto;}.gauge-svg{width:100%;height:auto;display:block;}.gauge-fill-track{transition:stroke-dashoffset 0.1s linear,stroke 0.2s ease;}.gauge-center-content{position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:100%;text-align:center;}.gauge-metric-label{font-size:0.85rem;font-weight:800;text-transform:uppercase;letter-spacing:1px;color:#666;}.gauge-speed-val{font-family:var(--font-body),system-ui,-apple-system,sans-serif;font-size:3.4rem;line-height:1;font-weight:900;color:var(--clr-ink);font-variant-numeric:tabular-nums;letter-spacing:-1px;margin:2px 0;}.gauge-speed-unit{font-size:1.1rem;font-weight:800;color:#333;text-transform:uppercase;}.metrics-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;width:100%;box-sizing:border-box;}.metric-box{background:#fff;border:3px solid var(--clr-ink);box-shadow:3px 3px 0 var(--clr-ink);padding:10px 8px;display:flex;flex-direction:column;gap:4px;min-width:0;overflow:hidden;box-sizing:border-box;height:100%;transition:background 0.2s ease,border-color 0.2s ease;}.metric-box.active-box{background:#f0fdff;border-color:#00b3cc;box-shadow:3px 3px 0 var(--clr-ink);}.metric-box.complete-box{background:#f4fff7;border-color:var(--clr-ink);}.metric-box.complete-box .metric-head svg{color:#008a52 !important;}.metric-head{display:flex;align-items:center;gap:5px;font-size:0.74rem;font-weight:800;color:#555;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.metric-head svg{flex-shrink:0;}.metric-body{display:flex;align-items:baseline;gap:4px;white-space:nowrap;overflow:hidden;min-height:28px;}.metric-value{font-family:var(--font-body),system-ui,-apple-system,sans-serif;font-size:1.55rem;font-weight:900;line-height:1;color:var(--clr-ink);font-variant-numeric:tabular-nums;font-feature-settings:"tnum";letter-spacing:-0.5px;}.metric-unit{font-family:var(--font-body),system-ui,sans-serif;font-size:0.76rem;font-weight:800;color:#666;text-transform:uppercase;}.metric-foot{font-size:0.68rem;font-weight:800;color:#777;margin-top:2px;letter-spacing:0.1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant-numeric:tabular-nums;min-height:14px;}.ping-box .metric-head svg{color:var(--clr-purple);}.jitter-box .metric-head svg{color:var(--clr-yellow);}.down-box .metric-head svg{color:var(--clr-accent);}.up-box .metric-head svg{color:var(--clr-cyan);}.server-info-strip{display:flex;justify-content:space-between;align-items:center;background:#eef2f5;border:3px solid var(--clr-ink);box-shadow:3px 3px 0 var(--clr-ink);padding:8px 14px;font-weight:700;font-size:0.82rem;flex-wrap:wrap;gap:8px;}.server-tag{display:flex;align-items:center;gap:6px;text-transform:uppercase;}.status-dot{width:9px;height:9px;border-radius:50%;background:var(--clr-accent);border:2px solid var(--clr-ink);display:inline-block;}.server-select-dropdown{background:#fff;border:2px solid var(--clr-ink);font-family:var(--font-body);font-weight:800;font-size:0.76rem;padding:3px 6px;box-shadow:2px 2px 0 var(--clr-ink);cursor:pointer;text-transform:uppercase;color:var(--clr-ink);}.server-select-dropdown:focus{outline:none;background:var(--clr-yellow);}.action-wrap{width:100%;}.main-action-btn{width:100%;padding:14px 20px;background:var(--clr-accent);color:var(--clr-ink);border:var(--border-width) solid var(--clr-ink);box-shadow:6px 6px 0 var(--clr-ink);font-family:var(--font-header);font-size:1.5rem;font-weight:900;cursor:pointer;text-transform:uppercase;letter-spacing:1px;transition:all 0.15s ease;}.main-action-btn:hover:not(:disabled){transform:translate(-2px,-2px);box-shadow:8px 8px 0 var(--clr-ink);background:#33ff99;}.main-action-btn:active:not(:disabled){transform:translate(2px,2px);box-shadow:2px 2px 0 var(--clr-ink);}.main-action-btn:disabled{opacity:0.6;cursor:not-allowed;background:#d4d4d4;}.results-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;}.sub-action-btn{padding:12px 16px;background:var(--clr-paper);color:var(--clr-ink);border:3px solid var(--clr-ink);box-shadow:4px 4px 0 var(--clr-ink);font-family:var(--font-header);font-size:1.2rem;font-weight:800;cursor:pointer;text-transform:uppercase;letter-spacing:0.5px;transition:all 0.15s ease;}.sub-action-btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--clr-ink);background:#fdfdfd;}.sub-action-btn:active{transform:translate(1px,1px);box-shadow:2px 2px 0 var(--clr-ink);}.sub-action-btn.copy-btn{background:var(--clr-yellow);}.sub-action-btn.copy-btn:hover{background:#ffe359;}.sub-action-btn.copied{background:#2ed573 !important;color:#fff !important;}.summary-card{background:#fff;border:3px solid var(--clr-ink);box-shadow:6px 6px 0 var(--clr-ink);padding:18px 20px;display:flex;flex-direction:column;gap:16px;animation:summaryReveal 0.4s cubic-bezier(0.34,1.56,0.64,1) forwards;position:relative;overflow:hidden;}.summary-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--clr-accent),var(--clr-cyan),var(--clr-yellow));}@keyframes summaryReveal{from{opacity:0;transform:translateY(12px) scale(0.97);}to{opacity:1;transform:translateY(0) scale(1);}}.summary-header{display:flex;align-items:center;gap:16px;}.grade-badge{width:64px;height:64px;border:3px solid var(--clr-ink);background:var(--clr-accent);color:var(--clr-ink);font-family:var(--font-header);font-size:2.3rem;font-weight:900;display:flex;align-items:center;justify-content:center;box-shadow:4px 4px 0 var(--clr-ink);flex-shrink:0;transform:rotate(-2deg);animation:gradeStamp 0.5s cubic-bezier(0.175,0.885,0.32,1.275) 0.15s backwards;}@keyframes gradeStamp{0%{opacity:0;transform:scale(2.2) rotate(15deg);}70%{transform:scale(0.9) rotate(-4deg);}100%{opacity:1;transform:scale(1) rotate(-2deg);}}.grade-badge.grade-b{background:var(--clr-cyan);}.grade-badge.grade-c{background:var(--clr-yellow);}.grade-badge.grade-d{background:var(--clr-error);color:#fff;}.grade-badge.grade-dev{background:#e0e0e0;color:#222;font-size:1.4rem;}.summary-title-wrap{flex:1;}.summary-title{font-family:var(--font-header);font-size:1.35rem;font-weight:900;letter-spacing:0.5px;color:var(--clr-ink);margin-bottom:3px;}.summary-sub{font-size:0.84rem;font-weight:700;color:#555;line-height:1.35;}.hidden{display:none !important;}@media (max-width:600px){.container{padding:0 4px;}.card{padding:16px 12px;box-shadow:6px 6px 0 var(--clr-ink);}.logo-text{font-size:2.2rem;}.gauge-speed-val{font-size:2.8rem;}.stage-bar{gap:4px;padding:4px;}.stage-step{font-size:0.68rem;gap:3px;padding:4px 2px;}.stage-step .step-num{width:15px;height:15px;font-size:0.65rem;}.metrics-grid{grid-template-columns:1fr 1fr;gap:6px;}.metric-box{padding:8px 10px;}.metric-value{font-size:1.4rem;}.server-info-strip{font-size:0.74rem;padding:6px 10px;}.main-action-btn{font-size:1.25rem;padding:12px 14px;}.results-actions{grid-template-columns:1fr;gap:8px;}.grade-badge{width:50px;height:50px;font-size:1.8rem;}.summary-title{font-size:1.1rem;}.summary-sub{font-size:0.76rem;}}