:root{--paper:#f6f2e9;--ink:#173934;--muted:#52625b;--line:#d5d8c9;--orange:#a94f29;--white:#fffdf7;color-scheme:light}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.65 system-ui,-apple-system,BlinkMacSystemFont,"Noto Sans",sans-serif}a{color:inherit;text-underline-offset:4px}a:hover{color:var(--orange)}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--orange);outline-offset:5px}header{max-width:1240px;margin:auto;padding:28px 40px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{font-size:14px;font-weight:800;letter-spacing:.15em;line-height:1.5;text-decoration:none}.brand span{display:block;font-size:10px;letter-spacing:.29em;color:var(--orange)}nav{display:flex;gap:28px;font-size:14px}nav a{text-decoration:none}main{max-width:1240px;padding:0 40px;margin:auto}.preview{text-align:center;background:#e7d8bd;color:#513d28;font-size:12px;padding:7px 16px}.hero{display:grid;grid-template-columns:1.1fr 1fr;gap:60px;align-items:center;padding:64px 0 54px}.eyebrow{font-size:11px;font-weight:750;letter-spacing:.18em;color:var(--orange)}h1,h2{font-family:Georgia,"Times New Roman",serif;font-weight:400;line-height:1.1}h1{font-size:clamp(60px,6vw,88px);letter-spacing:-.055em;margin:22px 0}h1 em{color:var(--orange);font-weight:400}.original-title{font-size:22px}.intro{max-width:460px;color:var(--muted);font-size:18px}.button{display:inline-block;background:var(--ink);color:var(--white);padding:12px 22px;border-radius:3px;text-decoration:none;font-size:14px;font-weight:600;margin-top:12px}.button:hover{background:var(--orange);color:white}.byline{font-size:12px;color:var(--muted);margin-top:23px}figure{margin:0}figure img{display:block;width:100%;aspect-ratio:1;object-fit:cover;border-radius:110px 110px 3px 3px}figcaption{font-size:11px;color:var(--muted);margin-top:12px;letter-spacing:.02em}.stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:24px 0}.stats>div{display:flex;flex-direction:column;padding:0 20px;border-left:1px solid var(--line)}.stats>div:first-child{border:0;padding-left:0}.stats strong{font:42px/1.3 Georgia,serif}.stats span{font-size:12px;color:var(--muted)}#collection{padding:64px 0}.section-heading{max-width:640px}h2{font-size:42px;letter-spacing:-.025em;margin:15px 0}.section-heading>p{color:var(--muted)}.filters{display:grid;grid-template-columns:1fr 240px;gap:20px;margin-top:32px}label{font-size:12px;font-weight:600}input,select{display:block;width:100%;padding:14px 16px;border:1px solid #aeb8a5;border-radius:3px;background:var(--white);color:var(--ink);font:inherit;font-size:16px;margin-top:7px}#result-count{font-size:12px;color:var(--muted);margin:18px 0}.language-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.language-card{display:flex;flex-direction:column;min-height:228px;padding:22px;background:var(--white);border:1px solid var(--line);border-radius:4px;text-decoration:none;transition:border-color .15s,transform .15s}.language-card:hover{border-color:var(--orange);transform:translateY(-3px)}.card-top{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.08em;color:var(--muted)}.card-top span{color:var(--orange);font-size:9px}.language-card h3{font:25px/1.3 Georgia,serif;margin:21px 0 8px}.language-card p{font-size:14px;color:var(--muted);margin:0 0 20px;overflow-wrap:anywhere}.card-action{margin-top:auto;font-size:12px;font-weight:600;display:flex;justify-content:space-between}.invitation{padding:38px;margin:0 0 60px;background:#e8ecdf;border-radius:5px}.invitation p{max-width:650px;color:var(--muted)}footer{border-top:1px solid var(--line);padding:28px 24px;text-align:center;font-size:11px;color:var(--muted)}.back{display:inline-block;margin:28px 0;font-size:13px}.status{font-size:13px;color:var(--muted)}article{max-width:840px;margin:35px auto 65px;overflow-wrap:anywhere}article h1{font-size:42px;letter-spacing:-.02em;line-height:1.4}article h2{font-size:29px;margin-top:42px;line-height:1.35}article pre{white-space:pre-wrap;overflow-wrap:anywhere;background:#fffdf7;border:1px solid var(--line);padding:24px;border-radius:4px;line-height:1.9}article code{font-family:inherit;font-size:16px}article table{border-collapse:collapse;width:100%;font-size:14px}article td,article th{border:1px solid var(--line);padding:10px;text-align:start}article blockquote{border-left:3px solid var(--orange);padding-left:20px;color:var(--muted)}.empty{padding:20px;background:#e8ecdf;border-radius:4px}.listening{background:#e8ecdf;padding:28px;border-radius:6px;max-width:840px;margin:24px auto}.listening h2{font-size:32px;margin-top:0}.recording+ .recording{margin-top:30px;border-top:1px solid #bcc6b5;padding-top:20px}.recording h3{font-size:17px}.recording p,.recording a{font-size:13px;color:var(--muted)}audio,video{width:100%;display:block}video{max-height:540px;background:#112220}audio{height:48px}[hidden]{display:none!important}@media(max-width:760px){header{padding:20px}nav{gap:16px;font-size:12px}main{padding:0 20px}.hero{grid-template-columns:1fr;gap:25px;padding:36px 0}.hero h1{font-size:67px}.hero figure{max-width:460px;margin:auto}.stats{grid-template-columns:repeat(2,1fr);gap:20px}.stats>div:nth-child(3){border:0;padding-left:0}.language-grid{grid-template-columns:repeat(2,1fr)}.filters{grid-template-columns:1fr}.section-heading h2{font-size:36px}.invitation{padding:25px}.listening{padding:20px}article h1{font-size:32px}}@media(max-width:440px){.language-grid{grid-template-columns:1fr}nav{gap:12px}.brand{font-size:11px}.brand span{font-size:8px}article pre{padding:16px}.language-card{min-height:210px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.language-card{transition:none}.language-card:hover{transform:none}}

/* Community actions and version pages. */
button,.action{font:inherit;font-size:13px;line-height:1.45;padding:10px 15px;border:1px solid #9cae9c;border-radius:4px;background:var(--white);color:var(--ink);cursor:pointer;text-decoration:none;display:inline-block}
button:hover,.action:hover{border-color:var(--orange);color:var(--orange)}
button:disabled{cursor:not-allowed;opacity:.5}
button.button{font-size:14px;border-color:var(--ink)}
.button.secondary{background:transparent;color:var(--ink);border:1px solid var(--ink)}
.action-row,.page-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.page-actions{margin:20px 0 28px}.page-actions .button,.action-row .button{margin-top:0}.page-actions>a:last-child{font-size:13px}
.collaborate{padding:30px;margin:32px auto 60px;max-width:840px;background:#e8ecdf;border:1px solid var(--line);border-radius:6px}
.collaborate h2{font-size:32px}.collaborate>div>p{color:var(--muted);max-width:640px}
.small,.share-note,.share-result{font-size:12px;color:var(--muted)}
.sharing{max-width:840px;margin:28px auto}.share-result{overflow-wrap:anywhere}
.recording-detail{max-width:840px;margin:20px auto 45px}.recording-detail h1{font-size:44px;letter-spacing:-.03em;line-height:1.25}
.credits{display:grid;grid-template-columns:150px 1fr;gap:6px 20px;font-size:13px;padding:20px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.credits dt{font-weight:650}.credits dd{margin:0}
.contribution-intro{max-width:940px;margin:0 auto 30px}.contribution-intro h1{font-size:60px;letter-spacing:-.04em}.contribution-intro>p{max-width:620px;color:var(--muted)}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;padding:0;list-style:none;counter-reset:step;margin-top:40px}.steps li{counter-increment:step;border-top:1px solid var(--line);padding-top:15px}.steps li:before{content:'0' counter(step);display:block;color:var(--orange);font-size:12px;letter-spacing:.15em;margin-bottom:10px}.steps strong{font-size:15px;display:block}.steps span{display:block;font-size:13px;color:var(--muted);margin-top:5px}
.contribution-form,.setup-notice{max-width:940px;margin:25px auto 60px}.contribution-form{background:var(--white);border:1px solid var(--line);padding:30px;border-radius:6px}.contribution-form label{display:block;margin-bottom:20px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.contribution-form input,.contribution-form textarea,.contribution-form select{background:#fbfaf6}
textarea{display:block;width:100%;padding:13px 15px;border:1px solid #aeb8a5;border-radius:3px;resize:vertical;color:var(--ink);font:16px/1.65 system-ui,sans-serif;margin-top:7px}textarea:focus-visible{outline:3px solid var(--orange);outline-offset:3px}
.upload-explainer,.setup-notice{background:#eee6d3;border-radius:4px;padding:16px 20px;font-size:13px;color:#5c4b31}.setup-notice{margin-bottom:20px}
#proposal-preview{border-top:1px solid var(--line);padding-top:24px;margin-top:25px;scroll-margin-top:24px}#proposal-preview h2{font-size:30px}#proposal-preview>p{font-size:14px}#proposal-text{font-size:14px}#contribution-status{font-size:13px;color:var(--muted)}
@media(max-width:600px){.steps,.form-grid{grid-template-columns:1fr;gap:15px}.contribution-intro h1{font-size:46px}.contribution-form{padding:20px}.collaborate{padding:22px}.recording-detail h1{font-size:32px}.credits{grid-template-columns:1fr;gap:3px}.credits dd{margin-bottom:12px}.action-row,.page-actions{align-items:stretch}.action-row .button{white-space:normal}.page-actions>a:last-child{align-self:center}}

.current-lyric { min-height: 4em; padding: 1rem; border-left: 2px solid var(--gold, #a58550); white-space: pre-line; overflow-wrap: anywhere; font-size: 1.15rem; line-height: 1.8; }

.audio-cover { display: block; width: 160px; max-width: 100%; height: auto; margin: 0 0 1rem; border-radius: 8px; }

.media-group { margin-block: 2rem; }
.media-group h3 { font-size: 1.5rem; }
.media-group h4 { font-size: 1.2rem; margin: .6rem 0 1rem; }
.earlier-recordings { margin-block: 1.25rem; }
.earlier-recordings summary { cursor: pointer; padding: .8rem 0; font-weight: 600; }

/* A quiet reading edition, with original Odisha-inspired line ornaments. */
:root { --paper:#f8f3e8; --white:#fffdf7; --ink:#293c36; --orange:#98462f; --line:#d9cebb; --muted:#676c60; }
body { background-image: radial-gradient(#aa82500c .6px, transparent .6px); background-size:5px 5px; }
header { position:relative; border-bottom:0; padding-bottom:32px; }
header:after { content:""; position:absolute; bottom:0; left:40px; right:40px; height:9px; background:url('odia-border.svg') repeat-x center / 72px 9px; opacity:.65; }
.brand { position:relative; padding-left:49px; }
.brand img { position:absolute; left:0; top:1px; }
.hero figure { padding:12px; border:1px solid var(--line); background:var(--white); }
.hero figure img { border-radius:0; }
.language-page { max-width:1060px; margin:0 auto 64px; }
.language-page .language-heading { position:relative; padding:8px 140px 30px 0; border-bottom:1px solid var(--line); }
.language-heading:after { content:""; position:absolute; right:8px; top:12px; width:100px; height:100px; background:url('odia-lotus.svg') center/contain no-repeat; opacity:.65; }
.language-heading h1 { font:400 clamp(29px,3.1vw,43px)/1.55 Georgia,"Noto Sans",serif; letter-spacing:-.015em; margin:12px 0; overflow-wrap:anywhere; }
.poet-credit { color:var(--muted); font-size:13px; margin:0 0 18px; }
.poet-credit span { margin:0 8px; }
.reading-links { display:flex; flex-wrap:wrap; gap:12px 24px; font-size:13px; }
.page-share { margin-top:14px; font-size:13px; }
.page-share summary { cursor:pointer; width:fit-content; color:var(--orange); }
.page-share .sharing { margin:18px 0 0; }
.page-share .share-note { max-width:640px; }
.language-layout { display:grid; grid-template-columns:minmax(0,1fr) 330px; align-items:start; gap:64px; padding:32px 0; }
.language-sidebar { min-width:0; }
.language-art { margin-top:36px; padding-top:26px; border-top:1px solid var(--line); }
.art-companion-label { margin:0 0 16px; font-size:10px; text-transform:uppercase; letter-spacing:.16em; color:var(--orange); }
.language-art .art-wall { --frame-size:7px; --mat-size:12px; min-height:0; padding:0; background:transparent; box-shadow:none; }
.language-art .art-frame { width:100%; }
.language-art figcaption { margin:22px 0 14px; letter-spacing:0; }
.language-art h2 { font:400 27px/1.25 Georgia,serif; color:var(--ink); margin:0 0 10px; }
.language-art [data-art-caption] { font:italic 18px/1.55 Georgia,serif; color:var(--ink); margin:0 0 14px; }
.language-art .art-companion-credit { font-size:11px; color:var(--muted); }
@media(max-width:700px) { .language-art { max-width:360px; margin:32px auto 0; } }
article.poem-reading { margin:0; max-width:none; min-width:0; }
.poem-reading .reading-caption { font:600 11px/1.6 system-ui,sans-serif; text-transform:uppercase; letter-spacing:.16em; color:var(--orange); margin:0 0 20px; }
.poem-reading pre { border:0; background:transparent; padding:0; margin:0 0 26px; border-radius:0; line-height:2.05; }
.poem-reading pre code { font-family:Georgia,"Noto Sans",serif; font-size:19px; }
.poem-reading .poem-download { font-size:12px; color:var(--muted); }
.listening.compact-listening { width:100%; margin:0; padding:24px; background:#f0e9da; border:1px solid var(--line); border-radius:2px; }
.compact-listening h2 { font-size:27px; margin:8px 0 12px; }
.compact-listening .media-status { font-size:11px; color:var(--muted); margin:0; }
.compact-listening .media-group { margin:22px 0 0; }
.compact-listening .media-group h3 { font:600 11px/1.5 system-ui,sans-serif; text-transform:uppercase; letter-spacing:.12em; margin:0 0 8px; color:var(--orange); }
.compact-listening .recording h4 { font-size:14px; font-weight:500; margin:0 0 12px; }
.recording-links { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; margin:10px 0 0; }
.compact-listening .recording-links a { font-size:11px; }
.compact-listening video { max-height:220px; border-radius:2px; }
.compact-listening .recording + .recording { margin-top:20px; padding-top:18px; }
.compact-listening .more-recordings, .compact-listening .earlier-recordings { margin:12px 0 0; font-size:12px; }
.compact-listening summary { padding:7px 0; cursor:pointer; font-weight:500; }
.compact-listening details[open] summary { margin-bottom:12px; }
.compact-listening .media-empty { font-size:14px; color:var(--muted); }
.text-link { font-size:13px; }
.language-notes { border-top:1px solid var(--line); }
.language-notes > details { border-bottom:1px solid var(--line); padding:0 4px; }
.language-notes > details > summary { padding:19px 0; cursor:pointer; font-size:14px; }
.detail-body { max-width:800px; padding:0 0 26px; font-size:15px; overflow-wrap:anywhere; }
.detail-body h2 { font-size:25px; margin:28px 0 14px; }
.detail-body pre { white-space:pre-wrap; overflow-wrap:anywhere; padding:18px; background:var(--white); border:1px solid var(--line); }
.detail-body code { font:inherit; }
.detail-body .collaborate { padding:0; border:0; background:none; margin:0 0 24px; }
.detail-body .collaborate .eyebrow { display:none; }
.quiet-contribute { padding:25px 0 0; }
.quiet-contribute h2 { font-size:22px; margin:0 0 16px; }
summary:focus-visible { outline:3px solid var(--orange); outline-offset:4px; }
@media(max-width:900px) { .language-layout { gap:30px; grid-template-columns:minmax(0,1fr) 300px; } }
@media(max-width:700px) {
 header:after { left:20px; right:20px; }
 .language-heading:after { width:48px; height:48px; right:0; top:3px; }
 .language-page .language-heading { padding:0 0 24px; }
 .language-heading .eyebrow { padding-right:60px; }
 .language-heading h1 { font-size:29px; line-height:1.65; padding-right:0; margin-top:22px; }
 .language-layout { grid-template-columns:1fr; gap:32px; padding:28px 0; }
 .poem-reading pre code { font-size:18px; }
 .listening.compact-listening { max-width:100%; }
 .compact-listening video { max-height:300px; }
 .brand { padding-left:37px; }
 .brand img { width:28px; height:28px; }
}

.language-page[data-language="odia"] .poem-reading pre code { font-family:"Noto Sans Oriya",system-ui,sans-serif; font-size:22px; }
@media(max-width:700px) { .language-page[data-language="odia"] .poem-reading pre code { font-size:20px; } }
.language-heading:after { width:138px; height:108px; background-image:url('odia-manuscript.svg'); opacity:.85; }
@media(max-width:700px) { .language-heading:after { width:65px; height:48px; top:-3px; } .language-heading .eyebrow { padding-right:75px; } }
@media(max-width:440px) { header { flex-wrap:wrap; gap:14px; } header nav { flex:1 0 100%; justify-content:space-between; } }

/* Readable collection cards and one shared, user-started audio player. */
article.language-card { margin:0; max-width:none; min-width:0; min-height:320px; }
.language-card h3 a { text-decoration:none; }
.language-card .card-poem { margin-bottom:14px; min-height:2.7em; }
.language-card .card-direction { font-size:12px; line-height:1.65; padding-top:12px; border-top:1px solid var(--line); margin-bottom:10px; }
.language-card .card-availability { font-size:11px; margin:0 0 15px; }
.card-bottom { margin-top:auto; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; }
.card-bottom > a { font-size:12px; }
.card-play { background:var(--ink); color:var(--white); border:1px solid var(--ink); padding:8px 11px; }
.card-play span { opacity:.8; margin-left:5px; font-size:11px; }
.card-play:hover,.card-play.is-playing { color:var(--white); background:var(--orange); }
.has-index-player { padding-bottom:145px; }
.index-player { position:fixed; bottom:16px; left:50%; transform:translateX(-50%); z-index:20; width:min(1120px,calc(100% - 32px)); display:flex; gap:18px; align-items:center; flex-wrap:wrap; padding:16px 20px; border:1px solid var(--line); border-radius:5px; background:var(--white); box-shadow:0 4px 30px #293c3626; }
.index-now { display:flex; flex-direction:column; flex:1 1 180px; font-size:13px; }
.index-player audio { flex:2 1 260px; width:260px; }
.index-playlist { flex:1 1 160px; }
.index-playlist select { padding:8px; margin-top:3px; font-size:12px; }
#index-play-status { margin:0; flex-basis:100%; }
#index-play-status:empty { display:none; }
#index-close { padding:5px 10px; font-size:21px; }
.timing-workspace { max-width:1000px; margin:0 auto 70px; }
.timing-workspace h1 { font-size:clamp(36px,5vw,58px); }
.timing-workspace > p { max-width:740px; color:var(--muted); }
.timing-player { position:sticky; top:0; z-index:4; margin:25px 0; padding:16px; border:1px solid var(--line); background:var(--white); }
.timing-toolbar { display:flex; gap:20px; align-items:center; justify-content:space-between; margin-top:10px; }
.timing-toolbar label { display:flex; gap:10px; align-items:center; }
.timing-toolbar select { padding:5px 10px; width:auto; margin:0; font-size:13px; }
#timing-clock { font-variant-numeric:tabular-nums; font-size:15px; }
.timing-player .current-lyric { min-height:2.5em; margin:12px 0 0; padding:4px 12px; font-size:17px; }
.timing-input summary,.timing-shift summary { cursor:pointer; padding:15px 0; }
.timing-input .action input { max-width:210px; padding:0; border:0; margin-top:6px; font-size:11px; }
.timing-row { display:grid; grid-template-columns:minmax(150px,1fr) 125px 125px; gap:12px; padding:20px 0; border-bottom:1px solid var(--line); }
.timing-row-actions { grid-column:1/-1; display:flex; flex-wrap:wrap; gap:10px; }
.timing-row input { padding:10px; font-variant-numeric:tabular-nums; }
.timing-row textarea { margin-top:7px; }
.timing-export { margin-top:25px; }
.timing-export > a { font-size:13px; }
@media(max-width:600px) { .index-player { gap:10px; padding:12px; bottom:8px; } .index-player audio { order:3; flex-basis:100%; } .index-playlist { flex-basis:100%; order:4; } #index-close { margin-left:auto; } .has-index-player { padding-bottom:245px; } .timing-row { grid-template-columns:1fr 1fr; } .timing-row > label:first-child { grid-column:1/-1; } .timing-toolbar { gap:8px; } .timing-toolbar label { font-size:11px; gap:5px; } }
.card-play .play-label { font-size:13px; opacity:1; margin-left:0; }

/* A short opening selection; the complete collection has its own page. */
.hero { grid-template-columns:1.05fr 1fr; gap:48px; }
.invitation .author-artwork { width:fit-content; max-width:100%; justify-self:end; padding:12px; background:#f1e6ce; border:1px solid var(--line); }
.author-artwork > a { display:block; }
.invitation .author-artwork:not([data-home-art]) img { width:auto; height:auto; max-height:350px; max-width:100%; aspect-ratio:auto; object-fit:contain; border-radius:0; }
.author-artwork figcaption { font-size:10px; text-align:center; letter-spacing:0; }
.hero .action-row { align-items:baseline; }
.featured-heading { display:flex; justify-content:space-between; align-items:center; gap:24px; margin-bottom:20px; }
.featured-heading h2 { font-size:30px; margin:0; }
#collection.featured-collection { padding:32px 0 48px; }
.collection-actions { display:flex; align-items:center; flex-wrap:wrap; gap:20px; }
.card-scroll-controls { display:flex; gap:8px; }
.card-scroll-controls button { width:38px; height:38px; padding:0; font-size:20px; border:1px solid var(--line); border-radius:50%; background:var(--white); }
.card-scroll-controls button:disabled { opacity:.35; cursor:default; }
.featured-grid { grid-template-columns:none; grid-template-rows:420px; grid-auto-flow:column; grid-auto-columns:340px; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x proximity; gap:16px; padding-bottom:16px; scrollbar-color:var(--muted) var(--paper); }
.featured-grid .language-card { scroll-snap-align:start; }
.invitation { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:52px; }
.invitation-copy { min-width:0; }
.invitation-copy h2 { max-width:600px; }
.invitation-copy .action-row { flex-wrap:wrap; }
.dream-artwork img { height:auto; }
.language-directory .back { margin:0 0 30px; }
.language-directory h1 { font-size:clamp(42px,5vw,64px); letter-spacing:-.035em; }
.language-card { transition:border-color .15s; }
.language-card:hover { transform:none; }
article.language-card { height:420px; min-height:420px; padding:20px; }
.language-card .card-top { line-height:1.4; min-height:14px; flex-shrink:0; gap:10px; }
.language-card h3 { font-size:23px; line-height:1.2; margin:14px 0 8px; height:56px; flex-shrink:0; }
.language-card h3 a { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.language-card .card-poem { line-height:1.6; height:45px; min-height:45px; margin:0 0 12px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.language-card .card-direction { height:54px; min-height:54px; line-height:1.65; margin:0 0 12px; overflow:hidden; }
.language-card .card-availability { margin-bottom:14px; }
.card-bottom { flex-shrink:0; min-height:40px; }
.featured-grid:focus-visible { outline:2px solid var(--orange); outline-offset:5px; }
@media(max-width:760px) {
 .hero { grid-template-columns:1fr; gap:28px; }
 .invitation { grid-template-columns:1fr; gap:30px; }
 .invitation .author-artwork { justify-self:end; }
 .invitation .author-artwork:not([data-home-art]) img { max-height:300px; }
 .featured-heading { align-items:flex-start; flex-wrap:wrap; gap:16px; }
 .featured-heading h2 { font-size:27px; }
}
@media(max-width:600px) {
 .featured-grid { grid-auto-columns:calc(100% - 24px); gap:14px; }
 .collection-actions { width:100%; justify-content:space-between; }
}

/* Reading stays free of arrangement labels; the exact lyrics prompt is optional. */
.compact-listening .media-group:first-of-type { margin-top:0; }
.compact-listening .media-group + .media-group { border-top:1px solid var(--line); padding-top:22px; }
.compact-listening .media-group h2 { font:400 27px/1.3 Georgia,serif; margin:0 0 16px; }
#poem-text, #listen, #watch { scroll-margin-top:24px; }
.lyrics-prompt textarea { font:15px/1.9 system-ui,sans-serif; resize:vertical; margin-bottom:16px; }
#lyrics-copy-status:empty { display:none; }

/* A quiet path from a handwritten poem to a shared song. */
:root { --orange:#985835; --line:#dcdacb; }
.hero { padding-top:58px; gap:64px; }
.hero .intro { max-width:480px; line-height:1.85; }
.hero .dream-artwork { padding:10px; box-shadow:0 14px 45px #63523a0b; border-radius:3px; }
.hero .dream-artwork img { border-radius:2px; }
.button, .card-play, .card-scroll-controls button { transition:background-color .2s, border-color .2s, color .2s; }
.stats { padding:21px 0; }
.stats strong { font-size:36px; }
.stats span { color:#637067; }
#collection.featured-collection { padding:36px 0 46px; }
.featured-heading h2 { font-size:34px; margin-top:9px; }
.collection-intro { margin:9px 0 0; color:var(--muted); font-size:13px; }
.featured-grid { grid-template-rows:330px; grid-auto-columns:300px; gap:16px; padding:4px 0; scrollbar-width:none; overflow-anchor:none; }
.featured-grid::-webkit-scrollbar { display:none; }
.featured-grid article.language-card { height:330px; min-height:330px; padding:16px; border-radius:6px; background:#fffdf7dd; }
.featured-grid .language-card h3 { font-size:21px; height:52px; margin:10px 0 6px; }
.featured-grid .language-card .card-poem { height:42px; min-height:42px; font-size:13px; margin-bottom:6px; }
.featured-grid .language-card .card-direction { height:44px; min-height:44px; padding-top:7px; font-size:11px; line-height:1.65; margin-bottom:8px; }
.featured-grid .language-card .card-availability { font-size:10px; margin-bottom:8px; }
.featured-grid .card-bottom { gap:8px; min-height:34px; }
.featured-grid .card-bottom > a { font-size:11px; }
.featured-grid .card-play { padding:6px 10px; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.origin-story { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:76px; padding:42px 0 46px; border-top:1px solid var(--line); scroll-margin-top:24px; }
.story-copy { max-width:660px; }
.story-copy h2 { font-size:42px; line-height:1.18; margin:17px 0 24px; }
.story-copy p { color:var(--muted); font-size:16px; line-height:1.95; }
.north-star { font-size:22px; display:inline-block; margin-right:7px; vertical-align:middle; }
.author-bio { padding:24px 0 0 30px; border-left:1px solid var(--line); align-self:center; }
.author-bio h3 { font:27px/1.35 Georgia,serif; margin:13px 0 17px; }
.author-bio p { color:var(--muted); font-size:14px; line-height:1.9; }
.author-links { display:flex; flex-wrap:wrap; gap:12px 20px; font-size:12px; margin-top:22px; }
.author-links a { text-decoration:underline; text-decoration-color:#bdac87; }
.dream-thread { display:flex; align-items:center; justify-content:center; gap:18px; color:#aa8a57; }
.dream-thread:before,.dream-thread:after { content:""; width:110px; height:1px; background:linear-gradient(90deg,transparent,#c5b48c); }
.dream-thread:after { transform:rotate(180deg); }
.dream-quote { border:0; padding:12px 15px 44px; margin:0; text-align:center; }
.dream-quote p { font:italic 29px/1.65 Georgia,serif; color:var(--ink); margin:8px 0; }
.dream-quote cite { font:11px/1.6 system-ui,sans-serif; color:var(--muted); }
.invitation { background:#e9ecdf; border-radius:8px; }
@media(max-width:760px) {
 .hero { padding-top:36px; gap:30px; }
 .hero .intro { font-size:16px; }
 .origin-story { grid-template-columns:1fr; gap:25px; padding:34px 0; }
 .story-copy h2 { font-size:34px; }
 .author-bio { border-left:0; border-top:1px solid var(--line); padding:26px 0 0; }
 .dream-quote p { font-size:24px; }
 .featured-heading h2 { font-size:29px; }
}
@media(max-width:600px) { .featured-grid { grid-auto-columns:calc(100% - 24px); gap:14px; } }
@media(prefers-reduced-motion:reduce) { .button,.card-play,.card-scroll-controls button { transition:none; } }

/* A poem without borders, with a quiet listening queue. */
.brand span { font-size:9px; letter-spacing:.13em; white-space:nowrap; }
header { gap:24px; }
.playlist-controls { display:flex; gap:8px; align-items:center; }
.playlist-controls button { min-width:34px; padding:5px 9px; }
.playlist-controls button:disabled { opacity:.35; cursor:default; }
#index-position { letter-spacing:0; font-weight:400; margin-left:8px; color:var(--muted); }
.playlist-picker { display:block; max-width:100%; margin-top:18px; }
.playlist-picker select { font-size:13px; padding:9px 12px; }
.index-playlist { min-width:0; }
.index-playlist select { width:100%; }
.index-now { min-width:0; }
.index-now a { overflow-wrap:anywhere; }
@media(max-width:760px) { header { flex-wrap:wrap; gap:18px; } .brand span { font-size:8px; letter-spacing:.1em; } }
@media(max-width:600px) {
 .playlist-controls { order:4; flex-basis:100%; }
 .index-playlist { order:5; }
 .has-index-player { padding-bottom:310px; }
 .index-player { max-height:65vh; overflow-y:auto; }
}

/* One track title, a quiet timeline, and a line of the poem when timed. */
.index-player { display:grid; grid-template-columns:minmax(0,1fr) auto 28px; gap:10px 18px; width:min(900px,calc(100% - 32px)); padding:15px 18px; border-radius:14px; background:#fffdf8; box-shadow:0 8px 36px #293c361c; }
.player-heading { display:flex; align-items:center; gap:12px; min-width:0; }
.player-cover { width:44px; height:44px; object-fit:cover; border-radius:8px; flex-shrink:0; }
.player-title { min-width:0; flex:1; }
.player-title .eyebrow { font-size:9px; letter-spacing:.12em; }
#index-position { font-size:10px; margin-left:6px; }
.track-picker { display:block; position:relative; min-width:0; }
.track-picker select { appearance:none; width:100%; background:transparent; border:0; border-radius:3px; padding:3px 26px 3px 0; margin:0; font-size:14px; font-weight:550; cursor:pointer; text-overflow:ellipsis; }
.track-picker > svg { position:absolute; right:3px; top:7px; width:17px; height:17px; fill:none; stroke:var(--muted); stroke-width:1.7; pointer-events:none; }
.index-player .playlist-controls { gap:8px; order:initial; }
.index-player .player-icon { display:inline-flex; justify-content:center; align-items:center; flex-shrink:0; width:34px; height:34px; min-width:0; padding:7px; background:transparent; border:0; border-radius:50%; color:var(--ink); }
.player-icon svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.index-player .player-icon:hover { background:#e9ecdf; }
.index-player .player-icon:disabled { opacity:.3; cursor:default; }
.index-player .player-toggle { width:42px; height:42px; background:var(--ink); color:var(--white); }
.index-player .player-toggle:hover { background:#31534b; }
#index-play-icon { fill:currentColor; stroke-width:0; transform:translateX(-2px); }
#index-pause-icon { stroke-width:3; }
.index-player #index-close { width:28px; height:28px; margin:0; padding:5px; color:var(--muted); align-self:start; }
.player-timeline { grid-column:1/-1; display:flex; align-items:center; gap:10px; min-width:0; }
.player-timeline output { font:11px/1.4 system-ui,sans-serif; font-variant-numeric:tabular-nums; color:var(--muted); min-width:30px; }
#index-duration { text-align:right; }
#index-seek { display:block; width:100%; min-width:0; flex:1; height:20px; margin:0; padding:0; border:0; background:transparent; accent-color:var(--ink); cursor:pointer; }
#index-seek:disabled { cursor:default; opacity:.5; }
.index-player #index-mute { width:26px; height:26px; padding:4px; }
.speaker-muted,.is-muted .speaker-wave { display:none; }
.is-muted .speaker-muted { display:block; }
.player-meta { grid-column:1/-1; display:flex; justify-content:space-between; align-items:center; gap:16px; }
.player-links { display:flex; flex-wrap:wrap; gap:16px; font-size:11px; color:var(--muted); }
.player-links a { text-decoration-color:var(--line); }
.player-lyric { min-height:2.2em; grid-column:1/-1; text-align:center; font:17px/1.7 Georgia,serif; color:var(--ink); margin:2px 0 0; padding:8px 4px 2px; border-top:1px solid var(--line); overflow-wrap:anywhere; }
#index-play-status { grid-column:1/-1; font-size:11px; color:var(--muted); }
.has-index-player .playlist-picker { display:none; }
.has-index-player { padding-bottom:245px; }
@media(max-width:600px) {
 .index-player { grid-template-columns:minmax(0,1fr) 28px; width:calc(100% - 24px); gap:9px 10px; padding:12px; bottom:8px; }
 .player-cover { width:38px; height:38px; }
 .player-heading { gap:9px; grid-column:1; grid-row:1; }
 .index-player #index-close { grid-column:2; grid-row:1; }
 .index-player .playlist-controls { grid-column:1/-1; grid-row:2; justify-content:center; }
 .track-picker select { font-size:13px; }
 .player-timeline { grid-row:3; gap:8px; }
 .player-meta { grid-row:4; gap:8px; }
 .player-links { gap:12px; font-size:10px; }
 .player-lyric { font-size:15px; }
 .has-index-player { padding-bottom:295px; }
}

/* The listening deck: forest tones, warm accents and a clear control hierarchy. */
.index-player { --player-text:#f5f1e7; --player-muted:#b1c2b9; color:var(--player-text); background:#173b34; border:1px solid #426157; border-radius:18px; padding:18px 20px 14px; gap:12px 20px; box-shadow:0 16px 48px #132c3333,0 2px 8px #132c3326; }
.player-cover { width:58px; height:58px; border-radius:10px; box-shadow:0 3px 12px #0003; }
.player-title .eyebrow { display:flex; align-items:center; gap:6px; color:#ccb68a; font-size:8px; letter-spacing:.14em; }
.playback-dot { width:5px; height:5px; border-radius:50%; background:#82978a; flex-shrink:0; }
.is-playing .playback-dot { background:#cfe1b6; box-shadow:0 0 0 3px #cfe1b60b; }
#index-position { color:var(--player-muted); margin-left:5px; font-size:9px; }
.track-picker select { color:var(--player-text); font-size:15px; font-weight:600; padding-top:5px; padding-bottom:3px; }
.track-picker select option { background:#173b34; color:var(--player-text); }
.track-picker > svg { stroke:#c4d3c8; top:10px; }
.player-credit { display:block; font-size:10px; color:var(--player-muted); margin-top:1px; }
.index-player .player-icon { color:#dce6df; width:36px; height:36px; }
.index-player .player-icon:hover { color:white; background:#ffffff12; }
.index-player .player-toggle { width:48px; height:48px; color:#173b34; background:#eee2c8; box-shadow:0 3px 10px #0002; }
.index-player .player-toggle:hover { background:#fff3da; color:#173b34; }
.index-player .player-toggle svg { width:23px; height:23px; }
.index-player #index-stop { width:30px; height:30px; margin-left:5px; color:#afc0b5; }
#index-stop rect { fill:currentColor; stroke:none; }
.index-player #index-close { color:#afc0b5; }
.index-player :focus-visible { outline:2px solid #e9cea0; outline-offset:4px; }
.player-timeline { gap:12px; }
.player-timeline output { color:#c3d1c8; font-size:10px; }
#index-seek,#index-volume { --progress:0%; appearance:none; border:0; border-radius:0; padding:0; height:20px; background:transparent; accent-color:#ead8b3; }
#index-seek::-webkit-slider-runnable-track,#index-volume::-webkit-slider-runnable-track { height:3px; border-radius:6px; background:linear-gradient(to right,#e7d3aa var(--progress),#49675b var(--progress)); }
#index-seek::-moz-range-track,#index-volume::-moz-range-track { height:3px; border-radius:6px; background:linear-gradient(to right,#e7d3aa var(--progress),#49675b var(--progress)); }
#index-seek::-webkit-slider-thumb,#index-volume::-webkit-slider-thumb { appearance:none; width:11px; height:11px; margin-top:-4px; border-radius:50%; background:#f1e6d1; border:0; box-shadow:0 1px 4px #0003; }
#index-seek::-moz-range-thumb,#index-volume::-moz-range-thumb { width:11px; height:11px; border-radius:50%; background:#f1e6d1; border:0; }
.player-meta { padding-top:1px; }
.player-volume { display:flex; align-items:center; gap:7px; }
#index-volume { --progress:100%; width:72px; margin:0; cursor:pointer; }
.index-player #index-mute { color:#b8cbbd; }
.player-links { gap:20px; color:#b8cbbd; font-size:10px; }
.player-links a { text-decoration:none; }
.player-links a:hover { color:#f1e6d1; }
.player-lyric { color:#efe3cb; border-color:#426157; }
#index-play-status { color:#d5dfd6; }
@media(max-width:600px) {
 .index-player { border-radius:15px; padding:14px 14px 11px; gap:10px 12px; }
 .player-cover { width:46px; height:46px; border-radius:8px; }
 .track-picker select { font-size:13px; }
 .player-credit { font-size:9px; }
 .index-player .playlist-controls { gap:17px; position:relative; }
 .index-player #index-stop { position:absolute; right:7px; margin-left:0; }
 .index-player .player-toggle { width:46px; height:46px; }
 .player-links { gap:14px; font-size:10px; }
 #index-volume { width:56px; }
}

.recording-variation + .recording-variation { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--line); }

.public-reference-intro { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.65fr); align-items:center; gap:clamp(28px,5vw,76px); margin:16px 0 32px; padding:44px 0; border-top:1px solid var(--line); scroll-margin-top:24px; }
.public-reference-intro h2 { margin:.6rem 0; font-size:clamp(30px,3.3vw,42px); }
.public-reference-intro p { max-width:540px; color:var(--muted); font-size:16px; line-height:1.9; margin:22px 0; }
.reference-artwork { width:280px; max-width:100%; justify-self:center; }
.reference-artwork > a { display:block; padding:10px; background:var(--white); border:1px solid var(--line); box-shadow:0 8px 24px #1739340a; }
.reference-artwork img { width:100%; height:auto; aspect-ratio:auto; object-fit:contain; border-radius:0; }
.reference-artwork figcaption { font-size:10px; line-height:1.6; text-align:center; }
@media(max-width:760px) { .public-reference-intro { grid-template-columns:1fr; gap:30px; padding:32px 0; margin:0 0 24px; } .public-reference-intro h2 { font-size:34px; } .reference-artwork { width:260px; } }
#generation-baseline th { text-align: left; }

/* A familiar listening queue, with the collection's quiet visual character. */
.index-player .player-icon[aria-pressed="true"] { color:#eed39e; background:#ffffff15; }
#index-repeat { position:relative; }
#index-repeat-one { position:absolute; font-size:8px; top:12px; left:15px; background:#173b34; }
.player-links button { appearance:none; background:none; border:0; color:inherit; font:inherit; padding:4px 0; cursor:pointer; }
.player-links button[aria-expanded="true"] { color:#eed39e; border-bottom:1px solid #eed39e; }
.player-drawer { grid-column:1/-1; border-top:1px solid #426157; padding-top:12px; max-height:min(35vh,320px); overflow:auto; overscroll-behavior:contain; }
.drawer-heading { display:flex; gap:16px; align-items:baseline; justify-content:space-between; }
.drawer-heading h2 { font:600 15px/1.5 system-ui,sans-serif; margin:0; }
.drawer-heading span,.player-drawer .small { color:var(--player-muted); font-size:11px; }
.player-drawer ol { padding-left:24px; margin:8px 0; }
.player-drawer li { color:var(--player-muted); font-size:12px; padding:2px 0; }
.player-drawer li button { display:block; width:100%; color:var(--player-text); background:none; border:0; text-align:left; padding:9px 7px; font:inherit; border-radius:6px; cursor:pointer; }
.player-drawer li button:hover { background:#ffffff12; }
.player-drawer pre { white-space:pre-wrap; overflow-wrap:anywhere; font:18px/1.85 Georgia,serif; color:#efe3cb; background:none; padding:6px 0; border:0; }
.player-drawer a { color:#cfddcf; font-size:12px; }
#index-play-status:empty { display:none; }
@media(max-width:600px) {
 .index-player .playlist-controls { gap:10px; }
 .index-player #index-stop { position:static; margin-left:2px; }
 .player-links { gap:10px; justify-content:flex-end; }
 .player-volume { gap:3px; }
 #index-volume { width:40px; }
 .player-drawer { max-height:27vh; }
 .drawer-heading { flex-wrap:wrap; gap:2px; }
}

.text-button { border:0; background:none; color:inherit; font:inherit; text-decoration:underline; cursor:pointer; padding:0; }
.analytics-consent { position:fixed; bottom:18px; left:18px; z-index:40; max-width:min(460px,calc(100% - 36px)); padding:20px; background:#fffdf8; border:1px solid var(--line); border-radius:12px; box-shadow:0 8px 40px #173b3428; font-size:13px; }
.analytics-consent p { margin-top:0; }
.analytics-consent button { font:inherit; cursor:pointer; padding:8px 10px; background:#eee6d7; border:1px solid var(--line); border-radius:6px; }
.engagement-intro { max-width:750px; padding:20px 0; }
.engagement-section { padding:28px 0; border-top:1px solid var(--line); }
.engagement-section .section-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.engagement-section h2 { margin:0 0 10px; }
.status-pill { display:inline-block; border:1px solid var(--line); padding:6px 12px; border-radius:20px; font-size:12px; }
.engagement-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin:24px 0; }
.engagement-metrics > * { padding:20px; background:#fffdf888; border:1px solid var(--line); border-radius:10px; text-decoration:none; }
.engagement-metrics h3 { font:600 17px/1.4 system-ui; margin:0; }
.engagement-metrics p { font-size:14px; margin-bottom:0; }
.engagement-metrics strong { display:block; font-size:32px; font-weight:500; }
.engagement-metrics span { font-size:13px; }
.feedback-controls { display:flex; align-items:center; gap:24px; flex-wrap:wrap; }
.feedback-controls label { display:flex; align-items:center; gap:10px; }
.feedback-controls select { width:auto; margin:0; }
.feedback-list { padding:0; list-style:none; }
.feedback-list li { padding:14px 0; border-bottom:1px solid var(--line); }
.feedback-list p { font-size:12px; margin:6px 0 0; color:var(--muted); }
@media(max-width:650px) { .engagement-metrics { grid-template-columns:1fr; gap:10px; } .engagement-section .section-heading { flex-wrap:wrap; } }

/* Homepage usability: reachable controls, readable cards and unobstructed listening. */
.skip-link { position:fixed; top:12px; left:20px; z-index:60; padding:12px 18px; background:var(--ink); color:var(--white); border-radius:4px; transform:translateY(-180%); }
.skip-link:focus { transform:translateY(0); }
header nav a { display:inline-flex; align-items:center; min-height:44px; }
.card-scroll-controls button { width:44px; height:44px; cursor:pointer; }
.featured-grid .card-play { min-height:44px; padding:8px 12px; cursor:pointer; border-radius:4px; }
.featured-grid .card-bottom > a { display:inline-flex; align-items:center; min-height:44px; }
.featured-grid .card-direction { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; height:48px; min-height:48px; }
.featured-grid .language-card:focus-within { border-color:var(--orange); }
.author-links a, footer a, footer .text-button { display:inline-flex; align-items:center; min-height:28px; }
.index-player { grid-template-columns:minmax(0,1fr) auto 40px; max-height:calc(100dvh - 32px); overflow-y:auto; }
.index-player .player-icon, .index-player #index-stop, .index-player #index-close { width:40px; height:40px; }
.index-player #index-stop { margin-left:0; }
.index-player #index-mute { width:36px; height:36px; }
.player-links button, .player-links a { display:inline-flex; align-items:center; min-height:32px; }
.analytics-consent { max-height:calc(100dvh - 36px); overflow-y:auto; }
.analytics-consent .action-row { display:grid; grid-template-columns:1fr 1fr; align-items:stretch; }
.analytics-consent button { min-height:44px; }
.analytics-consent .action-row > a { grid-column:1/-1; justify-self:start; padding:4px 0; }
.has-index-player .analytics-consent { top:16px; bottom:auto; max-height:30dvh; }
.has-index-player:has(.analytics-consent:not([hidden])) .index-player { max-height:60dvh; }
@media(max-width:760px) {
 header:after { left:20px; right:20px; }
 .hero h1 { font-size:clamp(52px,15vw,67px); }
 .author-links a { min-height:44px; }
}
@media(max-width:600px) {
 .index-player { grid-template-columns:minmax(0,1fr) 40px; max-height:65dvh; }
 .index-player .playlist-controls { gap:4px; }
 .player-meta { flex-wrap:wrap; gap:4px; }
 .player-links { flex:1 1 100%; justify-content:space-between; gap:8px; font-size:11px; }
 .player-links button, .player-links a { min-height:36px; }
 .track-picker select { min-height:36px; }
 .has-index-player { padding-bottom:350px; }
 .analytics-consent { left:12px; bottom:12px; max-width:calc(100% - 24px); padding:16px; }
}

/* Original artwork deserves space, with clear editions and download labels. */
article.art-gallery { max-width:none; margin:12px 0 64px; }
.art-gallery-intro { max-width:710px; padding-bottom:28px; }
.art-gallery-intro h1 { font:400 clamp(40px,5vw,64px)/1.15 Georgia,serif; letter-spacing:-.035em; }
.art-gallery-intro p { color:var(--muted); font-size:18px; line-height:1.85; }
.gallery-piece { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); gap:clamp(32px,6vw,80px); align-items:center; padding:48px 0; border-top:1px solid var(--line); scroll-margin-top:24px; }
.gallery-piece figure { max-width:390px; width:100%; justify-self:center; }
.gallery-piece figure > a { display:block; width:fit-content; max-width:100%; padding:14px; margin:auto; border:1px solid var(--line); background:var(--white); box-shadow:0 10px 35px #1739340a; }
.gallery-piece img { height:auto; width:auto; max-width:100%; max-height:540px; aspect-ratio:auto; object-fit:contain; border-radius:0; }
.gallery-piece figcaption { text-align:center; font-size:11px; }
.gallery-piece h2 { font:400 clamp(30px,3.4vw,42px)/1.15 Georgia,serif; margin:16px 0 22px; }
.gallery-piece-copy > p { color:var(--muted); line-height:1.9; }
.art-gallery .art-poetic-caption { border-left:0; margin:28px 0 4px; padding:0; }
.art-poetic-caption p { font:italic 24px/1.65 Georgia,serif; color:var(--ink); }
.gallery-piece-copy .art-caption-note { font-size:11px; margin:0 0 28px; }
.gallery-piece-copy .art-edition-note { font-size:12px; margin-top:15px; }
.art-gallery-notes { max-width:760px; margin:30px auto 0; padding-top:12px; border-top:1px solid var(--line); }
@media(max-width:760px) { .gallery-piece { grid-template-columns:1fr; gap:30px; padding:32px 0; } .gallery-piece figure { max-width:330px; } .gallery-piece img { max-height:460px; } .art-poetic-caption p { font-size:22px; } }

.reference-artwork figcaption a, .author-artwork figcaption a { display:inline-flex; align-items:center; min-height:32px; font-size:11px; }

/* A quiet, curated gallery; full images keep their original proportions. */
.portfolio-intro { max-width:790px; padding:20px 0 42px; }
.portfolio-intro h1 { font:400 clamp(44px,6vw,76px)/1.12 Georgia,serif; letter-spacing:-.035em; }
.portfolio-intro > p { font-size:19px; line-height:1.85; color:var(--muted); }
.portfolio-intro .portfolio-context { font-size:14px; max-width:650px; }
.portfolio-intro .action-row { gap:16px 28px; font-size:13px; margin-top:24px; }
.portfolio-grid { border-top:1px solid var(--line); padding-top:28px; }
.portfolio-card { min-width:0; margin:0; }
.portfolio-card img { width:100%; height:100%; object-fit:contain; border-radius:0; aspect-ratio:auto; }
.portfolio-card figcaption { margin-top:20px; }
.portfolio-card h2 { color:var(--ink); font:400 25px/1.3 Georgia,serif; margin:8px 0 12px; }
.portfolio-caption { font:italic 17px/1.7 Georgia,serif; color:var(--muted); margin:0; }
.portfolio-closing { border-top:1px solid var(--line); margin:60px 0; padding-top:24px; max-width:760px; }
.portfolio-closing p { color:var(--muted); line-height:1.85; }
@media(max-width:600px) { .portfolio-grid { max-width:430px; margin:auto; } .portfolio-intro { padding-top:10px; } }

/* A compact index opens the longer, individual journal entries. */
.portfolio-row { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:40px 28px; margin-bottom:42px; }
.art-index .portfolio-card { scroll-margin-top:28px; }
.art-index .portfolio-card > a.art-wall:has(.art-frame) { --frame-size:8px; --mat-size:16px; padding:26px 20px 34px; min-height:0; height:auto; border:0; }
.art-index .art-frame { width:280px; aspect-ratio:2 / 3; }
.art-index .portfolio-card figcaption { margin-top:18px; }
.art-index .portfolio-card h2 { margin:0 0 10px; }
.art-index .portfolio-card h2 a { text-decoration:none; }
.art-index .portfolio-caption { font:italic 18px/1.5 Georgia,serif; color:var(--muted); }
.art-index .portfolio-card:target h2 a { text-decoration:underline; text-decoration-color:var(--orange); }
/* Let tablet rows flow continuously, rather than leaving a lonely third card. */
@media(min-width:601px) and (max-width:900px) {
  .art-index .portfolio-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:36px 24px; }
  .art-index .portfolio-row { display:contents; }
}
@media(max-width:600px) {
  .portfolio-row { grid-template-columns:1fr; gap:38px; }
  .art-index .portfolio-card > a.art-wall:has(.art-frame) { height:auto; min-height:0; padding:28px 24px 34px; }
}

/* Versions share a compact player area; native players retain their controls. */
.media-tabs { display:flex; flex-wrap:wrap; gap:5px; padding:4px; margin:0 0 18px; border:1px solid var(--line); border-radius:8px; background:#e7decd; }
.media-tabs button { flex:1 1 auto; padding:8px 12px; border:0; border-radius:5px; background:transparent; color:var(--muted); font:600 12px/1.4 system-ui,sans-serif; cursor:pointer; }
.media-tabs button[aria-selected="true"] { background:var(--white); color:var(--ink); box-shadow:0 1px 3px #34281617; }
.media-tabs button:hover { color:var(--ink); }
.recording-variation[role="tabpanel"] { margin-top:0; padding-top:0; border-top:0; outline-offset:5px; }
/* Reserve the video viewport before metadata loads and across version changes. */
.compact-listening [role="tabpanel"] video { height:220px; object-fit:contain; }
@media(max-width:700px) { .compact-listening [role="tabpanel"] video { height:300px; } }

/* Individual art journal entries. */
article.art-detail { max-width:none; margin:0 0 60px; }
.art-detail-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:64px; align-items:start; }
.art-detail .art-wall { min-height:0; padding:38px; }
.art-detail h1 { font:400 clamp(38px,4vw,58px)/1.15 Georgia,serif; margin:18px 0 22px; }
.art-detail .art-detail-phrase { font:italic 24px/1.55 Georgia,serif; color:var(--ink); margin:0 0 30px; }
.art-reflections { color:var(--muted); font-size:17px; line-height:1.85; }
.art-reflections p { margin:0 0 22px; }
.art-detail .art-reading-note { font-size:11px; color:var(--muted); }
.art-detail-print { display:grid; grid-template-columns:1fr 1fr; gap:64px; border-block:1px solid var(--line); padding:36px 0; margin:44px 0; }
.art-detail h2 { font:400 32px/1.25 Georgia,serif; margin:12px 0 20px; }
.art-detail-print p,.art-detail-ai p { color:var(--muted); }
.art-detail-print .button { margin:0 0 8px; }
.art-detail-ai { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:64px; align-items:center; padding:20px 0 44px; }
.art-detail-ai img { display:block; width:100%; max-width:300px; height:auto; margin:auto; }
.art-detail-navigation { display:flex; justify-content:space-between; flex-wrap:wrap; gap:20px; border-top:1px solid var(--line); padding:26px 0; }
.art-detail-navigation a { text-decoration:underline; }
@media(max-width:800px) { .art-detail-layout,.art-detail-print,.art-detail-ai { grid-template-columns:1fr; gap:32px; } .art-detail-layout figure { max-width:480px; width:100%; margin:auto; } .art-detail .art-wall { padding:28px; } .art-detail-story { max-width:620px; } }

/* Keep the art within reach, especially on small screens. */
main:has(.art-index) > .back { margin:18px 0 8px; }
.portfolio-intro { padding-bottom:28px; scroll-margin-top:20px; }
.portfolio-intro h1 { margin:16px 0; }
.portfolio-intro .action-row { margin-top:16px; }
.portfolio-closing .action-row { gap:12px 28px; }
.portfolio-closing .text-link { display:inline-flex; align-items:center; min-height:44px; }
@media(max-width:600px) {
  .portfolio-intro > p { font-size:17px; line-height:1.65; margin:12px 0; }
  .portfolio-intro .portfolio-context { font-size:13px; }
  .portfolio-intro .action-row { gap:8px 20px; margin-top:12px; }
  .portfolio-intro h1 { font-size:clamp(36px,8vw,44px); }
}

/* Art Journal: an editorial gallery around the unchanged two-size frames. */
.art-subnav { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px 0; border-bottom:1px solid var(--line); font-size:12px; }
.art-subnav a { display:inline-flex; align-items:center; min-height:40px; text-decoration:none; }
.art-subnav nav { gap:24px; font-size:12px; }
.art-subnav nav a[aria-current="page"] { color:var(--ink); box-shadow:inset 0 -2px var(--orange); }
.art-home { color:var(--muted); }
.art-home-short { display:none; }
.portfolio-intro { display:grid; grid-template-columns:1.25fr 1fr; gap:56px; align-items:center; max-width:none; padding:44px 0 38px; }
.portfolio-intro h1 { font-size:clamp(48px,6vw,76px); margin:18px 0 0; line-height:1.02; }
.portfolio-intro-copy { max-width:380px; justify-self:end; padding-left:28px; border-left:1px solid #b18b634d; }
.portfolio-intro-copy p { font:400 22px/1.65 Georgia,serif; margin:0 0 22px; color:var(--muted); }
.portfolio-intro-copy a { font-size:12px; }
.gallery-threshold { display:flex; align-items:center; justify-content:space-between; gap:20px; border-block:1px solid var(--line); padding:16px 0; margin-bottom:28px; }
.gallery-threshold span:first-child { font-size:10px; letter-spacing:.17em; color:var(--muted); }
.gallery-threshold span:last-child { font:italic 17px/1.5 Georgia,serif; }
.art-index .portfolio-grid { border:0; padding:0; }
.art-index .portfolio-card figcaption { padding:0 6px; }
.art-index .portfolio-card h2 a { display:flex; justify-content:space-between; align-items:baseline; gap:12px; padding:4px 0; }
.art-index .portfolio-caption { font-size:17px; max-width:33ch; }
.portfolio-closing { display:grid; grid-template-columns:1fr 1.2fr; gap:64px; max-width:none; margin:44px 0 64px; padding:40px 0 0; }
.portfolio-closing h2 { font-size:clamp(32px,4vw,46px); max-width:none; }
.portfolio-closing p { font-size:15px; margin:0 0 14px; max-width:55ch; }
.portfolio-closing .action-row { font-size:12px; }
.art-detail-trail { display:flex; justify-content:space-between; align-items:center; font-size:12px; padding:12px 0; }
.art-detail-trail > a { min-height:44px; display:inline-flex; align-items:center; }
.art-detail-trail > div { display:flex; gap:16px; align-items:center; }
.art-detail-trail > div a { display:grid; place-items:center; width:44px; height:44px; border:1px solid var(--line); border-radius:50%; text-decoration:none; font-size:20px; }
.art-detail-trail span { color:var(--muted); font-size:11px; letter-spacing:.1em; }
.art-detail-heading { padding:14px 0 28px; }
.art-detail .art-detail-heading h1 { font-size:clamp(42px,5.6vw,70px); margin:12px 0 18px; }
.art-section-links { flex-wrap:wrap; gap:8px 24px; font-size:12px; }
.art-section-links a { display:inline-flex; align-items:center; min-height:38px; border-bottom:1px solid #b18b6355; }
.art-detail-layout { gap:56px; align-items:center; }
.art-detail-layout > figure { min-width:0; }
.art-detail-layout figcaption { display:flex; align-items:center; justify-content:space-between; gap:12px; line-height:1.6; }
.art-detail-layout .art-enlarge { font-size:11px; flex-shrink:0; }
.art-detail .art-detail-story { padding:24px 0; }
.art-detail .art-detail-phrase { font-size:clamp(23px,2.4vw,31px); line-height:1.5; font-weight:400; margin-bottom:32px; }
.art-detail-phrase::after { content:""; display:block; width:46px; height:1px; background:#a6835e; margin-top:26px; }
.art-reflections { font-size:16px; line-height:1.9; }
.art-reflections p:last-child { margin-bottom:24px; }
.art-reading-note { max-width:44ch; opacity:.85; }
.art-detail-print { gap:56px; padding:32px 0; margin:48px 0 32px; align-items:center; }
.art-detail-print p { font-size:14px; max-width:47ch; }
.art-detail-print p.small { font-size:12px; }
.art-detail-ai { gap:56px; padding:36px; margin:32px 0 44px; background:#fffdf780; border:1px solid #d5cbb978; border-radius:3px; }
.art-detail-ai img { max-width:340px; box-shadow:0 8px 24px #46351d12; }
.art-detail-ai h2 { font-size:32px; }
.art-detail-ai .art-edition-credit { color:var(--ink); font-size:13px; }
.art-detail-ai p { font-size:15px; }
.art-detail-ai p.small { font-size:12px; }
.edition-details { margin:22px 0 6px; font-size:12px; color:var(--muted); }
.edition-details summary { cursor:pointer; padding:10px 0; min-height:40px; }
.art-detail-navigation { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:28px; padding:28px 0; }
.art-detail-navigation a { text-decoration:none; display:flex; flex-direction:column; min-height:48px; justify-content:center; }
.art-detail-navigation a:last-child { text-align:right; }
.art-detail-navigation span { font-size:9px; letter-spacing:.15em; color:var(--muted); }
.art-detail-navigation strong { font:400 24px/1.5 Georgia,serif; margin-top:6px; }
.art-detail-navigation .return-gallery { font-size:12px; text-decoration:underline; }
#original,#print,#ai-edition { scroll-margin-top:24px; }
article.art-credits { display:grid; grid-template-columns:.85fr 1.3fr; gap:80px; max-width:none; margin:54px 0 72px; }
.art-credits-lead h1 { font:400 clamp(44px,5vw,64px)/1.1 Georgia,serif; margin:20px 0; letter-spacing:-.035em; }
.art-credits-lead > p { font:400 21px/1.7 Georgia,serif; color:var(--muted); }
.art-credits-lead .text-link { display:inline-block; min-height:44px; margin-top:16px; font-size:13px; }
.art-credits-body { border-left:1px solid var(--line); padding-left:42px; }
.art-credits-body h2 { margin:0 0 24px; font-size:28px; }
.art-credits-body h2:not(:first-child) { padding-top:30px; border-top:1px solid var(--line); margin-top:32px; }
.art-credits-body p { color:var(--muted); font-size:15px; line-height:1.85; }
.art-credits-body ul { list-style:none; padding:0; margin:24px 0; }
.art-credits-body li { padding:14px 0; border-top:1px solid var(--line); font-size:14px; line-height:1.8; }
@media(max-width:900px) {
  .portfolio-intro { gap:32px; }
  .portfolio-intro-copy { padding-left:24px; }
  article.art-credits { gap:36px; }
  .art-credits-body { padding-left:28px; }
}
@media(max-width:800px) {
  .art-detail-layout { grid-template-columns:1fr; gap:28px; }
  .art-detail .art-detail-story { padding:0; max-width:620px; margin:auto; }
  .art-detail-print,.art-detail-ai { grid-template-columns:1fr; gap:24px; }
  .art-detail-ai { padding:28px; }
  .art-detail-ai > div { max-width:540px; width:100%; margin:auto; }
}
@media(max-width:600px) {
  .art-subnav { align-items:flex-start; gap:6px; padding:10px 0; }
  .art-subnav nav { gap:12px; font-size:11px; }
  .art-subnav .art-home { font-size:11px; flex-shrink:0; }
  .art-home-long { display:none; }
  .art-home-short { display:inline; }
  .art-subnav nav a { white-space:nowrap; }
  .portfolio-intro { grid-template-columns:1fr; gap:18px; padding:24px 0; }
  .portfolio-intro h1 { font-size:clamp(43px,11vw,58px); margin:12px 0 0; }
  .portfolio-intro-copy { padding:0; border:0; justify-self:start; }
  .portfolio-intro-copy p { font-size:19px; line-height:1.55; margin-bottom:12px; }
  .gallery-threshold { margin-bottom:22px; gap:12px; }
  .gallery-threshold span:first-child { font-size:9px; letter-spacing:.1em; white-space:nowrap; }
  .gallery-threshold span:last-child { font-size:14px; }
  .portfolio-closing { grid-template-columns:1fr; gap:8px; padding-top:28px; }
  .portfolio-closing h2 { max-width:none; font-size:34px; }
  .art-detail-trail > div { gap:8px; }
  .art-detail-trail > div a { width:38px; height:38px; }
  .art-detail-heading { padding:12px 0 22px; }
  .art-detail .art-detail-heading h1 { font-size:42px; }
  .art-section-links { font-size:11px; gap:4px 18px; }
  .art-detail-layout figcaption { flex-direction:column; align-items:flex-start; gap:2px; }
  .art-detail-layout .art-enlarge { display:inline-flex; align-items:center; min-height:36px; }
  .art-detail-print { margin-top:32px; }
  .art-detail-ai { padding:22px; }
  .art-detail-navigation { gap:12px; grid-template-columns:1fr 1fr; }
  .art-detail-navigation strong { font-size:21px; }
  .art-detail-navigation .return-gallery { grid-column:1/-1; grid-row:2; text-align:center; align-items:center; }
  article.art-credits { grid-template-columns:1fr; gap:30px; margin:30px 0 48px; }
  .art-credits-lead h1 { font-size:46px; }
  .art-credits-lead > p { font-size:20px; }
  .art-credits-lead .text-link { margin-top:0; }
  .art-credits-body { border-left:0; border-top:1px solid var(--line); padding:28px 0 0; }
}

/* Matching original and refined indexes, with a visible edition switch. */
.art-edition-switch { display:flex; flex-wrap:wrap; gap:24px; font-size:13px; }
.art-edition-switch a { display:inline-flex; align-items:center; min-height:44px; text-decoration:none; }
.art-edition-switch a[aria-current="page"] { box-shadow:inset 0 -2px var(--orange); color:var(--ink); }
.gallery-threshold span.art-count { font:400 10px/1.5 system-ui,sans-serif; letter-spacing:.14em; color:var(--muted); white-space:nowrap; }
.art-index .refined-frame .art-window { background:#f5f0e4; }
.art-preparation-note { color:var(--muted); font-size:12px; line-height:1.7; max-width:65ch; }
@media(max-width:600px) {
  .art-edition-switch { gap:16px; font-size:12px; }
  .gallery-threshold { padding:8px 0; }
  .gallery-threshold span.art-count { font-size:9px; letter-spacing:.05em; }
}

/* A display-only print layout: original pixels and downloads remain untouched. */
.art-index .original-print-paper { box-sizing:border-box; display:grid; grid-template-rows:minmax(0,1fr) auto; gap:10px; width:100%; height:100%; min-height:0; padding:10px 10px 12px; background:#f5f0e4; border:1px solid var(--fillet); box-shadow:0 0 0 3px var(--mat),0 0 0 4px var(--fillet); }
.original-print-image { min-height:0; min-width:0; display:grid; place-items:center; }
.art-index .original-print-image img { width:100%; height:100%; min-height:0; object-fit:contain; }
.original-print-caption { text-align:center; color:#332b23; }
.art-index .original-print-caption h2 { font:400 12px/1.35 "Times New Roman",Georgia,serif; text-transform:uppercase; letter-spacing:.19em; margin:0 0 8px; overflow-wrap:anywhere; }
.art-index .original-print-caption p { font:italic 11px/1.45 "Times New Roman",Georgia,serif; margin:0 0 10px; color:#443a30; }
.original-print-caption span { display:block; font:400 6px/1.5 "Times New Roman",Georgia,serif; letter-spacing:.16em; text-transform:uppercase; }

/* Keep cultural credits separate from the two personal art collections. */
.art-credits-collection { grid-column:1/-1; border-top:1px solid var(--line); padding-top:30px; }
.art-credits-collection h2 { font:400 30px/1.25 Georgia,serif; margin:0 0 14px; }
.art-credits-collection > p { color:var(--muted); font-size:15px; line-height:1.8; margin:0 0 24px; }
.art-credits-collection ul { display:grid; grid-template-columns:1fr 1fr; gap:36px; list-style:none; margin:0; padding:0; }
.art-credits-collection li { color:var(--muted); font-size:14px; line-height:1.85; padding:18px 0; border-top:1px solid var(--line); }
.art-credits-collection li a { color:var(--ink); font:400 22px/1.5 Georgia,serif; text-underline-offset:5px; }
@media(max-width:600px) { .art-credits-collection ul { grid-template-columns:1fr; gap:8px; } }

/* Embedded prints use the whole column: wood and cloth, without a second wall box. */
.reference-artwork[data-home-art], .invitation .author-artwork[data-home-art] { width:320px; max-width:100%; padding:0; border:0; background:transparent; }
[data-home-art] > a.art-wall { --frame-size:7px; --mat-size:12px; display:grid; padding:0; min-height:0; height:auto; border:0; background:transparent; box-shadow:none; }
[data-home-art] .art-frame { width:100%; }
[data-home-art] figcaption { margin-top:16px; }

.original-art-disclosure { border-block:1px solid var(--line); padding:20px 0; margin:28px 0; }
.original-art-disclosure > summary { cursor:pointer; padding:8px 0; font:400 23px/1.5 Georgia,serif; }
.original-art-disclosure > figure { width:100%; max-width:480px; margin:28px auto; }
.original-art-disclosure .art-detail-print { border:0; margin:16px 0; padding:16px 0; }
#original-image,#refined-download { scroll-margin-top:24px; }

/* One primary navigation replaces the art breadcrumb rows. */
.site-header { flex-wrap:nowrap; gap:24px; }
.site-navigation { gap:22px; align-items:center; }
.site-navigation a { white-space:nowrap; }
.site-navigation a[aria-current="page"] { color:var(--orange); text-decoration:underline; text-underline-offset:7px; }
.menu-toggle { display:none; }
@media(max-width:960px) {
  .site-header { flex-wrap:wrap; gap:12px; }
  .site-header .brand { flex:1; }
  .site-header .menu-toggle { display:inline-flex; align-items:center; justify-content:center; gap:9px; min-width:88px; min-height:44px; margin:0; padding:8px 12px; background:transparent; color:var(--ink); border:1px solid var(--line); border-radius:4px; }
  .menu-icon { width:16px; height:12px; border-block:1.5px solid currentColor; position:relative; }
  .menu-icon:after { content:""; position:absolute; top:4px; left:0; width:16px; border-top:1.5px solid currentColor; }
  .site-header .site-navigation { flex:1 0 100%; display:grid; grid-template-columns:1fr 1fr; gap:4px 16px; padding:12px 0; border-top:1px solid var(--line); }
  .site-header.has-menu .menu-toggle[aria-expanded="false"] + .site-navigation { display:none; }
  .site-header .site-navigation a { padding:8px 12px; min-height:44px; font-size:14px; border-radius:3px; }
  .site-navigation a[aria-current="page"] { background:#e9ecdf; text-decoration:none; }
}

/* Keep the language return action beside its label, rather than on a separate row. */
.language-label { display:flex; align-items:center; gap:8px; margin-top:10px; }
.language-label .language-back { display:inline-flex; align-items:center; justify-content:center; flex:0 0 44px; min-height:44px; margin:0; font:400 24px/1 system-ui,sans-serif; text-decoration:none; border-radius:50%; }
.language-label .language-back:hover { background:#e9ecdf; }

.copyable-style { display:flow-root; }
.copyable-style [data-copy-style] { float:right; min-height:44px; margin:0 0 8px 12px; }
.copyable-style pre { clear:both; margin-top:0; }
.style-copy-status:empty { display:none; }

/* A uniform gallery: equal frames, equal openings and continuous rows. */
.art-index .portfolio-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:40px 28px; }
.art-index .portfolio-row { display:contents; }
.art-index .portfolio-card .refined-frame .art-window { width:100%; height:100%; }
.art-index .portfolio-card .refined-frame .art-window img { width:100%; height:100%; max-height:100%; aspect-ratio:auto; object-fit:contain; }
@media(max-width:900px) { .art-index .portfolio-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:36px 24px; } }
@media(max-width:600px) { .art-index .portfolio-grid { grid-template-columns:1fr; gap:38px; } }

.portfolio-closing .art-preparation-note { font-size:11px; line-height:1.6; margin-top:20px; color:var(--muted); }

/* Screen captions use live type, rather than shrinking the print's raster lettering. */
.screen-print-paper { box-sizing:border-box; display:grid; grid-template-rows:minmax(0,1fr) auto; width:100%; height:100%; min-height:0; padding:8px; background:#f7f1e5; border:1px solid var(--fillet); box-shadow:0 0 0 3px var(--mat),0 0 0 4px var(--fillet); }
.screen-art-space { display:grid; place-items:center; min-height:0; min-width:0; container-type:size; }
.screen-art-crop { position:relative; overflow:hidden; width:min(100cqw,calc(100cqh * var(--crop-ratio))); aspect-ratio:var(--crop-ratio); }
.art-frame .screen-art-crop img { position:absolute; inset:0 auto auto 0; display:block; width:100%; height:auto; max-height:none; aspect-ratio:var(--source-ratio); border-radius:0; object-fit:contain; }
.screen-print-caption { text-align:center; color:#302b23; padding:14px 6px 4px; }
.art-frame .screen-print-caption h2 { font:400 19px/1.2 Georgia,"Times New Roman",serif; text-transform:uppercase; letter-spacing:.09em; margin:0 0 9px; overflow-wrap:anywhere; }
.art-frame .screen-print-caption p { font:italic 16px/1.45 Georgia,"Times New Roman",serif; margin:0 auto 10px; color:#302b23; max-width:32ch; text-wrap:pretty; }
.screen-print-caption span { display:block; font:400 10px/1.4 Georgia,serif; letter-spacing:.06em; }
.art-index .art-frame { width:340px; aspect-ratio:2 / 3; }
.art-index .portfolio-card > a.art-wall:has(.art-frame) { padding:18px 12px 26px; }
.art-index .portfolio-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px 24px; }
@media(max-width:1100px) { .art-index .portfolio-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:720px) { .art-index .portfolio-grid { grid-template-columns:1fr; max-width:390px; margin-inline:auto; } }
@media(max-width:380px) { .art-frame .screen-print-caption h2 { font-size:17px; } .art-frame .screen-print-caption p { font-size:15px; } }
/* Match the readable typography on the optional original-art index. */
.art-index .original-print-caption h2 { font-size:19px; letter-spacing:.09em; }
.art-index .original-print-caption p { font-size:16px; line-height:1.45; }
.original-print-caption span { font-size:10px; letter-spacing:.06em; }

/* The original poem has its own calm reading page and source attribution. */
.original-poem-page { max-width:1060px; margin:42px auto 64px; }
.original-poem-heading { max-width:820px; padding-bottom:28px; border-bottom:1px solid var(--line); }
.original-poem-heading h1 { font:400 clamp(28px,3.2vw,43px)/1.65 Georgia,"Noto Sans",serif; letter-spacing:0; margin:16px 0 10px; }
.original-poem-byline { font-size:15px; margin:0 0 18px; }
.original-poem-intro { max-width:60ch; color:var(--muted); font:italic 19px/1.7 Georgia,serif; }
.original-poem-layout { display:grid; grid-template-columns:minmax(0,1fr) 290px; gap:64px; padding-top:32px; }
.original-poem-text pre { margin:0; padding:0; border:0; border-radius:0; background:transparent; white-space:pre-wrap; overflow-wrap:anywhere; }
.original-poem-text code { font:400 19px/2.15 Georgia,"Noto Sans",serif; }
.original-poem-attribution { color:var(--muted); font-size:14px; line-height:1.85; }
.original-poem-attribution > p:first-child { margin-top:0; }
.original-poem-attribution h2 { font:400 23px/1.3 Georgia,serif; margin-top:26px; color:var(--ink); }
.original-poem-next { align-items:center; flex-wrap:wrap; gap:20px; margin-top:32px; padding-top:24px; border-top:1px solid var(--line); }
@media(max-width:760px) { .original-poem-layout { grid-template-columns:1fr; gap:32px; } .original-poem-attribution { padding-top:24px; border-top:1px solid var(--line); } .original-poem-text code { font-size:18px; } }
