/* DEV02.3.4 — bounded type/transport update. No footer or pyramid styling. */
.room002-page--dev02 .mi .mi-artist,
.room002-page--dev02 .mi .mi-b__card-artist {
  overflow-wrap:normal;word-break:normal;hyphens:none;
  line-height:.96;letter-spacing:-.028em;text-wrap:balance;
}
/* Override the photographic selector which defeated fitArtist(). */
.room002-page--dev02 .mi .mi-artist[data-fit="1"] {font-size:var(--mi-fit-size)}
.room002-page--dev02 .mi .mi-display__names {min-width:0;gap:clamp(12px,2vw,22px)}
.room002-page--dev02 .mi .mi-ticker {white-space:normal;overflow:visible;mask-image:none;-webkit-mask-image:none}
.room002-page--dev02 .mi .mi-ticker__track {display:block;max-width:100%;transform:none!important;transition:none!important;will-change:auto}
.room002-page--dev02 .mi .mi-title-line,
.room002-page--dev02 .mi .mi-b__card-title {
  overflow-wrap:normal;word-break:normal;hyphens:none;line-height:1.1;text-wrap:balance;
}
.room002-page--dev02 .mi .mi-display {min-height:0;padding:clamp(24px,4vw,44px)}
.room002-page--dev02 .mi .mi-display__top {margin-bottom:clamp(22px,3vw,34px)}
.room002-page--dev02 .mi .mi-display__meta {margin-top:clamp(20px,3vw,32px)}
/* The control is a clear-edged graphite plane, not a glowing yellow disc.
   Keep the real anchor, provider text, and large un-clipped focus outline. */
.room002-page--dev02 .mi .mi-deck__main {
  width:100%;max-width:100%;box-sizing:border-box;
  background:rgba(17,21,22,.74);backdrop-filter:none;-webkit-backdrop-filter:none;
  border:0;border-top:1px solid rgba(243,243,238,.3);border-bottom:1px solid rgba(243,243,238,.19);
  border-radius:0;padding:clamp(22px,3.4vw,36px) clamp(12px,3vw,30px);
  box-shadow:none;
}
.room002-page--dev02 .mi .mi-controls {
  width:100%;max-width:850px;display:grid;
  grid-template-columns:minmax(108px,1fr) minmax(210px,1.8fr) minmax(108px,1fr);
  gap:clamp(18px,3vw,48px);align-items:center;
}
.room002-page--dev02 .mi .mi-listen-slot {min-width:0;display:flex;justify-content:center}
.room002-page--dev02 .mi .mi-listen,
.room002-page--dev02 .mi .mi-listen:not([aria-disabled="true"]):not([data-kind="open"]) {
  position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;
  width:100%;max-width:340px;height:112px;min-height:96px;aspect-ratio:auto;
  margin:0;padding:18px 20px;box-sizing:border-box;border:0;border-radius:0;
  background:transparent;color:#f1f3f1;box-shadow:none;text-shadow:none;transform:none;
  font:700 clamp(1.55rem,3vw,2rem)/1.05 var(--mi-sans);letter-spacing:.075em;text-decoration:none;
}
.room002-page--dev02 .mi .mi-listen::before {
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  clip-path:polygon(6% 0,94% 0,100% 15%,100% 85%,94% 100%,6% 100%,0 85%,0 15%);
  background:linear-gradient(127deg,rgba(224,238,235,.2),rgba(38,47,48,.86) 25%,rgba(15,21,23,.95) 67%,rgba(203,225,220,.17));
}
.room002-page--dev02 .mi .mi-listen::after {content:none}
.room002-page--dev02 .mi .mi-listen__facet {position:absolute;inset:0;width:100%;height:100%;pointer-events:none;color:rgba(230,243,236,.74)}
.room002-page--dev02 .mi .mi-listen__edge {opacity:.42}
.room002-page--dev02 .mi .mi-listen>span:not(.mi-vh) {position:relative;margin:0;padding:0;color:#f0e20f;line-height:1.1}
.room002-page--dev02 .mi .mi-listen small {position:relative;color:#f0f2f0;font:500 .85rem/1.3 var(--mi-mono);letter-spacing:.11em;max-width:100%;text-align:center}
.room002-page--dev02 .mi .mi-listen[data-kind="open"]>span {color:#f1f3f1}
.room002-page--dev02 .mi .mi-listen:hover,
.room002-page--dev02 .mi .mi-listen:not([aria-disabled="true"]):not([data-kind="open"]):hover {background:transparent;color:#fff;box-shadow:none;transform:none}
.room002-page--dev02 .mi .mi-listen:hover .mi-listen__facet {color:#f0e20f}
.room002-page--dev02 .mi .mi-listen:hover::before {background:linear-gradient(127deg,rgba(224,238,235,.25),#303c3d 30%,#161e20 74%,rgba(224,238,235,.2))}
.room002-page--dev02 .mi .mi-listen[aria-disabled="true"] {color:#a5aca9;cursor:default;border:0;box-shadow:none}
.room002-page--dev02 .mi .mi-listen[aria-disabled="true"]::before {background:rgba(25,30,31,.9)}
.room002-page--dev02 .mi .mi-listen[aria-disabled="true"]>span {color:#a5aca9}
.room002-page--dev02 .mi .mi-listen[aria-disabled="true"] .mi-listen__outline {stroke-dasharray:4 4;opacity:.5}
.room002-page--dev02 .mi .mi-key,
.room002-page--dev02 .mi .mi-b__key:not(.mi-b__home) {
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  width:100%;min-width:0;max-width:220px;height:104px;min-height:80px;padding:12px 8px;
  border:0;border-bottom:1px solid rgba(234,240,235,.45);border-radius:0;
  background:transparent;color:#f1f3f1;font:600 1rem/1.2 var(--mi-mono);letter-spacing:.02em;text-transform:none;
}
.room002-page--dev02 .mi .mi-key svg,
.room002-page--dev02 .mi .mi-b__key:not(.mi-b__home) svg {display:block;width:clamp(84px,8vw,112px);max-width:100%;height:40px;flex-shrink:0}
.room002-page--dev02 .mi .mi-key:hover,
.room002-page--dev02 .mi .mi-b__key:not(.mi-b__home):hover {background:rgba(216,231,227,.09);color:#f0e20f}
.room002-page--dev02 .mi .mi-key:focus-visible,
.room002-page--dev02 .mi .mi-listen:focus-visible,
.room002-page--dev02 .mi .mi-b__key:focus-visible {outline:3px solid #f0e20f;outline-offset:5px}
.room002-page--dev02 .mi .mi-providers {margin:0}
.room002-page--dev02 .mi .mi-hint {font-size:.84rem;max-width:56ch;line-height:1.6;margin:14px auto 0}
.room002-page--dev02 .mi .mi-b__nav {display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:16px;max-width:650px;margin:18px auto}
.room002-page--dev02 .mi .mi-b__key:not(.mi-b__home):last-child {justify-self:end}
.room002-page--dev02 .mi .mi-b__link {border-width:1px;border-radius:2px;min-height:54px;font-size:.95rem;letter-spacing:.02em}
.room002-page--dev02 .mi .mi-b__link[data-kind="listen"] {background:rgba(22,29,31,.9);color:#f0e20f;border-color:rgba(239,242,232,.7)}
.room002-page--dev02 .mi .mi-c__step-button,
.room002-page--dev02 .mi .mi-c__text-button {min-height:54px}
/* Photo review modes remain readable in the real page and embedded preview. */
.room002-page--dev02 .mi .mi-photo-order {display:flex;align-items:center;flex-wrap:wrap;gap:8px 14px;font:500 .82rem/1.4 var(--mi-mono);color:#f2f3ec}
.room002-page--dev02 .mi .mi-photo-order select,
.room002-page--dev02 .mi .mi-photo-order button {min-height:46px;padding:8px 12px;max-width:100%;border:1px solid #949e99;background:#14191b;color:#f2f3ec;font:inherit;border-radius:3px}
.room002-page--dev02 .mi .mi-photo-order select:focus-visible,
.room002-page--dev02 .mi .mi-photo-order button:focus-visible {outline:2px solid #f0e20f;outline-offset:3px}
@media(max-width:599px) {
  .room002-page--dev02 .mi .mi-display {padding:22px 14px}
  .room002-page--dev02 .mi .mi-display__top {margin-bottom:24px}
  .room002-page--dev02 .mi .mi-title-line {font-size:clamp(2rem,10cqi,3.6rem)}
  .room002-page--dev02 .mi .mi-controls {grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 24px;max-width:420px}
  .room002-page--dev02 .mi .mi-listen-slot {grid-column:1/-1;grid-row:1}
  .room002-page--dev02 .mi .mi-listen {max-width:100%;height:108px}
  .room002-page--dev02 .mi .mi-key {grid-row:2;height:82px;min-height:82px;font-size:1rem;gap:8px;max-width:none}
  .room002-page--dev02 .mi .mi-key svg {width:96px;height:36px}
  .room002-page--dev02 .mi .mi-b__key:not(.mi-b__home) {height:84px;min-height:84px;font-size:.94rem}
  .room002-page--dev02 .mi .mi-b__key:not(.mi-b__home) svg {width:78px;height:34px}
}
@media(prefers-reduced-motion:reduce) {
  .room002-page--dev02 .mi .mi-listen,.room002-page--dev02 .mi .mi-key,
  .room002-page--dev02 .mi .mi-listen::before {animation:none!important;transition:none!important}
}
/* Avoid the legacy content-sized slot collapsing the new optical control. */
.room002-page--dev02 .mi .mi-listen-slot {width:100%;justify-self:stretch;align-self:stretch}
@media(max-width:599px){
 .room002-page--dev02 .mi .mi-listen:not([aria-disabled="true"]):not([data-kind="open"]) {max-width:100%;height:108px}
}
/* Journey controls use the same long, readable directional language. */
.room002-page--dev02 .mi .mi-c__journey-steps {grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.room002-page--dev02 .mi .mi-c__journey-steps button,
.room002-page--dev02 .mi .mi-c__journey-steps .mi-c__continue {
 display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
 min-height:90px;min-width:0;border-radius:0;padding:12px 8px;
 background:rgba(22,29,31,.6);color:#f1f3f1;border:1px solid rgba(234,240,235,.3);
 font:600 1rem/1.25 var(--mi-mono);letter-spacing:0;text-transform:none;white-space:normal;
}
.room002-page--dev02 .mi .mi-c__journey-steps svg {width:84px;max-width:100%;height:36px}
.room002-page--dev02 .mi .mi-c__journey-steps button:focus-visible {outline:3px solid #f0e20f;outline-offset:4px}
.room002-page--dev02 .mi .mi-c__journey-steps button:hover:not(:disabled) {color:#f0e20f;border-color:#f0e20f}
