/* house.css — the house and its four rooms (house.js).
   hs-  the house page and its cutaway
   rm-  chrome shared by every room: switcher, head, sections, empty states, next door
   tm-  the terminal · mn- the mining room · lb- the lab · st- the studio */

/* ======================================================================
   drawings
   ====================================================================== */

.rm-svg { width: 100%; height: auto; overflow: visible; }
.rm-svg[data-crop] { overflow: hidden; }
@media (max-width: 560px) { .rm-art .rm-hand-l { font-size: 21px; } }
.rm-hand, .hs-hand { font-family: var(--hand); }
.rm-screen-text { font-family: var(--sans); font-weight: 500; font-variant-numeric: tabular-nums; }
.rm-screen-alt { display: none; }
/* a phone prints the drawing's watchlist at 7px: show the screen as lines there (the list is on the page) */
@media (max-width: 560px) { .rm-art .rm-screen-text { display: none; } .rm-art .rm-screen-alt { display: inline; } }
.rm-fan.on { animation: rm-spin 1.6s linear infinite; }
@keyframes rm-spin { to { transform: rotate(360deg); } }

/* ======================================================================
   the house page
   ====================================================================== */

.hs-head { padding-top: clamp(40px, 6vw, 80px); }
.hs-head-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 5vw, 80px); align-items: end; }
.hs-head-title .page-title { margin-top: 14px; }
.hs-head-row .lede { justify-self: end; margin: 0 0 8px; max-width: 38ch; }
.hs-where { display: flex; align-items: baseline; gap: 10px; margin: 28px 0 0; padding-top: 16px; border-top: 1px solid var(--rule); font: 400 15px/1.5 var(--sans); color: var(--ink-2); }
.hs-where-dot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--graphite); transform: translateY(-1px); }
.hs-where-dot.is-fresh { background: var(--ink); }
.hs-where-dot.is-stale, .hs-where-dot.is-unavailable { background: #fff; box-shadow: inset 0 0 0 1.5px var(--ink); }
.hs-head .rc-tag { margin-top: 14px; }

.hs-stage { margin-top: clamp(20px, 3vw, 36px); }
.hs-figure { margin: 0; }
.hs-scroll-in { position: relative; }
.hs-snap { position: absolute; top: 0; width: 1px; height: 1px; pointer-events: none; }
.hs-drag { display: none; }
.hs-svg { width: 100%; height: auto; display: block; overflow: visible; }

/* the house keeps one line weight at every size: walls 2px, furniture 1.1 to 1.6px, Phil 2px */
.hs-svg :is(path, rect, circle, ellipse, line, polyline), .rm-svg.is-px :is(path, rect, circle, ellipse, line, polyline) { vector-effect: non-scaling-stroke; }
.hs-svg .h-sign { font: 400 13px var(--hand); }
.hs-svg .hs-hand { font-family: var(--hand); font-size: 15px; fill: var(--ink-2); }
.hs-svg .hs-tiny { font-size: 11px; }
.hs-svg .hs-note { font-size: 10.5px; }
.hs-svg .hs-small { font-size: 13.5px; }
.hs-svg .hs-sign { font-size: 12.5px; }
.hs-svg .hs-quiet { fill: var(--graphite); }
.hs-svg .h-smoke { animation: smoke 5s ease-in-out infinite; transform-origin: 404px 30px; }

.hs-room { cursor: pointer; }
.hs-room:focus { outline: none; }
.hs-hit { fill: #fff; fill-opacity: 0; stroke: none; transition: fill-opacity .25s var(--ease); }
.hs-room:hover .hs-hit, .hs-room:focus-visible .hs-hit { fill: var(--wash); fill-opacity: 1; }
.hs-room:focus-visible .hs-hit { stroke: var(--focus); stroke-width: 3; }
.hs-hit.hs-veil { fill: #fff; fill-opacity: .55; }
.hs-room:hover .hs-hit.hs-veil, .hs-room:focus-visible .hs-hit.hs-veil { fill: #fff; fill-opacity: .1; }
.hs-lead { fill: none; stroke: var(--faint); stroke-width: 1.2; transition: stroke .2s; }
.hs-room:hover .hs-lead, .hs-room:focus-visible .hs-lead { stroke: var(--ink); }
.hs-name { font: 400 20px var(--hand); fill: var(--ink); }
.hs-no { font: 600 10px var(--sans); fill: var(--graphite); letter-spacing: .06em; }
.hs-status { font: 500 12px var(--sans); fill: var(--muted); font-variant-numeric: tabular-nums; }
.hs-room:hover .hs-status { fill: var(--ink-2); }
.hs-svg .hs-name.hs-out { font-size: 17px; }
.hs-svg .hs-status.hs-out { font-size: 11.5px; }
.hs-svg .hs-name.hs-red { fill: var(--red); font-size: 20px; }
.hs-marker circle { fill: #fff; stroke: var(--ink); stroke-width: 1.4; }
.hs-marker text { font: 600 10.5px var(--sans); fill: var(--ink); }
.hs-room:hover .hs-marker circle, .hs-room:focus-visible .hs-marker circle { fill: var(--ink); }
.hs-room:hover .hs-marker text, .hs-room:focus-visible .hs-marker text { fill: #fff; }
.hs-tag { display: none; font: 400 17px var(--hand); fill: var(--ink); }

/* between a tablet and a laptop the callouts keep their names; on a phone the names sit by the markers */
.hs-svg.is-mid .hs-callout .hs-status { display: none; }
.hs-svg.is-mid .hs-name:not(.hs-out) { font-size: 23px; }
.hs-svg.is-narrow { overflow: hidden; }
.hs-svg.is-narrow .hs-callout { display: none; }
.hs-svg.is-narrow .hs-tag { display: inline; }
@media (max-width: 760px) {
  .hs-scroll { overflow-x: auto; overflow-y: hidden; margin: 0 calc(var(--gutter) * -1); padding: 0 var(--gutter) 4px; scroll-snap-type: x proximity; scroll-padding: 0 var(--gutter); overscroll-behavior-x: contain; scrollbar-width: none; }
  .hs-scroll::-webkit-scrollbar { display: none; }
  .hs-scroll-in { width: 740px; }
  .hs-snap.is-a { left: 0; scroll-snap-align: start; }
  .hs-snap.is-b { left: 50%; scroll-snap-align: center; }
  .hs-snap.is-c { right: 0; scroll-snap-align: end; }
  .hs-drag { display: flex; align-items: center; gap: 10px; margin: 6px 0 0; }
  .hs-drag .note-hand { font-size: 19px; color: var(--ink-2); }
  .hs-drag svg { width: 34px; height: 12px; }
}

/* the key: what Phil does in each room */
.hs-key { margin-top: clamp(40px, 5vw, 72px); }
.hs-key-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding-bottom: 14px; border-bottom: 1px solid var(--rule); }
.hs-key-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.hs-key-row { display: grid; grid-template-rows: auto 1fr auto; gap: 16px; padding: 22px 20px 20px; border-right: 1px solid var(--rule); transition: background-color .2s; }
.hs-key-row:first-child { padding-left: 0; }
.hs-key-row:last-child { border-right: 0; padding-right: 0; }
.hs-key-row:hover { background: linear-gradient(var(--wash), var(--wash)) padding-box; }
.hs-key-art { display: block; height: 150px; }
.hs-key-art svg { width: 100%; height: 100%; }
.hs-key-text { display: grid; gap: 6px; align-content: start; }
.hs-key-no { font: 600 11.5px/1 var(--sans); letter-spacing: .12em; color: var(--graphite); }
.hs-key-text b { font: 500 21px/1.15 var(--sans); letter-spacing: -.02em; }
.hs-key-what { font: 400 16.5px/1.42 var(--serif); color: var(--ink-2); }
.hs-key-status { display: flex; align-items: baseline; gap: 8px; margin-top: 6px; font: 500 12.5px/1.4 var(--sans); color: var(--muted); font-variant-numeric: tabular-nums; }
.hs-key-status i { flex: none; width: 6px; height: 6px; border-radius: 50%; background: var(--graphite); transform: translateY(-1px); }
.hs-key-go { font: 500 13px/1 var(--sans); color: var(--ink-2); }
.hs-key-row:hover .hs-key-go { color: var(--ink); text-decoration: underline; text-underline-offset: 4px; }

/* ======================================================================
   room chrome
   ====================================================================== */

.rm-top { padding-top: 18px; }
.rm-switch { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; }
.rm-switch a { display: inline-flex; align-items: baseline; gap: 7px; padding: 8px 12px; border-radius: 999px; font: 500 13.5px/1 var(--sans); color: var(--ink-2); transition: background-color .2s, color .2s; }
.rm-switch a b { font: 600 10.5px/1 var(--sans); letter-spacing: .08em; color: var(--graphite); }
.rm-switch a:hover { background: var(--wash); color: var(--ink); }
.rm-switch a[aria-current='page'] { background: var(--ink); color: #fff; }
.rm-switch a[aria-current='page'] b { color: #c9c9c2; }
.rm-switch .rm-home { margin-left: auto; color: var(--muted); }
.rm-switch .rm-home::before { content: '←'; margin-right: 2px; }

.rm-head { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(24px, 4vw, 72px); align-items: end; padding-top: clamp(28px, 4.5vw, 64px); padding-bottom: clamp(20px, 3vw, 36px); }
.rm-head .page-title { margin-top: 14px; }
.rm-head .lede { max-width: 30ch; }
.rm-art { margin: 0; }
.rm-art svg { width: 100%; height: auto; overflow: visible; }
.rm-status { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; margin: 22px 0 0; font: 500 13px/1.5 var(--sans); color: var(--muted); font-variant-numeric: tabular-nums; }
.rm-dot { flex: none; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--graphite); transform: translateY(-1px); }
.rm-dot.is-live { background: var(--ink); }
.rm-dot.is-warn { background: var(--red); }
.rm-head .rc-tag { margin-top: 18px; }

/* sections */
.rm-sec { margin-top: clamp(64px, 8vw, 112px); }
.rm-sec-head { display: flex; align-items: end; justify-content: space-between; gap: 24px; padding-top: 22px; border-top: 1px solid var(--rule); margin-bottom: clamp(22px, 3vw, 36px); }
.rm-sec-title .section-title { margin-top: 10px; max-width: 22ch; }
.rm-sec-lede { margin: 12px 0 0; font: 400 18px/1.48 var(--serif); color: var(--ink-2); max-width: 54ch; }
.rm-sec-aside { flex: none; display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.rm-note { font: 400 14.5px/1.55 var(--sans); color: var(--muted); max-width: 70ch; }
.rm-note strong { color: var(--ink-2); font-weight: 600; }

/* segmented choices (windows, rules, tools) */
.rm-seg { display: inline-flex; flex-wrap: wrap; gap: 2px; padding: 3px; border-radius: 999px; background: var(--wash); }
.rm-seg button { height: 30px; padding: 0 12px; border-radius: 999px; font: 500 13px/1 var(--sans); color: var(--ink-2); font-variant-numeric: tabular-nums; transition: background-color .15s, color .15s, box-shadow .15s; }
.rm-seg button:hover { color: var(--ink); }
.rm-seg button[aria-pressed='true'] { background: #fff; color: var(--ink); box-shadow: 0 0 0 1px var(--rule), 0 1px 2px #1b1c1814; }

/* figures in a row of hairline cells */
.rm-figures { display: grid; grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr)); border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.rm-figures > div { padding: 16px 18px 16px 0; display: grid; gap: 8px; align-content: start; }
.rm-figures > div + div { padding-left: 18px; border-left: 1px solid var(--rule); }
.rm-figures span { font: 500 11px/1.2 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.rm-figures b { font: 500 clamp(22px, 2.4vw, 30px)/1.05 var(--sans); letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.rm-figures b em { font-style: normal; font-size: .55em; color: var(--muted); letter-spacing: 0; margin-left: 3px; }
.rm-figures small { font-size: 12px; color: var(--muted); line-height: 1.4; }

/* empty states */
.rm-empty { display: grid; grid-template-columns: 96px minmax(0, 1fr); column-gap: 24px; align-items: center; justify-items: start; text-align: left; padding: 12px 0; max-width: 680px; }
.rm-empty-art { grid-row: 1 / span 3; align-self: center; }
.rm-empty-art svg { width: 96px; height: auto; display: block; }
.rm-empty .note-hand { font-size: 22px; line-height: 1.15; margin: 0 0 4px; color: var(--ink); }
.rm-empty-text { margin: 0 0 10px; color: var(--muted); font: 400 17px/1.45 var(--serif); max-width: 52ch; }
.rm-empty .link { font-size: 14px; }
.rm-empty.is-compact { grid-template-columns: 64px minmax(0, 1fr); column-gap: 16px; padding: 18px 0 12px; }
.rm-empty.is-compact .rm-empty-art svg { width: 64px; }
.rm-empty.is-compact .rm-empty-text { font-size: 15.5px; }
@media (max-width: 420px) {
  .rm-empty, .rm-empty.is-compact { grid-template-columns: minmax(0, 1fr); }
  .rm-empty-art { grid-row: auto; margin-bottom: 8px; }
  .rm-empty-art svg, .rm-empty.is-compact .rm-empty-art svg { width: 72px; }
}

/* the next door */
.rm-next { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: clamp(72px, 9vw, 120px); }
.rm-next-card { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 20px; align-items: center; padding: 18px 22px; border-radius: var(--radius); box-shadow: inset 0 0 0 1px var(--rule); transition: box-shadow .2s, transform .2s var(--ease); }
.rm-next-card:hover { box-shadow: inset 0 0 0 1px var(--ink); transform: translateY(-2px); }
.rm-next-card > span:last-child { display: grid; gap: 8px; }
.rm-next-card b { font: 500 22px/1.15 var(--sans); letter-spacing: -.02em; }
.rm-next-art svg { width: 100%; height: auto; }
.rm-svg.is-thumb { overflow: hidden; display: block; }
.rm-next-card.is-house .rm-next-art svg { width: 100%; max-height: 180px; }

/* ======================================================================
   responsive
   ====================================================================== */

@media (max-width: 1100px) {
  .hs-key-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 8px; }
  .hs-key-row { border-right: 0; padding: 22px 16px 20px 0; }
  .hs-key-row:last-child { padding-right: 16px; }
}
@media (max-width: 860px) {
  .rm-head { padding-bottom: 8px; }
  .rm-head + .wrap, .rm-head + section, .rm-head + .rm-sec { margin-top: 24px; }
  .hs-head-row { grid-template-columns: 1fr; gap: 0; }
  .hs-head-row .lede { justify-self: start; margin-top: 16px; }
  .rm-head { grid-template-columns: 1fr; gap: 26px; }
  .rm-head .lede { max-width: 36ch; }
  .rm-art { max-width: 560px; }
  .rm-sec-head { flex-direction: column; align-items: stretch; gap: 16px; }
  .rm-sec-aside { justify-content: flex-start; }
  .rm-next { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .hs-key-grid { grid-template-columns: 1fr; }
  .hs-key-row { grid-template-columns: 112px minmax(0, 1fr); grid-template-rows: auto; gap: 16px; padding: 18px 0; border-bottom: 1px solid var(--rule); align-items: start; }
  .hs-key-art { height: auto; aspect-ratio: 520 / 340; }
  .hs-key-row:last-child { border-bottom: 0; padding-right: 0; }
  .hs-key-go { display: none; }
  .hs-key-text b { font-size: 19px; }
  .hs-key-what { font-size: 15.5px; }
  .rm-switch { gap: 2px; margin: 0 -6px; }
  .rm-switch a { padding: 8px 9px; font-size: 13px; }
  .rm-switch .rm-home { margin-left: 0; }
  .rm-figures { grid-template-columns: repeat(2, minmax(0, 1fr)); border-bottom: 0; }
  .rm-figures > div { border-bottom: 1px solid var(--rule); padding: 14px 12px 14px 0; }
  .rm-figures > div + div { padding-left: 0; border-left: 0; }
  .rm-figures > div:nth-child(2n) { padding-left: 14px; border-left: 1px solid var(--rule); }
  .rm-next-card { grid-template-columns: 110px minmax(0, 1fr); padding: 14px 16px; gap: 14px; }
  .rm-next-card b { font-size: 19px; }
}
@media (max-width: 360px) {
  .hs-key-row { grid-template-columns: 88px minmax(0, 1fr); gap: 12px; }
  .rm-switch a b { display: none; }
}

/* ======================================================================
   room 01 · the terminal
   ====================================================================== */

.tm-desk { display: grid; grid-template-columns: 268px minmax(0, 1fr) 312px; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--rule); margin-top: 6px; }
.tm-pane-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 24px; }
.tm-n { font: 500 12px/1 var(--sans); color: var(--graphite); }

/* the watchlist */
.tm-list { padding: 18px 18px 22px 0; border-right: 1px solid var(--rule); min-width: 0; }
.tm-tools { display: flex; gap: 6px; margin-top: 14px; }
.tm-tools .input { height: 36px; border-radius: 999px; font-size: 13.5px; padding: 0 14px; min-width: 0; }
.tm-saved { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 12px; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--faint); font: 500 13px/1 var(--sans); color: var(--ink-2); }
.tm-saved svg { width: 15px; height: 15px; }
.tm-saved[aria-pressed="true"] { box-shadow: inset 0 0 0 1px var(--ink); color: var(--ink); }
.tm-rows { list-style: none; margin: 12px 0 0; padding: 0; }
.tm-rows > li { display: flex; align-items: center; border-bottom: 1px solid var(--rule); }
.tm-rows > li[hidden] { display: none; }
.tm-row { flex: 1; min-width: 0; display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 11px 8px 11px 6px; margin: 3px 0; text-align: left; border-radius: 9px; transition: background-color .15s; }
.tm-row:hover { background: var(--wash); }
.tm-row[aria-pressed="true"] { background: var(--ink); color: #fff; }
.tm-row[aria-pressed="true"] .tm-i, .tm-row[aria-pressed="true"] small { color: #c9c9c2; }
.tm-i { font: 500 11px/1 var(--sans); color: var(--graphite); }
.tm-id { min-width: 0; }
.tm-id b { display: block; font: 600 14px/1.2 var(--sans); letter-spacing: -.01em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tm-id small { display: block; margin-top: 2px; font: italic 400 14px/1.2 var(--serif); color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tm-v { text-align: right; display: grid; gap: 3px; }
.tm-v b { font: 500 14px/1.1 var(--sans); }
.tm-v small { font: 500 11.5px/1.1 var(--sans); color: var(--muted); }
.tm-v .tm-stale { font: 600 10px/1.1 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--red); }
.tm-row[aria-pressed="true"] .tm-stale { color: #f0a193; }
.tm-pin { flex: none; width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; margin-left: 2px; }
.tm-pin svg { width: 16px; height: 16px; }
.tm-pin:hover { background: var(--wash); }
.tm-pin.is-big { width: 36px; height: 36px; margin-left: 4px; }
.tm-pin.is-big svg { width: 19px; height: 19px; }
.tm-none p { margin: 14px 4px; font: 400 15px/1.4 var(--serif); color: var(--muted); }
.tm-list-note { margin: 16px 0 0; font: 400 12.5px/1.5 var(--sans); color: var(--muted); }

/* the screen */
.tm-screen { padding: 20px 28px 24px; min-width: 0; }
.tm-sc-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; }
.tm-coin { min-width: 0; }
.tm-ticker { display: flex; align-items: center; margin-top: 12px; font: 500 clamp(28px, 2.8vw, 38px)/1 var(--sans); letter-spacing: -.035em; overflow-wrap: anywhere; }
.tm-name { margin: 6px 0 0; font: italic 400 19px/1.3 var(--serif); color: var(--ink-2); }
.tm-capbox { text-align: right; }
.tm-cap { font: 500 clamp(44px, 5.4vw, 72px)/.88 var(--sans); letter-spacing: -.055em; }
.tm-cap-label { margin-top: 10px; font: 500 12px/1.3 var(--sans); color: var(--muted); }
.tm-warn { margin: 18px 0 0; padding: 10px 14px; border-radius: 10px; background: #bf3b280d; box-shadow: inset 0 0 0 1px #bf3b2826; font: 400 13.5px/1.5 var(--sans); color: var(--ink-2); }
.tm-warn b { color: var(--red); font-weight: 600; }
.tm-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 22px 0 0; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.tm-strip div { padding: 12px 14px 12px 0; display: grid; gap: 5px; }
.tm-strip div + div { padding-left: 14px; border-left: 1px solid var(--rule); }
.tm-strip dt { font: 500 10.5px/1.1 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.tm-strip dd { margin: 0; font: 500 18px/1.1 var(--sans); letter-spacing: -.02em; }
.tm-chart-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 14px; margin-top: 20px; }
.tm-count { margin-left: auto; font: 500 12.5px/1 var(--sans); color: var(--muted); }
.tm-chart { position: relative; height: 330px; margin-top: 10px; cursor: crosshair; touch-action: pan-y; }
.tm-chart svg { display: block; overflow: visible; }
.tm-chart svg text { font: 500 11px var(--sans); fill: var(--muted); font-variant-numeric: tabular-nums; }
.tm-grid { fill: none; stroke: var(--rule); stroke-width: 1; }
.tm-cross path { fill: none; stroke: var(--ink); stroke-width: 1; stroke-dasharray: 2 3; }
#tm-cross-dot { fill: #fff; stroke: var(--ink); stroke-width: 1.6; }
#tm-cross-box { fill: var(--ink); }
.tm-chart svg #tm-cross-text { fill: #fff; font-weight: 600; }
.tm-chart-empty { display: grid; place-content: center; justify-items: center; gap: 6px; height: 100%; margin: 0; background: var(--wash); border-radius: 12px; font: 400 15px/1.4 var(--serif); color: var(--muted); text-align: center; padding: 20px; }
.tm-chart-empty .note-hand { font-size: 22px; color: var(--ink-2); }
.tm-scrub { margin-top: 12px; }
.tm-scrub label { display: flex; flex-wrap: wrap; gap: 4px 10px; font: 500 12.5px/1.3 var(--sans); color: var(--ink-2); }
.tm-scrub label span { color: var(--muted); font-weight: 400; }
.tm-scrub input[type="range"] { -webkit-appearance: none; appearance: none; display: block; width: 100%; height: 24px; margin: 8px 0 0; background: transparent; cursor: pointer; }
.tm-scrub input[type="range"]::-webkit-slider-runnable-track { height: 2px; border-radius: 2px; background: var(--faint); }
.tm-scrub input[type="range"]::-moz-range-track { height: 2px; border-radius: 2px; background: var(--faint); }
.tm-scrub input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 14px; height: 14px; margin-top: -6px; border-radius: 50%; background: #fff; border: 1.6px solid var(--ink); }
.tm-scrub input[type="range"]::-moz-range-thumb { width: 14px; height: 14px; border-radius: 50%; background: #fff; border: 1.6px solid var(--ink); box-sizing: border-box; }
.tm-scrub input[type="range"]:hover::-webkit-slider-thumb { background: var(--wash); }
.tm-scrub input[type="range"]:focus { outline: none; }
.tm-scrub input[type="range"]:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; border-radius: 6px; }
.tm-ohlc { margin-top: 8px; }
.tm-ohlc time { font: 500 12.5px/1 var(--sans); color: var(--ink-2); }
.tm-ohlc dl { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin: 10px 0 0; }
.tm-ohlc dt { font: 500 10.5px/1.1 var(--sans); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.tm-ohlc dd { margin: 4px 0 0; font: 500 14px/1.2 var(--sans); }
.tm-mint { display: flex; align-items: center; gap: 12px; margin-top: 22px; padding-top: 16px; border-top: 1px solid var(--rule); }
.tm-mint > span { font: 500 10.5px/1 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.tm-mint code { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.tm-links { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 18px; margin: 12px 0 0; font: 400 13px/1.4 var(--sans); }
.tm-links span { margin-left: auto; color: var(--muted); font-size: 12.5px; }

/* the tape */
.tm-tape { display: flex; flex-direction: column; padding: 18px 0 18px 20px; border-left: 1px solid var(--rule); contain: size; min-width: 0; }
.tp-strands { margin-top: 12px; align-self: flex-start; }
.tp-strands button { height: 28px; font-size: 12.5px; }
.tp-sub { margin: 10px 0 0; font: 400 15px/1.4 var(--serif); color: var(--muted); }
.tp-note .is-red { color: var(--red); }
.tp-row.is-sell b { color: var(--ink); }
.tp-row.is-fill .tp-art svg { width: 20px; height: 38px; }
.tp-counts { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 12px; font: 500 12px/1.2 var(--sans); color: var(--muted); }
.tp-counts:empty { display: none; }
.tp-counts b { font: 600 15px/1 var(--sans); color: var(--ink); margin-right: 3px; }
.tp-counts b.is-red { color: var(--red); }
.tp-body { flex: 1 1 0; min-height: 0; overflow-y: auto; margin-top: 14px; overscroll-behavior: contain; scrollbar-width: thin; }
.tp-loading { margin: 18px 0; font: 400 15px/1.4 var(--serif); color: var(--muted); }
.tp-hist svg { width: 100%; height: 46px; display: block; }
.tp-hist-key { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 6px; font: 500 11px/1.2 var(--sans); color: var(--muted); }
.tp-hist-key span:last-child { margin-left: auto; }
.tp-hist-key i { display: inline-block; width: 7px; height: 7px; margin-right: 5px; }
.tp-hist-key .k-d { background: var(--ink); }
.tp-hist-key .k-b { background: var(--red); }
.tp-rows { list-style: none; margin: 12px 0 0; padding: 0; }
.tp-row { display: grid; grid-template-columns: 58px 22px minmax(0, 1fr); grid-template-areas: "time art what" "time art note"; column-gap: 8px; row-gap: 1px; padding: 8px 6px; border-bottom: 1px solid var(--rule); border-radius: 6px; }
a.tp-row:hover { background: var(--wash); }
.tp-row time { grid-area: time; font: 500 11.5px/1.5 var(--sans); color: var(--muted); }
.tp-art { grid-area: art; display: grid; place-items: center start; }
.tp-art svg { width: 20px; height: 25px; }
.tp-what { grid-area: what; min-width: 0; font: 400 13px/1.35 var(--sans); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tp-what b { font-weight: 600; }
.tp-what .mono { font-size: 12px; color: var(--muted); }
.tp-note { grid-area: note; font: 400 12px/1.35 var(--sans); color: var(--muted); }
.tp-row.is-binned b { color: var(--red); }
.tp-row.is-drawn b { color: var(--muted); }
.tp-row.is-note { background: var(--wash); }
.tp-foot { margin: 12px 0 0; font: 400 12px/1.45 var(--sans); color: var(--muted); }
.tp-new { animation: tp-in .9s var(--ease-out); }
@keyframes tp-in { from { opacity: 0; transform: translateY(-6px); } }
.tm-tape .rm-empty { padding-top: 16px; }
.tp-more { display: none; }

/* the lodgers' board */
.tm-board thead th.tm-b-i, .tm-board td.tm-b-i { width: 34px; color: var(--graphite); font-size: 11.5px; }
.tm-board tbody th b { display: block; font-weight: 600; }
.tm-board tbody th small { display: block; margin-top: 2px; font: italic 400 14px/1.2 var(--serif); color: var(--muted); }
.tm-b-held { white-space: normal !important; min-width: 120px; font-size: 13.5px; }
.rm-dim { color: var(--faint); }
.tm-limits { margin: 16px 0 0; }
.tm-board-status { margin: 0; }
#board .tm-warn { margin-top: 14px; }
@media (max-width: 700px) { .tm-board .c-x { display: none; } }
/* phones: each coin is a two-line card, with the figures the entry tests use */
.tm-cards { display: none; list-style: none; margin: 0; padding: 0; }
@media (max-width: 560px) {
  .tm-board-scroll { display: none; }
  .tm-cards { display: block; border-top: 1px solid var(--rule); }
  .tm-card { padding: 11px 0 12px; border-bottom: 1px solid var(--rule); }
  .tm-card-a { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
  .tm-card-a .tm-b-i { flex: none; width: 20px; color: var(--graphite); font-size: 11.5px; }
  .tm-card-a b { font-weight: 600; font-size: 15px; }
  .tm-card-a small { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: italic 400 14px/1.2 var(--serif); color: var(--muted); }
  .tm-card-cap { margin-left: auto; font: 600 15px/1 var(--sans); white-space: nowrap; }
  .tm-card-b { display: flex; flex-wrap: wrap; gap: 3px 12px; margin: 6px 0 0 28px; font: 500 12.5px/1.3 var(--sans); color: var(--ink-2); }
  .tm-card-held { margin: 5px 0 0 28px; font-size: 12.5px; color: var(--muted); }
}

/* the paper account */
.tm-paper-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 88px); margin-top: 40px; }
.tm-h3 { margin: 0 0 12px; font: 500 11.5px/1.2 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.tm-journal .rm-empty { padding: 8px 0 0; }
.tm-entries { list-style: none; margin: 0; padding: 0; }
.tm-entry { padding: 16px 0; border-top: 1px solid var(--rule); }
.tm-entry-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; font: 500 12.5px/1.2 var(--sans); color: var(--muted); }
.tm-entry-price { margin-top: 10px; font: 500 20px/1.1 var(--sans); letter-spacing: -.02em; }
.tm-entry-price small { font-size: 12px; color: var(--muted); letter-spacing: 0; }
.tm-entry p { margin: 8px 0 0; font: 400 17px/1.5 var(--serif); color: var(--ink-2); }
.tm-rules-prose { font-size: 16.5px; }
.tm-controls { margin-top: 22px; border-top: 1px solid var(--rule); padding-top: 14px; }
.tm-controls summary, .mn-rules summary, .lb-recipe summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 10px; font: 500 14px/1.2 var(--sans); padding: 4px 0; }
.tm-controls summary::-webkit-details-marker, .mn-rules summary::-webkit-details-marker, .lb-recipe summary::-webkit-details-marker { display: none; }
.tm-controls summary::before, .mn-rules summary::before, .lb-recipe summary::before { content: "+"; flex: none; display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; box-shadow: inset 0 0 0 1px var(--faint); font-weight: 500; }
.tm-controls[open] summary::before, .mn-rules[open] summary::before, .lb-recipe[open] summary::before { content: "−"; }
.tm-controls summary:hover::before, .mn-rules summary:hover::before, .lb-recipe summary:hover::before { box-shadow: inset 0 0 0 1px var(--ink); }
.tm-controls form { display: grid; gap: 14px; margin-top: 14px; }
.tm-controls .rm-note { margin: 0; font-size: 13.5px; }
.tm-controls .field textarea { min-height: 96px; }
.tm-controls .btn { justify-self: start; }
.tm-form-status { margin: 0; font: 400 13.5px/1.5 var(--sans); color: var(--muted); }

@media (max-width: 1180px) {
  .tm-desk { grid-template-columns: 250px minmax(0, 1fr); }
  .tm-tape { grid-column: 1 / -1; contain: none; height: 540px; border-left: 0; border-top: 1px solid var(--rule); padding: 18px 0; }
}
@media (max-width: 860px) {
  .tm-desk { grid-template-columns: minmax(0, 1fr); }
  .tm-list { border-right: 0; padding: 16px 0 18px; }
  .tm-list-note { display: none; }
  .tm-row { padding: 9px 6px; }
  .tm-screen { padding: 20px 0 22px; border-top: 1px solid var(--rule); }
  .tm-sc-head { flex-direction: column; align-items: flex-start; gap: 16px; }
  .tm-capbox { text-align: left; }
  .tm-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tm-strip div:nth-child(3) { padding-left: 0; border-left: 0; }
  .tm-strip div:nth-child(n + 3) { border-top: 1px solid var(--rule); }
  .tm-chart { height: 250px; }
  .tm-ohlc dl { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .tm-paper-grid { grid-template-columns: 1fr; }
  /* the tape is part of the page on a phone: ten rows, then a button, never a box that scrolls on its own */
  .tm-tape { height: auto; }
  .tm-tape .tp-body { flex: none; overflow: visible; overscroll-behavior: auto; }
  .tm-tape:not(.is-all) .tp-rows > li:nth-child(n + 11) { display: none; }
  .tp-more { display: inline-flex; align-self: flex-start; margin-top: 12px; }
  .tp-more[hidden] { display: none; }
}
@media (max-width: 420px) {
  .tm-chart { height: 220px; }
  .tm-count { display: none; }
  .tm-links span { margin-left: 0; width: 100%; }
  .tm-mint { flex-wrap: wrap; }
  .tm-mint code { flex-basis: 100%; order: 3; white-space: normal; overflow-wrap: anywhere; }
}

/* ======================================================================
   shared additions: tables, quiet lines, tags in kickers
   ====================================================================== */

.kicker .tag { text-transform: none; letter-spacing: 0; margin-left: 8px; vertical-align: 1px; height: 22px; }
.rm-quiet { margin: 6px 0 0; font: 400 16px/1.5 var(--serif); color: var(--muted); }
.rm-table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: thin; }
.rm-table { width: 100%; border-collapse: collapse; font: 400 14px/1.35 var(--sans); }
.rm-table thead th { font: 500 10.5px/1.2 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); text-align: left; padding: 0 14px 10px 0; border-bottom: 1px solid var(--ink); white-space: nowrap; }
.rm-table tbody th, .rm-table tfoot th { text-align: left; font-weight: 500; padding: 11px 14px 11px 0; border-bottom: 1px solid var(--rule); }
.rm-table td { padding: 11px 14px 11px 0; border-bottom: 1px solid var(--rule); white-space: nowrap; }
.rm-table .r { text-align: right; }
.rm-table th:last-child, .rm-table td:last-child { padding-right: 0; }
.rm-table tfoot th, .rm-table tfoot td { border-top: 1px solid var(--ink); border-bottom: 0; font-weight: 600; }

/* ======================================================================
   room 02 · the mining room
   ====================================================================== */

.mn-board { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); border-top: 1px solid var(--ink); border-bottom: 1px solid var(--rule); margin-top: 6px; }
.mn-board > div { min-width: 0; }
.mn-board > div + div { border-left: 1px solid var(--rule); }
.mn-inst { padding: 22px 36px 28px 0; }
.mn-board > div + div .mn-inst { padding: 22px 0 28px 36px; }
.mn-inst-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 24px; }
.mn-word { margin: 18px 0 0; font: 500 clamp(34px, 3.6vw, 50px)/1 var(--sans); letter-spacing: -.045em; }
.mn-text { margin: 12px 0 0; font: 400 17.5px/1.5 var(--serif); color: var(--ink-2); max-width: 46ch; }
.mn-lamp { flex: none; display: inline-block; width: 11px; height: 11px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px var(--ink); background: #fff; }
.mn-lamp.on { background: var(--ink); animation: pulse 2.4s var(--ease) infinite; }
.mn-lamp.is-small { width: 8px; height: 8px; margin-right: 9px; vertical-align: 1px; }
.mn-read { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 24px 0 0; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.mn-read > div { padding: 14px 12px 14px 0; display: grid; grid-template-rows: minmax(2.5em, auto) auto; gap: 6px; align-content: start; }
.mn-read dt { align-self: start; }
.mn-read dd { align-self: end; }
.mn-more { margin: 16px 0 0; padding: 12px 0; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); font: 400 15.5px/1.45 var(--serif); color: var(--muted); }
.mn-read > div + div { padding-left: 12px; border-left: 1px solid var(--rule); }
.mn-read dt, .mn-facts dt, .mn-sums dt { font: 500 10.5px/1.2 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.mn-read dd { margin: 0; font: 500 24px/1 var(--sans); letter-spacing: -.03em; }
.mn-read dd small, .mn-sums dd small { margin-left: 4px; font-size: 12px; letter-spacing: 0; color: var(--muted); }
.mn-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 24px; margin: 18px 0 0; }
.mn-facts > div { padding: 10px 0; border-bottom: 1px solid var(--rule); display: grid; gap: 4px; min-width: 0; }
.mn-facts dd { margin: 0; font: 400 14px/1.4 var(--sans); color: var(--ink-2); overflow-wrap: anywhere; }
.mn-links { display: flex; flex-wrap: wrap; gap: 6px 20px; margin: 18px 0 0; font-size: 13.5px; }
.mn-feed-grid { display: grid; grid-template-columns: minmax(0, 290px) minmax(0, 1fr); gap: 28px; align-items: center; margin-top: 10px; }
.mn-feed-grid .mn-word { margin-top: 0; }
.mn-dial { width: 100%; height: auto; overflow: visible; }
.mn-dial-n { font: 500 11px var(--sans); fill: var(--muted); font-variant-numeric: tabular-nums; }
.mn-dial .is-faint .mn-dial-n { fill: var(--faint); }
.mn-dial-stale { font: 400 17px var(--hand); fill: var(--red); }
.mn-dial.is-off .mn-dial-stale { fill: var(--faint); }
.mn-dial-hand { font: 400 22px var(--hand); fill: var(--ink-2); }
.mn-dial-age { font: 500 30px var(--sans); fill: var(--ink); letter-spacing: -.03em; }
.mn-dial-cap { font: 500 11px var(--sans); fill: var(--muted); }
.mn-needle { transition: transform .9s var(--ease); }
.mn-inst .tm-warn { margin-top: 18px; }

.mn-shelf { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); }

.mn-work { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr) minmax(0, 220px); gap: clamp(28px, 4.5vw, 64px); align-items: start; }
.mn-form { display: grid; gap: 14px; }
.mn-form .rm-note { margin: 4px 0 0; font-size: 13.5px; }
.mn-sums { margin: 0; display: grid; }
.mn-sums > div { padding: 14px 0; border-top: 1px solid var(--rule); display: grid; gap: 8px; }
.mn-sums dd { margin: 0; font: 500 28px/1 var(--sans); letter-spacing: -.03em; }
.mn-sums .is-big { border-top-color: var(--ink); }
.mn-sums .is-big dd { font-size: clamp(46px, 5vw, 68px); letter-spacing: -.055em; line-height: .9; }
.mn-bad { margin: 0; padding: 12px 14px; border-radius: 10px; background: #bf3b280d; box-shadow: inset 0 0 0 1px #bf3b2826; font: 400 14px/1.5 var(--sans); color: var(--ink-2); }
.mn-meter { width: 100%; height: auto; }
.mn-meter-d { font: 600 17px var(--sans); fill: var(--ink); font-variant-numeric: tabular-nums; }
.mn-meter-cap { font: 500 10.5px var(--sans); fill: var(--muted); letter-spacing: .08em; text-transform: uppercase; }
.mn-disc { animation: rm-spin 7s linear infinite; }

/* ======================================================================
   room 03 · the lab
   ====================================================================== */

.lb-first .rc-tag { margin: -8px 0 24px; }
.lb-hind { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 80px); align-items: start; }
.lb-km-bar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px 16px; margin-bottom: 12px; }
.lb-km-bar .tm-h3 { margin: 0; }
.lb-km { min-height: 250px; }
.lb-km svg { display: block; overflow: visible; }
.lb-km svg text { font: 500 11px var(--sans); fill: var(--muted); font-variant-numeric: tabular-nums; }
.lb-grid { fill: none; stroke: var(--rule); stroke-width: 1; }
.lb-15 { fill: none; stroke: var(--ink); stroke-width: 1.2; stroke-dasharray: 3 4; }
.lb-km svg .lb-hand { font: 400 16px var(--hand); fill: var(--ink-2); }
.lb-km svg .lb-hand.is-quiet { fill: var(--graphite); }
.lb-km svg .lb-risk { font-size: 10.5px; fill: var(--graphite); }
.lb-keys { margin: 0; display: grid; }
.lb-keys > div { padding: 18px 0 20px; border-top: 1px solid var(--rule); display: grid; gap: 8px; }
.lb-keys > div:first-child { border-top-color: var(--ink); }
.lb-keys dt { font: 500 11px/1.2 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.lb-keys dd { margin: 0; font: 500 clamp(44px, 4.6vw, 64px)/.9 var(--sans); letter-spacing: -.055em; }
.lb-keys dd small { font-size: .45em; letter-spacing: 0; color: var(--muted); margin-left: 2px; }
.lb-keys > div > small { font-size: 12.5px; color: var(--muted); line-height: 1.4; }
.lb-cohort { margin-top: clamp(40px, 5vw, 64px); }
.lb-table th small { display: block; margin-top: 2px; font: 400 11.5px/1.2 var(--sans); color: var(--muted); }
.lb-table .is-red { color: var(--red); }
.lb-table tr.is-first th { font-style: italic; font-family: var(--serif); font-size: 15.5px; }
.lb-share { width: 34%; min-width: 150px; }
.lb-share > span.num { display: inline-block; width: 44px; font-weight: 500; }
.lb-bar { display: inline-block; vertical-align: middle; width: calc(100% - 52px); height: 6px; border-radius: 3px; background: var(--rule); overflow: hidden; }
.lb-bar i { display: block; height: 100%; background: var(--ink); border-radius: 3px; }

.lb-bench-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); gap: clamp(28px, 5vw, 80px); align-items: start; }
.lb-bench { display: grid; gap: 26px; }
.lb-step { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 14px; align-items: start; }
.lb-step-n { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; box-shadow: inset 0 0 0 1.4px var(--ink); font: 600 12px/1 var(--sans); }
.lb-step .label { display: block; margin: 5px 0 10px; }
.lb-coins { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.lb-coins button { display: grid; gap: 3px; text-align: left; padding: 10px 12px; border-radius: 10px; box-shadow: inset 0 0 0 1px var(--faint); transition: box-shadow .15s, background-color .15s; min-width: 0; }
.lb-coins button:hover { box-shadow: inset 0 0 0 1px var(--ink); }
.lb-coins b { font: 600 13.5px/1.2 var(--sans); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lb-coins small { font: 500 11.5px/1.2 var(--sans); color: var(--muted); }
.lb-coins small i { font-style: normal; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--red); font-weight: 600; }
.lb-coins button[aria-pressed="true"] { background: var(--ink); color: #fff; box-shadow: none; }
.lb-coins button[aria-pressed="true"] small { color: #c9c9c2; }
.lb-coins button[aria-pressed="true"] small i { color: #f0a193; }
.lb-pair { display: grid; gap: 14px; }
.lb-pair .label { margin: 5px 0 8px; }
.lb-go { display: grid; gap: 12px; justify-items: start; padding-top: 1px; }
.lb-status { margin: 0; font: 400 13.5px/1.5 var(--sans); color: var(--muted); max-width: 52ch; }
.lb-blank { display: grid; justify-items: center; text-align: center; gap: 6px; padding: 36px 24px; border-radius: var(--radius); background: var(--wash); }
.lb-blank svg { width: 200px; height: auto; }
.lb-blank .note-hand { margin: 8px 0 0; font-size: 23px; color: var(--ink); }
.lb-blank p:last-child { margin: 0; font: 400 16px/1.45 var(--serif); color: var(--muted); max-width: 38ch; }
.lb-blank.is-wide { padding: 28px 24px; }
.lb-result-head { display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 14px 20px; margin-bottom: 18px; }
.lb-verdict { margin: 10px 0 0; font: 500 clamp(22px, 2.2vw, 27px)/1.15 var(--sans); letter-spacing: -.025em; max-width: 26ch; }
.lb-curve { margin-top: 18px; }
.lb-curve svg { display: block; overflow: visible; }
.lb-curve-lab text { font: 500 12px var(--sans); fill: var(--graphite); font-variant-numeric: tabular-nums; }
.lb-curve-lab .is-ink { fill: var(--ink); font-weight: 600; }
.lb-curve-lab .is-hold { fill: var(--ink-2); }
.lb-curve-t { font: 500 11px var(--sans); fill: var(--graphite); }
.lb-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 10px 0 0; font: 500 12px/1.3 var(--sans); color: var(--muted); }
.lb-legend i { display: inline-block; vertical-align: middle; margin-right: 6px; }
.lb-legend .k-line { width: 16px; height: 2px; background: var(--ink); }
.lb-legend .k-hold { width: 16px; border-top: 2px dotted var(--graphite); }
.lb-legend .k-open { width: 16px; border-top: 1.5px dashed var(--faint); }
.lb-legend .k-mark { display: inline-block; vertical-align: -1px; width: 10px; height: 9px; margin-right: 6px; }
.lb-recipe { margin-top: 18px; border-top: 1px solid var(--rule); padding-top: 12px; }

.lb-recipe p { margin: 10px 0 0; font: 400 13.5px/1.55 var(--sans); color: var(--muted); max-width: 80ch; }
.lb-recipe code { overflow-wrap: anywhere; font-size: 12px; color: var(--ink-2); }
.lb-cmp-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 20px; margin-bottom: 26px; }
.lb-cmp-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
.lb-nine { width: 100%; border-collapse: collapse; table-layout: fixed; }
.lb-nine thead th { font: 500 10.5px/1.2 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); padding: 0 0 10px; text-align: center; }
.lb-nine thead th:first-child { width: 74px; }
.lb-nine tbody th { font: 500 10.5px/1.2 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); text-align: left; padding-right: 10px; }
.lb-nine td { position: relative; text-align: center; padding: 22px 8px; border: 1px solid var(--rule); }
.lb-nine td b { display: block; font: 500 20px/1.1 var(--sans); letter-spacing: -.02em; }
.lb-nine td small { display: block; margin-top: 5px; font: 500 11.5px/1.2 var(--sans); color: var(--muted); }
.lb-nine td.is-best b { font-weight: 600; }
.lb-ring { position: absolute; left: 4%; top: 6%; width: 92%; height: 88%; pointer-events: none; overflow: visible; }
.lb-rank { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ink); }
.lb-rank li { display: grid; grid-template-columns: 30px 64px minmax(0, 1fr) auto; gap: 10px; align-items: baseline; padding: 10px 0; border-bottom: 1px solid var(--rule); font: 400 14px/1.3 var(--sans); }
.lb-rank li:first-child { font-weight: 600; }
.lb-rank-n { font-size: 11.5px; color: var(--graphite); font-weight: 500; }
.lb-rank-dd { font-size: 12px; color: var(--muted); text-align: right; font-weight: 400; }
.lb-shelf { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); }
.lb-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ink); }
.lb-list button { width: 100%; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; text-align: left; padding: 12px 8px; border-bottom: 1px solid var(--rule); transition: background-color .15s; }
.lb-list button:hover { background: var(--wash); }
.lb-list-a { font: 400 14px/1.3 var(--sans); min-width: 0; }
.lb-list-a b { font-weight: 600; margin-right: 4px; }
.lb-nw { white-space: nowrap; }
.lb-draft { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 18px; margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--rule); }
.lb-draft p { margin: 0; flex: 1 1 220px; font: 400 15.5px/1.45 var(--serif); color: var(--muted); max-width: 40ch; }
@media (max-width: 420px) {
  .lb-list button { grid-template-columns: minmax(0, 1fr); }
  .lb-list-b { text-align: left; }
}
@media (max-width: 360px) {
  .lb-table thead { display: none; }
  .lb-table tr { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 14px; align-items: center; padding: 9px 0; border-bottom: 1px solid var(--rule); }
  .lb-table tr[hidden] { display: none; }
  .lb-table tbody th, .lb-table tfoot th, .lb-table td { grid-column: auto; border: 0 !important; padding: 0 !important; }
  .lb-table tbody th, .lb-table tfoot th { grid-column: 1 / -1; padding-bottom: 5px !important; }
  .lb-table td.c-x { display: none; }
  .lb-table .c-drawn { text-align: left; }
  .lb-table .c-drawn::after { content: ' drawn'; font-weight: 400; font-size: 12px; color: var(--muted); }
  .lb-table tfoot tr { border-top: 1px solid var(--ink); border-bottom: 0; }
  .lb-share { width: auto; min-width: 0; }
}
.lb-list-b { font: 500 14px/1.3 var(--sans); text-align: right; }
.lb-list-b small { font-weight: 400; color: var(--muted); font-size: 12px; }
.lb-list time { grid-column: 1 / -1; font: 400 12px/1.2 var(--sans); color: var(--muted); }

/* ======================================================================
   room 04 · the studio
   ====================================================================== */

.st-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 14px; }
.st-gap { flex: 1; }
.st-swatch { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: var(--ink); margin-right: 7px; }
.st-swatch.is-pencil { background: var(--graphite); }
.st-paper { position: relative; aspect-ratio: 10 / 7; border-radius: 6px; background: #fff; box-shadow: inset 0 0 0 1px var(--faint); }
.st-paper canvas { position: absolute; inset: 1px; width: calc(100% - 2px); height: calc(100% - 2px); border-radius: 5px; touch-action: pan-y; cursor: crosshair; }
/* a finger scrolls the page over the paper until "draw" is pressed */
.st-paper canvas.is-drawing { touch-action: none; }
.st-draw[aria-pressed='true'] { background: var(--ink); color: #fff; box-shadow: none; }
.st-paper canvas:focus-visible { outline-offset: 2px; }
.st-hint { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: 6px; pointer-events: none; text-align: center; }
.st-hint .note-hand { font-size: clamp(24px, 3vw, 34px); color: var(--graphite); }
.st-hint small { font: 500 12.5px/1 var(--sans); color: var(--graphite); }
.st-corner { position: absolute; right: 16px; bottom: 12px; font: 400 15px/1 var(--hand); color: var(--faint); pointer-events: none; }
.st-foot { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px 20px; margin-top: 14px; }
.st-status { margin: 0; font: 400 13.5px/1.5 var(--sans); color: var(--muted); }

#cards .rc-tag { margin: -8px 0 24px; }
.st-cards-bar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-bottom: 20px; }
.st-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(184px, 1fr)); gap: 16px; }
.st-card { display: grid; gap: 6px; align-content: start; padding: 16px 16px 12px; border-radius: 12px; background: #fff; box-shadow: inset 0 0 0 1px var(--faint), inset 0 0 0 6px #fff, inset 0 0 0 7px var(--rule); transition: box-shadow .2s, transform .2s var(--ease); }
.st-card:hover { box-shadow: inset 0 0 0 1px var(--ink), inset 0 0 0 6px #fff, inset 0 0 0 7px var(--rule); transform: translateY(-2px); }
.st-card-top { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; padding: 2px 4px 0; }
.st-card-n { font: 500 15px/1 var(--sans); letter-spacing: -.01em; }
.st-card-t { font: 500 11.5px/1 var(--sans); color: var(--red); }
.st-card-fig { display: block; }
.st-card-fig svg { width: 100%; max-width: 150px; height: auto; margin: 0 auto; }
.st-card-w { text-align: center; font-size: 12.5px; color: var(--ink-2); }
.st-card-s { text-align: center; font: italic 400 15px/1.3 var(--serif); color: var(--muted); min-height: 2.6em; }
.st-card-tags { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; }
.st-card-tags i { font-style: normal; font: 500 10.5px/1 var(--sans); padding: 4px 7px; border-radius: 999px; background: var(--wash); color: var(--ink-2); }
.st-card-name { text-align: center; font: 500 16px/1.2 var(--sans); letter-spacing: -.01em; }
.st-card-p { font: 500 12px/1 var(--sans); color: var(--ink-2); }
.st-lcard .st-card-fig svg { max-width: 132px; }
.st-lcard.is-out .st-card-name { text-decoration: line-through; text-decoration-color: var(--red); text-decoration-thickness: 1.5px; color: var(--muted); }
.st-stamp { font: 400 15px/1 var(--hand); color: var(--red); padding: 2px 7px 3px; border-radius: 4px; box-shadow: inset 0 0 0 1.3px var(--red); transform: rotate(-4deg); }
.st-lodgers + .rm-note { margin-top: 16px; }
.st-wall-copy .note-hand { margin: 0 0 6px; font-size: 22px; color: var(--ink); }
.st-wall-copy .rm-empty-text { margin: 0 0 12px; max-width: 52ch; }
.st-card-foot { display: flex; justify-content: space-between; gap: 8px; margin-top: 6px; padding: 9px 4px 0; border-top: 1px solid var(--rule); font: 500 9.5px/1 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--graphite); }

.st-wall { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 36px 28px; }
.st-work-frame { position: relative; }
.st-work-frame svg { width: 100%; height: auto; }
.st-work-cat { position: absolute; left: 50%; top: 55%; transform: translate(-50%, -50%); font: 400 20px var(--hand); color: var(--ink-2); }
.st-work h3 { margin: 10px 0 0; font: 500 18px/1.25 var(--sans); letter-spacing: -.015em; }
.st-work-meta { margin: 6px 0 0; font-size: 13px; color: var(--muted); }
.st-work-links { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 8px 0 0; font-size: 13.5px; }
.st-wall-empty { display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.st-wall-art { position: relative; }
.st-wall-art svg { width: 100%; height: auto; }
.st-wall-art .note-hand { position: absolute; left: 50%; top: 57%; transform: translate(-50%, -50%) rotate(-2deg); font-size: 21px; color: var(--graphite); white-space: nowrap; }
.st-h { font: 500 clamp(22px, 2.4vw, 28px)/1.15 var(--sans); letter-spacing: -.025em; margin: 0 0 12px; }

.st-board { margin-top: clamp(40px, 5vw, 64px); }
.st-board-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ink); }
.st-board-list a { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; gap: 14px; align-items: center; padding: 14px 6px; border-bottom: 1px solid var(--rule); transition: background-color .15s; }
.st-board-list a:hover { background: var(--wash); }
.st-board-list b { font-weight: 500; }
.st-board-s { font: 500 12px/1 var(--sans); color: var(--muted); }

@media print {
  body.st-printing .top, body.st-printing .foot, body.st-printing .specimen-bar, body.st-printing .skip, body.st-printing .toast { display: none !important; }
  body.st-printing #main > * { display: none !important; }
  body.st-printing #main > #cards { display: block !important; margin: 0 !important; padding: 0 !important; max-width: none; }
  body.st-printing #cards .rm-sec-head, body.st-printing .st-cards-bar, body.st-printing #st-cards > .rm-note { display: none !important; }
  body.st-printing .st-cards { grid-template-columns: repeat(3, 1fr); gap: 12px; }
  body.st-printing .st-card { break-inside: avoid; transform: none; }
}

/* ======================================================================
   the three rooms, narrower
   ====================================================================== */

@media (max-width: 1100px) {
  .mn-board { grid-template-columns: minmax(0, 1fr); }
  .mn-board > div + div { border-left: 0; border-top: 1px solid var(--rule); }
  .mn-inst, .mn-board > div + div .mn-inst { padding: 22px 0 26px; }
  .mn-work { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .mn-work .mn-form { grid-row: span 2; }
  .mn-meter-box { max-width: 220px; }
  .lb-bench-grid, .lb-cmp-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 860px) {
  .mn-feed-grid { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .mn-dial-box { max-width: 320px; }
  .mn-read { grid-template-columns: repeat(2, minmax(0, 1fr)); border-bottom: 0; }
  .mn-read > div { border-bottom: 1px solid var(--rule); padding: 12px 10px 12px 0; }
  .mn-read > div + div { padding-left: 0; border-left: 0; }
  .mn-read > div:nth-child(2n) { padding-left: 12px; border-left: 1px solid var(--rule); }
  .mn-facts { grid-template-columns: minmax(0, 1fr); }
  .mn-shelf { grid-template-columns: minmax(0, 1fr); }
  .mn-work { grid-template-columns: minmax(0, 1fr); }
  .mn-work .mn-form { grid-row: auto; }
  .mn-meter-box { max-width: 200px; }
  .lb-hind { grid-template-columns: minmax(0, 1fr); }
  .lb-keys { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 16px; }
  .lb-shelf { grid-template-columns: minmax(0, 1fr); }
  .st-wall-empty { grid-template-columns: minmax(0, 1fr); }
  .st-wall-art { max-width: 280px; }
}
@media (max-width: 560px) {
  .lb-keys { grid-template-columns: minmax(0, 1fr); }
  .lb-keys dd { font-size: 48px; }
  .lb-coins { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lb-nine thead th:first-child { width: 46px; }
  .lb-nine td { padding: 14px 4px; }
  .lb-nine td b { font-size: 15px; }
  .lb-nine td small { font-size: 10.5px; }
  .lb-rank li { grid-template-columns: 26px 54px minmax(0, 1fr); }
  .lb-rank-dd { grid-column: 3; text-align: left; }
  .lb-share { min-width: 120px; }
  .st-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .st-card { padding: 12px 10px 10px; }
  .st-card-foot { font-size: 8.5px; letter-spacing: .06em; }
  .st-board-list a { grid-template-columns: minmax(0, 1fr) auto; }
  .st-board-list .tag { grid-column: 1 / -1; justify-self: start; }
  .st-tools .st-gap { display: none; }
  .mn-sums .is-big dd { font-size: 46px; }
}
@media (max-width: 360px) {
  .st-card-s { font-size: 13.5px; }
  .mn-read dd { font-size: 20px; }
}

/* round two: empty states in a row, the folded first hour, the arrivals strip, the blank nine */
/* .rm-empty.is-row is now the default layout of every empty state */
.lb-keys dd.is-words { font: italic 400 22px/1.3 var(--serif); letter-spacing: 0; color: var(--ink-2); max-width: 22ch; }
.lb-table td.is-zero { color: var(--faint); }
.lb-table tr.is-minute th { padding-left: 18px; font-weight: 400; }
.lb-table tr.is-minute th, .lb-table tr.is-minute td { padding-top: 7px; padding-bottom: 7px; font-size: 13px; }
.lb-table tr.is-minute th small { display: inline; margin-left: 8px; }
.lb-table tr.is-minute { background: #fbfbf9; }
.lb-open { display: block; text-align: left; font: inherit; font-weight: 500; }
.lb-open small { display: block; margin-top: 2px; font: 400 11.5px/1.2 var(--sans); color: var(--muted); }
.lb-open-word { color: var(--ink); text-decoration: underline; text-decoration-color: var(--faint); text-underline-offset: 3px; }
.lb-open:hover .lb-open-word { text-decoration-color: var(--ink); }
.lb-open::before { content: '+'; display: inline-grid; place-items: center; width: 18px; height: 18px; margin: 0 8px 0 -2px; border-radius: 50%; box-shadow: inset 0 0 0 1px var(--faint); font-weight: 500; font-size: 13px; float: left; }
.lb-open[aria-expanded="true"]::before { content: '−'; }
.lb-strip-box { margin: 4px 0 28px; }
.lb-strip { min-height: 150px; }
.lb-strip svg { display: block; overflow: visible; }
.lb-strip svg text { font: 500 11px var(--sans); fill: var(--muted); font-variant-numeric: tabular-nums; }
.lb-strip svg .lb-strip-max { fill: var(--graphite); font-size: 10.5px; }
.lb-legend .k-sq { width: 9px; height: 9px; background: var(--ink); }
.lb-legend .k-sq.is-grey { background: var(--graphite); }
.lb-legend .k-sq.is-red { background: var(--red); }
#lb-strip-cap { margin-right: auto; color: var(--ink-2); }
.lb-nine-blank { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.lb-nine.is-blank td { border-style: dashed; border-color: var(--faint); }
.lb-nine.is-blank td b { color: var(--graphite); font-size: 16px; }
.lb-nine.is-blank td small { color: var(--faint); }
.lb-nine-note .note-hand { margin: 0 0 6px; font-size: 24px; color: var(--ink); }
.lb-nine-note p:last-child { margin: 0; font: 400 16.5px/1.45 var(--serif); color: var(--muted); max-width: 36ch; }
.mn-dial-read .mn-dial-age { font-size: 26px; }
.mn-dial-read .mn-dial-cap { font-size: 11.5px; }
@media (max-width: 860px) { .lb-nine-blank { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 560px) {
  .lb-table tr.is-minute th small { display: block; margin: 2px 0 0; }
}

/* the drawing desk: tools down the side, the paper beside them */
.st-desk { display: grid; grid-template-columns: minmax(0, 240px) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: start; }
.st-side { display: grid; gap: 22px; align-content: start; }
.st-tray { width: 170px; height: auto; }
.st-desk .st-tools { display: grid; gap: 16px; margin: 0; }
.st-tool { display: grid; gap: 8px; justify-items: start; }
.st-edit { display: flex; flex-wrap: wrap; gap: 8px; }
.st-weight { display: inline-block; width: 14px; height: 2px; border-radius: 2px; background: currentColor; margin-right: 7px; vertical-align: 3px; }
.st-weight.is-thick { height: 5px; vertical-align: 2px; }
.st-take { display: grid; gap: 10px; justify-items: start; padding-top: 18px; border-top: 1px solid var(--rule); }
.st-rules { margin: 0; font-size: 12.5px; }
.st-paper { max-width: 980px; }
@media (max-width: 860px) {
  .st-desk { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .st-side { order: 2; }
  .st-paper { order: 1; }
  .st-tray { display: none; }
  .st-desk .st-tools { display: flex; flex-wrap: wrap; gap: 12px 16px; align-items: end; }
  .st-tool .label { display: none; }
  .st-take { padding-top: 14px; }
}
.mn-rules { margin-top: 20px; border-top: 1px solid var(--rule); padding-top: 12px; }

.mn-rules dl { margin: 10px 0 0; display: grid; }
.mn-rules dl > div { display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--rule); }
.mn-rules dt { font: 500 10.5px/1.5 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.mn-rules dd { margin: 0; font: 400 14px/1.45 var(--sans); color: var(--ink-2); }
@media (max-width: 560px) { .mn-rules dl > div { grid-template-columns: minmax(0, 1fr); gap: 2px; } }
@media (max-width: 860px) {
  .mn-work { grid-template-columns: minmax(0, 1fr) minmax(0, 132px); column-gap: 18px; }
  .mn-work .mn-form { grid-column: 1 / -1; }
  .mn-meter-box { align-self: end; max-width: 132px; padding-bottom: 6px; }
}
@media (max-width: 360px) { .mn-work { grid-template-columns: minmax(0, 1fr) minmax(0, 100px); } .mn-meter-box { max-width: 100px; } }
.hs-key-art svg { overflow: hidden; }
.lb-mob { display: none; }
@media (max-width: 640px) {
  .lb-table .c-x { display: none; }
  .lb-mob { display: block; margin-top: 3px; font: 400 11.5px/1.35 var(--sans); color: var(--muted); white-space: normal; }
  .lb-mob b { font-weight: 500; color: var(--red); }
  .lb-table th { white-space: normal; }
  .lb-share { width: 42%; min-width: 0; }
  .lb-share > span.num { width: 36px; }
  .lb-bar { width: calc(100% - 42px); }
  .lb-table tr.is-minute th small { display: inline; }
}
@media (max-width: 560px) {
  .lb-keys { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 16px; }
  .lb-keys > div { padding: 14px 0 16px; }
  .lb-keys > div:nth-child(2) { border-top-color: var(--ink); }
  .lb-keys > div:nth-child(3) { grid-column: 1 / -1; }
  .lb-keys dd { font-size: 42px; }
  .lb-keys dd.is-words { font-size: 20px; }
  .lb-rank li { grid-template-columns: 24px 48px auto minmax(0, 1fr); gap: 8px; font-size: 13.5px; }
  .lb-rank-dd { grid-column: auto; text-align: right; font-size: 11.5px; }
  #lb-strip-cap { flex-basis: 100%; }
}
.rm-status { flex-wrap: nowrap; }
.rm-status > span:last-child { min-width: 0; }
/* on a phone the cards sit on a shelf that slides sideways */
@media (max-width: 560px) {
  .st-cards { display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; margin: 0 calc(var(--gutter) * -1); padding: 4px var(--gutter) 14px; scroll-padding-left: var(--gutter); scrollbar-width: thin; }
  .st-card { flex: 0 0 172px; scroll-snap-align: start; }
  .st-card:hover { transform: none; }
}
.rm-sec-title .kicker:has(.tag) { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.rm-sec-title .kicker:has(.tag) .tag { margin-left: 0; }
@media (max-width: 700px) { .rm-figures > div:last-child:nth-child(odd) { grid-column: 1 / -1; border-left: 0; padding-left: 0; } }
.st-card-foot span { white-space: nowrap; }
.st-card-foot .is-red { color: var(--red); }
@media (max-width: 1180px) { .tm-tape.is-quiet { height: auto; } .tm-tape.is-quiet .tp-body { flex: none; overflow: visible; } }
@media (max-width: 560px) {
  .lb-ring { display: none; }
  .lb-nine td.is-best { box-shadow: inset 0 0 0 1.6px var(--ink); }
}
@media (max-width: 420px) {
  .lb-unit { display: none; }
  .lb-pair .rm-seg button { min-width: 44px; }
}

/* The current house leads; older desks remain inspectable. */
.book-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.room-book-index{padding-block:32px 56px}.book-room{border-top:1px solid var(--rule);padding:20px 0}.book-room-title{display:flex;align-items:center;gap:14px}.book-room-title>.num{font:28px var(--hand)}.book-room-title h3{margin:0;font:30px var(--hand)}.book-room-title small{margin-left:auto}.book-room p{font-size:13px;color:var(--muted)}.room-index-links{display:flex;flex-wrap:wrap;gap:20px}.room-history-desk{margin-block:36px 72px;border-block:1px solid var(--rule);padding-block:20px}.room-history-desk summary{cursor:pointer;min-height:44px;font:25px var(--hand)}.room-history-desk>.wrap{width:100%}.selected-board{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding:24px;background:#f7f7f5;border:1px solid var(--rule);margin-bottom:28px}.selected-board h3{font:42px var(--hand);margin:12px 0}.selected-board p{font-size:14px}.selected-board code{font-size:11px;overflow-wrap:anywhere}.selected-board pre{font-size:12px;overflow:auto}.primary-fills{max-height:410px;overflow:auto}.fill-inspect{display:grid;grid-template-columns:70px 1fr 130px 100px;gap:14px;width:100%;min-height:56px;background:none;border:0;border-bottom:1px solid var(--rule);text-align:left;padding:14px 8px;color:inherit;cursor:pointer}.fill-inspect:hover{background:#f7f7f5}.failure-analysis>p{max-width:680px;line-height:1.6}.failure-row{border-bottom:1px solid var(--rule);padding:14px 0}.failure-row summary{min-height:44px;display:flex;gap:24px;align-items:center;cursor:pointer}.failure-row summary small{margin-left:auto}.failure-steps{padding:18px 0 18px 26px;display:grid;gap:18px}.failure-steps li>b{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.08em}.failure-steps li>span{display:block;margin-top:5px;font-size:14px;line-height:1.6}.tenancy-gallery{padding-block:24px 50px}.tenancy-gallery-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;max-width:920px}.tenancy-gallery .tenancy-preview{border:1px solid var(--rule);margin-bottom:16px}.hs-scroll{scroll-behavior:auto}
@media(max-width:650px){.book-grid{grid-template-columns:1fr}.selected-board{grid-template-columns:1fr;padding:18px}.fill-inspect{grid-template-columns:54px 1fr;gap:8px;font-size:13px}.fill-inspect>b{grid-column:2}.failure-row summary{gap:12px;flex-wrap:wrap;font-size:14px}.failure-row summary small{margin-left:0}.tenancy-gallery-grid{grid-template-columns:1fr}.room-history-desk summary{font-size:22px}.hs-scroll:after{content:'';position:sticky;right:0;display:block;float:right;width:18px;height:24px;border-right:2px solid var(--rule)}}

/* Round 15: the room's record precedes the decorative scene on phones. */
body:has(.terminal-primary) .rm-head,body:has(.failure-analysis) .rm-head{align-items:center;padding-block:28px 22px}body:has(.terminal-primary) .rm-head .lede,body:has(.failure-analysis) .rm-head .lede{max-width:45ch}body:has(.terminal-primary) .rm-art,body:has(.failure-analysis) .rm-art{max-width:300px;justify-self:end}.terminal-primary,.failure-analysis{margin-top:18px}.lb-draft p{max-width:50ch}
@media(max-width:650px){body:has(.terminal-primary) .rm-head,body:has(.failure-analysis) .rm-head{display:block;padding-top:18px}body:has(.terminal-primary) .rm-art,body:has(.failure-analysis) .rm-art{display:none}.rm-head .page-title{font-size:40px}.lb-draft{margin-top:18px}.lb-draft p{display:none}.rm-status{margin-top:16px}.terminal-primary .selected-board{padding:16px}.rm-switch{gap:6px 12px}}

.board-select{font:600 15px var(--sans);background:transparent;color:var(--ink);border:0;border-bottom:1px solid var(--rule);padding:10px 4px;min-height:44px;cursor:pointer;text-align:left}.board-select:hover{color:var(--red);border-color:currentColor}.board-select:focus-visible{outline:2px solid var(--red);outline-offset:3px}
body[data-page='studio'] .rm-head{padding-bottom:20px}@media(max-width:650px){body[data-page='studio'] .rm-head-art{display:none}body[data-page='studio'] .rm-head{padding-top:24px}.tenancy-gallery{margin-top:20px}}

@media(max-width:650px){body[data-page='studio'] .rm-art{display:none}body[data-page='studio'] .rm-head .lede{font-size:18px;line-height:1.4}body[data-page='studio'] .rm-head{padding-bottom:0}}