/* Approved living-orb composition. Loaded after the existing responsive theme. */
.syren-redesign .syren-choice,
.syren-redesign .syren-session {
  background: #06040a;
}
.syren-redesign .syren-choice::before,
.syren-redesign .syren-choice::after,
.syren-redesign .syren-session::before,
.syren-redesign .syren-session::after { background: none !important; opacity: 0 !important; }
.syren-living-canvas {
  position: absolute;
  inset: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  display: block;
  pointer-events: none;
}
.syren-choice > :not(.syren-living-canvas),
.syren-session > :not(.syren-living-canvas) { position: relative; z-index: 1; }
.syren-orb[data-renderer=webgl] .syren-orb-glow,
.syren-orb[data-renderer=webgl] .syren-orb-core,
.syren-orb[data-renderer=webgl] .syren-orb-sheen { opacity: 0 !important; animation: none !important; }
.syren-orb[data-renderer=webgl] { animation: none !important; }

.syren-redesign .syren-choice {
  width: min(100%, 440px);
  min-height: 100dvh;
  height: 100dvh !important;
  overflow: hidden !important;
  margin: 0 auto !important;
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: max(12px, env(safe-area-inset-top)) 20px max(12px, env(safe-area-inset-bottom));
  box-shadow: none;
}
.syren-choice-heading { flex: none; align-items: flex-start; gap: 12px; }
.syren-redesign .syren-choice-heading .syren-wordmark {
  font: 500 30px/1 Cormorant, Georgia, serif;
  letter-spacing: .32em;
  text-transform: uppercase;
  background: linear-gradient(100deg, #f6e3b4, #d4af6a 28%, #8c6a33 50%, #f3d896 72%, #b8904f);
  background-size: 200% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: syren-orb-sheen 9s ease-in-out infinite;
}
@keyframes syren-orb-sheen { 50% { background-position: 100% 50%; } }
.syren-redesign .syren-brand-note {
  padding-top: 6px;
  max-width: 150px;
  font: 10.5px/1.6 -apple-system, BlinkMacSystemFont, sans-serif;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: #a79cb0;
  text-align: right;
}
.syren-redesign .syren-choice-intro {
  flex: none;
  margin: 16px 0 0;
  text-align: center;
}
.syren-choice-eyebrow {
  display: block;
  color: #c9a45c;
  font: 10.5px/1.4 -apple-system, BlinkMacSystemFont, sans-serif;
  letter-spacing: .34em;
  text-transform: uppercase;
}
.syren-choice-picker {
  display: flex;
  justify-content: center;
  align-self: center;
  width: max-content;
  max-width: 100%;
  gap: 6px;
  margin: 14px auto 0;
  padding: 4px;
  border: 1px solid rgba(233,216,180,.22);
  border-radius: 999px;
  background: rgba(255,255,255,.02);
  backdrop-filter: blur(8px);
}
.syren-choice-picker button {
  min-width: 0 !important;
  min-height: 44px !important;
  padding: 9px 15px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #a79cb0;
  font: 12px/1.2 -apple-system, BlinkMacSystemFont, sans-serif;
  letter-spacing: .2em;
  text-transform: uppercase;
  white-space: nowrap;
  transition: color .35s ease, background .35s ease, box-shadow .35s ease;
}
.syren-choice-picker button[aria-selected=true] {
  color: #f6e3b4;
  background: rgba(233,216,180,.08);
  box-shadow: inset 0 0 0 1px rgba(201,164,92,.55), 0 0 22px -8px #c9a45c;
}
.syren-redesign .syren-choice-card {
  flex: 1 1 auto !important;
  display: flex;
  flex-direction: column;
  min-height: 0;
  gap: 0;
  padding: 0;
  overflow: visible !important;
  justify-content: center;
  touch-action: pan-y;
}
.syren-redesign .syren-orb-stage {
  flex: 1 1 auto;
  position: relative;
  display: grid;
  place-items: center;
  height: auto;
  min-height: 150px;
  margin: 0;
  animation: none;
}
.syren-redesign .syren-choice .syren-orb {
  width: clamp(140px, min(36dvh, 78vw), 330px);
  height: clamp(140px, min(36dvh, 78vw), 330px);
  max-width: 100%;
}
.syren-choice-chevron {
  position: absolute;
  top: 50%;
  z-index: 2;
  transform: translateY(-50%);
  min-width: 54px !important;
  min-height: 54px !important;
  padding: 0;
  border: 0;
  background: transparent;
  color: #c9a45c;
  font: 34px/1 Cormorant, Georgia, serif;
  opacity: .75;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.syren-choice-chevron small { font: 9px/1.2 -apple-system, BlinkMacSystemFont, sans-serif; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }
.syren-choice-chevron-prev { left: -8px; }
.syren-choice-chevron-next { right: -8px; }
.syren-choice-info { display: flex; flex-direction: column; align-items: center; gap: 9px; width: 100%; text-align: center; }
.syren-redesign .syren-choice-card .syren-choice-info h2 {
  color: #eedfc0;
  font: 400 clamp(48px, 14vw, 64px)/1 Cormorant, Georgia, serif;
  letter-spacing: .01em;
}
.syren-redesign .syren-choice-traits {
  color: #c9a45c;
  font: 11px/1.3 -apple-system, BlinkMacSystemFont, sans-serif;
  letter-spacing: .28em;
  text-transform: uppercase;
}
.syren-redesign .syren-choice-teaser {
  width: 100%;
  max-width: 32ch;
  min-height: 2.8em;
  margin: 2px 0 0 !important;
  color: #eedfc0;
  opacity: .88;
  font: italic 400 19px/1.4 Cormorant, Georgia, serif;
  text-wrap: balance;
}
.syren-redesign .syren-choice-actions {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 12px;
  width: 100%;
  margin-top: 14px;
}
.syren-redesign .syren-choice-actions .syren-voice-preview,
.syren-redesign .syren-choice-actions .syren-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  width: 100%;
  height: 54px;
  min-height: 54px;
  border-radius: 999px;
  color: #eedfc0;
  font: 12px/1.2 -apple-system, BlinkMacSystemFont, sans-serif !important;
  letter-spacing: .14em;
  text-transform: uppercase;
  white-space: nowrap;
}
.syren-redesign .syren-choice-actions .syren-voice-preview {
  border: 1px solid rgba(233,216,180,.22);
  background: rgba(255,255,255,.03);
  backdrop-filter: blur(8px);
}
.syren-redesign .syren-choice-actions .syren-voice-preview[data-playing=true] { border-color: #c9a45c; box-shadow: 0 0 24px -6px #c9a45c; }
.syren-redesign .syren-choice-actions .syren-button {
  border: 1px solid transparent;
  color: #f6e3b4;
  letter-spacing: .2em;
  background: linear-gradient(#0e0a14,#0e0a14) padding-box,
    linear-gradient(100deg,#f6e3b4,#b8904f 40%,#f3d896 70%,#8c6a33) border-box;
  box-shadow: 0 10px 40px -12px #b3122e;
}
.syren-redesign .syren-choice-footer { flex: none; position: relative !important; display: grid; gap: 0; margin-top: 7px; }
.syren-redesign .syren-dots { gap: 10px; align-items: center; padding: 0; }
.syren-redesign .syren-dot,
.syren-redesign .syren-dot[aria-current=true] {
  display: block;
  width: 44px; height: 44px;
  min-width: 44px; min-height: 44px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(233,216,180,.25) 0 3px, transparent 4px);
  box-shadow: none;
}
.syren-redesign .syren-dot[aria-current=true] {
  width: 44px;
  min-width: 44px;
  border-radius: 4px;
  background: linear-gradient(#c9a45c,#c9a45c) center / 22px 7px no-repeat;
}
.syren-redesign .syren-dot::after { display: none; }
.syren-choice-hint { display: flex; justify-content: center; align-items: center; gap: 10px; color: #c9a45c; font: 10.5px/1.4 -apple-system, BlinkMacSystemFont, sans-serif; letter-spacing: .18em; text-transform: uppercase; }
.syren-choice-hint[data-faded=true] { opacity: 0; transition: opacity .6s ease; }
.syren-choice-settings { position: absolute; right: 0; top: 0; width: 44px; height: 44px; border: 0; background: transparent; color: #c9a45c; opacity: .72; display: grid; place-items: center; }
.syren-choice-hint span { width: 26px; height: 1px; background: linear-gradient(90deg,transparent,#c9a45c,transparent); animation: syren-orb-swipe 2.4s ease-in-out infinite; }
@keyframes syren-orb-swipe { 50% { transform: translateX(8px); opacity: 1; } 0%,100% { transform: translateX(-8px); opacity: .3; } }
.syren-redesign .syren-session-orb .syren-orb { width: min(58vw, 250px); height: min(58vw, 250px); }

@media (max-height: 700px) {
  .syren-redesign .syren-choice { padding-top: max(10px, env(safe-area-inset-top)); }
  .syren-redesign .syren-choice-intro { margin-top: 8px; }
  .syren-choice-picker { margin-top: 7px; }
  .syren-redesign .syren-orb-stage { min-height: 140px; }
  .syren-redesign .syren-choice .syren-orb { width: clamp(140px, min(28dvh, 56vw), 205px); height: clamp(140px, min(28dvh, 56vw), 205px); }
  .syren-redesign .syren-choice-info { gap: 5px; }
  .syren-redesign .syren-choice-card .syren-choice-info h2 { font-size: 46px; }
  .syren-redesign .syren-choice-teaser { font-size: 17px; }
  .syren-redesign .syren-choice-actions { margin-top: 8px; }
  .syren-redesign .syren-choice-footer { margin-top: 8px; }
}
@media (min-width: 700px) and (min-height: 700px) {
  .syren-redesign .syren-choice { width: min(100%, 1100px); padding-inline: clamp(32px, 6vw, 100px); }
  .syren-redesign .syren-choice-intro { margin-top: clamp(22px, 4vh, 48px); }
  .syren-redesign .syren-choice-card { display: grid; grid-template-columns: minmax(300px, 1fr) minmax(300px, 430px); align-items: center; gap: clamp(25px, 5vw, 90px); }
  .syren-redesign .syren-orb-stage { min-height: 340px; }
  .syren-redesign .syren-choice .syren-orb { width: min(32vw, 390px); height: min(32vw, 390px); }
  .syren-redesign .syren-choice-info { gap: 16px; }
  .syren-redesign .syren-choice-card .syren-choice-info h2 { font-size: clamp(60px, 6vw, 80px); }
  .syren-redesign .syren-choice-teaser { font-size: 23px; }
  .syren-redesign .syren-choice-footer { margin-top: 0; }
}
@media (min-width: 700px) and (orientation: portrait) {
  .syren-redesign .syren-choice { width: min(100%, 650px); }
  .syren-redesign .syren-choice-card { display: flex; flex-direction: column; justify-content: center; gap: 18px; }
  .syren-redesign .syren-orb-stage { flex: none; min-height: 0; height: min(34dvh, 390px); width: 100%; }
  .syren-redesign .syren-choice .syren-orb { width: min(34dvh, 390px); height: min(34dvh, 390px); }
  .syren-redesign .syren-choice-info { width: min(100%, 460px); align-self: center; gap: 10px; }
}
@media (orientation: landscape) and (max-height: 700px) {
  .syren-redesign .syren-choice { width: min(100%, 1100px); padding-top: max(4px, env(safe-area-inset-top)); padding-bottom: max(4px, env(safe-area-inset-bottom)); padding-inline: max(22px, env(safe-area-inset-left)) max(22px, env(safe-area-inset-right)); }
  .syren-redesign .syren-choice-heading .syren-wordmark { font-size: 25px; }
  .syren-redesign .syren-brand-note { font-size: 8px; line-height: 1.3; padding-top: 0; }
  .syren-redesign .syren-choice-intro { margin-top: 0; }
  .syren-choice-picker { margin-top: 2px; }
  .syren-redesign .syren-choice-card { display: grid; grid-template-columns: minmax(190px, 42%) minmax(270px, 1fr); align-items: center; gap: 24px; }
  .syren-redesign .syren-orb-stage { min-height: 0; height: 100%; }
  .syren-redesign .syren-choice .syren-orb { width: min(48dvh, 34vw); height: min(48dvh, 34vw); }
  .syren-redesign .syren-choice-info { gap: 2px; }
  .syren-redesign .syren-choice-card .syren-choice-info h2 { font-size: 44px; }
  .syren-redesign .syren-choice-actions { margin-top: 4px; }
  .syren-redesign .syren-choice-actions .syren-voice-preview, .syren-redesign .syren-choice-actions .syren-button { height: 44px; min-height: 44px; }
  .syren-redesign .syren-choice-footer { margin-top: 0; }
  .syren-choice-hint { font-size: 9px; line-height: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .syren-redesign .syren-choice-heading .syren-wordmark,
  .syren-choice-hint span { animation: none !important; }
  .syren-living-canvas { display: none; }
}
