* { box-sizing:border-box; }
:root { color-scheme:dark; font-family:"Noto Serif KR","Noto Serif CJK KR",Batang,serif; background:#101820; color:#eee; }
body { margin:0; min-height:100vh; height:100dvh; overflow:hidden; background:radial-gradient(ellipse at 50% 25%,#243441,#101820 66%); }
button { color:inherit; font:500 13px system-ui,sans-serif; border:1px solid #607483; border-radius:8px; background:#1c2a35; padding:9px 12px; cursor:pointer; white-space:nowrap; }
button:hover { background:#2b3e4c; }
.toolbar { height:64px; padding:0 clamp(12px,3vw,36px); border-bottom:1px solid #ffffff1b; display:flex; align-items:center; gap:16px; font-family:system-ui,sans-serif; }
.back { color:#c5cdd2; text-decoration:none; font-size:24px; white-space:nowrap; }.back span{font-size:12px;vertical-align:3px}
.work-title { flex:1; margin:0; font-family:inherit; font-weight:650; font-size:15px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.work-title span{font-weight:400;color:#b7c1c8}
.tools { display:flex; align-items:center; gap:7px; }
.reader-shell { height:calc(100dvh - 64px - 64px); max-width:980px; margin:0 auto; padding:18px clamp(16px,5vw,64px) 8px; display:flex; flex-direction:column; }
.page { flex:1; min-height:0; overflow:auto; overscroll-behavior:contain; scrollbar-color:#526572 transparent; }
.page-content { width:min(100%,760px); margin:0 auto; padding:16px 8px 24px; font-size:18px; line-height:1.9; letter-spacing:.01em; overflow-wrap:anywhere; }
.page-content p { margin:0 0 1.05em; white-space:pre-wrap; }.page-content h1,.page-content h2,.page-content h3 { line-height:1.5; white-space:pre-wrap; }
.page-content h1 { font-size:1.75em; text-align:center; margin:1.5em 0 1em; }.page-content h2 { font-size:1.35em; text-align:center; margin:1.5em 0 .9em; }.page-content h3 { font-size:1.04em; margin:1.15em 0 .65em; color:#dce5e8; }
.page-content hr { border:0; border-top:1px solid #71818b66; margin:1.5em 0; }
.page-content blockquote { margin:0 0 1.05em; padding:.15em 0 .15em 1em; border-left:2px solid #b7c9d2; color:#e0e8eb; }
.page-content blockquote p { margin:0; }
.page-content .cover-block { text-align:center; margin:1.3em auto; }.page-content .scene-heading { color:#e8d7b7; font-weight:700; }
.page-meta { height:32px; display:flex; align-items:center; justify-content:space-between; color:#9eabb3; font:12px system-ui,sans-serif; }.page-nav { height:58px; display:flex; align-items:center; gap:16px; }.page-nav button{min-width:76px}.progress{height:3px;flex:1;background:#34434d;border-radius:9px;overflow:hidden}.progress span{display:block;height:100%;width:0;background:#b7c9d2;transition:width .2s}
.donation { height:64px; padding:0 14px max(env(safe-area-inset-bottom),0px); display:flex; align-items:center; justify-content:center; gap:7px; border-top:1px solid #ffffff1b; background:#0b1218; color:#d9e0e3; font:13px system-ui,sans-serif; text-align:center; }.donation span{color:#71818a}.donation strong{font-weight:700;color:#f0e2c7}
.toc { position:fixed; z-index:5; top:64px; bottom:64px; left:0; width:min(360px,88vw); padding:16px; background:#131e27f7; border-right:1px solid #ffffff22; box-shadow:12px 0 40px #0007; overflow:auto; font-family:system-ui,sans-serif; }.toc[hidden]{display:none}.toc-head{display:flex;justify-content:space-between;align-items:center;padding:2px 0 12px;border-bottom:1px solid #ffffff22}.toc nav{display:flex;flex-direction:column;padding-top:8px}.toc nav button{text-align:left;margin:3px 0;white-space:normal;border-color:transparent;background:transparent;color:#d7dfe3}.toc nav button:hover{background:#ffffff12}.toc nav button.sub{padding-left:26px;color:#aab8c0;font-size:12px}
.toast { position:fixed; z-index:10; left:50%; bottom:80px; transform:translate(-50%,12px); padding:10px 15px; background:#e9ecea; color:#18232b; border-radius:8px; font:13px system-ui,sans-serif; opacity:0; pointer-events:none; transition:.2s; }.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:680px){.toolbar{height:58px;gap:7px;padding:0 10px}.back{font-size:21px}.back span{display:none}.work-title{font-size:13px}.work-title span{display:none}.tools{gap:4px}.tools button{padding:8px 9px;font-size:12px}.reader-shell{height:calc(100dvh - 58px - 66px);padding:12px 15px 4px}.page-content{padding:9px 3px 18px;font-size:17px;line-height:1.82}.page-meta{height:29px}.page-nav{height:50px}.donation{height:66px;font-size:12px;gap:5px}.donation strong{font-size:12px}.toc{top:58px;bottom:66px}}
@media(max-width:380px){.tools button{padding:7px;font-size:11px}.page-content{font-size:16px}.donation{font-size:11px}}
