:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#f5f6f7;font-synthesis:none;--surface:#111418;--surface-raised:#171b20;--line:#ffffff17;--muted:#929ba5;--accent:#ff4d55;--good:#42d58b;--warning:#ffba49;--radius:24px;background:#080a0c;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body{background:#080a0c;min-width:320px;min-height:100%;margin:0}body{background:radial-gradient(circle at 50% -10%,#ff4d551c,#0000 34rem),#080a0c;min-height:100vh;overflow-x:hidden}body.drawer-open{overflow:hidden}button,input,select{font:inherit}button{-webkit-tap-highlight-color:transparent}h1,h2,h3,p{margin:0}.recorder-view{width:min(100%,720px);min-height:100vh;padding:max(22px, env(safe-area-inset-top)) 18px max(28px, env(safe-area-inset-bottom));grid-template-rows:auto 1fr;margin:0 auto;display:grid}.minimal-header,.drawer-header,.section-heading,.session-top,.session-meta,.inline-actions{justify-content:space-between;align-items:center;gap:14px;display:flex}.minimal-header h1{letter-spacing:-.035em;font-size:20px}.advanced-button,.icon-button,.text-button,.secondary-button,.primary-small-button,.session-button{border:1px solid var(--line);color:#eef0f2;cursor:pointer;background:#111418d1}.advanced-button{min-height:38px;color:var(--muted);border-radius:999px;padding:8px 14px;font-size:12px;font-weight:700}.recorder-card{border:1px solid var(--line);background:#111418d1;border-radius:clamp(24px,6vw,36px);align-self:center;justify-items:center;width:100%;padding:clamp(36px,9vw,70px) clamp(22px,7vw,52px);display:grid;box-shadow:0 32px 100px #00000047}.timer{font-variant-numeric:tabular-nums;letter-spacing:-.07em;font-size:clamp(58px,17vw,108px);font-weight:760;line-height:1;display:block}.meter{background:#282d33;border-radius:99px;width:min(100%,480px);height:10px;margin:clamp(32px,7vw,52px) 0;overflow:hidden}.meter-fill{border-radius:inherit;background:linear-gradient(90deg, var(--good), #d7dc52, var(--accent));width:0;height:100%;transition:width 80ms linear}.record-button{color:#fff;background:var(--accent);cursor:pointer;border:0;border-radius:999px;justify-content:center;align-items:center;gap:12px;min-width:min(100%,250px);min-height:60px;padding:14px 25px;font-weight:760;display:inline-flex;box-shadow:0 14px 42px #ff4d5538}.session-controls{justify-items:center;gap:13px;width:100%;display:grid}.live-diagnostics{border:1px solid var(--line);background:#080a0cad;border-radius:16px;width:min(100%,540px);margin-top:clamp(26px,6vw,42px);overflow:hidden}.live-diagnostics-header,.live-title,.toggle-row{align-items:center;display:flex}.live-diagnostics-header{border-bottom:1px solid var(--line);justify-content:space-between;gap:14px;padding:12px 14px}.live-title{white-space:nowrap;gap:8px}.live-title strong,.live-summary{font-size:10px}.live-summary{color:var(--muted);font-variant-numeric:tabular-nums;text-align:right;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.live-dot{background:var(--good);border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 4px #42d58b1a}.recent-chunks{border-bottom:1px solid var(--line);background:#0d1013;gap:10px;padding:11px 8px 13px;display:grid}.recent-chunks-heading{justify-content:space-between;align-items:center;gap:12px;display:flex}.recent-chunks-heading strong,.recent-chunks-heading span{text-transform:uppercase;letter-spacing:.08em;font-size:8px}.recent-chunks-heading span{color:var(--muted)}.chunk-indicators{overscroll-behavior-x:contain;justify-content:flex-start;align-items:center;gap:2px;min-height:36px;display:flex;overflow-x:auto}.chunk-indicator{min-width:21px;color:var(--muted);flex:0 0 21px;justify-items:center;gap:4px;text-decoration:none;display:grid}.chunk-indicator i{color:#09100c;border:2px solid #737d87;border-radius:50%;place-items:center;width:17px;height:17px;font-size:10px;font-style:normal;font-weight:900;line-height:1;transition:border-color .12s,background .12s,transform .12s;display:grid}.chunk-indicator:hover i,.chunk-indicator:focus-visible i{transform:scale(1.12)}.chunk-indicator[data-delivery=recording] i{background:0 0;border-color:#737d87}.chunk-indicator[data-delivery=saved] i{background:#737d87;border-color:#737d87}.chunk-indicator[data-delivery=uploading] i{border-color:var(--warning);color:#fff1cb;background:#737d87}.chunk-indicator[data-delivery=retrying] i{border-color:var(--warning);color:#2a210d;background:var(--warning)}.chunk-indicator[data-delivery=sent] i{border-color:var(--good);background:var(--good)}.chunk-indicator[data-delivery=failed] i{border-color:var(--accent);color:#fff;background:var(--accent)}.chunk-indicator small{color:#69727b;font-variant-numeric:tabular-nums;text-overflow:ellipsis;max-width:100%;font-size:6.5px;overflow:hidden}.chunk-indicators-empty{width:100%;color:var(--muted);text-align:center;font-size:9px}.trace-list{overscroll-behavior:contain;scrollbar-gutter:stable;gap:9px;max-height:min(42vh,420px);padding:10px;display:grid;overflow-y:auto}.trace-card{border:1px solid var(--line);background:#090b0e;border-radius:11px;overflow:hidden}.trace-card>header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:12px;padding:9px 11px;display:flex}.trace-card>header>strong{font-variant-numeric:tabular-nums;font-size:10px}.trace-card>header>span{color:var(--muted);text-transform:uppercase;letter-spacing:.04em;align-items:center;gap:6px;font-size:8px;font-weight:750;display:flex;position:relative}.trace-card>header>span:before{content:"";background:#69727b;border-radius:50%;width:6px;height:6px}.trace-events{display:grid}.trace-event{border-bottom:1px solid #ffffff0b;gap:5px;padding:9px 11px 9px 20px;display:grid;position:relative}.trace-event:last-child{border-bottom:0}.trace-event:before{content:"";background:#69727b;border-radius:50%;width:5px;height:5px;position:absolute;top:13px;left:9px}.trace-card [data-state=success]:before{background:var(--good)}.trace-card [data-state=progress]:before{background:#67a7ff}.trace-card [data-state=warning]:before{background:var(--warning)}.trace-card [data-state=error]:before{background:var(--accent)}.trace-event-meta{grid-template-columns:42px 54px minmax(0,1fr);align-items:baseline;gap:7px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:8px;display:grid}.trace-event-meta code,.trace-event-meta time{color:#69727b;font:inherit;font-variant-numeric:tabular-nums}.trace-event-meta strong{color:#cbd0d5;text-transform:uppercase}.trace-event[data-state=success] .trace-event-meta strong{color:var(--good)}.trace-event[data-state=progress] .trace-event-meta strong{color:#78b2ff}.trace-event[data-state=warning] .trace-event-meta strong{color:var(--warning)}.trace-event[data-state=error] .trace-event-meta strong{color:#ff737b}.trace-event p{color:#aeb5bc;overflow-wrap:anywhere;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:8px;line-height:1.5}.activity-empty{color:var(--muted);text-align:center;padding:15px;font-size:10px}.finish-session-button{border:1px solid var(--line);min-height:40px;color:var(--muted);cursor:pointer;background:0 0;border-radius:999px;padding:8px 16px;font-size:12px;font-weight:700}.finish-session-button:hover{color:#f5f6f7;border-color:#ffffff2e}.finish-session-button[hidden]{display:none}.record-button:active{transform:translateY(1px)}.record-button:disabled{cursor:wait;opacity:.58}.record-button-icon{border:2px solid #fff;border-radius:50%;width:15px;height:15px}.record-button.is-recording{color:#14171a;box-shadow:none;background:#f1f3f5}.record-button.is-recording .record-button-icon{background:#14171a;border:0;border-radius:3px;width:14px;height:14px}.toast{z-index:50;top:max(14px, env(safe-area-inset-top));color:#ffe0a7;pointer-events:none;background:#251f12fa;border:1px solid #ffba4959;border-radius:14px;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:12px;width:min(100% - 28px,520px);padding:13px 15px;font-size:13px;display:grid;position:fixed;left:50%;transform:translate(-50%);box-shadow:0 18px 60px #00000061}.toast-copy{gap:2px;display:grid}.toast-close{color:#ffe0a7;cursor:pointer;pointer-events:auto;background:0 0;border:0;border-radius:50%;place-items:center;width:28px;height:28px;margin:-5px -7px -5px 0;padding:0;font-size:22px;line-height:1;display:grid}.toast-close:hover{background:#ffffff14}.toast[hidden],.drawer-overlay[hidden],.battery[hidden],.upload-error[hidden]{display:none}.drawer-overlay{z-index:30;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#0000009e;border:0;padding:0;position:fixed;inset:0}.advanced-drawer{z-index:40;border-left:1px solid var(--line);background:#0b0e11;width:min(100%,560px);height:100dvh;transition:transform .22s;position:fixed;top:0;right:0;transform:translate(105%);box-shadow:-30px 0 90px #00000073}.advanced-drawer.is-open{transform:translate(0)}.drawer-header{height:82px;padding:max(18px, env(safe-area-inset-top)) 20px 14px;border-bottom:1px solid var(--line)}.drawer-header h2{letter-spacing:-.04em;margin-top:2px;font-size:24px}.icon-button{width:40px;height:40px;color:var(--muted);border-radius:50%;place-items:center;padding:0;font-size:28px;line-height:1;display:grid}.drawer-content{overscroll-behavior:contain;height:calc(100dvh - 82px);padding:16px 16px max(30px, env(safe-area-inset-bottom));overflow-y:auto}.advanced-section{border:1px solid var(--line);background:var(--surface);border-radius:18px;margin-bottom:14px;padding:18px}.section-heading{margin-bottom:14px}.section-heading h3{letter-spacing:-.025em;margin-top:2px;font-size:17px}.eyebrow{color:var(--muted);letter-spacing:.16em;font-size:9px;font-weight:780}.battery{color:var(--muted);font-variant-numeric:tabular-nums;align-items:center;gap:8px;font-size:12px;display:flex}.battery-icon{border:1px solid #75808a;border-radius:4px;width:28px;height:13px;padding:2px;display:inline-flex;position:relative}.battery-icon:after{content:"";background:#75808a;border-radius:0 2px 2px 0;width:2px;height:5px;position:absolute;top:3px;right:-4px}.battery-icon i{background:var(--good);border-radius:2px;width:50%;display:block}.diagnostic-status{align-items:center;gap:9px;margin-bottom:14px;font-size:13px;display:flex}.status-dot{background:#67707a;border-radius:50%;width:8px;height:8px}.is-recording .status-dot{background:var(--accent);box-shadow:0 0 0 5px #ff4d551f}.stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.stat{border:1px solid var(--line);background:var(--surface-raised);border-radius:12px;gap:5px;padding:11px;display:grid}.stat span,.storage-status,.hint,.queue-status{color:var(--muted);font-size:10px}.stat strong{font-variant-numeric:tabular-nums;text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}.storage-status{margin-top:10px}.toggle-row{border-top:1px solid var(--line);cursor:pointer;justify-content:space-between;gap:16px;margin-top:14px;padding-top:14px}.toggle-row span{gap:3px;display:grid}.toggle-row strong{font-size:11px}.toggle-row small{color:var(--muted);font-size:9px}.toggle-row input{width:38px;height:21px;accent-color:var(--accent)}.queue-status{text-align:right}.upload-error{color:#ffadb2;background:#ff4d5514;border:1px solid #ff4d5547;border-radius:10px;margin-bottom:12px;padding:10px 12px;font-size:11px;line-height:1.5}.inline-actions{flex-wrap:wrap;justify-content:flex-start}.settings-grid{gap:9px;display:grid}.settings-grid label{color:#cbd0d5;margin-top:6px;font-size:11px;font-weight:650}.settings-grid input,.settings-grid select{border:1px solid var(--line);color:#f5f6f7;background:#090b0e;border-radius:11px;outline:none;width:100%;min-height:44px;padding:9px 11px}.settings-grid input:focus,.settings-grid select:focus{border-color:#ff4d55bf}.hint{line-height:1.45}.secondary-button,.primary-small-button,.session-button{border-radius:10px;min-height:37px;padding:8px 12px;font-size:11px;font-weight:700}.primary-small-button{color:#fff;background:var(--accent);border-color:#0000;justify-self:start;margin-top:8px}.secondary-button.danger,.session-button.danger{color:#ff8990}button:disabled{cursor:not-allowed;opacity:.45}.text-button{color:var(--muted);background:0 0;border:0;padding:8px;font-size:11px}.sessions{gap:9px;display:grid}.session-item{border:1px solid var(--line);background:var(--surface-raised);border-radius:13px;padding:13px}.session-item h4{margin:0;font-size:13px}.session-item time,.session-meta{color:var(--muted);font-size:10px}.session-meta{margin-top:8px}.session-actions{flex-wrap:wrap;gap:7px;margin-top:10px;display:flex}.empty-state{color:var(--muted);text-align:center;padding:12px 0;font-size:11px}.log-list{border:1px solid var(--line);background:#080a0c;border-radius:12px;gap:1px;max-height:440px;display:grid;overflow-y:auto}.log-entry{border-bottom:1px solid #ffffff0d;grid-template-columns:68px 58px 1fr;gap:7px;padding:9px 10px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:9px;line-height:1.45;display:grid}.log-entry:last-child{border-bottom:0}.log-time,.log-level{color:#69727b}.log-level{font-weight:800}.log-entry[data-level=error] .log-level{color:#ff737b}.log-entry[data-level=warning] .log-level{color:var(--warning)}.log-entry[data-level=success] .log-level{color:var(--good)}.log-message{color:#c8cdd2;overflow-wrap:anywhere}@media (width<=520px){.recorder-view{padding-inline:14px}.recorder-card{box-shadow:none;background:0 0;border:0}.trace-list{max-height:min(45vh,390px)}.trace-event-meta{grid-template-columns:38px 50px minmax(0,1fr);gap:5px;font-size:7px}.advanced-drawer{border-left:0}.log-entry{grid-template-columns:62px 52px 1fr;padding-inline:8px;font-size:8px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}