:root{--cream:#FFFBF5;--ink:#17130F;--muted:#5C534C;--chip:#F3ECE4;--hair:#E4DACE;--persimmon:#FF5A2C;--blue:#C7DBFF;--butter:#FFE36E;--mint:#C6F2DA;--peach:#FFD3BF;--danger:#B3261E;
--round:ui-rounded,"SF Pro Rounded",Nunito,"Varela Round",system-ui,sans-serif}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--cream);color:var(--ink);font:1.125rem/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}
.wrap{width:100%;max-width:34rem;margin:0 auto;padding:0 1.25rem}
header.wrap{padding-top:1.25rem;padding-bottom:.5rem}
.brand{font:800 1.25rem/1 var(--round);letter-spacing:-.4px;color:var(--ink);text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
main.wrap{flex:1;padding-top:1rem;padding-bottom:2rem}
footer.wrap{padding-top:1rem;padding-bottom:1.5rem;color:var(--muted);font-size:1rem}
footer a{color:var(--ink);display:inline-flex;align-items:center;min-height:44px;margin-right:1rem}
h1,h2{font:800 clamp(1.875rem,7vw,2.25rem)/1.1 var(--round);letter-spacing:-.8px;margin:0 0 .75rem}
h2{font-size:1.5rem;letter-spacing:-.5px}
h1:focus,h2:focus{outline:none}
p{margin:0 0 1rem}
.muted{color:var(--muted)}
.caption{font:800 1rem/1.2 system-ui,sans-serif;letter-spacing:.2px;margin:0 0 .5rem}
a{color:var(--ink);text-underline-offset:3px}
a:hover{color:#B93A14}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px;box-shadow:0 0 0 6px var(--cream)}
.card{border-radius:1.75rem;padding:1.5rem;margin:0 0 1.25rem;color:var(--ink)}
.card.blue{background:var(--blue)}.card.butter{background:var(--butter)}.card.mint{background:var(--mint)}.card.peach{background:var(--peach)}.card.chip{background:var(--chip)}
.card .q{font:800 clamp(1.5rem,6vw,1.875rem)/1.2 var(--round);letter-spacing:-.6px;margin:0;overflow-wrap:anywhere}
.btn{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;min-height:56px;padding:.75rem 1.5rem;border:2px solid var(--ink);border-radius:28px;background:transparent;color:var(--ink);font:800 1.25rem/1.2 var(--round);text-decoration:none;cursor:pointer;margin:0 0 .75rem;-webkit-tap-highlight-color:transparent}
.btn.primary{background:var(--persimmon);border-color:var(--persimmon)}
.btn.primary:hover{background:#FF6D43;color:var(--ink)}
.btn.dark{background:var(--ink);border-color:var(--ink);color:var(--cream)}
.btn.dark:hover{color:var(--cream)}
.btn[disabled],.btn[aria-disabled=true]{opacity:.55;cursor:not-allowed}
.btn:active:not([disabled]){transform:scale(.98)}
.field{margin:0 0 1rem}
label{display:block;font-weight:700;margin:0 0 .375rem}
input[type=text]{width:100%;min-height:56px;padding:.75rem 1rem;font:inherit;color:var(--ink);background:#fff;border:2px solid var(--ink);border-radius:16px}
.err{color:var(--danger);font-weight:700;margin:.375rem 0 0}
.notice{border:2px solid var(--ink);border-radius:18px;padding:1rem 1.125rem;margin:0 0 1.25rem;background:var(--chip)}
.notice p:last-child{margin:0}
.preview-banner{background:var(--butter);border-bottom:2px solid var(--ink);padding:.625rem 1.25rem;text-align:center;font-weight:700;font-size:1rem}
.vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.timer{font:800 2.5rem/1 var(--round);letter-spacing:-1px;margin:0 0 .25rem;font-variant-numeric:tabular-nums}
.rec-status{display:flex;align-items:center;gap:.625rem;font-weight:800;margin:0 0 1rem}
.dot{width:14px;height:14px;border-radius:50%;background:var(--persimmon);border:2px solid var(--ink);flex:none;animation:pulse 1.2s ease-in-out infinite}
.meter{height:18px;border-radius:9px;background:var(--chip);border:2px solid var(--ink);overflow:hidden;margin:0 0 1rem}
.meter>div{height:100%;width:100%;background:var(--ink);transform-origin:left center;transform:scaleX(0)}
progress{width:100%;height:14px;accent-color:var(--ink);margin:0 0 1rem}
audio{width:100%;margin:0 0 1rem}
ul.people{list-style:none;margin:0 0 1rem;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
ul.people li{background:var(--chip);border-radius:999px;padding:.375rem 1rem;font-weight:700}
ol.qs{margin:0;padding-left:1.5rem}ol.qs li{margin:0 0 .75rem;font-weight:700}
.todo{background:var(--butter);border:2px solid var(--ink);border-radius:18px;padding:1rem;font-weight:700;margin:0 0 1.5rem}
@keyframes pulse{50%{opacity:.35}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}.btn:active{transform:none}}

.skip{position:absolute;left:-9999px;top:0}
.skip:focus{left:1rem;top:1rem;z-index:10;background:var(--ink);color:var(--cream);padding:.75rem 1rem;border-radius:14px}