:root{--background:oklch(95% .014 292);--foreground:oklch(21.5% .022 288);--surface-raised:oklch(100% 0 0);--surface-sunken:oklch(92.5% .017 292);--muted-foreground:oklch(49% .03 288);--primary:oklch(24% .03 288);--primary-hover:oklch(32% .05 290);--primary-foreground:oklch(98.5% .005 292);--accent-solid:oklch(52% .2 293);--accent-solid-pressed:oklch(42% .18 293);--on-accent:oklch(100% 0 0);--accent-soft:oklch(94% .028 293);--accent-soft-foreground:oklch(42% .18 293);--ring:oklch(24% .03 288);--input:oklch(60% .025 290);--destructive:oklch(54% .2 25);--danger-soft:oklch(95% .022 20);--danger-foreground:oklch(46% .17 25);--warning:oklch(60% .13 65);--warning-soft:oklch(95.5% .04 80);--warning-foreground:oklch(45% .1 55);--shadow-sm:0 1px 2px oklch(35% .08 290/.07), 0 2px 8px oklch(35% .08 290/.08);--shadow-md:0 4px 12px oklch(35% .08 290/.08), 0 2px 4px oklch(35% .08 290/.05);--shadow-accent:0 6px 18px oklch(52% .2 293/.28);--radius-xl:20px;--radius-sm:12px;--font-heading:Nunito, ui-rounded, system-ui, sans-serif;--font-body:"Atkinson Hyperlegible Next", system-ui, sans-serif;--ease:cubic-bezier(.2, .8, .2, 1);--t-press:80ms;--t-hover:.15s;--s-hover:1.03;--s-press:.97;--s-card:1.015;--s-card-press:.99}@media (prefers-color-scheme:dark){:root{--background:oklch(17% .04 296);--foreground:oklch(95% .018 305);--surface-raised:oklch(23.5% .05 298);--surface-sunken:oklch(13.5% .032 296);--muted-foreground:oklch(76% .04 302);--primary:oklch(93% .025 305);--primary-hover:oklch(97% .015 305);--primary-foreground:oklch(20% .05 296);--accent-solid:oklch(72% .15 302);--accent-solid-pressed:oklch(66% .15 302);--on-accent:oklch(18% .05 296);--accent-soft:oklch(33% .09 302);--accent-soft-foreground:oklch(88% .07 305);--ring:oklch(82% .12 85);--input:oklch(56% .06 302);--destructive:oklch(70% .18 22);--danger-soft:oklch(30% .08 20);--danger-foreground:oklch(87% .055 20);--warning:oklch(80% .13 75);--warning-soft:oklch(31% .06 70);--warning-foreground:oklch(88% .1 80);--shadow-sm:0 1px 2px oklch(8% .04 296/.5), 0 1px 3px oklch(8% .04 296/.4);--shadow-md:0 6px 16px oklch(8% .04 296/.55), 0 2px 4px oklch(8% .04 296/.4);--shadow-accent:0 6px 20px oklch(72% .15 302/.3)}}@media (prefers-reduced-motion:reduce){:root{--s-hover:1;--s-press:1;--s-card:1;--s-card-press:1}}*{box-sizing:border-box}body{background:var(--background);color:var(--foreground);margin:0;font-family:system-ui,sans-serif;font-size:18px;line-height:1.4}.page{flex-direction:column;gap:1rem;max-width:32rem;margin:0 auto;padding:1rem;display:flex}.shell{max-width:36rem;font-family:var(--font-body);flex-direction:column;gap:24px;margin:0 auto;padding:24px 16px 40px;font-size:16px;line-height:1.6;display:flex}.shell h1{font-family:var(--font-heading);text-wrap:balance;margin:0;font-size:30px;font-weight:750;line-height:1.15}.shell h1.display{font-size:38px;font-weight:800}.shell .lead{color:var(--muted-foreground);max-width:65ch;margin:8px 0 0}.shell a{color:var(--accent-soft-foreground)}.shell :is(a,button,input,select,textarea):focus-visible{outline:2px solid var(--ring);outline-offset:2px}.card{background:var(--surface-raised);color:var(--foreground);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);align-content:start;gap:10px;padding:24px;display:grid;position:relative}@media (width<=600px){.card{padding:16px}}.card-title{font-family:var(--font-heading);margin:0;font-size:20px;font-weight:700;line-height:1.25}.card-meta{color:var(--muted-foreground);margin:0;font-size:13px;font-weight:600;line-height:1.4}.choices{gap:16px;margin:0;padding:0;list-style:none;display:grid}.card-link{cursor:pointer;transition:transform var(--t-hover) var(--ease), box-shadow var(--t-hover) var(--ease);grid-template-columns:auto 1fr;align-items:center;column-gap:16px;transform:scale(1)}.card-link .tile{background:var(--surface-sunken);width:48px;height:48px;color:var(--foreground);transition:background-color var(--t-hover) var(--ease), color var(--t-hover) var(--ease);border-radius:14px;grid-row:span 2;place-items:center;display:grid}.card-link .tile svg{width:24px;height:24px}.card-link .stretch{color:inherit;text-decoration:none}.card-link .stretch:after{content:"";border-radius:var(--radius-xl);position:absolute;inset:0}.card-link:has(.stretch:focus-visible){outline:2px solid var(--ring);outline-offset:2px}.card-link .stretch:focus-visible{outline:none}@media (hover:hover){.card-link:hover{transform:scale(var(--s-card));box-shadow:var(--shadow-md)}.card-link:hover .stretch{color:var(--accent-solid)}.card-link:hover .tile{background:var(--accent-soft);color:var(--accent-soft-foreground)}}.card-link:active{transform:scale(var(--s-card-press));box-shadow:var(--shadow-sm);transition-duration:var(--t-press)}.field{gap:6px;min-width:0;display:grid}.field label,.field>span{font-size:15px;font-weight:600;line-height:1.4}.field-msg{color:var(--muted-foreground);margin:0;font-size:13px;font-weight:600;line-height:1.4}.input,.field input{border:1px solid var(--input);border-radius:var(--radius-sm);background:var(--surface-raised);width:100%;min-height:44px;color:var(--foreground);font-family:var(--font-body);transition:border-color var(--t-hover) var(--ease);padding:0 14px;font-size:16px}@media (hover:hover){.input:not(:disabled):hover,.field input:not(:disabled):hover{border-color:var(--accent-solid)}}.field input:focus-visible{border-color:var(--accent-solid)}.field input:disabled{background:var(--surface-sunken);color:var(--muted-foreground);cursor:not-allowed}.field input[type=file]{cursor:pointer;padding:6px}.field input[type=file]::file-selector-button{background:var(--accent-soft);min-height:32px;color:var(--accent-soft-foreground);font:inherit;cursor:pointer;border:0;border-radius:999px;margin-right:12px;padding:0 14px;font-size:15px;font-weight:600}.code-input{text-align:center;min-height:64px;font-family:var(--font-heading);letter-spacing:.3em;font-variant-numeric:tabular-nums;font-size:36px;font-weight:800}.form{gap:20px;display:grid}.btn{--bg:transparent;--fg:var(--foreground);--sh:none;--s:1;background:var(--bg);min-height:44px;color:var(--fg);box-shadow:var(--sh);font-family:var(--font-body);cursor:pointer;white-space:nowrap;transform:scale(var(--s));transition:transform var(--t-hover) var(--ease), background-color var(--t-hover) var(--ease), color var(--t-hover) var(--ease), box-shadow var(--t-hover) var(--ease);touch-action:manipulation;border:0;border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:0 18px;font-size:15px;font-weight:600;line-height:1.4;text-decoration:none;display:inline-flex}.shell a.btn{color:var(--fg)}.btn svg{flex:none;width:18px;height:18px}.btn-lg{min-height:48px;padding:0 22px}.btn-primary{--bg:var(--primary);--fg:var(--primary-foreground)}.btn-quiet{--bg:transparent;--fg:var(--foreground);align-self:flex-start}@media (hover:hover){.btn:hover{--s:var(--s-hover)}.btn-primary:hover{--bg:var(--primary-hover);--sh:var(--shadow-accent)}.btn-quiet:hover{--bg:var(--accent-soft);--fg:var(--accent-soft-foreground)}}.btn:active{--s:var(--s-press);--sh:none;transition-duration:var(--t-press)}.btn-primary:active{--bg:var(--accent-solid-pressed);--fg:var(--on-accent)}.btn-quiet:active{--bg:var(--accent-soft);--fg:var(--accent-solid-pressed)}.btn:disabled,.btn:disabled:hover,.btn:disabled:active{--bg:var(--surface-sunken);--fg:var(--muted-foreground);--sh:none;--s:1;cursor:not-allowed}.btn[aria-busy=true],.btn[aria-busy=true]:hover{cursor:progress}button.primary{min-height:3.25rem;font:inherit;color:#fff;background:#1d4ed8;border:0;border-radius:.75rem;font-weight:700}button.primary:disabled{background:#9ca3af}.error,.warning{border-radius:var(--radius-sm);align-items:flex-start;gap:10px;margin:0;padding:12px 14px;font-size:15px;font-weight:600;line-height:1.4;display:flex}.error:before,.warning:before{content:"!";border-radius:50%;flex:none;place-items:center;width:20px;height:20px;font-size:13px;font-weight:800;display:grid}.error{background:var(--danger-soft);color:var(--danger-foreground)}.error:before{background:var(--danger-foreground);color:var(--danger-soft)}.warning{background:var(--warning-soft);color:var(--warning-foreground)}.warning:before{background:var(--warning-foreground);color:var(--warning-soft)}.hint{color:var(--muted-foreground);margin:0;font-size:13px;font-weight:600;line-height:1.4}.code{letter-spacing:.15em;text-align:center;font-variant-numeric:tabular-nums;margin:0;font-size:4.5rem;font-weight:800}.stage{background:#000;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.stage.idle{cursor:none}.pdf-error{flex-direction:column;align-items:center;gap:1rem;display:flex;position:absolute}.stage canvas{display:block}.stage-buttons{gap:.75rem;display:flex;position:fixed;bottom:1rem;right:1rem}.stage-buttons .primary{opacity:.7;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:manipulation;padding:0 1.25rem}.stage.idle .stage-buttons:not(:focus-within):not(.holding){display:none}.code-reveal{pointer-events:none;color:#fff;letter-spacing:.08em;font-variant-numeric:tabular-nums;text-shadow:0 0 24px #000;justify-content:center;align-items:center;font-size:min(22vw,30vh);font-weight:800;display:flex;position:fixed;inset:0}.role-choices{gap:16px;display:grid}.role-button{min-height:120px;font-size:28px;font-weight:700}.control{height:100dvh;padding:.75rem;padding-bottom:calc(.75rem + env(safe-area-inset-bottom));flex-direction:column;gap:.75rem;max-width:32rem;margin:0 auto;display:flex}.control-top{flex-direction:column;flex:none;gap:.25rem;display:flex}.control-bar{justify-content:space-between;align-items:center;gap:.5rem;display:flex}.control-bar-toggle{min-height:22px;color:inherit;font:inherit;text-align:left;cursor:pointer;touch-action:manipulation;background:0 0;border:0;flex:1;align-items:center;gap:.5rem;padding:0;font-size:.9rem;display:flex}.control-bar-arrow{width:1em}.conn-dot{border-radius:50%;flex:none;width:.75rem;height:.75rem}.conn-dot.ok{background:var(--control-dot-ok)}.conn-dot.off{background:var(--control-dot-off)}.control-bar-body{grid-template-columns:1fr auto 1fr;align-items:center;gap:.5rem;display:grid}.control-bar-body .conn{grid-area:1/3;justify-self:end}.control-action{border:1px solid var(--control-muted);width:40px;height:40px;color:inherit;cursor:pointer;touch-action:manipulation;background:0 0;border-radius:999px;grid-area:1/2;place-items:center;padding:0;display:grid}.control-action svg{width:20px;height:20px}.control-code{letter-spacing:.1em;font-variant-numeric:tabular-nums;font-size:1.5rem;font-weight:800}.conn{color:#fff;border-radius:1rem;padding:.25rem .75rem;font-weight:700}.conn.ok{background:var(--control-ok)}.conn.off{background:var(--control-off)}.control-timers{flex:none;grid-template-columns:1fr auto 1fr;align-items:center;gap:.5rem;display:grid}.control-timer{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;cursor:pointer;color:inherit;font:inherit;text-align:left;touch-action:manipulation;background:0 0;border:0;border-radius:.75rem;flex-direction:column;gap:.1rem;padding:.25rem .5rem;display:flex;position:relative}.control-timer.main{text-align:right;align-items:flex-end}.control-timer-pause{color:var(--control-pause-fg);background:var(--control-pause-bg);pointer-events:none;border-radius:.75rem;justify-content:center;align-items:center;font-size:2.5rem;display:flex;position:absolute;inset:0}.control-timer-ring{pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.control-timer-ring rect{fill:none;stroke:var(--control-ring);stroke-width:4px;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1px;animation:.8s linear -300ms forwards control-ring-fill}@keyframes control-ring-fill{to{stroke-dashoffset:0}}@media (prefers-reduced-motion:reduce){.control-timer-ring rect{stroke-dashoffset:0;animation:none}}.control-timer-label{color:var(--control-muted);font-size:.85rem}.control-timer-value{font-variant-numeric:tabular-nums;font-size:2.5rem;font-weight:800;line-height:1.1}.control-middle{flex-direction:column;flex:1;gap:.5rem;min-height:0;display:flex}.control-timers .control-timer.main{grid-area:1/3}.control-counter{text-align:center;font-variant-numeric:tabular-nums;grid-area:1/2;margin:0;font-size:2rem;font-weight:800}.control-notes{white-space:pre-wrap;overflow-wrap:anywhere;flex:1;min-height:0;font-size:24px;line-height:1.4;overflow-y:auto}.control-notes.empty{color:var(--control-muted)}.control-notes>:first-child{margin-top:0}.control-notes p,.control-notes ul,.control-notes ol{margin:0 0 .6em}.control-notes ul,.control-notes ol{padding-left:1.4em}.control-notes h1,.control-notes h2,.control-notes h3,.control-notes h4,.control-notes h5,.control-notes h6{margin:.6em 0 .3em;font-size:1em;line-height:1.25}.control-notes h1{font-size:1.4em}.control-notes h2{font-size:1.25em}.control-notes h3{font-size:1.1em}.control-slide{flex:1;justify-content:center;align-items:center;min-height:0;display:flex;overflow:hidden}.control-slide-msg{text-align:center;color:var(--control-muted)}.control-buttons{grid-template-columns:1fr 48px 2fr;gap:.75rem;height:max(16.5dvh,140px);display:grid}.control-rail{background:var(--control-surface);border-radius:.75rem;flex-direction:column;align-items:center;gap:6px;padding:4px 0;display:flex}.control-rail-button{border:1px solid var(--control-muted);width:40px;height:40px;color:inherit;cursor:pointer;touch-action:manipulation;background:0 0;border-radius:.75rem;place-items:center;padding:0;display:grid}.slide-frame{line-height:0;display:block;position:relative}.slide-frame canvas{display:block}.drawing-layer{pointer-events:none;position:absolute;inset:0}.drawing-layer.drawing{pointer-events:auto;touch-action:none;cursor:crosshair}.drawing-layer.erasing{cursor:cell}.drawing-line.animating{stroke-dasharray:1;animation:linear both draw-line}@keyframes draw-line{0%{stroke-dashoffset:1px;filter:drop-shadow(0 0 6px #ff3b30)drop-shadow(0 0 14px #ff3b30)}to{stroke-dashoffset:0;filter:drop-shadow(0 0 6px #ff3b30)drop-shadow(0 0 14px #ff3b30)}}.control-drawing-error{text-align:center;margin:0;padding:.25rem .5rem}.control-rail-button.active{background:var(--control-muted);color:var(--control-surface)}.control-rail-button svg{width:22px;height:22px}.control-buttons .primary{touch-action:manipulation;border-radius:1rem;font-size:1.75rem}:root{--control-bg:#1d1b33;--control-text:#e5e7eb;--control-surface:#2b2850;--control-muted:#a8a6c8;--control-link:#c4b5fd;--control-ok:#15803d;--control-off:#b91c1c;--control-dot-ok:#4ade80;--control-dot-off:#f87171;--control-ring:#a5b4fc;--control-pause-fg:#fff;--control-pause-bg:#00000059}body.control-theme{overscroll-behavior-y:none}html:has(body.control-theme){overscroll-behavior-y:none}body.control-theme{background:var(--control-bg);color:var(--control-text);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}body.control-theme a{color:var(--control-link)}body.control-theme button.primary{background:var(--control-surface);color:var(--control-text);border:1px solid var(--control-muted)}body.control-theme button.primary:disabled{color:var(--control-muted);border-color:var(--control-surface)}body.control-theme .control-top{background:var(--control-surface);border-radius:.75rem;padding:0 .75rem}body.control-theme .hint{color:var(--control-muted)}.admin-table{border-collapse:collapse;width:100%;font-size:14px}.admin-table th,.admin-table td{text-align:left;border-bottom:1px solid var(--input);padding:6px 8px}.admin-table thead th{color:var(--muted-foreground);font-size:13px}@media (width<=600px){.admin-table{display:block;overflow-x:auto}}
