@font-face{font-family:GT Standard;src:url(/brand/GT-Standard-M-Standard-Regular.woff2) format("woff2");font-style:normal;font-weight:400;font-display:swap}@font-face{font-family:"STK Bureau Serif";src:url(/brand/STKBureauSerif-Book.woff2) format("woff2");font-style:normal;font-weight:400;font-display:swap}@font-face{font-family:Inter;src:url(/brand/Inter-Variable.woff2) format("woff2");font-style:normal;font-weight:100 900;font-display:swap}:root{--font-sans: "GT Standard", system-ui, sans-serif;--font-serif: "STK Bureau Serif", Georgia, serif;--font-accent: Inter, system-ui, sans-serif;--weight-regular: 400;--weight-accent: 475;--leading-hero: 1.2;--tracking-hero: -.05em;--leading-body: 1.5;--tracking-accent: -.02em;--tracking-status: .08em;--text-body: 16px;--text-small: 14px;--text-status: 12px;--text-hero: 48px;--timer-ready: 80px;--timer-live: 88px;--timer-summary: 56px;--timer-phone: 64px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-12: 48px;--space-16: 64px;--column-width: 560px;--page-gutter: 40px;--page-gutter-phone: 16px;--radius-card: 16px;--padding-card: 32px;--padding-card-phone: 24px 20px;--radius-pill: 999px;--height-pill: 44px;--padding-pill: 12px 22px;--size-circle: 72px;--height-field: 48px;--radius-field: 12px;--padding-keycap: 2px 8px;--radius-keycap: 6px;--radius-dialog: 24px;--padding-dialog: 28px;--height-progress: 3px;--focus-width: 2px;--focus-offset: 3px;--motion-fast: .16s;--walnut: #371B15;--sunshine: #FFF439;--sunshine-disabled: #FBF6A7;--orange: #EB8627;--white: #FFF;--muted: #A2948E}:root,:root[data-theme=light]{color-scheme:light;--background: #F9F7F0;--card: #FFF;--surface: #F3F0E5;--hairline: #EFEBDC;--track: #EFEBDC;--foreground: #371B15;--text-secondary: #715D57;--sunshine-hover: #F3E737;--destructive: #A7341E;--destructive-label: #FFF;--focus: #371B15;--recording-gradient: linear-gradient(160deg, #F8ECDC 0%, #F9F7F0 45%, #F6DEC4 100%);--glass-card: rgb(255 255 255 / 45%);--glass-border: var(--hairline);--glass-blur: 12px;--shadow-card: 0 1px 2px rgba(55,27,21,.05), 0 8px 24px rgba(55,27,21,.05);--shadow-dialog: 0 24px 64px #371B1529;--dialog-backdrop: #371B1566}:root[data-theme=dark]{color-scheme:dark;--background: #1E0E0B;--card: #371B15;--surface: #2E1A15;--hairline: #543C36;--track: #4A2F29;--foreground: #F9F7F0;--text-secondary: #B7B1AB;--sunshine-hover: #FFF86B;--destructive: #E5684C;--destructive-label: #FFF;--focus: #FFF439;--recording-gradient: linear-gradient(160deg, #371C0E 0%, #1E0E0B 45%, #512C12 100%);--glass-card: rgb(255 255 255 / 5%);--glass-border: var(--hairline);--shadow-dialog: 0 24px 64px #00000066;--dialog-backdrop: #1E0E0BB3}*{box-sizing:border-box}:root{font-family:var(--font-serif);font-synthesis:none;font-weight:var(--weight-regular);color:var(--foreground);background:var(--background);line-height:var(--leading-body)}body{margin:0;min-width:280px;background:var(--background)}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;background:var(--recording-gradient);opacity:0;transition:opacity .2s}body{isolation:isolate}body[data-recording=true]:before{opacity:1}button,input,select,textarea{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}a{color:inherit;text-underline-offset:3px}button{cursor:pointer}button:disabled,input:disabled,select:disabled{cursor:not-allowed}:where(button,a,input,select,textarea,[tabindex]):focus-visible{outline:var(--focus-width) solid var(--focus);outline-offset:var(--focus-offset)}h1,h2,h3,p{margin:0}h1,.hero{font:var(--weight-regular) var(--text-hero)/var(--leading-hero) var(--font-sans);letter-spacing:var(--tracking-hero)}h2{font:var(--weight-regular) 24px/var(--leading-hero) var(--font-sans);letter-spacing:var(--tracking-hero)}h3{font-size:20px;font-weight:var(--weight-regular)}p,.body-copy{font:var(--weight-regular) var(--text-body)/var(--leading-body) var(--font-serif)}.accent,label,.pill,.circle-control,.account,.key-hint,.hint,.saving-note,.progress-copy{font-family:var(--font-accent);font-weight:var(--weight-accent);line-height:var(--leading-body);letter-spacing:var(--tracking-accent)}.shell{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;padding:0 var(--page-gutter)}.shell>header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--space-6);padding:var(--space-8) 0}.recorder-column{width:100%;max-width:var(--column-width);margin:auto;display:flex;flex-direction:column;gap:var(--space-6);padding:var(--space-8) 0}.card{background:var(--card);border:1px solid var(--hairline);border-radius:var(--radius-card);padding:var(--padding-card);box-shadow:var(--shadow-card);min-width:0}.card.recorder{display:flex;flex-direction:column;gap:var(--space-8);text-align:center}body[data-recording=true] .card.recorder:is(.state-recording,.state-paused){background:var(--glass-card);border-color:var(--glass-border);-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur))}.recorder-top,.recorder-bottom{display:flex;flex-direction:column;align-items:center;gap:var(--space-6);min-width:0}.recorder-bottom{margin-top:auto}.recorder-top>*,.recorder-bottom>*{max-width:100%}.state-ready .recorder-top{padding-top:var(--space-4)}:is(.state-recording,.state-paused) .recorder-top{gap:var(--space-4)}:is(.state-stopped,.state-uploading,.state-processing,.state-done,.state-recovery) .summary{padding:var(--space-4) 0}.card.recorder{transition:background-color var(--motion-fast)}.control-label{display:block;margin-top:var(--space-2);font:var(--weight-regular) var(--text-body)/var(--leading-body) var(--font-serif)}.shortcut-gap{margin-left:var(--space-4)}.permission-circle{display:grid;place-items:center;width:var(--size-circle);height:var(--size-circle);border-radius:50%;background:var(--surface);color:var(--muted);margin-inline:auto}.permission-copy,.summary,.setup{display:flex;flex-direction:column;gap:var(--space-4)}.permission-copy p,.signin-line,.hint,.saving-note,.storage-note,.dialog-copy,.progress-copy{color:var(--text-secondary)}.controls,.actions{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:var(--space-3)}.controls{gap:var(--space-6)}.summary{align-items:center;width:100%}.title-field,.microphone-select{width:100%;text-align:left}.title-field{display:flex;flex-direction:column;gap:var(--space-2)}.hint,.saving-note,.storage-note,.progress-copy{font-size:var(--text-small)}.saving-note,.storage-note{text-align:center}.device-link{color:var(--text-secondary);border:0;background:transparent;padding:var(--space-3);text-decoration:underline;text-underline-offset:3px;font-size:var(--text-small)}.device-link:disabled{color:var(--text-secondary)}.recording-title{overflow-wrap:anywhere}.progress-copy{display:flex;justify-content:space-between;gap:var(--space-4);width:100%}.footer,.shell>footer{padding:var(--space-6) 0;color:var(--text-secondary);text-align:center;font:var(--weight-regular) var(--text-body)/var(--leading-body) var(--font-serif)}.signin{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-8);padding:var(--space-8) var(--page-gutter-phone);text-align:center}.signin-line{max-width:var(--column-width)}.account{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-3);min-width:0;font-size:var(--text-small);color:var(--text-secondary)}.account>span{overflow-wrap:anywhere;min-width:0}.local-list{margin:0;padding:0;list-style:none}.local-list li{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-4);padding:var(--space-5) 0;border-bottom:1px solid var(--hairline);overflow-wrap:anywhere}.local-list li>div{min-width:0;max-width:100%}.local-list p{color:var(--text-secondary);font-size:var(--text-small)}.setup{max-width:var(--column-width);margin:var(--space-12) auto;padding:var(--space-6)}.brand{display:inline-flex;align-items:center;gap:var(--space-4);color:var(--foreground);text-decoration:none;max-width:100%}.brand-lockup{display:block;width:208px;height:36px;max-width:100%;flex-shrink:0;background:currentColor;-webkit-mask:url(/brand/logo.png) center / contain no-repeat;mask:url(/brand/logo.png) center / contain no-repeat;mask-mode:alpha}.brand-tag{border-left:1px solid var(--hairline);padding-left:var(--space-4);font-size:var(--text-small);color:var(--text-secondary)}.brand-centred{justify-content:center}.brand-link{text-decoration:none}.brand{padding-block:var(--space-4)}.local-list small{display:block;color:var(--text-secondary)}.pill{display:inline-flex;justify-content:center;align-items:center;gap:var(--space-2);min-height:var(--height-pill);max-width:100%;border:1px solid transparent;border-radius:var(--radius-pill);padding:var(--padding-pill);font-size:var(--text-small);text-decoration:none;text-align:center;overflow-wrap:anywhere;transition:background-color var(--motion-fast),border-color var(--motion-fast)}.pill.primary{background:var(--sunshine);color:var(--walnut)}.pill.primary:hover:not(:disabled):not([aria-disabled=true]){background:var(--sunshine-hover)}.pill.secondary{background:var(--card);border-color:var(--hairline);color:var(--foreground)}.pill.quiet{background:transparent;color:var(--text-secondary)}.pill:is(.secondary,.quiet):hover:not(:disabled):not([aria-disabled=true]){background:var(--surface)}.pill.destructive{background:var(--destructive);color:var(--destructive-label)}.pill.destructive:hover:not(:disabled):not([aria-disabled=true]){background:color-mix(in srgb,var(--destructive) 88%,var(--walnut))}.pill:disabled,.pill[aria-disabled=true]{background:var(--surface);color:var(--text-secondary);cursor:not-allowed}.pill.primary:disabled,.pill.primary[aria-disabled=true]{background:var(--sunshine-disabled);color:var(--text-secondary)}:root[data-theme=dark] .pill.primary:disabled,:root[data-theme=dark] .pill.primary[aria-disabled=true]{color:var(--walnut)}.circle-control{display:inline-grid;place-items:center;flex:0 0 var(--size-circle);width:var(--size-circle);height:var(--size-circle);border-radius:50%;border:1px solid var(--hairline);background:var(--card);color:var(--foreground);transition:background-color var(--motion-fast)}.circle-stop{background:var(--white);border-color:transparent;color:var(--walnut)}.circle-pause{background:color-mix(in srgb,var(--foreground) 8%,transparent);border-color:transparent}.circle-resume{background:var(--sunshine);border-color:transparent;color:var(--walnut)}.circle-control:hover:not(:disabled){background:var(--surface)}.circle-resume:hover:not(:disabled){background:var(--sunshine-hover)}.circle-control:disabled{background:var(--surface);color:var(--muted)}.timer{font:var(--weight-regular) var(--timer-ready)/var(--leading-hero) var(--font-sans);font-variant-numeric:tabular-nums;letter-spacing:var(--tracking-hero);max-width:100%;overflow-wrap:anywhere}.timer-live{font-size:var(--timer-live)}.timer-summary{font-size:var(--timer-summary)}.timer-dim{opacity:.55}.status{display:flex;align-items:center;justify-content:center;gap:var(--space-2);font:var(--weight-accent) var(--text-status)/var(--leading-body) var(--font-accent);letter-spacing:var(--tracking-status);text-transform:uppercase;color:var(--text-secondary)}.status-dot{width:var(--space-2);height:var(--space-2);border-radius:50%;background:var(--muted);flex-shrink:0}.status-sunshine .status-dot{background:var(--sunshine)}.status-orange .status-dot{background:var(--orange)}.waveform{display:block;width:100%;height:120px;color:var(--hairline);fill:var(--white);stroke:var(--hairline);stroke-width:1px;overflow:visible}:root[data-theme=dark] .waveform{fill:var(--foreground);stroke:var(--foreground)}.waveform-level,.waveform-motion{transform-origin:240px 60px}.waveform-level{transform:scaleY(var(--wave-level));transition:transform var(--motion-fast)}.waveform-motion{animation:waveform-breathe 2.4s ease-in-out infinite alternate}.waveform-paused{opacity:.35}.waveform-paused .waveform-motion{animation-play-state:paused}@keyframes waveform-breathe{0%{transform:scaleY(.75)}to{transform:scaleY(1)}}.level-meter{display:flex;align-items:center;gap:2px;height:var(--space-4);flex-shrink:0}.level-bar{display:block;width:3px;height:var(--space-3);border-radius:var(--radius-pill);background:var(--track)}.level-bar-active{background:var(--foreground)}label{font-size:var(--text-small)}input,select,textarea{display:block;width:100%;min-width:0;min-height:var(--height-field);border:1px solid var(--hairline);border-radius:var(--radius-field);padding:var(--space-3) var(--space-4);background:var(--surface);color:var(--foreground);font:var(--weight-regular) var(--text-body)/var(--leading-body) var(--font-serif)}input::placeholder,textarea::placeholder{color:var(--text-secondary);opacity:1}input:disabled,select:disabled,textarea:disabled{color:var(--text-secondary)}.microphone-select label{display:block;margin-bottom:var(--space-2)}.microphone-field{display:flex;align-items:center;gap:var(--space-3)}.microphone-field select{flex:1}.progress{width:100%;height:var(--height-progress);overflow:hidden;border-radius:var(--radius-pill);background:var(--track)}.progress>span{display:block;height:100%;background:var(--sunshine);transition:width var(--motion-fast)}.inline-error{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--space-3);width:100%;padding:var(--space-4);background:var(--surface);border:1px solid var(--hairline);border-radius:var(--radius-field);text-align:left}.inline-error p{flex:1 1 160px;color:var(--foreground);overflow-wrap:anywhere}.error-icon{display:grid;place-items:center;width:24px;height:24px;border:1px solid currentColor;border-radius:50%;font-family:var(--font-serif)}.inline-error .pill{padding:var(--space-2) var(--space-3)}.inline-error .pill{flex-shrink:0}.dialog{width:min(var(--column-width),calc(100% - 2 * var(--page-gutter-phone)));max-height:calc(100dvh - 2 * var(--space-6));margin:auto;padding:var(--padding-dialog);border:1px solid var(--hairline);border-radius:var(--radius-dialog);background:var(--surface);color:var(--foreground);box-shadow:var(--shadow-dialog)}.dialog::backdrop{background:var(--dialog-backdrop)}.dialog-copy{margin:var(--space-6) 0;display:flex;flex-direction:column;gap:var(--space-4)}.dialog .actions{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}.dialog .actions .pill{width:100%}.key-hint{display:inline-flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:var(--space-2);color:var(--text-secondary);font-size:var(--text-status)}kbd{display:inline-block;border:1px solid var(--hairline);border-radius:var(--radius-keycap);padding:var(--padding-keycap);background:var(--surface);font:var(--weight-accent) var(--text-status)/var(--leading-body) var(--font-accent);box-shadow:inset 0 -1px 0 var(--hairline)}.theme-select{display:inline-flex;align-items:center;gap:var(--space-2);color:var(--text-secondary)}.theme-select select{width:auto;font-family:var(--font-accent);font-size:var(--text-status);font-weight:var(--weight-accent)}.showcase .recorder-column{margin-block:0}.showcase-section{display:flex;flex-direction:column;gap:var(--space-6)}.showcase-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3)}.showcase-swatch{padding:var(--space-4);border:1px solid var(--hairline);border-radius:var(--radius-field);font-size:var(--text-small)}.showcase .showcase-section>h2{margin-top:var(--space-6)}@media(max-width:600px){.shell{padding-inline:var(--page-gutter-phone)}.shell>header{padding:var(--space-6) 0;gap:var(--space-4)}.recorder-column{flex:1;margin-block:0;padding:var(--space-4) 0}.card{padding:var(--padding-card-phone)}.card.recorder{flex:1}.recorder-bottom{padding-top:var(--space-6)}.timer,.timer-summary{font-size:var(--timer-phone)}h1,.hero{font-size:36px}.brand{gap:var(--space-3)}.brand-lockup{width:173px;height:30px}.brand-tag{padding-left:var(--space-3)}.microphone-field{gap:var(--space-2)}.microphone-field select{padding-inline:var(--space-2);font-size:15px}.inline-error{flex-direction:column;align-items:flex-start}.inline-error p{flex-basis:auto}.inline-error .pill{align-self:stretch}.account{width:100%;justify-content:space-between}.footer,.shell>footer{padding-bottom:max(var(--space-6),env(safe-area-inset-bottom))}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.waveform-level{transform:scaleY(.3)}}@media(forced-colors:active){.brand-lockup,.status-dot,.level-bar-active,.progress>span{background:CanvasText}.level-bar{border:1px solid CanvasText}.waveform{color:CanvasText}.pill,.circle-control{border:1px solid ButtonText}.pill:disabled,.circle-control:disabled{color:GrayText;border-color:GrayText}}