*{box-sizing:border-box}html{scroll-padding-top:150px}body{margin:0;background:#edf4ff;color:#182747;font-family:Arial,'Malgun Gothic',sans-serif}header{position:sticky;top:0;z-index:5;background:#fffffff5;border-bottom:1px solid #d8e3f3;backdrop-filter:blur(14px);padding:20px 28px 16px;box-shadow:0 3px 18px #24446d06}.brandbar,.controls{max-width:1100px;margin:auto;display:flex;align-items:center;gap:16px}.brandbar{margin-bottom:18px;justify-content:space-between}.brand{font-weight:900;letter-spacing:-1.2px;font-size:27px;white-space:nowrap}.brand span{color:#e85b42}.viewer-title{margin-right:auto;margin-left:20px;font-size:16px;font-weight:700}.viewer-title small{display:block;font-size:9px;font-weight:400;letter-spacing:.12em;color:#6c7f9b;margin-top:5px}a{color:inherit;text-decoration:none}.download{font-size:13px;font-weight:700;background:#ff684d;color:#182747;border-radius:30px;padding:13px 21px;white-space:nowrap;transition:background .2s}.download:hover{background:#ff8d77}button,select{font:inherit;background:#f5f8ff;border:1px solid #cad8ec;border-radius:8px;color:#263e61;padding:9px 13px;min-height:42px;cursor:pointer}button{font-size:20px;min-width:44px;line-height:1}button:hover:not(:disabled){background:#e5edfc;border-color:#9ab4da}button:disabled{opacity:.35;cursor:default}select{font-size:14px;background:#fff;min-width:113px}.controls{justify-content:center;gap:9px}.control-label{font-size:12px;color:#5c7090;margin-right:8px}.control-divider{height:23px;width:1px;background:#d9e3f1;margin:0 15px}#fit{font-size:13px}#count{min-width:36px;font-size:13px;color:#637896}#zoom-level{font-size:12px;min-width:44px;margin-left:3px;color:#506b91;font-variant-numeric:tabular-nums}.sheet{margin:0 auto 30px;position:relative;background:white;box-shadow:0 10px 32px #27487515;scroll-margin-top:150px;overflow:hidden;border:1px solid #d7e2f0;border-radius:5px}.sheet img{width:100%;height:auto;display:block;aspect-ratio:3/2}.sheet canvas{position:absolute;inset:0;width:100%;height:100%}.sheet figcaption{position:absolute;bottom:0;left:0;width:1px;height:1px;overflow:hidden}.pages{width:100%;padding:8px 24px 32px;overflow-x:auto;scrollbar-color:#a5bad9 #e6eefb}.stack{width:100%;max-width:1100px;margin:auto}#message{font-size:13px;color:#576f91;text-align:center;padding:22px 20px;margin:0;line-height:1.7}footer{text-align:center;padding:12px 20px 48px;font-size:14px}footer p{color:#637c9f;font-size:13px;margin-bottom:20px}footer a{display:inline-block;color:#182747;background:#ff684d;padding:15px 25px;border-radius:30px;font-weight:700}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #587fc2;outline-offset:3px}@media(max-width:600px){header{padding:14px 12px 12px}.brand{font-size:22px}.viewer-title{display:none}.download{font-size:11px;padding:11px 15px}.controls{gap:5px;justify-content:space-between}.control-label{display:none}.control-divider{margin:0 2px}.controls button{min-width:36px;min-height:40px;padding:8px;font-size:18px}.controls select{min-width:96px;padding:9px 6px;font-size:12px}#count{font-size:11px;min-width:27px}#fit{font-size:12px}#zoom-level{min-width:33px;font-size:10px;margin-left:0}.pages{padding:5px 10px 20px}.sheet{margin-bottom:18px;border-radius:3px}.brandbar{margin-bottom:12px}#message{padding:15px 20px;font-size:12px}html{scroll-padding-top:140px}.sheet{scroll-margin-top:140px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.sheet{scroll-margin-top:0}
@media(max-width:360px){.controls{gap:3px}.controls button{min-width:32px;padding:7px}.controls select{min-width:85px}.control-divider{display:none}#count{min-width:23px}#zoom-level{min-width:30px}}
@media(max-width:600px){.controls{gap:4px}.controls button{min-width:32px;flex-shrink:0;padding:8px 6px}.controls select{min-width:88px}.control-divider{display:none}#fit{white-space:nowrap;min-width:40px}#zoom-level{flex-shrink:0;white-space:nowrap}}
