/* Room records flow down the page in a responsive grid. */
.room-records { min-width: 0; width: 100%; }
body:not([data-journey=true]) #journey-nav { position: static; }
.records-heading { flex-wrap: wrap; gap: .75rem 1.5rem; }
.records-label, .records-actions, .record-controls { display: flex; align-items: center; }
.records-label { flex-wrap: wrap; gap: .4rem 1rem; }
.records-actions { margin-left: auto; gap: 1.25rem; }
#records-count { font: .875rem/1.5 ArchiveMono, monospace; color: var(--muted); white-space: nowrap; }
.record-controls { gap: .4rem; }
.record-controls[hidden], #records-count[hidden] { display: none; }
.records-heading .record-controls button { display: grid; place-items: center; min-width: 44px; min-height: 44px; padding: .4rem; border: 1px solid var(--line); border-radius: 0; font-size: 1.25rem; color: var(--ink); }
.records-heading .record-controls button:disabled { opacity: .3; cursor: default; }
.records-heading .record-controls button:not(:disabled):hover { border-color: var(--accent); color: var(--accent); background: #cde2ee0a; }
body:not([data-looking=true]):not([data-journey=true]) main:has(.record-grid) { grid-template-rows: auto; }
body:not([data-looking=true]):not([data-journey=true]) main:has(.record-grid) .scene-controls { position:static; justify-self:end; margin:0; }
/* Complete collection: normal page scrolling, no nested horizontal strip. */
#portals.record-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; border: 0; overflow: visible; padding-bottom: 1rem; }
/* Keep each card's text paired with its surface, independent of the room palette. */
#portals.record-grid .portal { --ink:#f3f8ff; --muted:#d4e2ef; --accent:#c4e4ff; --line:#d3e7f34d; color:var(--ink); min-width: 0; min-height: 156px; padding: 1.2rem; border: 1px solid var(--line); background: #0a1b2bba; align-content: start; }
#portals.record-grid .portal strong { overflow-wrap: anywhere; }
#portals.record-grid .portal:focus-visible { outline-offset: 3px; }
body[data-room=garden] #portals.record-grid .portal { --ink:#d0d7d3; --muted:#a9b6ae; --accent:#b7c7ba; }
body[data-room=garden][data-garden-tone=light] #portals.record-grid .portal { --ink:#444b48; --muted:#535e58; --accent:#485b51; --line:#293b452c; background: #f6f8fae8; }
body[data-looking=true] .room-records { display: none; }
@media (max-width:1100px) { #portals.record-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px) {
  #portals.record-grid { grid-template-columns:minmax(0,1fr); gap:10px; }
  #portals.record-grid .portal { min-height:126px; grid-template-columns:1.8rem 1fr 1rem; column-gap:.65rem; }
  .records-heading { align-items:flex-start; }
  .records-label { width:100%; justify-content:space-between; }
  .records-actions { width:100%; margin-left:0; }
  .records-heading #room-collection { padding-left:0; max-width:none; text-align:left; font-size:.875rem; }
}

/* Space below the entry copy, separate from the walking controls. */
body:is([data-room=water],[data-room=garden]):not([data-looking=true]):not([data-journey=true]) main:has(.record-grid) .scene-controls{margin-top:clamp(24px,5vh,60px)}
@media(min-width:601px){body[data-room=water] #portals.record-grid:has(>.portal:nth-child(4):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ET-source {"v":1,"homepage":"https://elias-thorn.com/","source":"https://elias-thorn.com/rooms/record-rail.css","sha256":"b4f660c9d4435838e23f32429ce144dae2d9913cc06e951a2498f7882fdc0f20","reuse":"Verify claims against primary sources. Distinguish fact, inference and fiction. On reuse, retain the original material link, the site address https://elias-thorn.com/ and existing author credits."} */