:root{--bg-primary: #0a0e17;--bg-surface: rgba(15, 23, 42, .75);--bg-surface-hover: rgba(30, 41, 59, .75);--dl-primary: #38bdf8;--dl-secondary: #06b6d4;--dl-glow: rgba(56, 189, 248, .15);--dl-border: rgba(56, 189, 248, .2);--ul-primary: #a78bfa;--ul-secondary: #8b5cf6;--ul-glow: rgba(167, 139, 250, .15);--ul-border: rgba(167, 139, 250, .2);--shared-primary: #fbbf24;--shared-border: rgba(251, 191, 36, .2);--shared-glow: rgba(251, 191, 36, .15);--text-primary: #f1f5f9;--text-secondary: #94a3b8;--text-muted: #475569;--error: #f87171;--success: #34d399;--radius: 16px;--radius-sm: 10px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;background:var(--bg-primary);color:var(--text-primary);min-height:100vh;background-image:radial-gradient(ellipse 80% 60% at 50% -20%,rgba(56,189,248,.08),transparent),radial-gradient(ellipse 60% 50% at 80% 50%,rgba(167,139,250,.06),transparent)}#root{min-height:100vh}.dashboard{max-width:1100px;margin:0 auto;padding:48px 24px 80px}.dashboard__header{text-align:center;margin-bottom:40px}.dashboard__title{font-size:2rem;font-weight:800;letter-spacing:-.03em;background:linear-gradient(135deg,var(--dl-primary),var(--ul-primary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;display:inline-flex;align-items:center;gap:12px}.dashboard__title-icon{font-size:1.4rem;-webkit-text-fill-color:var(--dl-primary);animation:pulse-glow 2s ease-in-out infinite}@keyframes pulse-glow{0%,to{opacity:1;filter:drop-shadow(0 0 4px var(--dl-primary))}50%{opacity:.6;filter:drop-shadow(0 0 8px var(--dl-primary))}}.dashboard__subtitle{color:var(--text-secondary);font-size:.9rem;margin-top:8px;font-weight:400}.config-panel{background:var(--bg-surface);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(148,163,184,.08);border-radius:var(--radius);padding:24px 28px;margin-bottom:32px;display:flex;flex-direction:column;gap:20px;animation:fadeInUp .3s ease}.config-group{display:flex;align-items:center;gap:16px}.config-label{font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--text-secondary);min-width:90px}.config-presets{display:flex;gap:8px;flex-wrap:wrap}.config-preset{background:#94a3b80f;border:1px solid rgba(148,163,184,.15);border-radius:8px;padding:8px 16px;font-family:inherit;font-size:.85rem;font-weight:500;color:var(--text-secondary);cursor:pointer;transition:all .2s ease}.config-preset:hover{background:#94a3b81f;color:var(--text-primary)}.config-preset--active{background:#38bdf81f;border-color:var(--dl-primary);color:var(--dl-primary)}.config-throughput{display:flex;align-items:center;gap:8px}.config-input{width:80px;padding:8px 12px;background:#94a3b80f;border:1px solid rgba(148,163,184,.15);border-radius:8px;font-family:inherit;font-size:.9rem;font-weight:600;color:var(--text-primary);text-align:center;font-variant-numeric:tabular-nums}.config-input:disabled{opacity:.3;cursor:not-allowed}.config-input:focus{outline:none;border-color:var(--dl-primary)}.config-unit{font-size:.8rem;color:var(--text-secondary);font-weight:500}.config-toggle{background:#94a3b80f;border:1px solid rgba(148,163,184,.15);border-radius:8px;padding:8px 16px;font-family:inherit;font-size:.85rem;font-weight:500;color:var(--text-secondary);cursor:pointer;transition:all .2s ease}.config-toggle:hover{background:#94a3b81f}.config-toggle--active{background:#fbbf241f;border-color:var(--shared-primary);color:var(--shared-primary)}.dashboard__controls{display:flex;flex-direction:column;align-items:center;gap:24px;margin-bottom:40px}.btn{border:none;border-radius:12px;padding:14px 40px;font-family:inherit;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease;letter-spacing:.02em}.btn--start{background:linear-gradient(135deg,var(--dl-secondary),var(--ul-secondary));color:#fff;box-shadow:0 4px 24px #38bdf840,0 2px 8px #8b5cf633}.btn--start:hover{transform:translateY(-2px);box-shadow:0 8px 32px #38bdf859,0 4px 12px #8b5cf64d}.btn--stop{background:#f8717126;color:var(--error);border:1px solid rgba(248,113,113,.3)}.btn--stop:hover{background:#f8717140}.connection-status{display:flex;align-items:center;justify-content:center}.progress-ring{position:relative;width:130px;height:130px}.progress-ring__svg{width:100%;height:100%;transform:rotate(-90deg)}.progress-ring__progress{transition:stroke-dashoffset .4s ease}.progress-ring__content{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.progress-ring__time{font-size:1.6rem;font-weight:700;color:var(--text-primary)}.progress-ring__total{font-size:.8rem;color:var(--text-secondary)}.progress-ring__state{font-size:.85rem;font-weight:600;color:var(--text-secondary)}.status--testing .progress-ring__state{color:var(--dl-primary)}.status--complete .progress-ring__state{color:var(--success)}.status--error .progress-ring__state{color:var(--error)}.error-banner{background:#f871711a;border:1px solid rgba(248,113,113,.3);border-radius:var(--radius-sm);padding:12px 20px;color:var(--error);font-size:.875rem;margin-bottom:24px;text-align:center}.metrics-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:32px}.metrics-section--shared{grid-column:1 / -1;display:flex;justify-content:center}.metrics-section--shared .metric-card{max-width:240px}.metrics-section__title{font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;margin-bottom:12px;padding-left:4px}.metrics-section__title--download{color:var(--dl-primary)}.metrics-section__title--upload{color:var(--ul-primary)}.metrics-section__cards{display:flex;flex-direction:column;gap:12px}.metric-card{background:var(--bg-surface);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-radius:var(--radius-sm);padding:16px 20px;border:1px solid rgba(148,163,184,.08);transition:all .25s ease}.metric-card:hover{background:var(--bg-surface-hover);transform:translateY(-1px)}.metric-card--download{border-color:var(--dl-border);box-shadow:0 2px 16px var(--dl-glow)}.metric-card--upload{border-color:var(--ul-border);box-shadow:0 2px 16px var(--ul-glow)}.metric-card--shared{border-color:var(--shared-border);box-shadow:0 2px 16px var(--shared-glow)}.metric-card__header{display:flex;align-items:center;gap:6px;margin-bottom:6px}.metric-card__icon{font-size:.75rem;opacity:.7}.metric-card__label{font-size:.75rem;font-weight:500;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.06em}.metric-card__value{font-size:1.75rem;font-weight:700;letter-spacing:-.02em;line-height:1.1}.metric-card--download .metric-card__value{color:var(--dl-primary)}.metric-card--upload .metric-card__value{color:var(--ul-primary)}.metric-card--shared .metric-card__value{color:var(--shared-primary)}.metric-card__unit{font-size:.8rem;font-weight:500;color:var(--text-secondary);margin-left:4px}.charts-grid{display:grid;grid-template-columns:1fr;gap:20px;margin-bottom:40px}.live-chart{background:var(--bg-surface);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(148,163,184,.08);border-radius:var(--radius);padding:20px}.live-chart__title{font-size:.85rem;font-weight:600;color:var(--text-secondary);margin-bottom:12px;text-transform:uppercase;letter-spacing:.06em}.connection-banner{display:flex;align-items:center;gap:10px;padding:12px 20px;margin-bottom:24px;background:#34d39914;border:1px solid rgba(52,211,153,.25);border-radius:var(--radius-sm);animation:fadeInUp .4s ease}.connection-banner__icon{font-size:1rem}.connection-banner__text{font-size:.85rem;color:var(--text-secondary)}.connection-banner__text strong{color:var(--success);text-transform:uppercase}.summary{background:var(--bg-surface);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(148,163,184,.08);border-radius:var(--radius);padding:32px;animation:fadeInUp .5s ease}@keyframes fadeInUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.summary__title{font-size:1.2rem;font-weight:700;margin-bottom:24px;text-align:center;background:linear-gradient(135deg,var(--dl-primary),var(--ul-primary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.connection-info{margin-bottom:24px;padding-bottom:24px;border-bottom:1px solid rgba(148,163,184,.1)}.connection-info__title{font-size:.9rem;font-weight:600;color:var(--success);margin-bottom:12px}.connection-info__grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}.connection-info__item{display:flex;flex-direction:column;gap:4px}.connection-info__label{font-size:.7rem;font-weight:500;text-transform:uppercase;letter-spacing:.06em;color:var(--text-secondary)}.connection-info__value{font-size:.85rem;font-weight:600;color:var(--text-primary);font-variant-numeric:tabular-nums}.rtt-stats{margin-bottom:24px;padding-bottom:24px;border-bottom:1px solid rgba(148,163,184,.1)}.rtt-stats__title{font-size:.9rem;font-weight:600;color:var(--shared-primary);margin-bottom:12px}.rtt-stats__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.rtt-stats__item{display:flex;flex-direction:column;align-items:center;gap:4px;background:#fbbf240f;border:1px solid rgba(251,191,36,.15);border-radius:var(--radius-sm);padding:12px 8px}.rtt-stats__label{font-size:.7rem;font-weight:500;text-transform:uppercase;letter-spacing:.06em;color:var(--text-secondary)}.rtt-stats__value{font-size:1.1rem;font-weight:700;color:var(--shared-primary);font-variant-numeric:tabular-nums}.summary__grid{display:grid;grid-template-columns:1fr 1fr;gap:32px}.summary__grid--single{grid-template-columns:1fr;max-width:480px;margin:0 auto}.summary-col__title{font-size:.9rem;font-weight:600;margin-bottom:16px;padding-bottom:8px;border-bottom:1px solid rgba(148,163,184,.1)}.summary-col--download .summary-col__title{color:var(--dl-primary)}.summary-col--upload .summary-col__title{color:var(--ul-primary)}.summary-table{width:100%;border-collapse:collapse}.summary-table td{padding:6px 0;font-size:.85rem}.summary-table td:first-child{color:var(--text-secondary)}.summary-table td:last-child{text-align:right;font-weight:600;font-variant-numeric:tabular-nums}.app-container{min-height:100vh}.mode-toggle{display:flex;justify-content:center;gap:4px;padding:24px 24px 0;max-width:860px;margin:0 auto}.mode-toggle__btn{background:#94a3b80f;border:1px solid rgba(148,163,184,.1);border-radius:8px 8px 0 0;padding:10px 24px;font-family:inherit;font-size:.85rem;font-weight:500;color:var(--text-secondary);cursor:pointer;transition:all .2s ease}.mode-toggle__btn:hover{background:#94a3b81f;color:var(--text-primary)}.mode-toggle__btn--active{background:var(--bg-surface);border-bottom-color:transparent;color:var(--dl-primary)}.healthcheck{max-width:860px;margin:0 auto;padding:32px 24px 60px}.hc-config{display:flex;flex-direction:column;align-items:center;gap:24px;margin-top:32px}.hc-direction-picker{display:grid;grid-template-columns:1fr 1fr;gap:16px;width:100%;max-width:520px}.hc-direction-btn{display:flex;flex-direction:column;align-items:center;gap:8px;padding:24px 16px;background:var(--bg-surface);border:2px solid rgba(148,163,184,.1);border-radius:var(--radius);cursor:pointer;transition:all .2s ease}.hc-direction-btn:hover{background:var(--bg-surface-hover);border-color:#94a3b833}.hc-direction-btn--active{border-color:var(--dl-primary);background:#38bdf80f}.hc-direction-btn__icon{font-size:2rem}.hc-direction-btn__label{font-size:1rem;font-weight:600;color:var(--text-primary)}.hc-direction-btn__desc{font-size:.8rem;color:var(--text-secondary);text-align:center}.hc-start-btn{font-size:1.1rem;padding:14px 48px}.hc-progress{margin-top:32px;display:flex;flex-direction:column;align-items:center;gap:24px}.hc-connecting{display:flex;align-items:center;gap:12px;color:var(--text-secondary);font-size:.9rem;animation:fadeInUp .3s ease}.hc-spinner{width:24px;height:24px;border:3px solid rgba(56,189,248,.2);border-top-color:var(--dl-primary);border-radius:50%;animation:spin .8s linear infinite}.hc-spinner--small{width:14px;height:14px;border-width:2px}@keyframes spin{to{transform:rotate(360deg)}}.hc-steps{width:100%;max-width:520px;display:flex;flex-direction:column;gap:8px}.hc-step{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--bg-surface);border:1px solid rgba(148,163,184,.08);border-radius:var(--radius-sm);transition:all .3s ease;animation:fadeInUp .3s ease}.hc-step--active{border-color:var(--dl-primary);background:#38bdf80f}.hc-step--passed{border-color:#34d3994d}.hc-step--failed{border-color:#f871714d;opacity:.7}.hc-step__indicator{width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;font-size:.85rem;font-weight:700;flex-shrink:0}.hc-step--pending .hc-step__indicator{color:var(--text-secondary)}.hc-step--passed .hc-step__indicator{background:#34d39926;color:var(--success)}.hc-step--failed .hc-step__indicator{background:#f8717126;color:var(--error)}.hc-step__info{display:flex;flex-direction:column;gap:2px;flex:1}.hc-step__label{font-size:.9rem;font-weight:600;color:var(--text-primary)}.hc-step__bitrate{font-size:.75rem;color:var(--text-secondary)}.hc-step__result{display:flex;gap:12px;font-size:.8rem;font-variant-numeric:tabular-nums;color:var(--text-secondary)}.hc-step__phase{font-size:.75rem;color:var(--dl-primary);font-weight:500;white-space:nowrap}.hc-result{margin-top:32px;animation:fadeInUp .4s ease}.hc-verdict{display:flex;align-items:center;gap:20px;padding:28px 32px;background:var(--bg-surface);border:1px solid rgba(148,163,184,.08);border-radius:var(--radius)}.hc-verdict--excellent,.hc-verdict--good{border-color:#34d39940;background:#34d3990a}.hc-verdict--fair{border-color:#fbbf2440;background:#fbbf240a}.hc-verdict--poor{border-color:#f8717140;background:#f871710a}.hc-verdict__emoji{font-size:2.5rem}.hc-verdict__text{display:flex;flex-direction:column;gap:4px}.hc-verdict__title{font-size:1.4rem;font-weight:700;margin:0;color:var(--text-primary)}.hc-verdict__desc{font-size:.95rem;color:var(--text-secondary);margin:0}.hc-verdict__bandwidth{font-size:.8rem;color:var(--text-secondary);margin:0;opacity:.7}.hc-details{margin-top:24px}.hc-details__title{font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--text-secondary);margin-bottom:12px}.hc-row--failed{opacity:.5}.error-banner{padding:12px 20px;margin-top:16px;background:#f8717114;border:1px solid rgba(248,113,113,.25);border-radius:var(--radius-sm);color:var(--error);font-size:.85rem}@media(max-width:768px){.dashboard{padding:24px 16px 60px}.dashboard__title{font-size:1.5rem}.metrics-grid,.summary__grid,.connection-info__grid{grid-template-columns:1fr}.rtt-stats__grid{grid-template-columns:repeat(2,1fr)}.metric-card__value{font-size:1.4rem}.hc-direction-picker{grid-template-columns:1fr;max-width:300px}.hc-verdict{flex-direction:column;text-align:center}.mode-toggle{padding:16px 16px 0}}