/* Spotify form in the Chicago landing page. */
:root { --spotify: #1ed760; --text: #012169; --border: #dce1eb; }
html { scroll-behavior: smooth; }
.playlist-section { padding-block: 36px 42px; border-top: 1px solid var(--line); scroll-margin-top: 24px; }
.playlist-heading { max-width: 650px; margin-bottom: 24px; }
h2 { margin: 15px 0 12px; font-size: clamp(28px, 5vw, 38px); line-height: 1.15; letter-spacing: -1.2px; }
.playlist-heading > p:last-child { color: var(--muted); font-size: 15px; line-height: 1.7; }
.card { background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 22px; min-width: 0; }
.label { font-size: 10px; letter-spacing: 1.2px; font-weight: 800; color: var(--navy); }
.playlist-layout { display: grid; gap: 16px; }
.playlist-privacy { margin-top: 16px; font-size: 11px; color: var(--muted); }
button, input, textarea { font-family: inherit; }
button { cursor: pointer; }
button:disabled { cursor: default; }
button:focus-visible, input:focus-visible, textarea:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; }
.spotifyPlaylist{display:flex;align-items:center;gap:15px;border-color:rgba(30,215,96,.32);color:var(--text);text-decoration:none;background:linear-gradient(135deg,rgba(30,215,96,.14),rgba(255,255,255,.055))}.spotifyPlaylist img{width:72px;height:72px;object-fit:contain;border-radius:8px}.spotifyPlaylist>div{display:grid;gap:5px;min-width:0}.spotifyPlaylist strong{overflow:hidden;text-overflow:ellipsis;font-size:20px;white-space:nowrap}.spotifyPlaylist small{color:#94eaae}.spotifySearchCard,.spotifySelectionCard,.spotifySubmitCard{position:relative}.spotifyStep{display:inline-grid;place-items:center;width:28px;height:28px;margin-right:8px;border-radius:50%;background:var(--spotify);color:#041007;font-size:13px;font-weight:950;vertical-align:middle}.spotifySearchCard>div:first-of-type{display:inline-block;vertical-align:top}.spotifySearchCard>div:first-of-type p{margin:7px 0 0;color:var(--muted);font-size:12px}.spotifySearchForm{display:grid;grid-template-columns:1fr 1fr;gap:8px 10px;margin-top:20px}.spotifySearchForm label,.spotifySubmitCard label:not(.spotifyConsent){color:var(--muted);font-size:9px;font-weight:850;letter-spacing:1.1px}.spotifySearchForm label:nth-of-type(2){grid-column:2}.spotifySearchForm input:nth-of-type(1){grid-column:1}.spotifySearchForm input:nth-of-type(2){grid-column:2}.spotifySearchForm input,.spotifySubmitCard input[type=text],.spotifySubmitCard textarea{width:100%;border:1px solid var(--border);border-radius:12px;background:#090d0a;color:var(--text);font:650 15px inherit;outline:none}.spotifySearchForm input{padding:13px}.spotifySubmitCard input[type=text],.spotifySubmitCard textarea{margin:7px 0 16px;padding:14px}.spotifySubmitCard textarea{resize:vertical;line-height:1.45}.spotifySearchForm input:focus,.spotifySubmitCard input:focus,.spotifySubmitCard textarea:focus{border-color:var(--spotify);box-shadow:0 0 0 3px rgba(30,215,96,.12)}.spotifySearchForm button,.spotifySubmitCard>form>button{grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:8px;min-height:50px;border:0;border-radius:25px;background:var(--spotify);color:#041007;font:900 11px inherit;letter-spacing:.8px}.spotifySearchForm button{margin-top:5px}.spotifySearchForm button:disabled,.spotifySubmitCard>form>button:disabled{opacity:.38}.spotifySearchForm button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2}.spotifyStatus{min-height:18px;margin-top:12px;color:#9eaaa1;font-size:10px;font-weight:800;letter-spacing:.7px;line-height:1.4}.spotifyResults{display:grid;gap:8px;margin-top:10px}.spotifyTrack{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;padding:11px;border:1px solid var(--border);border-radius:15px;background:rgba(0,0,0,.19)}.spotifyTrack.inPlaylist{border-color:rgba(30,215,96,.55);background:rgba(30,215,96,.09)}.spotifyTrackInfo{display:flex;align-items:center;gap:11px;min-width:0}.spotifyTrackInfo>a{flex:none}.spotifyTrackInfo img{display:block;width:58px;height:58px;border-radius:6px;object-fit:contain;background:#111}.spotifyTrackInfo>div{display:grid;gap:3px;min-width:0}.spotifyTrackInfo strong,.spotifyTrackInfo span,.spotifyTrackInfo small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.spotifyTrackInfo strong{font-size:14px}.spotifyTrackInfo span{color:#bac2bc;font-size:12px}.spotifyTrackInfo small{color:#747e77;font-size:9px}.spotifyTrack>button{display:flex;align-items:center;justify-content:center;gap:5px;min-height:36px;border:0;border-radius:18px;padding:8px 11px;background:#fff;color:#080a08;font:900 8px inherit;letter-spacing:.5px}.spotifyTrack>button svg{width:16px;height:16px;fill:#050505}.spotifyTrack>button svg path{fill:none;stroke:#1ed760;stroke-width:1.5;stroke-linecap:round}.spotifyTrack>button.alreadyThere{max-width:108px;background:rgba(30,215,96,.16);color:#65e792;line-height:1.25}.spotifySectionHeader{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.spotifySectionHeader>div{display:flex;align-items:center}.spotifySectionHeader>strong{color:var(--spotify);font-size:16px}.spotifyEmpty{margin:0;color:var(--muted);font-size:13px}.spotifySelection{display:grid;gap:7px}.spotifySelectedTrack{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px;border-radius:13px;background:rgba(30,215,96,.075)}.spotifySelectedTrack .spotifyTrackInfo{flex:1}.spotifySelectedTrack .spotifyTrackInfo img{width:44px;height:44px}.spotifySelectedTrack>button{flex:none;width:34px;height:34px;border:0;border-radius:50%;background:#282d29;color:#fff;font-size:22px;line-height:1}.spotifyCharacterCount{margin-top:-12px;margin-bottom:14px;color:#727c75;text-align:right;font-size:9px}.spotifyConsent{display:flex;align-items:flex-start;gap:10px;margin:13px 0 18px;color:#aab2ac;font-size:11px;line-height:1.45}.spotifyConsent input{flex:none;width:20px;height:20px;margin:0;accent-color:var(--spotify)}.spotifySubmitCard>form>button svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}.spotifySuccess{display:flex;gap:14px;border-color:rgba(30,215,96,.55);background:linear-gradient(135deg,rgba(30,215,96,.22),rgba(255,255,255,.05))}.spotifySuccessIcon{display:grid;place-items:center;flex:none;width:42px;height:42px;border-radius:50%;background:var(--spotify);color:#041007;font-size:22px;font-weight:950}.spotifySuccess>div:last-child{display:grid;gap:6px}.spotifySuccess strong{font-size:18px}.spotifySuccess p{margin:0;color:#aeb8b0;font-size:13px}.spotifyFooter a{color:#6f7b72;text-decoration:none}@media(max-width:520px){.spotifyHero h1{font-size:44px}.spotifySearchForm{grid-template-columns:1fr}.spotifySearchForm label:nth-of-type(2),.spotifySearchForm input:nth-of-type(1),.spotifySearchForm input:nth-of-type(2){grid-column:1}.spotifySearchForm label:nth-of-type(2){margin-top:4px}.spotifyTrack{grid-template-columns:1fr}.spotifyTrack>button{width:100%}.spotifyTrack>button.alreadyThere{max-width:none}.spotifyTrackInfo img{width:54px;height:54px}}@media(max-width:370px){.viewTabs{grid-template-columns:1fr 1fr}.viewTabs .spotifyTab{grid-column:1/-1}.spotifyHero h1{font-size:39px}}
.spotifySearchForm{grid-template-columns:1fr}.spotifySearchForm label,.spotifySearchForm input{grid-column:1}
.spotifyPlaylist { background: #edf8f0; border-color: #b4dcc2; }
.spotifyPlaylist small { color: #236442; line-height: 1.6; }
.spotifySearchCard > div:first-of-type { display: block; margin-top: 12px; }
.spotifySearchForm input, .spotifySubmitCard input[type=text], .spotifySubmitCard textarea { background: #f6f7f9; font: 500 15px "Avenir Next", Avenir, "Segoe UI", sans-serif; }
.spotifySearchForm button, .spotifySubmitCard > form > button { font-family: inherit; border-radius: 5px; }
.spotifySearchForm button:disabled, .spotifySubmitCard > form > button:disabled { opacity: .55; }
.spotifyStatus, .spotifyConsent, .spotifyTrackInfo span, .spotifyTrackInfo small, .spotifyCharacterCount, .spotifySuccess p { color: var(--muted); }
.spotifyTrack { background: #f6f7f9; }
.spotifyTrack > button { background: var(--navy); color: white; font-family: inherit; }
.spotifyTrack > button.alreadyThere { background: #e1f3e7; color: #236442; }
.spotifyTrackInfo strong, .spotifyTrackInfo span, .spotifyTrackInfo small { white-space: normal; overflow-wrap: anywhere; }
.spotifySectionHeader > strong { color: #236442; }
.spotifySuccess { background: #edf8f0; }
.spotifySubmitCard > form { margin-top: 18px; }
.spotifySelectedTrack > button { background: #e5e9f0; color: var(--navy); }
@media (min-width: 900px) {
  .playlist-layout { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); align-items: start; }
  .spotifyPlaylist { grid-column: 1 / -1; }
  .spotifySearchCard { grid-column: 1; grid-row: 2 / 4; }
  .spotifySelectionCard { grid-column: 2; grid-row: 2; }
  .spotifySubmitCard { grid-column: 2; grid-row: 3; }
  .spotifySuccess { grid-column: 1 / -1; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }