:root{--ground:#121317;--surface:#1b1d23;--surface-raised:#24272f;--line:#31353f;--ink:#eceef2;--ink-dim:#9aa1af;--ink-faint:#666d7c;--accent:#e5484d;--accent-ink:#fff;--milestone:#f5b544;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--radius-sm:6px;--radius-md:12px;--radius-lg:20px;--radius-full:999px;--font:system-ui, -apple-system, "Segoe UI", sans-serif;--text-xs:12px;--text-sm:14px;--text-md:16px;--text-lg:20px;--text-xl:28px;--record-size:76px;--record-ring:4px;--fast:.12s;--slow:.32s}@media (prefers-reduced-motion:reduce){:root{--fast:0s;--slow:0s}}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;background:var(--ground);color:var(--ink);font-family:var(--font);font-size:var(--text-md)}*{box-sizing:border-box}body{background:var(--ground);min-height:100dvh;margin:0}#root,main{min-height:100dvh}main{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);flex-direction:column;display:flex}main>section{flex-direction:column;flex:1;min-height:0;display:flex}footer{padding:var(--space-2) var(--space-4);color:var(--ink-faint);font-size:var(--text-xs);text-align:center}h1{font-size:var(--text-lg);margin:0;font-weight:600}.sr-only{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}a{color:var(--ink)}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:none}:where(a,button):focus-visible{outline:2px solid var(--ink);outline-offset:2px;border-radius:var(--radius-sm)}.day-stamp{font-size:var(--text-sm);font-variant-numeric:tabular-nums;color:var(--ink);margin:0}.screen-nav{gap:var(--space-4);padding:var(--space-4);justify-content:center;display:flex}.button{padding:var(--space-3) var(--space-5);border-radius:var(--radius-full);background:var(--surface-raised);color:var(--ink);font-size:var(--text-sm)}.button--primary{background:var(--accent);color:var(--accent-ink)}.camera{background:#000;position:relative}.camera__header{inset:var(--space-4) 0 auto;z-index:2;align-items:center;gap:var(--space-1);pointer-events:none;text-shadow:0 1px 3px #000000b3;flex-direction:column;display:flex;position:absolute}.camera__stage{place-items:center;display:grid;position:absolute;inset:0;overflow:hidden}.camera__video{object-fit:cover;background:#000;width:100%;height:100%}.camera__video--mirrored{transform:scaleX(-1)}.camera__message{max-width:30ch;padding:var(--space-5);text-align:center;color:var(--ink-dim);font-size:var(--text-sm);line-height:1.5}.camera__message strong{margin-bottom:var(--space-2);color:var(--ink);font-size:var(--text-md);display:block}.camera__controls{z-index:2;align-items:center;gap:var(--space-4);padding:var(--space-5) var(--space-5) var(--space-6);grid-template-columns:1fr auto 1fr;display:grid;position:absolute;inset:auto 0 0}.camera__side{gap:var(--space-3);font-size:var(--text-sm);color:var(--ink);text-shadow:0 1px 3px #000000b3;align-items:center;display:flex}.camera__side--end{justify-content:flex-end}.record{width:var(--record-size);height:var(--record-size);border-radius:var(--radius-full);border:var(--record-ring) solid var(--ink);transition:transform var(--fast) ease;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;place-items:center;display:grid;position:relative}.record:active:not(:disabled){transform:scale(.94)}.record:disabled{opacity:.5;cursor:default}.record__core{width:calc(var(--record-size) - var(--record-ring) * 4);height:calc(var(--record-size) - var(--record-ring) * 4);border-radius:var(--radius-full);background:var(--accent);transition:width var(--fast) ease, height var(--fast) ease, border-radius var(--fast) ease}.record--busy .record__core{border-radius:var(--radius-sm);width:40%;height:40%}.record__progress{inset:calc(var(--record-ring) * -1.5);border-radius:var(--radius-full);background:conic-gradient(var(--accent) calc(var(--progress,0) * 360deg), transparent 0);position:absolute;-webkit-mask:radial-gradient(farthest-side,#0000 calc(100% - 4px),#000 0);mask:radial-gradient(farthest-side,#0000 calc(100% - 4px),#000 0)}.camera__flash{z-index:3;background:var(--ink);animation:camera-flash var(--slow) ease-out forwards;pointer-events:none;position:absolute;inset:0}@keyframes camera-flash{0%{opacity:.55}to{opacity:0}}.camera__dialog{z-index:4;padding:var(--space-5);background:#000000b8;place-items:center;display:grid;position:absolute;inset:0}.camera__dialog-card{gap:var(--space-4);width:min(100%,34ch);padding:var(--space-5);border-radius:var(--radius-lg);background:var(--surface);text-align:center;flex-direction:column;display:flex}.camera__dialog-actions{gap:var(--space-3);justify-content:center;display:flex}@property --progress{syntax:"<number>";inherits:false;initial-value:0}.record--recording .record__progress{animation:record-progress var(--clip-duration,1s) linear forwards}@keyframes record-progress{0%{--progress:0}to{--progress:1}}.days{gap:var(--space-4);overflow-y:auto}.days__header{padding:var(--space-4) var(--space-4) 0;justify-content:space-between;align-items:baseline;display:flex}.days__grid{gap:var(--space-1);padding:0 var(--space-4);grid-template-columns:repeat(7,1fr);display:grid}.day-cell{aspect-ratio:9/16;border-radius:var(--radius-sm);background:var(--surface);place-items:center;padding:0;display:grid;position:relative;overflow:hidden}.day-cell__poster{object-fit:cover;width:100%;height:100%;display:block}.day-cell--missed{border:1px solid var(--line);background:#000}.day-cell--today{background:var(--surface-raised);outline:2px solid var(--accent);outline-offset:-2px}.day-cell--future{border:1px dashed var(--line);background:0 0}.day-cell__date{color:var(--ink-faint);text-align:center;font-size:9px;line-height:1.1}.day-cell--today .day-cell__date{color:var(--ink)}.day-cell__badge{border-radius:var(--radius-full);background:var(--milestone);color:#000;text-align:center;min-width:14px;padding:0 3px;font-size:9px;font-weight:700;position:absolute;top:2px;right:2px}.days__actions{gap:var(--space-2);padding:0 var(--space-4);flex-wrap:wrap;justify-content:center;display:flex}.days__empty{padding:var(--space-6);text-align:center;color:var(--ink-dim);margin:auto;line-height:1.6}.days__empty strong{margin-bottom:var(--space-2);color:var(--ink);display:block}.player{z-index:10;background:#000;position:fixed;inset:0}.player__stage{position:absolute;inset:0}.player__video{object-fit:cover;opacity:0;width:100%;height:100%;position:absolute;inset:0}.player__video--shown{opacity:1}.player__header{inset:var(--space-4) var(--space-4) auto;font-size:var(--text-sm);text-shadow:0 1px 3px #000000b3;justify-content:space-between;display:flex;position:absolute}.player__day{font-variant-numeric:tabular-nums}.player__controls{inset:auto 0 var(--space-6);gap:var(--space-3);justify-content:center;display:flex;position:absolute}.days__grid{margin:0;list-style:none}.day-cell__play{width:100%;height:100%;padding:0;display:block}.scrub{gap:var(--space-4);padding:var(--space-4);justify-content:center;align-items:center}.scrub__stage{border-radius:var(--radius-md);background:#000;flex:1;place-items:center;width:100%;min-height:0;display:grid;overflow:hidden}.scrub__video{object-fit:contain;max-width:100%;max-height:100%}.scrub__strip{border-radius:var(--radius-sm);background:var(--surface);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;width:100%;height:96px;position:relative;overflow:hidden}.scrub__frames{height:100%;display:flex}.scrub__frame{object-fit:cover;flex:1;min-width:0;height:100%}.scrub__window{border:2px solid var(--accent);border-radius:var(--radius-sm);pointer-events:none;background:#e5484d1f;position:absolute;top:0;bottom:0}.scrub__range{opacity:0;cursor:ew-resize;touch-action:none;width:100%;height:100%;margin:0;position:absolute;inset:0}.scrub__range:focus-visible+*,.scrub__range:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.scrub__note{color:var(--ink-dim);font-size:var(--text-sm);text-align:center;margin:0}.scrub__actions{gap:var(--space-3);padding-bottom:var(--space-4);justify-content:center;display:flex}.scrub__empty{text-align:center;color:var(--ink-dim);margin:auto;line-height:1.6}.scrub__empty strong{margin-bottom:var(--space-2);color:var(--ink);display:block}.settings{gap:var(--space-4);padding:var(--space-4);overflow-y:auto}.settings__header{justify-content:space-between;align-items:baseline;display:flex}.settings__rows{gap:var(--space-1);flex-direction:column;display:flex}.row{justify-content:space-between;align-items:center;gap:var(--space-4);min-height:52px;padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);background:var(--surface);display:flex}.row__label{font-size:var(--text-sm)}.row__value{color:var(--ink-dim);font-size:var(--text-sm);font-variant-numeric:tabular-nums}.row__control{font:inherit;color:var(--ink);background:var(--surface-raised);border:1px solid var(--line);border-radius:var(--radius-sm);padding:var(--space-2) var(--space-3)}.row__note{margin:0 var(--space-4) var(--space-2);color:var(--ink-faint);font-size:var(--text-xs);line-height:1.5}.segmented{border-radius:var(--radius-full);background:var(--surface-raised);gap:2px;padding:2px;display:flex}.segmented__option{padding:var(--space-2) var(--space-4);border-radius:var(--radius-full);font-size:var(--text-sm);color:var(--ink-dim)}.segmented__option--on{background:var(--ink);color:var(--ground)}.settings__problem{margin:0 var(--space-4);color:var(--accent);font-size:var(--text-xs);line-height:1.5}.settings__warning{padding:var(--space-4);border:1px solid var(--line);border-radius:var(--radius-md);color:var(--ink-dim);font-size:var(--text-sm);margin:0;line-height:1.6}.settings__warning strong{margin-bottom:var(--space-2);color:var(--ink);display:block}.welcome{gap:var(--space-4);padding:var(--space-5);overflow-y:auto}.welcome h1{font-size:var(--text-xl)}.welcome__lead{color:var(--ink-dim);margin:0;line-height:1.6}.welcome__steps{gap:var(--space-3);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.welcome__step{padding:var(--space-4);border-radius:var(--radius-md);background:var(--surface);gap:var(--space-3);flex-direction:column;align-items:flex-start;display:flex}.welcome__step h2{font-size:var(--text-md);margin:0}.welcome__step p{color:var(--ink-dim);font-size:var(--text-sm);margin:0;line-height:1.6}.welcome__step--warning{border:1px solid var(--accent)}.welcome__step--warning strong{color:var(--ink)}.welcome__done{color:var(--ink)!important}.welcome__problem{color:var(--accent)!important}.welcome__hour{align-items:center;gap:var(--space-3);font-size:var(--text-sm);display:flex}.welcome__hour select{font:inherit;color:var(--ink);background:var(--surface-raised);border:1px solid var(--line);border-radius:var(--radius-sm);padding:var(--space-2) var(--space-3)}.welcome__start{margin-bottom:var(--space-4);align-self:stretch}.reel{gap:var(--space-4);padding:var(--space-4)}.reel__header{justify-content:space-between;align-items:baseline;display:flex}.reel__panel{align-items:center;gap:var(--space-4);padding:var(--space-5);border-radius:var(--radius-md);background:var(--surface);text-align:center;flex-direction:column;display:flex}.reel__panel p{color:var(--ink-dim);font-size:var(--text-sm);margin:0;line-height:1.6}.reel__timecode{font-variant-numeric:tabular-nums;color:var(--ink)!important;font-size:var(--text-xl)!important}.reel__progress{width:100%;height:4px;accent-color:var(--accent)}.reel__lyric{font-style:italic;color:var(--ink-faint)!important}.reel__stage{border-radius:var(--radius-md);background:#000;flex:1;place-items:center;min-height:0;display:grid;overflow:hidden}.reel__video{max-width:100%;max-height:100%}