@import "library-colors-Jv2rd-6.css";
@import "spine-editor-DmhpoWq.css";
.library-room-page { background:var(--paper); }
.room-heading { display:flex; align-items:center; justify-content:space-between; gap:24px; margin:0 0 8px; }
.room-heading h1 { font-size:var(--text-title); line-height:1.12; margin:0 0 6px; }
.room-heading p { margin:0; font-size:var(--text-base); }
.room-heading .actions { gap:12px; }
.room-search label { display:flex; gap:10px; align-items:center; margin:0; position:relative; }
.room-search i { position:absolute; left:15px; pointer-events:none; }
.room-search input { padding-left:44px; width:260px; height:50px; }
.room-toolbar { display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap; }
.room-filters { display:flex; gap:12px; }
.room-filters a { border:1px solid var(--line); border-radius:28px; padding:9px 25px; line-height:1.2; }
.room-filters .is-active { background:var(--sage); color:var(--green); border-color:var(--sage); }
.room-toolbar .view-switch { display:flex; gap:4px; border:1px solid var(--line-strong); border-radius:9px; padding:3px; }
.room-toolbar .view-switch a { display:flex; gap:9px; align-items:center; padding:9px 15px; border-radius:6px; }
.room-toolbar .view-switch .active { background:var(--sage); color:var(--green); }
.room-feedback:not(.sr-only) { margin:12px 0; color:var(--green); font-size:var(--text-small); }

.library-room [data-library-room-target=scene] { position:relative; margin:24px 0 32px; }
.room-stage { position:relative; padding:0 48px; overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:thin; }
.room-cabinet { --room-columns:12; position:relative; width:calc(var(--room-columns) * 40px + 192px); min-width:calc(var(--room-columns) * 40px + 192px); margin:0 auto; padding:16px 16px 0; background:url("../images/library-room/modular/back-puITMow.svg") repeat; image-rendering:pixelated; }
.room-cabinet::before,.room-cabinet::after { content:''; position:absolute; top:0; bottom:0; width:16px; background:url("../images/library-room/modular/post-5l_67V7.svg") repeat-y; z-index:2; pointer-events:none; }
.room-cabinet::before { left:0; }
.room-cabinet::after { right:0; }
.room-cornice { position:absolute; top:0; left:0; right:0; height:16px; background:url("../images/library-room/modular/beam-5rqJNAk.svg") repeat-x; z-index:3; }
.room-cornice::before,.room-cornice::after { content:''; position:absolute; top:0; width:16px; height:16px; background:url("../images/library-room/modular/corner-nY6NJBN.svg"); }
.room-cornice::before { left:0; }
.room-cornice::after { right:0; }
.room-nameplate { position:relative; display:table; max-width:420px; margin:16px auto 8px; padding:8px 20px; color:var(--ink); font-size:var(--text-base); line-height:1.3; text-align:center; background:#ead1a0; border:2px solid #523726; box-shadow:0 2px #442d24, inset 0 2px #fff0ca; }
.room-ivy-anchor { position:absolute; top:0; width:128px; height:112px; z-index:4; pointer-events:none; }
.room-ivy-anchor--left { left:-18px; }
.room-ivy-anchor--right { right:-18px; transform:scaleX(-1); }
.room-ivy { position:absolute; top:-8px; left:0; image-rendering:pixelated; }
.room-shelf { position:relative; display:grid; grid-template-columns:80px calc(var(--room-columns) * 40px) 80px; align-items:end; height:176px; padding-bottom:16px; background:url("../images/library-room/modular/shadow-1XupveF.svg") repeat-x top; }
.room-shelf::after { content:''; position:absolute; bottom:0; left:0; right:0; height:16px; background:url("../images/library-room/modular/beam-5rqJNAk.svg") repeat-x; z-index:3; pointer-events:none; }
.room-books { display:flex; align-items:end; gap:0; height:144px; padding:0; overflow:visible; }
.room-book,.room-book-height--1,.room-book-height--2 { position:relative; display:block; flex:0 0 40px; width:40px; height:128px; color:var(--text-inverse); border:2px solid #302720; border-radius:0; background:#546951; box-shadow:inset 2px 0 #ffffff28,inset -2px 0 #0003; }
.room-book--0 { background:#e6ce98; color:var(--ink); }
.room-book--1 { background:#47654c; }
.room-book--2 { background:#485b72; }
.room-book--3 { background:#a2523e; }
.room-book--4 { background:#75506b; }
.room-book--5 { background:#b99049; color:var(--ink); }
.room-book-art { position:absolute; inset:6px 2px; border-block:4px double var(--spine-bands-color,#dfbb78); pointer-events:none; }
.room-book-title { position:absolute; inset:18px 0; margin:auto; width:1.3em; writing-mode:vertical-rl; transform:rotate(180deg); text-align:center; font-size:11px; line-height:1.3; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.room-book:hover,.room-book:focus-visible { translate:0 -4px; color:inherit; outline:2px solid #f7d890; outline-offset:-2px; }
.room-object { position:relative; width:80px; height:128px; overflow:hidden; pointer-events:none; }
.room-object-image { position:absolute; left:0; bottom:0; image-rendering:pixelated; }
.room-object-image--plant { bottom:-11px; }
.room-object-image--lantern { bottom:-12px; }
.room-object-image--cat { bottom:-23px; }
.room-object-image--succulent { bottom:-12px; }
.room-object-image--vase { bottom:-15px; }
.room-object-image--teacup { bottom:-11px; }
.room-object-image--candles { bottom:-15px; }
.room-object-image--clock { bottom:-23px; }
.room-object-image--bookstack { bottom:-16px; }
.room-object-image--frame { bottom:-14px; }
.room-object-image--moon-globe { bottom:-15px; }
.room-object-image--dragon { bottom:-22px; }
.room-object-image--terrarium { bottom:-10px; }
.room-object-image--crystal { bottom:-16px; }
.room-neighbour { display:none; }
.room-empty { position:relative; margin:20px 0; padding:20px; text-align:center; background:var(--surface); border-radius:8px; }
.room-empty h3 { margin:0 0 10px; }
.room-empty p { margin:0 0 16px; }
.room-decor-dialog { width:min(500px,calc(100% - 28px)); max-height:calc(100dvh - 40px); margin:auto 24px auto auto; padding:24px; background:var(--surface); color:var(--ink); border:1px solid var(--line); border-radius:16px; box-shadow:0 16px 60px var(--shadow-strong); }
.room-decor-dialog::backdrop { background:#2c123740; }
.room-decor-dialog header { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.room-decor-dialog h2 { margin:0 0 14px; }
.room-decor-dialog p { font-size:var(--text-base); line-height:1.55; }
.room-close { font-size:1.7rem; padding:0 8px; }
.room-decor-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:20px; }
.room-decor-grid label { font-size:var(--text-small); }
.room-decor-grid select { margin-top:8px; font-size:var(--text-base); }
.room-decor-dialog footer { display:flex; justify-content:flex-end; gap:12px; margin-top:24px; }
.room-decor-dialog [role=alert] { color:var(--error); }
.library-room [aria-busy=true] { opacity:.65; transition:opacity 150ms; }
@media(max-width:1100px) {
 .room-heading { align-items:flex-start; flex-wrap:wrap; }
 .room-stage { padding:0; }
}
@media(max-width:700px) {
 .room-heading h1 { font-size:var(--text-title); }
 .room-heading .actions,.room-search,.room-search input { width:100%; }
 .room-toolbar { gap:12px; }
 .room-toolbar .actions { flex-wrap:wrap; }
 .room-cabinet { margin:0; }
 .room-decor-dialog { margin:auto; padding:20px; }
 .room-decor-grid { grid-template-columns:1fr; gap:8px; }
}
@media(prefers-reduced-motion:reduce) { .room-book:hover,.room-book:focus-visible { translate:none; } }

.room-shelf { grid-template-columns:80px minmax(0,1fr) 80px; }
.room-shelf--no-left { grid-template-columns:0 minmax(0,1fr) 80px; }
.room-shelf--no-right { grid-template-columns:80px minmax(0,1fr) 0; }
.room-shelf--no-left.room-shelf--no-right { grid-template-columns:0 minmax(0,1fr) 0; }
.room-shelf--no-left > .room-object:first-child, .room-shelf--no-right > .room-object:last-child { width:0; overflow:hidden; }
.room-decor-dialog { width:min(1160px,calc(100% - 24px)); margin:auto; padding:20px; }
.room-editor-layout { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:24px; }
.room-editor-canvas { align-self:start; position:sticky; top:0; min-width:0; }
[data-room-editor-preview] { overflow:auto; overscroll-behavior:contain; padding-bottom:12px; }
[data-room-editor-preview] .room-cabinet { margin:0 auto; }
[data-room-preview-status] { color:var(--muted); font-size:var(--text-small); }
.room-editor-controls { min-width:0; max-height:64dvh; overflow-y:auto; padding-right:6px; }
.room-object-picker { padding:0; margin:16px 0; border:0; }
.room-object-picker legend { font-size:var(--text-base); font-weight:600; margin-bottom:8px; }
.room-object-picker > div { display:grid; grid-template-columns:repeat(4,1fr); gap:4px; }
.room-object-picker label { position:relative; cursor:pointer; }
.room-object-picker input { position:absolute; opacity:0; width:1px; height:1px; }
.room-object-picker span { display:flex; flex-direction:column; align-items:center; justify-content:end; height:104px; border:1px solid var(--line); background:var(--paper); border-radius:6px; padding:4px 0; }
.room-object-picker img { width:auto; height:auto; max-width:80px; max-height:80px; image-rendering:pixelated; }
.room-object-picker i { font-size:1.6rem; margin:auto; }
.room-object-picker small { font-size:var(--text-small); line-height:1.2; text-align:center; }
.room-object-picker input:checked + span { border-color:var(--green); box-shadow:inset 0 0 0 1px var(--green); background:var(--sage); }
.room-object-picker input:focus-visible + span { outline:2px solid var(--green); outline-offset:2px; }
.room-decor-dialog footer { border-top:1px solid var(--line); padding-top:16px; }
@media(max-width:900px) {
 .room-editor-layout { grid-template-columns:1fr; gap:12px; }
 .room-editor-canvas { position:static; }
 [data-room-editor-preview] { max-height:38dvh; }
 .room-editor-controls { max-height:none; }
}
.room-decor-dialog .room-nameplate { margin:16px auto 8px; font-size:var(--text-base); }
.room-decor-dialog .room-close { border:0; background:transparent; color:var(--ink); }
.room-decor-dialog > form { display:flex; flex-direction:column; max-height:calc(100dvh - 84px); }
.room-decor-dialog > form > header, .room-decor-dialog > form > footer { flex-shrink:0; }
.room-editor-layout { min-height:0; overflow:auto; }
.room-editor-controls { max-height:none; }
.room-editor-canvas [data-room-editor-preview] { max-height:calc(100dvh - 270px); }
@media(max-width:900px) {
 .room-editor-layout { display:block; }
 .room-editor-controls { overflow:visible; }
 .room-editor-canvas [data-room-editor-preview] { max-height:32dvh; }
}

.room-book-slot { display:grid; place-items:center; flex:0 0 40px; width:40px; height:128px; color:var(--muted); border:1px dashed #c69d6060; text-decoration:none; font-size:var(--text-card); }
.room-book-slot:hover,.room-book-slot:focus-visible { background:#f6dc9e24; border-color:#f6dc9e; color:var(--green); }
.room-book-slot--empty { border-color:transparent; }
.room-management-panel .room-add-cabinet { display:block; margin:0; }
.room-decoration-positions { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:16px 0; }
.room-decoration-positions label { margin:0; font-size:var(--text-small); }
.room-decoration-positions select { margin-top:6px; font-size:var(--text-base); }
.room-decoration-gallery { margin:12px 0; }
.room-decoration-gallery summary { cursor:pointer; color:var(--green); padding:8px 0; }
.room-decoration-gallery > div { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.room-decoration-gallery figure { margin:0; padding:6px; text-align:center; border:1px solid var(--line); border-radius:8px; }
.room-decoration-gallery img { display:block; margin:auto; }
.room-decoration-gallery figcaption { font-size:var(--text-small); }
.room-decoration-gallery figcaption a { display:block; text-decoration:underline; }
@media(max-width:560px) { .room-decoration-gallery > div { grid-template-columns:repeat(2,minmax(0,1fr)); } }

.room-navigation { position:relative; }
.room-arrow { position:absolute; top:50%; translate:0 -50%; z-index:5; display:grid; place-items:center; width:44px; height:48px; border:0; border-radius:6px; background:var(--paper); }
.room-arrow img { width:32px; height:32px; image-rendering:pixelated; }
.room-arrow--previous { left:max(0px,calc(50% - 392px)); }
.room-arrow--next { right:max(0px,calc(50% - 392px)); }
.room-arrow:hover { background:var(--peach); }
.room-arrow:focus-visible { outline:2px solid var(--green); outline-offset:2px; }
@media(max-width:1100px) {
 .room-navigation--multiple { padding-inline:48px; }
 .room-arrow--previous { left:0; }
 .room-arrow--next { right:0; }
}

.room-book--no-bands .room-book-art { display:none; }
.room-book-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; image-rendering:auto; pointer-events:none; }

.room-decor-dialog > form > header { margin-bottom:24px; }
.room-gallery-dialog { width:min(640px,calc(100% - 24px)); max-height:calc(100dvh - 32px); overflow:auto; padding:24px; border:1px solid var(--line); border-radius:16px; background:var(--surface); color:var(--ink); }
.room-gallery-dialog::backdrop { background:#2c123760; }
.room-gallery-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:18px; }
.room-gallery-grid figure { margin:0; padding:10px 6px; text-align:center; border:1px solid var(--line); border-radius:8px; }
.room-gallery-grid figure[hidden] { display:none; }
.room-gallery-grid img { display:block; margin:0 auto 8px; width:80px; height:80px; }
.room-gallery-grid figcaption { font-size:var(--text-small); }
.room-gallery-grid a { display:block; text-decoration:underline; }
.room-gallery-dialog nav { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:20px; }
@media(max-width:480px) { .room-gallery-dialog { padding:16px; } .room-gallery-grid { gap:6px; } .room-gallery-grid img { width:64px; height:64px; } }

.room-scroll-hint { display:none; }
@media (max-width: 700px) { .room-scroll-hint { display:flex; align-items:center; justify-content:center; gap:8px; margin:16px 0 8px; font-size:var(--text-small); color:var(--muted); } }

.room-pagination { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:16px; margin:16px auto 28px; padding-top:14px; max-width:672px; border-top:1px solid var(--line); }
.room-counter { grid-column:1; margin:0; color:var(--muted); font-size:var(--text-small); font-weight:600; white-space:nowrap; }
.room-jump { grid-column:2; display:flex; align-items:center; gap:8px; min-width:0; margin:0; }
.room-jump select { flex:1; width:100%; min-width:0; min-height:44px; margin:0; font-size:var(--text-small); text-overflow:ellipsis; }
.room-actions-menu { grid-column:3; justify-self:end; }
.room-pagination .room-actions-menu > summary { display:grid; place-items:center; width:44px; height:44px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--green); cursor:pointer; }
.room-actions-menu > summary:hover { background:var(--sage); }
.room-actions-menu > summary:focus-visible { outline:2px solid var(--green); outline-offset:3px; }
.room-pagination .room-management-panel { top:auto; bottom:calc(100% + 8px); width:min(300px,calc(100vw - 24px)); max-width:calc(100vw - 24px); }
.room-management-panel .room-add-cabinet button { display:flex; align-items:center; gap:10px; width:100%; min-height:44px; margin:0; padding:10px; border:0; border-radius:6px; background:transparent; color:var(--ink); font:inherit; font-size:var(--text-small); text-align:left; white-space:normal; box-shadow:none; }
.room-management-panel .room-add-cabinet button:hover { background:var(--surface-soft); }
.room-pagination .room-management-panel > button { font-size:var(--text-small); white-space:normal; }
.room-management-panel .room-remove-action { border-top:1px solid var(--line); border-radius:0; color:var(--error); }
.room-management-panel small { display:block; padding:4px 10px 8px; color:var(--muted); font-size:var(--text-small); line-height:1.5; }
.room-removal-dialog { width:min(520px,calc(100% - 32px)); max-height:calc(100dvh - 40px); overflow:auto; margin:auto; padding:24px; border:1px solid var(--line); border-radius:16px; background:var(--surface); color:var(--ink); }
.room-removal-dialog::backdrop { background:#2c123740; }
.room-removal-dialog h2 { margin-top:0; }
.room-removal-dialog footer { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:12px; margin-top:24px; }
@media (max-width:480px) {
 .room-pagination { grid-template-columns:minmax(0,1fr) 44px; gap:8px 12px; }
 .room-actions-menu { grid-column:2; grid-row:1; }
 .room-jump { grid-column:1/-1; grid-row:2; }
}
.room-removal-dialog [type=submit] { background:var(--error); border-color:var(--error); color:#fff; }
