.experience-picker, .experience-next, .experience-ready, .experience-return {
  color: var(--ink, var(--text));
  overflow-wrap: anywhere;
}
.experience-picker { margin-block: 1.4rem; text-align: start; }
.experience-picker h2 { margin: 0 0 .8rem; font-size: 1.1rem; line-height: 1.4; letter-spacing: normal; }
.experience-choices { display: flex; flex-wrap: wrap; gap: .45rem; margin-block: .7rem; }
.experience-choices button {
  min-height: 44px; padding: .6rem .8rem; border: 1px solid var(--line); border-radius: .65rem;
  background: transparent; color: inherit; font: inherit; font-size: .83rem; cursor: pointer;
}
.experience-choices button[aria-pressed="true"] { background: color-mix(in srgb, var(--cyan) 13%, transparent); border-color: var(--cyan); }
.experience-card { padding: 1.15rem; margin-block: .6rem; border: 1px solid var(--line); border-radius: 1rem; background: linear-gradient(125deg, #50d6ff0d, #9f73ff12); }
.experience-team { margin: 0; color: var(--cyan); font-size: .68rem; letter-spacing: .13em; font-weight: 700; }
.experience-card h3 { margin: .5rem 0; font-size: 1.28rem; line-height: 1.3; letter-spacing: -.02em; }
.experience-card .experience-aim { margin-block: .5rem; color: var(--muted); font-size: .92rem; line-height: 1.55; }
.experience-card .button { margin-block-start: .8rem; min-height: 44px; font-size: .86rem; }
.experience-message summary { padding-block: .5rem; cursor: pointer; font-size: .8rem; color: var(--cyan); }
.experience-message p { font-size: .95rem; line-height: 1.65; margin-block: .5rem; }
.experience-account-note { display: block; color: var(--muted); font-size: .76rem; line-height: 1.6; margin-block: .7rem 0; }
.experience-return { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; padding: 1.2rem; margin-block: 1.2rem; border: 1px solid var(--line); border-radius: 1rem; background: var(--panel-soft, var(--surface)); }
.experience-return > div { flex: 1 1 15rem; }
.experience-return p { margin: .4rem 0 0; font-size: .85rem; color: var(--muted); }
.experience-return > a { font-size: .85rem; }
.experience-next, .experience-ready { border: 1px solid var(--line); border-radius: 1rem; padding: 1.2rem; margin-block: 1.5rem; }
.experience-next h2 { font-size: 1.2rem; }
.experience-next > p { font-size: .9rem; }
.experience-ready blockquote { margin: 1rem 0; border-inline-start: 3px solid var(--cyan); padding-inline-start: 1rem; line-height: 1.7; }
.experience-debate-intro h3 { font-size: 1.4rem; margin: 1.5rem 0 .5rem; }
.experience-debate-intro p { color: var(--muted); max-width: 70ch; font-size: .93rem; line-height: 1.6; }
[data-debate-preview] .home-conversation-turn { width: 100%; margin-inline: 0; }
[data-debate-preview] .home-conversation-turn > p { max-width: 75ch; }
[data-experience-picker] [hidden], [data-debate-preview] [hidden], .experience-return[hidden], [data-next-prompt][hidden] { display: none !important; }
:is(.experience-picker,.experience-next,.experience-return,[data-debate-preview]) :is(a,button,summary):focus-visible { outline: 3px solid var(--cyan); outline-offset: 4px; }
.constellation-hero-grid { padding-block: clamp(2.5rem, 4vw, 4rem); }
.constellation-copy h1 { font-size: clamp(3rem, 5.1vw, 5.4rem); max-width: 14ch; }
.constellation-copy .hero-actions { margin-block: 1rem; }
.constellation-copy .hero-actions .button { padding: .55rem .8rem; font-size: .8rem; }
.constellation-copy .constellation-caveat { font-size: .72rem; }
@media (max-width: 900px) {
  .constellation-hero-grid { gap: 1.5rem; padding-top: 2.5rem; }
  .constellation-copy .experience-picker { max-width: 34rem; margin-inline: auto; }
}
@media (max-width: 600px) {
  .constellation-copy h1 { font-size: clamp(2.5rem, 11vw, 3.8rem); }
  .experience-choices button { flex: 1 1 auto; }
  .experience-return > a { width: 100%; }
  .experience-card { padding: 1rem; }
  .experience-card .button { width: 100%; box-sizing: border-box; text-align: center; }
}
@media (forced-colors: active) { .experience-choices button[aria-pressed="true"] { outline: 2px solid Highlight; } }
