*{box-sizing:border-box}body{color:#fff;background:#0d1017;margin:0;font-family:Arial,sans-serif}button,input,select{font:inherit}.reader{grid-template-rows:auto 1fr auto;min-height:100vh;display:grid}.header,.footer{background:#181d28;border-color:#c9a227;justify-content:space-between;align-items:center;gap:10px;padding:12px 18px;display:flex}.header{border-bottom:2px solid #c9a227}.footer{border-top:1px solid #c9a227;flex-wrap:wrap}.header h1{color:#f2cf58;margin:0;font-size:20px}.btn{color:#fff;cursor:pointer;background:#252b38;border:1px solid #c9a227;border-radius:8px;padding:9px 12px}.stage{grid-template-columns:150px 1fr;min-height:0;display:grid}.thumbs{background:#141823;padding:12px;overflow:auto}.thumb{color:#fff;cursor:pointer;background:#222;border:2px solid #0000;border-radius:6px;width:100%;margin-bottom:9px;display:block;overflow:hidden}.thumb.active{border-color:#f2cf58}.thumb img{aspect-ratio:3/4;object-fit:cover;width:100%;display:block}.bookArea{background:radial-gradient(circle,#35405a,#10131b);place-items:center;padding:20px;display:grid;overflow:hidden}.page{color:#111;background:#fff;position:relative;overflow:hidden;box-shadow:inset 18px 0 34px #0005,inset -5px 0 10px #0002}.page:after{content:"";mix-blend-mode:multiply;pointer-events:none;z-index:4;background:linear-gradient(90deg,#000a 0%,#0005 24%,#fff4 58%,#0000 100%);width:46px;position:absolute;inset:0 auto 0 0}.page:nth-child(2n):after{inset:0 0 0 auto;transform:scaleX(-1)}.page.cover{border-left:5px solid #3d2b0d;box-shadow:inset 24px 0 40px #0008,0 12px 32px #000b}.page.cover:before{content:"";z-index:3;pointer-events:none;background:linear-gradient(105deg,#fff5 0%,#0000 23% 76%,#0005 100%);position:absolute;inset:0}.page img{object-fit:cover;width:100%;height:100%}.pageText{color:#fff;z-index:5;background:#000c;padding:14px;position:absolute;inset:auto 0 0}.page video{z-index:6;width:80%;max-height:35%;position:absolute;bottom:18%;left:10%}.modalBg{z-index:10;background:#000b;place-items:center;padding:18px;display:grid;position:fixed;inset:0}.modal{background:#1b2130;border:1px solid #c9a227;border-radius:14px;width:min(650px,100%);max-height:90vh;padding:20px;overflow:auto}.modal input,.modal select{color:#fff;background:#0e1118;border:1px solid #48536b;border-radius:7px;width:100%;margin:8px 0;padding:10px}.answer{white-space:pre-wrap;background:#0e1118;border-radius:8px;min-height:60px;padding:12px}.close{float:right}.importLabel{cursor:pointer}.importLabel input{display:none}@media (max-width:700px){.stage{grid-template-columns:1fr}.thumbs{gap:8px;max-width:100%;display:flex;overflow:auto}.thumb{width:70px;min-width:70px}.bookArea{padding:8px}.header h1{font-size:16px}}
