/* 한문장 — 밤의 서재, 책 지면 */
:root{
  --bg:#171310; --paper:#f7f1e3; --paper2:#efe6d2; --ink:#33291c; --sub:#6d5f48; --faint:#a08f70;
  --line:#3a3128; --gold:#c9a24a; --ai:#7a6aa8; --accent:#b3502e;
}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:"Noto Sans KR",-apple-system,sans-serif; color:#e8e0d0; background:var(--bg); min-height:100vh; padding-bottom:110px;}
.wrap{max-width:560px; margin:0 auto; padding:0 14px;}

.top{text-align:center; padding:30px 0 4px;}
.top .booktitle{font-family:"Nanum Myeongjo",serif; font-size:26px; font-weight:900; color:#f2e8d4; line-height:1.4;}
.top .meta{color:#a89a80; font-size:12.5px; margin-top:6px;}
.top .stats{color:#7d715c; font-size:11.5px; margin-top:4px;}
.top .stats b{color:var(--gold)}

/* 책 지면 */
.page{background:linear-gradient(180deg,var(--paper),var(--paper2)); color:var(--ink); border-radius:14px; padding:26px 22px; margin-top:16px; box-shadow:0 14px 44px rgba(0,0,0,.5); font-family:"Nanum Myeongjo",serif;}
.chaphead{text-align:center; font-size:15px; font-weight:900; letter-spacing:3px; color:#8a744a; margin-bottom:16px;}
.prose{font-size:16px; line-height:2.15; word-break:keep-all; text-align:justify;}
.seg{position:relative;}
.seg:hover{background:#fff3; border-radius:3px;}
.seg .who{font-size:9.5px; color:#b3a284; font-family:"Noto Sans KR"; margin:0 2px; vertical-align:super;}
.seg.ai .who{color:var(--ai)}
.seg.new{animation:ink 1.4s;}
@keyframes ink{from{background:#f2d99b}to{background:transparent}}
.progress{margin-top:18px; text-align:center; font-family:"Noto Sans KR"; font-size:11px; color:#a08f70;}
.pbar{height:4px; background:#e0d3b8; border-radius:3px; margin-top:6px; overflow:hidden;}
.pfill{height:100%; background:var(--gold); transition:width .5s;}

/* 입력 바 (하단 고정) */
.writebar{position:fixed; left:0; right:0; bottom:0; background:#221c15; border-top:1px solid var(--line); padding:12px 14px calc(12px + env(safe-area-inset-bottom)); z-index:50;}
.writebar .inner{max-width:560px; margin:0 auto;}
.wrow{display:flex; gap:8px;}
.wrow input.nick{flex:0 0 86px; font:inherit; font-size:12.5px; background:#171310; border:1.5px solid var(--line); color:#d8cfbc; border-radius:10px; padding:11px 9px; outline:none; text-align:center;}
.wrow input.line{flex:1; font:inherit; font-size:14.5px; background:#171310; border:1.5px solid var(--line); color:#f0e8d6; border-radius:10px; padding:11px 12px; outline:none;}
.wrow input:focus{border-color:var(--gold)}
.wrow button{font:inherit; font-size:14px; font-weight:800; background:var(--gold); color:#2a2008; border:0; border-radius:10px; padding:0 16px; cursor:pointer;}
.wrow button:disabled{opacity:.5}
.gatemsg{font-size:12px; margin-top:7px; min-height:16px; text-align:center; transition:opacity .3s;}
.gatemsg.ok{color:#8fce8f} .gatemsg.no{color:#e8a1a1}

/* 지난 챕터 */
.shelf{margin-top:20px;}
.shelf .sh{font-weight:900; font-size:13.5px; color:#a89a80; margin-bottom:7px;}
.chapcard{background:#221c15; border:1px solid var(--line); border-radius:12px; padding:12px 15px; margin:7px 0; cursor:pointer;}
.chapcard .ct{font-weight:800; font-size:13.5px; color:#e0d6c0;}
.chapcard .cs{color:#8d7f66; font-size:12px; margin-top:4px; line-height:1.7;}
.credits{display:flex; flex-wrap:wrap; gap:6px; margin-top:10px;}
.credit{font-size:11px; background:#221c15; border:1px solid var(--line); border-radius:999px; padding:4px 10px; color:#a89a80;}
.credit b{color:var(--gold)}

.spinner{display:inline-block; animation:rot 1s steps(10) infinite;}
@keyframes rot{to{transform:rotate(360deg)}}
.loading{text-align:center; color:#7d715c; padding:40px 0;}
.foot{margin-top:26px; text-align:center; color:#6d6250; font-size:11px; line-height:1.8;}
.hidden{display:none}
a{color:var(--gold)}