.binder-library{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:24px}.binder-crop-frame{position:relative;width:100%;overflow:hidden;touch-action:none;background:#193449;flex-shrink:0}.binder-crop-frame>img{width:100%;height:100%;display:block}.binder-crop-region{position:absolute;border:2px solid #fff;box-shadow:0 0 0 1000px #10243299}.binder-crop-move{position:absolute;top:0;right:0;bottom:0;left:0;border:0;background:transparent;cursor:move;width:100%;height:100%}.binder-crop-handle{position:absolute;width:28px;height:28px;background:#193449;border:2px solid #fff;padding:0}.binder-crop-handle.nw{top:0;left:0;cursor:nw-resize}.binder-crop-handle.ne{top:0;right:0;cursor:ne-resize}.binder-crop-handle.sw{bottom:0;left:0;cursor:sw-resize}.binder-crop-handle.se{bottom:0;right:0;cursor:se-resize}.binder-crop-region button:focus-visible{outline:3px solid #e9b553;outline-offset:-4px}.binder-cover{height:250px;position:relative;overflow:hidden;border-radius:4px 14px 14px 4px;border-left:14px solid #0003;box-shadow:3px 5px #e4d7c5;display:flex;align-items:center;justify-content:center}.binder-cover .binder-artwork{height:100%;width:100%;position:absolute;top:0;right:0;bottom:0;left:0;opacity:.65}.binder-cover-title{position:relative;background:#193449e8;color:#fffdf9;padding:14px 22px;max-width:90%;text-align:center;font-size:1.25rem;font-weight:700;overflow-wrap:anywhere}.binder-workspace{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:20px;align-items:start}.binder-stage{padding:16px;background:#e7dccb;border-radius:12px;min-width:0;position:relative;background-size:cover;background-position:center}.binder-stage>*{position:relative;z-index:1}.binder-stage>.binder-background{position:absolute;top:0;right:0;bottom:0;left:0;opacity:.2;z-index:0;pointer-events:none}.binder-background img{object-fit:cover!important}.binder-spread{display:grid;grid-template-columns:1fr;gap:16px;max-width:640px;margin:auto;align-items:start;animation:binder-enter .16s ease-out}.binder-spread.double{grid-template-columns:minmax(0,1fr) minmax(0,1fr);max-width:1200px;gap:20px}.binder-page{background:#193449;padding:12px;border-radius:5px;min-width:0;box-shadow:0 3px 6px #19344933}.binder-grid{display:grid;gap:8px;position:relative;padding:3px;-webkit-user-select:none;user-select:none}.binder-slot{border:1px solid #fff4;border-radius:5px;background:#102432;padding:0;min-width:0;min-height:0;overflow:hidden;position:relative;cursor:pointer;touch-action:manipulation;color:#fffdf9}.binder-slot:focus-visible{outline:3px solid #efb74d;outline-offset:2px;z-index:2}.binder-slot.selected{outline:3px solid #efb74d;outline-offset:1px;z-index:1}.binder-slot.over{outline:3px solid #8acaac}.binder-slot.dragging{opacity:.35}.binder-slot.empty{background:repeating-linear-gradient(135deg,#fff1 0 1px,transparent 1px 8px);display:flex;align-items:center;justify-content:center}.binder-empty-label{padding:8px;overflow:hidden;text-overflow:ellipsis;font-size:clamp(.6rem,1.5vw,1rem);word-break:break-word}.binder-artwork{height:100%;width:100%;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}.binder-artwork-fallback{font-size:.65rem;padding:8px;overflow-wrap:anywhere;color:inherit}.binder-status{position:absolute;bottom:0;left:0;right:0;background:#193449e8;color:#fff;font-size:clamp(.5rem,.8vw,.7rem);padding:2px 4px;text-align:center}.binder-status.owned{background:#315c42ed}.binder-status.ordered{background:#765018ed}.binder-slot:has(.binder-status.missing) img{opacity:.52}.binder-lock{position:absolute;right:4px;top:3px;color:#ffcd65;font-size:11px}.binder-slot-labels{position:absolute;top:2px;left:2px;display:flex;flex-wrap:wrap;gap:2px;max-width:85%}.binder-slot-labels span{color:#fff;text-shadow:0 1px 2px #000;font-size:8px;padding:1px 3px;border-radius:2px;max-width:100%;overflow:hidden}.binder-page-caption{display:flex;justify-content:space-between;align-items:center;gap:8px;color:#fffdf9;padding:8px 2px 0}.binder-page-caption .MuiChip-root{background:#fff2;color:#fff}.binder-selection{position:absolute;background:#edb75033;border:1px solid #edb750;pointer-events:none;z-index:3}.binder-overview{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px}.binder-page.compact{padding:6px}.binder-page.compact .binder-grid{gap:3px}.binder-page.compact .binder-slot{border-radius:2px}.binder-search-results{display:grid;grid-template-columns:repeat(auto-fill,minmax(115px,1fr));gap:10px;max-height:55vh;overflow:auto;padding:4px}.binder-search-card{border:1px solid #d8c8b5;border-radius:6px;padding:7px;background:#fffdf9;text-align:left;color:#193449;cursor:pointer}.binder-search-card[aria-pressed=true]{outline:3px solid #a84643}.binder-search-card .binder-artwork{aspect-ratio:63/88;height:auto}.binder-inspector.MuiCard-root{position:sticky;top:85px;max-height:calc(100dvh - 110px);overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable}.binder-mobile-drawer.MuiDrawer-paper{max-height:85dvh;border-radius:16px 16px 0 0;overflow:hidden}.binder-drawer-scroll{min-height:0;overflow:auto;overscroll-behavior:contain;padding-bottom:max(8px,env(safe-area-inset-bottom))}.binder-list-scroll{min-width:0;max-height:65dvh;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable}.binder-list-scroll table{min-width:560px}.binder-list-scroll td:first-child{overflow-wrap:anywhere}.binder-editor{min-width:0}.binder-presentation{position:fixed;top:0;right:0;bottom:0;left:0;background:#fffdf9;padding:18px;overflow:auto;overscroll-behavior:contain}.binder-presentation .binder-editor-header{position:sticky;top:-18px;z-index:5;background:#fffdf9;padding:12px 0}.binder-search-results{max-height:55dvh;overscroll-behavior:contain;scrollbar-gutter:stable}.binder-search-card{min-width:0;overflow-wrap:anywhere}.binder-dialog .MuiDialogActions-root{flex-wrap:wrap;gap:4px}@keyframes binder-enter{0%{opacity:.7;transform:translate(6px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){.binder-spread{animation:none}}@media(max-width:1100px){.binder-workspace{grid-template-columns:minmax(0,1fr)}.binder-inspector.MuiCard-root{position:static;max-height:none;overflow:visible}.binder-stage,.binder-page{padding:8px}.binder-grid{gap:5px}}@media(max-width:650px){.binder-spread.double{grid-template-columns:minmax(0,1fr)}.binder-status{font-size:10px}.binder-library{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:16px}.binder-cover{height:200px}.binder-page{padding:6px}.binder-grid{gap:5px}.binder-presentation{padding:8px}.binder-presentation .binder-spread{height:auto}.binder-presentation .binder-editor-header{top:-8px}.binder-dialog .MuiDialog-paper{margin:16px;width:calc(100% - 32px);max-height:calc(100dvh - 32px)}.binder-dialog .MuiDialogContent-root,.binder-dialog .MuiDialogTitle-root{padding-inline:16px}.binder-overview{grid-template-columns:repeat(2,minmax(0,1fr))}}.binder-featured{position:absolute;top:12%;right:8%;bottom:20%;left:8%;display:flex;align-items:center;gap:5px;pointer-events:none}.binder-featured .binder-artwork{position:relative;inset:auto;opacity:1;flex:1;min-width:0;height:75%;transform:rotate(-6deg)}.binder-featured .binder-artwork:nth-child(2){transform:translateY(-12px)}.binder-featured .binder-artwork:nth-child(3){transform:rotate(6deg)}
