/* Hallmark · v2.0.0 · theme: existing MMAI green · shape: listening desk · job: listen · hero: split · imagery: own generated record sleeve */
/* Critique: keep the songs selectable, the player large and the page distinct from an article template. */
/* Waive: retain existing project chrome and typography; dense sixteen-song list serves the listening task. */
:root { --j-ink: #13251f; --j-green: #11664f; --j-deep: #092f25; --j-light: #f1f5f5; --j-white: #fff; --j-muted: #4e625b; --j-line: #d6e1dd; --j-accent: #d9f479; --j-font: 'Bricolage Grotesque', sans-serif; --j-body: Inter, sans-serif; --j-gap: clamp(24px,4vw,64px); --j-space: clamp(48px,6vw,88px); --j-radius: 8px; }
html, body { overflow-x: clip; }
.junior-page { background: var(--j-white); color: var(--j-ink); }
.j-wrap { width: min(1240px,calc(100% - 48px)); margin-inline:auto; }
.junior-page main h1,.junior-page main h2,.junior-page main h3 { font-family:var(--j-font); color:inherit; overflow-wrap:break-word; min-width:0; letter-spacing:-.025em; text-wrap:balance; }
.junior-page main h2 { font-size:clamp(29px,3.1vw,44px); line-height:1.1; margin:0 0 20px; }
.junior-page main p { font-size:16px; line-height:1.65; margin:0 0 16px; max-width:68ch; }
.j-hero { display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:var(--j-gap); align-items:center; padding-block:var(--j-space); }
.j-hero h1 { font-size:clamp(40px,4.8vw,66px); line-height:1.02; margin:0 0 24px; }
.j-hero h1 { color:var(--j-green); }
.j-hero .j-lead { font-size:20px;line-height:1.5; }
.j-actions { display:flex;flex-wrap:wrap;gap:12px;margin:24px 0; }
.j-hero .j-date { font-size:13px;color:var(--j-muted);margin:0; }
.j-cover { margin:0; }
.j-cover img { display:block; width:100%;border-radius:var(--j-radius); }
.j-cover figcaption { font-size:13px;color:var(--j-muted);margin-top:12px; }
.j-result { background:var(--j-light); }
.j-result-inner { display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:var(--j-gap);align-items:center;padding-block:36px; }
.j-result h2 {font-size:30px;margin-bottom:12px;}
.j-result p {margin:0;}
.j-result .j-result-note {justify-self:end;font-size:14px;color:var(--j-muted);}
.j-listening {padding-block:var(--j-space);scroll-margin-top:100px;}
.j-section-head {display:flex;align-items:end;justify-content:space-between;gap:32px;margin-bottom:32px;}
.j-section-head h2 {max-width:650px;margin:0;}
.j-section-head p {max-width:250px;margin:0;color:var(--j-muted);font-size:14px;}
.j-desk {display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--j-gap);align-items:start;}
.j-search label,.j-prompt label {display:block;font-weight:700;font-size:15px;margin-bottom:12px;}
.j-search>div {display:flex;gap:8px;}
.j-search input {width:100%;min-width:0;border:1px solid var(--j-line);border-radius:var(--j-radius);padding:12px;font:inherit;background:var(--j-white);color:var(--j-ink);}
.j-search button,#j-reset {border:0;border-radius:var(--j-radius);background:var(--j-green);color:var(--j-white);font:inherit;padding:12px 16px;cursor:pointer;}
.junior-page .j-small {font-size:13px;color:var(--j-muted);margin-block:16px;}
.j-tracklist {padding:0;margin:0;list-style:none;max-height:650px;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;}
.j-tracklist a {display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:16px;align-items:center;padding:16px 12px;border-bottom:1px solid var(--j-line);color:var(--j-ink);text-decoration:none;}
.j-tracklist a:hover {background:var(--j-light);text-decoration:none;}
.j-tracklist a[aria-current='true'] {background:var(--primary-light);}
.j-rank {font-size:15px;color:var(--j-muted);}
.j-tracklist strong {font-size:16px;display:block;}
.j-track-meta {font-size:13px;color:var(--j-muted);line-height:1.5;display:block;margin-top:4px;}
.j-listen-word {font-size:12px;font-weight:700;color:var(--j-green);}
.j-player-column {position:sticky;top:100px;min-width:0;}
.j-now h3 {font-size:clamp(26px,3vw,42px);line-height:1.15;margin:12px 0;}
.j-now p {font-size:14px;color:var(--j-muted);margin:0;}
.j-video {aspect-ratio:16/9;background:var(--j-deep);margin-top:20px;border-radius:var(--j-radius);overflow:clip;}
.j-video-start {position:relative;padding:0;border:0;display:block;width:100%;height:100%;background:var(--j-deep);color:var(--j-white);cursor:pointer;font:inherit;}
.j-video-start img {width:100%;height:100%;object-fit:cover;display:block;opacity:.65;}
.j-video-start span {position:absolute;inset:auto 16px 18px;background:var(--j-white);color:var(--j-deep);padding:16px;border-radius:var(--j-radius);font-weight:700;}
.j-video iframe,.j-noscript-video {width:100%;height:100%;border:0;display:block;}
.j-noscript-video {aspect-ratio:16/9;}
.j-original {background:var(--j-deep);color:var(--j-white);padding-block:var(--j-space);scroll-margin-top:90px;}
.j-original-inner {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--j-gap);align-items:center;}
.j-original h2 {font-size:clamp(36px,4.6vw,60px);}
.j-original p {color:var(--j-white);opacity:.9;}
.j-original a,.j-original button {color:var(--j-accent);}
.j-light-link {font-weight:700;}
.j-audio-desk {border-block:1px solid var(--j-muted);padding-block:28px;}
.j-audio-desk h3 {font-size:28px;margin:0 0 12px;}
.j-audio-desk label {display:block;font-size:14px;margin:24px 0 12px;}
.j-audio-desk audio {width:100%;display:block;}
.j-audio-links {display:flex;flex-wrap:wrap;gap:24px;align-items:center;margin-top:24px!important;}
.j-audio-links button {border:0;background:transparent;padding:0;font:inherit;text-decoration:underline;cursor:pointer;}
.j-make {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--j-gap);padding-block:var(--j-space);align-items:center;}
.j-prompt {background:var(--j-light);padding:28px;border-radius:var(--j-radius);}
.j-prompt textarea {width:100%;border:1px solid var(--j-line);border-radius:var(--j-radius);resize:vertical;padding:16px;font:inherit;line-height:1.6;background:var(--j-white);color:var(--j-ink);}
.j-prompt .j-actions {margin-bottom:0;}
.j-sources {border-top:1px solid var(--j-line);padding-block:36px 56px;}
.j-sources h2 {font-size:25px;}
.j-sources p {max-width:68ch;}
.j-sources summary {cursor:pointer;font-weight:700;margin:24px 0 12px;}
.junior-page :is(a,button,input,textarea,summary):focus-visible {outline:3px solid var(--j-green);outline-offset:4px;}
.j-original :is(a,button,audio):focus-visible {outline-color:var(--j-accent);}
.junior-page [hidden] {display:none!important;}
@media(max-width:800px) {
 .j-wrap {width:calc(100% - 40px);}
 .j-hero,.j-desk,.j-original-inner,.j-make,.j-result-inner {grid-template-columns:minmax(0,1fr);}
 .j-hero {gap:28px;padding-block:40px;}
 .j-hero h1 {font-size:40px;}
 .j-hero .j-lead {font-size:18px;}
 .j-result-inner {gap:16px;padding-block:28px;}
 .j-result .j-result-note {justify-self:start;}
 .j-section-head {display:block;}
 .j-section-head p {max-width:none;margin-top:16px;}
 .j-desk {display:flex;flex-direction:column;gap:28px;}
 .j-player-column {position:static;order:-1;width:100%;scroll-margin-top:90px;}
 .j-selector {width:100%;}
 .j-tracklist {max-height:470px;}
 .j-tracklist a {padding-inline:8px;}
 .j-original-inner {gap:32px;}
 .j-prompt {padding:20px;}
 .j-actions .button {padding-inline:16px;}
}
@media(prefers-reduced-motion:reduce) {html {scroll-behavior:auto!important;} .junior-page *, .junior-page *::before, .junior-page *::after {scroll-behavior:auto!important;animation:none!important;transition:none!important;}}

.junior-page button:active { transform:translateY(1px); }
.junior-page button:disabled {opacity:.5;cursor:not-allowed;}