:root {
  color-scheme: dark;
  --ink: #f2e5ce;
  --muted: #b8a78e;
  --gold: #d4a45b;
  --panel: rgba(15, 11, 8, .82);
  --edge: rgba(226, 180, 103, .28);
}
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { margin: 0; width: 100%; height: 100%; overflow: hidden; background: #060504; -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
body { font-family: Georgia, 'Times New Roman', serif; color: var(--ink); touch-action: none; overscroll-behavior: none; }
button { font: inherit; color: inherit; }
.app {
  position: relative;
  width: 100%;
  height: 100%;
  isolation: isolate;
  overflow: hidden;
  background: radial-gradient(circle at 55% 47%, #49331f 0%, #1b110a 58%, #080503 100%);
  transition: background 1800ms ease;
}
.app[data-light="day"] {
  background: radial-gradient(circle at 55% 47%, #405249 0%, #1a2722 58%, #0a100e 100%);
}
.app[data-light="noon"] {
  background: radial-gradient(circle at 55% 47%, #5a3d25 0%, #21140c 58%, #090503 100%);
}
.app[data-light="night"] {
  background: radial-gradient(circle at 55% 47%, #172947 0%, #081225 58%, #02040a 100%);
}
#habitatCanvas { position: absolute; inset: 0; display: block; width: 100%; height: 100%; outline: none; cursor: default; touch-action: none; -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
#habitatCanvas.is-pointing { cursor: pointer; }
.atmosphere-wash, .grain, .vignette { position: absolute; inset: 0; pointer-events: none; }
.atmosphere-wash {
  z-index: 1;
  opacity: .16;
  mix-blend-mode: normal;
  background: radial-gradient(ellipse 72% 54% at 60% 54%, rgba(126,154,141,.12) 0%, rgba(126,154,141,.06) 42%, transparent 76%);
  transition: background 1800ms ease, opacity 1800ms ease;
}
.grain {
  z-index: 2;
  opacity: .12;
  mix-blend-mode: normal;
  background-image: repeating-radial-gradient(circle at 30% 40%, rgba(255,255,255,.035) 0 1px, transparent 1px 4px);
}
.vignette { z-index: 3; background: radial-gradient(circle at 54% 50%, transparent 36%, rgba(8,7,7,.18) 64%, rgba(4,3,3,.54) 88%, rgba(2,2,2,.74) 112%); transition: background 1800ms ease; }
.app[data-light="day"] .vignette { background: radial-gradient(ellipse 96% 88% at 55% 46%, transparent 34%, rgba(7,9,8,.18) 62%, rgba(4,6,5,.48) 86%, rgba(2,3,3,.68) 112%); }
.app[data-light="night"] .vignette { background: radial-gradient(circle at 58% 49%, transparent 32%, rgba(2,5,12,.30) 60%, rgba(1,2,7,.76) 86%, rgba(1,1,5,.88) 112%); }

.masthead {
  position: absolute;
  z-index: 8;
  top: max(18px, env(safe-area-inset-top));
  left: max(20px, env(safe-area-inset-left));
  right: max(20px, env(safe-area-inset-right));
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  pointer-events: none;
  text-shadow: 0 2px 14px #000;
}
.masthead > div:first-child { max-width: min(560px, 68vw); }
.masthead p { margin: 0 0 6px; color: var(--gold); font: 650 11px/1.2 system-ui, sans-serif; letter-spacing: .23em; }
.masthead h1 { margin: 0; font-size: clamp(25px, 3.8vw, 46px); font-weight: 500; line-height: .98; }
.masthead span { display: block; margin-top: 8px; color: var(--muted); font-size: clamp(11px, 1.4vw, 14px); }
.header-actions { display: flex; gap: 8px; pointer-events: auto; }
.quiet-button, .close-controls button, .portal button {
  border: 1px solid var(--edge);
  background: rgba(9, 7, 5, .68);
  /* backdrop-filter removed for global compositing performance: blur(10px); */
  border-radius: 999px;
  padding: 10px 15px;
  cursor: pointer;
  box-shadow: 0 8px 26px rgba(0,0,0,.24);
}
.quiet-button:hover, .close-controls button:hover, .portal button:hover { border-color: rgba(228,190,120,.62); background: rgba(35,25,16,.8); }


.time-cycle {
  position: relative;
  z-index: 10;
  display: inline-grid;
  grid-template-columns: repeat(3, auto);
  gap: 3px;
  margin-top: 12px;
  padding: 4px;
  border: 1px solid rgba(226, 180, 103, .2);
  border-radius: 999px;
  background: rgba(8, 7, 6, .64);
  box-shadow: 0 10px 34px rgba(0,0,0,.28);
  pointer-events: auto;
}

.time-button {
  min-width: 54px;
  min-height: 36px;
  padding: 7px 12px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: rgba(235, 222, 200, .67);
  font: 650 11px/1 system-ui, sans-serif;
  letter-spacing: .04em;
  cursor: pointer;
  transition: color 220ms ease, background 220ms ease, box-shadow 220ms ease;
}
.time-button:hover { color: var(--ink); }
.time-button.is-active {
  color: #21160e;
  background: #d2a45f;
  box-shadow: 0 3px 14px rgba(211, 159, 82, .22);
}
.app[data-light="night"] .time-button.is-active {
  color: #e6edf9;
  background: #526d9b;
  box-shadow: 0 3px 16px rgba(83, 117, 171, .3);
}

.attention-card {
  position: absolute;
  z-index: 9;
  left: max(18px, env(safe-area-inset-left));
  bottom: max(58px, calc(env(safe-area-inset-bottom) + 52px));
  width: min(350px, calc(100vw - 36px));
  padding: 17px 18px 16px;
  border: 1px solid var(--edge);
  background: var(--panel);
  /* backdrop-filter removed for global compositing performance: blur(16px); */
  border-radius: 18px;
  box-shadow: 0 24px 80px rgba(0,0,0,.44);
  transform: translateY(13px);
  opacity: 0;
  pointer-events: none;
  transition: opacity 210ms ease, transform 210ms ease;
}
.attention-card[aria-hidden="false"] { opacity: 1; transform: none; pointer-events: auto; }
.attention-card > p:first-child { margin: 0 0 5px; color: var(--gold); font: 650 10px/1.2 system-ui, sans-serif; text-transform: uppercase; letter-spacing: .18em; }
.attention-card h2 { margin: 0 0 7px; font-weight: 500; font-size: 25px; }
.attention-card h2 + p { margin: 0 0 14px; color: #d2c4ad; line-height: 1.45; font-size: 14px; }
.attention-card button { border: 0; border-radius: 999px; padding: 10px 16px; background: #c9964d; color: #20150d; font-weight: 750; cursor: pointer; }

.instruction {
  position: absolute;
  z-index: 7;
  left: 50%;
  bottom: max(17px, env(safe-area-inset-bottom));
  transform: translateX(-50%);
  margin: 0;
  width: max-content;
  max-width: calc(100vw - 40px);
  color: rgba(238,225,202,.72);
  font: 12px/1.3 system-ui, sans-serif;
  letter-spacing: .025em;
  text-align: center;
  text-shadow: 0 2px 8px #000;
  pointer-events: none;
}
.close-controls {
  position: absolute;
  z-index: 9;
  right: max(18px, env(safe-area-inset-right));
  bottom: max(18px, env(safe-area-inset-bottom));
  display: flex;
  align-items: center;
  gap: 12px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 180ms ease;
}
.close-controls[aria-hidden="false"] { opacity: 1; pointer-events: auto; }
.close-controls span { color: #c6b69d; font: 12px/1.2 system-ui, sans-serif; text-shadow: 0 2px 8px #000; }

.portal {
  position: absolute;
  z-index: 30;
  inset: 0;
  display: grid;
  grid-template-rows: auto 1fr;
  background: #070605;
  opacity: 0;
  visibility: hidden;
  transition: opacity 230ms ease;
}
.portal[aria-hidden="false"] { opacity: 1; visibility: visible; }
.portal-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: max(12px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) 12px max(14px, env(safe-area-inset-left));
  border-bottom: 1px solid rgba(225,184,111,.2);
  background: #100c09;
}
.portal-bar div { display: flex; flex-direction: column; gap: 2px; }
.portal-bar small { color: var(--gold); font: 10px/1 system-ui, sans-serif; text-transform: uppercase; letter-spacing: .16em; }
.portal-bar strong { font-size: 16px; font-weight: 500; }
.portal iframe { width: 100%; height: 100%; border: 0; background: #070605; }

@media (max-width: 720px) {
  .masthead {
    top: max(11px, env(safe-area-inset-top));
    left: max(13px, env(safe-area-inset-left));
    right: max(13px, env(safe-area-inset-right));
  }
  .masthead > div:first-child { max-width: 72vw; }
  .masthead p { font-size: 9px; margin-bottom: 5px; }
  .masthead h1 { font-size: 25px; }
  .masthead span { display: none; }
  .header-actions { flex-direction: column; gap: 5px; }
  .quiet-button { padding: 8px 11px; font-size: 12px; }
  .time-cycle {
    margin-top: 8px;
    padding: 3px;
  }
  .time-button {
    min-width: 48px;
    min-height: 32px;
    padding: 6px 9px;
    font-size: 10px;
  }
  .attention-card {
    left: 12px;
    bottom: max(54px, calc(env(safe-area-inset-bottom) + 44px));
    width: calc(100vw - 24px);
    padding: 14px 15px;
  }
  .attention-card h2 { font-size: 21px; }
  .attention-card h2 + p { font-size: 13px; }
  .close-controls { right: 12px; left: 12px; justify-content: space-between; }
  .close-controls span { max-width: 52vw; text-align: right; }
  .instruction { bottom: max(10px, env(safe-area-inset-bottom)); font-size: 11px; }
  .app[data-view="focused"] .masthead h1 { font-size: 20px; }
  .app[data-view="focused"] .masthead p { opacity: .76; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
  .grain { opacity: .08; }
}

.focus-transfer {
  position: absolute;
  z-index: 10;
  left: 50%;
  bottom: max(74px, calc(env(safe-area-inset-bottom) + 66px));
  transform: translateX(-50%);
  display: flex;
  gap: 5px;
  padding: 4px;
  border: 1px solid rgba(226,180,103,.18);
  border-radius: 999px;
  background: rgba(8,7,6,.62);
  /* backdrop-filter removed for global compositing performance: blur(12px); */
  opacity: 0;
  pointer-events: none;
  transition: opacity 180ms ease;
}
.focus-transfer[aria-hidden="false"] { opacity: 1; pointer-events: auto; }
.focus-transfer button {
  border: 0;
  border-radius: 999px;
  padding: 7px 10px;
  background: transparent;
  color: rgba(235,222,200,.68);
  font: 650 10px/1 system-ui,sans-serif;
  cursor: pointer;
}
.focus-transfer button.is-active { background: rgba(211,164,95,.86); color: #21160e; }
@media (max-width: 720px) {
  .focus-transfer { bottom: max(82px, calc(env(safe-area-inset-bottom) + 72px)); max-width: calc(100vw - 24px); }
  .focus-transfer button { padding: 7px 8px; font-size: 9px; }
}

/* Final wide-screen composition: preserve the room hierarchy while keeping the
   controls clear of the title and giving the diorama a little more presence. */
@media (min-width: 900px) and (min-aspect-ratio: 4/3) {
  .masthead {
    top: max(24px, env(safe-area-inset-top));
    left: max(34px, env(safe-area-inset-left));
    right: max(34px, env(safe-area-inset-right));
  }
  .masthead > div:first-child { max-width: min(520px, 42vw); }
  .masthead h1 { font-size: clamp(34px, 3.05vw, 44px); }
  .masthead span { max-width: 500px; line-height: 1.35; }
  .time-cycle { margin-top: 13px; }
  .quiet-button { padding: 11px 18px; }
  .instruction { bottom: max(18px, env(safe-area-inset-bottom)); }
}


.perf-overlay {
  position: absolute;
  z-index: 40;
  right: max(14px, env(safe-area-inset-right));
  top: max(72px, calc(env(safe-area-inset-top) + 58px));
  display: none;
  min-width: 154px;
  padding: 10px 12px;
  border: 1px solid rgba(226,180,103,.32);
  border-radius: 12px;
  background: rgba(5,5,5,.82);
  box-shadow: 0 10px 34px rgba(0,0,0,.34);
  /* backdrop-filter removed for global compositing performance: blur(8px); */
  color: rgba(242,229,206,.9);
  font: 600 11px/1.45 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  pointer-events: none;
}
.perf-overlay[aria-hidden="false"] { display: grid; gap: 1px; }
.perf-overlay strong { color: var(--gold); letter-spacing: .1em; font-size: 10px; margin-bottom: 3px; }
.perf-overlay small { color: rgba(242,229,206,.48); margin-top: 4px; font-size: 9px; }
@media (max-width: 720px) {
  .perf-overlay { top: max(118px, calc(env(safe-area-inset-top) + 108px)); right: max(10px, env(safe-area-inset-right)); min-width: 140px; }
}

/* v0.7.2 — the cabinet ladder becomes an inhabited camera carriage. */
.cabinet-instrument {
  position: absolute;
  z-index: 18;
  inset: 0;
  opacity: 0;
  pointer-events: none;
  transition: opacity 900ms ease;
}
.cabinet-instrument[aria-hidden="false"] { opacity: var(--cabinet-entry, 0); pointer-events: none; }
.cabinet-instrument:not([data-ready="true"]) .cabinet-rail { pointer-events: none; }
.cabinet-rail {
  position: absolute;
  left: max(7vw, 28px);
  right: max(7vw, 28px);
  height: 44px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: ew-resize;
  touch-action: none;
  pointer-events: auto;
}
.cabinet-rail--upper { top: clamp(108px, 18vh, 180px); }
.cabinet-rail--lower { bottom: max(108px, calc(env(safe-area-inset-bottom) + 92px)); }
.cabinet-rail::before,
.cabinet-rail::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(231,184,102,.32) 8%, rgba(255,215,137,.9) 50%, rgba(231,184,102,.32) 92%, transparent);
  box-shadow: 0 0 12px rgba(231,170,76,.46), 0 0 28px rgba(231,170,76,.16);
}
.cabinet-rail::after { height: 15px; transform: translateY(-7px); opacity: .13; filter: blur(6px); }
.cabinet-rail span {
  position: absolute;
  left: var(--ladder-screen, 50%);
  top: 50%;
  width: 25px;
  height: 25px;
  transform: translate(-50%,-50%) rotate(45deg);
  border: 1px solid rgba(255,220,151,.9);
  background: rgba(52,34,19,.8);
  box-shadow: 0 0 18px rgba(234,174,78,.48);
  transition: box-shadow 160ms ease;
}
.cabinet-rail[data-dragging="true"] span { box-shadow: 0 0 12px rgba(255,220,151,.9), 0 0 34px rgba(234,174,78,.72); }
.cabinet-annotations {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}
.cabinet-annotation {
  position: absolute;
  min-width: 78px;
  padding: 4px 6px 5px;
  border: 1px solid rgba(232,190,119,.11);
  border-radius: 3px;
  background: linear-gradient(180deg, rgba(20,14,10,.57), rgba(11,8,6,.42));
  box-shadow: 0 5px 16px rgba(0,0,0,.2), 0 0 14px rgba(220,159,70,.035);
  color: rgba(248,231,201,.74);
  text-align: left;
  opacity: 0;
  transform-origin: 50% 100%;
  transition: opacity 720ms ease;
  will-change: left, top, opacity, transform;
}
.cabinet-annotation::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -9px;
  width: 1px;
  height: 9px;
  background: linear-gradient(rgba(232,190,119,.26), transparent);
}
.cabinet-annotation strong,
.cabinet-annotation small { display: block; }
.cabinet-annotation strong { font: 500 9.5px/1.14 Georgia,serif; }
.cabinet-annotation small { margin-top: 2px; color: rgba(235,208,165,.4); text-transform: uppercase; letter-spacing: .12em; font: 650 6px/1.2 system-ui,sans-serif; }
.cabinet-instrument > p {
  position: absolute;
  left: 50%;
  bottom: max(72px, calc(env(safe-area-inset-bottom) + 58px));
  transform: translateX(-50%);
  width: min(500px, calc(100vw - 40px));
  margin: 0;
  color: rgba(235,216,185,.48);
  text-align: center;
  font: 500 10px/1.4 system-ui,sans-serif;
}
.cabinet-reader {
  position: absolute;
  z-index: 30;
  inset: 0;
  display: grid;
  place-items: center;
  padding: max(14px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) max(14px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));
  background: radial-gradient(circle at 50% 45%, rgba(14,10,7,.05), rgba(3,3,4,.28) 88%);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 260ms ease, visibility 0s linear 260ms;
}
.cabinet-reader[aria-hidden="false"] { opacity: 1; visibility: visible; pointer-events: auto; transition-delay: 0s; }
.cabinet-reader[data-closing="true"] { pointer-events: none; }
.cabinet-reader__close {
  display: none;
  position: absolute;
  z-index: 6;
  top: max(16px, env(safe-area-inset-top));
  right: max(16px, env(safe-area-inset-right));
  border: 1px solid rgba(239,211,169,.3);
  border-radius: 999px;
  background: rgba(14,10,8,.34);
  color: rgba(245,228,199,.78);
  padding: 8px 12px;
  font: 600 11px/1 system-ui,sans-serif;
  backdrop-filter: blur(8px);
  cursor: pointer;
}
.sensory-folio {
  --sensory-presence: 0;
  position: relative;
  width: 100vw;
  height: 100vh;
  display: grid;
  place-items: center;
  opacity: 1;
  transform: none;
  filter: brightness(calc(.66 + var(--sensory-presence) * .24)) saturate(calc(.86 + var(--sensory-presence) * .12));
  transition: filter 320ms ease;
}
.sensory-folio__art {
  position: relative;
  z-index: 2;
  width: min(92vw, calc(68vh * 1.3333));
  aspect-ratio: 4 / 3;
  padding: 0;
  border: 0;
  overflow: visible;
  background: transparent;
  touch-action: none;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
}
.sensory-folio__art > img { display: none; }
.sensory-hotspot {
  position: absolute;
  z-index: 4;
  width: 24px;
  height: 24px;
  margin: -12px 0 0 -12px;
  border: 1.8px solid rgba(255,242,214,1);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,249,231,1) 0 16%, rgba(255,230,166,.98) 20% 42%, rgba(248,208,128,.62) 48% 70%, rgba(248,208,128,.14) 76% 100%);
  box-shadow: 0 0 0 4px rgba(244,199,111,.14), 0 0 22px rgba(244,199,111,.58), 0 0 42px rgba(244,199,111,.2), inset 0 0 8px rgba(255,251,235,.72);
  --proximity: 0;
  opacity: calc(.76 + var(--proximity) * .24);
  transform: scale(calc(1 + var(--proximity) * .42));
  pointer-events: auto;
  transition: opacity 260ms ease, transform 320ms ease, box-shadow 260ms ease;
}
.sensory-hotspot.is-pinned { --proximity: 1; animation: sensoryPulse 2.2s ease-in-out infinite; }
.sensory-hotspot--heart { left: 18%; top: 55%; }
.sensory-hotspot--breath { left: 83%; top: 24%; }
.sensory-hotspot--motion { left: 81%; top: 80%; }
@keyframes sensoryPulse { 50% { box-shadow: 0 0 0 9px rgba(244,199,111,0), 0 0 30px rgba(244,199,111,.92), 0 0 56px rgba(244,199,111,.3); } }
.sensory-note {
  position: absolute;
  z-index: 3;
  width: min(210px, 34vw);
  padding: 9px 11px;
  color: rgba(243,226,196,.82);
  text-shadow: 0 1px 6px rgba(0,0,0,.62);
  opacity: 0;
  transform: translateY(7px) scale(.96);
  pointer-events: none;
  transition: opacity 500ms ease, transform 600ms cubic-bezier(.2,.8,.2,1);
}
.sensory-note[aria-hidden="false"] { opacity: 1; transform: none; }
.sensory-note small { display: block; color: rgba(241,199,124,.62); text-transform: uppercase; letter-spacing: .16em; font: 700 8px/1.2 system-ui,sans-serif; }
.sensory-note strong { display: block; margin: 3px 0 4px; font: 500 clamp(16px,2.2vw,23px)/1.05 Georgia,serif; }
.sensory-note p { margin: 0; font: 400 clamp(11px,1.6vw,14px)/1.42 Georgia,serif; }
.sensory-note--heart { left: calc(50% + min(210px, 24vw)); top: 38%; }
.sensory-note--breath { right: calc(50% + min(205px, 24vw)); top: 24%; text-align: right; }
.sensory-note--motion { right: calc(50% + min(205px, 24vw)); bottom: 18%; text-align: right; }
.sensory-folio__caption {
  position: absolute;
  z-index: 2;
  left: 50%;
  bottom: max(2vh, env(safe-area-inset-bottom));
  width: min(520px, 86vw);
  transform: translateX(-50%);
  color: rgba(241,226,201,.66);
  text-align: center;
  pointer-events: none;
}
.sensory-folio__caption > p:first-child { margin: 0 0 4px; text-transform: uppercase; letter-spacing: .15em; font: 700 8px/1.2 system-ui,sans-serif; color: rgba(232,194,132,.48); }
.sensory-folio__caption h2 { margin: 0 0 5px; font: 500 clamp(20px,3vw,30px)/1 Georgia,serif; color: rgba(245,230,204,.78); }
.sensory-folio__caption > p:last-child { margin: 0; font: 400 11px/1.4 system-ui,sans-serif; }
@media (max-width:720px) {
  .sensory-note { width: min(154px, 39vw); padding: 6px; }
  .sensory-note--heart { left: auto; right: 1%; top: 32%; }
  .sensory-note--breath { right: auto; left: 1%; top: 18%; text-align: left; }
  .sensory-note--motion { right: auto; left: 1%; bottom: 16%; text-align: left; }
  .sensory-folio__caption > p:last-child { display: none; }
}
@media (max-width:720px) {
  .cabinet-rail { left: 18px; right: 18px; }
  .cabinet-rail--upper { top: 112px; }
  .cabinet-rail--lower { bottom: max(98px, calc(env(safe-area-inset-bottom) + 82px)); }
  .cabinet-readout { bottom: max(142px, calc(env(safe-area-inset-bottom) + 126px)); }
  .cabinet-instrument > p { bottom: max(58px, calc(env(safe-area-inset-bottom) + 46px)); }
}

.cabinet-annotation.is-unavailable { opacity: 1 !important; filter: drop-shadow(0 0 10px rgba(242,190,102,.32)); }
.cabinet-annotation.is-unavailable small { color: rgba(245,207,143,.88); }

/* v0.9.3 ladder field calibration */
.cabinet-calibration-field { position:absolute; inset:0; z-index:19; pointer-events:none; overflow:hidden; opacity:0; transition:opacity .2s ease; }
.cabinet-calibration-field[aria-hidden="false"] { opacity:1; }
.calibration-axis { position:absolute; left:calc(var(--ladder-screen,50%) + var(--field-offset,0) * 8vw); top:8%; width:1px; height:84%; transform:translateX(-50%) rotate(calc(90deg - var(--cal-axis,84deg))); transform-origin:50% 50%; background:rgba(255,235,183,.9); box-shadow:0 0 12px rgba(255,197,91,.85); }
.calibration-field-feather,.calibration-contour { position:absolute; left:calc(var(--ladder-screen,50%) + var(--field-offset,0) * 8vw); top:10%; height:80%; transform:translateX(-50%) rotate(calc(90deg - var(--cal-axis,84deg))); transform-origin:50% 50%; }
.calibration-field-feather { width:calc(var(--field-outer) * 36vw); min-width:38px; border-radius:3px; background:linear-gradient(90deg,rgba(84,180,255,0),rgba(84,180,255,.07) 18%,rgba(255,166,92,.08) 50%,rgba(84,180,255,.07) 82%,rgba(84,180,255,0)); opacity:.78; }
.calibration-contour { border-left:1px dashed currentColor; border-right:1px dashed currentColor; }
.calibration-contour--inner { width:calc(var(--field-inner) * 36vw); min-width:18px; color:rgba(255,213,128,.95); opacity:.92; }
.calibration-contour--outer { width:calc(var(--field-outer) * 36vw); min-width:38px; color:rgba(102,205,255,.9); opacity:.68; }
.cabinet-calibration { position:absolute; z-index:42; left:8px; top:74px; width:300px; min-width:260px; min-height:260px; max-width:calc(100vw - 16px); max-height:calc(100vh - 16px); overflow:auto; resize:none; box-sizing:border-box; padding:14px 14px 20px; border:1px solid rgba(228,183,106,.28); border-radius:12px; background:rgba(12,9,7,var(--calibration-opacity,.94)); color:#ead8b8; box-shadow:0 18px 50px rgba(0,0,0,.5); font:600 10px/1.3 system-ui,sans-serif; opacity:0; visibility:hidden; pointer-events:none; transition:opacity .2s ease,visibility 0s linear .2s; touch-action:none; }
.cabinet-calibration[aria-hidden="false"] { opacity:1; visibility:visible; pointer-events:auto; transition-delay:0s; }
.cabinet-calibration header,.cabinet-calibration>div { display:flex; justify-content:space-between; align-items:center; gap:8px; }
.cabinet-calibration header { margin:-4px -4px 10px; padding:4px; font-size:12px; letter-spacing:.08em; text-transform:uppercase; cursor:grab; user-select:none; touch-action:none; }
.cabinet-calibration[data-manipulating=move] header { cursor:grabbing; }
.cabinet-calibration input,.cabinet-calibration button { touch-action:auto; }
.cabinet-calibration label { display:grid; grid-template-columns:1fr auto; gap:2px 8px; margin:8px 0; }
.cabinet-calibration label input { grid-column:1/-1; width:100%; accent-color:#d7a353; }
.cabinet-calibration output { font-family:ui-monospace,monospace; color:#fff1cf; }
.cabinet-calibration button { border:1px solid rgba(229,189,120,.28); border-radius:7px; padding:6px 9px; background:rgba(255,255,255,.04); color:inherit; }
.cabinet-calibration p { margin:10px 0; padding:7px; border-radius:6px; background:rgba(255,255,255,.035); font-family:ui-monospace,monospace; font-weight:500; }
.calibration-resize-handle { position:absolute; right:2px; bottom:2px; width:26px; height:26px; padding:0!important; border:0!important; background:linear-gradient(135deg,transparent 0 45%,rgba(234,216,184,.34) 46% 52%,transparent 53% 64%,rgba(234,216,184,.62) 65% 71%,transparent 72%)!important; cursor:nwse-resize; touch-action:none!important; }
@media(max-width:720px){.calibration-field-feather,.calibration-contour{max-width:84vw}}

.shelf-light-calibration { margin:10px 0; padding:9px 10px 10px; border:1px solid rgba(225,181,106,.22); border-radius:8px; }
.shelf-light-calibration legend { padding:0 5px; color:rgba(244,211,155,.82); font:700 9px/1.2 system-ui,sans-serif; text-transform:uppercase; letter-spacing:.12em; }
.shelf-light-calibration > button { width:100%; margin-top:7px; }

/* v0.11.2a — isolated cassette placement and hierarchy inspector */
#habitatCanvas.radio-inspecting { cursor: crosshair; }
.radio-calibration {
  --radio-panel-opacity: .94;
  position: absolute;
  z-index: 44;
  left: 16px;
  top: 88px;
  width: 322px;
  min-width: 284px;
  min-height: 390px;
  max-width: calc(100vw - 16px);
  max-height: calc(100vh - 16px);
  overflow: hidden;
  border: 1px solid rgba(228,183,106,.32);
  border-radius: 13px;
  background: rgba(12,9,7,var(--radio-panel-opacity));
  color: #ead8b8;
  box-shadow: 0 22px 58px rgba(0,0,0,.58);
  font: 600 10px/1.35 system-ui,sans-serif;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: none;
  touch-action: none;
}
.radio-calibration[aria-hidden="false"] {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: none;
}
.radio-calibration > header {
  min-height: 47px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 9px 10px 8px 12px;
  border-bottom: 1px solid rgba(228,183,106,.18);
  background: rgba(255,255,255,.025);
  cursor: grab;
  user-select: none;
  touch-action: none;
}
.radio-calibration > header:active { cursor: grabbing; }
.radio-calibration > header span { display: flex; min-width: 0; flex-direction: column; gap: 2px; }
.radio-calibration > header strong { font-size: 12px; letter-spacing: .075em; text-transform: uppercase; }
.radio-calibration > header small { color: rgba(234,216,184,.5); font: 500 8px/1.2 ui-monospace,monospace; letter-spacing: .03em; }
.radio-calibration button,
.radio-calibration select,
.radio-calibration input { touch-action: auto; }
.radio-calibration button,
.radio-calibration select {
  border: 1px solid rgba(229,189,120,.28);
  border-radius: 7px;
  padding: 6px 9px;
  background: rgba(255,255,255,.045);
  color: inherit;
  font: inherit;
}
.radio-calibration button:not(:disabled) { cursor: pointer; }
.radio-calibration button:hover:not(:disabled) { border-color: rgba(238,202,138,.58); background: rgba(255,255,255,.085); }
.radio-calibration button:disabled { opacity: .42; }
.radio-calibration__scroll {
  height: calc(100% - 47px);
  overflow: auto;
  padding: 10px 12px 20px;
  overscroll-behavior: contain;
  touch-action: pan-y;
  scrollbar-width: thin;
  scrollbar-color: rgba(215,163,83,.4) transparent;
}
.radio-calibration__summary,
.radio-calibration__status {
  margin: 0 0 10px;
  padding: 8px 9px;
  border-radius: 7px;
  background: rgba(255,255,255,.035);
  color: rgba(239,222,194,.72);
  font: 500 9px/1.45 ui-monospace,monospace;
}
.radio-calibration__status[data-kind="success"] { color: #f3dfb6; box-shadow: inset 2px 0 rgba(214,165,88,.68); }
.radio-calibration__status[data-kind="active"] { color: #fff0cc; box-shadow: inset 2px 0 rgba(240,198,119,.88); }
.radio-calibration__status[data-kind="error"] { color: #f0b5a7; box-shadow: inset 2px 0 rgba(218,113,89,.76); }
.radio-calibration fieldset {
  margin: 10px 0;
  padding: 9px 10px 10px;
  border: 1px solid rgba(225,181,106,.22);
  border-radius: 9px;
}
.radio-calibration legend {
  padding: 0 5px;
  color: rgba(244,211,155,.84);
  font: 700 9px/1.2 system-ui,sans-serif;
  text-transform: uppercase;
  letter-spacing: .12em;
}
.radio-calibration__hint {
  margin: 1px 0 9px;
  color: rgba(234,216,184,.53);
  font: 500 9px/1.42 system-ui,sans-serif;
}
.radio-calibration label {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 2px 8px;
  margin: 8px 0;
}
.radio-calibration label input[type="range"] {
  grid-column: 1 / -1;
  width: 100%;
  accent-color: #d7a353;
}
.radio-calibration output { color: #fff1cf; font-family: ui-monospace,monospace; font-variant-numeric: tabular-nums; }
.radio-calibration__actions,
.radio-calibration__footer {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 7px;
  margin-top: 8px;
}
.radio-calibration__footer { grid-template-columns: repeat(3,minmax(0,1fr)); margin-bottom: 4px; }
.radio-calibration__actions button,
.radio-calibration__footer button { min-width: 0; padding-inline: 5px; }
.radio-calibration__select { display: block!important; margin-top: 10px!important; }
.radio-calibration__select select { display: block; width: 100%; margin-top: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.radio-inspector-readout { margin: 9px 0; padding: 8px; border-radius: 7px; background: rgba(255,255,255,.025); font-weight: 500; }
.radio-inspector-readout div { display: grid; grid-template-columns: 48px minmax(0,1fr); gap: 7px; padding: 3px 0; }
.radio-inspector-readout dt { color: rgba(235,202,144,.65); text-transform: uppercase; letter-spacing: .08em; font-size: 8px; }
.radio-inspector-readout dd { min-width: 0; margin: 0; color: rgba(241,226,202,.78); overflow-wrap: anywhere; font: 500 8px/1.42 ui-monospace,monospace; user-select: text; }
.radio-calibration__shortcut { display: block; margin-top: 7px; color: rgba(234,216,184,.42); font-weight: 500; }
.radio-calibration__opacity { margin: 12px 2px!important; }
.radio-calibration__resize {
  position: absolute;
  right: 2px;
  bottom: 2px;
  width: 28px;
  height: 28px;
  padding: 0!important;
  border: 0!important;
  border-radius: 0 0 10px 0!important;
  background: linear-gradient(135deg,transparent 0 45%,rgba(234,216,184,.34) 46% 52%,transparent 53% 64%,rgba(234,216,184,.64) 65% 71%,transparent 72%)!important;
  cursor: nwse-resize!important;
  touch-action: none!important;
}
@media (max-width:720px) {
  .radio-calibration { max-width: calc(100vw - 12px); max-height: calc(100vh - 12px); }
  .radio-calibration__scroll { padding-inline: 10px; }
  .radio-calibration__footer { grid-template-columns: 1fr 1fr; }
  .radio-calibration__footer button:last-child { grid-column: 1 / -1; }
}


/* v0.11.2b — intimate desk transport. A restrained bakelite/brass rail language,
   intentionally separate from the removed ladder field calibration UI. */
.desk-transport { position: fixed; z-index: 24; left: 50%; bottom: max(74px,calc(env(safe-area-inset-bottom) + 58px)); width: min(430px,calc(100vw - 28px)); transform: translateX(-50%); color: #ead9bb; transition: opacity .42s ease, transform .55s cubic-bezier(.2,.75,.2,1); pointer-events: auto; }
.desk-transport[aria-hidden="true"] { opacity: 0; transform: translate(-50%,18px); pointer-events: none; }
.desk-transport__plate { display: grid; grid-template-columns: auto auto 1fr; align-items: center; gap: 14px; padding: 10px 13px; border: 1px solid rgba(220,174,99,.34); border-radius: 9px; background: linear-gradient(180deg,rgba(62,43,29,.93),rgba(27,19,15,.96)); box-shadow: 0 12px 38px rgba(0,0,0,.34), inset 0 1px rgba(255,230,185,.08); backdrop-filter: blur(10px); }
.desk-transport__brand { font: 600 9px/1 ui-monospace,monospace; letter-spacing: .16em; color: rgba(233,204,151,.68); white-space: nowrap; }
.desk-transport__buttons { display: flex; gap: 5px; }
.desk-transport button { width: 35px; height: 29px; border: 1px solid rgba(220,174,99,.35); border-radius: 4px; color: #f1dfbd; background: linear-gradient(#4f3526,#2e211a); box-shadow: inset 0 1px rgba(255,255,255,.07),0 2px 4px rgba(0,0,0,.3); font: 650 13px/1 ui-monospace,monospace; }
.desk-transport button:active { transform: translateY(1px); box-shadow: inset 0 2px 4px rgba(0,0,0,.35); }
.desk-transport__volume { display: grid; grid-template-columns: auto 1fr 24px; align-items: center; gap: 8px; min-width: 0; font: 600 8px/1 ui-monospace,monospace; letter-spacing: .12em; color: rgba(235,209,163,.66); }
.desk-transport__volume input { width: 100%; accent-color: #c69754; }
.desk-transport__volume output { text-align: right; color: #f4deb7; font-variant-numeric: tabular-nums; }
.desk-transport > p { margin: 5px 12px 0; text-align: center; color: rgba(232,210,176,.52); font: 500 8px/1.3 ui-monospace,monospace; letter-spacing: .1em; text-transform: uppercase; }
@media (max-width:560px) { .desk-transport__plate { grid-template-columns: 1fr auto; gap: 8px 10px; } .desk-transport__brand { grid-column: 1; } .desk-transport__buttons { grid-column: 2; grid-row: 1; } .desk-transport__volume { grid-column: 1 / -1; } }

/* v0.11.2k: calibrated cassette/desk/lamp tools retired; globe-only calibration remains. */
.legacy-desk-tools, .legacy-desk-tools-panel { display: none !important; }
.globe-calibration { z-index: 62; }

/* v0.11.2o — restrained listening readout and tape-change feedback. */
.desk-transport__readout { display:grid; grid-template-columns:1fr auto; align-items:center; gap:5px 10px; margin:6px 12px 0; color:rgba(232,210,176,.58); font:500 8px/1.25 ui-monospace,monospace; letter-spacing:.09em; text-transform:uppercase; }
.desk-transport__readout p { grid-column:1 / -1; margin:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; text-align:center; }
.desk-transport__timeline { height:2px; overflow:hidden; border-radius:999px; background:rgba(235,207,160,.14); box-shadow:inset 0 1px 1px rgba(0,0,0,.32); }
.desk-transport__timeline span { display:block; width:100%; height:100%; transform:scaleX(0); transform-origin:left center; background:linear-gradient(90deg,rgba(201,151,82,.58),rgba(238,203,145,.9)); transition:transform .22s linear; }
#radioTimeReadout { min-width:62px; text-align:right; color:rgba(238,218,184,.62); font-variant-numeric:tabular-nums; }
.desk-transport button.is-playing { box-shadow:inset 0 1px rgba(255,255,255,.08),0 0 0 1px rgba(215,168,96,.08),0 2px 4px rgba(0,0,0,.3); }
@media (max-width:560px) { .desk-transport__readout { margin-top:4px; } }
/* v0.11.2p — physical cassette selection ritual */
.desk-transport__buttons{flex-wrap:nowrap}.desk-transport__buttons button#radioEject{width:42px;font-size:9px;letter-spacing:.08em}.desk-transport.is-selecting .desk-transport__plate{box-shadow:0 12px 38px rgba(0,0,0,.34),inset 0 1px rgba(255,230,185,.08),0 0 28px rgba(198,151,84,.08)}
@media(max-width:560px){.desk-transport button{width:32px}.desk-transport__buttons button#radioEject{width:39px}}

/* v0.11.2q — cassette layout calibration and lifted transport */
.desk-transport{bottom:max(122px,calc(env(safe-area-inset-bottom) + 106px));}
.tape-layout-button{display:block!important;}
.tape-layout-panel{--panel-opacity:.76;position:fixed;z-index:70;right:12px;top:82px;width:min(330px,calc(100vw - 28px));height:min(58vh,560px);min-width:276px;min-height:260px;max-width:calc(100vw - 20px);max-height:calc(100vh - 94px);overflow:hidden;color:#ead9bb;border:1px solid rgba(220,174,99,.38);border-radius:14px;background:rgba(27,19,15,var(--panel-opacity));box-shadow:0 12px 34px rgba(0,0,0,.28);backdrop-filter:none;}
.tape-layout-panel[aria-hidden="true"]{display:none;}
.tape-layout-panel>header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid rgba(220,174,99,.22);font:700 12px/1 ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;}
.tape-layout-panel button,.tape-layout-panel select{color:#ead9bb;border:1px solid rgba(220,174,99,.32);border-radius:8px;background:rgba(61,42,28,.82);padding:8px 10px;}
.tape-layout-panel__body{height:calc(100% - 49px);overflow-y:scroll;overflow-x:hidden;scrollbar-gutter:stable;padding:12px 18px 18px 14px;overscroll-behavior:contain;}
.tape-layout-panel__body::-webkit-scrollbar{width:10px;}
.tape-layout-panel__body::-webkit-scrollbar-track{background:rgba(255,255,255,.045);border-radius:8px;}
.tape-layout-panel__body::-webkit-scrollbar-thumb{background:rgba(213,166,91,.42);border:2px solid transparent;background-clip:padding-box;border-radius:8px;}
.tape-layout-panel__body>p{margin:0 0 12px;color:rgba(234,217,187,.72);font:500 11px/1.45 system-ui,sans-serif;}
.tape-layout-panel__select{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:10px;margin-bottom:10px;font:700 11px/1 ui-monospace,monospace;text-transform:uppercase;letter-spacing:.09em;}
.tape-layout-opacity{display:grid;grid-template-columns:1fr auto;gap:5px 10px;align-items:center;margin:0 0 12px;font:600 11px/1.2 system-ui,sans-serif;}
.tape-layout-opacity output{font:600 11px/1 ui-monospace,monospace;color:#f1d7a8;}
.tape-layout-opacity input{grid-column:1/-1;width:100%;accent-color:#c69754;}
.tape-layout-preview-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin:0 0 10px;}
.tape-layout-preview-row--three{grid-template-columns:1fr 1fr;}
.tape-layout-preview-row--three button:last-child{grid-column:1/-1;}
.tape-layout-preview-row button{min-width:0;padding-inline:6px;font-size:10px;}
.tape-layout-preview-row button.is-active{background:rgba(194,143,73,.48);border-color:rgba(235,194,127,.72);box-shadow:inset 0 0 0 1px rgba(255,232,190,.08);}
.tape-layout-status{margin:0 0 10px;padding:8px 9px;border-left:2px solid rgba(213,166,91,.55);background:rgba(255,255,255,.035);color:rgba(234,217,187,.7);font:500 10px/1.4 system-ui,sans-serif;}
.tape-layout-simple-section{margin:10px 0;border:1px solid rgba(220,174,99,.18);border-radius:10px;padding:9px;}
.tape-layout-simple-section h3{margin:0 0 10px;color:rgba(241,215,168,.86);font:700 10px/1.25 ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase;}
.tape-layout-simple-section [data-controls]{display:grid;gap:9px;}
.tape-layout-simple-section [data-controls]>label{display:grid;grid-template-columns:1fr auto;gap:5px 10px;align-items:center;font:600 11px/1.2 system-ui,sans-serif;}
.tape-layout-simple-section output{font:600 11px/1 ui-monospace,monospace;color:#f1d7a8;}
.tape-layout-simple-section input{grid-column:1/-1;width:100%;accent-color:#c69754;}
.tape-layout-panel footer{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px;}
.tape-layout-resize{position:absolute;left:0;bottom:0;width:28px;height:28px;cursor:nesw-resize;touch-action:none;background:linear-gradient(135deg,transparent 42%,rgba(224,183,111,.52) 43% 49%,transparent 50% 60%,rgba(224,183,111,.7) 61% 67%,transparent 68%);}
@media(max-width:560px){.desk-transport{bottom:max(138px,calc(env(safe-area-inset-bottom) + 120px));}.tape-layout-panel{top:76px;right:8px;width:min(318px,calc(100vw - 24px));height:min(54vh,500px);max-height:calc(100vh - 88px);}.tape-layout-panel__body{padding-right:16px;}}


.tape-layout-snap{width:100%;margin:8px 0 2px;padding:9px 10px;border:1px solid rgba(224,181,112,.5);border-radius:8px;background:rgba(92,55,28,.42);color:#f4dfba;font:700 11px/1.2 system-ui,sans-serif;letter-spacing:.03em;}
.tape-layout-snap:active{transform:translateY(1px);}

/* v0.11.2ab — crisp transparent cassette diagnostics. */
.tape-camera-mode{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:center;margin:0 0 12px;font:700 10px/1 ui-monospace,monospace;letter-spacing:.09em;text-transform:uppercase;}
.tape-camera-mode>div{display:grid;grid-template-columns:1fr 1fr;gap:6px;}
.tape-camera-mode button{min-width:0;padding:7px 6px;font-size:9px;}
.tape-camera-mode button.is-active{background:rgba(194,143,73,.5);border-color:rgba(235,194,127,.76);}

/* v0.11.2ac — application-ready launch layer */
.launch-hidden,.legacy-desk-tools-panel{display:none!important}
.launch-intro{position:fixed;z-index:34;left:max(18px,env(safe-area-inset-left));bottom:max(22px,calc(env(safe-area-inset-bottom) + 18px));width:min(430px,calc(100vw - 36px));padding:20px 21px 18px;border:1px solid rgba(233,203,151,.24);border-radius:14px;background:rgba(25,18,13,.88);box-shadow:0 18px 70px rgba(0,0,0,.3);color:#f2e4cb;transition:opacity .45s ease,transform .45s ease;backdrop-filter:none}
.launch-intro[aria-hidden="true"]{opacity:0;transform:translateY(16px);pointer-events:none}
.launch-intro__kicker{margin:0 0 8px;color:#ddb878;font:700 9px/1.2 system-ui,sans-serif;letter-spacing:.15em;text-transform:uppercase}
.launch-intro h2{margin:0;font:500 clamp(22px,4vw,34px)/1.05 Georgia,serif;letter-spacing:-.025em}
.launch-intro>p:not(.launch-intro__kicker){margin:11px 0 16px;color:rgba(242,228,203,.72);font:500 13px/1.55 system-ui,sans-serif}
.launch-intro__actions{display:flex;gap:8px;flex-wrap:wrap}.launch-intro button,.portfolio-drawer button{border:1px solid rgba(225,184,113,.28);border-radius:8px;background:rgba(255,255,255,.045);color:#f5e6ca;padding:9px 12px;font:650 10px/1 system-ui,sans-serif;letter-spacing:.07em;text-transform:uppercase}.launch-intro__actions button:first-child{background:#d8ae68;color:#21170f;border-color:transparent}
.portfolio-drawer{position:fixed;z-index:70;right:max(12px,env(safe-area-inset-right));top:max(76px,calc(env(safe-area-inset-top) + 68px));bottom:max(12px,env(safe-area-inset-bottom));width:min(430px,calc(100vw - 24px));display:flex;flex-direction:column;border:1px solid rgba(229,190,122,.25);border-radius:14px;background:rgba(24,17,12,.96);color:#f1e1c5;box-shadow:0 22px 90px rgba(0,0,0,.46);transition:opacity .28s ease,transform .32s ease;backdrop-filter:none}
.portfolio-drawer[aria-hidden="true"]{opacity:0;transform:translateX(24px);pointer-events:none}.portfolio-drawer>header{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:15px 16px 12px;border-bottom:1px solid rgba(229,190,122,.16)}.portfolio-drawer>header div{display:flex;flex-direction:column;gap:3px}.portfolio-drawer>header small{color:#cfa765;font:700 8px/1 system-ui;letter-spacing:.16em}.portfolio-drawer>header strong{font:600 14px/1.25 system-ui}
.portfolio-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;padding:9px 12px}.portfolio-tabs button.is-active{background:rgba(216,174,104,.18);border-color:rgba(216,174,104,.55)}.portfolio-drawer__scroll{overflow-y:auto;scrollbar-gutter:stable;padding:4px 14px 18px}.portfolio-pane{display:none}.portfolio-pane.is-active{display:block}.project-card{padding:16px 2px 17px;border-bottom:1px solid rgba(229,190,122,.14)}.project-card small{color:#cba666;font:700 8px/1.25 system-ui;letter-spacing:.12em;text-transform:uppercase}.project-card h3{margin:6px 0 7px;font:500 24px/1.05 Georgia,serif}.project-card p,.portfolio-pane>p{margin:0 0 13px;color:rgba(241,225,197,.72);font:500 12px/1.6 system-ui}.project-card button{padding:8px 10px}.portfolio-lede{color:#f3dfba!important;font:500 23px/1.22 Georgia,serif!important}.portfolio-facts{margin:18px 0 0}.portfolio-facts div{padding:10px 0;border-top:1px solid rgba(229,190,122,.14)}.portfolio-facts dt{color:#cfa765;font:700 8px/1.2 system-ui;letter-spacing:.13em;text-transform:uppercase}.portfolio-facts dd{margin:5px 0 0;font:500 12px/1.5 system-ui;color:rgba(241,225,197,.78)}.contact-note{display:flex;flex-direction:column;gap:5px;padding:13px;border:1px solid rgba(225,184,113,.2);border-radius:9px;background:rgba(255,255,255,.03);font:500 11px/1.45 system-ui}.contact-note strong{color:#ddb878;text-transform:uppercase;letter-spacing:.1em;font-size:8px}
@media(max-width:720px){.masthead>div:first-child span{display:none}.launch-intro{bottom:max(18px,calc(env(safe-area-inset-bottom) + 12px));padding:17px}.launch-intro h2{font-size:25px}.portfolio-drawer{top:max(62px,calc(env(safe-area-inset-top) + 58px))}.time-cycle{margin-top:9px}}


/* v0.11.2ad — launch sound glyph and stepped lamp polish */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.sound-glyph-button{display:inline-grid!important;place-items:center;min-width:36px;min-height:34px;padding:7px 9px!important}
.sound-glyph{display:block;font-size:16px;line-height:1;filter:saturate(.35);transform:translateY(-.5px)}
.sound-glyph-button[aria-pressed="true"] .sound-glyph{filter:none}
.launch-sound-button{flex:0 0 38px;border-color:rgba(225,184,113,.36)!important;background:rgba(255,255,255,.04)!important;color:#f5e6ca!important}

/* Public launch: calibration remains in code but is not exposed. */
.tape-layout-button,.tape-layout-panel{display:none!important}

/* v0.11.2ae — launch visual integration */
.header-actions #soundButton.launch-sound-button{min-width:38px;min-height:38px;padding:7px!important;border-color:rgba(225,184,113,.36)!important;background:rgba(255,255,255,.04)!important}
.header-actions #soundButton.launch-sound-button[aria-pressed="true"]{background:rgba(216,174,104,.16)!important;border-color:rgba(225,184,113,.62)!important}
@media(max-width:720px){.masthead .time-cycle{margin-top:8px}.time-button{min-width:46px;min-height:31px;padding:6px 9px;font-size:10px}}


/* v0.11.2af — centred time control and unified sound glyph. */
.masthead .time-cycle{
  position:absolute;
  left:50%;
  top:58px;
  transform:translateX(-50%);
  margin-top:0;
}
.header-actions #soundButton.launch-sound-button{
  width:38px;
  height:38px;
  min-width:38px;
  min-height:38px;
  padding:0!important;
  border-radius:8px!important;
  border:1px solid rgba(225,184,113,.36)!important;
  background:rgba(255,255,255,.04)!important;
  box-shadow:none;
}
.header-actions #soundButton.launch-sound-button:hover{
  background:rgba(255,255,255,.085)!important;
}
@media(max-width:720px){
  .masthead .time-cycle{top:52px;margin-top:0}
}

/* v0.11.2ag — shared sound glyph, cabinet continuity and deeper practical light. */
.sound-glyph{width:18px;height:18px;display:grid;place-items:center;filter:none!important;transform:none!important}
.sound-glyph svg{width:18px;height:18px;overflow:visible;fill:currentColor;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.sound-glyph .sound-wave,.sound-glyph .sound-slash{fill:none}
.sound-glyph-button[aria-pressed="false"] .sound-wave{opacity:0}
.sound-glyph-button[aria-pressed="true"] .sound-slash{opacity:0}
.sound-glyph-button.sound-needs-attention,.sound-glyph-button.sound-muted-playing{animation:soundGlyphBeacon 1.15s ease-in-out infinite;border-color:rgba(255,194,102,.8)!important;box-shadow:0 0 0 1px rgba(255,190,93,.18),0 0 22px rgba(255,156,55,.35)}
.sound-glyph-button.sound-needs-attention{animation-iteration-count:2}
@keyframes soundGlyphBeacon{0%,100%{transform:scale(1);color:#f2dfbd}50%{transform:scale(1.08);color:#ffd28a}}
.cabinet-instrument[aria-hidden="false"]{z-index:26}
.cabinet-reader[aria-hidden="false"]{z-index:24}

.cassette-sound-button{position:absolute;right:10px;top:8px;z-index:3;min-width:36px!important;min-height:34px!important}.desk-transport__plate{position:relative}.window-glass{backdrop-filter:none!important}


/* v0.11.2an — final launch performance, clear window and compact tape readout. */
.sound-glyph,.sound-glyph svg{display:block!important;width:18px!important;height:18px!important;opacity:1!important;visibility:visible!important;color:#f2dfbd!important;position:relative;z-index:2}
.sound-glyph svg path{vector-effect:non-scaling-stroke}
.header-actions #soundButton{overflow:visible!important}
.cassette-sound-button{top:-48px!important;right:4px!important;width:38px!important;height:38px!important}
.desk-transport__plate{padding-bottom:12px}
.desk-transport__readout{margin-top:10px;padding-top:9px;border-top:1px solid rgba(224,181,112,.14)}
.desk-transport__readout p{margin:0 0 7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:rgba(235,211,173,.7);font:600 9px/1.2 ui-monospace,monospace;letter-spacing:.09em;text-transform:uppercase}
.desk-transport__timeline-row{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center}
.desk-transport__timeline-row output{font:600 9px/1 ui-monospace,monospace;color:rgba(235,211,173,.68);white-space:nowrap}
.window-glass{opacity:.018!important}
@media(max-width:560px){.desk-transport{bottom:max(118px,calc(env(safe-area-inset-bottom) + 102px));}.cassette-sound-button{top:-45px!important;right:2px!important}.desk-transport__readout p{font-size:8px}}

/* v0.11.2ao — keep the folio compositing cheap on mobile. */
.cabinet-reader{contain:layout paint style;background:rgba(3,3,4,.12)}
.cabinet-reader[aria-hidden="false"]{will-change:opacity}
@media(max-width:760px){.sensory-hotspot{box-shadow:0 0 0 4px rgba(244,199,111,.18),0 0 22px rgba(244,199,111,.72)}.sensory-hotspot.is-pinned{animation:none}}


/* v0.11.2au-r5 — shared three-bay cabinet backlight calibration. */


/* v0.11.2aw — shared browse, dwell and expand folio grammar */
.sensory-folio { filter:none; align-items:center; padding:4vh 0 24vh; box-sizing:border-box; }
.sensory-folio__art { width:min(90vw, calc(60vh * 1.7778)); aspect-ratio:16/9; overflow:hidden; border-radius:14px; background:rgba(8,7,7,.35); box-shadow:0 18px 60px rgba(0,0,0,.3); }
.sensory-folio[data-project="sensory"] .sensory-folio__art { width:min(88vw, calc(60vh * 1.3333)); aspect-ratio:4/3; }
.sensory-folio__art > img { display:block; width:100%; height:100%; object-fit:cover; user-select:none; -webkit-user-drag:none; }
.sensory-hotspot { width:28px; height:28px; margin:-14px 0 0 -14px; border-width:2px; opacity:.72; box-shadow:0 0 0 4px rgba(244,199,111,.16),0 0 18px rgba(244,199,111,.46),0 0 36px rgba(244,199,111,.18),inset 0 0 8px rgba(255,251,235,.62); }
.sensory-hotspot.is-active { transform:scale(1.24); opacity:.96; box-shadow:0 0 0 7px rgba(244,199,111,.08),0 0 24px rgba(255,213,126,.72),0 0 46px rgba(244,199,111,.24),inset 0 0 9px rgba(255,255,245,.88); }
.sensory-note,.sensory-folio__caption { display:none !important; }
.folio-textbox { position:absolute; z-index:8; left:50%; bottom:max(2.2vh,env(safe-area-inset-bottom)); width:min(680px,90vw); transform:translateX(-50%); box-sizing:border-box; padding:15px 18px 12px; border:1px solid rgba(229,192,132,.25); border-radius:18px; background:rgba(12,9,8,.84); color:rgba(244,229,204,.82); backdrop-filter:blur(15px); text-align:left; transition:min-height 620ms cubic-bezier(.2,.8,.2,1),padding 620ms cubic-bezier(.2,.8,.2,1),background 420ms ease; }
.folio-textbox__kicker { margin:0 0 4px; text-transform:uppercase; letter-spacing:.15em; font:700 8px/1.2 system-ui,sans-serif; color:rgba(232,194,132,.62); }
.folio-textbox h2 { margin:0 0 8px; font:500 clamp(21px,3vw,31px)/1 Georgia,serif; color:rgba(248,234,211,.92); }
.folio-textbox__page-line { display:flex; justify-content:space-between; gap:16px; color:rgba(241,199,124,.82); text-transform:uppercase; letter-spacing:.12em; font:700 9px/1.2 system-ui,sans-serif; }
.folio-textbox__summary { margin:8px 0 10px; font:400 clamp(13px,1.8vw,16px)/1.45 Georgia,serif; }
.folio-textbox__detail { display:grid; grid-template-rows:0fr; opacity:0; transition:grid-template-rows 620ms cubic-bezier(.2,.8,.2,1),opacity 420ms ease 40ms; }
.folio-textbox__detail > p { overflow:hidden; margin:0; font:400 12px/1.55 system-ui,sans-serif; color:rgba(237,220,191,.68); }
.is-detail-expanded .folio-textbox__detail { grid-template-rows:1fr; opacity:1; }
.folio-textbox__controls { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:10px; margin-top:8px; }
.folio-textbox__controls button { min-height:38px; border:1px solid rgba(235,201,147,.24); border-radius:999px; background:rgba(31,23,18,.55); color:rgba(247,229,198,.78); padding:8px 14px; font:650 10px/1 system-ui,sans-serif; text-transform:uppercase; letter-spacing:.1em; cursor:pointer; }
#folioNext { text-align:right; } #folioPrevious { text-align:left; }
#folioExpand { width:40px; padding:7px; font-size:20px; transition:transform 400ms ease; }
.is-detail-expanded #folioExpand { transform:rotate(180deg); }
.folio-dwell { display:none; }
.folio-dwell span { display:block; width:100%; height:100%; background:rgba(241,199,124,.72); transform:scaleX(0); transform-origin:left; }
.folio-textbox.is-immediate,.folio-textbox.is-immediate * { transition-duration:160ms !important; }
@media(max-width:720px){
 .sensory-folio{padding:8vh 0 32vh}.sensory-folio__art{width:94vw}.sensory-folio[data-project="sensory"] .sensory-folio__art{width:92vw}.folio-textbox{width:92vw;padding:13px 14px 10px}.folio-textbox__controls button{min-height:40px}.sensory-hotspot{width:28px;height:28px;margin:-14px 0 0 -14px}
}


/* v0.11.2ax — clean shared folio handoff and raised portrait reading layout */
@media (max-width:720px) and (orientation:portrait) {
  .sensory-folio {
    place-items:start center;
    padding:17vh 0 0;
  }
  .sensory-folio__art,
  .sensory-folio[data-project="sensory"] .sensory-folio__art {
    width:92vw;
    max-height:39vh;
  }
  .folio-textbox {
    bottom:max(11vh, calc(env(safe-area-inset-bottom) + 82px));
    width:92vw;
    max-height:41vh;
    padding:12px 14px 10px;
  }
  .folio-textbox h2 { margin-bottom:6px; }
  .folio-textbox__summary { margin:6px 0 8px; }
  .folio-textbox__detail > p { max-height:15vh; overflow:auto; }
  .folio-textbox__controls { margin-top:6px; }
}


/* v0.11.2ay — compact mobile folio chrome and genuine touch dwell */
.app[data-cabinet-reader="opening"] .instruction,
.app[data-cabinet-reader="opening"] .focus-transfer,
.app[data-cabinet-reader="opening"] .close-controls,
.app[data-cabinet-reader="opening"] .cabinet-instrument,
.app[data-cabinet-reader="open"] .instruction,
.app[data-cabinet-reader="open"] .focus-transfer,
.app[data-cabinet-reader="open"] .close-controls,
.app[data-cabinet-reader="open"] .cabinet-instrument {
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

.sensory-hotspot { touch-action:none; }

@media (max-width:720px) and (orientation:portrait) {
  .cabinet-reader {
    background:rgba(3,3,4,.34);
    backdrop-filter:blur(2px);
  }
  .cabinet-reader__close {
    top:calc(env(safe-area-inset-top) + 10px);
    left:12px;
    right:auto;
    min-height:38px;
    padding:8px 14px;
    border-radius:999px;
    background:rgba(12,9,8,.82);
    backdrop-filter:blur(12px);
    font-size:10px;
    letter-spacing:.09em;
  }
  .sensory-folio {
    display:grid;
    grid-template-rows:minmax(0,1fr) auto;
    align-content:stretch;
    gap:10px;
    height:100%;
    padding:13vh 0 max(1.5vh,env(safe-area-inset-bottom));
  }
  .sensory-folio__art,
  .sensory-folio[data-project="sensory"] .sensory-folio__art {
    position:relative;
    align-self:center;
    width:92vw;
    max-height:43vh;
    margin:0 auto;
  }
  .folio-textbox {
    position:relative;
    left:auto;
    bottom:auto;
    transform:none;
    width:92vw;
    max-height:min(38vh,330px);
    margin:0 auto;
    padding:11px 12px 9px;
    border-radius:16px;
    overflow:auto;
    overscroll-behavior:contain;
  }
  .folio-textbox__kicker { margin-bottom:3px; font-size:7px; }
  .folio-textbox h2 { margin:0 0 5px; font-size:clamp(20px,7vw,28px); }
  .folio-textbox__page-line { font-size:8px; }
  .folio-textbox__summary { margin:5px 0 7px; font-size:14px; line-height:1.34; }
  .folio-textbox__detail > p { max-height:11vh; overflow:auto; font-size:11px; line-height:1.45; }
  .folio-textbox__controls {
    position:sticky;
    bottom:-9px;
    z-index:2;
    grid-template-columns:1fr 42px 1fr;
    gap:7px;
    margin:7px -2px 0;
    padding:5px 2px 2px;
    background:linear-gradient(to bottom,rgba(12,9,8,0),rgba(12,9,8,.98) 30%);
  }
  .folio-textbox__controls button {
    min-height:38px;
    padding:7px 10px;
    font-size:9px;
  }
  #folioExpand { width:42px; }
  .folio-dwell { left:12px; right:12px; }
}

/* v0.11.2az — centred project media and true cover framing */
.sensory-folio[data-project="vp"] .sensory-folio__art,
.sensory-folio[data-project="dawn"] .sensory-folio__art,
.sensory-folio[data-project="room-show"] .sensory-folio__art {
  width:min(96vw, 1360px);
  max-width:96vw;
  margin-inline:auto;
  aspect-ratio:16 / 9;
  background:transparent;
}
.sensory-folio[data-project="vp"] .sensory-folio__art > img,
.sensory-folio[data-project="dawn"] .sensory-folio__art > img,
.sensory-folio[data-project="room-show"] .sensory-folio__art > img {
  object-fit:cover;
  object-position:50% 50%;
  transform:none;
}
@media (max-width:720px) and (orientation:portrait) {
  .sensory-folio[data-project="vp"] .sensory-folio__art,
  .sensory-folio[data-project="dawn"] .sensory-folio__art,
  .sensory-folio[data-project="room-show"] .sensory-folio__art {
    width:100vw;
    max-width:100vw;
    height:auto;
    max-height:none;
    align-self:center;
  }
}

/* v0.11.2ba — shared spatial folio points and uninterrupted touch dwell */
.project-hotspot { display:block; touch-action:none; }
.project-hotspot[hidden] { display:none !important; }
.sensory-folio[data-project="vp"] .project-hotspot,
.sensory-folio[data-project="dawn"] .project-hotspot,
.sensory-folio[data-project="room-show"] .project-hotspot {
  opacity:.64;
  transform:scale(calc(.9 + var(--proximity) * .22));
}
.sensory-folio[data-project="vp"] .project-hotspot.is-active,
.sensory-folio[data-project="dawn"] .project-hotspot.is-active,
.sensory-folio[data-project="room-show"] .project-hotspot.is-active {
  opacity:.92;
}

/* v0.11.2bb — progressive attention reveal and lightweight folio magnifier */
.folio-textbox {
  --folio-progress:0;
  background:rgba(12,9,8,var(--folio-panel-alpha,.80));
  padding-bottom:calc(12px + var(--folio-extra-padding,0px));
}
.folio-textbox__detail {
  display:block;
  max-height:var(--folio-detail-height,0px);
  opacity:var(--folio-progress,0);
  transform:translateY(calc((1 - var(--folio-progress,0)) * -5px));
  overflow:hidden;
  transition:max-height 1050ms cubic-bezier(.2,.8,.2,1),opacity 820ms ease,transform 1050ms cubic-bezier(.2,.8,.2,1);
}
.folio-textbox__detail > p {
  overflow:hidden;
}
.is-detail-expanded .folio-textbox__detail {
  max-height:190px;
  opacity:1;
  transform:none;
}
.folio-textbox__summary {
  opacity:var(--folio-summary-opacity,.82);
}

.folio-magnifier-button {
  position:absolute;
  z-index:16;
  top:10px;
  right:10px;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border:1px solid rgba(244,214,163,.42);
  border-radius:999px;
  background:rgba(12,9,8,.72);
  color:rgba(250,232,201,.92);
  box-shadow:0 7px 24px rgba(0,0,0,.28);
  backdrop-filter:blur(10px);
  font:500 25px/1 Georgia,serif;
  cursor:grab;
  touch-action:none;
  user-select:none;
}
.folio-magnifier-button:active { cursor:grabbing; }
.folio-magnifier-lens {
  position:fixed;
  z-index:40;
  left:calc(100% - 31px);
  top:31px;
  width:333px;
  height:333px;
  overflow:hidden;
  border:2px solid rgba(255,231,184,.78);
  border-radius:50%;
  background:rgba(8,7,7,.92);
  box-shadow:0 12px 34px rgba(0,0,0,.42),0 0 0 5px rgba(244,199,111,.12);
  pointer-events:none;
  opacity:0;
  transform:translate(-50%,-50%) scale(.25);
  transition:opacity 180ms ease,transform 180ms ease,left 80ms linear,top 80ms linear;
}
.folio-magnifier-lens > img {
  position:absolute;
  max-width:none;
  object-fit:fill;
  pointer-events:none;
}
.sensory-folio__art.is-magnifying > #cabinetReaderCoverImage {
  filter:blur(3px) brightness(.72) saturate(.82);
  transition:filter 280ms ease;
}
.sensory-folio__art:not(.is-magnifying) > #cabinetReaderCoverImage {
  transition:filter 420ms ease;
}
.sensory-folio__art > #cabinetReaderCoverImage {
  opacity:1;
  transition:opacity 520ms ease, filter 520ms ease, transform 520ms ease;
}
.sensory-folio__art.is-image-fading > #cabinetReaderCoverImage {
  opacity:.02;
  transform:scale(1.012);
}
.sensory-folio__art.is-magnifying .folio-magnifier-lens {
  opacity:1;
  transform:translate(-50%,-50%) scale(1);
}
.sensory-folio__art.is-magnifier-returning .folio-magnifier-lens {
  opacity:0;
  transform:translate(-50%,-50%) scale(.24);
  transition:opacity 680ms ease,transform 680ms cubic-bezier(.2,.75,.2,1),left 680ms cubic-bezier(.2,.75,.2,1),top 680ms cubic-bezier(.2,.75,.2,1);
}
@media (max-width:720px) and (orientation:portrait) {
  .folio-textbox { padding-bottom:calc(9px + var(--folio-extra-padding,0px)); }
  .folio-textbox__detail { max-height:var(--folio-detail-height-mobile,0px); }
  .is-detail-expanded .folio-textbox__detail { max-height:118px; }
  .folio-magnifier-button { top:8px; right:8px; width:40px; height:40px; font-size:23px; }
  .folio-magnifier-lens { width:297px; height:297px; }
}
@media (prefers-reduced-motion:reduce) {
  .folio-magnifier-lens { transition-duration:80ms !important; }
}


/* v0.11.2bd — committed dwell trace and free-travel magnifier */
.folio-textbox { position:relative; isolation:isolate; }
.folio-intent-trace {
  position:absolute;
  z-index:0;
  inset:-2px;
  width:calc(100% + 4px);
  height:calc(100% + 4px);
  overflow:visible;
  pointer-events:none;
  opacity:calc(.12 + var(--folio-trace-progress,var(--folio-progress,0)) * .96);
  filter:drop-shadow(0 0 7px rgba(244,199,111,.28));
}
.folio-intent-trace path {
  fill:none;
  stroke:rgba(248,214,153,.88);
  stroke-width:1.5;
  vector-effect:non-scaling-stroke;
  stroke-linecap:round;
  stroke-dasharray:1;
  stroke-dashoffset:calc(1 - var(--folio-trace-progress,var(--folio-progress,0)));
}
.folio-textbox > :not(.folio-intent-trace) { position:relative; z-index:1; }
.folio-magnifier-lens { position:fixed; z-index:40; }
@media (prefers-reduced-motion:reduce) {
  .folio-intent-trace path { stroke-dashoffset:0; }
}
.sensory-folio__art.is-magnifying { overflow:visible; }


/* v0.11.2bk — launch cross-fade and clear dwell commitment */
.sensory-folio__art > #cabinetReaderPreviousImage,
.sensory-folio__art > #cabinetReaderCoverImage {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:50% 50%;
}
.sensory-folio__art > #cabinetReaderPreviousImage {
  z-index:0;
  opacity:0;
  pointer-events:none;
  transition:opacity 1250ms cubic-bezier(.22,.61,.36,1), filter 1250ms ease, transform 1250ms ease;
}
.sensory-folio__art > #cabinetReaderPreviousImage.is-visible { opacity:1; }
.sensory-folio__art > #cabinetReaderPreviousImage.is-fading-out { opacity:0; filter:brightness(.9); transform:scale(.992); }
.sensory-folio__art > #cabinetReaderCoverImage {
  z-index:1;
  opacity:1;
  transition:opacity 1250ms cubic-bezier(.22,.61,.36,1), filter 900ms ease, transform 1250ms ease;
}
.sensory-folio__art > #cabinetReaderCoverImage.is-entering { opacity:0; transform:scale(1.012); }
.sensory-folio__art.is-crossfading > #cabinetReaderPreviousImage.is-fading-out { opacity:0; filter:brightness(.9); transform:scale(.992); }
.sensory-folio__art.is-crossfading > #cabinetReaderCoverImage { opacity:1; transform:none; }
.sensory-hotspot,.project-hotspot,.folio-magnifier-button,.folio-magnifier-lens { z-index:4; }

.folio-intent-trace {
  opacity:calc(.03 + var(--folio-trace-progress,var(--folio-progress,0)) * .97);
  transition:opacity 260ms ease, filter 300ms ease;
}
.folio-intent-trace path {
  stroke:rgba(248,216,159,.88);
  stroke-width:1.55;
  stroke-dashoffset:calc(1 - var(--folio-trace-progress,var(--folio-progress,0)));
  transition:stroke 180ms ease, stroke-width 180ms ease, filter 180ms ease;
}
.folio-textbox::before,
.folio-textbox::after {
  content:'';
  position:absolute;
  z-index:2;
  top:50%;
  width:7px;
  height:7px;
  border-radius:50%;
  background:rgba(255,226,173,.96);
  box-shadow:0 0 12px rgba(249,205,128,.72);
  opacity:0;
  transform:translateY(-50%) scale(.4);
  pointer-events:none;
  transition:opacity 220ms ease,transform 320ms cubic-bezier(.2,.8,.2,1);
}
.folio-textbox::before { left:-4px; }
.folio-textbox::after { right:-4px; }
.folio-textbox.is-dwell-ready::before,
.folio-textbox.is-dwell-ready::after {
  opacity:1;
  transform:translateY(-50%) scale(1);
}
.folio-textbox.is-dwell-ready .folio-intent-trace {
  opacity:1;
  filter:drop-shadow(0 0 9px rgba(249,211,144,.55));
  animation:folioReadyPulse 640ms ease-in-out infinite alternate;
}
.folio-textbox.is-dwell-ready .folio-intent-trace path {
  stroke:rgba(255,228,176,.98);
  stroke-width:1.75;
  stroke-dashoffset:0;
}
@keyframes folioReadyPulse { from{opacity:.72} to{opacity:1} }
@keyframes folioReleaseCue { from{opacity:0;transform:translate(-50%,4px)} to{opacity:1;transform:translate(-50%,0)} }
@media (prefers-reduced-motion:reduce) {
  .sensory-folio__art > #cabinetReaderPreviousImage,
  .sensory-folio__art > #cabinetReaderCoverImage { transition-duration:120ms; }
  .folio-textbox.is-dwell-ready .folio-intent-trace { animation:none; }
}
.folio-textbox::before { left:-4px; }
.folio-textbox::after { right:-4px; }
.folio-textbox.is-dwell-ready::before,
.folio-textbox.is-dwell-ready::after {
  opacity:1;
  transform:translateY(-50%) scale(1);
}
.folio-textbox.is-dwell-ready .folio-intent-trace { animation:none; }
}

/* v0.11.2bm — proposition-led responsive folios and dependable cross-fade */
.sensory-folio {
  display:grid;
  grid-template-rows:minmax(0,1fr) auto;
  align-content:stretch;
  justify-items:center;
  gap:clamp(10px,1.6dvh,20px);
  width:100%;
  height:100%;
  padding:clamp(72px,9dvh,104px) 0 max(16px,2.2dvh);
  box-sizing:border-box;
}
.sensory-folio__art,
.sensory-folio[data-project="sensory"] .sensory-folio__art,
.sensory-folio[data-project="vp"] .sensory-folio__art,
.sensory-folio[data-project="dawn"] .sensory-folio__art,
.sensory-folio[data-project="room-show"] .sensory-folio__art {
  position:relative;
  align-self:center;
  width:min(96vw, 1480px, calc((100dvh - clamp(270px,35dvh,410px)) * 1.7778));
  max-width:96vw;
  max-height:calc(100dvh - clamp(270px,35dvh,410px));
  margin:0 auto;
}
.sensory-folio[data-project="sensory"] .sensory-folio__art {
  width:min(92vw, 1080px, calc((100dvh - clamp(270px,35dvh,410px)) * 1.3333));
}
.folio-textbox {
  position:relative;
  left:auto;
  bottom:auto;
  transform:none;
  width:min(900px,92vw);
  max-height:min(36dvh,390px);
  margin:0 auto;
  overflow:auto;
  overscroll-behavior:contain;
  padding:clamp(13px,1.8vw,20px) clamp(15px,2.2vw,24px) clamp(11px,1.6vw,17px);
}
.folio-textbox h2 { font-size:clamp(22px,2.7vw,34px); }
.folio-textbox__summary { font-size:clamp(14px,1.5vw,18px); max-width:72ch; }
.folio-textbox__detail > p { font-size:clamp(12px,1.05vw,14px); max-width:84ch; }
.sensory-folio__art > #cabinetReaderPreviousImage,
.sensory-folio__art > #cabinetReaderCoverImage {
  will-change:opacity,transform;
  backface-visibility:hidden;
  transform:translateZ(0);
}
.sensory-folio__art.is-crossfading > #cabinetReaderPreviousImage,
.sensory-folio__art.is-crossfading > #cabinetReaderCoverImage {
  pointer-events:none;
}
@media (max-width:720px) and (orientation:portrait) {
  .sensory-folio {
    grid-template-rows:minmax(0,1fr) auto;
    gap:9px;
    padding:calc(env(safe-area-inset-top) + 68px) 0 max(10px,env(safe-area-inset-bottom));
  }
  .sensory-folio__art,
  .sensory-folio[data-project="vp"] .sensory-folio__art,
  .sensory-folio[data-project="dawn"] .sensory-folio__art,
  .sensory-folio[data-project="room-show"] .sensory-folio__art {
    width:100vw;
    max-width:100vw;
    max-height:43dvh;
  }
  .sensory-folio[data-project="sensory"] .sensory-folio__art {
    width:94vw;
    max-width:94vw;
    max-height:43dvh;
  }
  .folio-textbox {
    width:94vw;
    max-height:39dvh;
    border-radius:15px;
    padding:11px 13px 9px;
  }
}
@media (min-width:1100px) and (min-height:760px) {
  .sensory-folio__art,
  .sensory-folio[data-project="vp"] .sensory-folio__art,
  .sensory-folio[data-project="dawn"] .sensory-folio__art,
  .sensory-folio[data-project="room-show"] .sensory-folio__art {
    width:min(94vw,1560px,calc((100dvh - 330px) * 1.7778));
  }
  .folio-textbox { width:min(980px,88vw); }
}


/* v0.11.2bn — final midpoint blend and mirrored dwell edge */
.sensory-folio__art > #cabinetReaderPreviousImage,
.sensory-folio__art > #cabinetReaderCoverImage {
  transition:none !important;
}
.folio-intent-trace {
  inset:-3px;
  width:calc(100% + 6px);
  height:calc(100% + 6px);
  opacity:calc(.04 + var(--folio-trace-progress,0) * .96);
  filter:drop-shadow(0 0 calc(2px + var(--folio-trace-progress,0) * 7px) rgba(246,203,128,.34));
}
.folio-intent-trace path {
  stroke:rgba(248,216,159,.9);
  stroke-width:1.45;
  stroke-dasharray:1;
  stroke-dashoffset:calc(1 - var(--folio-trace-progress,0));
  transition:none;
}
.folio-textbox::before,
.folio-textbox::after {
  top:50%;
  width:8px;
  height:8px;
  opacity:0;
  transform:translateY(-50%) scale(.25);
  transition:opacity 340ms ease, transform 520ms cubic-bezier(.2,.75,.2,1), box-shadow 520ms ease;
}
.folio-textbox.is-dwell-ready::before,
.folio-textbox.is-dwell-ready::after {
  opacity:1;
  transform:translateY(-50%) scale(1);
  box-shadow:0 0 0 4px rgba(249,205,128,.11),0 0 18px rgba(249,205,128,.72);
}
.folio-textbox.is-dwell-ready .folio-intent-trace {
  animation:folioEdgeSettle 720ms cubic-bezier(.2,.75,.2,1) both;
}
.folio-textbox.is-dwell-ready .folio-intent-trace path {
  stroke:rgba(255,230,181,.98);
  stroke-width:1.8;
  stroke-dashoffset:0;
}
@keyframes folioEdgeSettle {
  0% { opacity:.88; filter:drop-shadow(0 0 4px rgba(246,203,128,.35)); }
  55% { opacity:1; filter:drop-shadow(0 0 11px rgba(250,216,151,.72)); }
  100% { opacity:.82; filter:drop-shadow(0 0 7px rgba(246,203,128,.42)); }
}
.folio-textbox__detail {
  transition:none !important;
}
@media (prefers-reduced-motion:reduce) {
  .folio-textbox.is-dwell-ready .folio-intent-trace { animation:none; }
}

/* v0.11.2bo — final mobile launch completion */
html.folio-open,html.folio-open body{overflow:hidden;overscroll-behavior:none}
.project-status,.folio-status{display:inline-flex;align-items:center;border:1px solid rgba(224,184,112,.28);border-radius:999px;padding:3px 7px;background:rgba(216,174,104,.08);color:rgba(245,211,151,.9);font:700 7px/1 system-ui,sans-serif;letter-spacing:.09em;text-transform:uppercase}
.folio-meta-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:4px}.folio-meta-row .folio-textbox__kicker{margin:0}.folio-status{flex:none}
.sensory-hotspot{appearance:none;-webkit-appearance:none;padding:0;background:rgba(255,238,196,.16);cursor:pointer}
.sensory-hotspot:focus-visible{outline:2px solid rgba(255,226,166,.95);outline-offset:6px;box-shadow:0 0 0 9px rgba(244,199,111,.13),0 0 28px rgba(255,213,126,.66)}
.folio-first-use-hint{position:absolute;z-index:18;left:50%;top:max(7vh,calc(env(safe-area-inset-top) + 56px));width:min(620px,88vw);margin:0;transform:translate(-50%,-8px);opacity:0;pointer-events:none;text-align:center;color:rgba(248,225,185,.8);font:650 9px/1.4 system-ui,sans-serif;letter-spacing:.07em;text-transform:uppercase;transition:opacity 480ms ease,transform 480ms ease;text-shadow:0 2px 12px rgba(0,0,0,.8)}
.folio-first-use-hint.is-visible{opacity:1;transform:translate(-50%,0);animation:folioHintRest 5.5s ease forwards}
@keyframes folioHintRest{0%,70%{opacity:1}100%{opacity:.22}}
@media(max-width:720px) and (orientation:portrait){.folio-first-use-hint{top:calc(env(safe-area-inset-top) + 58px);width:86vw;font-size:8px}.folio-meta-row{gap:7px}.folio-status{font-size:6px;padding:3px 6px}.project-card small{display:flex;align-items:center;gap:5px;flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){.folio-first-use-hint.is-visible{animation:none}.folio-first-use-hint{transition:none}}


/* v0.11.2bq — desktop cabinet, folio and transport polish */
.cabinet-rail[data-hovering="true"] span { box-shadow: 0 0 10px rgba(255,220,151,.78), 0 0 28px rgba(234,174,78,.56); }
.app:not([data-focus="cabinet"]) .cabinet-rail { pointer-events:none; }
@media (min-width: 961px) {
  .cabinet-rail--lower { bottom: max(142px, calc(env(safe-area-inset-bottom) + 126px)); }
  .cabinet-rail--upper { top: clamp(126px, 18vh, 194px); }
  .sensory-folio {
    gap: clamp(16px, 2dvh, 26px);
    padding: clamp(104px, 13dvh, 152px) 0 max(20px, 2.6dvh);
  }
  .sensory-folio__art,
  .sensory-folio[data-project="sensory"] .sensory-folio__art,
  .sensory-folio[data-project="vp"] .sensory-folio__art,
  .sensory-folio[data-project="dawn"] .sensory-folio__art,
  .sensory-folio[data-project="room-show"] .sensory-folio__art {
    width: min(94vw, 1640px, calc((100dvh - 320px) * 1.7778));
    max-height: calc(100dvh - 320px);
  }
  .sensory-folio[data-project="sensory"] .sensory-folio__art {
    width: min(84vw, 1160px, calc((100dvh - 320px) * 1.3333));
  }
  .folio-textbox {
    width: min(1040px, 82vw);
    max-height: min(35dvh, 420px);
    padding: clamp(15px, 1.6vw, 22px) clamp(20px, 2vw, 28px) clamp(13px, 1.4vw, 18px);
  }
  .folio-textbox h2 { font-size: clamp(24px, 2.3vw, 36px); }
  .folio-textbox__summary { font-size: clamp(15px, 1.25vw, 19px); }
  .folio-textbox__detail > p { font-size: clamp(12px, .96vw, 14px); }
  .desk-transport {
    width: min(560px, calc(100vw - 44px));
    bottom: max(88px, calc(env(safe-area-inset-bottom) + 72px));
  }
  .desk-transport__plate {
    gap: 18px;
    padding: 12px 16px 13px;
    border-radius: 12px;
  }
  .desk-transport__brand { font-size: 10px; }
  .desk-transport button { width: 38px; height: 32px; }
  .desk-transport__buttons button#radioEject { width: 48px; }
  .desk-transport__volume {
    grid-template-columns: auto 1fr 42px;
    gap: 10px;
    font-size: 10px;
    color: rgba(235,209,163,.76);
  }
  .desk-transport__volume input {
    height: 14px;
  }
  .desk-transport__volume output {
    font-size: 12px;
    color: #f5e3bf;
  }
  .desk-transport > p { font-size: 9px; }
  .desk-transport__readout { font-size: 9px; }
}

/* v0.11.2br — recruiter-first launch clarity. */
.launch-intro__proof{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 15px;padding:0;list-style:none}
.launch-intro__proof li{padding:6px 8px;border:1px solid rgba(225,184,113,.2);border-radius:999px;background:rgba(255,255,255,.035);color:rgba(242,228,203,.78);font:650 9px/1 system-ui,sans-serif;letter-spacing:.045em}
.project-card--relevant{border-color:rgba(216,174,104,.42);background:linear-gradient(135deg,rgba(216,174,104,.085),rgba(255,255,255,.025))}
@media(max-width:720px){.launch-intro__proof{gap:5px}.launch-intro__proof li{padding:5px 7px;font-size:8px}}


/* v0.11.2bs — lean recruiter deploy, reflective folios and universal two-layer attention. */
.folio-magnifier-button {
  top:18px;
  right:18px;
  width:53px;
  height:53px;
  font-size:31px;
  background:rgba(12,9,8,.84);
  backdrop-filter:none;
  box-shadow:0 8px 24px rgba(0,0,0,.32),0 0 0 1px rgba(244,214,163,.08);
}
.folio-copy {
  position:relative;
  z-index:1;
  transform-origin:top center;
  will-change:auto;
}
.folio-textbox {
  transition:background-color 820ms ease,border-color 820ms ease,box-shadow 820ms ease;
}
.folio-textbox.is-copy-pending {
  background-color:rgba(12,9,8,.34);
  border-color:rgba(231,193,127,.10);
  box-shadow:none;
}
.folio-textbox.is-copy-pending .folio-copy {
  opacity:0;
  clip-path:inset(0 0 100% 0);
  transform:translateY(-6px);
}
.folio-textbox.is-copy-revealing .folio-copy {
  animation:folioCopyTopDown 900ms cubic-bezier(.2,.72,.2,1) both;
}
.folio-textbox.is-copy-visible .folio-copy {
  opacity:1;
  clip-path:inset(0 0 0 0);
  transform:none;
}
@keyframes folioCopyTopDown {
  0% { opacity:.04; clip-path:inset(0 0 100% 0); transform:translateY(-6px); filter:blur(2.5px); }
  32% { opacity:.58; }
  100% { opacity:1; clip-path:inset(0 0 0 0); transform:none; filter:none; }
}
/* CSS compositing replaces the old continuous JavaScript image-blend loop. */
.sensory-folio__art > #cabinetReaderPreviousImage,
.sensory-folio__art > #cabinetReaderCoverImage {
  transition:opacity 1050ms cubic-bezier(.22,.61,.36,1),filter 1050ms ease,transform 1050ms cubic-bezier(.22,.61,.36,1) !important;
  will-change:auto;
}
.sensory-folio__art > #cabinetReaderPreviousImage { opacity:0; }
.sensory-folio__art > #cabinetReaderPreviousImage.is-visible { opacity:1; }
.sensory-folio__art > #cabinetReaderPreviousImage.is-fading-out { opacity:0; filter:brightness(.91); transform:scale(.994); }
.sensory-folio__art > #cabinetReaderCoverImage.is-entering { opacity:0; filter:brightness(.94); transform:scale(1.008); }
.sensory-folio__art.is-crossfading > #cabinetReaderCoverImage:not(.is-entering) { opacity:1; filter:none; transform:none; }
@media(max-width:720px) and (orientation:portrait) {
  .folio-magnifier-button { top:15px; right:15px; width:50px; height:50px; font-size:29px; }
}
@media(prefers-reduced-motion:reduce) {
  .folio-textbox.is-copy-revealing .folio-copy { animation:none; opacity:1; clip-path:none; transform:none; filter:none; }
  .sensory-folio__art > #cabinetReaderPreviousImage,
  .sensory-folio__art > #cabinetReaderCoverImage { transition-duration:60ms !important; }
}


/* v0.11.2bu — launch finishing touches */
.desk-transport button.is-paused,
.desk-transport button.is-ejected {
  color: #fff0c8;
  border-color: rgba(238,190,111,.78);
  background: linear-gradient(#6a472d,#3b281d);
  box-shadow: inset 0 1px rgba(255,255,255,.12), 0 0 0 1px rgba(232,177,91,.18), 0 0 18px rgba(219,153,62,.28), 0 2px 4px rgba(0,0,0,.32);
}
.desk-transport button#radioEject { width: 42px; font-size: 18px; line-height: 1; letter-spacing: 0; }
.app[data-cabinet-interaction="true"] .focus-transfer {
  z-index: 31;
}
@media (min-width: 961px) {
  .app[data-cabinet-interaction="true"] .focus-transfer {
    bottom: max(28px, calc(env(safe-area-inset-bottom) + 20px));
  }
}
\n\n/* v0.11.2bv — final desktop transport, cabinet controls and view polish */
#radioEject .eject-glyph { width:20px; height:20px; display:block; margin:auto; fill:currentColor; pointer-events:none; }
.desk-transport button.is-paused,
.desk-transport button.is-ejected { color:#fff4d6; border-color:rgba(244,195,112,.92); background:linear-gradient(#775033,#402a1d); box-shadow:inset 0 1px rgba(255,255,255,.16),0 0 0 1px rgba(232,177,91,.24),0 0 21px rgba(219,153,62,.42),0 2px 4px rgba(0,0,0,.34); }
.desk-transport button.is-busy { opacity:.72; }
@media (min-width:961px) {
  .desk-transport { width:min(690px,calc(100vw - 64px)); }
  .desk-transport__plate { grid-template-columns:auto auto minmax(220px,1fr); }
  .desk-transport__volume { grid-template-columns:auto minmax(180px,1fr) 36px; gap:12px; }
  .desk-transport__volume input[type="range"] { appearance:none; -webkit-appearance:none; height:24px; margin:0; cursor:pointer; background:transparent; }
  .desk-transport__volume input[type="range"]::-webkit-slider-runnable-track { height:6px; border-radius:999px; background:linear-gradient(90deg,rgba(209,158,84,.9),rgba(111,76,45,.72)); box-shadow:inset 0 1px 2px rgba(0,0,0,.42); }
  .desk-transport__volume input[type="range"]::-webkit-slider-thumb { -webkit-appearance:none; width:20px; height:20px; margin-top:-7px; border:1px solid rgba(255,224,170,.82); border-radius:50%; background:linear-gradient(#d8a968,#84572f); box-shadow:0 2px 7px rgba(0,0,0,.48),0 0 10px rgba(211,156,77,.24); }
  .desk-transport__volume input[type="range"]::-moz-range-track { height:6px; border-radius:999px; background:linear-gradient(90deg,rgba(209,158,84,.9),rgba(111,76,45,.72)); }
  .desk-transport__volume input[type="range"]::-moz-range-thumb { width:20px; height:20px; border:1px solid rgba(255,224,170,.82); border-radius:50%; background:linear-gradient(#d8a968,#84572f); }
  .app[data-cabinet-interaction="true"] .focus-transfer { position:fixed; z-index:48 !important; bottom:max(26px,calc(env(safe-area-inset-bottom) + 18px)); opacity:1 !important; visibility:visible !important; pointer-events:auto !important; }
  .app[data-cabinet-interaction="true"] .cabinet-instrument[aria-hidden="false"][data-ready="true"] { pointer-events:auto; }
  .app[data-cabinet-interaction="true"] .cabinet-rail { z-index:2; pointer-events:auto !important; }
}


/* v0.11.2bw — cabinet interaction hierarchy, rail throttle and cassette truth states */
.cabinet-instrument,
.app[data-cabinet-interaction="true"] .cabinet-instrument[aria-hidden="false"][data-ready="true"] {
  pointer-events:none !important;
}
.app[data-cabinet-interaction="true"] .cabinet-rail {
  pointer-events:auto !important;
  z-index:2;
}
.cabinet-rail span {
  left:calc(50% + var(--rail-crown-offset, 0%));
  transition:left 220ms cubic-bezier(.2,.78,.2,1), box-shadow 160ms ease;
}
.cabinet-rail[data-dragging="true"] span,
.cabinet-rail[data-hovering="true"] span {
  transition:left 70ms linear, box-shadow 120ms ease;
}
.desk-transport button.is-ejected-nav,
.desk-transport button.is-paused-ready {
  color:#fff4d6;
  border-color:rgba(244,195,112,.92);
  background:linear-gradient(#775033,#402a1d);
  box-shadow:inset 0 1px rgba(255,255,255,.16),0 0 0 1px rgba(232,177,91,.24),0 0 21px rgba(219,153,62,.42),0 2px 4px rgba(0,0,0,.34);
}
.desk-transport button.is-disabled-state {
  color:rgba(235,218,190,.42) !important;
  border-color:rgba(201,166,111,.18) !important;
  background:rgba(34,25,19,.54) !important;
  box-shadow:inset 0 1px rgba(255,255,255,.035),0 2px 4px rgba(0,0,0,.24) !important;
}
@media (min-width:961px) {
  .app[data-cabinet-interaction="true"] .close-controls[aria-hidden="false"] {
    position:fixed;
    z-index:52 !important;
    left:50%;
    right:auto;
    bottom:max(82px,calc(env(safe-area-inset-bottom) + 72px));
    transform:translateX(-50%);
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:none !important;
  }
  .app[data-cabinet-interaction="true"] .close-controls #returnButton {
    pointer-events:auto !important;
  }
  .app[data-cabinet-interaction="true"] .close-controls span { display:none; }
  .app[data-cabinet-interaction="true"] .masthead,
  .app[data-cabinet-interaction="true"] .masthead .header-actions,
  .app[data-cabinet-interaction="true"] .masthead button,
  .app[data-cabinet-interaction="true"] .time-cycle,
  .app[data-cabinet-interaction="true"] .time-cycle button {
    pointer-events:auto !important;
  }
  .app[data-cabinet-interaction="true"] .masthead { z-index:54 !important; }
  .app[data-cabinet-interaction="true"] .focus-transfer { z-index:53 !important; }
}


/* v0.11.2bx — final crown response, cabinet return placement and hotspot presence */
.cabinet-rail span {
  transition:left 90ms cubic-bezier(.12,.82,.18,1), box-shadow 120ms ease;
}
.cabinet-rail[data-dragging="true"] span,
.cabinet-rail[data-hovering="true"] span {
  transition:left 18ms linear, box-shadow 80ms ease;
}

/* Make all project points easier to discover without turning them into buttons. */
.sensory-hotspot,
.sensory-folio[data-project="vp"] .project-hotspot,
.sensory-folio[data-project="dawn"] .project-hotspot,
.sensory-folio[data-project="room-show"] .project-hotspot {
  width:38px;
  height:38px;
  margin:-19px 0 0 -19px;
  opacity:.9;
  border-width:2px;
  background:rgba(255,238,196,.22);
  box-shadow:0 0 0 6px rgba(244,199,111,.18),0 0 24px rgba(244,199,111,.72),0 0 48px rgba(244,199,111,.30),inset 0 0 10px rgba(255,251,235,.78);
}
.sensory-hotspot::after,
.project-hotspot::after {
  content:"";
  position:absolute;
  inset:-7px;
  border:1px solid rgba(255,218,145,.38);
  border-radius:50%;
  animation:unoixHotspotBreath 2.4s ease-in-out infinite;
  pointer-events:none;
}
.sensory-hotspot.is-active,
.project-hotspot.is-active {
  transform:scale(1.18);
  opacity:1;
  box-shadow:0 0 0 9px rgba(244,199,111,.12),0 0 30px rgba(255,213,126,.92),0 0 58px rgba(244,199,111,.38),inset 0 0 12px rgba(255,255,245,.95);
}
@keyframes unoixHotspotBreath {
  0%,100% { transform:scale(.9); opacity:.25; }
  50% { transform:scale(1.14); opacity:.72; }
}

@media (min-width:961px) {
  .app[data-cabinet-interaction="true"] .close-controls[aria-hidden="false"] {
    left:calc(50% - 168px);
    bottom:max(26px,calc(env(safe-area-inset-bottom) + 18px));
    transform:translateX(-100%);
    width:auto;
  }
  .app[data-cabinet-interaction="true"] .close-controls #returnButton {
    white-space:nowrap;
  }
}
@media (max-width:760px) {
  .sensory-hotspot,
  .sensory-folio[data-project="vp"] .project-hotspot,
  .sensory-folio[data-project="dawn"] .project-hotspot,
  .sensory-folio[data-project="room-show"] .project-hotspot {
    width:34px;
    height:34px;
    margin:-17px 0 0 -17px;
  }
}


/* v0.11.2by — final tactile controls and discoverability */
.cabinet-rail span { transition:left 45ms linear,box-shadow 90ms ease; }
.cabinet-rail[data-dragging="true"] span,
.cabinet-rail[data-hovering="true"] span { transition:left 0ms linear,box-shadow 70ms ease; }

/* The transport now reads as one physical control bank. */
.cassette-sound-button {
  position:static !important;
  inset:auto !important;
  width:42px !important;
  min-width:42px !important;
  height:42px !important;
  min-height:42px !important;
  padding:0 !important;
}
.desk-transport__buttons { align-items:center; gap:7px; }
.desk-transport__buttons button { width:44px; height:42px; }
.desk-transport__buttons button#radioEject { width:46px; }
.desk-transport button.is-playing {
  color:#fff6de;
  border-color:rgba(244,195,112,.96);
  background:linear-gradient(#7b5436,#432c1e);
  box-shadow:inset 0 1px rgba(255,255,255,.18),0 0 0 1px rgba(232,177,91,.26),0 0 23px rgba(219,153,62,.5),0 2px 4px rgba(0,0,0,.34);
}
.desk-transport__volume output {
  min-width:30px;
  padding:4px 5px;
  border:1px solid rgba(220,174,99,.22);
  border-radius:4px;
  background:rgba(20,14,10,.34);
  text-align:center;
}
@media (min-width:961px) {
  .desk-transport { width:min(760px,calc(100vw - 56px)); }
  .desk-transport__plate { grid-template-columns:auto auto minmax(150px,1fr); gap:12px; }
  .desk-transport__volume { grid-template-columns:auto minmax(110px,1fr) 38px; gap:9px; }
  .app[data-cabinet-interaction="true"] .close-controls[aria-hidden="false"] {
    left:calc(50% - 182px);
    bottom:max(24px,calc(env(safe-area-inset-bottom) + 16px));
    transform:translateX(-100%);
  }
}

/* v0.11.2ca — settled cassette layout and transition-safe cabinet entry */
.desk-transport__status {
  grid-column:1 / -1;
  min-height:0;
  max-height:0;
  margin:0 10px;
  padding:0 12px;
  overflow:hidden;
  opacity:0;
  transform:translateY(-3px);
  border:1px solid transparent;
  border-radius:5px;
  color:rgba(255,226,176,.94);
  background:rgba(59,38,25,.0);
  font:650 9px/1.35 ui-monospace,monospace;
  letter-spacing:.11em;
  text-align:center;
  text-transform:uppercase;
  transition:opacity .28s ease,transform .28s ease,max-height .3s ease,padding .3s ease,margin .3s ease,border-color .3s ease,background .3s ease;
}
.desk-transport__status.is-visible {
  max-height:34px;
  margin:9px 10px 1px;
  padding:7px 12px;
  opacity:1;
  transform:translateY(0);
  border-color:rgba(226,174,96,.27);
  background:rgba(59,38,25,.54);
}
@media (min-width:961px) {
  .desk-transport { width:min(760px,calc(100vw - 56px)); }
  .desk-transport__plate {
    grid-template-columns:auto minmax(0,1fr);
    justify-content:start;
    column-gap:14px;
    padding-left:18px;
    padding-right:16px;
  }
  .desk-transport__brand { display:none; }
  .desk-transport__buttons { grid-column:1; justify-self:start; }
  .desk-transport__volume {
    grid-column:2;
    width:min(330px,100%);
    justify-self:start;
    grid-template-columns:auto minmax(120px,1fr) 40px;
    gap:9px;
  }
  .desk-transport__status,
  .desk-transport__readout { grid-column:1 / -1; }
}