:root{--sky:#7bbef5;--sky-deep:#4f8fcf;--ink:#23466b;--chip:#204e808c;--shade:30, 70, 120;--btn2:#9fb4c9;--btn2-deep:#7891aa;--white:#fff;--success:#74d447;--success-deep:#4fa82b;--error:#ec7b72;--error-deep:#c9544b;--goal:#f6cf48;--accent:#f0963a;--panel:#f5f8fc;--panel-line:#dde6f0;--font:ui-rounded, "SF Pro Rounded", "Arial Rounded MT Bold", "Nunito", system-ui, sans-serif}*{box-sizing:border-box}html,body{height:100%;font-family:var(--font);color:var(--ink);-webkit-font-smoothing:antialiased;background:#dfe9f4;margin:0;overflow:hidden}button{cursor:pointer;font-family:inherit}#app{height:100%}.menu{background:var(--sky);height:100%;padding:40px 24px 60px;overflow:auto}.menu h1{max-width:960px;color:var(--white);letter-spacing:.5px;margin:0 auto 4px;font-size:34px}.menu p.sub{color:#ffffffd9;max-width:960px;margin:0 auto 28px;font-size:15px}.grid{grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px;max-width:960px;margin:0 auto;display:grid}.card{text-align:left;background:var(--white);color:var(--ink);border:none;border-radius:18px;padding:16px 16px 14px;transition:transform .12s;box-shadow:0 5px #1e508240}.card:not(:disabled):hover{transform:translateY(-2px)}.card:disabled{cursor:default;opacity:.55;box-shadow:0 3px #1e508226}.card .id{color:#7c97b4;font-size:12px;font-weight:800}.card .name{margin-top:2px;font-size:18px;font-weight:800}.card .verb{color:#6b8299;margin-top:4px;font-size:13px}.card .status{letter-spacing:.4px;color:#7c97b4;background:#e8eef5;border-radius:999px;margin-top:10px;padding:3px 9px;font-size:11px;font-weight:800;display:inline-block}.card .status.live{background:var(--success);color:var(--white)}.screen{justify-content:center;align-items:center;gap:18px;height:100%;padding:14px;display:flex}.stage{aspect-ratio:9/16;background:var(--sky);max-width:calc(100vw - 400px);height:calc(100vh - 28px);box-shadow:0 18px 50px rgba(var(--shade), .25);-webkit-user-select:none;user-select:none;border-radius:26px;position:relative;overflow:hidden}.canvas-host{position:absolute;inset:0}.hud{pointer-events:none;position:absolute;inset:0}.hud>*{pointer-events:auto}.hud-top{pointer-events:none;justify-content:space-between;align-items:center;display:flex;position:absolute;top:14px;left:14px;right:14px}.hud-top>*{pointer-events:auto}.round-btn{background:var(--chip);width:42px;height:42px;color:var(--white);border:none;border-radius:50%;place-items:center;font-size:20px;font-weight:900;display:grid}.chip{background:var(--chip);color:var(--white);border-radius:999px;align-items:center;gap:8px;padding:8px 16px;font-size:18px;font-weight:900;display:inline-flex}.tier-pill{letter-spacing:.6px;color:var(--white);border-radius:999px;padding:2px 8px;font-size:11px}.timer{pointer-events:none;align-items:center;gap:10px;width:62%;display:flex;position:absolute;top:66px;left:50%;transform:translate(-50%)}.timer .bar{background:var(--chip);border-radius:999px;flex:1;height:14px;overflow:hidden}.timer .fill{background:var(--white);border-radius:999px;width:0%;height:100%;transition:background .2s}.timer.low .fill{background:var(--error)}.timer .secs{min-width:34px;color:var(--white);text-align:right;text-shadow:0 2px 0 rgba(var(--shade), .3);font-size:18px;font-weight:900}.timer.pulse .secs{animation:.5s ease-out pulse}.timer-delta{color:var(--error);text-shadow:0 2px #ffffffb3;pointer-events:none;font-size:22px;font-weight:900;animation:1.1s ease-out forwards floatUp;position:absolute;top:88px;right:18%}.clones-left{pointer-events:none;padding:4px 12px;font-size:14px;position:absolute;top:96px;left:50%;transform:translate(-50%)}.banner{text-align:center;color:var(--white);text-shadow:0 2px 0 rgba(var(--shade), .35);opacity:0;pointer-events:none;font-size:30px;font-weight:900;line-height:1.1;transition:opacity .15s;position:absolute;top:92px;left:0;right:0}.banner.show{opacity:1}.banner .subtitle{opacity:.95;margin-top:4px;font-size:15px;font-weight:800;display:block}.dock{box-shadow:0 5px 0 rgba(var(--shade), .25);opacity:0;pointer-events:none;background:#fffffff0;border-radius:18px;align-items:center;gap:12px;padding:12px 14px;transition:opacity .18s,transform .18s;display:flex;position:absolute;top:160px;left:14px;right:14px;transform:translateY(-8px)}.hud>.dock:not(.show){pointer-events:none}.dock.show{opacity:1;pointer-events:auto;transform:none}.dock .text{color:var(--ink);flex:1;font-size:15px;font-weight:700;line-height:1.3}.dock .text:empty{display:none}.dock .actions{flex:none;gap:8px;margin:0 auto;display:flex}.dock .text:not(:empty)+.actions{margin:0}.dock .btn{padding:10px 18px;font-size:17px}.dock .actions:empty{display:none}.btn{letter-spacing:.5px;color:var(--white);background:var(--success);box-shadow:0 5px 0 var(--success-deep);border:none;border-radius:16px;padding:12px 28px;font-size:20px;font-weight:900;transition:transform 80ms}.btn:active{box-shadow:0 2px 0 var(--success-deep);transform:translateY(3px)}.btn.secondary{background:var(--btn2);box-shadow:0 5px 0 var(--btn2-deep);padding:12px 18px;font-size:16px}.powerbar{justify-content:space-around;display:flex;position:absolute;bottom:12px;left:10px;right:10px}.power{color:var(--white);text-shadow:0 1px 0 rgba(var(--shade), .35);background:0 0;border:none;flex-direction:column;align-items:center;gap:4px;padding:0;font-size:12px;font-weight:900;transition:transform 80ms,opacity .15s;display:flex}.power .icon{width:54px;height:54px;box-shadow:0 4px 0 rgba(var(--shade), .3);border-radius:18px;place-items:center;display:grid;position:relative}.power .count{background:var(--white);min-width:22px;height:22px;color:var(--ink);text-shadow:none;border-radius:999px;padding:0 5px;font-size:12px;line-height:22px;position:absolute;top:-6px;right:-6px}.power.radiate .icon{background:var(--white)}.power.radiate .icon:before{content:"";border:5px solid var(--goal);border-radius:50%;width:22px;height:22px}.power.freeze .icon{background:#8fd0fa}.power.freeze .icon:before{content:"";background:var(--white);border-radius:6px;width:24px;height:24px;transform:rotate(45deg)}.power.explode .icon{background:#3d4a5c}.power.explode .icon:before{content:"";width:24px;height:24px;box-shadow:8px -8px 0 -5px var(--accent);background:#1f2834;border-radius:50%}.power.empty .icon,.power.locked .icon{box-shadow:none;background:0 0;border:2px dashed #ffffff8c}.power.locked .icon:before{display:none}.power.locked .count{min-width:0;height:auto;color:var(--white);white-space:nowrap;background:0 0;padding:0;font-size:13px;line-height:1;top:50%;left:50%;right:auto;transform:translate(-50%,-50%)}.power.locked:disabled{opacity:.8}.power:not(:disabled):active{transform:translateY(3px)}.power:disabled{opacity:.4;cursor:default}.power.active .icon{outline:3px solid var(--white);outline-offset:2px}.caption{background:var(--chip);max-width:88%;color:var(--white);text-align:center;opacity:0;pointer-events:none;border-radius:999px;padding:10px 18px;font-size:16px;font-weight:800;transition:opacity .35s;position:absolute;top:170px;left:50%;transform:translate(-50%)}.caption.show{opacity:1}@keyframes pulse{0%{transform:scale(1.35)}to{transform:scale(1)}}@keyframes floatUp{0%{opacity:0;transform:translateY(8px)scale(.8)}20%{opacity:1;transform:translateY(0)scale(1.1)}to{opacity:0;transform:translateY(-26px)scale(1)}}.lab{background:var(--panel);color:#2c3e52;border-radius:18px;width:360px;height:calc(100vh - 28px);padding:14px 16px 24px;font-family:ui-sans-serif,system-ui,-apple-system,sans-serif;font-size:12.5px;overflow:auto;box-shadow:0 10px 30px #1e46781f}.lab h2{font-family:var(--font);margin:0 0 2px;font-size:18px}.lab .hint{color:#7b8da1;margin:0 0 10px}.lab section{border-top:1px solid var(--panel-line);padding:10px 0 6px}.lab h3{letter-spacing:.8px;text-transform:uppercase;color:#7b8da1;margin:0 0 8px;font-size:11px}.lab .row{flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:6px;display:flex}.lab input[type=number]{width:70px;font:inherit;border:1px solid #c9d6e3;border-radius:7px;padding:5px 6px}.lab select{font:inherit;background:#fff;border:1px solid #c9d6e3;border-radius:7px;padding:5px 6px}.lab button{font:inherit;color:#2c3e52;background:#fff;border:1px solid #c9d6e3;border-radius:7px;padding:5px 10px}.lab button:hover{background:#eef4fa}.lab label{align-items:center;gap:5px;display:inline-flex}.kv{grid-template-columns:1fr auto;gap:3px 10px;display:grid}.kv span:nth-child(odd){color:#6b7f94}.kv span:nth-child(2n){font-variant-numeric:tabular-nums;text-align:right;font-weight:600}.powerups{gap:8px;margin:0;padding:0;list-style:none;display:grid}.powerups .power-row{justify-content:space-between;align-items:center;gap:8px;display:flex}.powerups .stepper{font-variant-numeric:tabular-nums;color:#4a5f75;align-items:center;gap:6px;display:inline-flex}.powerups .infinite{cursor:pointer;align-items:center;gap:2px;margin-right:4px;font-size:13px;display:inline-flex}.powerups .infinite input{margin:0}.powerups .stepper button{width:24px;padding:2px 0}.powerups .counters{color:#6b7f94;font-size:11px}.dims{grid-template-columns:70px 1fr 34px;align-items:center;gap:4px 8px;margin-top:6px;display:grid}.dims .track{background:#e2e9f1;border-radius:3px;height:6px;overflow:hidden}.dims .track div{background:#3f7fb8;height:100%}.map{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%}.map th{text-align:right;color:#7b8da1;padding:2px 4px;font-weight:600}.map td{text-align:right;border-top:1px solid #edf2f7;padding:2px 4px}.map th:first-child,.map td:first-child,.map th:nth-child(2),.map td:nth-child(2){text-align:left}.map tr{cursor:pointer}.map tr.current td{background:#fff5d6}.map tbody tr:hover td{background:#eef4fa}.tier-dot{text-align:center;color:#fff;border-radius:4px;width:18px;font-size:10.5px;font-weight:700;display:inline-block}.log{color:#50647a;white-space:pre-wrap;max-height:120px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;overflow:auto}button{touch-action:manipulation}.lab-toggle,.lab-scrim{display:none}@media (width<=900px){html,body{overscroll-behavior:none}.screen{gap:0;padding:0}.stage{aspect-ratio:auto;width:100vw;max-width:none;height:100dvh;box-shadow:none;--hud-top:184px;--hud-bottom:72px;border-radius:0}.hud-top{top:10px;left:10px;right:10px}.round-btn{width:36px;height:36px;font-size:17px}.chip{padding:5px 12px;font-size:15px}.timer{top:54px}.timer .bar{height:11px}.timer .secs{font-size:15px}.timer-delta{font-size:18px;top:70px}.clones-left{padding:3px 10px;font-size:12px;top:74px}.banner{font-size:22px;top:72px}.banner .subtitle{margin-top:2px;font-size:12px}.dock{border-radius:14px;gap:8px;padding:8px 10px;top:112px;left:10px;right:10px}.dock .text{font-size:13px}.dock .btn{padding:8px 14px;font-size:15px}.caption{padding:7px 14px;font-size:13px;top:112px}.powerbar{bottom:8px}.power{font-size:11px}.power .icon{border-radius:14px;width:44px;height:44px}.lab{z-index:20;width:min(360px,88vw);height:auto;padding-bottom:calc(24px + env(safe-area-inset-bottom));border-radius:18px 0 0 18px;transition:transform .25s;position:fixed;top:0;bottom:0;right:0;transform:translate(105%)}.lab h2{margin-right:48px}.screen.lab-open .lab{transform:none}.lab-toggle{z-index:21;display:grid;position:fixed;top:10px;right:10px}.lab-scrim{z-index:19;opacity:0;pointer-events:none;background:#14284640;transition:opacity .25s;display:block;position:fixed;inset:0}.screen.lab-open .lab-scrim{opacity:1;pointer-events:auto}}
