/* Only the end icons: one slim row with a single icon at each end, nothing else competing with the game.
   - Home / settings: logo at the left end, menu at the right end (counters live in the home screen).
   - Playing: the brand bar is gone; the level bar is just ← at the left end and ⚙ at the right end with "LEVEL n" between them.
   - Power-ups are big round icon-only buttons with a small count badge. */

/* top bar: icons only */
.appbar{height:60px;padding:0 14px}
.wordmark span{display:none}
.wordmark{padding:0}
.wordmark img{width:42px;height:42px}
.wallet{gap:0}
.round-btn{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-size:1.15rem;line-height:1}

/* counters now sit in the home hero */
.home-stats{display:flex;gap:9px;margin:14px 0 4px;flex-wrap:wrap}
.home-stats>span{height:38px;display:flex;align-items:center;gap:7px;padding:0 13px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.055);font-size:.8rem;color:var(--cyan)}
.home-stats b{color:#fff}
.home-stats small{color:#9da7cc;font-size:.7rem;font-weight:700}

/* while a level is open the brand bar steps aside */
body:has(#playScreen.active) .appbar{display:none}
.play-screen{padding-top:calc(env(safe-area-inset-top,0px) + 10px)}
.play-top{background:none;border:0;box-shadow:none;backdrop-filter:none;padding:0 2px;grid-template-columns:52px 1fr 52px}
.play-top .round-btn{width:50px;height:50px;border:1px solid rgba(255,255,255,.28);background:linear-gradient(180deg,rgba(48,43,125,.92),rgba(16,22,66,.94));box-shadow:0 5px 0 #11163d,0 10px 22px rgba(2,5,24,.45),inset 0 2px rgba(255,255,255,.22);font-size:1.3rem}
.level-title small{display:none}
.level-title strong{font-size:1rem;letter-spacing:.12em;text-shadow:0 2px 10px rgba(0,0,0,.6)}

/* power-ups: round, icon-only, count badge */
.powerbar{height:auto;max-width:none;display:flex;justify-content:center;gap:28px;margin-top:14px}
.powerbar button{width:68px;height:68px;border-radius:50%;padding:0;flex:none}
.powerbar span{display:none}
.powerbar i{font-size:1.7rem}
.powerbar b{right:-3px;top:auto;bottom:-3px;min-width:22px;height:22px;font-size:.7rem;background:#ff5c93;color:#fff;border:2px solid #0b1037}
.powerbar button:disabled b{background:#2a315e}
@media(max-width:560px){.powerbar{height:auto}.powerbar button{width:64px;height:64px}}

/* hints during a level appear under the end icons, never on top of the power-ups */
body:has(#playScreen.active) .toast{bottom:auto;top:calc(env(safe-area-inset-top,0px) + 74px)}

.float-tile{display:grid;place-items:center;padding:8px}.float-tile svg{width:100%;height:100%;filter:drop-shadow(0 4px 6px rgba(50,30,110,.35))}
