@font-face{font-family:StoryTitle;src:url("title.woff") format("woff");font-weight:700;font-style:normal;font-display:swap}
:root{color-scheme:dark;--canvas:#111419;--ink:#f2eee5;--muted:#a3a29f;--accent:#bba983}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:8px}
body{margin:0;background:var(--canvas);color:var(--ink);font-family:system-ui,-apple-system,"Segoe UI","Malgun Gothic",sans-serif;-webkit-text-size-adjust:100%}
a{color:inherit;text-underline-offset:4px}
a:focus-visible{outline:2px solid var(--accent);outline-offset:6px}
.skip-link{position:fixed;top:12px;left:12px;padding:12px 18px;background:#fff;color:#111;z-index:10;transform:translateY(-180%)}
.skip-link:focus{transform:translateY(0)}
.reading-progress{position:fixed;inset:0 0 auto;height:3px;z-index:5;pointer-events:none}
.reading-progress span{display:block;width:100%;height:100%;background:var(--accent);transform:scaleX(0);transform-origin:left}
.masthead{width:min(100%,800px);margin:0 auto;padding:52px 24px 32px;text-align:center;background:#171b21}
.eyebrow{display:flex;align-items:center;justify-content:center;gap:15px;margin:0 0 24px;font-size:10px;font-weight:600;letter-spacing:.3em;color:var(--accent)}
.eyebrow span{width:25px;height:1px;background:#625b4c}
h1{margin:0;font-family:StoryTitle,"Noto Serif KR",serif;font-weight:700;font-size:clamp(25px,4.8vw,36px);line-height:1.62;letter-spacing:-.045em;word-break:keep-all}
.episode{margin:23px 0 0;font-size:12px;font-weight:500;letter-spacing:.18em;color:#a4a4a1}
.read-link{display:inline-flex;align-items:center;gap:12px;margin-top:27px;padding:10px 16px;font-size:11px;color:#b3b3b1;text-decoration:none}
.read-link span{font-size:17px;color:var(--accent)}
.comic{width:100%;max-width:800px;margin:0 auto;padding:0;line-height:0;background:#171b21;outline:none}
.comic img{display:block;width:100%;height:auto;margin:0;padding:0;border:0}
.endnote{width:min(100%,800px);margin:0 auto;padding:46px 24px 68px;text-align:center;background:#fdfcf9;color:#52585f}
.end-label{margin:0 0 24px;font-size:12px;letter-spacing:.16em;color:#777d83}
.restart{display:inline-flex;align-items:center;justify-content:center;gap:13px;min-height:46px;padding:12px 24px;border:1px solid #c5c5bf;border-radius:3px;font-size:13px;text-decoration:none;background:transparent;transition:background .15s,border-color .15s}
.restart:hover{background:#efeee8;border-color:#9a9c98}
.restart span{font-size:18px}
@media(max-width:480px){.masthead{padding:36px 20px 22px}.eyebrow{margin-bottom:17px}.episode{margin-top:17px}.read-link{margin-top:20px}.endnote{padding:36px 20px 52px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.restart{transition:none}}