/* Muted Tang colors, matte mountain/cloud faces and substantial double rims. */
:root{--chapter-hud-left:3.4%;--hud-size:58px;--hud-caption:#eee6cb;--hud-shadow:drop-shadow(1px 2px 1px #05101466) drop-shadow(3px 5px 5px #03101640)}
.topbar{height:132px;padding:24px 3% 0 5%;align-items:flex-start;background:linear-gradient(#111f2440,transparent)}
.topbar .brand{margin-top:12px;padding:0;height:52px;gap:14px;font-size:23px;letter-spacing:2px;white-space:nowrap;align-items:center}
.topbar .brand-seal{width:38px;height:43px;flex-shrink:0}
#playScreen .scene-heading{left:5%}
.dialogue-meta>span:first-child{display:none}
.dialogue-meta{justify-content:flex-end}
.main-title em{letter-spacing:7px}
.chapter-topbar{padding-top:34px;padding-left:var(--chapter-hud-left);align-items:flex-start}
.chapter-brand{margin-top:6px;padding-inline:6px}
/* Match the visible logo seal, including the home button's horizontal padding. */
.chapter-objective{left:calc(var(--chapter-hud-left) + 6px)}
.chapter-brand>span:last-child{font-size:21px;letter-spacing:2px;white-space:nowrap}

.topbar nav,.chapter-topbar .chapter-nav,.end-tools nav{gap:12px;padding:0;border:0;background:none;box-shadow:none;backdrop-filter:none;align-items:flex-start;max-width:none;flex-wrap:nowrap}
.topbar nav{margin-top:calc(12px + (52px - var(--hud-size))/2)}
.chapter-topbar .chapter-nav{margin-top:calc(6px + (50px - var(--hud-size))/2)}
.topbar nav button,.chapter-topbar .chapter-nav button,#endingRoot .end-tools nav button{
  --hud-art:url('assets/ui/hud-history.svg');position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:4px;flex:0 0 auto;
  width:76px;min-width:0;min-height:0;height:auto;padding:0!important;border:0!important;border-radius:0;background:transparent!important;box-shadow:none;backdrop-filter:none;
  color:var(--hud-caption)!important;font:13px/1.4 "KaiTi","STKaiti",serif!important;letter-spacing:2px;text-align:center;white-space:nowrap;text-shadow:0 2px 4px #0a1a1c;transition:color .18s;outline:none;
}
.topbar nav button:before,.chapter-topbar .chapter-nav button:before,#endingRoot .end-tools nav button:before{
  content:"";display:block;width:var(--hud-size);height:calc(var(--hud-size)*1.04);flex-shrink:0;background:var(--hud-art) center/contain no-repeat;
  transition:filter .18s,transform .18s;filter:var(--hud-shadow);pointer-events:none;
}
.topbar nav button:hover:before,.chapter-topbar .chapter-nav button:hover:before,#endingRoot .end-tools nav button:hover:before{transform:translateY(-1px);filter:brightness(1.045) drop-shadow(1px 2px 1px #05101466) drop-shadow(3px 6px 6px #03101648)}
.topbar nav button:focus-visible,.chapter-topbar .chapter-nav button:focus-visible,#endingRoot .end-tools nav button:focus-visible{text-decoration:underline;text-underline-offset:5px}
.topbar nav button:focus-visible:before,.chapter-topbar .chapter-nav button:focus-visible:before,#endingRoot .end-tools nav button:focus-visible:before{filter:brightness(1.06) var(--hud-shadow) drop-shadow(0 0 4px #eee6cb70)}
.topbar nav button:active:before,.chapter-topbar .chapter-nav button:active:before,#endingRoot .end-tools nav button:active:before{transform:translateY(1px) scale(.96);filter:brightness(1.02) drop-shadow(.5px 1px 1px #0510145c) drop-shadow(1px 2px 3px #03101633)}
.topbar nav button:disabled,.chapter-topbar .chapter-nav button:disabled,#endingRoot .end-tools nav button:disabled{opacity:.48;cursor:default}
.topbar nav .top-button>span:first-child{display:none}
.topbar nav .top-button>b{font:inherit;letter-spacing:1.5px}
#clueDot{right:7px;top:7px;width:6px;height:6px;background:#b29568;box-shadow:0 0 0 2px #46636a;border-radius:50%}
.topbar #clueButton,.chapter-nav #chapterNotes{--hud-art:url('assets/ui/hud-clue.svg')}
.topbar #settingsButton,.chapter-nav #chapterSettings,#endingRoot .end-tools [data-end="settings"]{--hud-art:url('assets/ui/hud-settings.svg')}
.topbar #skipButton,.chapter-nav #chapterSkip,#endingRoot .end-tools [data-end="fast"]{--hud-art:url('assets/ui/hud-fast.svg')}
.topbar #skipButton[aria-pressed="true"],.chapter-nav #chapterSkip[aria-pressed="true"],#endingRoot .end-tools [data-end="fast"][aria-pressed="true"]{--hud-art:url('assets/ui/hud-pause.svg');color:#ffe8af!important}
.topbar #fullButton{--hud-art:url('assets/ui/hud-fullscreen.svg')}
.chapter-nav #chapterMap{--hud-art:url('assets/ui/hud-map.svg')}
.chapter-nav #chapterReturnMusic{--hud-art:url('assets/ui/hud-music.svg')}
.chapter-nav #chapterReturnIncenseEnd{--hud-art:url('assets/ui/hud-incense.svg')}
.chapter-nav #chapterVisitChen{--hud-art:url('assets/ui/hud-tea.svg')}
#endingRoot .end-tools [data-end="home"]{--hud-art:url('assets/ui/hud-home.svg')}
.chapter-topbar .chapter-nav button{font-size:12px!important;letter-spacing:1px;width:72px}
@media(max-width:1450px){
  :root{--chapter-hud-left:4%;--hud-size:52px}
  .topbar{padding-top:26px}
  .topbar .brand{font-size:21px}
  .topbar nav,.chapter-topbar .chapter-nav,.end-tools nav{gap:7px}
  .topbar nav button,#endingRoot .end-tools nav button{width:68px;font-size:12px!important}
  .chapter-topbar{padding-right:4%}
  .chapter-topbar .chapter-nav button{width:64px;font-size:11px!important;letter-spacing:.6px}
  .chapter-brand>span:last-child{font-size:19px}
}
@media(prefers-reduced-motion:reduce){.topbar nav button:before,.chapter-topbar .chapter-nav button:before,#endingRoot .end-tools nav button:before{transition:none}}

/* Reading controls share the speaker's vertical centre, including long subtitles. */
.dialogue-wrap>.dialogue-meta,.chapter-dialogue>.chapter-dialogue-meta{position:absolute;z-index:3;top:var(--dialogue-controls-top,42px);right:2px;transform:translateY(-50%);margin:0;align-items:center;gap:9px}
.chapter-dialogue>.chapter-dialogue-meta{right:10px}
.chapter-brand{align-items:center}
.chapter-brand small{display:none}
.chapter-brand>span:last-child{line-height:1.35;align-self:center}

/* The page paints black before the large offline bundle is ready. */
body[data-opening-disclaimer=true]{background:#000}
body[data-opening-disclaimer=true] #game{visibility:hidden}
.opening-disclaimer{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;background:#000;color:#eee9de;text-align:center;opacity:1;transition:opacity .9s ease;cursor:pointer}
.opening-disclaimer-content{width:min(920px,82vw);animation:opening-notice-in .9s ease both}
.opening-disclaimer h1{margin:0 0 32px;font:30px/1.5 var(--serif);font-weight:400;letter-spacing:12px;text-indent:12px;color:#c7bdab}
.opening-disclaimer p{margin:0;font:22px/2.3 var(--serif);letter-spacing:2px}
#disclaimerContinue{margin-top:44px;padding:10px 20px;font:13px/1.5 var(--sans);letter-spacing:3px;color:#969186;border:0;background:none}
#disclaimerContinue:hover{color:#eee9de}
#disclaimerContinue:focus-visible{outline:1px solid #8c8372;outline-offset:4px}
.opening-disclaimer.is-leaving{opacity:0}
@keyframes opening-notice-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.opening-disclaimer{transition-duration:.15s}.opening-disclaimer-content{animation:none}}