.panel.shop-dialog{width:min(1040px,96vw);max-width:96vw;max-height:96dvh;padding:0;border:0;border-radius:6px;background:#0b709c;overflow:auto}
.shop-dialog>.panel-head{background:#07516f;padding:4px 8px;min-height:35px}.shop-dialog .close-panel{width:30px;height:30px;font-size:25px}
.shop-dialog .panel-body.kap-book-shell{padding:8px 10px 0;min-height:0;aspect-ratio:auto;overflow:visible;background:#0b709c}
.kap-book{position:relative;width:100%;aspect-ratio:1.64;background:#e9f5fa;border:3px solid #253843;border-radius:9px 9px 4px 4px;box-shadow:0 2px 0 #fff,0 4px 0 #253843,0 6px 0 #e4e8e5;isolation:isolate;overflow:hidden;color:#163b50;container-type:inline-size}
.kap-book .book-art{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;z-index:0;pointer-events:none}
.kap-book:after{content:'';position:absolute;top:0;bottom:0;left:49.8%;width:.4%;background:#28465766;box-shadow:3px 0 0 #29445512;pointer-events:none;z-index:2}
.kap-book.cover:after{display:none}.kap-book.cover{aspect-ratio:4/5;width:min(480px,85%);margin:auto;background:#008abb}.kap-book.cover .book-art{object-fit:cover}
.book-title{position:absolute;top:3%;left:5%;right:5%;margin:0;font:800 clamp(16px,3.2cqw,34px)/1.05 'Trebuchet MS',Arial,sans-serif;color:#123f56;z-index:3;text-shadow:0 1px #fff6;pointer-events:none}
.book-title.right{left:55%}.book-title.split{right:55%}.cover .book-title{white-space:pre-line;top:4%;color:white;font:900 clamp(26px,12cqw,62px)/.96 Arial,sans-serif;text-shadow:2px 3px #123f56;letter-spacing:-1px}.cover .book-subtitle{position:absolute;top:27%;left:6%;color:white;font:bold 4cqw Arial;z-index:3}
.book-turn{position:absolute;bottom:0;right:0;width:8%;height:17%;min-width:32px;min-height:40px;background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0;padding:0;z-index:9;cursor:pointer}
.book-turn.previous{left:-2px;right:auto;transform:scaleX(-1)}.book-turn img{position:absolute;right:-5%;bottom:-5%;width:110%;height:110%;max-width:none;object-fit:fill;image-rendering:auto;pointer-events:none}.book-turn{right:-2px;bottom:-2px;width:7%;height:12%;min-width:42px;min-height:42px;overflow:hidden}.book-turn:focus-visible{outline:2px dashed #ffd143;outline-offset:-3px}
.book-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 5px 8px;font:bold 14px Arial;color:white}.book-wallet{display:flex;gap:6px;align-items:center;background:#ffe785;color:#17384a;padding:6px 10px;border:2px solid #193a4b;border-radius:3px}.book-wallet img{width:25px;height:25px;object-fit:contain}
.book-tag,.book-hotspot{position:absolute;z-index:4;margin:0;min-width:0;min-height:0;cursor:pointer}.book-hotspot{border:0;padding:0;background:transparent;box-shadow:none;border-radius:0}
.book-tag{display:flex;align-items:center;justify-content:center;gap:4px;background:#ffd143;border:2px solid #24343c;border-radius:2px 8px 8px 2px;color:#182e38;font:800 clamp(10px,2.1cqw,23px)/1 Arial,sans-serif;padding:2px;box-shadow:none;transform-origin:center}
.book-tag:after{content:'';flex:0 0 5px;height:5px;border:1.5px solid #24343c;border-radius:50%;margin-right:2px}.book-tag:hover{background:#ffe67f}.book-hotspot:focus-visible{outline:2px dashed #ffd143}.book-tag:disabled{opacity:.7;cursor:default}
.book-note{position:absolute;bottom:3%;left:12%;right:12%;padding:4px;margin:0;z-index:5;background:#fff6d6e8;font:14px Arial;text-align:center;color:#213b49}
.book-colors{position:absolute;left:6%;top:22%;width:37%;height:65%;display:grid;grid-template-columns:repeat(4,1fr);gap:5%;z-index:3}.book-swatch{border:0;background:transparent;box-shadow:none;padding:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:#163b50;font:700 clamp(9px,1.5cqw,16px) Arial}
.book-swatch i{display:block;width:70%;aspect-ratio:1;border-radius:50%;background:var(--color);border:2px solid #183c52;box-shadow:inset -3px -4px #0002,inset 2px 2px #fff5}.book-swatch[aria-pressed=true] i{outline:3px solid #ffe46c;outline-offset:2px}.book-swatch small{font:inherit}.book-color-copy{position:absolute;left:5%;top:12%;width:40%;font:700 clamp(10px,1.65cqw,18px)/1.25 Arial;margin:0}.book-color-art{position:absolute;left:53%;top:8%;width:44%;height:86%;object-fit:contain}
.book-collection{position:absolute;inset:16% 7% 9%;display:grid;grid-template-columns:repeat(4,1fr);gap:8% 5%;z-index:3}.book-collectible{border:0;background:transparent;box-shadow:none;padding:0;color:#153c50;display:flex;flex-direction:column;align-items:center;gap:4px;font:700 clamp(10px,1.65cqw,18px)/1.15 Arial;min-width:0}.book-collectible>img,.book-collectible>.book-thumb{width:100%;height:65%;min-height:0;object-fit:contain;border:3px solid white;box-shadow:0 1px 3px #173b4955;background:#d3edf6}.book-collectible.background>img{object-fit:cover;aspect-ratio:1}.book-collection.pin{grid-template-columns:repeat(6,1fr)}.book-collectible.pin>img{border:0;box-shadow:none;background:transparent;max-height:100px}.book-collectible small{font-size:.8em}.book-collectible:hover{color:#0c83b2}
.book-modal{position:absolute;z-index:20;inset:10% 22%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:#fff0a4;border:3px solid #d79900;border-radius:18px;padding:16px;color:#243741;text-align:center;box-shadow:0 3px 0 #0002;font:700 clamp(12px,2cqw,20px)/1.2 Arial}
.book-modal h3{margin:0;font:900 clamp(20px,4cqw,38px)/1 Arial}.book-modal>img{height:38%;max-width:70%;min-height:0;object-fit:contain}.book-modal p{margin:0}.book-modal button{background:#ffda63;border:2px solid #bc831e;color:#273740;box-shadow:none;padding:7px 16px;border-radius:4px;font:700 16px Arial}.book-modal .book-close{position:absolute;right:7px;top:7px;border:1px solid #b78519;border-radius:50%;width:25px;height:25px;padding:0;font:22px Arial}.book-modal .color-preview{width:65px;height:65px;border:3px solid #193b51;border-radius:50%;flex-shrink:1}.book-modal small{font-size:12px}

@media(max-width:600px){.book-modal{inset:3% 10%;padding:10px;gap:4px}.book-modal>img{height:27%}.book-modal h3{font-size:20px}.book-modal button{padding:4px 12px;font-size:13px}.book-modal small{font-size:10px}.book-footer{font-size:12px;padding-top:10px}.book-wallet{padding:4px 6px}.book-collection{gap:5% 4%;inset:16% 6% 12%}.book-collection.pin{grid-template-columns:repeat(6,1fr)}.book-collectible>img{border-width:2px}.book-note{font-size:11px}.book-tag{border-width:1.5px}.book-tag:after{display:none}}

.panel.shop-dialog[open]{position:fixed;inset:0!important;margin:0!important;width:100vw;max-width:none;height:100dvh;max-height:none;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;overflow:hidden;display:flex;align-items:center;justify-content:center;transform:none}
.panel.shop-dialog::backdrop{background:#062b3d66}
.panel.shop-dialog>.panel-head{display:none}
.panel.shop-dialog>.panel-body.kap-book-shell{position:relative;flex:none;width:auto;height:auto;max-width:none;max-height:none;min-height:0;padding:0;margin:0;border:0;background:transparent;overflow:visible;aspect-ratio:auto}
.kap-book,.kap-book.cover{box-sizing:border-box;width:var(--book-w);height:var(--book-h);max-width:none;max-height:none;min-width:0;min-height:0;aspect-ratio:auto;margin:0;border-radius:4px;border:2px solid #253843;box-shadow:0 2px #fff,0 4px #253843;background:#e5f3fa}
.kap-book .book-art{object-fit:fill}.kap-book.cover .book-art{object-fit:fill}
.book-exit{position:absolute;right:0;top:0;z-index:15;width:5%;height:7%;min-width:22px;min-height:22px;margin:0;padding:0;background:#fff8e5;border:2px solid #263541;border-radius:0 0 0 12px;box-shadow:none;color:#182d3b;font:900 clamp(14px,3cqw,28px)/1 Arial}
.book-footer{position:absolute;bottom:1.5%;left:11%;right:11%;padding:0;z-index:6;color:#18384b;font:700 clamp(7px,1.45cqw,14px)/1.2 Arial;pointer-events:none}.book-wallet{border:0;background:#fff5cce8;padding:3px 6px;gap:4px}.book-wallet img{width:2.5cqw;height:2.5cqw;min-width:12px;min-height:12px}.cover .book-footer{left:8%;right:14%;font-size:2.6cqw}.cover .book-wallet img{width:4cqw;height:4cqw}.cover .book-footer>span:first-child{display:none}.cover .book-wallet{margin-left:auto}
.book-colors{left:7%;top:22%;width:35%;height:62%;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));gap:5%}
.book-swatch{position:relative;min-width:0;min-height:0;background:#065278;border:2px solid #368ca9;border-radius:12%;padding:0;overflow:hidden}.book-swatch i{position:absolute;inset:7%;display:block;width:auto;height:auto;border:0;border-radius:0;box-shadow:none;background-color:transparent;background-image:var(--picker-image);background-size:400% 400%;background-position:var(--picker-position);background-repeat:no-repeat}.book-swatch[aria-pressed=true]{border-color:#ffe275;box-shadow:0 0 0 1px #ffe275}.book-swatch[aria-pressed=true] i{outline:none}.book-swatch:focus-visible{outline:2px solid #fff;outline-offset:2px}
.book-color-copy{top:8%;left:7%;width:36%;font:700 clamp(9px,2.4cqw,24px)/1.15 Arial}.book-color-copy small{display:block;margin-top:3%;font:400 clamp(7px,1.55cqw,15px)/1.2 Arial}.book-color-art{top:5%;height:86%}
.book-collection{inset:6% 7% 12%;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:5% 7%}.book-collection.pin{grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}.book-collectible{display:grid;grid-template-rows:minmax(0,1fr) auto auto;justify-items:center;align-items:center;gap:2px;height:100%;min-height:0;font:700 clamp(7px,1.4cqw,14px)/1.1 Arial}.book-collectible>img,.book-collectible>.book-thumb{width:auto;height:100%;max-width:100%;aspect-ratio:280/340;min-height:0;object-fit:contain;border:2px solid white;box-shadow:0 1px 2px #173b4933}.book-collectible.background>img{aspect-ratio:1;object-fit:cover}.book-collectible.pin>img{max-height:none;aspect-ratio:1;border:0}.book-collectible>span:not(.book-thumb){width:100%;min-height:2.2em;display:grid;place-items:center;overflow-wrap:anywhere}.book-collectible small{font-size:.9em}
.book-tag{background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0;padding:0!important}.book-tag:after{display:none}.book-tag>img{width:100%;height:100%;object-fit:contain;pointer-events:none}.book-tag:hover{filter:brightness(1.08)}
.book-note{bottom:9%;font-size:clamp(8px,1.3cqw,13px)}
.book-owner-tools{position:absolute;left:3%;bottom:3%;z-index:14;margin:0;padding:.55cqw 1cqw;border:2px solid #263541;border-radius:5px;background:#fff4c9;color:#17394d;box-shadow:0 2px #263541;font:800 clamp(8px,1.35cqw,14px)/1 Arial}
.book-editor-warning{position:fixed;top:4px;left:4px;max-width:360px;max-height:25vh;overflow:auto;z-index:30;background:#fff7d9;border:1px solid #a26e24;color:#22343c;padding:7px;font:12px Arial}
.book-modal{gap:1.2cqw;padding:2cqw;font-size:clamp(8px,1.9cqw,20px)}.book-modal h3{font-size:clamp(12px,3.2cqw,32px)}.book-modal button{font-size:clamp(9px,1.8cqw,18px);padding:.8cqw 2cqw}.book-modal small{font-size:clamp(7px,1.25cqw,12px)}.book-modal .color-preview{width:8cqw;height:8cqw;min-width:56px;min-height:56px;border:0;border-radius:0;background-color:transparent;background-image:var(--picker-image);background-size:400% 400%;background-repeat:no-repeat}


