body.page-read{background:#161B17;color:#F3F4ED}.reader{min-height:100vh;padding-bottom:50px}.reader-header{position:sticky;z-index:15;top:0;background:#202922;border-bottom:1px solid #405047;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px max(15px,calc((100vw - 1180px)/2));font-size:13px}.reader-header>span{font-weight:850}.reader-header>span b{color:#F2D33C}.reader-header button,.reader-controls button{border:1px solid #758077;border-radius:6px;background:#314536;color:white;padding:9px 13px}.reader-header>div{display:flex;gap:7px}.reader-popup{position:fixed;z-index:20;right:20px;top:75px;width:min(340px,calc(100vw - 40px));max-height:65vh;overflow:auto;background:#F6F5ED;color:#20231F;border:3px solid #F2D33C;box-shadow:0 16px 55px #0009;padding:18px}.reader-popup[hidden]{display:none}.reader-popup h2{margin:0 0 12px}.reader-popup a{display:block;padding:10px;border-bottom:1px solid #ccc}.reader-popup a[aria-current]{background:#F2D33C}.reader-popup label{display:block;margin-top:14px}.reader-popup select,.reader-popup input{width:100%;padding:9px}.reader-popup button{padding:9px}.reader-intro{max-width:900px;margin:35px auto 20px;padding:0 18px;text-align:center}.reader-intro>span{font-size:11px;letter-spacing:3px;color:#F2D33C}.reader-intro h1{font-size:clamp(26px,3.5vw,43px);margin:10px 0}.reader-intro p{font-size:13px;color:#A6B4A7}.progress{max-width:400px;margin:25px auto}.progress>span{font-size:12px}.progress>div{height:6px;background:#425149;margin-top:8px;border-radius:4px;overflow:hidden}.progress i{height:100%;display:block;width:0;background:#F2D33C}.reader-stage{--reader-width:85%;max-width:1100px;width:var(--reader-width);margin:auto;display:flex;flex-direction:column;gap:12px}.story-frame{background:#F9F7EC;color:#20231F;border:8px solid #20231F;min-height:470px;position:relative;display:flex;align-items:center;justify-content:center;text-align:center;padding:65px 45px;background-image:radial-gradient(#20231F11 1px,transparent 1px);background-size:13px 13px}.story-frame:nth-child(2n){background-color:#E0E9E5}.story-frame:nth-child(3n){background-color:#E9E3D4}.story-frame[hidden],.reader-image[hidden]{display:none}.frame-no{position:absolute;left:20px;top:19px;font-size:11px;letter-spacing:2px;font-weight:900}.frame-text{font-size:clamp(22px,3vw,40px);line-height:1.7;font-weight:900;max-width:730px;background:#FFFDF5;border:3px solid #20231F;border-radius:40px;padding:22px;box-shadow:7px 7px 0 #F2D33C}.frame-bottom{position:absolute;bottom:18px;right:20px;font-size:11px}.reader-image img{max-width:100%;width:auto;height:auto;margin:auto}.mode-single{max-width:900px}.mode-double{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));max-width:1300px;gap:8px}.mode-double .story-frame{min-height:400px;padding:40px 13px}.mode-double .frame-text{font-size:clamp(15px,1.8vw,25px);padding:12px}.reader-controls{display:flex;gap:14px;align-items:center;justify-content:center;margin:25px auto}.reader-chapters{max-width:1100px;margin:25px auto;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:20px;border-top:1px solid #4F6256}.reader-chapters>a{background:#F2D33C;color:#20231F;padding:12px 18px;border-radius:5px;font-weight:800}.reader-chapters span{font-size:12px;color:#9EACA0}@media(max-width:700px){.reader-header{flex-wrap:wrap;padding:9px}.reader-header>span{order:3;width:100%;text-align:center}.reader-stage{width:100%!important}.story-frame{min-height:340px;padding:55px 20px;border-width:5px}.frame-text{font-size:22px;padding:15px;border-radius:25px}.mode-double{grid-template-columns:1fr}.reader-chapters{flex-wrap:wrap}.reader-chapters>a{padding:9px;font-size:12px}.reader-controls{gap:6px}.reader-controls button{padding:8px}}