/*
 * Shared cross-theme components (breadcrumb, sub-category nav, static pages, newspaper pages).
 * Served as a file rather than inline <style>: theme 3 mounts Vue on its page wrapper and Vue
 * strips <style> tags from its template, so inline component styles vanished there.
 * Theme colours come in as custom properties on the component roots (see components/ui_vars.ejs).
 */
.cm-breadcrumb, .cm-subcats, .cm-doc, .cm-dn, .flatpickr-calendar {
  --cm-accent: #0d6efd;
  --cm-on-accent: #ffffff;
  --cm-radius: 12px;
  --cm-radius-sm: 8px;
}
.cm-breadcrumb, .cm-subcats, .cm-doc, .cm-dn {
  --cm-accent-soft: color-mix(in srgb, var(--cm-accent) 10%, transparent);
  --cm-accent-line: color-mix(in srgb, var(--cm-accent) 28%, transparent);
  --cm-muted: color-mix(in srgb, currentColor 58%, transparent);
  --cm-line: color-mix(in srgb, currentColor 14%, transparent);
  --cm-surface: color-mix(in srgb, currentColor 3.5%, transparent);
  --cm-pill: 999px;
}

/* ==== Breadcrumb ==== */
  .cm-breadcrumb { font-size: 13px; line-height: 1.4; margin: 0 0 14px; min-width: 0; }
  .breadcrumbs .cm-breadcrumb, .cm-breadcrumb.uc-bc { margin: 0; }
  .cm-breadcrumb--bar { padding: 10px 0; margin: 0; border-bottom: 1px solid var(--cm-line); }
  .cm-breadcrumb__list { display: flex; align-items: center; flex-wrap: nowrap; gap: 6px; list-style: none !important; margin: 0 !important; padding: 0 !important; overflow-x: auto; scrollbar-width: none; white-space: nowrap; -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 18px), transparent); mask-image: linear-gradient(to right, #000 calc(100% - 18px), transparent); }
  .cm-breadcrumb__list::-webkit-scrollbar { display: none; }
  .cm-breadcrumb--center .cm-breadcrumb__list { justify-content: center; }
  @media (max-width: 767.98px) { .cm-breadcrumb--center .cm-breadcrumb__list { justify-content: flex-start; } }
  .cm-breadcrumb__item { display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto; margin: 0 !important; padding: 0 !important; }
  .cm-breadcrumb__item::before, .cm-breadcrumb__item::after { content: none !important; display: none !important; }
  .cm-breadcrumb__item.is-current { flex: 0 1 auto; min-width: 0; }
  .cm-breadcrumb__link { display: inline-flex; align-items: center; gap: 5px; color: var(--cm-muted) !important; text-decoration: none !important; font-weight: 500; transition: color .15s ease; }
  .cm-breadcrumb__link:hover, .cm-breadcrumb__link:focus-visible { color: var(--cm-accent) !important; }
  .cm-breadcrumb__home { flex: 0 0 auto; width: 14px !important; height: 14px !important; margin-top: -1px; }
  .cm-breadcrumb__sep { flex: 0 0 auto; width: 12px !important; height: 12px !important; opacity: .45; }
  .cm-breadcrumb__text { font-weight: 600; color: inherit; overflow: hidden; text-overflow: ellipsis; max-width: 42ch; display: inline-block; vertical-align: bottom; }
  @media (max-width: 575.98px) { .cm-breadcrumb__text { max-width: 26ch; } }

/* ==== Sub-category navigation ==== */
  .cm-subcats { margin: 14px 0 6px; min-width: 0; max-width: 100%; }
  /* Edge fades only on the side where more chips are hidden */
  .cm-subcats.is-scrollable .cm-subcats__list { -webkit-mask-image: linear-gradient(to right, transparent, #000 24px, #000 calc(100% - 24px), transparent); mask-image: linear-gradient(to right, transparent, #000 24px, #000 calc(100% - 24px), transparent); }
  .cm-subcats.is-scrollable.at-start .cm-subcats__list { -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 24px), transparent); mask-image: linear-gradient(to right, #000 calc(100% - 24px), transparent); }
  .cm-subcats.is-scrollable.at-end .cm-subcats__list { -webkit-mask-image: linear-gradient(to right, transparent, #000 24px); mask-image: linear-gradient(to right, transparent, #000 24px); }
  .cm-subcats__list { display: flex; flex-wrap: wrap; gap: 8px; list-style: none !important; margin: 0 !important; padding: 0 !important; }
  .cm-subcats--center .cm-subcats__list { justify-content: center; }
  .cm-subcats__list > li { margin: 0 !important; padding: 0 !important; flex: 0 0 auto; }
  .cm-subcats__list > li::before, .cm-subcats__list > li::after { content: none !important; display: none !important; }
  .cm-subcats__chip {
    display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 16px;
    border: 1px solid var(--cm-line); border-radius: var(--cm-pill);
    background: transparent; color: inherit !important; text-decoration: none !important;
    font-size: 14px; font-weight: 600; line-height: 1; letter-spacing: 0; text-transform: none;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
  }
  .cm-subcats__chip svg { width: 14px !important; height: 14px !important; opacity: .7; flex: 0 0 auto; }
  .cm-subcats__chip:hover, .cm-subcats__chip:focus-visible { border-color: var(--cm-accent); color: var(--cm-accent) !important; background: var(--cm-accent-soft); }
  .cm-subcats__chip:focus-visible { outline: 2px solid var(--cm-accent); outline-offset: 2px; }
  .cm-subcats__chip.is-active { background: var(--cm-accent); border-color: var(--cm-accent); color: var(--cm-on-accent) !important; box-shadow: 0 4px 14px -6px var(--cm-accent); }
  .cm-subcats__chip.is-active svg { opacity: 1; }
  @media (max-width: 767.98px) {
    .cm-subcats__list {
      flex-wrap: nowrap; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none;
      padding: 2px 2px 6px !important; -webkit-overflow-scrolling: touch;
    }
    .cm-subcats--center .cm-subcats__list { justify-content: flex-start; }
    .cm-subcats__list::-webkit-scrollbar { display: none; }
    .cm-subcats__list > li { scroll-snap-align: start; }
    .cm-subcats__chip { height: 34px; padding: 0 14px; font-size: 13.5px; }
  }

/* ==== Corporate / legal static pages ==== */
  .cm-doc { width: 100%; max-width: 1160px; margin: 0 auto; padding: 8px 0 56px; box-sizing: border-box; color: inherit; text-align: left; }
  .cm-doc *, .cm-doc *::before, .cm-doc *::after { box-sizing: border-box; }

  /* Hero */
  .cm-doc__hero { position: relative; padding: 28px 0 26px; margin: 0 0 28px; border-bottom: 1px solid var(--cm-line); }
  .cm-doc__hero::after { content: ""; position: absolute; left: 0; bottom: -1px; width: 72px; height: 3px; border-radius: 3px; background: var(--cm-accent); }
  .cm-doc__eyebrow { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: var(--cm-pill); background: var(--cm-accent-soft); color: var(--cm-accent); font-size: 12.5px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; }
  .cm-doc__eyebrow svg { width: 16px !important; height: 16px !important; flex: 0 0 auto; }
  .cm-doc .cm-doc__title { margin: 14px 0 0 !important; padding: 0 !important; font-size: clamp(28px, 4.2vw, 44px) !important; line-height: 1.12 !important; font-weight: 800 !important; letter-spacing: -.02em; color: inherit !important; text-transform: none !important; border: 0 !important; background: none !important; text-align: left !important; }
  .cm-doc .cm-doc__title::before, .cm-doc .cm-doc__title::after { content: none !important; display: none !important; }
  .cm-doc__lead { margin: 12px 0 0 !important; max-width: 62ch; font-size: 17px !important; line-height: 1.6 !important; color: var(--cm-muted) !important; }
  .cm-doc__meta { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 14px; font-size: 13px; color: var(--cm-muted); }
  .cm-doc__meta span { display: inline-flex; align-items: center; gap: 6px; }
  .cm-doc__meta svg { width: 14px !important; height: 14px !important; opacity: .7; flex: 0 0 auto; }

  /* Layout */
  .cm-doc__layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; align-items: start; }
  .cm-doc--legal .cm-doc__layout.has-toc { grid-template-columns: 250px minmax(0, 1fr); }
  .cm-doc__body { min-width: 0; max-width: none; }
  .cm-doc--form .cm-doc__body { max-width: none; }

  /* Table of contents */
  .cm-doc__toc { position: sticky; top: var(--cm-sticky-top, 96px); max-height: calc(100vh - var(--cm-sticky-top, 96px) - 24px); overflow: auto; font-size: 13.5px; transition: top .2s ease; }
  .cm-doc__toc-box { border: 1px solid var(--cm-line); border-radius: var(--cm-radius); padding: 14px 14px 10px; background: var(--cm-surface); }
  .cm-doc__toc-box summary { cursor: pointer; list-style: none; font-weight: 700; font-size: 12.5px; letter-spacing: .04em; text-transform: uppercase; color: var(--cm-muted); margin-bottom: 8px; }
  .cm-doc__toc-box summary::-webkit-details-marker { display: none; }
  .cm-doc__toc-list { list-style: none !important; margin: 0 !important; padding: 0 !important; counter-reset: toc; }
  .cm-doc__toc-list li { margin: 0 !important; padding: 0 !important; }
  .cm-doc__toc-list li::before { content: none !important; }
  .cm-doc__toc-list a { display: block; padding: 6px 10px; margin: 0 -4px; border-left: 2px solid transparent; border-radius: 0 var(--cm-radius-sm) var(--cm-radius-sm) 0; color: inherit !important; opacity: .8; text-decoration: none !important; line-height: 1.35; transition: background-color .15s, color .15s, border-color .15s; }
  .cm-doc__toc-list a:hover { opacity: 1; background: var(--cm-accent-soft); }
  .cm-doc__toc-list a.is-active { opacity: 1; color: var(--cm-accent) !important; border-left-color: var(--cm-accent); background: var(--cm-accent-soft); font-weight: 600; }

  /* Body typography (normalises the mixed markup of the content files) */
  .cm-doc__body { font-size: 16.5px; line-height: 1.75; }
  .cm-doc__body p, .cm-doc__body .custom-static-content p, .cm-doc__body .custom-about-content p { margin: 0 0 1.1em !important; font-size: inherit !important; line-height: 1.75 !important; color: inherit; }
  .cm-doc__body p:empty { display: none; }
  /* Some themes add a drop cap to article text; not for corporate/legal copy */
  .cm-doc__body p::first-letter, .cm-doc__body > *:first-child::first-letter { float: none !important; font-size: inherit !important; line-height: inherit !important; margin: 0 !important; padding: 0 !important; font-weight: inherit !important; color: inherit !important; }
  .cm-doc__body h2, .cm-doc__body h3, .cm-doc__body h4, .cm-doc__body .cm-doc__h {
    scroll-margin-top: calc(var(--cm-sticky-top, 96px) + 12px) !important;
    display: block; margin: 2em 0 .7em !important; padding: 0 !important; font-weight: 750 !important; line-height: 1.3 !important;
    color: inherit !important; letter-spacing: -.01em; text-transform: none; scroll-margin-top: 110px;
  }
  .cm-doc__body h2 { font-size: 1.45em !important; }
  .cm-doc__body h3, .cm-doc__body .cm-doc__h { font-size: 1.18em !important; }
  .cm-doc__body h4 { font-size: 1.05em !important; }
  .cm-doc__body > :first-child, .cm-doc__body > * > :first-child { margin-top: 0 !important; }
  .cm-doc--legal .cm-doc__body h2, .cm-doc--legal .cm-doc__body h3, .cm-doc--legal .cm-doc__body .cm-doc__h { padding-top: 1.1em !important; border-top: 1px solid var(--cm-line); }
  .cm-doc__body ul, .cm-doc__body ol { margin: 0 0 1.2em !important; padding-left: 1.4em !important; }
  .cm-doc__body ul { list-style: disc !important; }
  .cm-doc__body ol { list-style: decimal !important; }
  .cm-doc__body li { margin: 0 0 .45em !important; padding-left: .2em; line-height: 1.65 !important; }
  .cm-doc__body li::marker { color: var(--cm-accent); }
  .cm-doc__body a:not([class*="btn"]):not(button) { color: var(--cm-accent) !important; text-decoration: underline !important; text-decoration-thickness: 1px; text-underline-offset: 3px; word-break: break-word; }
  .cm-doc__body strong, .cm-doc__body b { font-weight: 700; }
  .cm-doc__body table { width: 100%; border-collapse: collapse; margin: 0 0 1.4em; font-size: .92em; display: block; overflow-x: auto; }
  .cm-doc__body th, .cm-doc__body td { border: 1px solid var(--cm-line) !important; padding: 8px 10px; text-align: left; vertical-align: top; }
  .cm-doc__body th { background: var(--cm-surface); font-weight: 700; }
  .cm-doc__body img { max-width: 100%; height: auto; border-radius: var(--cm-radius-sm); }
  .cm-doc__body blockquote { margin: 1.4em 0; padding: 12px 18px; border-left: 3px solid var(--cm-accent); background: var(--cm-accent-soft); border-radius: 0 var(--cm-radius-sm) var(--cm-radius-sm) 0; }

  /* Forms (contact / careers) get a card surface */
  .cm-doc--form .cm-doc__body form:not(.cm-contact__form) { padding: clamp(18px, 3vw, 32px); border: 1px solid var(--cm-line); border-radius: var(--cm-radius); background: var(--cm-surface); }
  .cm-doc--form .cm-doc__body input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="submit"]),
  .cm-doc--form .cm-doc__body select, .cm-doc--form .cm-doc__body textarea { border-radius: var(--cm-radius-sm) !important; }
  .cm-doc--form .cm-doc__body input:focus, .cm-doc--form .cm-doc__body select:focus, .cm-doc--form .cm-doc__body textarea:focus { border-color: var(--cm-accent) !important; box-shadow: 0 0 0 3px var(--cm-accent-soft) !important; outline: none !important; }

  /* Related corporate pages */
  .cm-doc__related { margin: 44px 0 8px; padding-top: 24px; border-top: 1px solid var(--cm-line); }
  .cm-doc .cm-doc__related-title { margin: 0 0 14px !important; font-size: 13px !important; font-weight: 700 !important; letter-spacing: .06em; text-transform: uppercase; color: var(--cm-muted) !important; }
  .cm-doc__related ul { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; list-style: none !important; margin: 0 !important; padding: 0 !important; }
  .cm-doc__related li { margin: 0 !important; padding: 0 !important; }
  .cm-doc__related li::before { content: none !important; }
  .cm-doc__related a { display: flex; align-items: center; justify-content: space-between; gap: 10px; height: 100%; padding: 14px 16px; border: 1px solid var(--cm-line); border-radius: var(--cm-radius); color: inherit !important; text-decoration: none !important; font-weight: 600; font-size: 15px; transition: border-color .15s, background-color .15s, transform .15s; }
  .cm-doc__related a svg { width: 16px !important; height: 16px !important; flex: 0 0 auto; color: var(--cm-accent); transition: transform .15s; }
  .cm-doc__related a:hover, .cm-doc__related a:focus-visible { border-color: var(--cm-accent); background: var(--cm-accent-soft); }
  .cm-doc__related a:hover svg { transform: translateX(3px); }

  @media (max-width: 991.98px) {
    .cm-doc--legal .cm-doc__layout.has-toc { grid-template-columns: minmax(0, 1fr); gap: 20px; }
    .cm-doc__toc { position: static; max-height: none; }
    .cm-doc__toc-box:not([open]) { padding-bottom: 6px; }
    .cm-doc__toc-box summary { margin: 0; display: flex; justify-content: space-between; align-items: center; }
    .cm-doc__toc-box summary::after { content: "+"; font-size: 18px; line-height: 1; }
    .cm-doc__toc-box[open] summary::after { content: "–"; }
    .cm-doc__toc-box[open] summary { margin-bottom: 8px; }
  }
  @media (max-width: 575.98px) {
    .cm-doc__hero { padding: 18px 0 20px; margin-bottom: 22px; }
    .cm-doc__body { font-size: 16px; }
    .cm-doc__lead { font-size: 16px !important; }
    .cm-doc__related ul { grid-template-columns: minmax(0, 1fr); }
  }

/* ==== Daily newspaper front pages ==== */
  .cm-sr { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
  .cm-dn { width: 100%; max-width: 1200px; margin: 0 auto 32px; padding: 16px 0 40px; box-sizing: border-box; color: inherit; text-align: left; }
  .cm-dn *, .cm-dn *::before, .cm-dn *::after { box-sizing: border-box; }
  .cm-dn a { text-decoration: none; }

  /* Hero */
  .cm-dn__hero { display: flex; flex-direction: column; align-items: flex-start; gap: 18px; padding: 18px 0 22px; margin-bottom: 22px; border-bottom: 1px solid var(--cm-line); position: relative; }
  .cm-dn__hero::after { content: ""; position: absolute; left: 0; bottom: -1px; width: 72px; height: 3px; border-radius: 3px; background: var(--cm-accent); }
  .cm-dn__heading { min-width: 0; width: 100%; }
  .cm-dn__eyebrow { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: var(--cm-pill); background: var(--cm-accent-soft); color: var(--cm-accent); font-size: 12.5px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; }
  .cm-dn__eyebrow svg { width: 15px !important; height: 15px !important; }
  .cm-dn .cm-dn__title { margin: 12px 0 0 !important; padding: 0 !important; font-size: clamp(26px, 3.6vw, 40px) !important; line-height: 1.15 !important; font-weight: 800 !important; letter-spacing: -.02em; color: inherit !important; text-transform: none !important; text-align: left !important; background: none !important; border: 0 !important; }
  .cm-dn .cm-dn__title::before, .cm-dn .cm-dn__title::after { content: none !important; display: none !important; }
  .cm-dn__lead { margin: 10px 0 0 !important; font-size: 16px !important; line-height: 1.55 !important; color: var(--cm-muted) !important; max-width: 60ch; }

  /* Date bar */
  .cm-dn-datebar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
  .cm-dn-datebar__step, .cm-dn-datebar__today, .cm-dn-datebar__go {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 42px; padding: 0 14px;
    border: 1px solid var(--cm-line); border-radius: var(--cm-radius-sm); background: transparent;
    color: inherit !important; font: inherit; font-size: 14px; font-weight: 600; line-height: 1; cursor: pointer; white-space: nowrap;
    transition: border-color .15s, background-color .15s, color .15s;
  }
  .cm-dn-datebar__step svg { width: 18px !important; height: 18px !important; flex: 0 0 auto; }
  .cm-dn-datebar__step:hover, .cm-dn-datebar__today:hover { border-color: var(--cm-accent); color: var(--cm-accent) !important; background: var(--cm-accent-soft); }
  .cm-dn-datebar__step.is-disabled { opacity: .35; cursor: default; }
  .cm-dn-datebar__today { border-color: var(--cm-accent-line); color: var(--cm-accent) !important; }
  .cm-dn-datebar__form { display: inline-flex; align-items: stretch; gap: 0; margin: 0; }
  .cm-dn-datebar__field { position: relative; display: inline-flex; align-items: center; margin: 0; }
  .cm-dn-datebar__field > svg { position: absolute; left: 12px; width: 18px !important; height: 18px !important; color: var(--cm-accent); pointer-events: none; z-index: 1; }
  .cm-dn-datebar__input, .cm-dn-datebar .flatpickr-input.form-control, .cm-dn-datebar input.flatpickr-input {
    height: 42px !important; width: 190px !important; min-width: 0; padding: 0 12px 0 40px !important; margin: 0 !important;
    border: 1px solid var(--cm-line) !important; border-right: 0 !important; border-radius: var(--cm-radius-sm) 0 0 var(--cm-radius-sm) !important;
    background: transparent !important; color: inherit !important; font: inherit; font-size: 14.5px !important; font-weight: 600; box-shadow: none !important; outline: none;
  }
  .cm-dn-datebar__input:focus, .cm-dn-datebar input.flatpickr-input:focus { border-color: var(--cm-accent) !important; }
  .cm-dn-datebar__go { border-radius: 0 var(--cm-radius-sm) var(--cm-radius-sm) 0; background: var(--cm-accent); border-color: var(--cm-accent); color: var(--cm-on-accent) !important; }
  .cm-dn-datebar__go:hover { filter: brightness(1.08); }
  .flatpickr-calendar { font-family: inherit; }
  .flatpickr-day.selected, .flatpickr-day.selected:hover { background: var(--cm-accent) !important; border-color: var(--cm-accent) !important; }

  /* Filter */
  .cm-dn__tools { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin: 0 0 18px; }
  .cm-dn__count { font-size: 14px; color: var(--cm-muted); }
  .cm-dn__count strong { color: inherit; }
  .cm-dn__filter { position: relative; flex: 0 1 320px; }
  .cm-dn__filter svg { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); width: 16px !important; height: 16px !important; opacity: .55; pointer-events: none; }
  .cm-dn__filter input { width: 100% !important; height: 40px !important; margin: 0 !important; padding: 0 12px 0 36px !important; border: 1px solid var(--cm-line) !important; border-radius: var(--cm-pill) !important; background: transparent !important; color: inherit !important; font: inherit; font-size: 14px !important; box-shadow: none !important; outline: none; }
  .cm-dn__filter input:focus { border-color: var(--cm-accent) !important; box-shadow: 0 0 0 3px var(--cm-accent-soft) !important; }

  /* Grid of front pages */
  .cm-dn__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 16px; list-style: none !important; margin: 0 !important; padding: 0 !important; }
  @media (min-width: 600px) { .cm-dn__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
  @media (min-width: 900px) { .cm-dn__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px 20px; } }
  @media (min-width: 1180px) { .cm-dn__grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
  .cm-dn__grid > li { margin: 0 !important; padding: 0 !important; min-width: 0; }
  .cm-dn__grid > li::before { content: none !important; }
  .cm-dn-card { display: flex; flex-direction: column; gap: 10px; color: inherit !important; }
  .cm-dn-card__media { position: relative; display: block; aspect-ratio: 230 / 336; overflow: hidden; border-radius: var(--cm-radius-sm); background: var(--cm-surface); border: 1px solid var(--cm-line); box-shadow: 0 1px 2px rgba(0,0,0,.06); transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
  .cm-dn-card__media img { position: absolute; inset: 0; width: 100% !important; height: 100% !important; max-width: none !important; object-fit: cover; object-position: top center; margin: 0 !important; padding: 0 !important; border: 0 !important; }
  .cm-dn-card__media::after { content: ""; position: absolute; inset: auto 0 0 0; height: 36%; background: linear-gradient(to top, rgba(0,0,0,.28), transparent); opacity: 0; transition: opacity .2s; }
  .cm-dn-card:hover .cm-dn-card__media, .cm-dn-card:focus-visible .cm-dn-card__media { transform: translateY(-3px); box-shadow: 0 14px 28px -14px rgba(0,0,0,.45); border-color: var(--cm-accent-line); }
  .cm-dn-card:hover .cm-dn-card__media::after { opacity: 1; }
  .cm-dn-card:focus-visible { outline: none; }
  .cm-dn-card:focus-visible .cm-dn-card__media { outline: 2px solid var(--cm-accent); outline-offset: 2px; }
  .cm-dn-card__name { font-size: 15px; font-weight: 700; line-height: 1.3; text-transform: none; letter-spacing: 0; margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .cm-dn-card:hover .cm-dn-card__name { color: var(--cm-accent); }
  .cm-dn-card__date { font-size: 12.5px; color: var(--cm-muted); margin-top: -6px; }
  .cm-dn__empty { padding: 48px 20px; text-align: center; border: 1px dashed var(--cm-line); border-radius: var(--cm-radius); color: var(--cm-muted); }
  .cm-dn__empty strong { display: block; font-size: 18px; color: inherit; margin-bottom: 6px; }
  .cm-dn__empty a { color: var(--cm-accent) !important; font-weight: 600; }
  .cm-dn__nomatch { display: none; padding: 28px; text-align: center; color: var(--cm-muted); }

  /* Reader */
  .cm-dn-reader { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; align-items: start; }
  @media (min-width: 992px) { .cm-dn-reader { grid-template-columns: minmax(0, 1fr) 300px; } }
  .cm-dn-reader__stage { min-width: 0; }
  .cm-dn-reader__figure { position: relative; margin: 0 !important; border-radius: var(--cm-radius); overflow: hidden; border: 1px solid var(--cm-line); background: var(--cm-surface); box-shadow: 0 18px 40px -24px rgba(0,0,0,.45); }
  .cm-dn-reader__figure img { display: block; width: 100% !important; height: auto !important; max-width: 100% !important; margin: 0 auto !important; }
  .cm-dn-reader__zoom { position: absolute; right: 12px; top: 12px; display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 12px; border-radius: var(--cm-pill); background: rgba(17,17,17,.72); color: #fff !important; font-size: 13px; font-weight: 600; backdrop-filter: blur(4px); }
  .cm-dn-reader__zoom svg { width: 16px !important; height: 16px !important; }
  .cm-dn-reader__bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-top: 14px; }
  .cm-dn-reader__pager { display: flex; gap: 8px; flex-wrap: wrap; }
  .cm-dn-reader__pager a { display: inline-flex; align-items: center; gap: 6px; height: 40px; padding: 0 14px; border: 1px solid var(--cm-line); border-radius: var(--cm-radius-sm); color: inherit !important; font-size: 14px; font-weight: 600; max-width: 100%; }
  .cm-dn-reader__pager a span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 22ch; }
  .cm-dn-reader__pager a svg { width: 16px !important; height: 16px !important; flex: 0 0 auto; }
  .cm-dn-reader__pager a:hover { border-color: var(--cm-accent); color: var(--cm-accent) !important; background: var(--cm-accent-soft); }
  .cm-dn-share { display: flex; align-items: center; gap: 8px; }
  .cm-dn-share__label { font-size: 13px; color: var(--cm-muted); margin-right: 2px; }
  .cm-dn-share a { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--cm-line); color: inherit !important; transition: background-color .15s, color .15s, border-color .15s; }
  .cm-dn-share a svg { width: 16px !important; height: 16px !important; }
  .cm-dn-share a:hover { background: var(--cm-accent); border-color: var(--cm-accent); color: var(--cm-on-accent) !important; }
  .cm-dn-aside { position: sticky; top: var(--cm-sticky-top, 96px); transition: top .2s ease; border: 1px solid var(--cm-line); border-radius: var(--cm-radius); padding: 14px; }
  .cm-dn-aside__title { margin: 0 0 10px !important; font-size: 13px !important; font-weight: 700 !important; letter-spacing: .05em; text-transform: uppercase; color: var(--cm-muted) !important; }
  .cm-dn-aside ul { list-style: none !important; margin: 0 !important; padding: 0 !important; display: grid; gap: 4px; max-height: min(520px, calc(100vh - var(--cm-sticky-top, 96px) - 90px)); overflow-y: auto; overscroll-behavior: contain; }
  .cm-dn-aside li { margin: 0 !important; padding: 0 !important; }
  .cm-dn-aside li::before { content: none !important; }
  .cm-dn-aside a { display: flex; align-items: center; gap: 10px; padding: 6px; border-radius: var(--cm-radius-sm); color: inherit !important; font-size: 14px; font-weight: 600; }
  .cm-dn-aside a img { width: 38px !important; height: 55px !important; object-fit: cover; object-position: top; border-radius: 3px; border: 1px solid var(--cm-line); flex: 0 0 auto; margin: 0 !important; }
  .cm-dn-aside a:hover { background: var(--cm-accent-soft); color: var(--cm-accent) !important; }
  .cm-dn-aside a[aria-current="page"] { background: var(--cm-accent-soft); color: var(--cm-accent) !important; box-shadow: inset 3px 0 0 var(--cm-accent); }
  @media (max-width: 991.98px) {
    .cm-dn-aside { position: static; padding: 12px; }
    .cm-dn-aside ul { grid-auto-flow: column; grid-auto-columns: 92px; overflow-x: auto; overflow-y: hidden; max-height: none; gap: 10px; padding-bottom: 6px !important; scroll-snap-type: x proximity; }
    .cm-dn-aside li { scroll-snap-align: start; }
    .cm-dn-aside a { flex-direction: column; align-items: flex-start; gap: 6px; padding: 4px; font-size: 12.5px; }
    .cm-dn-aside a span { width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .cm-dn-aside a img { width: 84px !important; height: 122px !important; }
    .cm-dn-aside a[aria-current="page"] { box-shadow: inset 0 -3px 0 var(--cm-accent); }
  }
  @media (max-width: 575.98px) {
    .cm-dn { padding-top: 8px; }
    .cm-dn__hero { padding: 12px 0 18px; }
    .cm-dn-datebar { width: 100%; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; }
    .cm-dn-datebar__step-text { display: none; }
    .cm-dn-datebar__step { width: 42px; padding: 0; }
    .cm-dn-datebar__form { min-width: 0; }
    .cm-dn-datebar__field { flex: 1 1 auto; min-width: 0; }
    .cm-dn-datebar__input, .cm-dn-datebar input.flatpickr-input { width: 100% !important; }
    .cm-dn-datebar__today { grid-column: 1 / -1; }
    .cm-dn__filter { flex: 1 1 100%; }
    .cm-dn-card__name { font-size: 14px; }
  }

/* ==== Form controls inside static pages never exceed the content column ==== */
.cm-doc__body input, .cm-doc__body select, .cm-doc__body textarea, .cm-doc__body iframe { max-width: 100% !important; box-sizing: border-box !important; }
@media (max-width: 400px) {
  /* reCAPTCHA renders a fixed 304px widget */
  .cm-doc__body .g-recaptcha { transform: scale(.86); transform-origin: left top; }
}
/* Themes style input[type=search] etc. with content-box sizing; keep our controls border-box */
.cm-dn input, .cm-dn button, .cm-dn select, .cm-doc input, .cm-doc button, .cm-doc select, .cm-doc textarea { box-sizing: border-box !important; }
/* Some themes put margins on every span/header/nav (theme 5): reset inside components */
.cm-doc__hero, .cm-dn__hero, .cm-breadcrumb, .cm-subcats { margin-top: 0 !important; }
.cm-doc__eyebrow, .cm-dn__eyebrow, .cm-doc__meta span, .cm-breadcrumb span, .cm-subcats span, .cm-dn-card span, .cm-dn__count, .cm-dn-datebar span, .cm-dn-share span { margin-top: 0 !important; margin-bottom: 0 !important; }
.cm-doc__meta span { height: auto !important; }

/* ==== Contact page (common/static/contact.ejs) ==== */
.cm-contact { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; }
.cm-contact > * { min-width: 0; }
.cm-contact__info { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; }
@media (min-width: 900px) { .cm-contact__info { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 28px; align-items: stretch; } }
.cm-contact__cards { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.cm-doc .cm-contact__org { margin: 0 0 4px !important; font-size: 13px !important; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--cm-muted) !important; }
.cm-contact__card { display: flex; gap: 14px; align-items: flex-start; padding: 16px; border: 1px solid var(--cm-line); border-radius: var(--cm-radius); background: var(--cm-surface); }
.cm-contact__icon { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 50%; background: var(--cm-accent-soft); color: var(--cm-accent); }
.cm-contact__icon svg { width: 20px !important; height: 20px !important; }
.cm-doc .cm-contact__label { margin: 0 0 4px !important; padding: 0 !important; border: 0 !important; font-size: 14px !important; font-weight: 700 !important; line-height: 1.3 !important; letter-spacing: 0; }
.cm-doc .cm-contact__value { margin: 0 !important; font-style: normal; font-size: 15.5px !important; line-height: 1.6 !important; overflow-wrap: anywhere; }
.cm-contact__value a { color: var(--cm-accent) !important; text-decoration: none !important; font-weight: 600; }
.cm-contact__value a:hover { text-decoration: underline !important; }
.cm-contact__actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.cm-contact__btn { display: inline-flex; align-items: center; min-height: 40px; padding: 8px 14px; border-radius: var(--cm-radius-sm); background: var(--cm-accent); color: var(--cm-on-accent) !important; font-size: 14px; font-weight: 600; text-decoration: none !important; }
.cm-contact__btn--ghost { background: transparent; color: inherit !important; border: 1px solid var(--cm-line); }
.cm-contact__map { position: relative; min-height: 300px; border-radius: var(--cm-radius); overflow: hidden; border: 1px solid var(--cm-line); background: var(--cm-surface); }
.cm-contact__map iframe { position: absolute; inset: 0; width: 100% !important; height: 100% !important; border: 0 !important; margin: 0 !important; display: block; }

.cm-contact__form-wrap { padding: clamp(20px, 3.5vw, 36px); border: 1px solid var(--cm-line); border-radius: var(--cm-radius); background: var(--cm-surface); }
.cm-contact__form-head { margin-bottom: 20px; }
.cm-doc .cm-contact__form-title { margin: 0 !important; padding: 0 !important; border: 0 !important; font-size: clamp(20px, 2.4vw, 26px) !important; font-weight: 800 !important; line-height: 1.2 !important; }
.cm-doc .cm-contact__form-sub { margin: 6px 0 0 !important; font-size: 14px !important; color: var(--cm-muted) !important; line-height: 1.5 !important; }
.cm-contact__form { display: grid; gap: 16px; margin: 0; padding: 0; border: 0; background: none; }
.cm-contact__row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
@media (min-width: 640px) { .cm-contact__row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.cm-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.cm-field label { margin: 0; font-size: 14px; font-weight: 600; line-height: 1.3; color: inherit; }
.cm-field label small { font-weight: 400; color: var(--cm-muted); }
.cm-field input, .cm-field textarea {
  width: 100% !important; max-width: 100% !important; margin: 0 !important; box-sizing: border-box !important;
  padding: 11px 14px !important; border: 1px solid color-mix(in srgb, currentColor 22%, transparent) !important; border-radius: var(--cm-radius-sm) !important;
  background: #fff !important; color: #1f2328 !important; font: inherit; font-size: 15px !important; line-height: 1.4 !important;
  box-shadow: none !important; outline: none !important; transition: border-color .15s, box-shadow .15s; -webkit-appearance: none; appearance: none;
}
.cm-field input { height: 46px !important; }
.cm-field textarea { min-height: 170px; resize: vertical; }
.cm-field input[type="file"] { height: auto !important; padding: 9px !important; font-size: 14px !important; cursor: pointer; }
.cm-field input[type="file"]::file-selector-button { margin-right: 12px; padding: 7px 12px; border: 0; border-radius: var(--cm-radius-sm); background: var(--cm-accent-soft); color: var(--cm-accent); font-weight: 600; cursor: pointer; }
.cm-field input:focus, .cm-field textarea:focus { border-color: var(--cm-accent) !important; box-shadow: 0 0 0 3px var(--cm-accent-soft) !important; }
.cm-field input.is-invalid, .cm-field textarea.is-invalid { border-color: #d93025 !important; box-shadow: 0 0 0 3px rgba(217,48,37,.12) !important; }
.cm-field__error { font-size: 13px; color: #d93025; }
.cm-field__error[hidden] { display: none !important; }
.cm-contact__submit-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; }
.cm-contact__submit { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-width: 160px; height: 48px; padding: 0 24px; border: 0 !important; border-radius: var(--cm-radius-sm); background: var(--cm-accent) !important; color: var(--cm-on-accent) !important; font: inherit; font-size: 15px; font-weight: 700; cursor: pointer; transition: filter .15s, transform .15s; margin: 0 !important; }
.cm-contact__submit svg { width: 18px !important; height: 18px !important; }
.cm-contact__submit:hover { filter: brightness(1.08); }
.cm-contact__submit:active { transform: translateY(1px); }
.cm-contact__submit:disabled { opacity: .6; cursor: progress; }
.cm-contact__submit.is-loading svg { animation: cm-spin .9s linear infinite; }
@keyframes cm-spin { to { transform: rotate(360deg); } }
.cm-doc .cm-contact__warn { margin: 0 !important; padding: 10px 14px; border-radius: var(--cm-radius-sm); border: 1px solid #f5c26b; background: #fff8e6; color: #7a4b00 !important; font-size: 14px !important; }
.cm-contact__warn[hidden] { display: none !important; }
@media (max-width: 575.98px) {
  .cm-contact__submit-row { flex-direction: column; align-items: stretch; }
  .cm-contact__submit { width: 100%; }
  .cm-contact__map { min-height: 240px; }
}

/* ==== Sticky side panels (legal ToC, newspaper side list) ====
   overflow:hidden on <html>/<body> or a wrapper turns it into a scroll container that never
   scrolls, so position:sticky stops working (themes 1 and 5). overflow:clip still clips but
   doesn't create a scroll container. */
html:has(.cm-doc__toc, .cm-dn-aside), html:has(.cm-doc__toc, .cm-dn-aside) body { overflow-x: clip !important; overflow-y: visible !important; }
.read-new:has(.cm-doc__toc, .cm-dn-aside) { overflow: clip !important; overflow-clip-margin: 0; }
/* Theme 7 caps its article holder at 780px; the newspaper pages use the full container */
.holder.cm-dn-shell { display: block !important; max-width: 1200px !important; width: 100% !important; margin-left: auto; margin-right: auto; box-sizing: border-box; }
/* Theme 7 caps its article holder at 780px and offsets <main>; the shared pages use the full
   container. Only the side padding is ours — the top padding must clear theme 7's fixed header
   (62px) plus its ticker tape (44px), which its own main rule (100px) does not quite do. */
main:has(> .holder.cm-dn-shell) { max-width: none !important; width: 100% !important; left: auto !important; margin: 0 !important; padding-left: 16px !important; padding-right: 16px !important; box-sizing: border-box; }
@media (min-width: 926px) { main:has(> .holder.cm-dn-shell) { padding-top: 124px !important; } }

/* Related pages: title + the page's own description */
.cm-doc__related-text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.cm-doc__related-text strong { font-weight: 700; font-size: 15px; line-height: 1.3; }
.cm-doc__related-text small { font-weight: 400; font-size: 13px; line-height: 1.4; color: var(--cm-muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cm-doc__related a { align-items: center; }

/* ==== Game archive (sudoku / crossword): last 7 days + date picker ==== */
.cm-archive, .cm-archive * { box-sizing: border-box; }
.cm-archive { --cm-accent-soft: color-mix(in srgb, var(--cm-accent) 10%, transparent); --cm-line: color-mix(in srgb, currentColor 14%, transparent); --cm-muted: color-mix(in srgb, currentColor 58%, transparent); margin: 28px 0 0; padding: 18px; border: 1px solid var(--cm-line); border-radius: var(--cm-radius, 12px); }
.cm-archive__head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 14px; }
.cm-archive .cm-archive__title { margin: 0 !important; padding: 0 !important; border: 0 !important; font-size: 17px !important; font-weight: 800 !important; line-height: 1.3 !important; }
.cm-archive__hint { font-size: 12.5px; color: var(--cm-muted); white-space: nowrap; }
.cm-archive__row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 14px 18px; }
.cm-archive__days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; flex: 1 1 420px; list-style: none !important; margin: 0 !important; padding: 0 !important; }
.cm-archive__days li { margin: 0 !important; padding: 0 !important; }
.cm-archive__days li::before { content: none !important; }
.cm-archive__day { display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 8px 4px; border: 1px solid var(--cm-line); border-radius: var(--cm-radius-sm, 8px); color: inherit !important; text-decoration: none !important; line-height: 1.1; transition: border-color .15s, background-color .15s, color .15s; }
.cm-archive__dow { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--cm-muted); }
.cm-archive__num { font-size: 19px; font-weight: 800; }
.cm-archive__mon { font-size: 11.5px; color: var(--cm-muted); }
.cm-archive__day:hover { border-color: var(--cm-accent); background: var(--cm-accent-soft); color: var(--cm-accent) !important; }
.cm-archive__day.is-active { background: var(--cm-accent); border-color: var(--cm-accent); color: var(--cm-on-accent, #fff) !important; }
.cm-archive__day.is-active .cm-archive__dow, .cm-archive__day.is-active .cm-archive__mon { color: inherit; opacity: .85; }
.cm-archive__pick { flex: 0 1 260px; margin: 0; }
.cm-archive__pick label { display: block; margin: 0 0 6px; font-size: 12.5px; font-weight: 600; color: var(--cm-muted); }
.cm-archive__pick-row { display: flex; }
.cm-archive__pick input { flex: 1 1 auto; min-width: 0; height: 42px !important; margin: 0 !important; padding: 0 10px !important; border: 1px solid var(--cm-line) !important; border-right: 0 !important; border-radius: var(--cm-radius-sm, 8px) 0 0 var(--cm-radius-sm, 8px) !important; background: transparent !important; color: inherit !important; font: inherit; font-size: 14px !important; box-shadow: none !important; }
.cm-archive__pick input:focus { outline: none; border-color: var(--cm-accent) !important; }
.cm-archive__pick button { height: 42px; padding: 0 16px; border: 0; border-radius: 0 var(--cm-radius-sm, 8px) var(--cm-radius-sm, 8px) 0; background: var(--cm-accent); color: var(--cm-on-accent, #fff); font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
@media (max-width: 575.98px) {
  .cm-archive { padding: 14px; }
  .cm-archive__days { flex-basis: 100%; gap: 5px; }
  .cm-archive__num { font-size: 17px; }
  .cm-archive__pick { flex-basis: 100%; }
}
/* flatpickr enhancement: calendar icon in the alt input; only published days are enabled */
.cm-archive__pick-row { position: relative; }
.cm-archive__pick-icon { display: none; }
.cm-archive__pick.is-enhanced .cm-archive__pick-icon { display: block; position: absolute; left: 11px; top: 50%; width: 18px !important; height: 18px !important; margin-top: -9px; color: var(--cm-accent); pointer-events: none; z-index: 1; }
.cm-archive__pick.is-enhanced input.cm-archive__date { padding-left: 38px !important; font-weight: 600; cursor: pointer; }
.cm-archive-cal .flatpickr-day:not(.flatpickr-disabled) { font-weight: 700; }
.cm-archive-cal .flatpickr-day:not(.flatpickr-disabled):not(.selected):hover, .cm-archive-cal .flatpickr-day:not(.flatpickr-disabled):not(.selected):focus { background: color-mix(in srgb, var(--cm-accent) 12%, transparent); border-color: transparent; color: var(--cm-accent); }
.cm-archive-cal .flatpickr-day.flatpickr-disabled, .cm-archive-cal .flatpickr-day.flatpickr-disabled:hover { color: rgba(57, 57, 57, .22); }

/* ==== Pagination (common/components/pagination.ejs) ==== */
.cm-pager { --cm-line: color-mix(in srgb, currentColor 16%, transparent); --cm-accent-soft: color-mix(in srgb, var(--cm-accent) 10%, transparent); display: flex; align-items: center; justify-content: center; gap: 10px; margin: 40px 0 16px; padding: 0; font-size: 15px; }
.cm-pager, .cm-pager * { box-sizing: border-box; }
.cm-pager--left { justify-content: flex-start; }
.cm-pager__pages { display: flex; align-items: center; gap: 6px; list-style: none !important; margin: 0 !important; padding: 0 !important; }
.cm-pager__pages li { margin: 0 !important; padding: 0 !important; }
.cm-pager__pages li::before { content: none !important; }
.cm-pager__page, .cm-pager__step { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 44px; height: 44px; padding: 0 12px; border: 1px solid var(--cm-line); border-radius: var(--cm-radius-sm, 8px); color: inherit !important; background: transparent; font-weight: 600; line-height: 1; text-decoration: none !important; transition: border-color .15s, background-color .15s, color .15s; }
.cm-pager__step { padding: 0 16px; white-space: nowrap; }
.cm-pager__step svg { width: 18px !important; height: 18px !important; flex: 0 0 auto; }
.cm-pager a.cm-pager__page:hover, .cm-pager a.cm-pager__step:hover { border-color: var(--cm-accent); color: var(--cm-accent) !important; background: var(--cm-accent-soft); }
.cm-pager__page.is-current { background: var(--cm-accent); border-color: var(--cm-accent); color: var(--cm-on-accent, #fff) !important; }
.cm-pager__step.is-disabled { opacity: .35; }
.cm-pager__gap { min-width: 20px; text-align: center; opacity: .6; }
.cm-pager__status { display: none; font-size: 14px; font-weight: 600; white-space: nowrap; }
@media (max-width: 640px) {
  .cm-pager { justify-content: space-between; gap: 8px; }
  .cm-pager__pages { display: none; }
  .cm-pager__status { display: inline; }
  .cm-pager__step span { display: none; }
  .cm-pager__step { min-width: 48px; padding: 0 12px; }
}
