/* FRONTEND-DESIGN-REVIEW-01: shared roles over the existing visual system. */
:root {
  --heading-face: Newsreader, var(--serif);
  --accent-ink: #8a4d34;
  --control-line: #72806f;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
}
html:lang(zh), html:lang(ja), html:lang(ko) { --heading-face: var(--serif); }
/* Newsreader's shipped subset has no Cyrillic; keep Russian headings in the
   existing serif family rather than mixing Latin/Cyrillic glyphs mid-word. */
html:lang(ru) { --heading-face: Georgia, "Times New Roman", serif; }
::selection { background: #d8e1d2; color: var(--ink); }
a { text-underline-offset: .2em; }
:where(a, button, input, select, summary):focus-visible {
  outline: 3px solid var(--olive-dark);
  outline-offset: 3px;
}
input, select { caret-color: var(--olive-dark); }
.search-field input::placeholder { color: var(--muted); opacity: 1; }

.hero-copy { padding-block: 88px 72px; }
@media (min-width: 761px) {
  .hero-grid, .hero-photo { min-height: min(615px, calc(100svh - 128px)); }
}
.hero-intro { font-size: 16px; line-height: 1.7; }
.hero-actions .button-primary { flex-basis: auto; max-width: 100%; }
.hero-actions :is(.button-primary, .button-secondary) { padding: 14px 22px; }
.hero h1 em, .section-heading h2 em { color: var(--accent-ink); }
.trip-count { background: var(--accent-ink); }
.trip-button { min-height: 44px; font-size: 14px; }
.language-wrap select { min-height: 44px; font-size: 14px; }

:is(.section-heading h2, .home-themes h2, .plan-panel h3,
    .drawer-header h2, .trip-preference-panel h3, .card-content h3,
    .location-record h3, .entity-references h2, .location-records h2,
    .example-day h2, .example-stops h3, .empty-state h3) {
  font-family: var(--heading-face);
  font-weight: 400;
  letter-spacing: -.025em;
  line-height: 1.15;
  text-wrap: balance;
}
.section-heading { margin-bottom: var(--space-8); }
.section-heading h2 { font-size: clamp(36px, 4vw, 54px); }
.section-heading p:last-child { font-size: 16px; line-height: 1.6; }
.entity-detail h1 { font-size: clamp(38px, 4.5vw, 64px); line-height: 1.12; }
.entity-type, .example-day-number {
  margin: 0 0 var(--space-3);
  font-size: 14px;
  line-height: 1.5;
  font-weight: 600;
  color: var(--olive-dark);
}
.entity-description, .example-trip .entity-main > p,
.example-day > p:not(.example-day-number), .example-day-description { max-width: 70ch; font-size: 16px; line-height: 1.75; }
.example-day-description p { margin-block: 0 20px; }
.example-day-description p:first-child { color: var(--olive-dark); }
.example-day-practical { max-width: 70ch; margin-block: 16px 24px; font-size: 15px; line-height: 1.7; }
.example-day-practical > summary { width: fit-content; min-height: 44px; padding: 9px 18px; border: 1px solid var(--olive-dark); border-radius: 999px; cursor: pointer; }
.example-day-practical > summary:hover { background: var(--olive-dark); color: var(--white); }
.example-day-practical > div { padding-top: 16px; }
.example-day-practical p { margin-block: 0 16px; }
.location-record { scroll-margin-top: var(--space-6); }
.location-categories a { min-height: 44px; display: inline-flex; align-items: center; padding: 10px 16px; font-size: 14px; }
.entity-facts { font-size: 15px; line-height: 1.6; }
.entity-gallery { margin-top: var(--space-6); }

.ideas-grid { gap: var(--space-6); }
.idea-card { border: 1px solid var(--line); box-shadow: none; }
.ideas-grid { grid-auto-rows: 1fr; align-items: stretch; }
.idea-summary { margin-bottom: 1rem; }
.idea-summary .itinerary-narrative + .itinerary-narrative { margin-top: 1rem; }
.idea-actions { margin-top: auto; }
.idea-body { padding: var(--space-6); }
.idea-day-label { font-size: 14px; line-height: 1.6; }
.idea-stops { font-size: 15px; line-height: 1.65; }
.ideas-intro { font-size: 16px; }
.ideas-note { font-size: 14px; }
.idea-actions { align-items: stretch; }
.idea-actions :is(.button-primary, .button-secondary) { font-size: 14px; padding: 11px 16px; }

.card-content h3 { min-height: 0; }
.card-description { font-size: 16px; line-height: 1.6; }
.card-address { font-size: 14px; line-height: 1.5; }
.card-overline { color: var(--accent-ink); font-size: 12px; letter-spacing: .05em; }
.card-freshness { font-size: 12px; color: var(--muted); }
.card-actions { flex-wrap: wrap; }
.card-actions a { font-size: 14px; }
.place-card { box-shadow: none; }
.place-card:hover { transform: none; box-shadow: none; border-color: var(--control-line); }
.card-art:not(.has-photo)::before, .card-art:not(.has-photo)::after,
.card-art:not(.has-photo) .card-symbol, .card-index { display: none; }
.filter-chip, .discovery-views .filter-chip,
.theme-filter-row .filter-chip { min-height: 44px; font-size: 14px; border-color: var(--control-line); }
.results-head p, .results-head label, .results-head select { font-size: 14px; }
.results-head select { min-height: 44px; }
.search-field input { font-size: 16px; }
.empty-state > span[aria-hidden] { display: none; }
.clear-button, .save-button, .map-button { min-height: 44px; font-size: 14px; }

.plan-panel { padding: var(--space-6); min-height: 0; }
.plan-panel h3, .entity-layout .plan-panel h3 { margin: 0 0 var(--space-4); font-size: 30px; }
.plan-panel > p:not(.plan-small), .plan-preview p,
.trip-empty-message p, .trip-items .trip-empty-message p { font-size: 16px; line-height: 1.6; }
.plan-preview .trip-empty-message strong, .trip-items .trip-empty-message strong { font-family: var(--heading-face); font-size: 26px; font-weight: 400; }
.panel-button { min-height: 44px; font-size: 14px; }
.entity-layout .plan-panel .panel-button:last-child { background: var(--white); color: var(--olive-dark); }
.entity-layout .plan-panel .panel-button:last-child:hover { background: #dbe5d5; }

.drawer-header h2 { font-size: 42px; margin: 0; }
.drawer-intro { font-size: 16px; line-height: 1.6; margin: 0 0 var(--space-6); }
.drawer-body { margin-top: var(--space-6); padding-bottom: var(--space-8); }
.trip-items .trip-empty-message { padding-block: var(--space-6); }
.trip-item-main strong { font-family: var(--heading-face); font-size: 22px; }
.trip-item-main p, .preference-note, .planner-options-title { font-size: 14px; line-height: 1.6; }
.trip-drawer :is(button, .button-secondary) { min-height: 44px; font-size: 14px; }
.close-button, .trip-item > button { width: 44px; height: 44px; }
.drawer-footer p { font-size: 12px; line-height: 1.5; }
.trip-drawer .planning-choices { background: transparent; border-radius: 0; border: 0; border-block: 1px solid var(--line); padding: 14px 0; }
.trip-drawer .planning-choices summary { min-height: 44px; font-size: 16px; padding-block: 10px; }
.trip-preference-panel { background: transparent; border: 0; border-top: 1px solid var(--line); padding: var(--space-6) 0; }
.trip-preference-panel p { font-size: 16px; line-height: 1.6; }
.trip-preference-panel legend, .trip-preference-panel label,
.stay-date-fields label, .schedule-field { font-size: 14px; }
.trip-preference-panel .preference-check { min-height: 44px; align-items: center; margin: var(--space-2) 0; }
.trip-drawer input:not([type=checkbox]):not([type=radio]),
.trip-drawer select, .trip-drawer textarea { font-size: 16px; min-height: 44px; border-color: var(--control-line); }
.schedule-field input, .schedule-field select { font-size: 16px; }
.itinerary-block { font-size: 15px; line-height: 1.5; }
.itinerary-clock { min-width: 96px; }
.schedule-status { font-size: 16px; line-height: 1.6; }
.trip-drawer .preference-note { font-size: 14px; color: var(--muted); }
.schedule-route { flex-wrap: wrap; }
.schedule-route span { flex-basis: 100%; }

@media (max-width: 960px) and (min-width: 761px) {
  .ideas-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .hero-copy { padding-block: 48px 40px; }
  .hero-actions { gap: var(--space-3); }
  .hero-actions :is(.button-primary, .button-secondary) { flex: 1 1 auto; }
  .home-themes { padding-top: var(--space-8); }
  .theme-filter-row .filter-chip { font-size: 14px; padding: 10px 14px; }
  .entity-layout .entity-main, .entity-layout .plan-panel { order: 0; }
  .entity-layout .plan-panel { margin-top: var(--space-8); }
  .trip-button > span:nth-child(2) { display: inline; }
  .trip-button { gap: 8px; padding: 9px 12px; }
  .trip-button-icon { display: none; }
  .trip-preference-actions .trip-preference-button { flex: 1 1 145px; }
  .trip-drawer { padding: 24px 20px max(16px, env(safe-area-inset-bottom)); }
  .drawer-footer { padding-top: var(--space-3); }
  .stay-date-fields { gap: var(--space-2); }
  .itinerary-block { flex-wrap: wrap; gap: var(--space-1) var(--space-3); }
  .example-day { padding-block: var(--space-6); }
}
@media (max-width: 360px) {
  .stay-date-fields { grid-template-columns: minmax(0, 1fr); }
  .header-actions { gap: 4px; }
  .trip-button { padding-inline: 9px; font-size: 13px; }
  .brand-name { max-width: 145px; }
  .site-header .brand { gap: 6px; }
  .site-header .brand-mark { width: 24px; }
}
@media (max-width: 420px) {
  html:not(:lang(en)) .site-header { height: auto; }
  html:not(:lang(en)) .header-inner { flex-wrap: wrap; padding-block: 12px; gap: 8px; }
  html:not(:lang(en)) .site-header .brand { flex-basis: 100%; }
  html:not(:lang(en)) .site-header .brand-name { max-width: none; }
}
@media (prefers-reduced-motion: reduce) {
  .place-card, .button-primary { transition: none; }
  .button-primary:hover { transform: none; }
}

/* Computed day stories, with the exact schedule one disclosure away. */
.itinerary-narrative { max-width: 65ch; font-size: 16px; line-height: 1.65; margin: .65rem 0 .85rem; overflow-wrap: anywhere; }
.itinerary-timeline { margin-bottom: 1.25rem; }
.itinerary-timeline summary { display: list-item; width: fit-content; max-width: 100%; border: 1px solid var(--olive); border-radius: 999px; padding: .65rem 1rem; cursor: pointer; font-size: 14px; }
.itinerary-timeline summary:hover { background: var(--cream); }
.itinerary-timeline summary:focus-visible { outline: 2px solid var(--olive); outline-offset: 3px; }