:root{--table:#2d2823;--ink:#2a2520;--paper:#f3ecdc;--chalk:#e9e0cd;--focus:#f0c66b;--serif:"Iowan Old Style", "Palatino Linotype", "Book Antiqua", Palatino, "Yu Mincho", "Hiragino Mincho ProN", "Noto Serif JP", Georgia, serif;--sans:"Gill Sans", "Gill Sans MT", "Segoe UI", "Hiragino Kaku Gothic ProN", "Yu Gothic", system-ui, sans-serif;--noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .5 0 0 0 0 .45 0 0 0 0 .4 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}html,body,#root{overscroll-behavior:none;height:100%;margin:0;overflow:hidden}body{background:var(--table);color:var(--chalk);font-family:var(--sans);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.table{background:radial-gradient(ellipse 85% 75% at 32% 22%, #ffecc81a, transparent 70%), radial-gradient(ellipse 120% 90% at 50% 50%, transparent 55%, #00000073), var(--noise), repeating-linear-gradient(90deg, #ffffff03 0 1px, transparent 1px 3px), repeating-linear-gradient(0deg, #00000008 0 1px, transparent 1px 3px), var(--table);touch-action:none;position:fixed;inset:0}.book-host{z-index:2;position:fixed;inset:0}.zoom-layer{transform-origin:0 0;position:absolute;inset:0}.book-host.is-hidden{visibility:hidden}.book{outline:none;animation:.46s cubic-bezier(.2,.7,.2,1) arrive;position:absolute}.reduced .book{animation:none}@keyframes arrive{0%{opacity:0;translate:0 26px;rotate:-.6deg}}.book:focus-visible .cover{outline:2px solid var(--focus);outline-offset:6px}.cover{background:linear-gradient(90deg, transparent calc(50% - 26px), #00000059 50%, transparent calc(50% + 26px)), var(--noise), repeating-linear-gradient(45deg, #ffffff09 0 1px, transparent 1px 3px), repeating-linear-gradient(-45deg, #00000014 0 1px, transparent 1px 3px), var(--cloth);border-radius:5px;height:calc(100% + 20px);position:absolute;top:-9px;box-shadow:inset 0 1px #ffffff14,inset 0 -2px #00000040,0 34px 60px -24px #000000bf,0 10px 22px #00000059}.book-root[data-mode=single] .cover{background:linear-gradient(90deg, #00000059, transparent 22px), var(--noise), repeating-linear-gradient(45deg, #ffffff09 0 1px, transparent 1px 3px), var(--cloth)}.block{background:linear-gradient(#fffaeb40,#0000 30%,#0000001f),repeating-linear-gradient(90deg,#efe6d1 0 1px,#c9bb9c 1px 1.7px);height:calc(100% - 3px);position:absolute;top:2px;box-shadow:0 1px 2px #00000059}.block-left{border-radius:3px 0 0 3px}.block-right{border-radius:0 3px 3px 0}.slot{background:var(--paper);position:absolute;top:0;overflow:hidden;box-shadow:0 0 0 .5px #503c1e59}.slot .sheet,.slot .sheet canvas{width:100%;height:100%;display:block;position:absolute;inset:0}.slot .gutter{pointer-events:none;position:absolute;inset:0}.slot-left .gutter{background:linear-gradient(270deg,#2d201242,#2d201212 2.6%,#0000 7.5%)}.slot-right .gutter{background:linear-gradient(90deg,#2d201242,#2d201212 2.6%,#0000 7.5%)}.slot .light{pointer-events:none;background:linear-gradient(135deg,#fffaeb09,#0000 45%,#28190a09);position:absolute;inset:0}.spine-shade{pointer-events:none;background:#281c1040;width:2px;margin-left:-1px;position:absolute;top:0;bottom:0;left:50%}.book-root[data-mode=single] .spine-shade{display:none}.book.flash .sheet canvas{animation:.22s ease-out flash}@keyframes flash{0%{opacity:.35}}.slot{container-type:inline-size}.here{pointer-events:none;width:12px;height:12px;margin:-6px 0 0 -6px;position:absolute}.here-ring{left:calc(6px - var(--ring) / 2);top:calc(6px - var(--ring) / 2);width:var(--ring);height:var(--ring);background:#1d68b81f;border:1.5px solid #1d68b8b3;border-radius:50%;position:absolute}.here-dot{background:#1d68b8;border:2px solid #fff;border-radius:50%;width:12px;height:12px;animation:2s ease-in-out infinite here-pulse;position:absolute;top:0;left:0;box-shadow:0 1px 4px #00000073}@keyframes here-pulse{50%{box-shadow:0 0 0 6px #1d68b82e,0 1px 4px #00000073}}.hot{position:absolute;inset:0}.hotspot{cursor:pointer;background:0 0;border:0;border-radius:2px;margin:0;padding:0;position:absolute}.hotspot:hover{background:#9a3b2c17}.hotspot:focus-visible{outline-offset:1px;background:#f0c66b2e;outline:2px solid #b8762a}.fore{cursor:grab;z-index:3;touch-action:none;height:100%;position:absolute;top:0}.fore:active{cursor:grabbing}.tab{z-index:4;color:#f4ecd8;width:22px;font:600 11px/1 var(--serif);writing-mode:vertical-rl;letter-spacing:1px;cursor:pointer;white-space:nowrap;touch-action:manipulation;background:linear-gradient(90deg,#ffffff1f,#0000 40%,#0000002e),#5c6b5f;border:0;padding:0;position:absolute;overflow:hidden;box-shadow:0 1px 3px #00000059}.tab-right{border-radius:0 4px 4px 0}.tab-left{border-radius:4px 0 0 4px}.tab-key{background:linear-gradient(90deg,#ffffff24,#0000 40%,#0000002e),#8a6d34}.tab-index{background:linear-gradient(90deg,#ffffff1f,#0000 40%,#0003),#7d3328}.tab:hover{filter:brightness(1.12)}.tab:focus-visible{outline:2px solid var(--focus);outline-offset:1px}.turn-gl{z-index:6;pointer-events:none;position:fixed;inset:0}.turn-gl:not(.active){visibility:hidden}.table-edge{z-index:8;height:56px;padding:0 max(14px, env(safe-area-inset-right)) env(safe-area-inset-bottom) max(14px, env(safe-area-inset-left));justify-content:space-between;align-items:center;gap:12px;display:flex;position:fixed;bottom:0;left:0;right:0}.controls,.shelf,.edge-right{align-items:center;gap:8px;display:flex}.chip{height:34px;color:var(--chalk);font:500 13px/1 var(--sans);cursor:pointer;background:#e9e0cd0f;border:1px solid #e9e0cd2e;border-radius:17px;align-items:center;gap:7px;padding:0 13px;display:inline-flex}.chip svg{width:17px;height:17px}.chip:hover:not(:disabled){background:#e9e0cd1f}.chip[aria-pressed=true]{background:#e9e0cd29;border-color:#e9e0cd57}.chip:disabled{opacity:.4;cursor:default}.chip:focus-visible,.spine:focus-visible,.ov-sheet:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.chip-quiet{opacity:.6;background:0 0;border-color:#0000;font-size:18px}.attribution{color:#e9e0cdb8;font-size:12px;text-decoration:none}.attribution:hover{text-decoration:underline}.spine{min-width:74px;height:38px;color:var(--foil);font-family:var(--serif);text-align:left;cursor:pointer;background:linear-gradient(180deg, #ffffff24, transparent 30%, #00000040), var(--noise), var(--cloth);border:0;border-radius:3px;flex-direction:column;justify-content:center;gap:1px;padding:0 10px;transition:transform .16s,opacity .16s;display:flex;box-shadow:0 3px 6px #00000073,inset 0 0 0 1px #00000040}.spine-ja{font-size:13px;font-weight:600}.spine-en{letter-spacing:1.5px;text-transform:uppercase;opacity:.85;font-size:10px}.spine{white-space:nowrap;flex:none;position:relative}.spine:not(.is-out){filter:saturate(.55)brightness(.82);box-shadow:0 2px 4px #0006,inset 0 0 0 1px #00000059}.spine:not(.is-out):hover{filter:none}.spine.is-out{box-shadow:0 0 0 2px var(--foil), 0 4px 10px #00000080}.spine.is-out .spine-ja:before{content:"✓ ";font-family:var(--sans)}.table.map-visible .table-edge{background:#241f1af0;box-shadow:0 -1px #e9e0cd1f,0 -8px 24px #00000040}.tile-error{z-index:7;max-width:calc(100vw - 24px);color:var(--chalk);background:#241f1af0;border-radius:6px;align-items:center;gap:12px;padding:8px 8px 8px 14px;font-size:13px;display:flex;position:fixed;top:16px;left:50%;transform:translate(-50%);box-shadow:0 6px 20px #0006}.overview-map{z-index:1;position:fixed;inset:0}.overview-sheets{z-index:3;pointer-events:none;position:fixed;inset:0}.ov-sheet{--paper:0;border:1.5px solid rgb(154 59 44/calc(100% - var(--paper) * 60%));background:rgb(243 236 220/calc(var(--paper) * 100%));color:#8e3427;font-family:var(--serif);box-shadow:0 calc(var(--paper) * 10px) calc(var(--paper) * 24px) rgb(0 0 0/calc(var(--paper) * 40%));cursor:pointer;pointer-events:auto;will-change:transform;border-radius:1px;justify-content:center;align-items:center;padding:0;font-weight:700;display:flex;position:absolute;top:0;left:0}.ov-sheet span{text-shadow:0 0 3px #f3ecdc,0 0 2px #f3ecdc}.ov-sheet:disabled{pointer-events:none;cursor:default}.ov-sheet:not(:disabled):hover{background:#f3ecdc8c}.ov-selected{z-index:2;box-shadow:none;background:0 0;border:0;overflow:hidden}.ov-selected:not(:disabled){outline-offset:0;background:#f0c66b38;outline:3px solid #9a3b2c}.ov-selected:not(:disabled):focus-visible{outline:3px solid var(--focus);box-shadow:0 0 0 5px #9a3b2c}.ov-selected canvas{width:100%;height:100%;display:block}.ov-label{background:var(--paper);color:var(--ink);font-family:var(--serif);pointer-events:none;white-space:nowrap;border-radius:2px;align-items:baseline;gap:8px;padding:4px 9px;font-size:14px;display:flex;position:absolute;top:0;left:0;box-shadow:0 3px 10px #00000059}.ov-label strong{color:#9a3b2c;font-size:17px}.magnifier{z-index:10;background:#16120edb;position:fixed;inset:0}.magnifier-scroll{cursor:grab;touch-action:pan-x pan-y;padding:40px;position:absolute;inset:0;overflow:auto}.magnifier-scroll canvas{margin:0 auto;display:block;box-shadow:0 20px 60px #0009}.magnifier-bar{gap:8px;display:flex;position:fixed;bottom:18px;left:50%;transform:translate(-50%)}.magnifier-bar .chip{white-space:nowrap;background:#1e1914f0}kbd{font:11px var(--sans);opacity:.6}.testing-panel{z-index:9;width:250px;color:var(--ink);background:#ece3cf;border-radius:6px;padding:14px;font-size:13px;position:fixed;bottom:64px;right:14px;box-shadow:0 12px 34px #00000080}.testing-panel label{margin-bottom:6px;font-weight:600;display:block}.testing-panel .row{gap:6px;margin-bottom:10px;display:flex}.testing-panel input[type=text],.testing-panel input:not([type]){min-width:0;height:34px;color:var(--ink);font:16px var(--sans);background:#fbf7ee;border:1px solid #b9ab8e;border-radius:4px;flex:1;padding:0 10px}.testing-panel .chip{color:var(--ink);background:#2a25200f;border-color:#2a252040}.testing-panel .option{width:100%;color:var(--ink);font:600 14px var(--sans);cursor:pointer;background:#fbf7ee;border:1px solid #2a252040;border-radius:6px;justify-content:space-between;align-items:center;padding:9px 10px;display:flex}.testing-panel .option[aria-pressed=true]{border-color:#1d68b8;box-shadow:inset 0 0 0 1px #1d68b8}.testing-panel .option[aria-pressed=true] .option-state{color:#1d68b8}.testing-panel .option-note{color:#6f675c;margin:6px 2px 12px;font-size:12px;line-height:1.35}.testing-panel details{color:#6f675c;margin:10px 0}.testing-panel summary{cursor:pointer;font-size:12px}.testing-panel .option:focus-visible,.testing-panel summary:focus-visible{outline-offset:2px;outline:2px solid #b8762a}.chip-quiet.is-locating{color:#8fc1f2;opacity:1}.testing-panel .check{align-items:center;gap:8px;font-weight:400;display:flex}.testing-panel dl{grid-template-columns:auto 1fr;gap:3px 10px;margin:10px 0 12px;display:grid}.testing-panel dt{color:#6f675c}.testing-panel dd{margin:0}.locate-status{z-index:9;max-width:calc(100vw - 20px);color:var(--chalk);background:#241f1af2;border-radius:8px;align-items:center;gap:10px;padding:6px 6px 6px 14px;font-size:13px;line-height:1.3;display:flex;position:fixed;bottom:62px;left:50%;transform:translate(-50%);box-shadow:0 6px 18px #0006}.locate-status .chip{white-space:nowrap;flex:none;height:30px}@media (max-width:640px){.table-edge{gap:6px;padding-left:8px;padding-right:8px}.chip{padding:0 9px}.controls,.shelf,.edge-right{gap:6px}.tab{font-size:10px}.chip-label{display:none}.controls:has(.chip-fit) .chip-magnify{display:none}.table-edge .attribution{right:10px;bottom:calc(56px + env(safe-area-inset-bottom));text-shadow:0 1px 2px #000c;max-width:none;font-size:10px;line-height:1;position:absolute}.locate-status{bottom:76px}.spine{min-width:0;height:34px;padding:0 7px}.spine-ja{font-size:12px}.spine-en{display:none}}@media (max-width:380px){.table-edge,.controls,.shelf,.edge-right{gap:4px}.table-edge{padding-left:6px;padding-right:6px}.chip{padding:0 7px}.chip-quiet{padding:0 4px}.spine{padding:0 6px}}.reduced *,.reduced :before,.reduced :after{transition-duration:0s!important;animation-duration:0s!important}
