*,:before,:after{box-sizing:border-box}body{margin:0}#root{min-height:100vh}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{color:#c9d1d9;background:#080b10;justify-content:center;align-items:flex-start;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Inter,sans-serif;display:flex}.app{flex-direction:column;align-items:center;gap:1.5rem;width:100%;max-width:660px;padding:3rem 1.5rem 4rem;display:flex}header{text-align:center}.logo-row{justify-content:center;align-items:center;gap:.65rem;margin-bottom:.4rem;display:flex}h1{color:#f0f6fc;letter-spacing:-.02em;font-size:1.9rem;font-weight:700}.subtitle{color:#4d5966;font-size:.88rem}.pulse-dot{background:#2d3748;border-radius:50%;width:10px;height:10px;transition:background .3s}.pulse-dot.live{background:#4ade80;animation:1.4s infinite dot-pulse;box-shadow:0 0 #4ade8060}@keyframes dot-pulse{0%{box-shadow:0 0 #4ade8060}70%{box-shadow:0 0 0 8px #4ade8000}to{box-shadow:0 0 #4ade8000}}.badge{border-radius:999px;padding:.3rem .9rem;font-size:.82rem;font-weight:500;display:inline-block}.badge.grey{color:#6e7681;background:#161b22;border:1px solid #21262d}.badge.green{color:#4ade80;background:#0d2018;border:1px solid #1a4030}.badge.red{color:#f87171;background:#2d1015;border:1px solid #4d1a1a}.pulse-badge{animation:1.6s ease-in-out infinite badge-blink}@keyframes badge-blink{0%,to{opacity:1}50%{opacity:.65}}.mic-btn{cursor:pointer;color:#c9d1d9;background:#0d1117;border:2px solid #21262d;border-radius:999px;align-items:center;gap:.6rem;padding:.85rem 2.2rem;font-size:1rem;font-weight:600;transition:all .18s;display:flex}.mic-btn:hover:not(:disabled){color:#4ade80;border-color:#4ade80}.mic-btn.stop{color:#f87171;border-color:#f87171}.mic-btn.stop:hover:not(:disabled){background:#2d1015}.mic-btn:disabled{opacity:.35;cursor:not-allowed}.btn-icon{font-size:.9rem}.viz-block{background:#0d1117;border:1px solid #21262d;border-radius:14px;flex-direction:column;gap:.75rem;width:100%;padding:1rem 1.25rem;display:flex}.meter-row{align-items:center;gap:.75rem;display:flex}.meter-label{color:#4d5966;letter-spacing:.08em;flex-shrink:0;font-size:.7rem;font-weight:600}.volume-track{background:#161b22;border-radius:3px;flex:1;height:5px;overflow:hidden}.volume-fill{background:linear-gradient(90deg,#4ade80,#22d3ee);border-radius:3px;height:100%;transition:width .1s linear}.distance-zones{flex:1;align-items:center;gap:.45rem;display:flex}.dzone-dot{background:#1f2937;border-radius:50%;width:9px;height:9px;transition:background .2s,box-shadow .2s,transform .2s}.dzone-dot.active{transform:scale(1.35)}.distance-tag{letter-spacing:.04em;color:#4d5966;text-align:right;width:6rem;font-size:.72rem;font-weight:600;transition:color .2s}.direction-track{background:#161b22;border-radius:3px;flex:1;height:5px;position:relative}.direction-center{background:#4d5966;width:2px;height:10px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.direction-indicator{background:#22d3ee;border-radius:50%;width:8px;height:8px;transition:left .15s ease-out;position:absolute;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 6px 2px #22d3ee55}.direction-tag{letter-spacing:.04em;color:#22d3ee;text-align:right;width:3.5rem;font-size:.72rem;font-weight:600}.waveform{border-radius:6px;width:100%;height:100px;display:block}.top-result{border:1px solid var(--cat-color,#21262d);width:100%;box-shadow:0 0 20px -8px var(--cat-color,transparent);background:#0d1117;border-radius:14px;align-items:center;gap:1rem;padding:1.1rem 1.4rem;display:flex}.top-category{letter-spacing:.12em;color:var(--cat-color);background:color-mix(in srgb, var(--cat-color) 12%, transparent);border-radius:999px;flex-shrink:0;padding:.2rem .6rem;font-size:.68rem;font-weight:700}.top-label{color:#f0f6fc;flex:1;font-size:1.05rem;font-weight:600}.top-score{color:var(--cat-color);font-variant-numeric:tabular-nums;font-size:1rem;font-weight:700}.predictions{background:#0d1117;border:1px solid #21262d;border-radius:14px;flex-direction:column;gap:.9rem;width:100%;padding:1.1rem 1.4rem;display:flex}.section-title{color:#4d5966;text-transform:uppercase;letter-spacing:.1em;margin-bottom:.1rem;font-size:.72rem;font-weight:600}.pred-row{flex-direction:column;gap:.3rem;display:flex}.pred-meta{align-items:center;gap:.5rem;display:flex}.cat-dot{border-radius:50%;flex-shrink:0;width:7px;height:7px}.pred-label{color:#c9d1d9;flex:1;font-size:.9rem}.pred-pct{color:#6e7681;font-variant-numeric:tabular-nums;font-size:.82rem}.pred-track{background:#161b22;border-radius:2px;height:4px;overflow:hidden}.pred-fill{border-radius:2px;height:100%;transition:width .35s}.hint{color:#4d5966;text-align:center;margin-top:.5rem;font-size:.88rem}.android-tip-banner{background:#0d1a2a;border:1px solid #1e3a5f;border-radius:14px;align-items:flex-start;gap:.75rem;width:100%;padding:1rem 1.25rem;display:flex}.android-tip-content{flex-direction:column;flex:1;gap:.45rem;display:flex}.android-tip-title{text-transform:uppercase;letter-spacing:.1em;color:#60a5fa;margin:0;font-size:.75rem;font-weight:700}.android-tip-body{color:#8b9cbf;margin:0;font-size:.84rem;line-height:1.5}.android-tip-body code{color:#93c5fd;word-break:break-all;background:#0a1628;border:1px solid #1e3a5f;border-radius:4px;padding:.1em .35em;font-size:.78rem}.android-tip-body strong{color:#bfdbfe;font-weight:600}.stt-section{background:#0d1117;border:1px solid #21262d;border-radius:14px;flex-direction:column;gap:1rem;width:100%;padding:1.25rem;display:flex}.stt-header{justify-content:space-between;align-items:center;display:flex}.stt-header h2{color:#f0f6fc;margin:0;font-size:1.1rem;font-weight:600}.stt-status{border-radius:999px;padding:.25rem .6rem;font-size:.75rem;font-weight:500}.stt-status.loading{color:#9ca3af;background:#1f2937}.stt-status.ready{color:#6ee7b7;background:#064e3b}.stt-status.error{color:#fca5a5;background:#7f1d1d}.stt-btn{cursor:pointer;border:none;border-radius:10px;justify-content:center;align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-size:.95rem;font-weight:600;transition:all .2s;display:flex}.stt-btn.start{color:#0d1117;background:linear-gradient(135deg,#4ade80,#22d3ee)}.stt-btn.stop{color:#0d1117;background:#f87171}.stt-btn:disabled{opacity:.5;cursor:not-allowed}.transcript-box{background:#161b22;border:1px solid #30363d;border-radius:10px;flex-direction:column;gap:.75rem;padding:1rem;display:flex}.transcript-text{color:#f0f6fc;margin:0;font-size:1rem;line-height:1.6}.clear-btn{color:#8b949e;cursor:pointer;background:0 0;border:1px solid #30363d;border-radius:6px;align-self:flex-end;padding:.4rem .8rem;font-size:.8rem;transition:all .2s}.clear-btn:hover{color:#c9d1d9;background:#21262d}.android-tip-dismiss{color:#3d5a80;cursor:pointer;background:0 0;border:none;border-radius:4px;flex-shrink:0;padding:.15rem .3rem;font-size:1rem;transition:color .15s}.android-tip-dismiss:hover{color:#60a5fa}