:root {
  color-scheme: light;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #12170f;
  background: #eee8dc;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; }
body { margin: 0; overflow-x: hidden; background: #eee8dc; }
button, a, input, textarea, select { font: inherit; }
a { color: inherit; }

.site-header, main { max-width: 1320px; margin: 0 auto; }
.site-header { display: flex; align-items: center; min-height: 92px; gap: 34px; padding: 18px 26px; }
.brand { display: inline-flex; align-items: center; gap: 9px; color: #161b13; font-size: 1.42rem; font-weight: 850; letter-spacing: -.07em; text-decoration: none; }
.brand img { display: block; border-radius: 10px; }
nav { display: flex; flex: 1; justify-content: center; gap: 26px; }
nav a { color: #3c4039; font-size: .9rem; font-weight: 650; text-decoration: none; }
nav a:hover { color: #b24431; }
.signin, .primary, .secondary { display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; cursor: pointer; font-weight: 760; line-height: 1; padding: 13px 19px; text-decoration: none; transition: transform .18s ease, background .18s ease; }
.signin:hover, .primary:hover, .secondary:hover { transform: translateY(-2px); }
.signin { background: #131a11; color: #f5efe6; }
.primary { border: 1px solid #b73f2b; background: #b73f2b; color: #fff8f0; }
.secondary { border: 1px solid #252a20; background: transparent; color: #20251d; }
.auth-message { margin: 3px 26px 18px; border: 1px solid #c49241; border-radius: 0; background: #fff0ca; color: #614606; padding: 13px 16px; }

.editorial-hero { display: grid; grid-template-columns: minmax(0, 1.72fr) minmax(310px, .84fr); margin: 18px 26px 100px; min-height: 660px; overflow: hidden; background: #f8f3e9; }
.hero-poster { position: relative; isolation: isolate; display: block; min-height: 660px; overflow: hidden; padding: 30px; color: #f5efe4; }
.hero-poster > img { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero-poster::after { position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, #0b110d88 0%, #0b110d1c 58%, #0b110d0d); content: ""; }
.hero-poster__top { position: absolute; top: 30px; right: 30px; left: 30px; display: flex; align-items: start; justify-content: space-between; color: #eaddca; font-size: .71rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.hero-poster__copy { position: absolute; bottom: 49px; left: clamp(30px, 7vw, 90px); max-width: 590px; }
.eyebrow { margin: 0; color: #ae3a2b; font-family: "Arial Narrow", Arial, sans-serif; font-size: .77rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.eyebrow--light { color: #f1c9a6; }
.hero-poster h1, .principles h2, .hero-guide h2 { font-family: "Arial Narrow", Impact, Haettenschweiler, sans-serif; font-stretch: condensed; font-weight: 500; text-transform: uppercase; }
.hero-poster h1 { margin: 12px 0 18px; font-size: clamp(4.4rem, 9.2vw, 9.4rem); letter-spacing: -.065em; line-height: .79; }
.hero-poster__copy > p:last-child { max-width: 370px; color: #f0e6d8; font-size: 1rem; line-height: 1.55; }
.round-cta { position: absolute; right: 35px; bottom: 31px; display: grid; width: 128px; height: 128px; place-content: center; border-radius: 50%; background: #bf4833; color: #fff8ef; font-family: "Arial Narrow", Arial, sans-serif; font-size: 1.1rem; font-weight: 800; letter-spacing: .02em; line-height: .95; text-align: center; text-decoration: none; text-transform: uppercase; transition: transform .2s ease, background .2s ease; }
.round-cta span { font-family: Inter, sans-serif; font-size: 1.7rem; line-height: 1.2; }
.round-cta:hover { background: #df6546; transform: rotate(8deg) scale(1.04); }

.hero-guide { display: flex; min-width: 0; min-height: 660px; flex-direction: column; overflow: hidden; padding: 42px 36px 27px; background: #f8f3e9; }
.hero-guide h2 { max-width: 310px; margin: 19px 0 16px; font-size: clamp(2.1rem, 3.2vw, 3.1rem); letter-spacing: -.055em; line-height: .86; overflow-wrap: anywhere; }
.hero-guide__intro { margin: 0 0 34px; color: #53554c; font-size: .94rem; line-height: 1.55; }
.route-steps { display: grid; gap: 0; margin: auto 0 22px; padding: 0; list-style: none; }
.route-steps li { display: grid; grid-template-columns: 52px 1fr; padding: 17px 0; border-top: 1px solid #d3ccbd; }
.route-steps li > span, .principles-list > article > span { color: #b53d2b; font-family: "Arial Narrow", Arial, sans-serif; font-size: 1.46rem; font-weight: 900; letter-spacing: -.04em; }
.route-steps strong { display: block; color: #20251d; font-family: "Arial Narrow", Arial, sans-serif; font-size: 1.48rem; font-weight: 900; letter-spacing: -.04em; text-transform: uppercase; }
.route-steps p { margin: 4px 0 0; color: #67685f; font-size: .78rem; line-height: 1.35; }
.hero-guide__footer { display: flex; justify-content: space-between; padding-top: 17px; border-top: 1px solid #2a2d27; color: #45493f; font-family: "Arial Narrow", Arial, sans-serif; font-size: .72rem; font-weight: 800; letter-spacing: .08em; }

.trips { margin: 0 26px 110px; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 25px; padding-bottom: 20px; border-bottom: 1px solid #c7c0b2; }
.section-heading h2 { margin: 5px 0 0; font-family: "Arial Narrow", Impact, sans-serif; font-size: clamp(2.5rem, 4vw, 4.4rem); font-weight: 500; letter-spacing: -.06em; line-height: .83; text-transform: uppercase; }
.trip-list { display: grid; gap: 16px; }
.empty-state { margin: 0; border: 1px dashed #aaa493; padding: 31px; color: #616358; text-align: center; }
.trip-card { display: grid; overflow: hidden; grid-template-columns: minmax(250px, .75fr) 1.25fr; border: 1px solid #c8c0b3; background: #f8f3e9; }
.trip-map { display: grid; min-height: 178px; place-items: center; padding: 24px; background-color: #334134; background-image: linear-gradient(140deg, #748d763d 1px, transparent 1px), linear-gradient(43deg, transparent 48%, #c9664c38 49%, #c9664c38 52%, transparent 53%); background-size: 20px 20px, 100% 100%; color: #f4e7d3; font-family: "Arial Narrow", Arial, sans-serif; font-size: 1.3rem; font-weight: 800; text-align: center; text-transform: uppercase; }
.trip-content { align-self: center; padding: 28px 32px; }
.trip-content h3 { margin: 11px 0 7px; color: #1d231a; font-family: "Arial Narrow", Arial, sans-serif; font-size: 2.2rem; font-weight: 900; letter-spacing: -.045em; line-height: .93; text-transform: uppercase; }
.trip-content p { max-width: 500px; margin: 0; color: #64655d; line-height: 1.5; }
.badge { display: inline-block; padding: 4px 8px; background: #d7c7a9; color: #543b22; font-family: "Arial Narrow", Arial, sans-serif; font-size: .78rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }

.principles { display: grid; grid-template-columns: .9fr 1.1fr; gap: 60px; margin: 0 26px 95px; padding: 66px 0 0; border-top: 1px solid #20251d; }
.principles h2 { margin: 10px 0 0; font-size: clamp(3rem, 5.4vw, 6.1rem); letter-spacing: -.075em; line-height: .8; }
.principles-list { border-top: 1px solid #c3bbab; }
.principles-list > article { display: grid; grid-template-columns: 68px 1fr 1.1fr; align-items: baseline; gap: 14px; padding: 20px 0 25px; border-bottom: 1px solid #c3bbab; }
.principles-list h3 { margin: 0; font-family: "Arial Narrow", Arial, sans-serif; font-size: 1.65rem; font-weight: 900; letter-spacing: -.04em; text-transform: uppercase; }
.principles-list p { margin: 0; color: #5f6259; font-size: .92rem; line-height: 1.5; }

.trip-dialog, .profile-dialog { width: min(100% - 32px, 560px); border: 0; border-radius: 0; box-shadow: 0 24px 80px #0005; padding: 30px; background: #f8f3e9; }
.trip-dialog::backdrop, .profile-dialog::backdrop { background: #10231988; }
.dialog-heading { display: flex; align-items: center; gap: 12px; margin-bottom: 22px; }
.dialog-heading > div { margin-right: auto; }
.dialog-heading h2 { margin: 6px 0 0; font-family: "Arial Narrow", Arial, sans-serif; font-size: 2.3rem; font-weight: 900; letter-spacing: -.05em; line-height: .9; text-transform: uppercase; }
.dialog-brand { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; line-height: 0; border-radius: 10px; }
.dialog-brand img { display: block; border-radius: 10px; }
.dialog-brand:hover { box-shadow: 0 0 0 2px #b73f2b66; }
.icon-button { border: 0; background: transparent; color: #42564a; cursor: pointer; font-size: 2rem; line-height: 1; }
.trip-dialog label, .profile-dialog label { display: grid; gap: 7px; color: #284235; font-size: .84rem; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; margin: 16px 0; }
.trip-dialog input, .trip-dialog textarea, .trip-dialog select,
.profile-dialog input, .profile-dialog textarea, .profile-dialog select { width: 100%; border: 1px solid #9d9a8e; border-radius: 0; background: #fffdf8; color: #16221d; font: inherit; font-weight: 400; letter-spacing: normal; padding: 11px 12px; text-transform: none; }
.trip-dialog textarea, .profile-dialog textarea { resize: vertical; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.form-error { color: #9a271d; margin: 10px 0; }
.dialog-actions { display: flex; justify-content: end; gap: 10px; margin-top: 24px; }

/* Editable user profile */
.profile-dialog { width: min(100% - 32px, 540px); }
.profile-avatar { display: flex; align-items: center; gap: 18px; margin: 4px 0 10px; }
.profile-avatar__preview { display: block; width: 96px; height: 96px; border-radius: 50%; object-fit: cover; border: 2px solid #d3ccbd; background: #efe9dc; }
.profile-avatar__actions { display: flex; flex-direction: column; align-items: start; gap: 8px; }
.profile-avatar__actions .media-add { margin: 0; }
.profile-avatar__actions .secondary { margin: 0; padding: 8px 14px; font-size: .82rem; }
.profile-age { display: grid; gap: 7px; align-content: end; margin: 16px 0; color: #284235; font-size: .84rem; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; }
.profile-age__value { color: #20251d; font-size: 1.05rem; font-weight: 700; letter-spacing: normal; text-transform: none; }
.profile-status { align-self: center; margin-right: auto; color: #1e5f4b; font-size: .8rem; }

.route-dialog { width: min(96vw, 1180px); max-height: 94vh; border: 0; padding: 0; background: #f8f3e9; box-shadow: 0 24px 80px #0006; }
.route-dialog::backdrop { background: #10231999; }
.route-editor { position: relative; padding: 26px; }
.route-editor.is-busy { pointer-events: none; user-select: none; }
.route-editor.is-busy .route-editor__layout { filter: grayscale(0.2) opacity(0.7); transition: filter 0.2s ease, opacity 0.2s ease; }

.route-loader { position: absolute; inset: 0; z-index: 2000; background: rgba(248, 243, 233, 0.65); backdrop-filter: blur(2px); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; opacity: 0; pointer-events: none; transition: opacity 0.2s ease; }
.route-loader:not([hidden]) { opacity: 1; pointer-events: auto; }
.route-loader-spinner { width: 44px; height: 44px; border: 4px solid #d3ccbd; border-top-color: #b73f2b; border-radius: 50%; animation: spin 0.8s cubic-bezier(0.65, 0, 0.35, 1) infinite; }
.route-loader-text { font-family: "Arial Narrow", Arial, sans-serif; font-size: 1.15rem; font-weight: 850; letter-spacing: 0.05em; text-transform: uppercase; color: #20251d; background: #fff8ef; padding: 6px 14px; border: 1px solid #d3ccbd; box-shadow: 0 4px 16px rgba(0,0,0,0.08); }

@keyframes spin {
  to { transform: rotate(360deg); }
}
.route-editor__header { display: flex; align-items: start; justify-content: space-between; gap: 18px; margin-bottom: 28px; }
.route-editor__header h2 { margin: 5px 0 0; font-family: "Arial Narrow", Arial, sans-serif; font-size: 2.4rem; text-transform: uppercase; }
.route-editor__header-actions { display: flex; align-items: end; gap: 10px; }
.route-editor__settings { display: flex; align-items: stretch; gap: 8px; }
.route-editor__field { position: relative; display: grid; gap: 4px; min-width: 132px; color: #284235; font-size: .72rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.route-editor__field > span:first-child { min-height: 14px; }
.route-editor__field select, .route-delete { box-sizing: border-box; width: 100%; min-height: 37px; border: 1px solid #9d9a8e; border-radius: 6px; background: #fffdf8; color: #16221d; padding: 8px 10px; font: inherit; font-weight: 600; letter-spacing: normal; text-transform: none; }
.route-editor__field--danger { color: #982c20; }
.route-delete { border-color: #c98f83; color: #982c20; font-size: .84rem; font-weight: 800; cursor: pointer; }
.route-delete:hover { background: #f5e2de; }
.route-editor__header-actions .icon-button { align-self: end; margin-bottom: 1px; }
.readonly-banner { margin: 0 0 16px; padding: 10px 14px; border: 1px solid #b9a7d6; background: #efe9f8; color: #533d78; font-size: .88rem; font-weight: 700; }
.share-panel { display: flex; align-items: center; gap: 10px; margin: 0 0 16px; padding: 8px 10px; border: 1px solid #d8d0c2; border-radius: 10px; background: #f7f3eb; }
.share-panel__label { color: #687064; font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.share-links { flex: 1; min-width: 0; margin: 0; padding: 0; list-style: none; }
.share-link { display: flex; align-items: center; gap: 8px; min-width: 0; }
.share-link.is-revoked { opacity: .55; }
.share-link__url { flex: 1; min-width: 0; color: #284235; font-size: .78rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.share-link__status { font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: #9a6627; }
.share-link__actions { display: flex; flex: none; gap: 5px; }
.share-link__actions button { border: 1px solid #b8b0a2; background: #fffdf8; color: #20251d; border-radius: 999px; padding: 4px 8px; font-size: .7rem; font-weight: 800; cursor: pointer; }
.share-link__actions button:hover { background: #eee8dc; }
.share-link__actions button.revoke { color: #982c20; border-color: #c98f83; }
.share-link__actions button.revoke:hover { background: #f5e2de; }
.visibility-status { position: absolute; top: calc(100% + 4px); left: 0; font-size: .72rem; font-weight: 700; letter-spacing: normal; text-transform: none; white-space: nowrap; }
.visibility-status.is-error { color: #982c20; }
.visibility-status.is-saved { color: #2e7d5a; }
.route-editor__layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, .8fr); gap: 22px; }
.point-panel { max-height: 70vh; overflow: auto; padding-right: 5px; pointer-events: auto; position: relative; z-index: 1; }
.point-panel__tabs { display: flex; gap: 4px; margin-bottom: 12px; border-bottom: 1px solid #c7c0b2; }
.tab { border: 0; background: transparent; color: #6a6d63; padding: 9px 14px; font-size: .86rem; font-weight: 800; letter-spacing: .02em; text-transform: uppercase; cursor: pointer; border-bottom: 3px solid transparent; margin-bottom: -1px; transition: color .15s ease, border-color .15s ease; }
.tab:hover { color: #20251d; }
.tab.is-active { color: #b73f2b; border-bottom-color: #b73f2b; }
.point-panel__heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; padding-bottom: 10px; border-bottom: 1px solid #c7c0b2; }
.point-panel__heading h3 { margin: 0; font-family: "Arial Narrow", Arial, sans-serif; font-size: 1.5rem; font-weight: 900; letter-spacing: -.03em; text-transform: uppercase; }
.add-point-btn { border: 1px solid #b73f2b; background: #b73f2b; color: #fff8f0; border-radius: 999px; padding: 8px 14px; font-weight: 760; cursor: pointer; transition: transform .15s ease, background .15s ease; }
.add-point-btn:hover { background: #c94e36; transform: translateY(-1px); }
.route-map { height: min(58vh, 590px); min-height: 390px; width: 100%; position: relative; overflow: hidden; }
.place-search { position: relative; display: grid; gap: 6px; margin-bottom: 10px; }
.place-search label, .point-panel label { display: grid; gap: 6px; margin: 11px 0; color: #284235; font-size: .78rem; font-weight: 800; text-transform: uppercase; }
.place-search input, .point-panel input, .point-panel textarea { width: 100%; border: 1px solid #9d9a8e; background: #fffdf8; padding: 10px 11px; }
.place-results { position: absolute; z-index: 1001; top: 100%; right: 0; left: 0; border: 1px solid #aaa493; background: #fffdf8; box-shadow: 0 10px 30px #0002; }
.place-results button { display: block; width: 100%; border: 0; border-bottom: 1px solid #ddd6c9; background: transparent; padding: 11px; text-align: left; cursor: pointer; }
.place-results button:hover { background: #eee8dc; }
.route-summary { margin: 12px 0 0; padding: 10px 14px; background: #e8e2d4; border: 1px solid #d3ccbd; color: #20251d; font-size: .95rem; font-weight: 600; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.route-summary strong { color: #b73f2b; font-size: 1.1rem; }
.route-summary-stale { color: #9a6627; }
.point-list { display: grid; gap: 8px; margin: 0 0 18px; padding: 0; list-style: none; }
.point-item { border: 1px solid #cec6b8; background: #eee8dc; transition: background .15s ease, border-color .15s ease; user-select: none; }
.point-item.is-open { border-color: #b73f2b; background: #f8f3e9; box-shadow: 0 3px 10px rgba(0,0,0,.07); }
.point-item.dragging { opacity: .4; background: #d7cebe; }
.point-item.drag-over { border: 2px dashed #b73f2b; background: #e2d9cb; }
.point-item__head { display: grid; grid-template-columns: 34px minmax(0, 1fr) 34px 52px 32px; align-items: center; cursor: pointer; }
.point-item__head:hover { background: #e4dccb; }
.point-order { padding-left: 9px; color: #b53d2b; font-weight: 900; }
.point-name, .point-remove, .point-move-btn, .point-locate { border: 0; background: transparent; cursor: pointer; }
.point-name { padding: 12px 5px; text-align: left; font-weight: 750; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.point-locate { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; padding: 5px 7px; margin-left: 2px; border-radius: 6px; color: #5f6259; }
.point-locate:hover { color: #1e5f4b; background: #e2ecdf; }
.point-reorder-buttons { display: flex; flex-direction: row; gap: 2px; justify-content: center; }
.point-move-btn { color: #50564b; font-size: .9rem; padding: 4px 6px; border-radius: 3px; font-weight: 900; }
.point-move-btn:hover:not(:disabled) { background: #d5ccbd; color: #151a13; }
.point-move-btn:disabled { color: #b0ab9f; cursor: default; }
.point-remove { color: #982c20; font-size: 1.4rem; padding: 0 6px; }
.point-remove:hover { color: #c42f20; }
.point-item__body { padding: 0 14px 14px; }
.point-item__body form { margin: 0; padding: 12px 14px; border: 1px solid #d3ccbd; background: #fffdf8; }
.point-item__body form > label:first-child { margin-top: 6px; }
.point-detail { margin: 0; padding: 12px 14px; border: 1px solid #d3ccbd; background: #fffdf8; color: #20251d; font-size: .88rem; line-height: 1.5; }
.point-detail + .point-detail { margin-top: 8px; }
.point-detail--muted { color: #5f6259; font-size: .8rem; }
.coordinates { padding: 8px 10px; background: #dce5d8; color: #344333; font-size: .8rem; }
.draft-marker { width: 16px; height: 16px; border: 3px solid #fff; border-radius: 50%; background: rgba(183, 63, 43, 0.8); box-shadow: 0 1px 6px rgba(0, 0, 0, 0.45); }
.draft-marker--poi { background: rgba(58, 143, 122, 0.85); }
.poi-marker { width: 20px; height: 20px; }
.poi-marker__inner { position: relative; width: 100%; height: 100%; transform: rotate(45deg); border: 3px solid #fff; border-radius: 3px; background: rgba(58, 143, 122, 0.92); box-shadow: 0 1px 6px rgba(0, 0, 0, 0.4); }
.poi-marker__inner::after { content: ''; position: absolute; inset: 4px; background: #fff; border-radius: 1px; }
.maplibregl-popup-content { font-family: Inter, ui-sans-serif, system-ui, sans-serif; font-size: .85rem; font-weight: 600; color: #20251d; }
.point-item--poi .point-item__head:hover { background: #e2ecdf; }
.point-item--poi.is-open { border-color: #3a8f7a; box-shadow: 0 3px 10px rgba(0,0,0,.07); }
.point-item--poi .point-order { color: #3a8f7a; }

@media (max-width: 820px) {
  .site-header { min-height: 72px; padding: 12px 18px; }
  nav { display: none; }
  .signin { margin-left: auto; font-size: .85rem; padding: 11px 13px; }
  .editorial-hero { grid-template-columns: 1fr; margin: 12px 16px 70px; }
  .hero-poster { min-height: 570px; padding: 24px; }
  .hero-poster__top { top: 24px; right: 24px; left: 24px; }
  .hero-poster__copy { bottom: 49px; left: 24px; }
  .hero-poster h1 { font-size: clamp(4.2rem, 17vw, 7.8rem); }
  .hero-guide { min-height: auto; padding: 36px 26px 24px; }
  .route-steps { margin-top: 12px; }
  .trips { margin: 0 16px 75px; }
  .principles { grid-template-columns: 1fr; gap: 40px; margin: 0 16px 70px; padding-top: 42px; }
  .principles-list > article { grid-template-columns: 50px 1fr; gap: 10px; }
  .principles-list > article > p { grid-column: 2; }
  .route-editor__layout { grid-template-columns: 1fr; }
  .route-map { min-height: 340px; height: 45vh; }
  .point-panel { max-height: none; }
  .route-editor__header { flex-direction: column; }
  .route-editor__header-actions { align-self: flex-end; }
}

@media (max-width: 560px) {
  .brand { font-size: 1.25rem; }
  .brand img { width: 33px; height: 33px; }
  .site-header { gap: 9px; padding-right: 16px; padding-left: 16px; }
  .signin { min-width: 0; max-width: 116px; overflow: hidden; padding: 10px 12px; font-size: .8rem; text-overflow: ellipsis; white-space: nowrap; }
  .auth-message { margin: 3px 16px 15px; }
  .hero-poster { min-height: 545px; }
  .hero-poster__top { font-size: .61rem; }
  .hero-poster__copy { bottom: 62px; }
  .round-cta { right: 21px; bottom: 19px; width: 102px; height: 102px; font-size: .91rem; }
  .trip-card { grid-template-columns: 1fr; }
  .trip-content { padding: 24px; }
  .section-heading { align-items: start; flex-direction: column; }
  .route-editor { padding: 18px; }
  .route-editor__header-actions { width: 100%; }
  .route-editor__settings { display: grid; flex: 1; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .route-editor__field { min-width: 0; }
  .form-row { grid-template-columns: 1fr; gap: 0; }
}

/* Media galleries for trip, route point and POI photos */
.trip-info { padding: 14px 0; }
.trip-info h3 { margin: 0 0 12px; }
.trip-info h4 { margin: 18px 0 8px; font-size: .9rem; color: #344333; }
.trip-description-actions { display: flex; align-items: center; gap: 10px; margin-top: 10px; }
.trip-description-status { font-size: .78rem; color: #5f6259; }
.trip-description-status.is-saved { color: #1e5f4b; }
.trip-description-status.is-error { color: #982c20; }
.media-section { margin-top: 12px; }
.media-section h4 { margin: 0 0 6px; font-size: .82rem; color: #5f6259; }
.media-gallery { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 6px; }
.media-thumb { position: relative; margin: 0; }
.media-thumb img { display: block; width: 84px; height: 84px; object-fit: cover; border-radius: 8px; border: 1px solid #d3ccbd; background: #efe9dc; }
.media-remove { position: absolute; top: -7px; right: -7px; width: 22px; height: 22px; padding: 0; border-radius: 50%; background: #982c20; color: #fff; font-size: .95rem; line-height: 1; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.35); }
.media-remove:hover { background: #c42f20; }
.media-add { display: inline-flex; align-items: center; gap: 6px; margin-top: 8px; padding: 8px 12px; border: 1px dashed #b9b2a0; border-radius: 8px; color: #344333; font-size: .85rem; cursor: pointer; }
.media-add:hover { border-color: #1e5f4b; color: #1e5f4b; background: #f3f6f0; }

/* Full-screen image viewer (lightbox) */
.media-thumb { cursor: zoom-in; }
.media-thumb img { pointer-events: none; }
.lightbox { position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; border: none; padding: 28px; display: flex; align-items: center; justify-content: center; background: rgba(10, 12, 8, 0.92); }
.lightbox::backdrop { background: transparent; }
.lightbox img { max-width: 100%; max-height: 100%; border-radius: 6px; box-shadow: 0 10px 50px rgba(0, 0, 0, 0.65); object-fit: contain; }
.lightbox-close { position: absolute; top: 14px; right: 14px; width: 42px; height: 42px; border-radius: 50%; background: rgba(255, 255, 255, 0.14); color: #fff; font-size: 1.7rem; line-height: 1; box-shadow: 0 1px 6px rgba(0, 0, 0, 0.4); }
.lightbox-close:hover { background: rgba(255, 255, 255, 0.3); }
.lightbox-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 48px; height: 48px; border-radius: 50%; background: rgba(255, 255, 255, 0.14); color: #fff; font-size: 2.2rem; line-height: 1; box-shadow: 0 1px 6px rgba(0, 0, 0, 0.4); }
.lightbox-nav:hover { background: rgba(255, 255, 255, 0.3); }
.lightbox-nav--prev { left: 14px; }
.lightbox-nav--next { right: 14px; }
.lightbox-nav[hidden] { display: none; }

/* Trip cover on the trips list */
.trip-map { position: relative; }
.trip-map img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.trip-map:has(img) { padding: 0; }

/* Avatar marker for the first trip photo */
.media-avatar-badge { position: absolute; top: 4px; left: 4px; padding: 2px 7px; border-radius: 6px; background: rgba(30, 95, 75, 0.92); color: #fff; font-size: .65rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }

/* Editable trip title in the editor header */
.route-title-wrap { min-width: 0; flex: 1; }
.route-title { display: block; width: 100%; margin: 5px 0 0; padding: 0; border: 1px solid transparent; border-radius: 6px; background: transparent; color: inherit; font: inherit; font-family: "Arial Narrow", Arial, sans-serif; font-size: 2.4rem; font-weight: 800; text-transform: uppercase; letter-spacing: -.01em; line-height: 1.15; }
.route-title:hover:not(:disabled):not([readonly]) { border-color: #d3ccbd; background: #fffdf8; }
.route-title:focus { outline: none; border-color: #1e5f4b; background: #fffdf8; }
.route-title[readonly] { cursor: default; }

/* Numbered route point markers */
.route-point-marker { position: relative; width: 26px; height: 26px; }
.route-point-marker__pin { position: absolute; inset: 0; transform: rotate(45deg); border-radius: 5px 5px 5px 0; background: #b73f2b; border: 2px solid #fff; box-shadow: 0 1px 6px rgba(0, 0, 0, 0.4); }
.route-point-marker__label { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #fff; font-family: Inter, ui-sans-serif, system-ui, sans-serif; font-size: .74rem; font-weight: 800; }

/* Points of interest: named markers */
.poi-marker { position: relative; }
.poi-marker__label { position: absolute; bottom: calc(100% + 8px); left: 50%; transform: translateX(-50%); max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 3px 9px; border-radius: 999px; background: rgba(21, 26, 19, 0.88); color: #fff; font-family: Inter, ui-sans-serif, system-ui, sans-serif; font-size: .72rem; font-weight: 600; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.35); }

/* Trip card actions: open in read mode or edit */
.trip-card__actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.trip-card__actions .secondary, .trip-card__actions .primary { margin: 0; }

/* Photo reorder controls */
.media-thumb { display: inline-flex; flex-direction: column; align-items: stretch; gap: 2px; }
.media-thumb__controls { display: flex; justify-content: center; gap: 6px; }
.media-thumb__controls button { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 22px; padding: 0; border: 1px solid #cfc7b4; border-radius: 999px; background: #fffdf8; color: #344333; font-size: .74rem; line-height: 1; cursor: pointer; transition: background .15s ease, color .15s ease, border-color .15s ease, transform .15s ease; }
.media-thumb__controls button:hover:not(:disabled) { background: #1e5f4b; border-color: #1e5f4b; color: #fff; transform: translateY(-1px); }
.media-thumb__controls button:disabled { color: #c9c4b8; border-color: #e2ddcf; background: #f1ecdf; cursor: default; }

/* Full-screen read-only presentation */
.route-dialog--readonly { width: 100vw; max-width: 100vw; height: 100vh; max-height: 100vh; border-radius: 0; overflow-y: auto; }
.route-dialog--readonly .route-title-wrap,
.route-dialog--readonly .visibility-select { display: none; }
.route-dialog--readonly .route-editor { min-height: 100%; box-sizing: border-box; }
.route-dialog--readonly .readonly-banner { margin-bottom: 18px; }

.readonly-view { display: grid; grid-template-columns: minmax(0, 2fr) minmax(300px, 1fr); gap: 28px; align-items: start; }
.readonly-view__main { min-width: 0; }
.readonly-view__map { position: sticky; top: 26px; min-height: 0; }
.readonly-view__map .route-map { width: 100%; height: calc(100vh - 52px); min-height: 380px; }
.readonly-hero h1 { margin: 0 0 10px; font-family: "Arial Narrow", Arial, sans-serif; font-size: clamp(2rem, 4.5vw, 3.4rem); line-height: 1.05; text-transform: uppercase; letter-spacing: -.01em; }
.readonly-hero__status { display: inline-block; margin: 0 0 12px; padding: 5px 12px; font-family: Inter, ui-sans-serif, system-ui, sans-serif; font-size: .78rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.readonly-hero__description { margin: 0 0 14px; color: #3b3f36; font-size: 1rem; line-height: 1.6; white-space: pre-wrap; }

/* Masonry mosaic that keeps each photo's aspect ratio without cropping */
.photo-mosaic { columns: 3; column-gap: 8px; margin: 4px 0 8px; }
.photo-mosaic__item { position: relative; margin: 0 0 8px; overflow: hidden; border-radius: 10px; cursor: zoom-in; background: #e8e2d3; break-inside: avoid; }
.photo-mosaic__item img { display: block; width: 100%; height: auto; transition: transform 0.25s ease; }
.photo-mosaic__item:hover img { transform: scale(1.02); }

.readonly-itinerary, .readonly-pois { margin-top: 26px; }
.readonly-itinerary summary, .readonly-pois h3 { margin: 0 0 12px; font-family: "Arial Narrow", Arial, sans-serif; font-size: 1.35rem; text-transform: uppercase; letter-spacing: -.01em; cursor: pointer; list-style: none; }
.readonly-itinerary summary::-webkit-details-marker { display: none; }
.readonly-itinerary summary::before { content: '▸ '; color: #b73f2b; }
.readonly-itinerary[open] summary::before { content: '▾ '; }
.readonly-itinerary ol { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.readonly-point { display: flex; align-items: baseline; gap: 12px; padding: 10px 14px; border: 1px solid #d3ccbd; border-radius: 10px; background: #fffdf8; cursor: pointer; }
.readonly-point:hover { border-color: #b73f2b; background: #fdf6ee; }
.readonly-point__order { flex: 0 0 auto; color: #b73f2b; font-weight: 800; font-size: .8rem; }
.readonly-point strong { color: #20251d; font-size: .95rem; }
.readonly-point__meta { margin-left: auto; color: #8a8578; font-size: .78rem; white-space: nowrap; }

.poi-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 18px; }
.poi-card { display: flex; flex-direction: column; overflow: hidden; border: 1px solid #d3ccbd; border-radius: 14px; background: #fffdf8; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.07); }
.poi-card__photo { height: 168px; background: #e8e2d3; cursor: zoom-in; }
.poi-card__photo img { width: 100%; height: 100%; object-fit: cover; }
.poi-card__photo--empty { display: flex; align-items: center; justify-content: center; font-size: 2.2rem; cursor: default; }
.poi-card__body { display: flex; flex-direction: column; gap: 6px; padding: 13px 15px 15px; }
.poi-card__body h3 { margin: 0; font-size: 1.05rem; color: #20251d; cursor: pointer; }
.poi-card__body h3:hover { color: #b73f2b; }
.poi-card__description { margin: 0; color: #3b3f36; font-size: .88rem; line-height: 1.5; }
.poi-card__coords { margin: 0; color: #8a8578; font-size: .72rem; }

@media (max-width: 820px) {
  .readonly-view { grid-template-columns: 1fr; }
  .readonly-view__map { position: static; height: 46vh; min-height: 300px; order: -1; }
  .readonly-view__map .route-map { height: 100%; min-height: 0; }
  .readonly-point__meta { display: none; }
}

@media (max-width: 820px) {
  .photo-mosaic { columns: 2; }
}

/* Header avatar next to the sign-in button */
.signin-avatar { display: inline-block; width: 28px; height: 28px; border-radius: 50%; object-fit: cover; margin-right: 8px; vertical-align: middle; }

/* Activity feed */
.feed-section { margin: 0 26px 90px; }
.feed-list { display: grid; gap: 10px; }
.feed-item { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border: 1px solid #d3ccbd; border-radius: 12px; background: #fffdf8; }
.feed-item__avatar, .profile-mini__avatar { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; background: #e8e2d3; flex: 0 0 auto; }
.feed-item__avatar--letter, .profile-mini__avatar--letter, .people-card__avatar--letter { display: flex; align-items: center; justify-content: center; background: #dce5d8; color: #1e5f4b; font-weight: 850; font-size: 1.05rem; }
.feed-item__body { min-width: 0; }
.feed-item__text { margin: 0; color: #20251d; font-size: .92rem; line-height: 1.45; }
.feed-item__text button { border: 0; background: transparent; padding: 0; color: #b73f2b; font-weight: 750; cursor: pointer; }
.feed-item__text button:hover { text-decoration: underline; }
.feed-item__time { margin: 2px 0 0; color: #8a8578; font-size: .76rem; }
.feed-item__tag { margin-left: auto; flex: 0 0 auto; padding: 3px 9px; border-radius: 999px; font-size: .68rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.feed-item__tag--new { background: #f3e3cf; color: #9a6627; }
.feed-item__tag--network { background: #e2ecdf; color: #1e5f4b; }

/* People search */
.people-section { margin: 0 26px 90px; }
.people-search { display: flex; gap: 10px; margin-bottom: 18px; }
.people-search input { flex: 1; max-width: 460px; border: 1px solid #9d9a8e; background: #fffdf8; padding: 11px 13px; font: inherit; }
.people-search .primary { margin: 0; padding: 11px 20px; }
.people-results { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.people-card { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border: 1px solid #d3ccbd; border-radius: 14px; background: #fffdf8; }
.people-card__avatar, .profile-mini__avatar { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; background: #e8e2d3; flex: 0 0 auto; }
.people-card__info { min-width: 0; flex: 1; }
.people-card__info button { border: 0; background: transparent; padding: 0; color: #20251d; font-weight: 750; font-size: .98rem; text-align: left; cursor: pointer; }
.people-card__info button:hover { color: #b73f2b; }
.people-card__meta { margin: 2px 0 0; color: #8a8578; font-size: .76rem; }
.people-card .follow-btn, .profile-mini .follow-btn { flex: 0 0 auto; }
.follow-btn { border-radius: 999px; padding: 7px 14px; font-size: .8rem; font-weight: 760; cursor: pointer; transition: transform .15s ease, background .15s ease; }
.follow-btn:hover { transform: translateY(-1px); }
.follow-btn--off { border: 1px solid #b73f2b; background: #b73f2b; color: #fff8f0; }
.follow-btn--on { border: 1px solid #252a20; background: transparent; color: #20251d; }
.people-pager { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 18px; }
.people-pager .secondary { margin: 0; padding: 9px 16px; font-size: .84rem; }

/* Full-screen read-only profile view */
.profile-view-dialog { width: 100vw; max-width: 100vw; height: 100vh; max-height: 100vh; border: 0; padding: 0; background: #f8f3e9; overflow-y: auto; }
.profile-view-dialog::backdrop { background: #10231999; }
.profile-view { max-width: 1080px; margin: 0 auto; padding: 46px 28px 60px; }
.profile-view__hero { display: grid; grid-template-columns: 148px minmax(0, 1fr); gap: 30px; padding-bottom: 30px; border-bottom: 1px solid #c7c0b2; }
.profile-view__avatar-frame { width: 148px; height: 148px; }
.profile-view__avatar { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; border: 4px solid #fff; box-shadow: 0 10px 34px rgba(0, 0, 0, 0.18); background: #e8e2d3; }
.profile-view__avatar-letter { display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; border-radius: 50%; background: linear-gradient(140deg, #3a8f7a, #1e5f4b); color: #f5efe4; font-family: "Arial Narrow", Arial, sans-serif; font-size: 4.2rem; font-weight: 800; box-shadow: 0 10px 34px rgba(0, 0, 0, 0.18); }
.profile-view__identity h2 { margin: 8px 0 6px; font-family: "Arial Narrow", Arial, sans-serif; font-size: clamp(2.4rem, 5vw, 3.8rem); font-weight: 800; letter-spacing: -.03em; line-height: 1; text-transform: uppercase; }
.profile-view__age { margin: 0 0 10px; color: #b73f2b; font-size: 1rem; font-weight: 800; }
.profile-view__bio { margin: 0 0 14px; max-width: 620px; color: #3b3f36; font-size: 1rem; line-height: 1.6; white-space: pre-wrap; }
.profile-view__counts { display: flex; gap: 8px; margin-bottom: 16px; }
.profile-view__counts button { border: 0; background: transparent; padding: 0; color: #42564a; font-size: .92rem; font-weight: 750; cursor: pointer; }
.profile-view__counts button:hover { color: #b73f2b; }
.profile-view__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.profile-view__actions .primary, .profile-view__actions .secondary { margin: 0; padding: 11px 20px; font-size: .9rem; }
.profile-view__actions .icon-button { margin-left: auto; }
.profile-view__lists { padding-top: 24px; }
.profile-view__tabs { display: flex; gap: 4px; margin-bottom: 14px; border-bottom: 1px solid #c7c0b2; }
.profile-view__tabs button { border: 0; background: transparent; color: #6a6d63; padding: 9px 14px; font-size: .86rem; font-weight: 800; letter-spacing: .02em; text-transform: uppercase; cursor: pointer; border-bottom: 3px solid transparent; margin-bottom: -1px; }
.profile-view__tabs button.is-active { color: #b73f2b; border-bottom-color: #b73f2b; }
.profile-view__list { display: grid; gap: 8px; min-height: 60px; }
.profile-mini { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border: 1px solid #d3ccbd; border-radius: 12px; background: #fffdf8; }
.profile-mini__info { min-width: 0; flex: 1; }
.profile-mini__info button { border: 0; background: transparent; padding: 0; color: #20251d; font-weight: 750; font-size: .95rem; text-align: left; cursor: pointer; }
.profile-mini__info button:hover { color: #b73f2b; }
.profile-mini__meta { margin: 2px 0 0; color: #8a8578; font-size: .76rem; }
.profile-view__pager { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 16px; }
.profile-view__pager button { border: 1px solid #cfc7b4; background: #fffdf8; color: #20251d; border-radius: 999px; width: 36px; height: 32px; cursor: pointer; font-size: .95rem; }
.profile-view__pager button:disabled { color: #c9c4b8; cursor: default; }
.profile-view__pager span { color: #8a8578; font-size: .8rem; }

/* Public trip cards on a profile page */
.profile-trip { display: flex; align-items: center; gap: 14px; padding: 10px 14px; border: 1px solid #d3ccbd; border-radius: 12px; background: #fffdf8; cursor: pointer; }
.profile-trip:hover { border-color: #b73f2b; background: #fdf6ee; }
.profile-trip__cover { display: flex; width: 64px; height: 64px; flex: 0 0 auto; align-items: center; justify-content: center; overflow: hidden; border-radius: 10px; background: #e8e2d3; font-size: 1.5rem; }
.profile-trip__cover img { width: 100%; height: 100%; object-fit: cover; }
.profile-trip__info { min-width: 0; }
.profile-trip__info strong { display: block; overflow: hidden; color: #20251d; font-size: .98rem; text-overflow: ellipsis; white-space: nowrap; }
.profile-trip__meta { margin: 2px 0 0; color: #8a8578; font-size: .76rem; }

@media (max-width: 820px) {
  .feed-section, .people-section { margin: 0 16px 70px; }
  .profile-view__hero { grid-template-columns: 92px minmax(0, 1fr); gap: 18px; }
  .profile-view__avatar-frame { width: 92px; height: 92px; }
  .profile-view { padding: 28px 16px 40px; }
  .people-search input { max-width: none; }
}

/* Trip lifecycle status */
.route-dialog--readonly .status-select { display: none; }
.route-dialog--readonly .route-delete { display: none; }
.trip-card__badges { display: flex; flex-wrap: wrap; gap: 6px; }
.badge--status { margin-left: 0; }
.badge--draft { background: #e3ddd0; color: #6a6d63; }
.badge--ready { background: #d9e7d4; color: #1e5f4b; }
.badge--active { background: #f3dfc8; color: #a34a17; }
.badge--completed { background: #dde3ec; color: #3f5a86; }

/* Featured trip on the main page: the active trip or the first in the list */
.featured-trip { position: relative; display: grid; overflow: hidden; margin-bottom: 18px; border: 1px solid #c8c0b3; background: #f8f3e9; }
.featured-trip__cover { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .16; }
.featured-trip__body { position: relative; padding: 34px 40px; }
.featured-trip h3 { margin: 10px 0 8px; font-family: "Arial Narrow", Arial, sans-serif; font-size: clamp(2.2rem, 4.5vw, 3.6rem); font-weight: 800; letter-spacing: -.03em; line-height: .95; text-transform: uppercase; }
.featured-trip__description { max-width: 560px; margin: 0; color: #4c5046; line-height: 1.55; }

/* Reorder controls and status on profile trip rows */
.profile-trip__controls { display: flex; flex-direction: column; gap: 2px; margin-left: auto; flex: 0 0 auto; }
.profile-trip__controls button { border: 1px solid #cfc7b4; background: #fffdf8; color: #344333; border-radius: 6px; padding: 1px 9px; font-size: .72rem; cursor: pointer; line-height: 1.5; }
.profile-trip__controls button:hover:not(:disabled) { background: #1e5f4b; color: #fff; }
.profile-trip__controls button:disabled { color: #c9c4b8; cursor: default; }
.profile-trip__status { margin-top: 5px; }

/* GPX download buttons */
.route-map-actions { display: flex; justify-content: end; margin-top: 10px; }
.route-map-actions .secondary { margin: 0; padding: 9px 16px; font-size: .84rem; }
.readonly-hero__actions { display: flex; margin: 0 0 12px; }
.readonly-hero__actions .secondary { margin: 0; padding: 9px 16px; font-size: .84rem; }

/* POI links editor in the trip editor */
.poi-links { display: grid; gap: 6px; margin-bottom: 8px; }
.poi-link-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr) 30px; gap: 6px; align-items: center; }
.poi-link-row input { width: 100%; border: 1px solid #9d9a8e; background: #fffdf8; padding: 8px 10px; font: inherit; }
.poi-link-remove { height: 30px; border: 1px solid #c98f83; background: transparent; color: #982c20; border-radius: 6px; cursor: pointer; font-size: 1rem; line-height: 1; }
.poi-link-remove:hover { background: #f5e2de; }

/* POI links on read-only cards */
.poi-card__links { display: flex; flex-wrap: wrap; gap: 6px; }
.poi-card__link { display: inline-flex; align-items: center; gap: 6px; padding: 4px 11px; border-radius: 999px; background: #e8f0e4; color: #1e5f4b; font-size: .76rem; font-weight: 700; text-decoration: none; transition: background .15s ease, color .15s ease; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.poi-card__link::before { content: '↗'; font-size: .72rem; }
.poi-card__link:hover { background: #1e5f4b; color: #fff; }

/* Clamped POI description on read-only cards */
.poi-card__description { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.poi-card__description.is-truncated { cursor: pointer; }
.poi-card__description.is-truncated:hover { color: #b73f2b; }

/* Full POI description modal */
.poi-text-dialog { width: min(100% - 32px, 620px); border: 0; border-radius: 0; box-shadow: 0 24px 80px #0005; padding: 30px; background: #f8f3e9; }
.poi-text-dialog::backdrop { background: #10231988; }
.poi-text-dialog__body { display: flex; flex-direction: column; max-height: 80vh; }
.poi-text-dialog__content { margin: 0; overflow-y: auto; color: #20251d; font-size: 1rem; line-height: 1.65; white-space: pre-wrap; }

/* --- Footer --- */
.site-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; max-width: 1320px; margin: 40px auto 0; padding: 22px 26px 30px; border-top: 1px solid #e3ddcf; color: #42564a; font-size: .84rem; }
.site-footer a { color: #284235; text-decoration: none; }
.site-footer a:hover { color: #b73f2b; }

/* --- Cookie banner --- */
.cookie-banner { position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 60; display: flex; align-items: center; gap: 16px; justify-content: space-between; max-width: 720px; margin: 0 auto; padding: 14px 16px; border: 1px solid #9d9a8e; border-radius: 12px; background: #fffdf8; box-shadow: 0 12px 40px #0003; color: #20251d; font-size: .9rem; line-height: 1.4; }
.cookie-banner p { margin: 0; }
.cookie-banner .primary { margin: 0; padding: 9px 18px; flex: 0 0 auto; }

/* --- Consent dialog --- */
.consent-dialog { width: min(100% - 32px, 520px); border: 0; border-radius: 0; box-shadow: 0 24px 80px #0005; padding: 30px; background: #f8f3e9; }
.consent-dialog::backdrop { background: #10231988; }
.consent-dialog__body > p { margin: 0 0 16px; color: #20251d; line-height: 1.6; }
.consent-check { display: flex; align-items: start; gap: 10px; font-weight: 700; color: #284235; cursor: pointer; }
.consent-check input { width: 18px; height: 18px; margin-top: 2px; accent-color: #b73f2b; }

/* --- Admin dialog --- */
.admin-dialog { width: min(96vw, 900px); max-height: 92vh; border: 0; border-radius: 0; box-shadow: 0 24px 80px #0006; padding: 30px; background: #f8f3e9; }
.admin-dialog::backdrop { background: #10231999; }
.admin-panel { display: flex; flex-direction: column; max-height: 86vh; }
.admin-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 18px; border-bottom: 1px solid #e3ddcf; }
.admin-tabs button { border: 0; background: transparent; color: #42564a; cursor: pointer; font: inherit; font-weight: 700; padding: 10px 14px; border-bottom: 2px solid transparent; }
.admin-tabs button.is-active { color: #b73f2b; border-bottom-color: #b73f2b; }
.admin-panel > section { overflow-y: auto; }
.admin-home-fields { display: grid; gap: 12px; }
.admin-home-fields label { display: grid; gap: 5px; color: #284235; font-size: .82rem; font-weight: 800; text-transform: uppercase; letter-spacing: .03em; }
.admin-home-fields input, .admin-home-fields textarea { width: 100%; border: 1px solid #9d9a8e; border-radius: 0; background: #fffdf8; color: #16221d; font: inherit; font-weight: 400; text-transform: none; padding: 9px 11px; }
.admin-home-fields textarea { resize: vertical; }
.admin-status { color: #1e5f4b; font-weight: 700; align-self: center; }
.admin-hint { color: #42564a; font-size: .9rem; }
.admin-user-list, .admin-user-trips { display: grid; gap: 8px; }
.admin-user-row, .admin-trip-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border: 1px solid #e3ddcf; border-radius: 10px; background: #fffdf8; }
.admin-user-main, .admin-trip-main { min-width: 0; }
.admin-user-name { font-weight: 800; color: #161b13; }
.admin-user-meta { color: #42564a; font-size: .82rem; }
.admin-badge { display: inline-block; margin-left: 8px; padding: 2px 8px; border-radius: 999px; background: #f5e2de; color: #982c20; font-size: .72rem; font-weight: 800; }
.admin-badge--ok { background: #e8f0e4; color: #1e5f4b; }
.admin-user-actions, .admin-trip-actions { display: flex; flex-wrap: wrap; gap: 6px; justify-content: end; }
.admin-user-actions .secondary, .admin-trip-actions .secondary, .admin-trip-actions .primary { margin: 0; padding: 8px 13px; font-size: .8rem; }
.admin-user-head { margin-bottom: 12px; font-size: .95rem; }
.admin-user-head strong { color: #161b13; }
.admin-empty { color: #42564a; padding: 12px 0; }
.admin-trip-title { font-weight: 800; color: #161b13; }
.admin-trip-meta { color: #42564a; font-size: .82rem; }

/* Sign-out button in the header — deliberately small and unobtrusive */
.signout { margin: 0; padding: 6px 10px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: #8a9a90; cursor: pointer; font: inherit; font-size: .78rem; font-weight: 600; line-height: 1; transition: color .15s ease, border-color .15s ease; }
.signout:hover { color: #42564a; border-color: #e3ddcf; }

/* Admin home hero image */
.admin-home-image { margin-bottom: 22px; padding: 14px; border: 1px solid #e3ddcf; border-radius: 12px; background: #fffdf8; }
.admin-home-image__title { margin-bottom: 10px; font-weight: 800; color: #161b13; }
.admin-home-image__preview { display: block; width: 100%; max-height: 240px; object-fit: cover; border-radius: 8px; margin-bottom: 10px; background: #efe9db; }
.admin-home-image__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.admin-home-image__actions .media-add { margin: 0; }
.admin-home-image__actions .secondary { margin: 0; padding: 9px 14px; font-size: .82rem; }