/* A celestial keepsake: her photographs are the planets, her letter is the centre. */
:root {
  --bg-base:#091422; --bg-mid:#091422; --bg-deep:#0b1b2c;
  --surface:#0e1e30; --surface-2:#13263a;
  --text:#f1f3f6; --text-soft:#acbbcb;
  --silver:#d3d8e0; --silver-deep:#e1e5eb;
  --rose:#c4cbd5; --rose-deep:#dce1e8; --blush:#203449;
  --glass-border:#344458; --glass-fill:#0e1e30; --shadow-c:transparent;
}
body.dark,body.space-mode.dark,body.landing-mode.dark {
  --bg-base:#e3e9ef; --bg-mid:#e3e9ef; --bg-deep:#d3dde7;
  --surface:#e3e9ef; --surface-2:#d3dde7;
  --text:#26374b; --text-soft:#54677c;
  --silver:#697789; --silver-deep:#455366;
  --rose:#657386; --rose-deep:#425165; --blush:#cbd7e3;
  --glass-border:#9dabb9; --glass-fill:#e3e9ef;
}
body,body.space-mode,body.landing-mode { background:var(--bg-base)!important;transition:none!important; }
#universeSky { position:fixed;inset:0;z-index:0;width:100%;height:100%;pointer-events:none;opacity:.85; }
.edition-nav,.main-wrap { position:relative;z-index:2; }
.edition-nav { max-width:1240px;border-color:var(--glass-border);padding-block:18px; }
.edition-nav > span { font-size:.75rem;letter-spacing:.13em;color:var(--text-soft); }
#editionHome { color:var(--text);font-size:1.8rem;white-space:nowrap; }
#editionIndex { border-bottom:0;font-size:.875rem;color:var(--rose-deep); }
.tool-pill { white-space:nowrap; }
.tool-pill,body.landing-mode .tool-pill,body.landing-mode.dark .tool-pill,body:not(.space-mode) .tool-pill { background:transparent;border:0;font-size:.875rem; }
.theme-btn,body.landing-mode .theme-btn,body.landing-mode.dark .theme-btn,
.sp-player,body.landing-mode .sp-player,body.landing-mode.dark .sp-player { background:transparent;border:1px solid var(--glass-border);border-radius:50%!important; }
.sp-player,body.landing-mode .sp-player { width:46px!important;max-width:46px!important;height:46px!important;padding:3px!important; }
.sp-player .sp-art,.sp-player .sp-meta,.sp-player .sp-eq { display:none!important; }
.sp-player .sp-btn,body.landing-mode .sp-player .sp-btn { width:38px!important;height:38px!important;background:transparent; }
.sp-player .sp-btn svg,body.landing-mode .sp-btn svg { fill:var(--rose-deep); }
.theme-btn svg,body.landing-mode .theme-btn svg { fill:var(--rose-deep); }
.main-wrap,body.landing-mode .main-wrap,body.space-mode .main-wrap { max-width:1180px;padding:40px clamp(20px,5vw,60px) 90px; }
.screen:focus { outline:none; }
#screenIntro.active { display:grid!important;grid-template-columns:1.05fr .95fr;gap:32px 70px;grid-template-areas:'eyebrow eyebrow' 'copy photo' 'foot foot';min-height:calc(100svh - 245px); }
.opening-eyebrow { font-size:.75rem;letter-spacing:.12em;color:var(--rose-deep); }
#screenIntro .hero-photo-wrap { position:relative;width:100%;max-width:450px;aspect-ratio:1;height:auto!important;justify-self:center;overflow:visible; }
#screenIntro .hero-photo-frame { position:absolute;inset:12%;width:76%;height:76%;border:1px solid var(--rose-deep);border-radius:50%!important;overflow:hidden;background:var(--bg-base); }
#screenIntro .hero-photo-frame img { width:100%;height:100%;object-fit:cover;object-position:50% 35%;filter:saturate(.8);border-radius:50%; }
#screenIntro .hero-photo-ring { display:block!important;position:absolute;inset:5%;width:90%;height:90%;border:1px solid var(--glass-border);border-radius:50%;background:none;filter:none;opacity:1;animation:celestial-turn 65s linear infinite; }
#screenIntro .hero-photo-ring::before { content:'';position:absolute;top:14%;left:13%;width:7px;height:7px;border-radius:50%;background:var(--rose-deep); }
#screenIntro .hero-photo-wrap::before { content:'';position:absolute;left:-4%;top:25%;width:108%;height:50%;border:1px solid var(--glass-border);border-radius:50%;transform:rotate(-24deg); }
#screenIntro .hero-photo-wrap::after { content:'20';position:absolute;bottom:5%;right:12%;font:400 2rem Georgia,serif;color:var(--rose-deep);background:var(--bg-base);padding:8px; }
#screenIntro .made-something { color:var(--rose-deep);font-size:1rem;font-weight:400;margin-bottom:25px; }
#screenIntro .hero-title { font-size:clamp(3.6rem,7vw,6.1rem);line-height:1.02;color:var(--text); }
#screenIntro .victory-glow { color:var(--text); }
#screenIntro .hero-subtitle { color:var(--text-soft);font-size:1.1rem;line-height:1.7;max-width:38ch;margin:26px 0 30px; }
#screenIntro .open-btn,body.landing-mode.dark #screenIntro .open-btn { border-radius:999px;background:var(--rose-deep);color:var(--bg-base);border:1px solid var(--rose-deep);font-size:1rem;padding:17px 27px;min-height:56px; }
.gift-pass-btn { color:var(--text-soft);font-size:.875rem;border:0;gap:12px; }
.gift-pass-btn img { width:28px;height:28px;padding:2px; }
.opening-footnote { font-size:.75rem;letter-spacing:.06em;line-height:1.5;margin-top:16px; }
/* The orbit map is navigation, rather than a decorative background. */
#screenUniverse { text-align:center;padding-top:6px; }
.universe-kicker { color:var(--rose-deep);font-size:.75rem;letter-spacing:.14em;margin:0 0 16px; }
.universe-title { font-size:clamp(2.8rem,5.5vw,4.5rem);color:var(--text);max-width:14ch;margin:0 auto 14px;line-height:1.08; }
.time-greeting,.time-greeting span { text-shadow:none!important; }
.time-greeting { font-size:.875rem!important;line-height:1.5;margin:0 auto 14px;max-width:50ch; }
.time-greeting span { font-size:inherit!important; }
.universe-subtitle { text-align:center;max-width:51ch;margin:0 auto 12px;font-size:1rem;line-height:1.65; }
.drag-hint { color:var(--rose-deep);font-size:.875rem;letter-spacing:0;margin:0;opacity:1; }
.universe-map-scene { position:relative!important;width:100%!important;max-width:1000px!important;height:670px!important;min-height:670px!important;isolation:isolate;margin:20px auto 0!important;overflow:visible!important; }
.planet-field { position:relative!important;display:block!important;min-height:670px!important;height:670px!important;width:100%!important; }
.celestial-orbit { position:absolute;pointer-events:none;border:1px solid var(--glass-border);border-radius:50%;opacity:.63; }
.orbit-outer { width:88%;height:68%;left:6%;top:13%;transform:rotate(-16deg); }
.orbit-inner { width:58%;height:49%;left:21%;top:24%;transform:rotate(21deg); }
.orbit-tilted { width:72%;height:80%;left:14%;top:7%;transform:rotate(37deg);opacity:.28; }
.planet.chapter-link {
  position:absolute!important;display:flex!important;flex-direction:column!important;align-items:center!important;
  width:172px!important;max-width:172px!important;height:auto!important;min-height:0!important;gap:0!important;
  padding:0 5px!important;margin:0!important;border:0!important;background:none!important;overflow:visible;
  transform:translate(-50%,-50%)!important;translate:none!important;animation:celestial-breathe 7s ease-in-out infinite!important;
  text-align:center!important;cursor:pointer;z-index:2;
}
.planet.chapter-link:hover,.planet.chapter-link:focus-visible { transform:translate(-50%,-50%)!important; }
.planet.chapter-link.celestial-1 { left:17%;top:20%;animation-delay:-1s!important; }
.planet.chapter-link.celestial-2 { left:82%;top:17%;animation-delay:-3s!important; }
.planet.chapter-link.celestial-3 { left:86%;top:63%;animation-delay:-5s!important; }
.planet.chapter-link.celestial-4 { left:16%;top:70%;animation-delay:-2s!important; }
.planet.chapter-link.celestial-5 { left:52%;top:87%;animation-delay:-4s!important; }
.planet-portrait { position:relative;display:block;width:94px;height:94px;border-radius:50%;padding:5px;border:1px solid var(--rose-deep);background:var(--bg-base); }
.planet-portrait::before { content:'';position:absolute;inset:-10px;border:1px solid var(--glass-border);border-radius:50%; }
.chapter-image { width:100%!important;height:100%!important;border-radius:50%!important;object-fit:cover;filter:saturate(.8); }
.celestial-2 .chapter-image { object-position:center 14%; }
.celestial-3 .planet-portrait { width:104px;height:104px; }
.celestial-4 .planet-portrait::before { inset:23px -18px;border-color:var(--rose-deep);transform:rotate(-23deg);z-index:3; }
.chapter-number { position:absolute;z-index:4;left:calc(50% + 28px);top:0;display:grid;place-items:center;width:27px;height:27px;background:var(--bg-base);border:1px solid var(--glass-border);border-radius:50%;font-size:.75rem;color:var(--rose-deep); }
.chapter-copy { margin-top:18px;gap:0;align-items:center; }
.planet .planet-label { text-align:center!important;color:var(--text)!important;font-size:1.3rem!important;line-height:1.14!important;max-width:160px;background:var(--bg-base);padding:2px 4px; }
.planet .planet-hint { display:none!important; }
.universe-letter-btn.universe-core {
  position:absolute!important;left:50%;top:45%;transform:translate(-50%,-50%)!important;translate:none!important;
  display:flex!important;flex-direction:column;align-items:center;gap:0;width:240px;min-height:0;padding:0;margin:0;
  border:0;background:transparent!important;color:var(--text);text-align:center;z-index:3;border-radius:50%;
}
.universe-core { box-sizing:border-box;max-width:none;letter-spacing:0!important; }
.universe-core:hover,.universe-core:focus-visible { transform:translate(-50%,-50%)!important; }
.core-photo { position:relative;width:170px;height:170px;display:block;padding:8px;border:1px solid var(--rose-deep);border-radius:50%;background:var(--bg-base); }
.core-photo::before { content:'';position:absolute;inset:-14px;border:1px solid var(--glass-border);border-radius:50%; }
.core-photo img { width:100%;height:100%;object-fit:cover;object-position:50% 35%;border-radius:50%;filter:saturate(.8); }
.core-stamp { position:absolute;right:3px;bottom:2px;display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--rose-deep);border-radius:50%;font:400 1.6rem Georgia,serif;color:var(--rose-deep);background:var(--bg-base); }
.core-title { display:block;width:100%;box-sizing:border-box;font:400 1.9rem/1.2 Georgia,serif;color:var(--rose-deep);margin:24px 0 6px;padding:0 6px;background:var(--bg-base); }
.core-hint { display:block;width:100%;box-sizing:border-box;font:400 .875rem/1.4 'Source Sans 3',sans-serif;color:var(--text-soft);padding:0 5px;background:var(--bg-base); }
.orbit-footer { display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid var(--glass-border);padding:22px 0;margin-top:10px;text-align:left; }
.orbit-footer > p { font:400 .875rem/1.5 'Source Sans 3',sans-serif;color:var(--text-soft);margin:0; }
.orbit-footer .universe-progress { display:block!important;position:static!important;inset:auto;transform:none;width:160px;background:none;border:0;padding:0;opacity:1; }
.progress-copy { color:var(--text-soft);font-size:.75rem;letter-spacing:0; }
.progress-track { background:var(--glass-border);height:2px;margin-top:7px; }.progress-fill { background:var(--rose-deep); }
/* The individual worlds share the night sky but keep the content easy to read. */
.realm-kicker { font-size:.75rem;letter-spacing:.13em;color:var(--rose-deep);margin:15px 0 20px; }
.section-title { color:var(--text);font-size:clamp(2.6rem,5vw,4rem); }
.back-to-universe,.back-btn,.explore-again-btn { color:var(--rose-deep);font-size:1rem; }
.story-media { border-radius:16px;border:1px solid var(--glass-border); }
.story-media img,.story-media video { border-radius:0!important; }
.story-media figcaption { font-size:1rem;line-height:1.6; }
.story-media figcaption span,.feature-kicker,.substory-kicker,.panel-kicker { font-size:.75rem; }
.reason-reveal { border-radius:18px;background:var(--surface);padding:32px; }
.reason-number { font-size:3.5rem; }.reason-text { font-size:1.4rem; }
.envelope { border-radius:10px; }.envelope-grid { gap:12px; }
.open-when-letter { border-radius:12px; }
.wyr-option,.wyr-next,.hug-btn,.fortune-btn,.reader-toggle,.letter-continue-btn,.final-action-btn,.quiz-choice,.quiz-next,.after-credits-btn,.install-btn,.credits-jump,.banter-reveal,.banter-invite,.unlock-btn,.last-frame-return { border-radius:999px; }
.quality-text b { color:var(--rose-deep);font-size:1.125rem; }
.quality-text span { font-size:1rem; }
.newspaper { background:#e5dfd1;color:#263039;--text:#263039;--text-soft:#555f66;--glass-border:#a9aaa0;border-radius:3px;padding:clamp(22px,4vw,40px); }
.victory-constellation { background:var(--surface);border:1px solid var(--glass-border);border-radius:18px; }
.movie-credits { background:#060d17!important;border:1px solid #26364b;border-radius:18px; }
.last-frame { border-radius:14px; }.banter-card { background:transparent; }
/* The letter is a real paper keepsake suspended in the universe. */
#screenLetter .letter-card,body.dark #screenLetter .letter-card {
  --text:#283342;--text-soft:#596372;--rose-deep:#8a6744;--bg-base:#eee9df;--surface:#eee9df;--surface-2:#e0d8ca;--glass-border:#b8b1a5;
  padding:42px clamp(24px,6vw,70px) 46px;background:#eee9df;border-radius:5px;border:1px solid #c4b49b;
}
.letter-small-photo { border-radius:50%;width:76px;height:76px; }
.letter-date { font-size:.75rem;line-height:1.5; }
.letter-title { color:#283342!important; }.signature { color:#8a6744!important; }
.reader-toggle { color:#596372;background:transparent;border-color:#b8b1a5;font-size:.875rem; }
#screenLetter .letter-body { color:#283342; }
#screenLetter .letter-body p { color:#283342!important; }
.wish-label { color:#283342; }.come-back { color:#596372; }
body.reader-mode { background:#eee9df!important;--bg-base:#eee9df;--surface:#eee9df;--surface-2:#e0d8ca;--text:#283342;--text-soft:#596372;--rose-deep:#8a6744;--glass-border:#b8b1a5; }
body.reader-mode #universeSky { display:none; }
body.reader-mode #screenLetter .letter-card { padding:20px 0;border:0;background:transparent; }
body.reader-mode .letter-body p { color:#283342!important; }
.gift-pass-card,.install-guide-sheet { border-radius:18px; }
@keyframes celestial-turn { to { transform:rotate(360deg); } }
@keyframes celestial-breathe { 0%,100% { translate:0 0; } 50% { translate:0 -5px; } }
@media(min-width:1000px) {
  #screenUniverse .universe-title { max-width:none;font-size:4rem; }
  .universe-map-scene { margin-top:4px!important; }
}
@media(max-width:640px) {
  .edition-nav { padding:16px 22px;grid-template-columns:75px 1fr 72px;gap:7px 8px; }
  .edition-nav > span { font-size:.75rem!important;letter-spacing:.075em;line-height:1.4; }
  #editionHome { font-size:1.6rem; }
  .edition-nav .controls { gap:10px; }
  .main-wrap,body.landing-mode .main-wrap,body.space-mode .main-wrap { padding:28px 20px 50px; }
  #screenIntro.active { grid-template-columns:1fr;grid-template-areas:'eyebrow' 'photo' 'copy' 'foot';gap:22px; }
  #screenIntro .hero-photo-wrap { width:min(100%,330px);height:auto!important; }
  .opening-eyebrow { text-align:center;font-size:.75rem;letter-spacing:.06em; }
  .opening-copy { text-align:center; }
  #screenIntro .made-something { margin:0 0 16px;font-size:1rem; }
  #screenIntro .hero-title { font-size:3.85rem; }
  #screenIntro .hero-subtitle { font-size:1rem;line-height:1.7;margin:22px auto 26px;max-width:35ch; }
  #screenIntro .open-btn { width:auto;max-width:100%;min-height:54px;padding:15px 25px; }
  .gift-pass-btn { justify-content:center;font-size:.875rem;margin:20px auto 0; }
  .opening-footnote { flex-direction:column;align-items:center;text-align:center;gap:8px;font-size:.75rem; }
  .universe-kicker { font-size:.75rem;letter-spacing:.08em;line-height:1.5; }
  .universe-title { font-size:2.9rem;max-width:11ch;margin-bottom:16px; }
  .time-greeting { font-size:.875rem!important;line-height:1.6;margin-bottom:14px; }
  .universe-subtitle { font-size:1rem;max-width:33ch;line-height:1.6;margin-bottom:16px; }
  .universe-map-scene,.planet-field { height:740px!important;min-height:740px!important; }
  .universe-map-scene { margin-top:34px!important; }
  .orbit-outer { width:83%;height:70%;left:9%;top:10%;transform:rotate(-15deg); }
  .orbit-inner { width:64%;height:44%;left:18%;top:26%;transform:rotate(24deg); }
  .orbit-tilted { width:82%;height:83%;left:9%;top:7%;transform:rotate(12deg); }
  .planet.chapter-link { width:112px!important;max-width:112px!important;padding:0 2px!important; }
  .planet.chapter-link.celestial-1 { left:17%;top:16%; }
  .planet.chapter-link.celestial-2 { left:82%;top:12%; }
  .planet.chapter-link.celestial-3 { left:83%;top:69%; }
  .planet.chapter-link.celestial-4 { left:18%;top:74%; }
  .planet.chapter-link.celestial-5 { left:59%;top:92%; }
  .planet-portrait { width:76px;height:76px;padding:4px; }.celestial-3 .planet-portrait { width:80px;height:80px; }
  .planet-portrait::before { inset:-7px; }.celestial-4 .planet-portrait::before { inset:21px -13px; }
  .chapter-number { left:calc(50% + 19px);font-size:.75rem;width:24px;height:24px;top:-3px; }
  .chapter-copy { margin-top:14px; }.planet .planet-label { font-size:1.08rem!important;max-width:108px;line-height:1.18!important; }
  .universe-letter-btn.universe-core { top:42%;width:180px;padding:0;margin:0; }
  .core-photo { width:130px;height:130px;padding:6px; }.core-photo::before { inset:-10px; }
  .core-stamp { width:36px;height:36px;font-size:1.3rem;right:0;bottom:0; }
  .core-title { font-size:1.55rem;margin-top:19px; }.core-hint { font-size:.875rem; }
  .orbit-footer { flex-direction:column;gap:17px;text-align:center;margin-top:25px; }
  .orbit-footer .universe-progress { width:180px; }.progress-copy { font-size:.75rem; }
  .realm-kicker { font-size:.75rem;line-height:1.5; }.section-title { font-size:2.75rem; }
  .quality-list { grid-template-columns:1fr; }
  .reason-reveal { padding:26px 22px; }.reason-text { font-size:1.25rem; }
  .story-media figcaption { font-size:1rem; }
  .chapter-next > span { font-size:.75rem; }.chapter-next button { font-size:1rem; }
  #screenLetter .letter-card,body.dark #screenLetter .letter-card { padding:28px 22px 34px; }
  .letter-title { font-size:2.4rem; }.letter-date { font-size:.75rem;letter-spacing:.025em; }
  .letter-body { font-size:1.05rem;line-height:1.85; }
  .letter-header { clear:both;padding-top:18px;margin-top:0; }.reader-toggle { float:none;display:block;margin:0 0 15px auto; }
  .credits-roll p span { font-size:.875rem; }.credits-roll p strong { font-size:1rem; }
}
@media(max-width:360px) {
  .main-wrap,body.landing-mode .main-wrap,body.space-mode .main-wrap { padding-inline:16px; }
  #screenIntro .hero-title { font-size:3.4rem; }.universe-title { font-size:2.6rem; }
  .planet.chapter-link { width:96px!important;max-width:96px!important; }
  .planet .planet-label { max-width:92px;font-size:1rem!important; }
  .universe-letter-btn.universe-core { width:152px; }.core-photo { width:112px;height:112px; }
  .core-title { font-size:1.35rem; }.core-hint { font-size:.8rem; }
  .edition-nav { padding-inline:16px; }.edition-nav > span { font-size:.7rem!important; }
}
@media(prefers-reduced-motion:reduce) {
  .planet.chapter-link,#screenIntro .hero-photo-ring { animation:none!important; }
}

/* The buttons stay reachable; only their inner orbit floats. */
#screenUniverse .orbital-slot {
  position:absolute;width:172px;left:var(--slot-x);top:var(--slot-y);
  transform:translate(calc(-50% + var(--drag-x,0px)),calc(-50% + var(--drag-y,0px)));
  z-index:4;
}
.orbital-slot[data-slot="1"] { --slot-x:17%;--slot-y:20%;--float-delay:-1s; }
.orbital-slot[data-slot="2"] { --slot-x:82%;--slot-y:17%;--float-delay:-3s; }
.orbital-slot[data-slot="3"] { --slot-x:86%;--slot-y:63%;--float-delay:-5s; }
.orbital-slot[data-slot="4"] { --slot-x:16%;--slot-y:70%;--float-delay:-2s; }
.orbital-slot[data-slot="5"] { --slot-x:52%;--slot-y:87%;--float-delay:-4s; }
.planet-float { animation:orbitalFloat 10s ease-in-out var(--float-delay) infinite; }
#screenUniverse .orbital-slot .planet.chapter-link {
  position:relative!important;left:auto!important;top:auto!important;transform:none!important;
  translate:none!important;animation:none!important;width:100%!important;max-width:none!important;
  touch-action:pan-y pinch-zoom!important;user-select:none;-webkit-user-select:none;
}
.chapter-image { -webkit-user-drag:none; }
#screenUniverse .orbital-slot .planet:focus-visible { outline:2px solid var(--rose-deep)!important;outline-offset:8px;border-radius:14px!important; }
.orbital-slot.is-visited .chapter-number { background:var(--rose-deep);color:var(--bg-base);border-color:var(--rose-deep); }
#screenUniverse .orbital-slot.is-dragging { z-index:12; }
.orbital-slot.is-picked .planet-portrait::before { border:2px dashed var(--rose-deep); }
body[data-arranging="true"] .orbital-slot .planet.chapter-link { touch-action:none!important;cursor:grab; }
body[data-arranging="true"] .planet-float { animation:none!important;transform:none; }
body[data-arranging="true"] .orbital-slot.is-dragging .planet { cursor:grabbing; }
body[data-motion="paused"] .planet-float,body[data-motion="paused"] .celestial-orbit,
body[data-motion="paused"] #screenIntro .hero-photo-ring { animation-play-state:paused!important; }
body[data-motion="paused"] .name-meteor { display:none!important; }
/* Keep the silver setting calm when reading or when the page is in the background. */
body[data-page-hidden="true"] *,body[data-motion="paused"] .credits-roll {
  animation-play-state:paused!important;
}
.story-media img,.story-media video { max-width:100%; }
.screen .feature-copy,.screen .substory-copy,.screen .panel-copy { text-wrap:pretty; }
.edition-nav button:focus-visible,.screen button:focus-visible,.screen a:focus-visible,
.birthday-fold summary:focus-visible { outline:2px solid var(--silver-deep);outline-offset:4px; }
.birthday-fold summary { min-height:44px;display:flex;align-items:center; }
.planet.chapter-link,.open-btn,.tool-pill,.theme-btn,.sp-btn { -webkit-tap-highlight-color:transparent; }
body:not(.space-mode):not(.landing-mode) .name-meteor,
body.reader-mode .name-meteor { visibility:hidden; }
@media(min-width:641px) {
  .edition-nav { grid-template-columns:80px minmax(0,1fr) auto 80px 106px;gap:16px; }
  .edition-nav #editionIndex { grid-column:3;grid-row:1;justify-self:end; }
  .edition-nav .experience-tools { grid-column:4;grid-row:1;justify-self:end; }
  .edition-nav .controls { grid-column:5;grid-row:1; }
}
.orbit-outer { animation:outerOrbit 100s linear infinite; }
.orbit-inner { animation:innerOrbit 130s linear infinite; }
@keyframes orbitalFloat { 0%,100% { transform:translate(0,-5px); } 25% { transform:translate(5px,0); } 50% { transform:translate(0,5px); } 75% { transform:translate(-5px,0); } }
@keyframes outerOrbit { from { transform:rotate(-16deg); } to { transform:rotate(344deg); } }
@keyframes innerOrbit { from { transform:rotate(21deg); } to { transform:rotate(-339deg); } }
@media(hover:hover) { .orbital-slot:hover .planet-float { animation-play-state:paused; } }
.orbital-slot:focus-within .planet-float { animation-play-state:paused; }
.orbit-tools,.universe-actions { display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap; }
.orbit-tools { margin:20px auto 0; }
.orbit-tools button,.universe-actions button,#resumeStop {
  min-height:44px;padding:10px 16px;border:1px solid var(--glass-border);border-radius:999px;
  color:var(--text);background:transparent;font:500 .9375rem/1.4 'Source Sans 3',sans-serif;cursor:pointer;
}
.orbit-tools button[aria-pressed="true"] { background:var(--rose-deep);color:var(--bg-base);border-color:var(--rose-deep); }
.orbit-tools button:disabled { opacity:.6;cursor:default; }
.universe-actions { margin:30px auto 0; }
.universe-actions #wishOpen { border-color:var(--rose-deep);color:var(--rose-deep); }
.arrange-hint { color:var(--text-soft);font:400 .9375rem/1.5 'Source Sans 3',sans-serif;max-width:46ch;margin:14px auto 0; }
.universe-notice { min-height:24px;margin:14px 0 0;color:var(--rose-deep);font:400 1rem/1.5 'Source Sans 3',sans-serif; }
#resumeStop { font-size:.875rem; }
.star-wish-dialog {
  width:min(90vw,480px);box-sizing:border-box;margin:auto;padding:32px;border:1px solid var(--glass-border);
  border-radius:22px;color:var(--text);background:var(--surface);max-height:calc(100dvh - 40px);overflow:auto;
}
.star-wish-dialog::backdrop { background:rgba(2,8,16,.82); }
.star-wish-dialog h2 { font:400 2.2rem/1.15 Georgia,serif;margin:12px 0 26px; }
.star-wish-dialog label { display:block;margin:0 0 12px;font-size:1rem;line-height:1.5; }
.star-wish-dialog textarea { display:block;box-sizing:border-box;width:100%;min-height:128px;resize:vertical;border:1px solid var(--glass-border);border-radius:10px;background:var(--bg-base);color:var(--text);font:400 1rem/1.6 'Source Sans 3',sans-serif;padding:14px; }
.star-wish-dialog textarea::placeholder { color:var(--text-soft);opacity:1; }
.star-wish-dialog .wish-privacy { font:400 .875rem/1.6 'Source Sans 3',sans-serif;color:var(--text-soft);margin:14px 0 20px; }
.wish-close { display:block;margin:0 0 0 auto;width:44px;height:44px;border:1px solid var(--glass-border);background:transparent;border-radius:50%;color:var(--text);font-size:1.5rem; }
.wish-submit { width:100%;min-height:48px;padding:12px 18px;border:1px solid var(--rose-deep);border-radius:999px;background:var(--rose-deep);color:var(--bg-base);font:600 1rem 'Source Sans 3',sans-serif; }
.name-meteor { font:400 clamp(1.25rem,5vw,2rem) Georgia,serif;text-shadow:0 0 12px #b1c1d1; }
.orbit-footer { flex-wrap:wrap; }
@media(max-width:800px) {
  .universe-map-scene,.planet-field { height:620px!important;min-height:620px!important; }
  .universe-map-scene { width:min(100%,560px)!important;margin:26px auto 0!important; }
  #screenUniverse .orbital-slot { width:110px; }
  .orbital-slot[data-slot="1"] { --slot-x:17%;--slot-y:13%; }
  .orbital-slot[data-slot="2"] { --slot-x:82%;--slot-y:13%; }
  .orbital-slot[data-slot="3"] { --slot-x:83%;--slot-y:70%; }
  .orbital-slot[data-slot="4"] { --slot-x:18%;--slot-y:75%; }
  .orbital-slot[data-slot="5"] { --slot-x:59%;--slot-y:95%; }
  #screenUniverse .planet-portrait { width:68px;height:68px;padding:4px; }
  #screenUniverse .planet .planet-label { font-size:1rem!important;line-height:1.2!important;max-width:106px; }
  #screenUniverse .chapter-copy { margin-top:12px; }
  #screenUniverse .chapter-number { left:calc(50% + 19px);top:-3px;width:24px;height:24px;font-size:.75rem; }
  #screenUniverse .universe-letter-btn.universe-core { width:168px;top:41%; }
  #screenUniverse .core-photo { width:108px;height:108px;padding:5px; }
  #screenUniverse .core-title { font-size:1.35rem;margin-top:17px; }
  #screenUniverse .core-hint { font-size:.875rem; }
}
@media(max-width:640px) {
  .edition-nav { grid-template-columns:minmax(64px,1fr) 70px 96px;gap:0 8px;padding:12px 16px; }
  .edition-nav>span { display:none; }
  .edition-nav #editionHome { grid-row:1;grid-column:1;font-size:1.5rem;min-height:44px; }
  .edition-nav .experience-tools { grid-row:1;grid-column:2; }
  .edition-nav .controls { grid-row:1;grid-column:3;gap:8px; }
  .edition-nav #editionIndex { grid-row:2;grid-column:1/4;min-height:36px; }
  .tool-pill,body.landing-mode .tool-pill,body.landing-mode.dark .tool-pill,body:not(.space-mode) .tool-pill { min-height:44px;font-size:.875rem;padding:7px 0; }
  .main-wrap,body.landing-mode .main-wrap,body.space-mode .main-wrap { padding:20px 16px 40px; }
  #screenIntro.active { gap:16px; }
  #screenIntro .hero-photo-wrap { width:min(56vw,210px); }
  #screenIntro .hero-title { font-size:3.2rem; }
  #screenIntro .made-something { margin:0 0 12px;font-size:.9375rem; }
  #screenIntro .hero-subtitle { font-size:1rem;line-height:1.6;max-width:34ch;margin:18px auto 22px; }
  #screenIntro .open-btn { font-size:1rem;min-height:52px;padding:14px 23px; }
  .opening-eyebrow { font-size:.75rem; }.opening-footnote { margin-top:8px; }
  .universe-kicker { font-size:.75rem;margin:0 0 10px;letter-spacing:.035em; }
  .universe-title { font-size:2.35rem;max-width:16ch;margin:0 auto 12px; }
  .time-greeting { font-size:.875rem!important;margin-bottom:10px; }
  .universe-subtitle { font-size:1rem;line-height:1.5;margin-bottom:12px;max-width:34ch; }
  .drag-hint { display:none; }
  .orbit-tools { margin-top:16px;gap:8px; }
  .orbit-tools button { font-size:.875rem;padding:9px 14px; }
  .universe-actions { display:grid;grid-template-columns:1fr;gap:10px;margin-top:56px; }
  .universe-actions button { min-height:48px;font-size:1rem; }
  .universe-notice { font-size:.9375rem;min-height:0; }
  .orbit-footer { margin-top:20px;gap:16px;padding-top:18px; }
  #resumeStop { width:100%; }
  .story-media--pair { grid-template-columns:1fr!important; }
  .story-media--pair img,.story-media--pair video { height:auto!important;max-height:420px;object-fit:cover; }
  .star-wish-dialog { padding:22px;max-height:calc(100dvh - 24px); }
  .star-wish-dialog h2 { font-size:1.85rem; }
  .letter-body { font-size:1rem;line-height:1.8; }.letter-title { font-size:2.2rem; }
  .section-title { font-size:2.5rem;overflow-wrap:break-word; }
  .quiz-choice { min-height:48px;padding:14px 18px; }
  .credits-roll p { gap:12px; }.credits-roll p span { font-size:.875rem; }.credits-roll p strong { font-size:.9375rem; }
}
@media(max-width:360px) {
  #screenUniverse .orbital-slot { width:96px; }
  #screenUniverse .planet .planet-label { max-width:94px;font-size:1rem!important; }
  .envelope-grid { grid-template-columns:1fr; }.universe-title { font-size:2.1rem; }
  .opening-eyebrow { letter-spacing:.02em; }#screenIntro .hero-title { font-size:2.95rem; }
}
@media(prefers-reduced-motion:reduce) {
  .planet-float,.celestial-orbit { animation:none!important; }
}

/* Her favourite colour: brushed silver against the night sky. */
.planet-portrait,.core-photo,#screenIntro .hero-photo-frame { border-color:var(--silver); }
.core-stamp { background:linear-gradient(125deg,#f3f4f6,#adb6c4 55%,#dde2e9);color:#162235;border:1px solid #e8ecf2; }
#screenIntro .open-btn { background:linear-gradient(115deg,#f1f3f5,#bdc6d2 60%,#e2e6ec)!important;color:#152235!important;border-color:#e1e5eb!important; }
.planet-portrait::before,.core-photo::before { border-color:var(--silver);opacity:.45; }
.birthday-countdown { display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 0;margin:0 0 24px;border-block:1px solid var(--glass-border); }
.countdown-heading p { font:600 .86rem/1.35 'Source Sans 3',sans-serif;margin:0 0 5px;color:var(--silver-deep); }
.countdown-heading small { font:.72rem/1.4 'Source Sans 3',sans-serif;color:var(--text-soft);display:block; }
.countdown-numbers { display:grid;grid-template-columns:repeat(4,1fr);gap:15px;flex-shrink:0;text-align:center; }
.countdown-numbers strong { display:block;font:400 clamp(1.4rem,3vw,2rem)/1.1 Georgia,serif;font-variant-numeric:tabular-nums;color:var(--silver-deep);min-width:2ch; }
.countdown-numbers span { display:block;font:.68rem/1.5 'Source Sans 3',sans-serif;color:var(--text-soft);margin-top:5px; }
#screenIntro .birthday-countdown { flex-wrap:wrap;justify-content:flex-start;gap:14px; }
#screenUniverse .birthday-countdown { max-width:600px;margin:18px auto 22px; }
.hug-btn,.unlock-btn,#letterPhoto { touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none; }
.hug-btn .hug-fill,.unlock-btn .unlock-fill { width:var(--hold-progress,0%)!important;transition:none!important;background:var(--silver)!important;opacity:.25;z-index:0; }
.hug-btn > span:last-child,.unlock-btn > span { position:relative;z-index:1; }
.hug-btn.holding,.unlock-btn.holding,#letterPhoto.holding { border-color:var(--silver);outline:2px solid var(--silver);outline-offset:4px; }
.hug-overlay { background:rgba(8,18,32,.35); }
.hug-message { background:#d4dbe5;color:#152235;backdrop-filter:none;box-shadow:none;font:600 1rem/1.4 'Source Sans 3',sans-serif;border:1px solid #f1f3f6; }
#letterPhoto { cursor:pointer; }
#screenLetter .letter-card,body.dark #screenLetter .letter-card { --rose-deep:#536171;--silver-deep:#536171;border-color:#a4aeb9; }
.signature { color:#536171!important; }
@media(max-width:640px){
 .birthday-countdown { gap:10px; }
 #screenIntro .birthday-countdown { justify-content:center;text-align:center;margin-bottom:20px; }
 #screenUniverse .birthday-countdown { flex-wrap:wrap;justify-content:center;text-align:center; }
 .countdown-numbers { gap:18px; }
 .countdown-heading { width:100%; }
 .hug-message { max-width:calc(100vw - 40px);box-sizing:border-box;text-align:center; }
}

.screen:focus { outline:none; }

#screenIntro .birthday-countdown { margin-top:24px; }