@layer components{.classroom-stage{--lamp:clamp(2rem, 5svh, 3rem);--lamp-red:#d0402f;--lamp-yellow:#e0a100;--lamp-green:#2f9a58}:root[data-theme=dark] .classroom-stage{--lamp-red:#f0614f;--lamp-yellow:#f5c33b;--lamp-green:#4cc27b}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .classroom-stage{--lamp-red:#f0614f;--lamp-yellow:#f5c33b;--lamp-green:#4cc27b}}.classroom-stage .stage-digits{--max:min(38svh, calc(100svh - 37rem))}@media (width>=51.25rem){.classroom-stage .stage-digits{--max:min(39svh, calc(100svh - 33rem))}}.class-corner{min-height:calc(var(--lamp) + 1rem);justify-content:space-between;align-items:flex-start;gap:1rem;margin-top:.5rem;display:flex}@media (width>=51.25rem){.class-corner{z-index:2;top:calc(var(--stage-y) + 3.5rem);right:var(--stage-x);left:var(--stage-x);pointer-events:none;margin-top:0;position:absolute}.class-corner>*{pointer-events:auto}}.class-light{border:1px solid var(--rule);background:color-mix(in srgb, var(--ink) 4%, transparent);border-radius:999px;gap:clamp(.375rem,1.2svh,.625rem);padding:clamp(.25rem,.8svh,.4375rem);display:flex}.class-lamp{--lamp-color:var(--lamp-red);width:var(--lamp);height:var(--lamp);border:2px solid var(--control);background:color-mix(in srgb, var(--lamp-color) 16%, var(--paper));cursor:pointer;border-radius:999px;flex:none;justify-content:center;align-items:center;transition:background-color .2s,box-shadow .2s;display:inline-flex;position:relative}.class-lamp[data-color=yellow]{--lamp-color:var(--lamp-yellow)}.class-lamp[data-color=green]{--lamp-color:var(--lamp-green)}.class-lamp[aria-pressed=true]{border-color:var(--lamp-color);background:var(--lamp-color);box-shadow:0 0 0 3px var(--paper), 0 0 0 5px var(--ink), 0 0 1.5rem .25rem color-mix(in srgb, var(--lamp-color) 55%, transparent)}.class-lamp:focus-visible{outline:3px solid var(--accent);outline-offset:4px}.class-lamp-word{display:none}.class-lamp-key{min-width:1.25rem;padding:.125rem .3125rem;font-size:.6875rem;position:absolute;top:calc(100% + .5rem);left:50%;transform:translate(-50%)}.class-clock{color:var(--ink);font-family:var(--serif);white-space:nowrap;font-variant-numeric:tabular-nums;text-align:right;font-size:min(clamp(1.25rem,3.6svh,2.25rem),7.5vw);font-weight:500;line-height:1.1}.class-above{flex-direction:column;align-items:center;width:100%;margin-top:clamp(.25rem,1svh,.5rem);display:flex}.classroom-stage .stage-status{text-overflow:ellipsis;white-space:nowrap;max-width:100%;overflow:hidden}.class-stage{max-width:100%;min-height:1.5em;color:var(--ink-2);justify-content:center;align-items:center;gap:.75rem;font-size:clamp(1rem,2.4svh,1.375rem);font-weight:600;line-height:1.5;display:flex}.class-stage-text{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.class-dots{flex:none;align-items:center;gap:.375rem;display:flex}.class-dot{border:1.5px solid var(--control);border-radius:999px;width:.625rem;height:.625rem}.class-dot[data-dot=done]{border-color:var(--ink-3);background:var(--ink-3)}.class-dot[data-dot=current]{border-color:var(--accent);background:var(--accent);width:1.375rem}.class-line{max-width:100%;min-height:1.2em;color:var(--ink);font-family:var(--serif);text-overflow:ellipsis;white-space:nowrap;margin-top:clamp(.25rem,1.4svh,.875rem);font-size:min(clamp(1.625rem,6svh,3.5rem),6.4cqw);font-weight:500;line-height:1.2;overflow:hidden}.class-slot{width:min(100%,24rem);margin-top:clamp(1rem,3svh,1.75rem);display:grid}.class-slot>*{grid-area:1/1}.class-slot>.stage-lengths{width:100%;margin-top:0}.class-lesson{grid-template-columns:repeat(2,minmax(0,1fr));gap:.375rem;display:grid}.class-lesson>.btn{min-width:0;height:2.75rem;padding-inline:.5rem;font-size:.875rem}.class-lesson>.btn>span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.classroom-stage .stage-controls{flex-wrap:wrap;justify-content:center}@media (width>=51.25rem){.classroom-stage .stage-controls{width:min(100%,42rem)}}.class-btn{white-space:nowrap;padding-inline:.75rem;font-size:.9375rem}.class-stages,.class-say{flex:calc(50% - .3125rem);order:3;min-width:max-content}@media (width<51.25rem){:is(.class-stages,.class-say) .class-btn,:is(.class-stages,.class-say).class-btn{height:2.75rem}}@media (width>=51.25rem){.class-stages,.class-say{flex:0 auto;order:0}}.classroom-stage .stage-start{flex:calc(100% - 4.125rem)}@media (width>=51.25rem){.class-stages{order:-1}.classroom-stage .stage-start{flex:12rem}}.class-say{position:relative}.class-say>.class-btn{width:100%}.class-panel{z-index:4;width:min(22rem, calc(100vw - 2 * var(--stage-x)));border:1px solid var(--rule);background:var(--amb-base,var(--sheet));box-shadow:var(--shadow);color:var(--ink);text-align:left;border-radius:1rem;padding:1rem;position:absolute;bottom:calc(100% + .5rem);right:0}.class-chips{flex-wrap:wrap;gap:.375rem;display:flex}.class-own{margin-top:.875rem}.class-own-label{color:var(--ink-2);margin-bottom:.3125rem;font-size:.875rem;display:block}.class-own-row{gap:.5rem;display:flex}.class-own-row>.input{flex:1;min-width:0}.class-clear{margin-top:.5rem;margin-left:-.75rem}.lesson-form{flex-direction:column;gap:1rem;padding-top:.25rem;display:flex}.lesson-examples{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.lesson-examples>.section-label{width:100%;margin:.5rem 0 0}.lesson-examples>.btn{text-align:left;white-space:normal;flex-shrink:1;min-width:0;height:auto;min-height:2.25rem;padding-block:.375rem}.lesson-list{flex-direction:column;gap:.5rem;display:flex}.lesson-row{grid-template-columns:1.25rem minmax(0,1fr) auto auto;align-items:center;gap:.5rem;display:grid}.lesson-number{color:var(--ink-3);font-variant-numeric:tabular-nums;text-align:right}.lesson-min{color:var(--ink-2);align-items:center;gap:.375rem;font-size:.875rem;display:flex}.lesson-min>.input{width:4.5rem}.lesson-actions{display:flex}@media (width<30rem){.lesson-row{grid-template-columns:1.25rem minmax(0,1fr) auto;row-gap:.25rem}.lesson-actions{grid-column:2/-1;justify-content:flex-end}}.lesson-more{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem;display:flex}.lesson-total{color:var(--ink-2);font-size:.875rem}.lesson-error{color:var(--margin-ink);font-size:.875rem;font-weight:500}.lesson-clear{margin-right:auto}.lesson-sets{padding-top:.25rem}.lesson-sets>.section-label{margin:.5rem 0 .375rem}.lesson-set-list{border-top:1px solid var(--rule)}.lesson-set{border-bottom:1px solid var(--rule);grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.25rem .75rem;padding:.5rem 0;display:grid}.lesson-set-text{flex-direction:column;gap:.125rem;min-width:0;display:flex}.lesson-set-name{color:var(--ink);overflow-wrap:anywhere;font-weight:600;line-height:1.35}.lesson-set-sum{color:var(--ink-2);font-size:.875rem}.lesson-set-actions{align-items:center;gap:.25rem;display:flex}.lesson-set-rename,.lesson-set-row{gap:.5rem;min-width:0;display:flex}:is(.lesson-set-rename,.lesson-set-row)>.input{flex:1;min-width:0}.lesson-set-rename{grid-column:1/-1}@media (width<30rem){.lesson-set{grid-template-areas:"name name""sum actions"}.lesson-set-text{display:contents}.lesson-set-name{grid-area:name}.lesson-set-sum{grid-area:sum}.lesson-set-actions{grid-area:actions;justify-content:flex-end}}.lesson-save{border-top:1px solid var(--rule);flex-direction:column;align-items:flex-start;gap:.5rem;margin-top:1rem;padding-top:1rem;display:flex}.lesson-save-btn{max-width:100%}.lesson-set-form{flex-direction:column;gap:.375rem;width:100%;display:flex}.lesson-set-label{color:var(--ink-2);font-size:.875rem;font-weight:500}.lesson-toast{z-index:1;justify-content:center;margin-top:1rem;display:flex;position:sticky;bottom:0}@media (height<32rem) and (width>=40rem){.classroom-stage .stage-digits{--max:calc(100svh - 21rem)}.class-above,.class-slot,.class-row{flex:none}.class-above{flex-basis:100%}.class-slot,.class-row{width:18rem}}@media (forced-colors:active){.class-lamp{border-color:canvastext}.class-lamp-word{font-size:.625rem;font-weight:600;line-height:1;display:block}.class-dot{border-color:canvastext}.class-dot[data-dot=done],.class-dot[data-dot=current]{forced-color-adjust:none;background:highlight;border-color:highlight}}@media (prefers-reduced-motion:reduce){.class-lamp{transition:none}}}