.listening-home{display:grid;grid-template-columns:minmax(0,1fr);gap:28px;min-width:0}.listening-shelf{min-width:0;max-width:100%}.listening-shelf .section-title{margin:0 0 14px}.listening-shelf h2{font-size:1.2rem}.listening-rail{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:20px 16px;align-items:start;min-width:0}.listening-tile{min-width:0;display:grid;align-content:start;gap:4px}.listening-art{display:block;width:100%;aspect-ratio:1;border-radius:16px;overflow:hidden;position:relative;background:var(--surface)}.listening-art img{width:100%;height:100%;object-fit:cover}.listening-art>.icon{position:absolute;bottom:10px;inset-inline-end:10px;padding:10px;width:42px;height:42px;border-radius:50%;background:var(--lime,#ceff79);color:var(--on-lime,#1b122a);box-sizing:border-box}.listening-title{display:grid;text-align:start;gap:4px;width:100%;padding:10px 0 2px}.listening-title bdi{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;overflow-wrap:anywhere;line-height:1.6;min-height:0;font-weight:650;font-size:.95rem}.listening-title small{font-size:.8rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.listening-tile .text-btn{font-size:.78rem;padding:6px 0;justify-content:flex-start;text-align:start;white-space:normal}.mood-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.mood-card{padding:20px 14px;background:var(--surface);border:1px solid var(--line);border-radius:16px;justify-content:flex-start;text-align:start;color:var(--ink);min-height:68px}.artist-rail{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:20px 16px;align-items:start;min-width:0}.artist-rail button{min-width:0;display:grid;justify-items:center;align-content:start;gap:10px;font-size:.85rem;text-align:center}.artist-rail button>bdi{max-width:100%;overflow-wrap:anywhere}.artist-rail .avatar{width:72px;height:72px;aspect-ratio:1;flex:none}.creative-door{display:flex;align-items:center;gap:16px;padding:20px;border:1px solid var(--line);border-radius:20px;background:var(--surface)}.creative-door>div{flex:1;min-width:0}.creative-door p{color:var(--muted);font-size:.9rem;margin:6px 0 0}.story-credits{display:grid;gap:12px;margin:14px 0 22px}.story-credits button{display:flex;align-items:center;gap:12px;text-align:start}.story-credits span{display:grid;gap:4px}.story-credits small{color:var(--muted)}.journey-story>.inline-actions{margin-top:20px;flex-wrap:wrap}
.match-space{display:grid;gap:18px}.match-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.match-card{border:1px solid var(--line);border-radius:18px;padding:16px;display:grid;gap:12px}.match-person{display:flex;gap:12px;align-items:center}.match-person>div{flex:1;min-width:0}.match-person small{display:block;color:var(--muted);font-size:.8rem;line-height:1.5}.match-person .avatar{width:44px;height:44px;flex:none}.match-reason{font-size:.88rem;color:var(--ink);margin:0}.match-card .library-track{padding:8px 0}.match-card .library-track .track-art{width:42px;height:42px}.match-card .track-duration{font-size:.75rem}.journey-empty{padding:20px;border:1px dashed var(--line);border-radius:14px}.contribution-workspace{padding:18px;border:1px solid var(--line);border-radius:18px;margin:16px 0;background:var(--surface)}.contribution-workspace h2{font-size:1.05rem}.contribution-workspace summary{cursor:pointer;margin-bottom:12px;font-size:.9rem}.contribution-workspace>.inline-actions{margin:14px 0}.reference-lyrics{white-space:pre-wrap;max-height:180px;overflow:auto;padding:16px;background:var(--bg);border-radius:12px;line-height:1.8;font-size:.95rem;margin:12px 0}.review-reply{border-inline-start:3px solid var(--violet);padding:12px;margin:14px 0}.review-reply p{white-space:pre-wrap}#journey-review-audio{width:100%;margin:12px 0}.settings-row select{max-width:220px}.journey-story .inline-actions{gap:10px}.contribution-workspace .field{margin-top:14px}
@media(max-width:600px){.listening-home{gap:24px}.listening-rail{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 12px}.listening-shelf h2{font-size:1.05rem}.listening-shelf .section-title{flex-wrap:wrap;gap:6px}.mood-grid{grid-template-columns:1fr}.mood-card{min-height:50px;padding:12px 14px}.creative-door{flex-wrap:wrap;padding:16px}.creative-door>div{flex-basis:calc(100% - 40px)}.creative-door>.btn{width:100%;white-space:normal}.match-fields{grid-template-columns:1fr}.match-card{padding:14px}.contribution-workspace{padding:14px}.settings-row:has(#journey-availability){flex-wrap:wrap}.settings-row select{max-width:100%}}

.listening-title,.artist-rail button,.story-credits button{background:transparent;border:0;color:var(--ink);font:inherit;cursor:pointer}.listening-title{min-width:0}.match-card .library-track{min-width:0}.native-listening-notes blockquote{border-inline-start:2px solid var(--violet);padding-inline-start:12px;margin:12px 0;color:var(--muted)}

.match-query>summary{cursor:pointer;font-size:.9rem;color:var(--muted);padding:6px 0 14px}.match-query>form{display:grid;gap:10px}.match-space .field{margin:0}.listening-art:focus-visible,.listening-title:focus-visible,.artist-rail button:focus-visible{outline:2px solid var(--violet);outline-offset:3px}

/* Contain intrinsic widths and keep related controls on a shared baseline. */
.phone-screen.signed-in{grid-template-columns:minmax(0,1fr)}
.signed-in>.native-main{min-width:0}
.listening-shelf .section-title,.contribution-workspace .section-title{display:flex;align-items:center;flex-wrap:wrap;gap:8px 16px;text-align:start}
.listening-shelf .section-title>*{min-width:0;max-width:100%;overflow-wrap:anywhere}
.listening-shelf .section-title>span{font-size:12px}
.match-space,.match-fields,.match-query,.journey-story,.contribution-workspace{min-width:0;max-width:100%}
.match-fields{grid-template-columns:repeat(2,minmax(0,1fr))}
.match-space .field,.contribution-workspace .field{min-width:0}
.match-space .field :is(input,select),.contribution-workspace select{min-width:0;max-width:100%;width:100%}
.library-tracks .section-title{flex-wrap:wrap;gap:8px 16px}
.library-track .track-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.track-duration{flex-shrink:0;direction:ltr}
.playlist-entry{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;margin-bottom:10px}
.playlist-entry .icon-btn{width:44px;height:44px;flex:none}
@media(max-width:600px){.match-fields{grid-template-columns:minmax(0,1fr)}.match-card .library-track{gap:8px}.match-card .track-duration{display:none}.playlist-entry{gap:4px}.playlist-entry .library-track{gap:8px;padding:8px}.playlist-entry .track-art{width:40px;height:40px;flex-basis:40px}}
@media(max-width:350px){.artist-rail{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 8px}.artist-rail .avatar{width:64px;height:64px}}

.native-follow-row{flex-wrap:wrap}.native-follow-row>bdi{flex:1;min-width:0;overflow-wrap:anywhere}.native-follow-row>.btn{flex-shrink:0}
.playlist-entry>.library-track{margin:0}.playlist-entry>.icon-btn{background:transparent;color:var(--muted);padding:10px;min-width:44px}

.tabs.library-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;overflow:visible;min-width:0}.tabs.library-tabs .tab{min-width:0;white-space:normal;min-height:44px;padding:8px;line-height:1.5;text-align:center}
@media(max-width:600px){.tabs.library-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}}


/* Keep form labels, controls and paired actions aligned without stretching checkboxes. */
.match-space .field,.match-fields .field{display:grid;gap:6px;align-content:start;font-size:14px;line-height:1.6;text-align:start}
.match-space .field :is(input,select),.match-fields .field :is(input,select){box-sizing:border-box;width:100%;min-width:0;min-height:48px;height:48px;margin:0;padding:10px 12px;font-size:14px;line-height:1.5;border-radius:12px}
.match-fields{align-items:start}
.match-space .check-label{display:flex;align-items:flex-start;gap:10px;width:100%;min-width:0;min-height:44px;padding:10px 0;font-size:14px;line-height:1.6;text-align:start}
.match-space .check-label input[type=checkbox]{flex:0 0 18px;width:18px;min-width:18px;max-width:18px;height:18px;min-height:18px;margin:2px 0 0;padding:0}
.match-space .check-label span{min-width:0;overflow-wrap:anywhere}
.match-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;align-items:stretch}
.match-actions .btn,.match-card>.btn{min-width:0;min-height:44px;margin:0;padding:10px 14px;font-size:14px;line-height:1.5;white-space:normal;overflow-wrap:anywhere}
.match-person .btn.icon-btn{flex:0 0 44px;width:44px;height:44px;min-height:44px;min-width:44px;padding:10px;border-radius:12px}
.match-person .text-btn{justify-content:flex-start;text-align:start;white-space:normal;overflow-wrap:anywhere;font-size:14px;line-height:1.6}
.match-person small{overflow-wrap:anywhere}
.match-space>p.meta{margin:0;font-size:13px;line-height:1.8;overflow-wrap:anywhere}
@media(max-width:600px){.match-query>form{gap:12px}.match-actions{gap:8px}.match-actions .btn{padding:10px 8px}.match-space .field :is(input,select),.match-fields .field :is(input,select){font-size:16px}}
