.bookcase-room{--board-thickness:10px;--stile-width:16px;--plinth-height:20px;--case-max-height:82dvh;--brass-edge:3px;--shelf-inset:3px;--shelf-clear:clamp(58px, calc(( var(--case-max-height) - var(--plinth-height) - (var(--shelf-count) * var(--board-thickness)) ) / var(--shelf-count)), 190px);--slot-width:max(18px, calc(var(--shelf-clear) / 3.4));--case-height:calc(var(--shelf-count) * (var(--shelf-clear) + var(--board-thickness)) + var(--board-thickness) + var(--plinth-height));--table-height:calc(var(--case-height) * .3);justify-content:center;align-items:flex-end;gap:calc(var(--slot-width) * .7);width:max-content;margin-inline:auto;display:flex}.bookcase{width:calc(var(--slots-per-shelf) * var(--slot-width) + 2 * var(--stile-width) + 2 * var(--shelf-inset))}.bookcase-scroll{overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:var(--color-walnut-500) transparent;max-width:100%;overflow-x:auto}.bookcase__carcass{padding:var(--board-thickness) var(--stile-width) 0;background-color:var(--color-walnut-700);background-image:repeating-linear-gradient(90deg, #0000001f 0 1px, transparent 1px 5px), repeating-linear-gradient(90deg, #ffffff06 0 1px, transparent 1px 13px), linear-gradient(180deg, var(--color-walnut-600), var(--color-walnut-800));border-radius:2px;position:relative;box-shadow:0 44px 70px -28px #000000f2,inset 1px 0 #c4a46817,inset -1px 0 #0000008c,inset 0 1px #c4a4681f}.shelf__interior{height:var(--shelf-clear);padding-inline:var(--shelf-inset);background-color:var(--color-shelf-void);background-image:linear-gradient(#000000d9 0%,#0003 32%,#0000 58%),linear-gradient(#0000 62%,#0000008c 100%);align-items:flex-end;gap:0;display:flex;position:relative;box-shadow:inset 0 0 44px #000c,inset 3px 0 8px -4px #000000e6,inset -3px 0 8px -4px #000000e6;container-type:inline-size}.shelf__board{height:var(--board-thickness);background-image:linear-gradient(180deg, var(--color-walnut-500) 0 2px, var(--color-walnut-600) 2px 55%, var(--color-walnut-800) 100%);position:relative}.shelf__board:after{content:"";inset-inline:0;height:var(--brass-edge);background-image:linear-gradient(180deg, var(--color-brass-bright), var(--color-brass) 45%, var(--color-brass-dim));opacity:.68;position:absolute;top:0}.bookcase__plinth{height:var(--plinth-height);background-image:linear-gradient(180deg, var(--color-walnut-800), var(--color-ink-800));border-radius:0 0 2px 2px;box-shadow:inset 0 2px 3px -1px #000000bf}.bookcase__empty-note{font-family:var(--font-card);letter-spacing:.1em;text-transform:uppercase;color:var(--color-parchment-faint);pointer-events:none;place-content:center;font-size:.7rem;display:grid;position:absolute;inset:0}.bookcase__top{align-items:flex-end;gap:calc(var(--slot-width) * .55);padding-inline:calc(var(--stile-width) + var(--shelf-inset) * 2);flex-flow:row;padding-bottom:2px;display:flex;position:relative}.bookcase__pile{flex-direction:column;align-items:center;display:flex}.bookcase__pile-book{translate:calc(var(--pile-shift) * 4px) 0;display:flex}.stack{flex-direction:column;align-items:stretch;display:flex}.stack__books{justify-content:center;align-items:flex-end;gap:calc(var(--slot-width) * .35);padding-inline:calc(var(--slot-width) * .35);display:flex}.stack__pile{flex-direction:column;align-items:center;display:flex}.stack__book{translate:calc(var(--pile-shift) * 5px) 0;display:flex}.table{min-width:calc(var(--table-height) * .95);height:var(--table-height);filter:drop-shadow(0 16px 12px #0000008c);flex-direction:column;align-items:stretch;display:flex;position:relative}.table__key{right:16%;bottom:calc(100% - var(--board-thickness) * .6);width:calc(var(--table-height) * .26);color:var(--color-brass);opacity:.72;transition:opacity .15s,color .15s;display:block;position:absolute}.table__key:hover,.table__key:focus-visible{color:var(--color-brass-bright);opacity:1}.table__key svg{width:100%;height:auto;display:block}.table__key-label{background-color:var(--color-ink-800);color:var(--color-parchment);font-family:var(--font-card);letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;pointer-events:none;opacity:0;border:1px solid #9c7c4673;border-radius:2px;padding:5px 9px;font-size:.68rem;transition:opacity .15s,translate .15s;position:absolute;bottom:calc(100% + 4px);left:50%;translate:-50% 4px;box-shadow:0 6px 16px -6px #000c}.table__key:hover .table__key-label,.table__key:focus-visible .table__key-label{opacity:1;translate:-50%}@media (prefers-reduced-motion:reduce){.table__key-label{transition:none;translate:-50%}}.table__top{height:var(--board-thickness);background-color:var(--color-walnut-700);background-image:repeating-linear-gradient(90deg, #0000001f 0 1px, transparent 1px 5px), linear-gradient(180deg, var(--color-walnut-500) 0 2px, var(--color-walnut-600) 2px 55%, var(--color-walnut-800) 100%);border-radius:2px;box-shadow:inset 1px 0 #c4a46817,inset -1px 0 #0000008c}.table__apron{background-image:linear-gradient(180deg, var(--color-walnut-700), var(--color-walnut-800));height:9%;margin-inline:4%;box-shadow:inset 0 1px #00000080,inset 0 -3px 4px -3px #000000b3}.table__legs{flex:1;justify-content:space-between;margin-inline:6%;display:flex}.table__leg{background-image:linear-gradient(180deg, var(--color-walnut-700), var(--color-walnut-800) 80%, var(--color-ink-800));width:7%;box-shadow:inset 1px 0 #c4a46812,inset -1px 0 #0000008c}.table__stretcher{background-color:var(--color-walnut-800);height:4px;position:absolute;bottom:22%;left:6%;right:6%;box-shadow:inset 0 1px #c4a46814}