header{padding:28px 5%;}header nav{gap:9px;font-size:11px}header nav button{min-height:38px;padding:7px 15px;border:1px solid transparent;border-radius:22px;color:#d9e1e7b8;letter-spacing:1px;background:linear-gradient(135deg,#07142630,#c8dff006);backdrop-filter:blur(8px);transition:color .35s,border-color .35s,background .35s,box-shadow .35s}header nav button:hover,header nav button:focus-visible{color:#fff1d4;border-color:#d9c49c36;background:linear-gradient(135deg,#17304988,#0d1c2f5c);box-shadow:inset 0 1px #ffffff12,0 8px 30px #0002}.wish-nav{border-color:#d4bc8e42!important;padding:7px 17px!important;color:#ead7b3!important;background:linear-gradient(135deg,#caa76118,#6b9db10c)!important}.brand-symbol{font-size:35px}.brand>span:last-child{font-size:20px}#home{left:7%;top:27%;max-width:480px;padding:28px 34px 31px 0;transform-origin:12% 48%;transition:opacity 1.4s,filter 1.4s,transform 1.4s}#home::before{content:'';position:absolute;inset:-22px -36px -22px -28px;z-index:-1;background:radial-gradient(ellipse at 10% 45%,#0a18378c,transparent 68%);filter:blur(12px);opacity:.45}#home .eyebrow{font-size:8px;letter-spacing:3px;opacity:.7}#home h1{font-size:clamp(38px,4.1vw,60px);letter-spacing:4px;line-height:1.5;margin:18px 0}#home .intro{font-size:11px;letter-spacing:1.5px;line-height:2.2}#home .explore{margin-top:26px;font-size:11px;gap:34px;padding:10px 15px 10px 0;border-bottom-color:#d8c59650;color:#e9e4d9;transition:gap .35s,color .35s,text-shadow .35s}#home .explore:hover{gap:45px;color:#fff4d8;text-shadow:0 0 18px #f0d5a150}.art-star.featured .star-label{opacity:0}.art-star:hover .star-label,.art-star:focus-visible .star-label{opacity:1}footer{bottom:28px;left:5%;right:5%}.ocean-status{font-size:9px;opacity:.7}.footer-tools{gap:8px}.footer-tools button{min-height:38px;padding:7px 13px;border:1px solid transparent;border-radius:20px;background:#07152524;color:#c9d3d9a8;backdrop-filter:blur(8px);transition:.35s}.footer-tools button:hover{border-color:#b7d0dd2e;background:#0f263a88;color:#edf6f8}#settingsBtn{font-size:10px}#soundBtn{font-size:16px!important}#fullscreenBtn{font-size:19px!important;padding:6px 11px!important}body.viewing #settingsBtn{display:none}
#introLight{--beam-x:0px;--beam-y:0px;--beam-length:0px;--beam-angle:0rad;position:fixed;z-index:6;left:var(--beam-x);top:var(--beam-y);width:var(--beam-length);height:1px;transform:rotate(var(--beam-angle));transform-origin:left center;opacity:0;pointer-events:none;background:linear-gradient(90deg,transparent,#e8d6b65c 38%,#d9ecffb3 86%,#fff)}#introLight i{position:absolute;inset:-2px 0;background:linear-gradient(90deg,#f0d7a900,#f4dfb46b 30%,#cde7ff8f 72%,#fff 100%);clip-path:polygon(0 46%,100% 0,100% 100%,0 54%);filter:blur(1px);transform-origin:left center}#introLight b{position:absolute;right:-3px;top:-3px;width:7px;height:7px;border-radius:50%;background:#fff7dd;box-shadow:0 0 8px #fff,0 0 24px #bcd8ff,0 0 55px #d7c7ff}.intro-arrival #home{animation:home-arrival 1.65s cubic-bezier(.16,1,.3,1) both}.intro-guiding #home{animation:home-to-light 3.2s cubic-bezier(.4,0,.2,1) forwards}.intro-guiding #introLight{animation:beam-appear 3.35s ease-in-out forwards}.intro-complete #home{opacity:0;filter:blur(14px);transform:translateX(30px) scaleX(.08);pointer-events:none}.intro-complete #introLight{opacity:0}.art-star.intro-target::before{animation:target-pulse 2.4s ease-out 2;box-shadow:0 0 9px 3px #fff,0 0 30px 9px #dce9ff8c,0 0 72px #dbc89659}@keyframes home-arrival{from{opacity:0;transform:translateX(-30px);filter:blur(14px)}to{opacity:1;transform:none;filter:blur(0)}}@keyframes home-to-light{0%{opacity:1;filter:blur(0);transform:none}58%{opacity:.65;filter:blur(4px);transform:translateX(16px) scaleX(.84)}100%{opacity:0;filter:blur(16px);transform:translateX(38px) scaleX(.04)}}@keyframes beam-appear{0%{opacity:0;transform:rotate(var(--beam-angle)) scaleX(.04)}24%{opacity:.95;transform:rotate(var(--beam-angle)) scaleX(.45)}70%{opacity:.82;transform:rotate(var(--beam-angle)) scaleX(1)}100%{opacity:0;transform:rotate(var(--beam-angle)) scaleX(1)}}@keyframes target-pulse{0%,100%{transform:scale(1)}36%{transform:scale(2.25)}55%{transform:scale(1.35)}}
#sceneSettings{max-width:600px;width:92vw;max-height:86vh;padding:30px;overflow:auto}#sceneSettings .scene-controls{position:static;max-width:none;color:#d8e3ef;text-align:left;opacity:1;visibility:visible;pointer-events:auto}#sceneSettings .scene-controls>div{flex-wrap:wrap;justify-content:flex-start;gap:12px;padding:13px;margin:8px 0;background:#15233599}#sceneSettings .scene-controls button{min-height:35px;font-size:11px}#sceneSettings .scene-controls label,#sceneSettings .scene-controls select{font-size:11px}#sceneSettings .scene-controls .world-clock{display:grid;grid-template-columns:1fr auto}#sceneSettings .world-clock span{font-size:10px}#sceneSettings .world-clock output{font-size:12px}#sceneSettings .world-clock input{font-size:11px;width:130px}#sceneSettings .sky-credit{position:static;display:block;font-size:9px;line-height:1.9;color:#97adbf;margin-top:20px}#sceneSettings #sceneStatus{color:#a6bacd;display:block}#sceneSettings #aboutBtn{display:block;margin-top:18px;font-size:11px;color:#dfc89f}#sceneSettings .scene-controls small{display:block;font-size:9px;line-height:1.7}#sceneSettings h2{font-size:25px;margin:12px 0}#sceneSettings .dialog-top{margin-bottom:10px}
@media(max-width:700px){header{padding:18px 6%}header nav{gap:17px;font-size:11px}.brand{gap:8px}.brand-symbol{font-size:27px}.brand>span:last-child{font-size:16px;letter-spacing:3px}.brand small{font-size:6px;letter-spacing:2px}.wish-nav{padding:7px 13px!important}#home{left:8%;top:27%;max-width:84vw}#home h1{font-size:40px}#home .intro{font-size:10px}#home .eyebrow{font-size:7px;letter-spacing:2px}#home .explore{margin-top:23px}footer{bottom:20px;left:6%;right:6%}.ocean-status{display:none}.footer-tools{width:100%;justify-content:space-between}#sceneSettings{padding:22px 18px}#sceneSettings .scene-controls>div{gap:8px;padding:10px}#sceneSettings .world-clock span{font-size:8px}#sceneSettings .world-clock output{font-size:9px}#sceneSettings .world-clock input{width:115px}}


/* A single, quiet wish field floating above the shore. */
#wishPanel[hidden]{display:none}.wishing #home,.wishing #starLayer,.wishing .ocean-status{visibility:hidden;opacity:0;pointer-events:none}.wishing #home button,.wishing #starLayer button{pointer-events:none}body.wishing header nav{visibility:visible}body.wishing header nav>button:not(#wishBtn){display:none}body.wishing footer{display:none}
#wishPanel{position:fixed;z-index:9;left:50%;bottom:15%;transform:translateX(-50%);width:min(580px,88vw);padding:8px 9px 8px 22px;border:1px solid #decba632;border-radius:34px;background:linear-gradient(125deg,#182838a6,#0a142178);box-shadow:0 16px 60px #0003,inset 0 1px 0 #fff1;backdrop-filter:blur(26px) saturate(125%);transition:opacity .7s,transform .7s,border-color .4s,box-shadow .4s}
#wishPanel::before{content:'';position:absolute;left:14%;right:14%;top:-1px;height:1px;background:linear-gradient(90deg,transparent,#ecd3a983,transparent);pointer-events:none}#wishPanel:focus-within{border-color:#e1c49670;box-shadow:0 16px 65px #0004,0 0 28px #e3bb7710,inset 0 1px 0 #fff1}
#wishForm{display:flex;align-items:center;gap:12px;margin:0}#wishText{flex:1;min-width:0;height:46px;padding:0 8px;border:0;background:transparent;color:#eee4d6;font:14px 'Noto Serif SC','Microsoft YaHei',serif;letter-spacing:1.5px;outline:none}#wishText::placeholder{color:#c8c8cc9e;font-size:13px;letter-spacing:1px}#wishForm button{flex:none;display:flex;align-items:center;justify-content:center;gap:9px;height:46px;min-width:92px;padding:0 17px;border-radius:26px;border:1px solid #e4c28b60;background:linear-gradient(130deg,#d8be8b28,#ab8b5310);box-shadow:inset 0 1px 0 #f5dbab15;color:#e9d4ae;font:12px 'Noto Serif SC',serif;letter-spacing:2px;white-space:nowrap;transition:background .3s,box-shadow .3s}#wishForm button span{font-size:20px;line-height:1;letter-spacing:0;text-shadow:0 0 12px #f5cf8955}#wishForm button:hover{background:linear-gradient(130deg,#e6cc9750,#b9925c28);box-shadow:0 0 20px #dfbb6e15}body.wish-launched #wishPanel{opacity:0;transform:translate(-50%,12px);pointer-events:none}
.fireworks-btn[hidden]{display:none}.fireworks-btn{position:fixed;z-index:10;right:4.5%;bottom:8.5%;display:grid;grid-template-columns:31px auto;grid-template-rows:auto auto;column-gap:10px;align-items:center;min-width:154px;padding:11px 17px 11px 12px;border:1px solid #e3cca23d;border-radius:28px;background:linear-gradient(135deg,#0b1c31b5,#16233385);box-shadow:0 14px 45px #0005,inset 0 1px #ffffff12;backdrop-filter:blur(18px);color:#eadfc9;opacity:0;transform:translateY(12px);transition:opacity .6s,transform .6s,border-color .35s,box-shadow .35s}.fireworks-btn.ready{opacity:1;transform:none}.fireworks-btn>span{grid-row:1/3;display:grid;place-items:center;width:31px;height:31px;border:1px solid #d9c39742;border-radius:50%;font-size:18px;color:#f2cf86;text-shadow:0 0 12px #ffc65b}.fireworks-btn b{font:12px 'Noto Serif SC',serif;letter-spacing:2px;text-align:left}.fireworks-btn small{font-size:7px;letter-spacing:1.2px;color:#9fb1bd;text-align:left;margin-top:2px}.fireworks-btn:hover,.fireworks-btn[aria-pressed="true"]{border-color:#ffd8916b;box-shadow:0 14px 55px #0006,0 0 35px #f1b94d14,inset 0 1px #ffffff19}.fireworks-running .fireworks-btn>span{animation:firework-button 1.8s ease-in-out infinite}@keyframes firework-button{50%{transform:scale(1.15) rotate(18deg);box-shadow:0 0 20px #ffcf7655}}
@media(max-width:700px){#wishPanel{bottom:17%;width:88vw;padding:6px 7px 6px 15px;border-radius:30px}#wishText{height:44px;padding:0 3px;font-size:12px;letter-spacing:.5px}#wishText::placeholder{font-size:11px;letter-spacing:.3px}#wishForm{gap:6px}#wishForm button{height:44px;min-width:77px;padding:0 12px;font-size:11px;gap:6px;letter-spacing:1px}.fireworks-btn{right:5%;bottom:6%;min-width:0;padding:9px 12px}.fireworks-btn b,.fireworks-btn small{display:none}.fireworks-btn>span{grid-row:1;width:34px;height:34px}#home{padding-right:0}}
@media(prefers-reduced-motion:reduce){#wishPanel{backdrop-filter:none;transition:none}}

/* Cinematic title: centred like the Earth reference, then condensed into a photon. */
#home{left:50%;top:47%;width:min(620px,88vw);max-width:none;padding:0;transform:translate(-50%,-50%);transform-origin:50% 50%;text-align:center}
#home::before{inset:-20% -10%;background:radial-gradient(ellipse at 50% 52%,#0a183782,transparent 68%)}
#home h1{font-size:clamp(39px,5.2vw,68px);line-height:1.42;margin:18px 0;letter-spacing:.11em}
#home .intro{font-size:11px}.intro-arrival #home{animation:title-arrive 3.2s cubic-bezier(.2,.65,.25,1) both}.intro-guiding #home{animation:title-condense .76s cubic-bezier(.62,0,.82,.2) forwards}
body.intro-arrival header,body.intro-arrival footer,body.intro-arrival #starLayer{opacity:0;filter:blur(4px);pointer-events:none}
body.intro-guiding header,body.intro-guiding footer{opacity:0;filter:blur(4px);pointer-events:none}
body.intro-guiding #starLayer{opacity:1;filter:none;transition:opacity .7s ease}
.intro-complete #home{opacity:0;filter:blur(10px) brightness(2.5);transform:translate(-50%,-50%) scale(.015);pointer-events:none}
#introLight{height:1px;background:linear-gradient(90deg,#fff 0 18%,#eaf7ff 58%,#fff 92%);box-shadow:0 0 2px #fff,0 0 7px #a9dfff,0 0 18px #6bbdff55;will-change:transform,opacity}
#introLight::before{content:'';position:absolute;left:-8px;top:-8px;width:17px;height:17px;border-radius:50%;background:radial-gradient(circle,#fff 0 7%,#dff6ff 12%,#9ddaff55 25%,transparent 62%);box-shadow:0 0 11px #fff,0 0 34px #8bd9ff,0 0 70px #73b8ff88}
#introLight i{inset:-1px 0;background:linear-gradient(90deg,#fff,#dff4ff 72%,#fff);clip-path:polygon(0 43%,100% 27%,100% 73%,0 57%);filter:blur(.25px)}
#introLight b{right:-4px;top:-4px;width:9px;height:9px;background:#fff;box-shadow:0 0 5px 2px #fff,0 0 18px 5px #99d6ff,0 0 42px 10px #bfa6ff77}
.intro-guiding #introLight{animation:ultra-beam 1.85s cubic-bezier(.12,.72,.16,1) forwards}.art-star.intro-target::before{animation:target-lock 1.75s ease-out 1;box-shadow:0 0 8px 3px #fff,0 0 26px 8px #d6edff9c,0 0 68px #a9cfff66}
@keyframes title-arrive{0%{opacity:0;filter:blur(14px);transform:translate(-50%,-48%) scale(1.04);letter-spacing:.12em}18%{opacity:.92;filter:blur(0)}69%{opacity:.92}100%{opacity:.92;transform:translate(-50%,-50%) scale(1);filter:blur(0)}}
@keyframes title-condense{0%{opacity:.92;filter:blur(0) brightness(1);transform:translate(-50%,-50%) scale(1)}60%{opacity:.78;filter:blur(2px) brightness(1.55);transform:translate(-50%,-50%) scale(.18,.035)}83%{opacity:1;filter:blur(.5px) brightness(4);transform:translate(-50%,-50%) scale(.018)}100%{opacity:0;filter:blur(8px) brightness(6);transform:translate(-50%,-50%) scale(.008)}}
@keyframes ultra-beam{0%,42%{opacity:0;transform:rotate(var(--beam-angle)) scaleX(0)}48%{opacity:1;transform:rotate(var(--beam-angle)) scaleX(.08)}63%{opacity:1;transform:rotate(var(--beam-angle)) scaleX(1)}78%{opacity:.95;transform:rotate(var(--beam-angle)) scaleX(1)}100%{opacity:0;transform:rotate(var(--beam-angle)) scaleX(1)}}
@keyframes target-lock{0%,33%{transform:scale(1)}58%{transform:scale(2.45)}72%{transform:scale(1.24)}100%{transform:scale(1)}}
@media(max-width:700px){#home{left:50%;top:47%;width:88vw;max-width:none}#home h1{font-size:clamp(35px,10vw,46px)}#home .intro{font-size:9px;line-height:2}.intro-arrival #home{animation-duration:3s}}
@media(prefers-reduced-motion:reduce){body.intro-arrival header,body.intro-arrival footer,body.intro-arrival #starLayer{opacity:1;filter:none;pointer-events:auto}}
.wish-nav[aria-pressed="true"]{border-color:#edcf8c9a!important;background:linear-gradient(135deg,#caa76132,#6b9db118)!important;box-shadow:0 0 24px #e0bd7018,inset 0 1px #fff2}

/* Feature-film title card: one hero title and a restrained promise beneath it. */
#home .cinematic-title{position:relative;display:flex;flex-direction:column;align-items:center;margin:0;line-height:1;font-weight:300;letter-spacing:normal}
#home .cinematic-title>span{padding-left:.38em;font-size:clamp(78px,8.6vw,118px);font-family:'Noto Serif SC','Microsoft YaHei',serif;font-weight:400;letter-spacing:.38em;color:#f6f0e5;background:linear-gradient(180deg,#fff 8%,#e8e0d2 50%,#bca77f 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 4px 42px #d4c49c2b;filter:drop-shadow(0 2px 4px #0009)}
#home .cinematic-title>small{margin-top:15px;padding-left:.48em;font:500 8px/1 Manrope,sans-serif;letter-spacing:.48em;color:#d7c6a6;opacity:.78;text-shadow:0 0 18px #f0d9a33b}
#home .cinematic-tagline{position:relative;margin:34px 0 0;padding:20px 0 0 .38em;font:300 clamp(14px,1.35vw,19px)/1.5 'Noto Serif SC','Microsoft YaHei',serif;letter-spacing:.38em;color:#e7e2d8;text-shadow:0 3px 24px #000,0 0 18px #e4d4b426}
#home .cinematic-tagline::before{content:'';position:absolute;top:0;left:50%;width:min(250px,52vw);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,#e4d1aa60 35%,#fff4d2aa 50%,#e4d1aa60 65%,transparent);box-shadow:0 0 10px #f5dca132}
#introLight::before{display:none}
@media(max-width:700px){#home .cinematic-title>span{font-size:clamp(72px,20vw,86px);letter-spacing:.31em;padding-left:.31em}#home .cinematic-title>small{font-size:8px;margin-top:14px}#home .cinematic-tagline{margin-top:31px;padding-top:18px;font-size:15px;letter-spacing:.3em;padding-left:.3em}}
