/* REFRESH33: accepted journey prototype applied to every current view. */
:root { --paper:#f3e9d7; --paper-light:#fffcf4; --ink:#192a35; --ink-soft:#4b5c66; --green:#665235; --green-deep:#183347; --red:#9c4829; --amber:#edbb53; --line:#a69a82; --frame-shadow:#c79b5d; }
body { font-size:18px; line-height:1.45; }
h1,h2,h3 { text-wrap:balance; }
p { text-wrap:pretty; }
strong { font-weight:700; }
.view-header, .desktop-cover-header { border-bottom:3px solid var(--ink); background:#fffbef; }
.view-header { padding:18px max(20px,calc((100vw - 1360px)/2)); }
.story-nav { gap:8px 22px; }
.language-switcher { border-bottom:2px solid var(--ink); background:#fffbef; }
.language-switcher a[aria-current] { color:var(--ink); background:var(--amber); border:1px solid var(--ink); }
.journey-heading,.journey-scenes,.chapter-tabs,.scene-navigation,.home-heading,.hall-invitation,.hall-actions,.music-page,.about-page { width:min(calc(100% - 44px),1360px); }
.comic-button,.desktop-action,.about-view .desktop-action,.atlas-link { border:2px solid var(--ink); border-radius:6px; background:#fff9eb; color:var(--ink); padding:10px 16px; }
.comic-button-primary,.desktop-action-primary,.about-view .desktop-action-primary { background:var(--amber); color:var(--ink); box-shadow:3px 3px 0 var(--ink); }
.comic-button:hover,.desktop-action:hover { background:#fffdf6; }
.comic-button-primary:hover,.desktop-action-primary:hover { background:#f8cd75; }
.comic-button[aria-pressed=true] { background:var(--amber); }
.cover-shell,body.has-locales .cover-shell { width:min(calc(100% - 44px),1360px); margin:0 auto; height:auto; min-height:0; display:grid; gap:22px; padding:20px 0; }
.desktop-cover-header { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:0 0 18px; background:transparent; }
.desktop-cover-header .wordmark { display:inline-flex; flex:none; }
.desktop-quote { position:static; width:auto; height:auto; padding:0; margin:0; overflow:visible; clip-path:none; font:clamp(20px,2.2vw,30px)/1.2 var(--title); }
.cover-stage,body.has-locales .cover-stage { width:100%; max-width:none; height:auto; min-height:0; aspect-ratio:auto; border:3px solid var(--ink); border-radius:8px; overflow:hidden; background:var(--green-deep); box-shadow:6px 6px 0 var(--frame-shadow); }
.cover-stage picture { height:auto; }
.cover-stage img { width:100%; height:auto; max-height:65svh; object-fit:contain; }
.art-target,.localized-entry .cover-invitation,.localized-entry .cover-notebook { display:none; }
.desktop-cover-footer { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; min-height:0; }
.entrance-reading { display:block; border:2px solid var(--ink); border-radius:8px; }
.journey-heading { padding:26px 0 22px; gap:22px; }
.journey-heading h1,.music-intro h1,.about-intro h1 { font-size:clamp(28px,3.8vw,52px); line-height:1.12; letter-spacing:0; }
.journey-start { flex-basis:300px; gap:10px; }
body.journey-watching .journey-start { display:flex !important; }
body.journey-watching .journey-heading { padding-block:18px; }
body.journey-watching .journey-heading h1 { font-size:clamp(25px,3.2vw,40px); }
body.journey-watching .journey-deck { display:block; }
.chapter-tabs { border:0; background:transparent; gap:9px; margin-block:0 22px; }
.chapter-tabs a { min-height:70px; display:flex; flex-direction:column; justify-content:center; gap:4px; border:2px solid var(--ink); border-radius:6px; background:#fff9eb; font-weight:700; font-size:16px; }
.chapter-tabs a:last-child { border-right:2px solid var(--ink); }
.chapter-tabs a[aria-current],.chapter-tabs a[aria-current] span { background:var(--amber); color:var(--ink); }
.chapter-tabs a[aria-current] { box-shadow:3px 3px 0 var(--ink); }
.scene-heading { margin-bottom:14px; }
.scene-heading h2 { font-size:clamp(22px,2.5vw,30px); }
.journey-art,.hall-art,.about-home,.cast-ensemble { border:3px solid var(--ink); border-radius:8px; overflow:hidden; background:var(--green-deep); box-shadow:6px 6px 0 var(--frame-shadow); }
.journey-art picture,.hall-art picture,.about-home picture,.cast-ensemble picture { background:var(--green-deep); min-width:0; }
.journey-art img,.hall-art img,.about-home img,.cast-ensemble img { width:100%; height:auto; max-height:64svh; object-fit:contain; object-position:center; }
body.journey-watching .journey-art { width:100%; margin:0; }
.journey-art figcaption,.about-home figcaption,.cast-ensemble figcaption { padding:22px; background:var(--paper-light); border-top:2px solid var(--ink); color:var(--ink); }
.journey-art figcaption p,body.journey-watching .journey-art figcaption p { font-size:18px; line-height:1.45; }
.home-introduction { grid-template-columns:minmax(0,2.3fr) minmax(250px,1fr); gap:22px; align-items:start; }
.home-cast { padding:22px; border:2px solid var(--ink); border-radius:8px; background:var(--paper-light); box-shadow:5px 5px 0 #c6c5b1; }
.creation-single { max-width:none; }
.scene-afterword { font-size:18px; text-align:left; max-width:850px; }
.moving-sheet { animation:none; }
.hall-art { width:min(calc(100% - 44px),1360px); }
.action-card,.cast-card,.music-chapters,.making-details { border:2px solid var(--ink); border-radius:8px; background:var(--paper-light); box-shadow:5px 5px 0 #c6c5b1; }
.action-primary { background:var(--amber); color:var(--ink); }
.action-primary .action-number { color:var(--ink); }
.about-intro { padding:28px 0 22px; }
.about-chapter { padding:32px 0; }
.cast-grid { gap:22px; }
.cast-card img { width:100%; height:auto; object-fit:contain; background:var(--paper-light); }
.cast-copy { padding:20px; }
.cast-copy p { line-height:1.5; }
.cast-details summary { min-height:44px; }
.cast-note { color:var(--ink); }
.about-author { border:3px solid var(--ink); border-radius:8px; box-shadow:6px 6px 0 var(--frame-shadow); }
.music-intro { padding:28px 0 24px; }
.music-editorial { grid-template-columns:minmax(0,2fr) minmax(250px,1fr); gap:22px; padding:24px 0; align-items:start; }
.music-chapters { padding:22px; }
.making-details { padding:12px 18px; margin:20px 0; }
.making-details summary { min-height:44px; cursor:pointer; padding:8px 0; font-weight:700; }
.music-credits { font-size:16px; }
body.js-ready .audio-dock { border-top:3px solid var(--ink); background:#fff9eb; box-shadow:none; padding:6px max(16px,calc((100vw - 1360px)/2)); }
body.js-ready .audio-custom { width:100%; max-width:1360px; }
.audio-dock-head { min-height:44px; }
.dock-icon { border:2px solid var(--ink); border-radius:6px; background:var(--paper-light); }
#audio-play { background:var(--amber); }
.audio-track strong { font-family:var(--title); }
.audio-status { margin-block:2px; }
.audio-details { max-width:900px; margin:auto; }
.audio-seek-row { gap:12px; }
input[type=range] { accent-color:var(--green-deep); }
.scene-navigation { border-top:2px solid var(--ink); }
@media(min-width:900px) {
 .journey-art:has(figcaption) { display:grid; grid-template-columns:minmax(0,2.3fr) minmax(250px,1fr); align-items:stretch; }
 .journey-art:has(figcaption) picture { display:grid; align-items:center; }
 .journey-art:has(figcaption) img { height:clamp(300px,54svh,530px); }
 .journey-art:has(figcaption) figcaption,body.journey-watching .journey-art figcaption { border-top:0; border-left:2px solid var(--ink); padding:22px; display:flex; align-items:center; }
}
@media(max-width:800px) {
 body { font-size:16px; }
 .view-header { padding:14px 16px; gap:8px; }
 .journey-heading,.journey-scenes,.chapter-tabs,.scene-navigation,.home-heading,.hall-invitation,.hall-actions,.music-page,.about-page,.cover-shell,body.has-locales .cover-shell,.hall-art { width:calc(100% - 32px); }
 .desktop-cover-header { flex-wrap:wrap; gap:10px; }
 .desktop-quote { font-size:21px; }
 .cover-stage img { max-height:none; }
 .cover-stage,body.has-locales .cover-stage { width:min(100%,340px); margin-inline:auto; }
 .desktop-cover-footer { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
 .desktop-action { white-space:normal; text-align:center; }
 .journey-heading { display:block; padding:20px 0; }
 .journey-start,body.journey-watching .journey-start { margin-top:16px; flex-direction:row; flex-wrap:wrap; justify-content:flex-start; }
 .journey-start p { flex-basis:100%; max-width:none; }
 .chapter-tabs { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
 .chapter-tabs a { font-size:14px; min-height:62px; padding:8px; }
 .scene-heading { align-items:start; flex-direction:column; gap:6px; }
 .scene-heading h2 { text-align:left; }
 .journey-art img,.hall-art img,.about-home img,.cast-ensemble img { max-height:none; height:auto; }
 .journey-art figcaption,body.journey-watching .journey-art figcaption { padding:16px; }
 .journey-art figcaption p,body.journey-watching .journey-art figcaption p { font-size:16px; }
 .home-introduction,.music-editorial,.world-chapter,.future-chapter { grid-template-columns:1fr; gap:18px; }
 .home-cast,.music-chapters { padding:16px; }
 .scene-navigation button { min-width:0; padding:10px; }
 .audio-track { flex-direction:column; align-items:start; gap:0; }
 .audio-track strong { font-size:12px; }
 .audio-track span { font-size:11px; }
 .audio-settings { flex-wrap:wrap; gap:0 12px; }
 .audio-settings label input { width:100px; }
 .audio-status { margin-left:0; font-size:11px; }
}
@media(max-width:380px) { .chapter-tabs { grid-template-columns:repeat(2,minmax(0,1fr)); } .desktop-cover-footer { grid-template-columns:1fr; } .audio-track span { display:none; } }
html:lang(zh-CN) { --comic:'PingFang SC','Microsoft YaHei','Noto Sans CJK SC',system-ui,sans-serif; --title:'PingFang SC','Microsoft YaHei','Noto Sans CJK SC',system-ui,sans-serif; }
html:lang(zh-CN) body { line-height:1.65; }
/* Short dialogue paragraphs remain separate and easy to scan. */
.journey-art figcaption p + p { margin-top:12px; }
@media(min-width:900px) { .journey-art:has(figcaption) figcaption { flex-direction:column; align-items:stretch; justify-content:center; } }

/* Mobile artwork plates are actual links. The portrait image and overlay
   share their intrinsic frame, with no viewport-height letterboxing. */
@media(max-width:899px) {
 .cover-stage,body.has-locales .cover-stage { width:min(100%,340px); margin-inline:auto; aspect-ratio:auto; }
 .cover-stage picture,.cover-stage img { width:100%; height:auto; max-height:none; }
 .cover-stage .art-target { display:block; }
 .localized-entry .cover-invitation { display:flex; }
 .localized-entry .cover-notebook { display:block; }
 .localized-entry .art-target .cover-label { display:flex; }
}