:root{--stage-ground: #1c1b1a;--stage-surface: #262422;--stage-ink: #f4f1ea;--stage-ink-muted: #a39c8e;--paper: #f7f4ee;--surface-raised: #efebe2;--line: #d8d2c4;--ink: #1c1b1a;--ink-muted: #6b655a;--work: #dc3b2e;--rest: #2fa36b;--prep: #e8a73b;--cooldown: #3b7ee4;--work-bg: #7a2b22;--rest-bg: #1e5c3d;--prep-bg: #7a4e10;--cooldown-bg: #1e3f78;--danger: #b3261e;--font-display: "Barlow Condensed", "Arial Narrow", sans-serif;--font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", monospace;--text-sm: .8rem;--text-base: 1rem;--text-lg: 1.25rem;--text-xl: 1.75rem;--text-2xl: 2.5rem;--text-huge: clamp(4rem, 16vw, 14rem);--space-1: .25rem;--space-2: .5rem;--space-3: 1rem;--space-4: 1.5rem;--space-5: 2.5rem;--radius: 6px}@media (prefers-color-scheme: dark){:root{--paper: #201f1c;--surface-raised: #2b2925;--line: #423f38;--ink: #f4f1ea;--ink-muted: #a39c8e}}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--font-display);-webkit-font-smoothing:antialiased}button{font-family:inherit}:focus-visible{outline:3px solid var(--cooldown);outline-offset:2px}.stage{--accent: var(--stage-ink-muted);--bg: var(--stage-ground);height:100vh;width:100vw;background:var(--bg);transition:background-color .4s ease;color:var(--stage-ink);display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;overflow:hidden}@media (prefers-reduced-motion: reduce){.stage{transition:none}.stage-connection-closed,.stage-connection-connecting{animation:none}}.stage-idle{text-align:center;color:var(--stage-ink-muted)}.stage-idle-logo{width:min(480px,60vw);height:auto;opacity:.85;margin-bottom:var(--space-4)}.stage-idle-clock{font-family:var(--font-mono);font-size:var(--text-huge);font-weight:600;line-height:1;font-variant-numeric:tabular-nums;color:var(--stage-ink)}.stage-meta{position:absolute;top:var(--space-4);left:var(--space-4);right:var(--space-4);display:flex;justify-content:space-between;color:#f4f1eabf;font-size:var(--text-lg)}.stage-round{color:var(--stage-ink);font-weight:600}.stage-center{display:flex;flex-direction:column;align-items:center;gap:var(--space-2)}.stage-label{margin:0;font-size:var(--text-2xl);font-weight:600;color:var(--stage-ink);text-transform:none}.stage-clock{font-family:var(--font-mono);font-size:var(--text-huge);font-weight:600;line-height:1;font-variant-numeric:tabular-nums;color:var(--stage-ink)}.stage-clock-done{font-family:var(--font-display);font-size:var(--text-2xl);color:var(--stage-ink)}.stage-next{color:#f4f1eabf;font-size:var(--text-lg);margin:0}.stage-progress{position:absolute;bottom:0;left:0;right:0;height:10px;background:#00000040}.stage-progress-fill{height:100%;background:#f4f1ead9;transition:width .1s linear}.stage-connection{position:absolute;bottom:var(--space-3);right:var(--space-3);width:10px;height:10px;border-radius:50%;background:#f4f1ea4d}.stage-connection-open{background:#f4f1eae6}.stage-connection-closed,.stage-connection-connecting{background:#f4f1eae6;animation:stage-connection-pulse 1.2s ease-in-out infinite}@keyframes stage-connection-pulse{0%,to{opacity:.3}50%{opacity:1}}body{background:var(--paper);color:var(--ink)}.config-page{max-width:640px;margin:0 auto;padding:var(--space-4) var(--space-3) calc(var(--space-5) + 96px)}.config-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--space-4)}.config-header h1{font-size:var(--text-2xl);margin:0}.config-sub{color:var(--ink-muted);margin:var(--space-1) 0 0}.config-panel{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:flex-end;margin-bottom:var(--space-3)}.field{display:flex;flex-direction:column;gap:var(--space-1);flex:1;font-size:var(--text-sm);color:var(--ink-muted)}input,select{font-family:var(--font-display);font-size:var(--text-lg);padding:var(--space-2) var(--space-3);border:1px solid var(--line);border-radius:var(--radius);background:var(--surface-raised);color:var(--ink)}.btn{font-family:var(--font-display);font-weight:600;font-size:var(--text-base);padding:var(--space-2) var(--space-3);border-radius:var(--radius);border:1px solid var(--line);background:var(--surface-raised);color:var(--ink);cursor:pointer;min-height:44px}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--ink);color:var(--paper);border-color:var(--ink)}.btn-quiet{background:transparent;border-color:transparent;color:var(--ink-muted)}.btn-large{width:100%;font-size:var(--text-lg);padding:var(--space-3)}.item-list{list-style:none;margin:0 0 var(--space-3);padding:0;display:flex;flex-direction:column;gap:var(--space-2)}.item-row{display:flex;align-items:flex-start;gap:var(--space-2);padding:var(--space-2) 0;border-bottom:1px solid var(--line)}.drag-handle{background:none;border:none;font-size:var(--text-lg);color:var(--ink-muted);cursor:grab;min-width:44px;min-height:44px;touch-action:none}.segment-fields,.group-fields{flex:1;min-width:0;border-left:4px solid var(--line);padding-left:var(--space-2)}.label-input{width:100%;margin-bottom:var(--space-2)}.segment-controls{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:center}.seconds-input{width:5rem}.swatches{display:flex;gap:var(--space-1)}.swatch{width:28px;height:28px;border-radius:50%;border:1px solid var(--line);cursor:pointer}.group-header{display:flex;gap:var(--space-2);align-items:center;margin-bottom:var(--space-2)}.rounds-field{display:flex;flex-direction:column;font-size:var(--text-sm);color:var(--ink-muted);gap:var(--space-1)}.rounds-input{width:4rem}.group-segments{list-style:none;margin:0 0 var(--space-2);padding:0;display:flex;flex-direction:column;gap:var(--space-2)}.group-segment-row{display:flex;flex-direction:column;gap:var(--space-1);padding-left:var(--space-2);border-left:2px solid var(--line)}.group-segment-row-tools{display:flex;justify-content:space-between;align-items:center}.reorder-buttons{display:flex;gap:var(--space-1)}.reorder-buttons button{background:none;border:none;color:var(--ink-muted);cursor:pointer;min-width:44px;min-height:32px}.btn-remove{align-self:flex-start}.add-row{display:flex;gap:var(--space-2);margin-bottom:var(--space-4)}.save-row{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-4)}.save-confirm{color:var(--rest);font-weight:600}.playback-bar{position:fixed;bottom:0;left:0;right:0;background:var(--surface-raised);border-top:1px solid var(--line);padding:var(--space-3)}.playback-offline{display:block;text-align:center;color:var(--work);font-weight:600;margin-bottom:var(--space-2)}.playback-live{display:flex;flex-direction:column;gap:var(--space-2);max-width:640px;margin:0 auto;max-height:60vh;overflow-y:auto}.playback-now{display:flex;justify-content:space-between;align-items:baseline}.playback-segment{font-weight:600}.playback-clock{font-family:var(--font-mono);font-size:var(--text-xl);font-variant-numeric:tabular-nums}.playback-primary .btn{width:100%}.playback-secondary{display:flex;flex-wrap:wrap;gap:var(--space-2)}.playback-secondary .btn{flex:1 1 calc(50% - var(--space-2))}.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--stage-ground);padding:var(--space-3)}.login-card{width:100%;max-width:320px;display:flex;flex-direction:column;gap:var(--space-3);text-align:center}.login-logo{width:min(260px,70vw);height:auto;margin:0 auto}.login-copy{color:var(--stage-ink-muted);margin:0}.login-input{font-size:var(--text-xl);text-align:center;letter-spacing:.3em;background:var(--stage-surface);border:1px solid var(--stage-ink-muted);color:var(--stage-ink)}.login-error{color:var(--work);margin:0}.login-submit{background:var(--work);color:var(--stage-ink);border:none;font-family:var(--font-display);font-weight:600;font-size:var(--text-lg);padding:var(--space-3);border-radius:var(--radius);cursor:pointer;min-height:44px}.login-submit:disabled{opacity:.5}