#player-shell[data-ambient="true"] {cursor: none;}
/* The 16px corner gesture sits outside the button's 44px hit target. The
   catalogue control never overlaps the singing stage's play/pause transport. */
.ambient-corner-controls {
  position: fixed; left: max(20px, env(safe-area-inset-left));
  bottom: max(12px, env(safe-area-inset-bottom)); z-index: 18; display: none;
}
body[data-phase="catalogue"] .ambient-corner-controls,
body[data-phase="results"] .ambient-corner-controls {display: block;}
.ambient-fullscreen {
  width: 44px; height: 44px; display: grid; place-items: center; padding: 0;
  border: 1px solid transparent; border-radius: 10px; background: transparent;
  color: #fffdf2; opacity: .35; cursor: pointer; box-shadow: none;
  transition: opacity .2s ease, background .2s ease, border-color .2s ease;
}
.ambient-fullscreen svg {fill: none; stroke: currentColor; stroke-width: 1.35; stroke-linecap: round; stroke-linejoin: round;}
.ambient-fullscreen:hover {opacity: .8; background: #fffdf210; border-color: #fffdf22b;}
.ambient-fullscreen:focus-visible {opacity: 1; outline: 2px solid #fffdf2; outline-offset: 2px; background: #101817d9;}
.ambient-wallpaper-corner {
  position: fixed; left: 0; bottom: 0; width: 16px; height: 16px; z-index: 19;
  pointer-events: none; opacity: 0; border: solid #c5e5d4; border-width: 0 0 2px 2px;
}
.ambient-wallpaper-corner[data-armed="true"] {opacity: .55; animation: ambient-corner-ready .65s ease both;}
@keyframes ambient-corner-ready {from {opacity: .12;} to {opacity: .7; filter: drop-shadow(0 0 5px #c5e5d4);}}
.ambient-shortcut-status {position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;}
@media (prefers-reduced-motion: reduce) {
  .ambient-fullscreen {transition: none;}
  .ambient-wallpaper-corner[data-armed="true"] {animation: none;}
}
/* Opacity keeps the catalogue geometry stable and all art canvases running. */
#player-shell[data-ambient="true"] [data-ambient-ui] {
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 2s ease !important;
}
/* The marker is removed on activity, so normal UI returns without this fade. */
.inza-ambient-sign {
  position: fixed; inset: 0; z-index: 3; display: grid; place-items: center;
  pointer-events: none; user-select: none; overflow: hidden;
  opacity: 0; visibility: hidden;
  transition: opacity .45s ease, visibility 0s linear .45s;
}
#player-shell[data-ambient="true"] .inza-ambient-sign[data-visible="true"] {
  visibility: visible; opacity: var(--ambient-sign-opacity, .76);
  transition: none;
}
.ambient-sign-lockup {
  display: grid; justify-items: center; gap: clamp(24px, 4vh, 52px);
  transform: scale(var(--ambient-sign-scale, 1)); transform-origin: center;
  color: #f3f0e6; width: min(72vw, 360px);
}
.ambient-sign-symbol {position: relative; display: block; width: clamp(104px, 21vmin, 246px); aspect-ratio: 1;}
.ambient-sign-symbol img {display: block; width: 100%; height: 100%; opacity: .94;}
.ambient-sign-colour, .ambient-sign-glint {
  display: block; position: absolute; inset: 0;
  -webkit-mask: url('/brand/inza-symbol.svg') center / contain no-repeat;
  mask: url('/brand/inza-symbol.svg') center / contain no-repeat;
}
.ambient-sign-colour {opacity: 0;}
.ambient-sign-glint {opacity: 0;}
.ambient-sign-name {
  color: inherit; font-family: Inter, ui-sans-serif, system-ui, sans-serif;
  font-weight: 850; font-size: clamp(30px, 4.6vmin, 58px); line-height: 1;
  letter-spacing: -.065em; white-space: nowrap;
}
.ambient-sign-club {font-size: .37em; font-weight: 400; letter-spacing: .19em; margin-left: .14em;}
.inza-ambient-sign[data-treatment="ivory"] .ambient-sign-symbol img {
  opacity: .94; filter: url(#inza-ambient-outline) drop-shadow(0 0 7px #fff5d930);
}
.inza-ambient-sign[data-treatment="ivory"] .ambient-sign-colour {
  opacity: 0;
}
.inza-ambient-sign[data-treatment="prism"] .ambient-sign-colour {
  opacity: 1; background: linear-gradient(120deg, #c3f1ef, #d8b3e8 28%, #f6d09d 48%, #c9f2d7 67%, #b6d8ff 85%);
  background-size: 220% 100%; background-position: var(--ambient-spectral-position, 30%) 50%;
  filter: drop-shadow(0 0 var(--ambient-sign-glow, 12px) #a4d4f54a);
}
.inza-ambient-sign[data-treatment="neon"] .ambient-sign-symbol {
  filter: drop-shadow(0 0 var(--ambient-sign-glow, 12px) #8bf2dc66);
}
.inza-ambient-sign[data-treatment="neon"] .ambient-sign-colour {
  opacity: 1; background: linear-gradient(140deg, #e1ffe7, #7ccfc6 44%, #ddfff0 74%, #8ed2cf);
}
.inza-ambient-sign[data-treatment="neon"] .ambient-sign-glint {
  opacity: .9;
  background: linear-gradient(108deg, transparent 41%, #ffffff 49%, #fffdecc0 52%, transparent 60%);
  background-size: 240% 100%; background-position: var(--ambient-glint-position, -60%) 50%;
}
.inza-ambient-sign[data-reduced="true"] .ambient-sign-lockup {transform: none;}
.inza-ambient-sign[data-reduced="true"] .ambient-sign-symbol img {filter: none;}
.inza-ambient-sign[data-reduced="true"] .ambient-sign-colour,
.inza-ambient-sign[data-reduced="true"] .ambient-sign-glint {display: none;}
@media (prefers-reduced-motion: reduce) {
  #player-shell[data-ambient="true"] [data-ambient-ui] {transition-duration: .2s !important;}
  .inza-ambient-sign .ambient-sign-lockup {transform: none;}
  .inza-ambient-sign {transition: none;}
}

.ambient-sign-filters {position: absolute; width: 0; height: 0; overflow: hidden;}

/* Animate the measured waveform itself, then release its compositor animation.
   Neither this state nor its return changes the user's waveform preference. */
#browse-waveform-canvas[data-ambient-wave="exiting"] {will-change: transform, opacity, clip-path, filter;}
#browse-waveform-canvas[data-ambient-wave="hidden"] {opacity: 0 !important; visibility: hidden !important;}

/* A transparent 3D overlay; the slot below keeps the wordmark in the lockup. */
.ambient-glass-canvas {position: absolute; inset: 0; width: 100%; height: 100%; display: none; pointer-events: none;}
.inza-ambient-sign[data-treatment="glass"] .ambient-glass-canvas {display: block;}
.inza-ambient-sign[data-treatment="glass"] .ambient-sign-symbol {width: clamp(160px, 33vmin, 440px); visibility: hidden;}
.inza-ambient-sign[data-treatment="glass"] .ambient-sign-lockup {transform: none;}
.inza-ambient-sign[data-treatment="glass"] .ambient-sign-name {opacity: var(--ambient-name-opacity, 1);}

/* Brech wallpaper keeps the collaboration in the margins while the world owns
   the screen. It has no central INZA logo or full-screen readability scrim. */
#player-shell[data-ambient-brech="true"] #browse-party {opacity: 1;}
#player-shell[data-ambient-brech="true"] .browse-backdrop-shade {opacity: 0;}
#player-shell[data-ambient-brech="true"] .inza-ambient-sign {visibility: hidden; opacity: 0;}
.brech-ambient-sign {
  position: fixed; inset: 0; z-index: 3; pointer-events: none; user-select: none;
  color: #fffdf2; font-family: "Helvetica Neue", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
.brech-ambient-sign[hidden] {display: none;}
.brech-ambient-identity {position: absolute; top: 32px; left: 42px; text-shadow: 0 1px 12px #0003;}
.brech-ambient-identity>span {display: block; font-size: 30px; font-weight: 780; letter-spacing: -1.4px; line-height: 1.2;}
.brech-ambient-identity i {font-style: normal; font-size: 22px; font-weight: 300; vertical-align: 3px; margin: 0 8px;}
.brech-ambient-identity b {font-weight: 900; letter-spacing: -2px;}
.brech-ambient-identity small {display: block; margin-top: 7px; font-size: 9px; text-transform: uppercase; letter-spacing: 2.3px; font-weight: 600;}
.brech-ambient-sign footer {
  position: absolute; bottom: 20px; left: 42px; right: 42px; display: flex;
  justify-content: space-between; align-items: flex-end; gap: 20px;
  font-size: 9px; line-height: 1.4; letter-spacing: .2px; opacity: .65;
  text-shadow: 0 1px 10px #0008;
}
.brech-ambient-edition {text-align: right; flex-shrink: 0;}
@media (max-width: 760px) {
  .brech-ambient-identity {top: max(22px, env(safe-area-inset-top)); left: 20px;}
  .brech-ambient-identity>span {font-size: 25px;}
  .brech-ambient-identity small {font-size: 7px; letter-spacing: 1.5px;}
  .brech-ambient-sign footer {bottom: max(13px, env(safe-area-inset-bottom)); left: 20px; right: 20px; gap: 12px; font-size: 7px;}
  .brech-ambient-credit {max-width: 220px;}
  .brech-ambient-edition {max-width: 90px; flex-shrink: 1;}
}