.ap-shell{--ap-accent: #4f7cff;--ap-accent-2: #22c55e;--ap-wall: #2b3352;--ap-floor: #f4f6ff;--ap-floor-line: #dfe4f7;--ap-loop: #ec4899;--ap-if: #b45309;--ap-if-bg: #fef3c7;max-width:980px;margin:0 auto;padding:16px}.ap-play-shell{max-width:1360px}.ap-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:10px}.ap-back-link{display:inline-flex;align-items:center;gap:8px;flex:0 0 auto;font-size:.95rem;font-weight:800;color:var(--ap-accent);text-decoration:none;background:#fff;border:2px solid var(--ap-accent);border-radius:12px;padding:10px 18px;box-shadow:0 2px #00000014;transition:transform .12s,background .12s,color .12s}.ap-back-link:hover{transform:translateY(-1px);background:var(--ap-accent);color:#fff}.ap-back-link-icon{font-size:1.1rem;line-height:1}.ap-header-meta{flex:1 1 260px;min-width:220px;text-align:right}.ap-stage-meta-line{margin:0 0 4px;font-size:.85rem;color:#778;font-weight:700}.ap-stage-hint{margin:0 0 4px;color:#556;font-size:.92rem}.ap-stage-title{font-size:1.15rem;margin:0 0 14px;text-align:center}.ap-columns{display:grid;grid-template-columns:minmax(0,1fr) 300px 104px;gap:18px;align-items:start}.ap-col{min-width:0}.ap-col-board{position:sticky;top:12px}.ap-col-program,.ap-col-palette{display:flex;flex-direction:column;gap:12px}@media(max-width:760px){.ap-columns{grid-template-columns:1fr}.ap-col-board{position:static;order:1}.ap-col-program{order:2}.ap-col-palette{order:3}}.ap-board-wrap{position:relative;background:#f8faff;border:2px solid var(--ap-floor-line);border-radius:16px;padding:14px;display:flex;justify-content:center}.ap-board{--cell-size: 52px;position:relative;display:grid;grid-template-columns:repeat(var(--cols),var(--cell-size));grid-template-rows:repeat(var(--rows),var(--cell-size));width:calc(var(--cols) * var(--cell-size));height:calc(var(--rows) * var(--cell-size))}@media(max-width:520px){.ap-board{--cell-size: 40px}}.ap-cell{width:var(--cell-size);height:var(--cell-size);box-sizing:border-box;display:flex;align-items:center;justify-content:center;font-size:calc(var(--cell-size) * .6);transition:background .25s}.ap-floor{background-color:var(--ap-floor);background-size:cover;background-position:center;border:1px solid var(--ap-floor-line)}.ap-wall{background-color:var(--ap-wall);background-size:cover;background-position:center;border:1px solid var(--ap-wall);border-radius:4px}.ap-route-layer{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;overflow:visible}.ap-route-seg{stroke:#b7bdd0;stroke-width:.1;stroke-linecap:round;transition:stroke .25s,stroke-width .25s}.ap-route-seg-done{stroke:var(--ap-accent);stroke-width:.16}.ap-bot,.ap-item{position:absolute;width:var(--cell-size);height:var(--cell-size);display:flex;align-items:center;justify-content:center;pointer-events:none}.ap-bot{transition:left .3s ease,top .3s ease;z-index:3}.ap-bot>*{display:inline-block}.ap-bot-img{width:90%;height:90%;object-fit:contain;display:block;margin:auto}.ap-bot-arrow{position:absolute;left:50%;top:50%;width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:10px solid #1a1a2e;filter:drop-shadow(0 1px 1px rgba(0,0,0,.35));transform-origin:50% 4px;transform:translate(-50%,-50%) rotate(0);z-index:4}.ap-item{z-index:2;transition:opacity .25s,transform .25s}.ap-item-img{width:80%;height:80%;object-fit:contain;display:block;margin:auto;filter:drop-shadow(0 1px 1px rgba(0,0,0,.25))}.ap-item-gone{opacity:0;transform:scale(.2)}.ap-bot-bump{animation:ap-bump .35s ease}@keyframes ap-bump{0%,to{transform:translate(0)}50%{transform:translate(-3px,-3px) rotate(-6deg)}}.ap-bot-clear{animation:ap-clear .6s ease infinite}@keyframes ap-clear{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-8px) scale(1.1)}}.ap-clear-overlay{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;pointer-events:none}.ap-clear-overlay[hidden]{display:none}.ap-clear-overlay-mark{font-size:clamp(64px,18vw,116px);font-weight:900;line-height:1;filter:drop-shadow(0 3px 8px rgba(0,0,0,.28))}.ap-clear-overlay-label{font-size:clamp(1.05rem,3vw,1.4rem);font-weight:900;padding:2px 14px;border-radius:999px;background:#ffffffeb;box-shadow:0 2px 8px #0000002e}.ap-clear-overlay-steps{font-size:.85rem;font-weight:800;color:#445;background:#ffffffe0;border-radius:999px;padding:2px 10px;margin-top:2px}.ap-clear-overlay[data-rank=cleared] .ap-clear-overlay-mark{color:var(--ap-accent-2)}.ap-clear-overlay[data-rank=cleared] .ap-clear-overlay-label{color:#15803d}.ap-clear-overlay[data-rank=perfect] .ap-clear-overlay-mark{background:linear-gradient(145deg,#ffe27a,#f5b301 55%,#d68f00);-webkit-background-clip:text;background-clip:text;color:transparent}.ap-clear-overlay[data-rank=perfect] .ap-clear-overlay-label{color:#b45309}.ap-clear-overlay-pop .ap-clear-overlay-mark,.ap-clear-overlay-pop .ap-clear-overlay-label,.ap-clear-overlay-pop .ap-clear-overlay-steps{animation:ap-clear-overlay-pop .42s cubic-bezier(.22,1.4,.36,1) both}.ap-clear-overlay-pop .ap-clear-overlay-label{animation-delay:.05s}.ap-clear-overlay-pop .ap-clear-overlay-steps{animation-delay:.1s}@keyframes ap-clear-overlay-pop{0%{opacity:0;transform:scale(.5)}70%{opacity:1;transform:scale(1.08)}to{opacity:1;transform:scale(1)}}@media(max-width:520px){.ap-clear-overlay-label{font-size:1rem}.ap-clear-overlay-steps{font-size:.78rem}}.ap-panel-block{background:#fff;border:2px solid var(--ap-floor-line);border-radius:14px;padding:12px}.ap-panel-block h3{margin:0 0 8px;font-size:.9rem;color:#445}.ap-program-heading{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:8px}.ap-program-heading h3{margin:0}.ap-par-target{margin:0;font-size:.82rem;font-weight:700;color:#667;white-space:nowrap}.ap-par-target strong{color:var(--ap-accent);font-size:.95rem}.ap-palette{display:flex;flex-direction:column;align-items:center;gap:10px}.ap-palette-group{display:flex;flex-direction:column;align-items:center;gap:8px;padding:8px;border-radius:12px;background:#00000006}.ap-palette .ap-block{position:relative;flex:0 0 auto;width:68px;height:68px;padding:0;justify-content:center;touch-action:none}.ap-palette .ap-block .ap-block-body{display:inline-flex;align-items:center;justify-content:center;gap:3px;width:100%;height:100%}.ap-palette .ap-block .ap-block-icon .ap-icon-svg{width:38px;height:38px}.ap-palette .ap-block .ap-block-badge{position:static;flex:0 0 auto;min-width:20px;height:20px;font-size:.74rem}.ap-palette .ap-block.cmd-if .ap-block-body,.ap-palette .ap-block.cmd-else .ap-block-body,.ap-palette .ap-block.cmd-end .ap-block-body{flex-direction:column;gap:1px}.ap-palette-text-label{font-size:.78rem;font-weight:800;line-height:1.15;color:#fff;text-align:center}.ap-palette-group-move{background:#eef4ff;border:1.5px solid #dbe6ff}.ap-palette-group-turn{background:#fff6ec;border:1.5px solid #fbe3c8}.ap-palette-group-control{background:#fdf1f6;border:1.5px solid #fad3e4}.ap-block{display:inline-flex;align-items:center;gap:6px;border:none;border-radius:12px;padding:10px 14px;font-weight:700;font-size:.88rem;color:#fff;cursor:pointer;transition:transform .1s,filter .15s;box-shadow:0 2px #0000001f;touch-action:manipulation}.ap-block:hover{transform:translateY(-1px);filter:brightness(1.05)}.ap-block-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.ap-icon-svg{width:28px;height:28px;flex-shrink:0;color:currentColor;overflow:visible}.cmd-forward{background:var(--ap-accent)}.cmd-turn{background:#f59e0b}.cmd-diag-right{background:#06b6d4}.cmd-diag-left{background:#0ea5e9}.cmd-loop{background:var(--ap-loop)}.cmd-if{background:var(--ap-if);color:#fff}.cmd-else{background:#c2410c;color:#fff}.cmd-end{background:#92400e;color:#fff}.ap-block-badge{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;border-radius:50%;border:1.5px solid rgba(26,26,46,.15);background:#fff;color:#1a1a2e;font-weight:800;font-size:.8rem;padding:0 4px;cursor:pointer;box-shadow:0 1px 2px #1a1a2e40}.ap-block-icon-turn{cursor:pointer;border-radius:8px;transition:transform .12s,filter .12s}.ap-block-icon-turn:hover{filter:brightness(1.15)}.ap-block-icon-turn:active{transform:scale(.9)}.ap-block-icon-turn:focus-visible{outline:2px solid #fff;outline-offset:2px}.ap-target-hint{margin:0 0 8px;padding:6px 8px;border-radius:8px;background:#fef2f2;border:1.5px solid #fca5a5;color:#b91c1c;font-size:.78rem;font-weight:700}.ap-program{--ap-slot-h: 44px;--ap-indent: 20px;--ap-number-lane: 26px;display:flex;flex-direction:column;gap:5px;min-height:60px;position:relative}.ap-program-empty{margin:0;color:#99a;font-size:.82rem;text-align:center;padding:12px 0}.ap-program-row{display:grid;grid-template-columns:var(--ap-number-lane) 1fr;align-items:stretch;column-gap:6px}.ap-program-number-cell{display:flex;align-items:center;justify-content:center;min-height:var(--ap-slot-h);font-size:.72rem;font-weight:800;color:#667;pointer-events:none}.ap-program-number-cell-empty{visibility:hidden;min-height:26px}.ap-slot-tile{position:relative;height:var(--ap-slot-h);box-sizing:border-box;border-radius:10px;display:flex;align-items:center;gap:8px;padding:0 8px 0 6px;color:#fff;box-shadow:0 2px #0000001f;cursor:default;touch-action:none}.ap-slot-tile[data-depth="1"]{margin-left:var(--ap-indent);border-left:4px solid rgba(255,255,255,.55)}.ap-slot-tile[data-depth="2"]{margin-left:calc(var(--ap-indent) * 2);border-left:4px solid rgba(255,255,255,.55)}.ap-slot-tile[data-depth="3"]{margin-left:calc(var(--ap-indent) * 3);border-left:4px solid rgba(255,255,255,.55)}.ap-slot-tile .ap-block-icon{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center}.ap-slot-tile .ap-block-icon .ap-icon-svg{width:26px;height:26px}.ap-slot-tile .ap-slot-label{flex:0 1 auto;min-width:0;font-size:.82rem;font-weight:800;line-height:1.1;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ap-slot-tile .ap-block-badge{flex:0 0 auto;min-width:22px;height:22px;font-size:.78rem}.ap-slot-tile .ap-block-remove{flex:0 0 auto;margin-left:auto;border:none;background:#00000038;color:#fff;width:22px;height:22px;border-radius:50%;cursor:pointer;font-size:.85rem;line-height:1}.ap-slot-empty{height:26px;background:transparent;border:2px dashed var(--ap-floor-line);box-shadow:none}.ap-slot-bracket-open{border-radius:10px 10px 4px 4px}.ap-slot-bracket-close{border-radius:4px 4px 10px 10px;opacity:.92}.ap-slot-bracket-mid{border-radius:4px}.ap-block-active{outline:3px solid #ffd54a;outline-offset:2px;box-shadow:0 0 0 5px #ffd54a59,0 0 18px 4px #ffd54aa6;animation:ap-active-pulse .6s ease infinite;position:relative;z-index:2}@keyframes ap-active-pulse{0%,to{filter:brightness(1)}50%{filter:brightness(1.25)}}.ap-drag-ghost{position:fixed;left:0;top:0;width:34px;height:34px;margin:-17px 0 0 -17px;display:flex;align-items:center;justify-content:center;border-radius:8px;background:#2b3352e0;color:#fff;opacity:.85;pointer-events:none;z-index:1000;box-shadow:0 4px 10px #00000047}.ap-drag-ghost .ap-icon-svg{width:24px;height:24px}.ap-drop-indicator{width:100%;height:6px;border-radius:3px;background:repeating-linear-gradient(90deg,var(--ap-accent),var(--ap-accent) 8px,transparent 8px,transparent 16px);box-shadow:0 0 0 2px #4f7cff2e}.ap-controls{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.ap-next-btn:not([hidden]){animation:ap-pulse 1s ease infinite}@keyframes ap-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.ap-status{border-radius:12px;padding:12px 14px;font-weight:700;text-align:center;border:2px solid var(--ap-floor-line);background:#fff}.ap-status[data-kind=running]{background:#eef3ff;border-color:var(--ap-accent);color:var(--ap-accent)}.ap-status[data-kind=fail]{background:#fff1f1;border-color:#ef4444;color:#dc2626}.ap-status[data-kind=clear]{background:#ecfdf3;border-color:var(--ap-accent-2);color:#15803d}@media(max-width:760px){.ap-shell{padding:10px}.ap-header{flex-direction:column;align-items:stretch}.ap-header-meta{text-align:left}.ap-controls{justify-content:stretch}.ap-controls .btn-ultra{flex:1}}@media(max-width:760px){.ap-palette,.ap-palette-group{flex-direction:row;flex-wrap:wrap}.ap-palette .ap-block{width:58px;height:58px;aspect-ratio:auto}.ap-palette .ap-block .ap-block-icon .ap-icon-svg{width:32px;height:32px}}@media(max-width:520px){.ap-palette-group{gap:5px;padding:5px}.ap-palette .ap-block{width:52px;height:52px}.ap-palette .ap-block .ap-block-icon .ap-icon-svg{width:26px;height:26px}.ap-program{--ap-slot-h: 42px;--ap-indent: 16px}.ap-slot-tile .ap-block-icon .ap-icon-svg{width:24px;height:24px}}