.collection-dialog{position:fixed;inset:0;width:100vw;height:100svh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:transparent;overflow:hidden;color:#142653;outline:none}
.collection-dialog::backdrop{background:transparent}
.collection-dialog[open]{display:grid;place-items:center}
.collection-window{position:relative;width:min(155.5556svh,calc(100vw - 48px),1344px);height:min(88.3333svh,764px);display:flex;flex-direction:column;background:#fff7df;border:3px solid #142653;border-radius:8px;box-shadow:7px 7px 0 #fb8ac1,7px 7px 0 3px #142653;overflow:hidden;isolation:isolate;container-type:inline-size;transform-origin:center;transform:scale(.85)}
.collection-titlebar{flex:0 0 auto;min-height:37px;display:grid;grid-template-columns:22px 1fr 22px;gap:15px;align-items:center;padding:5px 10px;border-bottom:3px solid #142653;background:repeating-linear-gradient(to bottom,#ff9bcc 0 2px,#142653 2px 2.75px,#ff9bcc 2.75px 5px)}
.collection-window-label{padding:3px 5px;font:400 clamp(11px,2.06cqw,16px)/1.25 System,Arial,sans-serif;text-align:center;text-wrap:balance;border:1.5px solid #142653;background:#fff7df}
.collection-close{display:grid;place-items:center;width:21px;height:21px;padding:0;background:#fff7df;border:2px solid #142653;border-radius:0;color:#142653;cursor:pointer;font:400 26px/17px Arial,sans-serif}
.collection-close span{position:relative;top:-1px}
.collection-close:hover{background:#54c9ff}
.collection-close:active{background:#fb8ac1}
.collection-close:focus-visible,.collection-button:focus-visible{outline:2px dashed #142653;outline-offset:4px}
.collection-zoom{width:21px;height:20px;border:2px solid #142653;background:linear-gradient(to bottom,#bbddff 0 4px,#142653 4px 5.5px,#bbddff 5.5px)}
.collection-body{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;padding:18px 28px;overflow:auto;overscroll-behavior:contain}
.collection-heading{margin:0 0 26px;font:700 10cqw/1 Prophet,Arial,sans-serif;letter-spacing:-.025em;text-align:right;white-space:nowrap}
.collection-artwork{min-width:0;min-height:0}
.collection-artwork img{display:block;width:100%;height:100%;min-height:0;object-fit:contain;object-position:right center}
.collection-copy{align-self:center;min-width:0;container-type:inline-size}
.collection-copy p{margin:0;font:400 clamp(18px,4.6cqw,26px)/1.45 System,Arial,sans-serif;text-align:right;text-wrap:pretty}
.collection-footer{display:flex;justify-content:flex-end;gap:16px;margin-top:26px;padding:0 3px 3px 0}
.collection-button{display:inline-flex;align-items:center;justify-content:center;height:26px;min-width:72px;padding:1px 12px 0;background:#fff7df;border:2px solid #142653;border-radius:5px;box-shadow:3px 3px 0 #142653,inset 0 3px 0 #fff;color:#142653;cursor:pointer;text-decoration:none;font:700 15px/1 Prophet,Arial,sans-serif;touch-action:manipulation}
.collection-enter{min-width:84px;background:#54c9ff;box-shadow:3px 3px 0 #142653,inset 0 0 0 2px #e9fbff}
.collection-button:hover{background:#ffe45c}
.collection-button:active{transform:translate(2px,2px);box-shadow:1px 1px 0 #142653,inset 0 0 0 2px #e9fbff}
.collection-grip{position:absolute;right:5px;bottom:5px;width:14px;height:12px;background:repeating-linear-gradient(135deg,transparent 0 3px,#142653 3px 4.5px,transparent 4.5px 7px);clip-path:polygon(100% 0,100% 100%,0 100%)}
.collection-dialog[data-transition] .collection-window{will-change:transform,opacity}
body.collection-window-open .room .glow-image{display:none}
body.collection-window-open .room .creature{animation:none}
body.collection-window-open .room .base-image{filter:none}
@media(max-width:800px){.collection-window{width:calc(100vw - 36px);height:calc(100svh - 40px)}.collection-titlebar{gap:8px}.collection-body{display:flex;flex-direction:column;gap:24px;padding:24px 20px}.collection-copy{flex:0 0 auto;width:100%}.collection-heading{margin-bottom:20px}.collection-artwork{flex:0 0 auto;width:100%}.collection-artwork img{height:auto}.collection-footer{gap:14px}}