.builder-hero { background: linear-gradient(135deg, #17151b 20%, #56305d); padding: 5rem 0 4rem; text-align: center; }
.builder-hero h1 { font-size: clamp(2.3rem, 6vw, 4rem); font-weight: 700; }
.builder-hero > .container > p:last-child { color: var(--muted); font-size: 1.1rem; margin: 1rem auto 0; max-width: 42rem; }
.builder-layout { display: grid; gap: 2rem; grid-template-columns: minmax(0, 1.5fr) minmax(280px, .8fr); padding-bottom: 4rem; padding-top: 4rem; }
.builder-panel, .preview-panel { background: var(--card); border: 1px solid #403a48; border-radius: .85rem; padding: clamp(1.25rem, 3vw, 2rem); }
.prompt-builder { background: linear-gradient(135deg, #1b1920, #332437); border: 1px solid #5c4661; border-radius: .75rem; margin: 1.5rem 0 2rem; padding: 1.25rem; }
.prompt-builder h3 { font-size: 1.2rem; margin-top: 0; }
.prompt-builder textarea { margin-bottom: 1rem; resize: vertical; }
.preview-panel { align-self: start; position: sticky; top: 5rem; }
.builder-row { display: grid; gap: 1rem; grid-template-columns: 1fr 1fr; }
.builder-panel label, .builder-panel legend { color: var(--ink); font-weight: 700; }
.builder-panel legend { font-size: 1rem; }
.field-help, .builder-panel small, .preview-panel p, .player-note { color: var(--muted); }
.segment-options { display: grid; gap: .75rem; grid-template-columns: 1fr 1fr; margin-bottom: 1.5rem; }
.segment-options label { align-items: flex-start; background: #1b1920; border: 1px solid #494250; border-radius: .65rem; cursor: pointer; display: flex; gap: .75rem; margin: 0; padding: 1rem; }
.segment-options label:focus-within { outline: 3px solid #dfb8e6; outline-offset: 2px; }
.segment-options input { margin-top: .3rem; }
.segment-options span { display: grid; }
.segment-options small { font-weight: 400; }
.settings-row { margin-top: 1.5rem; }
.voice-preference { margin-top: .5rem; }
.builder-actions, .player-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.form-message { color: #ffd9a6; min-height: 1.5rem; }
.session-plan { border-left: 2px solid var(--accent); list-style: none; margin: 1.5rem 0; padding-left: 1rem; }
.session-plan li { display: flex; gap: .75rem; justify-content: space-between; padding: .55rem 0; }
.session-plan time { color: var(--muted); white-space: nowrap; }
.saved-box { border-top: 1px solid #494250; margin-top: 1.5rem; padding-top: 1.5rem; }
.saved-box h3 { font-size: 1.05rem; }
.player-shell { background: radial-gradient(circle at top, #56305d, #131116 62%); inset: 0; min-height: 100vh; overflow-y: auto; padding: 5rem 0; position: fixed; z-index: 3000; }
.player-content { max-width: 760px; text-align: center; }
.current-step { font-size: clamp(1.25rem, 3vw, 1.8rem); margin: 3rem auto 1rem; max-width: 38rem; min-height: 5rem; }
.timer { font-size: clamp(4rem, 14vw, 8rem); font-variant-numeric: tabular-nums; font-weight: 300; letter-spacing: -.05em; }
.player-shell .progress { background: #322d38; height: .5rem; margin: 2rem auto; max-width: 36rem; }
.player-shell .progress-bar { background: var(--accent); }
.player-actions { justify-content: center; }
.player-actions .btn-link { color: #dfb8e6; }
.player-note { font-size: .9rem; margin: 2rem auto 0; max-width: 36rem; }
body.session-active { overflow: hidden; }
@media (max-width: 800px) {
  .builder-layout { grid-template-columns: 1fr; }
  .preview-panel { position: static; }
}
@media (max-width: 560px) {
  .builder-row, .segment-options { grid-template-columns: 1fr; }
  .builder-hero { padding: 3.5rem 0 3rem; }
}

