﻿@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@500;700;800&display=swap');
:root{font-family:Manrope,Arial,sans-serif;color:#313c3a;background:#f5f3ed;font-synthesis:none}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% 30%,#fbfaf6,#efede5)}
button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
button:focus-visible,canvas:focus-visible{outline:3px solid #df795c;outline-offset:4px}
/* The board keeps its 960:1000 ratio and always fits the viewport together with the score row. */
.game{width:min(100% - 20px,(100vh - 92px)*.96,(100dvh - 92px)*.96,1000px);margin:10px auto}
.hud{display:flex;gap:36px;align-items:flex-end;padding:0 6px 10px}
.score>span{font-size:10px;letter-spacing:1.4px;color:#92998d;font-weight:700}
.score b{display:block;font-size:28px;line-height:1.2;font-weight:500;letter-spacing:-1px;font-variant-numeric:tabular-nums}
.score.best b{color:#909b87}
.reset{margin-left:auto;border:1px solid #d8ddd1;border-radius:50%;width:38px;height:38px;background:transparent;color:#74816c;font-size:22px;line-height:1}
.reset:hover{background:#e5e9de}
.board-wrap{position:relative;border:1px solid #dfe3d7;border-radius:20px;background:#edf1e8;padding:6px;box-shadow:0 18px 50px #4d664318,inset 0 1px 0 #ffffff90}
canvas{display:block;width:100%;height:auto;aspect-ratio:960/1000;touch-action:none;border-radius:15px;cursor:grab}
canvas:active{cursor:grabbing}
.overlay{position:absolute;inset:6px;border-radius:15px;backdrop-filter:blur(10px);background:#f5f3edcc;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:22px;padding:20px}
.overlay[hidden]{display:none}
.overlay h2{font-size:34px;font-weight:500;letter-spacing:-1px;margin:0}
.primary{border:0;border-radius:12px;padding:13px 26px;background:#6b8a72;color:#fff;font-size:13px}
.primary:hover{background:#5d7c64}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
@media(max-width:600px){.hud{gap:24px}.score b{font-size:23px}.board-wrap{padding:3px;border-radius:15px}.overlay{inset:3px}}
/* Night laboratory */
:root{color-scheme:dark;color:#deebe7;background:#10191e}body{background:radial-gradient(ellipse at 50% 25%,#1c2e34,#0c1419)}.score>span{color:#849a99}.score.best b{color:#91aca6}.reset{border-color:#354b4e;color:#a7c9bd;background:#1b2a2f}.reset:hover{background:#2a4044}.board-wrap{background:#142328;border-color:#33494c;box-shadow:0 20px 60px #0005,inset 0 1px 0 #6d97932b}.overlay{background:#101d25df}.primary{background:#4b8d7c}.primary:hover{background:#64a58f}.game{width:min(100% - 20px,(100vh - 140px)*.96,(100dvh - 140px)*.96,1000px)}.mode-row{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 4px 10px;min-height:34px}.mode-switch{display:flex;padding:3px;border:1px solid #33494c;background:#111f25;border-radius:11px;gap:3px}.mode-switch button{border:0;background:transparent;color:#93a7a8;border-radius:8px;font-size:11px;padding:7px 13px}.mode-switch button[aria-pressed=true]{background:#344e50;color:#e4f3ed}.mode-switch #mode-chaos[aria-pressed=true]{background:#78443e;color:#ffe2ce}#rain-status{font-size:10px;color:#8ba49f;font-variant-numeric:tabular-nums}#rain-status.warning{color:#ffac8b}@media(max-width:440px){.mode-switch button{padding:7px 10px;font-size:10px}#rain-status{font-size:9px}.mode-row{gap:6px}.hud{gap:20px}}
/* Main menu */
[hidden]{display:none!important}
body:has(.main-menu:not([hidden])){align-items:flex-start;overflow-x:hidden}
.main-menu{position:relative;width:min(1180px,100% - 40px);min-width:0;margin:0 auto;padding:26px 0 48px}
.menu-aura{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.menu-aura i{position:absolute;border-radius:50%;filter:blur(90px);opacity:.38;animation:aura 22s ease-in-out infinite alternate}
.menu-aura i:nth-child(1){width:46vw;height:46vw;left:-10vw;top:-12vw;background:#2f8f7a}
.menu-aura i:nth-child(2){width:38vw;height:38vw;right:-8vw;top:18vh;background:#3d5fa0;animation-delay:-7s;opacity:.26}
.menu-aura i:nth-child(3){width:34vw;height:34vw;left:30vw;bottom:-18vw;background:#a5576b;animation-delay:-14s;opacity:.2}
@keyframes aura{to{transform:translate(6vw,4vh) scale(1.12)}}
.menu-top{display:flex;justify-content:space-between;align-items:center;gap:16px}
.menu-brand{display:flex;gap:12px;align-items:center;letter-spacing:6px;font-weight:800;font-size:18px;color:#d4efe4}
.menu-droplet{display:block;width:22px;height:28px;background:linear-gradient(130deg,#b4f0d8,#3f9c84);border-radius:60% 40% 55% 45%;transform:rotate(20deg);box-shadow:0 0 30px #7ee3ba55,inset 2px 3px 4px #ffffff70}
.hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:48px;align-items:center;margin-top:46px}
.hero-copy{min-width:0}
.menu-description{font-size:18px;line-height:1.65;color:#b4cbc6;max-width:500px;margin:0 0 28px}
.mode-cards{display:grid;gap:14px}
.mode-card{--accent:#8fe0bf;--glow:#59c9a033;position:relative;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;text-align:left;padding:18px 22px 18px 18px;border:1px solid #2f4b4c;background:linear-gradient(135deg,#1c3337e6,#132328e6);border-radius:20px;color:#d7ece4;overflow:hidden;transition:transform .2s,border-color .2s,box-shadow .2s}
.mode-card::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 0 50%,var(--glow),transparent 55%);opacity:.6;transition:opacity .2s;pointer-events:none}
.mode-card:hover,.mode-card:focus-visible{transform:translateY(-2px);border-color:var(--accent);box-shadow:0 14px 40px -12px var(--glow),0 0 0 1px var(--accent) inset}
.mode-card:hover::before{opacity:1}
.mode-icon{position:relative;display:grid;place-items:center;width:58px;height:62px;border-radius:52% 48% 50% 50%/60% 60% 40% 40%;background:radial-gradient(circle at 34% 30%,#ffffffa0,transparent 32%),linear-gradient(160deg,var(--accent),color-mix(in srgb,var(--accent) 45%,#0b1a1e));box-shadow:0 10px 24px -8px var(--glow),inset 0 -6px 12px #0003}
.mode-card .mode-symbol{font-size:26px;line-height:1;color:#0f2a26;font-weight:800}
.mode-text{position:relative;display:flex;flex-direction:column;gap:5px;min-width:0}
.mode-card strong{font-size:22px;font-weight:600;letter-spacing:-.5px}
.mode-text>span{font-size:13px;line-height:1.5;color:#9ab5b0}
.mode-card b{position:relative;font-size:12px;font-weight:700;color:var(--accent);white-space:nowrap;padding:10px 14px;border-radius:12px;background:#ffffff0d;border:1px solid #ffffff14}
.mode-card b span{display:inline-block;transition:transform .2s}
.mode-card:hover b span{transform:translateX(4px)}
.chaos-card{--accent:#f6b394;--glow:#ef835f40;background:linear-gradient(135deg,#352a2ee6,#1d2228e6);border-color:#5a4344}
.chaos-card .mode-symbol{color:#3a1a12}
.resume{display:inline-flex;align-items:center;gap:10px;margin-top:16px;border:1px solid #2f4b4c;border-radius:999px;background:#13232899;color:#bfe0d5;font-size:13px;padding:10px 18px;transition:border-color .2s,background .2s}
.resume:hover{border-color:#8fe0bf;background:#1b3036}
.resume>span:last-child{transition:transform .2s}.resume:hover>span:last-child{transform:translateX(3px)}
.resume-dot{width:8px;height:8px;border-radius:50%;background:#8fe0bf;box-shadow:0 0 10px #8fe0bf}
.drop-ladder{display:flex;align-items:center;gap:8px;margin-top:30px;flex-wrap:wrap}
.drop-ladder span{display:grid;place-items:center;min-width:34px;height:36px;padding:0 6px;border-radius:48% 52% 50% 50%/58% 58% 42% 42%;font-size:11px;font-weight:800;color:#fff;background:radial-gradient(circle at 32% 28%,#ffffff90,transparent 30%),linear-gradient(170deg,var(--c),var(--d));box-shadow:0 6px 14px -6px var(--d);text-shadow:0 1px 2px #0003;animation:bob 3.2s ease-in-out infinite}
.drop-ladder span:nth-child(2n){animation-delay:-1.1s}.drop-ladder span:nth-child(3n){animation-delay:-2s}
.drop-ladder i{font-style:normal;color:#6f8f8a}
.drop-ladder .goal{min-width:58px;font-size:12px;box-shadow:0 0 24px -2px #f3d97788}
@keyframes bob{50%{transform:translateY(-4px)}}
.hero-stage{position:relative;margin:0;border-radius:28px;padding:10px;background:linear-gradient(160deg,#ffffff14,#ffffff05);border:1px solid #ffffff1a;box-shadow:0 30px 80px -30px #000a,inset 0 1px 0 #ffffff22;backdrop-filter:blur(6px)}
.hero-stage canvas{aspect-ratio:960/720;cursor:default;border-radius:20px;background:radial-gradient(ellipse at 50% 100%,#1f3c43,#0f1d23 70%);touch-action:auto}
.hero-stage figcaption{position:absolute;left:24px;top:22px;display:flex;align-items:center;gap:8px;font-size:11px;color:#a9cbc1;padding:6px 12px;border-radius:999px;background:#0b161bb3;border:1px solid #ffffff12}
.live-dot{width:7px;height:7px;border-radius:50%;background:#ff8a6b;animation:pulse-red 1.6s infinite}
@keyframes pulse-red{50%{opacity:.35}}
.community{margin-top:64px;padding:28px;border-radius:26px;border:1px solid #ffffff12;background:linear-gradient(180deg,#132328cc,#0f1c21cc);backdrop-filter:blur(10px)}
.community-heading{display:flex;justify-content:flex-end}
.community-heading>span{font-size:11px;color:#6f8d89}
.community-totals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:22px 0}
.community-totals>div{display:flex;flex-direction:column;gap:4px;padding:18px 20px;border-radius:18px;background:#ffffff08;border:1px solid #ffffff0f}
.total-icon{font-size:14px;color:#8fe0bf}
.community-totals>div:nth-child(2) .total-icon{color:#8cc8ff}.community-totals>div:nth-child(3) .total-icon{color:#f3d977}
.community-totals b{font-size:32px;font-weight:600;letter-spacing:-1px;font-variant-numeric:tabular-nums;color:#eaf5f1}
.community-totals span:last-child{font-size:12px;color:#7f9c96}
.leaderboard-wrap{max-height:340px;overflow:auto;border-radius:14px}
.community table{width:100%;border-collapse:collapse;text-align:left;font-size:13px;white-space:nowrap}
.community th{position:sticky;top:0;background:#12222a;color:#6f8f8a;font-size:11px;font-weight:600;letter-spacing:.4px;text-transform:uppercase}
.community th,.community td{padding:12px 12px;border-bottom:1px solid #ffffff0c}
.community th:nth-child(n+3),.community td:nth-child(n+3){text-align:right}
.community td{color:#b1c9c2;font-variant-numeric:tabular-nums}
.community td:nth-child(2){color:#e0efe9;font-weight:600}
.community td:nth-child(4){color:#eaf5f1;font-weight:700}
.community tbody tr{transition:background .15s}.community tbody tr:hover{background:#ffffff06}
.community .your-result td{background:#7ee3ba12}.community .your-result td:nth-child(2){color:#9ff0d0}
.community td.empty{text-align:center;color:#7f9c96;padding:28px 12px}
.rank{width:44px;color:#6f8f8a!important;font-weight:700}
/* Top three ranks sit on a gold, silver and bronze disc. */
.medal-1{--m:#f3d977}.medal-2{--m:#cfdbe0}.medal-3{--m:#e3a77d}
.rank[class*=medal]{position:relative;z-index:0;color:#10181c!important;padding-left:15px!important}
.rank[class*=medal]::after{content:'';position:absolute;z-index:-1;left:6px;top:50%;width:26px;height:26px;transform:translateY(-50%);border-radius:50%;background:var(--m);box-shadow:0 0 14px -2px var(--m)}
.drop-chip{display:inline-grid;place-items:center;min-width:34px;height:24px;padding:0 8px;border-radius:12px;font-size:11px;font-weight:800;color:#fff;background:linear-gradient(170deg,var(--c),var(--d));text-shadow:0 1px 2px #0003}
.main-menu>*{animation:rise .7s cubic-bezier(.2,.7,.2,1) both}
.hero-copy>*{animation:rise .7s cubic-bezier(.2,.7,.2,1) both}
.hero-copy>:nth-child(2){animation-delay:.06s}.hero-copy>:nth-child(3){animation-delay:.12s}.hero-copy>:nth-child(4){animation-delay:.18s}.hero-copy>:nth-child(n+5){animation-delay:.24s}
.hero-stage{animation:rise .9s .15s cubic-bezier(.2,.7,.2,1) both}
@keyframes rise{from{opacity:0;transform:translateY(14px)}}
/* In-game header */
.back-menu{border:0;background:transparent;color:#aac8bf;font-size:11px;padding:10px 0}.mode-label{margin-left:auto;font-size:10px;color:#89aba0}.reset{margin-left:10px}
.game{width:min(100% - 20px,(100vh - 92px)*.96,(100dvh - 92px)*.96,1000px)}
@media(max-width:900px){.hero{grid-template-columns:1fr;gap:30px;margin-top:30px}.menu-description{max-width:none}}
@media(max-width:560px){.main-menu{width:calc(100% - 28px);padding-top:18px}.menu-description{font-size:16px}.mode-card{grid-template-columns:auto 1fr;padding:16px}.mode-card b{grid-column:1/-1;text-align:center}.mode-icon{width:48px;height:52px}.mode-card strong{font-size:19px}.mode-text>span{font-size:12px}.community{padding:18px 14px;margin-top:40px}.community-totals{gap:8px}.community-totals>div{padding:12px}.community-totals b{font-size:22px}.community-totals span:last-child{font-size:10px}.community th,.community td{padding:10px 7px;font-size:11px}.hud{gap:15px}.mode-label{font-size:8px}.back-menu{font-size:10px}}
@media(prefers-reduced-motion:reduce){.menu-aura i,.drop-ladder span,.live-dot,.main-menu>*,.hero-copy>*,.hero-stage{animation:none}}
.menu-brand{letter-spacing:2px;font-size:23px}.studio-footer{display:flex;justify-content:center;padding:30px 0 0;margin-top:28px;border-top:1px solid #31494a60}.studio-logo{display:inline-flex;gap:11px;align-items:center;color:#a7c5bc}.studio-logo span{font-size:22px;font-weight:800;letter-spacing:5px;line-height:1}.studio-logo svg{color:#8bc8b3}
.mode-card{grid-template-columns:minmax(0,1fr) auto}@media(max-width:560px){.mode-card{grid-template-columns:minmax(0,1fr)}}
.menu-brand{display:block;width:min(440px,100%);line-height:0}.game-logo{display:block;width:100%;height:auto;filter:drop-shadow(0 8px 20px #0004)}@media(max-width:560px){.menu-brand{width:min(350px,100%)}}
/* Platform integration */
.loading-screen{position:fixed;inset:0;z-index:100;background:#101d25;display:grid;place-items:center;color:#b7e8d4;font-size:18px}.player-controls{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}.player-controls button{border:1px solid #3c615d;border-radius:12px;background:#1b3338;color:#c9e5dc;padding:9px 12px;font-size:11px}#player-profile{display:flex;align-items:center;gap:8px;font-size:11px;color:#a4cbbd;max-width:180px}#player-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#player-avatar{width:28px;height:28px;border-radius:50%}.sync-notice{position:fixed;z-index:110;left:50%;transform:translateX(-50%);bottom:16px;width:min(520px,calc(100% - 24px));padding:14px 18px;border:1px solid #847456;border-radius:14px;background:#263638;color:#f0dfbc;font-size:12px;line-height:1.6;box-shadow:0 8px 30px #0006}.sync-notice button{margin-left:12px;background:#5a8a75;color:#fff;border:0;padding:8px 12px;border-radius:8px}.reward-button{border:1px solid #739e6b;border-radius:12px;padding:12px 20px;background:#2d493b;color:#d5f2c9;font-size:12px}#reward-status{max-width:260px;font-size:11px;color:#a9bbb2;text-align:center}button:disabled{opacity:.5;cursor:default}.game-logo{user-select:none;-webkit-user-drag:none}body{overscroll-behavior:none}.board-wrap{user-select:none;-webkit-user-select:none}@media(max-width:560px){.menu-top{flex-wrap:wrap}.player-controls{width:100%;justify-content:flex-start}.player-controls button{font-size:10px}.reward-button{font-size:11px}.overlay h2{font-size:26px}}
/* Comfortable touch play and safe-area layouts */
.play-tools{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;margin-top:10px;padding:0 3px}.play-tools button{min-height:44px;min-width:86px;padding:10px 12px;background:#1b3036;border:1px solid #34534f;border-radius:13px;color:#bddcd0;font-size:12px;touch-action:manipulation}.aim-feedback{text-align:center;min-width:0;color:#8daea2;font-size:10px;line-height:1.5}.power-track{height:4px;margin:4px auto 0;background:#2d4548;border-radius:4px;max-width:140px;overflow:hidden}.power-track i{display:block;height:100%;width:0;background:linear-gradient(90deg,#8bd9c0,#f2c38e);border-radius:4px}.game{width:min(calc(100% - 20px),calc((100vh - 150px - env(safe-area-inset-top) - env(safe-area-inset-bottom))*.96),calc((100dvh - 150px - env(safe-area-inset-top) - env(safe-area-inset-bottom))*.96),1000px)}.back-menu,.reset,.player-controls button{min-height:44px;min-width:44px;touch-action:manipulation}.reset{width:44px;height:44px}.resume{min-height:48px;touch-action:manipulation}.primary,.reward-button{min-height:48px;touch-action:manipulation}.hud{min-width:0}.hud .score{min-width:0}.score b{white-space:nowrap}.leaderboard-wrap{-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}.main-menu{padding-top:max(22px,env(safe-area-inset-top));padding-bottom:max(30px,env(safe-area-inset-bottom))}body:has(#play-screen:not([hidden])){padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);overflow:hidden}#board{touch-action:none;-webkit-touch-callout:none}.sync-notice{bottom:max(16px,env(safe-area-inset-bottom))}
@media(max-width:600px){.main-menu{width:calc(100% - 24px);padding-top:max(16px,env(safe-area-inset-top))}.menu-top{gap:12px}.menu-brand{width:min(320px,100%);margin:auto}.player-controls{justify-content:center}.menu-description{font-size:14px;line-height:1.6;margin-bottom:20px}.hero{margin-top:24px;gap:0}.hero-stage{display:none}.mode-card{padding:17px;gap:12px;touch-action:manipulation}.mode-text>span{font-size:13px}.mode-card b{padding:12px 14px;font-size:12px}.resume{display:flex;justify-content:center;width:100%;padding:12px 14px;font-size:12px}.drop-ladder{gap:7px;margin-top:24px;justify-content:center}.community{margin-top:30px;padding:16px 10px}.community-totals{gap:6px}.community-totals>div{padding:12px 8px}.community-totals b{font-size:24px}.community-totals span:last-child{font-size:10px}.community th,.community td{font-size:11px;padding:12px 8px}.game{width:min(calc(100% - 12px),calc((100vh - 144px - env(safe-area-inset-top) - env(safe-area-inset-bottom))*.96),calc((100dvh - 144px - env(safe-area-inset-top) - env(safe-area-inset-bottom))*.96));margin:6px auto}.hud{display:grid;grid-template-columns:44px minmax(0,1fr) minmax(0,1fr) 44px;align-items:center;gap:8px;padding:0 4px 8px}.hud .back-menu{font-size:10px;text-align:left;padding:7px 0}.hud .score>span{font-size:8px;letter-spacing:.8px}.hud .score b{font-size:clamp(17px,5vw,24px);letter-spacing:-.6px}.hud .reset{margin:0}.hud .mode-label{grid-row:2;grid-column:1/-1;margin:0;text-align:center;font-size:9px;line-height:1}.hud .reset{grid-row:1;grid-column:4}.play-tools{gap:7px;margin-top:8px}.play-tools button{font-size:11px;min-width:78px;min-height:46px;padding:9px}.aim-feedback{font-size:10px}.overlay{gap:16px;padding:16px}.overlay .primary,.overlay .reward-button{width:min(100%,260px);font-size:12px}.overlay h2{font-size:24px;text-align:center}.menu-aura i{filter:blur(50px);animation:none}.main-menu>*,.hero-copy>*,.hero-stage{animation-duration:.25s}.board-wrap{box-shadow:0 8px 24px #0003}}
@media(orientation:landscape) and (max-height:500px) and (max-width:1100px){.game{display:grid;grid-template-columns:156px minmax(0,1fr);align-items:start;gap:10px;width:min(calc(100% - 20px),calc((100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom))*.96 + 166px));margin:5px auto}.hud{grid-column:1;grid-row:1;display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0}.hud .back-menu{grid-column:1/-1;text-align:left}.hud .score b{font-size:20px}.hud .mode-label{grid-column:1;grid-row:auto;text-align:left}.hud .reset{grid-column:2;grid-row:auto;justify-self:end}.board-wrap{grid-column:2;grid-row:1/3}.play-tools{grid-column:1;grid-row:2;display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:0;padding:0}.play-tools button{min-width:0;font-size:10px;padding:6px;min-height:44px}.aim-feedback{grid-column:1/-1;grid-row:2;font-size:10px;margin-top:4px}.overlay h2{font-size:21px}.overlay .primary,.overlay .reward-button{font-size:10px;min-height:44px;padding:8px}.overlay{gap:10px}.main-menu{margin-top:0}}
@media(prefers-reduced-motion:reduce){.mode-card,.resume{transition:none}}

/* Pereliv: plum glass theme, matched to the supplied #190b26 swatch. */
:root{--page:#190b26;--panel:#261435;--panel-raised:#321e45;--line:#553b6b;--ink:#f4eafa;--muted:#b8a0cc;--accent:#d3adff;color:var(--ink);background:var(--page);accent-color:var(--accent)}
body{background:var(--page)}
button:focus-visible,canvas:focus-visible{outline-color:var(--accent)}
.menu-aura{display:none}
.menu-brand,.studio-logo,.studio-logo svg{color:var(--accent)}
.menu-description,.mode-text>span,.community td,.aim-feedback,#player-profile,#reward-status{color:var(--muted)}
.mode-card{--accent:#d3adff;--glow:#b77cf333;background:linear-gradient(135deg,#321d45,#241231);border-color:var(--line);color:var(--ink)}
.chaos-card{--accent:#f0a4d2;--glow:#de70b730;background:linear-gradient(135deg,#3b203f,#29132f);border-color:#674269}
.mode-card b{background:#e4bcff0b;border-color:#e4bcff24}
.resume,.play-tools button,.player-controls button{background:var(--panel);border-color:var(--line);color:#e4cdf5}
.resume:hover,.play-tools button:hover,.player-controls button:hover{background:var(--panel-raised);border-color:#a779ca}
.resume-dot{background:var(--accent);box-shadow:0 0 10px #c899ef66}
.hero-stage{background:linear-gradient(160deg,#382048,#251231);border-color:var(--line);box-shadow:0 24px 70px -30px #09030faa,inset 0 1px 0 #edcaff19}
.hero-stage canvas{background:radial-gradient(ellipse at 50% 100%,#352045,#190b26 75%)}
.community{background:linear-gradient(180deg,#281537,#21102f);border-color:#70488c55}
.community-totals>div{background:#d5a8ff08;border-color:#d5a8ff16}
.community-totals b,.community td:nth-child(2),.community td:nth-child(4){color:var(--ink)}
.community-heading>span,.community-totals span:last-child,.community th,.community td.empty,.drop-ladder i{color:var(--muted)}
.community th{background:#281537}
.community .your-result td{background:#c593f015}.community .your-result td:nth-child(2){color:#e4bcff}
.rank{color:var(--muted)!important}
.total-icon{color:var(--accent)}
.studio-footer{border-color:#69458655}
.loading-screen{background:var(--page);color:var(--accent)}
.board-wrap{background:#21102f;border-color:var(--line);box-shadow:0 20px 60px #09030f66,inset 0 1px 0 #dcb2ff22}
.overlay{background:#190b26e8}
.primary,.sync-notice button{background:#8454ac;color:#fff}.primary:hover,.sync-notice button:hover{background:#9865bf}
.reward-button{background:#392044;border-color:#9563af;color:#f1d6ff}
.sync-notice{background:#321d40;border-color:#8f629b;color:#f1ddfa}
.back-menu,.mode-label{color:var(--muted)}
.score>span{color:#b299c5}.score.best b{color:#d3adff}
.play-tools .reset{width:auto;height:auto;margin:0;border-radius:13px;font-size:12px;line-height:1.4;white-space:nowrap}
.power-track{background:#4a2d60}.power-track i{background:linear-gradient(90deg,#bf92ef,#f0afd1)}
@media(max-width:600px){.hud{grid-template-columns:44px minmax(0,1fr) minmax(0,1fr)}.play-tools .reset{font-size:11px;padding:9px}.play-tools{grid-template-columns:auto minmax(0,1fr) auto}.board-wrap{box-shadow:0 8px 24px #09030f55}}
@media(orientation:landscape) and (max-height:500px) and (max-width:1100px){.hud{grid-template-columns:1fr 1fr}.hud .mode-label{grid-column:1/-1}.play-tools{grid-template-columns:1fr 1fr}.play-tools .reset{font-size:10px;padding:6px}}

/* Hide the page scrollbar while keeping wheel, touch and keyboard scrolling. */
html,body{scrollbar-width:none}
html::-webkit-scrollbar,body::-webkit-scrollbar{display:none;width:0;height:0}

/* Optional ad rewards stay below the vessel, away from aiming gestures. */
.reward-tools{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:8px;padding:0 3px}
.reward-tools button{min-height:44px;border:1px solid #71508c;border-radius:12px;background:#321d45;color:#ead4ff;font:inherit;font-size:11px;padding:8px;touch-action:manipulation}
.reward-tools button:hover:not(:disabled){background:#462859;border-color:#c496ec}
.reward-tools button:disabled{opacity:.4;cursor:default}
#bonus-status{grid-column:1/-1;color:#b8a0cc;font-size:10px;line-height:1.4;min-height:28px;text-align:center}
#board.choosing-removal{cursor:crosshair;outline:2px solid #c496ec;outline-offset:-3px}
.game:has(.reward-tools:not([hidden])){width:min(calc(100% - 20px),calc((100vh - 240px - env(safe-area-inset-top) - env(safe-area-inset-bottom))*.96),calc((100dvh - 240px - env(safe-area-inset-top) - env(safe-area-inset-bottom))*.96),1000px)}
@media(max-width:600px){.reward-tools{gap:5px;margin-top:6px}.reward-tools button{font-size:10px;padding:6px}.game:has(.reward-tools:not([hidden])){width:min(calc(100% - 12px),calc((100vh - 234px - env(safe-area-inset-top) - env(safe-area-inset-bottom))*.96),calc((100dvh - 234px - env(safe-area-inset-top) - env(safe-area-inset-bottom))*.96))}}
@media(orientation:landscape) and (max-height:500px) and (max-width:1100px){.game:has(.reward-tools:not([hidden])){width:min(calc(100% - 20px),calc((100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom))*.96 + 166px))}.reward-tools{grid-column:1;grid-row:3;grid-template-columns:1fr;margin:0;padding:0}.reward-tools button{font-size:10px}.board-wrap{grid-row:1/4}#bonus-status{min-height:28px;font-size:9px}}

@media(orientation:landscape) and (max-height:350px) and (max-width:1100px){.game{gap:6px}.hud{gap:5px}.play-tools .aim-feedback{display:none}.reward-tools{gap:4px}#bonus-status{min-height:0;line-height:1.2}}

/* Opening screen: progress follows SDK, profile, save and artwork readiness. */
.loading-screen{padding:24px;transition:opacity .2s ease .1s}
.loading-card{width:min(360px,100%);text-align:center}
.loading-logo{display:block;width:min(320px,100%);height:auto;margin:0 auto 32px;filter:drop-shadow(0 8px 24px #a46bdf22);user-select:none;-webkit-user-drag:none}
.loading-caption{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 2px 12px;color:#cdb5df;font-size:12px;line-height:1.5;text-align:left}
#loading-percent{color:#f2dfff;font-size:13px;font-weight:700;font-variant-numeric:tabular-nums}
.loading-track{height:12px;padding:2px;overflow:hidden;background:#291438;border:1px solid #64417d;border-radius:999px;box-shadow:inset 0 2px 5px #10071966}
.loading-track i{display:block;position:relative;height:100%;border-radius:999px;background:linear-gradient(90deg,#9666cb,#ce9bf5,#f0b3da);box-shadow:0 0 14px #c38ff055;transition:width .24s ease;overflow:hidden}
.loading-track i::after{content:'';position:absolute;inset:0;background:linear-gradient(100deg,transparent,#fff5,transparent);transform:translateX(-100%);animation:loading-shimmer 1.8s ease-in-out infinite}
@keyframes loading-shimmer{to{transform:translateX(100%)}}
.loading-complete{opacity:0;pointer-events:none}
.loading-error .loading-track i{background:#bc729d}.loading-error .loading-track i::after{animation:none}
#loading-retry{margin-top:22px}
@media(max-width:400px){.loading-logo{width:260px;margin-bottom:26px}.loading-caption{font-size:11px}}
@media(prefers-reduced-motion:reduce){.loading-screen,.loading-track i{transition:none}.loading-track i::after{animation:none}}
