:root{--ht-primary:#6366f1;--ht-primary-hover:#4f46e5;--ht-primary-bg:#6366f114;--ht-primary-shadow:#6366f133;--ht-bg:#fff;--ht-bg-secondary:#f8fafc;--ht-bg-tertiary:#f1f5f9;--ht-text:#1e293b;--ht-text-secondary:#475569;--ht-text-muted:#64748b;--ht-border:#e2e8f0;--ht-border-light:#f1f5f9;--ht-shadow-sm:0 1px 2px #0000000a;--ht-shadow:0 1px 3px #0000000f, 0 1px 2px #0000000a;--ht-shadow-md:0 4px 6px -1px #00000012, 0 2px 4px -1px #0000000a;--ht-shadow-lg:0 10px 15px -3px #00000014, 0 4px 6px -2px #0000000a;--ht-shadow-focus:0 0 0 3px var(--ht-primary-shadow);--ht-radius:.75rem;--ht-radius-lg:1rem;--ht-radius-sm:.5rem;--ht-radius-full:9999px;--ht-right-color:#ef4444;--ht-right-bg:#ef444414;--ht-left-color:#3b82f6;--ht-left-bg:#3b82f614;--ht-success:#10b981;--ht-success-bg:#10b98114;--ht-warning:#f59e0b;--ht-warning-bg:#f59e0b14;--ht-danger:#ef4444;--ht-danger-bg:#ef444414}._ht-container{flex-direction:column;align-items:center;min-height:400px;display:flex}._ht-screen{flex-direction:column;align-items:center;width:100%;display:none}._ht-screen._ht-screen--active{display:flex}._ht-card{background:var(--ht-bg);border-radius:var(--ht-radius-lg);border-style:solid;border-width:1px;border-color:var(--ht-border);box-shadow:var(--ht-shadow-md);padding:var(--main-space-6,1.5rem);width:100%}._ht-btn{border-radius:var(--ht-radius);cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;border-width:0;justify-content:center;align-items:center;gap:.5rem;padding:.625rem 1.5rem;font-size:.9375rem;font-weight:500;transition:opacity .15s,box-shadow .15s;display:inline-flex}._ht-btn:disabled{opacity:.4;cursor:not-allowed}._ht-btn-primary{background:var(--ht-primary);color:#fff;box-shadow:0 2px 8px var(--ht-primary-shadow)}@media (hover:hover){._ht-btn-primary:hover:not(:disabled){opacity:.9}}._ht-btn-primary:focus-visible{outline:2px solid var(--ht-primary);outline-offset:2px}._ht-disclaimer{background:var(--ht-bg-tertiary);border-radius:var(--ht-radius-sm);color:var(--ht-text-muted);align-items:flex-start;gap:.5rem;padding:.75rem 1rem;font-size:.8125rem;line-height:1.5;display:flex}._ht-disclaimer svg{opacity:.6;flex-shrink:0;margin-top:2px}._ht-disclaimer-bottom{margin-top:var(--main-space-4,1rem);width:100%;max-width:680px}@media (max-width:768px){._ht-container{padding-left:1rem;padding-right:1rem}._ht-card{padding:var(--main-space-4,1rem)}}@media (max-width:480px){._ht-container{padding-left:.75rem;padding-right:.75rem}._ht-card{padding:var(--main-space-3,.875rem);border-radius:var(--ht-radius)}._ht-disclaimer{padding:.625rem .75rem;font-size:.75rem}}._ht-setup-card{text-align:center;align-items:center;gap:var(--main-space-4,1rem);flex-direction:column;max-width:520px;display:flex}._ht-setup-icon{border-radius:var(--ht-radius-full);background:var(--ht-primary-bg);width:80px;height:80px;color:var(--ht-primary);justify-content:center;align-items:center;display:flex}._ht-setup-title{color:var(--ht-text);margin:0;font-size:1.375rem;font-weight:700}._ht-setup-desc{color:var(--ht-text-secondary);margin:0;font-size:.9375rem;line-height:1.6}._ht-checklist{text-align:left;width:100%;margin:0;padding:0;list-style:none}._ht-checklist li{color:var(--ht-text-secondary);border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:var(--ht-border-light);align-items:center;gap:.75rem;padding:.625rem 0;font-size:.9375rem;display:flex}._ht-checklist li:last-child{border-bottom-width:0}._ht-checklist-icon{border-radius:var(--ht-radius-sm);background:var(--ht-bg-tertiary);width:32px;height:32px;color:var(--ht-text-muted);flex-shrink:0;justify-content:center;align-items:center;display:flex}._ht-setup-card ._ht-btn-primary{width:100%;margin-top:var(--main-space-2,.5rem);padding:.75rem 1.5rem;font-size:1rem}@media (max-width:480px){._ht-setup-title{font-size:1.25rem}._ht-setup-icon{width:64px;height:64px}._ht-setup-icon svg{width:32px;height:32px}._ht-setup-desc{font-size:.875rem}._ht-checklist li{gap:.625rem;padding:.5rem 0;font-size:.875rem}._ht-checklist-icon{width:28px;height:28px}._ht-setup-card ._ht-btn-primary{min-height:48px;padding:.875rem 1.5rem}}._ht-progress-wrapper{width:100%;max-width:480px;margin-bottom:var(--main-space-4,1rem);align-items:center;gap:.75rem;display:flex}._ht-progress-bar{background:var(--ht-bg-tertiary);border-radius:var(--ht-radius-full);flex:1;height:6px;overflow:hidden}._ht-progress-fill{background:var(--ht-primary);border-radius:var(--ht-radius-full);width:0%;height:100%;transition:width .3s}._ht-progress-text{color:var(--ht-text-muted);white-space:nowrap;font-size:.8125rem;font-weight:500;font-family:var(--main-font-mono)}._ht-test-card{text-align:center;align-items:center;gap:var(--main-space-4,1rem);flex-direction:column;max-width:480px;display:flex}._ht-ear-badge{border-radius:var(--ht-radius-full);align-items:center;gap:.5rem;padding:.375rem 1rem;font-size:.875rem;font-weight:600;display:inline-flex}._ht-ear-badge[data-ear=right]{background:var(--ht-right-bg);color:var(--ht-right-color)}._ht-ear-badge[data-ear=left]{background:var(--ht-left-bg);color:var(--ht-left-color)}._ht-ear-dot{border-radius:var(--ht-radius-full);width:8px;height:8px;display:inline-block}._ht-ear-badge[data-ear=right] ._ht-ear-dot{background:var(--ht-right-color)}._ht-ear-badge[data-ear=left] ._ht-ear-dot{background:var(--ht-left-color)}._ht-freq-display{align-items:baseline;gap:.25rem;display:flex}._ht-freq-value{color:var(--ht-text);font-size:3rem;font-weight:800;line-height:1;font-family:var(--main-font-mono)}._ht-freq-unit{color:var(--ht-text-muted);font-size:1.25rem;font-weight:500}._ht-btn-play{border-radius:var(--ht-radius-full);background:var(--ht-primary);color:#fff;cursor:pointer;width:120px;height:120px;box-shadow:0 4px 16px var(--ht-primary-shadow);-webkit-tap-highlight-color:transparent;touch-action:manipulation;border-width:0;flex-direction:column;justify-content:center;align-items:center;gap:.375rem;transition:opacity .15s,box-shadow .15s;display:flex}@media (hover:hover){._ht-btn-play:hover:not(:disabled){opacity:.9;box-shadow:0 6px 20px var(--ht-primary-shadow)}}._ht-btn-play:disabled{opacity:.5;cursor:not-allowed}._ht-btn-play:focus-visible{outline:2px solid var(--ht-primary);outline-offset:3px}._ht-btn-play-icon{display:flex}._ht-btn-play-label{text-transform:uppercase;letter-spacing:.05em;font-size:.75rem;font-weight:600}._ht-btn-play._ht-playing{animation:1.5s ease-in-out infinite _ht-pulse}@keyframes _ht-pulse{0%,to{box-shadow:0 4px 16px var(--ht-primary-shadow)}50%{box-shadow:0 4px 30px var(--ht-primary-shadow), 0 0 0 8px var(--ht-primary-bg)}}._ht-volume-indicator{align-items:center;gap:.625rem;display:flex}._ht-volume-label{color:var(--ht-text-muted);font-size:.8125rem;font-weight:500}._ht-volume-dots{align-items:center;gap:4px;display:flex}._ht-vol-dot{border-radius:var(--ht-radius-full);background:var(--ht-border);width:6px;height:6px;transition:background .2s}._ht-vol-dot._ht-vol-active{background:var(--ht-primary)}._ht-response{gap:.75rem;width:100%;display:flex}._ht-btn-hear,._ht-btn-nohear{flex:1;padding:.75rem 1rem}._ht-btn-hear{background:var(--ht-success-bg);color:var(--ht-success);border:1px solid #10b98133}@media (hover:hover){._ht-btn-hear:hover:not(:disabled){opacity:.85}}._ht-btn-nohear{background:var(--ht-bg-tertiary);color:var(--ht-text-secondary);border-style:solid;border-width:1px;border-color:var(--ht-border)}@media (hover:hover){._ht-btn-nohear:hover:not(:disabled){background:var(--ht-border-light)}}._ht-btn-hear,._ht-btn-nohear{min-height:44px}@media (max-width:480px){._ht-progress-wrapper{margin-bottom:var(--main-space-3,.75rem);gap:.5rem}._ht-progress-text{font-size:.75rem}._ht-freq-value{font-size:2.5rem}._ht-freq-unit{font-size:1.125rem}._ht-btn-play{width:104px;height:104px}._ht-response{flex-direction:column;gap:.5rem}._ht-btn-hear,._ht-btn-nohear{min-height:48px}._ht-volume-indicator{gap:.5rem}}@media (max-width:360px){._ht-freq-value{font-size:2rem}._ht-freq-unit{font-size:1rem}._ht-btn-play{width:92px;height:92px}._ht-vol-dot{width:5px;height:5px}}._ht-results-card{align-items:center;gap:var(--main-space-4,1rem);flex-direction:column;max-width:680px;display:flex}._ht-results-title{color:var(--ht-text);margin:0;font-size:1.25rem;font-weight:700}._ht-audiogram-wrapper{width:100%;position:relative;overflow:hidden}#_ht-audiogram{touch-action:pan-y;width:100%;max-width:100%;height:320px;display:block}._ht-legend{justify-content:center;gap:1.5rem;display:flex}._ht-legend-item{color:var(--ht-text-secondary);align-items:center;gap:.5rem;font-size:.875rem;font-weight:500;display:flex}._ht-legend-marker{width:24px;height:24px;font-size:.875rem;font-weight:700;font-family:var(--main-font-mono);justify-content:center;align-items:center;display:flex}._ht-legend-right{color:var(--ht-right-color)}._ht-legend-left{color:var(--ht-left-color)}._ht-summary{gap:.75rem;width:100%;min-height:100px;display:flex}._ht-ear-result{border-radius:var(--ht-radius);text-align:center;border-style:solid;border-width:1px;flex:1;padding:1rem}._ht-ear-result-right{background:var(--ht-right-bg);border-color:#ef444433}._ht-ear-result-left{background:var(--ht-left-bg);border-color:#3b82f633}._ht-ear-result-header{color:var(--ht-text-secondary);justify-content:center;align-items:center;gap:.375rem;margin-bottom:.5rem;font-size:.8125rem;font-weight:600;display:flex}._ht-ear-result-dot{border-radius:var(--ht-radius-full);width:8px;height:8px;display:inline-block}._ht-ear-result-right ._ht-ear-result-dot{background:var(--ht-right-color)}._ht-ear-result-left ._ht-ear-result-dot{background:var(--ht-left-color)}._ht-ear-result-level{margin-bottom:.25rem;font-size:1.125rem;font-weight:700}._ht-ear-result-avg{color:var(--ht-text-muted);font-size:.8125rem;font-family:var(--main-font-mono)}._ht-actions{gap:.75rem;display:flex}._ht-actions ._ht-btn-primary{padding:.625rem 2rem}@media (max-width:480px){._ht-results-title{font-size:1.125rem}#_ht-audiogram{height:240px}._ht-legend{flex-wrap:wrap;gap:1rem}._ht-legend-item{font-size:.8125rem}._ht-summary{flex-direction:column;gap:.5rem}._ht-ear-result{padding:.75rem}._ht-ear-result-level{font-size:1rem}._ht-actions ._ht-btn-primary{min-height:44px;padding:.75rem 2rem}}@media (max-width:360px){#_ht-audiogram{height:220px}}