/* ══════════════════════════════════════════════
 * KidsEatFree.ca - Universal Stylesheet
 * Version: 2.0
 * Generated: 2025-02-08
 * ══════════════════════════════════════════════ */

:root {
  --text: #0b1215;
  --bg: #fff;
  --link: #2563eb;
  --link-hover: #214ea5;
  --green: #19874d;
  --yellow: #fde047;
  --border: #b3b3b3;
  --border-focus: #0b1215;
  --placeholder: #777;
  --cuisine: #666666;
  --cuisine-bg: #FDFBF0;
  --star-saved: #FFEB3B;
  --rgb-blurple: 85, 34, 250;

  --mon: #e67700; --mon-bg: #fff3e0;
  --tue: #2b8a3e; --tue-bg: #e6f4ea;
  --wed: #5f3dc4; --wed-bg: #ede7f6;
  --thu: #2188d6; --thu-bg: #e0f0ff;
  --fri: #b71c1c; --fri-bg: #ffebee;
  --sat: #24508b; --sat-bg: #dce4f2;
  --sun: #7b5b3a; --sun-bg: #f5e6d0;

  --mon-dim: #f7e4cc; --tue-dim: #cde8d3; --wed-dim: #ddd4ed;
  --thu-dim: #cee2f2; --fri-dim: #f0cccc; --sat-dim: #ced6e3; --sun-dim: #dfd1bb;

  --sp-micro: 0.236em;
  --sp-tight: 0.382em;
  --sp-small: 0.618em;
  --sp-base:  1em;
  --sp-med:   1.618em;
  --sp-large: 2.618em;
  --sp-xl:    4.236em;

  --btn-dead-t: 11px;
  --btn-dead-b: 10px;
  --input-gap: -1px;
  --filter-indent: 2px;
  --filter-gap: 5px;
  --breadcrumb-weight: 500;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

/* One house font everywhere: KEFira = Fira Code + our custom glyphs. Served under
   both family names so all existing 'Fira Code' and 'KEFira' rules resolve to the
   single file. Ligatures off, to match the plain-text look the site is built for. */
@font-face { font-family: 'Fira Code'; src: url('/fonts/kefira.woff2') format('woff2'); font-weight: 300 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'KEFira'; src: url('/fonts/kefira.woff2') format('woff2'); font-weight: 300 700; font-style: normal; font-display: swap; }

html, body { height: 100%; }

body {
  font-family: 'Fira Code', monospace;
  font-variant-ligatures: none;
  font-size: 14px;
  line-height: 1.5;
  color: var(--text);
  background: var(--bg);
  padding: 0 1ch;
  overflow-x: hidden; display: flex; flex-direction: column;
}

main { flex: 1 0 auto; }
header.content { padding-top: 1ch; }

a { color: var(--link); text-decoration: underline; font-weight: 500; }
a:hover { color: var(--link-hover); }
.jump-link { text-decoration: none; white-space: nowrap; }

/* ── Content Container ── */
.content { width: 36ch; margin: 0 auto; }
.content > *:not(.menu-panel) { margin-top: var(--sp-med); }
.content > *:first-child { margin-top: 0; }

/* ── Page Title & Breadcrumb ── */
.page-title { margin: 0; white-space: normal; font-size: 36.65px; font-weight: 400; }
.content > .page-title + * { margin-top: var(--sp-small); }
.content > .breadcrumb + .page-title { margin-top: -8px; }
.breadcrumb { color: var(--text); margin-bottom: var(--sp-tight); }
.breadcrumb a { text-decoration: underline; font-weight: var(--breadcrumb-weight); }

/* ── Link Lists ── */
.link-list { white-space: normal; line-height: 2.427; }
.link-list a { display: inline-block; white-space: nowrap; text-decoration: none; }
.link-list a span { text-decoration: underline; }
.link-list a:hover span { color: var(--link-hover); }
.link-list a::after { content: ", "; color: var(--text); }
.link-list a:last-child::after { content: ""; }

/* ── Collapsible Sections (accordion) ── */
.collapsed-section { display: contents; padding: 0; margin: 0; white-space: normal; }
.collapsed-section .section-btn {
  cursor: pointer;
  padding: 0; margin: 0;
  flex: 0 auto; order: 0;
}
.collapsed-section .section-btn::-webkit-details-marker { display: none; }
.collapsed-section .link-list { flex: 0 0 100%; order: 99; position: absolute; overflow: hidden; clip: rect(0,0,0,0); clip-path: inset(50%); width: 1px; height: 1px; white-space: nowrap; }
.collapsed-section.active > .link-list { position: static; overflow: visible; clip: auto; clip-path: none; width: auto; height: auto; white-space: normal; margin-top: var(--sp-small); margin-bottom: var(--sp-small); }
.intro + .intro { margin-top: var(--sp-small); }
.intro { margin-bottom: 0; }
.geographic-sections {
  display: flex; flex-wrap: wrap;
  align-items: flex-start;
}
.section-btn .btn-full { display: inline-block; }
.section-btn .btn-mid { display: none; }
.section-btn .btn-short { display: none; }
@media (max-width: 359px) {
  .section-btn .btn-full { display: none; }
  .section-btn .btn-mid { display: inline-block; }
  .section-btn .btn-short { display: inline-block; }
}

/* ── Filters Row ── */
.content > .filters-row {
  margin-top: var(--filter-gap);
}
.content > .location-finder {
  margin-top: var(--input-gap);
}
.content > .location-finder:first-child {
  margin-top: var(--sp-med);
}
.content > .geographic-sections:first-child {
  margin-top: 12px;
}
.filters-row {
  display: flex; align-items: flex-start; overflow: visible; position: relative; z-index: 1;
}
.filters-right { display: flex; align-items: center; margin-left: auto; margin-right: -13px; flex-shrink: 0; overflow: visible; }

/* ── Day Filter Checkboxes ── */
.day-filters label { display: inline-block; margin-right: 0.5em; margin-bottom: var(--sp-micro); cursor: pointer; white-space: nowrap; }
.day-filters label:last-child { margin-right: 0; }
.day-filters { margin-left: 0; flex: 1; display: flex; flex-wrap: wrap; align-items: baseline; padding-left: var(--filter-indent); }
.day-filters input {
  appearance: none; -webkit-appearance: none;
  width: 14px; height: 14px; border: 1px solid var(--text);
  background: var(--bg); vertical-align: -2px; margin: 0 4px 0 0;
  cursor: pointer; position: relative;
}
.day-filters input:checked { background: var(--bg); }
.day-filters input:checked::after {
  content: ""; width: 8px; height: 8px;
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  background:
    linear-gradient(45deg, transparent 42%, currentColor 42%, currentColor 58%, transparent 58%),
    linear-gradient(-45deg, transparent 42%, currentColor 42%, currentColor 58%, transparent 58%);
}
.day-filters input[value="mon"]:checked { background: var(--mon-bg); }
.day-filters input[value="mon"]:checked::after { color: var(--mon); }
.day-filters input[value="tue"]:checked { background: var(--tue-bg); }
.day-filters input[value="tue"]:checked::after { color: var(--tue); }
.day-filters input[value="wed"]:checked { background: var(--wed-bg); }
.day-filters input[value="wed"]:checked::after { color: var(--wed); }
.day-filters input[value="thu"]:checked { background: var(--thu-bg); }
.day-filters input[value="thu"]:checked::after { color: var(--thu); }
.day-filters input[value="fri"]:checked { background: var(--fri-bg); }
.day-filters input[value="fri"]:checked::after { color: var(--fri); }
.day-filters input[value="sat"]:checked { background: var(--sat-bg); }
.day-filters input[value="sat"]:checked::after { color: var(--sat); }
.day-filters input[value="sun"]:checked { background: var(--sun-bg); }
.day-filters input[value="sun"]:checked::after { color: var(--sun); }

/* ── Cuisine Toggle ── */
.btn3d-link { text-decoration: none; }
.nowrap { white-space: nowrap; }
#cuisineBtn { margin-top: -11px; margin-bottom: -10px; line-height: 0; cursor: pointer; position: relative; z-index: 2; }
#randomBtn { line-height: 0; cursor: pointer; position: relative; z-index: 2; }
.filters-right #randomBtn { margin-top: -11px; margin-bottom: -10px; }
.random-label { display: none; }
.random-icon  { display: inline-block; }
@media (min-width: 390px) {
  .random-label { display: inline-block; }
  .random-icon  { display: none; }
}

/* ── Search Input ── */
.finder-search {
  position: relative;
}
.finder-search input {
  font-family: 'Fira Code', monospace; font-size: 14px;
  padding: 8px 8px 8px 30px;
  border: 1px solid #DDD6C5;
  border-top: 5px solid #A89E87;
  border-right: 5px solid #DDD6C5;
  box-shadow: inset 4px 4px 0px rgba(1,2,2,0.18);
  background: #fff; width: 100%; outline: none;
}
.finder-search input::placeholder { color: var(--placeholder); }
.finder-search input:focus { background: #fff; border-color: #EDE8DF; border-top-color: #DDD6C5; border-right-color: #EDE8DF; }
.finder-search .search-icon {
  font-size: 14px; line-height: 1;
  position: absolute; left: 0; top: 50%; transform: translateY(-42%);
  padding: 8px 0 8px 8px; pointer-events: none;
}
button.btn3d { background: none; border: none; outline: none; padding: 0; cursor: pointer; }

/* ── Listings ── */
.listings-container, .day-panel-wrap { width: 36ch; margin: 0 auto; margin-top: var(--sp-tight); }
.content > .listings-container, .content > .day-panel-wrap { margin-top: var(--sp-tight); }
.listing {
  display: flex; padding: var(--sp-small) 0;
  border-bottom: 1px solid var(--border);
}
.listing.last-visible { border-bottom: none; }
.listing.hidden { display: none; }
.col-where { width: 18ch; }
.col-when { width: 15ch; text-align: right; }
.col-when a { text-decoration: none; }
.col-when a:hover { text-decoration: underline; }

/* ── Favourite Star (CSS only) ── */
.col-fav {
  width: 2ch; flex-shrink: 0; align-self: flex-start;
  text-align: left; margin-right: var(--sp-tight);
}
.col-fav button {
  background: none; border: none; cursor: pointer;
  padding: 0; line-height: 1.5; font-size: 14px;
}
.col-fav button:hover { opacity: 0.7; }
.col-fav button .star-on { display: none; color: var(--star-saved); -webkit-text-stroke: 0.5px var(--text); }
.col-fav button .star-off { display: inline; color: #fff; -webkit-text-stroke: 0.6px var(--text); }
.col-fav button.saved .star-on { display: inline; }
.col-fav button.saved .star-off { display: none; }

.restaurant-name a { text-decoration: underline; }
.detail-neighbourhood .street-link { color: var(--text); text-decoration: none; font-weight: 400; }
.detail-neighbourhood .street-link:hover { color: var(--link-hover); text-decoration: underline; font-weight: 500; }
.detail-neighbourhood .brand-link { text-decoration: none; font-weight: 500; }
.detail-neighbourhood .brand-link:hover { color: var(--link-hover); }
.open-now { color: var(--green); font-weight: 500; margin-left: 1ch; text-transform: uppercase; letter-spacing: 0.5px; }

.restaurant-name .name-short { display: none; }
.restaurant-detail { color: var(--text); }
.restaurant-detail .detail-neighbourhood { display: block; }
.restaurant-detail .detail-type { display: block; }
.restaurant-detail .detail-type a { color: var(--link); }
.restaurant-detail .detail-type .cuisine { display: inline-block; white-space: nowrap; }
.cuisine-dots { color: var(--link); cursor: pointer; font-weight: 500; text-decoration: none; margin-left: 1ch; }
.cuisine-dots .dots-char { position: relative; top: -1px; }
.sm-bracket { font-size: 12px; }
.cuisine-dots:hover { color: var(--link-hover); }
.cuisine-extra { position: absolute; overflow: hidden; clip: rect(0,0,0,0); clip-path: inset(50%); height: 1px; width: 1px; white-space: nowrap; }
.cuisine-expanded .cuisine-extra { position: static; overflow: visible; clip: auto; clip-path: none; height: auto; width: auto; white-space: normal; }
.cuisine-expanded .cuisine-dots { display: none; }
.cuisines-open .cuisine-extra { position: static; overflow: visible; clip: auto; clip-path: none; height: auto; width: auto; white-space: normal; }
.cuisines-open .cuisine-dots { display: none; }

@media (max-width: 500px) {
  .restaurant-name .name-full { display: none; }
  .restaurant-name .name-short { display: inline; }
}

/* ── Day Text Colors ── */
.day-mon { color: var(--mon); font-weight: 500; } .day-tue { color: var(--tue); font-weight: 500; }
.day-wed { color: var(--wed); font-weight: 500; } .day-thu { color: var(--thu); font-weight: 500; }
.day-fri { color: var(--fri); font-weight: 500; } .day-sat { color: var(--sat); font-weight: 500; }
.day-sun { color: var(--sun); font-weight: 500; }
.day-mon.dimmed { color: var(--mon-dim); } .day-tue.dimmed { color: var(--tue-dim); }
.day-wed.dimmed { color: var(--wed-dim); } .day-thu.dimmed { color: var(--thu-dim); }
.day-fri.dimmed { color: var(--fri-dim); } .day-sat.dimmed { color: var(--sat-dim); }
.day-sun.dimmed { color: var(--sun-dim); }

/* ── Day Panel (empty-state nav) ── */
.day-panel-wrap { position: absolute; overflow: hidden; clip: rect(0,0,0,0); clip-path: inset(50%); height: 1px; white-space: nowrap; }
.day-panel-wrap.visible { position: static; overflow: visible; clip: auto; clip-path: none; height: auto; white-space: normal; }
.day-panel-wrap .listing:last-child { border-bottom: none; }
.day-panel-wrap .col-fav { font-size: 14px; line-height: 1.5; }
.day-panel-wrap .col-fav .day-star { -webkit-text-stroke: 0.5px; }
.day-panel-wrap .col-when { font-weight: 500; }
.day-panel-wrap .restaurant-detail { font-size: 14px; }
.day-panel-wrap .restaurant-detail a { color: inherit; text-decoration: none; font-weight: 400; }
.day-panel-wrap .restaurant-name a:hover { color: var(--link-hover); font-weight: 500; }
.day-panel-wrap .restaurant-detail a:hover { color: var(--link-hover); font-weight: 500; text-decoration: underline; }
.day-panel-wrap .col-where:hover .restaurant-name a { color: var(--link-hover); font-weight: 500; }
.day-panel-wrap .col-when a:hover { color: var(--link-hover); text-decoration: underline; }
.today-arrow { text-decoration: none; display: inline-block; }
.day-panel-reset { text-align: center; margin-top: var(--sp-small); line-height: 0; cursor: pointer; }
.location-finder.hidden, .filters-row.hidden, .listings-container.hidden { display: none; }

/* ── Bottom Sections ── */
/* ── Intro Section ── */
.intro-section {
  position: relative;
  width: 36ch;
  margin: var(--sp-small) auto 0;
  padding: 12px;
  border: 1ch solid transparent;
  background:
    linear-gradient(var(--bg), var(--bg)) padding-box,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 284 1200 1200'%3E%3Cpath fill='currentColor' d='M504 398h192l-18 401 374-139 58 179-385 107 249 314-152 110-222-333-222 333-152-110 249-314-385-107 58-179 374 139z'/%3E%3C/svg%3E") space border-box;
  background-size: auto, 1ch 1ch;
}
.intro-section .intro { margin: 0; }
.intro-section .intro + .intro { margin-top: var(--sp-small); }
.intro-toggle {
  position: absolute;
  top: 1ch;
  right: 0;
  transform: translateY(-50%);
  cursor: pointer;
  font-family: Fira Code, monospace;
  font-size: 10px;
  font-weight: 400;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--text);
  line-height: 1;
}
.intro-section.active .intro-toggle::after { content: "hide"; }
.intro-section:not(.active) .intro-toggle::after { content: "show"; }
/* Collapsed */
.intro-section:not(.active) {
  padding: 0.5ch 12px;
}
.intro-section:not(.active) .intro {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}
.bottom-sections { width: 36ch; margin: 0 auto; }
.nearby-card {
  margin-top: var(--sp-large);
  margin-bottom: var(--sp-large);
  text-align: center;
  padding: 1ch 2ch;
  border: 1ch solid transparent;
  background:
    linear-gradient(var(--bg), var(--bg)) padding-box,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 284 1200 1200'%3E%3Cpath fill='currentColor' d='M504 398h192l-18 401 374-139 58 179-385 107 249 314-152 110-222-333-222 333-152-110 249-314-385-107 58-179 374 139z'/%3E%3C/svg%3E") space border-box;
  background-size: auto, 1ch 1ch;
}
.nearby-plain { margin-top: var(--sp-large); text-align: center; }
.daily-box {
  margin-top: var(--sp-large);
  text-align: center;
  padding: 1ch 2ch;
  border: 1ch solid transparent;
  background:
    linear-gradient(var(--bg), var(--bg)) padding-box,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 284 1200 1200'%3E%3Cpath fill='currentColor' d='M504 398h192l-18 401 374-139 58 179-385 107 249 314-152 110-222-333-222 333-152-110 249-314-385-107 58-179 374 139z'/%3E%3C/svg%3E") space border-box;
  background-size: auto, 1ch 1ch;
}
.daily-box-label { font-weight: 500; }
.daily-box-links { line-height: 2.427; }
.daily-box-links a { display: inline-block; white-space: nowrap; text-decoration: none; margin: 0 var(--sp-tight); }
.daily-box-links a span { text-decoration: underline; }
.daily-box-links a:hover span { color: var(--link-hover); }
.daily-box-cal { line-height: 2.427; }
.daily-box-cal a { display: inline-block; white-space: nowrap; text-decoration: none; margin: 0 var(--sp-tight); }
.daily-box-cal a span { text-decoration: underline; }
.daily-box-cal a:hover span { color: var(--link-hover); }
.nearby-label { font-weight: 500; }
.nearby-links { line-height: 2.427; }
.nearby-links a { display: inline-block; white-space: nowrap; text-decoration: none; margin: 0 0.764em 0 0; }
.nearby-links a span { text-decoration: underline; }
.nearby-links a:hover span { color: var(--link-hover); }
.nearby-parents { line-height: 2.427; border-top: 1px solid var(--border); padding-top: var(--sp-small); margin-top: var(--sp-small); }
.nearby-parents a { display: inline-block; white-space: nowrap; text-decoration: underline; margin: 0 0.764em 0 0; }
.nearby-parents a:hover { color: var(--link-hover); }
.bottom-link { margin-top: var(--sp-med); }
.bottom-blurb { margin-top: var(--sp-large); margin-bottom: var(--sp-large); display: flex; justify-content: center; align-items: baseline; }
.bottom-blurb a { flex: 1; display: block; white-space: nowrap; text-decoration: none; margin: 0 var(--sp-base); }
.bottom-blurb a:first-child { text-align: center; }
.bottom-blurb a:last-child { text-align: center; }
.bottom-blurb a span { text-decoration: underline; }
.bottom-blurb a:hover span { color: var(--link-hover); }
.blurb-leaf { flex-shrink: 0; width: 2ch; text-align: center; }
@media (max-width: 504px) {
  .bottom-blurb { flex-direction: column; align-items: center; line-height: 2.427; }
  .bottom-blurb a { flex: none; margin: 0; }
  .bottom-blurb a:first-child, .bottom-blurb a:last-child { text-align: center; }
  .blurb-leaf { width: auto; }   /* natural order: link / leaf / link (James, Jul 4) */
}
.bottom-cta { text-align: center; margin-top: 51px; }
.bottom-block { margin-top: var(--sp-xl); }
.bottom-heading { font-weight: 500; text-align: center; margin-bottom: var(--sp-small); }
.bottom-block p { margin: 0; }
.bottom-block a { color: var(--link); text-decoration: underline; }
.bottom-block a:hover { color: var(--link-hover); }
.subscribe-options {
  display: flex; flex-wrap: wrap; align-items: baseline;
  padding-left: var(--filter-indent);
  margin-top: var(--filter-gap);
}
.subscribe-options label { display: inline-block; margin-right: 1.3em; margin-bottom: var(--sp-micro); cursor: pointer; white-space: nowrap; font-weight: 400; }
.subscribe-options label:last-child { margin-right: 0; }
.subscribe-options label:has(input:checked) { font-weight: 500; }
.subscribe-options label:has(.subscribe-geo) { display: inline-flex; white-space: normal; font-weight: 400; cursor: default; text-transform: uppercase; }
.subscribe-kef { display: inline-block; }
.subscribe-options input[type="checkbox"] {
  appearance: none; -webkit-appearance: none;
  width: 14px; height: 14px; border: 1px solid var(--text);
  background: var(--bg); vertical-align: -2px; margin: 0 4px 0 0;
  cursor: pointer; position: relative; flex-shrink: 0;
}
.subscribe-options label:has(.subscribe-geo) input[type="checkbox"] { margin-top: 3px; vertical-align: top; cursor: default; }
.subscribe-options input[type="checkbox"]:checked { background: var(--bg); }
.subscribe-options input[type="checkbox"]:checked::after {
  content: ""; width: 8px; height: 8px;
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  background:
    linear-gradient(45deg, transparent 42%, var(--text) 42%, var(--text) 58%, transparent 58%),
    linear-gradient(-45deg, transparent 42%, var(--text) 42%, var(--text) 58%, transparent 58%);
}
.subscribe-form {
  /* stacked form: input full-width, button below-left (James, Jul 10 PM --
     supersedes the ROW form; matches the canonical geo treatment) */
  display: flex; flex-direction: column; align-items: flex-start;
  margin-top: var(--sp-small);
}
.subscribe-form input[type="email"] {
  font-family: 'Fira Code', monospace; font-size: 14px;
  padding: 8px;
  border: 1px solid #DDD6C5;
  border-top: 5px solid #A89E87;
  border-right: 5px solid #DDD6C5;
  box-shadow: inset 4px 4px 0px rgba(1,2,2,0.18);
  background: #fff; width: 100%; outline: none; min-width: 0;
}
.subscribe-form input[type="email"]::placeholder { color: var(--placeholder); }
.subscribe-form input[type="email"]:focus { background: #fff; border-color: #EDE8DF; border-top-color: #DDD6C5; border-right-color: #EDE8DF; }
.subscribe-form .btn3d { flex-shrink: 0; margin-top: 2px; }  /* button below the input, left-aligned, small gap above it (James, Jul 12) */
.subscribe-form + .subscribe-options { margin-top: var(--input-gap); }
.nl-check { display: flex; align-items: baseline; gap: 6px; cursor: pointer; font-weight: 400; margin-top: var(--sp-small); line-height: 1.5; text-align: left; }
.nl-check input { appearance: none; -webkit-appearance: none; width: 14px; height: 14px; border: 1px solid var(--text); background: var(--bg); margin: 6px 0 0; flex-shrink: 0; cursor: pointer; position: relative; top: 2px; }  /* was 4px; sat 2px high (James, Jul 4) */
.nl-check input:checked::after { content: ""; width: 8px; height: 8px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: linear-gradient(45deg, transparent 42%, var(--text) 42%, var(--text) 58%, transparent 58%), linear-gradient(-45deg, transparent 42%, var(--text) 42%, var(--text) 58%, transparent 58%); }
.nl-status { min-height: 1em; margin-top: var(--sp-tight); font-size: 13px; }
.nl-status.ok { color: #1a7a3a; }
.nl-status.err { color: #c0392b; }
.nl-status.pending { color: var(--text); }
.nl-local { margin-top: var(--sp-small); line-height: 1.8; }
.nl-local-lbl { font-weight: 500; }
.nl-local a { color: var(--link); text-decoration: underline; font-weight: 500; }


/* ── FAQ ── */
.faq-section { margin-top: 0; background: #f9f9f9; padding: var(--sp-base) 0; box-shadow: 2ch 0 #f9f9f9, -2ch 0 #f9f9f9; }
.bottom-sections .faq-section { margin-top: var(--sp-med); }   /* breathing room above the shaded FAQ, geo only (James, Jul 5) */
.faq-item { margin-bottom: var(--sp-base); }
.faq-item:last-child { margin-bottom: 0; }
.faq-q { margin: 0; }
.faq-a { margin: 0; color: #6e6e6e; }
.faq-a a { color: inherit; }
.faq-a a:hover { color: #4a4a4a; }
.ext-arrow { display: inline-block; width: 0.7em; height: 0.7em; vertical-align: baseline; position: relative; top: -0.15em; }

/* ── Responsive Addresses ── */
.addr-short { display: inline; }
.addr-full { display: none; }

/* ══════════════════════════════════════════════
 * RESPONSIVE BREAKPOINTS
 * 36ch → 40ch → 44ch → 46ch → 56ch → 68ch
 * ══════════════════════════════════════════════ */
@media (min-width: 360px) {
  .content,
  .listings-container, .day-panel-wrap, .bottom-sections, .intro-section { width: 40ch; }
  .col-where { width: 22ch; }
  .day-filters label { margin-right: var(--sp-base); }
}
@media (min-width: 390px) {
  .content,
  .listings-container, .day-panel-wrap, .bottom-sections, .intro-section { width: 44ch; }
  .col-where { width: 26ch; }
}
@media (min-width: 412px) {
  .content,
  .listings-container, .day-panel-wrap, .bottom-sections, .intro-section { width: 46ch; }
  .col-where { width: 28ch; }
  .day-filters label { margin-right: 1.3em; }
}
@media (min-width: 504px) {
  .content,
  .listings-container, .day-panel-wrap, .bottom-sections, .intro-section { width: 56ch; }
  .col-where { width: 34ch; }
  .col-when { width: 19ch; }
}
@media (min-width: 588px) {
  .addr-short { display: none; }
  .addr-full { display: inline; }
  .content,
  .listings-container, .day-panel-wrap, .bottom-sections, .intro-section { width: 68ch; }
  .col-where { width: 46ch; }
  .col-when { width: 19ch; }
}

/* ── 3D Buttons ── */
.btn3d { display: inline-block; cursor: pointer; vertical-align: middle; line-height: 0; flex-shrink: 0; pointer-events: none; }
.btn3d svg { display: block; }
.btn3d svg .face { pointer-events: auto; cursor: pointer; }
.btn3d .btn-pressed { visibility: hidden; }
.btn3d:active .btn-raised, .btn3d-active .btn-raised { visibility: hidden; }
.btn3d:active .btn-pressed, .btn3d-active .btn-pressed { visibility: visible; }
details[open] > summary .btn3d .btn-raised, .collapsed-section.active > .section-btn .btn3d .btn-raised { visibility: hidden; }
details[open] > summary .btn3d .btn-pressed, .collapsed-section.active > .section-btn .btn3d .btn-pressed { visibility: visible; }
.btn3d-sand { --btn-face: #CABFA4; --btn-text: #0b1215; --btn-left: #DDD6C5; --btn-bottom: #A89E87; }
.btn3d-brown { --btn-face: #5E3F28; --btn-text: #fff; --btn-left: #8B5E3C; --btn-bottom: #3D2816; }

/* ── Nav ── */
.top-nav { display: flex; justify-content: space-between; align-items: center; padding: 0; overflow: visible; }
.nav-btns { display: flex; margin-right: -13px; }
.menu-panel { padding: 2px 0 var(--sp-med); display: none; margin-top: 0; }  /* top trimmed 7px: equal air above/below the items (James, Jul 4) */
.menu-panel + .breadcrumb { margin-top: 0; }
.menu-panel.open { display: block; }
/* menu, final (James, Jul 4): ONE row of 4, edge to edge, shrinking 18/16/14
   with the column; at 411 and under a single centred column at full 18px */
.menu-list { display: grid; grid-template-columns: repeat(4, max-content); justify-content: space-between; font-size: 14px; }
@media (min-width: 504px) { .menu-list { font-size: 16px; } }
@media (min-width: 588px) { .menu-list { font-size: 18px; } }
@media (max-width: 411px) { .menu-list { grid-template-columns: max-content; justify-content: center; font-size: 18px; } }
.menu-list a { display: inline-block; white-space: nowrap; color: var(--text); text-decoration: none; padding: var(--sp-small) 0; font-weight: 400; word-spacing: -0.3em; }  /* tighten emoji-to-text (mono gives emoji a 2ch advance) */
.menu-list a:hover { color: var(--link); font-weight: 500; }

/* ── Global site search / "command bar" (search.js) ── search reads only the
   generated /search-index.json; it is a SEPARATE system from the per-page
   .finder-search DOM filter (the one invariant). In the menu it sits ABOVE
   .menu-list; homepage/locations can reuse .kef-search inline. Standard chisel
   input, then a PLAIN list of links, each with a geo-tail explainer -- no results
   box, no highlight fill. Listings-style divider between rows; the ▶ pointer marks
   the hovered/focused row (links stay uniform --link, underlined like our links). */
.kef-search { position: relative; margin-bottom: var(--sp-small); }
.kef-search-box { position: relative; }
.kef-search-input {
  font-family: 'Fira Code', monospace; font-size: 14px;
  padding: 8px 8px 8px 30px;
  border: 1px solid #DDD6C5;
  border-top: 5px solid #A89E87;
  border-right: 5px solid #DDD6C5;
  box-shadow: inset 4px 4px 0px rgba(1,2,2,0.18);
  background: #fff; width: 100%; outline: none;
}
.kef-search-input::placeholder { color: var(--placeholder); }
.kef-search-input:focus { background: #fff; border-color: #EDE8DF; border-top-color: #DDD6C5; border-right-color: #EDE8DF; }
.kef-search-box .kef-search-icon {
  font-size: 14px; line-height: 1;
  position: absolute; left: 0; top: 50%; transform: translateY(-42%);
  padding: 8px 0 8px 8px; pointer-events: none;
}
.kef-search-results { margin-top: var(--sp-small); }
.kef-search-results[hidden] { display: none; }
.kef-search-row {
  position: relative; display: flex; justify-content: space-between; align-items: baseline; gap: 2ch;
  padding: var(--sp-small) 8px var(--sp-small) 30px;
  text-decoration: none; border-bottom: 1px solid var(--border);
}
.kef-search-row:last-child { border-bottom: none; }
.kef-search-row::before {
  content: "\25B6"; position: absolute; left: 8px; top: 50%; transform: translateY(-50%);
  color: var(--link); font-size: 20px; line-height: 1; text-decoration: none;
  visibility: hidden; pointer-events: none;
}
.kef-search-row:hover::before, .kef-search-row.is-active::before { visibility: visible; }
.kef-search-name { color: var(--link); text-decoration: underline; font-weight: 500; flex-shrink: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kef-search-type { color: var(--text); font-size: 12px; font-weight: 400; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: right; }
.kef-search-empty { display: block; text-decoration: none; color: var(--link); font-weight: 500; padding: var(--sp-small) 30px; }
.kef-search-empty:hover, .kef-search-empty.is-active { text-decoration: underline; }
.kef-search-more { color: var(--text); font-size: 12px; padding: var(--sp-small) 30px; }

/* ── Nav Today / Menu responsive ── */
.nav-today-label { display: none; }
.nav-today-icon  { display: inline-block; }
@media (min-width: 390px) {
  .nav-today-label { display: inline-block; }
  .nav-today-icon  { display: none; }
}
.nav-menu-label { display: none; }
.nav-menu-icon  { display: inline; }
@media (min-width: 504px) {
  .nav-menu-label { display: inline; }
  .nav-menu-icon  { display: none; }
}

/* ── Footer ── */
.site-footer {
  flex-shrink: 0;
  margin-top: 51px;
  margin-bottom: var(--sp-large);
  color: var(--text);
  text-align: center;
  width: 36ch;
  margin-left: auto;
  margin-right: auto;
  padding: var(--sp-base);
  border: 1ch solid transparent;
  background:
    linear-gradient(var(--bg), var(--bg)) padding-box,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 284 1200 1200'%3E%3Cpath fill='currentColor' d='M504 398h192l-18 401 374-139 58 179-385 107 249 314-152 110-222-333-222 333-152-110 249-314-385-107 58-179 374 139z'/%3E%3C/svg%3E") space border-box;
  background-size: auto, 1ch 1ch;
}
/* ast-boxed footers draw their box with .ast-box/.ast-side char rows; the glyph
   tile underneath would double the border (James, Jul 10: every footer carries
   exactly ONE asterisk mechanism). All asterisk boxes above/below now use the
   canonical city-toronto glyph tile (the 3x3 border-image variant rendered a
   different box -- James, Jul 10: "incorrect footer asterisk box"). */
.site-footer.ast-boxed { border: none; background: var(--bg); }
.footer-row { line-height: 2.2; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; }
.footer-row a { color: inherit; text-decoration: none; white-space: nowrap; font-weight: 400; }
.footer-row a:hover { color: var(--link-hover); font-weight: 500; text-decoration: underline; }
.foot-div { color: var(--text); margin: 0 var(--sp-tight); position: relative; top: 0.05em; }
.footer-copy { margin-top: 0; line-height: 2.2; color: var(--text); }
.footer-copy a { color: inherit; text-decoration: none; font-weight: 400; }
.footer-copy a:hover { color: var(--link-hover); font-weight: 500; text-decoration: underline; }
.footer-legal, .footer-copy, .made-in { font-size: 12px; }
/* <360: tighten the legal row's asterisk margins so 'Legal * Privacy * Cookies *
   Terms * API' holds one line at 320 (James, Jul 4) */
@media (max-width: 359px) { .footer-legal .foot-div { margin: 0 2px; } }
@media (min-width: 360px) { .footer-legal, .footer-copy, .made-in { font-size: 13px; } }
@media (min-width: 412px) { .footer-legal, .footer-copy, .made-in { font-size: 14px; } }
.footer-row a .foot-mid { display: none; }
.footer-row a .foot-360 { display: none; }
.footer-row a .foot-504 { display: none; }
@media (min-width: 360px) { .footer-row a .foot-360 { display: inline; } }
@media (min-width: 412px) { .footer-row a .foot-mid { display: inline; } }
@media (min-width: 504px) { .footer-row a .foot-504 { display: inline; } }
@media (min-width: 360px) { .site-footer { width: 40ch; } }
@media (min-width: 390px) { .site-footer { width: 44ch; } }
@media (min-width: 412px) { .site-footer { width: 46ch; } }
@media (min-width: 504px) { .site-footer { width: 56ch; } }
@media (min-width: 588px) { .site-footer { width: 68ch; } }

/* ── Back to top ── */
.back-to-top {
  position: fixed;
  bottom: 2ch;
  right: 2ch;
  z-index: 100;
  display: none;
}
.back-to-top.visible { display: block; }  /* profile chrome JS toggles the class; rule was missing (James, Jul 4) */
.made-in {
  text-align: center;
  color: var(--text);
  padding-bottom: 39px;
}

/* ── Promoted universal rules ── */
.ast-box {
  position: relative;
  padding: calc(1ch + var(--sp-small)) calc(1ch + var(--sp-small));
}
.ast-box::before, .ast-box::after {
  content: "****************************************************************************************************";
  position: absolute;
  left: 0; right: 0;
  height: 1ch;
  overflow: hidden;
  white-space: nowrap;
  line-height: 1ch;
  color: var(--text);
  text-align: center;
}
.ast-box::before { top: 0; }
.ast-box::after { bottom: 0; }
.ast-side {
  position: absolute;
  top: 1ch; bottom: 1ch;
  width: 1ch;
  overflow: hidden;
  white-space: pre;
  line-height: 1ch;
  color: var(--text);
  text-align: center;
}
.ast-side::before {
  content: "*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*";
}
.ast-l { left: 0; }
.ast-r { right: 0; }
.ast-boxed::before, .site-footer.ast-boxed::after { display: none; }
.ast-boxed { padding: 0; }
.other-provs { margin-top: var(--sp-large); text-align: center; }
.other-provs-label { font-weight: 500; margin-bottom: var(--sp-small); }
.other-provs-links { line-height: 2.427; }
.other-provs-links a { display: inline-block; white-space: nowrap; text-decoration: none; margin: 0 var(--sp-tight); }
.other-provs-links a span { text-decoration: underline; }
.other-provs-links a:hover span { color: var(--link-hover); }
.btn3d-active svg .face { cursor: pointer; }


/* ── Brand callout ── */
.callout-purple {
  background: rgba(var(--rgb-blurple), 0.05);
  box-shadow: 0 0 0 1px rgba(var(--rgb-blurple), 0.1), 0 0 0.1em 0.02em rgba(var(--rgb-blurple), 0.05);
  padding: 0.75em 2ch; text-align: center;
}
.callout-purple a { text-decoration: underline; }
/* ── Utility ── */
.nowrap { white-space: nowrap; }
.mt-tight { margin-top: var(--sp-tight); }
.mt-small { margin-top: var(--sp-small); }
.mt-med { margin-top: var(--sp-med); }
.mt-large { margin-top: var(--sp-large); }
.fw-500 { font-weight: 500; }
.fw-400 { font-weight: 400; }
.flex-1 { flex: 1; min-width: 0; }
.flex-shrink-0 { flex-shrink: 0; }

/* ── Day colours ── */
.col-mon { color: var(--mon); }
.col-tue { color: var(--tue); }
.col-wed { color: var(--wed); }
.col-thu { color: var(--thu); }
.col-fri { color: var(--fri); }
.col-sat { color: var(--sat); }
.col-sun { color: var(--sun); }
.col-placeholder { color: var(--placeholder); }

/* ── Day backgrounds ── */
.bg-mon { background: var(--mon); }
.bg-tue { background: var(--tue); }
.bg-wed { background: var(--wed); }
.bg-thu { background: var(--thu); }
.bg-fri { background: var(--fri); }
.bg-sat { background: var(--sat); }
.bg-sun { background: var(--sun); }

/* ── Newsletter page ── */
.nl-section-heading { font-weight: 500; margin-top: var(--sp-large); }
.nl-section-heading-lg { font-weight: 500; margin-top: var(--sp-large); font-size: 18px; }

/* ── Form inline field (new-special) ── */
.form-inline-row { display: flex; align-items: center; gap: 1ch; margin-top: var(--sp-tight); }
.form-inline-label { white-space: nowrap; font-weight: 400; flex-shrink: 0; }

/* === S78/v14 additions: nav unit, intro toggle, misc === */
/* Menu: a left-aligned column-count cascade -- 4 items across (wide) -> 2 over 2
   (medium) -> a single column (narrow). All left-aligned, packed to the left. */
.menu-row-break { display: none; }  /* legacy grid menu retired Jul 4 -- the shrink-then-wrap system above owns .menu-list */
.intro-reveal { flex: 0 0 100%; order: 99; position: absolute; overflow: hidden; clip: rect(0,0,0,0); clip-path: inset(50%); width: 1px; height: 1px; white-space: nowrap; }
.collapsed-section.active > .intro-reveal { position: static; overflow: visible; clip: auto; clip-path: none; width: auto; height: auto; white-space: normal; margin-top: var(--sp-small); margin-bottom: var(--sp-small); }
.intro-box .intro + .intro { margin-top: var(--sp-small); }
.intro-box .intro { margin: 0; }
.intro-box { padding: 12px; border: 1ch solid transparent; background:
    linear-gradient(var(--bg), var(--bg)) padding-box,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 284 1200 1200'%3E%3Cpath fill='currentColor' d='M504 398h192l-18 401 374-139 58 179-385 107 249 314-152 110-222-333-222 333-152-110 249-314-385-107 58-179 374 139z'/%3E%3C/svg%3E") space border-box;
  background-size: auto, 1ch 1ch; }
.btn3d-active { cursor: default; }
.restaurant-detail .detail-type .ico-bar { margin-left: 1ch; vertical-align: baseline; }

/* =====================================================================
   SHARED PAGE CHROME  (blurb, section-title, btn-row, content spacing)
   ===================================================================== */
.content > * { margin-top: var(--sp-med); }
.page-blurb { margin: 0; }
.page-blurb a { color: var(--link); text-decoration: underline; }
.page-blurb a:hover { color: var(--link-hover); }
.page-leaf { text-align: center; margin: var(--sp-xl) auto; width: 36ch; }
.btn-row { display: flex; flex-wrap: wrap; gap: 0; margin-top: var(--sp-med); margin-bottom: 0; }
.section-title + .faq-item { margin-top: var(--sp-small); }
.section-title { font-weight: 500; margin-bottom: var(--sp-small); }

/* ── Newsletters page (/newsletters/): breadcrumb tint, intro, subscribe status,
      the location picker (search + A-Z groups + scroll panel) and unsubscribe ── */
.breadcrumb-muted { color: var(--cuisine); }
.page-intro { margin: 0; }
.nl-status { min-height: 1em; margin-top: var(--sp-tight); font-size: 13px; }
.nl-status.ok { color: #1a7a3a; }
.nl-status.err { color: #c0392b; }
.nl-status.pending { color: var(--text); }
.loc-search-wrap { position: relative; margin-top: var(--sp-small); }
.loc-search-icon { font-size: 14px; line-height: 1; position: absolute; left: 0; top: 50%; transform: translateY(-42%); padding: 8px 0 8px 8px; pointer-events: none; }
.loc-search { width: 100%; font-family: 'Fira Code', monospace; font-size: 14px; padding: 8px 8px 8px 24px; border: 1px solid #DDD6C5; border-top: 5px solid #A89E87; border-right: 5px solid #DDD6C5; box-shadow: inset 4px 4px 0 rgba(1,2,2,0.18); background: #fff; outline: none; }
.loc-search::placeholder { color: var(--placeholder); }
.az-row { margin-top: var(--sp-small); line-height: 2.2; letter-spacing: 0.5ch; font-size: 13px; }
.az-row a { text-decoration: none; font-weight: 400; }
.az-row a:hover { font-weight: 500; text-decoration: underline; }
.az-dim { color: var(--placeholder); }
.az-group { margin-top: var(--sp-med); }
.az-group.hidden { display: none; }
.az-letter { font-weight: 500; margin-top: var(--sp-small); margin-bottom: 0; font-size: 12px; color: var(--placeholder); }
.city-cb { display: flex; align-items: baseline; cursor: pointer; font-weight: 400; line-height: 2; gap: 4px; }
.city-cb.hidden { display: none; }
.city-cb:has(input:checked) { font-weight: 500; }
.city-cb input[type="checkbox"] { appearance: none; -webkit-appearance: none; width: 14px; height: 14px; border: 1px solid var(--text); background: var(--bg); vertical-align: -2px; margin: 0 4px 0 0; cursor: pointer; position: relative; flex-shrink: 0; }
.city-cb input:checked { background: var(--bg); }
.city-cb input:checked::after { content: ""; width: 8px; height: 8px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); background: linear-gradient(45deg,transparent 42%,var(--text) 42%,var(--text) 58%,transparent 58%),linear-gradient(-45deg,transparent 42%,var(--text) 42%,var(--text) 58%,transparent 58%); }
.geo-badge { font-size: 10px; font-weight: 400; padding: 0 3px; margin-left: 3px; vertical-align: 1px; color: var(--placeholder); border: 1px solid #DDD6C5; white-space: nowrap; }
.geo-scroll { max-height: 340px; overflow-y: auto; margin-top: var(--sp-small); padding: 0 var(--sp-small); border: 1px solid #DDD6C5; }
.geo-scroll .az-group:first-child { margin-top: var(--sp-small); }
.loc-no-results { display: none; margin-top: var(--sp-base); color: var(--placeholder); }
.unsub-section { margin-top: var(--sp-xl); }
.unsub-heading { font-weight: 500; margin-bottom: var(--sp-small); }

/* brand filter (arriving from a brand page's #brand=<slug> link) */
.brand-filter-bar { margin-top: var(--sp-small); font-weight: 500; }
.brand-filter-bar .brand-clear { color: var(--link); text-decoration: underline; margin-left: 1ch; font-weight: 400; }
.brand-filter-bar .brand-clear:hover { color: var(--link-hover); }
.listing.brand-hidden { display: none; }


/* ===== MIGRATED from when-hub inline block: calendar grid + day-button colors (no-inline cleanup, Jul 8) ===== */
.day-pad { margin-top: var(--sp-med); }
.day-pad + .calendar { margin-top: var(--sp-med); }
.calendar { margin: 0 auto; }
.calendar + .hub-corners { margin-top: var(--sp-med); }
.cal-month { font-size: 14px; font-weight: 400; margin-bottom: 0.2em; }
.cal-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.cal-table th, .cal-table td { border: none; border-bottom: 1px dashed #ddd; text-align: center; vertical-align: top; font-size: 14px; font-weight: 400; }
.cal-table th { padding: 4px; font-weight: 500; font-size: 11px; color: #aaa; }
.cal-table th a { color: #aaa; text-decoration: none; font-weight: 500; }
.cal-table th a:hover { color: var(--text); }
.cal-table td { padding: 3px; height: 50px; background: #fff; }
.cal-table td.inactive, .cal-table td.other { height: 28px; }
.cal-table td a { text-decoration: none; color: inherit; display: block; font-weight: 400; }
.cal-table td a:hover { opacity: 0.7; }
.cal-date { font-size: 14px; font-weight: 400; color: var(--text); line-height: 1.2; margin-bottom: 3px; }
.cal-entry { display: block; font-size: 13px; font-weight: 400; line-height: 1; padding: 2px 3px; border-radius: 2px; white-space: nowrap; overflow: hidden; }
.cal-entry .dh { display: none; margin-left: 1.5px; }
@media (max-width: 587px) { .cal-entry .dw { display: none; } .cal-entry .dh { display: inline; } }
td.inactive .cal-date { color: var(--text); margin-bottom: 0; }
td.col-sat .cal-date, td.col-sun .cal-date { color: #aaa; }
td.other .cal-date { color: #ddd; margin-bottom: 0; }
td.overflow .cal-date { color: #bbb; }
.entry-mon { background: var(--mon-bg); color: var(--mon); }
.entry-tue { background: var(--tue-bg); color: var(--tue); }
.entry-wed { background: var(--wed-bg); color: var(--wed); }
.entry-thu { background: var(--thu-bg); color: var(--thu); }
.entry-fri { background: var(--fri-bg); color: var(--fri); }
.entry-sat { background: var(--sat-bg); color: var(--sat); }
.entry-sun { background: var(--sun-bg); color: var(--sun); }
td[class*="today-"] .cal-date { font-weight: 500; }
.today-mon .cal-date { color: var(--mon); }
.today-tue .cal-date { color: var(--tue); }
.today-wed .cal-date { color: var(--wed); }
.today-thu .cal-date { color: var(--thu); }
.today-fri .cal-date { color: var(--fri); }
.today-sat .cal-date { color: var(--sat); }
.today-sun .cal-date { color: var(--sun); }
.entry-today-mon { background: var(--mon); color: #fff; }
.entry-today-tue { background: var(--tue); color: #fff; }
.entry-today-wed { background: var(--wed); color: #fff; }
.entry-today-thu { background: var(--thu); color: #fff; }
.entry-today-fri { background: var(--fri); color: #fff; }
.entry-today-sat { background: var(--sat); color: #fff; }
.entry-today-sun { background: var(--sun); color: #fff; }
.entry-dim-mon { background: transparent; color: var(--mon); opacity: 0.5; }
.entry-dim-tue { background: transparent; color: var(--tue); opacity: 0.5; }
.entry-dim-wed { background: transparent; color: var(--wed); opacity: 0.5; }
.entry-dim-thu { background: transparent; color: var(--thu); opacity: 0.5; }
.entry-dim-fri { background: transparent; color: var(--fri); opacity: 0.5; }
.entry-dim-sat { background: transparent; color: var(--sat); opacity: 0.5; }
.entry-dim-sun { background: transparent; color: var(--sun); opacity: 0.5; }
.day-pad { display: flex; justify-content: center; gap: 0; flex-wrap: wrap; line-height: 0; }
.day-pad a { text-decoration: none; display: inline-block; line-height: 0; }
.day-group { display: inline-flex; flex-wrap: nowrap; line-height: 0; }
.btn3d-mon { --btn-face: #e67700; --btn-text: #fff; --btn-left: #f0a040; --btn-bottom: #a85800; }
.btn3d-tue { --btn-face: #2b8a3e; --btn-text: #fff; --btn-left: #4db866; --btn-bottom: #1d6329; }
.btn3d-wed { --btn-face: #5f3dc4; --btn-text: #fff; --btn-left: #8a6dd6; --btn-bottom: #432b8f; }
.btn3d-thu { --btn-face: #2188d6; --btn-text: #fff; --btn-left: #52a8e8; --btn-bottom: #17619b; }
.btn3d-fri { --btn-face: #b71c1c; --btn-text: #fff; --btn-left: #d44e4e; --btn-bottom: #841414; }
.btn3d-sat { --btn-face: #24508b; --btn-text: #fff; --btn-left: #4670ac; --btn-bottom: #1a3963; }
.btn3d-sun { --btn-face: #7b5b3a; --btn-text: #fff; --btn-left: #a07c55; --btn-bottom: #573f28; }
.btn3d-wkd { --btn-face: #444; --btn-text: #fff; --btn-left: #666; --btn-bottom: #2a2a2a; }
.btn3d-all { --btn-face: #444; --btn-text: #fff; --btn-left: #666; --btn-bottom: #2a2a2a; }

/* about-panel ? toggle (shared w/ homepage) */
.about-panel{margin-top:var(--sp-med);}
.about-panel.collapsed{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.btn3d.pressed .btn-raised{visibility:hidden;}.btn3d.pressed .btn-pressed{visibility:visible;}
.day-pad #introToggle{cursor:pointer;}

/* when-hub: title sized to fill its column (container query) + near-you link in the calendar */
.hub-title-fit{container-type:inline-size;margin-top:-8px;}
.hub-title{font-weight:400;line-height:0.9;white-space:nowrap;font-size:9.2cqw;}
.near-you{white-space:nowrap;}
.near-you a{color:var(--link);text-decoration:underline;font-weight:500;}
.near-you a:hover{color:var(--link-hover);}
.calendar .near-you{text-align:right;margin:5px 0 3px;}
.qnear{display:inline-flex;align-items:center;gap:1ch;}
.day-pad + .near-you{text-align:center;margin-top:var(--sp-small);}
.q-row{text-align:center;margin-top:var(--sp-small);line-height:0;}
.q-row + .near-you{text-align:center;margin-top:var(--sp-small);}
@media (max-width:359px){.near-you{font-size:12px;}}
.q-row-tight{text-align:center;line-height:0;margin-top:var(--sp-tight);}
.q-row-spaced{text-align:center;line-height:0;margin-top:var(--sp-med);}
.q-row-tight + .near-you,.q-row-spaced + .near-you{text-align:center;margin-top:var(--sp-small);}
.near-you + .q-row-tight{margin-top:var(--sp-small);}


/* ── Chrome parity for hand-authored statics (Jul 10): the generated
   pages carry these inline; statics lean on style.css alone. Ported
   verbatim from the hub skeleton. ── */
.site-footer.ast-boxed { padding: 0; }
/* The legacy .site-footer::before/::after asterisk ROWS were reverted (Jul 10,
   James): the asterisk-tile border (.ast-box / .ast-side) is the site standard,
   and re-adding these rows here doubled the border on the ast-boxed footers. */
/* ── Asterisk Box Border (reusable) ── */
.ast-box {
  position: relative;
  padding: calc(1ch + var(--sp-small)) calc(1ch + var(--sp-small));
}
.ast-box::before, .ast-box::after {
  content: "****************************************************************************************************";
  position: absolute;
  left: 0; right: 0;
  height: 1ch;
  overflow: hidden;
  white-space: nowrap;
  line-height: 1ch;
  color: var(--text);
  text-align: center;
}
.ast-box::before { top: 0; }
.ast-box::after { bottom: 0; }
.ast-side {
  position: absolute;
  top: 1ch; bottom: 1ch;
  width: 1ch;
  overflow: hidden;
  white-space: pre;
  line-height: 1ch;
  color: var(--text);
  text-align: center;
}
.ast-side::before {
  content: "*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*\A*";
}
.ast-l { left: 0; }
.ast-r { right: 0; }
.subscribe-form + .subscribe-options { margin-top: var(--input-gap); }
.nl-check input:checked::after { content: ""; width: 8px; height: 8px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: linear-gradient(45deg, transparent 42%, var(--text) 42%, var(--text) 58%, transparent 58%), linear-gradient(-45deg, transparent 42%, var(--text) 42%, var(--text) 58%, transparent 58%); }