/* The editorial layout is unchanged. Material and room colors share one finish. */
:root {
  --panel:#2b251c;
  --panel-raised:#3b3024;
  --control-selected:#7e6849;
  --selected-ink:#20170f;
  --dock-surface:#251e17f7;
  --dock-line:#685939;
  --page-shadow:#20170f75;
  --wall-shadow:#20170f;
  --wall-field:#624735;
  --wall-metal:#cbb37a;
  --wall-frame:#806d49;
  --wall-rim:#cbb37a61;
  --wall-glow:#f5e5be1a;
  --wall-edge:#20170f3d;
  --wall-ink:#fcf6e5;
  --wall-muted:#f7ebce;
  --wall-caption-scrim:#20170ff2;
  --wall-caption-mid:#20170fc2;
  --wall-caption-clear:#20170f00;
  --wall-top-scrim:#20170f73;
  --wall-label-scrim:#20170fe6;
  --wall-label-feather:#20170f6b;
}

body { transition:background-color .35s ease,color .35s ease; }
button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible { outline-color:var(--accent); }
::selection { background:var(--accent);color:var(--selected-ink); }
.wordmark { font-family:var(--sans);font-size:29px;font-weight:500;letter-spacing:-1.9px; }
.wordmark strong { font-weight:500; }
.brand-mark { border-color:var(--accent); }
.view-switch { background:var(--panel);border-color:var(--line); }
.view-switch button[aria-pressed=true] { background:var(--accent);color:var(--selected-ink); }
.intro h1 em { color:var(--muted); }
.station-mark { color:var(--accent); }
.station-button[aria-pressed=true] .station-description { color:var(--muted); }
.nav-bottom svg { stroke:var(--accent); }

.material-filters { position:absolute;width:0;height:0;overflow:hidden;pointer-events:none; }
.wall-stage {
  background:var(--wall-field);
  border-color:var(--wall-frame);
  box-shadow:0 8px 28px var(--page-shadow),inset 0 0 0 1px var(--wall-rim);
}
.wall-stage::before {
  content:'';position:absolute;z-index:1;inset:0 0 auto;height:100px;
  background:linear-gradient(180deg,var(--wall-top-scrim),transparent);
  pointer-events:none;
}
.wall-stage::after {
  content:'';position:absolute;z-index:3;inset:6px;
  border:1px solid var(--wall-rim);pointer-events:none;
}
.wall-material {
  inset:auto;top:calc(-1 * var(--tile-cycle,1000px));left:0;
  display:grid;grid-template-columns:repeat(var(--material-columns,2),var(--tile-size,500px));
  grid-auto-rows:var(--tile-size,500px);gap:0;
  background:none;
  filter:url('#wall-material-color');
  animation:wall-drift calc(260s / 1.15) linear infinite;
  animation-play-state:paused;will-change:auto;
}
.wall-stage[data-moving=true] .wall-material { will-change:transform; }
.wall-tile { width:100%;height:100%;overflow:hidden; }
.wall-tile img { display:block;width:100%;height:100%;object-fit:cover;max-width:none;user-select:none; }
.wall-tile[data-flip=x] img { transform:scaleX(-1); }
.wall-tile[data-flip=y] img { transform:scaleY(-1); }
.wall-tile[data-flip=xy] img { transform:scale(-1,-1); }
.wall-light {
  background:radial-gradient(ellipse at 28% 5%,var(--wall-glow),transparent 65%),linear-gradient(90deg,var(--wall-edge),transparent 13%,transparent 86%,var(--wall-edge));
  box-shadow:inset 0 0 45px var(--wall-edge),inset 0 1px 0 var(--wall-rim);
  animation:none;
}
.wall-light::after { content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 100% 25%,#a9b9ed20,transparent 70%);opacity:var(--sconce-cool-power,0);transition:opacity 1.8s ease; }
/* Scale the complete fixture, spill, and shadow uniformly around its existing center. */
.wall-sconce { position:absolute;z-index:1;top:12%;right:-2.4%;height:55%;max-height:330px;aspect-ratio:2 / 3;pointer-events:none;transform:scale(.8);transform-origin:center; }
.sconce-fixture { position:absolute;inset:0;z-index:2;width:100%;height:100%;object-fit:contain;clip-path:inset(3% 36.4% 3.5% 36.4%);filter:brightness(calc(.58 + var(--sconce-core-power,.84) * .5));transition:filter 1.8s ease; }
.sconce-contact-shadow { position:absolute;z-index:0;left:36%;right:35%;top:4%;bottom:5%;border-radius:30%;background:#100d0a77;filter:blur(7px);transform:translate(3px,4px); }
.sconce-spill { position:absolute;z-index:1;inset:-25% -40%;mix-blend-mode:screen;filter:blur(8px);transition:opacity 1.8s ease; }
.sconce-spill.warm { background:radial-gradient(ellipse at 50% 51%,var(--sconce-warm-color),var(--sconce-warm-soft) 30%,transparent 64%);opacity:var(--sconce-warm-power,.86); }
.sconce-spill.cool { background:radial-gradient(ellipse at 50% 51%,var(--sconce-cool-color),var(--sconce-cool-soft) 30%,transparent 65%);opacity:var(--sconce-cool-power,0); }
.sconce-emitter { position:absolute;z-index:3;left:37.2%;top:23%;width:25.6%;height:53.5%;border-radius:38% 38% 30% 30% / 2% 2% 2% 2%;background:linear-gradient(90deg,#ffd39608,#ffe7b34d 26%,#fff4ce80 50%,#ffe7b34d 74%,#ffd39608);mix-blend-mode:screen;opacity:var(--sconce-core-power,.84);box-shadow:0 0 12px #ffe9ba18;transition:opacity 1.8s ease; }
.wall-topline { z-index:2;color:var(--wall-ink);text-shadow:0 1px 12px var(--wall-shadow); }
.wall-label,.wall-palette-label { padding:4px 6px;background:var(--wall-label-scrim);box-shadow:0 0 10px 5px var(--wall-label-feather);border-radius:1px; }
.wall-label:before { border-color:var(--wall-muted); }
.wall-caption { z-index:2;isolation:isolate; }
.wall-caption::before {
  content:'';position:absolute;z-index:-1;inset:-65px -46px -42px;
  background:linear-gradient(0deg,var(--wall-caption-scrim),var(--wall-caption-mid) 45%,var(--wall-caption-clear));
  pointer-events:none;
}
.wall-title { color:var(--wall-ink);text-shadow:0 2px 20px var(--wall-edge); }
.wall-index,.wall-tagline { color:var(--wall-muted); }
.wall-index { width:max-content;max-width:100%;padding:3px 6px;margin-left:-6px;background:var(--wall-label-scrim);box-shadow:0 0 10px 5px var(--wall-label-feather);border-radius:1px; }
.wall-room-label { color:var(--wall-muted);border-color:var(--wall-rim); }
.wall-toolbar { padding-top:22px;padding-bottom:17px;border-bottom:0; }
.palette-swatch { border-color:var(--wall-rim);box-shadow:inset 0 0 0 1px var(--page-shadow); }
.palette-button[aria-pressed=true] .palette-swatch:after { border-color:var(--accent); }
.material-detail { display:flex;flex-wrap:wrap;align-items:center;gap:6px 15px;margin:5px 0 0;color:var(--dim);font-size:9px;letter-spacing:.15px; }
.material-detail>span { display:inline-flex;align-items:center;gap:6px;white-space:nowrap; }
.material-detail i { display:inline-block;width:5px;height:5px;border:1px solid var(--wall-rim);transform:rotate(45deg); }
.motion-buttons { border-color:var(--line); }
.motion-button[aria-pressed=true] { color:var(--paper);background:var(--control-selected); }
.motion-note,.room-message { color:var(--accent); }
.lighting-toolbar { display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 0 19px;border-bottom:1px solid var(--line); }
.lighting-title { display:flex;align-items:center;gap:17px; }
.lighting-title .control-caption { margin:0;white-space:nowrap; }
.lighting-description { margin:0;font-size:9px;color:var(--dim); }
.lighting-buttons { display:flex;gap:2px;border:1px solid var(--line);flex-shrink:0; }
.lighting-button { min-height:44px;border:0;background:transparent;color:var(--muted);font-size:9px;padding:0 13px;white-space:nowrap; }
.lighting-button[aria-pressed=true] { background:var(--control-selected);color:var(--paper); }
.promise { color:var(--paper); }
.show-title { color:var(--paper); }

.playback-dock { background:var(--dock-surface);border-color:var(--dock-line);box-shadow:0 -8px 35px var(--page-shadow); }
.play-icon { border-color:var(--accent);color:var(--paper); }
.source-block { border-color:var(--line); }
.source-title { color:var(--muted); }
.volume-control svg { stroke:var(--muted); }
.volume-control input { accent-color:var(--accent); }
.audio-options>summary { color:var(--paper); }
.audio-options-panel { background:var(--panel);border-color:var(--dock-line);box-shadow:0 12px 50px var(--page-shadow); }
.audio-options-panel p { color:var(--muted); }
.source-choice { background:var(--accent);color:var(--selected-ink);border-color:var(--accent); }
.source-choice.secondary { color:var(--paper);background:transparent;border-color:var(--line); }
.privacy-note { color:var(--muted)!important; }
.immersed .material-controls { display:grid;grid-template-columns:auto auto;column-gap:20px;row-gap:0; }
.immersed .material-controls .control-caption { grid-column:1;grid-row:1; }
.immersed .material-controls .palette-buttons { grid-column:2;grid-row:1; }
.immersed .material-detail { grid-column:2;grid-row:2;margin:4px 0 0; }
.immersed .lighting-toolbar { border-bottom:0;padding:19px 0 0; }

@keyframes wall-drift { from { transform:translateY(0); } to { transform:translateY(var(--tile-cycle,1000px)); } }
@media(max-width:1100px) {
  .immersed .material-controls { column-gap:12px; }
  .material-detail { font-size:8px;gap:5px 12px; }
  .lighting-title { display:block; }
  .lighting-description { margin-top:5px;font-size:8px; }
}
@media(max-width:850px) {
  .wordmark { font-size:27px; }
  .immersed .material-controls { display:block; }
  .immersed .material-detail { margin-top:5px; }
}
@media(max-width:570px) {
  .wordmark { font-size:27px;letter-spacing:-1.7px; }
  .brand-descriptor { letter-spacing:1.5px; }
  .wall-stage::after { inset:5px; }
  .wall-sconce { top:14%;height:48%;right:-3.4%; }
  .immersed .wall-sconce { top:44px;height:36%;max-height:145px;right:-3.8%; }
  .wall-caption::before { inset:-55px -30px -35px; }
  .material-detail { font-size:8px;letter-spacing:.1px;gap:6px 15px; }
  .wall-toolbar { padding-top:19px;padding-bottom:18px; }
  .immersed .material-detail { margin-top:6px; }
  .lighting-toolbar { display:block;padding-bottom:19px; }
  .lighting-title { display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:9px; }
  .lighting-description { margin:0;text-align:right;font-size:7px; }
  .lighting-buttons { width:100%; }
  .lighting-button { flex:1;padding:0 7px;font-size:8px; }
  .immersed .lighting-toolbar { padding:18px 7px 0; }
}
@media(prefers-reduced-motion:reduce) {
  body { transition:none; }
  .wall-material { animation:none!important; }
  .sconce-spill,.sconce-emitter,.sconce-fixture,.wall-light::after { transition:none; }
}