@font-face{font-family:Outfit;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/b2ea385cb5ae8625-s.0kjod.kaq1k69.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Outfit;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/1b99372b3eaef0c8-s.p.0gx2haw2tmll8.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Outfit Fallback;src:local(Arial);ascent-override:100.18%;descent-override:26.05%;line-gap-override:0.0%;size-adjust:99.82%}.outfit_8778cd42-module__wRojWG__className{font-family:Outfit,Outfit Fallback;font-style:normal}.outfit_8778cd42-module__wRojWG__variable{--font-outfit:"Outfit", "Outfit Fallback"}
:root{--background:#050510;--foreground:#fff;--primary:#d1d5db;--primary-hover:#9ca3af;--visualizer-bar:#cbd5e1;--glass-bg:#ffffff05;--glass-border:#ffffff14;--danger:#ef4444;--success:#10b981}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--background);color:var(--foreground);font-family:var(--font-outfit), sans-serif;background-image:linear-gradient(#05051099 0%,#050510f2 100%),url(https://images.unsplash.com/photo-1506703719100-a0f3a48c0f86?q=80&w=2000&auto=format&fit=crop);background-position:50%;background-size:cover;background-attachment:fixed;flex-direction:column;justify-content:center;align-items:center;min-height:100vh;display:flex}h1{background:linear-gradient(to right, var(--primary), var(--primary-hover));-webkit-text-fill-color:transparent;letter-spacing:-.5px;filter:drop-shadow(0 2px 4px #00000080);-webkit-background-clip:text;background-clip:text;margin-bottom:.5rem;font-size:2.2rem;font-weight:700}p.subtitle{color:#fffffff2;text-shadow:0 2px 4px #000000e6;margin-bottom:1rem;font-size:1rem;font-weight:500}.sr-only{clip:rect(0, 0, 0, 0);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.glass-panel{background:var(--glass-bg);-webkit-backdrop-filter:blur(24px);border:1px solid var(--glass-border);z-index:10;border-radius:16px;width:100%;max-width:580px;padding:3rem;position:relative;box-shadow:0 30px 60px #0009,inset 0 1px #ffffff1a}.reflection-wrapper{perspective:1000px;-webkit-box-reflect:below 5px linear-gradient(to bottom, transparent 60%, #ffffff26)}.status-badge{color:#ffffff80;background:#0000004d;border:1px solid #ffffff0d;border-radius:9999px;align-items:center;gap:.5rem;margin-bottom:2rem;padding:.4rem 1.2rem;font-size:.85rem;display:inline-flex}.device-controls{text-align:left;margin-bottom:1rem}.device-label{color:#ffffffbf;margin-bottom:.5rem;font-size:.85rem;display:block}.device-row{align-items:center;gap:.6rem;display:flex}.device-select{color:#ffffffe6;background:#00000073;border:1px solid #ffffff26;border-radius:10px;flex:1;min-width:0;padding:.55rem .75rem;font-family:inherit;font-size:.9rem}.device-select:disabled{opacity:.6;cursor:not-allowed}.device-help{color:#ffffffd6;margin-top:.6rem;margin-bottom:.5rem;font-size:.84rem;line-height:1.45}.level-panel{background:#0000003d;border:1px solid #ffffff14;border-radius:12px;margin-bottom:1rem;padding:.7rem .8rem}.level-head{color:#ffffffbf;justify-content:space-between;align-items:center;margin-bottom:.45rem;font-size:.8rem;display:flex}.level-track{background:#ffffff14;border:1px solid #ffffff14;border-radius:999px;width:100%;height:10px;overflow:hidden}.recommendation{color:#ffffffe6;text-align:left;background:#ffffff0a;border:1px solid #ffffff17;border-radius:8px;margin-top:.65rem;padding:.5rem .65rem;font-size:.84rem;line-height:1.45}.level-fill{border-radius:inherit;height:100%;transition:width .1s linear}.level-fill.silent{background:#ffffff38}.level-fill.low{background:linear-gradient(90deg,#38bdf8,#22d3ee)}.level-fill.good{background:linear-gradient(90deg,#14b8a6,#22c55e)}.level-fill.loud{background:linear-gradient(90deg,#f59e0b,#f97316)}.level-fill.clipping{background:linear-gradient(90deg,#f97316,#ef4444)}.status-badge.active{color:#fff;background:#cbd5e11f;border-color:#cbd5e180;box-shadow:0 0 15px #cbd5e133}.status-icon{background:#fff3;border-radius:50%;width:14px;height:14px}.status-icon.recording{background:var(--danger);box-shadow:0 0 10px var(--danger);animation:1.5s infinite pulse-red}.status-icon.active{background:var(--success);box-shadow:0 0 10px var(--success)}@keyframes pulse-red{0%{transform:scale(.95);box-shadow:0 0 #ef4444b3}70%{transform:scale(1);box-shadow:0 0 0 8px #ef444400}to{transform:scale(.95);box-shadow:0 0 #ef444400}}.visualizer-container{background:linear-gradient(135deg,#ffffff05 0%,#fff0 100%),#0000004d;border:1px solid #ffffff1a;border-radius:12px;width:100%;height:140px;margin-bottom:2rem;position:relative;overflow:hidden;box-shadow:inset 0 0 20px #00000080}canvas.visualizer{width:100%;height:100%;display:block}.controls-row{justify-content:center;align-items:center;gap:1rem;margin-bottom:2rem;display:flex}.controls-row.footer{margin-top:1.5rem;margin-bottom:0}.btn-outline{color:#fffc;cursor:pointer;background:#0006;border:1px solid #ffffff1a;border-radius:9999px;align-items:center;gap:.5rem;padding:.6rem 1.4rem;font-family:inherit;font-size:.9rem;transition:all .2s;display:inline-flex}.btn-outline:hover{color:#fff;background:#ffffff0d;border-color:#fff3}.btn-outline:focus-visible,.device-select:focus-visible{outline-offset:2px;outline:2px solid #cbd5e1f2}.btn-outline.red:hover{color:#fca5a5;background:#ef44441a;border-color:#ef444480;box-shadow:0 0 15px #ef444433}.btn-outline.blue:hover{color:#e2e8f0;background:#cbd5e124;border-color:#cbd5e180;box-shadow:0 0 15px #cbd5e133}.divider{background:linear-gradient(90deg,#0000,#ffffff1a,#0000);width:100%;height:1px;margin:1.5rem 0}audio{border-radius:9999px;outline:none;width:100%;height:36px}audio::-webkit-media-controls-panel{background-color:#ffffff1a}audio::-webkit-media-controls-current-time-display{color:#fffc}audio::-webkit-media-controls-time-remaining-display{color:#fffc}@media (max-width:720px){.glass-panel{padding:1.5rem}.controls-row{flex-direction:column;margin-bottom:1.2rem}.controls-row .btn-outline,.device-row .btn-outline{justify-content:center;width:100%}.device-row{flex-direction:column;align-items:stretch}}