:root{font-family:Inter,"Noto Sans TC",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#e8f2f4;background:#071827;font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:0}button,textarea{font:inherit}button{cursor:pointer}a{color:inherit}.ocean-glow{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 70% 10%,#15455a80,transparent 36%),radial-gradient(ellipse at 10% 70%,#123c5370,transparent 35%);z-index:-1}.site-shell{max-width:1480px;margin:auto}.topbar{height:88px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,5vw,74px);border-bottom:1px solid #ffffff1a}.brand{display:flex;gap:12px;align-items:center;text-decoration:none}.brand-icon{width:40px;height:40px;display:grid;place-items:center;border:1px solid #67c8d2;color:#78dbe1;border-radius:12px;font-size:25px}.brand strong{display:block;font-family:Georgia,"Noto Serif TC",serif;font-size:21px;letter-spacing:.05em}.brand small{display:block;color:#7ea8af;font-size:9px;font-weight:800;letter-spacing:.28em;margin-top:3px}.top-actions{display:flex;align-items:center;gap:16px}.model-pill,.energy-pill{display:inline-flex;align-items:center;gap:9px;border-radius:99px;font-size:11px;font-weight:800;letter-spacing:.1em}.model-pill{color:#a8c5ca}.online-dot{height:7px;width:7px;border-radius:50%;background:#6ed7b9;box-shadow:0 0 12px #6ed7b9}.energy-pill{padding:11px 17px;border:1px solid #67c8d267;background:#164b5a;color:#d5fbf1}.energy-pill:hover{background:#236979}.hero{min-height:510px;display:grid;grid-template-columns:1.06fr .94fr;border-bottom:1px solid #ffffff1a}.hero-copy{padding:90px clamp(28px,6vw,88px) 80px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.eyebrow,.section-kicker{color:#73c6cc;font-size:10px;font-weight:800;letter-spacing:.3em}.eyebrow{display:flex;align-items:center;gap:12px}.eyebrow-line{width:25px;height:1px;background:#5daeb6}.hero h1{font-family:Georgia,"Noto Serif TC",serif;font-weight:400;font-size:clamp(45px,5.7vw,83px);letter-spacing:-.045em;line-height:1.2;margin:24px 0}.hero h1 em{color:#8ce0d7;font-style:normal}.hero p{max-width:490px;color:#9eb8c1;line-height:1.9;font-size:15px;margin:0}.hero-link{display:inline-flex;gap:40px;align-items:center;margin-top:31px;background:#a8e9dd;color:#0b2c3e;padding:15px 20px;text-decoration:none;border-radius:7px;font-size:13px;font-weight:800}.hero-link:hover{background:#cff9ee}.hero-art{position:relative;overflow:hidden;min-height:500px;background:linear-gradient(155deg,#12384a 2%,#0c2e40 42%,#061a2b 100%);border-left:1px solid #ffffff19}.hero-art:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 53% 46%,#74d7d021,transparent 32%),repeating-linear-gradient(110deg,#ffffff06 0 1px,transparent 1px 70px)}.moon{position:absolute;width:190px;height:190px;border-radius:50%;top:21%;left:41%;background:radial-gradient(circle at 40% 40%,#b8eee4,#77b7b9 65%,#4c8598);box-shadow:0 0 90px #76d6c454,0 0 220px #76d6c42b}.ring{position:absolute;border:1px solid #93e5d75a;border-radius:50%;transform:rotate(-21deg)}.ring-one{width:500px;height:220px;left:11%;top:29%}.ring-two{width:360px;height:120px;left:23%;top:41%}.sea-line{position:absolute;width:130%;height:160px;left:-15%;border-top:1px solid #8dc5d555;border-radius:50%}.sea-line-one{top:65%;transform:rotate(-4deg)}.sea-line-two{top:72%;transform:rotate(7deg)}.star{position:absolute;color:#b1efdf}.star-one{left:20%;top:21%;font-size:22px}.star-two{right:16%;top:34%;font-size:28px}.art-caption{position:absolute;left:7%;right:7%;bottom:25px;display:flex;justify-content:space-between;color:#a5c6c6;font-size:9px;font-weight:800;letter-spacing:.22em}.game-section{padding:78px clamp(20px,5vw,74px) 90px}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:26px}.section-heading h2,.rules h2{font:400 clamp(29px,3.2vw,43px)/1.3 Georgia,"Noto Serif TC",serif;margin:9px 0 0}.section-heading>p{font-size:13px;color:#8eabb4}.game-layout{display:grid;grid-template-columns:285px minmax(0,1fr);gap:20px}.puzzle-list{display:flex;flex-direction:column;gap:11px}.puzzle-card,.loading-card{width:100%;min-height:115px;text-align:left;border:1px solid #ffffff1c;border-radius:12px;padding:19px 20px;background:#102c3c;color:#d7e7e9;transition:.2s}.puzzle-card:hover{border-color:#83d4d080;transform:translateY(-2px)}.puzzle-card.active{border-color:#77d5d0;background:#164453;box-shadow:inset 3px 0 0 #8ee8d6}.puzzle-card-top{display:flex;justify-content:space-between;color:#79b5bb;font-size:10px;font-weight:800;letter-spacing:.17em}.puzzle-card strong{display:block;font-family:Georgia,"Noto Serif TC",serif;font-size:20px;font-weight:400;margin-top:14px}.puzzle-card-bottom{display:flex;justify-content:space-between;margin-top:10px;color:#85a6af;font-size:11px}.puzzle-card .solved-tag{color:#98e3bd}.play-column{min-width:0}.story-card{position:relative;overflow:hidden;padding:33px 38px 22px;background:linear-gradient(120deg,#214b58,#163847 70%);border:1px solid #69bcc155;border-radius:14px;min-height:260px}.story-card:after{content:"◈";position:absolute;right:-18px;top:-50px;font-size:230px;color:#b4efe30b}.story-meta{display:flex;gap:12px;align-items:center}.case-label{color:#9de6da;font-size:10px;font-weight:900;letter-spacing:.2em}.difficulty{border:1px solid #9de6da55;color:#b7ddd8;border-radius:99px;padding:4px 9px;font-size:10px}.story-ornament{position:absolute;right:32px;top:7px;color:#9ce6da55;font:90px Georgia,serif}.story-card h3{font:400 clamp(26px,3vw,35px) Georgia,"Noto Serif TC",serif;margin:22px 0 10px}.story-card>p{max-width:700px;color:#d0e3e4;line-height:1.85;margin:0 0 24px;font-size:15px}.story-footer{border-top:1px solid #ffffff29;padding-top:13px;color:#95bfc2;font-size:11px}.story-footer span{font-size:18px;margin-right:5px}.dialogue-card{margin-top:17px;background:#0d2737;border:1px solid #ffffff1d;border-radius:14px;padding:25px 28px;min-height:230px}.dialogue-header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff19;padding-bottom:14px}.dialogue-header h3{font:400 22px Georgia,"Noto Serif TC",serif;margin:5px 0 0}.dialogue-header .section-kicker{margin:0}.host-badge{font-size:10px;color:#a5dcd3;background:#1b4a54;border-radius:99px;padding:7px 11px}.transcript{max-height:450px;overflow-y:auto;padding-top:16px;display:flex;flex-direction:column;gap:11px}.empty-state{text-align:center;color:#8daeb5;padding:18px}.empty-state span{color:#9fe5dd;font-size:28px}.empty-state p{line-height:1.7;font-size:13px}.turn{display:flex;flex-direction:column;gap:5px}.turn-player{align-self:flex-end;max-width:85%;background:#245161;color:#e6f9f5;border-radius:12px 12px 3px 12px;padding:11px 14px;line-height:1.5;font-size:13px}.turn-host{align-self:flex-start;display:flex;gap:9px;align-items:flex-start;max-width:85%;color:#d0e3e5;font-size:13px;line-height:1.55}.turn-host i{font-style:normal;color:#93e0d5}.turn-hint{align-self:center;color:#f1d798;background:#5a48314d;border:1px solid #ae8a5655;border-radius:9px;padding:9px 13px;font-size:12px}.solution{margin-top:16px;padding:17px 19px;background:#2b634d6b;border:1px solid #a9e5bc69;border-radius:10px;color:#d8ffe4;line-height:1.7}.solution strong{display:block;margin-bottom:4px}.composer{margin-top:17px;padding:18px;background:#0e2b3b;border:1px solid #ffffff24;border-radius:14px}.composer-top,.composer-bottom{display:flex;justify-content:space-between;align-items:center;gap:10px}.mode-switch{display:flex;gap:6px}.mode,.hint-button{border:0;border-radius:7px;background:transparent;color:#a5bbc3;padding:8px 11px;font-size:12px}.mode.active{background:#2d5e66;color:#e0fff4}.mode span,.hint-button span{font-size:10px;opacity:.7}.hint-button:hover,.mode:hover{color:#fff;background:#204855}.composer textarea{margin-top:12px;width:100%;resize:vertical;min-height:90px;background:#071f2e;color:#e8f9f5;border:1px solid #ffffff25;border-radius:9px;padding:14px;outline:none;line-height:1.6}.composer textarea:focus{border-color:#84d7d0}.composer textarea::placeholder{color:#6f99a4}.composer-bottom{margin-top:10px}.composer-bottom>span{color:#779fa9;font-size:11px}.send-button{border:0;background:#99e5d8;color:#073044;border-radius:7px;padding:11px 15px;font-size:12px;font-weight:800}.send-button:hover{background:#c8f8e9}.send-button:disabled,.hint-button:disabled{opacity:.45;cursor:not-allowed}.rules{display:grid;grid-template-columns:1fr 1.8fr;gap:35px;padding:55px clamp(20px,5vw,74px);background:#0d2939;border-top:1px solid #ffffff1a}.rule-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.rule-grid>div{border-top:1px solid #5eaaa95c;padding-top:13px}.rule-grid span{color:#75c8c5;font-size:11px;font-weight:900}.rule-grid h3{font:400 19px Georgia,"Noto Serif TC",serif;margin:12px 0 7px}.rule-grid p{font-size:12px;color:#8daab3;line-height:1.65;margin:0}footer{display:flex;justify-content:space-between;gap:20px;padding:28px clamp(20px,5vw,74px);color:#7199a5;font-size:10px;letter-spacing:.08em}dialog{width:min(440px,calc(100% - 30px));border:1px solid #79cfc685;border-radius:16px;background:#123543;color:#e3f2f0;padding:24px;box-shadow:0 30px 90px #0009}dialog::backdrop{background:#01111bcc;backdrop-filter:blur(5px)}.dialog-top{display:flex;justify-content:space-between;align-items:center}.dialog-icon{font-size:28px;color:#b2f0d9}.close-dialog{background:transparent;border:0;color:#a6c0c6;font-size:25px}.dialog-top+ h2{font:400 27px Georgia,"Noto Serif TC",serif;margin:10px 0}.dialog-top~p{color:#a2bcc2;font-size:13px;line-height:1.7}.reward-button{display:flex;width:100%;align-items:center;justify-content:space-between;margin-top:9px;padding:13px;border-radius:8px;border:1px solid #79cfc666;background:#1d5260;color:#dff9f0;text-align:left;font-size:13px}.reward-button:hover{background:#286878}.reward-button:disabled{opacity:.5;cursor:not-allowed}.reward-button small{display:block;color:#a8c6c7;margin-top:3px}.dialog-note{border-top:1px solid #ffffff29;padding-top:12px}.toast{position:fixed;left:50%;bottom:25px;transform:translateX(-50%) translateY(15px);opacity:0;pointer-events:none;background:#d7f7ec;color:#0b3040;padding:12px 17px;border-radius:9px;box-shadow:0 12px 30px #0008;font-size:13px;transition:.2s;z-index:10;max-width:calc(100% - 30px);text-align:center}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}button:focus-visible,a:focus-visible,textarea:focus-visible{outline:2px solid #baf4e8;outline-offset:3px}
@media(max-width:900px){.model-pill{display:none}.hero{grid-template-columns:1fr}.hero-copy{min-height:430px;padding:70px 30px}.hero-art{min-height:270px;border-left:0;border-top:1px solid #ffffff19}.moon{width:130px;height:130px;top:19%;left:43%}.ring-one{left:15%;top:23%}.ring-two{left:20%;top:32%}.game-layout{grid-template-columns:1fr}.puzzle-list{display:grid;grid-template-columns:repeat(3,minmax(170px,1fr));overflow-x:auto;scrollbar-width:none}.puzzle-list::-webkit-scrollbar{display:none}.rules{grid-template-columns:1fr}}
@media(max-width:600px){.topbar{height:72px;padding:0 18px}.brand-icon{width:35px;height:35px}.brand strong{font-size:17px}.brand small{font-size:7px}.energy-pill{font-size:11px;padding:9px 12px}.hero-copy{min-height:390px;padding:52px 23px}.hero h1{font-size:47px}.hero p{font-size:13px}.hero-art{min-height:205px}.moon{width:105px;height:105px;left:42%;top:18%}.ring-one{width:370px;height:160px;top:18%;left:-1%}.ring-two{width:240px;height:90px;left:20%;top:35%}.game-section{padding:55px 16px}.section-heading{align-items:start}.section-heading>p{display:none}.puzzle-list{grid-template-columns:repeat(3,205px);gap:9px;padding-bottom:7px}.puzzle-card{min-height:105px;padding:15px}.story-card{padding:25px 22px}.story-card h3{font-size:29px}.story-card>p{font-size:13px}.dialogue-card{padding:20px 17px}.composer{padding:13px}.composer-bottom>span{max-width:45%;line-height:1.4}.rules{padding:45px 20px}.rule-grid{gap:12px}.rule-grid h3{font-size:16px}.rule-grid p{font-size:11px}footer{padding:25px 20px;flex-direction:column;gap:5px}}
.composer-top{flex-wrap:wrap;gap:8px}.mode-switch{flex-wrap:wrap}
.admin-link{display:inline-flex;align-items:center;min-height:44px;padding:8px;font-size:12px;white-space:nowrap;text-decoration:none}.admin-link:hover{text-decoration:underline}.top-actions{gap:10px}@media(max-width:390px){.topbar{padding:0 10px}.brand-icon{display:none}.brand small{display:none}.top-actions{gap:4px}.admin-link{font-size:11px;padding:4px}.energy-pill{padding:9px 8px}.brand strong{font-size:15px}}.solution .send-button{display:block;margin-top:14px;min-height:44px}
.puzzle-tracks{display:flex;flex-wrap:wrap;gap:4px;width:fit-content;max-width:100%}.puzzle-tracks button{min-height:44px}#track-description{line-height:1.7;margin:12px 0 24px;font-size:14px}.puzzle-list{max-height:720px;overflow-y:auto;align-content:start}.puzzle-card{min-width:0}button:focus-visible,a:focus-visible,textarea:focus-visible{outline:2px solid currentColor;outline-offset:3px}@media(max-width:950px){.puzzle-list{max-height:none;display:grid;grid-template-columns:none;grid-template-rows:1fr;grid-auto-flow:column;grid-auto-columns:205px;overflow-x:auto;overflow-y:hidden;padding:4px 4px 8px}}

/* Compact game flow, using the shared product theme in both modes. */
[hidden]{display:none!important}
:root{font-family:var(--ui-font);color:var(--ui-ink);background:var(--ui-bg)}
.site-shell{max-width:1400px}.topbar{border-color:var(--ui-line)}
.brand strong,.hero h1,.section-heading h2,.story-card h3,.dialogue-header h3{font-family:var(--ui-font)}
.brand small,.eyebrow,.hero p,.entry-note,.section-heading>p,#track-description,.composer-bottom>span,.empty-state,.story-footer,.level-progress{color:var(--ui-muted)}
.hero h1 em{color:var(--ui-accent)}.hero{border-color:var(--ui-line)}.hero-copy{padding-top:60px;padding-bottom:60px}
.entry-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px;align-items:center}.hero-link{margin:0;border:0;background:var(--ui-accent);color:var(--ui-on-accent);min-height:48px;border-radius:6px;letter-spacing:0}.hero-link:hover{background:var(--ui-accent-hover)}
.entry-secondary,.theme-toggle,.level-controls button{border:1px solid var(--ui-line);border-radius:6px;padding:10px 14px;min-height:44px;background:var(--ui-surface);color:var(--ui-ink);font-size:14px}.entry-secondary:hover,.theme-toggle:hover,.level-controls button:hover{background:var(--ui-accent-soft)}.hero .entry-note{font-size:12px;margin-top:20px}
.game-section{padding-top:28px;padding-bottom:36px}.section-heading{margin-bottom:16px}.section-heading h2{font-size:26px}.game-navigation{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}.game-navigation .mode{font-size:14px}.mode,.hint-button{min-height:44px;color:var(--ui-muted)}.mode.active{background:var(--ui-accent-soft);color:var(--ui-accent)}.mode:hover,.hint-button:hover{background:var(--ui-soft);color:var(--ui-ink)}
.game-layout{display:block}.puzzle-list{display:flex;flex-direction:row;align-items:center;flex-wrap:wrap;gap:12px;max-height:none;overflow:visible;padding:12px 0;margin-bottom:18px;border-top:1px solid var(--ui-line);border-bottom:1px solid var(--ui-line)}
.puzzle-list label{font-size:14px}.puzzle-list select{flex:1;min-width:0;max-width:450px;border:1px solid var(--ui-line);border-radius:6px;background:var(--ui-surface);color:var(--ui-ink);min-height:44px;padding:8px 12px;font:inherit}.level-controls{display:flex;gap:6px}.level-progress{font-size:13px;margin-left:auto}
.story-card,.dialogue-card,.composer,.tutorial-guide{background:var(--ui-surface);border:1px solid var(--ui-line);border-radius:6px;color:var(--ui-ink)}.story-card{min-height:0;padding:24px}.story-card>p{color:var(--ui-ink);font-size:16px}.story-card h3{font-size:28px}.story-card:after,.story-ornament{display:none}.case-label{color:var(--ui-accent);font-size:12px}.difficulty,.host-badge{background:var(--ui-soft);border-color:var(--ui-line);color:var(--ui-muted)}.story-footer,.dialogue-header{border-color:var(--ui-line)}
.tutorial-guide{margin-top:16px;padding:20px}.tutorial-guide h3{margin:0 0 12px;font-size:18px}.tutorial-guide ol{padding-left:24px;margin:0;display:grid;gap:10px}.tutorial-guide p{line-height:1.7;margin:4px 0;font-size:14px;color:var(--ui-muted)}#tutorial-progress{color:var(--ui-accent);margin-top:14px}
.dialogue-card{padding:20px}.dialogue-header .section-kicker{display:none}.transcript{min-height:140px;max-height:300px}.turn-player{background:var(--ui-accent-soft);color:var(--ui-ink)}.turn-host{color:var(--ui-ink)}.turn-host i{color:var(--ui-accent)}.turn-hint{background:var(--ui-soft);border-color:var(--ui-line);color:var(--ui-ink)}
.composer textarea{background:var(--ui-soft);color:var(--ui-ink);border-color:var(--ui-line);min-height:90px}.composer textarea::placeholder{color:var(--ui-muted)}.send-button,.energy-pill{background:var(--ui-accent);color:var(--ui-on-accent)}.send-button:hover,.energy-pill:hover{background:var(--ui-accent-hover)}.send-button{min-height:44px}.energy-pill{border-color:var(--ui-accent)}
.solution{background:var(--ui-accent-soft);color:var(--ui-ink);border-color:var(--ui-line)}.rules{background:var(--ui-soft);border-color:var(--ui-line)}.rules h2,.rule-grid h3{font-family:var(--ui-font)}.rule-grid p,footer{color:var(--ui-muted)}.rule-grid span{color:var(--ui-accent)}
dialog{background:var(--ui-surface);color:var(--ui-ink);border-color:var(--ui-line)}.dialog-top~p,.close-dialog{color:var(--ui-muted)}.reward-button{background:var(--ui-accent-soft);color:var(--ui-ink);border-color:var(--ui-line)}.reward-button small{color:var(--ui-muted)}
button:disabled{opacity:.5;cursor:not-allowed}select:focus-visible{outline:2px solid var(--ui-accent);outline-offset:3px}
:root[data-theme="light"] .ocean-glow{display:none}
@media(min-width:1050px){.play-column{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:16px;align-items:start}.story-card{grid-column:1;grid-row:1}.tutorial-guide{grid-column:1;grid-row:2;margin:0}.dialogue-card{grid-column:2;grid-row:1;margin:0}.composer{grid-column:2;grid-row:2;margin:0}}
@media(max-width:600px){.hero-copy{padding:40px 20px;min-height:0}.hero h1{font-size:38px}.hero-art{min-height:175px}.entry-actions{align-items:stretch;flex-direction:column;width:100%}.entry-actions button{width:100%;justify-content:center}.theme-toggle{padding:8px;font-size:12px}.top-actions{gap:4px}.game-section{padding:24px 16px}.section-heading h2{font-size:22px}.section-heading .section-kicker{display:none}.game-navigation .entry-secondary{font-size:12px;padding:8px}.puzzle-list{gap:8px}.puzzle-list label{width:100%}.puzzle-list select{flex-basis:100%;max-width:none;width:100%}.level-progress{margin-left:auto}.story-card h3{font-size:25px}.story-card>p{font-size:16px}.composer-bottom>span{font-size:12px}.rule-grid{grid-template-columns:1fr}.brand strong{font-size:14px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
.game-section .section-kicker,.game-section .section-heading>p{display:none}.game-section .section-heading h2{margin-top:0}.section-kicker{color:var(--ui-muted);font-size:12px}.story-footer{font-size:12px}.brand-icon{color:var(--ui-accent);border-color:var(--ui-accent)}.hero p{font-size:16px}.empty-state p,.turn-player,.turn-host{font-size:14px}.hero .entry-note{font-size:12px}

/* 星空關卡：共用主題、靜態星座路線與可鍵盤操作的關卡星。 */
.star-atlas{padding:40px clamp(16px,5vw,74px) 56px}.atlas-heading{display:flex;justify-content:space-between;align-items:center;gap:16px}.atlas-heading h1{font-size:36px;line-height:1.2;margin:12px 0;color:var(--ui-ink)}.atlas-heading p,.atlas-instruction{color:var(--ui-muted);font-size:14px}.atlas-heading .eyebrow{color:var(--ui-accent);font-size:12px;letter-spacing:.08em}.constellation-map{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 24px;margin-top:32px}.constellation{min-width:0;border-top:1px solid var(--ui-line);padding-top:16px}.constellation h2{font-size:20px;margin:0;color:var(--ui-ink)}.constellation>p{font-size:12px;color:var(--ui-muted);margin:4px 0 12px}.constellation-sky{position:relative;height:220px;background:radial-gradient(circle,var(--ui-line) 1px,transparent 1.5px) 10px 10px/43px 47px}.constellation-sky svg{position:absolute;width:100%;height:100%;overflow:visible}.constellation-sky line{stroke:var(--ui-line);stroke-width:.6;stroke-dasharray:2 2;vector-effect:non-scaling-stroke}.constellation-sky line.lit{stroke:var(--ui-accent);stroke-width:2;stroke-dasharray:none}.level-star{position:absolute;transform:translate(-50%,-50%);width:44px;height:44px;min-height:44px;border-radius:50%;border:1px solid var(--ui-line);background:var(--ui-surface);color:var(--ui-muted);font-size:14px;z-index:1}.level-star.locked:disabled{opacity:1;border-style:dashed}.level-star.available{border:2px solid var(--ui-accent);color:var(--ui-accent);font-weight:700;box-shadow:0 0 0 5px var(--ui-accent-soft)}.level-star.solved{color:var(--ui-on-accent);background:var(--ui-accent);border-color:var(--ui-accent)}.level-star:hover:enabled{outline:2px solid var(--ui-accent);outline-offset:3px}.illuminated h2,.illuminated>p{color:var(--ui-accent)}.illuminated .constellation-sky{background-color:var(--ui-accent-soft);border-radius:6px}.game-navigation>p{margin:0;color:var(--ui-muted);font-size:14px;max-width:65ch}.game-navigation{align-items:center;justify-content:space-between}.puzzle-list>span{color:var(--ui-accent);font-size:14px}.atlas-tests{margin-top:32px;padding-top:20px;border-top:1px solid var(--ui-line)}.atlas-tests summary{color:var(--ui-muted);cursor:pointer;min-height:44px}.atlas-tests button{margin:8px 8px 0 0}.star-atlas button{touch-action:manipulation}
@media(max-width:900px){.constellation-map{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.star-atlas{padding-top:24px}.atlas-heading{align-items:flex-start}.atlas-heading h1{font-size:28px}.atlas-heading>button{font-size:12px;padding:8px}.constellation-map{grid-template-columns:1fr;gap:24px}.constellation-sky{height:240px}.game-navigation{align-items:flex-start}.game-navigation>p{max-width:60%}}
/* Motion follows player progress. Reduced motion keeps every state and label. */
.journey-control{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:24px;padding:18px 0;border-top:1px solid var(--ui-line);border-bottom:1px solid var(--ui-line)}.journey-kicker{font-size:12px;letter-spacing:.12em;color:var(--ui-accent)}.journey-control p{margin:4px 0 0;color:var(--ui-ink);font-size:16px}.journey-control button{flex-shrink:0}.constellation{animation:constellation-arrive .45s ease both;animation-delay:var(--arrival-delay,0ms);transition:border-color .2s}.constellation:hover{border-color:var(--ui-accent)}.constellation-sky{isolation:isolate;background:none}.constellation-sky::before,.constellation-sky::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 9% 15%,var(--ui-muted) 1px,transparent 2px),radial-gradient(circle at 84% 12%,var(--ui-muted) 1px,transparent 2px),radial-gradient(circle at 35% 61%,var(--ui-muted) 1px,transparent 2px),radial-gradient(circle at 87% 68%,var(--ui-muted) 1px,transparent 2px),radial-gradient(circle at 12% 94%,var(--ui-muted) 1px,transparent 2px);opacity:.3;animation:starlight 5s ease-in-out infinite}.constellation-sky::after{transform:rotate(180deg);animation-delay:-2.5s}.constellation:nth-child(even) .constellation-sky::before{animation-delay:-1.8s}.constellation-sky svg{z-index:0}.constellation-sky line{stroke-width:1}.level-star{z-index:1;transition:background .2s,color .2s,border-color .2s,box-shadow .2s,scale .2s}.level-star:hover:enabled{scale:1.12;outline:none}.level-star.available::before{content:"";position:absolute;inset:-7px;border:1px solid var(--ui-accent);border-radius:50%;opacity:.4;animation:star-beacon 2.8s ease-out infinite;pointer-events:none}.level-star.available::after{content:"挑戰";position:absolute;top:calc(100% + 9px);left:50%;transform:translateX(-50%);font-size:12px;color:var(--ui-accent);white-space:nowrap;pointer-events:none}.level-star.just-lit{animation:star-awaken .8s ease-out both}.constellation-sky line.lit.just-connected{stroke-dasharray:1;animation:connect-stars .8s .15s ease-out both}.constellation.just-completed .constellation-sky{animation:constellation-complete 1.2s ease-out}.level-star.departing{animation:star-depart .7s ease-in-out infinite}.atlas-tests{grid-column:1/-1}.illuminated .constellation-sky{background:var(--ui-accent-soft)}
@keyframes constellation-arrive{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}
@keyframes starlight{0%,100%{opacity:.18}50%{opacity:.5}}
@keyframes star-beacon{0%{scale:.92;opacity:.5}75%,100%{scale:1.35;opacity:0}}
@keyframes star-awaken{0%{scale:.55;box-shadow:0 0 0 0 var(--ui-accent-soft)}55%{scale:1.22;box-shadow:0 0 0 18px var(--ui-accent-soft)}100%{scale:1;box-shadow:0 0 0 0 transparent}}
@keyframes connect-stars{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes constellation-complete{0%,100%{box-shadow:0 0 0 0 transparent}45%{box-shadow:0 0 0 8px var(--ui-accent-soft)}}
@keyframes star-depart{50%{scale:.9;opacity:.6}}
@media(max-width:600px){.journey-control{align-items:flex-start;flex-direction:column;gap:12px}.journey-control button{width:100%}.journey-control p{font-size:14px}}
@media(prefers-reduced-motion:reduce){.constellation,.constellation-sky::before,.constellation-sky::after,.level-star,.level-star::before,.constellation-sky line,.constellation.just-completed .constellation-sky{animation:none!important;transition:none!important}.level-star:hover:enabled{scale:1}.level-star.available::before{opacity:.3}.constellation-sky line.lit.just-connected{stroke-dashoffset:0}}
/* Galaxy reveal: photograph stays dark until all five levels are solved. */
.star-atlas{--motion-quick:150ms;--motion-standard:320ms;--motion-reveal:1100ms;--motion-ease:cubic-bezier(.2,.7,.2,1)}.constellation-map{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 36px}.constellation{border-top:0;padding-top:20px;overflow:visible}.constellation h2{font-size:22px}.constellation-sky{height:300px;perspective:900px;border-radius:6px;background:var(--ui-rail);overflow:hidden}.illuminated .constellation-sky{background:var(--ui-rail)}.galaxy-depth{position:absolute;inset:5% 8%;transform:rotateX(28deg) rotateZ(var(--galaxy-angle,-12deg));transform-style:preserve-3d;pointer-events:none;z-index:-1}.galaxy-disc{position:absolute;inset:0;border-radius:50%;overflow:hidden;mask-image:radial-gradient(ellipse,black 25%,rgba(0,0,0,.8) 43%,transparent 70%);opacity:.18;transform:scale(.94)}.galaxy-disc img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) brightness(.25);display:block}.illuminated .galaxy-disc{opacity:1;transform:scale(1);animation:galaxy-orbit 90s linear infinite}.illuminated .galaxy-disc img{filter:none}.just-completed .galaxy-depth{animation:galaxy-awakening var(--motion-reveal) var(--motion-ease) both}.constellation-sky::before,.constellation-sky::after{z-index:-1;background:radial-gradient(circle at 9% 15%,var(--ui-rail-ink) 1px,transparent 2px),radial-gradient(circle at 84% 12%,var(--ui-rail-ink) 1px,transparent 2px),radial-gradient(circle at 35% 61%,var(--ui-rail-ink) 1px,transparent 2px),radial-gradient(circle at 87% 68%,var(--ui-rail-ink) 1px,transparent 2px),radial-gradient(circle at 12% 94%,var(--ui-rail-ink) 1px,transparent 2px)}.constellation-sky svg{z-index:0;opacity:.6}.constellation-sky line{stroke:var(--ui-rail-muted);opacity:.3}.constellation-sky line.lit{opacity:1;stroke:var(--ui-rail-ink)}.level-star{background:var(--ui-rail);color:var(--ui-rail-muted);border-color:var(--ui-rail-muted);width:44px;height:44px;box-shadow:0 3px 12px #0008}.level-star.locked:disabled{background:var(--ui-rail);color:var(--ui-rail-muted);border-color:var(--ui-line)}.level-star.available{color:var(--ui-rail-ink);border-color:var(--ui-rail-ink);box-shadow:0 0 0 5px #ffffff12}.level-star.available::before{border-color:var(--ui-rail-ink)}.level-star.available::after{color:var(--ui-rail-ink);background:var(--ui-rail);padding:0 5px;border-radius:3px}.level-star.solved{background:var(--ui-rail-ink);color:var(--ui-rail);border-color:var(--ui-rail-ink)}.galaxy-state{font-size:12px;color:var(--ui-muted);margin:10px 0}.illuminated .galaxy-state{color:var(--ui-accent)}.galaxy-credit{margin-top:28px;color:var(--ui-muted);font-size:12px;line-height:1.8;max-width:90ch}.galaxy-credit a{text-decoration:underline;text-underline-offset:3px}.atlas-tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.atlas-tools button{font-size:12px}.constellation.just-completed .constellation-sky{animation:none}.level-star:active:enabled{scale:.95}.level-star:hover:enabled{transition-duration:90ms;scale:1.08}.star-atlas[data-motion-paused="true"] *,.star-atlas[data-motion-paused="true"] *::before,.star-atlas[data-motion-paused="true"] *::after{animation:none!important;transition:none!important}
@keyframes galaxy-orbit{from{rotate:0deg}to{rotate:360deg}}
@keyframes galaxy-awakening{0%{opacity:.05;scale:.83}30%{opacity:.28;scale:.91}100%{opacity:1;scale:1}}
@media(max-width:600px){.constellation-map{grid-template-columns:1fr;gap:18px}.constellation-sky{height:290px}.atlas-heading{flex-wrap:wrap}.atlas-tools{width:100%}.atlas-tools button{flex:1}.galaxy-depth{inset:8% 2%}.atlas-heading h1{margin-bottom:6px}}
@media(prefers-reduced-motion:reduce){.galaxy-disc,.galaxy-depth{animation:none!important}.just-completed .galaxy-depth{opacity:1;scale:1}}
/* Galaxy lobby and detail: stable controls above a moving photographic layer. */
.constellation-map{display:flex;flex-direction:column;gap:28px;max-width:840px;margin:28px auto 0}.galaxy-card{padding:0;animation:constellation-arrive .32s ease both;animation-delay:var(--arrival-delay)}.galaxy-card-heading{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin:0 0 10px}.galaxy-card-heading h2{margin:0;font-size:23px}.galaxy-card-heading p{margin:0;font-size:13px;color:var(--ui-muted)}.galaxy-open{display:block;padding:0;width:100%;border:1px solid var(--ui-line);border-radius:6px;background:var(--ui-rail);text-align:left;color:var(--ui-rail-ink);overflow:hidden}.galaxy-open:disabled{opacity:1;cursor:not-allowed}.galaxy-open-caption{display:block;padding:12px 18px;border-top:1px solid var(--ui-line);font-size:14px;min-height:46px}.galaxy-open:hover:enabled{border-color:var(--galaxy-color)}.galaxy-locked .galaxy-open{filter:grayscale(1)}.galaxy-locked .constellation-sky{opacity:.65}.galaxy-card .constellation-sky{height:280px}.level-star{display:grid;place-items:center;font-size:13px}.level-star.available::after{content:none}.level-star.available::before{animation:star-beacon 3.5s ease-out infinite}.galaxy-card .level-star.available::before{animation:none}.galaxy-card .level-star.available{border-width:1px;box-shadow:none}.illuminated h2{color:var(--ui-accent)}.illuminated .galaxy-open-caption{color:var(--galaxy-color)}.galaxy-detail-heading{display:flex;gap:24px;align-items:center;margin-bottom:24px}.galaxy-detail-heading h2{font-size:28px;margin:0}.galaxy-detail-heading p{font-size:14px;margin:4px 0;color:var(--ui-muted)}.galaxy-detail-scene{padding:0}.galaxy-detail-scene .constellation-sky{height:420px}.level-list-title{font-size:16px;margin:28px 0 10px}.galaxy-level-list{border-top:1px solid var(--ui-line)}.galaxy-list-row{display:block;width:100%;min-height:52px;padding:12px 4px;text-align:left;color:var(--ui-ink);border:0;border-bottom:1px solid var(--ui-line);background:none}.galaxy-list-row:hover{background:var(--ui-accent-soft)}.galaxy-credit{margin-left:auto;margin-right:auto}.level-sheet{position:fixed;inset:auto 0 0;margin:0 auto;width:min(100%,640px);max-width:640px;max-height:85dvh;padding:24px 24px max(24px,env(safe-area-inset-bottom));border-radius:12px 12px 0 0;overflow-y:auto}.sheet-handle{width:40px;height:4px;border-radius:3px;background:var(--ui-line);margin:0 auto 20px}.level-sheet .close-dialog{position:absolute;right:12px;top:12px}.level-sheet h2{margin-top:6px;font-size:25px}.level-sheet p{font-size:16px;line-height:1.8}.level-sheet #sheet-meta,.level-sheet #sheet-note{font-size:13px;color:var(--ui-muted)}.sheet-actions,.help-tools{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.sheet-actions button{flex:1}.help-tools{margin-top:24px}.help-tools a{font-size:14px}.reveal-page .story-card,.reveal-page .tutorial-guide,.reveal-page .composer,.reveal-page #transcript,.reveal-page .dialogue-header{display:none}.reveal-page .play-column{display:block}.reveal-page .dialogue-card{border:0;padding:0;background:none}.reveal-page .solution{display:block;background:var(--ui-surface);padding:24px;border:1px solid var(--ui-line)}.reward-galaxy{margin:22px 0 16px;padding:0}.reward-galaxy h3{font-size:24px;margin:0}.reward-galaxy>p{margin:8px 0;color:var(--ui-muted)}.reward-galaxy .constellation-sky{height:300px;margin-top:16px}.reveal-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}.star-reward .level-star.solved{animation:star-awaken .6s var(--motion-ease,ease-out) both}.just-completed .constellation-sky::after{animation:celebration-halo 1.1s ease-out both;background:radial-gradient(ellipse,transparent 20%,var(--galaxy-color) 40%,transparent 65%)}.just-completed .constellation-sky line.lit{stroke-dasharray:1;animation:connect-stars .5s ease-out both;animation-delay:var(--line-delay,0ms)}.just-completed .galaxy-depth{animation:galaxy-awakening 1.1s cubic-bezier(.2,.7,.2,1) both}.galaxy-disc img{object-fit:cover}.galaxy-open .galaxy-disc{mask-image:radial-gradient(ellipse,black 30%,#000b 48%,transparent 72%)}.galaxy-depth{z-index:-1;inset:-16% 12%}.galaxy-detail-scene .galaxy-depth{inset:0 8%}.star-atlas[data-motion-paused="true"] *,#game[data-motion-paused="true"] *,#game[data-motion-paused="true"] *::before,#game[data-motion-paused="true"] *::after{animation:none!important;transition:none!important}.atlas-tests{width:100%;margin:16px 0 0}.top-actions #help-button{font-size:20px;min-width:44px;padding:4px 12px}.top-actions .energy-pill{font-size:14px}.brand small{display:none}.galaxy-card .level-star{width:28px;height:28px;min-height:0;font-size:11px}.galaxy-card .constellation-sky svg{opacity:.8}.galaxy-card .level-star.locked{font-size:10px}
@keyframes celebration-halo{0%{opacity:0;scale:.65}35%{opacity:.32}100%{opacity:0;scale:1.35}}
.star-reward .level-star.solved{animation:none}.star-reward .level-star.just-lit{animation:star-awaken .6s ease-out both}
@media(max-width:600px){.galaxy-card-heading{display:block}.galaxy-card-heading p{margin-top:5px}.galaxy-card .constellation-sky{height:230px}.galaxy-detail-heading{align-items:flex-start;flex-direction:column;gap:16px}.galaxy-detail-scene .constellation-sky{height:330px}.galaxy-detail-heading h2{font-size:25px}.reward-galaxy .constellation-sky{height:260px}.reveal-page .solution{padding:18px}.reveal-actions button{flex:1;min-width:120px}.galaxy-open-caption{font-size:12px}.sheet-actions{flex-direction:column;align-items:stretch}}
@media(prefers-reduced-motion:reduce){.star-reward .level-star,.just-completed .constellation-sky::after,.just-completed .constellation-sky line.lit{animation:none!important;stroke-dashoffset:0}.just-completed .constellation-sky::after{opacity:0}.galaxy-disc,.galaxy-depth{animation:none!important}}

.atlas-tools .atlas-view-link{display:inline-flex;align-items:center;justify-content:center;min-height:44px;text-decoration:none}.atlas-tools .atlas-view-link:hover{background:var(--ui-accent-soft)}

/* Immersive space: one fixed WebGL backdrop behind every route. Space keeps
   its own astronomical palette in both themes, like the standalone atlas;
   panels keep the shared theme tokens. html.flat restores the layout above. */
.space,.stage-wrap,#atlas-index,.reveal-window,.space-anchor{display:none}
html:not(.flat){--space-bg:#050c18;--space-ink:#e6efff;--space-muted:#a9bad3;--space-line:#2a3d59;--space-accent:#91baff;--space-gold:#efd49a;--panel-depth:0 24px 48px -28px rgb(2 8 18 / .9);background:var(--space-bg)}
html:not(.flat) body{background:transparent}
html:not(.flat) .space{display:block;position:fixed;inset:0;z-index:0;overflow:hidden;background:radial-gradient(ellipse at 42% 46%,#0d1e37 0%,var(--space-bg) 68%)}
html:not(.flat) #space-canvas{display:block;width:100%;height:100%}
html:not(.flat) #space-labels{position:absolute;inset:0;pointer-events:none}
html:not(.flat) .ocean-glow{display:none}
html:not(.flat) .site-shell{position:relative;z-index:1;color:var(--space-ink)}
/* Text and controls that sit directly on space. */
html:not(.flat) :is(.topbar,.atlas-heading h1,.section-heading h2){color:var(--space-ink)}
html:not(.flat) :is(.atlas-heading p,.atlas-instruction,.galaxy-credit,.game-navigation>p,.stage-help,.site-shell>footer){color:var(--space-muted)}
html:not(.flat) .star-atlas>[role="status"]{color:var(--space-muted)}
html:not(.flat) :is(.atlas-heading .eyebrow,.puzzle-list>span,.brand-icon){color:var(--space-accent)}
html:not(.flat) :is(.topbar,.puzzle-list){border-color:var(--space-line)}
html:not(.flat) .brand-icon{border-color:var(--space-accent)}
html:not(.flat) :is(.topbar,.atlas-heading,.stage-wrap,.game-navigation,.galaxy-credit) :is(button,a):focus-visible{outline:2px solid var(--space-accent);outline-offset:3px}
html:not(.flat) .space-stage:focus-visible{outline:2px solid var(--space-accent);outline-offset:-4px}
html:not(.flat) .space-stage:focus:not(:focus-visible){outline:none}
/* Lobby and galaxy: the scene fills a transparent stage beside one index panel. */
html:not(.flat) .star-atlas{padding:20px clamp(16px,4vw,56px) 28px}
html:not(.flat) .atlas-heading{align-items:flex-end}
html:not(.flat) .atlas-heading h1{font-size:30px;margin:4px 0}
html:not(.flat) .atlas-heading p{margin:0}
html:not(.flat) .atlas-instruction{margin:8px 0 0;max-width:65ch}
html:not(.flat) .atlas-body{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:24px;align-items:start;margin-top:16px}
html:not(.flat) .stage-wrap{display:block;position:relative;min-width:0;height:max(440px,calc(100dvh - 290px))}
html:not(.flat) .space-stage{position:absolute;inset:0;border-radius:6px;touch-action:pan-y;cursor:grab;-webkit-user-select:none;user-select:none}
html:not(.flat) .stage-help{position:absolute;left:0;bottom:0;max-width:55%;margin:0;font-size:12px;pointer-events:none}
html:not(.flat) .stage-controls{position:absolute;right:0;bottom:0;display:flex;gap:8px}
html:not(.flat) .stage-controls button{min-width:44px}
html:not(.flat) .atlas-panel{max-height:calc(100dvh - 120px);overflow:auto;padding:20px;border:1px solid var(--ui-line);border-radius:6px;background:var(--ui-surface);color:var(--ui-ink);box-shadow:var(--panel-depth)}
html:not(.flat) #atlas-index{display:block}
#atlas-index h2{margin:0 0 10px;font-size:20px}
.index-row{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:48px;padding:10px 12px;border:1px solid transparent;border-radius:6px;background:none;color:var(--ui-ink);font-size:16px;text-align:left;transition:background-color .12s,border-color .12s}
.index-row small{font-size:13px;color:var(--ui-muted);white-space:nowrap}
.index-row:hover,.index-row.hovered{background:var(--ui-accent-soft);border-color:var(--ui-line)}
.index-row.lit small{color:var(--ui-accent);font-weight:700}
.index-row.locked{color:var(--ui-muted)}
.index-row:active{scale:.98}
html:not(.flat) .journey-control{flex-direction:column;align-items:stretch;gap:12px;margin-top:16px;padding:16px 0 0;border-bottom:0}
html:not(.flat) .journey-control button{width:100%}
html:not(.flat) #atlas-index .atlas-tests{margin-top:16px;padding-top:8px}
html:not(.flat) .constellation-map,html:not(.flat) #galaxy-scene{display:none}
html:not(.flat) .galaxy-detail-heading{flex-direction:column;align-items:flex-start;gap:14px;margin-bottom:8px}
html:not(.flat) .galaxy-detail-heading h2{font-size:24px}
html:not(.flat) .level-list-title{margin-top:16px}
html:not(.flat) .galaxy-credit{margin:20px 0 0}
/* Scene labels are decorative; the index panel is the accessible list. */
.space-label{position:absolute;left:0;top:0;white-space:nowrap;text-align:center;font-size:13px;line-height:1.35;letter-spacing:.05em;color:#c4d5ec;text-shadow:0 1px 6px #020812,0 0 2px #020812}
.space-label small{display:block;font-size:12px;color:var(--space-muted)}
/* Every star name shares one colour; the status line carries the state. */
.space-label.star-label{font-size:14px;color:var(--space-ink)}
.space-label.star-label.solved small{color:var(--space-accent)}
.space-label.complete,.space-label.star-label.complete small{color:var(--space-gold)}
.space-label.compact small{display:none}
.space-label.locked{color:#8a9ab1}
.space-label.hot{color:#fff;font-weight:700}
/* Play and reveal: panels float in front of the star being solved. */
html:not(.flat) .game-section{position:relative}
html:not(.flat) .space-anchor{display:block;position:absolute;top:62px;right:clamp(44px,12vw,200px);width:1px;height:1px;pointer-events:none}
html:not(.flat) :is(.story-card,.dialogue-card,.composer,.tutorial-guide,.solution){box-shadow:var(--panel-depth)}
html:not(.flat) .reveal-page .dialogue-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,500px);gap:24px;align-items:start;box-shadow:none}
html:not(.flat) .reveal-page .reveal-window{display:block;min-height:min(520px,62dvh)}
html:not(.flat) .reveal-page .solution{margin-top:0}
html:not(.flat) .reveal-page .reward-galaxy .constellation-sky{display:none}
@media(max-width:900px){html:not(.flat) .atlas-body{grid-template-columns:1fr;gap:16px}html:not(.flat) .stage-wrap{height:max(300px,min(56dvh,96vw))}html:not(.flat) .atlas-panel{max-height:none}html:not(.flat) .stage-help{display:none}html:not(.flat) .reveal-page .dialogue-card{grid-template-columns:1fr;gap:12px}html:not(.flat) .reveal-page .reveal-window{min-height:280px}}
@media(max-width:600px){html:not(.flat) .atlas-tools button{padding:10px 6px;white-space:nowrap}html:not(.flat) .atlas-heading h1{font-size:26px}html:not(.flat) .atlas-instruction{display:none}html:not(.flat) .space-anchor{top:44px;right:52px}.space-label{font-size:12px}}
.solution .reveal-actions .send-button{margin-top:0}