@font-face{font-family:PP Editorial;src:url(/beatmania/fonts/PPEditorialNew-Regular.otf) format("opentype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Inktera Demo;src:url(/beatmania/fonts/InkteraDemo.otf) format("opentype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Alte Haas Grotesk;src:url(/beatmania/fonts/AlteHaasGroteskRegular.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Alte Haas Grotesk;src:url(/beatmania/fonts/AlteHaasGroteskBold.ttf) format("truetype");font-weight:500 700;font-style:normal;font-display:swap}:root{--bg: #000000;--bg-band: #000000;--bg-pale: #000000;--bg-mint: #a6e5e1;--grid: #ffff00;--ink: #111111;--title: #b7bce8;--title-line: rgba(183, 188, 232, .9);--panel: #101010;--panel-ink: #e6e1d6;--panel-dim: #9a9488;--led: #ff3b2e;--danger-dim: #3a1210;color:var(--ink);font-family:Alte Haas Grotesk,Helvetica Neue,Arial,sans-serif;background:var(--bg)}*{box-sizing:border-box}html,body,#root{height:100%;max-width:100%;margin:0;overflow-x:clip}body{min-width:320px;overflow-y:hidden;background:var(--bg);color:var(--ink);overscroll-behavior-x:none}body,body *{letter-spacing:-.05em}button,input{font-family:inherit;letter-spacing:-.05em}button{cursor:pointer}button:disabled{cursor:not-allowed}button:focus-visible{outline:1px solid var(--grid);outline-offset:2px}.app{height:100%;min-height:100%;max-width:100%;display:grid;grid-template-rows:auto minmax(0,1fr);background:#000;color-scheme:dark;-webkit-user-select:none;user-select:none}.header{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:10px;padding:clamp(8px,1.2vh,16px) 2.6vw 10px;text-align:left}body .title{margin:0;color:#000;font-family:Inktera Demo,sans-serif;font-weight:400;font-size:clamp(40px,5.2vw,88px);letter-spacing:0;line-height:.86;padding-top:6px;-webkit-text-stroke:12px #d8d8d8;paint-order:stroke fill;transform-origin:center center;transform-style:preserve-3d;perspective:1400px;z-index:30}.header:has(.title.is-arriving){position:relative;z-index:50}@keyframes title-spin-pos{0%{transform:rotateY(0)}50%{transform:rotateY(180deg)}to{transform:rotateY(360deg)}}@keyframes title-spin-neg{0%{transform:rotateY(0)}50%{transform:rotateY(-180deg)}to{transform:rotateY(-360deg)}}body .title.is-intro{position:fixed;left:50%;top:50%;z-index:40;margin:0;transform:translate(-50%,-50%) scale(2.7)}body .title .title-letter,body .title .title-space{display:inline-block;transform-origin:center center;transform-style:preserve-3d;letter-spacing:0;font-kerning:normal}.view-nav{display:flex;flex:none;justify-content:flex-start;align-items:stretch;width:min(420px,46vw);margin:4px 0 0;border:2px solid #f4f1ea;background:#111}.view-tab{flex:1;height:auto;border:0;border-radius:0;background:#f4f1ea;color:#111;font-size:16px;font-weight:500;letter-spacing:0;padding:9px 14px 8px;box-shadow:none;transition:background .16s ease,color .16s ease}.view-tab:hover{background:#111;color:#ffe500}.view-tab+.view-tab{border-left:2px solid #111}.view-tab.is-active{background:#111;border-color:transparent;color:#f4f1ea;box-shadow:none}.view-tab.is-active:hover{color:#ffe500}.view-tab small,.mode-pill small{margin-left:8px;font-size:10px;color:#111}.view-tab:disabled{opacity:1;color:#111}.mode-pill:disabled{opacity:.55}.workspace{position:relative;min-width:0;min-height:0;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;grid-template-areas:"stage" "score";gap:8px 0;padding:10px 40px 8px}.side-stack{position:absolute;top:10px;right:40px;bottom:56px;z-index:4;display:flex;flex-direction:column;justify-content:space-between;align-items:stretch;width:248px;pointer-events:none}.pad-dock{z-index:3;width:100%;pointer-events:auto}.readout-stack{display:flex;flex-direction:column;gap:8px;width:100%;pointer-events:none}.workspace-center{grid-area:stage;min-width:0;min-height:0}.stage .graphic-stage{container-type:size;width:100%}.stage .circles-wrap{width:min(100cqw,calc(100cqh * 480 / 430));max-width:100%}.score-dock{grid-area:score;min-width:0;display:flex;align-items:flex-end;overflow:hidden}.score-dock .score-tape{width:100%}.stage{position:relative;min-height:0;height:100%;display:grid;grid-template-columns:minmax(0,1.2fr) clamp(72px,7vw,104px) minmax(0,1fr);align-items:center;justify-items:center;gap:.4vw;padding:1vh max(12px,calc((100% - 1306px)/2))}.band{position:absolute;left:0;right:0;top:16%;height:42%;background:none;pointer-events:none}.cube-stage,.graphic-stage{position:relative;z-index:1;min-width:0;height:100%}.cube-stage{justify-self:stretch;display:flex;align-items:center;justify-content:center;width:100%;min-height:0}.graphic-stage{display:flex;align-items:center;justify-content:center;overflow:visible}.cube-viewport{position:relative;width:100%;height:auto;aspect-ratio:1;max-height:100%;flex:none;touch-action:none}.cube-viewport canvas{display:block;width:100%;height:100%;cursor:grab}.cube-viewport canvas:active{cursor:grabbing}.circles-wrap{width:min(100%,54vh);position:relative;z-index:2;touch-action:none;cursor:grab}.circles-wrap.is-dragging{cursor:grabbing;z-index:4}.circles{display:block;width:100%;height:auto;overflow:visible}body .scale-mark{justify-self:center;align-self:center;margin:0;text-align:center;font-family:Inktera Demo,sans-serif;font-size:clamp(72px,7.2vw,124px);font-weight:400;letter-spacing:0;line-height:.85;color:#000;-webkit-text-stroke:12px #d8d8d8;paint-order:stroke fill;pointer-events:none}.panel{position:relative;display:flex;flex-direction:column;gap:8px;width:100%;padding:10px;background:#00000094;color:#f4f1ea;border:1px solid rgba(255,255,255,.16);border-radius:18px;box-shadow:inset 0 1px #ffffff14;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.patch-body{display:grid;grid-template-columns:minmax(168px,.85fr) minmax(280px,1.15fr) minmax(168px,.85fr);gap:10px;min-height:0}.meter-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;width:100%;padding:8px 10px 7px;border:1px solid rgba(255,255,255,.18);background:#0000009e}.meter-card span{color:#f4f1ea;font-size:11px;letter-spacing:.08em}.meter-card b{color:#f4f1ea;font-size:12px;font-weight:500;text-align:right}.meter-card em{grid-column:1 / -1;color:#8d887c;font-size:10px;font-style:normal;line-height:1.3}.meter-card.is-live{border-color:#7dff6a;background:#122410c7}.meter-card.is-live span,.meter-card.is-live b,.meter-card.is-live em{color:#7dff6a}.patch-core{display:flex;flex-direction:column;gap:6px;min-width:0;padding:0;border:0;background:transparent}.patch-title{display:flex;align-items:center;justify-content:space-between;gap:8px}body .patch-title strong{color:#000;font-family:Inktera Demo,sans-serif;font-size:16px;font-weight:400;letter-spacing:0;line-height:.9;-webkit-text-stroke:3px #d8d8d8;paint-order:stroke fill}.midi-led{width:7px;height:7px;border-radius:50%;background:#7dff6a;box-shadow:0 0 6px #7dff6ad9}.patch-title span{color:#7dff6a;font-size:11px}.action-bar{display:grid;grid-template-columns:1fr 1fr;gap:6px;width:100%;margin-top:8px;pointer-events:auto}.shuffle-cue{display:none}.action-bar .action-btn{height:36px;border-radius:12px;border:1px solid rgba(255,255,255,.16);background:#ffffff0f;color:#f4f1ea;font-size:11px;font-weight:700;letter-spacing:.08em}.action-bar .action-btn:disabled{opacity:.38}.patch-actions .action-btn{height:28px;font-size:11px}.score-tape{display:flex;align-items:center;justify-content:flex-start;gap:10px;width:100%;min-width:0;min-height:40px;padding-top:4px;overflow:hidden;border-top:1px solid rgba(255,255,255,.12)}.bpm-rail{position:absolute;top:10px;bottom:56px;left:40px;z-index:4;width:148px;display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:2px 0 12px}body .bpm-name{position:absolute;left:0;bottom:calc(50% + min(23vh,210px) + 74px);z-index:3;color:#000;font-family:Inktera Demo,sans-serif;font-size:36px;font-weight:400;letter-spacing:0;line-height:.9;-webkit-text-stroke:5px #d8d8d8;paint-order:stroke fill}.bpm-hint{position:absolute;left:0;bottom:calc(50% + min(23vh,210px) + 36px);z-index:3;width:130px;margin:0;color:#fff;font-size:11px;font-weight:700;line-height:1.35;text-align:left}.bpm-scale{position:absolute;top:50%;left:0;width:100%;height:min(46vh,420px);transform:translateY(-50%);border-left:1px solid rgba(255,255,255,.72);touch-action:none;cursor:ns-resize}.bpm-tick{position:absolute;left:0;display:flex;flex-direction:row-reverse;align-items:center;gap:5px;transform:translateY(-50%);color:#d8d8d8;font-size:11px;line-height:1;pointer-events:none}.bpm-tick b{font-weight:500}.bpm-tick i{display:block;width:14px;height:1px;background:#d8d8d8}.bpm-thumb{position:absolute;left:-1px;z-index:2;display:flex;flex-direction:row-reverse;align-items:center;gap:6px;padding:10px 12px 10px 0;transform:translateY(-50%);cursor:ns-resize}.bpm-thumb b{min-width:3.2ch;padding:2px 4px;background:#000000d1;color:#fff;font-size:14px;font-weight:500;line-height:1;text-align:right}.bpm-thumb i{width:26px;height:26px;background:#fff;border:1px solid #111111;box-shadow:0 0 0 1px #fff}.bpm-scale.is-dragging .bpm-thumb b{color:#7dff6a}.score-label{flex:none;color:#8d887c;font-size:11px}.score-tape ol{display:flex;flex:1;gap:6px;align-items:flex-end;justify-content:center;min-width:0;margin:0;padding:0;overflow:hidden;list-style:none;scrollbar-width:none}.beat-stack{display:flex;flex:0 0 auto;flex-direction:column;gap:4px;width:64px}.score-tape ol::-webkit-scrollbar{display:none}.beat{flex:none;width:100%;padding:4px 4px 3px;overflow:hidden;border:1px solid currentColor;background:#0000008c;text-align:center}.beat b{display:block;font-size:14px;font-weight:500;line-height:1.1}.beat span{display:block;color:currentColor;font-size:9px;opacity:.8}.beat.is-on{box-shadow:0 0 0 1px #fff,0 0 12px currentColor}.beat.is-live{box-shadow:0 0 12px currentColor}.beat-empty{width:76px;color:#8d887c}.board-ruler{position:absolute;left:22px;right:22px;display:flex;justify-content:space-between;color:#d5d5d5;font-size:8px;line-height:1;pointer-events:none}.board-ruler:before{content:"";position:absolute;left:0;right:0;height:8px;background:repeating-linear-gradient(90deg,#dedede 0 1px,transparent 1px 6px),repeating-linear-gradient(90deg,transparent 0 29px,#dedede 29px 30px);background-size:6px 5px,30px 8px;background-repeat:repeat-x;background-position:left bottom,left bottom}.board-ruler-top{top:5px}.board-ruler-bottom{bottom:5px}.board-ruler-top:before{top:11px}.board-ruler-bottom:before{bottom:11px}.tick-ruler{display:none}.screw{position:absolute;width:8px;height:8px;border-radius:50%;background:#000;box-shadow:inset 0 0 0 1.5px #cfcfcf,0 0 0 1px #000}.screw-a{top:8px;left:8px}.screw-b{top:8px;right:8px}.screw-c{bottom:8px;left:8px}.screw-d{bottom:8px;right:8px}.module{min-width:0;border:1px solid #e8e8e8;background:transparent;padding:8px 10px 10px}.module h2{display:flex;align-items:center;gap:8px;margin:0 0 10px;font-size:11px;font-weight:500;color:#f7f7f7}.led{width:7px;height:7px;border-radius:50%;background:var(--danger-dim);box-shadow:inset 0 0 0 1px #000;display:inline-block;flex:none}.led.on{background:var(--led);box-shadow:0 0 5px #ff3b2ed9}.launch-module{display:flex;flex-direction:column}.move-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(4,64px);grid-auto-flow:column;gap:6px}.move-btn,.action-btn,.mode-pill{border:1px solid #bdbdbd;border-radius:2px;background:#1c1c1c;color:#f7f7f7;box-shadow:inset 0 1px #3a3a3a,0 1px #000}.move-btn{position:relative;height:100%;min-height:28px;border-radius:14px;border:1px solid rgba(255,255,255,.16);background:#ffffff0f;color:#000;font-family:Inktera Demo,sans-serif;font-size:22px;font-weight:400;letter-spacing:0;line-height:1;-webkit-text-stroke:2px #d8d8d8;paint-order:stroke fill;box-shadow:none}.move-btn:before{content:none}.panel .action-btn{position:relative;height:36px;padding:0 6px;border-radius:12px;border:1px solid rgba(255,255,255,.16);background:#ffffff0f;color:#f4f1ea;box-shadow:none;font-size:10px;letter-spacing:.08em;white-space:nowrap}.move-btn.is-hot,.move-btn:active{transform:none;color:#000;border-color:#7dff6ab3;background:#7dff6a1f;-webkit-text-stroke-color:#7dff6a;box-shadow:none}.move-btn.is-hot:before,.move-btn:active:before{background:#7dff6a;box-shadow:0 0 6px #7dff6ae6}.panel .action-btn:active{transform:translateY(1px);box-shadow:inset 0 2px 4px #0000008c}.panel .action-btn.is-on{color:#7dff6a;border-color:#7dff6ab3;background:#7dff6a1f;box-shadow:none}.move-log{list-style:none;margin:0;padding:0 4px 0 0;height:84px;overflow:auto;font-size:12px}.score-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:8px}.score-name strong{display:block;font-weight:500;font-size:11px;line-height:1.35}.score-name span{display:block;margin-top:3px;color:#f4f4f4;font-size:11px}.play-btn{flex:none;width:76px;height:32px;font-size:11px}.patch-actions .play-btn,.patch-actions .action-btn{width:100%;height:36px}.play-btn.is-on,.score-list li.is-on b,.score-list li.is-on span{color:#ff3b2e}.play-btn.is-on{border-color:#ff3b2e}.play-btn:disabled{opacity:.4}.move-log li{display:grid;grid-template-columns:3.4em 1fr;gap:6px;padding:3px 0;border-bottom:1px solid rgba(255,255,255,.06)}.score-list li span{text-align:right;color:var(--panel-dim)}.log-empty{color:var(--panel-dim);border-bottom:0}.log-dash,.log-dir{color:var(--panel-dim)}.system-module{display:flex;flex-direction:column;gap:10px}.system-actions{display:flex;gap:8px}.action-btn{flex:1;height:38px;font-size:12px}.view-mode{display:flex;align-items:center;justify-content:space-between;gap:12px}.view-mode-label,.move-count span{font-size:10px;color:var(--panel-dim)}.view-mode-options{display:flex;gap:6px}.mode-pill{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;font-size:11px}.mode-pill.is-active{border-color:#6d6d6d;color:#fff}.move-count{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto}.move-count strong{min-width:4.4em;padding:4px 10px 3px;text-align:right;font-size:26px;font-weight:500;color:#ff5144;background:#160707;border:1px solid #3d1816}@media(max-width:1240px){.workspace{padding-inline:28px}.bpm-rail{left:28px}.side-stack{right:28px}}@media(max-width:1100px){body{overflow-x:clip;overflow-y:auto}.app{height:auto;min-height:100%}.workspace{grid-template-columns:1fr;grid-template-rows:minmax(420px,62vh) auto auto auto;grid-template-areas:"stage" "side" "score" "tempo";padding-inline:20px}.side-stack{position:static;grid-area:side;display:flex;flex-direction:column;gap:12px;width:auto;height:auto;pointer-events:auto}.pad-dock,.readout-stack{position:static;width:min(280px,100%);pointer-events:auto}.workspace .bpm-rail{position:static;grid-area:tempo;width:auto;height:220px}.workspace .bpm-name,.workspace .bpm-hint,.workspace .bpm-scale{position:static;top:auto;bottom:auto;width:auto;height:auto;transform:none}.workspace .bpm-scale{flex:1;width:100%;margin-top:20px}.stage{grid-template-columns:1fr;min-height:0;padding-inline:0}.cube-stage{height:min(78vh,960px)}.graphic-stage{height:auto;padding-bottom:12px}.circles-wrap{width:min(630px,92vw)}.patch-body{grid-template-columns:1fr}.move-log{height:72px}}@keyframes beat-fall{0%{transform:translateY(-36px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes cue-pulse{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}@media(min-width:1101px){.header{padding-top:66px}body .title{font-size:clamp(28px,2.8vw,48px);-webkit-text-stroke:6px #d8d8d8}.workspace{grid-template-rows:minmax(0,1fr);grid-template-areas:"stage";padding-bottom:118px}.score-dock{position:fixed;top:0;left:0;right:0;z-index:60;width:auto;height:auto;max-height:none;transform:none;align-items:flex-start;justify-content:center;overflow:visible;pointer-events:none;-webkit-mask-image:none;mask-image:none}.score-dock .score-tape{height:auto;align-items:flex-start;justify-content:center;border-top:0;background:transparent;padding:8px 20px 0;overflow:visible}.score-dock .score-tape ol{flex-direction:row;align-items:flex-start;justify-content:center;height:auto;gap:4px;overflow:visible}.score-dock .beat-stack{width:46px;gap:3px}.score-dock .beat{padding:3px 2px 2px}.score-dock .beat b{font-size:11px}.score-dock .beat span{font-size:8px}.score-dock .beat.is-drop{animation:beat-fall .42s cubic-bezier(.16,.84,.32,1) both}.action-bar{position:fixed;left:50%;right:auto;bottom:18px;z-index:8;width:max-content;margin:0;transform:translate(-50%);display:flex;justify-content:center;align-items:center;gap:12px}.shuffle-cue{display:block;position:absolute;left:50%;bottom:calc(100% + 12px);width:max-content;max-width:min(520px,70vw);margin:0;transform:translate(-50%);color:#f4f1ea;font-size:15px;font-weight:700;letter-spacing:-.04em;line-height:1.35;text-align:center}.action-bar .action-btn{flex:0 0 auto;height:42px;min-width:118px;padding:0 18px;border:1.5px solid #7dff6a;border-radius:999px;background:transparent;color:#7dff6a;font-size:13px;letter-spacing:.12em}.action-bar .action-btn.is-cue{border-color:#7dff6a;background:transparent;color:#7dff6a;animation:cue-pulse 1.3s ease-in-out infinite}.action-bar .action-btn:hover:not(:disabled),.action-bar .action-btn.is-cue:hover:not(:disabled){border-color:#7dff6a;background:#7dff6a;color:#111}.action-bar .action-btn.is-on{border-color:#7dff6a;background:#7dff6a;color:#111}}@media(prefers-reduced-motion:reduce){.score-dock .beat.is-drop,.action-bar .action-btn.is-cue{animation:none}}@media(max-width:640px){body .title{font-size:clamp(34px,11vw,52px)}}.stage-switch{min-width:0;min-height:0;height:100%}.view-pane{height:100%;min-width:0;min-height:0}.view-pane.is-hidden{display:none}.view-pane>.workspace{height:100%}.app.is-puzzle{background:#fff;color-scheme:light}html:has(.app.is-puzzle),body:has(.app.is-puzzle){background:#fff}.puzzle{position:relative;height:100%;min-height:0;display:grid;grid-template-columns:minmax(0,6fr) minmax(280px,4fr);grid-template-rows:minmax(0,1fr) minmax(160px,18vh) minmax(64px,10vh);grid-template-areas:"net path" "score score" "sequence sequence";background:#fff;color:#111;border-top:1px solid #111111}.puzzle-score{grid-area:score;position:relative;z-index:2;width:100%;min-width:0;min-height:0;display:flex;flex-direction:column;background:#000;border-top:1px solid #111111;border-bottom:1px solid #111111}.puzzle .bpm-rail{top:10px;bottom:calc(56px + 2*(min(23vh,210px) - min(18vh,170px)));left:40px;width:148px}.puzzle .bpm-name{bottom:calc(50% + min(14vh,130px) + 74px)}.puzzle .bpm-hint{left:0;bottom:calc(50% + min(14vh,130px) + 36px);width:130px;color:#111;letter-spacing:0;text-align:left}.puzzle .bpm-scale{height:min(28vh,260px);border-left-color:#111}.puzzle .bpm-tick{color:#111}.puzzle .bpm-tick i{background:#111}.puzzle .bpm-thumb b{background:#111;color:#fff}.puzzle .bpm-thumb i{background:#111;border-color:#111;box-shadow:none}@media(max-height:900px){.puzzle .bpm-rail{bottom:calc(max(18vh,160px) + max(10vh,64px) + 40px)}.puzzle .bpm-scale{height:min(20vh,170px)}.puzzle .bpm-name{bottom:calc(50% + min(10vh,85px) + 56px)}.puzzle .bpm-hint{bottom:calc(50% + min(10vh,85px) + 22px)}.puzzle .net-hint{width:100%;margin-left:0}}.puzzle-net{grid-area:net;min-width:0;min-height:0;display:flex;flex-direction:column;justify-content:center;padding:8px 12px 4px 228px;container-type:size}.puzzle-path{grid-area:path;min-width:0;min-height:0;display:flex;flex-direction:column;gap:8px;margin:12px 16px 12px 0;padding:0;border:0;border-radius:0;background:#fff;color:#111;box-shadow:none;overflow:visible}.puzzle-sequence{grid-area:sequence;min-width:0;min-height:0;display:flex;flex-direction:column;background:#d8d8d8}.puzzle-caption{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:28px;padding:8px 14px 6px}.puzzle-caption strong,.puzzle-caption span,.path-meta dt,.path-meta dd,.puzzle-clear,.puzzle-play,.roll-block,.score-hint{font-family:Alte Haas Grotesk,Helvetica Neue,Arial,sans-serif;letter-spacing:.12em}.puzzle-caption strong{color:#111;font-weight:500;font-size:12px;line-height:1;-webkit-text-stroke:0}.puzzle-path .puzzle-caption strong{color:#f4f1ea}.puzzle-score .puzzle-caption{position:absolute;top:6px;left:12px;z-index:1;min-height:0;padding:0}.puzzle-score .puzzle-caption strong{color:#f4f1ea;-webkit-text-stroke:0}.puzzle-score{cursor:pointer;overflow:hidden}.score-hint{position:absolute;left:0;right:0;bottom:0;margin:0;padding:0 12px 8px;color:#d8d8d8;font-size:12px;font-weight:500;letter-spacing:.04em;text-align:left}.puzzle-caption span,.path-meta dt{color:#111;font-size:11px;font-weight:500}.puzzle-path .path-meta dt{color:#8d887c}.score-svg{display:block;flex:1;width:100%;height:100%;min-height:0;background:#000}.net-board{position:relative;width:min(100cqw,calc((100cqh - 36px) * 4 / 3.15));max-height:calc(100cqh - 36px);aspect-ratio:4 / 3.15;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:8px 6px;margin:0 auto;touch-action:none}.net-slot{min-width:0;min-height:0;display:flex;flex-direction:column;align-items:flex-start;gap:3px}.net-face-name{width:calc(var(--cell, 40) * 3px + 4px);color:#111;font-size:10px;font-weight:500;letter-spacing:.16em;line-height:1}.net-face{flex:none;width:calc(var(--cell, 40) * 3px + 4px);height:calc(var(--cell, 40) * 3px + 4px);display:grid;grid-template-columns:repeat(3,calc(var(--cell, 40) * 1px));grid-template-rows:repeat(3,calc(var(--cell, 40) * 1px));gap:1px;padding:1px;overflow:hidden;background:#111;border:0}.net-hint{width:calc(100% + 216px);margin:6px 0 0 -216px;padding:0;color:#000;background:#fff;font-family:Alte Haas Grotesk,Helvetica Neue,Arial,sans-serif;font-size:12px;font-weight:500;letter-spacing:.04em;text-align:left}.net-cell{position:relative;display:block;width:100%;height:100%;padding:0;overflow:hidden;border:0;border-radius:0;background:#111;box-shadow:none}.net-cell.is-on{outline:1px solid #2d6bff;outline-offset:-1px;z-index:1}.net-photo{position:absolute;top:-1px;left:-1px;width:calc(100% + 2px);height:calc(100% + 2px);background-size:300% 300%;background-repeat:no-repeat;pointer-events:none}.net-draw{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.net-draw path{fill:none;stroke:#2d6bff;stroke-width:1.5;stroke-linecap:round}.path-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.path-meta article{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;align-items:baseline}.path-head span,.path-meta span{color:#111;font-size:12px;font-weight:500;letter-spacing:.08em;-webkit-text-stroke:0}.path-head b,.path-meta b,.path-meta em,.path-chain{color:#111;-webkit-text-stroke:0;paint-order:fill}.path-meta em{grid-column:1 / -1;color:#111;font-size:12px;font-style:normal}.path-chain{margin:8px 0 0;min-height:0;max-height:none;overflow:visible;color:#111;font-size:28px;font-weight:700;letter-spacing:0;line-height:1.25}.path-meta{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:14px 0 0;padding-top:12px;border-top:1px solid #111111}.path-meta b{font-size:44px;font-weight:700;line-height:.9;text-align:right}.puzzle-path.is-live .path-chain,.puzzle-path.is-live .path-head b{color:#143d12}.path-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;margin-left:auto}.puzzle-play,.puzzle-clear{width:auto;min-width:72px;height:32px;min-width:0;padding:0 12px;border:1px solid #111111;border-radius:12px;background:#fff;color:#111;box-shadow:none;font-size:10px;font-weight:500;letter-spacing:.08em;white-space:nowrap}.puzzle-play.is-on{color:#143d12;border-color:#143d12;background:#fff}.puzzle-play:disabled,.puzzle-clear:disabled{opacity:.35}.net-cell.is-live{outline:2px solid #2d6bff;outline-offset:-2px;z-index:2}.roll-block.is-now{outline:2px solid #7dff6a;z-index:1}.roll{position:relative;flex:1;min-height:0;margin:0 14px 10px;overflow:hidden;background:repeating-linear-gradient(to right,transparent 0,transparent calc(12.5% - 1px),rgba(17,17,17,.18) calc(12.5% - 1px),rgba(17,17,17,.18) 12.5%)}.roll-lane{position:absolute;left:0;right:0;height:1px;background:#11111159}.roll-cursor{position:absolute;top:4%;bottom:4%;left:2%;width:1px;background:#ffe500}.roll-block{position:absolute;min-width:42px;height:9%;padding:0 4px;overflow:hidden;border:1px solid #111111;border-radius:0;color:#111;font-size:9px;font-weight:500;line-height:1.6;letter-spacing:.04em}.roll-block.is-blue{background:#2d6bff;color:#fff}.roll-block.is-yellow{background:#ffe500}@media(max-width:760px){html,body{overflow-x:clip;overflow-y:auto;overscroll-behavior-x:none}body:has(.app.is-puzzle){background:#fff}.app{height:auto;min-height:100%;max-width:100%;overflow-x:clip;grid-template-rows:auto auto}.app:not(.is-puzzle){height:100svh;max-height:100svh;overflow:hidden}.header{align-items:center;max-width:100%;overflow-x:clip;padding:max(10px,env(safe-area-inset-top)) 16px 2px;gap:4px;text-align:center}body .title{font-size:40px;-webkit-text-stroke:5px #d8d8d8}.view-nav{width:min(280px,84vw);margin:4px auto 0}.view-tab{font-size:13px;padding:8px 8px 7px}.app:not(.is-puzzle) .stage-switch,.app:not(.is-puzzle) .view-pane,.app:not(.is-puzzle) .view-pane>.workspace{height:100%;min-height:0}.app.is-puzzle .stage-switch,.app.is-puzzle .view-pane,.puzzle{height:auto}.workspace{grid-template-columns:68px minmax(0,1fr) min(58vw,250px);grid-template-rows:minmax(0,1fr) auto auto;grid-template-areas:"cube cube cube" "score score circles" "tempo side side";gap:6px 8px;height:100%;min-height:0;padding:2px 10px 8px 18px}.workspace-center,.stage{display:contents}.cube-stage{grid-area:cube;height:100%;min-height:0;width:100%;justify-content:center}.cube-viewport{width:min(62vw,248px);max-height:min(100%,230px)}.stage .graphic-stage{grid-area:circles;z-index:4;align-self:end;container-type:normal;width:100%;height:auto;margin-top:-56px;padding:0}.circles-wrap,.stage .circles-wrap{width:100%;height:auto}.readout-stack{display:none}body .scale-mark{display:block;position:absolute;top:18%;right:auto;bottom:auto;left:calc(50% + min(31vw,124px) + 16px);z-index:6;margin:0;font-size:30px;line-height:.85;-webkit-text-stroke:3px #d8d8d8}.side-stack{position:static;grid-area:side;display:block;width:auto;height:auto;pointer-events:auto}.pad-dock{width:100%;pointer-events:auto}.score-dock{position:static;grid-area:score;align-self:center;width:auto;height:auto;overflow:hidden}.score-tape{height:auto;background:transparent;padding:0}.score-tape ol{flex-direction:row;align-items:flex-end;justify-content:flex-start;gap:2px;overflow-x:auto;overflow-y:hidden}.beat-stack{width:24px;gap:2px}.beat{padding:2px 1px 1px}.beat b{font-size:8px}.beat span{display:block;font-size:6px}.move-grid{grid-template-rows:repeat(4,min(40px,5.4svh));gap:4px}.move-btn{font-size:18px;-webkit-text-stroke:1px #d8d8d8}.panel{padding:6px;background:#000000e0;backdrop-filter:none;-webkit-backdrop-filter:none}.action-bar{position:static;left:auto;bottom:auto;transform:none;width:100%;margin-top:6px;grid-template-columns:1fr 1fr;gap:4px}.action-bar .action-btn{height:30px;font-size:11px}.shuffle-cue{display:none}.workspace .bpm-rail,.puzzle .bpm-rail{position:relative;inset:auto;z-index:1;display:flex;flex-direction:column;align-items:stretch;width:auto;height:auto;min-height:0;padding:0}.workspace .bpm-rail{grid-area:tempo;align-self:stretch;height:100%}.workspace .bpm-name,.puzzle .bpm-name,.workspace .bpm-hint,.puzzle .bpm-hint,.workspace .bpm-scale,.puzzle .bpm-scale{position:static;inset:auto;width:auto;height:auto;transform:none}.workspace .bpm-name,.puzzle .bpm-name{align-self:flex-start;width:auto;max-width:100%;margin:0 0 14px;overflow:visible;font-size:18px;line-height:1;white-space:nowrap;-webkit-text-stroke:2px #d8d8d8}.workspace .bpm-name{position:absolute;top:-34px;left:0;margin:0}.workspace .bpm-hint,.puzzle .bpm-hint{display:none}.workspace .bpm-scale{position:relative;align-self:stretch;flex:none;width:28px;height:100%;min-height:0;margin:0}.puzzle .bpm-scale{position:relative;flex:none;width:28px;height:148px;min-height:0;margin:16px 0 8px}.bpm-thumb{padding:0;gap:4px}.bpm-thumb b{min-width:0;padding:2px 3px;font-size:10px}.puzzle{max-width:100%;overflow-x:clip;grid-template-columns:76px minmax(0,1fr);grid-template-rows:auto auto auto auto;grid-template-areas:"net net" "score score" "sequence sequence" "tempo path";gap:0;border-top:0}.puzzle .bpm-rail{grid-area:tempo;margin:16px 0 24px 12px}.puzzle-net{max-width:100%;overflow-x:clip;padding:10px 12px 6px;container-type:inline-size}.net-board{width:min(100cqi,100%);max-width:100%;max-height:none;margin:0 auto;overflow:hidden}.net-face,.net-face-name{max-width:100%}.path-chain{overflow-wrap:anywhere}.puzzle-path,.puzzle-score,.puzzle-sequence{max-width:100%;overflow-x:clip}.puzzle .net-hint{width:100%;margin:8px 0 0;text-align:center}.puzzle-score{min-height:168px;height:24vh}.puzzle-sequence{min-height:220px;height:220px}.puzzle-sequence .roll{min-height:160px}.puzzle-path{grid-area:path;margin:14px 14px 28px 8px;gap:10px}.path-head{flex-direction:column;align-items:flex-start;gap:8px}.path-actions{justify-content:flex-start}.path-chain{font-size:20px;line-height:1.35}.path-meta b{font-size:32px}}