:root{--bg:#F4EEE3;--bg2:#EBE3D4;--ink:#25211C;--dim:#9c907d;--gold:#EE7A20;--line:#E3DAC8;--head:#171310;--pill:#2b2620}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);
font-family:"Apple SD Gothic Neo","Noto Sans KR","Malgun Gothic",sans-serif;
font-size:19px;line-height:1.95;letter-spacing:-.005em;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:var(--gold);text-decoration:none}
.cover{text-align:center;padding:88px 20px 48px;border-bottom:1px solid var(--line);
background:radial-gradient(120% 80% at 50% -10%, #FBF7EE 0%, var(--bg) 62%)}
.cover .kick{letter-spacing:.36em;color:var(--gold);font-size:12px;font-weight:600}
.cover h1{font-size:56px;margin:16px 0 10px;letter-spacing:.08em;color:var(--head);font-weight:800}
.cover .badge{display:inline-block;margin:2px 0 14px;padding:4px 14px;border:1px solid var(--line);
border-radius:20px;color:var(--dim);font-size:12px;letter-spacing:.05em;background:#fbf7ef}
.cover .sub{color:#6b6153;font-size:15.5px;max-width:30em;margin:0 auto;line-height:1.75}
.cover .meta{margin-top:16px;color:var(--dim);font-size:13px}
.cover .cta{display:inline-block;margin-top:26px;padding:13px 32px;border-radius:28px;
background:var(--gold);color:#fff;font-size:15.5px;font-weight:600;letter-spacing:.02em;
box-shadow:0 6px 18px rgba(238,122,32,.28)}
.cover .cta:hover{background:#d86910}
.cover .edition-links{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:12px auto 0}
.cover .webtoon-cta{display:inline-block;max-width:calc(100vw - 40px);
padding:10px 22px;border-radius:24px;border:1px solid var(--gold);
background:#fbf7ef;color:var(--head);font-size:14px;font-weight:700;letter-spacing:.01em}
.cover .webtoon-cta:hover{background:#fff3e7;color:var(--gold)}
.cover .game-cta{display:inline-block;max-width:calc(100vw - 40px);padding:10px 22px;border-radius:24px;
border:1px solid var(--head);background:var(--head);color:#fff;font-size:14px;font-weight:700}
.cover .game-cta:hover{background:#352d25;color:#fff}
.cover .swap{margin-top:22px;font-size:13px;color:var(--dim)}
.cover .swap a{color:var(--head);font-weight:600;border-bottom:1.5px solid var(--gold);padding-bottom:1px}
.cover .swap a:hover{color:var(--gold)}
.toc{margin:32px auto 10px;max-width:40em;padding:0 22px}
.toc h3{color:var(--dim);font-size:12.5px;letter-spacing:.24em;text-align:center;margin:0 0 14px;font-weight:600}
.toc-row{display:flex;align-items:baseline;gap:14px;padding:14px 14px;border-radius:12px;
border:1px solid transparent;transition:background .15s,border-color .15s}
.toc-row:hover{background:#fbf7ef;border-color:var(--line)}
.toc-no{color:var(--gold);font-size:13px;flex:none;width:46px;text-align:center;letter-spacing:.05em;font-weight:600}
.toc-title{flex:1;color:var(--ink);font-weight:500}
.toc-len{color:var(--dim);font-size:12.5px;flex:none}
.bar{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;
gap:12px;padding:12px 18px;background:rgba(244,238,227,.9);backdrop-filter:blur(10px);
border-bottom:1px solid var(--line);font-size:13px}
.bar .wm{color:var(--head);letter-spacing:.12em;font-weight:800}
.bar .barlink{color:var(--dim)}.bar .barlink:hover{color:var(--gold)}
.bar .now{color:var(--gold);letter-spacing:.05em;font-weight:600}
.chap{max-width:40em;margin:0 auto;padding:46px 24px 8px}
.chap-head{margin-bottom:32px;text-align:center}
.chap-kick{color:var(--gold);font-size:12px;letter-spacing:.24em;font-weight:600}
.chap-head h2{font-size:28px;margin:10px 0 0;color:var(--head);font-weight:800;line-height:1.4}
.prose p{margin:0 0 1.35em;text-align:left;word-break:keep-all;line-height:1.98}
.prose b{color:var(--head)}
.prose code{font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace;font-size:.86em;
background:#e7dece;border:1px solid #d8cdb9;border-radius:4px;padding:.12em .34em;color:#4b3c2d}
.prose pre{margin:1.8em 0;padding:18px 20px;overflow-x:auto;background:#221f1b;color:#f7efe2;
border:1px solid #3a342d;border-radius:6px;line-height:1.72;white-space:pre-wrap;word-break:break-word}
.prose pre code{padding:0;border:0;background:transparent;color:inherit;font-size:.82em}
.prose hr.scene{border:0;height:0;text-align:center;margin:2.7em 0}
.prose hr.scene::before{content:"";display:inline-block;width:82px;height:30px;border-radius:16px;
background:radial-gradient(circle at 50% 50%, var(--gold) 0 4px, transparent 5px), var(--pill)}
.nav{max-width:40em;margin:26px auto 0;padding:24px 24px 8px;border-top:1px solid var(--line);
display:flex;align-items:stretch;gap:10px}
.nav a,.nav span{flex:1;display:flex;flex-direction:column;justify-content:center;gap:3px;
padding:15px 12px;border-radius:14px;font-size:14px;text-align:center;border:1px solid var(--line);background:#fbf7ef}
.nav .cap{font-size:11px;color:var(--dim);letter-spacing:.08em}
.nav .ttl{color:var(--ink);font-weight:500}
.nav .prev:hover,.nav .toc:hover{border-color:var(--gold)}
.nav .toc{flex:.7;background:transparent}.nav .toc .ttl{color:var(--dim)}
.nav .next{background:var(--gold);border-color:var(--gold);box-shadow:0 5px 14px rgba(238,122,32,.24)}
.nav .next .cap{color:#7a3a08;font-weight:600}.nav .next .ttl{color:#2b1a0b;font-weight:700}
.nav .next:hover{background:#d86910}
.nav.branches{flex-wrap:wrap}
.nav.branches .prev,.nav.branches .toc{flex:1 1 22%}
.nav.branches .branch{flex:1 1 34%}
.nav.branches .branch-light{background:#f3a533;border-color:#e99820}
.nav.branches .branch-dark{background:#8d2f35;border-color:#76242a}
.nav.branches .branch-dark .cap,.nav.branches .branch-dark .ttl{color:#fff}
.nav .disabled{opacity:.4;pointer-events:none}
.fabs{position:fixed;right:16px;bottom:16px;display:flex;flex-direction:column;gap:8px;align-items:flex-end}
.fab{background:#fbf7efee;border:1px solid var(--line);color:#6b6153;
border-radius:22px;padding:10px 16px;font-size:12.5px;box-shadow:0 3px 12px rgba(90,70,40,.14)}
.fab:hover{border-color:var(--gold);color:var(--gold)}
.fab.home{border-color:var(--gold);color:var(--gold)}
footer{text-align:center;color:var(--dim);font-size:12.5px;margin:56px 0 44px;padding:0 22px}
footer .copyright{color:#a89a85;font-size:11.5px;line-height:1.8;margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--line)}
footer a{color:var(--gold)}
@media(max-width:560px){body{font-size:18px}.cover h1{font-size:44px}.chap-head h2{font-size:23px}
.chap{padding:40px 20px 8px}.nav{flex-wrap:wrap}.nav .toc{flex-basis:100%;order:3}}
