@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;600&family=Merienda:wght@500;600&family=Playfair+Display:ital,wght@0,600;0,700;1,600&display=swap');
@font-face{font-family:'SVN Gang of Three';src:url('assets/svn-gang-of-three.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap}
:root{color-scheme:light;--gold:#FFA12A;--peach:#F7B561;--cream:#FFE9BD;--ink:#8c411b}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{padding:14px;background:#fff0ce;color:var(--ink);font-family:'Be Vietnam Pro',sans-serif}.festival{height:100%;height:calc(100dvh - 28px);position:relative;isolation:isolate;overflow:hidden;border-radius:25px;background:#f7b561}.sky{position:absolute;inset:0;z-index:-3;background:radial-gradient(ellipse at 50% 43%,#fff2ce 0%,#ffd78b 38%,#f9b750 73%,#ffa12a 100%)}.sky:after{content:'';position:absolute;inset:0;opacity:.12;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%239c602c' filter='url(%23n)' opacity='.45' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}.frame{position:absolute;inset:12px;border:1px solid #fff1c58c;border-radius:18px;z-index:10;pointer-events:none}.frame:after{content:'';position:absolute;inset:5px;border:1px solid #fff1c536;border-radius:13px}.masthead{position:absolute;top:33px;left:43px;right:43px;display:flex;align-items:center;justify-content:space-between;z-index:12}.wordmark{font-size:14px;font-weight:600;letter-spacing:.22em;text-decoration:none;color:var(--ink);display:flex;align-items:center;gap:10px}.brand-moon{font-size:28px;line-height:1}.edition{font-size:11px;letter-spacing:.21em}.edition span{margin:0 13px}.moon{position:absolute;width:min(62vw,82vh);aspect-ratio:1;left:50%;top:49%;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle at 40% 38%,#fff9dd 0%,#fff0b7 58%,#ffe4a2 85%,#fff0bd 100%);box-shadow:0 0 0 1px #fff4ce8a,0 0 38px 18px #fff1b28c,0 0 100px 50px #fff2bb55;z-index:-1}.moon-texture{width:100%;height:100%;border-radius:inherit;opacity:.32;background:radial-gradient(ellipse at 28% 35%,#dba75c33,transparent 17%),radial-gradient(ellipse at 75% 68%,#dba75c33,transparent 23%),radial-gradient(ellipse at 53% 16%,#ffefcc,transparent 30%)}.hero{position:absolute;top:22%;left:50%;transform:translateX(-50%);width:65%;text-align:center;z-index:4}.eyebrow{display:flex;align-items:center;justify-content:center;gap:16px;font-size:12px;font-weight:500;letter-spacing:.36em;margin:0 0 10px}.eyebrow span{width:34px;height:1px;background:#ae682c78}h1{font-family:'Great Vibes','Playfair Display',serif;font-weight:400;margin:0;color:#b9511b;text-shadow:0 2px #fff0ba,0 5px 15px #b75b1224;line-height:1.02}h1>span{display:block;font-size:clamp(70px,10vw,165px)}h1 .title-second{font-size:clamp(64px,8.7vw,140px);position:relative;margin-top:-5px}.seal{display:inline-block;font-style:normal;font-family:serif;font-size:15px;line-height:1.3;padding:8px 5px;margin-left:18px;vertical-align:middle;border:1px solid #b34e25;border-radius:4px;color:#b34e25;transform:rotate(5deg);text-shadow:none}.wish{font-family:'Playfair Display',serif;font-style:italic;font-size:clamp(14px,1.3vw,20px);margin:15px 0 5px;color:#985623}.ornament{font-size:16px;color:#be823d;margin-top:10px;letter-spacing:7px}.cloud{position:absolute;pointer-events:none;object-fit:contain;z-index:2;animation:drift 8s ease-in-out infinite}.cloud-left{width:29%;left:-6%;top:23%;--rotation:-6deg;opacity:.9}.cloud-right{width:23%;right:-4%;top:45%;animation-delay:-3s;--rotation:8deg}.cloud-back{width:17%;right:17%;top:11%;opacity:.7;animation-duration:11s}.goddess{position:absolute;height:43%;width:30%;object-fit:contain;right:6%;top:13%;z-index:5;transform-origin:50% 75%;animation:sway 7s ease-in-out infinite;filter:drop-shadow(0 10px 16px #b77c1620)}.landscape{position:absolute;bottom:0%;left:50%;transform:translateX(-50%);width:76%;height:46%;object-fit:contain;object-position:center bottom;z-index:3}.foreground{z-index:6;width:55%;bottom:-14%;height:45%;object-fit:fill;animation-duration:10s}.foreground-left{left:-17%;--rotation:7deg}.foreground-right{right:-17%;--rotation:-8deg;animation-delay:-4s}footer{position:absolute;bottom:28px;left:43px;right:43px;display:flex;align-items:center;justify-content:space-between;z-index:12}footer>span{font-size:9px;letter-spacing:.23em}button{border:1px solid #aa692d55;border-radius:50px;background:#fff0c27a;color:#884820;display:flex;align-items:center;gap:8px;padding:9px 13px;font:inherit;font-size:11px;cursor:pointer;backdrop-filter:blur(6px)}button:hover{background:#fff1c9}button:focus-visible,a:focus-visible{outline:2px solid #8c411b;outline-offset:5px}#particles{position:absolute;inset:0;pointer-events:none;z-index:2}.particle{position:absolute;width:3px;height:3px;background:#fff9df;border-radius:50%;box-shadow:0 0 7px 2px #fff6c5;animation:twinkle var(--duration) ease-in-out infinite;animation-delay:var(--delay)}.paused *{animation-play-state:paused!important}@keyframes drift{0%,100%{transform:translateY(0) rotate(var(--rotation,0deg))}50%{transform:translateY(-17px) rotate(var(--rotation,0deg))}}@keyframes sway{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-13px) rotate(3deg)}}@keyframes twinkle{0%,100%{opacity:.12;transform:translateY(6px) scale(.6)}50%{opacity:.85;transform:translateY(-9px) scale(1)}}
@media(min-aspect-ratio:18/10){.hero{top:18%}h1>span{font-size:18vh}h1 .title-second{font-size:16vh}.wish{margin-top:8px}.landscape{height:43%}.goddess{right:12%;height:45%}}
@media(max-width:700px){body{padding:8px}.festival{height:calc(100dvh - 16px);border-radius:20px}.frame{inset:8px}.masthead{top:26px;left:25px;right:25px;justify-content:center}.edition{display:none}.wordmark{font-size:12px}.moon{width:115%;top:44%}.hero{width:100%;top:25%}.eyebrow{font-size:9px;letter-spacing:.24em;gap:10px}h1>span{font-size:25vw}h1 .title-second{font-size:21vw}.seal{font-size:10px;margin-left:6px;padding:5px 3px}.wish{font-size:14px;margin-top:16px}.ornament{margin-top:12px}.goddess{width:43%;height:26%;top:8%;right:1%}.cloud-back{width:46%;left:-10%;top:12%}.cloud-left{width:54%;left:-24%;top:39%}.cloud-right{width:48%;right:-24%;top:50%}.landscape{width:145%;height:39%;bottom:3%}.foreground{width:90%;height:30%;bottom:-6%}.foreground-left{left:-38%}.foreground-right{right:-38%}footer{bottom:23px;left:25px;right:25px}footer>span{font-size:8px;letter-spacing:.08em;max-width:190px;line-height:1.8}.motion-label{display:none}button{font-size:15px;width:32px;height:32px;justify-content:center;padding:0}}
@media(max-height:550px){.masthead{top:20px}.hero{top:19%}.eyebrow{font-size:9px;margin-bottom:4px}h1>span{font-size:19vh}h1 .title-second{font-size:17vh}.wish{font-size:12px;margin:5px 0}.ornament{display:none}footer{bottom:20px}.landscape{height:39%}}
@media(prefers-reduced-motion:reduce){*{animation:none!important}}
@media(min-width:701px) and (max-aspect-ratio:18/10){.landscape{height:39%}}
/* A denser cloud foreground and a softly weathered moon. */
.seal{font-family:'Be Vietnam Pro',sans-serif;font-size:9px;line-height:1.6;font-weight:600;letter-spacing:.04em;padding:8px 5px}
.moon{box-shadow:0 0 0 2px #fff3cfaa,0 0 25px 14px #fff2c0bb,0 0 70px 35px #fff0b98c,0 0 120px 55px #ffedb13d;background:#f6ebd3}
.moon-texture{background:radial-gradient(ellipse at 30% 36%,#a29d9270,transparent 26%),radial-gradient(ellipse at 70% 60%,#9d9a9066,transparent 28%),radial-gradient(ellipse at 55% 17%,#b3b0a74f,transparent 22%);opacity:.55}
.moon:before{content:'';position:absolute;inset:-11%;border-radius:50%;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff4d0' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E");opacity:.38;mix-blend-mode:multiply;mask-image:radial-gradient(circle,transparent 47%,#0009 58%,#000 61%,transparent 71%)}
.moon:after{content:'';position:absolute;inset:0;border-radius:50%;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath filter='url(%23g)' opacity='.5' d='M0 0h160v160H0z'/%3E%3C/svg%3E");opacity:.18;mix-blend-mode:multiply;pointer-events:none}
.particle{box-shadow:0 0 5px 1px #fff5cc}
.foreground-left,.foreground-right{bottom:-9%;height:39%;width:63%}.foreground-left{left:-20%}.foreground-right{right:-20%}
.foreground-center{width:62%;height:24%;left:19%;bottom:-8%;z-index:7;object-fit:fill;animation-duration:12s;animation-delay:-3s}
@media(max-width:700px){.foreground-left,.foreground-right{width:104%;height:28%;bottom:-4%}.foreground-left{left:-46%}.foreground-right{right:-46%}.foreground-center{width:115%;height:19%;left:-7.5%;bottom:-5%}.seal{font-size:7px}.goddess{right:3%;top:9%}}
.moon-texture{background:url('assets/moon.webp') center/106% 106% no-repeat;opacity:.32;filter:grayscale(.5);mask-image:radial-gradient(circle,#000 64%,transparent 71%)}
.landscape{bottom:3%;width:82%}
@media(max-width:700px){.landscape{width:137%;bottom:7%;height:34%}}
@media(max-width:700px){.foreground-left,.foreground-right{height:24%;bottom:-7%}.foreground-left{left:-58%}.foreground-right{right:-58%}.goddess{height:23%;top:6%;right:1%}}

/* Artistic Vietnamese title set in a legible Google display typeface. */
.festival-title{font-family:'SVN Gang of Three','Merienda','Playfair Display',serif;font-weight:400;line-height:.92;color:#b94716;-webkit-text-stroke:1px #8f3510;text-shadow:0 2px 0 #ffe9bd,0 5px 0 #f7b561,0 10px 20px #8c411b3d;letter-spacing:-.03em}
.festival-title>span{font-size:clamp(42px,5.2vw,86px);white-space:nowrap}
.festival-title .title-second{font-size:clamp(66px,8.3vw,136px);margin-top:.02em;white-space:nowrap}
@media(min-aspect-ratio:18/10){.festival-title>span{font-size:10.5vh}.festival-title .title-second{font-size:17vh}}
@media(max-width:700px){.festival-title{letter-spacing:-.045em}.festival-title>span{font-size:13.5vw}.festival-title .title-second{font-size:20vw;margin-top:.02em}}
@media(max-height:550px){.festival-title>span{font-size:11vh}.festival-title .title-second{font-size:18vh}}

/* Compact event plaque framed by the existing illustrated clouds. */
.event-details{position:relative;isolation:isolate;width:min(290px,64%);min-height:46px;margin:9px auto 0;padding:8px 50px;display:flex;align-items:center;justify-content:center;gap:22px;border:1px solid #c9813473;border-radius:12px;background:linear-gradient(180deg,#fff3cfda,#ffe9bdad);box-shadow:inset 0 0 0 3px #fff4d766,0 5px 18px #a7571721;color:#8c411b}
.event-details:before,.event-details:after{content:'';position:absolute;width:11px;height:11px;border:1px solid #bf702d;top:50%;background:#ffe8b8;transform:translateY(-50%) rotate(45deg);z-index:-1}
.event-details:before{left:-6px}.event-details:after{right:-6px}
.event-item{display:flex;flex-direction:column;align-items:center;min-width:115px;line-height:1.1}
.event-item span{font-size:8px;font-weight:600;letter-spacing:.2em;color:#a6682f;margin-bottom:5px}
.event-item strong{font-family:'Be Vietnam Pro',sans-serif;font-size:14px;font-weight:600;letter-spacing:.08em;white-space:nowrap}
.event-details>i{display:block;width:1px;height:30px;background:linear-gradient(transparent,#b96d2caa,transparent)}
.event-cloud{position:absolute;width:94px;height:55px;object-fit:contain;top:2px;z-index:-1;opacity:.96;pointer-events:none}
.event-cloud-left{left:-48px}.event-cloud-right{right:-48px;transform:scaleX(-1)}
@media(max-width:700px){.event-details{width:min(230px,58%);min-height:36px;margin-top:9px;padding:5px 14px;gap:8px;border-radius:9px}.event-item{min-width:76px}.event-item span{font-size:7px}.event-item strong{font-size:9.5px;letter-spacing:.05em}.event-details>i{height:27px}.event-cloud{width:74px;height:48px;top:4px}.event-cloud-left{left:-39px}.event-cloud-right{right:-39px}}
@media(max-height:550px){.event-details{min-height:42px;margin-top:5px;padding-top:4px;padding-bottom:4px}.event-item span{margin-bottom:3px}.event-cloud{height:40px}}
/* Fuller festival scene; clean moon glow without grain or particles. */
.moon:before,.moon:after{display:none}
.moon{width:min(59vw,77vh);box-shadow:0 0 28px 18px #fff2c0b0,0 0 80px 40px #fff0b97a,0 0 130px 55px #ffedb13d}
.moon-texture{opacity:.25}
.moon-texture{animation:moon-rotation 105s linear infinite;transform-origin:50% 50%;will-change:transform}
.moon:after{display:block;content:'';position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 39% 34%,transparent 48%,#806b4b12 70%,#55432932 100%);opacity:1;mix-blend-mode:multiply;pointer-events:none;box-shadow:inset -18px -12px 36px #6c553022}
@keyframes moon-rotation{from{transform:rotate(0deg) scale(1.025)}to{transform:rotate(360deg) scale(1.025)}}
.landscape{width:106%;height:49%;bottom:0}
.hero{top:18%}
.cloud-left{width:35%;left:-9%;top:25%}.cloud-right{width:31%;right:-8%;top:40%}
.cloud-mid-left{width:26%;left:5%;top:46%;animation-delay:-4s;--rotation:-8deg}
.cloud-mid-right{width:24%;right:6%;top:58%;animation-delay:-2s;--rotation:6deg}
.cloud-top{width:19%;left:26%;top:9%;opacity:.72;animation-duration:12s}
.cloud-low-left{width:39%;left:-8%;bottom:15%;z-index:4;animation-delay:-5s}
.cloud-low-right{width:38%;right:-9%;bottom:14%;z-index:4;animation-delay:-3s}
.foreground-left,.foreground-right{width:73%;height:43%;bottom:-12%}.foreground-left{left:-25%}.foreground-right{right:-25%}
.foreground-center{width:75%;height:27%;left:12.5%;bottom:-9%}
.lantern{position:absolute;object-fit:contain;pointer-events:none;z-index:1;animation:lantern-float 9s ease-in-out infinite;filter:drop-shadow(0 5px 14px #ffe9bd44)}
.lantern-one{width:8%;height:17%;left:11%;top:7%;--tilt:-12deg}
.lantern-two{width:4%;height:9%;left:28%;top:6%;--tilt:9deg;animation-delay:-4s}
.lantern-three{width:3%;height:7%;left:5%;top:30%;--tilt:-8deg;animation-delay:-2s}
.lantern-four{width:7%;height:14%;right:12%;top:7%;--tilt:13deg;animation-delay:-5s}
.lantern-five{width:3.5%;height:8%;right:5%;top:25%;--tilt:-7deg;animation-delay:-1s}
.lantern-six{width:2.5%;height:6%;right:4%;top:7%;--tilt:8deg;animation-delay:-7s}
@keyframes lantern-float{0%,100%{transform:translateY(0) rotate(var(--tilt))}50%{transform:translateY(-12px) rotate(calc(var(--tilt) + 5deg))}}
@media(min-width:701px) and (max-aspect-ratio:18/10){.landscape{height:47%}}
@media(min-aspect-ratio:18/10){.landscape{height:47%}.hero{top:16%}}
@media(max-width:700px){.moon{width:111%;top:44%}.hero{top:25%}.landscape{width:157%;height:39%;bottom:5%}.cloud-left{width:64%;left:-33%;top:36%}.cloud-right{width:58%;right:-33%;top:45%}.cloud-mid-left{width:43%;left:-23%;top:54%}.cloud-mid-right{width:41%;right:-19%;top:60%}.cloud-top{width:32%;left:5%;top:19%}.cloud-low-left{width:59%;left:-40%;bottom:15%}.cloud-low-right{width:59%;right:-40%;bottom:15%}.foreground-left,.foreground-right{width:111%;height:26%;bottom:-7%}.foreground-left{left:-64%}.foreground-right{right:-64%}.foreground-center{width:126%;left:-13%;height:21%;bottom:-6%}.lantern-one{width:15%;height:12%;left:9%;top:8%}.lantern-two{width:7%;height:7%;left:37%;top:9%}.lantern-three{width:6%;height:6%;left:2%;top:26%}.lantern-four{width:9%;height:8%;right:4%;top:5%}.lantern-five{width:6%;height:5%;right:1%;top:32%}.lantern-six{display:none}}

/* Full-bleed scene with playful jade rabbits. */
body{padding:0;background:#f7b561}
.festival{height:100dvh;border-radius:0}
.rabbit-play{position:absolute;object-fit:contain;pointer-events:none;z-index:5;filter:drop-shadow(0 9px 14px #8c411b24);will-change:transform}
.rabbit-carry{width:10.5%;left:6.5%;top:45%;animation:rabbit-hop 5.8s ease-in-out infinite}
.rabbit-roll{width:17.5%;right:4%;top:53%;animation:rabbit-roll 7s ease-in-out infinite}
.rabbit-peek{width:12%;left:22%;bottom:11%;z-index:7;animation:rabbit-peek 6.4s ease-in-out infinite}
@keyframes rabbit-hop{0%,100%{transform:translateY(0) rotate(-5deg)}45%{transform:translateY(-12px) rotate(2deg)}60%{transform:translateY(-8px) rotate(-1deg)}}
@keyframes rabbit-roll{0%,100%{transform:translateX(0) rotate(0)}50%{transform:translateX(12px) rotate(1.5deg)}}
@keyframes rabbit-peek{0%,100%{transform:translateY(5px) rotate(-2deg)}50%{transform:translateY(-7px) rotate(2deg)}}
@media(max-width:700px){body{padding:0}.festival{height:100dvh;border-radius:0}.rabbit-carry{width:19%;left:1%;top:51%}.rabbit-roll{width:29%;right:-3%;top:58%}.rabbit-peek{width:21%;left:16%;bottom:13%}}
@media(max-height:550px){.rabbit-carry{width:9%;top:43%}.rabbit-roll{width:15%;top:50%}.rabbit-peek{width:10%;bottom:9%}}

/* Coral-red cloud ribbons echo the painted edge flourishes in the reference. */
.red-cloud-ribbon{position:absolute;height:74%;width:auto;top:27%;z-index:2;object-fit:contain;pointer-events:none;opacity:.88;filter:saturate(.92);animation:ribbon-breathe 10s ease-in-out infinite;transform-origin:50% 70%}
.ribbon-left{left:-8%;--ribbon-scale:1}
.ribbon-right{right:-8%;--ribbon-scale:-1;animation-delay:-5s}
@keyframes ribbon-breathe{0%,100%{transform:scaleX(var(--ribbon-scale)) translateY(0) rotate(-1deg)}50%{transform:scaleX(var(--ribbon-scale)) translateY(-10px) rotate(1deg)}}
@media(max-width:700px){.red-cloud-ribbon{height:56%;top:44%;opacity:.82}.ribbon-left{left:-24%}.ribbon-right{right:-24%}}
@media(max-height:550px){.red-cloud-ribbon{height:68%;top:31%}}

/* Mid-Autumn game chooser. */
.explore-button{position:relative;display:inline-flex;width:max-content;white-space:nowrap;margin:9px auto 0;padding:10px 28px;border:1px solid #8c411b;border-radius:4px;background:linear-gradient(180deg,#d55d22,#ad3b17);box-shadow:inset 0 0 0 2px #f7b561,0 5px 14px #8c411b35;color:#fff4d2;font-family:'Be Vietnam Pro',sans-serif;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;transition:transform .25s ease,box-shadow .25s ease}
.explore-button:before,.explore-button:after{content:'';position:absolute;top:50%;width:9px;height:9px;background:#d55d22;border:1px solid #8c411b;transform:translateY(-50%) rotate(45deg);z-index:-1}.explore-button:before{left:-6px}.explore-button:after{right:-6px}.explore-button span{color:#ffd98a;margin:0 5px}.explore-button:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 2px #ffd98a,0 8px 18px #8c411b42}.explore-button:focus-visible{outline:3px solid #fff0bd;outline-offset:4px}
.game-dialog{width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:transparent;overflow:hidden;color:#fff}.game-dialog::backdrop{background:#35150bbb;backdrop-filter:blur(9px) saturate(.8)}
.game-shell{position:absolute;inset:0;display:flex;flex-direction:column;padding:20px;border:0;border-radius:0;background:linear-gradient(150deg,#4e1b12f2,#7a2f17e8);overflow:hidden}
.game-shell:before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.14;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath filter='url(%23n)' d='M0 0h120v120H0z'/%3E%3C/svg%3E")}
.game-header{position:relative;z-index:2;display:flex;align-items:center;justify-content:flex-start;gap:15px;padding:0 4px 16px}.game-back{flex:0 0 auto;display:flex;width:43px;height:43px;padding:0;align-items:center;justify-content:center;border:1px solid #ffd78c80;border-radius:50%;background:#fff0c214;color:#ffe9bd;font:400 22px/1 sans-serif;cursor:pointer}.game-back:hover{background:#fff0c22b}.game-back:focus-visible{outline:3px solid #ffe9bd;outline-offset:3px}.game-header span{font-size:9px;font-weight:600;letter-spacing:.28em;color:#f7b561}.game-header h2{margin:2px 0 0;font-family:'SVN Gang of Three','Be Vietnam Pro',sans-serif;font-size:clamp(25px,3vw,44px);font-weight:400;letter-spacing:.02em;color:#ffe9bd;text-transform:uppercase}
.game-stripes{--slash:clamp(46px,5vw,72px);position:relative;z-index:1;display:flex;flex:1;min-height:0;overflow:hidden;border-radius:15px;background:#4c1b12;isolation:isolate}.game-card{position:relative;flex:1 1 0;min-width:0;margin-left:calc(var(--slash) * -1);padding:32px 7% 34px;border:0;border-radius:0;clip-path:polygon(var(--slash) 0,100% 0,calc(100% - var(--slash)) 100%,0 100%);background-position:center;background-size:cover;backdrop-filter:none;-webkit-backdrop-filter:none;color:#fff;text-align:left;cursor:pointer;overflow:hidden;transition:flex .55s cubic-bezier(.2,.8,.2,1),filter .45s ease,background-size .7s ease}.game-card:first-child{margin-left:0;clip-path:polygon(0 0,100% 0,calc(100% - var(--slash)) 100%,0 100%)}.game-card:last-of-type{clip-path:polygon(var(--slash) 0,100% 0,100% 100%,0 100%)}
.game-card:before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#170a0320 18%,#1c09037a 60%,#160704e8 100%);transition:background .45s ease}.game-card:after{content:'';position:absolute;inset:0;border:1px solid #ffe4a557;pointer-events:none}.game-card-one{background:#b94a1b}.game-card-two{background:#176b73}.game-card-three{background:#69345e}
.game-card:before{z-index:1}.game-card:after{z-index:3}.game-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:0;transition:transform .7s ease}.game-card.is-active .game-art{transform:scale(1.07)}.game-card-two.is-active .game-art{transform:scale(1.015)}
.stripe-cloud{position:absolute;top:48%;width:clamp(105px,12vw,170px);height:auto;z-index:5;pointer-events:none;opacity:.96;filter:drop-shadow(0 6px 10px #5a1d1245);transform:translate(-50%,-50%);transition:opacity .25s ease}.stripe-cloud-one{left:33.333%}.stripe-cloud-two{left:66.666%}.game-stripes:has(.game-card.is-active) .stripe-cloud{opacity:0}
.game-stripes:has(.game-card.is-active) .game-card:not(.is-active){flex:.58;filter:saturate(.6) brightness(.62)}.game-card.is-active{flex:2.2;background-size:auto 108%}.game-card.is-active:before{background:linear-gradient(180deg,#170a0308 15%,#1c09034f 61%,#160704df 100%)}
.game-number,.game-name,.game-status{position:relative;z-index:2;display:block;text-shadow:0 3px 15px #200900aa}.game-number{font:600 11px/1 'Be Vietnam Pro',sans-serif;letter-spacing:.2em;color:#ffe2a1}.game-name{position:absolute;left:10%;right:9%;bottom:64px;font-family:'SVN Gang of Three','Be Vietnam Pro',sans-serif;font-size:clamp(25px,3.2vw,50px);line-height:.95;text-transform:uppercase}.game-status{position:absolute;left:10%;bottom:31px;font:600 9px/1 'Be Vietnam Pro',sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#ffd991}.game-card:focus-visible{outline:4px solid #ffe9bd;outline-offset:-6px}
@media(min-width:701px){.hero{top:14%}}
@media(max-width:700px){.explore-button{margin-top:8px;padding:9px 21px;font-size:9px}.game-shell{padding:12px}.game-header{gap:10px;padding:1px 3px 10px}.game-header h2{font-size:23px}.game-back{width:36px;height:36px;font-size:19px}.game-stripes{--slash:34px;width:100%;flex-direction:column;align-items:stretch}.game-card{width:100%;max-width:none;align-self:stretch;margin:calc(var(--slash) * -1) 0 0;clip-path:polygon(0 var(--slash),100% 0,100% calc(100% - var(--slash)),0 100%);padding:24px 23px;min-height:0}.game-card:first-child{margin-top:0;clip-path:polygon(0 0,100% 0,100% calc(100% - var(--slash)),0 100%)}.game-card:last-of-type{clip-path:polygon(0 var(--slash),100% 0,100% 100%,0 100%)}.game-stripes:has(.game-card.is-active) .game-card:not(.is-active){flex:.65}.game-card.is-active{flex:2}.game-name{left:23px;bottom:41px;font-size:31px}.game-status{left:23px;bottom:20px;font-size:8px}.game-number{font-size:9px}.stripe-cloud{width:100px;left:50%;top:auto}.stripe-cloud-one{top:33.333%}.stripe-cloud-two{top:66.666%}}

/* Bách Phát Bánh Trăng — full-screen offline game. */
.moon-game-dialog{width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:#250706;color:#fff;overflow:hidden}.moon-game-dialog::backdrop{background:#190403ed}.moon-game-shell{position:relative;display:flex;flex-direction:column;width:100%;height:100%;overflow:hidden;background:radial-gradient(circle at 50% 36%,#7e2315 0,#3a0b09 58%,#210504 100%)}.moon-game-shell:before{content:'';position:absolute;inset:0;opacity:.1;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath filter='url(%23n)' d='M0 0h120v120H0z'/%3E%3C/svg%3E")}.moon-game-header{position:relative;z-index:5;flex:0 0 auto;display:grid;grid-template-columns:48px 1fr 48px;align-items:center;gap:15px;width:min(100%,760px);margin:0 auto;padding:13px 20px 11px}.moon-game-heading{text-align:center}.moon-game-heading>span{display:block;margin-bottom:2px;color:#e9a755;font-size:8px;font-weight:600;letter-spacing:.26em}.moon-game-heading h2{margin:0;color:#ffe5a8;font-family:'SVN Gang of Three','Be Vietnam Pro',sans-serif;font-size:clamp(20px,3vw,30px);font-weight:400;line-height:1.05;text-transform:uppercase}.moon-game-back,.moon-game-close{display:flex;width:42px;height:42px;padding:0;align-items:center;justify-content:center;border:1px solid #ffd28a55;border-radius:50%;background:#fff4cf0c;color:#ffe5a8;backdrop-filter:blur(8px)}.moon-game-back{font-size:22px}.moon-game-close{font:300 30px/1 sans-serif}.moon-game-back:hover,.moon-game-close:hover{background:#fff4cf1f}.moon-game-stage{position:relative;isolation:isolate;flex:0 1 auto;width:min(100%,calc((100dvh - 73px) * .6885));max-height:calc(100dvh - 73px);aspect-ratio:420/610;margin:auto;overflow:hidden;border:1px solid #ffd69269;border-radius:24px 24px 0 0;background:#67150e;box-shadow:0 18px 70px #100201aa,inset 0 0 0 5px #ffe2a90a}.moon-game-stage:after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 60px #24040380,inset 0 0 0 5px #ffe5a80d}.moon-game-stage canvas{position:absolute;inset:0;z-index:0;width:100%;height:100%;display:block;touch-action:none}.moon-game-hud{position:absolute;z-index:3;top:14px;left:14px;right:14px;display:grid;grid-template-columns:1fr 1.3fr 1fr;align-items:stretch;border:1px solid #ffe0a963;border-radius:13px;background:linear-gradient(180deg,#49100dc7,#260605b8);box-shadow:0 7px 23px #2504026b;backdrop-filter:blur(8px)}.moon-game-hud>div{position:relative;display:flex;min-height:54px;flex-direction:column;align-items:center;justify-content:center}.moon-game-hud>div+div:before{content:'';position:absolute;left:0;top:12px;bottom:12px;width:1px;background:linear-gradient(transparent,#f9c86e77,transparent)}.moon-game-hud span{font-size:7px;font-weight:600;letter-spacing:.2em;color:#eebd73}.moon-game-hud strong{margin-top:3px;color:#fff0bc;font-family:'SVN Gang of Three','Be Vietnam Pro',sans-serif;font-size:21px;font-weight:400;line-height:1}.moon-game-hud .moon-score strong{font-size:28px}.moon-timer.is-urgent strong{color:#ff8269;animation:timer-pulse .6s ease-in-out infinite alternate}@keyframes timer-pulse{to{transform:scale(1.08)}}.moon-game-progress{position:absolute;z-index:3;left:18px;right:18px;bottom:104px;display:flex;align-items:center;justify-content:space-between;gap:12px;color:#ffe5ac;font-size:9px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;text-shadow:0 2px 8px #2a0403}.moon-progress-dots{display:flex;gap:5px}.moon-progress-dots i{display:block;width:8px;height:8px;border:1px solid #ffd58599;border-radius:50%;background:#2f07069e;box-shadow:0 1px 5px #160201}.moon-progress-dots i.is-done{border-color:#fff1b0;background:#f5a63c;box-shadow:0 0 10px #ffc85c}.moon-throw-button{position:absolute;z-index:3;left:50%;bottom:46px;transform:translateX(-50%);display:flex;width:auto;height:43px;padding:0 20px;align-items:center;justify-content:center;white-space:nowrap;border:1px solid #ffd98c;border-radius:5px;background:linear-gradient(180deg,#e26a29,#aa2f17);box-shadow:inset 0 0 0 2px #f9a14c,0 7px 17px #2c05056e;color:#fff2c2;font-family:'Be Vietnam Pro',sans-serif;font-size:10px;font-weight:600;letter-spacing:.13em}.moon-throw-button:hover{background:linear-gradient(180deg,#ec7934,#bd3a1c)}.moon-throw-button.is-fired{animation:throw-click .18s ease}@keyframes throw-click{50%{transform:translateX(-50%) translateY(3px) scale(.97)}}.moon-key{margin-left:5px;padding:4px 6px;border:1px solid #ffe4a065;border-radius:3px;background:#52100c88;color:#ffd88b;font-size:7px;letter-spacing:.08em}.moon-game-tip{position:absolute;z-index:3;left:10px;right:10px;bottom:15px;margin:0;color:#e8c795b5;font-size:8px;letter-spacing:.06em;text-align:center}.moon-game-overlay{position:absolute;inset:0;z-index:8;display:flex;align-items:center;justify-content:center;padding:24px;background:linear-gradient(180deg,#2b0504b5,#270504e8);backdrop-filter:blur(8px);opacity:0;visibility:hidden;transition:opacity .28s ease,visibility .28s ease}.moon-game-overlay.is-visible{opacity:1;visibility:visible}.moon-overlay-card{width:min(100%,365px);padding:31px 27px 26px;border:1px solid #ffd98d7d;border-radius:18px;background:linear-gradient(155deg,#6d1d14e8,#3a0a08f2);box-shadow:inset 0 0 0 4px #ffe0a70c,0 22px 50px #1402018f;text-align:center}.moon-overlay-kicker{display:block;color:#eca953;font-size:8px;font-weight:600;letter-spacing:.25em}.moon-overlay-card h3{margin:9px 0 12px;color:#ffe9b5;font-family:'SVN Gang of Three','Be Vietnam Pro',sans-serif;font-size:clamp(38px,8vw,58px);font-weight:400;line-height:.9;text-transform:uppercase;text-shadow:0 4px 0 #7f2515}.moon-overlay-card h3 small{display:block;margin-top:6px;font-family:'Be Vietnam Pro',sans-serif;font-size:10px;letter-spacing:.25em;text-shadow:none}.moon-overlay-card p{max-width:290px;margin:0 auto 17px;color:#f6dcb4;font-size:11px;line-height:1.7}.moon-rules{display:flex;align-items:center;justify-content:center;gap:13px;margin:0 auto 20px;padding:11px;border-top:1px solid #ffe2a52e;border-bottom:1px solid #ffe2a52e;color:#eec98f;font-size:8px;text-transform:uppercase}.moon-rules span{display:block}.moon-rules b{display:block;margin-bottom:2px;color:#fff0b7;font-family:'SVN Gang of Three',sans-serif;font-size:18px;font-weight:400}.moon-rules i{width:1px;height:27px;background:#f7cb7d55}.moon-primary-button,.moon-secondary-button{display:flex;width:100%;height:45px;align-items:center;justify-content:center;border-radius:5px;font-size:10px;font-weight:600;letter-spacing:.17em;text-transform:uppercase}.moon-primary-button{border-color:#ffd387;background:linear-gradient(180deg,#e66b2b,#aa2e17);box-shadow:inset 0 0 0 2px #f9a14c;color:#fff1bd}.moon-secondary-button{height:36px;margin-top:9px;border-color:#ffd8903d;background:#fff0c20b;color:#edc689;font-size:8px}.moon-secondary-button[hidden],.moon-rules[hidden]{display:none}.moon-game-dialog button:focus-visible{outline:3px solid #fff0bd;outline-offset:3px}
@media(max-width:700px){.moon-game-header{grid-template-columns:39px 1fr 39px;padding:9px 10px 8px}.moon-game-back,.moon-game-close{width:36px;height:36px}.moon-game-heading h2{font-size:20px}.moon-game-stage{width:min(100%,calc((100dvh - 53px) * .6885));max-height:calc(100dvh - 53px);border-width:0;border-radius:0}.moon-game-hud{top:10px;left:10px;right:10px}.moon-game-hud>div{min-height:49px}.moon-game-hud strong{font-size:18px}.moon-game-hud .moon-score strong{font-size:25px}.moon-game-progress{left:13px;right:13px;bottom:92px}.moon-progress-dots{gap:4px}.moon-progress-dots i{width:7px;height:7px}.moon-throw-button{bottom:39px;width:auto;height:41px;padding:0 17px;font-size:9px}.moon-game-tip{bottom:11px}.moon-game-overlay{padding:18px}.moon-overlay-card{padding:25px 21px 21px}.moon-overlay-card h3{font-size:43px}}
@media(max-height:620px){.moon-game-header{position:absolute;top:0;left:0;right:0;width:100%;padding:8px 9px;pointer-events:none}.moon-game-header button{pointer-events:auto}.moon-game-heading{display:none}.moon-game-stage{width:min(100%,calc(100dvh * .6885));max-height:100dvh;border-radius:0}.moon-game-hud{top:8px;left:54px;right:54px}.moon-game-hud>div{min-height:42px}.moon-game-progress{bottom:78px}.moon-throw-button{bottom:30px;height:39px}.moon-game-tip{display:none}.moon-overlay-card{padding:20px}.moon-overlay-card h3{font-size:36px;margin:7px 0 9px}.moon-overlay-card p{font-size:9px;margin-bottom:10px}.moon-rules{margin-bottom:12px;padding:7px}.moon-primary-button{height:40px}}

/* Full-bleed game layout: the playfield always fills the current window. */
.moon-game-header{position:absolute;top:0;left:0;right:0;width:100%;max-width:none;margin:0;padding:14px 18px;pointer-events:none;background:linear-gradient(180deg,#240403c9,transparent);z-index:12}.moon-game-header button{pointer-events:auto}.moon-game-stage{flex:1 1 100%;width:100%;height:100%;max-height:none;margin:0;border:0;border-radius:0;aspect-ratio:auto}.moon-game-stage:after{border-radius:0}.moon-game-hud{top:78px;left:50%;right:auto;width:min(620px,calc(100% - 36px));transform:translateX(-50%)}.moon-game-progress{left:50%;right:auto;width:min(600px,calc(100% - 36px));transform:translateX(-50%)}
@media(max-width:700px){.moon-game-header{padding:8px 10px}.moon-game-stage{width:100%;height:100%;max-height:none}.moon-game-hud{top:55px;width:calc(100% - 20px)}.moon-game-progress{width:calc(100% - 26px)}}
@media(max-height:620px){.moon-game-header{padding:8px 9px}.moon-game-hud{top:8px;left:50%;right:auto;width:min(520px,calc(100% - 116px))}.moon-game-stage{width:100%;height:100%;max-height:none}}

/* Hằng Nga Vượt Nguyệt — jade celestial variant of the full-screen machine. */
.jump-game-dialog{background:#031d27}.jump-game-dialog::backdrop{background:#011318ef}.jump-game-shell{background:radial-gradient(circle at 50% 42%,#176c76 0,#073847 51%,#021b27 100%)}.jump-game-shell:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#00131e4d,transparent 22%,transparent 78%,#00131e4d)}.jump-game-shell .moon-game-header{background:linear-gradient(180deg,#011b25d9,transparent)}.jump-game-shell .moon-game-heading>span{color:#f0b65c}.jump-game-shell .moon-game-heading h2{color:#fff1b6}.jump-game-stage{background:#073b49}.jump-game-stage:after{box-shadow:inset 0 0 80px #00151f66}.jump-game-hud{grid-template-columns:1.1fr 1.15fr 1.1fr .95fr;border-color:#ffe6a978;background:linear-gradient(180deg,#063541db,#021f2bd1)}.jump-lives strong{color:#ffc78d;font-family:'Be Vietnam Pro',sans-serif!important;font-size:13px!important;letter-spacing:.1em}.jump-lives strong.is-low{color:#ff7d72;animation:timer-pulse .55s ease-in-out infinite alternate}.jump-game-hud span{color:#e5bb79}.jump-game-hud strong{color:#fff0bd}.jump-game-status{color:#f8e4ae}.jump-next-label{padding:5px 8px;border:1px solid #f5d8904f;border-radius:4px;background:#062b36a3;color:#eacb8c;font-size:7px;letter-spacing:.12em}.jump-button{background:linear-gradient(180deg,#e7863f,#bd4b25);box-shadow:inset 0 0 0 2px #f4b35c,0 7px 17px #00172285}.jump-button:hover{background:linear-gradient(180deg,#f0974c,#d05a2d)}.jump-game-overlay{background:linear-gradient(180deg,#001b2699,#011b26e5)}.jump-overlay-card{border-color:#ffe5a884;background:linear-gradient(155deg,#0b5560eb,#032f3bf5);box-shadow:inset 0 0 0 4px #ffe6aa0a,0 22px 50px #00131d99}.jump-overlay-card h3{text-shadow:0 4px 0 #06424b}.jump-overlay-card .moon-primary-button{background:linear-gradient(180deg,#e7853d,#b84523);box-shadow:inset 0 0 0 2px #f6b55d}.jump-game-shell .moon-game-back,.jump-game-shell .moon-game-close{background:#0638466b}.jump-game-shell .moon-game-back:hover,.jump-game-shell .moon-game-close:hover{background:#0d5968a8}

/* Layered moonlight symphony scene. */
.symphony-trigger{position:absolute;top:22px;left:25px;z-index:12;display:inline-flex;width:max-content;align-items:center;gap:9px;padding:9px 14px;border:1px solid #fff0c278;border-radius:999px;background:#7740193d;color:#8c411b;box-shadow:0 5px 18px #8c411b24;backdrop-filter:blur(8px);font-family:'Be Vietnam Pro',sans-serif;cursor:pointer;transition:transform .25s ease,background .25s ease}.symphony-trigger span{display:grid;place-items:center;width:23px;height:23px;border-radius:50%;background:#b94716;color:#ffe9bd;font-size:14px}.symphony-trigger b{font-size:9px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}.symphony-trigger:hover{transform:translateY(-2px);background:#fff0c270}.symphony-trigger:focus-visible{outline:3px solid #fff0bd;outline-offset:4px}
.symphony-trigger[hidden]{display:none}
.symphony-loading{width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:#082b38;color:#fff;overflow:hidden}.symphony-loading::backdrop{background:#082b38}.symphony-loading-stage{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden;isolation:isolate;background:#082b38}.symphony-loading-stage:before,.symphony-loading-stage:after{display:none}.symphony-loading-moon{position:absolute;left:50%;top:43%;z-index:-1;width:min(20vw,22vh);aspect-ratio:1;border-radius:50%;background:#f7e6ad;box-shadow:0 0 30px #f7e6ad2b;transform:translate(-50%,-50%);animation:loading-moon-pulse 1.6s ease-in-out infinite}.symphony-loading-note{position:absolute;top:40%;z-index:2;color:#f7e6ad;font:clamp(22px,2.2vw,34px)/1 'Playfair Display',serif;animation:loading-note 1.4s ease-in-out infinite}.symphony-loading-note.note-left{left:calc(50% - min(13vw,15vh));transform:rotate(-12deg)}.symphony-loading-note.note-right{right:calc(50% - min(13vw,15vh));animation-delay:-.7s}.symphony-loading-copy{position:absolute;left:50%;top:59%;width:min(420px,82vw);text-align:center;transform:translateX(-50%)}.symphony-loading-copy>span{display:block;font-size:9px;font-weight:600;letter-spacing:.28em;color:#e9cf83}.symphony-loading-copy h2{margin:9px 0 14px;font:400 clamp(19px,2.2vw,28px)/1.2 'SVN Gang of Three','Be Vietnam Pro',sans-serif;text-transform:uppercase;color:#f7e6ad}.symphony-loading-bar{height:3px;overflow:hidden;border-radius:999px;background:#f7e6ad26}.symphony-loading-bar i{display:block;width:42%;height:100%;border-radius:inherit;background:#f7e6ad;animation:loading-bar 1.05s ease-in-out infinite}.symphony-loading:focus-visible{outline:0}@keyframes loading-moon-pulse{0%,100%{transform:translate(-50%,-50%) scale(1);opacity:.94}50%{transform:translate(-50%,-50%) scale(1.04);opacity:1}}@keyframes loading-note{0%,100%{opacity:.3;translate:0 8px}50%{opacity:.8;translate:0 -10px}}@keyframes loading-bar{0%{transform:translateX(-110%)}100%{transform:translateX(340%)}}
.symphony-dialog{width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:#061f30;overflow:hidden;color:#fff}.symphony-dialog::backdrop{background:#06131c}.symphony-scene{position:absolute;inset:0;overflow:hidden;isolation:isolate;background:#07324a}.symphony-sky{position:absolute;inset:0;z-index:-3;background:radial-gradient(circle at 18% 24%,#2ac2bd 0,#0c6f7e 25%,#073b59 57%,#061d3e 100%)}.symphony-sky:after{content:'';position:absolute;inset:0;opacity:.2;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.76' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23d8fff4' filter='url(%23n)' opacity='.32' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}.symphony-layer{position:absolute;pointer-events:none;object-fit:contain}.symphony-background{inset:-3%;width:106%;height:106%;z-index:-2;object-fit:cover;animation:symphony-breathe 18s ease-in-out infinite}.symphony-moon{position:absolute;left:7%;top:9%;width:min(27vw,42vh);aspect-ratio:1;border-radius:50%;z-index:-1;background:radial-gradient(circle at 38% 35%,#fffad9 0,#ffe78a 58%,#f5bd3c 100%);box-shadow:0 0 35px 16px #ffe58c8f,0 0 100px 40px #ffcc5363;animation:moon-pulse 7s ease-in-out infinite}.symphony-moon:after{content:'';position:absolute;inset:0;border-radius:inherit;opacity:.23;background:radial-gradient(ellipse at 28% 35%,#8f773f 0 7%,transparent 8%),radial-gradient(ellipse at 67% 62%,#8f773f 0 11%,transparent 12%),radial-gradient(ellipse at 55% 18%,#8f773f 0 5%,transparent 6%)}
.symphony-slide{position:absolute;inset:0;isolation:isolate;opacity:0;visibility:hidden;transform:scale(1.025);transition:opacity 1.35s ease,transform 2.2s ease,visibility 0s linear 1.35s}.symphony-slide.is-active{opacity:1;visibility:visible;transform:scale(1);transition-delay:0s}.symphony-slide:not(.is-active) *{animation-play-state:paused!important}
.symphony-heading{position:absolute;top:7%;left:50%;z-index:4;text-align:center;transform:translateX(-50%);width:54%;text-shadow:0 5px 22px #001727}.symphony-heading span{font-size:9px;font-weight:600;letter-spacing:.34em;color:#ffe08c}.symphony-heading h2{margin:7px 0 3px;font-family:'SVN Gang of Three','Be Vietnam Pro',sans-serif;font-size:clamp(46px,6.2vw,98px);font-weight:400;line-height:.82;text-transform:uppercase;color:#fff0bd;-webkit-text-stroke:1px #b94b25}.symphony-heading p{margin:12px 0 0;font-family:'Playfair Display',serif;font-size:clamp(11px,1vw,15px);font-style:italic;color:#ffe9bd}.symphony-performers{z-index:2;width:72%;height:57%;left:50%;bottom:4%;transform:translateX(-50%);transform-origin:50% 80%;animation:ensemble-sway 6.5s ease-in-out infinite;filter:drop-shadow(0 14px 25px #00192573)}.symphony-foreground{z-index:3;width:110%;height:35%;left:-5%;bottom:-5%;object-fit:fill;transform-origin:50% 100%;animation:foreground-sway 9s ease-in-out infinite;filter:drop-shadow(0 -8px 20px #00172245)}
.symphony-heading-scene{top:4%;width:48%;text-shadow:0 4px 18px #07385d8c}.symphony-heading-scene h2{font-size:clamp(38px,4.2vw,70px);color:#fff3bd;-webkit-text-stroke-color:#187a91}.symphony-heading-scene p{margin-top:8px}.childhood-slide .symphony-heading-scene{text-shadow:0 3px 0 #ffe9bd,0 7px 18px #68311c59}.childhood-slide .symphony-heading-scene h2{color:#b9432c;-webkit-text-stroke:1.2px #ffe8b5}.childhood-slide .symphony-heading-scene span{color:#165f72;text-shadow:0 1px 6px #fff5d9}.childhood-slide .symphony-heading-scene p{color:#713d2d;text-shadow:0 1px 6px #fff1c9}.starlight-slide .symphony-heading-scene h2{-webkit-text-stroke-color:#176a9c}.starlight-slide .symphony-heading-scene span,.starlight-slide .symphony-heading-scene p{color:#fff2b1}
.symphony-lantern{position:absolute;z-index:1;object-fit:contain;pointer-events:none;filter:drop-shadow(0 6px 18px #ffd35d8c);animation:lantern-dance 7s ease-in-out infinite}.symphony-lantern-one{width:7%;height:15%;left:31%;top:22%;--lean:-8deg}.symphony-lantern-two{width:5%;height:11%;right:25%;top:18%;--lean:9deg;animation-delay:-2.5s}.symphony-lantern-three{width:3.5%;height:8%;right:12%;top:32%;--lean:-6deg;animation-delay:-4s}.music-note{position:absolute;z-index:1;color:#ffe790;font-family:serif;text-shadow:0 0 13px #ffcf62;font-size:clamp(20px,3vw,45px);opacity:.7;animation:note-rise 6s ease-in-out infinite}.note-one{left:27%;top:43%}.note-two{right:27%;top:38%;animation-delay:-2s}.note-three{right:14%;top:55%;animation-delay:-4s}.symphony-close{position:absolute;top:25px;right:27px;z-index:8;display:grid;place-items:center;width:46px;height:46px;padding:0;border:1px solid #ffe49b8c;border-radius:50%;background:#05293e8c;color:#ffe9bd;font:300 33px/1 sans-serif;backdrop-filter:blur(8px);cursor:pointer}.symphony-close:hover{background:#b9471680}.symphony-close:focus-visible{outline:3px solid #ffe9bd;outline-offset:4px}
.childhood-sky-decor{inset:-2%;z-index:1;width:104%;height:82%;object-fit:fill;animation:sky-ornaments 8s ease-in-out infinite;filter:drop-shadow(0 5px 10px #00476b3d)}.childhood-performers{width:91%;height:56%;left:4.5%;bottom:8%;animation:procession-walk 6.5s ease-in-out infinite;filter:drop-shadow(0 14px 22px #082e526b)}.childhood-foreground{width:110%;height:38%;left:-5%;bottom:-6%;object-fit:fill;animation:foreground-sway 9s ease-in-out infinite;filter:drop-shadow(0 -6px 18px #061e3445)}.starlight-children{width:96%;height:79%;left:2%;bottom:3%;animation:starlight-flight 7.5s ease-in-out infinite;filter:drop-shadow(0 18px 24px #020d305c)}.starlight-foreground{width:108%;height:45%;left:-4%;bottom:-6%;object-fit:fill;animation:starlight-drift 10s ease-in-out infinite}.symphony-controls{position:absolute;left:50%;bottom:22px;z-index:9;display:flex;align-items:center;gap:13px;transform:translateX(-50%);padding:6px 10px;border:1px solid #ffe8a84f;border-radius:999px;background:#031c2c7a;box-shadow:0 8px 22px #00131f52;backdrop-filter:blur(10px)}.symphony-arrow{display:grid;place-items:center;width:31px;height:31px;padding:0;border:0;border-radius:50%;background:transparent;color:#ffe9bd;font:300 27px/1 sans-serif;cursor:pointer}.symphony-arrow:hover{background:#fff3c51f}.symphony-dots{display:flex;align-items:center;gap:8px}.symphony-dots button{width:7px;height:7px;padding:0;border:0;border-radius:50%;background:#ffeab15c;cursor:pointer;transition:width .35s ease,background .35s ease}.symphony-dots button.is-active{width:28px;border-radius:10px;background:#ffd16a}.symphony-arrow:focus-visible,.symphony-dots button:focus-visible{outline:2px solid #ffe9bd;outline-offset:2px}
.procession-background{inset:0;width:100%;height:100%;animation:procession-background-breathe 18s ease-in-out infinite}.procession-performers{left:0;bottom:0;width:100%;height:100%;transform:none;animation:procession-parade 6.5s ease-in-out infinite;filter:drop-shadow(0 12px 18px #16325a52)}.procession-heading{text-shadow:0 3px 0 #173c68,0 8px 20px #061d3e99}.procession-heading h2{color:#fff0bd;-webkit-text-stroke:1px #b74a2b}.procession-heading span,.procession-heading p{color:#ffe7a2}
@keyframes symphony-breathe{0%,100%{transform:scale(1.01)}50%{transform:scale(1.055) translateY(-1%)}}@keyframes moon-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.035);box-shadow:0 0 42px 20px #ffe58ca8,0 0 120px 50px #ffcc536f}}@keyframes ensemble-sway{0%,100%{transform:translateX(-50%) translateY(0) rotate(-1deg)}50%{transform:translateX(-50%) translateY(-11px) rotate(1deg)}}@keyframes foreground-sway{0%,100%{transform:translateX(0) rotate(-.4deg)}50%{transform:translateX(1%) rotate(.5deg)}}@keyframes lantern-dance{0%,100%{transform:translateY(0) rotate(var(--lean))}50%{transform:translateY(-13px) rotate(calc(var(--lean) + 5deg))}}@keyframes note-rise{0%,100%{opacity:.25;transform:translateY(10px) rotate(-8deg)}50%{opacity:.85;transform:translateY(-17px) rotate(8deg)}}
@keyframes procession-walk{0%,100%{transform:translateX(-2%) translateY(0) rotate(-.45deg)}50%{transform:translateX(2%) translateY(-12px) rotate(.45deg)}}@keyframes family-breathe{0%,100%{transform:translateX(-50%) translateY(0) scale(1)}50%{transform:translateX(-50%) translateY(-8px) scale(1.012)}}
@keyframes starlight-flight{0%,100%{transform:translate(-1.5%,1%) rotate(-1deg)}50%{transform:translate(1.5%,-2%) rotate(1deg)}}@keyframes starlight-drift{0%,100%{transform:translateX(-.7%) translateY(0)}50%{transform:translateX(.7%) translateY(-7px)}}
@keyframes sky-ornaments{0%,100%{transform:translateY(0) rotate(-.25deg)}50%{transform:translateY(-10px) rotate(.25deg)}}
@keyframes procession-background-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.025)}}@keyframes procession-parade{0%,100%{transform:translateX(-.7%) translateY(0)}50%{transform:translateX(.7%) translateY(-8px)}}
@media(max-width:700px){.symphony-trigger{top:14px;left:14px;padding:7px 9px;gap:6px}.symphony-trigger span{width:21px;height:21px}.symphony-trigger b{font-size:7px;letter-spacing:.08em}.symphony-close{top:14px;right:14px;width:39px;height:39px}.symphony-heading{top:8%;width:96%}.symphony-heading span{font-size:9px}.symphony-heading h2{font-size:15vw;line-height:.84;letter-spacing:-.02em}.symphony-heading p{font-size:11.5px;margin-top:9px}.symphony-moon{width:54vw;left:-13%;top:14%}.symphony-background{inset:-2%;width:104%;height:104%}.symphony-performers{width:100%;height:auto;bottom:22%}.symphony-foreground{width:175%;height:28%;left:-37.5%;bottom:-3%}.symphony-lantern-one{width:15%;height:11%;left:10%;top:32%}.symphony-lantern-two{width:11%;height:9%;right:13%;top:26%}.symphony-lantern-three{display:none}.music-note{font-size:24px}.note-one{left:15%;top:45%}.note-two{right:17%;top:42%}.note-three{display:none}}
@media(max-width:700px){.symphony-heading-scene{top:5%;width:96%}.symphony-heading-scene h2{font-size:13.5vw;letter-spacing:-.02em}.childhood-sky-decor{width:155%;height:67%;left:-27.5%;top:-2%}.childhood-performers{width:100%;height:auto;left:0;bottom:26%}.childhood-foreground{width:180%;height:31%;left:-40%;bottom:-3%}.starlight-children{width:100%;height:auto;left:0;bottom:30%}.starlight-foreground{width:175%;height:34%;left:-37.5%;bottom:-3%}.symphony-controls{bottom:13px}.symphony-arrow{width:27px;height:27px}}
@media(max-width:700px){.procession-heading{top:5%;width:92%}.procession-heading h2{font-size:12.5vw}.procession-background{inset:0;width:100%;height:100%;object-position:center}.procession-performers{left:-30%;bottom:8%;width:160%;height:76%;object-fit:contain}}
@media(max-width:700px){.symphony-loading-moon{top:41%;width:min(38vw,20vh)}.symphony-loading-note{top:38%}.symphony-loading-note.note-left{left:25vw}.symphony-loading-note.note-right{right:25vw}.symphony-loading-copy{top:56%}.symphony-loading-copy h2{font-size:18px}}
@media(prefers-reduced-motion:reduce){.symphony-loading-moon,.symphony-loading-note,.symphony-loading-bar i{animation:none}.symphony-loading-bar i{width:100%}}

/* Moon leaderboard: the home scene parts to reveal a ranking stage. */
.home-actions{position:absolute;top:22px;left:25px;right:25px;z-index:14;display:flex;align-items:center;justify-content:space-between;gap:9px;transition:opacity .35s ease,transform .5s ease}
.home-actions-right{display:flex;align-items:center;gap:9px}.sound-toggle{display:grid;width:38px;height:38px;padding:0;place-items:center;border:1px solid #fff0c278;border-radius:50%;background:#7740193d;color:#8c411b;font:600 15px/1 sans-serif;box-shadow:0 5px 18px #8c411b24;backdrop-filter:blur(8px);cursor:pointer;transition:transform .25s ease,background .25s ease}.sound-toggle:hover{transform:translateY(-2px);background:#77401959}.sound-toggle[aria-pressed="true"]{color:#b08a63;background:#7740191f}.sound-toggle:focus-visible{outline:3px solid #fff0bd;outline-offset:3px}.home-actions .symphony-trigger{position:static}.ranking-trigger{display:inline-flex;width:max-content;align-items:center;gap:9px;padding:9px 14px;border:1px solid #fff0c278;border-radius:999px;background:#7740193d;color:#8c411b;box-shadow:0 5px 18px #8c411b24;backdrop-filter:blur(8px);cursor:pointer;transition:transform .25s ease,background .25s ease}.ranking-trigger span{display:grid;place-items:center;width:23px;height:23px;border-radius:50%;background:#0f7280;color:#ffe9bd;font-size:13px}.ranking-trigger b{font-size:9px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}.ranking-trigger:hover{transform:translateY(-2px);background:#fff0c270}.ranking-trigger:focus-visible{outline:3px solid #fff0bd;outline-offset:4px}
.leaderboard-panel{position:absolute;left:50%;top:50%;z-index:30;width:min(790px,88vw);max-height:91vh;padding:22px 28px 24px;overflow:hidden;border:1px solid #d9963e;border-radius:26px;background:linear-gradient(155deg,#fff7dff2,#ffe7acf0 58%,#f5bd69ee);box-shadow:0 28px 80px #73361347,inset 0 0 0 5px #fff8dc73;color:#713816;opacity:0;visibility:hidden;pointer-events:none;transform:translate(-50%,-44%) scale(.76);transition:opacity .55s ease .3s,transform .85s cubic-bezier(.18,.82,.2,1) .22s,visibility 0s linear .9s}.leaderboard-panel:before{content:'';position:absolute;inset:0;z-index:-1;opacity:.38;background:radial-gradient(circle at 50% 22%,#fffef0 0 23%,transparent 50%),radial-gradient(circle at 8% 75%,#f5b15852 0 9%,transparent 10%),radial-gradient(circle at 92% 28%,#66b8ad38 0 10%,transparent 11%)}.leaderboard-panel:after{content:'☁︎  ✦  ☁︎';position:absolute;left:0;right:0;bottom:-17px;text-align:center;font:50px/1 serif;letter-spacing:.25em;color:#fff3cf94;pointer-events:none}.festival.is-ranking .leaderboard-panel{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,-50%) scale(1);transition-delay:.48s,.4s,0s}.leaderboard-close{position:absolute;top:15px;right:17px;z-index:3;display:grid;place-items:center;width:39px;height:39px;padding:0;border:1px solid #a95a2d66;border-radius:50%;background:#fff5d090;color:#9b4a22;font:300 28px/1 sans-serif}.leaderboard-header{text-align:center}.leaderboard-header>span{font-size:8px;font-weight:600;letter-spacing:.32em;color:#0f7280}.leaderboard-header h2{margin:4px 0 3px;font-family:'SVN Gang of Three','Be Vietnam Pro',sans-serif;font-size:clamp(28px,3.6vw,49px);font-weight:400;line-height:.88;text-transform:uppercase;color:#b94716;-webkit-text-stroke:.7px #7f2c10;text-shadow:0 2px 0 #fff0bd,0 6px 18px #8c411b2b}.leaderboard-header p{margin:8px 0 12px;font:italic 12px/1.2 'Playfair Display',serif;color:#8a542e}.leaderboard-podium{display:grid;grid-template-columns:1fr 1.15fr 1fr;align-items:end;gap:13px;max-width:650px;margin:0 auto 13px}.cuoi-card{position:relative;display:flex;min-width:0;flex-direction:column;align-items:center;padding:12px 8px 11px;border:1px solid #c67b3770;border-radius:18px 18px 10px 10px;background:linear-gradient(180deg,#fff9e6d9,#ffd991a3);box-shadow:0 8px 20px #8d451b1f;text-align:center}.rank-one{padding-top:16px;background:linear-gradient(180deg,#fffce9,#ffd166c7);box-shadow:0 11px 28px #9b541c2e;transform:translateY(-7px)}.rank-medal{position:absolute;top:8px;left:9px;display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:#b85a24;color:#fff3cf;font-size:8px;font-weight:600;letter-spacing:.06em}.rank-one .rank-medal{background:#d99521}.rank-three .rank-medal{background:#8f6a4c}.rank-crown{position:absolute;top:-20px;left:50%;transform:translateX(-50%);color:#da941f;font-size:25px;text-shadow:0 3px 8px #a5511b4d}.cuoi-avatar{flex:none;width:86px;aspect-ratio:1;border:3px solid #fff1bd;border-radius:50%;background-image:url('assets/cuoi-leaderboard-sprite-v1.webp');background-repeat:no-repeat;background-size:300% 200%;box-shadow:0 6px 14px #7a391d33}.rank-one .cuoi-avatar{width:106px;border-color:#ffd366}.avatar-one{background-position:0 0}.avatar-two{background-position:50% 0}.avatar-three{background-position:100% 0}.avatar-four{background-position:0 100%}.avatar-five{background-position:50% 100%}.avatar-six{background-position:100% 100%}.cuoi-avatar.has-photo{background-color:#e7b273;background-size:cover;background-position:center}.cuoi-card h3{margin:8px 0 4px;font-family:'SVN Gang of Three','Be Vietnam Pro',sans-serif;font-size:clamp(14px,1.5vw,20px);font-weight:400;line-height:1;color:#763416;text-transform:uppercase}.cuoi-card strong{font-size:11px;letter-spacing:.06em;color:#9c531f}.cuoi-card strong i{font-style:normal;color:#e3a222}.leaderboard-list{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.leaderboard-list article{display:grid;grid-template-columns:25px 42px 1fr auto;align-items:center;gap:8px;min-width:0;padding:7px 9px;border:1px solid #bd793d4f;border-radius:13px;background:#fff8df8f}.leaderboard-list article>b{font-size:9px;color:#a25c2d}.leaderboard-list .cuoi-avatar{width:42px;border-width:2px}.leaderboard-list article>span{display:flex;min-width:0;flex-direction:column}.leaderboard-list article span strong{overflow:hidden;font-size:10px;white-space:nowrap;text-overflow:ellipsis}.leaderboard-list article small{margin-top:2px;font-size:7px;color:#a16b44}.leaderboard-list article em{font-size:9px;font-style:normal;font-weight:600;color:#a75c24;white-space:nowrap}
.leaderboard-list{max-width:650px;margin-right:auto;margin-left:auto;grid-template-columns:repeat(2,1fr)}
.leaderboard-self{position:relative;display:grid;width:min(540px,100%);margin:10px auto 0;padding:9px 13px;grid-template-columns:auto 42px minmax(0,1fr) auto;align-items:center;gap:10px;border:1px solid #0f728061;border-radius:15px;background:linear-gradient(100deg,#fff9e8ed,#dff5e8e8);box-shadow:0 7px 20px #7138161c}.leaderboard-self-label{position:absolute;left:13px;top:-7px;padding:2px 7px;border-radius:999px;background:#0f7280;color:#fff7d9;font-size:6px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}.leaderboard-self>b{min-width:74px;color:#0f7280;font-size:17px;line-height:1;white-space:nowrap}.leaderboard-self>b small{display:block;margin-top:4px;color:#6d7f6d;font-size:7px;font-weight:600}.leaderboard-self .cuoi-avatar{width:42px;border-width:2px}.leaderboard-self-person{display:flex;min-width:0;flex-direction:column}.leaderboard-self-person strong{overflow:hidden;color:#713816;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.leaderboard-self-person small{margin-top:3px;color:#8e684b;font-size:7px}.leaderboard-self>em{color:#a75c24;font-size:10px;font-style:normal;font-weight:700;white-space:nowrap}
@media(max-width:700px){.leaderboard-self{margin-top:8px;padding:8px 9px;grid-template-columns:66px 35px minmax(0,1fr) auto;gap:7px}.leaderboard-self>b{min-width:0;font-size:14px}.leaderboard-self>b small{font-size:6px}.leaderboard-self .cuoi-avatar{width:35px}.leaderboard-self-person strong{font-size:9px}.leaderboard-self-person small{font-size:6px}.leaderboard-self>em{font-size:8px}.leaderboard-self-label{left:9px}}
.festival .moon,.festival .hero,.festival .goddess,.festival .landscape,.festival .rabbit-play,.festival .cloud,.festival .red-cloud-ribbon,.festival .lantern{transition:transform .9s cubic-bezier(.2,.75,.2,1),opacity .65s ease,filter .8s ease}.festival.is-ranking .home-actions{opacity:0;pointer-events:none;transform:translateY(-18px)}.festival.is-ranking .moon{transform:translate(-50%,-50%) scale(1.24);filter:saturate(.72) brightness(1.05)}.festival.is-ranking .hero{opacity:0;transform:translateX(-50%) scale(.72)}.festival.is-ranking .goddess{animation:none;opacity:0;transform:translate(70%,-15%) rotate(13deg)}.festival.is-ranking .landscape{opacity:0;transform:translate(-50%,34%) scale(.86)}.festival.is-ranking .rabbit-play{animation:none;opacity:0}.festival.is-ranking .rabbit-carry{transform:translate(-90%,-10%) rotate(-12deg)}.festival.is-ranking .rabbit-roll{transform:translate(90%,10%) rotate(10deg)}.festival.is-ranking .rabbit-peek{transform:translateY(100%) scale(.8)}.festival.is-ranking .cloud,.festival.is-ranking .red-cloud-ribbon,.festival.is-ranking .lantern{animation:none}.festival.is-ranking .cloud-left,.festival.is-ranking .cloud-mid-left,.festival.is-ranking .cloud-low-left,.festival.is-ranking .foreground-left{opacity:.12;transform:translateX(-85vw)}.festival.is-ranking .cloud-right,.festival.is-ranking .cloud-mid-right,.festival.is-ranking .cloud-low-right,.festival.is-ranking .foreground-right{opacity:.12;transform:translateX(85vw)}.festival.is-ranking .cloud-back,.festival.is-ranking .cloud-top,.festival.is-ranking .foreground-center{opacity:.08;transform:translateY(-48vh) scale(.8)}.festival.is-ranking .ribbon-left{opacity:.08;transform:translateX(-70vw)}.festival.is-ranking .ribbon-right{opacity:.08;transform:translateX(70vw) scaleX(-1)}.festival.is-ranking .lantern{opacity:0;transform:translateY(-30px)}
@media(max-width:700px){.home-actions{top:14px;left:14px;right:14px;gap:6px}.home-actions-right{gap:6px}.sound-toggle{width:32px;height:32px;font-size:13px}.home-actions .symphony-trigger,.ranking-trigger{position:static;padding:7px 9px;gap:6px}.ranking-trigger span{width:21px;height:21px}.ranking-trigger b{font-size:7px;letter-spacing:.08em}.leaderboard-panel{width:calc(100vw - 20px);max-height:calc(100dvh - 20px);padding:17px 13px 15px;border-radius:18px}.leaderboard-close{top:10px;right:10px;width:34px;height:34px}.leaderboard-header h2{font-size:30px}.leaderboard-header p{margin:6px 0 10px;font-size:10px}.leaderboard-podium{gap:6px;margin-bottom:8px}.cuoi-card{padding:9px 4px 8px;border-radius:13px}.rank-one{padding-top:13px}.cuoi-avatar{width:64px}.rank-one .cuoi-avatar{width:76px}.rank-medal{top:5px;left:5px;width:20px;height:20px;font-size:7px}.rank-crown{top:-16px;font-size:20px}.cuoi-card h3{font-size:11px}.cuoi-card strong{font-size:9px}.leaderboard-list{grid-template-columns:1fr;gap:5px}.leaderboard-list article{grid-template-columns:22px 35px 1fr auto;padding:4px 8px}.leaderboard-list .cuoi-avatar{width:35px}.leaderboard-list article span strong{font-size:9px}.leaderboard-list article small{font-size:6px}.leaderboard-list article em{font-size:8px}}
@media(max-height:650px){.leaderboard-panel{padding-top:14px;padding-bottom:13px}.leaderboard-header p{display:none}.leaderboard-podium{margin-top:4px;margin-bottom:7px}.cuoi-avatar{width:64px}.rank-one .cuoi-avatar{width:76px}.cuoi-card{padding-top:8px;padding-bottom:7px}.cuoi-card h3{font-size:12px;margin-top:5px}.leaderboard-list article{padding-top:4px;padding-bottom:4px}}

/* Open-stage leaderboard: keep the home artwork visible and use the moon as its backdrop. */
.leaderboard-panel{width:min(900px,94vw);max-height:94vh;padding:10px 34px 18px;overflow:visible;border:0;border-radius:0;background:transparent;box-shadow:none}.leaderboard-panel:before,.leaderboard-panel:after{display:none}.leaderboard-header h2{text-shadow:0 2px 0 #fff0bd,0 5px 0 #f7b561,0 12px 24px #8c411b40}.leaderboard-close{top:0;right:4px;background:#fff4d6d6;box-shadow:0 6px 18px #8c411b29}.cuoi-card{background:linear-gradient(180deg,#fff9e6e8,#ffd991cf);box-shadow:0 10px 26px #8d451b29,0 0 0 5px #fff6d53b}.leaderboard-list article{background:#fff8dfe0;box-shadow:0 6px 15px #8d451b18}.festival.is-ranking .moon{transform:translate(-50%,-50%) scale(1.1);filter:saturate(.86) brightness(1.03)}.festival.is-ranking .goddess{opacity:.28;transform:translate(22%,-5%) rotate(8deg)}.festival.is-ranking .landscape{opacity:.24;transform:translate(-50%,13%) scale(.95)}.festival.is-ranking .rabbit-play{opacity:.2}.festival.is-ranking .rabbit-carry{transform:translate(-24%,-4%) rotate(-8deg)}.festival.is-ranking .rabbit-roll{transform:translate(24%,5%) rotate(6deg)}.festival.is-ranking .rabbit-peek{transform:translateY(28%) scale(.92)}.festival.is-ranking .cloud-left,.festival.is-ranking .cloud-mid-left,.festival.is-ranking .cloud-low-left,.festival.is-ranking .foreground-left{opacity:.5;transform:translateX(-18vw)}.festival.is-ranking .cloud-right,.festival.is-ranking .cloud-mid-right,.festival.is-ranking .cloud-low-right,.festival.is-ranking .foreground-right{opacity:.5;transform:translateX(18vw)}.festival.is-ranking .cloud-back,.festival.is-ranking .cloud-top{opacity:.3;transform:translateY(-8vh) scale(.94)}.festival.is-ranking .foreground-center{opacity:.34;transform:translateY(13vh) scale(.95)}.festival.is-ranking .ribbon-left{opacity:.36;transform:translateX(-13vw)}.festival.is-ranking .ribbon-right{opacity:.36;transform:translateX(13vw) scaleX(-1)}.festival.is-ranking .lantern{opacity:.28;transform:translateY(-12px)}
@media(max-width:700px){.leaderboard-panel{width:100vw;max-height:100dvh;padding:48px 10px 12px}.leaderboard-close{top:10px;right:12px}.festival.is-ranking .cloud-left,.festival.is-ranking .cloud-mid-left,.festival.is-ranking .cloud-low-left,.festival.is-ranking .foreground-left{transform:translateX(-12vw)}.festival.is-ranking .cloud-right,.festival.is-ranking .cloud-mid-right,.festival.is-ranking .cloud-low-right,.festival.is-ranking .foreground-right{transform:translateX(12vw)}.festival.is-ranking .goddess{opacity:.18;transform:translate(18%,-3%) rotate(7deg)}.festival.is-ranking .landscape{opacity:.18;transform:translate(-50%,10%) scale(.97)}}

/* Icon nút vẽ bằng SVG thay cho ký tự × ← ‹ ›: ký tự phụ thuộc metric font
   hệ thống (San Francisco trên iOS, Roboto trên Android) nên lệch tâm khác
   nhau tùy máy. SVG canh theo hình học nên luôn đúng. */
.symphony-close svg,.symphony-arrow svg,.leaderboard-close svg,.game-back svg,.moon-game-back svg,.moon-game-close svg{display:block;width:46%;height:46%;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.symphony-arrow svg{width:58%;height:58%;stroke-width:2.4}
.game-back svg,.moon-game-back svg{width:52%;height:52%}
.sound-toggle,.slice-sound{position:relative}.sound-toggle>*,.slice-sound>*{font-style:normal;line-height:1}.sound-toggle[aria-pressed="true"]>*,.slice-sound[aria-pressed="true"]>*{opacity:.45}.sound-toggle[aria-pressed="true"]:after,.slice-sound[aria-pressed="true"]:after{content:'';position:absolute;left:24%;right:24%;top:50%;height:1.6px;border-radius:2px;background:currentColor;transform:rotate(-45deg)}

/* Wordmark ECOMOBI đặt trên dòng NGÀY HỘI. Ảnh 3493x570 (6.13:1) nên chỉ
   set width, height:auto để giữ đúng tỉ lệ. */
.brand-mark{display:block;width:clamp(124px,11vw,186px);height:auto;margin:0 auto 13px;filter:drop-shadow(0 2px 6px #fff5d9cc) drop-shadow(0 4px 14px #8c411b26)}
@media(max-width:700px){.brand-mark{width:36vw;margin-bottom:10px}}
@media(max-height:550px){.brand-mark{width:15vh;margin-bottom:7px}}

/* Màn chờ Bách Phát Bánh Trăng — màn home thường: wordmark lớn, bánh mục tiêu,
   xiên chờ dưới đường ngắm. Bấm BẮT ĐẦU thì xiên phóng lên cắm vào bánh rồi
   mới đếm ngược 3 giây. Không mượn vòng chữ xoay của game chém. */
.moon-menu{position:absolute;inset:0;z-index:10;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:min(2.6vh,18px);padding:clamp(50px,9vh,80px) 14px clamp(12px,3vh,24px);overflow:hidden;background:radial-gradient(ellipse 84% 66% at 50% 46%,#7e1f1026 0,#2c0705a3 56%,#190403ea 100%);opacity:0;visibility:hidden;transition:opacity .24s ease,visibility .24s ease;touch-action:manipulation;user-select:none;-webkit-user-select:none}
.moon-menu.is-visible{opacity:1;visibility:visible}.moon-menu.is-leaving{opacity:0;pointer-events:none}
.moon-menu-decor{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.moon-menu-lantern{position:absolute;width:13%;max-width:74px;object-fit:contain;transform-origin:50% 0;filter:drop-shadow(0 9px 18px #1a04037d);animation:moon-lantern-sway 6.4s ease-in-out infinite}
.moon-menu-lantern.lantern-a{left:5%;top:3%}.moon-menu-lantern.lantern-b{right:6%;top:8%;width:10.5%;animation-delay:-2.6s}.moon-menu-lantern.lantern-c{left:6%;bottom:23%;width:9%;opacity:.78;animation-delay:-4.3s}
.moon-menu-cloud{position:absolute;width:46%;object-fit:contain;opacity:.22;animation:moon-cloud-drift 14s ease-in-out infinite}
.moon-menu-cloud.cloud-a{left:-13%;bottom:3%}.moon-menu-cloud.cloud-b{right:-15%;top:21%;width:39%;animation-delay:-7s}
.moon-spark{position:absolute;width:4px;height:4px;border-radius:50%;background:#ffe6ac;box-shadow:0 0 9px 3px #ffb95e7a;animation:moon-spark-float 5.4s ease-in-out infinite}
.moon-spark.spark-a{left:15%;top:28%}.moon-spark.spark-b{left:27%;bottom:26%;animation-delay:-1.1s}.moon-spark.spark-c{right:19%;top:36%;animation-delay:-2.2s}.moon-spark.spark-d{right:29%;bottom:30%;animation-delay:-3.3s}.moon-spark.spark-e{left:44%;top:12%;animation-delay:-4.1s}.moon-spark.spark-f{right:10%;bottom:34%;animation-delay:-2.7s}

.moon-menu-title{position:relative;z-index:3;margin:0;text-align:center}
.moon-menu-title span{display:block;margin-bottom:7px;color:#f0a457;font-size:9px;font-weight:600;letter-spacing:.26em}
.moon-menu-title h3{margin:0;color:#ffe9b5;font-family:'SVN Gang of Three','Be Vietnam Pro',sans-serif;font-size:clamp(38px,9vw,74px);font-weight:400;line-height:.92;text-transform:uppercase;text-shadow:0 4px 0 #8d2411,0 13px 30px #19040399}

/* Bánh mục tiêu, đường ngắm chấm chấm và chiếc xiên chờ — đúng bố cục lúc chơi. */
.moon-menu-stack{--cake:min(44vw,25vh,196px);position:relative;z-index:3;display:flex;width:var(--cake);flex:0 0 auto;flex-direction:column;align-items:center}
.moon-menu-target{position:relative;width:100%;aspect-ratio:1}
.moon-menu-cake{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 14px 22px #1c04037a);animation:moon-cake-spin 20s linear infinite}
/* Vụn bánh bắn ra đúng chỗ mũi xiên cắm vào. */
.moon-menu-burst{position:absolute;left:50%;top:93%;width:68%;aspect-ratio:1;border-radius:50%;opacity:0;background:radial-gradient(circle,#fffbe8 0 12%,#ffd873b3 30%,#ff9a3a4d 52%,#ff8a2e00 70%);transform:translate(-50%,-50%) scale(.15)}
.moon-menu-stack:before{content:'';position:absolute;left:50%;top:50%;z-index:-1;width:150%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#ffa63e3d,transparent 62%);transform:translate(-50%,-50%);animation:moon-halo-pulse 3.8s ease-in-out infinite}
.moon-menu-aim{width:2px;height:calc(var(--cake) * .26);margin-top:calc(var(--cake) * .1);background:repeating-linear-gradient(180deg,#ffdda0c4 0 4px,transparent 4px 11px);transition:opacity .2s ease}
.moon-menu-skewer{width:calc(var(--cake) * .5);height:auto;object-fit:contain;filter:drop-shadow(0 8px 12px #1a040375);animation:moon-skewer-idle 2.6s ease-in-out infinite}
.moon-menu.is-throwing .moon-menu-aim{opacity:0}
.moon-menu.is-throwing .moon-menu-skewer{animation:moon-skewer-throw .54s linear forwards}
.moon-menu.is-throwing .moon-menu-cake{animation:moon-cake-spin 20s linear infinite,moon-cake-flash .34s ease-out .235s}
.moon-menu.is-throwing .moon-menu-target{animation:moon-target-jolt .44s cubic-bezier(.2,.9,.3,1) .25s}
.moon-menu.is-throwing .moon-menu-stack{animation:moon-stack-shake .28s ease-out .25s}
.moon-menu.is-throwing .moon-menu-burst{animation:moon-burst .46s ease-out .235s}

.moon-menu-rules{position:relative;z-index:3;display:flex;align-items:center;justify-content:center;gap:14px;padding:10px 4px;border-top:1px solid #ffc98a2e;border-bottom:1px solid #ffc98a2e;color:#f0c391;font-size:8px;letter-spacing:.06em;text-transform:uppercase}
.moon-menu-rules span{display:flex;flex-direction:column;align-items:center}
.moon-menu-rules b{margin-bottom:3px;color:#ffeab4;font-family:'SVN Gang of Three','Be Vietnam Pro',sans-serif;font-size:19px;font-weight:400}
.moon-menu-rules i{width:1px;height:26px;background:#f7b87d4d}

.moon-menu-actions{position:relative;z-index:3;display:flex;align-items:center}
.moon-menu-play{display:flex;width:min(60vw,230px);height:46px;align-items:center;justify-content:center;border:1px solid #ffd387;border-radius:6px;background:linear-gradient(180deg,#e66b2b,#aa2e17);box-shadow:inset 0 0 0 2px #f9a14c,0 9px 20px #2c05056e;color:#fff1bd;font-family:'Be Vietnam Pro',sans-serif;font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;cursor:pointer}
.moon-menu-play:hover{background:linear-gradient(180deg,#f2793a,#bd3a1c)}
.moon-menu-play:active{transform:translateY(2px)}
.moon-menu-play[disabled]{opacity:.45;cursor:not-allowed}
.moon-menu-sound{position:absolute;left:100%;margin-left:10px;display:grid;width:46px;height:46px;padding:0;place-items:center;border:1px solid #ffd28a63;border-radius:50%;background:#43100c8f;color:#ffe6a7;font:700 17px/1 sans-serif;backdrop-filter:blur(6px);cursor:pointer}
.moon-menu-sound:hover{background:#5a1610a6}
.moon-menu-sound i{position:relative;font-style:normal;line-height:1}
.moon-menu-sound[aria-pressed="true"]{color:#c0977c}
.moon-menu-sound[aria-pressed="true"] i:after{content:'';position:absolute;left:-40%;right:-40%;top:50%;height:2px;border-radius:2px;background:currentColor;transform:rotate(-45deg)}
.moon-menu-play:focus-visible,.moon-menu-sound:focus-visible{outline:3px solid #fff0bd;outline-offset:3px}

.moon-menu-hint{position:relative;z-index:3;margin:0;color:#ffcf95;font-size:9px;font-weight:600;letter-spacing:.13em;text-align:center;text-transform:uppercase;animation:moon-hint-pulse 2.8s ease-in-out infinite}
.moon-menu-message{position:relative;z-index:3;margin:0;color:#ffb877;font-size:9px;font-weight:600;letter-spacing:.08em;text-align:center;text-transform:uppercase}
.moon-menu-message:empty{display:none}
.moon-game-stage.is-menu .moon-game-hud,.moon-game-stage.is-menu .moon-game-progress,.moon-game-stage.is-menu .moon-throw-button,.moon-game-stage.is-menu .moon-game-tip{opacity:0;visibility:hidden;pointer-events:none}
.moon-game-shell .moon-game-heading{transition:opacity .25s ease}
.moon-game-shell:has(.moon-game-stage.is-menu) .moon-game-heading{opacity:0;visibility:hidden}

/* Đếm ngược 3 giây trước khi bánh bắt đầu xoay. */
.moon-countdown{position:absolute;inset:0;z-index:7;display:grid;align-content:center;justify-items:center;gap:10px;pointer-events:none;background:radial-gradient(ellipse 62% 46% at 50% 50%,#2c070559,transparent 72%);opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s ease}
.moon-countdown.is-visible{opacity:1;visibility:visible}
.moon-countdown strong{color:#ffeab6;font-family:'SVN Gang of Three','Be Vietnam Pro',sans-serif;font-size:clamp(76px,19vh,142px);font-weight:400;line-height:1;text-shadow:0 6px 0 #8d2411,0 16px 40px #170302b5}
.moon-countdown span{color:#ffc07f;font-size:9px;font-weight:600;letter-spacing:.3em;text-transform:uppercase}
.moon-countdown.is-go strong{color:#ffc65f;font-size:clamp(44px,11vh,84px)}
.moon-countdown.is-tick strong{animation:moon-count-pop .5s cubic-bezier(.2,.9,.3,1.18)}

@keyframes moon-cake-spin{to{transform:rotate(-360deg)}}
@keyframes moon-cake-flash{0%{filter:drop-shadow(0 14px 22px #1c04037a)}12%{filter:drop-shadow(0 0 38px #ffeab0) brightness(1.42) saturate(1.18)}100%{filter:drop-shadow(0 14px 22px #1c04037a)}}
@keyframes moon-target-jolt{0%{transform:translateY(0) scale(1)}16%{transform:translateY(3.5%) scale(1.055)}38%{transform:translateY(-1.6%) scale(.982)}62%{transform:translateY(1%) scale(1.014)}82%{transform:translateY(-.4%) scale(.996)}100%{transform:translateY(0) scale(1)}}
@keyframes moon-stack-shake{0%,100%{transform:translate(0,0)}18%{transform:translate(-4px,3px)}42%{transform:translate(4px,-3px)}68%{transform:translate(-2px,1px)}}
@keyframes moon-burst{0%{opacity:0;transform:translate(-50%,-50%) scale(.15)}12%{opacity:1;transform:translate(-50%,-50%) scale(.7)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.55)}}
@keyframes moon-halo-pulse{0%,100%{opacity:.6;transform:translate(-50%,-50%) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.05)}}
@keyframes moon-skewer-idle{0%,100%{transform:translateY(0)}50%{transform:translateY(-8%)}}
@keyframes moon-skewer-throw{
  0%{transform:translateY(0);animation-timing-function:cubic-bezier(.3,0,.7,1)}
  17%{transform:translateY(11%);animation-timing-function:cubic-bezier(.55,0,.35,1)}
  46%{transform:translateY(-108%);animation-timing-function:cubic-bezier(.3,0,.4,1)}
  58%{transform:translateY(-99%);animation-timing-function:ease-in-out}
  72%{transform:translateY(-105.5%)}
  86%{transform:translateY(-102.5%)}
  100%{transform:translateY(-104%)}
}
@keyframes moon-hint-pulse{0%,100%{opacity:.55}50%{opacity:1}}
@keyframes moon-lantern-sway{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}
@keyframes moon-cloud-drift{0%,100%{transform:translateX(0)}50%{transform:translateX(18px)}}
@keyframes moon-spark-float{0%,100%{opacity:.15;transform:translateY(8px) scale(.6)}50%{opacity:.9;transform:translateY(-12px) scale(1)}}
@keyframes moon-count-pop{0%{transform:scale(1.75);opacity:0}45%{opacity:1}100%{transform:scale(1);opacity:1}}
@media(max-width:700px){.moon-menu{padding-top:clamp(42px,8vh,66px)}.moon-menu-stack{--cake:min(50vw,23vh,186px)}}
@media(max-height:620px){.moon-menu{gap:min(1.8vh,11px);padding-top:36px}.moon-menu-title span{display:none}.moon-menu-title h3{font-size:clamp(26px,6vh,40px)}.moon-menu-stack{--cake:min(30vw,24vh,140px)}.moon-menu-hint{display:none}.moon-menu-rules{padding:6px 4px;gap:11px}.moon-menu-rules b{font-size:16px}.moon-menu-play{height:40px}.moon-menu-sound{width:40px;height:40px}}

/* Màn chờ Hằng Nga Vượt Nguyệt — dựng lại đúng thế bắt đầu của game: Hằng Nga
   đứng trên mặt trăng dưới, tia ngắm chấm chấm chỉ sang mặt trăng kế tiếp.
   Bấm BẮT ĐẦU thì nàng bay vọt sang trăng đó rồi mới đếm ngược. */
.jump-menu{position:absolute;inset:0;z-index:10;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:min(2.4vh,16px);padding:clamp(50px,9vh,80px) 14px clamp(12px,3vh,24px);overflow:hidden;background:radial-gradient(ellipse 84% 66% at 50% 44%,#1d7c8a2e 0,#04303ea8 54%,#011a25ee 100%);opacity:0;visibility:hidden;transition:opacity .24s ease,visibility .24s ease;touch-action:manipulation;user-select:none;-webkit-user-select:none}
.jump-menu.is-visible{opacity:1;visibility:visible}.jump-menu.is-leaving{opacity:0;pointer-events:none}
.jump-menu-decor{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.jump-menu-cloud{position:absolute;width:48%;object-fit:contain;opacity:.13;filter:saturate(.35) hue-rotate(160deg);animation:jump-cloud-drift 16s ease-in-out infinite}
.jump-menu-cloud.cloud-a{left:-14%;bottom:4%}.jump-menu-cloud.cloud-b{right:-16%;top:20%;width:40%;animation-delay:-8s}
.jump-star{position:absolute;width:3px;height:3px;border-radius:50%;background:#eafcff;box-shadow:0 0 8px 2px #8fe3f07a;animation:jump-star-twinkle 4.2s ease-in-out infinite}
.jump-star.star-a{left:13%;top:26%}.jump-star.star-b{left:25%;top:58%;animation-delay:-.7s}.jump-star.star-c{right:17%;top:33%;animation-delay:-1.5s}.jump-star.star-d{right:27%;bottom:31%;animation-delay:-2.3s}.jump-star.star-e{left:41%;top:16%;animation-delay:-3.1s}.jump-star.star-f{right:9%;bottom:44%;animation-delay:-1.9s}.jump-star.star-g{left:8%;bottom:22%;animation-delay:-2.8s}

.jump-menu-title{position:relative;z-index:3;margin:0;text-align:center}
.jump-menu-title span{display:block;margin-bottom:clamp(11px,2.2vh,18px);color:#7fd3d8;font-size:9px;font-weight:600;letter-spacing:.26em}
.jump-menu-title h3{margin:0;color:#fff1c4;font-family:'SVN Gang of Three','Be Vietnam Pro',sans-serif;font-size:clamp(38px,9vw,74px);font-weight:400;line-height:1.02;text-transform:uppercase;text-shadow:0 4px 0 #0a5560,0 13px 30px #00131d99}

/* Khung cảnh: trăng kế tiếp ở trên lệch phải, trăng đang đứng ở dưới lệch trái. */
/* Tỉ lệ lấy đúng từ lúc chơi: Hằng Nga cao bằng 0,75 đường kính mặt trăng
   (trong game là 93/140), nên khung cảnh này đọc ra đúng thế đứng thật. */
.jump-menu-scene{--scene:min(62vw,31vh,268px);position:relative;z-index:3;width:var(--scene);height:calc(var(--scene) * 1.18);flex:0 0 auto}
.jump-menu-moon{position:absolute;object-fit:contain;filter:drop-shadow(0 0 22px #ffe2a355)}
.jump-menu-moon.moon-near{left:8%;top:60%;width:46%;animation:jump-moon-float 5.6s ease-in-out infinite}
.jump-menu-moon.moon-far{left:54%;top:4%;width:40%;filter:drop-shadow(0 0 20px #9fe6f055) hue-rotate(48deg) saturate(.72) brightness(1.04);animation:jump-moon-float 6.8s ease-in-out infinite reverse}
.jump-menu-aim{position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:none;stroke:#ffe6aab8;stroke-width:1.6;stroke-linecap:round;stroke-dasharray:2 5;animation:jump-aim-march 1.1s linear infinite}
.jump-menu-hero{position:absolute;left:19.5%;top:34%;width:23%;height:29.2%}
.jump-menu-hero img{width:100%;height:100%;object-fit:contain;object-position:bottom center;filter:drop-shadow(0 6px 16px #00161f7a);animation:jump-hero-bob 3.4s ease-in-out infinite}
.jump-menu.is-leaping .jump-menu-hero{animation:jump-hero-across .62s cubic-bezier(.35,0,.6,1) forwards}
.jump-menu.is-leaping .jump-menu-hero img{animation:jump-hero-up .62s cubic-bezier(.2,.75,.4,1) forwards}
.jump-menu.is-leaping .jump-menu-aim{opacity:0;transition:opacity .18s ease}
.jump-menu.is-leaping .moon-far{animation:jump-moon-land .5s ease-out .5s}
.jump-menu.is-leaping .moon-near{animation:jump-moon-push .42s ease-out}

.jump-menu-rules{position:relative;z-index:3;display:flex;align-items:center;justify-content:center;gap:14px;padding:10px 4px;border-top:1px solid #9fe2ec33;border-bottom:1px solid #9fe2ec33;color:#bfe6e8;font-size:8px;letter-spacing:.06em;text-transform:uppercase}
.jump-menu-rules span{display:flex;flex-direction:column;align-items:center}
.jump-menu-rules b{margin-bottom:3px;color:#fff0bd;font-family:'SVN Gang of Three','Be Vietnam Pro',sans-serif;font-size:19px;font-weight:400}
.jump-menu-rules i{width:1px;height:26px;background:#8fd6e04d}

.jump-menu-actions{position:relative;z-index:3;display:flex;align-items:center}
.jump-menu-play{display:flex;width:min(60vw,230px);height:46px;align-items:center;justify-content:center;border:1px solid #ffd387;border-radius:6px;background:linear-gradient(180deg,#e7853d,#b84523);box-shadow:inset 0 0 0 2px #f6b55d,0 9px 20px #00151f7a;color:#fff1bd;font-family:'Be Vietnam Pro',sans-serif;font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;cursor:pointer}
.jump-menu-play:hover{background:linear-gradient(180deg,#f0974c,#d05a2d)}
.jump-menu-play:active{transform:translateY(2px)}
.jump-menu-play[disabled]{opacity:.45;cursor:not-allowed}
.jump-menu-sound{position:absolute;left:100%;margin-left:10px;display:grid;width:46px;height:46px;padding:0;place-items:center;border:1px solid #9fe2ec63;border-radius:50%;background:#06384694;color:#d8f4f7;font:700 17px/1 sans-serif;backdrop-filter:blur(6px);cursor:pointer}
.jump-menu-sound:hover{background:#0b5060b0}
.jump-menu-sound i{position:relative;font-style:normal;line-height:1}
.jump-menu-sound[aria-pressed="true"]{color:#79a2ab}
.jump-menu-sound[aria-pressed="true"] i:after{content:'';position:absolute;left:-40%;right:-40%;top:50%;height:2px;border-radius:2px;background:currentColor;transform:rotate(-45deg)}
.jump-menu-play:focus-visible,.jump-menu-sound:focus-visible{outline:3px solid #fff0bd;outline-offset:3px}

.jump-menu-hint{position:relative;z-index:3;margin:0;color:#a9dfe6;font-size:9px;font-weight:600;letter-spacing:.13em;text-align:center;text-transform:uppercase;animation:jump-hint-pulse 2.8s ease-in-out infinite}
.jump-menu-message{position:relative;z-index:3;margin:0;color:#ffc98c;font-size:9px;font-weight:600;letter-spacing:.08em;text-align:center;text-transform:uppercase}
.jump-menu-message:empty{display:none}
.jump-game-stage.is-menu .moon-game-hud,.jump-game-stage.is-menu .jump-game-status,.jump-game-stage.is-menu .jump-button,.jump-game-stage.is-menu .moon-game-tip{opacity:0;visibility:hidden;pointer-events:none}

/* Đếm ngược 3 giây trước khi rời trăng. */
.jump-countdown{position:absolute;inset:0;z-index:7;display:grid;align-content:center;justify-items:center;gap:10px;pointer-events:none;background:radial-gradient(ellipse 62% 46% at 50% 50%,#02222e66,transparent 72%);opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s ease}
.jump-countdown.is-visible{opacity:1;visibility:visible}
.jump-countdown strong{color:#fff1c4;font-family:'SVN Gang of Three','Be Vietnam Pro',sans-serif;font-size:clamp(76px,19vh,142px);font-weight:400;line-height:1;text-shadow:0 6px 0 #0a5560,0 16px 40px #00131db5}
.jump-countdown span{color:#a9dfe6;font-size:9px;font-weight:600;letter-spacing:.3em;text-transform:uppercase}
.jump-countdown.is-go strong{color:#ffd26a;font-size:clamp(44px,11vh,84px)}
.jump-countdown.is-tick strong{animation:jump-count-pop .5s cubic-bezier(.2,.9,.3,1.18)}

@keyframes jump-cloud-drift{0%,100%{transform:translateX(0)}50%{transform:translateX(20px)}}
@keyframes jump-star-twinkle{0%,100%{opacity:.18;transform:scale(.6)}50%{opacity:1;transform:scale(1)}}
@keyframes jump-moon-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-5%)}}
@keyframes jump-hero-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-4%)}}
@keyframes jump-aim-march{to{stroke-dashoffset:-14}}
/* Trục ngang đi đều, trục dọc bật mạnh rồi chậm dần — hai lớp ghép lại thành
   một đường vòng cung, thứ một transform đơn không làm được. */
@keyframes jump-hero-across{0%{transform:translateX(0)}100%{transform:translateX(187%)}}
@keyframes jump-hero-up{0%{transform:translateY(0)}13%{transform:translateY(7%) scaleY(.9) scaleX(1.07)}34%{transform:translateY(-102%) scaleY(1.07) scaleX(.94)}60%{transform:translateY(-206%)}80%{transform:translateY(-194%)}100%{transform:translateY(-198%)}}
@keyframes jump-moon-push{0%{transform:translateY(0)}30%{transform:translateY(3%) scale(.97)}100%{transform:translateY(0)}}
@keyframes jump-moon-land{0%{filter:drop-shadow(0 0 20px #9fe6f055) hue-rotate(48deg) saturate(.72) brightness(1.04)}22%{filter:drop-shadow(0 0 36px #ffeeb8) hue-rotate(48deg) saturate(.9) brightness(1.32)}100%{filter:drop-shadow(0 0 20px #9fe6f055) hue-rotate(48deg) saturate(.72) brightness(1.04)}}
@keyframes jump-hint-pulse{0%,100%{opacity:.55}50%{opacity:1}}
@keyframes jump-count-pop{0%{transform:scale(1.75);opacity:0}45%{opacity:1}100%{transform:scale(1);opacity:1}}
@media(max-width:700px){.jump-menu{padding-top:clamp(42px,8vh,66px)}.jump-menu-scene{--scene:min(58vw,26vh,226px)}}
@media(max-height:620px){.jump-menu{gap:min(1.8vh,11px);padding-top:36px}.jump-menu-title span{display:none}.jump-menu-title h3{font-size:clamp(26px,6vh,40px)}.jump-menu-scene{--scene:min(34vw,27vh,170px)}.jump-menu-hint{display:none}.jump-menu-rules{padding:6px 4px;gap:11px}.jump-menu-rules b{font-size:16px}.jump-menu-play{height:40px}.jump-menu-sound{width:40px;height:40px}}

/* Đăng nhập: nút gọn ở góc phải màn chọn game, bấm ra một modal nhỏ. */
.login-trigger{margin-left:auto;display:flex;flex:0 0 auto;width:max-content;height:43px;padding:0 17px 0 13px;align-items:center;gap:9px;border:1px solid #ffd78c80;border-radius:50px;background:#fff0c214;color:#ffe9bd;font-family:'Be Vietnam Pro',sans-serif;font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;cursor:pointer;transition:background .2s ease}
.login-trigger:hover{background:#fff0c22e}
.login-trigger:focus-visible{outline:3px solid #ffe9bd;outline-offset:3px}
.login-trigger svg{display:block;width:17px;height:17px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.login-trigger.has-avatar svg{display:none}
.login-avatar{display:block;width:24px;height:24px;flex:0 0 auto;margin-left:-4px;border:1px solid #ffd78c9c;border-radius:50%;object-fit:cover;background:#5c2410}
.login-avatar[hidden]{display:none}
.game-header .login-trigger b{font:inherit;letter-spacing:inherit;color:inherit;max-width:9.5em;overflow:hidden;text-overflow:ellipsis}

.login-dialog{width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:24px;border:0;display:none;place-items:center;background:transparent;overflow:hidden}
.login-dialog[open]{display:grid}
.login-dialog::backdrop{background:#2a0d07c4;backdrop-filter:blur(7px) saturate(.85)}
.login-card{position:relative;width:min(100%,344px);padding:34px 30px 26px;border:1px solid #ffd98d7a;border-radius:20px;background:linear-gradient(155deg,#8a3419f0,#48180ef7);box-shadow:inset 0 0 0 4px #ffe0a70d,0 26px 60px #1c060296;text-align:center;animation:login-pop .26s cubic-bezier(.2,.9,.3,1.1)}
.login-card:before{content:'';position:absolute;left:50%;top:-1px;width:58%;height:1px;background:linear-gradient(90deg,transparent,#ffdc9e,transparent);transform:translateX(-50%)}
.login-close{position:absolute;top:11px;right:11px;display:grid;width:32px;height:32px;padding:0;place-items:center;border:1px solid #ffd78c4d;border-radius:50%;background:#fff0c20f;color:#ffe0ab;cursor:pointer}
.login-close:hover{background:#fff0c226}
.login-close svg{display:block;width:44%;height:44%;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round}
.login-kicker{display:block;color:#f2ab5c;font-size:8px;font-weight:600;letter-spacing:.28em}
.login-card-avatar{display:block;width:62px;height:62px;margin:13px auto -2px;border:2px solid #ffd98d;border-radius:50%;object-fit:cover;background:#5c2410;box-shadow:0 8px 20px #1c060266}
.login-card-avatar[hidden]{display:none}
.login-card h2{margin:9px 0 10px;color:#ffe9b5;font-family:'SVN Gang of Three','Be Vietnam Pro',sans-serif;font-size:clamp(34px,7vw,44px);font-weight:400;line-height:1;text-transform:uppercase;text-shadow:0 4px 0 #7f2515}
.login-copy{max-width:250px;margin:0 auto 20px;color:#f6dcb4;font-size:11px;line-height:1.65}
.login-google-slot{display:flex;width:100%;min-height:44px;align-items:center;justify-content:center;overflow:hidden}
.login-google-slot[hidden],.login-google[hidden]{display:none}
/* Khi trình duyệt đã có phiên Google, renderButton đổi sang nút "Đăng nhập với
   tên …" — nó tự giãn theo độ dài tên và email nên phình ra ngoài thẻ. Kẹp mọi
   hộp con lại và cho chữ cắt bằng dấu ba chấm; nút thường vốn đã vừa khít nên
   mấy dòng này không đụng gì tới nó. */
.login-google-slot div,.login-google-slot span,.login-google-slot iframe,.login-google-slot [role="button"]{max-width:100%!important;min-width:0!important}
.login-google-slot [role="button"]{overflow:hidden}
.login-google-slot span{overflow:hidden;text-overflow:ellipsis}
.login-google{display:flex;width:100%;height:48px;padding:0 18px;align-items:center;justify-content:center;gap:11px;border:1px solid #fff3dc;border-radius:9px;background:linear-gradient(180deg,#fffdf8,#f2e5d1);box-shadow:0 6px 16px #1c060252;color:#3b291c;font-family:'Be Vietnam Pro',sans-serif;font-size:12px;font-weight:600;letter-spacing:.03em;white-space:nowrap;cursor:pointer;transition:background .2s ease,transform .12s ease}
.login-google:hover{background:linear-gradient(180deg,#fff,#fbf1e3)}
.login-google:active{transform:translateY(1px)}
.login-google:focus-visible{outline:3px solid #ffe9bd;outline-offset:3px}
.login-google-mark{display:grid;width:22px;height:22px;flex:0 0 auto;place-items:center;border-radius:50%;background:#fff;box-shadow:0 0 0 1px #0000000f}
.login-google-mark svg{width:17px;height:17px;display:block}
.login-note{display:flex;align-items:center;justify-content:center;gap:7px;margin:15px 0 0;padding-top:14px;border-top:1px solid #ffdca02e;color:#f0c79a;font-size:9px;font-weight:500;line-height:1.5;letter-spacing:.02em}
.login-note i{flex:0 0 auto;color:#f5b969;font-style:normal;font-size:10px}
.login-note span{text-align:left}
.login-note b{color:#ffeac2;font-weight:700}
@keyframes login-pop{from{opacity:0;transform:translateY(12px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:700px){.login-trigger{height:36px;padding:0 13px 0 10px;gap:7px;font-size:9px}.login-trigger svg{width:15px;height:15px}.login-card{padding:30px 22px 22px}.login-card h2{font-size:34px}.login-copy{font-size:10px;margin-bottom:17px}.login-google{height:45px;font-size:11px}}
@media(max-height:620px){.login-trigger{height:34px}.login-dialog{padding:14px}.login-card{padding:22px 22px 18px}.login-card h2{font-size:30px;margin:6px 0 7px}.login-copy{margin-bottom:13px;font-size:10px}.login-google{height:42px}.login-note{margin-top:11px;padding-top:10px}}
.cuoi-card .leaderboard-nickname{min-height:10px;margin:-1px 0 4px;color:#a16b44;font-size:7px;font-weight:600;letter-spacing:.08em}

/* Cá chép sprite 8 khung (lưới 4x2): chỉ đuôi và vây động, đầu đứng yên. */
.koi-swimmer{position:absolute;z-index:9;width:clamp(230px,25vw,420px);aspect-ratio:1;pointer-events:none;filter:drop-shadow(0 12px 18px #a94c172c);will-change:transform,opacity;transition:transform .85s cubic-bezier(.2,.75,.2,1),opacity .6s ease}
.koi-left{left:8%;top:18%;animation:koi-float-left 8s ease-in-out infinite}
.koi-right{right:8%;top:36%;animation:koi-float-right 9s ease-in-out infinite -3.5s}
.koi-sprite{position:absolute;inset:0;display:block;background-image:url('assets/koi-sprite-fixed-head-v4.webp');background-repeat:no-repeat;background-size:400% 200%;background-position:0 0;animation:koi-tail-frames 1.44s steps(1,end) infinite}
.koi-right .koi-sprite{transform:scaleX(-1)}
@keyframes koi-tail-frames{0%,12.49%{background-position:0 0}12.5%,24.99%{background-position:33.333% 0}25%,37.49%{background-position:66.667% 0}37.5%,49.99%{background-position:100% 0}50%,62.49%{background-position:0 100%}62.5%,74.99%{background-position:33.333% 100%}75%,87.49%{background-position:66.667% 100%}87.5%,100%{background-position:100% 100%}}
@keyframes koi-float-left{0%,100%{transform:translate(0,0) rotate(-5deg)}35%{transform:translate(13px,-10px) rotate(-2deg)}70%{transform:translate(5px,8px) rotate(-6deg)}}
@keyframes koi-float-right{0%,100%{transform:translate(0,0) rotate(5deg)}40%{transform:translate(-14px,-11px) rotate(2deg)}72%{transform:translate(-5px,7px) rotate(6deg)}}
.festival.is-ranking .koi-swimmer{animation-play-state:paused;opacity:.18}
.festival.is-ranking .koi-left{transform:translateX(-13vw) rotate(-8deg)}
.festival.is-ranking .koi-right{transform:translateX(13vw) rotate(8deg)}
@media(max-width:700px){.koi-swimmer{width:38vw}.koi-left{left:-1%;top:25%}.koi-right{right:-1%;top:44%}.festival.is-ranking .koi-left{transform:translateX(-9vw)}.festival.is-ranking .koi-right{transform:translateX(9vw)}}
@media(max-height:550px){.koi-swimmer{width:16vw}.koi-left{top:20%}.koi-right{top:40%}}

/* Núi hồng san hô và mây đỏ ôm hai góc dưới. */
.coral-range{position:absolute;bottom:1%;width:38%;height:auto;object-fit:contain;z-index:5;pointer-events:none;opacity:.8;filter:drop-shadow(0 12px 18px #b84c2422);animation:coral-breathe 11s ease-in-out infinite;transform-origin:50% 100%}
.coral-range-left{left:-10%}
.coral-range-right{right:-10%;transform:scaleX(-1);animation-delay:-5s}
.corner-red-cloud{position:absolute;bottom:-13%;width:38%;height:auto;object-fit:contain;z-index:5;pointer-events:none;opacity:.88;filter:drop-shadow(0 8px 16px #a9492024);animation:corner-cloud-drift 12s ease-in-out infinite;transform-origin:50% 80%}
.corner-red-cloud-left{left:-13%;transform:scaleX(-1)}
.corner-red-cloud-right{right:-13%;animation-delay:-6s}
@keyframes coral-breathe{0%,100%{translate:0 0}50%{translate:0 -7px}}
@keyframes corner-cloud-drift{0%,100%{translate:0 0}50%{translate:0 -9px}}
.festival .coral-range,.festival .corner-red-cloud{transition:transform .9s cubic-bezier(.2,.75,.2,1),opacity .65s ease,filter .8s ease}
.festival.is-ranking .coral-range-left{transform:translateX(-22vw)}
.festival.is-ranking .corner-red-cloud-left{transform:translateX(-22vw) scaleX(-1)}
.festival.is-ranking .coral-range-right,.festival.is-ranking .corner-red-cloud-right{transform:translateX(22vw) scaleX(-1)}
@media(max-width:700px){.coral-range{width:52%;bottom:3%}.coral-range-left{left:-18%}.coral-range-right{right:-18%}.corner-red-cloud{width:52%;bottom:-7%}.corner-red-cloud-left{left:-22%}.corner-red-cloud-right{right:-22%}}

/* Mây tiền cảnh giữ đúng tỉ lệ ảnh gốc (2032x774) thay vì bị kéo giãn. */
.foreground,.foreground-center{height:auto;object-fit:contain}
.foreground-left,.foreground-right{bottom:-20%}
.foreground-center{bottom:-38%}
@media(max-width:700px){.foreground-left,.foreground-right{bottom:-4%}.foreground-center{bottom:-11%}}

/* Nút Khám phá: chặn `button:hover` nền kem của global làm chữ kem chìm mất. */
.explore-button:hover,.explore-button:focus-visible{background:linear-gradient(180deg,#e8712c,#bf441a);color:#fff8e6}
.explore-button:hover span,.explore-button:focus-visible span{color:#ffe3a0}
.explore-button:hover:before,.explore-button:hover:after{background:#e8712c}
.explore-button:active{transform:translateY(0);background:linear-gradient(180deg,#c4501c,#9c3413);color:#fff4d2;box-shadow:inset 0 0 0 2px #f0c477,0 3px 9px #8c411b3d}

/* Cảnh múa lân: layer tiền cảnh là ảnh full-frame 1672x941, ép vào khung dẹt bằng
   object-fit:fill nên hoa sen bị kéo giãn ngang; cắt theo mép dưới thay vì bóp hình. */
.symphony-slide[data-scene="lion"] .symphony-foreground{height:30%;bottom:-4%;object-fit:cover;object-position:center bottom}
@keyframes ensemble-sway{0%,100%{transform:translateX(-50%) translateY(0) rotate(calc(var(--tilt,0deg) - .55deg))}50%{transform:translateX(-50%) translateY(-10px) rotate(calc(var(--tilt,0deg) + .55deg))}}
/* Đoàn trẻ nghiêng theo bờ đường chéo của nền. */
.symphony-slide[data-scene="lion"] .symphony-performers{--tilt:-3deg;transform-origin:50% 82%}