:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-family:system-ui,-apple-system,Segoe UI,Arial,sans-serif}html,body,#root{background:#eaf2ec;height:100%;margin:0;overflow:hidden}.app{color:#10241b;flex-direction:column;height:100%;display:flex}.top{justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.logo{vertical-align:-5px;background:linear-gradient(135deg,#71f3e8,#42cbbe);border-radius:7px;width:22px;height:22px;margin-right:8px;display:inline-block;box-shadow:inset 0 -2px #2f9e96}.lvl{color:#3e5c53;background:#ffffffb3;border-radius:999px;align-items:center;gap:10px;padding:7px 12px;font-size:13px;font-weight:600;display:flex;box-shadow:0 2px 8px -4px #10241b40}.lvl .lvlbar{background:#d6e9e1;border-radius:3px;width:64px;height:6px;display:inline-block;overflow:hidden}.lvl .lvlbar i{background:#42cbbe;border-radius:3px;height:100%;display:block}.sec{letter-spacing:.12em;color:#5e7f76;text-transform:uppercase;align-items:center;gap:8px;padding:0 4px;font-size:11px;font-weight:800;display:flex}.sec:after{content:"";background:#d3e4dc;flex:1;height:1px}.brand{letter-spacing:.02em;font-size:20px;font-weight:800}.lvl{color:#53675c;font-size:14px}.stage{flex:none;height:46vh;min-height:260px;position:relative}.stage canvas{display:block;width:100%!important;height:100%!important}.msg{color:#1c6a4c;background:#e9fbef;border-radius:999px;padding:10px 18px;font-weight:700;position:absolute;top:14px;left:50%;transform:translate(-50%);box-shadow:0 6px 18px -8px #10241b66}.msg.bad{color:#b3261e;background:#fdece9}.deck{background:#f3f8f4;border-radius:22px 22px 0 0;flex:auto;gap:10px;min-height:0;padding:12px 12px 16px;display:grid;overflow-y:auto;box-shadow:0 -6px 22px -16px #10241b40}.tape{background:#e4f1ec;border:1px solid #cfe3da;border-radius:16px;gap:6px;margin-top:8px;padding:12px 12px 10px;display:grid;position:relative}.tape.sel{outline-offset:2px;outline:2px solid #f2c14e}.tape-tag{color:#2d5c9c;background:#cfe2fa;border-radius:999px;place-items:center;width:26px;height:22px;display:grid;position:absolute;top:-9px;left:12px}.tape.dive .tape-tag{color:#2d5c9c;background:#cfe2fa}.tape-row{flex-wrap:wrap;align-items:center;gap:8px;min-height:58px;display:flex}.ghost{color:#6f8c84;padding:0 4px;font-size:13px}.chip{cursor:pointer;color:#2b4a40;background:#fff;border:1px solid #dce8e1;border-radius:16px;place-items:center;width:62px;height:62px;transition:transform .12s,box-shadow .12s;display:grid;position:relative;box-shadow:0 5px #cfe0d7,0 10px 16px -10px #10241b40}.chip:hover:not(:disabled){transform:translateY(-2px)}.chip:active:not(:disabled){transform:translateY(3px);box-shadow:0 2px #cfe0d7}.chip:disabled{opacity:.45;cursor:default}.chip.sm{border-radius:12px;width:46px;height:46px;box-shadow:0 3px #cfe0d7,0 6px 10px -6px #10241b40}.chip.move{color:#3e8c63}.chip.turn{color:#4a74ae}.chip.act{color:#b88a2a}.chip.live{outline-offset:2px;outline:3px solid #f2c14e}.palette{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.loop{background:#f3eeff;border:2px dashed #b9a6e6;border-radius:14px;gap:6px;padding:8px;display:grid}.loop.sel{border-style:solid;border-color:#f2c14e}.loop-head{color:#5b4a8a;align-items:center;gap:6px;font-weight:800;display:flex}.loop-badge{color:#5b4a8a;background:#e0d4fa;border-radius:8px;place-items:center;width:26px;height:26px;display:grid}.loop-head b{text-align:center;min-width:30px}.nudge{color:#5b4a8a;cursor:pointer;background:#e0d4fa;border:none;border-radius:8px;width:26px;height:26px;font-weight:800}.nudge.x{color:#a65a4f;background:#f6e3e0;margin-left:auto}.nudge:disabled{opacity:.35}.loop-body{background:#fffa;border-radius:10px;flex-wrap:wrap;gap:6px;min-height:46px;padding:6px;display:flex}.controls{justify-content:center;gap:14px;display:flex}.ctl{cursor:pointer;color:#2b4a40;background:#fff;border:1px solid #dce8e1;border-radius:50%;place-items:center;width:58px;height:58px;display:grid;box-shadow:0 4px #cfe0d7}.ctl.go{color:#1c5e3a;background:#a8e3b8;border-color:#9ed6ae;width:70px;height:70px;box-shadow:0 4px #8cc9a0}.ctl:disabled{opacity:.4;box-shadow:none}.ctl:active:not(:disabled){transform:translateY(3px)}.mapbtn{color:#2b4a40;cursor:pointer;background:#ffffffb3;border:none;border-radius:12px;place-items:center;width:36px;height:36px;margin-right:8px;display:grid;box-shadow:0 2px 8px -4px #10241b40}.overlay{z-index:50;background:#10241b59;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.sheet{background:#f6fbf8;border-radius:22px 22px 0 0;width:min(640px,100%);max-height:82vh;padding:14px 16px 24px;overflow-y:auto;box-shadow:0 -10px 30px -12px #10241b59}.sheet-head{justify-content:space-between;align-items:center;margin-bottom:6px;font-size:18px;display:flex}.close{color:#2b4a40;cursor:pointer;background:#e3efe9;border:none;border-radius:50%;width:36px;height:36px;font-size:22px}.konu h3{letter-spacing:.08em;text-transform:uppercase;color:#5e7f76;margin:14px 0 8px;font-size:13px}.konu .grid{grid-template-columns:repeat(auto-fill,minmax(44px,1fr));gap:8px;display:grid}.konu .grid button{color:#2b4a40;cursor:pointer;background:#fff;border:1px solid #dce8e1;border-radius:12px;height:44px;font-weight:700}.konu .grid button.on{background:#a8e3b8;border-color:#9ed6ae}.splash{z-index:60;text-align:center;background:linear-gradient(#f6fbf8,#e6f4ec);place-content:center;justify-items:center;gap:14px;padding:24px;display:grid;position:fixed;inset:0}.splash h1{letter-spacing:.02em;margin:0;font-size:44px}.splash p{color:#53675c;max-width:320px;margin:0;font-size:16px;line-height:1.5}.splash-mark{background:linear-gradient(135deg,#a8e5d0,#42cbbe);border-radius:28px;place-items:center;width:104px;height:104px;margin-bottom:6px;display:grid;box-shadow:0 10px 24px -10px #075b678c,inset 0 -4px #2f9e96}.splash-mark i{background:#f5fffc;border-radius:50%;width:46px;height:46px;box-shadow:inset 0 -6px #b9e6d3,0 0 0 6px #71f3e8aa}.go-btn{color:#1c5e3a;cursor:pointer;background:#a8e3b8;border:none;border-radius:999px;min-width:200px;margin-top:10px;padding:14px 28px;font-size:17px;font-weight:800;box-shadow:0 5px #8cc9a0}.go-btn:active{transform:translateY(3px);box-shadow:0 2px #8cc9a0}.sheet.intro{text-align:center;width:min(520px,100%)}.intro-kicker{letter-spacing:.12em;color:#5e7f76;text-transform:uppercase;margin-bottom:8px;font-size:12px;font-weight:800}.intro-card{border-bottom:1px solid #dce8e1;justify-items:center;gap:8px;padding:14px 0 18px;display:grid}.intro-card:last-of-type{border-bottom:none}.intro-card h2{color:#1b3b44;margin:4px 0 0;font-size:20px}.intro-card p{color:#53675c;max-width:380px;margin:0;font-size:15px;line-height:1.45}.stage-mini{background:#eef8f3;border-radius:16px;width:300px;height:150px;position:relative;overflow:hidden}.mini-row{height:40px;position:absolute;top:42px;left:34px;right:34px}.mini-tile{background:#b9e6d3;border-radius:8px;width:52px;height:30px;position:absolute;top:10px;box-shadow:0 4px #82bfae}.mini-tile.t0{left:0}.mini-tile.t1{left:62px}.mini-tile.t2{left:124px}.mini-tile.t3{left:186px}.mini-tile.lamp{background:#b7dce0}.mini-tile.lamp:after{content:"";opacity:0;background:#5ce1e6;border-radius:50%;width:24px;height:14px;position:absolute;top:6px;left:14px}.mini-tile.gap{box-shadow:none;background:0 0}.mini-bot{width:40px;height:40px;position:absolute;top:-12px;left:6px}.mini-bot i{background:#f5fffc;border-radius:50%;width:40px;height:40px;display:block;box-shadow:inset 0 -6px #a8e5d0,0 4px #75b9a6}.mini-count{color:#5b4a8a;font:800 18px/1 system-ui;position:absolute;top:-26px;right:-4px}.mini-chip{color:#3e8c63;background:#fff;border-radius:14px;place-items:center;width:48px;height:48px;display:grid;position:absolute;bottom:10px;left:50%;transform:translate(-50%);box-shadow:0 4px #cfe0d7}.stage-mini.fwd .mini-bot{animation:2.2s ease-in-out infinite m-fwd}@keyframes m-fwd{0%,15%{transform:translate(0)}45%,to{transform:translate(62px)}}.stage-mini.left .mini-bot i,.stage-mini.right .mini-bot i{animation:2.2s ease-in-out infinite m-turn}.stage-mini.right .mini-bot i{animation-name:m-turnr}@keyframes m-turn{0%,20%{transform:rotate(0)}60%,to{transform:rotate(-90deg)}}@keyframes m-turnr{0%,20%{transform:rotate(0)}60%,to{transform:rotate(90deg)}}.stage-mini.light .mini-bot{animation:2.2s ease-in-out infinite m-light}.stage-mini.light .mini-tile.lamp:after{animation:2.2s ease-in-out infinite m-glow}@keyframes m-light{0%,20%{transform:translate(0)}55%,to{transform:translate(124px)}}@keyframes m-glow{0%,55%{opacity:0}70%,to{opacity:1}}.stage-mini.jump .mini-bot{animation:2.2s ease-in-out infinite m-jump}@keyframes m-jump{0%{transform:translate(0)}25%{transform:translate(31px,-36px)}50%,to{transform:translate(62px)}}.stage-mini.repeat .mini-bot{animation:2.4s steps(3,end) infinite m-rep}@keyframes m-rep{0%{transform:translate(0)}to{transform:translate(62px)}}.stage-mini.repeat .mini-count{animation:2.4s ease-in-out infinite m-pulse}@keyframes m-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}.stage-mini.call .mini-chip{color:#2d5c9c;animation:2s ease-in-out infinite m-pop}@keyframes m-pop{0%,to{transform:translate(-50%)scale(1)}50%{transform:translate(-50%)scale(1.12)}}@media (prefers-reduced-motion:reduce){.stage-mini *,.splash *{animation:none!important}}
