@font-face{font-family:Departure Mono;src:url(/comp4020-crit4-Yimche/_astro/DepartureMono-Regular.2BZob_Zz.woff2)format("woff2"),url(/comp4020-crit4-Yimche/_astro/DepartureMono-Regular.DBuWTdvd.woff)format("woff");font-weight:400;font-style:normal;font-display:swap}:root{--ink:#0a0a16;--panel:#141a3a;--panel-2:#1a2140;--line:#05061a;--text:#eef1ff;--muted:#9aa0c8;--hue-lead:#ffd23f;--hue-harmony:#ff5d8f;--hue-bass:#34d1bf;--hue-perc:#b98bff;--pixel:4px;--retro:"Departure Mono", ui-monospace, "Courier New", monospace;--mono:"Departure Mono", ui-monospace, "Courier New", monospace}*{box-sizing:border-box}html,body{height:100%;margin:0}html{font-size:150%}body{color:var(--text);font-family:var(--retro);-webkit-font-smoothing:none;user-select:none;background:radial-gradient(circle at 50% 12%,#241247 0%,#0000 60%),linear-gradient(#0d0a1e 0%,#060510 100%);overflow-x:hidden}img{image-rendering:pixelated;-webkit-user-drag:none}header nav{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.app{flex-direction:column;justify-content:flex-start;align-items:center;min-height:100vh;display:flex;position:relative}.stage{aspect-ratio:384/216;background:var(--ink);width:100%;max-width:177.778vh;margin:0 auto;position:relative;overflow:hidden}.backdrop{object-fit:fill;width:100%;height:100%;position:absolute;inset:0}.stage-fg{object-fit:fill;z-index:1;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.show-title{z-index:6;color:#fff;text-shadow:var(--pixel) var(--pixel) 0 var(--line);letter-spacing:1px;pointer-events:none;margin:0;font-size:clamp(.7rem,2.2vw,1.6rem);position:absolute;top:3%;left:3%}.stage-tools{z-index:6;gap:.3rem;display:flex;position:absolute;top:15%;left:3%}.tool{font-family:var(--retro);color:var(--text);background:var(--panel-2);border:var(--pixel) solid var(--line);cursor:pointer;border-radius:0;min-height:30px;padding:.4rem .5rem;font-size:clamp(.48rem,1.4vw,.72rem)}.tool:hover,.tool:focus-visible{color:var(--ink);background:var(--hue-lead)}.tool:active{transform:translate(1px,1px)}.dev-note{font-family:var(--retro);color:var(--muted);border-bottom:var(--pixel) solid color-mix(in srgb, var(--muted) 30%, transparent);margin:0 0 2px;padding:.1rem .4rem .35rem;font-size:clamp(.4rem,1.1vw,.56rem)}.tune-menu[hidden]{display:none}.tune-menu{z-index:7;background:color-mix(in srgb, var(--ink) 88%, transparent);border:var(--pixel) solid var(--hue-lead);box-shadow:var(--pixel) var(--pixel) 0 var(--line);white-space:nowrap;flex-direction:column;gap:2px;padding:.3rem;display:flex;position:absolute;top:calc(100% + .3rem);left:0}.tune-pick{font-family:var(--retro);color:var(--text);background:var(--panel-2);border:var(--pixel) solid var(--line);cursor:pointer;text-align:left;border-radius:0;justify-content:space-between;align-items:baseline;gap:.8rem;min-height:30px;padding:.4rem .5rem;font-size:clamp(.48rem,1.4vw,.72rem);display:flex}.tune-pick:hover,.tune-pick:focus-visible{color:var(--ink);background:var(--hue-lead)}.tune-pick .tune-bpm{color:var(--muted);font-size:.85em}.tune-pick:hover .tune-bpm,.tune-pick:focus-visible .tune-bpm{color:var(--ink)}.tune-pick.is-loaded{border-color:var(--hue-lead);box-shadow:inset 3px 0 0 var(--hue-lead)}.save-panel[hidden]{display:none}.save-panel{z-index:7;background:color-mix(in srgb, var(--ink) 88%, transparent);border:var(--pixel) solid var(--hue-lead);width:min(78vw,22rem);box-shadow:var(--pixel) var(--pixel) 0 var(--line);flex-direction:column;gap:.4rem;padding:.4rem;display:flex;position:absolute;top:calc(100% + .3rem);left:0}.save-hint{font-family:var(--retro);color:var(--muted);margin:0;font-size:clamp(.44rem,1.2vw,.62rem);line-height:1.5}.save-hint code{color:var(--text)}.save-hint[data-copied=true]:after{content:" Copied.";color:var(--hue-lead)}.save-text{box-sizing:border-box;resize:vertical;width:100%;font-family:var(--mono,ui-monospace, monospace);color:var(--text);background:var(--panel-2);border:var(--pixel) solid var(--line);white-space:pre;border-radius:0;padding:.4rem .5rem;font-size:.86rem;line-height:1.3;overflow:auto}.save-copy{align-self:flex-start}.group,.conductor{transform-origin:bottom;cursor:pointer;z-index:2;background:0 0;border:none;flex-direction:column;justify-content:flex-end;align-items:center;padding:0;display:flex;position:absolute;transform:translate(-50%)}.sprite{filter:brightness(.5)saturate(.7);width:100%;height:auto;transition:filter .14s steps(3,end),transform .12s steps(2,end);display:block}.beams{z-index:1;pointer-events:none;position:absolute;inset:0}.director-beam{z-index:2;pointer-events:none;clip-path:inset(0 0 0 32.8%);position:absolute;inset:0}.director-valance{object-fit:fill;z-index:3;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.beam{transform-origin:top;background:linear-gradient(180deg, color-mix(in srgb, var(--hue,#fff) 85%, transparent) 0%, transparent 88%);clip-path:polygon(42% 0,58% 0,100% 100%,0 100%);opacity:0;mix-blend-mode:screen;transition:opacity .18s steps(3,end);position:absolute;transform:translate(-50%)}.beam.on{opacity:.5}.beam.flash{opacity:.8}.stage.running .beam[data-beam=director]{opacity:.5}.tag{color:var(--hue,var(--muted));text-shadow:2px 2px 0 var(--line);opacity:0;white-space:nowrap;margin-top:4px;font-size:clamp(.32rem,.9vw,.5rem);transition:opacity .14s steps(2,end)}.group:hover .tag,.group:focus-visible .tag,.group.lit .tag,.group.editing .tag{opacity:1}.group.lit .sprite{filter:brightness(1.15) saturate(1.2) drop-shadow(0 0 10px var(--hue))}.group.flash .sprite{filter:brightness(1.5) saturate(1.3) drop-shadow(0 0 16px var(--hue));transform:translateY(-6%)}.group.editing{outline:var(--pixel) dashed var(--hue);outline-offset:4px;z-index:3}.group:disabled{cursor:default}.group:focus-visible,.conductor:focus-visible{outline:var(--pixel) solid #fff;outline-offset:4px}.conductor .sprite{filter:brightness(.6)}.stage.awake .conductor .sprite{filter:brightness(1.1)drop-shadow(0 0 8px #fff3cf)}@keyframes bounce{0%{transform:translate(-50%)translateY(0)}30%{transform:translate(-50%)translateY(-18%)}55%{transform:translate(-50%)translateY(0)}72%{transform:translate(-50%)translateY(-7%)}to{transform:translate(-50%)translateY(0)}}.bounce{animation:.52s steps(6,end) bounce}.invite{text-align:center;max-width:74%;color:var(--ink);background:var(--hue-lead);border:var(--pixel) solid var(--line);box-shadow:var(--pixel) var(--pixel) 0 var(--line);z-index:6;pointer-events:none;margin:0;padding:.7rem 1rem;font-size:clamp(.56rem,1.8vw,.98rem);line-height:1.7;animation:1.6s steps(2,end) infinite nudge;position:absolute;bottom:52%;left:50%;transform:translate(-50%)}@keyframes nudge{50%{transform:translate(-50%,-6px)}}.greeter[hidden]{display:none}.greeter{z-index:40;position:fixed;inset:0}.greeter-open{width:100%;height:100%;font-family:var(--retro);cursor:pointer;background:0 0;border:0;margin:0;padding:0;position:absolute;inset:0;overflow:hidden}.greeter.opening{pointer-events:none}.curtain{background:repeating-linear-gradient(90deg,#560c1d 0,#8a1530 10px,#bb2846 20px,#8a1530 30px,#560c1d 40px);width:51%;transition:transform 1.1s cubic-bezier(.6,0,.2,1);position:absolute;top:0;bottom:0}.curtain-left{border-right:var(--pixel) solid var(--hue-lead);left:0}.curtain-right{border-left:var(--pixel) solid var(--hue-lead);right:0}.greeter.opening .curtain-left{transform:translate(-102%)}.greeter.opening .curtain-right{transform:translate(102%)}.greeter-valance{background-image:var(--valance);height:8vw;image-rendering:pixelated;background-position:0 0;background-repeat:repeat-x;background-size:auto 100%;transition:transform .9s cubic-bezier(.6,0,.2,1);position:absolute;top:0;left:0;right:0}.greeter.opening .greeter-valance{transform:translateY(-130%)}.greeter-text{text-align:center;flex-direction:column;gap:1.1rem;width:84%;animation:2.6s ease-in-out infinite alternate greeter-float;display:flex;position:absolute;top:44%;left:50%;transform:translate(-50%,-50%)}.greeter-title{color:var(--hue-lead);text-shadow:var(--pixel) var(--pixel) 0 var(--line);font-size:clamp(1.1rem,4.6vw,2.6rem);line-height:1.6}.greeter-cue{color:var(--text);font-size:clamp(.7rem,2.4vw,1.3rem);line-height:1.7}.greeter.opening .greeter-text{opacity:0;transition:opacity .3s;animation:none}@keyframes greeter-float{0%{transform:translate(-50%,calc(-50% - 6px))}to{transform:translate(-50%,calc(6px - 50%))}}.podium[hidden]{display:none}.podium{z-index:6;background:color-mix(in srgb, var(--ink) 86%, transparent);border:var(--pixel) solid #fff3cf;box-shadow:var(--pixel) var(--pixel) 0 var(--line);white-space:nowrap;align-items:center;gap:.3rem;padding:.35rem;display:flex;position:absolute;bottom:40%;left:37%;transform:translate(-50%)}.podium:after{content:"";left:50%;bottom:calc(-2 * var(--pixel));width:var(--pixel);height:calc(2 * var(--pixel));background:#fff3cf;position:absolute;transform:translate(-50%)}.podium button{font-family:var(--retro);color:var(--text);background:var(--panel-2);border:var(--pixel) solid var(--line);box-shadow:2px 2px 0 var(--line);cursor:pointer;border-radius:0;min-width:34px;min-height:34px;padding:.4rem .5rem;font-size:.7rem}.podium button:active{box-shadow:none;transform:translate(2px,2px)}.podium .bpm{color:var(--hue-lead);text-align:center;min-width:5.4rem;font-size:.7rem}[data-transport][aria-pressed=true]{background:var(--hue-bass);color:var(--ink)}.editor[hidden]{display:none}.editor{z-index:20;pointer-events:none;position:fixed;top:0;left:0}.sheet{pointer-events:auto;background:color-mix(in srgb, var(--ink) 88%, transparent);border:var(--pixel) solid var(--hue,#e7b23a);max-width:92vw;max-height:60vh;box-shadow:var(--pixel) var(--pixel) 0 var(--line);padding:.5rem .6rem .6rem;overflow:auto}.sheet-head{justify-content:space-between;align-items:center;gap:1rem;margin-bottom:.8rem;display:flex}.sheet-head h2{color:var(--hue,var(--text));text-shadow:2px 2px 0 var(--line);margin:0;font-size:.95rem}.sheet-actions{align-items:center;gap:.5rem;display:flex}.done,.clear-part{font-family:var(--retro);color:var(--ink);background:var(--hue-lead);border:var(--pixel) solid var(--line);box-shadow:2px 2px 0 var(--line);cursor:pointer;min-height:44px;padding:.6rem 1rem;font-size:.8rem}.clear-part{color:var(--text);background:color-mix(in srgb, var(--hue,#e7b23a) 30%, transparent)}.done:active,.clear-part:active{box-shadow:none;transform:translate(2px,2px)}.rack[hidden]{display:none}.grid{grid-template-columns:repeat(16,24px);gap:3px;display:grid}.cell{aspect-ratio:1;cursor:pointer;background:#2a1622;border:2px solid #140810;min-width:0;padding:0;box-shadow:inset 0 0 0 1px #ffffff14}.cell[data-col="0"],.cell[data-col="4"],.cell[data-col="8"],.cell[data-col="12"]{background:#3d2033}.cell.on{background:var(--hue);border-color:var(--goldedge,#e7b23a);box-shadow:inset 0 0 0 2px #fff6e0cc, 0 0 8px 1px color-mix(in srgb, var(--hue) 70%, transparent)}.cell.beat{outline:2px solid var(--hue-lead);outline-offset:-2px}.cell.on.beat{box-shadow:0 0 14px 3px var(--hue), inset 0 0 0 2px #fff}.cell:focus-visible{outline-offset:-1px;outline:3px solid #fff6e0}@media (width<=640px){.grid{grid-template-columns:repeat(16,30px)}.sheet{max-height:70vh}.podium{gap:.2rem;padding:.25rem}.podium button{min-width:30px;min-height:30px;padding:.3rem .35rem;font-size:.58rem}.podium .bpm{min-width:4.4rem;font-size:.58rem}.stage-tools{top:17%}.tool{min-height:28px;padding:.3rem .4rem}}@media (prefers-reduced-motion:reduce){.invite,.bounce,.sheet,.sprite,.greeter-text,.curtain,.greeter-valance{transition:none;animation:none}.greeter.opening{opacity:0;transition:opacity .3s}}