/* ==========================================================================
   LEDGERA UI layer — loaded last on every page (see tools/build.py).
   Brand: editorial red #DF1237 · ink #070707 · paper #F2EEE6 · gray #96928E
   Type:  Bebas Neue (mastheads) · Playfair Display (headlines, deks)
          Arial/Helvetica (reading UI) · DM Mono (metadata only, never < 11px)
   ========================================================================== */
:root{
  --red:#DF1237;
  --red-deep:#B50E2C;
  --ink:#070707;
  --night:#121110;
  --paper:#F2EEE6;
  --paper-2:#E9E3D8;
  --gray:#96928E;
  --muted:#5f5b55;
  --line:#d9d3c7;
  --darkline:#2b2a27;
  --gutter:clamp(16px,4vw,64px);
  --max:1440px;
  --measure:68ch;
  --mono:'DM Mono',ui-monospace,Menlo,monospace;
  --serif:'Playfair Display',Georgia,'Times New Roman',serif;
  --display:'Bebas Neue','Arial Narrow',Impact,sans-serif;
  --sans:Arial,Helvetica,sans-serif;
  --ease:cubic-bezier(.2,.7,.2,1);
}

/* ---------- Base ---------------------------------------------------------- */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{font-size:16px;line-height:1.5;color:var(--ink);background:var(--paper)}
img{height:auto}
img[width][height]{max-width:100%}
::selection{background:var(--red);color:#fff}
a{text-underline-offset:3px}
:where(a,button,input,select,summary,[tabindex]):focus-visible{outline:2px solid var(--red);outline-offset:3px}
.skip-link{position:absolute;left:12px;top:-60px;z-index:200;background:var(--red);color:#fff;padding:12px 16px;font:500 12px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;text-decoration:none;transition:top .15s}
.skip-link:focus{top:12px}
.image-error{opacity:0}
.newsletter-honeypot{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important}

/* Metadata: one legible floor for every mono label on the site */
.eyebrow,.kicker,.meta,.byline,.photo-count,.footer-kicker,.home-section-label span,.home-section-label p,
.face-card-copy p,.face-card-copy>span,.issue-meta>span,.press-visual-grid figcaption,.sports-hero-media figcaption,
.section-title p,.archive-stat span{font-family:var(--mono);font-weight:500;font-size:11px;line-height:1.5;letter-spacing:.12em}

/* ---------- Strap -------------------------------------------------------- */
.topline{height:30px;background:var(--red);color:#fff}
.ticker-track{max-width:none;font:500 11px/1 var(--mono);letter-spacing:.16em}
@media(max-width:760px){.topline{height:26px}.ticker-track{justify-content:center}.ticker-track span:not(:first-child){display:none}}

/* ---------- Header ------------------------------------------------------- */
html .site-header{position:sticky;top:0;z-index:60;background:rgba(7,7,7,.97);-webkit-backdrop-filter:saturate(1.4) blur(12px);backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--darkline);color:#fff}
html .site-header .mast{height:78px;padding:0 var(--gutter);display:flex;align-items:center;justify-content:space-between;gap:20px;transition:height .25s var(--ease)}
html .site-header .brand-original{width:auto;max-width:none;flex:none;display:block;line-height:0}
html .site-header .brand-original img{display:block;height:56px;width:auto;transition:height .25s var(--ease)}
html .site-header.is-compact .mast{height:58px}
html .site-header.is-compact .brand-original img{height:40px}
.mast-actions{display:flex;align-items:center;gap:10px}
.mast-cta{display:inline-flex;align-items:center;min-height:38px;padding:0 14px;border:1px solid #3a3935;color:#f2eee6;text-decoration:none;font:500 11px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;transition:border-color .2s,color .2s}
.mast-cta:hover{border-color:var(--red);color:#fff}
html .site-header .nav-more{position:static;display:inline-flex;align-items:center;gap:10px;min-height:38px;margin:0;padding:0 14px!important;border:1px solid var(--red);background:var(--red)!important;color:#fff;font:500 11px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;box-shadow:none}
html .site-header .nav-more:before{display:none}
html .site-header .nav-more:hover{background:var(--red-deep)!important;border-color:var(--red-deep)}
.nav-more-icon{display:inline-grid;gap:4px;width:16px}
.nav-more-icon i{display:block;height:2px;background:currentColor}
.nav-more-icon i:last-child{width:70%}

html .site-nav{position:relative;height:46px;display:flex;align-items:center;gap:0;padding:0 var(--gutter);background:var(--ink);border-top:1px solid #1c1b19;overflow-x:auto;scrollbar-width:none;white-space:nowrap}
html .site-nav::-webkit-scrollbar{display:none}
html .site-nav a{position:relative;flex:none;display:flex;align-items:center;height:46px;min-height:0;padding:0 14px;color:#cfcac2;text-decoration:none;font:500 11px/1 var(--mono);letter-spacing:.13em;text-transform:uppercase;transition:color .15s}
html .site-nav a:first-child{padding-left:0}
html .site-nav a:hover{color:#fff}
html .site-nav a.is-active{color:#fff}
html .site-nav a.is-active:after{content:"";position:absolute;left:14px;right:14px;bottom:0;height:2px;background:var(--red)}
html .site-nav a.is-active:first-child:after{left:0}
@media(max-width:760px){
  html .site-header .mast{height:60px;padding:0 16px}
  html .site-header .brand-original img{height:40px}
  html .site-header.is-compact .mast{height:52px}
  html .site-header.is-compact .brand-original img{height:34px}
  .mast-cta{display:none}
  html .site-nav{padding:0 16px;height:44px;-webkit-mask-image:linear-gradient(90deg,#000 85%,transparent);mask-image:linear-gradient(90deg,#000 85%,transparent)}
  html .site-nav a{height:44px;padding:0 12px}
  html .site-nav a:last-child{padding-right:40px}
}

/* ---------- Menu drawer -------------------------------------------------- */
.nav-drawer{position:fixed;inset:0;z-index:120;display:block;visibility:hidden;opacity:0;background:var(--ink);color:#fff;padding:clamp(24px,4vw,56px) var(--gutter) 48px;overflow:auto;transition:opacity .2s var(--ease),visibility 0s linear .2s}
.nav-drawer.is-open{visibility:visible;opacity:1;transition:opacity .2s var(--ease)}
.nav-drawer-top{max-width:var(--max);margin:0 auto 36px;display:flex;align-items:center;justify-content:space-between;padding-bottom:18px;border-bottom:1px solid var(--darkline)}
.nav-drawer-top b{font:500 11px var(--mono);letter-spacing:.16em;color:var(--gray)}
.nav-drawer-close{background:none;border:1px solid #4a4944;color:#fff;min-height:40px;padding:0 16px;font:500 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.nav-drawer-close:hover{border-color:var(--red)}
.nav-drawer-grid{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 clamp(24px,4vw,64px)}
.drawer-group h2{margin:0 0 6px;font:500 11px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--red)}
.nav-drawer .drawer-group a{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid #1f1e1c;text-decoration:none;color:#f2eee6;font:400 clamp(30px,3.2vw,46px)/1 var(--display);letter-spacing:.01em;transition:color .15s}
.nav-drawer .drawer-group a small{font:500 11px var(--mono);letter-spacing:.1em;color:#77736d;text-transform:uppercase}
.nav-drawer .drawer-group a:hover{color:var(--red)}
.nav-drawer-parent{display:inline-block;max-width:var(--max);margin:36px auto 0;color:var(--gray);font:500 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;text-decoration:none}
.nav-drawer-parent:hover{color:#fff}
@media(max-width:900px){.nav-drawer-grid{grid-template-columns:1fr 1fr}.drawer-group:last-child{grid-column:1/-1}}
@media(max-width:560px){.nav-drawer-grid{grid-template-columns:1fr;gap:28px}.nav-drawer .drawer-group a{font-size:34px;padding:10px 0}}

/* ---------- Buttons & links ---------------------------------------------- */
.pill{min-height:46px;padding:0 20px;font:500 11px/1 var(--mono);letter-spacing:.13em;transition:background .2s,color .2s,border-color .2s}
.pill:hover{opacity:1;background:var(--ink);color:#fff;border-color:var(--ink)}
.pill.red:hover{background:var(--red-deep);border-color:var(--red-deep)}
.issue-reader-page .pill:hover,.home-issues3 .pill:hover,.after-dark-page .pill:hover,.ledgera-sensual .home-hero3 .pill:not(.red):hover{background:#fff;color:var(--ink);border-color:#fff}
.read,.arrow-link,.text-link{font:500 11px/1.2 var(--mono);letter-spacing:.13em;padding-bottom:5px;transition:color .15s,border-color .15s}
.read:hover,.arrow-link:hover,.text-link:hover{opacity:1;color:var(--red)}

/* ---------- Page heads --------------------------------------------------- */
.page-intro,.cathero{padding-top:clamp(56px,7vw,104px);padding-bottom:clamp(40px,5vw,72px)}
.page-intro h1,.cathero h1{letter-spacing:-.05em;text-wrap:balance}
.page-intro p,.cathero p{max-width:44ch;color:var(--muted)}
.article-hero h1{text-wrap:balance}
.article-hero .dek{color:var(--muted);text-wrap:pretty}

/* ---------- Story grids -------------------------------------------------- */
.story>img,.archive-item>img,.dispatch>img{display:block;width:100%;aspect-ratio:3/2!important;height:auto;object-fit:cover;margin:0 0 20px!important;background:var(--paper-2)}
.story h3,.archive-item h3,.dispatch h3{text-wrap:balance;transition:color .15s}
.story:hover h3,.archive-item:hover h3,.dispatch:hover h3{color:var(--red)}
.story p,.archive-item p,.dispatch p{font-size:15px;line-height:1.6;color:var(--muted)}
.story .meta,.archive-item .meta,.dispatch .meta{color:var(--red)}
/* whole card is clickable when it holds a single link */
.story,.archive-item,.dispatch{position:relative}
.story .read:after,.archive-item .read:after,.dispatch .read:after{content:"";position:absolute;inset:0}

/* ---------- Articles ----------------------------------------------------- */
.body{max-width:calc(var(--measure) + 2 * var(--gutter))}
.body p{font-size:clamp(18px,1.25vw,20px);line-height:1.72;color:#1b1a18}
.body h2,.body h3{font:600 clamp(26px,2.4vw,34px)/1.12 var(--serif);letter-spacing:-.02em;margin:48px 0 16px;text-wrap:balance}
.body blockquote{margin:40px 0;padding:0 0 0 22px;border-left:3px solid var(--red);font:italic 600 clamp(22px,2vw,28px)/1.35 var(--serif)}
.body img{display:block;width:100%;height:auto;margin:32px 0 8px}
.body figure{margin:36px 0}
.body figcaption{font:500 11px/1.5 var(--mono);letter-spacing:.08em;color:var(--muted)}
.body p strong{font-size:.78em;letter-spacing:.1em}
.source-note{font-size:15px!important}
.tags span,.reader-tags span,.model-facts span{font:500 11px var(--mono);letter-spacing:.1em;padding:9px 11px}
.sports-hero-media figcaption{color:var(--muted)}

/* ---------- Home ------------------------------------------------------- */
.home-section-label{grid-template-columns:auto 1fr;column-gap:24px}
.home-section-label p{grid-column:1/-1}
.home-feed3-item{position:relative;transition:background .15s}
.home-feed3-item .n{color:var(--gray)}
.home-face3 img,.face-card-media img,.portfolio-shot img,.home-issue3 img,.issue-img img,.latest-edition-card img,.home-events3-media img{transition:transform .6s var(--ease)}
.home-face3:hover img,.face-card:hover .face-card-media img,.home-issue3:hover img,.issue-modern:hover .issue-img img,.latest-edition-card:hover img{transform:scale(1.025)}
.home-face3,.face-card-media,.home-issue3,.issue-img,.latest-edition-card{overflow:hidden}
.home-face3 span{font-size:11px}
.home-world3-grid small{font-size:11px}
.home-issue3-meta span{font-size:11px}
.home-events3-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:8px}
.home-events3-grid a{text-decoration:none;color:inherit;display:block}
.home-events3-grid img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--paper-2)}
.home-events3-grid b{display:block;margin-top:12px;font:600 clamp(20px,1.6vw,26px)/1.1 var(--serif);letter-spacing:-.015em}
.home-events3-grid span{display:block;margin-top:6px;font:500 11px var(--mono);letter-spacing:.12em;color:var(--red);text-transform:uppercase}
.home-events3-grid a:hover b{color:var(--red)}
@media(max-width:760px){.home-events3-grid{grid-template-columns:1fr 1fr}.home-events3-grid a:first-child{grid-column:1/-1}}

/* ---------- Live wires (home "Now." + section desks) --------------------- */
.wire-refresh{appearance:none;justify-self:start;align-self:end;display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border:1px solid currentColor;background:transparent;color:inherit;font:500 11px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;width:auto}
.wire-refresh:hover{background:var(--red);border-color:var(--red);color:#fff}
.wire-refresh:disabled{opacity:.5;cursor:progress}
.section-live-side{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.section-live-status,.live-now-head .live-dot{font-size:11px}
.live-card-meta,.section-live-meta{font-size:11px!important;letter-spacing:.1em}
.live-card-open,.section-live-card b{font-size:11px!important;letter-spacing:.1em}
.wire-credit,.section-live-credit{font-size:11px!important;letter-spacing:.08em;line-height:1.6}
.live-card.is-text,.section-live-card.is-text{justify-content:flex-start}
.live-card.is-text .live-card-copy,.section-live-card.is-text .section-live-copy{padding-top:22px;border-top:3px solid var(--red)}
.live-card.is-text h3{font-size:clamp(22px,1.8vw,28px)}
.section-live-card.is-text h3{font-size:clamp(22px,1.8vw,28px)}
.wire-skeleton{min-height:280px;display:flex;flex-direction:column;gap:12px;padding:0 0 18px;background:transparent}
.wire-skeleton i{display:block;aspect-ratio:16/10;background:linear-gradient(100deg,rgba(255,255,255,.05) 30%,rgba(255,255,255,.12) 50%,rgba(255,255,255,.05) 70%) 0 0/300% 100%;animation:wireShimmer 1.4s linear infinite}
.wire-skeleton b{display:block;height:14px;width:80%;background:rgba(255,255,255,.08)}
.wire-skeleton b+b{width:55%}
.live-now .wire-skeleton i{background-color:#e4ddd1;background-image:linear-gradient(100deg,#e4ddd1 30%,#efe9df 50%,#e4ddd1 70%)}
.live-now .wire-skeleton b{background:#e4ddd1}
@keyframes wireShimmer{to{background-position:-300% 0}}
.wire-status{grid-column:1/-1;padding:28px 0;font:400 18px/1.5 var(--serif)}

/* ---------- Faces ------------------------------------------------------- */
.face-card-copy p{font-size:11px;margin-top:8px}
.face-card-copy h3{transition:color .15s}
.face-card:hover h3{color:var(--red)}
.model-copy p{color:var(--muted)}
.portfolio-grid{gap:6px;padding:6px}

/* ---------- Issues & reader --------------------------------------------- */
.lr-button,.lr-select,.lr-page-status span,.lr-brand,.lr-title,.reader-edition-nav a,.lr-thumbs span,.reader-note,.reader-mobile-hint{font-size:11px!important}
.lr-button{min-height:40px}
.reader-edition-nav a.is-current{color:var(--red)}

/* ---------- Footer ------------------------------------------------------ */
.site-footer{background:var(--ink);color:#e9e5dd;padding:clamp(56px,7vw,96px) var(--gutter) 28px}
.footer-brand{max-width:var(--max)}
.footer-brand img{width:min(300px,62vw);height:auto}
.footer-grid{max-width:var(--max);grid-template-columns:minmax(0,1.6fr) repeat(3,minmax(0,1fr));gap:clamp(28px,4vw,64px);border-top:1px solid var(--darkline)}
.footer-about p{font:400 17px/1.55 var(--serif);color:#b3aea6;max-width:36ch;margin:14px 0 0}
.footer-kicker{color:var(--red);text-transform:uppercase}
.footer-col h2{margin:0 0 14px;font:500 11px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--gray)}
.footer-grid a{font:500 12px/1.5 var(--mono);letter-spacing:.08em;text-transform:none;color:#e1ddd5;margin:0 0 10px}
.footer-grid a:hover{color:var(--red)}
.footer-parent{margin-top:22px!important;text-transform:uppercase!important;font-size:11px!important;letter-spacing:.12em!important}
.footer-bottom{max-width:var(--max);font:500 11px var(--mono);letter-spacing:.12em;color:#77736d;text-transform:uppercase}
@media(max-width:900px){.footer-grid{grid-template-columns:1fr 1fr}.footer-about{grid-column:1/-1}}
@media(max-width:480px){.footer-grid{grid-template-columns:1fr 1fr;gap:28px 20px}.footer-bottom{display:flex;flex-direction:column;gap:8px}}

/* ---------- Mobile rhythm ------------------------------------------------ */
@media(max-width:760px){
  .section,.page-intro,.cathero,.article-hero,.body,.home-feed3,.home-faces3,.home-world3,.home-issues3,.home-events3,.live-now,.newsletter-home,.section-live-wire,.reader-index,.site-footer{padding-left:16px!important;padding-right:16px!important}
  .story p,.archive-item p,.dispatch p{font-size:15px}
  .body p{font-size:18px}
}

/* ---------- Motion preferences ----------------------------------------- */
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{animation:none!important;transition:none!important}
}

/* ---------- Podcast & interviews ---------------------------------------- */
.podcast-feature{background:var(--ink);color:#f2eee6}
.podcast-feature-inner{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(28px,5vw,80px);align-items:center}
.podcast-feature-copy h2{font:600 clamp(48px,6vw,96px)/.88 var(--serif);letter-spacing:-.05em;margin:14px 0 22px}
.podcast-feature-copy p{font:400 clamp(17px,1.5vw,21px)/1.5 var(--serif);color:#b6b0a7;max-width:36ch;margin:0 0 24px}
.podcast-feature .read{color:#fff}
.yt-lite,.yt-lite-frame{position:relative;display:block;width:100%;aspect-ratio:16/9;border:0;padding:0;background:#000;cursor:pointer;overflow:hidden}
.yt-lite img{width:100%;height:100%;object-fit:cover;display:block;opacity:.85;transition:opacity .2s}
.yt-lite:hover img{opacity:1}
.yt-lite-play{position:absolute;left:50%;top:50%;width:84px;height:84px;margin:-42px 0 0 -42px;border-radius:50%;background:var(--red)}
.yt-lite-play:after{content:"";position:absolute;left:34px;top:26px;border-style:solid;border-width:16px 0 16px 26px;border-color:transparent transparent transparent #fff}
.podcast-ep-actions{display:flex;gap:20px;align-items:center;flex-wrap:wrap;margin-top:22px}
.podcast-ep .read:after{display:none}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.interview-facts{padding:18px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font:500 13px/1.8 var(--mono)!important;letter-spacing:.04em}
.interview-facts strong{font-family:var(--mono)!important;font-size:11px!important;color:var(--red);margin-right:6px}
.section-archive-label{max-width:var(--max);margin:0 auto 24px}
@media(max-width:860px){.podcast-feature-inner{grid-template-columns:1fr}}

/* ---------- Home refinements -------------------------------------------- */
.ledgera-sensual .home-hero3-copy:before{content:none}
.home-issues3-grid.is-three{grid-template-columns:repeat(3,minmax(0,1fr));max-width:none}
.home-section-label{display:block}
.home-section-label span{display:block;margin-bottom:14px}
.home-section-label p{margin-top:14px}
@media(max-width:760px){.home-issues3-grid.is-three{display:flex}}
@media(max-width:680px){html .live-now-grid,html .section-live-grid{margin:0 -16px;padding:0 16px 12px}}

/* ---------- Tribeca slate: text-only entries stay compact --------------- */
.tribeca-card{position:relative}
.tribeca-card .tribeca-media:empty,.tribeca-card:not(:has(img)) .tribeca-media{display:none}
.tribeca-card:not(:has(img)) .tribeca-copy{padding:18px 18px 22px;border-top:3px solid var(--ink);background:#fff;height:100%}
.tribeca-card:not(:has(img)) .tribeca-copy h3{font-size:clamp(22px,1.8vw,28px)}
.tribeca-copy .meta{color:var(--red)}
.tribeca-copy .arrow-link{display:inline-block;margin-top:16px}
.tribeca-copy .arrow-link:after{content:"";position:absolute;inset:0}
.tribeca-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
@media(max-width:1100px){.tribeca-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.tribeca-grid{grid-template-columns:1fr 1fr;gap:8px}.tribeca-card:not(:has(img)) .tribeca-copy{padding:14px}.tribeca-card:not(:has(img)) .tribeca-copy h3{font-size:20px}.tribeca-copy p{font-size:13px}}
.tribeca-card{min-width:0}.tribeca-copy h3{overflow-wrap:anywhere;hyphens:auto}
.press-visual-grid{min-width:0}
