:root{--bg: #0d0221;--bg-soft: #1b1035;--bg-deep: #3a0d6e;--card: #221542;--accent: #b958ff;--accent-hover: #9a2ff0;--accent-2: #ff2e97;--node: #00e5ff;--good: #3ddc97;--bad: #ff2e97;--text: #f5f3ff;--white: #fff;--muted: #a99fd6;--bg-mid: #14022e;--z-hidden: -1;--z-nav: 10;--z-overlay: 20;--glass-bg: rgba(40, 18, 74, .72);--glass-bg-solid: rgba(40, 18, 74, .85);--btn-bg: rgba(58, 26, 104, .9);--build-bg: rgba(34, 21, 66, .92);--border-subtle: rgba(255, 255, 255, .06);--border-soft: rgba(255, 255, 255, .08);--border-mid: rgba(255, 255, 255, .1);--border-strong: rgba(255, 255, 255, .12);--border-hover: rgba(255, 255, 255, .25);--radius-sm: 12px;--radius-bar: 14px;--radius-card: 16px;--radius-lg: 18px;--radius-pill: 999px;--ease-out-expo: cubic-bezier(.16, 1, .3, 1);--touch-min: 44px;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html{background-color:var(--bg)}body{margin:0;padding:0;min-height:100vh;background:radial-gradient(circle at 25% 0%,var(--bg-deep) 0%,var(--bg-mid) 45%,var(--bg) 100%) var(--bg);color:var(--text)}#app{max-width:960px;margin:0 auto;padding:calc(2rem + env(safe-area-inset-top,0px)) 1.25rem 4rem}.hub-header{text-align:center;margin-bottom:2.5rem}.hub-header h1{font-size:clamp(2.2rem,6vw,3.5rem);margin:0 0 .5rem;color:var(--accent);letter-spacing:-.02em;text-wrap:balance}.hub-header p{color:var(--muted);margin:0;font-size:1.05rem;text-wrap:pretty}.game-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.25rem}.game-card{display:flex;flex-direction:column;gap:.5rem;padding:1.5rem;border-radius:var(--radius-card);background:var(--card);border:1px solid var(--border-subtle);text-decoration:none;color:inherit;cursor:pointer;transition:transform .2s var(--ease-out-expo),border-color .2s var(--ease-out-expo),box-shadow .2s var(--ease-out-expo)}.game-card:active{transform:scale(.98)}.game-card.disabled{opacity:.6;cursor:default}.game-card.disabled:active{transform:none}.game-card .emoji{font-size:2.6rem}.game-card h2{margin:0;font-size:1.3rem;text-wrap:balance}.game-card p{margin:0;color:var(--muted);font-size:.95rem}.badge{align-self:flex-start;margin-top:.35rem;font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;padding:.2rem .55rem;border-radius:var(--radius-pill);background:#7c5cff2e;color:var(--accent)}.badge.soon{background:#ff5c8a26;color:var(--accent-2)}.best-score{font-size:.78rem;font-weight:600;color:var(--node);margin-top:auto}.game-page{margin:0;overflow:hidden}#game-root{width:100vw;height:100dvh;display:flex;align-items:center;justify-content:center}.back-link{position:fixed;top:env(safe-area-inset-top,12px);left:12px;z-index:var(--z-nav);padding:.5rem .9rem;min-height:var(--touch-min);display:inline-flex;align-items:center;border-radius:var(--radius-pill);background:var(--glass-bg-solid);color:var(--text);text-decoration:none;font-size:.9rem;border:1px solid var(--border-mid);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:border-color .2s var(--ease-out-expo)}@media (hover: hover){.back-link:hover{border-color:var(--accent)}}.hud-overlay{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:var(--z-overlay);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}.hud-bar{position:absolute;top:env(safe-area-inset-top,12px);left:50%;transform:translate(-50%);display:flex;align-items:center;gap:10px;padding:6px 12px;border-radius:var(--radius-bar);background:var(--glass-bg);border:1px solid var(--border-soft);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.hud-label{font-size:.62rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.hud-val{font-size:1rem;font-weight:700;color:var(--text)}.game-btn{pointer-events:auto;font:inherit;font-size:.95rem;color:var(--text);background:var(--btn-bg);border:1px solid var(--border-mid);border-radius:var(--radius-pill);padding:.5rem 1.2rem;min-height:var(--touch-min);cursor:pointer;transition:background .2s var(--ease-out-expo),border-color .2s var(--ease-out-expo),transform .1s var(--ease-out-expo)}@media (hover: hover){.game-btn:hover{background:var(--accent-hover);border-color:var(--accent)}}.game-btn:active{transform:scale(.96)}.onboard-hint{position:fixed;top:0;right:0;bottom:0;left:0;z-index:calc(var(--z-overlay) + 1);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;background:#0d0221d1;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);text-align:center;padding:2rem;opacity:0;transition:opacity .25s var(--ease-out-expo)}.onboard-hint.onboard-visible{opacity:1}.onboard-hint.onboard-exit{opacity:0}.onboard-line1{font-size:clamp(1.15rem,4vw,1.5rem);font-weight:700;color:var(--white);margin:0;text-wrap:balance}.onboard-line2{font-size:clamp(.9rem,3vw,1.05rem);color:var(--muted);margin:0;max-width:36ch;text-wrap:pretty}.onboard-dismiss{margin-top:1rem;font-size:.8rem;color:var(--accent);text-transform:uppercase;letter-spacing:.06em;animation:onboard-pulse 2s var(--ease-out-expo) infinite}@keyframes onboard-pulse{0%,to{opacity:.6}50%{opacity:1}}@media (prefers-reduced-motion: reduce){.onboard-hint,.onboard-hint.onboard-visible,.onboard-hint.onboard-exit{transition:none}.onboard-dismiss{animation:none;opacity:1}}.ug-bar{flex-direction:row;align-items:center;gap:16px;padding:8px 18px;text-align:center}.ug-stat{display:inline-flex;flex-direction:column;align-items:center;line-height:1.1}.ug-stat-label{font-size:.6rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.ug-stat-val{font-size:1.15rem;font-weight:700;color:var(--text)}.ug-stat-val.ug-pop{animation:ug-pop .3s ease;color:var(--good)}.ug-status{font-size:.85rem;color:var(--muted);border-left:1px solid var(--border-strong);padding-left:16px}.ug-status.solved{color:var(--good);font-weight:600}.ug-btn{padding:.5rem 1rem}.hud-topbar{position:absolute;top:env(safe-area-inset-top,12px);left:0;right:0;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;padding-left:max(12px,env(safe-area-inset-left,12px));padding-right:max(12px,env(safe-area-inset-right,12px))}.hud-topbar .back-link,.hud-topbar .hud-bar,.hud-topbar .ug-shuffle{position:static;inset:auto;transform:none}.hud-topbar .back-link{justify-self:start;align-self:stretch;justify-content:center;pointer-events:auto}.hud-topbar .hud-bar{justify-self:center;align-self:stretch}.hud-topbar .ug-shuffle{justify-self:end;align-self:stretch;display:inline-flex;align-items:center;justify-content:center}@keyframes ug-pop{0%{transform:scale(.7);opacity:.4}to{transform:scale(1);opacity:1}}.td-top{gap:10px;padding:6px 10px}.td-stat{display:flex;flex-direction:column;align-items:center;min-width:62px;padding:0 6px}.td-stat+.td-stat{border-left:1px solid var(--border-mid)}.td-stat-label{font-size:.62rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.td-stat-val{font-size:1rem;font-weight:700;color:var(--text)}.td-stat-val.td-low{color:var(--bad)}.td-wave-stat .td-stat-val{color:var(--node)}.td-castle{position:absolute;top:calc(env(safe-area-inset-top,12px) + 66px);left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:4px;width:min(280px,calc(100vw - 40px))}.td-castle-label{font-size:.72rem;color:var(--muted)}.td-hpbar{width:100%;height:8px;border-radius:var(--radius-pill);background:#ffffff1f;overflow:hidden}.td-hpfill{height:100%;width:100%;border-radius:var(--radius-pill);background:linear-gradient(90deg,var(--good),var(--node));transform-origin:left center;transition:transform .2s var(--ease-out-expo)}.td-hpfill.td-crit{background:linear-gradient(90deg,var(--bad),var(--accent))}.td-bottom{position:absolute;bottom:env(safe-area-inset-bottom,14px);left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;width:min(560px,calc(100vw - 20px))}.td-build-menu{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.td-build{pointer-events:auto;display:flex;flex-direction:column;align-items:center;gap:1px;min-width:68px;min-height:var(--touch-min);padding:6px 8px;font:inherit;color:var(--text);background:var(--build-bg);border:1px solid var(--border-strong);border-radius:var(--radius-sm);cursor:pointer;transition:transform .1s var(--ease-out-expo),border-color .2s var(--ease-out-expo),background .2s var(--ease-out-expo)}@media (hover: hover){.td-build:hover{border-color:var(--border-hover);background:#3a1a68b3}}.td-build:active{transform:scale(.95)}.td-build-emoji{font-size:1.3rem}.td-build-name{font-size:.72rem;color:var(--text)}.td-build-cost{font-size:.66rem;color:var(--muted)}.td-build.td-selected{border-color:var(--node);background:#00e5ff29;box-shadow:0 0 16px -4px var(--node)}.td-build.td-unaffordable{opacity:.42}.game-btn.td-primary{background:var(--accent);border-color:transparent;color:var(--white);font-weight:600}@media (hover: hover){.game-btn.td-primary:hover{background:var(--accent-hover)}}.game-btn[hidden]{display:none}.td-modal{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#0d022199;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);pointer-events:auto}.td-modal[hidden]{display:none}.td-card{width:min(360px,calc(100vw - 40px));padding:1.75rem 1.5rem;border-radius:var(--radius-lg);background:var(--card);border:1px solid rgba(255,46,151,.4);box-shadow:0 0 50px -8px #b14aff80;text-align:center;animation:ug-pop .22s ease}.td-emoji{font-size:3rem}.td-card h2{margin:.25rem 0 .15rem;font-size:1.6rem;color:var(--bad)}.td-card p{margin:0 0 1.25rem;color:var(--muted)}.td-best{margin:-.75rem 0 1.25rem;font-size:.85rem;font-weight:600;color:var(--node)}.td-actions{display:flex;flex-direction:column;gap:.6rem}#tp-canvas{display:block;width:100vw;height:100dvh;touch-action:manipulation}.tp-hidden-input{position:fixed;top:0;left:0;width:1px;height:1px;padding:0;border:0;opacity:0;color:transparent;background:transparent;caret-color:transparent;pointer-events:none;z-index:var(--z-hidden)}.tp-stat{display:flex;flex-direction:column;align-items:center;min-width:62px;padding:0 8px}.tp-stat+.tp-stat{border-left:1px solid var(--border-mid)}.tp-buffer{min-width:120px}.tp-label{font-size:.62rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.tp-val{font-size:1.05rem;font-weight:700;color:var(--text)}.tp-buffer .tp-val{color:var(--node);font-family:SF Mono,Monaco,Cascadia Code,Consolas,monospace;letter-spacing:.04em}.skip-link{position:absolute;top:-100%;left:50%;transform:translate(-50%);padding:.75rem 1.5rem;background:var(--accent);color:var(--white);font-weight:600;border-radius:0 0 12px 12px;text-decoration:none;z-index:var(--z-overlay);transition:top .2s var(--ease-out-expo)}.skip-link:focus{top:0}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.game-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-color:var(--accent);box-shadow:0 12px 30px -12px var(--accent)}.game-btn:focus-visible,.ug-btn:focus-visible,.td-build:focus-visible{outline:2px solid var(--node);outline-offset:2px}.back-link:focus-visible{outline:2px solid var(--node);outline-offset:2px;border-color:var(--accent)}.game-card h2,.td-build-name,.ug-stat-val,.td-stat-val,.tp-val{overflow-wrap:break-word;min-width:0}.game-card p{overflow-wrap:break-word;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}@media (hover: hover){.game-card:hover:not(.disabled){transform:translateY(-4px);border-color:var(--accent);box-shadow:0 12px 30px -12px var(--accent)}}@media (max-width: 480px){#app{padding:calc(1.5rem + env(safe-area-inset-top,0px)) 1rem 3rem}.hub-header{margin-bottom:1.75rem}.game-grid{gap:1rem}.game-card{padding:1.25rem}.ug-bar{gap:10px;padding:6px 12px}.ug-stat-val{font-size:1rem}.ug-status{font-size:.78rem;padding-left:10px}.td-top{gap:6px;padding:5px 8px}.td-stat{min-width:50px;padding:0 4px}.td-stat-val{font-size:.88rem}.td-stat-label{font-size:.56rem}.td-build{min-width:58px;padding:5px 6px}.td-build-emoji{font-size:1.1rem}.td-build-name{font-size:.65rem}.td-build-cost{font-size:.6rem}.tp-bar{gap:6px;padding:5px 8px}.tp-stat{min-width:50px;padding:0 5px}.tp-buffer{min-width:80px}.tp-val{font-size:.92rem}.tp-label{font-size:.56rem}}@media (orientation: landscape){.back-link{left:max(12px,env(safe-area-inset-left,12px))}.td-bottom{width:min(560px,calc(100vw - env(safe-area-inset-left,10px) - env(safe-area-inset-right,10px) - 20px))}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}@media (prefers-reduced-transparency: reduce){.hud-bar{-webkit-backdrop-filter:none;backdrop-filter:none;background:var(--glass-bg-solid)}.back-link{-webkit-backdrop-filter:none;backdrop-filter:none}.onboard-hint{-webkit-backdrop-filter:none;backdrop-filter:none;background:#0d0221f2}.td-modal{-webkit-backdrop-filter:none;backdrop-filter:none;background:#0d0221eb}}