/* One rounded, translucent control treatment across the story and real intake. */
.experience-page {
  --glass-light: linear-gradient(145deg, #fffffff0, #ffffff55 52%, #ffffff80);
  --glass-dark: linear-gradient(155deg, #ffffff26, #ffffff02 58%), #252525e6;
  --glass-edge: #ffffffc9;
  --glass-shadow: inset 0 1px 0 #ffffffed, inset 0 -1px 0 #ffffff55, 0 5px 18px #1717170d;
  --glass-dark-shadow: inset 0 1px 0 #ffffff55, inset 0 -1px 0 #11111140, 0 7px 20px #17171720;
}
.experience-page :is(.button, .header-cta, .nav-link, .motion-toggle, .text-link,
  .onboarding-primary, .onboarding-secondary, .onboarding-back, .onboarding-edit,
  .onboarding-start-again, .story-planner-dialog-close, .opening-action, :where(.footer-top) > a) {
  border: 1px solid var(--glass-edge);
  border-radius: 999px;
  overflow: hidden;
  isolation: isolate;
  background: var(--glass-light);
  color: #303030;
  box-shadow: var(--glass-shadow);
  -webkit-backdrop-filter: blur(18px) saturate(0);
  backdrop-filter: blur(18px) saturate(0);
  text-decoration: none;
  transform: none;
  translate: 0 0;
  transition: translate .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.experience-page :is(.button, .onboarding-primary, .opening-action) {
  color: #fafafa;
  background: var(--glass-dark);
  border-color: #ffffff47;
  box-shadow: var(--glass-dark-shadow);
}
.experience-page :is(.button, .header-cta, .nav-link, .motion-toggle, .text-link,
  .onboarding-primary, .onboarding-secondary, .onboarding-back, .onboarding-edit,
  .onboarding-start-again, .story-planner-dialog-close, .opening-action, :where(.footer-top) > a):is(:disabled, [aria-disabled='true']) {
  opacity: .65;
  cursor: default;
}
.experience-page :is(button, .button, .header-cta, .nav-link, .text-link, .opening-action, :where(.footer-top) > a):focus-visible {
  outline: 2px solid #656565;
  outline-offset: 4px;
}
.experience-page .opening-action:focus-visible { outline-color: #656565; }
.experience-page .header-cta { padding: 11px 17px; gap: 18px; }
.experience-page .nav-link { padding: 11px 16px; }
.experience-page .motion-toggle { padding: 10px 15px; }
.experience-page .motion-toggle[aria-pressed='true'] { background: var(--glass-dark); color: #fafafa; }
.experience-page .motion-toggle:disabled { opacity: .65; }
.experience-page .text-link { padding: 11px 17px; }
.experience-page .footer-top > a { display: inline-flex; align-items: center; min-height: 44px; padding: 10px 15px; }
.experience-page .onboarding-primary { padding-inline: 22px; }
.experience-page :is(.onboarding-secondary, .onboarding-back) { padding: 12px 18px; min-height: 44px; }
.experience-page .onboarding-edit { padding: 8px 13px; min-height: 34px; }
.experience-page .onboarding-start-again { padding: 10px 15px; }
.experience-page .opening-action { width: fit-content; padding: 11px 12px 11px 22px; gap: 22px; }
.experience-page .opening-arrow {
  border-color: #ffffff70;
  background: linear-gradient(145deg, #ffffff38, #ffffff09);
  box-shadow: inset 0 1px 0 #ffffff7a;
  width: 52px;
  height: 52px;
  flex: none;
}
/* Independent translation leaves the closing arrow's scroll rotation intact. */
.experience-page :is(.button, .header-cta, .text-link, .onboarding-primary) > [aria-hidden='true'] {
  display: inline-block;
  translate: 0 0;
  transition: translate .18s ease;
}
.experience-page .opening-action .opening-arrow {
  transform: rotate(calc((1 - var(--scene-progress,1)) * 70deg));
  translate: 0 0;
  transition: translate .18s ease, background .18s ease, border-color .18s ease;
}
.experience-page .opening-action small { color: #e1e1e1; }
.experience-page .onboarding-option {
  border-radius: 23px;
  border-color: #ffffff;
  background: var(--glass-light);
  box-shadow: var(--glass-shadow);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}
.experience-page .onboarding-option:hover { border-color: #ffffff; background: var(--glass-light); }
.experience-page .onboarding-option:has(input:checked) {
  background: var(--glass-dark);
  border-color: #ffffff66;
  color: #fafafa;
  box-shadow: var(--glass-dark-shadow);
}
.experience-page .onboarding-option:has(input:checked) .onboarding-option-detail { color: #dedede; }
.experience-page .onboarding-option:has(input:focus-visible) { outline: 2px solid #626262; outline-offset: 3px; }
.experience-page .onboarding-option input {
  appearance: none;
  -webkit-appearance: none;
  display: grid;
  place-content: center;
  width: 16px;
  height: 16px;
  border: 1px solid #848484;
  border-radius: 50%;
  background: #ffffff52;
  color: #fafafa;
}
.experience-page .onboarding-option input::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; transform: scale(0); }
.experience-page .onboarding-option input:checked { border-color: #ffffffbd; background: #ffffff18; }
.experience-page .onboarding-option input:checked::before { transform: scale(1); }
.experience-page .onboarding-option input[type='checkbox']::before { width: 7px; height: 4px; border-radius: 0; border-left: 2px solid currentColor; border-bottom: 2px solid currentColor; background: none; }
.experience-page .onboarding-option input[type='checkbox']:checked::before { transform: translateY(-1px) rotate(-45deg); }
.experience-page .onboarding-business-input { border: 1px solid #ffffff; border-radius: 21px; padding: 16px 19px; background: var(--glass-light); box-shadow: var(--glass-shadow); }
.experience-page .onboarding-business-input:focus-visible { border: 1px solid #656565; outline: 2px solid #656565; outline-offset: 3px; }
.experience-page .onboarding-business-input[aria-invalid='true'] { border-color: #944434; }
.experience-page .story-planner-dialog {
  border-radius: 28px;
  border-color: #ffffffb3;
  background: linear-gradient(145deg, #fffffff0, #f1f1f1dc);
  -webkit-backdrop-filter: blur(26px);
  backdrop-filter: blur(26px);
  box-shadow: inset 0 1px 0 #ffffff, 0 24px 90px #00000035;
}
.experience-page .story-planner-dialog-header { background: #ffffff3d; border-bottom-color: #ffffff8c; }
.experience-page .story-planner-dialog-content > .onboarding-panel { background: transparent; }
.experience-page .onboarding-panel { border-radius: 26px; }
.experience-page .question-list details { border: 0; padding-block: 5px; }
.experience-page .question-list summary {
  border: 1px solid var(--glass-edge);
  border-radius: 24px;
  padding-inline: 17px;
  background: var(--glass-light);
  box-shadow: var(--glass-shadow);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  transition: border-color .18s ease, box-shadow .18s ease;
}
.experience-page .question-list details[open] > p { padding-inline: 17px; }
@media (hover: hover) and (pointer: fine) {
  .experience-page :is(.button, .header-cta, .nav-link, .motion-toggle, .text-link,
    .onboarding-primary, .onboarding-secondary, .onboarding-back, .onboarding-edit,
    .onboarding-start-again, .story-planner-dialog-close, .opening-action, :where(.footer-top) > a):hover:not(:disabled):not([aria-disabled='true']) {
    border-color: #ffffff;
    box-shadow: inset 0 1px 0 #ffffff, inset 0 -1px 0 #ffffff45, 0 8px 22px #1717171c;
    text-decoration: none;
  }
  .experience-page .onboarding-option:hover:not(:has(input:checked, input:disabled)) { border-color: #b0b0b0; background: #ffffffbd; }
  .experience-page .question-list summary:hover { border-color: #b0b0b0; box-shadow: inset 0 1px 0 #ffffff, 0 4px 14px #1717170d; }
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  html:not([data-motion='paused']):not([data-motion='reduced']) .experience-page :is(.button, .header-cta, .nav-link, .motion-toggle, .text-link,
    .onboarding-primary, .onboarding-secondary, .onboarding-back, .onboarding-edit,
    .onboarding-start-again, .story-planner-dialog-close, .opening-action, :where(.footer-top) > a):hover:not(:disabled):not([aria-disabled='true']) { translate: 0 -2px; }
  html:not([data-motion='paused']):not([data-motion='reduced']) .experience-page :is(.button, .header-cta, .text-link, .onboarding-primary, .opening-action):hover:not(:disabled):not([aria-disabled='true']) > [aria-hidden='true'] { translate: 2px -2px; }
  html:not([data-motion='paused']):not([data-motion='reduced']) .experience-page :is(.button, .header-cta, .nav-link, .motion-toggle, .text-link,
    .onboarding-primary, .onboarding-secondary, .onboarding-back, .onboarding-edit,
    .onboarding-start-again, .story-planner-dialog-close, .opening-action, :where(.footer-top) > a):active:not(:disabled):not([aria-disabled='true']) { translate: 0 0; }
}
html:is([data-motion='paused'], [data-motion='reduced']) .experience-page :is(button, .button, .header-cta, .nav-link, .text-link, .onboarding-primary, .opening-action,
  :where(.footer-top) > a, .onboarding-option, .question-list summary, .opening-arrow),
html:is([data-motion='paused'], [data-motion='reduced']) .experience-page :is(.button, .header-cta, .text-link, .onboarding-primary, .opening-action) > [aria-hidden='true'] { transition: none; }
@media (max-width: 760px) {
  .experience-page .header-cta { padding: 9px 12px; gap: 8px; }
  .experience-page .header-cta>span { font-size: 17px; }
  .experience-page .motion-toggle { padding: 10px 14px; }
  .experience-page .opening-action { padding: 10px 11px 10px 18px; gap: 17px; }
  .experience-page .opening-arrow { width: 44px; height: 44px; }
  .experience-page .story-planner-dialog { border-radius: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .experience-page :is(button, .button, .header-cta, .nav-link, .text-link, .onboarding-primary, .opening-action,
    :where(.footer-top) > a, .onboarding-option, .question-list summary, .opening-arrow),
  .experience-page :is(.button, .header-cta, .text-link, .onboarding-primary, .opening-action) > [aria-hidden='true'] { transition: none; }
}
@media (forced-colors: active) {
  .experience-page .onboarding-option input { appearance: auto; -webkit-appearance: auto; }
  .experience-page .onboarding-option input::before { display: none; }
}