*{box-sizing:border-box;margin:0;padding:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0}.grid{touch-action:none;--grid-padding:14px;background:linear-gradient(#8b6914,#6d4c0e);border:3px solid #5a3e0a;border-radius:12px;gap:3px;width:min(500px,85vw);height:min(500px,85vw);padding:14px;display:grid;overflow:hidden;box-shadow:0 6px 24px #0000004d,inset 0 2px #ffffff26,inset 0 -2px #0003}.cell{cursor:default;aspect-ratio:1;background:linear-gradient(145deg,#f5e6c8,#e8d5a8);border-radius:4px;justify-content:center;align-items:center;transition:background .2s;display:flex;position:relative;overflow:hidden;box-shadow:inset 0 1px #fff6,inset 0 -1px #00000014}.cell-clickable{cursor:pointer}.cell-clickable:hover{background:linear-gradient(145deg,#efe0bc,#dbc898)}.cell-launch{background:linear-gradient(145deg,#c8e6c9,#a5d6a7)}.cell-exit{background:linear-gradient(145deg,#fff9c4,#fff176)}.cell-trail{transition:background .1s;background:linear-gradient(145deg,#ecdbb5,#dcc99a)!important}.laser-overlay{z-index:5;pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.cell-ghost{outline-offset:-2px;background:#8b691440;outline:2px dashed #8b691480}.cell-player-tile{cursor:grab}.cell-player-tile:active{cursor:grabbing}.cell-player-tile:hover{outline-offset:-2px;outline:2px solid #5d4037}.cell-drag-source{opacity:.4}.cell-drag-target{outline-offset:-2px;background:#8b69144d;outline:2px solid #8b6914}.marker{opacity:.7;font-size:clamp(14px,3vw,22px)}.launch-marker{color:#2e7d32}.launch-up{transform:rotate(0)}.launch-right{transform:rotate(90deg)}.launch-down{transform:rotate(180deg)}.launch-left{transform:rotate(270deg)}.exit-marker{color:#f9a825;font-size:clamp(18px,4vw,28px)}.tile-visual{border-radius:4px;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative}.tile-movable{color:#1565c0;background:#1565c01a}.tile-fixed{color:#6d4c0e;background:#6d4c0e1f}.tile-toggle{border:2px dashed;border-radius:4px}.tile-wall{background:linear-gradient(145deg,#9e9e9e,#757575);border:1px solid #616161;border-radius:4px;width:100%;height:100%;box-shadow:inset 0 1px 2px #fff3,inset 0 -1px 2px #00000040}.toggle-red{color:#ff6d00;background:#ff6d001f}.toggle-blue{color:#00bfa5;background:#00bfa51f}.toggle-green{color:#aeea00;background:#aeea001f}.toggle-orange{color:#d500f9;background:#d500f91f}.tile-gate{border:2px solid;border-radius:4px}.tile-gate-disabled{opacity:.3;border-style:dashed}.tile-switch{border-radius:4px}.switch-icon{font-size:clamp(16px,3.5vw,24px);line-height:1}.gate-disabled-icon{opacity:.5;font-size:clamp(14px,3vw,20px);line-height:1}.deflector-svg{width:70%;height:70%}.toggle-rotate{transition:transform .25s ease-in-out .3s}.teleporter{flex-direction:column;align-items:center;gap:0;line-height:1;display:flex}.teleporter-label{color:#6a1b9a;font-size:clamp(12px,2.5vw,18px);font-weight:800}.teleporter-dir{color:#6a1b9a;opacity:.7;font-size:clamp(10px,2vw,16px)}.teleporter-A .teleporter-label{color:#6a1b9a}.teleporter-B .teleporter-label{color:#00838f}.lock-icon{opacity:.35;font-size:10px;position:absolute;top:2px;right:2px}.ball{z-index:10;pointer-events:none;filter:drop-shadow(0 2px 3px #0000004d);line-height:1;position:absolute;transform:translate(-50%,-50%)}@media (width<=700px){.grid{--grid-padding:8px;gap:2px;padding:8px}.lock-icon{display:none}}.tray{-webkit-user-select:none;user-select:none;flex-direction:column;gap:12px;display:flex}.tray-label{letter-spacing:2px;color:#8b6914;text-transform:uppercase;font-size:14px;font-weight:800}.tray-hint{color:#a08050;font-size:12px}.tray-empty{color:#2e7d32;font-size:14px;font-weight:600}.tray-section{flex-wrap:wrap;gap:8px;display:flex}.tray-tile,.tray-group{touch-action:none}.tray-tile{cursor:pointer;color:#1565c0;background:linear-gradient(145deg,#f5e6c8,#e8d5a8);border:2px solid #c4a66a;border-radius:6px;justify-content:center;align-items:center;width:48px;height:48px;transition:all .2s;display:flex}.tray-tile:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.tray-tile-selected{background:#1565c01f;border-color:#1565c0;transform:translateY(-2px);box-shadow:0 4px 12px #1565c04d}.tray-tile-disabled{opacity:.5;pointer-events:none}.tray-deflector-svg{width:28px;height:28px}.tray-group-wrapper{flex-direction:column;align-items:flex-start;gap:6px;display:flex}.tray-group{cursor:pointer;border:2px solid #0000;border-radius:6px;gap:2px;padding:4px;transition:all .2s;display:grid}.tray-group:hover{background:#1565c00d}.tray-group-selected{background:#1565c01a;border-color:#1565c0}.tray-group-cell{color:#1565c0;border-radius:4px;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.tray-group-cell-filled{background:linear-gradient(145deg,#f5e6c8,#e8d5a8);border:1px solid #c4a66a}.rotate-btn{color:#f5e6c8;cursor:pointer;background:linear-gradient(135deg,#6d4c0e,#5a3e0a);border:none;border-radius:6px;padding:4px 12px;font-size:12px;font-weight:600;transition:background .2s}.rotate-btn:hover{background:linear-gradient(135deg,#5a3e0a,#4a3008)}.rotate-btn:disabled{opacity:.4;cursor:not-allowed}.speed-control{flex-direction:column;gap:8px;display:flex}.speed-label{letter-spacing:2px;color:#8b6914;font-size:12px;font-weight:800}.speed-options{background:#8b69141a;border:1px solid #c4a66a;border-radius:8px;gap:3px;padding:3px;display:flex}.speed-btn{color:#8b6914;cursor:pointer;background:0 0;border:none;border-radius:6px;flex:1;padding:6px 8px;font-size:13px;font-weight:600;transition:all .2s}.speed-btn-active{color:#f5e6c8;background:linear-gradient(135deg,#6d4c0e,#5a3e0a);box-shadow:0 2px 6px #5a3e0a4d}.confetti-burst{pointer-events:none;z-index:50;position:fixed;inset:0;overflow:hidden}.confetti-piece{border-radius:2px;animation:2.5s ease-in forwards confetti-fall;position:absolute;top:-10px}@keyframes confetti-fall{0%{opacity:1;transform:translateY(0)translate(0)rotate(0)}80%{opacity:1}to{transform:translateY(100vh) translateX(var(--drift)) rotate(720deg);opacity:0}}.app{color:#3a2e1a;box-sizing:border-box;background:radial-gradient(at 20%,#228b2226 0%,#0000 50%),radial-gradient(at 80% 30%,#6b8e231a 0%,#0000 50%),linear-gradient(#87ceeb 0%,#b0d4e8 30%,#7ec850 30%,#5a9e3a 60%,#4a8530 100%);min-height:100vh;padding:20px;font-family:Segoe UI,system-ui,-apple-system,sans-serif}.header{text-align:center;margin-bottom:24px}.title{color:#fff;text-shadow:2px 3px #00000040,0 0 20px #fff3;letter-spacing:3px;margin:0 0 8px;font-size:48px;font-weight:800}.level-selector{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff4d;border:1px solid #fff3;border-radius:20px;align-items:center;gap:6px;padding:4px 8px;display:inline-flex}.level-dropdown{color:#fff;cursor:pointer;text-shadow:1px 1px 2px #0000004d;background:0 0;border:none;border-radius:12px;outline:none;padding:4px 8px;font-size:16px;font-weight:600}.level-dropdown option{color:#333;background:#fff}.level-nav{color:#fff;cursor:pointer;text-shadow:1px 1px 2px #0000004d;background:#ffffff40;border:none;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:22px;font-weight:700;line-height:1;transition:background .2s;display:flex}.level-nav:hover:not(:disabled){background:#fff6}.level-nav:disabled{opacity:.3;cursor:not-allowed}.game-layout{justify-content:center;align-items:flex-start;gap:24px;max-width:900px;margin:0 auto;display:flex}.grid-container{text-align:center;flex-shrink:0}.fail-message{color:#fff;text-align:center;background:linear-gradient(135deg,#d32f2f,#c62828);border:2px solid #fff3;border-radius:12px;margin-top:12px;padding:12px 20px;font-weight:600;animation:.4s shake}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}75%{transform:translate(6px)}}.sidebar{background:linear-gradient(#f5e6c8,#e8d5a8);border:2px solid #c4a66a;border-radius:12px;flex-direction:column;gap:16px;min-width:200px;padding:20px;display:flex;box-shadow:0 4px 16px #0003,inset 0 1px #ffffff80}.actions{flex-direction:column;gap:10px;display:flex}.btn{cursor:pointer;text-transform:uppercase;letter-spacing:1px;border:none;border-radius:10px;padding:14px 24px;font-size:18px;font-weight:700;transition:all .2s}.btn:disabled{opacity:.4;cursor:not-allowed;transform:none!important}.fire-btn{color:#fff;background:linear-gradient(135deg,#e65100,#bf360c);border:2px solid #ff8a50;box-shadow:0 4px 12px #bf360c66}.fire-btn:not(:disabled):hover{transform:translateY(-2px);box-shadow:0 6px 20px #bf360c80}.fire-btn:not(:disabled):active{transform:translateY(0)}.reset-btn{color:#5d4037;background:linear-gradient(#efebe9,#d7ccc8);border:2px solid #bcaaa4}.next-level-btn{color:#fff;background:linear-gradient(135deg,#2e7d32,#1b5e20);border:2px solid #66bb6a;box-shadow:0 4px 12px #1b5e2066}.next-level-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #1b5e2080}.next-level-btn:active{transform:translateY(0)}.success-banner{color:#5d4037;text-align:center;background:linear-gradient(#f5e6c8,#e8d5a8);border:2px solid #c4a66a;border-radius:20px;margin-top:10px;padding:6px 16px;font-size:14px;font-weight:600;animation:.4s cubic-bezier(.34,1.56,.64,1) banner-pop;display:inline-block}@keyframes banner-pop{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.reset-btn:not(:disabled):hover{background:linear-gradient(#d7ccc8,#bcaaa4);transform:translateY(-1px)}@media (width<=700px){.title{font-size:32px}.game-layout{flex-direction:column;align-items:center}.sidebar{width:100%;max-width:400px}}
