/* The Daily Delve — newsprint feed. Fully token-driven so it matches the active
   site palette in light AND dark (no hardcoded parchment that clashes with the
   theme around it). Card separation comes from the elevated --bg-card surface. */
.feed-host{--np-paper:var(--bg);--np-ink:var(--text);--np-rule:var(--border2);--np-card:var(--bg-card);}
.np-sheet{max-width:1080px;margin:0 auto;padding:1.2rem 1.3rem 3rem;color:var(--np-ink);
  background:var(--np-paper);}
.np-banner{display:flex;justify-content:space-between;font-family:var(--font-code);font-size:.6rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted);border-bottom:1px solid var(--np-ink);padding-bottom:.3rem}
.np-banner .live{color:var(--warm)}
.np-mast{text-align:center;border-bottom:3px double var(--np-ink);padding:.5rem 0 .4rem;position:relative}
.np-ov{font-family:var(--font-code);font-size:.56rem;letter-spacing:.32em;text-transform:uppercase;color:var(--text-muted)}
.np-mast h1{font-family:var(--font-display);font-style:italic;font-weight:400;font-size:clamp(2rem,6vw,3rem);margin:.1rem 0 .15rem}
.np-dl{display:flex;align-items:center;justify-content:center;gap:.7rem;flex-wrap:wrap;font-family:var(--font-code);font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim)}
.np-dl i{width:3px;height:3px;border-radius:50%;background:var(--warm)}
.np-ednav{font:inherit;background:none;border:1px solid var(--np-ink);border-radius:5px;padding:.1rem .45rem;color:var(--np-ink);cursor:pointer}
.np-grid{display:grid;grid-template-columns:1fr 230px;gap:0;margin-top:.6rem}
.np-main{padding-right:1.1rem;border-right:1px solid var(--np-rule)}
.np-rail{padding-left:1rem}
.np-leader{border:1px solid var(--np-rule);padding:.5rem .9rem;margin:.6rem 0 1rem;background:var(--np-card)}
.np-leader[open]{padding-bottom:.85rem}
.np-leader-summary{font-family:var(--font-code);font-size:.55rem;letter-spacing:.2em;text-transform:uppercase;color:var(--warm);cursor:pointer;list-style:none;user-select:none}
.np-leader-summary::-webkit-details-marker{display:none}
.np-leader-summary::after{content:" ▾";opacity:.7}
.np-leader[open] .np-leader-summary::after{content:" ▴"}
.np-by{font-family:var(--font-code);font-size:.55rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);margin:.5rem 0 .25rem}
.np-leader p{font-family:var(--font-display);font-style:italic;font-size:1.15rem;line-height:1.6;margin:0}
.np-leader p::first-letter{font-size:2.4rem;line-height:.8;float:left;padding:.05rem .3rem 0 0;font-style:normal;color:var(--warm)}
.np-desk{margin:1rem 0}
.np-dh{display:flex;align-items:center;gap:.6rem;margin-bottom:.45rem}
.np-dh .nm{font-family:var(--font-code);font-size:.62rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase}
.np-dh .ln{flex:1;height:1px;background:var(--np-ink)}
.np-dh .ct{font-family:var(--font-code);font-size:.54rem;color:var(--text-muted)}
.np-db{display:grid;grid-template-columns:1.5fr 1fr;gap:1rem}
.np-art{height:90px;border:1px solid var(--np-rule);border-radius:6px;margin-bottom:.4rem;overflow:hidden}
.np-lead h2{font-family:var(--font-display);font-style:italic;font-size:1.35rem;line-height:1.2;margin:0 0 .2rem}
.np-sub{font-family:var(--font-code);font-size:.54rem;color:var(--text-muted);margin-bottom:.35rem}
.np-lead p{font-family:var(--font-heading);font-size:.98rem;line-height:1.6;color:var(--text-dim);text-align:justify;margin:0 0 .5rem}
.np-why{color:var(--np-ink)!important}
.np-side .np-item{padding:.45rem 0;border-bottom:1px solid var(--np-rule)}
.np-item h4{font-family:var(--font-heading);font-weight:600;font-size:.92rem;margin:0 0 .12rem}
.np-item .src{font-family:var(--font-code);font-size:.5rem;color:var(--text-muted)}
.np-item p{font-family:var(--font-heading);font-size:.86rem;color:var(--text-dim);line-height:1.6;margin:.2rem 0 .3rem}
.np-acts{display:flex;align-items:center;gap:.5rem;margin-top:.3rem}
.np-read{font-family:var(--font-code);font-size:.58rem;color:var(--text-dim);text-decoration:none}
.np-save{font:inherit;font-family:var(--font-heading);font-size:.7rem;background:none;border:1px solid var(--np-rule);border-radius:999px;padding:.15rem .5rem;color:var(--text-dim);cursor:pointer}
.np-save:hover{border-color:var(--warm);color:var(--warm)}
.chip.soon{font-family:var(--font-code);font-size:.52rem;color:var(--text-muted);border:1px solid var(--np-rule);border-radius:4px;padding:.08rem .3rem}
.np-box{margin-bottom:1rem}
.np-rh{font-family:var(--font-code);font-size:.56rem;letter-spacing:.16em;text-transform:uppercase;color:var(--text-muted);border-bottom:1px solid var(--np-ink);padding-bottom:.2rem;margin-bottom:.35rem}
.np-drow{display:flex;justify-content:space-between;font-family:var(--font-heading);font-size:.76rem;color:var(--text-dim);padding:.2rem .15rem;cursor:pointer;border-radius:5px;transition:background .12s,color .12s}
.np-drow:hover{background:color-mix(in srgb,var(--np-ink) 6%,transparent)}
.np-drow.on{background:color-mix(in srgb,var(--warm) 14%,transparent);color:var(--warm)}
.np-drow .c{font-family:var(--font-code);font-size:.56rem;color:var(--text-muted)}
.np-cg{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.np-cg .dow{font-family:var(--font-code);font-size:.5rem;text-align:center;color:var(--text-muted)}
.np-cg .cd{font-family:var(--font-code);font-size:.56rem;text-align:center;padding:.22rem 0;border-radius:4px;color:var(--text-muted)}
.np-cg .cd.has{color:var(--np-ink);background:color-mix(in srgb,var(--np-ink) 6%,transparent);cursor:pointer}
.np-cg .cd.on{background:var(--warm);color:#1a1612;font-weight:700}
.feed-gate{max-width:520px;margin:4rem auto;text-align:center;display:flex;flex-direction:column;gap:1rem;align-items:center}
.feed-gate-mast{font-family:var(--font-display);font-style:italic;font-size:2.4rem;color:var(--text)}
.feed-gate p{color:var(--text-dim);max-width:40ch}
.feed-gate-btn{font-family:var(--font-heading);font-weight:600;background:var(--warm);color:#1a1612;border:0;border-radius:999px;padding:.6rem 1.4rem;cursor:pointer}
.feed-loading,.feed-empty{padding:4rem 1rem;text-align:center;color:var(--text-muted)}
/* Lead article image (real photo when image_url is set; hidden otherwise) */
.np-img{display:block;width:100%;height:120px;object-fit:cover;border-radius:6px;margin-bottom:.5rem;border:1px solid var(--np-rule);background:var(--np-card);}
/* Hide lesson search bar while the Feed view is active */
html.feed-active .disc-search{display:none!important;}
@media(max-width:760px){
  .np-grid{grid-template-columns:1fr}.np-main{border-right:0;padding-right:0}
  .np-rail{padding-left:0;margin-top:1.4rem;border-top:1px solid var(--np-rule);padding-top:1rem}
  .np-db{grid-template-columns:1fr}
}

/* ─── Mode toggle (Cards / Newspaper) ────────────────────────────────────── */
.nf-mode-toggle{
  display:inline-flex;
  align-items:center;
  background:var(--bg2);
  border:1px solid var(--border);
  border-radius:999px;
  padding:2px;
  gap:0;
  flex-shrink:0;
}
.nf-mode-btn{
  font-family:var(--font-heading);
  font-size:.62rem;
  font-weight:500;
  border:none;
  border-radius:999px;
  padding:.22rem .6rem;
  cursor:pointer;
  background:none;
  color:var(--text-muted);
  transition:background .15s,color .15s;
  white-space:nowrap;
  line-height:1.3;
}
.nf-mode-btn.nf-mode-on{
  background:var(--warm);
  color:#1a1612;
}
.nf-mode-btn:not(.nf-mode-on):hover{
  background:color-mix(in srgb,var(--text) 8%,transparent);
  color:var(--text);
}
/* In masthead (paper view) center the toggle */
.np-dl .nf-mode-toggle{margin-left:.4rem;}

/* ─── Cards view wrapper ──────────────────────────────────────────────────── */

.nf-wrap{
  display:flex;
  flex-direction:column;
  height:100%;
  background:var(--bg);
  color:var(--text);
}

/* Top app bar */
.nf-bar{
  /* NOT sticky — two stacked sticky bars (this + the discovery sub-bar) collide and can
     wedge under each other after an app-switch. It scrolls with the feed instead. */
  position:relative;
  z-index:10;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 .75rem;
  height:52px;
  min-height:52px;
  background:color-mix(in srgb,var(--bg) 80%,transparent);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border);
  flex-shrink:0;
  gap:.5rem;
}
@media(min-width:761px){
  .nf-bar{
    height:60px;
    min-height:60px;
    padding:0 1.5rem;
  }
}
.nf-bar-right{
  display:flex;
  align-items:center;
  gap:.5rem;
  flex-shrink:0;
}
.nf-menu,.nf-cal-btn{
  background:none;
  border:none;
  color:var(--text);
  font-size:1.1rem;
  padding:.4rem .5rem;
  cursor:pointer;
  border-radius:8px;
  transition:background .12s;
  line-height:1;
  flex-shrink:0;
}
.nf-menu:hover,.nf-cal-btn:hover{background:color-mix(in srgb,var(--text) 8%,transparent)}

/* One-tap Sources button (cards app bar) — ghost pill, icon-only on phone */
.nf-src-btn{
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  background:none;
  border:1px solid var(--border);
  color:var(--text);
  font-family:var(--font-heading);
  font-size:.72rem;
  font-weight:500;
  padding:.3rem .55rem;
  border-radius:999px;
  cursor:pointer;
  line-height:1.2;
  flex-shrink:0;
  transition:background .12s,border-color .12s,color .12s;
}
.nf-src-btn:hover{
  background:color-mix(in srgb,var(--text) 8%,transparent);
  border-color:var(--border-hover);
}
.nf-src-ico{font-size:.85rem;line-height:1;}
.nf-src-lbl{display:none;}
@media(min-width:761px){
  .nf-src-lbl{display:inline;}
}
.nf-bar-center{
  flex:1;
  text-align:center;
  cursor:pointer;
  padding:.25rem 0;
  line-height:1.2;
  min-width:0;
}
.nf-bar-title{
  display:block;
  font-family:var(--font-display);
  font-style:italic;
  font-size:.9rem;
  font-weight:400;
  color:var(--text);
}
@media(min-width:761px){
  .nf-bar-title{font-size:1.05rem;}
}
.nf-bar-date{
  display:block;
  font-family:var(--font-code);
  font-size:.52rem;
  letter-spacing:.1em;
  color:var(--text-muted);
  margin-top:.05rem;
}

/* Scrollable content area */
.nf-scroll{
  flex:1;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  padding-bottom:3rem;
}

/* Single masthead — newspaper style, centered, dynamically sized. Same look in
   card + paper modes. Max-width keeps it from sprawling on wide screens. */
.nf-masthead{
  text-align:center;
  max-width:900px;
  margin:0 auto;
  padding:clamp(.7rem,2.4vw,1.6rem) clamp(.9rem,4vw,1.5rem) clamp(.6rem,2vw,1.1rem);
  box-sizing:border-box;
}
/* Top rule: Vol/No · masthead · signed-in. Collapses gracefully on phone. */
.nf-mast-banner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.5rem;
  font-family:var(--font-code);
  font-size:clamp(.5rem,1.4vw,.62rem);
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--text-muted);
  border-bottom:1px solid var(--border);
  padding-bottom:.5rem;
  margin-bottom:.7rem;
}
.nf-mast-banner-mid{flex:1;text-align:center;color:var(--text-dim);}
.nf-mast-home{
  background:none;border:1px solid color-mix(in srgb,var(--warm) 50%,var(--border));
  color:var(--warm);font-family:var(--font-code);font-size:.55rem;letter-spacing:.08em;
  text-transform:uppercase;border-radius:999px;padding:.25rem .6rem;cursor:pointer;white-space:nowrap;
}
.nf-mast-home:hover{background:color-mix(in srgb,var(--warm) 14%,transparent);}
.nf-mast-banner-end{display:inline-flex;align-items:center;gap:.35rem;white-space:nowrap;}
.nf-mast-live{
  width:.45rem;height:.45rem;border-radius:50%;
  background:var(--warm);box-shadow:0 0 6px var(--warm);
  display:inline-block;
}
.nf-mast-eyebrow{
  font-family:var(--font-code);
  font-size:clamp(.5rem,1.5vw,.62rem);
  letter-spacing:.26em;
  text-transform:uppercase;
  color:var(--text-muted);
  margin-bottom:.35rem;
}
.nf-mast-title{
  font-family:var(--font-display);
  font-style:italic;
  font-weight:400;
  font-size:clamp(2.1rem,9vw,4.4rem);
  line-height:1.0;
  letter-spacing:-.01em;
  color:var(--text);
  margin:0 0 .4rem;
  cursor:pointer;
}
.nf-mast-sub{
  font-family:var(--font-code);
  font-size:clamp(.52rem,1.5vw,.64rem);
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--text-muted);
}
/* Very narrow: drop the middle banner word so Vol/No + signed-in stay on one line */
@media(max-width:430px){
  .nf-mast-banner-mid{display:none;}
}

/* ─── Lazy date timeline (older editions appended on scroll) ───────────────── */
.nf-timeline-sentinel{height:1px;width:100%;}
.nf-timeline-edition{animation:nfTlIn .35s var(--ease-spring) both;}
@keyframes nfTlIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.nf-timeline-divider{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.85rem;
  max-width:1100px;
  margin:2.4rem auto 1.1rem;
  padding:0 1rem;
}
.nf-timeline-divider::before,
.nf-timeline-divider::after{
  content:"";
  flex:1;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--border),transparent);
}
.nf-tl-date{
  font-family:var(--font-display);
  font-style:italic;
  font-size:clamp(1.05rem,3vw,1.55rem);
  color:var(--text);
  white-space:nowrap;
}
.nf-tl-meta{
  font-family:var(--font-code);
  font-size:.52rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--text-muted);
  white-space:nowrap;
}
@media(max-width:560px){
  .nf-timeline-divider{flex-direction:column;gap:.2rem;}
  .nf-timeline-divider::before,.nf-timeline-divider::after{display:none;}
}

/* Leader block */
.nf-leader{
  margin:.5rem .75rem;
  padding:.45rem .85rem;
  border-left:3px solid var(--warm);
  background:color-mix(in srgb,var(--warm) 5%,var(--bg-card));
  border-radius:0 8px 8px 0;
}
.nf-leader[open]{ padding-bottom:.7rem; }
@media(min-width:761px){
  .nf-leader{ max-width:1100px; margin:.5rem auto; }
}
.nf-leader-summary{
  font-family:var(--font-code);
  font-size:.56rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--warm);
  cursor:pointer;
  list-style:none;
  user-select:none;
}
.nf-leader-summary::-webkit-details-marker{ display:none; }
.nf-leader-summary::after{ content:' ▾'; opacity:.7; }
.nf-leader[open] .nf-leader-summary::after{ content:' ▴'; }
.nf-leader-text{
  font-family:var(--font-display);
  font-style:italic;
  font-size:.96rem;
  line-height:1.65;
  color:var(--text);
  margin-top:.5rem;
}

/* Desk filter chips row */
.nf-chips{
  display:flex;
  gap:.4rem;
  padding:.6rem .75rem;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  border-bottom:1px solid var(--border);
}
@media(min-width:761px){
  .nf-chips{
    padding:.6rem 1.5rem;
    max-width:1100px;
    margin:0 auto;
    box-sizing:border-box;
  }
}
.nf-chips::-webkit-scrollbar{display:none}
.nf-chip{
  flex-shrink:0;
  font-family:var(--font-heading);
  font-size:.72rem;
  font-weight:500;
  background:var(--bg2);
  border:1px solid var(--border);
  color:var(--text-dim);
  border-radius:999px;
  padding:.3rem .7rem;
  cursor:pointer;
  transition:background .15s,color .15s,border-color .15s;
  white-space:nowrap;
  display:flex;
  align-items:center;
  gap:.3rem;
}
.nf-chip-on{
  background:var(--warm);
  color:#1a1612;
  border-color:var(--warm);
}
/* Groups entry — visually distinct (warm outline) so it reads as an action, not a filter. */
.nf-chip-groups{
  font-weight:700;
  color:var(--warm);
  border-color:color-mix(in srgb,var(--warm) 55%,var(--border));
  background:color-mix(in srgb,var(--warm) 10%,var(--bg2));
}
.nf-chip-groups:hover{
  background:color-mix(in srgb,var(--warm) 18%,var(--bg2));
  border-color:var(--warm);
}
.nf-chip:active{transform:scale(.96)}
.nf-chip-count{
  font-family:var(--font-code);
  font-size:.6rem;
  opacity:.7;
}

/* Section header within stream */
.nf-sec{
  font-family:var(--font-code);
  font-size:.58rem;
  font-weight:700;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--text-muted);
  padding:.7rem 0 .3rem;
  /* spans full grid width */
  grid-column: 1 / -1;
}

/* Story stream — wraps the responsive grid */
.nf-stream{
  padding:.25rem .75rem;
}
@media(min-width:761px){
  .nf-stream{
    padding:.5rem 1.5rem;
    max-width:1100px;
    margin:0 auto;
    box-sizing:border-box;
  }
}

/* Responsive card grid */
.nf-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:.7rem;
}
@media(min-width:640px) and (max-width:999px){
  .nf-grid{
    grid-template-columns:repeat(2,1fr);
  }
}
@media(min-width:1000px){
  .nf-grid{
    grid-template-columns:repeat(3,1fr);
    gap:1rem;
  }
}

/* Story card */
.nf-card{
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:14px;
  overflow:hidden;
  cursor:pointer;
  transition:transform .18s var(--ease-spring,ease),box-shadow .18s ease;
  -webkit-tap-highlight-color:transparent;
  box-shadow:0 1px 3px color-mix(in srgb,var(--text) 5%,transparent);
  display:flex;
  flex-direction:column;
}
.nf-card:hover{
  transform:translateY(-2px);
  box-shadow:0 4px 16px color-mix(in srgb,var(--text) 10%,transparent);
}
.nf-card:active{transform:scale(.98)}
[data-theme="light"] .nf-card{
  box-shadow:0 1px 4px rgba(0,0,0,.06);
}
.nf-card-img{
  display:block;
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  border-radius:10px 10px 0 0;
}
.nf-card-body{
  padding:.75rem .85rem .65rem;
  display:flex;
  flex-direction:column;
  flex:1;
}
.nf-card-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.5rem;
  margin-bottom:.4rem;
}
.nf-card-date{
  font-family:var(--font-code);
  font-size:.52rem;
  letter-spacing:.08em;
  color:var(--text-muted);
  white-space:nowrap;
}
.nf-desk-chip{
  display:inline-block;
  font-family:var(--font-code);
  font-size:.5rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--warm);
  background:color-mix(in srgb,var(--warm) 12%,transparent);
  border-radius:4px;
  padding:.12rem .35rem;
}
.nf-card-hl{
  font-family:var(--font-heading);
  font-size:1.05rem;
  font-weight:600;
  line-height:1.3;
  color:var(--text);
  margin-bottom:.3rem;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.nf-dek{
  font-family:var(--font-heading);
  font-size:.82rem;
  line-height:1.55;
  color:var(--text-dim);
  margin-bottom:.4rem;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  flex:1;
}
.nf-card-acts{
  display:flex;
  align-items:center;
  gap:.5rem;
  margin-top:.2rem;
}
.nf-card-src{
  font-family:var(--font-code);
  font-size:.5rem;
  letter-spacing:.06em;
  color:var(--text-muted);
  flex:1;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.nf-save-btn{
  font-family:var(--font-heading);
  font-size:.68rem;
  background:none;
  border:1px solid var(--border2);
  border-radius:999px;
  padding:.18rem .5rem;
  color:var(--text-dim);
  cursor:pointer;
  flex-shrink:0;
  transition:border-color .12s,color .12s;
}
.nf-save-btn:hover,.nf-save-btn:active{border-color:var(--warm);color:var(--warm)}
/* Already-saved state (set on render via savedSet, and on toggle) */
.nf-save-btn.nf-saved,.np-save.nf-saved{
  border-color:var(--teal);
  color:var(--teal);
  background:color-mix(in srgb,var(--teal) 12%,transparent);
}
.nf-ext-link{
  font-family:var(--font-code);
  font-size:.7rem;
  color:var(--text-dim);
  text-decoration:none;
  flex-shrink:0;
  padding:.18rem .3rem;
  border-radius:6px;
  transition:color .12s,background .12s;
}
.nf-ext-link:hover{color:var(--warm)}

/* ─── Article Reader overlay ─────────────────────────────────────────────── */

/* Full-page takeover (mobile + desktop): slide up over everything, including the
   browse overlay (z:150 mobile / z:200 desktop). z:250 keeps it on top always. */
.nf-reader{
  position:fixed;
  inset:0;
  z-index:9500;   /* above the universal .em-header (z:9000) so the reader's own
                     sticky top bar (back/save/read-original) isn't hidden under it */
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  background:var(--bg);
  color:var(--text);
  transform:translateY(100%);
  transition:transform .28s cubic-bezier(.22,1,.36,1);
  /* Smooth finger-tracked swipe: keep vertical scroll native, GPU-promote the
     element so live transform updates don't jank. */
  touch-action:pan-y;
  will-change:transform;
}
.nf-reader-open{transform:translateY(0)}
.nf-fade-out{opacity:0;transition:opacity .15s ease}
.nf-fade-in{opacity:1;transition:opacity .2s ease}

/* Opaque floor mounted by installReaderSwipe ONLY during a horizontal next/prev
   slide — same bg as the reader, sitting just below it (above the universal header)
   so the sliding card reveals a solid surface, never the feed list underneath. */
.nf-reader-screen{
  position:fixed;
  inset:0;
  z-index:9400;            /* below the reader (9500) / mobile modal (9600), above .em-header (9000) */
  background:var(--bg);
  pointer-events:none;     /* purely visual — never intercept taps */
}

/* Desktop: centered modal */
.nf-reader-backdrop{
  position:fixed;
  inset:0;
  z-index:9550;   /* above the universal .em-header (9000); dims everything behind the card */
  background:rgba(0,0,0,.6);
  backdrop-filter:blur(2px);
  -webkit-backdrop-filter:blur(2px);
  opacity:0;
  transition:opacity .22s ease;
  cursor:pointer;
}
.nf-reader-backdrop-open{opacity:1;}
[data-theme="light"] .nf-reader-backdrop{background:rgba(0,0,0,.35);}

.nf-reader.nf-reader-modal{
  position:fixed;
  inset:auto;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%) scale(.96);
  opacity:0;
  width:min(720px,92vw);
  max-height:88vh;
  border-radius:16px;
  z-index:9600;   /* above its backdrop (9550) and the universal header (9000) */
  box-shadow:0 24px 80px rgba(0,0,0,.5);
  border:1px solid var(--border);
  overflow-y:auto;
}
.nf-reader.nf-reader-modal.nf-reader-open{
  transform:translate(-50%,-50%) scale(1);
  opacity:1;
}
@media(max-width:760px){
  /* Force mobile reader to be full-screen slide-up even when JS adds modal class */
  .nf-reader.nf-reader-modal{
    inset:0;
    top:unset;
    left:unset;
    transform:translateY(100%);
    opacity:1;
    width:100%;
    max-height:unset;
    border-radius:0;
    box-shadow:none;
  }
  .nf-reader.nf-reader-modal.nf-reader-open{
    transform:translateY(0);
  }
  .nf-reader-backdrop{display:none;}
}

.nf-reader-top{
  position:sticky;
  top:0;
  z-index:5;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:.5rem .75rem;
  background:color-mix(in srgb,var(--bg) 85%,transparent);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border);
  gap:.5rem;
}
.nf-reader-back{
  background:none;
  border:none;
  color:var(--text);
  font-size:1.2rem;
  padding:.3rem .5rem;
  cursor:pointer;
  border-radius:8px;
  flex-shrink:0;
  transition:background .12s;
}
.nf-reader-back:hover{background:color-mix(in srgb,var(--text) 8%,transparent)}
.nf-reader-acts{
  display:flex;
  align-items:center;
  gap:.5rem;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.nf-reader-ext{
  font-family:var(--font-code);
  font-size:.62rem;
  color:var(--text-dim);
  text-decoration:none;
  padding:.2rem .4rem;
  border:1px solid var(--border2);
  border-radius:6px;
  transition:color .12s,border-color .12s;
}
.nf-reader-ext:hover{color:var(--warm);border-color:var(--warm)}

/* Desktop prev/next nav inside reader top bar */
.nf-reader-desk-nav{
  display:flex;
  align-items:center;
  gap:.35rem;
  flex-shrink:0;
}
.nf-reader-prev,.nf-reader-next{
  background:none;
  border:1px solid var(--border2);
  border-radius:6px;
  color:var(--text-dim);
  font-size:.9rem;
  padding:.15rem .45rem;
  cursor:pointer;
  transition:color .12s,border-color .12s,background .12s;
  line-height:1;
}
.nf-reader-prev:hover:not(:disabled),.nf-reader-next:hover:not(:disabled){
  color:var(--warm);
  border-color:var(--warm);
  background:color-mix(in srgb,var(--warm) 8%,transparent);
}
.nf-reader-prev:disabled,.nf-reader-next:disabled{
  opacity:.3;
  cursor:default;
}
.nf-reader-pos{
  font-family:var(--font-code);
  font-size:.55rem;
  color:var(--text-muted);
  white-space:nowrap;
}

.nf-reader-img{
  display:block;
  width:100%;
  height:40vh;
  object-fit:cover;
}
.nf-reader-body{
  padding:1rem .85rem 3rem;
  max-width:680px;
  margin:0 auto;
}
.nf-reader-meta{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:.45rem;
  margin-bottom:.65rem;
}
.nf-reader-src{
  font-family:var(--font-code);
  font-size:.52rem;
  letter-spacing:.06em;
  color:var(--text-muted);
}
.nf-reader-time{
  font-family:var(--font-code);
  font-size:.52rem;
  color:var(--text-muted);
}
.nf-reader-hl{
  font-family:var(--font-display);
  font-style:italic;
  font-size:clamp(1.3rem,5vw,1.7rem);
  font-weight:400;
  line-height:1.25;
  color:var(--text);
  margin:.25rem 0 .85rem;
}
/* Always-visible actions by the title — save + read original (esp. for phone,
   where the sticky top bar can sit under the universal header). */
.nf-reader-actions{
  display:flex;
  align-items:center;
  gap:.6rem;
  flex-wrap:wrap;
  margin:.1rem 0 1rem;
}
.nf-reader-actions .nf-save-btn,
.nf-reader-actions .nf-reader-ext{
  font-size:.72rem;
  padding:.45rem .9rem;
}
.nf-reader-summary{
  font-family:var(--font-heading);
  font-size:.95rem;
  line-height:1.75;
  color:var(--text-dim);
  margin-bottom:1rem;
}
/* #4 — per-article diagram (flow pipeline or bars chart) */
.nf-diag{
  margin:1.1rem 0 1.25rem;
  padding:1rem;
  border:1px solid var(--border);
  border-radius:12px;
  background:var(--bg2);
}
.nf-diag-h{
  font-family:var(--font-code);
  font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--text-muted);margin-bottom:.75rem;
}
.nf-diag-flow{display:flex;flex-direction:column;align-items:stretch;gap:0;}
.nf-diag-node{
  font-family:var(--font-heading);
  font-size:.85rem;font-weight:600;color:var(--text);
  text-align:center;
  padding:.6rem .8rem;
  border:1px solid color-mix(in srgb,var(--teal) 40%,var(--border));
  border-radius:10px;
  background:color-mix(in srgb,var(--teal) 7%,var(--bg-card));
}
.nf-diag-arrow{
  text-align:center;color:var(--warm);font-size:1rem;line-height:1.6;
  padding:.15rem 0;
}
.nf-diag-arrow span{
  font-family:var(--font-code);font-size:.6rem;letter-spacing:.04em;
  color:var(--text-muted);text-transform:none;
}
.nf-diag-bars{display:flex;flex-direction:column;gap:.8rem;}
/* Label sits on its own line above the bar so long labels wrap in full and are
   never truncated; the bar + value share the line below. */
.nf-diag-bar-row{display:flex;flex-direction:column;gap:.28rem;}
.nf-diag-bar-label{
  font-family:var(--font-heading);font-size:.8rem;color:var(--text-dim);
  line-height:1.25;white-space:normal;overflow-wrap:anywhere;
}
.nf-diag-bar-line{display:flex;align-items:center;gap:.6rem;}
.nf-diag-bar-track{flex:1;height:.7rem;border-radius:999px;background:var(--bg3);overflow:hidden;}
.nf-diag-bar-fill{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--teal),var(--warm));}
.nf-diag-bar-val{font-family:var(--font-code);font-size:.72rem;color:var(--text);flex:0 0 auto;min-width:2.2rem;text-align:right;}

/* #12 — Key Questions (expandable Q&A) */
.nf-reader-qa{margin:1.1rem 0 1.25rem;}
.nf-qa-h{
  font-family:var(--font-code);
  font-size:.6rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--text-muted);
  margin-bottom:.5rem;
}
.nf-qa-item{
  border:1px solid var(--border);
  border-radius:10px;
  margin-bottom:.5rem;
  background:var(--bg2);
  overflow:hidden;
}
.nf-qa-item summary{
  cursor:pointer;
  list-style:none;
  padding:.7rem .85rem;
  font-family:var(--font-heading);
  font-size:.9rem;
  font-weight:600;
  color:var(--text);
  position:relative;
  padding-right:2rem;
}
.nf-qa-item summary::-webkit-details-marker{display:none;}
.nf-qa-item summary::after{
  content:"+";
  position:absolute;right:.85rem;top:.6rem;
  font-family:var(--font-code);color:var(--warm);font-size:1.1rem;line-height:1;
}
.nf-qa-item[open] summary::after{content:"–";}
.nf-qa-a{
  padding:0 .85rem .8rem;
  font-family:var(--font-heading);
  font-size:.88rem;
  line-height:1.7;
  color:var(--text-dim);
}
.nf-reader-why{
  font-family:var(--font-heading);
  font-size:.9rem;
  line-height:1.7;
  color:var(--text);
  padding:.65rem .8rem;
  border-left:3px solid var(--warm);
  background:color-mix(in srgb,var(--warm) 6%,var(--bg2));
  border-radius:0 8px 8px 0;
  margin-bottom:1.25rem;
}
.nf-reader-readmore{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  font-family:var(--font-code);
  font-size:.72rem;
  letter-spacing:.04em;
  text-decoration:none;
  color:var(--bg);
  background:var(--warm);
  padding:.6rem 1rem;
  border-radius:8px;
  margin:.25rem 0 1.25rem;
  transition:filter .15s ease,transform .15s ease;
}
.nf-reader-readmore:hover{filter:brightness(1.08);transform:translateY(-1px)}
.nf-reader-nav-hint{
  font-family:var(--font-code);
  font-size:.58rem;
  letter-spacing:.1em;
  color:var(--text-muted);
  text-align:center;
  padding-top:1.5rem;
  opacity:.7;
}

/* ─── Bottom sheets (options + editions) ─────────────────────────────────── */

.nf-scrim{
  position:fixed;
  inset:0;
  z-index:90;
  background:rgba(0,0,0,.45);
  opacity:0;
  transition:opacity .22s ease;
}
.nf-scrim-visible{opacity:1}

.nf-sheet{
  position:fixed;
  bottom:0;
  left:0;
  right:0;
  z-index:91;
  background:var(--bg2);
  border-radius:18px 18px 0 0;
  padding:0 0 1.5rem;
  max-height:78vh;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  transform:translateY(100%);
  transition:transform .25s cubic-bezier(.22,1,.36,1);
}
.nf-sheet-open{transform:translateY(0)}

.nf-sheet-handle{
  width:36px;
  height:4px;
  background:var(--border2);
  border-radius:999px;
  margin:.7rem auto .2rem;
}
.nf-sheet-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:.5rem 1.1rem .6rem;
  border-bottom:1px solid var(--border);
  margin-bottom:.25rem;
}
.nf-sheet-title{
  font-family:var(--font-heading);
  font-size:.85rem;
  font-weight:600;
  color:var(--text);
}
.nf-sheet-close{
  background:none;
  border:none;
  color:var(--text-muted);
  font-size:.9rem;
  cursor:pointer;
  padding:.25rem .4rem;
  border-radius:6px;
  transition:background .12s,color .12s;
}
.nf-sheet-close:hover{background:color-mix(in srgb,var(--text) 8%,transparent);color:var(--text)}

.nf-sheet-section{
  padding:.75rem 1.1rem .5rem;
  border-bottom:1px solid var(--border);
}
.nf-sheet-section:last-child{border-bottom:none}
.nf-sheet-label{
  font-family:var(--font-code);
  font-size:.52rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--text-muted);
  margin-bottom:.5rem;
}
.nf-sheet-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  width:100%;
  font-family:var(--font-heading);
  font-size:.84rem;
  color:var(--text-dim);
  background:none;
  border:none;
  text-align:left;
  padding:.45rem .3rem;
  border-radius:8px;
  cursor:pointer;
  transition:background .12s,color .12s;
}
.nf-sheet-row:hover{background:color-mix(in srgb,var(--text) 6%,transparent)}
.nf-sheet-row-on{color:var(--warm);background:color-mix(in srgb,var(--warm) 10%,transparent)}
.nf-sheet-count{
  font-family:var(--font-code);
  font-size:.56rem;
  color:var(--text-muted);
}

/* Calendar in sheet — reuse .np-cg tokens */
.nf-sheet-section .np-cg{
  margin-top:.35rem;
}

/* ─── Audio buttons (.nf-audio-btn / .np-audio-btn) ──────────────────────── */

/* Shared base — used on both desktop (.np-audio-btn) and mobile (.nf-audio-btn) */
.nf-audio-btn,.np-audio-btn{
  font-family:var(--font-code);
  font-size:.58rem;
  letter-spacing:.04em;
  background:none;
  border:1px solid var(--border2);
  border-radius:999px;
  padding:.18rem .6rem;
  color:var(--text-dim);
  cursor:pointer;
  flex-shrink:0;
  transition:background .14s,color .14s,border-color .14s;
  line-height:1.4;
}
.nf-audio-btn:hover,.np-audio-btn:hover{
  border-color:var(--warm);
  color:var(--warm);
  background:color-mix(in srgb,var(--warm) 8%,transparent);
}
/* Active / playing state */
.nf-audio-btn.nf-audio-playing,.np-audio-btn.nf-audio-playing{
  background:var(--warm);
  color:#1a1612;
  border-color:var(--warm);
}
/* Lesson variant — slight teal tint when idle */
.nf-audio-lesson{
  border-color:color-mix(in srgb,var(--teal) 40%,var(--border2));
  color:var(--teal);
}
.nf-audio-lesson:hover{
  border-color:var(--teal);
  color:var(--teal);
  background:color-mix(in srgb,var(--teal) 8%,transparent);
}
.nf-audio-lesson.nf-audio-playing{
  background:var(--teal);
  color:#1a1612;
  border-color:var(--teal);
}

/* Compact mini play button (card acts row) */
.nf-audio-mini{
  font-size:.68rem;
  padding:.18rem .45rem;
  line-height:1;
}

/* Audio bar in article reader */
.nf-audio-bar{
  display:flex;
  gap:.5rem;
  align-items:center;
  flex-wrap:wrap;
  margin:.5rem 0 .9rem;
  padding:.55rem .7rem;
  background:color-mix(in srgb,var(--warm) 6%,var(--bg2));
  border:1px solid color-mix(in srgb,var(--warm) 25%,var(--border));
  border-radius:10px;
}
.nf-audio-bar-btn{
  font-size:.62rem;
  padding:.22rem .75rem;
}

/* Desktop: audio bar buttons inside .np-acts */
.np-audio-btn{
  font-size:.58rem;
}

/* ─── Desktop source/topic tappables ─────────────────────────────────────── */
.np-src-link{
  cursor:pointer;
  transition:color .12s;
}
.np-src-link:hover{color:var(--warm);}

.np-topics{
  display:flex;
  flex-wrap:wrap;
  gap:.3rem;
  margin:.45rem 0 .25rem;
}
.np-topic-chip{
  font-family:var(--font-code);
  font-size:.5rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  border:1px solid var(--border2);
  border-radius:4px;
  padding:.1rem .35rem;
  color:var(--text-muted);
  transition:color .12s,border-color .12s,background .12s;
}
.np-topic-link{
  cursor:pointer;
}
.np-topic-link:hover{
  color:var(--teal);
  border-color:var(--teal);
  background:color-mix(in srgb,var(--teal) 8%,transparent);
}

/* ─── Desktop Browse Panel ────────────────────────────────────────────────── */
.np-browse-panel{
  position:fixed;
  top:0;
  right:0;
  bottom:0;
  z-index:200;
  width:clamp(320px,36vw,480px);
  background:var(--bg2);
  border-left:1px solid var(--border2);
  display:flex;
  flex-direction:column;
  transform:translateX(100%);
  transition:transform .26s cubic-bezier(.22,1,.36,1);
  box-shadow:-4px 0 32px color-mix(in srgb,var(--text) 8%,transparent);
}
.np-browse-panel.np-browse-open{transform:translateX(0);}

.np-browse-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:.75rem 1.1rem;
  border-bottom:1px solid var(--border);
  flex-shrink:0;
}
.np-browse-title{
  font-family:var(--font-heading);
  font-size:.88rem;
  font-weight:600;
  color:var(--text);
}
.np-browse-title em{
  font-style:normal;
  color:var(--warm);
}
.np-browse-close{
  background:none;
  border:none;
  color:var(--text-muted);
  font-size:.9rem;
  cursor:pointer;
  padding:.25rem .4rem;
  border-radius:6px;
  transition:background .12s,color .12s;
}
.np-browse-close:hover{background:color-mix(in srgb,var(--text) 8%,transparent);color:var(--text);}

.np-browse-body{
  flex:1;
  overflow-y:auto;
  padding:.5rem 0 2rem;
}
.np-browse-loading,.np-browse-empty{
  padding:2rem 1.1rem;
  text-align:center;
  font-family:var(--font-heading);
  font-size:.85rem;
  color:var(--text-muted);
}
.np-browse-empty em{font-style:italic;color:var(--text-dim);}

.np-browse-row{
  padding:.7rem 1.1rem;
  border-bottom:1px solid var(--border);
  transition:background .12s;
}
.np-browse-row:last-child{border-bottom:none;}
.np-browse-row:hover{background:color-mix(in srgb,var(--text) 3%,transparent);}

.np-browse-row-meta{
  display:flex;
  align-items:center;
  gap:.5rem;
  margin-bottom:.25rem;
}
.np-browse-src{
  font-family:var(--font-code);
  font-size:.5rem;
  letter-spacing:.08em;
  color:var(--warm);
  text-transform:uppercase;
}
.np-browse-date{
  font-family:var(--font-code);
  font-size:.5rem;
  color:var(--text-muted);
}
.np-browse-title-link{
  display:block;
  font-family:var(--font-heading);
  font-size:.88rem;
  font-weight:600;
  line-height:1.35;
  color:var(--text);
  text-decoration:none;
  margin-bottom:.2rem;
  transition:color .12s;
}
a.np-browse-title-link:hover{color:var(--warm);}
.np-browse-snippet{
  font-family:var(--font-heading);
  font-size:.78rem;
  line-height:1.55;
  color:var(--text-dim);
  margin:0;
}

/* ─── Browse feed grid (unified overlay — uses plain responsive .nf-grid) ─── */
/* Padding wrapper around the .nf-grid inside the browse overlay feed screen */
.nf-browse-feed-grid {
  padding: .5rem .75rem 2rem;
}
@media(min-width:761px){
  .nf-browse-feed-grid {
    padding: .75rem 1.25rem 2.5rem;
  }
}

/* ─── Mobile source/topic tappables ──────────────────────────────────────── */
.nf-card-src-tap{
  cursor:pointer;
  transition:color .12s;
}
.nf-card-src-tap:hover,.nf-card-src-tap:active{color:var(--warm);}

.nf-reader-src-tap{
  cursor:pointer;
  transition:color .12s;
  text-decoration:underline;
  text-underline-offset:2px;
  text-decoration-style:dotted;
}
.nf-reader-src-tap:hover,.nf-reader-src-tap:active{color:var(--warm);}

/* Reader topic chips */
.nf-reader-topics{
  display:flex;
  flex-wrap:wrap;
  gap:.35rem;
  margin:1rem 0 .75rem;
}
.nf-topic-chip{
  font-family:var(--font-code);
  font-size:.52rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  border:1px solid var(--border2);
  border-radius:4px;
  padding:.12rem .38rem;
  color:var(--text-muted);
  transition:color .12s,border-color .12s,background .12s;
}
.nf-topic-link{
  cursor:pointer;
}
.nf-topic-link:active,.nf-topic-link:hover{
  color:var(--teal);
  border-color:var(--teal);
  background:color-mix(in srgb,var(--teal) 10%,transparent);
}

/* ─── Mobile Browse Overlay (.nf-browse) ─────────────────────────────────── */
.nf-browse{
  position:fixed;
  inset:0;
  z-index:150;
  background:var(--bg);
  color:var(--text);
  display:flex;
  flex-direction:column;
  transform:translateX(100%);
  transition:transform .28s cubic-bezier(.22,1,.36,1);
}
.nf-browse-open{transform:translateX(0);}

.nf-browse-top{
  position:sticky;
  top:0;
  z-index:5;
  display:flex;
  align-items:center;
  gap:.6rem;
  padding:.5rem .75rem;
  background:color-mix(in srgb,var(--bg) 85%,transparent);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border);
  flex-shrink:0;
}
.nf-browse-back{
  background:none;
  border:none;
  color:var(--text);
  font-size:1.2rem;
  padding:.3rem .5rem;
  cursor:pointer;
  border-radius:8px;
  flex-shrink:0;
  transition:background .12s;
}
.nf-browse-back:hover{background:color-mix(in srgb,var(--text) 8%,transparent);}
.nf-browse-heading{
  font-family:var(--font-heading);
  font-size:.88rem;
  font-weight:600;
  color:var(--text);
  flex:1;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.nf-browse-heading em{
  font-style:normal;
  color:var(--warm);
}

.nf-browse-scroll{
  flex:1;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  padding:0;
}
.nf-browse-list{
  display:flex;
  flex-direction:column;
  gap:0;
}
.nf-browse-loading,.nf-browse-empty{
  padding:2.5rem 1rem;
  text-align:center;
  font-family:var(--font-heading);
  font-size:.88rem;
  color:var(--text-muted);
}
.nf-browse-empty em{font-style:italic;color:var(--text-dim);}

.nf-browse-item{
  padding:.75rem 0;
  border-bottom:1px solid var(--border);
}
.nf-browse-item:last-child{border-bottom:none;}

.nf-browse-item-meta{
  display:flex;
  align-items:center;
  gap:.45rem;
  margin-bottom:.2rem;
}
.nf-browse-item-src{
  font-family:var(--font-code);
  font-size:.5rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--warm);
}
.nf-browse-item-date{
  font-family:var(--font-code);
  font-size:.5rem;
  color:var(--text-muted);
}
.nf-browse-item-title{
  display:block;
  font-family:var(--font-heading);
  font-size:.95rem;
  font-weight:600;
  line-height:1.35;
  color:var(--text);
  text-decoration:none;
  margin-bottom:.25rem;
}
a.nf-browse-item-title:active,a.nf-browse-item-title:hover{color:var(--warm);}
.nf-browse-item-snippet{
  font-family:var(--font-heading);
  font-size:.82rem;
  line-height:1.55;
  color:var(--text-dim);
  margin:0;
}

/* ─── Sources Catalog Overlay ────────────────────────────────────────────── */
/* Reuses .nf-browse full-screen slide pattern; adds catalog-specific internals */

.nf-sources-catalog .nf-browse-scroll{
  padding:0;
}

/* Segmented [ Sources | Tasks ] toggle atop Screen A */
.nf-catalog-tabs{
  display:flex;
  gap:0;
  align-items:center;
  margin:.7rem auto;
  width:max-content;
  max-width:calc(100% - 2rem);
  background:var(--bg2);
  border:1px solid var(--border);
  border-radius:999px;
  padding:3px;
}
.nf-catalog-tab{
  font-family:var(--font-heading);
  font-size:.78rem;
  font-weight:500;
  border:none;
  background:none;
  color:var(--text-muted);
  padding:.35rem 1.1rem;
  border-radius:999px;
  cursor:pointer;
  white-space:nowrap;
  transition:background .15s,color .15s;
}
.nf-catalog-tab.nf-catalog-tab-on{
  background:var(--warm);
  color:#1a1612;
}
.nf-catalog-tab:not(.nf-catalog-tab-on):hover{
  background:color-mix(in srgb,var(--text) 8%,transparent);
  color:var(--text);
}

/* Tasks grid (Tasks tab) — domain chips */
.nf-task-grid{
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
  padding:.25rem 1rem 3rem;
}
.nf-task-chip{
  font-family:var(--font-heading);
  font-size:.82rem;
  font-weight:500;
  color:var(--text);
  background:var(--bg2);
  border:1px solid var(--border);
  border-radius:999px;
  padding:.5rem .9rem;
  cursor:pointer;
  line-height:1.25;
  transition:background .12s,border-color .12s,color .12s;
}
.nf-task-chip:hover,.nf-task-chip:active{
  background:color-mix(in srgb,var(--warm) 14%,var(--bg2));
  border-color:var(--warm);
  color:var(--text);
}
.nf-task-chip-lg{
  font-size:.95rem;font-weight:600;padding:.8rem 1.3rem;
  background:linear-gradient(135deg,color-mix(in srgb,var(--warm) 18%,var(--bg2)),var(--bg2));
}
.nf-trending-note{
  font-family:var(--font-code);
  font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--text-muted);
  padding:.3rem 1rem .2rem;
}
.nf-trending-sub{ margin-top:.6rem;color:var(--text-dim);border-top:1px solid var(--border);padding-top:.7rem; }

.nf-src-sections{
  padding:.5rem 0 3rem;
}

/* Category section */
.nf-src-section{
  border-bottom:1px solid var(--border);
}
.nf-src-section:last-child{
  border-bottom:none;
}

/* Category header row (toggle button) */
.nf-src-cat-hdr{
  display:flex;
  align-items:center;
  width:100%;
  gap:.6rem;
  padding:.75rem 1rem;
  background:none;
  border:none;
  text-align:left;
  cursor:pointer;
  transition:background .12s;
}
.nf-src-cat-hdr:hover{
  background:color-mix(in srgb,var(--text) 4%,transparent);
}
.nf-src-cat-label{
  font-family:var(--font-code);
  font-size:.56rem;
  font-weight:700;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--text);
  flex-shrink:0;
}
.nf-src-cat-meta{
  font-family:var(--font-code);
  font-size:.5rem;
  letter-spacing:.06em;
  color:var(--text-muted);
  flex:1;
}
.nf-src-cat-arrow{
  font-size:.75rem;
  color:var(--text-muted);
  flex-shrink:0;
  transition:transform .18s ease;
  display:inline-block;
}
.nf-src-section-open .nf-src-cat-arrow{
  transform:rotate(0deg); /* already shows ▾ in open state via JS text */
}

/* Collapsible rows container */
.nf-src-rows{
  display:none;
  flex-direction:column;
  padding-bottom:.35rem;
}
.nf-src-section-open .nf-src-rows{
  display:flex;
}

/* Individual source row */
.nf-src-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  padding:.55rem 1rem .55rem 1.25rem;
  background:none;
  border:none;
  border-top:1px solid var(--border);
  text-align:left;
  cursor:pointer;
  gap:.75rem;
  transition:background .12s;
}
.nf-src-row:hover,.nf-src-row:active{
  background:color-mix(in srgb,var(--warm) 6%,transparent);
}
.nf-src-row-name{
  font-family:var(--font-heading);
  font-size:.88rem;
  font-weight:500;
  color:var(--text);
  flex:1;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.nf-src-row-meta{
  display:flex;
  align-items:center;
  gap:.5rem;
  flex-shrink:0;
}
.nf-src-row-count{
  font-family:var(--font-code);
  font-size:.5rem;
  color:var(--text-muted);
  white-space:nowrap;
}
.nf-src-row-chev{
  font-size:.75rem;
  color:var(--text-muted);
}

/* ─── Unified Browse Overlay (.nf-browse-overlay) ────────────────────────── */
/* Mobile: inherits .nf-browse full-screen slide-from-right exactly as-is.    */
/* Desktop: large centered modal (max 1100px for 3-col card grid).            */

/* Backdrop (desktop only — created in JS, hidden on mobile via display:none) */
.nf-browse-backdrop {
  position: fixed;
  inset: 0;
  z-index: 149; /* just below .nf-browse (z:150) */
  background: rgba(0,0,0,.55);
  opacity: 0;
  transition: opacity .22s ease;
}
.nf-browse-backdrop-open { opacity: 1; }
[data-theme="light"] .nf-browse-backdrop { background: rgba(0,0,0,.35); }
@media(max-width:760px){
  .nf-browse-backdrop { display: none; }
}

/* Close ✕ button (top-right, Screen A and B) */
.nf-browse-close-x {
  background: none;
  border: none;
  color: var(--text-muted);
  font-size: .9rem;
  cursor: pointer;
  padding: .25rem .45rem;
  border-radius: 6px;
  flex-shrink: 0;
  transition: background .12s, color .12s;
  margin-left: auto;
}
.nf-browse-close-x:hover { background: color-mix(in srgb,var(--text) 8%,transparent); color: var(--text); }

/* "‹ Sources" back button (Screen B header) */
.nf-browse-back-cat {
  background: none;
  border: none;
  color: var(--warm);
  font-family: var(--font-heading);
  font-size: .78rem;
  font-weight: 600;
  cursor: pointer;
  padding: .25rem .45rem .25rem .1rem;
  border-radius: 6px;
  flex-shrink: 0;
  white-space: nowrap;
  transition: color .12s, background .12s;
}
.nf-browse-back-cat:hover { background: color-mix(in srgb,var(--warm) 8%,transparent); }

@media(min-width:761px){
  .nf-browse-overlay {
    /* Override the full-screen inset from .nf-browse */
    inset: auto;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-46%) scale(.97);
    opacity: 0;
    width: min(1100px, 94vw);
    max-height: 88vh;
    border-radius: 18px;
    box-shadow: 0 24px 80px rgba(0,0,0,.4);
    z-index: 200;
    overflow: hidden;
    transition: transform .28s cubic-bezier(.22,1,.36,1), opacity .22s ease;
  }
  .nf-browse-overlay.nf-browse-open {
    transform: translate(-50%,-50%) scale(1);
    opacity: 1;
  }
  .nf-browse-overlay .nf-browse-scroll {
    max-height: calc(88vh - 52px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
}
/* On mobile the overlay uses the default .nf-browse slide-from-right */
@media(max-width:760px){
  .nf-browse-overlay {
    transform: translateX(100%);
    opacity: 1;
    border-radius: 0;
    box-shadow: none;
    inset: 0;
    top: 0;
    left: 0;
    width: 100%;
    max-height: unset;
  }
  /* CRITICAL: two-class selector so the open state beats the (later, one-class)
     .nf-browse-overlay base rule above — without this the overlay stays off-screen
     on phone (page appears frozen: body is overflow:hidden but nothing slides in). */
  .nf-browse-overlay.nf-browse-open {
    transform: translateX(0);
  }
}

/* "Sources" sheet row chevron indicator */
.nf-sheet-chev{
  font-size:.75rem;
  opacity:.7;
}

/* ─── Daily Brief — entry pill (cards + paper) ──────────────────────────── */

/* Cards view: brief area sits between leader and chips */
.nf-brief-area{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:.55rem;
  flex-wrap:wrap;
  padding:.6rem .75rem .2rem;
}
/* The ✦ Sparks button beside the brief pill (today's and past editions); lift it
   off the subbar's glow animation so it reads as a quiet companion to the audio. */
.nf-brief-area .nf-sparks-launch{animation:none;align-self:center;}
@media(min-width:761px){
  .nf-brief-area{
    padding:.7rem 1.5rem .3rem;
    max-width:1100px;
    margin:0 auto;
    box-sizing:border-box;
  }
}

/* Paper view: brief area sits below the date line in the masthead */
.np-brief-area{
  display:flex;
  justify-content:center;
  padding:.55rem 0 .1rem;
}

/* The brief control — a big, glowing, irresistible play/pause button. */
.nf-brief-area{padding-top:.9rem;padding-bottom:.6rem;}
.nf-brief-pill{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:.7rem;
  font-family:var(--font-heading);
  text-align:left;
  background:linear-gradient(135deg,var(--warm),var(--warm2));
  color:#1a1612;
  border:none;
  border-radius:999px;
  padding:.7rem 1.5rem .7rem .85rem;
  cursor:pointer;
  transition:transform .16s var(--ease-spring),box-shadow .25s ease,filter .15s;
  box-shadow:0 4px 22px color-mix(in srgb,var(--warm) 50%,transparent),
             0 0 0 0 color-mix(in srgb,var(--warm) 60%,transparent);
  white-space:nowrap;
  animation:nfBriefGlow 2.8s ease-in-out infinite;
}
/* The play/pause glyph in a glassy circle */
.nf-brief-ico{
  display:inline-flex;align-items:center;justify-content:center;
  width:2.4rem;height:2.4rem;flex:none;
  border-radius:50%;
  background:rgba(26,22,18,.16);
  box-shadow:inset 0 0 0 1px rgba(26,22,18,.18);
}
.nf-brief-ico svg{display:block;transform:translateX(1px);}   /* optical-center the play triangle */
.nf-brief-playing .nf-brief-ico svg{transform:none;}
.nf-brief-text{display:flex;flex-direction:column;line-height:1.15;}
/* High-contrast dark text on the warm button (unique classes — the sticky
   mini-player also defines .nf-brief-label, which must NOT bleed in here). */
.nf-brief-cta-label{font-size:.95rem;font-weight:700;letter-spacing:.005em;color:#1a1612;text-transform:none;}
.nf-brief-cta-sub{font-size:.62rem;font-weight:600;color:#1a1612;opacity:.82;font-family:var(--font-code);letter-spacing:.04em;text-transform:uppercase;margin-top:.14rem;}
.nf-brief-pill:hover{
  transform:translateY(-2px) scale(1.02);
  filter:brightness(1.05);
  box-shadow:0 8px 30px color-mix(in srgb,var(--warm) 60%,transparent);
}
.nf-brief-pill:active{transform:scale(.98);}
/* Pulsing glow that stops once it's actually playing (calmer while you listen). */
@keyframes nfBriefGlow{
  0%,100%{box-shadow:0 4px 22px color-mix(in srgb,var(--warm) 45%,transparent),0 0 0 0 color-mix(in srgb,var(--warm) 55%,transparent);}
  50%{box-shadow:0 6px 28px color-mix(in srgb,var(--warm) 60%,transparent),0 0 0 7px color-mix(in srgb,var(--warm) 0%,transparent);}
}
.nf-brief-playing{animation:none;box-shadow:0 4px 20px color-mix(in srgb,var(--warm) 45%,transparent);}
.nf-brief-playing .nf-brief-ico{background:rgba(26,22,18,.26);}
@media(prefers-reduced-motion:reduce){.nf-brief-pill{animation:none;}}
[data-theme="light"] .nf-brief-pill{box-shadow:0 4px 18px color-mix(in srgb,var(--warm) 40%,rgba(0,0,0,.1));}

/* ─── Daily Brief — sticky mini-player bar ──────────────────────────────── */

.nf-brief-bar{
  position:fixed;
  bottom:0;
  left:0;
  right:0;
  z-index:300;
  background:color-mix(in srgb,var(--bg2) 95%,transparent);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-top:1px solid color-mix(in srgb,var(--warm) 30%,var(--border));
  box-shadow:0 -4px 24px color-mix(in srgb,var(--warm) 12%,transparent);
  transform:translateY(100%);
  transition:transform .28s cubic-bezier(.22,1,.36,1);
  /* Keep above sheets (z:91) and browse panels (z:200) */
}
.nf-brief-bar-open{transform:translateY(0);}

.nf-brief-inner{
  display:grid;
  grid-template-columns:1fr auto;
  grid-template-rows:auto auto;
  align-items:center;
  gap:.2rem .75rem;
  padding:.55rem .85rem .5rem;
  max-width:1100px;
  margin:0 auto;
  box-sizing:border-box;
}
@media(min-width:761px){
  .nf-brief-inner{
    grid-template-columns:1fr auto auto;
    grid-template-rows:auto;
    gap:0 1rem;
    padding:.6rem 1.5rem;
    align-items:center;
  }
}

/* Info block: label + title + position */
.nf-brief-info{
  display:flex;
  align-items:baseline;
  gap:.45rem;
  min-width:0;
  overflow:hidden;
}
.nf-brief-label{
  font-family:var(--font-code);
  font-size:.48rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--warm);
  flex-shrink:0;
}
.nf-brief-title{
  font-family:var(--font-heading);
  font-size:.8rem;
  font-weight:500;
  color:var(--text);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  flex:1;
  min-width:0;
}
.nf-brief-pos{
  font-family:var(--font-code);
  font-size:.52rem;
  color:var(--text-muted);
  flex-shrink:0;
  white-space:nowrap;
}

/* Progress bar — spans full inner width on mobile, sits between info+ctrls on desktop */
.nf-brief-progress{
  height:2px;
  background:color-mix(in srgb,var(--warm) 20%,var(--border));
  border-radius:999px;
  overflow:hidden;
  grid-column:1/-1;
}
@media(min-width:761px){
  .nf-brief-progress{
    grid-column:unset;
    width:120px;
    flex-shrink:0;
    align-self:center;
    margin:0 .25rem;
  }
}
.nf-brief-fill{
  height:100%;
  background:var(--warm);
  border-radius:999px;
  transition:width .5s linear;
}

/* Control buttons row */
.nf-brief-ctrls{
  display:flex;
  align-items:center;
  gap:.2rem;
  flex-shrink:0;
}
.nf-brief-btn{
  background:none;
  border:none;
  color:var(--text-dim);
  font-size:.9rem;
  padding:.3rem .4rem;
  cursor:pointer;
  border-radius:7px;
  line-height:1;
  transition:background .12s,color .12s;
}
.nf-brief-btn:hover:not(:disabled){
  background:color-mix(in srgb,var(--warm) 12%,transparent);
  color:var(--warm);
}
.nf-brief-btn:disabled{opacity:.3;cursor:default;}
.nf-brief-playpause{
  font-size:1.05rem;
  color:var(--warm);
  padding:.3rem .45rem;
}
.nf-brief-close{
  color:var(--text-muted);
  font-size:.75rem;
}
.nf-brief-close:hover:not(:disabled){
  background:color-mix(in srgb,var(--text) 8%,transparent);
  color:var(--text);
}

/* ─── Bookmarks: gate, action menu/sheet, folder/note, toast (bookmarks.js) ─── */
.bm-gate{position:fixed;inset:0;z-index:9700;display:flex;align-items:center;justify-content:center;padding:1.2rem;
  background:color-mix(in srgb,var(--bg) 70%,transparent);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
  opacity:0;transition:opacity .2s ease}
.bm-gate.show{opacity:1}
.bm-gate-card{width:min(420px,94vw);background:var(--bg-card);border:1px solid var(--border);border-radius:18px;
  padding:2rem 1.6rem;text-align:center;box-shadow:0 24px 70px rgba(0,0,0,.45);transform:translateY(10px);transition:transform .24s var(--ease-spring,cubic-bezier(.22,1,.36,1))}
.bm-gate.show .bm-gate-card{transform:translateY(0)}
.bm-gate-eyebrow{font-family:var(--font-code,'Space Mono',monospace);font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--warm);margin-bottom:.9rem}
.bm-gate-card h2{font-family:var(--font-display,'DM Serif Display',serif);font-weight:400;font-size:1.7rem;line-height:1.15;color:var(--text);margin:0 0 .6rem}
.bm-gate-card p{font-family:var(--font-heading,'Outfit',sans-serif);font-size:.92rem;line-height:1.55;color:var(--text-dim);margin:0 0 1.5rem}
.bm-gate-btn{display:inline-flex;align-items:center;gap:.7rem;font-family:var(--font-heading,'Outfit',sans-serif);font-weight:600;font-size:1rem;
  width:100%;justify-content:center;padding:.8rem 1.2rem;border-radius:12px;border:1px solid var(--border);background:var(--bg2);color:var(--text);cursor:pointer;transition:border-color .15s}
.bm-gate-btn:hover{border-color:var(--warm)}
.bm-gate-btn svg{width:20px;height:20px;flex:0 0 20px}
.bm-gate-links{margin-top:1.1rem}
.bm-gate-links a{font-family:var(--font-code,'Space Mono',monospace);font-size:.72rem;color:var(--text-muted);text-decoration:none}
.bm-gate-links a:hover{color:var(--warm)}

/* sheet (phone) / popover (desktop) */
.bm-scrim{position:fixed;inset:0;z-index:9650;opacity:0;transition:opacity .2s ease}
.bm-scrim.show{opacity:1}
.bm-scrim-sheet{background:color-mix(in srgb,var(--bg) 55%,transparent);display:flex;align-items:flex-end}
.bm-scrim-pop{background:transparent}
.bm-panel{background:var(--bg-card);border:1px solid var(--border);box-shadow:0 18px 50px rgba(0,0,0,.4);overflow:hidden}
.bm-scrim-sheet .bm-panel{width:100%;border-radius:18px 18px 0 0;border-bottom:0;padding:.5rem .5rem calc(.6rem + env(safe-area-inset-bottom));transform:translateY(100%);transition:transform .26s var(--ease-spring,cubic-bezier(.22,1,.36,1))}
.bm-scrim-sheet.show .bm-panel{transform:translateY(0)}
.bm-scrim-pop .bm-panel{width:248px;border-radius:12px;padding:.35rem;opacity:0;transform:translateY(-4px);transition:opacity .15s ease,transform .15s ease}
.bm-scrim-pop.show .bm-panel{opacity:1;transform:translateY(0)}
.bm-panel-title{font-family:var(--font-heading,'Outfit',sans-serif);font-weight:600;font-size:.82rem;color:var(--text-dim);padding:.5rem .7rem .3rem}
.bm-panel-body{display:flex;flex-direction:column;gap:.1rem}
.bm-row{display:flex;align-items:center;gap:.6rem;width:100%;text-align:left;font-family:var(--font-heading,'Outfit',sans-serif);font-size:.95rem;
  padding:.7rem .7rem;border:0;border-radius:9px;background:none;color:var(--text);cursor:pointer;transition:background .12s}
.bm-row:hover{background:color-mix(in srgb,var(--text) 7%,transparent)}
.bm-row-ic{flex:0 0 1.2rem;text-align:center;color:var(--text-dim)}
.bm-row-tag{margin-left:auto;font-family:var(--font-code,'Space Mono',monospace);font-size:.58rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);border:1px solid var(--border);border-radius:999px;padding:.05rem .4rem}
.bm-row-soon{color:var(--text-muted);cursor:default}
.bm-row-soon:hover{background:none}
.bm-row-new{color:var(--warm)}
.bm-divider{height:1px;background:var(--border);margin:.3rem .4rem}
.bm-sheet-actions{display:flex;justify-content:flex-end;gap:.5rem;padding:.6rem .5rem .2rem}
.bm-btn-ghost{font-family:var(--font-heading,'Outfit',sans-serif);font-size:.85rem;padding:.45rem .9rem;border-radius:999px;border:1px solid var(--border);background:none;color:var(--text-dim);cursor:pointer}
.bm-btn-primary{font-family:var(--font-heading,'Outfit',sans-serif);font-weight:600;font-size:.85rem;padding:.45rem 1.1rem;border-radius:999px;border:0;background:var(--warm);color:#1a1612;cursor:pointer}
.bm-note-input{width:100%;box-sizing:border-box;font-family:var(--font-heading,'Outfit',sans-serif);font-size:.95rem;line-height:1.5;
  background:var(--bg2);border:1px solid var(--border);border-radius:10px;color:var(--text);padding:.7rem .8rem;resize:vertical;margin:.3rem .2rem 0}

.bm-toast{position:fixed;left:50%;bottom:calc(1.2rem + env(safe-area-inset-bottom));transform:translate(-50%,12px);z-index:9750;
  display:flex;align-items:center;gap:.9rem;max-width:min(440px,92vw);
  background:var(--bg-card);border:1px solid var(--border);border-radius:12px;box-shadow:0 12px 36px rgba(0,0,0,.4);
  padding:.7rem 1rem;opacity:0;transition:opacity .2s ease,transform .2s ease}
.bm-toast.show{opacity:1;transform:translate(-50%,0)}
.bm-toast-msg{font-family:var(--font-heading,'Outfit',sans-serif);font-size:.9rem;color:var(--text)}
.bm-toast-act{font-family:var(--font-heading,'Outfit',sans-serif);font-weight:600;font-size:.85rem;white-space:nowrap;
  background:none;border:0;color:var(--warm);cursor:pointer;padding:.2rem .2rem}
[data-theme="light"] .bm-gate-card,[data-theme="light"] .bm-panel,[data-theme="light"] .bm-toast{box-shadow:0 16px 44px rgba(0,0,0,.16)}
.nf-more-btn{font:inherit;font-size:1rem;line-height:1;background:none;border:1px solid var(--np-rule,var(--border));border-radius:999px;
  color:var(--text-dim);cursor:pointer;padding:.15rem .5rem;margin-left:auto}
.nf-more-btn:hover{color:var(--text);border-color:var(--warm)}

/* ── Hybrid search bar (its own full-width row above the chips) ── */
.nf-search{display:flex;align-items:center;gap:.5rem;margin:.7rem .75rem 0;padding:.5rem .8rem;
  background:var(--bg2);border:1px solid var(--border);border-radius:12px;box-sizing:border-box}
@media(min-width:761px){.nf-search{max-width:1100px;margin:.8rem auto 0}}
.nf-search:focus-within{border-color:color-mix(in srgb,var(--warm) 45%,transparent)}
.nf-search-ic{flex:none;color:var(--text-dim);font-size:1.05rem;line-height:1}
.nf-search-input{flex:1;min-width:0;border:0;background:none;outline:none;color:var(--text);
  font-family:var(--font-heading);font-size:.92rem}
.nf-search-input::placeholder{color:var(--text-dim)}
.nf-search-input::-webkit-search-cancel-button{-webkit-appearance:none}
.nf-search-clear{flex:none;border:0;background:none;color:var(--text-dim);cursor:pointer;
  font-size:.85rem;line-height:1;padding:.2rem .4rem;border-radius:6px}
.nf-search-clear:hover{color:var(--text);background:var(--bg3)}

/* ─── ✦ Sparks launcher — opens the immersive overlay deck (micro/sparks.js) ──── */
/* the ✦ "key" glows: a slow warm halo on the pill + a twinkling star, so it catches the eye. */
@keyframes nfSpkGlow{0%,100%{box-shadow:0 0 0 0 rgba(232,168,124,0)}50%{box-shadow:0 0 18px 1px color-mix(in srgb,var(--warm) 36%,transparent)}}
@keyframes nfSpkTwinkle{0%,100%{text-shadow:0 0 4px color-mix(in srgb,var(--warm) 45%,transparent);transform:scale(1)}50%{text-shadow:0 0 11px color-mix(in srgb,var(--warm) 95%,transparent);transform:scale(1.14)}}
.nf-sparks-launch{display:inline-flex;align-items:center;gap:.3rem;flex-shrink:0;white-space:nowrap;
  padding:.34rem .72rem;font-family:var(--font-heading);font-size:.74rem;font-weight:600;cursor:pointer;
  color:var(--warm);background:color-mix(in srgb,var(--warm) 12%,transparent);
  border:1px solid color-mix(in srgb,var(--warm) 38%,transparent);border-radius:99px;transition:background .18s;
  animation:nfSpkGlow 2.8s ease-in-out infinite}
.nf-sparks-launch:hover{background:color-mix(in srgb,var(--warm) 22%,transparent);box-shadow:0 0 16px 1px color-mix(in srgb,var(--warm) 34%,transparent)}
.nf-sparks-launch .nfs-star{display:inline-block;transform-origin:center;font-size:1.05em;
  animation:nfSpkTwinkle 2.8s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){
  .nf-sparks-launch,.nf-sparks-launch .nfs-star{animation:none}
  .nf-sparks-launch .nfs-star{text-shadow:0 0 7px color-mix(in srgb,var(--warm) 70%,transparent)}
}
/* On phones, collapse to just the ✦ icon so the bar never overflows over the ☰ menu.
   Fixed px (not rem) so a large text-size setting can't blow it past the bar height
   and clip it into a half-circle. */
@media (max-width:440px){
  .nf-sparks-launch .nfs-label{display:none}
  .nf-sparks-launch{width:34px;height:34px;min-width:34px;padding:0;gap:0;
    font-size:16px;line-height:1;justify-content:center;flex:none}
}