:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#f3f5f7;background:#101116;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#101116}body{min-height:100dvh}.app{max-width:520px;min-height:100dvh;margin:auto;padding:max(22px,env(safe-area-inset-top)) 22px max(18px,env(safe-area-inset-bottom));display:flex;flex-direction:column}.header{display:flex;justify-content:space-between;align-items:center;gap:12px}.brand{font-size:21px;font-weight:850;letter-spacing:-.9px;white-space:nowrap}.brand>span:not(.brand-icon){color:#d6ff71}.brand-icon{color:#d6ff71;margin-right:5px}.connection{font-size:11px;border-radius:24px;border:1px solid #383d42;padding:7px 9px;color:#acb2ba;text-align:right}.connection.connected{color:#bbf4a4;border-color:#426742}.eyebrow{margin:36px 0 5px;color:#d6ff71;font-size:11px;letter-spacing:2px;font-weight:850}.recorder h1{font-size:clamp(27px,7vw,38px);letter-spacing:-1.3px;line-height:1.18;margin:0 0 9px}.instruction{margin:0;color:#aab0b9;line-height:1.5;font-size:14px}.control-area{display:flex;align-items:center;flex-direction:column;gap:15px;padding:42px 0 31px}.record-button{height:132px;width:132px;border-radius:50%;border:2px solid #bced58;background:radial-gradient(circle at 45% 25%,#3a4b21,#202a18 62%);box-shadow:0 0 0 11px #1b2417,0 0 36px #95c65019;display:flex;align-items:center;justify-content:center;color:#d6ff71;cursor:pointer;touch-action:manipulation;transition:transform .14s,background .14s}.record-button:active{transform:scale(.96)}.record-button:disabled{opacity:.4;cursor:not-allowed}.record-button svg{height:54px;width:54px}.record-button.recording{color:#fff;background:#a82e40;border-color:#f45d71;box-shadow:0 0 0 11px #431e28,0 0 30px #f45d7140}.record-button.recording #stop-icon{display:block}.record-button.recording #mic-icon{display:none}.record-button:not(.recording) #stop-icon{display:none}.timer{font-size:42px;font-variant-numeric:tabular-nums;font-weight:730;letter-spacing:1px}.record-status{font-size:13px;color:#9ba2ab}.recording~.record-status{color:#fe8192}.meter{height:7px;background:#32383a;border-radius:10px;width:185px;overflow:hidden}.meter-fill{width:0;height:100%;background:#d6ff71;border-radius:10px;transition:width 80ms}.after-record{border:1px solid #34383b;padding:17px;background:#1b1d23;border-radius:16px}.after-record label{display:block;margin-bottom:10px;font-size:13px;font-weight:750}.optional{font-size:12px;color:#a4acb4;font-weight:400}.after-record input{display:block;width:100%;height:49px;border:1px solid #565c62;border-radius:9px;padding:0 12px;background:#101116;color:#fff;font:inherit;font-size:16px;outline:none}.after-record input:focus{border-color:#d6ff71}.after-record audio{display:block;margin:17px 0;width:100%;height:44px}.save-button{width:100%;margin-top:14px;padding:16px;border:0;border-radius:10px;background:#d6ff71;color:#101116;font-weight:850;font-size:15px;cursor:pointer;touch-action:manipulation}.save-button:disabled{opacity:.55;cursor:not-allowed}.secondary-button{background:transparent;color:#c5cbd1;border:0;font-size:13px;cursor:pointer;display:block;margin:15px auto 3px;padding:8px}.message{min-height:25px;color:#d6ff71;font-size:13px;text-align:center;margin-top:12px;line-height:1.5}.message.error{color:#ff8990}.signin{margin-top:22px}.recovery{padding:16px;border:1px solid #484d50;border-radius:12px;margin-top:12px;text-align:center}.recovery p{margin:0 0 10px;color:#b8c2c8;font-size:13px}.footer{margin-top:auto;text-align:center;font-size:11px;line-height:1.6;color:#6f7884;padding-top:28px}@media(max-height:660px){.control-area{padding:24px 0 20px;gap:10px}.record-button{width:104px;height:104px}.record-button svg{width:42px;height:42px}.eyebrow{margin-top:20px}}[hidden]{display:none!important}:focus-visible{outline:2px solid #d6ff71;outline-offset:3px}