.orbital{position:absolute;width:490px;height:490px;border:1px solid #c9b88822;border-radius:50%;transform:rotate(-27deg)}.orbital:before{content:'';position:absolute;inset:36px;border:1px dashed #c9b88824;border-radius:50%}.orbital:after{content:'';position:absolute;width:8px;height:8px;border-radius:50%;background:#e7d3a8;box-shadow:0 0 18px #e7d3a8;left:68px;top:68px}.orbit-cross{position:absolute;width:580px;height:170px;border:1px solid #c9b88836;border-radius:50%;transform:rotate(-32deg)}.planet{position:relative;width:342px;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 26% 24%,#a5b1bf0d 0,transparent 45%),radial-gradient(circle at 70% 71%,#060910 35%,#111b2c 60%,#45566b 76%,#a9b5be 83%,#f1dfb5 86%,#354454 88%);box-shadow:-14px -14px 44px #9aaaca18,20px 30px 85px #0009,inset 2px 2px 10px #d7d7c455}.planet:before{content:'';position:absolute;inset:0;border-radius:inherit;background:repeating-linear-gradient(152deg,transparent 0 5px,#97a9bb06 6px 7px);opacity:.65}.planet:after{content:'';position:absolute;inset:-24px;border-radius:inherit;background:radial-gradient(circle,transparent 62%,#d5bf9222 65%,transparent 72%);z-index:-1}
:root{color-scheme:dark;--bg:#080b13;--paper:#eeeae2;--muted:#a6aab6;--gold:#d6bc8e;--line:#d6bc8e29;--serif:'Noto Serif TC',serif;--roman:'Cormorant Garamond',Georgia,serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:28px}body{margin:0;background:var(--bg);color:var(--paper);font:14px/1.7 Inter,Arial,sans-serif}img{display:block;max-width:100%;height:auto}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer;color:inherit}button:disabled{cursor:wait}a,button,input{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--gold);outline-offset:5px}::selection{background:#806b48;color:#fff}.shell{width:min(1180px,calc(100% - 80px));margin-inline:auto}.skip{position:fixed;z-index:100;top:-70px;left:16px;background:var(--paper);color:var(--bg);padding:10px}.skip:focus{top:10px}
.masthead{position:relative;z-index:5}.nav{display:flex;flex-direction:column;align-items:center;gap:9px;padding-top:18px}.brand img{width:245px}.nav-links{display:flex;gap:32px;align-items:center;font-size:11px;letter-spacing:.12em}.nav-links a{padding:10px 2px;color:#b9bbc3}.nav-links a:hover{color:var(--gold)}.nav-voice span{font-size:9px;margin-right:7px}
.hero{position:relative;isolation:isolate;overflow:hidden}.sky{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 24%,#2b3d5c55,transparent 58%)}.sky i{position:absolute;width:2px;height:2px;background:#dce6ff;border-radius:50%;opacity:var(--opacity);box-shadow:0 0 5px #c5dcff60}.sky i:nth-child(11n){animation:twinkle 5s ease-in-out infinite alternate}@keyframes twinkle{to{opacity:.15}}
.hero-grid{position:relative;display:flex;flex-direction:column;align-items:center;padding:0 0 42px}.cosmos{position:relative;order:-1;display:grid;place-items:center;width:580px;max-width:100%;height:365px;transform:scale(.78);margin:-10px 0 -4px;pointer-events:none}.hero-copy{width:100%;text-align:center;position:relative;z-index:2}.eyebrow{font-size:9px;letter-spacing:.34em;color:var(--gold);display:flex;justify-content:center;align-items:center;gap:17px}.eyebrow:before,.eyebrow:after{content:'';width:38px;height:1px;background:linear-gradient(90deg,transparent,#d6bc8e88)}.eyebrow:after{transform:rotate(180deg)}.hero h1{font:400 clamp(32px,3.5vw,50px)/1.5 var(--serif);letter-spacing:.13em;margin:18px 0 32px}.hero h1 br{display:none}.hero h1 span{color:var(--gold);margin-left:.45em}
.planet-type{position:absolute;text-align:center;margin-top:22px}.planet-type .star{font-size:24px;color:var(--gold)}.planet-type strong{display:block;font:400 64px var(--roman);letter-spacing:.14em;margin-left:.14em;color:#e9e0cc}.small-star{position:absolute;right:13%;top:24%;color:#eedec0;font-size:25px;text-shadow:0 0 15px #e5d3a8}
.player{width:min(720px,100%);margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:0 28px;text-align:left;padding:20px 25px 13px;border:1px solid #d6bc8e38;border-radius:16px;background:linear-gradient(115deg,#202534aa,#10151ddd);box-shadow:0 18px 48px #0003;backdrop-filter:blur(14px)}.player-top{display:flex;align-items:center;gap:14px;grid-row:1/3}.play{width:52px;height:52px;flex-shrink:0;border:1px solid #ebd4aa;border-radius:50%;background:linear-gradient(140deg,#efdbb7,#b89a66);color:#181919;display:grid;place-items:center}.play:hover{filter:brightness(1.1)}.play svg{width:19px;height:19px}.track{min-width:0;flex:1}.track-overline{font-size:8px;letter-spacing:.18em;color:var(--gold);margin-bottom:5px}.track-title{font:400 13px/1.6 var(--serif);letter-spacing:.02em}.waves{display:flex;gap:3px;align-items:center;height:25px}.waves b{width:2px;height:var(--height);background:var(--gold);opacity:.6}.is-playing .waves b{animation:wave .8s ease-in-out infinite alternate;animation-delay:var(--delay)}@keyframes wave{to{transform:scaleY(.25)}}.player-bottom{display:flex;align-items:center;gap:10px}.time{font-size:10px;font-variant-numeric:tabular-nums;color:#b8bac1}.seek{appearance:none;background:transparent;flex:1;width:100%;min-width:0;height:36px;margin:0;cursor:pointer}.seek::-webkit-slider-runnable-track{height:2px;background:linear-gradient(to right,var(--gold) var(--progress,0%),#ffffff28 var(--progress,0%))}.seek::-webkit-slider-thumb{appearance:none;width:9px;height:9px;margin-top:-3.5px;background:var(--gold);border-radius:50%}.seek::-moz-range-track{height:2px;background:#ffffff28}.seek::-moz-range-progress{height:2px;background:var(--gold)}.seek::-moz-range-thumb{width:9px;height:9px;background:var(--gold);border:0;border-radius:50%}.speed{border:0;background:none;min-width:35px;min-height:44px;font-size:11px;color:var(--gold)}.player-help{display:flex;justify-content:space-between;gap:12px;color:var(--muted);font-size:10px;align-items:center}.player-help a{white-space:nowrap;color:var(--gold);padding:4px 0}.audio-note{grid-column:1/-1;text-align:center;margin:12px 0 0;padding-top:9px;border-top:1px solid #ffffff0e;color:#9b9fac;font-size:9px;letter-spacing:.08em}
.world{position:relative;width:min(1080px,calc(100% - 80px));padding:0 0 0;margin-top:0}.art-frame{margin:0;border:1px solid #d6bc8e30;padding:7px;background:#ffffff03;border-radius:3px;box-shadow:0 30px 80px #0005}.art-frame img{width:100%}.story{position:relative;padding:70px 0 84px;background:radial-gradient(ellipse at 50% 12%,#20304d28,transparent 65%)}.reading{width:min(720px,calc(100% - 80px));margin:auto}.reading:before{content:'';display:block;width:1px;height:45px;background:linear-gradient(transparent,#d6bc8e90);margin:0 auto 30px}.reading p{font:400 17px/2.15 var(--serif);letter-spacing:.025em;color:#d0d1d8;margin:0 0 28px;overflow-wrap:break-word}.reading p:first-child{font-size:25px;line-height:1.9;max-width:630px;text-align:center;text-wrap:balance;color:#e6d4b1;margin:0 auto 42px}.reading p:last-child{margin:38px 0 0;padding-top:28px;border-top:1px solid var(--line);color:#e3cba3}.footer{border-top:1px solid var(--line);padding:24px 0}.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:10px;color:#9b9fac;letter-spacing:.07em}.footer-name{font:400 18px var(--roman);color:var(--gold);letter-spacing:.15em}.footer a{padding:8px}
@media(max-width:800px){.shell{width:calc(100% - 48px)}.brand img{width:215px}.nav{padding-top:12px;gap:4px}.nav-links{gap:28px}.cosmos{height:320px;transform:scale(.66);margin:-10px 0 0}.hero h1{font-size:34px}.hero-grid{padding-bottom:32px}.player{max-width:580px;gap:0 20px;padding:18px 20px 12px}.waves{display:none}.world{width:calc(100% - 48px)}.reading{width:min(640px,calc(100% - 64px))}.story{padding:45px 0 60px}}
@media(max-width:600px){.hero h1 br{display:block}.hero h1 span{margin-left:0}.hero h1{font-size:32px;line-height:1.6;margin:14px 0 25px}.hero-grid{padding-bottom:28px}.cosmos{height:268px;transform:scale(.55);margin:-12px 0 -3px}.eyebrow{font-size:8px;letter-spacing:.22em;gap:10px}.eyebrow:before,.eyebrow:after{width:20px}.player{display:block;max-width:420px;padding:17px 19px 12px;border-radius:13px}.player-top{gap:13px}.play{width:48px;height:48px}.waves{display:flex}.player-bottom{margin-top:4px}.player-help{font-size:10px}.audio-note{margin-top:8px;padding-top:8px}.world{width:calc(100% - 32px)}.art-frame{padding:4px}.reading{width:calc(100% - 48px)}.reading:before{height:28px;margin-bottom:24px}.reading p{font-size:16px;line-height:2;letter-spacing:.015em;margin-bottom:25px}.reading p:first-child{font-size:21px;margin-bottom:30px}.story{padding-top:30px}.footer-inner{flex-wrap:wrap;font-size:9px;gap:8px}.footer-name{font-size:15px}.footer a{margin-left:auto}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}


/* Artwork leads; the unbranded planet lives behind the reading experience. */
.nav{flex-direction:row;justify-content:space-between;padding:10px 0;gap:20px}.brand img{width:210px}.masthead{border-bottom:1px solid var(--line)}
.world{width:min(1280px,100%);margin:0 auto;padding:0}.art-frame{padding:0;border:0;border-radius:0;box-shadow:none}.art-frame img{width:100%}
.celestial-content{position:relative;isolation:isolate;overflow:clip;background:linear-gradient(#080b13,#0b101c 50%,#080b13)}
.celestial-content>.sky{z-index:-1;background:radial-gradient(ellipse at 50% 30%,#24324b55,transparent 65%)}
.planet-backdrop{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:clip}.planet-backdrop .cosmos{position:sticky;top:40px;display:grid;place-items:center;width:760px;max-width:none;height:660px;margin:90px auto 0;transform:scale(1.65);opacity:.42}.planet-backdrop .small-star{right:19%;top:27%}
.hero{overflow:visible;isolation:auto}.hero-grid{padding:66px 0 0}.hero-copy{z-index:auto}.hero h1{margin:20px 0 32px}.player{background:linear-gradient(115deg,#161d2bea,#0c111aeb)}
.story{padding:52px 0 84px;background:none}.reading{position:relative;text-shadow:0 2px 12px #080b13}.reading:before{height:30px;margin-bottom:30px}.reading p{color:#e0e1e6}.reading p:first-child{color:#eddbb8}
@media(max-width:800px){.nav{padding:8px 0}.brand img{width:185px}.nav-links{gap:20px}.world{width:100%}.hero-grid{padding:46px 0 0}.planet-backdrop .cosmos{left:50%;margin-left:calc(50% - 380px);transform:scale(1.35);opacity:.35}.story{padding:38px 0 64px}}
@media(max-width:600px){.nav{flex-direction:column;gap:0;padding:6px 0}.brand img{width:174px}.nav-links{font-size:10px;gap:25px}.world{width:100%}.hero-grid{padding:34px 0 0}.hero h1{margin:14px 0 25px}.planet-backdrop .cosmos{top:25px;margin-top:145px;transform:scale(1.1);opacity:.32}.story{padding:28px 0 54px}.reading:before{height:24px;margin-bottom:24px}}

/* Labeled, touch-friendly audio controls. */
.player{display:flex;flex-direction:column;width:min(680px,100%);max-width:680px;padding:24px 28px 16px;gap:0}.player-top{gap:20px}.play{width:100px;min-height:52px;border-radius:28px;display:flex;justify-content:center;gap:9px;font-size:14px;font-weight:600}.track-overline{font-size:9px}.track-title{font-size:16px}.player-bottom{margin-top:14px;gap:14px}.time{font-size:12px}.seek{height:44px}.seek::-webkit-slider-runnable-track{height:4px;border-radius:4px}.seek::-webkit-slider-thumb{width:16px;height:16px;margin-top:-6px;box-shadow:0 0 0 4px #d6bc8e18}.seek::-moz-range-track,.seek::-moz-range-progress{height:4px;border-radius:4px}.seek::-moz-range-thumb{width:16px;height:16px}.player-controls{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 0 14px;border-bottom:1px solid var(--line)}.transport,.rate-label{min-height:44px;display:flex;align-items:center;justify-content:center;border:1px solid #ffffff16;border-radius:8px;background:#ffffff05;color:#dedbd4;font-size:12px;padding:0 13px;white-space:nowrap;gap:6px}.transport:hover{background:#ffffff10;border-color:#d6bc8e60}.transport span{font-size:22px;color:var(--gold)}.rate-label select{background:transparent;color:var(--gold);border:0;font-size:12px;min-height:42px;cursor:pointer}.rate-label option{background:#121825}.player-help{margin-top:10px;font-size:11px}.player-help a{min-height:36px;display:flex;align-items:center}.audio-note{border:0;margin:2px 0 0;padding:0;text-align:left;font-size:10px}.waves{display:flex}
@media(max-width:600px){.player{padding:19px 17px 14px}.player-top{gap:13px}.play{width:85px;min-height:50px;font-size:13px;gap:6px}.play svg{width:16px}.track-title{font-size:13px}.track-overline{font-size:8px;letter-spacing:.12em}.waves{display:none}.player-bottom{gap:10px;margin-top:9px}.player-controls{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding-bottom:14px}.transport,.rate-label{font-size:12px}.player-help{font-size:10px}}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.player-controls{border-bottom:0;padding-bottom:0}.player{padding-bottom:20px}

/* Space around the artwork, scaled for desktop, tablet and phone. */
.world{width:min(1180px,calc(100% - 112px));margin:56px auto 0}
.hero-grid{padding-top:96px}
@media(max-width:1024px){.world{width:calc(100% - 80px);margin-top:40px}.hero-grid{padding-top:72px}}
@media(max-width:600px){.world{width:calc(100% - 40px);margin-top:28px}.hero-grid{padding-top:48px}}

.hero-copy>.player{margin-bottom:56px}
.hero h1{margin-bottom:0}
@media(max-width:600px){.hero-copy>.player{margin-bottom:40px}.hero h1{margin-bottom:0}}

/* Shooting stars stay behind the content and respect reduced motion. */
.meteor-field{position:absolute;inset:0;overflow:clip;pointer-events:none;z-index:-1}
.meteor-viewport{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.meteor{position:absolute;left:var(--x);top:var(--y);width:var(--tail);height:2px;transform:rotate(-32deg);transform-origin:left center;opacity:0;background:linear-gradient(90deg,#fff4d7,#d3def8b0 12%,#a9c9ff35 52%,transparent);border-radius:100%;filter:drop-shadow(0 0 4px #bcd7ff75);animation:meteor-flight var(--duration) linear forwards}
.meteor:before{content:'';position:absolute;left:-2px;top:-1px;width:4px;height:4px;border-radius:50%;background:#fff8e9;box-shadow:0 0 7px #fff1c8,0 0 18px #c1daff90}
@keyframes meteor-flight{0%{opacity:0;transform:translate(0,0) rotate(-32deg)}12%{opacity:.8}70%{opacity:.65}100%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(-32deg)}}
@media(max-width:600px){.meteor{height:1px;filter:drop-shadow(0 0 3px #bcd7ff60)}}
@media(prefers-reduced-motion:reduce){.meteor-field{display:none}}

.player-expand{display:none}
@media(max-width:600px){
  body{padding-bottom:calc(var(--dock-height,150px) + 24px + env(safe-area-inset-bottom,0px))}
  html{scroll-padding-bottom:calc(185px + env(safe-area-inset-bottom,0px))}
  /* The fixed player must not be trapped in the decorative background layers. */
  
  .player.mobile-dock{position:fixed;z-index:90;left:12px;right:12px;bottom:calc(10px + env(safe-area-inset-bottom,0px));width:auto;max-width:none;margin:0;padding:0 16px 7px;border-radius:20px;background:linear-gradient(120deg,#1b2333f7,#101620fa);border:1px solid #d6bc8e55;box-shadow:0 -8px 35px #0004,0 8px 30px #0008;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);max-height:calc(100dvh - 28px - env(safe-area-inset-bottom,0px));overflow-y:auto}
  .player-expand{display:flex;align-items:center;justify-content:center;gap:9px;position:relative;width:100%;min-height:36px;background:transparent;border:0;color:#b8bcc6;font-size:10px;padding:13px 0 3px}
  .handle{position:absolute;top:7px;left:calc(50% - 17px);width:34px;height:3px;border-radius:3px;background:#d6bc8e65}
  .player .player-top{gap:12px}.player .play{order:2;width:48px;height:48px;min-height:48px;padding:0;border-radius:50%}.player .play svg{width:19px;height:19px}.player #playText{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .player .track-title{font-size:13px}.player .track-overline{font-size:8px;margin-bottom:3px}.player .player-bottom{margin-top:1px;gap:10px}.player .time{font-size:10px}.player .seek{height:35px}
  .player .player-controls{display:none;padding:9px 0 6px;border-top:1px solid var(--line)}
  .player.is-expanded .player-controls{display:grid}
  .player.is-expanded{box-shadow:0 -18px 65px #0006,0 8px 30px #0008}
}

/* Minimal music-player controls, with full-sized touch targets. */
.player .play{width:52px;height:52px;min-height:52px;border-radius:50%;padding:0;background:var(--paper);border:0;color:#11151b;flex-shrink:0}
.player #playText{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.player .play svg{width:22px;height:22px}.player .play:hover{transform:scale(1.04)}
.player .player-controls{display:flex;justify-content:center;align-items:center;gap:30px;padding:7px 0 0;border:0}
.player .transport,.player .rate-label{border:0;background:transparent;min-width:44px;min-height:44px;padding:0;border-radius:50%;color:#c4c7ce}
.player .transport svg{width:24px;height:24px}.player .transport:hover{color:#fff;background:transparent}
.player .rate-label{order:-1}.player .rate-label select{appearance:none;text-align:center;background:transparent;color:#dfdfe3;border:0;min-width:48px;min-height:44px;padding:0 5px;font-size:13px;font-weight:600;border-radius:6px}
.player .rate-label:hover select{color:var(--gold)}.sound-off{display:none}.is-muted .sound-on{display:none}.is-muted .sound-off{display:block}
.player .seek::-webkit-slider-thumb{box-shadow:none;width:12px;height:12px;margin-top:-4px}.player .seek::-moz-range-thumb{width:12px;height:12px}
@media(max-width:600px){
 .player.mobile-dock .play{width:46px;height:46px;min-height:46px}
 .player.mobile-dock .player-controls{display:none;gap:24px;padding:3px 0 4px}
 .player.mobile-dock.is-expanded .player-controls{display:flex}
 .player-expand #expandText{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%)}
 .player-expand #expandArrow{font-size:15px;position:absolute;right:1px;top:12px;color:#b6bac4}
}

/* Small spherical satellites replace the four-point star. */
.orbital:after{display:none}
.satellite-orbit{position:absolute;width:490px;height:490px;border-radius:50%;pointer-events:none;animation:planet-orbit 52s linear infinite}
.satellite{position:absolute;display:block;left:50%;top:0;aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 12px #c8d7ed28}
.satellite-one{width:17px;background:radial-gradient(circle at 30% 25%,#f1dec2,#b3966e 35%,#3c3540 72%,#10121e)}
.orbit-two{width:418px;height:418px;animation-duration:76s;animation-direction:reverse;animation-delay:-25s}
.satellite-two{width:12px;background:radial-gradient(circle at 28% 24%,#dceaff,#829dbb 36%,#28364b 72%,#0a101a)}
.orbit-three{width:570px;height:570px;animation-duration:100s;animation-delay:-67s}
.satellite-three{width:9px;background:radial-gradient(circle at 30% 22%,#eee4df,#a69aab 36%,#393445 75%,#0c0e17)}
@keyframes planet-orbit{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.satellite-orbit{animation:none!important}.orbit-two{transform:rotate(120deg)}.orbit-three{transform:rotate(240deg)}}

/* Always-open transport row with playback at the exact center. */
.player .player-top{min-height:28px}.player .player-controls{display:grid;grid-template-columns:repeat(5,48px);justify-content:center;align-items:center;gap:24px;padding:6px 0 0}
.player .rate-label{grid-column:1;grid-row:1;order:0}
.player #backward{grid-column:2;grid-row:1}.player #play{grid-column:3;grid-row:1;order:0;justify-self:center}
.player #forward{grid-column:4;grid-row:1}.player #mute{grid-column:5;grid-row:1}
.player .player-bottom{margin-top:5px}
@media(max-width:600px){
 .player.mobile-dock{padding:16px 16px 12px}
 .player.mobile-dock .player-controls{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;justify-items:center;padding:4px 0 0;border:0}
 .player.mobile-dock .player-top{min-height:24px}.player.mobile-dock .track-title{font-size:14px}
 .player.mobile-dock #play{width:48px;height:48px;min-height:48px;order:0}
 .player.mobile-dock .transport,.player.mobile-dock .rate-label{min-width:44px;width:44px}
}

/* Refined material, spacing and control hierarchy. */
.player{border:1px solid #d9c6a32c;border-radius:22px;background:linear-gradient(135deg,#202735f2 0%,#141b27fa 48%,#101722fc 100%);box-shadow:inset 0 1px 0 #ffffff09,0 18px 52px #0005;padding:25px 30px 24px}
.player .track-title{color:#eee9df;font-weight:500;font-size:16px;letter-spacing:.045em;line-height:1.7}
.player .player-top{padding-bottom:4px}.player .waves{opacity:.55}.player .player-bottom{gap:14px;margin-top:8px}.player .time{color:#959fac;font-size:11px;letter-spacing:.02em}
.player .seek::-webkit-slider-runnable-track{height:3px;background:linear-gradient(to right,#cbb789 var(--progress,0%),#ffffff1b var(--progress,0%))}
.player .seek::-webkit-slider-thumb{width:11px;height:11px;margin-top:-4px;background:#e1cfaa;box-shadow:0 0 0 3px #dfcdaa0a}
.player .seek::-moz-range-track{height:3px;background:#ffffff1b}.player .seek::-moz-range-progress{height:3px;background:#cbb789}
.player #play{width:54px;height:54px;min-height:54px;background:linear-gradient(145deg,#fbf5e9,#dcd2bf);color:#161c25;box-shadow:inset 0 1px 1px #fff9,0 3px 12px #0004;border:1px solid #fff5;transition:transform .18s,box-shadow .18s}
.player #play:hover{box-shadow:inset 0 1px 1px #fff9,0 3px 18px #d6bc8e20}.player #play:active{transform:scale(.95)}
.player .transport{color:#adb5c2;transition:color .18s,transform .18s}.player .transport:active{transform:scale(.93)}.player .transport svg{width:23px;height:23px}.player .rate-label select{color:#c9ccd2;font-size:12px;font-weight:500}.player #mute.is-muted{color:#d6bc8e}
@media(max-width:600px){
 .player.mobile-dock{left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));padding:19px 19px 17px;border-radius:22px;border:1px solid #d9c6a333;background:linear-gradient(135deg,#202735f5,#121a27fa 65%,#101722fc);box-shadow:inset 0 1px 0 #ffffff09,0 -6px 28px #0002,0 12px 32px #0007}
 .player.mobile-dock .track-title{font-size:14px;letter-spacing:.035em}.player.mobile-dock .player-top{padding-bottom:2px}.player.mobile-dock .player-bottom{margin-top:4px;gap:11px}.player.mobile-dock .time{font-size:10px}
 .player.mobile-dock .player-controls{padding-top:7px;gap:4px}.player.mobile-dock #play{width:52px;height:52px;min-height:52px}.player.mobile-dock .seek{height:36px}
}

/* Frosted glass, with an opaque fallback for browsers without backdrop filtering. */
.player,.player.mobile-dock{background:linear-gradient(135deg,#283343f0,#101926f5);border:1px solid #ffffff29;box-shadow:inset 0 1px 0 #ffffff16,inset 0 -1px 0 #ffffff04,0 16px 44px #0005;backdrop-filter:none;-webkit-backdrop-filter:none}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
 .player,.player.mobile-dock{background:linear-gradient(130deg,rgba(111,132,160,.19),rgba(20,30,46,.48) 55%,rgba(15,23,36,.57));backdrop-filter:blur(26px) saturate(135%);-webkit-backdrop-filter:blur(26px) saturate(135%)}
}
@media(prefers-reduced-transparency:reduce){.player,.player.mobile-dock{background:#172130;backdrop-filter:none;-webkit-backdrop-filter:none}}

/* The same floating glass player on every screen. */
body{padding-bottom:calc(var(--dock-height,180px) + 36px + env(safe-area-inset-bottom,0px))}
html{scroll-padding-bottom:calc(var(--dock-height,180px) + 36px + env(safe-area-inset-bottom,0px))}
.player.mobile-dock{position:fixed;z-index:90;left:50%;right:auto;bottom:calc(16px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);width:min(440px,calc(100% - 24px));max-width:none;margin:0;padding:19px 19px 17px;border-radius:22px;max-height:calc(100dvh - 32px - env(safe-area-inset-bottom,0px));overflow-y:auto}
.player.mobile-dock .player-top{min-height:24px;padding-bottom:2px}.player.mobile-dock .track-title{font-size:14px;letter-spacing:.035em}.player.mobile-dock .waves{display:none}
.player.mobile-dock .player-bottom{margin-top:4px;gap:11px}.player.mobile-dock .time{font-size:10px}.player.mobile-dock .seek{height:36px}
.player.mobile-dock .player-controls{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));justify-items:center;gap:4px;padding:7px 0 0;border:0}
.player.mobile-dock #play{width:52px;height:52px;min-height:52px;order:0}.player.mobile-dock .transport,.player.mobile-dock .rate-label{min-width:44px;width:44px}

/* Soft interstellar gas behind the stars and typography. */
.nebula-field{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:clip}
.nebula-clouds{position:sticky;top:0;height:110vh;height:110svh;min-height:700px;opacity:.85;
 background:radial-gradient(ellipse 40% 25% at 12% 32%,#416ea65c,transparent 75%),radial-gradient(ellipse 45% 34% at 87% 60%,#80539855,transparent 72%),radial-gradient(ellipse 34% 22% at 65% 18%,#547d9729,transparent 72%),radial-gradient(ellipse 38% 18% at 33% 80%,#b68b6230,transparent 75%),linear-gradient(132deg,transparent 20%,#344c6a1c 34%,#74618328 43%,#a6a4b516 47%,transparent 58%);
 filter:blur(36px);transform:scale(1.1);animation:nebula-breathe 38s ease-in-out infinite alternate}
.nebula-clouds:before,.nebula-clouds:after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 18% 48% at 38% 50%,#6599b927,transparent 75%),radial-gradient(ellipse 23% 30% at 62% 54%,#a77eac25,transparent 70%);transform:rotate(30deg);filter:blur(28px)}
.nebula-clouds:after{background:radial-gradient(ellipse 23% 48% at 50% 45%,#080b1380,transparent 80%);transform:rotate(38deg)}
@keyframes nebula-breathe{from{transform:translate3d(-1%,0,0) scale(1.1);opacity:.72}to{transform:translate3d(2%,-2%,0) scale(1.16);opacity:.95}}
@media(max-width:600px){.nebula-clouds{min-height:600px;filter:blur(24px);background:radial-gradient(ellipse 70% 32% at 0% 30%,#416ea647,transparent 75%),radial-gradient(ellipse 75% 32% at 100% 66%,#80539844,transparent 75%),radial-gradient(ellipse 60% 18% at 30% 85%,#b68b6225,transparent 75%),linear-gradient(140deg,transparent 23%,#74618320 45%,transparent 62%)}.nebula-clouds:before,.nebula-clouds:after{filter:blur(18px)}}
@media(prefers-reduced-motion:reduce){.nebula-clouds{animation:none;transform:scale(1.1)}}
.reading:before{visibility:hidden}
.autoplay-hint{margin:10px 0 0;text-align:center;font-size:11px;color:var(--gold);letter-spacing:.04em}

/* Let the footer finish the page below the floating controls. */
body{padding-bottom:0}
main{padding-bottom:calc(var(--dock-height,180px) + 48px)}
.footer{position:relative;padding:30px 24px calc(30px + env(safe-area-inset-bottom,0px));background:#080b13;border-top:1px solid #d6bc8e20}
.footer-inner{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:8px;width:100%;font-size:10px;letter-spacing:.1em;color:#8e98aa}
.footer-name{font-size:18px;letter-spacing:.25em;color:#d2bd97}
.player.mobile-dock{bottom:calc(var(--footer-visible,0px) + 16px + env(safe-area-inset-bottom,0px))}
.back-to-top{position:fixed;right:24px;bottom:calc(var(--footer-visible,0px) + 24px + env(safe-area-inset-bottom,0px));z-index:91;width:44px;height:44px;display:grid;place-items:center;color:#d5c4a6;background:#17202cc7;border:1px solid #d6bc8e33;border-radius:50%;backdrop-filter:blur(14px);box-shadow:0 5px 20px #0003}
.back-to-top[hidden]{display:none}.back-to-top svg{width:20px;height:20px}.back-to-top:hover{background:#273140;color:#fff}
@media(max-width:600px){.footer{padding:26px 20px calc(26px + env(safe-area-inset-bottom,0px))}.footer-name{font-size:16px}.back-to-top{right:16px;bottom:calc(var(--footer-visible,0px) + var(--dock-height,180px) + 28px + env(safe-area-inset-bottom,0px))}}

.player.mobile-dock #play{width:44px;height:44px;min-height:44px}
.player.mobile-dock #play svg{width:19px;height:19px}
.player .transport svg{width:25px;height:25px;display:block;overflow:visible;flex-shrink:0}

/* Turquoise, celestial blue and champagne drawn from the main artwork. */
.planet{background:
 radial-gradient(ellipse at 24% 20%,#f3dfb477,transparent 29%),
 radial-gradient(ellipse at 31% 38%,#40c3c057,transparent 42%),
 radial-gradient(ellipse at 76% 66%,#72699542,transparent 44%),
 radial-gradient(circle at 70% 72%,#07101a 24%,#112b3b 43%,#20556b 59%,#408c9d 72%,#96c8c4 81%,#e3cc96 86%,#516b79 89%);
 box-shadow:-18px -15px 52px #69c5ce26,18px 28px 75px #0008,inset 2px 2px 13px #e8dcac66}
.planet:before{background:repeating-linear-gradient(152deg,transparent 0 7px,#abdcd409 8px 10px),radial-gradient(ellipse at 30% 35%,#57c4ca12,transparent 60%);opacity:.7}
.planet:after{background:radial-gradient(circle,transparent 61%,#6bbdc326 65%,#d5ba8a16 68%,transparent 73%)}
.satellite-one{background:radial-gradient(circle at 28% 23%,#fff0c7,#d5ad65 34%,#836148 59%,#252333 80%);box-shadow:0 0 13px #e5c28338}
.satellite-two{background:radial-gradient(circle at 28% 23%,#d8fff0,#68c8bf 35%,#297688 60%,#132438 82%);box-shadow:0 0 12px #70ded42b}
.satellite-three{background:radial-gradient(circle at 28% 23%,#ebe4ff,#a7a2d6 35%,#586caa 59%,#20263f 82%);box-shadow:0 0 10px #b2a7ee2b}

/* Hide while reading downward, reveal when scrolling back. */
.masthead{position:sticky;top:0;z-index:80;background:#080b13f2;transform:translateY(0);transition:transform .25s ease,background .25s ease;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.masthead.is-scrolled{background:#0c131fe8;box-shadow:0 5px 24px #0002}
.masthead.is-hidden{transform:translateY(-100%)}
.masthead:has(:focus-visible){transform:translateY(0)}

/* Familiar article layout: one text column and consistent paragraph rhythm. */
:root{--reading-font:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI','Microsoft JhengHei',sans-serif}
.hero-grid,.reading{width:min(680px,calc(100% - 64px));margin-inline:auto}
.hero-grid{padding-top:64px}
.hero-copy{text-align:left}
.eyebrow{justify-content:flex-start;font-size:9px;letter-spacing:.2em}
.eyebrow:before,.eyebrow:after{display:none}
.hero h1{font-size:38px;line-height:1.55;letter-spacing:.07em;margin:14px 0 0;text-wrap:balance}
.story{padding:30px 0 40px}
.reading:before{display:none}
.reading p{font-family:var(--reading-font);font-size:17px;font-weight:400;line-height:1.95;letter-spacing:.015em;color:#d7dce4;text-align:left;margin:0 0 24px;text-shadow:0 1px 8px #080b1366;overflow-wrap:break-word}
.reading p:first-child{max-width:none;font-family:var(--reading-font);font-size:18px;font-weight:500;line-height:1.85;letter-spacing:.015em;color:#eee9df;text-align:left;text-wrap:wrap;margin:0 0 24px}
.reading p:last-child{font-size:17px;line-height:1.95;letter-spacing:.015em;color:#d7dce4;border:0;padding:0;margin:0}
main{padding-bottom:calc(var(--dock-height,180px) + 24px)}
.footer{padding:24px 24px calc(24px + env(safe-area-inset-bottom,0px))}
.footer-inner{gap:6px;font-size:10px}.footer-name{font-size:15px;letter-spacing:.18em}
.player.mobile-dock .track-title{font-family:var(--reading-font);font-size:14px;font-weight:500;letter-spacing:0}
.player.mobile-dock{padding:16px 18px 14px;border-radius:18px}
.autoplay-hint{margin-top:7px;font-size:10px}
@media(max-width:600px){
 .hero-grid,.reading{width:calc(100% - 48px)}
 .hero-grid{padding-top:40px}
 .hero h1{font-size:28px;line-height:1.5;letter-spacing:.06em;margin-top:12px}
 .story{padding:24px 0 32px}
 .reading p,.reading p:last-child{font-size:16px;line-height:1.85;letter-spacing:.01em}
 .reading p{margin-bottom:22px}.reading p:first-child{font-size:17px;line-height:1.8;margin-bottom:24px;letter-spacing:0}
 .footer{padding:22px 20px calc(22px + env(safe-area-inset-bottom,0px))}
 .back-to-top{width:40px;height:40px}
}

.reading p{white-space:pre-line}

/* Continue the stellar artwork through the dock clearance and page footer. */
body[data-theme="stellar"] main{padding-bottom:0}
body[data-theme="stellar"] .celestial-content>.footer{margin-top:calc(var(--dock-height,180px) + 24px);background:transparent;border-top-color:#d6bc8e18}