@layer theme,base;@layer components{html:has(.reader){background:#e9edec;scroll-padding-top:64px}html:has(.reader) body{background:#e9edec}.reader{--bar:56px;--zoom:1;--avail:calc(100vw - 48px);--fit:min(var(--avail), 960px)}.reader .skip{z-index:40;background:var(--ink);color:#fff;border-radius:8px;padding:10px 16px;position:fixed;top:-60px;left:16px}.reader .skip:focus{top:8px}.reader-bar{z-index:30;height:var(--bar);border-bottom:1px solid var(--line);background:#fff;align-items:center;gap:2px;padding:0 8px;display:flex;position:fixed;inset:0 0 auto}.reader .icon{width:44px;height:44px;color:var(--ink);cursor:pointer;background:0 0;border:0;border-radius:50%;flex:none;justify-content:center;align-items:center;padding:0;display:inline-flex}.reader .icon:hover{background:var(--tint);color:var(--ink)}.reader .icon svg{fill:currentColor;width:24px;height:24px}.reader-title{white-space:nowrap;text-overflow:ellipsis;flex:auto;min-width:0;margin:0 8px;font-size:16px;font-weight:600;overflow:hidden}.reader .goto{color:var(--ink-2);white-space:nowrap;flex:none;align-items:center;gap:6px;margin:0 4px;font-size:15px;display:flex}.reader .goto label{align-items:center;gap:6px;display:flex}.reader .goto input{border:1px solid var(--line-strong);width:4.5em;min-height:36px;font:inherit;text-align:center;color:var(--ink);border-radius:8px;padding:0 6px}.reader .zoom{align-items:center;display:flex}.reader .zoom[hidden],.reader [data-fullscreen][hidden]{display:none}.reader .zoom-level{min-width:56px;min-height:36px;font:600 14px var(--font-body);color:var(--ink);cursor:pointer;font-variant-numeric:tabular-nums;background:0 0;border:0;border-radius:8px;padding:0 6px}.reader .zoom-level:hover{background:var(--tint)}:is(:root:fullscreen .reader .fs-enter,:root:not(:fullscreen) .reader .fs-exit){display:none}@media (width<=719.98px){.reader .wide-only{display:none!important}.reader-title{margin:0 4px;font-size:15px}}.reader .pages{box-sizing:border-box;width:max-content;min-width:100%;padding:calc(var(--bar) + 16px) 16px 48px;outline:none;flex-direction:column;align-items:center;gap:16px;margin:0;list-style:none;display:flex}.reader .page{width:calc(var(--fit) * var(--zoom) * var(--rel));content-visibility:auto;background:#fff;position:relative;box-shadow:0 1px 3px #14211f2e}.reader .page img{width:100%;height:100%;display:block}.reader .page{container-type:inline-size}.reader .obj{box-sizing:border-box;--obj-color:var(--brand);position:absolute}.reader .obj-text{white-space:pre-wrap;word-break:break-word;color:var(--ink);line-height:1.25;overflow:hidden}.reader .obj-button{background:var(--obj-color);color:#fff;white-space:nowrap;border-radius:999px;justify-content:center;align-items:center;min-width:24px;min-height:24px;font-weight:600;text-decoration:none;display:flex;overflow:hidden}.reader .obj-button.outlined{border:2px solid var(--obj-color);color:var(--obj-color);background:#fff}.reader .obj-link{border-radius:2px;min-width:24px;min-height:24px}.reader .obj-link:hover{background:color-mix(in srgb, var(--brand) 14%, transparent)}.reader a.obj:focus-visible{outline:3px solid var(--brand);outline-offset:2px}.reader .page-failed{color:var(--ink-2);text-align:center;background:#fff;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:16px;display:flex;position:absolute;inset:0}.reader .panel{inset:var(--bar) auto 0 0;border:0;border-right:1px solid var(--line);width:min(300px,86vw);height:auto;max-height:none;color:var(--ink);overscroll-behavior:contain;background:#fff;margin:0;padding:0;position:fixed;overflow:auto;box-shadow:4px 0 18px #14211f1f}@media (width>=1024px){.reader .panel{width:240px;box-shadow:none}}.reader .panel-head{z-index:1;border-bottom:1px solid var(--line);background:#fff;justify-content:space-between;align-items:center;padding:4px 4px 4px 16px;display:flex;position:sticky;top:0}.reader .panel-head h2{margin:0;font-size:16px}.reader .thumbs{grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:12px;margin:0;padding:12px;list-style:none;display:grid}.reader .thumbs a{color:var(--ink-2);border-radius:6px;flex-direction:column;align-items:center;gap:4px;padding:4px;font-size:13px;text-decoration:none;display:flex}.reader .thumbs a[aria-current]{background:var(--brand-tint);color:var(--brand-text);font-weight:600}.reader .thumbs img{background:var(--tint);width:100%;height:auto;display:block;box-shadow:0 1px 2px #14211f33}.reader .toc{margin:0;padding:8px 0;list-style:none}.reader .toc a,.reader .toc-none{padding:8px 12px 8px calc(16px + var(--level) * 16px);color:var(--ink);justify-content:space-between;gap:12px;text-decoration:none;display:flex}.reader .toc a:hover{background:var(--tint)}.reader .toc-none{color:var(--muted)}.reader .toc-page{color:var(--muted);font-variant-numeric:tabular-nums}.reader .panel-empty{color:var(--muted);margin:0;padding:16px}.reader .mark .mark-on,.reader .mark[aria-pressed=true] .mark-off{display:none}.reader .mark[aria-pressed=true] .mark-on{color:var(--brand-text);display:block}.reader .marks{border-bottom:1px solid var(--line)}.reader .marks h3{color:var(--ink-2);margin:0;padding:12px 16px 0;font-size:14px}.reader .marks .toc li{align-items:center;display:flex}.reader .marks .toc a{flex:1;padding-left:16px}.reader .marks-link{border-bottom:1px solid var(--line);margin:0;padding:12px 16px}.reader .read-next{box-sizing:border-box;width:min(100%,960px);margin:0 auto;padding:8px 16px 64px}.reader .read-next h2{margin:0 0 12px;font-size:20px}.reader .read-next ul{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:20px;margin:0;padding:0;list-style:none;display:grid}.reader-bar:after{content:"";width:calc(var(--read,0) * 100%);background:var(--brand);height:3px;transition:width .2s;position:absolute;bottom:-1px;left:0}.reader .continue-chip{left:50%;bottom:max(24px, env(safe-area-inset-bottom));z-index:35;background:var(--brand);min-height:48px;color:var(--on-brand);font:600 16px var(--font-body);cursor:pointer;border:0;border-radius:999px;padding:0 20px;position:fixed;transform:translate(-50%);box-shadow:0 8px 24px #14211f4d}.reader .thumbs a.marked{position:relative}.reader .thumbs a.marked:after{content:"";background:var(--brand);clip-path:polygon(0 0,100% 0,100% 100%,50% 74%,0 100%);width:12px;height:18px;position:absolute;top:4px;right:10px}}@layer utilities,blocks,template;
