/* NYT + Vogue theme */
:root{
  --bg: #ffffff;
  --text: #0b0f19;
  --muted: #4b5563;
  --card: #ffffff;
  --border: #e5e7eb;
  --accent: #b91c1c;
  --mag1: #fff1f2;
  --mag2: #eff6ff;
  --mag3: #f5f3ff;
  --mag4: #ecfdf5;
  --shadow: 0 10px 30px rgba(0,0,0,.08);
  --tw-text: var(--text);
  --tw-surface: var(--card);
}

html[data-theme="dark"]{
  --bg: #0b0f19;
  --text: #f9fafb;
  --muted: #cbd5e1;
  --card: #0f172a;
  --border: #1f2937;
  --accent: #ef4444;
  --mag1: rgba(239,68,68,.12);
  --mag2: rgba(59,130,246,.12);
  --mag3: rgba(139,92,246,.12);
  --mag4: rgba(16,185,129,.12);
  --shadow: 0 10px 30px rgba(0,0,0,.35);
  --tw-text: var(--text);
  --tw-surface: var(--card);
}

body{ background: var(--bg) !important; color: var(--text) !important; }
.text-secondary, .small.text-secondary{ color: var(--muted) !important; }
.card, .modal-content{ background: var(--card) !important; border-color: var(--border) !important; }
.border, .border-top, .border-bottom{ border-color: var(--border) !important; }

/* Content readability (posts/pages) */
.prose, .fs-6{ color: var(--text); }
.prose a, .fs-6 a{ color: color-mix(in srgb, var(--accent) 70%, var(--text)); text-decoration: underline; }
.prose a:hover, .fs-6 a:hover{ color: var(--accent); }
.prose p, .fs-6 p{ line-height: 1.75; }
.prose h2, .prose h3, .prose h4, .fs-6 h2, .fs-6 h3, .fs-6 h4{ margin-top: 1.15rem; }

/* Masthead */

.masthead-title{
  font-family:"UnifrakturCook","Old Standard TT","Libre Baskerville",Georgia,serif;
  font-weight:700;
  letter-spacing:-.01em;
  font-size: clamp(34px, 5vw, 64px);
  line-height: .95;
  text-rendering: geometricPrecision;
  -webkit-font-smoothing: antialiased;
}
.masthead-title span.serif{
  font-family:"Old Standard TT","Libre Baskerville",Georgia,serif;
  font-weight:700;
}

.masthead-wrap{
  position: sticky;
  top: 0;
  z-index: 2147483647;
  background: color-mix(in srgb, var(--bg) 92%, transparent);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--border);
}
.masthead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 0;
}
/* Header alignment: keep logo left, title centered (same line), actions right */
.masthead-left{ display:flex; align-items:center; flex:0 0 auto; }
.masthead-center{ flex:1 1 auto; display:flex; align-items:center; justify-content:center; min-width:0; text-align:center; }
.masthead-right{ display:flex; align-items:center; justify-content:flex-end; gap:8px; flex:0 0 auto; flex-wrap:wrap; }
.brand-mark{ display:inline-flex; align-items:center; }
.brand-mark img{ width:34px; height:34px; border-radius:10px; object-fit:cover; box-shadow: var(--shadow); }
.masthead-title-link{ display:inline-flex; align-items:center; justify-content:center; }
.masthead-title{ margin:0; }

/* Mobile: prevent title wrapping awkwardly */
@media (max-width: 520px){
  .masthead{ gap:10px; }
  .masthead-title{ font-size: clamp(22px, 6vw, 34px); line-height: 1; }
}

.masthead-brand{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  flex:1;
}
.masthead-brand img{
  width:34px;height:34px;border-radius:10px;object-fit:cover; box-shadow: var(--shadow);
}
.masthead-kicker{
  font-family:"Libre Baskerville",Georgia,serif;
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--muted);
  margin-top:2px;
  text-align:center;
}
.top-actions{ display:flex; align-items:center; gap:8px; }
.navbar-nyt{
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  padding:6px 0;
  overflow:auto;
  white-space:nowrap;
}
.navbar-nyt a{
  display:inline-block;
  padding:6px 10px;
  border-radius:999px;
  font-family:"Libre Baskerville",Georgia,serif;
  font-size:13px;
  color:var(--muted);
  text-decoration:none;
}
.navbar-nyt a:hover{
  background: color-mix(in srgb, var(--border) 35%, transparent);
  color: var(--text);
}

/* Share block: keep readable in both light/dark */
.tw-share{ background: color-mix(in srgb, var(--card) 92%, transparent); border:1px solid var(--border); }

/* Translator UI (elimnoor-like) */
.tw-fab{
  position: fixed;
  right: 18px;
  bottom: 18px;
  width: 56px;
  height: 56px;
  border-radius: 18px;
  border: 1px solid var(--border);
  background: var(--card);
  box-shadow: var(--shadow);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index: 2147483647;
}
.tw-fab img{ width: 34px; height:34px; border-radius:12px; object-fit:cover; }

.tw-modal{ position: fixed; inset:0; display:none; z-index: 2147483647; }
.tw-modal[aria-hidden="false"]{ display:block; }
.tw-modal-backdrop{ position:absolute; inset:0; background: rgba(0,0,0,.55); }
.tw-modal-card{
  position: absolute;
  right: 18px;
  bottom: 90px;
  width: min(420px, calc(100vw - 36px));
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 18px;
  box-shadow: var(--shadow);
  overflow:hidden;
}
.tw-modal-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 12px 14px;
  border-bottom:1px solid var(--border);
}
.tw-modal-logo{ width:32px; height:32px; border-radius:10px; object-fit:cover; }
.tw-modal-title{ font-weight:800; font-size:16px; }
.tw-modal-sub{ font-size:12px; color: var(--muted); }
.tw-x{
  border:0;
  background: transparent;
  font-size: 26px;
  line-height: 1;
  color: var(--muted);
}
.tw-modal-body{ padding: 12px 14px 14px; }
.tw-lang-list{
  margin-top: 10px;
  max-height: 260px;
  overflow:auto;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 6px;
  background: color-mix(in srgb, var(--bg) 85%, transparent);
}
.tw-lang-item{
  width:100%;
  text-align:left;
  padding: 10px 10px;
  border-radius: 12px;
  border:0;
  background: transparent;
  color: var(--text);
  font-family: "Libre Baskerville", Georgia, serif;
  font-size: 13px;
}
.tw-lang-item:hover{
  background: color-mix(in srgb, var(--border) 35%, transparent);
}
.tw-modal-open{ overflow:hidden; }

:root { color-scheme: light; }
html.dark { color-scheme: dark; }
body { font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
.masthead-font { font-family: "Playfair Display", Georgia, "Times New Roman", serif; }

.card { border-radius: 18px; }
.badge-soft { border-radius: 999px; padding: .25rem .6rem; font-size: .75rem; }

.fab-wrap{ position: fixed; right: 18px; bottom: 18px; z-index: 2147483647; }
.fab-btn{ width:56px;height:56px;border-radius:999px; display:flex;align-items:center;justify-content:center; box-shadow:0 10px 25px rgba(0,0,0,.18); border:1px solid rgba(148,163,184,.35); background:#fff; }
html.dark .fab-btn{ background:#0b1220; border-color: rgba(148,163,184,.25); }
.fab-panel{ width:280px; margin-top:10px; border-radius:18px; overflow:hidden; border:1px solid rgba(148,163,184,.35); background:#fff; box-shadow:0 10px 25px rgba(0,0,0,.18); }
html.dark .fab-panel{ background:#060b16; border-color: rgba(148,163,184,.25); color:#fff; }
.fab-hidden{ display:none; }

#google_translate_element select.goog-te-combo{
  width:100%; padding:10px 12px; border-radius:12px;
  border:1px solid rgba(148,163,184,.35); background:transparent; color:inherit; outline:none;
}
.goog-te-banner-frame.skiptranslate{ display:none !important; }
body{ top:0 !important; }



/* --- Header translator + theme layout fixes --- */
.masthead-right{ flex-wrap:nowrap; }

/* Make Google translate widget compact in header */
.tw-translate-wrap{ display:flex; align-items:center; min-width:160px; }
.tw-translate-wrap .goog-te-gadget{ font-size:0 !important; }
.tw-translate-wrap .goog-te-gadget span,
.tw-translate-wrap .goog-logo-link{ display:none !important; }
.tw-translate-wrap select.goog-te-combo{
  width:auto !important;
  max-width: 170px;
  padding:6px 10px !important;
  border-radius:12px;
  font-size:12px;
  line-height:1.2;
}

/* Keep actions from overlapping on small screens */
@media (max-width: 520px){
  .masthead{ flex-wrap:wrap; }
  .masthead-left{ order:1; }
  .masthead-center{ order:2; flex:1 1 auto; }
  .masthead-right{ order:3; width:100%; justify-content:flex-end; }
  .tw-translate-wrap{ min-width: 0; }
  .tw-translate-wrap select.goog-te-combo{ max-width: 100%; width: 100% !important; }
}

/* ---- Classic header ---- */
.site-header .top-masthead { background: rgba(255,255,255,.92); backdrop-filter: blur(10px); }
html.dark .site-header .top-masthead { background: rgba(6,11,22,.92); }
.site-logo{ height:34px; width:auto; border-radius:12px; }
.site-title{ font-size: 1.4rem; letter-spacing: .5px; text-decoration:none; color: inherit; }
@media (min-width: 992px){ .site-title{ font-size: 2.0rem; } }

.nav-strip{ background:#0b1220; }
html.dark .nav-strip{ background:#0b1220; }
.nav-scroll{ overflow-x:auto; gap:10px; padding:10px 0; }
.nav-scroll::-webkit-scrollbar{ height:6px; }
.nav-pill{
  white-space:nowrap; text-decoration:none; color:#fff; font-size:.95rem;
  padding:6px 10px; border-radius:999px; border:1px solid rgba(255,255,255,.18);
}
.nav-pill:hover{ background: rgba(255,255,255,.10); }
.nav-icon{ color:#fff; text-decoration:none; font-size:.85rem; opacity:.9; }
.nav-icon:hover{ opacity:1; text-decoration:underline; }

/* ---- Hero ---- */
.hero-card{ border-radius: 22px; overflow:hidden; position:relative; }
.hero-img{ width:100%; height:420px; object-fit:cover; }
@media (max-width: 991px){ .hero-img{ height:340px; } }
.hero-img-placeholder{ background: radial-gradient(circle at 20% 20%, rgba(99,102,241,.35), transparent 40%),
                                  radial-gradient(circle at 80% 40%, rgba(16,185,129,.35), transparent 40%),
                                  radial-gradient(circle at 30% 80%, rgba(234,179,8,.30), transparent 45%),
                                  #0b1220; }
.hero-overlay{
  position:absolute; inset:0;
  background: linear-gradient(0deg, rgba(0,0,0,.70), rgba(0,0,0,.15));
  color:#fff;
  display:flex; flex-direction:column; justify-content:flex-end;
}
.hero-title{ font-size: 2.0rem; line-height:1.08; }
@media (min-width: 992px){ .hero-title{ font-size: 2.7rem; } }
.hero-lead{ max-width: 56ch; opacity:.92; }

.section-title{
  font-weight: 700; letter-spacing:.3px;
  border-left: 5px solid rgba(15,23,42,.9);
  padding-left: 10px;
}
html.dark .section-title{ border-left-color: rgba(255,255,255,.75); }

/* ---- Breaking ticker ---- */
.breaking-ticker{
  background: rgba(255,255,255,.9);
  border: 1px solid rgba(148,163,184,.35);
  border-radius: 14px;
  padding: 10px 12px;
  display:flex; align-items:center; gap:10px;
}
html.dark .breaking-ticker{ background: rgba(6,11,22,.92); border-color: rgba(148,163,184,.25); color:#fff; }
.ticker-track{ overflow-x:auto; white-space:nowrap; flex:1; }
.ticker-item{ color: inherit; text-decoration:none; margin-right: 18px; }
.ticker-item:hover{ text-decoration:underline; }

/* ---- Translator list ---- */
.lang-list-wrap{ max-height: 260px; overflow:auto; border:1px solid rgba(148,163,184,.35); border-radius:14px; }
html.dark .lang-list-wrap{ border-color: rgba(148,163,184,.25); }
.lang-list{ list-style:none; padding:0; margin:0; }
.lang-item{ border-bottom:1px solid rgba(148,163,184,.18); }
.lang-item:last-child{ border-bottom:0; }
.lang-btn{
  width:100%; text-align:left; background:transparent; border:0;
  padding:10px 12px; color:inherit; font-size:.95rem;
}
.lang-btn:hover{ background: rgba(148,163,184,.12); }


/* ===== NYT-inspired + Magazine color accents ===== */
:root{
  --ink:#0b1220;
  --paper:#ffffff;
  --muted:#6b7280;
  --accent:#b91c1c;   /* newsroom red */
  --accent2:#2563eb;  /* magazine blue */
  --accent3:#16a34a;  /* magazine green */
  --line: rgba(15,23,42,.12);
}
html.dark{
  --paper:#050a14;
  --ink:#f3f4f6;
  --line: rgba(148,163,184,.18);
}

body{ background: var(--paper); color: var(--ink); }
.masthead-font, .nyt-masthead-title{
  font-family: Georgia, "Times New Roman", Times, serif !important;
  letter-spacing: .2px;
}

/* Header */
.nyt-topbar{ background: rgba(255,255,255,.92); border-bottom:1px solid var(--line); }
html.dark .nyt-topbar{ background: rgba(6,11,22,.92); }
.nyt-date{ font-size:.85rem; color: var(--muted); }
.nyt-link, .nyt-social{ font-size:.85rem; color: var(--ink); text-decoration:none; opacity:.85; }
html.dark .nyt-link, html.dark .nyt-social{ color: var(--ink); }
.nyt-link:hover, .nyt-social:hover{ opacity:1; text-decoration:underline; }

.nyt-masthead{ background: var(--paper); }
.nyt-masthead-title{ font-size: 2.4rem; line-height:1; display:block; }
@media (min-width: 992px){ .nyt-masthead-title{ font-size: 3.2rem; } }
.nyt-masthead-sub{ font-size:.9rem; color: var(--muted); margin-top:.35rem; }
.nyt-logo{ position:absolute; left: 12px; top: 14px; height: 44px; width:auto; border-radius: 14px; opacity:.95; }
@media (max-width: 575px){ .nyt-logo{ display:none; } }

.nyt-nav{ background: var(--paper); }
.nyt-nav-scroll{
  display:flex; gap:12px; align-items:center;
  overflow-x:auto; padding:10px 0;
}
.nyt-nav-scroll::-webkit-scrollbar{ height:6px; }
.nyt-nav-item{
  white-space:nowrap;
  text-decoration:none;
  color: var(--ink);
  font-weight:600;
  font-size:.95rem;
  padding:6px 10px;
  border-radius: 999px;
  border: 1px solid var(--line);
}
.nyt-nav-item:hover{ border-color: rgba(185,28,28,.35); background: rgba(185,28,28,.06); }

/* Cards: magazine color strip by category */
.card{ border:1px solid var(--line); border-radius: 18px; }
.card-title{ font-family: Georgia, "Times New Roman", Times, serif; }
.badge.text-bg-danger{ background: var(--accent) !important; }
.badge.text-bg-warning{ background: #eab308 !important; color:#111827 !important; }
.badge.text-bg-dark{ background: #111827 !important; }

.category-pill{
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 10px; border-radius:999px;
  border:1px solid var(--line);
  font-size:.82rem; font-weight:700;
}
.category-pill .dot{ width:8px; height:8px; border-radius:999px; background: var(--accent2); }
.category-pill.politics .dot{ background: var(--accent); }
.category-pill.business .dot{ background: var(--accent2); }
.category-pill.sports .dot{ background: var(--accent3); }

/* Hero: more newspaper feel */
.hero-overlay{ background: linear-gradient(0deg, rgba(0,0,0,.78), rgba(0,0,0,.18)); }

/* Translate widget (Elimnoor-style) */
.translate-wrap{ position: fixed; right: 18px; bottom: 18px; z-index: 2147483647; }
.translate-fab-btn{
  width: 56px; height: 56px; border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--paper);
  box-shadow: 0 10px 26px rgba(0,0,0,.18);
}
.translate-icon{ width: 34px; height: 34px; border-radius: 999px; object-fit: cover; }
.translate-panel{
  position: absolute; right: 0; bottom: 70px;
  width: 290px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 18px;
  box-shadow: 0 18px 40px rgba(0,0,0,.25);
  overflow:hidden;
}
.translate-panel.hidden{ display:none; }
.translate-panel-head{
  display:flex; justify-content:space-between; align-items:center;
  padding: 10px 12px;
  border-bottom:1px solid var(--line);
}
.translate-title{ font-weight:800; letter-spacing:.2px; }
.translate-close{
  border:1px solid var(--line);
  background: transparent;
  width: 32px; height: 32px;
  border-radius: 10px;
}
.translate-panel-body{ padding: 12px; }
.translate-label{ font-size:.85rem; color: var(--muted); display:block; margin-bottom: 6px; }
.translate-hint{ color: var(--muted); margin-top: 8px; }

/* Make Google's select look nicer */
#google_translate_element select{
  width: 100%;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: var(--paper);
  color: var(--ink);
  font-weight:600;
}
#google_translate_element .goog-te-gadget{ font-family: inherit !important; color: var(--muted) !important; }
.goog-logo-link, .goog-te-gadget span{ display:none !important; }


/* ===== Dark mode contrast fixes ===== */
html.dark .text-secondary{ color: rgba(229,231,235,.88) !important; }
html.dark .text-muted{ color: rgba(229,231,235,.78) !important; }
html.dark .link-dark{ color: rgba(243,244,246,.95) !important; }
html.dark .card{ background: rgba(10,16,28,.92); }
html.dark .border-bottom, html.dark .border-top, html.dark .border{ border-color: rgba(148,163,184,.18) !important; }
html.dark .bg-light-subtle{ background: #050a14 !important; }


/* Search */
.nyt-search{ position: relative; }
.nyt-search-input{
  width: 240px;
  padding: 8px 10px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--paper);
  color: var(--ink);
  font-weight: 600;
}
.nyt-suggest{
  position:absolute;
  left: 0;
  top: 44px;
  width: 100%;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: 0 18px 36px rgba(0,0,0,.18);
  overflow:hidden;
  z-index: 2147483647;
}
.nyt-suggest.hidden{ display:none; }
.nyt-suggest-item{
  display:block;
  padding: 10px 12px;
  text-decoration:none;
  color: var(--ink);
  border-bottom:1px solid var(--line);
}
.nyt-suggest-item:last-child{ border-bottom:0; }
.nyt-suggest-item:hover{ background: rgba(185,28,28,.06); }

/* Vogue-ish magazine color blocks */
.mag-strip{
  background: linear-gradient(90deg, rgba(185,28,28,.10), rgba(37,99,235,.10), rgba(22,163,74,.10));
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 14px;
}


/* Trending carousel */
.tw-carousel{
  border:1px solid var(--border);
  border-radius:18px;
  overflow:hidden;
  background: var(--card);
  box-shadow: var(--shadow);
}
.tw-carousel-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px 14px;
  border-bottom:1px solid var(--border);
}
.tw-carousel-title{
  font-family:"Libre Baskerville",Georgia,serif;
  font-size:13px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color: var(--muted);
}
.tw-carousel-controls{
  display:flex;
  gap:8px;
}
.tw-carousel-btn{
  width:36px;height:36px;
  border-radius:12px;
  border:1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 85%, transparent);
  color: var(--text);
  display:flex;align-items:center;justify-content:center;
}
.tw-carousel-track{
  display:flex;
  overflow:auto;
  scroll-snap-type:x mandatory;
  gap:12px;
  padding:14px;
}
.tw-carousel-track::-webkit-scrollbar{ height:10px; }
.tw-carousel-card{
  min-width: 300px;
  max-width: 340px;
  scroll-snap-align:start;
  border:1px solid var(--border);
  border-radius:16px;
  overflow:hidden;
  background: var(--card);
}
@media (max-width: 576px){
  .tw-carousel-card{ min-width: 260px; }
}
.tw-carousel-img{
  height:160px;
  background: linear-gradient(120deg, var(--mag1), var(--mag2), var(--mag3));
}
.tw-carousel-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.tw-carousel-body{ padding:12px 12px 14px; }
.tw-carousel-body h3{
  font-family:"Playfair Display",serif;
  font-weight:700;
  font-size:18px;
  line-height:1.15;
  margin:0 0 6px;
}
.tw-carousel-meta{ font-size:12px; color: var(--muted); display:flex; gap:10px; align-items:center; flex-wrap:wrap;}
.tw-chip{
  border:1px solid var(--border);
  border-radius:999px;
  padding:3px 10px;
  font-size:11px;
  color: var(--muted);
  background: color-mix(in srgb, var(--bg) 85%, transparent);
}

/* Editor's Picks layout */
.picks-grid{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap:16px;
}
@media (max-width: 992px){
  .picks-grid{ grid-template-columns: 1fr; }
}
.pick-main{
  border:1px solid var(--border);
  border-radius:18px;
  overflow:hidden;
  background: var(--card);
  box-shadow: var(--shadow);
}
.pick-main .hero{
  height:280px;
  background: linear-gradient(120deg,var(--mag2),var(--mag3),var(--mag1));
}
.pick-main .hero img{ width:100%; height:100%; object-fit:cover; display:block; }
.pick-main .pad{ padding:14px 16px; }
.pick-main h2{
  font-family:"Playfair Display",serif;
  font-weight:800;
  font-size:28px;
  line-height:1.05;
  margin:0 0 8px;
}
.pick-side .item{
  display:flex;
  gap:12px;
  padding:12px;
  border:1px solid var(--border);
  border-radius:16px;
  background: var(--card);
  box-shadow: 0 8px 20px rgba(0,0,0,.06);
}
.pick-side .thumb{
  width:110px;height:84px;border-radius:14px;overflow:hidden;flex:0 0 auto;
  background: linear-gradient(120deg,var(--mag1),var(--mag4));
}
.pick-side .thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.pick-side h4{
  font-family:"Playfair Display",serif;
  font-weight:700;
  font-size:16px;
  line-height:1.15;
  margin:0 0 4px;
}


/* Masthead mobile fix */
@media (max-width: 576px){
  .masthead{ flex-wrap: wrap; justify-content: center; }
  .masthead-brand{ order: 1; flex: 1 1 100%; justify-content: center; }
  .top-actions{ order: 2; width: 100%; justify-content: space-between; }
  .masthead-title{ font-size: clamp(30px, 9vw, 44px); text-align:center; }
  .masthead-brand img{ width:30px; height:30px; }
}


/* Colorful header theme (NYT x magazine) */
.masthead-wrap{
  background: linear-gradient(90deg, color-mix(in srgb, var(--mag2) 65%, var(--bg)),
                                   color-mix(in srgb, var(--mag1) 55%, var(--bg)),
                                   color-mix(in srgb, var(--mag3) 55%, var(--bg)));
}
html[data-theme="dark"] .masthead-wrap{
  background: linear-gradient(90deg,
    rgba(59,130,246,.18),
    rgba(239,68,68,.14),
    rgba(139,92,246,.16)
  );
}
.navbar-nyt{
  background: color-mix(in srgb, var(--bg) 88%, transparent);
}
.navbar-nyt a{
  border: 1px solid transparent;
}
.navbar-nyt a.active,
.navbar-nyt a[aria-current="page"]{
  background: color-mix(in srgb, var(--accent) 16%, transparent);
  border-color: color-mix(in srgb, var(--accent) 22%, var(--border));
  color: var(--text);
  font-weight: 700;
}


/* Glass theme */
:root{
  --glass: rgba(255,255,255,.65);
  --glass2: rgba(255,255,255,.35);
  --glassBorder: rgba(255,255,255,.35);
}
html[data-theme="dark"]{
  --glass: rgba(15,23,42,.70);
  --glass2: rgba(15,23,42,.38);
  --glassBorder: rgba(148,163,184,.22);
}
body{
  background:
    radial-gradient(1200px 600px at 20% 10%, var(--mag2), transparent 60%),
    radial-gradient(1000px 500px at 90% 20%, var(--mag1), transparent 55%),
    radial-gradient(900px 450px at 60% 90%, var(--mag3), transparent 55%),
    var(--bg) !important;
}

/* Glass cards */
.card, .modal-content, .pick-main, .tw-carousel, .tw-carousel-card, .pick-side .item{
  background: var(--glass) !important;
  border: 1px solid var(--glassBorder) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.tw-carousel-img, .pick-main .hero, .pick-side .thumb{
  background: linear-gradient(120deg, var(--mag1), var(--mag2), var(--mag3));
}

/* Header glass + darker nav that blends with light/dark */
.masthead-wrap{
  position: sticky;
  top:0;
  z-index: 2147483647;
  background: var(--glass2);
  border-bottom: 1px solid var(--glassBorder);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.masthead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding: 10px 0;
}
.masthead-left{ width: 56px; display:flex; align-items:center; justify-content:flex-start; }
.brand-mark img{ width:38px; height:38px; border-radius:14px; object-fit:cover; box-shadow: var(--shadow); }
.masthead-center{ flex: 1; display:flex; justify-content:center; }
.masthead-title{
  font-family:"UnifrakturCook","Old Standard TT","Libre Baskerville",Georgia,serif;
  font-weight:700;
  letter-spacing:-.01em;
  font-size: clamp(34px, 5vw, 64px);
  line-height: .95;
  color: var(--text);
}
.masthead-right{ width: 260px; display:flex; align-items:center; justify-content:flex-end; gap:10px; }

.btn-ghost{
  border:1px solid var(--glassBorder);
  background: color-mix(in srgb, var(--glass) 55%, transparent);
  color: var(--text);
  border-radius: 14px;
  padding: 8px 10px;
}

/* Nav row: dark strip that adapts */
.navbar-nyt{
  border-top: 1px solid var(--glassBorder);
  padding: 8px 0 10px;
  overflow:auto;
  white-space:nowrap;
  background: color-mix(in srgb, var(--text) 8%, transparent);
  border-bottom-left-radius: 18px;
  border-bottom-right-radius: 18px;
}
html[data-theme="dark"] .navbar-nyt{
  background: rgba(0,0,0,.18);
}
.navbar-nyt a{
  display:inline-block;
  padding: 8px 12px;
  border-radius: 999px;
  font-family:"Libre Baskerville",Georgia,serif;
  font-size: 13px;
  color: color-mix(in srgb, var(--text) 70%, var(--muted));
  text-decoration:none;
  border: 1px solid transparent;
}
.navbar-nyt a:hover{
  background: color-mix(in srgb, var(--glass) 70%, transparent);
}
.navbar-nyt a.active, .navbar-nyt a[aria-current="page"]{
  background: color-mix(in srgb, var(--accent) 16%, transparent);
  border-color: color-mix(in srgb, var(--accent) 26%, var(--glassBorder));
  color: var(--text);
  font-weight:700;
}

/* Google translate dropdown styling */
.tw-translate-wrap{
  display:flex;
  align-items:center;
}
#google_translate_element{
  display:flex;
  align-items:center;
}
#google_translate_element .goog-te-gadget{
  font-family:"Libre Baskerville",Georgia,serif !important;
  color: var(--text) !important;
}
#google_translate_element select.goog-te-combo{
  border: 1px solid var(--glassBorder);
  background: color-mix(in srgb, var(--glass) 55%, transparent);
  color: var(--text);
  border-radius: 14px;
  padding: 8px 10px;
  outline: none;
  font-size: 12px;
  max-width: 170px;
}
.goog-te-banner-frame.skiptranslate{display:none !important;}
body{top:0 !important;}
.goog-logo-link{display:none !important;}
.goog-te-gadget span{display:none !important;}

/* Mobile header alignment */
@media (max-width: 576px){
  .masthead{ flex-wrap: wrap; }
  .masthead-left{ order:1; width: 44px; }
  .masthead-center{ order:2; flex: 1 1 100%; margin-top:6px; }
  .masthead-right{ order:3; width:100%; justify-content:space-between; }
  #google_translate_element select.goog-te-combo{ max-width: 62vw; }
}


/* Ensure text contrast in dark mode for all headings */
html[data-theme="dark"] .navbar-nyt a,
html[data-theme="dark"] .masthead-title,
html[data-theme="dark"] .card, html[data-theme="dark"] .card *{
  color: var(--text);
}


/* Glass polish v2: spacing, readability, responsive */
:root{
  --radius-lg: 22px;
  --radius-md: 16px;
  --shadow-soft: 0 10px 30px rgba(0,0,0,.08);
}
html[data-theme="dark"]{
  --shadow-soft: 0 10px 30px rgba(0,0,0,.35);
}

/* Ensure main content is centered and breathable */
main.container, .container{
  padding-left: 16px;
  padding-right: 16px;
}
@media (min-width: 992px){
  main.container, .container{ padding-left: 22px; padding-right: 22px; }
}

/* Card / glass boxes */
.card, .tw-carousel, .pick-main, .pick-side .item, .post-card, .page-card, .article, .sidebar-card{
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--shadow-soft) !important;
  overflow: hidden;
}
.card .card-body, .post-card .body, .page-card .body, .article .body{
  padding: 16px;
}
@media (min-width: 768px){
  .card .card-body, .post-card .body, .page-card .body, .article .body{ padding: 20px; }
}

/* Typography inside glass boxes */
.card h1, .card h2, .card h3,
.post-card h1, .post-card h2, .post-card h3,
.article h1, .article h2, .article h3{
  color: var(--text);
  letter-spacing: -0.01em;
}
.card p, .post-card p, .article p, .page-card p{
  color: color-mix(in srgb, var(--text) 82%, var(--muted));
  line-height: 1.6;
  margin-bottom: 12px;
}

/* Ensure images are nicely framed */
.card img, .post-card img, .tw-carousel img, .pick-main img{
  width: 100%;
  height: auto;
  display: block;
}
.card .thumb, .post-card .thumb, .pick-main .hero{
  border-bottom: 1px solid var(--glassBorder);
}

/* Grid fixes for mobile: avoid squished boxes */
.tw-grid, .home-grid, .picks-grid{
  display: grid;
  gap: 16px;
}
@media (min-width: 992px){
  .tw-grid, .home-grid, .picks-grid{ gap: 18px; }
}

/* Keep navbar readable in both themes */
.navbar-nyt{
  margin-top: 8px;
}
.navbar-nyt a{
  font-size: 13px;
}
@media (max-width: 576px){
  .navbar-nyt a{ font-size: 12px; padding: 7px 10px; }
}

/* Floating button always visible */
.tw-fab{ z-index: 2147483647; }

/* Reduce any accidental low-contrast text in dark mode */
html[data-theme="dark"] .text-muted,
html[data-theme="dark"] .text-secondary{
  color: rgba(226,232,240,.78) !important;
}


.tw-lang-fallback{
  font-size: 12px;
  border: 1px solid var(--glassBorder);
  background: color-mix(in srgb, var(--glass) 55%, transparent);
  color: var(--text);
  border-radius: 14px;
  padding: 8px 10px;
  outline: none;
  max-width: 180px;
}


.tw-modal-label{
  display:block;
  font-size: 12px;
  margin-bottom: 6px;
  color: color-mix(in srgb, var(--text) 80%, var(--muted));
}
.tw-lang-select{
  width:100%;
  border: 1px solid var(--glassBorder);
  background: color-mix(in srgb, var(--glass) 55%, transparent);
  color: var(--text);
  border-radius: 14px;
  padding: 10px 12px;
  outline:none;
  font-size: 13px;
}


/* Header embedded translator */
.tw-translate-inline{ display:flex; align-items:center; }
.tw-lang-select-header{
  max-width: 190px;
  border: 1px solid var(--glassBorder);
  background: color-mix(in srgb, var(--glass) 55%, transparent);
  color: var(--text);
  border-radius: 14px;
  padding: 8px 10px;
  outline:none;
  font-size: 12px;
}
.masthead-right{ gap: 12px; } /* little distance from theme button */

@media (max-width: 576px){
  .tw-lang-select-header{ max-width: 58vw; }
}





/* Google Translate Widget Styling */
.tw-translate-wrapper{ display:flex; align-items:center; }

#google_translate_element_header,
#google_translate_element_float{
  display:inline-block;
  width: 100%;
}

.goog-te-gadget{
  font-size: 0 !important;
}

.goog-te-gadget select{
  border: 1px solid var(--glassBorder) !important;
  background: color-mix(in srgb, var(--glass) 55%, transparent) !important;
  color: var(--text) !important;
  border-radius: 14px !important;
  padding: 8px 10px !important;
  font-size: 12px !important;
  outline: none !important;
  max-width: 190px;
}

#google_translate_element_float .goog-te-gadget select{
  width: 100% !important;
  max-width: 260px;
}

.goog-te-banner-frame.skiptranslate{display:none !important;}
body{top:0 !important;}
.goog-logo-link, .goog-te-gadget span{display:none !important;}

/* spacing between theme toggle and translator */
.masthead-right{ gap: 12px; }

/* Floater */
.tw-fab{
  position: fixed;
  right: 18px;
  bottom: 18px;
  width: 52px;
  height: 52px;
  border-radius: 18px;
  border: 1px solid var(--glassBorder);
  background: color-mix(in srgb, var(--glass) 60%, transparent);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: var(--shadow-soft);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index: 2147483647;
}
.tw-fab img{
  width: 28px;
  height: 28px;
  border-radius: 12px;
  object-fit: cover;
}
.tw-fab-panel{
  position: fixed;
  right: 18px;
  bottom: 78px;
  padding: 10px;
  border-radius: 18px;
  border: 1px solid var(--glassBorder);
  background: var(--glass);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: var(--shadow-soft);
  z-index: 2147483647;
}
@media (max-width: 576px){
  .tw-fab-panel{ right: 12px; left: 12px; bottom: 78px; }
  .goog-te-gadget select{ max-width: 100% !important; width: 100% !important; }
}


/* Floating translator (guaranteed) */
.tw-fab{
  position: fixed;
  right: 18px;
  bottom: 18px;
  width: 54px;
  height: 54px;
  border-radius: 18px;
  border: 1px solid var(--glassBorder);
  background: color-mix(in srgb, var(--glass) 60%, transparent);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: var(--shadow-soft);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index: 2147483647;
}
.tw-fab img{
  width: 30px;
  height: 30px;
  border-radius: 12px;
  object-fit: cover;
}
.tw-fab-panel{
  position: fixed;
  right: 18px;
  bottom: 82px;
  width: min(320px, calc(100vw - 36px));
  padding: 12px;
  border-radius: 18px;
  border: 1px solid var(--glassBorder);
  background: var(--glass);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  box-shadow: var(--shadow-soft);
  z-index: 2147483647;
}
.tw-fab-title{
  font-family: "Libre Baskerville", Georgia, serif;
  font-weight: 700;
  margin-bottom: 8px;
  color: var(--text);
}
.tw-lang-select{
  width:100%;
  border: 1px solid var(--glassBorder);
  background: color-mix(in srgb, var(--glass) 55%, transparent);
  color: var(--text);
  border-radius: 14px;
  padding: 10px 12px;
  outline:none;
  font-size: 13px;
}
@media (max-width: 576px){
  .tw-fab-panel{ right: 12px; bottom: 80px; width: calc(100vw - 24px); }
}


.card, .post-card, .article, .page-card, .pick-main, .pick-side .item, .tw-carousel{
  min-width: 0;
}
.card * , .post-card * , .article * , .page-card * , .pick-main * , .pick-side .item * {
  min-width: 0;
}


/* Translator hybrid widget */
.tw-fab-note{
  margin-top: 8px;
  font-size: 12px;
  color: color-mix(in srgb, var(--text) 75%, var(--muted));
}
#google_translate_element .goog-te-gadget{ font-size:0 !important; }
#google_translate_element select.goog-te-combo{
  width:100% !important;
  border: 1px solid var(--glassBorder) !important;
  background: color-mix(in srgb, var(--glass) 55%, transparent) !important;
  color: var(--text) !important;
  border-radius: 14px !important;
  padding: 10px 12px !important;
  outline:none !important;
  font-size: 13px !important;
}
.goog-te-banner-frame.skiptranslate{display:none !important;}
body{top:0 !important;}
.goog-logo-link{display:none !important;}
.goog-te-gadget span{display:none !important;}


/* Picks mobile fix */
@media (max-width: 768px){
  .picks-grid{ grid-template-columns: 1fr !important; }
  .hero{ height: 190px !important; }
  .pick-side .item{
    display:flex !important;
    gap: 12px !important;
    align-items: stretch !important;
  }
  .pick-side .thumb{
    flex: 0 0 96px !important;
    height: 96px !important;
    border-radius: 16px !important;
    overflow:hidden !important;
  }
  .pick-side .thumb img{ width:100% !important; height:100% !important; object-fit:cover !important; }
  .pick-main h2{ font-size: 18px !important; line-height: 1.25 !important; }
  .pick-side h4{ font-size: 15px !important; line-height: 1.25 !important; margin: 0 0 6px !important; }
  .pick-main .text-secondary{ font-size: 13px !important; line-height: 1.55 !important; }
  .pad{ padding: 12px 14px !important; }
}


.pick-main{ overflow:hidden; }
  .pick-main .hero{ height: 190px !important; }
  .pick-main h2{ font-size: 18px !important; line-height: 1.25 !important; margin: 6px 0 8px !important; }
  .pick-main .text-secondary{ font-size: 13px !important; line-height: 1.55 !important; }
  .pick-main .pad{ padding: 12px 14px !important; }

  /* Side list stays tidy without breaking the whole site */
  .pick-side .item{ display:flex !important; gap: 12px !important; align-items: flex-start !important; }
  .pick-side .thumb{ flex: 0 0 96px !important; height: 96px !important; border-radius: 16px !important; overflow:hidden !important; }
  .pick-side .thumb img{ width:100% !important; height:100% !important; object-fit:cover !important; }
  .pick-side h4{ font-size: 15px !important; line-height: 1.25 !important; margin: 0 0 6px !important; }
}


/* Translator safety */
.tw-fab, .tw-fab *{ pointer-events:auto; }
.tw-fab{ z-index: 2147483647 !important; }
.tw-fab-panel{ z-index: 2147483647 !important; }
.tw-fab-panel.open{ display:block; }


/* Mobile readability fix v1 (safe, non-scattering) */
@media (max-width: 768px){
  /* prevent text spilling outside glass cards */
  .glass, .card, .post-card, .page-card, .pick-main, .pick-side .item, .article, .content, .pad{
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  /* Make the Editors Picks section stack cleanly without touching other layouts */
  .picks-grid{
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
  .pick-main{ overflow:hidden; }
  .pick-main .hero{ height: 190px !important; }
  .pick-main .pad{ padding: 12px 14px !important; }

  .pick-main h2{
    font-size: 18px !important;
    line-height: 1.25 !important;
    margin: 6px 0 8px !important;
  }
  .pick-main .text-secondary{
    font-size: 13px !important;
    line-height: 1.55 !important;
    margin: 0 0 10px !important;
  }

  /* Side items align thumbnail + text */
  .pick-side .item{
    display:flex !important;
    gap: 12px !important;
    align-items:flex-start !important;
  }
  .pick-side .thumb{
    flex: 0 0 96px !important;
    height: 96px !important;
    border-radius: 16px !important;
    overflow:hidden !important;
  }
  .pick-side .thumb img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    display:block !important;
  }
  .pick-side h4{
    font-size: 15px !important;
    line-height: 1.25 !important;
    margin: 0 0 6px !important;
  }

  /* Global: keep paragraphs readable without breaking grids */
  p{ line-height: 1.6; }
  .container{ padding-left: 14px; padding-right: 14px; }
}


/* Header translator */
.tw-translate-top{
  display:flex;
  align-items:center;
  gap: 10px;
  margin-left: 12px;
}
.tw-translate-btn{
  display:flex;
  align-items:center;
  gap: 8px;
  border: 1px solid var(--glassBorder);
  background: color-mix(in srgb, var(--glass) 55%, transparent);
  color: var(--text);
  padding: 8px 10px;
  border-radius: 14px;
  cursor:pointer;
}
.tw-translate-btn img{
  width: 22px;
  height: 22px;
  border-radius: 10px;
  object-fit: cover;
}
.tw-translate-btn span{
  font-size: 12px;
  font-weight: 700;
}
.tw-translate-select{
  border: 1px solid var(--glassBorder);
  background: color-mix(in srgb, var(--glass) 55%, transparent);
  color: var(--text);
  border-radius: 14px;
  padding: 8px 10px;
  font-size: 12px;
  max-width: 220px;
}
@media (max-width: 768px){
  .tw-translate-top{ gap: 8px; margin-left: 8px; }
  .tw-translate-btn span{ display:none; } /* save space */
  .tw-translate-select{ max-width: 160px; }
}


/* Primary nav */
.tw-nav{
  display:flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  align-items:center;
  justify-content:center;
  padding: 10px 0 6px;
}
.tw-nav-link{
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .02em;
  padding: 8px 10px;
  border-radius: 999px;
  text-decoration:none;
  color: var(--text);
  background: transparent;
  border: 1px solid transparent;
}
.tw-nav-link:hover{
  border-color: var(--glassBorder);
  background: color-mix(in srgb, var(--glass) 45%, transparent);
}

.tw-nav-link.active,
.tw-nav-link[aria-current="page"]{
  border-color: color-mix(in srgb, var(--accent) 65%, var(--glassBorder));
  background: color-mix(in srgb, var(--accent) 20%, var(--glass));
  color: var(--text);
}
.tw-nav-link.active:hover{
  background: color-mix(in srgb, var(--accent) 28%, var(--glass));
}

@media (max-width: 768px){
  .tw-nav{ justify-content:flex-start; overflow-x:auto; flex-wrap:nowrap; padding-bottom: 10px; }
  .tw-nav::-webkit-scrollbar{ display:none; }
}


/* Scroll-to-top button */
.tw-scrolltop{
  position: fixed;
  right: 16px;
  bottom: 18px;
  border: 1px solid var(--glassBorder);
  background: color-mix(in srgb, var(--glass) 70%, transparent);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 18px 40px rgba(0,0,0,.18);
  display: grid;
  place-items: center;
  cursor: pointer;
  opacity: 0;
  transform: translateY(10px);
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
  z-index: 9999;
}
.tw-scrolltop.show{
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.tw-scrolltop img{
  width: 22px;
  height: 22px;
  border-radius: 10px;
  object-fit: cover;
}
.tw-scrolltop--slim{
  width: 44px;
  height: 56px;
  border-radius: 18px;
}
@media (max-width: 768px){
  .tw-scrolltop{ right: 12px; bottom: 14px; }
  .tw-scrolltop--slim{ width: 42px; height: 54px; }
}


/* Top Story mobile fit */
@media (max-width: 768px){
  .top-story, .topstory, .hero-story, .lead-story, .main-story{
    overflow:hidden;
    overflow-wrap:anywhere;
    word-break: break-word;
  }
  .top-story .grid, .topstory .grid, .hero-story .grid, .lead-story .grid, .main-story .grid{
    grid-template-columns: 1fr !important;
  }
  .top-story .chips, .topstory .chips, .hero-story .chips, .lead-story .chips, .main-story .chips,
  .top-story .badges, .topstory .badges, .hero-story .badges, .lead-story .badges, .main-story .badges,
  .top-story .meta, .topstory .meta, .hero-story .meta, .lead-story .meta, .main-story .meta{
    display:flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    row-gap: 8px !important;
    align-items:center !important;
    max-width: 100% !important;
  }
  .top-story h1, .top-story h2, .hero-story h1, .hero-story h2, .lead-story h1, .lead-story h2, .main-story h1, .main-story h2{
    font-size: 18px !important;
    line-height: 1.25 !important;
    margin: 8px 0 8px !important;
  }
  .top-story p, .hero-story p, .lead-story p, .main-story p{
    font-size: 13px !important;
    line-height: 1.6 !important;
    margin: 0 0 10px !important;
  }
  .top-story .pad, .topstory .pad, .hero-story .pad, .lead-story .pad, .main-story .pad,
  .top-story .content, .topstory .content, .hero-story .content, .lead-story .content, .main-story .content{
    padding: 12px 14px !important;
  }
}


/* Translator position (right side in header row when possible) */
.header-actions .tw-translate-top,
.tw-header-actions .tw-translate-top,
.header-right .tw-translate-top{
  margin-left: 12px;
}


/* ===== Breaking ribbon ===== */
.tw-breaking-wrap{ border-top:1px solid rgba(0,0,0,.08); border-bottom:1px solid rgba(0,0,0,.08); background: var(--tw-surface, #fff); }
html[data-theme="dark"] .tw-breaking-wrap{ border-color: rgba(255,255,255,.12); }
.tw-breaking{ display:flex; align-items:center; gap:12px; padding:10px 0; }
.tw-breaking-label{ font-weight:700; font-size:.85rem; letter-spacing:.04em; text-transform:uppercase; color:#fff; background:#b91c1c; padding:6px 10px; border-radius:999px; }
.tw-breaking-track{ position:relative; overflow:hidden; flex:1; }
.tw-breaking-marquee{ display:inline-flex; align-items:center; gap:14px; white-space:nowrap; animation: tw-marquee 22s linear infinite; padding-right:24px; }
.tw-breaking-track:hover .tw-breaking-marquee{ animation-play-state: paused; }
.tw-breaking-item{ color: var(--tw-text, #111827); text-decoration:none; font-weight:600; }
html[data-theme="dark"] .tw-breaking-item{ color: var(--tw-text, #f9fafb); }
.tw-breaking-item:hover{ text-decoration:underline; }
.tw-breaking-sep{ opacity:.75; color: color-mix(in srgb, var(--tw-text, #111827) 70%, transparent); }
@keyframes tw-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ===== Homepage slider ===== */
.tw-slider{ position:relative; border-radius:16px; overflow:hidden; box-shadow: 0 10px 24px rgba(0,0,0,.08); background: var(--tw-surface, #fff); }
html.dark .tw-slider{ box-shadow: 0 10px 24px rgba(0,0,0,.45); }
.tw-slider-inner{ position:relative; min-height: 320px; }
.tw-slide{ display:none; }
.tw-slide.is-active{ display:block; }
.tw-slide-link{ display:grid; grid-template-columns: 1.25fr .95fr; min-height: 320px; color:inherit; text-decoration:none; }
@media (max-width: 992px){
  .tw-slide-link{ grid-template-columns: 1fr; }
}
.tw-slide-media{ position:relative; background:#0b1220; }
.tw-slide-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.tw-slide-fallback{ width:100%; height:100%; min-height:320px; background: linear-gradient(120deg, rgba(185,28,28,.55), rgba(0,0,0,.65)); }
.tw-slide-brand{ position:absolute; left:14px; top:14px; width:44px; height:44px; border-radius:12px; background: rgba(0,0,0,.35); backdrop-filter: blur(8px); display:flex; align-items:center; justify-content:center; }
.tw-slide-brand img{ width:30px; height:30px; object-fit:contain; }
.tw-slide-body{ padding:18px 18px 18px 18px; display:flex; flex-direction:column; justify-content:center; background: var(--tw-surface, #fff); }
html.dark .tw-slide-body{ background: rgba(10,10,14,.92); }
.tw-slide-kicker{ font-weight:700; font-size:.85rem; letter-spacing:.04em; text-transform:uppercase; color:#b91c1c; margin-bottom:8px; }
html.dark .tw-slide-kicker{ color:#ff6b6b; }
.tw-slide-title{ font-family: 'Playfair Display', serif; font-weight:700; font-size:1.55rem; line-height:1.15; margin:0 0 10px; color: var(--tw-text, #111827); }
html.dark .tw-slide-title{ color: rgba(255,255,255,.96); }
.tw-slide-excerpt{ margin:0; color: rgba(17,24,39,.78); }
html.dark .tw-slide-excerpt{ color: rgba(255,255,255,.78); }

.tw-slider-btn{ position:absolute; top:50%; transform:translateY(-50%); border:none; width:42px; height:42px; border-radius:999px; background: rgba(0,0,0,.35); color:#fff; display:flex; align-items:center; justify-content:center; font-size:24px; line-height:1; cursor:pointer; }
.tw-slider-btn:hover{ background: rgba(0,0,0,.5); }
.tw-prev{ left:10px; }
.tw-next{ right:10px; }
.tw-slider-dots{ position:absolute; left:50%; bottom:12px; transform:translateX(-50%); display:flex; gap:8px; padding:6px 10px; border-radius:999px; background: rgba(0,0,0,.25); backdrop-filter: blur(8px); }
.tw-dot{ width:8px; height:8px; border-radius:999px; border:none; background: rgba(255,255,255,.55); cursor:pointer; }
.tw-dot.is-active{ background: #fff; width:18px; }

/* ===== Header mobile: keep logo + title on one line ===== */
.masthead{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.masthead-left,.masthead-center,.masthead-right{ display:flex; align-items:center; }
.masthead-center{ flex:1; justify-content:center; }
@media (max-width: 576px){
  .masthead{ flex-wrap:nowrap; }
  .masthead-center{ justify-content:center; }
  .masthead-title{ font-size: 1.25rem; }
}

/* Ensure readable text in dark mode for content blocks */
html.dark .card, html.dark .card-body{ color: rgba(255,255,255,.92); }
html.dark .text-secondary{ color: rgba(255,255,255,.68) !important; }
/* --- Header translator: single control (hide button, keep dropdown) --- */
#twTranslateBtn{display:none !important;}
#twTranslateTop{display:flex;align-items:center;}
#twTranslateTop .tw-translate-select{margin:0;min-width:120px;}
@media (max-width: 576px){
  #twTranslateTop .tw-translate-select{min-width:110px;}
}



/* === Final Header + Theme Fixes (do not remove) === */

/* Make masthead title extra clear */
.masthead-title{
  font-weight: 800 !important;
  color: var(--text) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.04);
}
html[data-theme="dark"] .masthead-title{
  text-shadow: 0 1px 0 rgba(0,0,0,.35);
}

/* Ensure the sticky header background matches theme immediately */
.masthead-wrap{
  background: color-mix(in srgb, var(--bg) 92%, transparent) !important;
}

/* Mobile header layout — match the original amp.zip behavior */
@media (max-width: 576px){
  .masthead{ flex-wrap: wrap !important; }
  .masthead-left{ order:1 !important; width: 44px !important; }
  .masthead-center{ order:2 !important; flex: 1 1 100% !important; margin-top:6px !important; justify-content:center !important; }
  .masthead-right{ order:3 !important; width:100% !important; justify-content:space-between !important; gap:10px !important; }
  .masthead-title{ font-size: clamp(30px, 9vw, 44px) !important; text-align:center !important; }
}

/* Breaking news readability in both themes */
.breaking, .breaking *{ color: var(--text) !important; }
html[data-theme="dark"] .breaking{ background: color-mix(in srgb, var(--card) 88%, transparent) !important; }

/* Google Translate: show only header control, hide any other injected elements */
#google_translate_element_float,
#google_translate_element_footer{ display:none !important; }

#google_translate_element_header .goog-te-gadget{ font-size: 0 !important; }
#google_translate_element_header select.goog-te-combo{
  border: 1px solid var(--border) !important;
  background: color-mix(in srgb, var(--card) 70%, transparent) !important;
  color: var(--text) !important;
  border-radius: 12px !important;
  padding: 8px 10px !important;
  font-size: 12px !important;
  max-width: 260px;
}
@media (max-width: 576px){
  #google_translate_element_header select.goog-te-combo{ max-width: 62vw !important; }
}

/* Compatibility: if any old rules rely on html.dark, map it to the same variables */
html.dark{
  --bg: #0b0f19;
  --text: #f9fafb;
  --muted: #cbd5e1;
  --card: #0f172a;
  --border: #1f2937;
  --accent: #ef4444;
}


/* ===== Footer (standard news-style) ===== */
.tw-footer{
  background: color-mix(in srgb, var(--card) 92%, transparent);
  color: var(--text);
  border-top-color: var(--border) !important;
}
html[data-theme="dark"] .tw-footer{
  background: color-mix(in srgb, var(--card) 65%, transparent);
}
.tw-footer .text-muted{ color: color-mix(in srgb, var(--muted) 92%, transparent) !important; }
.tw-footer-link{ color: inherit; text-decoration: none; }
.tw-footer-link:hover{ text-decoration: underline; }
/* Google Translate (header) - keep single, neat */
.tw-gtranslate{ display:flex; align-items:center; }
#google_translate_element{ line-height: 1; }
#google_translate_element .goog-te-gadget{ font-size: 0 !important; }
#google_translate_element .goog-te-gadget span{ display:none !important; }
#google_translate_element select{ 
  font-size: 12px !important;
  padding: 6px 8px !important;
  border-radius: 10px !important;
  border: 1px solid var(--glassBorder) !important;
  background: color-mix(in srgb, var(--glass) 85%, transparent) !important;
  color: var(--text) !important;
  outline: none !important;
}
html[data-theme="dark"] #google_translate_element select{ color: #fff !important; }

/* Hide the top Google translate banner frame */
.goog-te-banner-frame.skiptranslate{ display:none !important; }
body{ top: 0 !important; }

/* Prevent duplicate translate UI if host injects extra */
#goog-gt-tt, .goog-te-balloon-frame{ display:none !important; }

/* Google Translate (header) - show single dropdown neatly */
.tw-gtranslate #google_translate_element{ display:block !important; }
.tw-gtranslate #google_translate_element .goog-te-gadget{ font-size: 0 !important; }
.tw-gtranslate #google_translate_element .goog-te-gadget span{ display:none !important; }
.tw-gtranslate #google_translate_element select.goog-te-combo{
  font-size: 13px !important;
  padding: 8px 10px !important;
  border-radius: 12px !important;
  border: 1px solid var(--border) !important;
  background: color-mix(in srgb, var(--card) 70%, transparent) !important;
  color: var(--text) !important;
  outline: none !important;
}

/* Fallback translator selector (only appears if Google widget is blocked) */
.tw-translate-fallback{
  width: 100%;
  border: 1px solid var(--glassBorder);
  background: color-mix(in srgb, var(--glass) 55%, transparent);
  color: var(--text);
  border-radius: 14px;
  padding: 10px 12px;
  outline: none;
  font-size: 13px;
}



/* Header search (compact, non-scattering) */
.tw-search{
  position: relative;
  display: flex;
  align-items: center;
  gap: 6px;
}
.tw-search-input{
  width: 220px;
  max-width: 34vw;
  height: 34px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 88%, transparent);
  color: var(--text);
  outline: none;
}
.tw-search-input::placeholder{ color: color-mix(in srgb, var(--text) 55%, transparent); }
.tw-search-input:focus{
  border-color: color-mix(in srgb, var(--text) 30%, var(--border));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--text) 12%, transparent);
}
.tw-search-btn{
  height: 34px;
  width: 34px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--glass) 70%, transparent);
  color: var(--text);
  cursor: pointer;
}
.tw-search-suggest{
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  background: color-mix(in srgb, var(--bg) 96%, transparent);
  border: 1px solid var(--border);
  border-radius: 14px;
  box-shadow: 0 18px 40px rgba(0,0,0,.18);
  overflow: hidden;
  display: none;
  z-index: 2147483646;
}
.tw-search-suggest.show{ display: block; }
.tw-search-suggest-item{
  display:block;
  padding: 10px 12px;
  color: var(--text);
  text-decoration: none;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 60%, transparent);
}
.tw-search-suggest-item:last-child{ border-bottom: 0; }
.tw-search-suggest-item:hover{
  background: color-mix(in srgb, var(--glass) 75%, transparent);
}

/* Keep header neat on mobile: shrink search */
@media (max-width: 640px){
  .tw-search-input{ width: 140px; max-width: 46vw; }
}

/* Google translate dropdown with subtle logo background */
#google_translate_element .goog-te-gadget{ font-size: 0; }
#google_translate_element select.goog-te-combo{
  height: 34px;
  border-radius: 999px;
  border: 1px solid var(--border) !important;
  background-color: color-mix(in srgb, var(--bg) 88%, transparent) !important;
  color: var(--text) !important;
  padding: 0 10px 0 38px !important;
  background-image: url('/assets/images/logo.png');
  background-repeat: no-repeat;
  background-size: 18px 18px;
  background-position: 12px center;
  outline: none;
}
/* Hide the Google top banner space if it appears */
.goog-te-banner-frame.skiptranslate{ display:none !important; }
body{ top: 0 !important; }


/* Translator placement: keep hidden instance near theme toggle, show widget under logo */
.tw-translate-hidden{ display:none !important; }
.tw-underlogo-row{ display:flex; align-items:center; padding: 8px 0 4px; }
.tw-translate-underlogo{ display:flex; align-items:center; }
@media (min-width: 992px){
  .tw-underlogo-row{ padding-left: 0; }
}