@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@400;500;600;700&family=Noto+Serif+Thai:wght@400;500;600&display=swap');
:root{color-scheme:dark;--paper:#e8e2d6;--muted:#b7b2a5;--gold:#d8b885;--ink:#161613;--panel:#20211d;--line:#ffffff24;--serif:'Noto Serif Thai',Georgia,serif;--body:'Noto Sans Thai',Tahoma,sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--ink);color:var(--paper);font-family:var(--body);font-size:15px}button,a,input{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{font:inherit;cursor:pointer;color:inherit;background:none;border:0}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--gold);outline-offset:5px}button:disabled{cursor:wait;opacity:.55}[hidden]{display:none!important}.masthead{height:80px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:30px;padding:0 4vw}.wordmark{font:11px Georgia,serif;letter-spacing:.16em;display:flex;align-items:center;gap:12px}.wordmark em{font-size:25px;letter-spacing:-.02em;color:var(--gold)}.edition{margin-left:auto;font-size:10px;letter-spacing:.18em;color:var(--muted)}.text-button{font-size:12px;border-bottom:1px solid var(--line);padding:8px}.text-button:hover{color:var(--gold)}
#lobby{max-width:1680px;margin:auto;min-height:calc(100dvh - 80px);display:grid;grid-template-columns:.8fr 1.8fr;gap:50px;padding:58px 4vw 0;align-items:center}.eyebrow{font-size:11px;color:var(--gold);letter-spacing:.12em}.intro h1{font-family:var(--serif);font-size:clamp(34px,3.6vw,62px);font-weight:400;line-height:1.5;letter-spacing:-.06em;margin:25px 0}.intro h1 span{display:block;color:var(--gold)}.intro-copy{line-height:1.9;color:var(--muted);font-size:14px}.intro-line{height:1px;width:55px;background:var(--gold);margin:30px 0}.small-print{font-size:11px;color:var(--muted);line-height:1.9}.cast{display:grid;grid-template-columns:1fr 1.22fr 1fr;gap:14px;align-items:center}.cast-card{height:min(62vh,680px);min-height:410px;position:relative;overflow:hidden;background:#30312b}.cast-card.is-ready{height:min(70vh,740px);min-height:465px;border-top:2px solid var(--gold)}.cast-card>img{position:absolute;width:100%;height:100%;object-fit:cover;object-position:50% 28%;transition:transform 1s}.cast-card.is-later>img{filter:saturate(.5) brightness(.75)}.cast-card:hover>img{transform:scale(1.025)}.cast-card:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#080b09fa 0%,#090c0a8c 31%,transparent 60%);pointer-events:none}.cast-caption{position:absolute;z-index:1;bottom:0;padding:25px 18px;width:100%}.route-number{font-size:10px;letter-spacing:.15em;color:#e2dacb}.cast-caption h2{font-family:var(--serif);font-weight:400;font-size:35px;margin:13px 0 5px}.cast-caption h2 i{font:italic 18px Georgia,serif;margin-left:6px;color:var(--gold)}.cast-caption p{font-size:11px;line-height:1.8;min-height:38px;color:#ded8ca}.coming{display:block;font-size:10px;border-top:1px solid var(--line);padding-top:15px;color:var(--muted)}.primary-button{display:flex;justify-content:space-between;gap:15px;align-items:center;background:var(--gold);color:#191b15;padding:15px 17px;font-weight:600;font-size:12px;width:100%;border:1px solid var(--gold);transition:background .2s}.primary-button:hover{background:#efcf9b}.resume-button{width:100%;font-size:11px;margin-top:10px;padding:8px;border:1px solid var(--line)}.resume-button:hover{border-color:var(--gold)}.lobby-footer{grid-column:1/-1;display:flex;justify-content:space-between;gap:20px;font-size:10px;color:var(--muted);padding:25px 0;border-top:1px solid var(--line);letter-spacing:.08em}
#game{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(380px,.92fr);max-width:1440px;margin:auto;height:calc(100dvh - 80px);min-height:580px}.cinema{position:relative;background:#090b09;overflow:hidden;isolation:isolate}.cinema>img,.cinema>video{width:100%;height:100%;object-fit:cover;object-position:50% 37%;position:absolute;inset:0}.cinema>video{z-index:1}.cinema-shade{position:absolute;inset:0;background:linear-gradient(180deg,#0008,transparent 22%,transparent 75%,#0008);z-index:2;pointer-events:none}.scene-caption{position:absolute;left:30px;bottom:30px;z-index:3}.scene-caption span{font-size:10px;color:#eee4d2;letter-spacing:.1em}.scene-caption h2{font:400 clamp(20px,2.5vw,33px) var(--serif);margin:10px 0}.clock{position:absolute;top:25px;right:25px;z-index:3;text-align:right;display:grid;gap:3px}.clock span:first-child{font:29px Georgia,serif;color:var(--gold)}.clock span:last-child{font-size:10px;color:#e2d9ca}.reading-room{display:flex;flex-direction:column;min-height:0;background:radial-gradient(ellipse at top right,#31332733,transparent 60%),var(--panel)}.play-nav{padding:21px 25px;display:flex;gap:20px;border-bottom:1px solid var(--line);flex-shrink:0}.play-nav button{font-size:11px;padding:5px 0;color:var(--muted)}.play-nav button:hover{color:var(--gold)}#memory-count{font:11px Georgia,serif;color:var(--gold);padding-left:5px}.story-content{padding:clamp(25px,4vw,65px);overflow-y:auto;flex:1;scrollbar-width:thin;scrollbar-color:#655c48 transparent}.speaker{font-size:11px;letter-spacing:.18em;color:var(--gold);margin:28px 0 15px}.speaker:before{content:'';display:inline-block;width:23px;height:1px;background:var(--gold);vertical-align:middle;margin-right:12px}#story-text{font-family:var(--serif);font-size:clamp(17px,1.4vw,21px);line-height:2;white-space:pre-line;outline:none}.choices{display:grid;gap:11px;margin-top:30px}.choice{display:flex;text-align:left;gap:16px;padding:17px 18px;border:1px solid #ffffff2d;line-height:1.8;font-size:13px;border-radius:2px;transition:border-color .2s,background .2s}.choice:hover{border-color:var(--gold);background:#d8b8850b}.choice .number{color:var(--gold);font:italic 15px Georgia,serif;line-height:1.9;flex-shrink:0}.choice.is-next{border:0;border-bottom:1px solid var(--gold);padding-left:0;color:var(--gold);width:fit-content}.play-footer{padding:15px 25px;display:flex;justify-content:space-between;gap:10px;border-top:1px solid var(--line);font-size:10px;color:var(--muted);flex-shrink:0}.video-play{position:absolute;z-index:4;left:50%;top:50%;transform:translate(-50%,-50%);padding:15px 20px;background:#121410dd;border:1px solid var(--gold);font-size:12px}.media-note{position:absolute;top:80px;right:25px;z-index:4;font-size:10px;max-width:200px;background:#141612cf;padding:8px}.observation .choice{border-left:3px solid var(--gold)}#ending{padding-top:32px}#ending h2{font:400 32px var(--serif);color:var(--gold)}#ending-note{line-height:1.9;color:var(--muted);font-size:13px}#ending-memory{border-top:1px solid var(--line);margin:20px 0;padding:15px 0;font-size:12px;line-height:1.9}#ending .text-button{display:block;margin:12px auto}dialog{width:min(640px,calc(100vw - 28px));max-height:85dvh;padding:25px 30px;background:var(--panel);color:var(--paper);border:1px solid #75664a;box-shadow:0 20px 100px #0009}dialog::backdrop{background:#070907bb;backdrop-filter:blur(5px)}.dialog-header{display:flex;justify-content:space-between;gap:20px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:15px;margin-bottom:20px}.dialog-header h2{font:400 25px var(--serif);margin:0}.dialog-header button{font-size:12px;color:var(--gold)}#notebook-content{line-height:1.9}#notebook-content article{border-bottom:1px solid var(--line);padding:14px 0}#notebook-content article p{white-space:pre-line;font-size:13px;color:var(--muted)}#notebook-content article .selected-line{color:var(--gold)}#notebook-content time{font:12px Georgia,serif;color:var(--gold)}#settings label{display:grid;gap:12px;margin:24px 0;font-size:13px}input[type=range]{width:100%;accent-color:var(--gold)}.dialog-actions{display:flex;gap:15px}.dialog-actions>*{flex:1}#boot-error{position:fixed;bottom:20px;left:20px;right:20px;background:#472824;padding:20px;z-index:20}
@media(min-width:1500px){.cinema>img,.cinema>video{object-fit:contain}.cinema{background:#0d100d}}
@media(max-width:1000px){#lobby{grid-template-columns:1fr;gap:28px;padding-top:25px}.intro{display:grid;grid-template-columns:1.2fr 1fr;column-gap:30px}.intro .eyebrow{grid-column:1/-1}.intro h1{font-size:34px;margin:8px 0}.intro h1 br{display:none}.intro h1 span{display:inline}.intro-copy{align-self:center}.intro-line{display:none}.intro .small-print{grid-column:1/-1}.cast-card{height:440px;min-height:0}.cast-card.is-ready{height:475px;min-height:0}#game{grid-template-columns:1fr 1fr}.story-content{padding:25px}.play-nav{gap:15px;padding:15px}#story-text{font-size:17px}.play-footer{padding:12px 15px}.edition{letter-spacing:0;font-size:9px}}
@media(max-width:650px){.masthead{height:62px;padding:0 18px;gap:12px}.wordmark{font-size:8px;gap:7px}.wordmark em{font-size:19px}.edition{display:none}.masthead>.text-button{margin-left:auto}#lobby{padding:25px 18px 0;min-height:calc(100dvh - 62px)}.intro{display:block}.intro h1{font-size:32px}.intro-copy{font-size:12px}.intro .small-print{font-size:10px}.cast{grid-template-columns:1fr 1fr;gap:12px}.cast-card.is-ready{grid-column:1/-1;grid-row:1;height:430px}.cast-card{height:290px}.cast-card.is-ready>img{object-position:50% 32%}.cast-caption{padding:18px 14px}.cast-caption h2{font-size:29px}.cast-card.is-ready .cast-caption{max-width:320px}.cast-card.is-later .cast-caption p{font-size:10px}.lobby-footer{font-size:9px;gap:10px}#game{height:auto;min-height:calc(100dvh - 62px);display:flex;flex-direction:column}.cinema{height:47dvh;min-height:280px;max-height:490px;flex-shrink:0}.cinema>img,.cinema>video{object-position:50% 30%}.scene-caption{left:20px;bottom:15px}.scene-caption h2{font-size:21px;margin:5px 0}.clock{right:18px;top:18px}.clock span:first-child{font-size:25px}.reading-room{overflow:visible;min-height:47vh}.story-content{padding:23px 22px;overflow:visible}.play-nav{padding:12px 22px;gap:24px}.play-nav button{font-size:11px}#story-text{font-size:17px;line-height:1.95}.speaker{margin-top:22px}.choice{font-size:13px;padding:15px}.choices{margin-top:24px}.play-footer{padding:16px 22px}.play-footer span:last-child{display:none}dialog{padding:20px}.media-note{font-size:9px;top:67px}.lobby-footer a{text-align:right}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.video-caption{position:absolute;z-index:4;bottom:5.5rem;left:8%;right:8%;margin:0;padding:.65rem .9rem;text-align:center;background:rgba(0,0,0,.78);color:#fff;font-size:clamp(.95rem,1.4vw,1.25rem);border-radius:.3rem;pointer-events:none;}
.route-progress{display:block;font-size:10px;color:var(--muted);margin-top:12px}.rhythm-track{position:relative;height:60px;border:1px solid var(--line);overflow:hidden;background:#141612}.rhythm-target{position:absolute;left:33%;width:34%;top:0;bottom:0;background:#d8b88540;border-inline:1px solid var(--gold)}.rhythm-marker{position:absolute;top:16px;width:12px;height:26px;border-radius:6px;transform:translateX(-50%);background:#fff}.rhythm-status{font-size:13px;min-height:3em;line-height:1.8;color:var(--gold)}
@media(max-width:650px){.cast{grid-template-columns:1fr}.cast-card,.cast-card.is-ready{grid-column:auto;grid-row:auto;height:440px}.cast-caption{max-width:320px}.cast-card .cast-caption p{font-size:12px}.cast-card>img{object-position:50% 30%}}