/* HELPer play worlds: tactile boards + real local WebGL toy scenes. */
.play-active header,.play-active main{max-width:1050px}.play-active .intro{display:none}
.gp-root{--gp-glow:#bba3ff;--gp-shadow:#130d27;--gp-bright:#d7c3ff;min-width:0}
.gp-hero{position:relative;border:1px solid var(--line);border-radius:28px;padding:24px;background:radial-gradient(ellipse at 95% 0,#9981cf4d,transparent 65%),linear-gradient(145deg,var(--panel),var(--bg));box-shadow:inset 0 2px 0 #ffffff28,0 6px 0 var(--gp-shadow),0 18px 35px #0002;overflow:hidden}
.gp-hero:after{content:"✧";position:absolute;right:20px;top:-25px;font-size:145px;color:#d6b8ff25;pointer-events:none}
.gp-badge{position:relative;font-size:11px;letter-spacing:.15em;color:var(--gold);font-weight:800}.gp-title{position:relative;font-size:clamp(26px,4vw,38px);line-height:1.15;letter-spacing:-.035em;margin:12px 0}.gp-subtitle{position:relative;color:var(--muted);font-size:13px;margin:0}
.gp-settings{display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:end;margin:26px 0}
.gp-label{display:grid;gap:7px;min-width:0;font-size:12px;color:var(--muted);font-weight:700}
.gp-label select,.gp-code-input{font:16px system-ui;color:var(--ink);background:var(--panel);border:1px solid var(--line);border-radius:14px;min-height:50px;min-width:0;width:100%;padding:11px 12px;box-shadow:inset 0 2px 7px #0002}
.gp-button{padding:11px 16px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(155deg,var(--panel),var(--bg));box-shadow:inset 0 1px 0 #ffffff30,0 4px 0 var(--gp-shadow);font-size:14px;font-weight:700;transition:transform .15s,box-shadow .15s;min-height:48px;overflow-wrap:anywhere}
.gp-button:active:not(:disabled){transform:translateY(3px);box-shadow:0 1px 0 var(--gp-shadow)}
.gp-primary{background:linear-gradient(140deg,#e0cfff,#b898ed);border-color:#d5b9fc;color:#30204c}.gp-action{background:linear-gradient(140deg,#ffe9a9,#e4b75f);color:#473422}
.gp-controls{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin:18px 0}.gp-controls>.gp-button{flex:1;min-width:80px;max-width:240px}
.gp-footnote{margin:24px 0 12px;color:var(--muted);font-size:12px;line-height:1.7;overflow-wrap:anywhere}
.gp-grid{display:grid;gap:10px;margin:24px auto;max-width:540px;min-width:0;padding:14px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(150deg,#a082cb12,#00000018);box-shadow:inset 0 3px 12px #0002}
.gp-side-3{grid-template-columns:repeat(3,minmax(0,1fr));max-width:390px}.gp-side-4{grid-template-columns:repeat(4,minmax(0,1fr));max-width:450px}.gp-side-5{grid-template-columns:repeat(5,minmax(0,1fr));max-width:510px}
.gp-tile{position:relative;min-width:0;min-height:48px;padding:2px;aspect-ratio:1;border:1px solid var(--line);border-radius:16px;background:linear-gradient(140deg,#73618f,var(--panel));color:var(--ink);font-size:clamp(22px,5vw,36px);box-shadow:inset 0 2px 0 #ffffff38,inset 0 -4px 6px #0002,0 6px 0 #32213f,0 10px 12px #0002;transform:perspective(600px) rotateX(5deg);transition:transform .18s,background .2s}
.gp-tile:active:not(:disabled){transform:perspective(600px) rotateX(0) translateY(4px)}.gp-tile:disabled{opacity:1}.gp-empty{box-shadow:inset 0 4px 12px #0004;background:var(--bg);border-style:dashed;transform:none}
.gp-star{color:#a99ac1;background:linear-gradient(145deg,#403558,#27223e);text-shadow:0 2px 0 #0005}.gp-lit{background:linear-gradient(145deg,#fff3af,#f0b94e);color:#6b441e;text-shadow:0 1px 0 #fffa;box-shadow:inset 0 2px 0 #fff9,0 5px 0 #9e6f2e,0 0 20px #ffcf6540}
.gp-mosaic .gp-tile:nth-child(3n+1){background:linear-gradient(140deg,#89cfd2,#4d809c);color:#142f46}.gp-mosaic .gp-tile:nth-child(3n+2){background:linear-gradient(140deg,#ecd2ff,#a085c5);color:#332342}.gp-mosaic .gp-tile:nth-child(3n){background:linear-gradient(140deg,#ffe6a1,#d6ae65);color:#473422}.gp-mosaic .gp-empty{background:var(--bg);color:var(--muted)}
.gp-sudoku .gp-given{background:linear-gradient(140deg,#706781,var(--panel));font-weight:800}.gp-chosen{outline:3px solid var(--gold);outline-offset:-5px}.gp-sudoku .gp-tile:nth-child(4n+2){border-right-width:4px}.gp-sudoku .gp-tile:nth-child(n+5):nth-child(-n+8){border-bottom-width:4px}.gp-conflict{border:3px solid #f083a1}
.gp-code-form{display:flex;gap:12px;align-items:end;justify-content:center;flex-wrap:wrap;margin-top:22px}.gp-code-form .gp-label{flex:1;max-width:300px;min-width:170px}.gp-code-input{font:28px ui-monospace,monospace;letter-spacing:.25em;text-align:center;min-height:60px}
.gp-keypad{max-width:390px}.gp-keypad button{border:1px solid var(--line);border-radius:12px;background:var(--panel);box-shadow:0 4px 0 var(--gp-shadow);font-size:24px;min-width:0}
.gp-code-history{padding-left:25px;margin:20px auto;max-width:580px}.gp-code-history li{padding:12px;margin:8px 0;border:1px solid var(--line);border-radius:12px;background:var(--panel)}.gp-code-history strong{letter-spacing:.2em;margin-right:16px}.gp-code-history span{font-size:13px;color:var(--muted);display:inline-block}
.gp-stage{position:relative;isolation:isolate;width:100%;max-width:400px;aspect-ratio:8/9;margin:20px auto;border:1px solid #736389;border-radius:26px;background:#191c38;overflow:hidden;box-shadow:inset 0 2px 0 #fff3,0 7px 0 var(--gp-shadow),0 18px 30px #0002}
.gp-stage>canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.gp-stage>canvas:not(.gp-stage-fallback){z-index:1}.gp-stage-robot,.gp-stage-orchestra,.gp-stage-reaction{max-width:650px;aspect-ratio:16/9}
.gp-stage-delivery{max-width:490px;aspect-ratio:1}
.gp-render-note{position:absolute;right:12px;bottom:10px;padding:3px 8px;background:#191c38cc;color:#d4c5eb;border-radius:8px;font-size:10px;z-index:2}.gp-has-webgl .gp-render-note,.gp-has-webgl .gp-stage-fallback{display:none}
.gp-scene-labels{position:absolute;bottom:12px;left:0;right:0;display:flex;justify-content:space-around;font-size:12px;font-weight:700;color:#f8f2ff;text-shadow:0 1px 4px #000;z-index:3}
.gp-react-target{display:block;width:100%;padding:12px;border:1px solid var(--line);border-radius:28px;background:var(--panel);box-shadow:0 7px 0 var(--gp-shadow);overflow:hidden}.gp-react-target>.gp-stage{margin:0 auto 12px;box-shadow:none;pointer-events:none}.gp-react-caption{display:block;padding:12px;font-size:clamp(18px,3vw,25px);font-weight:750}.gp-ready{background:linear-gradient(145deg,#aee4b1,#63bfa7);color:#183e37;box-shadow:0 6px 0 #367563}
.gp-reaction-history{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;padding:0;list-style:none}.gp-reaction-history li{padding:10px 14px;border:1px solid var(--line);border-radius:12px;background:var(--panel);font-variant-numeric:tabular-nums}
.gp-score{font-size:16px;font-weight:750;text-align:center;font-variant-numeric:tabular-nums}.gp-prompt{text-align:center;font-size:18px;font-weight:750;line-height:1.6;margin:22px 0}
.gp-robot-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:20px auto;max-width:650px}
.gp-part{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:16px 8px;min-height:116px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(145deg,#ffffff12,var(--panel));box-shadow:inset 0 2px 0 #fff4,0 6px 0 var(--gp-shadow);font-size:12px;transition:transform .18s}.gp-part:active{transform:translateY(4px)}
.gp-part-shape{position:relative;display:block;width:42px;height:42px;background:radial-gradient(circle at 28% 20%,#ffffffa0,transparent 60%),var(--toy);border:1px solid #fff5;box-shadow:inset -5px -6px 9px #0003,0 5px 0 var(--toy-dark),0 9px 10px #0003;transform:perspective(300px) rotateY(-18deg) rotateX(12deg)}
.gp-shape-0{border-radius:50%}.gp-shape-1{border-radius:8px}.gp-shape-2{border-radius:50% 50% 20% 20%}
.gp-color-0{--toy:#659fff;--toy-dark:#375c9a}.gp-color-1{--toy:#ff917a;--toy-dark:#a9554a}.gp-color-2{--toy:#88d9ae;--toy-dark:#4a8c6c}.gp-color-3{--toy:#be92f5;--toy-dark:#765198}.gp-color-4{--toy:#ffdc78;--toy-dark:#ac8742}.gp-color-5{--toy:#6ed3dd;--toy-dark:#3a8499}
.gp-route{max-width:450px;padding:10px;gap:8px}.gp-route-cell{aspect-ratio:1;min-width:0;min-height:48px;border:1px solid #7898b2;border-radius:12px;padding:0;font-size:24px;background:linear-gradient(145deg,#547fa4,#33465e);color:#ffe4a0;box-shadow:inset 0 1px 0 #fff3,0 4px 0 #1e2940;transform:perspective(400px) rotateX(6deg)}.gp-route-cell:disabled{opacity:1}.gp-route-rock{background:linear-gradient(145deg,#9680ac,#5c4a73);color:#d0bedf}.gp-route-ship{outline:3px solid #b6e8e6;outline-offset:-4px}.gp-route-hint{outline:3px solid #ffe29d;outline-offset:2px}.gp-arrow{font-size:24px;min-width:48px!important;max-width:90px!important}
.gp-animal-pads{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:600px;margin:20px auto}.gp-animal{display:flex;flex-direction:column;align-items:center;padding:10px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(145deg,#fffafd,#eee2fa);color:#48315b;min-height:110px;box-shadow:inset 0 2px 0 #fff,0 7px 0 #89719c;transition:transform .15s,box-shadow .15s;min-width:0;font-size:14px;font-weight:700}.gp-animal>.pm-art{width:100%;max-width:120px;aspect-ratio:1;flex:none;border-radius:16px}.gp-animal:disabled{opacity:1;cursor:default}.gp-playing{transform:translateY(-4px);outline:3px solid #ffdb7b;outline-offset:2px;box-shadow:0 10px 0 #a17c47,0 0 25px #ffdd8055}.gp-animal:active:not(:disabled){transform:translateY(4px)}
.gp-result{padding:24px;margin:26px 0;border:1px solid var(--line);border-radius:24px;background:linear-gradient(145deg,#b59bea22,#6ec9b022);text-align:center;box-shadow:inset 0 2px 0 #fff3,0 6px 0 var(--gp-shadow)}.gp-result h4{font-size:25px;margin:0 0 12px}.gp-result p{color:var(--muted);line-height:1.6}
.gp-kind-delivery .gp-hero{background:radial-gradient(ellipse at 95% 0,#599fc544,transparent 65%),var(--panel)}.gp-kind-robot .gp-hero{background:radial-gradient(ellipse at 95% 0,#e7ad5b44,transparent 65%),var(--panel)}.gp-kind-orchestra .gp-hero{background:radial-gradient(ellipse at 95% 0,#c26fa044,transparent 65%),var(--panel)}
.games-list [data-game=robot],.games-list [data-game=delivery],.games-list [data-game=orchestra]{border-color:#b693d4}.games-list [data-game=robot] .game-icon{color:#ffc97f}.games-list [data-game=delivery] .game-icon{color:#7dd9df}.games-list [data-game=orchestra] .game-icon{color:#eaa1ce}
@media(max-width:640px){.gp-settings{grid-template-columns:1fr 1fr}.gp-settings>.gp-button{grid-column:1/-1}.gp-hero{padding:22px 18px}.gp-grid{padding:10px;gap:8px}.gp-tile{border-radius:12px}.gp-route{padding:6px;gap:6px}.gp-robot-choices{gap:10px}.gp-part{font-size:11px;padding:14px 5px}.gp-animal-pads{gap:10px}.gp-animal{padding:8px;font-size:12px}.gp-controls{gap:8px}.gp-controls>.gp-button{padding:10px;font-size:13px}.gp-scene-labels{font-size:11px}}
@media(max-width:379px){.gp-route{padding:4px;gap:5px}.gp-side-5{padding:6px;gap:5px}.gp-robot-choices{grid-template-columns:repeat(2,minmax(0,1fr))}.gp-label select{font-size:16px;padding-left:8px}.gp-route-cell{font-size:21px}.gp-hero:after{font-size:110px}.gp-animal-pads{gap:8px}.gp-animal{border-radius:16px}}
@media(prefers-color-scheme:light){.gp-root{--gp-shadow:#c9b6d7}.gp-hero{background:radial-gradient(ellipse at 90% 0,#d9c8f4,transparent 65%),#fffafd}.gp-tile{background:linear-gradient(145deg,#fff,#e9ddf4);box-shadow:inset 0 2px 0 #fff,0 6px 0 #b5a1c7,0 10px 12px #593b681c}.gp-sudoku .gp-given{background:linear-gradient(140deg,#d5c5e8,#bba8d2);color:#3a2a4c}.gp-star{background:linear-gradient(145deg,#564970,#30243f);color:#c0aace}.gp-star.gp-lit{background:linear-gradient(145deg,#fff3af,#f0b94e);color:#6b441e}.gp-empty{background:var(--bg)}}
.gp-label select:focus-visible,.gp-code-input:focus-visible{outline:3px solid var(--violet);outline-offset:3px}
@media(prefers-reduced-motion:reduce){.gp-root *{transition:none!important;animation:none!important}}
:root[data-motion=off] .gp-root *{transition:none!important;animation:none!important}

.game-offline{display:flex;align-items:center;gap:12px;margin:0 0 16px}.game-offline #offline-status{flex:1;margin:0;font-size:12px}.game-offline #save-offline{font-size:12px;flex:none;padding:10px}
.gp-mission-menu{margin:20px 0;border:1px solid var(--line);border-radius:16px;background:var(--panel);padding:0 16px}.gp-mission-menu>summary{min-height:50px;padding:14px 0;font-size:14px;font-weight:700;cursor:pointer}.gp-mission-menu .gp-settings{margin:10px 0 20px}.gp-mission-menu summary:focus-visible{outline:3px solid var(--violet);outline-offset:2px}
.gp-hero{padding:18px 22px}.gp-title{margin:9px 0;font-size:clamp(24px,4vw,34px)}.gp-subtitle{font-size:12px}

.gp-pads-four{grid-template-columns:repeat(2,minmax(0,1fr));max-width:460px}