/* ALEXO STARS — static deep-space setting; independent object and motion layers. */
:root{font-family:system-ui,-apple-system,'Segoe UI',sans-serif;--lime:#89ebff;--muted:#a6b4d1;background:#070b22}
body{background:radial-gradient(ellipse at 78% 28%,#27306b55,transparent 52%),radial-gradient(ellipse at 10% 76%,#472f6655,transparent 50%),#070b22}
body::before{background:radial-gradient(circle at 12% 22%,#ffffffc0 0 1px,transparent 2px),radial-gradient(circle at 37% 13%,#91caff90 0 1px,transparent 2px),radial-gradient(circle at 72% 80%,#ffffffa0 0 1px,transparent 2px),radial-gradient(circle at 85% 48%,#8ef4ff90 0 1px,transparent 2px);background-size:210px 251px,287px 301px,163px 207px,373px 229px;opacity:.6;transform:none;animation:none}
body::after{background:radial-gradient(circle at 94% 30%,#454a8070 0 52px,#8c9bda22 53px 54px,transparent 55px),radial-gradient(ellipse at 6% 82%,#334f6755 0 76px,transparent 78px);opacity:.6;transform:none;animation:none}
.app{max-width:1190px;padding:20px 38px 24px}.game-layout{padding:16px 0 26px;gap:64px;align-items:start;grid-template-columns:.87fr 1.13fr;min-height:0}
.intro{padding-top:6px}.intro-headline{color:#eef7ff;font:800 clamp(38px,5vw,62px)/1.07 system-ui,sans-serif;letter-spacing:-2.5px;margin:20px 0 24px}.intro-headline em{color:#8eecff}.description{font-size:17px;line-height:1.6}.how{margin:25px 0;gap:13px 12px}.how p{color:#b6c5df}.mode{padding-top:19px}.mode strong{color:#e3edff}.mode p{line-height:1.5}.intro-support{font-size:13px;border-radius:14px;background:linear-gradient(135deg,#438ea522,#ad7be322);border-color:#91d7ff42;max-width:340px;margin-bottom:18px;color:#ecf5ff}
.play{max-width:530px}.play-top{--panel-width:clamp(118px,30%,166px);display:flex;gap:12px;align-items:center;justify-content:space-between}.play-top .play-brand{flex:1;width:auto;max-width:calc(100% - var(--panel-width) - 12px)}
.stars-logo{width:100%;position:relative;line-height:.85;filter:drop-shadow(0 5px 0 #020615) drop-shadow(0 0 18px #8cdcff25);user-select:none;font-family:system-ui,sans-serif;font-weight:950;font-style:italic;letter-spacing:-3px;padding:5px 0 9px}.stars-logo>span{display:block;color:#dfeeff;font-size:clamp(20px,3.2vw,31px);letter-spacing:6px;margin:0 0 8px 7px}.stars-logo>strong{display:block;width:max-content;font-size:clamp(48px,6.6vw,75px);color:#8eeeff;text-shadow:1px 1px 0 white,3px 3px 0 #2654b1,5px 5px 0 #131d59}.stars-logo i{font-style:normal;color:#ffdf7c;font-size:.45em;position:absolute;top:2px;right:10%;text-shadow:0 0 18px #ffca4e80}
.level-side{background:linear-gradient(150deg,#536c9a55,#172647 55%,#0b1530);border:1px solid #849fc775;border-top-color:#c8e7ff8c;border-radius:15px;padding:10px 12px;box-shadow:inset 0 1px 0 #ffffff30,inset 0 -3px 6px #02081690,0 6px 0 #03091c,0 10px 22px #0005;min-width:0}.play-hud .level-heading>span#level-label{background:none;box-shadow:none;border:none;color:#b9d7ff;letter-spacing:1px;padding:0;text-align:left;font:700 13px/1.2 system-ui,sans-serif}.hud-score{margin-top:7px}.hud-score>span{font:600 11px/1.2 system-ui,sans-serif;letter-spacing:.4px;color:#bdcce4}.hud-score #score{font:800 25px/1.2 system-ui,sans-serif;color:#fff3b1;white-space:nowrap;display:block;max-width:100%;font-variant-numeric:tabular-nums;text-shadow:0 1px 6px #ffe88b25}
.play-hud .goal{padding:12px 0 2px;margin-top:10px}.play-hud .goal>div{font:500 13px/1.4 system-ui,sans-serif;align-items:flex-start;color:#d5e4fa}.goal #goal-text{min-width:0}.goal strong{color:#b9f6ff;font-variant-numeric:tabular-nums}.goal progress{height:14px!important;border:1px solid #758ec060!important;box-shadow:inset 0 3px 5px #0008,0 1px 0 #b7dfff35;background:#0d1732!important;border-radius:12px!important}.goal progress::-webkit-progress-bar{background:linear-gradient(#050f26,#19284b)}.goal progress::-webkit-progress-value{background:linear-gradient(#e5ffff 0,#9cf8ff 18%,#45bcdf 55%,#217aa8 100%);box-shadow:inset 0 1px 0 #fff,0 0 12px #4dc8ff}.goal progress::-moz-progress-bar{background:linear-gradient(#e5ffff,#45bcdf,#217aa8)}
.board-wrap{background:linear-gradient(155deg,#6688b466,#172448 22%,#0a1431 70%,#3d4c7944);border:1px solid #7fa6d976;border-top:2px solid #b8dcff66;border-radius:24px;padding:13px;box-shadow:inset 0 1px 0 #e2f0ff40,inset 0 -5px 12px #0009,0 10px 0 #020719,0 20px 45px #0006;isolation:isolate}.board,.beginning .board{background:linear-gradient(135deg,#070f26,#101a36);border:1px solid #718bba26;border-radius:14px;gap:5px;padding:7px;box-shadow:inset 0 3px 12px #0005}.board .cell{border-radius:10px;background:#7392c209;box-shadow:inset 0 0 0 1px #adcfff07;overflow:visible}.board .cell:hover{background:#93c7ff16}
.board .stone,.beginning .board .stone{inset:0;border:0;border-radius:0;outline:none;background:var(--object-image) center/contain no-repeat;box-shadow:none;animation:stellar-drift 4.8s ease-in-out var(--bubble-delay,0s) infinite;transform:none;filter:drop-shadow(0 3px 3px #0008);isolation:auto}
.board .stone::before,.board .stone::after{display:none}.board .symbol{display:none}.board .cell[data-kind='0']{--object-image:var(--world-object-0,url('assets/water.svg'))}.board .cell[data-kind='1']{--object-image:var(--world-object-1,url('assets/lava.svg'))}.board .cell[data-kind='2']{--object-image:var(--world-object-2,url('assets/rings.svg'))}.board .cell[data-kind='3']{--object-image:var(--world-object-3,url('assets/sun.svg'))}.board .cell[data-kind='4']{--object-image:var(--world-object-4,url('assets/ocean.svg'))}
.board .cell.selected .stone,.board .cell.hinted .stone{outline:none;filter:drop-shadow(0 0 5px white) drop-shadow(0 0 10px var(--color));animation:stellar-drift 4.8s ease-in-out var(--bubble-delay,0s) infinite}.board .cell.hinted{box-shadow:inset 0 0 0 2px #e5ffffbb,0 0 12px #a6eeff3a}.board .cell.selected{box-shadow:inset 0 0 0 2px white;background:#c1e4ff16}
.board .cell:is(.drop,.new-bubble,.swap):not(.pop):not(.chain-landed):not(.power-converting) .stone{animation:stellar-drift 4.8s ease-in-out var(--bubble-delay,0s) infinite;transform:none}.board .cell.drop .bubble-motion{animation:bubble-settle .35s cubic-bezier(.2,.7,.4,1) both}.board .cell.new-bubble .bubble-motion{animation:star-arrival .32s ease-out both}.board .cell.swap .bubble-motion{transform:translate(var(--sx),var(--sy));transition:transform .18s ease}
.board .cell[class*='power-'] .stone{border:0;outline:none;box-shadow:none;filter:drop-shadow(0 0 8px var(--color))}.board .cell[class*='power-'] .symbol{display:grid;place-items:center;position:absolute;inset:26%;font:900 clamp(16px,3vw,27px)/1 system-ui,sans-serif;color:white;border-radius:50%;background:#102249b0;border:1px solid #ffffffaf;text-shadow:0 0 8px white}.board .cell.power-bomb .stone{background:var(--world-nova,url('assets/nova.svg')) center/contain no-repeat}.board .cell.iced{background:linear-gradient(135deg,#a8dfff50,#78aaff10);border:1px solid #b9eaff88}.board .cell.iced::after{z-index:2}
.board .cell.chain-landed:not(.pop) .stone{animation:stellar-charge .3s ease-out both}.board .cell.power-converting:not(.pop) .stone{animation:stellar-charge .28s ease-out both}.board .cell.pop .bubble-motion{animation:none!important;transition:none!important;transform:none}.board .cell.pop .stone{animation:stellar-shatter .44s ease-out forwards!important;outline:none}.particle{border:0;border-radius:0;clip-path:polygon(50% 0,100% 75%,20% 100%,0 35%);background:linear-gradient(135deg,#fff,var(--color) 45%,var(--color));box-shadow:none;filter:drop-shadow(0 0 3px var(--color));animation:star-shards .72s ease-out forwards}.bubble-rupture{border:2px solid #e7fbff;border-radius:50%;box-shadow:0 0 12px var(--color);animation:bubble-rupture .4s ease-out .16s both}
.combo.show{font-family:system-ui,sans-serif;max-width:95%;font-size:clamp(20px,3vw,31px);color:#fff2b5;text-shadow:0 2px 0 #171336,0 0 16px #ffa252;overflow-wrap:anywhere}.flow-win,.support-break{background:linear-gradient(145deg,#12223ff4,#0a1129f7)}.flow-win strong{font-family:system-ui,sans-serif;color:#a9f3ff}.flow-star,.support-star{color:#ffdc7d}.level-splash{background:radial-gradient(ellipse,#132754e8,#080d249c);border-radius:18px}.level-splash strong{color:#dbfaff;text-shadow:0 0 28px #41cfff}.button{font-family:system-ui,sans-serif}.button.primary,.flow-win .button{background:linear-gradient(#d2faff,#86ddf7);color:#10223e;box-shadow:0 4px 0 #245c7c}.button.primary:hover,.flow-win .button:hover{background:#dffaff}.actions .button{border-color:#6f91bd55;border-radius:13px;background:#17243a;color:#dcf1ff}.actions .secondary{color:#aaf2ff;background:#22425555}.stats span{white-space:normal;line-height:1.3;letter-spacing:.5px}.stats strong{color:#eef7ff;font-family:system-ui,sans-serif}.stats>div{min-width:0}#status{color:#a9bbd8;font:400 13px/1.5 system-ui,sans-serif;min-height:39px}.header-tools{flex-wrap:wrap;justify-content:flex-end}.language-control select{max-width:128px}.header-tools .icon-button,.level-menu{border-color:#728ab440;background:#11213b80;color:#b8d7f3}.level-menu{color:#acfbff}dialog{background:linear-gradient(145deg,#1b3154,#0d1730);border-color:#769acc66}dialog h2{font-family:system-ui,sans-serif}.chapter-nav option{background:#11213c}.level-tile.current{border-color:#a7efff}.level-tile.completed{background:#66d3f818;border-color:#86dcf83a}footer{font-size:10px;letter-spacing:1px;opacity:.7}.support-card h3{font-family:system-ui,sans-serif}
@keyframes stellar-drift{0%,100%{transform:translateY(1px) rotate(-3deg)}50%{transform:translateY(-2px) rotate(3deg)}}
@keyframes stellar-charge{50%{transform:scale(1.12);filter:brightness(1.6) drop-shadow(0 0 10px var(--color))}}
@keyframes star-arrival{from{transform:translateY(-8px) scale(.2);opacity:.3}70%{transform:scale(1.06);opacity:1}to{transform:none;opacity:1}}
@keyframes stellar-shatter{0%{transform:scale(1);opacity:1}18%{transform:scale(.86);filter:brightness(1.3)}34%{transform:scale(1.17);filter:brightness(2.8) drop-shadow(0 0 12px var(--color));opacity:1}42%{transform:scale(1.23);opacity:0}100%{transform:scale(1.23);opacity:0}}
@keyframes star-shards{0%{opacity:0;transform:scale(.3)}20%{opacity:1}to{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(160deg) scale(.25)}}
@media(max-width:740px){.app{padding:10px 12px 18px}.game-layout{grid-template-columns:1fr;gap:13px;padding:10px 0 20px}.intro{display:block;padding:0;text-align:center}.intro>.eyebrow,.intro>.description,.intro>.how,.intro>.mode{display:none}.intro-headline{font-size:20px;letter-spacing:-.4px;line-height:1.2;margin:0 0 8px}.intro-headline br{display:none}.intro-headline em{margin-left:.2em}.intro-support{margin:0 auto;max-width:480px;font-size:11px;padding:7px 12px;line-height:1.4}.play-top{gap:10px;--panel-width:118px}.stars-logo>span{font-size:20px;letter-spacing:4px;margin:0 0 6px 5px}.stars-logo>strong{font-size:clamp(43px,12vw,63px)}.stars-logo i{right:4%;top:2px}.level-side{padding:8px 10px}.hud-score #score{font-size:21px}.board-wrap{padding:9px;border-radius:20px}.board,.board-wrap.beginning .board{gap:4px;padding:5px}.play-hud{margin-bottom:10px}.play-hud .goal>div{font-size:12px}.play-hud .goal{margin-top:6px;padding-top:9px}.stats{padding-top:14px}.stats span{font-size:10px}.stats strong{font-size:18px}.game-focus .intro{display:none}.game-focus .game-layout{padding-top:12px}.language-control select{max-width:103px}.combo.show{font-size:clamp(18px,5.5vw,25px)}}
@media(prefers-reduced-motion:reduce){.board .stone,.board .cell:is(.drop,.new-bubble,.swap,.hinted,.selected,.chain-landed,.power-converting) .stone{animation:none!important}.board .bubble-motion{animation:none!important;transition:none!important}.board .cell.pop .stone{animation:none!important;opacity:0!important}.particle,.bubble-rupture,.shockwave{display:none!important}}
.goal>div{flex-wrap:wrap}.goal #goal-value{margin-left:auto;max-width:100%;white-space:normal;text-align:right;line-height:1.35}#goal-text{flex:1 1 150px}.goal progress{clear:both}

.sound-preview{margin:20px 0;padding:15px;border:1px solid #8de2ff33;border-radius:14px;background:#11264280}.sound-preview>strong{font-size:15px;color:#b7f5ff}.sound-preview>p{font-size:12px;line-height:1.5;color:#b6c7df}.sound-preview>div{display:flex;flex-wrap:wrap;gap:7px}.sound-preview .button{padding:9px 11px;font-size:12px;border-radius:10px;background:#1b3b5a;color:#e6f9ff;border:1px solid #8eb5d34a}
/* Faceted crystal stars: inner light stays separate from outer fall/swap motion. */
.board .cell.power-bomb{--object-image:var(--world-nova,url('assets/nova.svg'))}
.board .cell:is([data-kind='0'],[data-kind='3'],.power-bomb) .stone{filter:drop-shadow(0 3px 3px #0009) drop-shadow(0 0 3px color-mix(in srgb,var(--color) 35%,transparent))}
.board .cell:is([data-kind='3'],.power-bomb) .stone::before{display:block;content:'';position:absolute;inset:33%;width:auto;height:auto;border:0;border-radius:50%;background:radial-gradient(circle,#fff9,transparent 66%);box-shadow:none;transform:none;pointer-events:none;animation:crystal-core 4.8s ease-in-out var(--bubble-delay,0s) infinite}
.board .cell:not(.power-row):not(.power-column):is([data-kind='0'],[data-kind='3'],.power-bomb) .stone::after{display:block;content:'';position:absolute;inset:0;width:auto;height:auto;border:0;border-radius:0;box-shadow:none;transform:none;background:linear-gradient(110deg,transparent 42%,#ffffffb3 49%,#fff3 53%,transparent 59%);background-size:300% 100%;mask-image:var(--object-image);mask-size:contain;mask-position:center;mask-repeat:no-repeat;-webkit-mask-image:var(--object-image);-webkit-mask-size:contain;-webkit-mask-position:center;-webkit-mask-repeat:no-repeat;pointer-events:none;animation:crystal-reflection 6.2s ease-in-out var(--bubble-delay,0s) infinite}
.board .cell.power-bomb .stone::before{inset:14%;border:1px solid #c9f7ffa8;background:none;box-shadow:0 0 6px #a3edff44;animation:nova-ring 5.5s ease-in-out var(--bubble-delay,0s) infinite}
.board .cell.pop .stone::before,.board .cell.pop .stone::after{animation:none!important}
.particle{clip-path:polygon(50% 0,95% 28%,78% 88%,32% 100%,0 44%);background:linear-gradient(125deg,#fff 0 14%,var(--color) 17% 60%,var(--dark,var(--color)) 63%);filter:drop-shadow(0 0 3px var(--color))}
.particle.crystal-trail{width:calc(var(--bubble-size,8px)*1.6);clip-path:polygon(0 48%,72% 0,100% 45%,76% 100%);filter:drop-shadow(-5px 0 4px var(--color)) drop-shadow(0 0 5px var(--color))}
@keyframes crystal-core{0%,100%{opacity:.35;transform:scale(.8)}50%{opacity:.8;transform:scale(1.1)}}
@keyframes crystal-reflection{0%,12%{background-position:140% 0;opacity:0}20%{opacity:.55}42%{background-position:-40% 0;opacity:0}100%{background-position:-40% 0;opacity:0}}
@keyframes nova-ring{0%,100%{transform:rotate(-25deg) scaleY(.62);opacity:.65}50%{transform:rotate(25deg) scaleY(.75);opacity:.9}}
@media(prefers-reduced-motion:reduce){.board .stone::before,.board .stone::after{animation:none!important}.board .cell .stone::after{opacity:0}.board .cell .stone::before{opacity:.4}}
/* World atmosphere stays static; only the brief in-board reveal animates. */
:root{--lime:var(--chapter-accent,#93edff)}
body{background:radial-gradient(ellipse at 78% 28%,color-mix(in srgb,var(--chapter-halo,#194169) 45%,transparent),transparent 60%),var(--chapter-background,#071329)}
body::after{background:var(--world-atmosphere) center/cover no-repeat;opacity:.5;transform:none;animation:none}
.board-wrap{background:linear-gradient(150deg,color-mix(in srgb,var(--chapter-frame,#194169) 75%,#789aba),#172448 25%,#0a1431 75%);border-color:color-mix(in srgb,var(--chapter-accent) 45%,transparent)}
.world-name{font-size:11px;line-height:1.3;text-transform:uppercase;letter-spacing:1.2px;color:var(--chapter-accent);margin:8px 0 0;font-weight:750}
.play-hud .goal{margin-top:2px}.level-splash.world-reveal{background:radial-gradient(ellipse,color-mix(in srgb,var(--chapter-halo) 80%,#12244a),#080d24ee);overflow:hidden}.level-splash.world-reveal::before{content:'';position:absolute;width:75%;aspect-ratio:1;left:12.5%;top:8%;border:1px solid var(--chapter-accent);border-radius:50%;opacity:.3;animation:world-orbit 1.7s ease-out both;pointer-events:none}.level-splash.world-reveal>*{position:relative;z-index:1}.world-reveal .splash-kicker{color:var(--chapter-accent);max-width:90%;font-size:clamp(14px,3vw,22px);letter-spacing:.4px;font-weight:800;line-height:1.3}
@keyframes world-orbit{from{transform:scale(.2) rotate(-25deg);opacity:0}40%{opacity:.5}to{transform:scale(1.4) rotate(25deg);opacity:0}}
@media(max-width:740px){.world-name{font-size:10px;letter-spacing:.6px}}
@media(prefers-reduced-motion:reduce){.level-splash.world-reveal::before{animation:none;opacity:.12;transform:none}}
/* The opening world deliberately uses clear, simple symbols. */
body[data-chapter='1'] .board .cell:not(.power-bomb) .stone::before,body[data-chapter='1'] .board .cell:not(.power-bomb) .stone::after{display:none}
/* The decorative rim never changes cell geometry or receives input. */
.board-wrap::before{content:'';position:absolute;inset:0;z-index:3;border-radius:inherit;background:var(--world-frame) center/100% 100% no-repeat;pointer-events:none;opacity:1;filter:none}
.board-wrap.impact{animation:none}
.board-wrap.impact::before{animation:world-frame-pulse .6s ease-out both}
@keyframes world-frame-pulse{0%,100%{filter:brightness(1)}30%{filter:brightness(1.6) drop-shadow(0 0 7px var(--chapter-accent))}60%{filter:brightness(1.15)}}
@media(prefers-reduced-motion:reduce){.board-wrap.impact::before{animation:none!important}}
/* The brand image is independent of translated HUD text. */
.stars-logo{display:block;width:100%;height:auto;max-width:100%;max-height:138px;object-fit:contain;padding:0;filter:drop-shadow(0 3px 5px #03081b80);user-select:none}
.play-top .play-brand{min-width:0;align-self:center}
@media(max-width:740px){.stars-logo{max-height:94px}.play-top{gap:8px}}
.play>.world-name{margin:15px 4px 0;text-align:center;font-size:12px;line-height:1.4;letter-spacing:1px}.play>.world-name+.stats{padding-top:9px}
@media(max-width:740px){.play>.world-name{margin-top:13px;font-size:11px;letter-spacing:.7px}}
