/* 1280 × 800 PC 高清布局；所有规则均覆盖旧的 960 × 720 原型。 */
#app{width:1280px;height:800px;flex:0 0 1280px;margin:0;transform:scale(var(--game-scale,1));transform-origin:center;background:#075a82 url("../assets/img_xl/background_n.png") center/cover no-repeat}
html,body{width:100%;height:100%;min-width:0;min-height:0;overflow:hidden}body{display:flex;align-items:center;justify-content:center}@media(max-width:1280px){#app{margin:0;transform:scale(var(--game-scale,1));transform-origin:center}body{min-height:0}}
#home,#modes,#levels,#tutorial,#game{background:transparent}
#game::before{background:linear-gradient(#073a6e18,#063c5b22)}
/* background.sc.lua: Sea1 fades in for 3s then out for 1s; Sea2 waits 3s,
   fades in for 1s and out for 3s. Both action sequences repeat every 7.1s. */
#ambient-scenery .ambient-sea{position:absolute;z-index:0;right:0;bottom:0;left:0;display:block;width:100%;background-position:center bottom;background-size:100% auto;background-repeat:no-repeat;opacity:0;pointer-events:none}#ambient-scenery .sea-one{height:359px;background-image:url("../assets/img_xl/background_sea1_n.png");animation:ambient-sea-one 7.1s linear infinite}#ambient-scenery .sea-two{height:423px;background-image:url("../assets/img_xl/background_sea2_n.png");animation:ambient-sea-two 7.1s linear infinite}#app.daytime #ambient-scenery .sea-one{background-image:url("../assets/img_xl/background_sea1.png")}#app.daytime #ambient-scenery .sea-two{background-image:url("../assets/img_xl/background_sea2.png")}@keyframes ambient-sea-one{0%{opacity:0}42.25%{opacity:1}56.35%,100%{opacity:0}}@keyframes ambient-sea-two{0%,42.25%{opacity:0}56.35%{opacity:1}98.6%,100%{opacity:0}}
/* on_movement(): the three clouds and their reflected layers cross at the
   original 540/270/1170 second cadence before being reset at the far edge. */
#ambient-scenery .ambient-cloud,#ambient-scenery .ambient-cloud-reflection{position:absolute;z-index:-1;display:block;width:534px;height:75px;opacity:.45;background:center/100% 100% no-repeat;pointer-events:none}#ambient-scenery .cloud-one{background-image:url("../assets/img_xl/background_cloud_1.png")}#ambient-scenery .cloud-two{background-image:url("../assets/img_xl/background_cloud_2.png")}#ambient-scenery .cloud-three{background-image:url("../assets/img_xl/background_cloud_3.png")}#ambient-scenery .ambient-cloud.cloud-one{top:32px;left:92%;animation:ambient-cloud-one 1081s linear infinite}#ambient-scenery .ambient-cloud.cloud-two{top:118px;left:88%;animation:ambient-cloud-two 1081s linear infinite;animation-delay:-270s}#ambient-scenery .ambient-cloud.cloud-three{top:200px;left:98%;animation:ambient-cloud-three 1531s linear infinite;animation-delay:-1170s}#ambient-scenery .ambient-cloud-reflection{top:625px;opacity:.17;transform:scaleY(-.7)}#ambient-scenery .ambient-cloud-reflection.cloud-one{left:92%;animation:ambient-cloud-one 1081s linear infinite}#ambient-scenery .ambient-cloud-reflection.cloud-two{left:88%;animation:ambient-cloud-two 1081s linear infinite;animation-delay:-270s}#ambient-scenery .ambient-cloud-reflection.cloud-three{left:98%;animation:ambient-cloud-three 1531s linear infinite;animation-delay:-1170s}@keyframes ambient-cloud-one{0%{left:92%}49.95%{left:-44%}50%{left:100%}100%{left:-44%}}@keyframes ambient-cloud-two{0%{left:88%}24.95%{left:-44%}25%{left:100%}100%{left:-44%}}@keyframes ambient-cloud-three{0%{left:98%}76.4%{left:-44%}76.5%{left:100%}100%{left:-44%}}
/* background.sc.lua: its boat uses three sail frames on a deliberately slow
   150/300/300-second crossing. The gulls alternate flapping and gliding. */
#ambient-scenery{position:absolute;z-index:0;inset:0;overflow:hidden;pointer-events:none}#ambient-scenery .ambient-boat,#ambient-scenery .ambient-gull{position:absolute;display:block;background-repeat:no-repeat;pointer-events:none}#ambient-scenery .ambient-boat{width:78px;height:122px;left:-9%;bottom:97px;background-image:url("../assets/img_xl/sailing_boat.png");background-size:222px 122px;filter:drop-shadow(0 3px 2px #123c5288);animation:ambient-boat-frames .8s steps(1,end) infinite,ambient-boat-route 750s linear infinite}@keyframes ambient-boat-frames{0%,32%{background-position:-76px 0}33%,65%{background-position:-152px 0}66%,100%{background-position:0 0}}@keyframes ambient-boat-route{0%{left:14%;bottom:103px;transform:scaleX(-1)}20%{left:-9%;bottom:97px;transform:scaleX(-1)}60%{left:101%;bottom:104px;transform:scaleX(1)}100%{left:-9%;bottom:97px;transform:scaleX(-1)}}#ambient-scenery .ambient-gull{width:46px;height:32px;background-image:url("../assets/img_xl/seagull.png");background-size:46px 92px;filter:drop-shadow(0 2px 1px #123b4c77);animation:ambient-gull-frames 10s steps(1,end) infinite}#ambient-scenery .ambient-gull.gull-one{left:-8%;top:20%;animation-name:ambient-gull-frames,ambient-gull-one-route;animation-duration:10s,234s;animation-timing-function:steps(1,end),linear;animation-iteration-count:infinite,infinite}#ambient-scenery .ambient-gull.gull-two{left:104%;top:37%;animation-name:ambient-gull-frames,ambient-gull-two-route;animation-duration:10s,234s;animation-timing-function:steps(1,end),linear;animation-iteration-count:infinite,infinite;animation-delay:-3s,-56s}@keyframes ambient-gull-frames{0%,12%,24%,36%,48%{background-position:0 -34px}6%,18%,30%,42%{background-position:0 -62px}54%,100%{background-position:0 0}}@keyframes ambient-gull-one-route{0%{left:-8%;top:20%;transform:scale(.82)}14%{left:26%;top:8%;transform:scale(.98)}31%{left:71%;top:21%;transform:scale(1.05)}48%{left:93%;top:9%;transform:scale(.75)}64%{left:55%;top:31%;transform:scale(.92)}82%{left:13%;top:13%;transform:scale(.8)}100%{left:-8%;top:20%;transform:scale(.82)}}@keyframes ambient-gull-two-route{0%{left:104%;top:37%;transform:scale(.74) scaleX(-1)}19%{left:73%;top:16%;transform:scale(.94) scaleX(-1)}36%{left:31%;top:29%;transform:scale(.86) scaleX(-1)}54%{left:4%;top:10%;transform:scale(.72) scaleX(-1)}75%{left:47%;top:6%;transform:scale(.95) scaleX(-1)}100%{left:104%;top:37%;transform:scale(.74) scaleX(-1)}}#app:has(#boot.active) #ambient-scenery,#app:has(#loading.active) #ambient-scenery{display:none}
.home-actions{top:34px}.left-actions{left:38px}.right-actions{right:38px}.title-wrap{top:170px}.title-wrap .logo{width:720px}.play-btn{left:535px;top:475px;width:210px;height:86px;background-image:url("../assets/img_xl/button_play.png")}.home-tip{top:590px}
#modes>.corner-back{width:78px;height:78px;border:0;background:transparent url("../assets/img_xl/button_back.png") center/contain no-repeat;color:transparent;box-shadow:none}.mode-cards{width:650px;height:286px;margin:72px auto 0;padding:16px 28px;gap:82px;align-items:flex-start;justify-content:flex-start;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none}.mode-cards::-webkit-scrollbar{display:none}.mode-card{flex:0 0 218px;width:218px;height:255px;padding:0;border:0;border-radius:0;box-shadow:none;background-color:transparent!important;background-position:center;background-size:contain;background-repeat:no-repeat;transition:transform .18s,filter .18s;scroll-snap-align:center;overflow:visible}.mode-card img{position:absolute;left:15px;top:12px;width:189px;height:189px;object-fit:contain}.mode-card span{position:absolute;left:25px;bottom:14px;color:#fff;font-size:24px;font-weight:900;text-shadow:0 2px #b44f2f}.mode-card b,.mode-card small,.mode-card i{display:none}.mode-card.leisure{background-image:url("../assets/img_xl/leisure_patterns_background.png")}.mode-card.classic{background-image:url("../assets/img_xl/mode_classic_background.png")}.mode-card.endless{background-image:url("../assets/img_xl/mode_endless_background.png")}.mode-card.rush{background-image:url("../assets/img_xl/mode_time_background.png")}.mode-card.selected{transform:translateY(-12px) scale(1.06);filter:drop-shadow(0 12px 9px #073e5f88)}.mode-dots{height:32px;display:flex;justify-content:center;align-items:center;gap:14px}.mode-dot{width:18px;height:18px;padding:0;border:4px solid #fff;border-radius:50%;background:transparent;filter:drop-shadow(0 2px 2px #174e67)}.mode-dot.active{background:#fff}.mode-info{position:relative;z-index:1;width:616px;height:245px;margin:0 auto;background:transparent url("../assets/img_xl/mode_help_background.png") center/contain no-repeat;padding:35px 56px;color:#41434a}.mode-info h2{margin:0;text-align:left;color:#16929e;text-shadow:none;font-size:34px}.mode-info p{font-size:22px;line-height:1.7;margin:28px 0 0}
#levels .level-grid{width:650px;height:590px;grid-template-columns:repeat(6,84px);grid-auto-rows:90px;justify-content:center;align-content:start;gap:14px 18px;margin-top:20px;padding:22px;background:#17272c9c;border-radius:8px;overflow-y:auto}.level-btn{width:84px;height:90px;min-height:0;padding:0 0 17px;border:0;border-radius:0;background-color:transparent;background-position:center;background-size:contain;background-repeat:no-repeat;box-shadow:none;font-size:25px;color:#fff;text-shadow:0 2px #484848}.level-btn.theme-leisure,.level-btn.theme-rush{background-image:url("../assets/img_xl/level_opened3.png")}.level-btn.theme-classic{background-image:url("../assets/img_xl/level_opened1.png")}.level-btn.theme-endless{background-image:url("../assets/img_xl/level_opened2.png")}.level-btn.locked{background-color:transparent;background-image:url("../assets/img_xl/level_closed.png");box-shadow:none}.level-btn small{position:absolute;margin:30px 0 0 -19px;width:38px;color:#ffd632;font-size:11px;letter-spacing:-3px;text-shadow:0 1px #945700}
#loading{background:#fff}#loading::before{display:none}.loading-box{inset:0;width:100%;height:100%;padding:0;border:0;border-radius:0;background:#fff;box-shadow:none;display:grid;place-items:center}.loading-box img{width:600px;height:auto}.loading-box p{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.hud{left:22px;top:14px;right:25px;height:92px;gap:12px}.avatar{width:90px;height:90px;border:0;border-radius:12px;color:transparent;background:transparent url("../assets/img_xl/game_class_logo.png") center/contain no-repeat}.level-label{position:relative;width:78px;height:64px;font-size:0}.level-label>i{display:block;width:70px;height:24px;background:url("../assets/img_xl/orange_font_level.png") center/contain no-repeat}.level-label>b{display:flex;width:78px;height:24px;justify-content:center;margin-top:3px}.atlas-level-digit{display:block;width:19px;height:24px;background-image:url("../assets/img_xl/small_blue_number_level.png");background-repeat:no-repeat}.timer-area{flex:none;width:680px;gap:10px}.timer-bar{flex:none;width:622px;height:32px;padding:0;border:0;border-radius:0;background:transparent url("../assets/img_xl/time_slot.png") center/622px 32px no-repeat;overflow:hidden}.timer-bar>i{height:32px;border-radius:0;background:transparent url("../assets/img_xl/time_bars.png") left center/622px 32px no-repeat}.timer-area>b{display:flex;width:48px;min-width:48px;height:19px;align-items:center;font-size:0}.atlas-time-digit{display:block;width:16px;height:19px;background-image:url("../assets/img_xl/time_bars_number.png");background-repeat:no-repeat}#mode-pill{display:none}
.toolbox{left:22px;top:140px;width:94px;height:357px;padding:21px 9px;gap:5px;background:transparent url("../assets/img_xl/game_props_white_background.png") center/94px 357px no-repeat;border-radius:0;overflow:visible}.tool-btn{width:75px;height:75px;border:0;border-radius:0;background-color:transparent;background-position:center,center;background-repeat:no-repeat,no-repeat;background-size:75px 75px,75px 75px;color:transparent;box-shadow:none;text-shadow:none}.tool-btn[data-action="hint"]{background-image:url("../assets/img_xl/game_button_props_help.png"),url("../assets/img_xl/game_props_black_background.png")}.tool-btn[data-action="shuffle"]{background-image:url("../assets/img_xl/game_button_props_refresh.png"),url("../assets/img_xl/game_props_black_background.png")}.tool-btn[data-action="bomb"]{background-image:url("../assets/img_xl/game_button_props_bomb.png"),url("../assets/img_xl/game_props_black_background.png")}.tool-btn[data-action="change-icons"]{background-image:url("../assets/img_xl/game_button_change_icon.png"),url("../assets/img_xl/game_props_black_background.png")}.tool-btn[data-action="pause"]{position:absolute;left:8px;top:410px;margin:0;width:78px;height:78px;border-radius:50%;background-color:transparent;background-image:url("../assets/img_xl/button_pause.png");background-size:contain}.tool-btn em{color:transparent;text-shadow:none}
.game-board{left:140px;top:116px;width:1105px;height:628px;padding:20px;gap:7px;background:#182c328f;border-radius:8px;overflow:visible}.tile{padding:0;border:0;border-radius:0;background-color:transparent;box-shadow:none;cursor:pointer;-webkit-tap-highlight-color:transparent}.tile:hover{transform:scale(1.06)}.tile:focus,.tile:focus-visible,.tile:active{outline:0;outline-offset:0;box-shadow:none;background-color:transparent}.tile.selected,.tile.selected:hover,.tile.selected:focus,.tile.selected:focus-visible,.tile.selected:active{transform:scale(1.2);z-index:5;outline:0;outline-offset:0;box-shadow:none;filter:none;background-color:transparent}.tile.hint{outline:0;filter:drop-shadow(0 0 12px #fff16a)}
.match-particle{position:absolute;width:32px;height:32px;z-index:13;pointer-events:none;background-position:center;background-size:contain;background-repeat:no-repeat;transform:translate(-50%,-50%);mix-blend-mode:screen}
.path-spark{z-index:14;width:28px;height:28px;background:transparent url("../assets/game_img/fire.png") center/contain no-repeat;filter:drop-shadow(0 0 4px #fff) drop-shadow(0 0 8px #ffad42);mix-blend-mode:screen;opacity:0;animation:path-spark .2s ease-out both}
.star-burst{background-image:url("../assets/game_img/stars.png");filter:sepia(1) saturate(12) hue-rotate(345deg) drop-shadow(0 0 8px #ffcf43);animation:match-burst .55s ease-out forwards}
.fire-burst{background-image:url("../assets/game_img/fire.png");filter:sepia(1) saturate(12) hue-rotate(320deg) drop-shadow(0 0 8px #ff4b22);animation:match-burst .55s ease-out forwards}
.tile.matching{z-index:12;pointer-events:none;animation:tile-match .2s linear forwards}
@keyframes path-spark{0%{opacity:0;transform:translate(-50%,-50%) scale(.15)}25%{opacity:1;transform:translate(-50%,-50%) scale(1.05)}65%{opacity:.72;transform:translate(-50%,-50%) scale(.62)}100%{opacity:0;transform:translate(-50%,-50%) scale(.12)}}
@keyframes match-burst{0%{opacity:1;transform:translate(-50%,-50%) scale(.5)}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) scale(.08)}}
@keyframes tile-match{0%{opacity:1}100%{opacity:0}}
.game-status{left:145px;right:38px;bottom:23px;font-size:22px}
.overlay{position:absolute}
.dialog{width:667px;min-height:429px;background-image:url("../assets/img_xl/game_dialog.png");padding:52px 72px}
.dialog .dialog-actions{align-items:center;gap:36px;margin-top:16px}
.dialog .dialog-actions .dialog-icon,.pause-menu .dialog-icon{width:78px;height:78px;padding:0;border:0;border-radius:50%;box-shadow:none;background-color:transparent;background-position:center;background-size:contain;background-repeat:no-repeat;color:transparent}
.dialog-icon.resume{width:113px!important;height:118px!important;background-image:url("../assets/img_xl/button_start.png")!important}
.dialog-icon.restart{background-image:url("../assets/img_xl/button_restart.png")!important}
.dialog-icon.levels{background-image:url("../assets/img_xl/button_back.png")!important}
.dialog-icon.next{background-image:url("../assets/img_xl/button_next.png")!important}
.dialog-icon.skip{background-image:url("../assets/img_xl/button_skip.png")!important}
.dialog-icon.music{background-image:url("../assets/img_xl/button_music.png")!important}
.dialog-icon.pause-help{background-image:url("../assets/img_xl/button_help.png")!important}
.dialog-icon span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.overlay:has(.pause-menu){background:transparent;display:block}
.pause-menu{position:absolute;left:-78px;top:195px;width:343px;min-height:0;height:343px;padding:0;background-color:transparent;background-image:url("../assets/img_xl/game_menu_background.png");color:transparent}
.pause-menu .pause-menu-actions{position:absolute;inset:0}
.pause-menu .dialog-icon{position:absolute}
.pause-menu .restart{left:104px;top:5px}
.pause-menu .skip{left:180px;top:55px}
.pause-menu .resume{left:75px;top:98px;width:113px!important;height:118px!important}
.pause-menu .music{left:190px;top:118px}
.pause-menu .levels{left:78px;top:225px}
.pause-menu .pause-help{left:184px;top:211px}
.result-dialog .dialog-actions{margin-top:10px}
.time-bonus{position:absolute;left:290px;top:74px;z-index:30;color:#fff7a6;font:900 28px/1 Arial,sans-serif;text-shadow:0 2px 2px #85430c,0 0 8px #ee8128;pointer-events:none;animation:time-bonus-rise .65s ease-out forwards}@keyframes time-bonus-rise{from{opacity:0;transform:translateY(12px) scale(.75)}25%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-34px) scale(1.08)}}
.dialog.icon-picker{width:667px;min-height:429px;padding:60px 70px;background-image:url("../assets/img_xl/game_dialog.png");text-align:center}.icon-picker-title{margin:5px 0 32px;color:#1c9fa7;font-size:34px;text-shadow:none}.icon-picker-options{display:flex;align-items:center;justify-content:center;gap:28px}.icon-picker-option{position:relative;width:142px;height:142px;padding:0;border:0;background:transparent;box-shadow:none}.icon-picker-option img{width:142px;height:142px}.icon-picker-option.selected i{position:absolute;inset:14px;background:transparent url("../assets/img_xl/button_selected_icon.png") center/contain no-repeat;pointer-events:none}.icon-picker-return{position:absolute;left:293px;bottom:26px;width:78px;height:78px;padding:0;border:0;border-radius:50%;background:transparent url("../assets/img_xl/button_back.png") center/contain no-repeat;box-shadow:none;color:transparent}
.dialog.start-dialog{width:667px;min-height:429px;padding:0;background-image:url("../assets/img_xl/game_dialog.png");display:flex;flex-direction:column;align-items:center;justify-content:center;gap:58px;pointer-events:none;animation:start-dialog-native 1.4s linear both}.start-dialog-title{width:310px;height:auto;object-fit:contain}.start-dialog-stats{display:flex;gap:76px;color:#fff;font:900 33px/1 Arial,sans-serif;text-shadow:0 2px 2px #22606e}.start-dialog-stats span{display:flex;align-items:center;gap:13px}.start-dialog-stats img{width:58px;height:58px;object-fit:contain}@keyframes start-dialog-native{0%{opacity:0;transform:scale(1)}14.285%{opacity:1}35.714%{transform:scale(1.1)}71.428%,85.714%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.1)}}
.overlay:has(.language-picker){background:#fff}.dialog.language-picker{width:100%;height:100%;min-height:0;padding:0;border:0;border-radius:0;background:#fff;color:transparent;box-shadow:none;display:grid;place-items:center}.language-options{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}.language-option{position:relative;width:231px;height:79px;padding:0;border:0;border-radius:0;background:transparent url("../assets/img_xl/language_button_background.png") center/231px 79px no-repeat;box-shadow:none}.language-option .language-font{display:block;width:151px;height:34px;margin:auto;object-fit:none}.language-option.selected i{position:absolute;left:50%;top:50%;width:246px;height:94px;transform:translate(-50%,-50%);background:transparent url("../assets/img_xl/language_button_select.png") center/246px 94px no-repeat;pointer-events:none}.language-return{position:absolute;left:35px;bottom:35px;width:78px;height:78px;padding:0;border:0;border-radius:0;background:transparent url("../assets/img_xl/button_back.png") center/contain no-repeat;box-shadow:none;color:transparent}
.mode-cards{width:560px}.level-grid{overflow-x:hidden;scrollbar-width:none}.level-grid::-webkit-scrollbar{display:none}.level-btn{position:relative}.level-digits{position:absolute;left:50%;top:13px;display:flex;transform:translateX(-50%)}.level-digits i{display:block;width:29px;height:36px;background:url("../assets/img_xl/level_number.png") calc(var(--digit) * -29px) 0/290px 36px no-repeat}
.home-actions{top:24px;flex-direction:column;gap:10px}.left-actions{left:28px}.right-actions{right:28px}.home-icon{width:78px;height:78px;padding:0;border:0;border-radius:50%;background-color:transparent;background-position:center;background-size:contain;background-repeat:no-repeat;box-shadow:none;color:transparent}.home-icon.back{background-image:url("../assets/img_xl/button_back.png")}.home-icon.sound{background-image:url("../assets/img_xl/button_sound.png")}.home-icon.sound.muted{background-image:url("../assets/img_xl/button_sound_off.png")}.home-icon.music{background-image:url("../assets/img_xl/button_music.png")}.home-icon.music.muted{background-image:url("../assets/img_xl/button_music_off.png")}.home-icon.help{background-image:url("../assets/img_xl/button_help.png")}.home-icon.about{background-image:url("../assets/img_xl/button_about.png")}.home-icon.language{background-image:url("../assets/img_xl/button_language.png")}.home-icon span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.overlay:has(.pause-menu){pointer-events:none}.pause-menu{left:-64px;top:173px;pointer-events:auto}.pause-menu .restart{left:104px;top:18px}.pause-menu .skip{left:220px;top:63px}.pause-menu .resume{left:78px;top:151px}.pause-menu .music{left:266px;top:181px}.pause-menu .music.muted{background-image:url("../assets/img_xl/button_music_off.png")!important}.pause-menu .levels{left:96px;top:319px}.pause-menu .pause-help{left:256px;top:279px}

/* ui.sc.lua: all six main-menu image buttons use the same pressed / hover lift. */
.home-icon{transition:transform .14s ease,filter .14s ease}.home-icon:hover,.home-icon:focus-visible{transform:translateY(-6px) scale(1.08);filter:brightness(1.13) drop-shadow(0 6px 4px #12405b88)}.home-icon:active{transform:translateY(1px) scale(.94);filter:brightness(.96)}
#home .home-actions{z-index:3}

/* On_AboutClick shows the native credits art as its own page, with its own back control. */
#about{z-index:2;background:transparent;overflow:hidden}#about::before{display:none}.about-art{position:absolute;z-index:1;left:50%;top:50%;width:496px;height:599px;object-fit:contain;transform:translate(-50%,-50%)}.about-return{position:absolute;z-index:2;left:50%;bottom:21px;width:78px;height:78px;padding:0;border:0;border-radius:0;background:transparent url("../assets/img_xl/button_back.png") center/contain no-repeat;box-shadow:none;color:transparent;transform:translateX(-50%)}.about-return:hover,.about-return:focus-visible{transform:translateX(-50%) translateY(-6px) scale(1.08);filter:brightness(1.13) drop-shadow(0 6px 4px #12405b88)}.about-return:active{transform:translateX(-50%) translateY(1px) scale(.94)}

/* The PNG supplies the original dark panel; remove the generic dialog's black border/shadow layer. */
.dialog:not(.language-picker){border:0;border-radius:0;background-color:transparent;box-shadow:none}

/* APK 1024/HD layout coordinates, projected onto the 1280x800 canvas. */
#modes>.corner-back,#levels>.corner-back{left:15px;top:auto;bottom:15px;width:78px;height:78px;border:0;border-radius:0;background:transparent url("../assets/img_xl/button_back.png") center/contain no-repeat;color:transparent;box-shadow:none}
.mode-cards{width:900px;height:286px;margin:72px auto 0;padding:16px 341px;gap:100px;scroll-behavior:smooth;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;touch-action:pan-y;cursor:grab;user-select:none}
.mode-cards:active{cursor:grabbing}.mode-card{scroll-snap-align:center;scroll-snap-stop:always}.mode-card:hover{transform:none;filter:none}.mode-card.selected{transform:translateY(-10px) scale(1.045);filter:drop-shadow(0 11px 8px #073e5f88)}
.level-btn.theme-leisure{background-image:url("../assets/img_xl/level_opened3.png")}.level-btn.theme-classic{background-image:url("../assets/img_xl/level_opened1.png")}.level-btn.theme-rush,.level-btn.theme-endless{background-image:url("../assets/img_xl/level_opened2.png")}
.level-btn.locked{background-image:url("../assets/img_xl/level_closed.png")!important}

.star-burst,.fire-burst{opacity:0;animation-duration:.34s}

.overlay:has(.pause-menu){pointer-events:auto;background:transparent;place-items:initial}.pause-menu{left:-112px;top:229px;width:343px;height:343px;pointer-events:auto}
.pause-menu .restart{left:144px;top:7px}.pause-menu .skip{left:229px;top:43px}.pause-menu .resume{left:127px;top:113px}.pause-menu .music{left:255px;top:133px}.pause-menu .levels{left:144px;top:261px}.pause-menu .pause-help{left:229px;top:225px}
.pause-menu .dialog-icon{transition:transform .13s ease,filter .13s ease}.pause-menu .dialog-icon:hover,.pause-menu .dialog-icon:focus-visible{transform:scale(1.08);filter:brightness(1.12) drop-shadow(0 5px 4px #15475988)}.pause-menu .dialog-icon:active{transform:scale(.94)}
.pause-toggle{display:block;position:absolute;left:136px;top:321px;width:78px;height:78px;padding:0;border:0;border-radius:50%;background:transparent;z-index:1}.pause-menu .dialog-icon{z-index:2}

.result-dialog .dialog-icon{transition:transform .16s ease,filter .16s ease}.result-dialog .dialog-icon:hover,.result-dialog .dialog-icon:focus-visible{transform:translateY(-7px) scale(1.1);filter:brightness(1.16) drop-shadow(0 8px 5px #102f3d88)}.result-dialog .dialog-icon:active{transform:translateY(1px) scale(.94);filter:brightness(.96)}

/* 原版 load_%s.xgg：白底 Loading 标识及 3 颗循环提示灯。 */
#loading .loading-box{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px}
#loading .loading-box img{width:600px;max-width:62%;height:auto}
.loading-dots{display:flex;gap:20px;height:26px}.loading-dots i{width:24px;height:24px;border-radius:5px;background:url("../assets/img_xl/loading_icon.png") center/100% 100%;animation:loading-dot 1.2s infinite ease-in-out}.loading-dots i:nth-child(2){animation-delay:.2s}.loading-dots i:nth-child(3){animation-delay:.4s}@keyframes loading-dot{0%,100%{opacity:.18;transform:translateY(0)}50%{opacity:1;transform:translateY(-10px)}}

/* On_HelpClick / Tutorial：使用 APK 的教程框、图示与连线路径。 */
.tutorial-card{inset:92px 185px 82px;padding:35px 72px 48px;background:#000 url("../assets/img_xl/tutorial_background.png") center/100% 100% no-repeat;border-radius:0;color:#fff}
.tutorial-title-art{display:block;width:285px;height:auto;margin:0 auto 4px}.tutorial-step{right:58px;top:46px}.tutorial-progress{width:205px;height:18px;border:0;background:transparent;gap:8px;overflow:visible}.tutorial-progress i{width:18px;height:18px;border:0;border-radius:50%;background:#69777c;box-shadow:0 1px 2px #000}.tutorial-progress i.active{background:#d9ff39;box-shadow:0 0 0 3px #e45938}.tutorial-pairs{height:156px;gap:35px}.tutorial-icon{width:108px;height:108px;display:block;background:none!important;object-fit:contain}.tutorial-pairs b{color:#ffdf2d;font-size:40px;text-shadow:0 2px #9b4c16}.tutorial-line{display:block;width:270px;height:20px;object-fit:fill;margin:-35px auto 6px;filter:drop-shadow(0 0 5px #e9ef79)}.tutorial-card h2{font-size:34px;margin:12px 0 8px}.tutorial-card p{max-width:570px;margin:0 auto;font-size:20px;line-height:1.65}
/* ui_xl.xgg tutorial menus: back / next / restart / skip. */
.tutorial-actions{inset:0;display:block;z-index:3;pointer-events:none}.tutorial-actions .round-btn{position:absolute;width:78px;height:78px;padding:0;border:0;border-radius:0;background-color:transparent;background-position:center;background-size:contain;background-repeat:no-repeat;box-shadow:none;color:transparent;pointer-events:auto}.tutorial-actions #tutorial-back{left:21px;top:274px;background-image:url("../assets/img_xl/button_back.png")}.tutorial-actions #tutorial-next{right:21px;top:274px;background-image:url("../assets/img_xl/button_next.png");transform:none}.tutorial-actions #tutorial-replay{left:calc(50% - 139px);bottom:21px;background-image:url("../assets/img_xl/button_restart.png")}.tutorial-exit{position:absolute;left:calc(50% + 61px);bottom:21px;width:78px;height:78px;padding:0;border:0;border-radius:0;background:transparent url("../assets/img_xl/button_skip.png") center/contain no-repeat;color:transparent;transform:none}

/* LevelMenu.new("class",1), ("time",2), ("leisure",3). */
.level-btn.theme-classic{background-image:url("../assets/img_xl/level_opened1.png")}.level-btn.theme-rush{background-image:url("../assets/img_xl/level_opened2.png")}.level-btn.theme-leisure{background-image:url("../assets/img_xl/level_opened3.png")}.level-btn.theme-endless{background-image:none}.level-btn.locked{background-image:url("../assets/img_xl/level_closed.png")!important}.level-btn.done{background-color:transparent}
/* ui_xl.xgg: both menus use button_back.png at align="l,b", offset="54,54". */
#modes>.corner-back,#levels>.corner-back{left:15px;bottom:15px;width:78px;height:78px;background-image:url("../assets/img_xl/button_back.png")}.level-grid.endless-level{display:flex;align-items:center;justify-content:center;gap:44px}.endless-start,.endless-restart{width:210px;height:86px;border:0;background:transparent center/contain no-repeat;color:transparent;font-size:0}.endless-start{background-image:url("../assets/img_xl/button_start.png")}.endless-restart{background-image:url("../assets/img_xl/button_restart.png")}

/* Image buttons keep their DOM fallback glyphs for accessibility only. */
.corner-back,.home-icon,.tool-btn,.tutorial-actions .round-btn,.tutorial-exit{color:transparent!important;text-shadow:none!important}

/* game.sc.lua/ui.sc.lua: show the LinkGo logo immediately, then the title. */
#boot{z-index:50;background:#fff;overflow:hidden}#boot::before{display:none}.boot-company,.boot-title{position:absolute;left:50%;top:50%;opacity:0;transform:translate(-50%,-50%)}.boot-company{width:360px}.boot-title{width:560px}

/* help.sc.lua: diagram board and four traffic lights replace explanatory text. */
.tutorial-step{left:60px;right:auto;top:46px}.tutorial-lights{position:absolute;left:245px;top:163px;width:54px;height:245px;padding:14px 0;background:transparent url("../assets/img_xl/tutorial_lights_background.png") center/100% 100% no-repeat;display:grid;grid-template-rows:repeat(4,1fr);justify-items:center;align-items:center}.tutorial-lights i{width:34px;height:34px;border-radius:50%;background:#4b4b55;box-shadow:inset 0 1px 2px #000}.tutorial-lights i:first-child{background:#df5d50}.tutorial-lights i.active{background:#a4e520;box-shadow:0 0 12px #c8ff3b}.tutorial-lights i:first-child.active{background:#df5d50;box-shadow:none}.tutorial-diagram{position:absolute;left:335px;top:142px;width:240px;height:240px}.tutorial-node{position:absolute;width:70px;height:70px;object-fit:contain;z-index:2}.tutorial-segment{position:absolute;height:4px;border-radius:4px;background:#fff;box-shadow:0 0 3px #fff;transform-origin:left center;z-index:1}.tutorial-card h2,.tutorial-card p,.tutorial-progress,.tutorial-pairs,.tutorial-line{display:none}
.tutorial-segment{transform:rotate(var(--segment-angle)) scaleX(0)}.tutorial-segment.revealed{animation:tutorial-draw 1s linear forwards}.tutorial-result{position:absolute;left:548px;top:112px;width:88px;height:auto;filter:drop-shadow(0 1px 2px #000)}.tutorial-result[hidden]{display:none}@keyframes tutorial-draw{to{transform:rotate(var(--segment-angle)) scaleX(1)}}

/* hideMode(): the mode menu travels beyond the top edge before level UI appears. */
#modes.exiting .mode-cards,#modes.exiting .mode-dots,#modes.exiting .mode-info{pointer-events:none;animation:mode-fly-out .52s cubic-bezier(.6,-.25,.85,.2) forwards}#modes.exiting>.corner-back{pointer-events:none;animation:mode-back-fly-out .52s cubic-bezier(.6,-.25,.85,.2) forwards}@keyframes mode-fly-out{to{transform:translateY(-980px);opacity:0}}@keyframes mode-back-fly-out{to{transform:translateX(-180px);opacity:0}}

/* LLK_On_Connected: a rewarded prop travels from the cleared pair to the left toolbox. */
.prop-reward{position:absolute;width:54px;height:54px;margin:-27px;z-index:16;pointer-events:none;background-position:center;background-size:contain;background-repeat:no-repeat;animation:prop-reward-fly .5s ease-in forwards}.prop-reward.help{background-image:url("../assets/img_xl/game_button_props_help.png")}.prop-reward.bomb{background-image:url("../assets/img_xl/game_button_props_bomb.png")}.prop-reward.refresh{background-image:url("../assets/img_xl/game_button_props_refresh.png")}@keyframes prop-reward-fly{to{opacity:0;transform:translate(-220px,-170px) scale(.42)}}

/* ui_xl.xgg tutorial: retain the native background and
   its 240 × 240 diagram coordinate system instead of stretching it. */
#tutorial .tutorial-card{inset:auto;left:50%;top:50%;width:685px;height:469px;padding:0;transform:translate(-50%,-50%);background:#000 url("../assets/img_xl/tutorial_background.png") center/100% 100% no-repeat}
#tutorial .tutorial-title-art{position:absolute;left:287px;top:40px;width:258px;height:40px;margin:0}
#tutorial .tutorial-step{left:60px;right:auto;top:52px;width:54px;height:26px;font-size:22px;font-weight:700;line-height:26px;color:#fff;text-shadow:0 1px 1px #000;background:none}
#tutorial .tutorial-lights{left:188px;top:93px;width:70px;height:244px;padding:0;display:block;background:url("../assets/img_xl/tutorial_lights_background.png") center/100% 100% no-repeat}
#tutorial .tutorial-lights i{position:absolute;left:9px;width:53px;height:53px;border:0;border-radius:0;background:url("../assets/img_xl/tutorial_gray_lights.png") center/100% 100% no-repeat;box-shadow:none}
#tutorial .tutorial-lights i:nth-child(1){top:5px}#tutorial .tutorial-lights i:nth-child(2){top:64px}#tutorial .tutorial-lights i:nth-child(3){top:123px}#tutorial .tutorial-lights i:nth-child(4){top:182px}
#tutorial .tutorial-lights i:first-child{background-image:url("../assets/img_xl/tutorial_gray_lights.png")}#tutorial .tutorial-lights i.active{background-image:url("../assets/img_xl/tutorial_green_lights.png");box-shadow:none}#tutorial .tutorial-lights i:first-child.active{background-image:url("../assets/img_xl/tutorial_green_lights.png")}
#tutorial .tutorial-diagram{left:163px;top:235px;width:240px;height:240px;overflow:visible}
#tutorial .tutorial-node{width:67px;height:67px}
#tutorial .tutorial-segment{height:auto;border:0;border-radius:0;background:none;box-shadow:none;transform:none;transform-origin:left center}
#tutorial .tutorial-segment.draw-lr{transform:scaleX(0)}#tutorial .tutorial-segment.draw-tb{transform:scaleY(0);transform-origin:top center}#tutorial .tutorial-segment.draw-bt{transform:scaleY(0);transform-origin:bottom center}
#tutorial .tutorial-segment.revealed{animation:tutorial-draw-line 1s linear forwards}@keyframes tutorial-draw-line{to{transform:scale(1)}}
#tutorial .tutorial-number{position:absolute;width:18px;height:26px;color:#fff;font-size:22px;font-weight:700;line-height:26px;font-style:normal;text-align:center;text-shadow:0 1px 1px #000}.tutorial-number::after{content:attr(data-number)}
#tutorial .tutorial-result{left:196px;top:72px;width:54px;height:48px;filter:none}
#tutorial .tutorial-actions #tutorial-back{left:60px;top:176px}#tutorial .tutorial-actions #tutorial-next{right:60px;top:176px}
#tutorial .tutorial-actions #tutorial-replay{left:204px;bottom:60px}#tutorial .tutorial-exit{left:404px;bottom:60px}

/* LevelMenu.new(): three level_star.png sprites are anchored 1/3 of a star
   height above the lower edge, rather than Unicode glyphs. */
.level-stars{position:absolute;left:11px;top:57px;display:flex;width:63px;height:20px;justify-content:flex-start}.level-stars img{display:block;width:21px;height:20px}

/* 原版道具数字叠在白色圆角底板上，而非浏览器样式的黑色圆点。 */
.tool-btn em{right:-4px;top:-2px;display:flex;justify-content:flex-end;min-width:16px;height:20px;padding:0;border:0;border-radius:0;background:none;color:transparent;font-size:0;text-shadow:none}.atlas-prop-digit{display:block;width:16px;height:20px;background-image:url("../assets/img_xl/small_blue_number.png");background-repeat:no-repeat}

/* GameLogic.usePropsBomb(): the player chooses a target before a bomb is spent. */
.tile.bomb-target{filter:brightness(1.18) drop-shadow(0 0 8px #ff8b37);animation:bomb-target-pulse .62s ease-in-out infinite alternate}@keyframes bomb-target-pulse{to{filter:brightness(1.45) drop-shadow(0 0 17px #ffcc53);transform:scale(1.06)}}

/* GameLogic.setTimeLabel(): a 3-2-1 warning accompanies the final seconds. */
.game-countdown{position:absolute;left:50%;top:45%;z-index:35;color:#fff9a6;font:900 170px/1 Arial,sans-serif;text-shadow:0 5px 0 #c64b21,0 0 22px #ff8c37;pointer-events:none;animation:countdown-pop .8s ease-out forwards}@keyframes countdown-pop{from{opacity:0;transform:translate(-50%,-50%) scale(4)}18%{opacity:1}to{opacity:0;transform:translate(-50%,-58%) scale(.78)}}


/* Draw this scenery above a screen's bitmap background but below the z-indexed UI. */
#ambient-scenery{z-index:1}
/* game_xl.xgg: the right-hand combo timer and six-hit bomb meter. */
#combo-hud{position:absolute;z-index:3;top:30px;right:36px;display:none;height:44px;pointer-events:none}#app:has(#game.active) #combo-hud{display:block}.combo-progress{position:absolute;right:124px;top:8px;width:215px;height:28px;background:url("../assets/img_xl/combo_time_slot.png") center/100% 100% no-repeat}.combo-progress i{position:absolute;inset:0 auto 0 0;width:0;background:url("../assets/img_xl/combo_time_bars.png") left center/215px 28px no-repeat;transition:width .1s linear}.combo-bomb-progress{position:absolute;right:0;top:0;width:49px;height:44px;background:url("../assets/img_xl/combo_bomb_time_slot.png") center/100% 100% no-repeat}.combo-bomb-progress i{position:absolute;bottom:0;left:0;width:49px;height:0;background:url("../assets/img_xl/combo_bomb_time_bars.png") bottom center/49px 44px no-repeat;transition:height .16s ease-out}.combo-bomb-progress b{position:absolute;left:15px;top:7px;width:21px;color:#fff;font:900 24px/1 Arial,sans-serif;text-align:center;text-shadow:0 1px 2px #793d11}
/* ui.sc.lua/load_background(): day is 07:00 through 18:00 inclusive. */
#app.daytime{background-image:url("../assets/img_xl/background.png");background-repeat:no-repeat;background-position:center;background-size:cover}
#home .home-actions,#home .title-wrap,#home .play-btn,#home .home-tip,#modes>.corner-back,#modes .mode-cards,#modes .mode-dots,#modes .mode-info,#levels>.corner-back,#levels h2,#levels .subtitle,#levels .level-grid,#game .hud,#game .toolbox,#game .game-board,#game .game-status{z-index:2}#home .home-actions{z-index:3}

/* Native menu asset. */
#home .play-btn{color:transparent;font-size:0}

/* On_HelpClick retains the menu background: the tutorial has no added blue
   gradient or night-only layer.  All geometry below is the 5/6 HD transform
   of ui_xl.xgg's layout. */
#tutorial::before{display:none}
#home,#modes,#levels,#tutorial,#game{background:transparent!important}

#home::before{display:none}
#tutorial .tutorial-card{background-color:transparent}
#tutorial .tutorial-title-art{left:439px;top:13px;width:258px;height:40px}
#tutorial .tutorial-step{left:50px;top:17px;width:45px;height:26px;font-size:22px;line-height:26px}
#tutorial .tutorial-lights{left:208px;top:96px}
#tutorial .tutorial-diagram{left:293px;top:135px;width:200px;height:200px}
#tutorial .tutorial-result{left:216px;top:36px}
#tutorial .tutorial-number{z-index:4;width:14px;height:26px;background:url("../assets/img_xl/game_dialog_white_number_s.png") calc(var(--digit) * -14px) 0/182px 26px no-repeat;color:transparent;font-size:0;text-shadow:none;opacity:0;transform:scale(.75)}
#tutorial .tutorial-number.revealed{opacity:1;transform:scale(1);transition:opacity .2s linear,transform .2s ease-out}
#tutorial .tutorial-number::after{content:none}
#tutorial .tutorial-actions #tutorial-back{left:11px;top:179px}
#tutorial .tutorial-actions #tutorial-next{right:11px;top:179px}
#tutorial .tutorial-actions #tutorial-replay{left:220px;bottom:11px}
#tutorial .tutorial-exit{left:387px;bottom:11px}

/* FailedDialog(): retain the authored board art and place its two controls
   at the coordinates shown by the APK's game dialog. */
.dialog-icon.modes{background-image:url("../assets/img_xl/button_back.png")!important}
.dialog-icon.sound{background-image:url("../assets/img_xl/button_sound.png")!important}.dialog-icon.sound.muted{background-image:url("../assets/img_xl/button_sound_off.png")!important}
.failed-dialog{position:relative;padding:0}
.failed-dialog .failed-heading{position:absolute;left:70px;right:56px;top:38px;height:34px;color:#fff;font:400 29px/34px "Comic Sans MS","Microsoft YaHei",sans-serif;text-align:left}
.failed-dialog .failed-heading img{position:absolute;right:20px;top:0;width:156px;height:30px;object-fit:contain}
.failed-dialog .failed-font{position:absolute;left:184px;top:170px;width:300px;height:50px;object-fit:contain}
.failed-dialog .failed-actions{position:absolute;left:0;right:0;bottom:58px;display:flex;justify-content:space-between;margin:0;padding:0 84px}
.failed-dialog .failed-actions .dialog-icon{width:78px;height:78px}

/* ui_xl.xgg: mode labels, help copy, level titles and game-result copy
   are authored sprite resources rather than browser-rendered text. */
.mode-card span{display:flex;left:18px;bottom:14px;height:25px;align-items:flex-start;color:transparent;font-size:0;text-shadow:none}
.mode-card .atlas-mode-digit{display:block;width:16px;height:25px;margin:0;background-image:url("../assets/img_xl/mode_level_number.png");background-repeat:no-repeat}
.mode-info{padding:0}
.mode-info-title{position:absolute;left:96px;top:37px;display:block;max-width:190px;max-height:32px;object-fit:contain;object-position:left top}
.mode-info-copy{position:absolute;left:50%;top:74px;display:block;max-width:518px;max-height:159px;object-fit:contain;transform:translateX(-50%)}
.level-title-art{position:relative;z-index:2;display:block;max-width:430px;max-height:76px;margin:32px auto 0;object-fit:contain}
#levels .level-grid{margin-top:18px}
.atlas-dialog-level{display:block;width:18px;height:35px;background-image:url("../assets/img_xl/game_dialog_white_number.png");background-repeat:no-repeat}
.atlas-dialog-small{display:block;width:14px;height:26px;background-image:url("../assets/img_xl/game_dialog_white_number_s.png");background-repeat:no-repeat}
.dialog-small-atlas,.dialog-level-atlas{display:flex;height:35px}
.dialog-small-atlas{height:26px}
.start-dialog-stats b{margin:0}
.native-result-dialog{position:relative;padding:0}
.native-result-dialog .result-heading{position:absolute;left:70px;right:56px;top:38px;height:35px}
.native-result-dialog .result-heading .dialog-level-atlas{position:absolute;left:0;top:0}
.native-result-dialog .result-heading img{position:absolute;right:20px;top:2px;width:156px;height:30px;object-fit:contain}
.native-result-dialog .result-success-font{position:absolute;left:168px;top:105px;width:331px;height:65px;object-fit:contain}
.native-result-dialog .result-success-font.finish-font{left:155px;top:122px;width:357px;height:154px}
.native-result-dialog .result-time{position:absolute;left:205px;top:181px;display:flex;height:31px;align-items:center;gap:20px}
.native-result-dialog .result-time>img{max-width:128px;max-height:26px;object-fit:contain}
.native-result-dialog .result-stars{position:absolute;left:248px;top:229px;display:flex;width:171px;height:55px}
.native-result-dialog .result-stars img{display:block;width:57px;height:55px}
.native-result-dialog .result-actions{position:absolute;right:70px;bottom:46px;left:70px;justify-content:center;margin:0}
.failed-dialog .failed-heading .dialog-level-atlas{position:absolute;left:0;top:0}
.game-countdown{width:111px;height:111px;background-image:url("../assets/img_xl/count_down_number.png");background-size:333px 333px;background-repeat:no-repeat;color:transparent;font-size:0;text-shadow:none}
.dialog.icon-picker .icon-picker-title{display:block;width:117px;height:38px;margin:5px auto 32px;object-fit:contain}

/* game_ui.sc.lua hideGame(): pause and icon selection are separate game pages. */
#app.game-subpage #game.active>*{visibility:hidden;pointer-events:none}
#app.game-subpage #combo-hud{display:none!important}
.overlay:has(.icon-picker){background:transparent}

.combo-reward-bomb{position:absolute;z-index:40;right:36px;top:30px;width:75px;height:75px;background:url("../assets/img_xl/game_button_props_bomb.png") center/contain no-repeat;pointer-events:none;animation:combo-bomb-flight .32s ease-in forwards}
@keyframes combo-bomb-flight{0%{opacity:1;transform:translate(0,0) scale(.55)}75%{opacity:1;transform:translate(-480px,310px) scale(1.25)}100%{opacity:0;transform:translate(-480px,310px) scale(.35)}}
.tutorial-step{display:flex;height:26px;color:transparent;font-size:0;text-shadow:none}
.atlas-tutorial-step{display:block;width:14px;height:26px;background-image:url("../assets/img_xl/game_dialog_white_number_s.png");background-repeat:no-repeat}
.combo-bomb-progress b{display:flex;left:5px;top:4px;width:40px;height:36px;color:transparent;font-size:0;text-shadow:none}
.atlas-combo-digit{display:block;width:20px;height:36px;background-image:url("../assets/img_xl/combo_bomb_font.png");background-repeat:no-repeat}

/* background.sc.lua is started for both the menu scene and the game scene.
   Keep its day and night layers alive underneath the corresponding UI. */
#app:not(.daytime) #ambient-scenery{display:block}
#app:has(#game.active) #ambient-scenery{display:block}
#ambient-scenery .ambient-beach,#ambient-scenery .ambient-island,#ambient-scenery .ambient-island-reflection,#ambient-scenery .ambient-moon,#ambient-scenery .ambient-moon-reflection,#ambient-scenery .ambient-star{position:absolute;display:block;pointer-events:none;background:center/contain no-repeat}
#ambient-scenery .ambient-beach{z-index:1;right:0;bottom:96px;left:0;height:230px;background-image:url("../assets/img_xl/beach_adornment.png");background-size:100% auto}
#ambient-scenery .ambient-island{z-index:3;right:40.5px;top:124.5px;width:359px;height:87px;background-image:url("../assets/img_xl/island_n.png")}
#ambient-scenery .ambient-island-reflection{z-index:2;right:40.5px;top:190.5px;width:359px;height:87px;opacity:.2;background-image:url("../assets/img_xl/island_n.png");transform:scaleY(-.7);transform-origin:center center}
#app.daytime #ambient-scenery .ambient-island{background-image:url("../assets/img_xl/island.png")}
#app.daytime #ambient-scenery .ambient-island-reflection{top:191.5px;background-image:url("../assets/img_xl/island.png")}
#ambient-scenery .ambient-moon{z-index:2;left:14.6%;top:13%;width:204px;height:213px;background-image:url("../assets/img_xl/the_moon.png")}
#ambient-scenery .ambient-moon-reflection{z-index:1;left:14.6%;top:39.1%;width:470px;height:275px;opacity:0}
#ambient-scenery .reflection-one{background-image:url("../assets/img_xl/moon_reflection1.png");animation:ambient-moon-reflection-one 6s linear infinite}
#ambient-scenery .reflection-two{background-image:url("../assets/img_xl/moon_reflection2.png");animation:ambient-moon-reflection-two 6s linear infinite}
#ambient-scenery .reflection-three{background-image:url("../assets/img_xl/moon_reflection3.png");animation:ambient-moon-reflection-three 6s linear infinite}
@keyframes ambient-moon-reflection-one{0%,66.66%,100%{opacity:0}33.33%{opacity:1}}
@keyframes ambient-moon-reflection-two{0%,33.33%,100%{opacity:0}66.66%{opacity:1}}
@keyframes ambient-moon-reflection-three{0%{opacity:1}33.33%,66.66%{opacity:0}100%{opacity:1}}
#ambient-scenery .ambient-star{z-index:2;width:14px;height:15px;opacity:0;background-image:url("../assets/img_xl/star2.png")}
#ambient-scenery .star-one{left:29.3%;top:13%;animation:ambient-star-one 6s ease-in-out infinite}
#ambient-scenery .star-two{left:36.6%;top:2.6%;animation:ambient-star-two 5.4s ease-in-out infinite}
#ambient-scenery .star-three{left:65.9%;top:10.4%;animation:ambient-star-three 6.6s ease-in-out infinite}
#ambient-scenery .star-four{left:47.6%;top:18.2%;animation:ambient-star-four 5.8s ease-in-out infinite}
#ambient-scenery .star-five{left:56.4%;top:5.2%;animation:ambient-star-five 6.2s ease-in-out infinite}
@keyframes ambient-star-one{0%,100%{opacity:0}50%{opacity:1}}@keyframes ambient-star-two{0%,100%{opacity:0}50%{opacity:.9}}@keyframes ambient-star-three{0%,100%{opacity:0}50%{opacity:1}}@keyframes ambient-star-four{0%,100%{opacity:0}50%{opacity:.85}}@keyframes ambient-star-five{0%,100%{opacity:0}50%{opacity:1}}
#app.daytime #ambient-scenery .ambient-moon,#app.daytime #ambient-scenery .ambient-moon-reflection,#app.daytime #ambient-scenery .ambient-star{display:none}
#app:not(.daytime) #ambient-scenery .ambient-beach,#app:not(.daytime) #ambient-scenery .ambient-cloud,#app:not(.daytime) #ambient-scenery .ambient-cloud-reflection,#app:not(.daytime) #ambient-scenery .ambient-boat,#app:not(.daytime) #ambient-scenery .ambient-gull{display:none}

/* Exact ui_xl_d.xgg placement, expressed in the 1280 × 800 scene. */
#ambient-scenery .ambient-cloud,#ambient-scenery .ambient-cloud-reflection{z-index:0;width:1280px;height:179px;left:0;opacity:.45;background-size:1280px 179px}
#ambient-scenery .ambient-cloud.cloud-one,#ambient-scenery .ambient-cloud.cloud-two,#ambient-scenery .ambient-cloud.cloud-three{top:13px;opacity:1}
#ambient-scenery .ambient-cloud-reflection{top:166px;opacity:.196;transform:scaleY(-.7);transform-origin:center center}
#ambient-scenery .cloud-one{background-image:url("../assets/img_xl/background_cloud_1.png")}
#ambient-scenery .cloud-two{background-image:url("../assets/img_xl/background_cloud_2.png")}
#ambient-scenery .cloud-three{background-image:url("../assets/img_xl/background_cloud_3.png")}
#ambient-scenery .ambient-cloud.cloud-one,#ambient-scenery .ambient-cloud-reflection.cloud-one{animation:ambient-cloud-one 1081s linear infinite}
#ambient-scenery .ambient-cloud.cloud-two,#ambient-scenery .ambient-cloud-reflection.cloud-two{animation:ambient-cloud-two 1081s linear infinite}
#ambient-scenery .ambient-cloud.cloud-three,#ambient-scenery .ambient-cloud-reflection.cloud-three{animation:ambient-cloud-three 1531s linear infinite}
@keyframes ambient-cloud-one{0%{left:0}49.95%{left:-1280px}50%{left:1280px}100%{left:0}}
@keyframes ambient-cloud-two{0%{left:-640px}24.95%{left:-1280px}25%{left:1280px}100%{left:-640px}}
@keyframes ambient-cloud-three{0%{left:640px}76.4%{left:-1280px}76.5%{left:1280px}100%{left:640px}}
#ambient-scenery .ambient-sea{z-index:1}
#ambient-scenery .sea-one{bottom:101px}
#ambient-scenery .sea-two{bottom:128px}
#app.menu-ready:has(#boot.active) #ambient-scenery{display:block}
#ambient-scenery .ambient-beach{z-index:2;bottom:-16px}
#ambient-scenery .ambient-moon,#ambient-scenery .ambient-star{z-index:3}
#ambient-scenery .ambient-moon-reflection{z-index:2}
#ambient-scenery .ambient-boat{z-index:4;width:74px;height:122px;left:calc(50% - 37px);top:169px;bottom:auto;background-size:222px 122px;animation:ambient-boat-frames .8s steps(1,end) infinite,ambient-boat-route 750s linear infinite}
@keyframes ambient-boat-frames{0%,32%{background-position:0 0}33%,65%{background-position:-74px 0}66%,100%{background-position:-148px 0}}
@keyframes ambient-boat-route{0%{left:calc(50% - 37px);transform:scaleX(1)}20%{left:-37px;transform:scaleX(1)}20.01%,60%{left:calc(100% - 37px);transform:scaleX(-1)}100%{left:-37px;transform:scaleX(1)}}
#ambient-scenery .ambient-gull{z-index:5;width:46px;height:32px}
#ambient-scenery .ambient-gull.gull-one{left:1234px;top:104px;animation:ambient-gull-frames 10s steps(1,end) infinite,ambient-gull-one-route 234s linear infinite}
#ambient-scenery .ambient-gull.gull-two{left:0;top:84px;animation:ambient-gull-frames 10s steps(1,end) infinite,ambient-gull-two-route 234s linear infinite}
@keyframes ambient-gull-one-route{0%{left:1234px;top:104px;transform:scale(.5)}4.27%{left:1129px;top:104px}10.68%{left:1001px;top:24px;transform:scale(.25)}19.23%{left:873px;top:24px}25.64%{left:745px;top:77px;transform:scale(.5)}29.91%{left:617px;top:144px}35.04%{left:489px;top:117px}41.45%{left:233px;top:104px;transform:scale(.25)}50%{left:-69px;top:24px}54.27%{left:105px;top:104px;transform:scale(.5) scaleX(-1)}61.54%{left:233px;top:144px}67.95%{left:617px;top:77px;transform:scale(.25) scaleX(-1)}80.77%{left:873px;top:77px}93.59%{left:1303px;top:64px}100%{left:1303px;top:104px;transform:scale(.5) scaleX(-1)}}
@keyframes ambient-gull-two-route{0%{left:0;top:84px;transform:scale(.5) scaleX(-1)}5.13%{left:105px;top:84px}11.54%{left:233px;top:124px}17.95%{left:489px;top:57px;transform:scale(.25) scaleX(-1)}30.77%{left:745px;top:57px}43.59%{left:1001px;top:64px}50%{left:1349px;top:64px;transform:scale(.5) scaleX(-1)}54.27%{left:1129px;top:64px}60.68%{left:1001px;top:24px;transform:scale(.25)}69.23%{left:873px;top:24px}75.64%{left:745px;top:77px;transform:scale(.5)}82.05%{left:617px;top:117px}87.18%{left:489px;top:91px}93.59%{left:233px;top:77px;transform:scale(.25)}100%{left:-69px;top:77px;transform:scale(.5)}}

/* ui_xl.xgg / game_xl.xgg use the native img_xl assets. */
.home-actions{top:7px;gap:0}
.home-icon{width:94px;height:94px}
.left-actions{left:7px}.right-actions{right:7px}
.title-wrap{top:259px}.title-wrap .logo{width:726px}
.play-btn{left:502px;top:430px;width:276px;height:109px}
#modes>.corner-back,#levels>.corner-back,.language-return,.about-return{width:94px;height:94px}
#modes>.corner-back,#levels>.corner-back{left:7px;bottom:7px}

.mode-cards{width:1280px;height:338px;margin:55px 0 0;padding:10px 509px;gap:200px}
.mode-card{flex-basis:262px;width:262px;height:306px}
.mode-card img{left:17px;top:9px;width:227px;height:227px}
.mode-card span{left:20px;bottom:20px;height:30px}
.mode-card .atlas-mode-digit{width:19px;height:30px}
.mode-info{width:740px;height:311px}
.mode-info-title{left:116px;top:44px;max-width:228px;max-height:38px}
.mode-info-copy{top:89px;max-width:622px;max-height:191px}

#levels .level-grid{width:760px;height:640px;grid-template-columns:repeat(6,101px);grid-auto-rows:109px;gap:14px 22px;padding:22px}
.level-btn{width:101px;height:109px}
.level-digits{top:16px}.level-digits i{width:35px;height:44px;background-size:350px 44px;background-position:calc(var(--digit) * -35px) 0}
.level-stars{bottom:9px}.level-stars img{width:25px;height:24px}

.tool-btn[data-action="pause"]{left:0;top:410px;width:94px;height:94px}
.dialog,.dialog.start-dialog,.dialog.icon-picker{width:800px;min-height:515px;background-size:800px 515px}
.dialog .dialog-actions .dialog-icon,.pause-menu .dialog-icon,.failed-dialog .failed-actions .dialog-icon{width:94px;height:94px}
.dialog-icon.resume,.pause-menu .resume{width:136px!important;height:142px!important}
.pause-menu{left:-145px;top:194px;width:411px;height:412px;min-height:0;background-size:411px 412px}
.pause-menu .restart{left:171px;top:9px}
.pause-menu .resume{left:154px;top:135px}.pause-menu .sound{left:273px;top:52px}.pause-menu .music{left:305px;top:159px}
.pause-menu .modes{left:171px;top:313px}.pause-menu .pause-help{left:275px;top:269px}

.atlas-dialog-level{width:22px;height:42px;background-size:242px 42px}
.atlas-dialog-small,.atlas-tutorial-step{width:18px;height:32px;background-size:234px 32px}
#tutorial .tutorial-number{width:18px;height:32px;background-position:calc(var(--digit) * -18px) 0;background-size:234px 32px}
.atlas-combo-digit{width:24px;height:44px;background-size:240px 44px}

#combo-hud{top:13px;right:7px;height:53px}
.combo-progress{right:130px;top:0;width:198px;height:34px;background-size:198px 34px}
.combo-progress i{width:198px;height:34px;background-size:198px 34px}
.combo-bomb-progress{right:0;top:0;width:59px;height:53px;background-size:59px 53px}
.combo-bomb-progress i{width:59px;background-size:59px 53px}

#tutorial .tutorial-card{width:822px;height:563px;background-size:822px 563px}
#tutorial .tutorial-title-art{left:372px;top:40px;width:310px;height:48px}
#tutorial .tutorial-step{left:72px;top:55px;height:32px}
#tutorial .tutorial-lights{left:249px;top:115px;width:84px;height:293px}
#tutorial .tutorial-lights i{left:11px;width:64px;height:64px}
#tutorial .tutorial-lights i:nth-child(1){top:11px}#tutorial .tutorial-lights i:nth-child(2){top:80px}#tutorial .tutorial-lights i:nth-child(3){top:149px}#tutorial .tutorial-lights i:nth-child(4){top:218px}
#tutorial .tutorial-diagram{left:352px;top:162px;width:240px;height:240px}
#tutorial .tutorial-node{width:80px;height:80px}
#tutorial .tutorial-actions #tutorial-back{left:13px;top:215px;width:94px;height:94px}
#tutorial .tutorial-actions #tutorial-next{right:13px;top:215px;width:94px;height:94px}
#tutorial .tutorial-actions #tutorial-replay{left:264px;bottom:13px;width:94px;height:94px}
#tutorial .tutorial-exit{left:464px;bottom:13px;width:94px;height:94px}

.language-option{width:277px;height:95px;background-size:277px 95px}
.language-option .language-font{width:181px;height:41px}
.language-option.selected i{width:295px;height:113px;background-size:295px 113px}
.language-return{left:7px;bottom:7px}
.about-art{width:595px;height:719px}.about-return{bottom:7px}

.start-dialog-title{width:372px}
.start-dialog-stats{gap:91px}.start-dialog-stats img{width:100px;height:100px}
.failed-dialog .failed-heading{inset:0;height:auto}.native-result-dialog .result-heading{left:84px;right:67px;top:46px;height:42px}
.failed-dialog .failed-heading .dialog-level-atlas{left:70px;top:59px}.failed-dialog .failed-heading img{right:67px;top:42px;width:187px;height:36px}.native-result-dialog .result-heading img{right:24px;top:0;width:187px;height:36px}
.failed-dialog .failed-font{left:220px;top:190px;width:360px;height:60px}
.failed-dialog .failed-actions{bottom:73px;padding:0 113px}
.native-result-dialog .result-success-font{left:202px;top:126px;width:397px;height:78px}
.native-result-dialog .result-success-font.finish-font{left:186px;top:146px;width:428px;height:185px}
.native-result-dialog .result-time{left:246px;top:217px;height:37px;gap:24px}
.native-result-dialog .result-time>img{max-width:154px;max-height:32px}
.native-result-dialog .result-stars{left:298px;top:275px;width:205px;height:66px}
.native-result-dialog .result-stars img{width:68px;height:66px}
.native-result-dialog .result-actions{right:84px;bottom:55px;left:84px}

.dialog.icon-picker{padding:72px 84px}
.dialog.icon-picker .icon-picker-title{width:140px;height:45px;margin:6px auto 38px}
.icon-picker-options{gap:34px}.icon-picker-option,.icon-picker-option img{width:170px;height:170px}
.icon-picker-return{left:353px;bottom:31px;width:94px;height:94px}

/* s_ui.sc.lua flyToShow/flyOutBroard: authored controls complete their
   0.4-second Elastic movement before the next page becomes interactive. */
.transition-pressed{pointer-events:none;animation:native-button-press .4s ease-in-out both}
.screen.page-exit-left,.screen.page-exit-right,.screen.page-exit-bottom{z-index:2;display:block;pointer-events:none}
.screen.active.page-enter-top,.screen.active.page-enter-right,.screen.active.page-enter-bottom{z-index:2;pointer-events:none}
.screen.page-exit-left{animation:native-page-out-left .4s cubic-bezier(.65,-.28,.88,.42) both}
.screen.page-exit-right{animation:native-page-out-right .4s cubic-bezier(.65,-.28,.88,.42) both}
.screen.page-exit-bottom{animation:native-page-out-bottom .4s cubic-bezier(.65,-.28,.88,.42) both}
.screen.active.page-enter-top{animation:native-page-in-top .4s cubic-bezier(.14,.78,.28,1.22) both}
.screen.active.page-enter-right{animation:native-page-in-right .4s cubic-bezier(.14,.78,.28,1.22) both}
.screen.active.page-enter-bottom{animation:native-page-in-bottom .4s cubic-bezier(.14,.78,.28,1.22) both}
#home.page-exit-menu,#home.active.page-enter-menu{z-index:2;pointer-events:none}
#home.page-exit-menu .title-wrap{animation:native-control-out-top .4s cubic-bezier(.65,-.28,.88,.42) both}
#home.page-exit-menu .play-btn{animation:native-control-out-bottom .4s cubic-bezier(.65,-.28,.88,.42) both}
#home.page-exit-menu .left-actions{animation:native-control-out-left .4s cubic-bezier(.65,-.28,.88,.42) both}
#home.page-exit-menu .right-actions{animation:native-control-out-right .4s cubic-bezier(.65,-.28,.88,.42) both}
#home.active.page-enter-menu .title-wrap{animation:native-control-in-top .4s cubic-bezier(.14,.78,.28,1.22) both}
#home.active.page-enter-menu .play-btn{animation:native-control-in-bottom .4s cubic-bezier(.14,.78,.28,1.22) both}
#home.active.page-enter-menu .left-actions{animation:native-control-in-left .4s cubic-bezier(.14,.78,.28,1.22) both}
#home.active.page-enter-menu .right-actions{animation:native-control-in-right .4s cubic-bezier(.14,.78,.28,1.22) both}

/* Keep the native background scene alive between UI scenes. Page transitions
   move only the controls; the shared sea, clouds, island and boat never reset. */
.screen.active:not(#boot):not(#loading){z-index:2}
#game.game-layer-pending,#app:has(#game.game-layer-pending) #overlay{visibility:hidden}
#levels.starting-level .level-title-art{animation:native-control-out-top .5s cubic-bezier(.65,-.28,.88,.42) both}
#levels.starting-level>.corner-back,#levels.starting-level .level-grid{animation:native-control-out-left .5s cubic-bezier(.65,-.28,.88,.42) both}
#app.level-loading-transition::after{content:"";position:absolute;z-index:60;inset:0;background:#000;pointer-events:none;animation:native-load-replace .5s linear both}
@keyframes native-load-replace{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
@keyframes native-button-press{0%,100%{transform:scale(1)}50%{transform:scale(1.2)}}
@keyframes native-page-out-left{to{opacity:.2;transform:translateX(-110%)}}
@keyframes native-page-out-right{to{opacity:.2;transform:translateX(110%)}}
@keyframes native-page-out-bottom{to{opacity:.2;transform:translateY(110%)}}
@keyframes native-page-in-top{from{opacity:.2;transform:translateY(-110%)}to{opacity:1;transform:translateY(0)}}
@keyframes native-page-in-right{from{opacity:.2;transform:translateX(110%)}to{opacity:1;transform:translateX(0)}}
@keyframes native-page-in-bottom{from{opacity:.2;transform:translateY(110%)}to{opacity:1;transform:translateY(0)}}
@keyframes native-control-out-top{to{transform:translateY(-900px)}}
@keyframes native-control-out-bottom{to{transform:translateY(900px)}}
@keyframes native-control-out-left{to{transform:translateX(-220px)}}
@keyframes native-control-out-right{to{transform:translateX(220px)}}
@keyframes native-control-in-top{from{transform:translateY(-900px)}to{transform:translateY(0)}}
@keyframes native-control-in-bottom{from{transform:translateY(900px)}to{transform:translateY(0)}}
@keyframes native-control-in-left{from{transform:translateX(-220px)}to{transform:translateX(0)}}
@keyframes native-control-in-right{from{transform:translateX(220px)}to{transform:translateX(0)}}