/* Public visual owner. Structural compatibility remains in polish.css. */
@font-face { font-family: "Golos Text"; font-style: normal; font-weight: 400 700; font-display: optional; src: url("assets/fonts/golos-latin.woff2") format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Golos Text"; font-style: normal; font-weight: 400 700; font-display: optional; src: url("assets/fonts/golos-cyrillic.woff2") format("woff2"); unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; }
@font-face { font-family: "Golos Text"; font-style: normal; font-weight: 400 700; font-display: optional; src: url("assets/fonts/golos-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA,U+02BD-02FF,U+0304,U+0308,U+0329,U+1E00-1EFF,U+20A0-20AB,U+20AD-20C4; }
@font-face { font-family: "Onest"; font-style: normal; font-weight: 400 700; font-display: optional; src: url("assets/fonts/onest-latin.woff2") format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Onest"; font-style: normal; font-weight: 400 700; font-display: optional; src: url("assets/fonts/onest-cyrillic.woff2") format("woff2"); unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; }
@font-face { font-family: "Onest"; font-style: normal; font-weight: 400 700; font-display: optional; src: url("assets/fonts/onest-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA,U+02BD-02FF,U+0304,U+0308,U+0329,U+1E00-1EFF,U+20A0-20AB,U+20AD-20C4; }

:root {
  --color-primary: #086873;
  --color-primary-strong: #07505a;
  --color-ink: #192c2b;
  --color-muted: #5a6e6b;
  --color-background: #f4f7f6;
  --color-surface: #ffffff;
  --color-line: #d5e1dd;
  --color-accent: #f1bc4b;
  --color-accent-soft: #fff4d6;
  --color-success: #216c50;
  --color-danger: #ae413b;
  --color-selected: #e6f1ef;
  --color-accent-ink: #50401d;
  --font-display: "Onest", Arial, sans-serif;
  --font-body: "Golos Text", Arial, sans-serif;
  --radius-control: 8px;
  --radius-small: 4px;
  --page-max: 1200px;
  --page-gutter: max(24px, calc((100% - var(--page-max)) / 2));
  --control-height: 48px;
  --grid-gap: 24px;
  --motion-feedback: 160ms;
  --motion-card-enter: 320ms;
  --scroll-thumb: #9aafaa;
  --scroll-track: #edf2f0;
  --scroll-hover: #6e8d85;
  --scroll-active: var(--color-primary);
  --ink: var(--color-ink);
  --muted: var(--color-muted);
  --canvas: var(--color-background);
  --paper: var(--color-surface);
  --line: var(--color-line);
  --blue: var(--color-primary);
  --focus: var(--color-primary);
  --green: var(--color-success);
  --rust: var(--color-danger);
  --deep: var(--color-ink);
  --blue-soft: var(--color-selected);
  --sand-soft: var(--color-accent-soft);
}

* { scrollbar-color: var(--scroll-thumb) var(--scroll-track); scrollbar-width: thin; }
*::-webkit-scrollbar { width: 9px; height: 9px; }
*::-webkit-scrollbar-track { background: var(--scroll-track); }
*::-webkit-scrollbar-thumb { border: 2px solid var(--scroll-track); border-radius: 8px; background: var(--scroll-thumb); }
*::-webkit-scrollbar-thumb:hover { background: var(--scroll-hover); }
*::-webkit-scrollbar-thumb:active { background: var(--scroll-active); }
html { scroll-padding-top: 96px; scroll-behavior: auto; }
body { background: var(--canvas); color: var(--ink); font-family: var(--font-body); font-size: 16px; line-height: 1.55; -webkit-tap-highlight-color: transparent; }
body :is(h1,h2,h3,h4,.brand-name,.mobile-nav-brand strong) { font-family: var(--font-display); letter-spacing: 0; }
button, input, select, textarea { font-family: var(--font-body); letter-spacing: 0; }
button, summary, select, a[href], label:has(input[type=checkbox]), label:has(input[type=radio]) { cursor: pointer; }
button, a { -webkit-tap-highlight-color: transparent; }
button { transition: color var(--motion-feedback) ease, background-color var(--motion-feedback) ease, border-color var(--motion-feedback) ease; }
button:disabled, [aria-disabled=true] { cursor: not-allowed; }
:is(button,a,input,textarea,summary):focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
html.pointer-navigation :focus, html.pointer-navigation .quiz-options label:has(input:focus-visible) { outline: none; }
:is(h1,h2,h3,h4,h5,h6,legend,p)[tabindex="-1"]:focus { outline: none; }
textarea { resize: none; min-height: 150px; font-size: 16px; }
/* Interface labels are not document content; travel information stays selectable. */
:where(button, summary, select, [role="button"], [role="tab"], [role="option"], nav,
  .brand, .footer-brand, .mobile-nav-brand, .card-photo-counter, .photo-counter,
  .catalog-heading, .routes-heading, .travel-heading, .catalog-quiz,
  .select-field > span, .sort-field > span, .route-builder-controls label > span,
  .travel-tool-field > span, .quiz-header, .quiz-progress, #quiz-question,
  .quiz-options label, .quiz-summary, .quiz-match-count,
  #trip-title, #map-choice-title, #correction-title, #correction-dialog label > span,
  .dialog-primary-actions a, .trip-actions a, .route-map-button, [data-map-provider],
  .skip-link, .privacy-link) { -webkit-user-select: none; user-select: none; }
:where(input:not([type="button"], [type="submit"], [type="reset"], [type="checkbox"],
  [type="radio"], [type="range"], [type="color"], [type="file"], [type="image"]),
  textarea, [contenteditable]:not([contenteditable="false"])) { -webkit-user-select: text; user-select: text; }
::selection { background: var(--color-accent); color: var(--ink); }
.skip-link { position: fixed; z-index: 20000; top: 8px; left: 16px; transform: translateY(-180%); padding: 12px 18px; border-radius: var(--radius-control); color: var(--paper); background: var(--blue); }
.skip-link:focus { transform: none; }

/* A compact, recognizable shell; all page sections share its alignment. */
.topbar { min-height: 80px; padding: 12px var(--page-gutter); gap: 32px; background: var(--paper); }
.topbar::after { display: none; }
.topbar .brand { gap: 10px; }
.topbar .brand-mark { width: 42px; height: 48px; }
.brand-name { font-size: 26px; line-height: 1.15; font-weight: 700; }
.brand-copy small { font: 400 11px/1.4 var(--font-body); color: var(--muted); }
.topbar #site-nav { gap: 28px; align-self: stretch; align-items: stretch; }
.topbar #site-nav a { display: flex; position: relative; align-items: center; padding-block: 8px; border: 0; font-size: 14px; font-weight: 500; }
.topbar #site-nav a::after { content: ""; position: absolute; bottom: -13px; left: 0; right: 0; height: 3px; background: transparent; }
.topbar #site-nav a[aria-current=page] { color: var(--blue); }
.topbar #site-nav a[aria-current=page]::after { background: var(--blue); }
.header-tools { gap: 8px; }
.header-tools :is(.saved-button,.trip-header-button) { height: 44px; background: var(--paper); border-color: var(--line); padding-inline: 12px; }
.header-tools :is(.saved-button,.trip-header-button):hover { border-color: var(--blue); background: var(--color-selected); }
.saved-button[aria-pressed=true] { background: var(--color-selected); color: var(--blue); border-color: var(--blue); }
.header-tools :is(#saved-count,#trip-count) { display: grid; place-items: center; min-width: 22px; height: 22px; padding-inline: 4px; border-radius: var(--radius-small); background: transparent; color: var(--blue); font-size: 12px; font-variant-numeric: tabular-nums; }
.header-action-label { font-size: 13px !important; }
.preferences { min-height: 44px; padding: 2px; background: var(--canvas); border-color: transparent; }
.preference-select .custom-select__button { background: transparent; font-size: 12px; }

.explorer, .itineraries, .travel-kit { width: 100%; max-width: none; padding: 36px var(--page-gutter) 64px; background: var(--canvas); border: 0; }
body.routes-page #routes, body.travel-page #travel-kit { padding-top: 36px; }
.catalog-heading, .routes-heading, .travel-heading { margin: 0 0 24px; }
.catalog-heading h1, .routes-heading h2, .travel-heading h2 { margin: 0; font-family: var(--font-display); font-size: 36px; font-weight: 600; line-height: 1.2; max-width: 820px; }
.eyebrow { font-family: var(--font-body); font-size: 12px; font-weight: 500; color: var(--blue); letter-spacing: 0; }
.routes-heading .eyebrow, .travel-heading .eyebrow { display: none; }
.routes-heading { display: block; }
.routes-heading > p { max-width: 680px; margin: 12px 0 0; font-size: 15px; color: var(--muted); }
.results-count { color: var(--blue); font-size: 14px; font-variant-numeric: tabular-nums; }
.seo-not-found { margin: 0; padding: 20px var(--page-gutter); color: var(--rust); background: var(--paper); }

.catalog-search-row { gap: 10px; }
.catalog-search { height: 52px; border-color: var(--line); background: var(--paper); }
.catalog-search:focus-within { border-color: var(--blue); box-shadow: 0 0 0 2px var(--color-selected); }
.catalog-search input { padding-inline: 14px 4px; font-size: 16px; }
.catalog-search input::-webkit-search-cancel-button { appearance: none; }
.catalog-search button:hover { background: var(--color-primary-strong); }
.catalog-search button:active { background: var(--ink); }
.catalog-search #clear-search { color: var(--muted); background: transparent; }
.catalog-search #clear-search:hover { color: var(--blue); background: var(--color-selected); }
.catalog-search-row > button { font-weight: 500; background: var(--paper); border-color: var(--line); }
.catalog-search-row > button:hover { color: var(--blue); border-color: var(--blue); }
.catalog-toolbar { background: transparent; padding: 0; min-height: 52px; gap: 12px; margin: 16px 0 24px; }
.view-switch { flex-shrink: 0; border: 1px solid var(--line); background: var(--paper); }
.view-switch button { min-height: 42px; padding-inline: 12px; border: 0; background: transparent; }
.view-switch button:first-child { border-radius: 7px 0 0 7px; }
.view-switch button:last-child { border-radius: 0 7px 7px 0; }
.view-switch button.is-active { color: var(--paper); background: var(--blue); }
.view-switch button:not(.is-active):hover { color: var(--blue); background: var(--color-selected); }
.sort-field { gap: 8px; border: 0; padding: 0; }
.sort-field > span { display: none; }
.sort-field .custom-select__button { min-height: 44px; font-size: 13px; }
.advanced-filters { gap: 16px; padding: 22px 24px; border-color: var(--line); border-radius: var(--radius-control); }
.select-field > span, .route-builder-controls label > span { color: var(--muted); font-weight: 500; font-size: 13px; }
.custom-select { font-family: var(--font-body); }
.custom-select__button { min-height: var(--control-height); padding: 10px 42px 10px 14px; border: 1px solid var(--line); background: var(--paper); color: var(--ink); font-size: 14px; font-weight: 400; line-height: 1.4; border-radius: var(--radius-control); box-shadow: none; transition: border-color var(--motion-feedback) ease, background-color var(--motion-feedback) ease; }
.route-builder-controls .custom-select__button, .select-field .custom-select__button { min-height: var(--control-height); border-radius: var(--radius-control); border-color: var(--line); background: var(--paper); color: var(--ink); font-size: 14px; font-weight: 400; box-shadow: none; }
.custom-select__button > svg { right: 14px; width: 16px; height: 16px; color: var(--muted); stroke-width: 1.7; }
.custom-select__button:hover { border-color: var(--blue); box-shadow: none; }
.custom-select.open > .custom-select__button { border-color: var(--blue); background: var(--paper); box-shadow: none; }
.custom-select.open > .custom-select__button > svg { color: var(--blue); }
.preference-select .custom-select__button { min-height: 44px; }
.custom-select .custom-select__menu { width: 100%; min-width: 0; max-width: none; padding: 6px; scrollbar-gutter: auto; border: 1px solid var(--line); border-radius: var(--radius-control); background: var(--paper); color: var(--ink); box-shadow: 0 8px 24px #192c2b14; animation: none; transform: none; }
.custom-select__option { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 44px; padding: 10px 12px; white-space: normal; overflow-wrap: anywhere; font-size: 14px; font-weight: 400; line-height: 1.4; border-radius: var(--radius-small); }
.custom-select__label { flex: 1; min-width: 0; }
.custom-select :is(.custom-select__value, .custom-select__label) { font: inherit; color: inherit; letter-spacing: normal; text-transform: none; }
.custom-select__check { flex: 0 0 16px; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; opacity: 0; }
.custom-select__option:hover, .custom-select__option:focus { background: var(--canvas); color: var(--ink); }
.custom-select__option:focus-visible { outline: 2px solid var(--blue); outline-offset: -2px; }
.custom-select__option[aria-selected=true] { background: var(--color-selected); color: var(--blue); font-weight: 500; }
.custom-select__option[aria-selected=true] .custom-select__check { opacity: 1; }
.duration-meta { display: inline-flex; align-items: center; align-self: center; vertical-align: middle; gap: 6px; font-variant-numeric: tabular-nums; }
:is(.card-meta, .route-preview-meta, .route-card-meta, .trip-summary) > .duration-meta { align-items: center; align-self: center; }
.duration-meta > svg { flex: 0 0 16px; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.collection-strip .collection-chip { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius-control); }
.collection-strip .collection-chip:hover { border-color: var(--blue); }
.active-context button { border-color: var(--line); background: var(--paper); }
.active-context button:hover { border-color: var(--blue); }
.catalog-context .active-context, .catalog-context > button { margin-bottom: 20px; }
.catalog-context > .reset-button, .catalog-context > .reset-button:hover { color: var(--blue); background: transparent; border-color: transparent; box-shadow: none; transform: none; text-decoration: none; }

/* Two kinds of itinerary share one photographic card grammar. */
.place-grid, .itinerary-content.popular-route-grid { gap: var(--grid-gap); align-items: stretch; }
.place-card, .popular-route-card { display: flex; flex-direction: column; min-width: 0; padding: 0; border: 1px solid var(--line); border-radius: var(--radius-control); background: var(--paper); overflow: hidden; box-shadow: none; transition: border-color var(--motion-feedback) ease; }
.place-card:hover, .popular-route-card:hover { border-color: var(--scroll-thumb); transform: none; box-shadow: none; }
.place-card .card-media, .popular-route-card .route-cover { flex-shrink: 0; border-radius: 7px 7px 0 0; }
.place-card .card-body, .popular-route-card .route-overview { display: flex; flex: 1; flex-direction: column; padding: 16px 18px 14px; }
.place-card .card-context, .route-location { margin: 0 0 8px; color: var(--blue); font-size: 12px; font-weight: 500; line-height: 1.5; }
.place-card .card-title-row h3, .route-overview h3 { margin: 0; color: var(--ink); font-size: 22px; font-weight: 600; line-height: 1.28; overflow-wrap: anywhere; }
.card-title-row a:hover { color: var(--blue); text-decoration: underline; text-underline-offset: 4px; }
.place-card .card-description, .route-overview .route-card-lead { margin: 10px 0 16px; color: var(--muted); font-size: 14px; line-height: 1.55; }
.place-card .card-meta, .route-preview-meta { display: flex; flex-wrap: wrap; gap: 5px 12px; margin: auto 0 12px; align-items: center; }
.place-card .card-meta > span, .route-preview-meta > span { font-size: 13px; line-height: 1.5; font-variant-numeric: tabular-nums; }
.place-card .card-meta > .price-pill, .route-overview .route-card-budget { color: var(--ink); font-size: 14px; font-weight: 600; }
.place-card .card-actions, .route-preview-actions { padding-top: 10px; margin-top: 0; border-top: 1px solid var(--line); }
.place-card .card-actions .details-button, .route-overview .route-details-toggle { min-height: 44px; color: var(--blue); font-size: 14px; font-weight: 500; }
.place-card .card-actions .details-button:hover, .route-overview .route-details-toggle:hover { color: var(--color-primary-strong); text-decoration: underline; text-underline-offset: 4px; }
.place-card .card-actions .trip-add-button, .route-preview-actions .route-add-button { display: grid; place-items: center; color: var(--blue); border-color: var(--line); background: var(--color-selected); }
.place-card .card-actions .trip-add-button:hover, .route-preview-actions .route-add-button:hover { border-color: var(--blue); background: var(--blue); color: var(--paper); }
.trip-add-button svg { display: block; width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.place-card .heart { width: 44px; height: 44px; top: 12px; right: 12px; border: 1px solid #ffffffb3; background: var(--paper); box-shadow: 0 2px 8px #192c2b14; }
.place-card .heart:hover { color: var(--color-danger); background: var(--paper); }
.place-card .heart[aria-pressed=true] { color: var(--color-danger); background: var(--paper); }
.card-photo-counter, .photo-counter { border: 1px solid #ffffff30; background: #192c2bc9; border-radius: var(--radius-small); font-family: var(--font-body); font-size: 12px; font-variant-numeric: tabular-nums; }
.card-media img, .dialog-gallery img, .route-cover { transform: none; }
.card-media > img, .dialog-gallery > img { transition: none; }
.card-media > img.gallery-transition-photo, .place-dialog .dialog-gallery > img.gallery-transition-photo { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; pointer-events: none; }
.card-media, .dialog-gallery { -webkit-user-select: none; user-select: none; }
.gallery-dragging { cursor: grabbing; }
.gallery-dragging > img { will-change: transform; }
.gallery-drag-placeholder { position: absolute; inset: 0; pointer-events: none; background: var(--color-selected); }
.gallery-drag-placeholder::after { content: ""; position: absolute; top: calc(50% - 12px); left: 12px; width: 24px; height: 24px; border: 2px solid var(--line); border-top-color: var(--blue); border-radius: 50%; animation: gallery-loading .8s linear infinite; }
.gallery-drag-placeholder[data-direction=prev]::after { left: auto; right: 12px; }
@keyframes gallery-loading { to { transform: rotate(360deg); } }
.route-budget-note { margin: -5px 0 12px; font-size: 12px; }
.route-dialog .route-stop-list button { background: var(--paper); }
.route-builder-controls { grid-template-columns: repeat(4,minmax(0,1fr)) auto; gap: 12px; margin-bottom: 24px; border: 0; padding-bottom: 0; }
.route-builder-controls > button { align-self: end; min-height: 48px; color: var(--blue); background: transparent; border: 1px solid var(--line); }
.route-builder-controls > button:hover { color: var(--blue); border-color: var(--blue); background: var(--paper); }
.route-builder-controls > button:active { color: var(--color-primary-strong); border-color: var(--blue); background: var(--color-selected); }

/* The one expressive band, always below the first six real places. */
.catalog-quiz { position: relative; isolation: isolate; padding: 28px 32px; margin-block: 8px; gap: 24px; border: 0; border-left: 4px solid var(--color-accent); border-radius: 0; background: var(--color-accent-soft); }
.quiz-band-ornament { position: absolute; width: 180px; height: 180px; right: 28%; top: 50%; transform: translateY(-50%); object-fit: contain; opacity: .12; pointer-events: none; z-index: -1; }
.catalog-quiz h2 { max-width: 520px; font-size: 26px; font-weight: 600; color: var(--ink); }
.catalog-quiz p { color: var(--color-accent-ink); font-size: 13px; }
.catalog-quiz button { min-height: 48px; border-color: var(--color-accent); background: var(--color-accent); color: var(--ink); font-weight: 500; }
.catalog-quiz button:hover { background: var(--paper); border-color: var(--ink); }

.empty-state { padding: 52px 20px; background: transparent; border: 1px dashed var(--line); border-radius: var(--radius-control); }
.empty-state h3 { font-size: 24px; font-weight: 600; }
.empty-state button, #catalog-load-more { background: var(--paper); border-color: var(--line); color: var(--blue); border-radius: var(--radius-control); }
.empty-state button:hover, #catalog-load-more:hover { background: var(--color-selected); border-color: var(--blue); }

.travel-grid, .travel-tools { display: block; margin-top: 0; }
.travel-disclosure { min-width: 0; min-height: 0; padding: 0; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: transparent; box-shadow: none; }
.travel-disclosure > summary { display: grid; grid-template-columns: 24px minmax(0,1fr) 20px; align-items: center; gap: 16px; min-height: 68px; padding: 16px 0; list-style: none; color: var(--ink); }
.travel-disclosure > summary::-webkit-details-marker { display: none; }
.travel-disclosure > summary::marker { content: ""; }
.travel-disclosure > summary:hover { color: var(--blue); }
.travel-disclosure > summary:active { color: var(--color-primary-strong); }
.travel-disclosure > summary h3 { margin: 0; font-size: 20px; font-weight: 600; line-height: 1.35; overflow-wrap: anywhere; }
.travel-disclosure .travel-topic-icon { display: grid; place-items: center; width: 24px; height: 24px; color: var(--blue); }
.disclosure-chevron { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; transition: transform 180ms ease; }
.travel-disclosure[open] > summary .disclosure-chevron { transform: rotate(180deg); }
.travel-disclosure.disclosure-closing > summary .disclosure-chevron { transform: none; }
.travel-disclosure > .disclosure-content { max-width: 900px; padding-left: 40px; }
.travel-disclosure > .disclosure-content::after { content: ""; display: block; height: 20px; }
.travel-topic-icon svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.travel-card li { padding-block: 12px; font-size: 14px; line-height: 1.6; }
.travel-card li b { background: transparent; color: var(--blue); }
.travel-card .phrase { border-radius: var(--radius-small); background: var(--canvas); font-family: var(--font-body); font-size: 14px; line-height: 1.6; }
.emergency-card .travel-topic-icon { color: var(--color-danger); }
.emergency-card .emergency-hint { margin: 0 0 12px; font-weight: 400; font-size: 13px; color: var(--muted); }
.emergency-call { font-family: var(--font-display); font-size: 18px; font-weight: 600; text-decoration: none !important; }
.travel-tool-note, .entry-steps label { font-size: 14px; line-height: 1.6; }
.travel-tool-field { font-size: 13px; font-weight: 500; }
.entry-steps { gap: 14px; }
.entry-steps label { min-height: 32px; }
.entry-steps input { margin-top: 3px; flex-shrink: 0; }
.nearby-attribution { font-size: 12px; }
.nearby-controls > button { background: var(--blue); font-size: 14px; font-weight: 500; }
.nearby-controls > button:hover { background: var(--color-primary-strong); }
.nearby-controls > button:disabled { cursor: progress; }

/* Keep modal layout ownership intact, especially fixed mobile detail controls. */
.place-dialog, .trip-dialog, .map-choice-dialog, .place-quiz-dialog { border-radius: var(--radius-control); border: 1px solid var(--line); box-shadow: 0 24px 80px #192c2b29; color: var(--ink); background: var(--paper); }
dialog::backdrop { background: #192c2b99; backdrop-filter: none; }
.place-dialog::backdrop, .place-quiz-dialog::backdrop { backdrop-filter: none; }
.dialog-content h2 { font-size: 34px; font-weight: 600; margin: 0 0 14px; }
.dialog-lead { color: var(--muted); font-size: 17px; }
.dialog-facts { padding-block: 6px; }
.dialog-facts small { color: var(--muted); font-size: 13px; }
.dialog-facts strong { font-weight: 600; }
.dialog-facts .detail-icon { color: var(--blue); background: var(--color-selected); border-radius: var(--radius-small); }
.dialog-primary-actions > :is(a,button) { font-size: 14px; font-weight: 500; }
#place-dialog .dialog-primary-actions #dialog-share-place { flex: 0 0 48px; width: 48px; height: 48px; min-height: 48px; align-self: center; border-radius: var(--radius-control) !important; }
.dialog-primary-actions > :is(a,button):hover { background: var(--color-selected); }
.dialog-primary-actions #dialog-add-trip:hover { background: var(--color-primary-strong); }
.important-box { padding: 2px 0 2px 16px; border-left: 3px solid var(--color-accent); }
.important-box span { font-size: 13px; font-weight: 600; }
.important-box p { margin-top: 8px; line-height: 1.6; }
.detail-columns h3, .practical-section h3 { font-size: 21px; font-weight: 600; }
.detail-columns ul { padding-left: 20px; }
.detail-columns li::marker { color: var(--blue); }
.visit-summary strong { font-family: var(--font-display); font-size: 24px; font-weight: 600; }
.visit-evidence { margin-block: 16px 0; padding: 0; border: 0; }
.visit-evidence summary { min-height: 44px; font-size: 15px; }
.visit-evidence .visit-verification { margin-top: 0; }
.disclosure-content { display: flow-root; }
.visit-evidence:not([open]) > .disclosure-content, .travel-disclosure:not([open]) > .disclosure-content { display: none; }
.disclosure-content.disclosure-animating { overflow: hidden; }
.place-dialog .dialog-close { background: var(--paper); border: 1px solid var(--line); }
.place-dialog .dialog-close:hover { color: var(--blue); background: var(--color-selected); }
.place-dialog .dialog-close svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
body:has(#route-dialog[open]) { overflow: hidden; }
.route-dialog { height: min(900px, calc(100dvh - 40px)); padding: 0; }
.route-dialog[open] { display: grid; grid-template-rows: auto minmax(0,1fr) auto; }
.route-dialog .dialog-close-bar { height: 64px; border-bottom: 1px solid var(--line); background: var(--paper); }
.route-dialog .dialog-shell { min-height: 0; height: auto; max-height: none; overflow: auto; }
.route-dialog-cover { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; max-height: min(420px, 34dvh); object-fit: cover; object-position: var(--photo-position, 50% 50%); }
.route-dialog .dialog-content { padding: 28px 36px; }
.route-dialog .route-location { margin: 0 0 12px; }
.route-dialog .route-card-meta { margin-block: 16px; }
.route-dialog .route-stop-list { grid-template-columns: minmax(0,1fr); margin-block: 20px; }
.route-dialog .route-stop-list button { min-height: 44px; }
.route-dialog .route-leg-list { padding-left: 20px; color: var(--muted); line-height: 1.6; }
.route-dialog .route-leg-list li { margin-block: 12px; }
.route-dialog .route-dialog-actions { position: static; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin: 0; padding: 16px 24px; border-top: 1px solid var(--line); background: var(--paper); }
.route-dialog-actions > :is(a,button) { min-width: 0; min-height: 48px; text-align: center; overflow-wrap: anywhere; }
#route-dialog-add { background: var(--blue); color: var(--paper); cursor: pointer; }
#route-dialog-add:hover { background: var(--color-primary-strong); }
.trip-shell { padding: 32px; }
.trip-shell h2 { font-size: 30px; font-weight: 600; }
.trip-item { border: 0; border-bottom: 1px solid var(--line); border-radius: 0; padding: 16px 0; background: var(--paper); }
.trip-item img { border-radius: var(--radius-small); }
.trip-summary { border: 0; border-top: 1px solid var(--line); border-radius: 0; padding: 18px 0 0; background: transparent; }
.trip-actions { gap: 10px; }
.trip-actions :is(a,button) { border-radius: var(--radius-control); min-height: 48px; font-size: 14px; font-weight: 500; }
.trip-actions #trip-map { color: var(--paper); background: var(--blue); border-color: var(--blue); }
.trip-actions #trip-map:hover { background: var(--color-primary-strong); }
.trip-close, .map-choice-close { width: 44px; height: 44px; border-radius: var(--radius-control); background: var(--paper); border-color: var(--line); }
.trip-close:hover, .map-choice-close:hover { color: var(--blue); background: var(--color-selected); }
.map-choice-shell { padding: 32px; }
.map-choice-shell h2 { font-size: 26px; line-height: 1.3; font-weight: 600; }
.map-choice-options a { min-height: 60px; color: var(--ink); border-color: var(--line); font-size: 15px; font-weight: 500; }
.map-choice-options a:hover { border-color: var(--blue); background: var(--color-selected); }
.map-choice-options a[data-preferred=true] { border-color: var(--blue); background: var(--color-selected); }
.map-choice-options small { color: var(--blue); font-size: 12px; }
.toast { border-radius: var(--radius-control); color: var(--paper); background: var(--ink); font-size: 14px; }
#correction-dialog label { display: grid; gap: 8px; }
#correction-dialog textarea { width: 100%; padding: 12px; border: 1px solid var(--line); border-radius: var(--radius-control); }
#correction-dialog textarea[aria-invalid=true] { border-color: var(--color-danger); }
#correction-dialog form > button { min-height: 48px; border-radius: var(--radius-control); padding: 10px 20px; border: 1px solid var(--blue); background: var(--blue); color: var(--paper); }
#correction-status { min-height: 24px; color: var(--color-danger); font-size: 14px; }
.confirm-shell p { font-size: 15px; color: var(--muted); }
.confirm-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 24px; }
.confirm-actions button { min-height: 48px; padding: 10px 16px; border: 1px solid var(--line); border-radius: var(--radius-control); background: var(--paper); font-size: 14px; }
.confirm-actions button[value=replace] { color: var(--paper); background: var(--blue); border-color: var(--blue); }
.confirm-actions button:hover { border-color: var(--blue); }

.quiz-header { background: var(--color-selected); }
.quiz-body legend, .quiz-body h2 { font-family: var(--font-display); font-size: 26px; font-weight: 600; }
.quiz-body { overflow-x: hidden; }
.quiz-step-content { display: flow-root; min-width: 0; }
.quiz-options label { background: var(--paper); border-color: var(--line); }
.quiz-options label:hover { border-color: var(--blue); }
.quiz-options label:has(input:checked) { background: var(--color-selected); }
.quiz-options label:has(input:checked)::after { content: ""; position: absolute; inset: 0; border: 1px solid var(--blue); border-radius: 7px; pointer-events: none; }
.quiz-option-copy { padding: 12px; font-size: 14px; }
.quiz-options small { font-size: 12px; line-height: 1.5; }
.quiz-actions #quiz-next:hover:not(:disabled) { background: var(--color-primary-strong); }

.mobile-nav-dialog { background: var(--paper); }
.mobile-nav-header { background: var(--color-selected); }
.mobile-nav-header::after { background: var(--blue); width: 44px; }
.mobile-nav-brand strong { font-size: 32px; font-weight: 700; }
.mobile-nav-footer { background: var(--canvas); }
#mobile-nav-dialog #site-nav a { font-family: var(--font-display); font-size: 22px; font-weight: 500; }
#mobile-nav-dialog #site-nav a[aria-current=page] { background: var(--color-selected); }
.mobile-nav-footer .preferences { border: 1px solid var(--line); background: var(--paper); }
.mobile-nav-footer .custom-select__menu { min-width: 0; max-width: none; }
footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px; padding: 36px var(--page-gutter); color: var(--ink); background: var(--paper); border-top: 1px solid var(--line); }
footer::before { display: none; }
.footer-brand { gap: 12px; }
.footer-brand strong { font-family: var(--font-display); font-size: 24px; font-weight: 600; }
.footer-brand small { color: var(--muted); font-size: 13px; }
.privacy-link { font-size: 12px; color: var(--muted); }
.footer-photo-credit { flex: 1 0 100%; margin: 0; color: var(--muted); font-size: 11px !important; }
.motion-enter { animation-duration: var(--motion-card-enter); }
@keyframes motion-card-reveal { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

@media (min-width: 901px) {
  .explorer { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 0 24px; }
  .explorer > * { grid-column: 1 / -1; }
  .explorer > .catalog-search-area { grid-column: 1; margin-bottom: 24px; }
  .explorer > .catalog-toolbar { grid-column: 2; align-self: start; margin: 0 0 24px; }
  .explorer:has(#advanced-filters:not([hidden])) > .catalog-search-area { grid-column: 1 / -1; margin-bottom: 0; }
  .explorer:has(#advanced-filters:not([hidden])) > .catalog-toolbar { grid-column: 1 / -1; justify-content: space-between; margin-block: 16px 24px; }
}
@media (max-width: 1100px) {
  .topbar { gap: 24px; }
  .header-action-label { display: none; }
  .route-builder-controls { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .route-builder-controls > button { justify-self: start; padding-inline: 20px; }
}
@media (max-width: 900px) {
  .place-grid, .itinerary-content.popular-route-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .catalog-heading h1, .routes-heading h2, .travel-heading h2 { font-size: 32px; }
  .catalog-quiz { padding: 24px; }
  .quiz-band-ornament { right: 20%; }
}
@media (max-width: 620px) {
  :root { --page-gutter: 16px; --grid-gap: 20px; }
  html { scroll-padding-top: 84px; }
  .topbar { min-height: 72px; gap: 8px; padding: 10px var(--page-gutter); }
  .topbar .brand { gap: 8px; }
  .topbar .brand-mark { width: 32px; height: 40px; }
  .brand-name { font-size: 23px; }
  .brand-copy small { font-size: 10px; }
  .header-tools { gap: 6px; }
  .header-tools :is(.saved-button,.trip-header-button) { min-width: 44px; padding-inline: 8px; gap: 5px; }
  .header-tools :is(#saved-count,#trip-count) { min-width: 16px; height: 20px; padding: 0; font-size: 11px; background: transparent; }
  .mobile-nav-toggle { width: 44px; height: 44px; flex: 0 0 44px; border-color: var(--line); }
  .explorer, .itineraries, .travel-kit, body.travel-page #travel-kit, body.routes-page #routes { padding: 26px var(--page-gutter) 40px; }
  .section-heading.catalog-heading, .routes-heading, .travel-heading { margin-bottom: 20px; }
  .catalog-heading h1, .routes-heading h2, .travel-heading h2 { font-size: 28px; line-height: 1.22; }
  .catalog-heading .results-count { margin-top: 10px; }
  .catalog-search-row > button { min-width: 48px; padding-inline: 12px; }
  .catalog-search input { padding-left: 12px; }
  .catalog-toolbar { margin-block: 12px 20px; min-height: 44px; }
  .sort-field { flex-basis: 184px; }
  .view-switch button { min-width: 44px; padding-inline: 11px; }
  .advanced-filters { padding: 16px; gap: 12px; }
  .place-grid, .itinerary-content.popular-route-grid { grid-template-columns: minmax(0,1fr); }
  .place-card .card-body, .popular-route-card .route-overview { padding: 16px; }
  .place-card .card-title-row h3, .route-overview h3 { font-size: 22px; }
  .place-card .card-context, .route-location { font-size: 12px; }
  .place-card .card-description, .route-overview .route-card-lead { font-size: 15px; }
  .place-card .card-meta, .route-preview-meta { margin-bottom: 12px; }
  .place-card .card-meta > span { font-size: 13px; }
  .catalog-quiz { padding: 24px 20px; gap: 20px; }
  .catalog-quiz h2 { font-size: 24px; }
  .quiz-band-ornament { right: 0; width: 140px; height: 140px; top: 0; transform: none; }
  .travel-disclosure > summary { gap: 12px; }
  .travel-disclosure > summary h3 { font-size: 18px; }
  .travel-disclosure > .disclosure-content { padding-left: 0; }
  .place-dialog { border: 0; border-radius: 0; }
  .place-dialog .dialog-close-bar { background: var(--paper); }
  .route-dialog { height: 100dvh; max-height: 100dvh; }
  .route-dialog .dialog-close-bar { height: calc(60px + env(safe-area-inset-top)); }
  .route-dialog .dialog-content { padding: 20px 18px; }
  .route-dialog .dialog-content h2 { font-size: 28px; }
  .route-dialog-cover { object-position: var(--photo-position-mobile, 50% 50%); }
  .route-dialog .route-dialog-actions { padding: 12px 14px calc(12px + env(safe-area-inset-bottom)); gap: 10px; }
  .dialog-content h2 { font-size: 30px; }
  .dialog-primary-actions { background: var(--paper); }
  #place-dialog .dialog-primary-actions { grid-template-columns: repeat(2,minmax(0,1fr)) 48px; gap: 8px; align-items: center; }
  #place-dialog .dialog-primary-actions > :is(a,button) { padding-inline: 8px; }
  .map-choice-shell, .trip-shell { padding: 24px; }
  .map-choice-shell h2 { font-size: 24px; }
  .map-choice-options a { flex-wrap: wrap; gap: 4px 10px; }
  .trip-shell h2 { font-size: 28px; }
  .confirm-actions { flex-wrap: wrap; }
  .confirm-actions button { flex: 1 0 auto; }
  .quiz-body legend, .quiz-body h2 { font-size: 23px; }
  footer { padding-block: 28px; gap: 20px; }
}
@media (max-width: 359px) {
  .brand-copy small { display: none; }
  .topbar { gap: 6px; }
  .topbar .brand { gap: 5px; }
  .brand-name { font-size: 21px; }
  .catalog-search-row > button > span { display: none; }
}
@media (forced-colors: active) {
  * { scrollbar-color: auto; }
  *::-webkit-scrollbar-thumb { background: ButtonText; border-color: Canvas; }
  *::-webkit-scrollbar-track { background: Canvas; }
  .view-switch button.is-active, .custom-select__option[aria-selected=true] { outline: 2px solid Highlight; outline-offset: -2px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}