@font-face{font-family:Novel;src:url("fonts/NanumMyeongjo-Regular.ttf") format("truetype");font-display:swap;font-weight:400}
@font-face{font-family:Novel;src:url("fonts/NanumMyeongjo-Bold.ttf") format("truetype");font-display:swap;font-weight:700}
@font-face{font-family:Dialogue;src:url("fonts/NotoSansKR-Variable.ttf") format("truetype");font-display:swap;font-weight:100 900}
:root{color-scheme:dark;--ink:#0b0e12;--paper:#eee9dc;--muted:#b5b5b5;--line:#34383b;--rust:#ca9a87;--serif:Novel,"Batang",serif;--sans:Dialogue,"Malgun Gothic","Apple SD Gothic Neo",sans-serif}
*{box-sizing:border-box}
html{scroll-padding-top:82px}
body{margin:0;padding-left:env(safe-area-inset-left,0);padding-right:env(safe-area-inset-right,0);background:var(--ink);color:var(--paper);font-family:var(--sans);line-height:1.8;word-break:keep-all;overflow-wrap:anywhere}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:5px}
a,summary{touch-action:manipulation;-webkit-tap-highlight-color:#dcb79130}
a:hover,summary:hover{color:#f1c399}
h1,h2,h3{text-wrap:balance}
a:focus-visible,summary:focus-visible{outline:2px solid #e8bc8b;outline-offset:6px}
img{display:block;max-width:100%;height:auto}
p,figure,h1,h2,h3{margin:0}
.skip{position:fixed;top:-100px;left:16px;padding:12px 20px;background:var(--paper);color:var(--ink);z-index:50}
.skip:focus{top:12px}
.masthead{position:sticky;top:0;z-index:10;display:flex;justify-content:space-between;gap:20px;align-items:center;min-height:66px;padding:10px max(22px,calc((100% - 1060px)/2));background:rgba(11,14,18,.96);border-bottom:1px solid #ffffff12}
.wordmark{font-family:var(--serif);font-weight:700;letter-spacing:.08em;font-size:20px;text-decoration:none;white-space:nowrap}
nav{display:flex;gap:22px;align-items:center;font-size:13px;color:#cecbc3}
nav a{min-height:44px;display:inline-flex;align-items:center;text-decoration:none}
nav a[aria-current="page"]{color:#e6b698;text-decoration:underline}
.reader{max-width:760px;margin:auto;background:#0d1116}
.opening{padding:74px 22px 60px;text-align:center}
.eyebrow{font-size:12px;letter-spacing:.15em;color:#c7b69f}
h1{font-family:var(--serif);font-weight:700;font-size:clamp(52px,10vw,90px);letter-spacing:.025em;line-height:1.4;margin:20px 0 10px}
.subtitle{font-family:var(--serif);font-size:clamp(17px,3.6vw,23px);color:#ddd8cc;letter-spacing:.06em}
.opening-rule{width:30px;height:1px;background:#ae8d6b;margin:34px auto 24px}
.episode-label{font-size:13px;color:#d7d1c5;letter-spacing:.1em}
.episode-label span{margin:0 12px;color:#736b60}
.proposal-label{font-size:11px;color:#a5a5a7;margin:14px 0 25px}
.begin{display:inline-flex;align-items:center;gap:12px;padding:10px 20px;font-size:12px;text-decoration:none;border-bottom:1px solid #7c7569}
.place-line{display:flex;justify-content:space-between;gap:20px;font-size:12px;letter-spacing:.06em;color:#c9c6bc;padding:17px 24px;border-top:1px solid var(--line)}
.panel{position:relative;margin:0}
.panel img{width:100%}
.panel.portrait{max-width:690px;margin:auto}
.narration{font-family:var(--serif);font-size:clamp(17px,3.8vw,22px);text-align:center;line-height:2.15;padding:64px 26px 80px}
.narration p+p{margin-top:32px}
.narration.short{padding:44px 24px 28px}
.dialogue{position:relative;z-index:1;display:flex;flex-direction:column;gap:26px;max-width:660px;margin:0 auto;padding:38px 36px 52px}
.dialogue.prelude{padding-top:34px;padding-bottom:0;margin-bottom:-18px}
.bubble{--balloon:#f7f5ef;position:relative;isolation:isolate;width:fit-content;max-width:92%;min-width:10.5em;font-family:var(--sans);font-weight:500;font-size:19px;line-height:1.65;letter-spacing:-.025em;text-align:center;text-wrap:pretty;padding:25px 38px 29px;color:#182029;background:var(--balloon);border-radius:48% 49% 47% 46% / 46% 47% 46% 45%;margin-bottom:13px;overflow:visible}
.bubble:after{content:"";position:absolute;z-index:-1;bottom:-25px;left:52%;width:34px;height:34px;background:var(--balloon);clip-path:path("M 0 0 C 10 4 24 4 34 0 C 27 12 18 25 8 34 C 11 20 8 8 0 0 Z");transform:scaleX(-1)}
.bubble.left{align-self:flex-start}
.bubble.right{align-self:flex-end}
.bubble.right:after{left:34%;transform:none}
.bubble.sharp{font-weight:650;border-radius:38% 44% 35% 40% / 35% 27% 40% 33%}
.bubble.cold{--balloon:#edf0f2}
.speaker{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.thought{font-family:var(--serif);text-align:center;font-size:19px;color:#c5c6ca;line-height:2;padding:34px 30px 70px}
.sound{font-family:var(--serif);text-align:center}
.sound.quiet{font-size:29px;letter-spacing:.45em;color:#c6beb0;padding:30px 0 68px}
.sound.metal{font-size:40px;color:#b7b5b1;padding:55px 0 32px}
.sound.gasp{font-size:33px;text-align:right;padding:25px 65px 0;color:#eee4d4}
.silence{min-height:300px;display:flex;align-items:center;justify-content:center;padding:70px 24px;font-family:var(--serif);font-size:28px;color:#e6dfd2;letter-spacing:.04em}
.silence.before-climax{min-height:330px;font-size:21px;color:#bdbcb9}
.mountains{text-align:center;font-family:var(--serif);font-size:clamp(15px,3.8vw,23px);letter-spacing:.04em;padding:20px 20px 38px;color:#d4b8a6}
.chapter-name{letter-spacing:.12em;color:#d0a38f;font-size:26px}
.curse-text{font-family:var(--serif);text-align:center;padding:60px 20px 100px;font-size:clamp(24px,5.4vw,36px);line-height:2.1;color:#e6dfd2}
.curse-text p+p{margin-top:54px}
.curse-text strong{font-weight:700;font-size:1.35em}
.curse-text .last{color:#ce9c89;margin-top:90px}
.ending{text-align:center;padding:60px 28px 110px}
.ending>p:nth-child(2){font-family:var(--serif);font-size:25px;letter-spacing:.05em;margin-top:10px}
.end-line{display:block;width:34px;height:1px;background:#776958;margin:36px auto}
.end-note{font-size:13px;line-height:2;color:#afb0b2}
.notes{border-top:1px solid #393a3d;padding:64px 48px 80px;background:#10151b}
.notes h2,.character-intro h1{font-family:var(--serif);font-size:30px;line-height:1.6;margin:12px 0 28px;letter-spacing:0}
.notes>p:not(.eyebrow){font-size:14px;color:#c7c6c3;line-height:2.05;margin-top:18px}
.wide-link{display:flex;flex-direction:column;gap:6px;margin:36px 0 26px;padding:22px 0;border-top:1px solid #4b4640;border-bottom:1px solid #4b4640;text-decoration:none}
.wide-link span{font-size:12px;color:#bfb8ab}
.wide-link strong{font-weight:400;font-family:var(--serif);font-size:22px}
.wide-link strong span{font-size:22px;float:right;color:#e1cfaf}
details{font-size:13px;margin-top:28px;color:#b9b9b7}
summary{cursor:pointer;padding:12px 2px;min-height:44px}
.document-links{padding-left:20px;line-height:2.7}
footer{max-width:760px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:30px 24px;color:#aaa9a5;font-size:11px}
footer a{padding:10px 0;white-space:nowrap}
.character-main{max-width:1060px;margin:auto;padding:0 30px}
.character-intro{padding:64px 0 40px;max-width:720px}
.character-intro p:not(.eyebrow){color:#c4c3c0;font-size:15px;line-height:2}
.reference-sheet{background:#d8d5cc}
.reference-sheet img{width:100%}
.reference-sheet figcaption{font-size:12px;background:#151b22;color:#c2bfb7;padding:17px 20px}
.cast{padding:55px 0}
.character{display:grid;grid-template-columns:minmax(160px,1fr) 2fr;gap:40px;padding:40px 0;border-top:1px solid #3b3c3d}
.portrait-crop{position:relative;overflow:hidden;aspect-ratio:3/8;background:#d5d2c9}
.portrait-crop img{position:absolute;top:0;left:calc(var(--col)*-100%);width:400%;max-width:none;height:100%;object-fit:fill}
.character h2{font-family:var(--serif);font-size:28px;margin:7px 0 18px}
.character .role{color:#c5b19a;font-size:13px;letter-spacing:.06em}
.character .intro{font-family:var(--serif);font-size:19px;line-height:1.9;margin-bottom:22px;color:#e4ded1}
.character dl{font-size:14px;margin:0}
.character dt{font-size:11px;letter-spacing:.08em;color:#c8ae92;margin-top:18px;font-weight:700}
.character dd{margin:4px 0 0;color:#c6c6c4;line-height:1.95}
.character-main .notes{margin-bottom:60px}
@media(max-width:600px){
  .masthead{min-height:60px;padding:8px 18px;gap:12px}.wordmark{font-size:17px}nav{gap:18px;font-size:12px}
  .opening{padding-top:54px;padding-bottom:45px}.eyebrow{font-size:11px}
  .dialogue{padding:30px 22px 46px;gap:22px}.dialogue.prelude{padding-top:28px;margin-bottom:-14px}.bubble{max-width:96%;min-width:10em;padding:23px 29px 26px;font-size:18px;line-height:1.65}
  .narration{padding:48px 24px 60px}.narration p+p{margin-top:25px}.thought{font-size:17px;padding:40px 22px 80px}
  .place-line{padding:15px 18px;font-size:11px}.silence{min-height:260px;font-size:24px}.silence.before-climax{min-height:280px;font-size:18px}
  .notes{padding:44px 26px 55px}.notes h2{font-size:25px}.notes>p:not(.eyebrow){font-size:13px}
  .chapter-name{font-size:23px}.curse-text{padding-top:46px}.ending{padding-bottom:85px}
  footer{align-items:flex-start;font-size:10px}
  .character-main{padding:0 20px}.character-intro{padding:42px 0 30px}.character-intro h1{font-size:29px}
  .character{grid-template-columns:1fr;gap:24px}.portrait-crop{width:min(270px,100%);justify-self:center}
  .character .intro{font-size:18px}.character-main .notes{padding:35px 22px}.reference-sheet figcaption{font-size:11px}
}
@media(max-width:359px){nav{gap:12px}.dialogue{padding-left:17px;padding-right:17px;gap:20px}.bubble{font-size:17px;padding:22px 26px 25px;max-width:100%}.place-line{font-size:10px}.proposal-label{font-size:10px}.thought{font-size:16px}.narration{font-size:16px}.mountains{font-size:14px}.notes{padding-left:22px;padding-right:22px}}
@media print{.masthead,.begin,.skip,footer,details{display:none}body,.reader{background:#0b0e12!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}.panel,.bubble,.character{break-inside:avoid}.opening{padding:30px}.notes{break-before:page}}
