.flow-shell{max-width:1120px;padding:0 0 70px;min-height:calc(100svh - 245px)}
.flow-top{display:flex;align-items:center;gap:22px;padding:20px 0 24px;margin-bottom:30px}
.flow-top .back-link{margin:0;min-height:44px;flex:1}
.flow-top .progress-steps{border:0;padding:0;margin:0;font-size:10px;letter-spacing:.3px}
.flow-meter{width:100px;height:2px;background:var(--line)}
.flow-progress-fill{height:2px;background:var(--ink)}
.flow-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:80px;align-items:center}
.flow-aside{min-width:0;align-self:center;padding-top:12px}
.flow-aside>img{width:100%;aspect-ratio:1.12;object-fit:cover;filter:saturate(.65)}
.flow-art-caption{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.6px;color:var(--muted);margin-top:16px}
.flow-quote{font:400 21px/1.85 var(--serif);color:var(--muted);white-space:pre-line;letter-spacing:-.7px;margin:40px 0 0}
.flow-content{min-width:0}
.flow-content>.eyebrow{color:#968c7b;letter-spacing:2px;font-size:10px;margin-bottom:20px}
.flow-content .form-title{font-size:38px;line-height:1.65;margin:0 0 18px;letter-spacing:-1.7px}
.flow-content .form-intro{font-size:13px;margin-bottom:28px;line-height:1.9}
.flow-content .field{margin:20px 0}
.flow-content textarea,.flow-content .input{border-radius:2px;font-size:14px;padding:18px;box-shadow:none}
.flow-content textarea{min-height:200px}
.flow-content textarea.short{min-height:120px}
.flow-content .field>label{font-size:12px;font-weight:400;color:var(--muted)}
.flow-content .form-actions{border:0;padding-top:12px;margin-top:24px;align-items:center}
.flow-content .form-actions .primary{border-radius:2px;padding:15px 25px;min-height:54px;font-size:14px}
.flow-content .form-actions .secondary{border:0;border-radius:0;padding:10px 0;text-decoration:underline;text-underline-offset:4px;font-size:12px}
.flow-content #save-status{font-size:10px;line-height:1.8;margin-top:20px;color:#928a7e}
.flow-content .purpose-choice{border-radius:2px;padding:20px 17px;min-height:112px;background:transparent}
.flow-content .purpose-choice:hover{background:var(--soft);color:var(--ink);border-color:#b4aa9b}
.flow-content .purpose-choice:hover small,.flow-content .purpose-choice:hover .purpose-arrow{color:var(--muted)}
.flow-content .purpose-copy strong{font-family:var(--sans);font-size:15px;letter-spacing:-.3px;font-weight:500}
.flow-content .purpose-copy small{font-size:10px;margin-top:8px;line-height:1.8}
.flow-content .purpose-arrow{font-size:18px}
.music-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
.music-choice{position:relative;text-align:left;min-width:0;min-height:88px;padding:20px 17px;border:1px solid var(--line);background:transparent;color:var(--ink);border-radius:2px;transition:background .16s,border-color .16s}
.music-choice .choice-name{display:block;font-size:15px;font-weight:500;padding-right:12px;line-height:1.6}
.music-choice small{display:block;color:var(--muted);font-size:10px;margin-top:6px;line-height:1.8}
.music-choice:hover{background:var(--soft)}
.music-choice[aria-pressed=true]{background:#e9e1d5;border-color:#655c4f}
.music-choice[aria-pressed=true]:after{content:'✓';position:absolute;right:10px;top:9px;font-size:11px;color:#4d463d}
.mood-choices .music-choice{min-height:64px;display:flex;align-items:center;padding:15px 17px}
.mood-choices .choice-name{font-size:14px;font-weight:400}
.vocal-choices{grid-template-columns:1fr}
.vocal-choices .music-choice{min-height:72px;padding:15px 19px}
.choice-help{font-size:11px;color:var(--muted);margin:14px 0 0;line-height:1.8}
.custom-preference{margin-top:20px}
.custom-preference>label{display:block;margin-bottom:10px;font-size:12px}
.custom-preference textarea{font-size:14px;min-height:100px}
body[data-question=genre] #genre~.choice-help,body[data-question=mood] #mood~.choice-help{display:block}
body[data-question=genre] .field:has(#genre)>label,body[data-question=mood] .field:has(#mood)>label,body[data-question=vocal] .field:has(#vocal)>label{display:none}
.workspace-shell{max-width:1000px;padding:32px 0 70px}
.workspace-shell>.eyebrow{font-size:10px;letter-spacing:2px;color:#968c7b}
.workspace-shell .form-title{font-size:38px;margin-bottom:14px}
.workspace-shell .form-intro{font-size:13px}
.workspace-shell .progress-steps{font-size:11px;padding:17px 0;gap:26px;border-top:1px solid var(--line)}
.workspace-shell .notice{border-radius:2px;background:#ece6dc;border:0;padding:15px 18px;font-size:11px;line-height:1.9}
.workspace-shell .summary-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;margin:23px 0 32px}
.workspace-shell .summary-grid small{font-size:10px;color:#928674;letter-spacing:.4px}
.workspace-shell .summary-grid p{font-size:12px;line-height:1.9}
.editor-layout{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:42px;align-items:start}
.editor-aside{border-left:1px solid var(--line);padding-left:28px;margin-top:27px}
.editor-aside img{aspect-ratio:1;object-fit:cover;filter:saturate(.6);margin-bottom:22px}
.editor-aside h2{font-size:20px;margin:0 0 10px}
.editor-aside p{font-size:12px;line-height:1.9;color:var(--muted);margin:0 0 20px}
.editor-aside small{font-size:9px;letter-spacing:1px;color:#918675}
.workspace-shell .input,.workspace-shell textarea{border-radius:2px;background:var(--panel)}
.workspace-shell .lyrics-area{min-height:500px;font:14px/2.1 var(--sans);padding:24px}
.workspace-shell .field>label{font-size:12px;color:var(--muted);font-weight:400}
.workspace-shell .form-actions .primary,.workspace-shell .form-actions .secondary{border-radius:2px}
.workspace-shell .audio-card{margin:0;padding:26px;background:var(--panel);border:1px solid var(--line)}
.preview-layout{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;margin:35px 0}
.preview-layout .preview-art{width:100%;min-width:0}
.preview-layout .sample-play{padding:8px 0;font-size:11px;white-space:nowrap}
.preview-layout .audio-row{align-items:flex-start;gap:15px;flex-direction:column}
.preview-layout .audio-row strong{font:400 24px/1.6 var(--serif);letter-spacing:-.5px}
.preview-layout .waveform{margin:18px 0}
.workspace-shell .draft-card{border-radius:2px;padding:30px;background:var(--panel);max-width:730px;margin-bottom:30px}
.draft-record{display:flex;align-items:center;gap:26px;margin-bottom:25px}
.draft-record img{width:110px;aspect-ratio:1;object-fit:cover}
.draft-record h2{margin-top:0}
@media(max-width:1000px){.flow-grid{gap:40px}.flow-content .form-title{font-size:32px}.flow-aside>img{aspect-ratio:1}.flow-art-caption{font-size:8px;letter-spacing:.6px}.flow-quote{font-size:18px}.flow-top .progress-steps{max-width:250px}.flow-content .purpose-buttons{grid-template-columns:1fr}.flow-content .purpose-choice{min-height:80px}.flow-content .purpose-copy small{margin-top:4px}.editor-layout{grid-template-columns:minmax(0,1fr) 210px;gap:25px}}
@media(max-width:720px){
 .flow-shell{padding-bottom:45px}.flow-top{gap:12px;flex-wrap:wrap;margin-bottom:15px;padding:14px 0 12px}.flow-top .progress-steps{font-size:9px;max-width:none}.flow-meter{width:100%;flex-basis:100%}
 .flow-grid{display:flex;flex-direction:column;gap:24px;align-items:stretch}.flow-aside{width:100%;display:none}.flow-content .form-title{font-size:30px;line-height:1.6;margin-bottom:12px}.flow-content>.eyebrow{font-size:9px;margin-bottom:14px}.flow-content .form-intro{font-size:12px;margin-bottom:24px}
 .flow-content .field{margin:16px 0}.flow-content textarea,.flow-content .input,.custom-preference textarea{font-size:16px}.flow-content .purpose-buttons{grid-template-columns:1fr}.flow-content .purpose-choice{padding:18px;min-height:88px}
 .music-choices{gap:10px}.music-choice{padding:17px 13px;min-height:94px}.music-choice .choice-name{font-size:14px}.music-choice small{font-size:10px}.mood-choices .music-choice{min-height:62px;padding:14px 12px}.mood-choices .choice-name{font-size:13px}.vocal-choices .music-choice{min-height:74px}
 .flow-content .form-actions{flex-direction:row;flex-wrap:nowrap;justify-content:space-between}.flow-content .form-actions .primary{width:auto;min-width:145px;font-size:13px;padding:14px 20px}.flow-content .form-actions .secondary{width:auto;min-width:0;font-size:12px}
 .workspace-shell{padding-top:25px}.workspace-shell .form-title{font-size:29px}.workspace-shell .summary-grid{grid-template-columns:1fr 1fr;gap:15px}.editor-layout{display:block}.editor-aside{display:none}.workspace-shell .lyrics-area{font-size:16px;padding:18px}.workspace-shell .input{font-size:16px}.workspace-shell .notice{font-size:11px}.workspace-shell .form-actions{gap:10px}.workspace-shell .form-actions .primary{font-size:12px}
 .preview-layout{grid-template-columns:1fr;gap:25px;margin:25px 0}.preview-layout .preview-art{max-width:420px}.preview-layout .audio-row{flex-direction:row;align-items:center}.preview-layout .audio-row strong{font-size:21px}.workspace-shell .audio-card{padding:21px}.draft-record{gap:18px}.draft-record img{width:85px}.workspace-shell .draft-card{padding:22px}
}
@media(max-width:350px){.flow-content .form-title{font-size:27px}.music-choice .choice-name{font-size:13px}.music-choice small{font-size:9px}.flow-content .form-actions .primary{min-width:120px;padding:14px 15px}.flow-top .progress-steps{font-size:8px}.flow-content .purpose-copy strong{font-size:15px}.workspace-shell .progress-steps{gap:12px;font-size:9px}.preview-layout .audio-row{flex-direction:column;align-items:start}}
@media(prefers-reduced-motion:reduce){.music-choice{transition:none}}

.personal-record .album:after{background:linear-gradient(180deg,transparent 20%,#201e1c44 48%,#201e1ccc 100%)}
.personal-record .album-copy{inset:auto 22px 24px;text-shadow:0 2px 14px #0005}
.personal-record .preview-album-brand{position:absolute;z-index:2;top:17px;left:20px;color:#fffaf2;font-size:7px;font-weight:600;letter-spacing:1.2px;text-shadow:0 2px 8px #0008}
.personal-record .preview-album-signature{position:absolute;z-index:2;right:20px;bottom:18px;max-width:80%;color:#fffaf2;font-size:10px;text-align:right;overflow-wrap:anywhere;text-shadow:0 2px 8px #0008}
.personal-record .album:has(.preview-album-signature:not([hidden])) .album-copy{bottom:42px}
.personal-record .album-copy em{font:400 clamp(19px,2.2vw,29px)/1.55 var(--serif);letter-spacing:-.8px;margin:10px 0 14px;overflow-wrap:anywhere;white-space:pre-wrap}
.personal-record .album-copy small{display:block;line-height:1.8;font-size:8px;letter-spacing:1.3px}
.personal-record .album-copy small:first-child{letter-spacing:.4px;font-size:10px}
.personal-record .disc-label{padding:10px;text-align:center;gap:5px;letter-spacing:.4px;overflow:hidden;font-size:6px}
.personal-record #record-title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font:400 8px/1.5 var(--serif);overflow-wrap:anywhere}
.record-caption{display:flex;justify-content:space-between;gap:20px;font-size:8px;line-height:1.8;color:var(--muted);letter-spacing:1px;padding:22px 0 0}
.record-caption span{min-width:0;overflow-wrap:anywhere}.record-caption span:last-child{text-align:right;letter-spacing:0}
#preview-title,#song-title{overflow-wrap:anywhere}
@media(max-width:720px){.personal-record .album-copy{inset:auto 16px 18px}.personal-record .album-copy em{font-size:22px}.personal-record .album-copy small{font-size:7px}.personal-record .album-copy small:first-child{font-size:9px}}
@media(max-width:350px){.personal-record .album-copy em{font-size:19px;margin:6px 0 9px}.personal-record .album-copy{inset:auto 13px 15px}.personal-record .album-copy small{font-size:6px;letter-spacing:.8px}}
.personal-record .album-copy em{word-break:keep-all}.long-record-title .album-copy em{font-size:17px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}.preview-layout .audio-row>div{min-width:0;max-width:100%}
/* Purpose entry: prioritize the choices over decorative imagery. */
body[data-question=purpose] .flow-aside{display:none}
body[data-question=purpose] .flow-grid{display:block;max-width:900px;margin:0 auto}
body[data-question=purpose] .flow-top{margin-bottom:12px}
body[data-question=purpose] .flow-content>.eyebrow{margin-bottom:10px}
body[data-question=purpose] .form-title{margin-bottom:8px}
body[data-question=purpose] .form-intro{font-size:15px;color:#514e47;margin-bottom:20px}
body[data-question=purpose] .purpose-buttons{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
body[data-question=purpose] .purpose-choice{background:#fffdf9;border:1.5px solid #a9a295;border-radius:12px;min-height:116px;padding:22px 18px;box-shadow:0 3px 10px #24232008;transform:none}
body[data-question=purpose] .purpose-copy strong{font-size:18px;font-weight:600;color:#262a27;line-height:1.5}
body[data-question=purpose] .purpose-copy small{font-size:13px;color:#59594f;margin-top:8px;line-height:1.6}
body[data-question=purpose] .purpose-arrow{border-radius:50%;background:#e8eee8;color:#304b40;min-width:28px;height:28px;display:grid;place-items:center;font-size:18px}
body[data-question=purpose] .purpose-choice:hover,body[data-question=purpose] .purpose-choice:focus-visible{background:#edf3ed;border-color:#496252;box-shadow:0 4px 14px #304b4015}
@media(max-width:720px){body[data-question=purpose] .purpose-buttons{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}body[data-question=purpose] .purpose-choice{padding:16px 12px;min-height:116px;position:relative;align-items:flex-start}body[data-question=purpose] .purpose-arrow{display:none}body[data-question=purpose] .purpose-copy strong{font-size:16px}body[data-question=purpose] .purpose-copy small{font-size:12px}body[data-question=purpose] .form-intro{font-size:14px}body[data-question=purpose] .form-title{font-size:28px}body[data-question=purpose] .flow-content>.eyebrow{display:none}}
.story-organizing{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:24px;background:#f4f0e9;color:#26231f;text-align:center;font:400 clamp(28px,5vw,48px)/1.5 var(--serif)}

/* Keep the dedication clearly separate from the album title. */
.personal-record .album-copy small:first-child{margin-bottom:24px}
@media(max-width:720px){.personal-record .album-copy small:first-child{margin-bottom:20px}}
