/* Roosevelt: a quiet essay with a distinct photographic masthead. */
.long-view .horizon-intro{align-items:center;gap:24px;padding-top:25px;margin-bottom:29px}
.long-view .horizon-intro-copy{font-family:var(--serif);font-size:clamp(28px,3vw,42px);line-height:1.15;letter-spacing:-.6px;max-width:780px}
.long-view .horizon-intro>.tiny-label{font-size:6px;letter-spacing:1.2px;margin-top:0;line-height:1.8}
.horizon-panel.arena-panel{position:relative;isolation:isolate;display:block;min-height:0;aspect-ratio:auto;background:#090909;border-radius:12px;overflow:hidden;color:#fff}
.arena-panel .horizon-art{position:absolute;inset:0 0 auto auto;width:31%;height:170px;margin:0;transform:none;transition:none;will-change:auto;opacity:.85;z-index:0}
.arena-panel .horizon-art img{width:100%;height:100%;object-fit:cover;object-position:80% 45%;filter:none}
.arena-panel .horizon-overlay{position:absolute;inset:0 0 auto auto;width:34%;height:175px;background:linear-gradient(90deg,#090909,transparent 55%),linear-gradient(0deg,#090909,transparent 75%);z-index:1}
.arena-panel .arena-content{position:relative;z-index:2;display:block;width:100%;max-width:none;min-height:0;padding:35px 42px 22px}
.arena-panel .arena-kicker{font-size:6px;letter-spacing:1.7px;color:#aaa59a;margin:0;line-height:1.8}
.arena-panel .arena-content h2{font-family:var(--serif);font-size:48px;font-weight:400;line-height:1.07;letter-spacing:-1px;max-width:72%;margin:15px 0 29px;color:#fff}
.arena-panel .arena-content h2 em{color:#edbd57}
.arena-panel .arena-quotation{margin:0;max-width:none;width:100%;padding-top:24px;border-top:1px solid #ffffff25}
.arena-panel .arena-quotation blockquote{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:44px;columns:auto;column-rule:0;margin:0;padding:0;border:0}
.arena-panel .arena-quotation blockquote p{font-family:var(--serif);font-size:20px;line-height:1.55;letter-spacing:0;color:#e0dcd3;margin:0;max-width:none}
.arena-panel .arena-quotation figcaption{display:flex;flex-direction:row;align-items:center;flex-wrap:wrap;gap:10px 22px;margin:25px 0 0;padding-top:19px;border-top:1px solid #ffffff25}
.arena-panel .arena-author{font-family:var(--sans);font-size:7px;letter-spacing:1.4px;line-height:1.7;color:#d8b365}
.arena-panel .arena-quotation cite{font-family:var(--serif);font-size:16px;line-height:1.5;color:#b7b1a5;text-align:left}
.arena-panel .arena-date{font-size:5px;letter-spacing:1px;line-height:1.8;color:#99938a;margin-left:auto;text-align:right}
.arena-panel .arena-footer{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;margin-top:17px;padding:0;border:0;width:100%}
.arena-panel .arena-footer .tiny-label{font-size:4px;letter-spacing:1px;line-height:1.8;color:#8f8a81}
.arena-panel .arena-footer a{display:flex;align-items:center;gap:14px;font-size:8px;line-height:1.8;color:#d0c8b9;min-height:32px}
.arena-panel .arena-footer a:hover{color:#edbd57}
.arena-panel .arena-footer a>span[aria-hidden]{font-size:17px}
@media(max-width:1000px){.arena-panel .arena-content{padding:30px}.arena-panel .arena-content h2{font-size:42px}.arena-panel .arena-quotation blockquote{gap:28px}.arena-panel .arena-quotation blockquote p{font-size:19px}.arena-panel .arena-date{margin-left:0}}
@media(max-width:600px){.long-view{padding-top:38px}.long-view .horizon-intro{display:flex;flex-direction:column-reverse;align-items:flex-start;gap:13px;padding-top:22px;margin-bottom:24px}.long-view .horizon-intro-copy{font-size:30px;max-width:300px}.long-view .horizon-intro>.tiny-label{font-size:5px;margin:0}.arena-panel .arena-content{padding:27px 24px 20px}.arena-panel .arena-content h2{font-size:39px;max-width:95%;margin-bottom:25px}.arena-panel .horizon-art{width:45%;height:140px;opacity:.35}.arena-panel .horizon-overlay{width:50%;height:145px}.arena-panel .arena-quotation{padding-top:21px}.arena-panel .arena-quotation blockquote{display:block}.arena-panel .arena-quotation blockquote p{font-size:19px;line-height:1.5;margin-bottom:17px}.arena-panel .arena-quotation blockquote p:last-child{margin-bottom:0}.arena-panel .arena-quotation figcaption{flex-direction:column;align-items:flex-start;gap:7px;margin-top:22px}.arena-panel .arena-date{text-align:left;margin:0}}

/* One uninterrupted passage, followed by a prominent author signature. */
.arena-panel .arena-quotation blockquote{display:block;columns:auto}
.arena-panel .arena-quotation blockquote p{max-width:none;margin:0;font-size:clamp(19px,1.8vw,24px);line-height:1.52}
.arena-panel .arena-quotation figcaption{gap:14px 25px;padding-top:22px;margin-top:25px}
.arena-panel .arena-author{font-family:var(--serif);font-size:27px;letter-spacing:.2px;font-weight:500;line-height:1.2;color:#edbd57;text-transform:none}
@media(max-width:600px){.arena-panel .arena-quotation blockquote p{font-size:20px;line-height:1.5}.arena-panel .arena-author{font-size:26px}.arena-panel .arena-quotation figcaption{gap:10px}}

/* A full photographic setting, replacing the small image in the masthead. */
.long-view{padding-top:26px}
.long-view .horizon-intro{border-top:0;padding-top:0;margin-bottom:24px}
.long-view .horizon-intro-copy{font-family:var(--sans);font-size:15px;letter-spacing:-.3px;line-height:1.5;color:#777}
.arena-panel .horizon-art{position:absolute;inset:0;width:100%;height:100%;opacity:1;z-index:0}
.arena-panel .horizon-art img{width:100%;height:100%;object-fit:cover;object-position:72% center;filter:none}
.arena-panel .horizon-overlay{position:absolute;inset:0;width:100%;height:100%;z-index:1;background:linear-gradient(90deg,#050505eb 0%,#050505af 48%,#05050540 100%),linear-gradient(0deg,#050505db 0%,#05050599 55%,#05050500 100%)}
.arena-panel .arena-content{padding:43px 45px 26px}
.arena-panel .arena-content h2{font-size:clamp(49px,5.1vw,77px);line-height:1.02;max-width:740px;margin:24px 0 35px}
.arena-panel .arena-quotation{padding-top:25px;border-color:#ffffff38}
.arena-panel .arena-quotation blockquote p{font-size:clamp(20px,1.8vw,25px);line-height:1.52;color:#f0ece3;text-shadow:0 1px 14px #0008}
.arena-panel .arena-quotation figcaption{border-color:#ffffff38}
.arena-panel .arena-author{color:#edbd57;font-size:29px}
.arena-panel .arena-quotation cite{color:#d4cabb}
.arena-panel .arena-date,.arena-panel .arena-footer .tiny-label{color:#bcb4a8}
@media(max-width:1000px){.arena-panel .arena-content{padding:35px 32px 25px}.arena-panel .horizon-art img{object-position:68% center}}
@media(max-width:600px){.long-view{padding-top:25px}.long-view .horizon-intro{gap:10px;margin-bottom:21px}.long-view .horizon-intro-copy{font-size:14px;max-width:none}.arena-panel .arena-content{padding:29px 24px 23px}.arena-panel .arena-content h2{font-size:43px;margin:21px 0 28px;max-width:none}.arena-panel .horizon-art{inset:0;width:100%;height:100%;opacity:1}.arena-panel .horizon-art img{object-position:72% center}.arena-panel .horizon-overlay{inset:0;width:100%;height:100%;background:linear-gradient(90deg,#050505d9,#05050596),linear-gradient(0deg,#050505d9,#05050500)}.arena-panel .arena-quotation blockquote p{font-size:20px;line-height:1.5}.arena-panel .arena-author{font-size:27px}}

/* An on-demand native audio control, paired with the original speech link. */
.arena-actions{display:flex;align-items:center;gap:25px;flex-wrap:wrap}
.arena-panel .arena-audio-button{display:inline-flex;align-items:center;gap:11px;min-height:42px;padding:10px 15px;background:#ffffff0a;border:1px solid #d8b36575;border-radius:2px;color:#edcf8e;font-family:var(--sans);font-size:10px;line-height:1.5;letter-spacing:.3px;transition:background .25s,border-color .25s}
.arena-panel .arena-audio-button:hover{background:#d8b36520;border-color:#d8b365}
.arena-panel .arena-audio-button:disabled{cursor:wait;opacity:.7}
.arena-audio-icon{font-size:10px;width:12px;display:inline-block;text-align:center}
.arena-audio-bars{display:flex;align-items:center;gap:2px;height:15px;margin-left:5px}
.arena-audio-bars i{display:block;width:2px;height:5px;background:currentColor;transform-origin:center}
.arena-audio-bars i:nth-child(2){height:11px}.arena-audio-bars i:nth-child(3){height:7px}
.is-playing .arena-audio-bars i{animation:audio-wave .8s ease-in-out infinite alternate}
.is-playing .arena-audio-bars i:nth-child(2){animation-delay:-.3s}.is-playing .arena-audio-bars i:nth-child(3){animation-delay:-.5s}
@keyframes audio-wave{from{transform:scaleY(.45)}to{transform:scaleY(1.35)}}
@media(max-width:600px){.arena-actions{width:100%;justify-content:space-between;gap:14px}.arena-panel .arena-audio-button{font-size:10px;min-height:44px}.arena-panel .arena-footer{gap:16px}}
@media(prefers-reduced-motion:reduce){.is-playing .arena-audio-bars i{animation:none}.arena-panel .arena-audio-button{transition:none}}

/* Readable footer and provenance at normal viewing distance. */
.arena-panel .arena-footer .tiny-label{font-size:10px;letter-spacing:1.15px;line-height:1.7}
.arena-panel .arena-date{font-size:10px;letter-spacing:.8px;line-height:1.8}
.arena-panel .arena-footer a{font-size:12px;min-height:44px;gap:14px}
.arena-panel .arena-audio-button{font-size:12px;min-height:44px;padding:11px 16px}
.arena-panel .arena-footer{gap:20px;margin-top:22px}
@media(max-width:600px){.arena-panel .arena-footer .tiny-label{font-size:9px}.arena-panel .arena-date{font-size:9px;letter-spacing:.5px}.arena-panel .arena-footer a,.arena-panel .arena-audio-button{font-size:11px}.arena-actions{gap:12px}}

/* On phones only the passage scrolls; attribution and audio actions remain outside it. */
@media(max-width:600px){
 .arena-panel .arena-content{max-height:none;overflow:visible;padding:25px 21px 22px}
 .arena-panel .arena-quotation blockquote{max-height:clamp(160px,29svh,250px);overflow-y:auto;overflow-x:hidden;padding-right:12px;scrollbar-width:thin;scrollbar-color:#d0aa59 #ffffff12;-webkit-overflow-scrolling:touch}
 .arena-panel .arena-content h2{font-size:39px;max-width:none;margin:17px 0 22px;line-height:1.04}
 .arena-panel .arena-quotation{padding-top:20px}
 .arena-panel .arena-quotation blockquote p{font-size:18px;line-height:1.55}
 .arena-panel .arena-quotation figcaption{margin-top:21px;padding-top:18px}
 .arena-panel .arena-quotation blockquote::-webkit-scrollbar{width:4px}
 .arena-panel .arena-quotation blockquote::-webkit-scrollbar-track{background:#ffffff12}
 .arena-panel .arena-quotation blockquote::-webkit-scrollbar-thumb{background:#d0aa59;border-radius:4px}
}
