/* Not An Atlas 2.2 — reading progress, Up next, Read next, Pick up where you left off. */

/* Progress line under the nav */
.naa-progress{position:fixed;left:0;top:0;width:100%;height:3px;z-index:1200;pointer-events:none;background:transparent}
.naa-progress i{display:block;height:100%;width:100%;background:var(--moss);transform-origin:0 50%;transform:scaleX(0);transition:transform .12s linear}

/* Up next: a card that slides in once the reader is two-thirds through */
.naa-next{position:fixed;right:24px;bottom:24px;z-index:1100;width:min(360px,calc(100vw - 32px));background:var(--white);color:var(--ink);border:1px solid var(--ink-12);box-shadow:0 18px 50px rgba(12,12,12,.18);transform:translateY(24px);opacity:0;transition:transform .45s var(--cv-ease,cubic-bezier(.2,.7,.2,1)),opacity .35s}
.naa-next.is-in{transform:none;opacity:1}
.naa-next-head{display:flex;align-items:center;justify-content:space-between;padding:12px 14px 0}
.naa-next-head .naa-section-label{margin:0;font-size:10px}
.naa-next-x{border:0;background:none;font-size:20px;line-height:1;color:var(--ink-60);padding:2px 4px}
.naa-next-x:hover{color:var(--ink)}
.naa-next-link{display:grid;grid-template-columns:96px 1fr;gap:14px;padding:12px 14px 16px;text-decoration:none;color:inherit}
.naa-next-img{height:72px;background:var(--sand) center/cover no-repeat}
.naa-next .naa-chip{margin-bottom:4px}
.naa-next h3{font-family:var(--ff-display);font-weight:400;font-size:21px;line-height:1.12;margin:0 0 6px;text-wrap:balance}
.naa-next em{display:block;font-style:normal;font-family:var(--ff-body);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--moss)}
.naa-next-link:hover h3{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.naa-player ~ .naa-next{bottom:92px}
@media (max-width:640px){
  .naa-next{right:0;bottom:0;width:100%;border-left:0;border-right:0;border-bottom:0}
  .naa-next-link{grid-template-columns:72px 1fr;padding-bottom:calc(14px + env(safe-area-inset-bottom))}
  .naa-next-img{height:56px}
  .naa-next h3{font-size:18px}
}

/* Read next: an inline card inside the story */
.naa-prose .naa-readnext{clear:both;margin:40px 0;padding:22px 26px;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink-12);background:var(--paper);display:grid;grid-template-columns:1fr auto;gap:8px 24px;align-items:center;text-decoration:none;color:inherit}
.naa-prose .naa-readnext small{grid-column:1/-1;font-family:var(--ff-body);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--moss)}
.naa-prose .naa-readnext strong{font-family:var(--ff-display);font-weight:400;font-size:24px;line-height:1.15;text-wrap:balance}
.naa-prose .naa-readnext span{font-family:var(--ff-body);font-size:12px;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.naa-prose .naa-readnext:hover strong{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
@media (max-width:640px){.naa-prose .naa-readnext{grid-template-columns:1fr;padding:18px}}

/* Pick up where you left off (home) */
.naa-resume{background:var(--paper);border-top:1px solid var(--ink-12);border-bottom:1px solid var(--ink-12)}
.naa-resume .h2-in{padding-top:28px;padding-bottom:28px;display:grid;grid-template-columns:auto 1fr;gap:12px 48px;align-items:center}
.naa-resume .naa-section-label{margin:0;white-space:nowrap}
.naa-resume-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.naa-resume-list li{position:relative;min-width:0}
.naa-resume-list a{display:grid;grid-template-columns:64px 1fr;gap:12px;text-decoration:none;color:inherit;align-items:center;padding-right:24px}
.naa-resume-img{height:48px;background:var(--sand) center/cover no-repeat}
.naa-resume-txt{min-width:0}
.naa-resume-txt small{display:block;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--moss);margin-bottom:2px}
.naa-resume-txt b{display:block;font-family:var(--ff-display);font-weight:400;font-size:18px;line-height:1.15;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.naa-resume-bar{display:block;height:2px;background:var(--ink-12);margin:6px 0 3px}
.naa-resume-bar i{display:block;height:100%;background:var(--moss)}
.naa-resume-txt em{font-style:normal;font-size:11px;color:var(--ink-60);letter-spacing:.08em}
.naa-resume-list a:hover b{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.naa-resume-x{position:absolute;right:0;top:0;border:0;background:none;color:var(--ink-30);font-size:18px;line-height:1;padding:0 4px}
.naa-resume-x:hover{color:var(--ink)}
@media (max-width:900px){.naa-resume .h2-in{grid-template-columns:1fr}.naa-resume-list{grid-template-columns:1fr;gap:14px}}
@media (prefers-reduced-motion:reduce){.naa-next,.naa-progress i{transition:none}}

/* The Trade Brief prompt (articles): same footprint as Up next, forest card */
.naa-nlp{position:fixed;right:24px;bottom:24px;z-index:1100;width:min(380px,calc(100vw - 32px));padding:20px 22px 18px;background:var(--forest);color:var(--paper);box-shadow:0 18px 50px rgba(12,12,12,.28);transform:translateY(24px);opacity:0;transition:transform .45s var(--cv-ease,cubic-bezier(.2,.7,.2,1)),opacity .35s}
.naa-nlp.is-in{transform:none;opacity:1}
.naa-nlp .naa-section-label{color:var(--sage);margin:0 0 10px;font-size:10px}
.naa-nlp h3{font-family:var(--ff-display);font-weight:300;font-size:26px;line-height:1.1;margin:0 0 8px;text-wrap:balance}
.naa-nlp h3 em{color:var(--sage-lt)}
.naa-nlp p{font-size:13px;line-height:1.5;color:rgba(250,249,247,.75);margin:0 0 14px}
.naa-nlp-x{position:absolute;right:10px;top:8px;border:0;background:none;color:rgba(250,249,247,.6);font-size:22px;line-height:1;padding:4px 6px}
.naa-nlp-x:hover{color:var(--paper)}
.naa-nlp .nl-input-row{display:flex;gap:0;margin:0;border:1px solid rgba(250,249,247,.3);background:rgba(250,249,247,.06)}
.naa-nlp .nl-input-row:focus-within{border-color:var(--sage-lt)}
.naa-nlp .nl-input{flex:1;min-width:0;background:transparent;border:0;color:var(--paper);padding:12px 14px;font-family:var(--ff-body);font-size:14px!important;font-weight:400}
.naa-nlp .nl-input::placeholder{color:rgba(250,249,247,.5)}
.naa-nlp .nl-btn{background:var(--paper)!important;color:var(--forest)!important;border:0;padding:0 18px!important;min-height:46px;font-family:var(--ff-body);font-size:11px!important;letter-spacing:.14em!important;text-transform:uppercase;white-space:nowrap}
.naa-nlp .nl-btn:hover{background:var(--sage-lt)!important}
.naa-nlp .nl-disclaimer{font-size:11px!important;font-style:normal;color:rgba(250,249,247,.55)!important;margin:10px 0 0!important;letter-spacing:.04em}
.naa-player ~ .naa-nlp{bottom:92px}
@media (max-width:640px){
  .naa-nlp{right:0;bottom:0;width:100%;padding:18px 18px calc(16px + env(safe-area-inset-bottom))}
  .naa-nlp h3{font-size:22px}
}
@media (prefers-reduced-motion:reduce){.naa-nlp{transition:none}}

/* ── 2.2.2 design pass ─────────────────────────────── */

/* Audio brief: the playlist has its own wrapper (it used to inherit the bar's four-column grid) */
.h2-bl-wrap{max-width:1400px;margin:0 auto;padding:0 56px 26px}
.h2-bl-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin:2px 0 12px}
.h2-bl-head .naa-section-label{margin:0;font-size:10px}
.h2-bl-how{position:relative;font-family:var(--ff-body);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(12,12,12,.55)}
.h2-bl-how summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;padding:2px 0}
.h2-bl-how summary::-webkit-details-marker{display:none}
.h2-bl-how summary::after{content:"";width:5px;height:5px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .2s}
.h2-bl-how[open] summary::after{transform:translateY(1px) rotate(-135deg)}
.h2-bl-how summary:hover{color:var(--forest)}
.h2-bl-how p{position:absolute;right:0;top:calc(100% + 8px);z-index:5;width:min(360px,80vw);margin:0;padding:12px 14px;background:var(--white);border:1px solid var(--ink-12);box-shadow:0 10px 30px rgba(12,12,12,.1);font-size:13px;letter-spacing:0;text-transform:none;line-height:1.55;color:var(--ink)}
.h2-bl-hint{display:none}
.h2-bl-ol{list-style:none;margin:0;padding:0}
.h2-play .h2-play-i[hidden],.h2-play .h2-pause-i[hidden]{display:none}
@media (max-width:1100px){.h2-bl-wrap{padding:0 32px 22px}}
@media (max-width:700px){.h2-bl-wrap{padding:0 20px 18px}.h2-bl-how p{left:0;right:auto;width:min(360px,calc(100vw - 40px))}}

/* Photo credits sit on the photograph, not between it and the headline */
.h2-ph .h2-credit.is-on-photo,.h2-hc-img .h2-credit.is-on-photo{position:absolute;right:0;bottom:0;margin:0;max-width:70%;padding:14px 12px 9px;font-size:8.5px;letter-spacing:.14em;text-transform:uppercase;color:rgba(244,241,234,.72);text-align:right;line-height:1.3;text-shadow:0 0 2px rgba(12,12,12,.9),0 0 6px rgba(12,12,12,.8),0 1px 12px rgba(12,12,12,.6);pointer-events:none;transition:color .25s}
.h2-ph:hover .h2-credit.is-on-photo,.h2-hc-img:hover .h2-credit.is-on-photo{color:var(--paper)}
.h2-kick{margin-top:16px}
.h2-card .h2-kick{margin-top:12px}
.h2-lead-t{margin:8px 0 10px}
.h2-card h3{margin:6px 0 6px}

/* Bylines: avatar, name and read time on one centre line */
.h2-m,.h2-byl{display:flex;align-items:center;flex-wrap:wrap;gap:6px;line-height:1}
.h2-byl{gap:8px}
.h2-m .naa-byline-link,.h2-byl .naa-byline-link{display:inline-flex;align-items:center}
.h2-m-sep{color:var(--ink-30)}