/* Copyright (c) 2026 RHM Tech / Ralf Meyer. All rights reserved.
   The Helpful Travelers proprietary stylesheet. */
:root {
  color-scheme: light dark;
  --bg: #f5f7fb;
  --surface: #ffffff;
  --surface-soft: #eef4ff;
  --text: #162032;
  --muted: #5b667a;
  --border: #dbe4f0;
  --accent: #176b87;
  --accent-contrast: #ffffff;
  --accent-strong: #0f4c5c;
  --shadow: 0 18px 40px rgba(22, 32, 50, 0.12);
  /* Shared page shell — matches the dashboard welcome hero width. */
  --shell-max: 1180px;
}

/* Classic dark tokens — only the Classic theme, and only when not forced light.
   Named palettes set their own vars; this must not outrank html[data-theme="…"]. */
@media (prefers-color-scheme: dark) {
  html[data-theme="classic"]:not([data-color-scheme="light"]) {
    --bg: #0d1420;
    --surface: #121c2b;
    --surface-soft: #17263a;
    --text: #f4f7fb;
    --muted: #a9b5c7;
    --border: #26384f;
    --accent: #64c8e8;
    --accent-strong: #9be3f6;
    --accent-contrast: #07131b;
    --shadow: 0 18px 40px rgba(0, 0, 0, 0.3);
  }
}
html[data-theme="classic"][data-color-scheme="dark"] {
  color-scheme: dark;
  --bg: #0d1420;
  --surface: #121c2b;
  --surface-soft: #17263a;
  --text: #f4f7fb;
  --muted: #a9b5c7;
  --border: #26384f;
  --accent: #64c8e8;
  --accent-strong: #9be3f6;
  --accent-contrast: #07131b;
  --shadow: 0 18px 40px rgba(0, 0, 0, 0.3);
}
html[data-theme="classic"][data-color-scheme="light"] {
  color-scheme: light;
  --bg: #f5f7fb;
  --surface: #ffffff;
  --surface-soft: #eef4ff;
  --text: #162032;
  --muted: #5b667a;
  --border: #dbe4f0;
  --accent: #176b87;
  --accent-contrast: #ffffff;
  --accent-strong: #0f4c5c;
  --shadow: 0 18px 40px rgba(22, 32, 50, 0.12);
}
html[data-theme="butter_iris"] { color-scheme: light; --bg:#fff275; --surface:#fffbd0; --surface-soft:#f6e96b; --text:#24104f; --muted:#5e4b73; --border:#d8c950; --accent:#3a0ca3; --accent-strong:#290774; --accent-contrast:#ffffff; --shadow:0 18px 40px rgba(58,12,163,.18); }
html[data-theme="emerald_champagne"] { color-scheme: light; --bg:#f8e7c9; --surface:#fff8ea; --surface-soft:#efdab5; --text:#064e3b; --muted:#466b60; --border:#d8c29d; --accent:#064e3b; --accent-strong:#03392b; --accent-contrast:#f8e7c9; --shadow:0 18px 40px rgba(6,78,59,.16); }
html[data-theme="lime_graphite"] { color-scheme: dark; --bg:#23262f; --surface:#2d313b; --surface-soft:#373c47; --text:#f5ffe6; --muted:#bdc6ae; --border:#4a505c; --accent:#b6ff2e; --accent-strong:#d1ff79; --accent-contrast:#182000; --shadow:0 18px 40px rgba(0,0,0,.32); }
html[data-theme="dragonfruit_violet"] { color-scheme: dark; --bg:#1e1033; --surface:#291641; --surface-soft:#382054; --text:#fff3f8; --muted:#d6b8ca; --border:#53316e; --accent:#ff4696; --accent-strong:#ff82b8; --accent-contrast:#28102c; --shadow:0 18px 40px rgba(10,2,20,.38); }
html[data-theme="ultraviolet_apricot"] { color-scheme: light; --bg:#ffd6a5; --surface:#fff0dc; --surface-soft:#f4c58f; --text:#351064; --muted:#74537d; --border:#dfa96c; --accent:#6a00f4; --accent-strong:#4d00b5; --accent-contrast:#fff3e5; --shadow:0 18px 40px rgba(106,0,244,.17); }
html[data-theme="signal_porcelain"] { color-scheme: light; --bg:#f8f7f4; --surface:#ffffff; --surface-soft:#e9efff; --text:#10275a; --muted:#586684; --border:#d5dbea; --accent:#0057ff; --accent-strong:#0041bf; --accent-contrast:#ffffff; --shadow:0 18px 40px rgba(0,87,255,.14); }
html[data-theme="heather_dusk"] {
  color-scheme: dark;
  --bg: #2e2e41;
  --surface: #383850;
  --surface-soft: #454560;
  --text: #f3f1ec;
  --muted: #b8b4c6;
  --border: #5a5a72;
  --accent: #749680;
  --accent-strong: #96a878;
  --accent-contrast: #1c1c2a;
  --shadow: 0 18px 40px rgba(12, 12, 22, .42);
  --heather: #737496;
  --dusty-rose: #967574;
  --olive-mist: #969074;
}
html[data-theme="heather_dusk"] body {
  background:
    radial-gradient(circle at top left, color-mix(in srgb, var(--heather) 34%, transparent), transparent 26rem),
    radial-gradient(circle at 88% 12%, color-mix(in srgb, var(--dusty-rose) 22%, transparent), transparent 20rem),
    radial-gradient(circle at 70% 90%, color-mix(in srgb, var(--olive-mist) 16%, transparent), transparent 22rem),
    var(--bg);
}
html[data-theme="heather_dusk"] .panel,
html[data-theme="heather_dusk"] .directory-card,
html[data-theme="heather_dusk"] .place-detail {
  border-color: color-mix(in srgb, var(--heather) 42%, var(--border));
}
html[data-theme="heather_dusk"] .eyebrow {
  color: color-mix(in srgb, var(--accent) 72%, var(--olive-mist));
}
html[data-theme="fern_harbor"] {
  color-scheme: dark;
  --bg: #0e3261;
  --surface: #143a6b;
  --surface-soft: #1a4478;
  --text: #f2f7ef;
  --muted: #a8bdd4;
  --border: #2a4d7a;
  --accent: #61b656;
  --accent-strong: #7bc86f;
  --accent-contrast: #0a1f3a;
  --shadow: 0 18px 40px rgba(6, 18, 40, .45);
  --fern: #61b656;
  --forest: #18620e;
  --umber: #61440e;
  --burgundy: #610e45;
  --harbor: #0e3261;
}
html[data-theme="fern_harbor"] body {
  background:
    radial-gradient(circle at top left, color-mix(in srgb, var(--fern) 28%, transparent), transparent 26rem),
    radial-gradient(circle at 88% 12%, color-mix(in srgb, var(--burgundy) 24%, transparent), transparent 20rem),
    radial-gradient(circle at 70% 90%, color-mix(in srgb, var(--umber) 18%, transparent), transparent 22rem),
    var(--bg);
}
html[data-theme="fern_harbor"] .panel,
html[data-theme="fern_harbor"] .directory-card,
html[data-theme="fern_harbor"] .place-detail {
  border-color: color-mix(in srgb, var(--fern) 36%, var(--border));
}
html[data-theme="fern_harbor"] .eyebrow {
  color: color-mix(in srgb, var(--accent) 70%, var(--fern));
}
html[data-theme="lilac_foam"] {
  color-scheme: light;
  --bg: #efe8f6;
  --surface: #fffcfe;
  --surface-soft: #e5f5f2;
  --text: #716086;
  --muted: #8a7a99;
  --border: #d5c6e4;
  --accent: #716086;
  --accent-strong: #5a4a6c;
  --accent-contrast: #fffcfe;
  --shadow: 0 18px 40px rgba(113, 96, 134, .16);
  --lilac: #bca4db;
  --seafoam: #a4dbd2;
  --butter: #dbdaa4;
  --peach: #dbb4a4;
  --plum: #716086;
}
html[data-theme="lilac_foam"] body {
  background:
    radial-gradient(circle at top left, color-mix(in srgb, var(--lilac) 42%, transparent), transparent 26rem),
    radial-gradient(circle at 88% 12%, color-mix(in srgb, var(--seafoam) 36%, transparent), transparent 20rem),
    radial-gradient(circle at 72% 88%, color-mix(in srgb, var(--peach) 28%, transparent), transparent 22rem),
    radial-gradient(circle at 30% 78%, color-mix(in srgb, var(--butter) 22%, transparent), transparent 18rem),
    var(--bg);
}
html[data-theme="lilac_foam"] .panel,
html[data-theme="lilac_foam"] .directory-card,
html[data-theme="lilac_foam"] .place-detail {
  border-color: color-mix(in srgb, var(--lilac) 48%, var(--border));
}
html[data-theme="lilac_foam"] .eyebrow {
  color: color-mix(in srgb, var(--plum) 70%, var(--lilac));
}
html[data-theme="rose_sky"] {
  color-scheme: light;
  --bg: #f7eef3;
  --surface: #fffcfd;
  --surface-soft: #e8eef9;
  --text: #8b7d83;
  --muted: #9a8e94;
  --border: #e0cfd6;
  --accent: #8b7d83;
  --accent-strong: #6f6368;
  --accent-contrast: #fffcfd;
  --shadow: 0 18px 40px rgba(139, 125, 131, .15);
  --rose: #e080aa;
  --sky: #809ee0;
  --leaf: #80e084;
  --gold: #e0c380;
  --stone: #8b7d83;
}
html[data-theme="rose_sky"] body {
  background:
    radial-gradient(circle at top left, color-mix(in srgb, var(--rose) 38%, transparent), transparent 26rem),
    radial-gradient(circle at 88% 12%, color-mix(in srgb, var(--sky) 34%, transparent), transparent 20rem),
    radial-gradient(circle at 72% 88%, color-mix(in srgb, var(--gold) 26%, transparent), transparent 22rem),
    radial-gradient(circle at 28% 78%, color-mix(in srgb, var(--leaf) 20%, transparent), transparent 18rem),
    var(--bg);
}
html[data-theme="rose_sky"] .panel,
html[data-theme="rose_sky"] .directory-card,
html[data-theme="rose_sky"] .place-detail {
  border-color: color-mix(in srgb, var(--rose) 40%, var(--border));
}
html[data-theme="rose_sky"] .eyebrow {
  color: color-mix(in srgb, var(--stone) 65%, var(--rose));
}
html[data-theme="terra_coral"] {
  color-scheme: light;
  --bg: #f6f1ec;
  --surface: #fffcfa;
  --surface-soft: #fde8df;
  --text: #1c1412;
  --muted: #6e5a52;
  --border: #e7d2c8;
  --accent: #e35336;
  --accent-strong: #c9442a;
  --accent-contrast: #fffcfa;
  --shadow: 0 18px 40px rgba(227, 83, 54, .16);
  --terracotta: #e35336;
  --pumpkin: #ff7518;
  --coral: #ff8559;
  --clay: #8a4f3a;
  --porcelain: #fffcfa;
}
html[data-theme="terra_coral"] body {
  background:
    radial-gradient(circle at top left, color-mix(in srgb, var(--terracotta) 26%, transparent), transparent 26rem),
    radial-gradient(circle at 88% 12%, color-mix(in srgb, var(--coral) 34%, transparent), transparent 20rem),
    radial-gradient(circle at 72% 88%, color-mix(in srgb, var(--pumpkin) 22%, transparent), transparent 22rem),
    radial-gradient(circle at 28% 78%, color-mix(in srgb, var(--clay) 12%, transparent), transparent 18rem),
    var(--bg);
}
html[data-theme="terra_coral"] .panel,
html[data-theme="terra_coral"] .directory-card,
html[data-theme="terra_coral"] .place-detail {
  border-color: color-mix(in srgb, var(--terracotta) 34%, var(--border));
}
html[data-theme="terra_coral"] .eyebrow {
  color: color-mix(in srgb, var(--terracotta) 72%, var(--clay));
}
html[data-theme="terra_coral"] .button:not(.secondary):not(.danger) {
  background: linear-gradient(135deg, var(--terracotta), color-mix(in srgb, var(--pumpkin) 55%, var(--terracotta)));
  border-color: color-mix(in srgb, var(--terracotta) 70%, var(--pumpkin));
  color: var(--accent-contrast);
}
html[data-theme="scarlet_night"] {
  color-scheme: dark;
  --bg: #12090a;
  --surface: #1c1012;
  --surface-soft: #2a1518;
  --text: #f8efef;
  --muted: #c4a8ab;
  --border: #4a252a;
  --accent: #d20a2e;
  --accent-strong: #ed2100;
  --accent-contrast: #fff7f6;
  --shadow: 0 18px 40px rgba(0, 0, 0, .48);
  --scarlet: #ed2100;
  --cherry: #d20a2e;
  --crimson: #b22222;
  --armor: #1a1214;
  --ember: #7a1518;
}
html[data-theme="scarlet_night"] body {
  background:
    radial-gradient(circle at top left, color-mix(in srgb, var(--cherry) 28%, transparent), transparent 26rem),
    radial-gradient(circle at 88% 12%, color-mix(in srgb, var(--scarlet) 22%, transparent), transparent 20rem),
    radial-gradient(circle at 72% 88%, color-mix(in srgb, var(--crimson) 24%, transparent), transparent 22rem),
    radial-gradient(circle at 28% 78%, color-mix(in srgb, var(--ember) 18%, transparent), transparent 18rem),
    var(--bg);
}
html[data-theme="scarlet_night"] .panel,
html[data-theme="scarlet_night"] .directory-card,
html[data-theme="scarlet_night"] .place-detail {
  border-color: color-mix(in srgb, var(--cherry) 42%, var(--border));
}
html[data-theme="scarlet_night"] .eyebrow {
  color: color-mix(in srgb, var(--scarlet) 68%, var(--cherry));
}
html[data-theme="scarlet_night"] .button:not(.secondary):not(.danger) {
  background: linear-gradient(135deg, var(--cherry), color-mix(in srgb, var(--scarlet) 55%, var(--crimson)));
  border-color: color-mix(in srgb, var(--cherry) 70%, var(--scarlet));
  color: var(--accent-contrast);
}
html[data-theme="hunter_moss"] {
  color-scheme: dark;
  --bg: #0f1410;
  --surface: #171e18;
  --surface-soft: #222b22;
  --text: #eef3e6;
  --muted: #aeb9a0;
  --border: #354033;
  --accent: #7e8c54;
  --accent-strong: #9aab68;
  --accent-contrast: #10150f;
  --shadow: 0 18px 40px rgba(0, 0, 0, .46);
  --olive: #636b2f;
  --hunter: #2c5f34;
  --moss: #7e8c54;
  --canopy: #1a2a1c;
  --leaf: #4a6b3a;
}
html[data-theme="hunter_moss"] body {
  background:
    radial-gradient(circle at top left, color-mix(in srgb, var(--moss) 26%, transparent), transparent 26rem),
    radial-gradient(circle at 88% 12%, color-mix(in srgb, var(--hunter) 30%, transparent), transparent 20rem),
    radial-gradient(circle at 72% 88%, color-mix(in srgb, var(--olive) 24%, transparent), transparent 22rem),
    radial-gradient(circle at 28% 78%, color-mix(in srgb, var(--leaf) 16%, transparent), transparent 18rem),
    var(--bg);
}
html[data-theme="hunter_moss"] .panel,
html[data-theme="hunter_moss"] .directory-card,
html[data-theme="hunter_moss"] .place-detail {
  border-color: color-mix(in srgb, var(--moss) 40%, var(--border));
}
html[data-theme="hunter_moss"] .eyebrow {
  color: color-mix(in srgb, var(--moss) 72%, var(--olive));
}
html[data-theme="hunter_moss"] .button:not(.secondary):not(.danger) {
  background: linear-gradient(135deg, var(--hunter), color-mix(in srgb, var(--moss) 55%, var(--olive)));
  border-color: color-mix(in srgb, var(--hunter) 65%, var(--moss));
  color: var(--accent-contrast);
}
html[data-theme="azure_cobalt"] {
  color-scheme: light;
  --bg: #eef3f8;
  --surface: #fbfcfe;
  --surface-soft: #dde8f4;
  --text: #0f1c2e;
  --muted: #557c99;
  --border: #c5d4e4;
  --accent: #0047ab;
  --accent-strong: #003687;
  --accent-contrast: #fbfcfe;
  --shadow: 0 18px 40px rgba(0, 71, 171, .15);
  --azure: #007fff;
  --cobalt: #0047ab;
  --slate: #557c99;
  --frost: #e8f1fb;
  --ink: #0f1c2e;
}
html[data-theme="azure_cobalt"] body {
  background:
    radial-gradient(circle at top left, color-mix(in srgb, var(--azure) 22%, transparent), transparent 26rem),
    radial-gradient(circle at 88% 12%, color-mix(in srgb, var(--cobalt) 20%, transparent), transparent 20rem),
    radial-gradient(circle at 72% 88%, color-mix(in srgb, var(--slate) 28%, transparent), transparent 22rem),
    radial-gradient(circle at 28% 78%, color-mix(in srgb, var(--frost) 55%, transparent), transparent 18rem),
    var(--bg);
}
html[data-theme="azure_cobalt"] .panel,
html[data-theme="azure_cobalt"] .directory-card,
html[data-theme="azure_cobalt"] .place-detail {
  border-color: color-mix(in srgb, var(--cobalt) 32%, var(--border));
}
html[data-theme="azure_cobalt"] .eyebrow {
  color: color-mix(in srgb, var(--cobalt) 70%, var(--azure));
}
html[data-theme="azure_cobalt"] .button:not(.secondary):not(.danger) {
  background: linear-gradient(135deg, var(--cobalt), color-mix(in srgb, var(--azure) 55%, var(--cobalt)));
  border-color: color-mix(in srgb, var(--cobalt) 65%, var(--azure));
  color: var(--accent-contrast);
}
html[data-theme="indigo_violet"] {
  color-scheme: light;
  --bg: #f3eef9;
  --surface: #fcfafd;
  --surface-soft: #e8ddf5;
  --text: #2a1240;
  --muted: #7a5f96;
  --border: #d4c2e8;
  --accent: #560591;
  --accent-strong: #420470;
  --accent-contrast: #fcfafd;
  --shadow: 0 18px 40px rgba(86, 5, 145, .16);
  --indigo: #560591;
  --violet: #7f00ff;
  --amethyst: #9966cc;
  --lilac: #ebe0f7;
  --plum: #2a1240;
}
html[data-theme="indigo_violet"] body {
  background:
    radial-gradient(circle at top left, color-mix(in srgb, var(--violet) 20%, transparent), transparent 26rem),
    radial-gradient(circle at 88% 12%, color-mix(in srgb, var(--amethyst) 32%, transparent), transparent 20rem),
    radial-gradient(circle at 72% 88%, color-mix(in srgb, var(--indigo) 18%, transparent), transparent 22rem),
    radial-gradient(circle at 28% 78%, color-mix(in srgb, var(--lilac) 60%, transparent), transparent 18rem),
    var(--bg);
}
html[data-theme="indigo_violet"] .panel,
html[data-theme="indigo_violet"] .directory-card,
html[data-theme="indigo_violet"] .place-detail {
  border-color: color-mix(in srgb, var(--amethyst) 42%, var(--border));
}
html[data-theme="indigo_violet"] .eyebrow {
  color: color-mix(in srgb, var(--indigo) 65%, var(--violet));
}
html[data-theme="indigo_violet"] .button:not(.secondary):not(.danger) {
  background: linear-gradient(135deg, var(--indigo), color-mix(in srgb, var(--violet) 55%, var(--amethyst)));
  border-color: color-mix(in srgb, var(--indigo) 60%, var(--violet));
  color: var(--accent-contrast);
}
html[data-theme="plum_mist"],
html[data-theme="plum_mist_motion"] {
  color-scheme: light;
  --bg: #f4f2f7;
  --surface: #ffffff;
  --surface-soft: #efe8f6;
  --text: #3b1f4a;
  --muted: #6d6478;
  --border: #e4dcea;
  --accent: #5c2d7a;
  --accent-strong: #441f5c;
  --accent-soft: #7c4d9a;
  --accent-contrast: #ffffff;
  --callout: #fff6df;
  --callout-border: #e8d7a8;
  --lavender: #ebe3f4;
  /* Atmospheric page/section wash — shared by both Plum Mist themes */
  --mist-photo: url("/assets/images/heroes/atmosphere.jpg");
  --hero-photo-overview: url("/assets/images/heroes/overview.jpg");
  --hero-photo-auth: url("/assets/images/heroes/auth.jpg");
  --hero-photo-locations: url("/assets/images/heroes/locations.jpg");
  --hero-photo-places: url("/assets/images/heroes/places.jpg");
  --hero-photo-experiences: url("/assets/images/heroes/experiences.jpg");
  --hero-photo-groups: url("/assets/images/heroes/groups.jpg");
  --hero-photo-airlines: url("/assets/images/heroes/airlines.jpg");
  --mist-wash: #efe8f6;
  /* Soft champagne / brass — complementary to plum/lavender mist; cleaner than amber */
  --advert-badge-ink: #7a6438;
  --advert-badge-line: #c4ae7a;
  --advert-badge-wash: #dfcfa0;
  --shadow: 0 18px 42px rgba(68, 31, 92, 0.12);
}
/* Plum Mist light/dark — fixed themes (e.g. Lime Spark / “Neon”) do not use this. */
@media (prefers-color-scheme: dark) {
  html[data-theme="plum_mist"]:not([data-color-scheme="light"]),
  html[data-theme="plum_mist_motion"]:not([data-color-scheme="light"]) {
    color-scheme: dark;
    --bg: #1a1220;
    --surface: #24182c;
    --surface-soft: #2e2138;
    --text: #f4eef8;
    --muted: #b5a8c0;
    --border: #3d3048;
    --accent: #c4a0e0;
    --accent-strong: #ddc2f0;
    --accent-soft: #a87cc8;
    --accent-contrast: #1a1220;
    --callout: #3a2f1c;
    --callout-border: #6a5a38;
    --lavender: #3a2a48;
    --mist-wash: #2a1f33;
    --advert-badge-ink: #e8d4a4;
    --advert-badge-line: #a89058;
    --advert-badge-wash: #4a3c22;
    --shadow: 0 18px 42px rgba(0, 0, 0, 0.42);
  }
}
html[data-theme="plum_mist"][data-color-scheme="dark"],
html[data-theme="plum_mist_motion"][data-color-scheme="dark"] {
  color-scheme: dark;
  --bg: #1a1220;
  --surface: #24182c;
  --surface-soft: #2e2138;
  --text: #f4eef8;
  --muted: #b5a8c0;
  --border: #3d3048;
  --accent: #c4a0e0;
  --accent-strong: #ddc2f0;
  --accent-soft: #a87cc8;
  --accent-contrast: #1a1220;
  --callout: #3a2f1c;
  --callout-border: #6a5a38;
  --lavender: #3a2a48;
  --mist-wash: #2a1f33;
  --advert-badge-ink: #e8d4a4;
  --advert-badge-line: #a89058;
  --advert-badge-wash: #4a3c22;
  --shadow: 0 18px 42px rgba(0, 0, 0, 0.42);
}

html[data-theme="classic"] { }


* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Inter, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Noto Sans Cyrillic", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;

  background: radial-gradient(circle at top left, var(--surface-soft), transparent 28rem), var(--bg);
  color: var(--text);
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.theme-palette-preview { display:flex; align-items:center; gap:.75rem; min-height:3.25rem; padding:.7rem .85rem; border:1px solid var(--border); border-radius:1rem; background:var(--surface-soft); }
.theme-palette-preview:empty { display:none; }
.theme-palette-swatches { display:inline-flex; overflow:hidden; flex:0 0 auto; width:4.5rem; height:2rem; border:1px solid color-mix(in srgb, var(--text) 18%, transparent); border-radius:999px; }
.theme-palette-swatches span { flex:1; }
.theme-palette-preview strong { display:block; }
.theme-palette-preview small { color:var(--muted); }


a { color: inherit; }
.site-header {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.35rem;
  padding: 0.85rem clamp(1rem, 4vw, 3rem) 0.7rem;
  border-bottom: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 88%, transparent);
  position: sticky;
  top: 0;
  backdrop-filter: blur(12px);
  z-index: 10;
  overflow: visible;
}
.early-access-bar {
  margin: -0.85rem clamp(-1rem, -4vw, -3rem) 0.15rem;
  padding: 0.32rem clamp(1rem, 4vw, 3rem);
  border-bottom: 1px solid color-mix(in srgb, var(--accent) 18%, var(--border));
  background:
    linear-gradient(
      90deg,
      color-mix(in srgb, var(--surface-soft) 88%, transparent),
      color-mix(in srgb, var(--lavender, var(--surface-soft)) 55%, var(--surface))
    );
  color: var(--text);
}
.early-access-bar-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: center;
  text-align: center;
  gap: 0.35rem 0.75rem;
  margin: 0;
  width: min(100%, var(--shell-max, 72rem));
  margin-inline: auto;
  font-size: 0.82rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.early-access-bar-label {
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--accent-strong);
}
.early-access-bar-note {
  color: var(--muted);
  font-weight: 600;
}
@media (max-width: 520px) {
  .early-access-bar-note {
    flex: 1 1 100%;
    font-size: 0.78rem;
    text-align: center;
  }
}
@media (max-width: 760px) {
  .early-access-bar {
    margin: -0.75rem calc(-1 * max(0.85rem, env(safe-area-inset-left))) 0.2rem calc(-1 * max(0.85rem, env(safe-area-inset-right)));
    padding-left: max(0.85rem, env(safe-area-inset-left));
    padding-right: max(0.85rem, env(safe-area-inset-right));
  }
}
@media (max-width: 400px) {
  .early-access-bar {
    margin-top: -0.7rem;
  }
}
html[data-theme="plum_mist_motion"] .early-access-bar {
  animation: early-access-bar-in 0.55s ease-out both;
}
@keyframes early-access-bar-in {
  from { opacity: 0; transform: translateY(-0.25rem); }
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  html[data-theme="plum_mist_motion"] .early-access-bar {
    animation: none;
  }
}
.header-top-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  width: 100%;
}
.brand { display: flex; align-items: center; gap: 0.9rem; }
.logo-mark {
  width: 3rem;
  height: 3rem;
  border-radius: 1rem;
  display: grid;
  place-items: center;
  background: var(--accent);
  color: var(--accent-contrast, white);
  font-weight: 800;
  letter-spacing: 0.04em;
  box-shadow: var(--shadow);
}
.brand h1 { font-size: clamp(1.1rem, 2vw, 1.35rem); margin: 0; }
.brand p { margin: 0; color: var(--muted); font-size: 0.9rem; }
nav { display: flex; gap: 0.8rem; flex-wrap: wrap; }
nav a { text-decoration: none; color: var(--muted); font-weight: 650; }
nav a:hover { color: var(--accent); }
main {
  width: min(var(--shell-max), calc(100% - 2rem));
  max-width: 100%;
  min-width: 0;
  margin: 0 auto;
  box-sizing: border-box;
}
.hero {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(280px, 0.6fr);
  gap: 1.5rem;
  padding: clamp(2rem, 7vw, 5rem) 0 2rem;
}
.eyebrow { color: var(--accent); text-transform: uppercase; letter-spacing: 0.12em; font-weight: 800; font-size: 0.78rem; margin: 0 0 0.6rem; }
h2 { font-size: clamp(2rem, 6vw, 4.2rem); line-height: 1; margin: 0 0 1rem; }
.hero-copy { color: var(--muted); font-size: clamp(1rem, 2vw, 1.2rem); max-width: 62ch; }
.actions { display: flex; gap: 0.8rem; flex-wrap: wrap; margin-top: 1.4rem; }
.button {
  border: 0;
  border-radius: 999px;
  background: var(--accent);
  color: var(--accent-contrast, white);
  padding: 0.8rem 1.1rem;
  text-decoration: none;
  font-weight: 800;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.button.secondary { background: var(--surface); color: var(--text); border: 1px solid var(--border); }
.status-card, .card, .panel {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 1.5rem;
  box-shadow: var(--shadow);
}
.status-card { padding: 1.25rem; align-self: start; }
.status-card h3, .card h3 { margin-top: 0; }
dl { display: grid; grid-template-columns: 1fr; gap: 0.25rem; }
dt { color: var(--muted); font-size: 0.82rem; font-weight: 700; }
dd { margin: 0 0 0.8rem; word-break: break-word; }
.grid-section { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin: 1rem 0 2rem; }
.card { padding: 1.2rem; }
.card p { color: var(--muted); }
.panel { padding: clamp(1rem, 3vw, 1.6rem); margin-bottom: 2rem; }
.panel-header { display: flex; align-items: start; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.panel-header h2 { font-size: clamp(1.5rem, 4vw, 2.2rem); }
.badge { background: var(--surface-soft); border: 1px solid var(--border); border-radius: 999px; padding: 0.35rem 0.7rem; color: var(--muted); font-weight: 800; font-size: 0.8rem; }
.badge.warning { color: #f8d678; border-color: rgba(248, 214, 120, 0.45); background: rgba(248, 214, 120, 0.08); }
.badge.danger { color: #ff9a9a; border-color: rgba(255, 154, 154, 0.45); background: rgba(255, 154, 154, 0.08); }
.place-type-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.15rem;
  height: 2.15rem;
  padding: 0;
  border-radius: 999px;
  border: 0;
  background: transparent;
  color: var(--text);
  box-shadow: none;
}
.place-type-badge .place-type-icon-img {
  display: block;
  width: 1.85rem;
  height: 1.85rem;
  object-fit: contain;
}
.admin-osm-provenance {
  margin: 1.15rem 0;
  padding: 0;
  border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--border));
  border-radius: 1.05rem;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--accent) 8%, transparent), transparent 4.5rem),
    color-mix(in srgb, var(--surface) 88%, transparent);
  overflow: hidden;
}
.admin-osm-provenance summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 0.55rem;
  flex-wrap: wrap;
  padding: 0.85rem 1rem;
  font-weight: 750;
  color: var(--text);
}
.admin-osm-provenance summary::-webkit-details-marker { display: none; }
.admin-osm-provenance summary::after {
  content: '';
  width: 0.45rem;
  height: 0.45rem;
  margin-left: auto;
  border-right: 2px solid var(--muted);
  border-bottom: 2px solid var(--muted);
  transform: rotate(45deg);
  transition: transform 0.15s ease;
}
.admin-osm-provenance[open] summary::after {
  transform: rotate(-135deg);
  margin-top: 0.2rem;
}
.admin-osm-provenance-kicker {
  display: inline-flex;
  align-items: center;
  padding: 0.18rem 0.5rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--accent-strong);
  background: color-mix(in srgb, var(--accent) 16%, transparent);
}
.admin-osm-provenance-note,
.admin-osm-provenance .admin-osm-meta,
.admin-osm-provenance .osm-tag-cloud {
  margin: 0;
  padding: 0 1rem 1rem;
}
.admin-osm-provenance .admin-osm-meta {
  gap: 0.55rem 1rem;
}
.admin-osm-provenance .admin-osm-meta dd {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
}
.admin-osm-provenance code {
  font-size: 0.82em;
  font-weight: 600;
}
.osm-source-link {
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--accent);
  text-decoration: none;
}
.osm-source-link:hover { text-decoration: underline; }
.osm-tag-cloud-label {
  margin: 0 0 0.45rem;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 750;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.osm-tag-cloud-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}
.osm-tag-chip {
  display: inline-flex;
  max-width: 100%;
  padding: 0.28rem 0.55rem;
  border: 1px solid var(--border);
  border-radius: 0.55rem;
  background: color-mix(in srgb, var(--bg) 70%, transparent);
  line-height: 1.3;
}
.osm-tag-chip.is-accent {
  border-color: color-mix(in srgb, var(--accent) 35%, var(--border));
  background: color-mix(in srgb, var(--accent) 12%, transparent);
}
.osm-tag-chip code {
  overflow-wrap: anywhere;
}
form { display: grid; gap: 1rem; }
label { display: grid; gap: 0.35rem; font-weight: 800; }
label.checkbox-row {
  display: flex;
  align-items: center;
  gap: 0.55rem;
}
label.checkbox-row input[type="checkbox"] {
  width: auto;
}
input {
  width: 100%;
  border: 1px solid var(--border);
  border-radius: 0.9rem;
  padding: 0.8rem 0.9rem;
  background: var(--bg);
  color: var(--text);
  font: inherit;
}
.note, .form-message { color: var(--muted); margin: 0; }
.support-success {
  display: grid;
  gap: 1.75rem;
}
.status-message { border: 1px solid var(--border); border-radius: 0.9rem; padding: 0.75rem 0.9rem; margin: 0.75rem 0; background: rgba(255,255,255,0.04); }
.status-message.danger { color: #ffd4d4; border-color: rgba(255, 154, 154, 0.45); background: rgba(255, 100, 100, 0.08); }
footer { text-align: center; color: var(--muted); padding: 2rem 1rem; }
@media (max-width: 820px) {
  .hero, .grid-section { grid-template-columns: 1fr; }
}
@media (max-width: 820px) and (min-width: 761px) {
  .site-header { align-items: flex-start; flex-direction: column; }
}
.auth-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.auth-box {
  border: 1px solid var(--border);
  border-radius: 1.2rem;
  background: color-mix(in srgb, var(--surface-soft) 42%, transparent);
  padding: 1rem;
}
.auth-box h3 { margin-top: 0; }
.password-field { display: grid; gap: 0.35rem; }
.password-input-wrap {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.45rem;
  align-items: center;
}
.password-input-wrap input { min-width: 0; }
.password-toggle {
  border: 1px solid var(--border);
  border-radius: 0.75rem;
  background: var(--surface-soft);
  color: var(--muted);
  width: 2.55rem;
  height: 2.55rem;
  padding: 0;
  display: inline-grid;
  place-items: center;
  cursor: pointer;
  flex: 0 0 auto;
}
.password-toggle:hover {
  background: color-mix(in srgb, var(--surface-soft) 70%, var(--accent) 30%);
  color: var(--text);
}
.password-toggle:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--accent) 55%, transparent);
  outline-offset: 2px;
}
.password-eye {
  display: none;
  width: 1.2rem;
  height: 1.2rem;
}
.password-toggle:not(.is-visible) .password-eye-open,
.password-toggle.is-visible .password-eye-closed {
  display: block;
}
.guest-auth-form-compact .password-toggle {
  width: 2.2rem;
  height: 2.2rem;
  border-radius: 0.65rem;
}
.guest-auth-form-compact .password-eye {
  width: 1.05rem;
  height: 1.05rem;
}
.verification-banner {
  margin-bottom: 1rem;
  padding: 0.95rem 1rem;
  border: 1px solid color-mix(in srgb, var(--accent) 45%, var(--border));
  border-radius: 1rem;
  background: color-mix(in srgb, var(--accent) 12%, var(--surface-soft));
}
.verification-banner strong { display: block; margin-bottom: 0.35rem; }
.compact-email-test {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.75rem;
  align-items: end;
}
.account-status {
  margin-bottom: 1rem;
  padding: 0.85rem 1rem;
  border: 1px solid var(--border);
  border-radius: 1rem;
  background: var(--surface-soft);
  color: var(--muted);
  font-weight: 700;
}
.admin-meta-badge { display: none !important; }
body.is-site-admin .admin-meta-badge { display: inline-flex !important; }
body.is-site-admin .status-pill.admin-meta-badge { display: inline-flex !important; }
.hidden { display: none !important; }
code {
  background: var(--surface-soft);
  border: 1px solid var(--border);
  border-radius: 0.35rem;
  padding: 0.1rem 0.25rem;
}
.verify-page {
  min-height: 100vh;
  display: grid;
  place-items: center;
}
@media (max-width: 820px) {
  .auth-grid { grid-template-columns: 1fr; }
}
select {
  width: 100%;
  border: 1px solid var(--border);
  border-radius: 0.9rem;
  padding: 0.8rem 0.9rem;
  background: var(--bg);
  color: var(--text);
  font: inherit;
}
.admin-toolbar {
  display: flex;
  align-items: end;
  gap: 1rem;
  flex-wrap: wrap;
  margin: 1rem 0;
}
.admin-toolbar label { min-width: 260px; }
.table-wrap {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
}
.admin-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 860px;
}
.admin-table th,
.admin-table td {
  border-bottom: 1px solid var(--border);
  padding: 0.8rem;
  text-align: left;
  vertical-align: top;
  overflow-wrap: normal;
}
.admin-table th {
  color: var(--muted);
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  overflow-wrap: normal;
}
.user-line { font-weight: 800; }
.small-muted { color: var(--muted); font-size: 0.86rem; }
.action-row {
  display: flex;
  gap: 0.4rem;
  flex-wrap: wrap;
}
.action-row .button,
.action-row select {
  padding: 0.45rem 0.65rem;
  font-size: 0.82rem;
  overflow-wrap: normal;
}
.role-select { min-width: 170px; }
#admin,
#admin .panel,
#admin .admin-details {
  max-width: 100%;
  min-width: 0;
}
details[data-admin-section="users"] {
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
}
details[data-admin-section="users"] .table-wrap {
  margin-inline: -0.15rem;
  padding-inline: 0.15rem;
}
details[data-admin-section="users"] .admin-table {
  min-width: 42rem;
  width: max(100%, 42rem);
}
details[data-admin-section="users"] .admin-table th,
details[data-admin-section="users"] .admin-table td {
  vertical-align: middle;
}
details[data-admin-section="users"] .admin-table th {
  white-space: nowrap;
}
details[data-admin-section="users"] .admin-table .user-line,
details[data-admin-section="users"] .admin-table .admin-user-email {
  max-width: 12rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
details[data-admin-section="users"] .admin-table .admin-user-role,
details[data-admin-section="users"] .admin-table .admin-user-status,
details[data-admin-section="users"] .admin-table .admin-user-posting {
  white-space: nowrap;
}
details[data-admin-section="users"] .admin-table td:last-child {
  width: 1%;
  white-space: normal;
}
details[data-admin-section="users"] .admin-table .action-row {
  flex-wrap: wrap;
  align-items: center;
  max-width: 18rem;
}
details[data-admin-section="users"] .admin-table .role-select {
  min-width: 7.5rem;
  max-width: 9rem;
  width: auto;
}
details[data-admin-section="users"] .admin-table .action-row .button,
details[data-admin-section="users"] .admin-table .action-row .small-button {
  white-space: nowrap;
  flex: 0 0 auto;
}
details[data-admin-section="users"] .admin-table .admin-user-icon-actions {
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.35rem;
  flex: 0 0 auto;
}
details[data-admin-section="users"] .admin-table .admin-user-icon-button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.15rem;
  min-height: 2.15rem;
  padding: 0.4rem;
  border-radius: 999px;
  line-height: 1;
  overflow: hidden;
}
details[data-admin-section="users"] .admin-table .admin-user-icon-button svg {
  display: block;
  width: 1rem;
  height: 1rem;
}
details[data-admin-section="users"] .admin-table tr.is-editing > td {
  background: color-mix(in srgb, var(--bg) 88%, var(--accent, #2f6fed) 12%);
}
details[data-admin-section="users"] .admin-user-edit-row td {
  padding-top: 0.35rem;
  padding-bottom: 0.85rem;
  background: color-mix(in srgb, var(--bg) 92%, var(--accent, #2f6fed) 8%);
}
details[data-admin-section="users"] .admin-user-edit-form {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
  gap: 0.65rem 0.85rem;
  align-items: end;
}
details[data-admin-section="users"] .admin-user-edit-form label {
  display: grid;
  gap: 0.3rem;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--muted);
}
details[data-admin-section="users"] .admin-user-edit-form input,
details[data-admin-section="users"] .admin-user-edit-form select {
  width: 100%;
  min-height: 2.3rem;
}
details[data-admin-section="users"] .admin-user-edit-check {
  align-content: end;
  font-weight: 600;
}
details[data-admin-section="users"] .admin-user-edit-check input {
  width: auto;
  min-height: 0;
  margin-right: 0.4rem;
}
details[data-admin-section="users"] .admin-user-edit-actions {
  grid-column: 1 / -1;
}
@media (max-width: 720px) {
  details[data-admin-section="users"] .admin-table {
    min-width: 36rem;
    width: max(100%, 36rem);
  }
  details[data-admin-section="users"] .admin-table .user-line,
  details[data-admin-section="users"] .admin-table .admin-user-email {
    max-width: 9.5rem;
  }
  details[data-admin-section="users"] .admin-table .action-row {
    max-width: 14.5rem;
  }
}
.audit-details { margin-top: 1rem; }
.audit-details summary { cursor: pointer; font-weight: 800; color: var(--muted); }
.audit-log { color: var(--muted); display: grid; gap: 0.5rem; padding-left: 1.3rem; }
textarea {
  width: 100%;
  border: 1px solid var(--border);
  border-radius: 0.9rem;
  padding: 0.8rem 0.9rem;
  background: var(--bg);
  color: var(--text);
  font: inherit;
  resize: vertical;
}
.filters-row {
  display: flex;
  gap: 1rem;
  align-items: end;
  flex-wrap: wrap;
  margin: 1rem 0;
}
.filters-row label { min-width: min(100%, 260px); }
.filters-row .refresh-icon-button,
.icon-button.refresh-icon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.55rem;
  min-height: 2.55rem;
  padding: 0.55rem;
  border-radius: 999px;
  line-height: 1;
}
.refresh-icon-img {
  width: 1.15rem;
  height: 1.15rem;
  display: block;
  color: currentColor;
  transition: transform 0.25s ease;
}
.refresh-icon-button:hover .refresh-icon-img,
.refresh-icon-button:focus-visible .refresh-icon-img {
  transform: rotate(60deg);
}
.refresh-icon-button.is-refreshing .refresh-icon-img {
  animation: refresh-spin 0.8s linear infinite;
}
@keyframes refresh-spin {
  to { transform: rotate(360deg); }
}
.directory-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}
.directory-card,
.empty-state,
.place-detail {
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface-soft) 42%, transparent);
  border-radius: 1.2rem;
  padding: 1rem;
}
.directory-card {
  display: flex;
  flex-direction: column;
  min-height: 100%;
}
/* Detail cards sit above reviews/footer — never stretch to a percentage of an auto-height parent. */
#airlineDetailBody .airline-detail-card,
#airlineDetailBody .directory-card {
  min-height: 0;
}
#airlineDetailBody {
  display: grid;
  gap: 1.15rem;
}
#airlines.panel {
  margin-bottom: 2.5rem;
}
#airlineDetailSection {
  margin-bottom: 0.5rem;
}
.airline-reviews-block {
  margin-top: 0;
  padding-bottom: 0.35rem;
}

/* Airline list cards: mockup hierarchy + country-flag wash */
.airline-card.has-flag-watermark {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.airline-card.has-flag-watermark > *:not(.airline-card-flag-watermark) {
  position: relative;
  z-index: 1;
}
/* Right-side flag wash — mirror plum-mist .dashboard-pin-flag-watermark */
.airline-card-flag-watermark {
  display: block;
  position: absolute;
  inset: auto;
  right: -0.15rem;
  top: 50%;
  left: auto;
  bottom: auto;
  transform: translateY(-50%);
  width: min(46%, 9.5rem);
  height: 140%;
  max-height: none;
  max-width: none;
  object-fit: cover;
  object-position: center;
  opacity: 0.16;
  pointer-events: none;
  user-select: none;
  z-index: 0;
  filter: saturate(1.05) contrast(1.05);
  mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.55) 38%, rgba(0, 0, 0, 0.9) 100%);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.55) 38%, rgba(0, 0, 0, 0.9) 100%);
}
@media (prefers-color-scheme: dark) {
  .airline-card-flag-watermark {
    opacity: 0.2;
    filter: saturate(1.1) contrast(1.08) brightness(1.08);
  }
}
.airline-card .airline-card-alliance {
  margin: 0 0 0.35rem;
  font-size: 1.2rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.2;
  color: var(--text);
}
.airline-card-identity {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem 0.75rem;
  margin: 0 0 0.35rem;
  min-width: 0;
}
.airline-card-name {
  min-width: 0;
  font-size: 1.05rem;
  font-weight: 600;
  line-height: 1.25;
  color: var(--text);
}
.airline-card-program,
.airline-card-codes {
  margin: 0.1rem 0;
  line-height: 1.35;
}
.airline-card-codes {
  font-size: 0.85em;
  opacity: 0.85;
}
.airline-card .place-card-actions {
  margin-top: auto;
  padding-top: 0.55rem;
}
.airline-card-rating {
  margin-left: 0.15rem;
}
.airline-card-title,
.airline-country-dd {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem 0.75rem;
  margin: 0.75rem 0 0.5rem;
}
.airline-country-dd {
  margin: 0;
  gap: 0.45rem;
}
.airline-card-title .country-flag,
.airline-country-dd .country-flag {
  width: 1.45rem;
  height: auto;
  border-radius: 0.2rem;
  flex: 0 0 auto;
}
/* Plain wordmark beside (or wrapping under) the airline name */
.airline-card-logo {
  display: block;
  height: 4rem;
  width: auto;
  max-width: min(100%, 15rem);
  object-fit: contain;
  object-position: left center;
  flex: 0 0 auto;
}
.airline-card-title > span {
  min-width: 0;
  line-height: 1.25;
}
/* Airline detail: clear logo under the title */
.airline-detail-logo {
  display: block;
  height: 4.75rem;
  width: auto;
  max-width: min(100%, 16rem);
  object-fit: contain;
  object-position: left center;
  margin: 0.15rem 0 0.55rem;
}
.directory-card h3,
.place-detail h3 { margin: 0.75rem 0 0.5rem; }
.directory-card p { color: var(--muted); }
.directory-card .action-row,
.directory-card .place-card-actions,
.directory-card .compact-card-footer {
  margin-top: auto;
  width: 100%;
}
.directory-card .action-row,
.directory-card .place-card-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.55rem;
}
.directory-card .pin-icon-button {
  margin-left: auto;
}
.card-topline {
  display: flex;
  gap: 0.6rem;
  align-items: center;
  justify-content: space-between;
}
.place-card .card-topline {
  align-items: flex-start;
}
.place-card .card-topline-start {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  align-items: center;
  min-width: 0;
  flex: 1 1 auto;
}
.place-card .card-topline > .pin-icon-button {
  margin-left: auto;
  flex: 0 0 auto;
  align-self: flex-start;
}
.place-detail { margin-top: 1rem; }
.admin-details {
  border: 1px solid var(--border);
  border-radius: 1.2rem;
  padding: 1rem;
  margin: 1rem 0;
  background: color-mix(in srgb, var(--surface-soft) 30%, transparent);
}
.admin-details summary {
  cursor: pointer;
  font-weight: 900;
  color: var(--text);
  margin-bottom: 1rem;
}
.inline-form {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
  margin-bottom: 1rem;
}
.wide-form { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.full-span { grid-column: 1 / -1; }
.form-actions { display: flex; gap: 0.7rem; align-items: end; flex-wrap: wrap; }
.source-fieldset {
  border: 1px solid var(--border);
  border-radius: 1rem;
  padding: 1rem;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.source-fieldset legend { font-weight: 800; color: var(--muted); padding: 0 0.4rem; }
@media (max-width: 980px) {
  .directory-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .inline-form, .wide-form, .source-fieldset { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .directory-grid { grid-template-columns: 1fr; }
}

.import-summary {
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 1rem;
  background: rgba(255,255,255,0.03);
  margin: 0.75rem 0 1rem;
}
.compact-dl {
  display: grid;
  grid-template-columns: minmax(180px, 260px) 1fr;
  gap: 0.45rem 1rem;
  margin: 0;
}
.compact-dl dt { color: var(--muted); font-weight: 700; }
.compact-dl dd { margin: 0; }
.import-toolbar { align-items: end; }
.import-toolbar input { max-width: 180px; }
@media (max-width: 760px) {
  .compact-dl { grid-template-columns: 1fr; }
}

.pagination-slot { margin-top: 1rem; }
.pagination-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
  flex-wrap: wrap;
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 0.6rem 0.8rem;
  background: color-mix(in srgb, var(--surface-soft) 35%, transparent);
}
.button:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
@media (max-width: 640px) {
  .pagination-bar { border-radius: 1.2rem; align-items: stretch; }
  .pagination-bar .button { width: 100%; }
}

.country-card-heading {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-top: 0.4rem;
}
.country-card-heading h3 { margin: 0; }

/* Compact Locations directory cards (same data, denser like browse-country cards) */
#publicLocationsGrid.directory-grid {
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 0.55rem;
}
.compact-directory-card.clickable-location-card,
#publicLocationsGrid .compact-directory-card {
  display: flex;
  flex-direction: column;
  gap: 0.28rem;
  padding: 0.7rem 0.8rem;
  border-radius: 0.9rem;
  height: 100%;
  min-height: 0;
  box-sizing: border-box;
  cursor: pointer;
}
#publicLocationsGrid .compact-directory-card .country-card-heading {
  margin-top: 0;
  gap: 0.5rem;
}
#publicLocationsGrid .compact-directory-card .country-card-heading h3 {
  margin: 0;
  font-size: 0.98rem;
  line-height: 1.2;
}
#publicLocationsGrid .compact-directory-card .country-flag {
  width: 28px;
  height: 20px;
}
#publicLocationsGrid .compact-card-region {
  margin: 0;
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.25;
}
#publicLocationsGrid .compact-card-facts {
  display: grid;
  gap: 0.12rem;
  margin: 0.1rem 0 0;
  color: var(--muted);
  font-size: 0.8rem;
  line-height: 1.3;
}
#publicLocationsGrid .compact-card-facts strong {
  color: var(--text);
  font-weight: 800;
  margin-right: 0.3rem;
}
.compact-directory-card .compact-card-footer,
#publicLocationsGrid .compact-card-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.45rem;
  margin-top: auto;
  padding-top: 0.35rem;
}
#publicLocationsGrid .compact-card-footer .action-row {
  margin: 0;
}
#publicLocationsGrid .compact-card-footer .pin-icon-button {
  min-width: 2rem;
  min-height: 2rem;
  padding: 0.3rem;
}
.location-title-row {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  flex-wrap: wrap;
  min-width: 0;
  width: 100%;
}
.location-title-row h2 {
  margin: 0;
  min-width: 0;
  flex: 1 1 12rem;
  overflow-wrap: break-word;
  word-break: normal;
  hyphens: auto;
  line-height: 1.15;
}
#cityPageContent .location-context-header {
  grid-template-columns: minmax(0, 1fr) auto;
}
#cityPageContent .location-context-header-main {
  min-width: 0;
}
#cityPageContent .location-context-header-actions {
  align-items: flex-end;
}
#cityPageContent .location-context-header-actions .pin-button {
  margin-bottom: 0;
}
.city-highlight-gallery {
  margin: 0 0 1.1rem;
  display: grid;
  gap: 0.65rem;
}
.city-guide-overview{margin-bottom:1.1rem;border-color:color-mix(in srgb,var(--accent) 34%,var(--border));background:radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--accent) 17%,transparent),transparent 38%),linear-gradient(145deg,color-mix(in srgb,var(--surface) 94%,#f4edf8),var(--surface))}.city-guide-overview-head,.city-guide-planning{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem}.city-guide-overview-head h3{margin:.12rem 0 0;font-size:clamp(1.35rem,3vw,1.8rem)}
.city-guide-status{flex:0 0 auto;padding:.38rem .65rem;border:1px solid var(--border);border-radius:999px;background:var(--surface);color:var(--muted);font-size:.75rem;font-weight:800}.city-guide-status.is-growing{color:var(--accent);border-color:color-mix(in srgb,var(--accent) 42%,var(--border))}.city-guide-intro{max-width:66ch;margin:.75rem 0 1rem;font-size:1.02rem;line-height:1.65}
.city-guide-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem;margin-top:1rem}.city-guide-facts>div{display:grid;gap:.15rem;padding:.75rem;border:1px solid color-mix(in srgb,var(--border) 82%,transparent);border-radius:.85rem;background:color-mix(in srgb,var(--surface) 88%,transparent)}
.city-guide-facts span{color:var(--muted);font-size:.72rem;font-weight:750;text-transform:uppercase;letter-spacing:.04em}.city-guide-facts strong{overflow-wrap:anywhere;font-size:.92rem}.city-guide-planning{margin-top:1rem}.city-guide-planning h4{margin:0 0 .45rem}.city-guide-planning ul{margin:0;padding-left:1.2rem;color:var(--muted);line-height:1.65}
.city-guide-planning aside{max-width:28rem;padding:.8rem .9rem;border:1px dashed color-mix(in srgb,var(--accent) 38%,var(--border));border-radius:.85rem;background:color-mix(in srgb,var(--accent) 6%,var(--surface))}.city-guide-planning aside p{margin:.3rem 0 0;color:var(--muted);font-size:.86rem;line-height:1.5}.city-guide-actions{margin-top:1rem}
@media(max-width:720px){.city-guide-facts{grid-template-columns:repeat(2,minmax(0,1fr))}.city-guide-planning{display:grid}.city-guide-planning aside{max-width:none}}
@media(max-width:430px){.city-guide-overview-head{display:grid}.city-guide-facts{grid-template-columns:1fr}.city-guide-actions .button{width:100%}}
.city-guide-status-wrap{display:grid;justify-items:end;gap:.3rem}.city-guide-status.is-complete{color:#147a61;border-color:color-mix(in srgb,#20a77f 45%,var(--border))}.city-guide-reviewed{color:var(--muted);font-size:.72rem}.city-guide-best-for{display:flex;align-items:center;flex-wrap:wrap;gap:.55rem;margin:0 0 1rem}.city-guide-best-for>div{display:flex;flex-wrap:wrap;gap:.35rem}.city-guide-best-for span{padding:.28rem .55rem;border-radius:999px;background:color-mix(in srgb,var(--accent) 11%,var(--surface));color:var(--accent);font-size:.78rem;font-weight:750}
.city-guide-drawbacks,.city-guide-honesty{margin-top:1rem;padding:.85rem 1rem;border:1px solid color-mix(in srgb,#d97706 32%,var(--border));border-radius:.9rem;background:color-mix(in srgb,#d97706 6%,var(--surface))}.city-guide-drawbacks ul{margin:.45rem 0 0;padding-left:1.2rem;color:var(--muted);line-height:1.55}.city-guide-honesty p{margin:.3rem 0 0;color:var(--muted)}
.city-editorial-neighborhoods{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--border)}.city-editorial-neighborhoods h4{margin:.1rem 0 .7rem;font-size:1.15rem}.city-editorial-neighborhood-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem}.city-editorial-neighborhood-grid article{padding:.8rem;border:1px solid var(--border);border-radius:.85rem;background:color-mix(in srgb,var(--surface) 88%,transparent)}.city-editorial-neighborhood-grid h5{margin:0 0 .25rem;font-size:.95rem}.city-editorial-neighborhood-grid p{margin:0;color:var(--muted);font-size:.84rem;line-height:1.5}
.city-editorial-guide-fields{border-color:color-mix(in srgb,var(--accent) 32%,var(--border));background:color-mix(in srgb,var(--accent) 4%,var(--surface))}.city-editorial-guide-fields legend{font-weight:800}
@media(max-width:620px){.city-editorial-neighborhood-grid{grid-template-columns:1fr}.city-guide-status-wrap{justify-items:start}}

.city-guide-sources{margin:1rem 0 0;color:var(--muted);font-size:.78rem;line-height:1.5}.city-guide-sources a{font-weight:700}

.city-highlight-gallery-head {
  display: grid;
  gap: 0.15rem;
}
.city-highlight-gallery-head h3 {
  margin: 0;
  font-size: clamp(1.05rem, 2.4vw, 1.35rem);
  letter-spacing: -0.02em;
}
.city-highlight-collage {
  display: grid;
  gap: 0.45rem;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  grid-auto-rows: minmax(5.5rem, 18vw);
  border-radius: 1.1rem;
  overflow: hidden;
  background:
    radial-gradient(120% 90% at 12% 18%, color-mix(in srgb, var(--primary) 16%, transparent), transparent 55%),
    linear-gradient(145deg, color-mix(in srgb, var(--surface) 88%, #efe8f6), color-mix(in srgb, var(--surface-soft, var(--surface)) 92%, #e7dceb));
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  padding: 0.45rem;
}
.city-highlight-tile {
  position: relative;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0.75rem;
  overflow: hidden;
  background: color-mix(in srgb, var(--surface) 70%, #1b1224);
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: default;
  min-width: 0;
  min-height: 0;
}
.city-highlight-tile.clickable-card {
  cursor: pointer;
}
.city-highlight-tile.clickable-card:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--primary) 70%, white);
  outline-offset: 2px;
}
.city-highlight-tile img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.45s ease;
}
.city-highlight-tile.clickable-card:hover img,
.city-highlight-tile.clickable-card:focus-visible img {
  transform: scale(1.04);
}
.city-highlight-tile-caption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 1.4rem 0.55rem 0.45rem;
  background: linear-gradient(to top, rgba(28, 16, 36, 0.72), transparent);
  color: #f7f1fb;
  font-size: 0.72rem;
  font-weight: 650;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.city-highlight-count-1 .city-highlight-tile-1 { grid-column: 1 / -1; grid-row: span 2; min-height: 12rem; }
.city-highlight-count-2 .city-highlight-tile-1,
.city-highlight-count-2 .city-highlight-tile-2 { grid-column: span 3; grid-row: span 2; }
.city-highlight-count-3 .city-highlight-tile-1 { grid-column: span 4; grid-row: span 2; }
.city-highlight-count-3 .city-highlight-tile-2,
.city-highlight-count-3 .city-highlight-tile-3 { grid-column: span 2; }
.city-highlight-count-4 .city-highlight-tile-1 { grid-column: span 3; grid-row: span 2; }
.city-highlight-count-4 .city-highlight-tile-2 { grid-column: span 3; grid-row: span 2; }
.city-highlight-count-4 .city-highlight-tile-3,
.city-highlight-count-4 .city-highlight-tile-4 { grid-column: span 3; }
.city-highlight-count-5 .city-highlight-tile-1 { grid-column: span 4; grid-row: span 2; }
.city-highlight-count-5 .city-highlight-tile-2,
.city-highlight-count-5 .city-highlight-tile-3 { grid-column: span 2; }
.city-highlight-count-5 .city-highlight-tile-4,
.city-highlight-count-5 .city-highlight-tile-5 { grid-column: span 3; }
.city-highlight-count-6 .city-highlight-tile-1 { grid-column: span 4; grid-row: span 2; }
.city-highlight-count-6 .city-highlight-tile-2,
.city-highlight-count-6 .city-highlight-tile-3 { grid-column: span 2; }
.city-highlight-count-6 .city-highlight-tile-4,
.city-highlight-count-6 .city-highlight-tile-5,
.city-highlight-count-6 .city-highlight-tile-6 { grid-column: span 2; }
@media (max-width: 720px) {
  .city-highlight-collage {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: minmax(5.5rem, 28vw);
  }
  .city-highlight-count-1 .city-highlight-tile-1,
  .city-highlight-count-2 .city-highlight-tile-1,
  .city-highlight-count-2 .city-highlight-tile-2,
  .city-highlight-count-3 .city-highlight-tile-1,
  .city-highlight-count-3 .city-highlight-tile-2,
  .city-highlight-count-3 .city-highlight-tile-3,
  .city-highlight-count-4 .city-highlight-tile-1,
  .city-highlight-count-4 .city-highlight-tile-2,
  .city-highlight-count-4 .city-highlight-tile-3,
  .city-highlight-count-4 .city-highlight-tile-4,
  .city-highlight-count-5 .city-highlight-tile-1,
  .city-highlight-count-5 .city-highlight-tile-2,
  .city-highlight-count-5 .city-highlight-tile-3,
  .city-highlight-count-5 .city-highlight-tile-4,
  .city-highlight-count-5 .city-highlight-tile-5,
  .city-highlight-count-6 .city-highlight-tile-1,
  .city-highlight-count-6 .city-highlight-tile-2,
  .city-highlight-count-6 .city-highlight-tile-3,
  .city-highlight-count-6 .city-highlight-tile-4,
  .city-highlight-count-6 .city-highlight-tile-5,
  .city-highlight-count-6 .city-highlight-tile-6 {
    grid-column: span 1;
    grid-row: span 1;
    min-height: 0;
  }
  .city-highlight-count-1 .city-highlight-tile-1,
  .city-highlight-count-3 .city-highlight-tile-1,
  .city-highlight-count-5 .city-highlight-tile-1,
  .city-highlight-count-6 .city-highlight-tile-1 {
    grid-column: 1 / -1;
    min-height: 10rem;
  }
}
.nearby-worth-it-block {
  display: grid;
  gap: 0.75rem;
}
.nearby-worth-it-list {
  display: grid;
  gap: 0.55rem;
}
.nearby-worth-it-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.85rem;
  align-items: center;
  margin: 0;
  padding: 0.7rem 0.85rem;
  border-radius: 0.95rem;
  border: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--primary) 8%, var(--surface)), color-mix(in srgb, var(--surface) 92%, #efe6f5));
  cursor: pointer;
  transition: border-color 0.2s ease, transform 0.2s ease, background 0.2s ease;
}
.nearby-worth-it-row:hover,
.nearby-worth-it-row:focus-visible {
  border-color: color-mix(in srgb, var(--primary) 45%, var(--border));
  transform: translateY(-1px);
}
.nearby-worth-it-row:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--primary) 70%, white);
  outline-offset: 2px;
}
.nearby-worth-it-row:not(:has(.nearby-worth-it-thumb)) {
  grid-template-columns: minmax(0, 1fr);
}
.nearby-worth-it-thumb {
  width: 4.4rem;
  height: 4.4rem;
  border-radius: 0.75rem;
  overflow: hidden;
  background: color-mix(in srgb, var(--surface) 70%, #1b1224);
  flex: 0 0 auto;
}
.nearby-worth-it-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.nearby-worth-it-body {
  min-width: 0;
  display: grid;
  gap: 0.2rem;
}
.nearby-worth-it-title-row {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  min-width: 0;
}
.nearby-worth-it-title-row h3 {
  margin: 0;
  font-size: 1.02rem;
  letter-spacing: -0.015em;
  line-height: 1.25;
}
.nearby-worth-it-title-row .country-flag,
.nearby-worth-it-title-row .country-flag-fallback {
  width: 28px;
  height: 20px;
}
.nearby-worth-it-teaser {
  margin: 0.15rem 0 0;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem 0.55rem;
  font-size: 0.9rem;
  line-height: 1.35;
}
.nearby-worth-it-teaser-label {
  font-size: 0.72rem;
  font-weight: 650;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--primary) 72%, var(--text-muted, #6b6275));
}
.nearby-worth-it-teaser-title {
  color: var(--text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}
@media (max-width: 720px) {
  .nearby-worth-it-row {
    gap: 0.7rem;
    padding: 0.65rem 0.7rem;
  }
  .nearby-worth-it-thumb {
    width: 3.6rem;
    height: 3.6rem;
  }
  .nearby-worth-it-teaser-title {
    white-space: normal;
  }
}
#cityPageContent .location-title-row {
  flex-basis: 100%;
}
#cityPageContent .location-title-row h2 {
  font-size: clamp(1.25rem, 3.6vw, 1.85rem);
  letter-spacing: -0.02em;
}
.location-title-row .country-flag {
  width: 52px;
  height: 36px;
}
.country-flag {
  width: 40px;
  height: 28px;
  object-fit: cover;
  border-radius: 0.35rem;
  border: 1px solid var(--border);
  box-shadow: 0 6px 16px rgba(0,0,0,0.18);
  flex: 0 0 auto;
}
.country-flag-fallback {
  width: 40px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.35rem;
  border: 1px solid var(--border);
  background: rgba(91, 200, 231, 0.16);
  color: var(--text);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  box-shadow: 0 6px 16px rgba(0,0,0,0.18);
  flex: 0 0 auto;
}
.country-flag-emoji {
  font-size: 1.8rem;
  line-height: 1;
  flex: 0 0 auto;
}
.country-flag-fallback.country-flag-emoji {
  font-size: 1.3rem;
  background: transparent;
}
.country-meta {
  border-top: 1px solid var(--border);
  padding-top: 0.75rem;
  margin-top: 0.75rem;
}
.admin-location-name {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}
.admin-location-name .country-flag {
  width: 32px;
  height: 22px;
}

.place-card-actions,
.detail-heart-row {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  flex-wrap: wrap;
  margin-top: 1rem;
}
.place-detail-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  margin: 0.15rem 0 0.55rem;
}
.place-detail-heading h3 {
  margin: 0;
  flex: 1 1 auto;
  min-width: 0;
}
.place-detail-heading-actions {
  display: flex;
  align-items: flex-start;
  gap: 0.35rem;
  flex: 0 0 auto;
  margin-top: 0.05rem;
}
.place-detail-heading .heart-button,
.place-detail-heading .pin-button {
  flex: 0 0 auto;
  margin-top: 0;
  margin-bottom: 0;
}
.place-card-actions {
  flex-wrap: wrap;
}
.place-card-actions .button.secondary:not(.pin-icon-button):not(.add-to-trip-icon-button) {
  white-space: nowrap;
  padding: 0.55rem 0.85rem;
  min-height: 2.35rem;
}
.heart-button {
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface);
  color: var(--text);
  padding: 0.65rem 0.9rem;
  font-weight: 900;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  min-height: 2.55rem;
  transition: transform 0.15s ease, border-color 0.15s ease, background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}
.heart-button:hover {
  border-color: var(--accent);
  color: var(--accent);
}
.heart-button.active {
  background: color-mix(in srgb, var(--accent) 20%, var(--surface));
  border-color: var(--accent);
  color: var(--accent-strong);
}
.heart-button:disabled {
  opacity: 0.7;
  cursor: wait;
}
.heart-pop {
  animation: heart-pop 0.7s cubic-bezier(0.22, 1.4, 0.36, 1);
}
.heart-unpop {
  animation: heart-unpop 0.55s ease;
}
@keyframes heart-pop {
  0% { transform: scale(1); }
  18% { transform: scale(1.42) rotate(-8deg); box-shadow: 0 0 0 0 color-mix(in srgb, var(--accent) 55%, transparent); }
  40% { transform: scale(0.9) rotate(4deg); box-shadow: 0 0 0 12px transparent; }
  65% { transform: scale(1.18) rotate(-2deg); }
  100% { transform: scale(1) rotate(0deg); box-shadow: 0 0 0 0 transparent; }
}
@keyframes heart-unpop {
  0% { transform: scale(1); }
  40% { transform: scale(0.86); opacity: 0.85; }
  100% { transform: scale(1); opacity: 1; }
}
.experience-like-button.heart-pop .heart-icon,
.heart-button.heart-pop .heart-icon {
  animation: heart-icon-burst 0.7s ease;
}
@keyframes heart-icon-burst {
  0% { transform: scale(1); }
  25% { transform: scale(1.55); filter: drop-shadow(0 0 8px color-mix(in srgb, var(--accent) 70%, transparent)); }
  100% { transform: scale(1); filter: none; }
}
.place-card .heart-button,
.post-card .heart-button { flex: 0 0 auto; }
.heart-icon-button {
  min-width: 2.35rem;
  min-height: 2.35rem;
  padding: 0.45rem 0.7rem;
  line-height: 1;
}
.heart-icon-button .heart-icon {
  font-size: 1.15rem;
  line-height: 1;
  transition: transform 0.18s ease;
  display: inline-block;
}
.heart-icon-button .heart-count {
  font-size: 0.85rem;
  font-weight: 800;
  line-height: 1;
  opacity: 0.9;
}
.heart-icon-button:hover .heart-icon,
.heart-icon-button:focus-visible .heart-icon {
  transform: scale(1.12);
}

.branding-asset-field {
  display: grid;
  gap: 0.75rem;
  margin-top: 0.35rem;
}
.branding-upload-row {
  display: grid;
  grid-template-columns: minmax(120px, 180px) 1fr;
  gap: 1rem;
  align-items: stretch;
}
.branding-preview {
  border: 1px solid var(--border);
  border-radius: 1rem;
  background: color-mix(in srgb, var(--surface-soft) 50%, transparent);
  min-height: 7rem;
  display: grid;
  place-items: center;
  overflow: hidden;
  padding: 0.65rem;
}
.branding-preview-logo {
  aspect-ratio: 1 / 1;
  max-width: 140px;
}
.branding-preview-banner {
  min-height: 8rem;
}
.branding-preview-video {
  min-height: 8rem;
  background: #101b2b;
}
.branding-preview img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.branding-preview-banner img {
  object-fit: cover;
}
.branding-preview-video video {
  width: 100%;
  height: 100%;
  min-height: 7rem;
  object-fit: cover;
  display: block;
  border-radius: 0.65rem;
  background: #101b2b;
}
.dashboard-hero.hero-login-video-only .dashboard-hero-media {
  background-image: none !important;
  background-color: #101b2b;
}
.branding-preview.has-image,
.branding-preview.has-video {
  padding: 0;
}
.branding-preview.has-image img,
.branding-preview.has-video video {
  width: 100%;
  height: 100%;
  min-height: 7rem;
}
.branding-preview-empty {
  color: var(--muted);
  font-size: 0.85rem;
  text-align: center;
  padding: 0.5rem;
}
.branding-upload-controls {
  display: grid;
  gap: 0.55rem;
  align-content: start;
}
.branding-upload-controls input[type="file"] {
  width: 100%;
}
@media (max-width: 720px) {
  .branding-upload-row {
    grid-template-columns: 1fr;
  }
  .branding-preview-logo {
    max-width: 160px;
  }
}

.photo-gallery {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin: 0.75rem 0;
}

.photo-gallery.large {
  gap: 1rem;
}

.photo-card {
  display: grid;
  gap: 0.4rem;
  align-content: start;
}

.photo-thumb {
  margin: 0;
  border: 1px solid var(--border);
  border-radius: 1rem;
  overflow: hidden;
  background: rgba(255,255,255,0.03);
  max-width: 220px;
}

.photo-thumb.is-zoomable {
  position: relative;
}

.photo-thumb-open {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: zoom-in;
  color: inherit;
}

.photo-thumb-open:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.photo-thumb img {
  display: block;
  width: 100%;
  height: 180px;
  object-fit: contain;
  object-position: center;
  background: #0b1220;
}

.photo-thumb.large {
  max-width: 520px;
}

.photo-thumb.large img {
  height: auto;
  max-height: min(70vh, 640px);
  aspect-ratio: auto;
}

.photo-thumb figcaption {
  padding: 0.45rem 0.65rem;
  color: var(--muted);
  font-size: 0.85rem;
}

.photo-file-name {
  padding: 0.35rem 0.65rem 0;
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.3;
  word-break: break-all;
}

.photo-preview-backdrop {
  z-index: 1200;
  background: rgba(0, 0, 0, 0.78);
  overflow: auto;
}

.photo-preview-card {
  width: min(960px, 100%);
  max-height: min(92vh, 980px);
  overflow-x: hidden;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.photo-preview-stage {
  position: relative;
  margin: 0;
  border: 1px solid var(--border);
  border-radius: 1rem;
  overflow: hidden;
  background: #0b1220;
  flex: 0 0 auto;
  max-height: min(68vh, 720px);
}

.photo-preview-stage img {
  display: block;
  width: 100%;
  max-height: min(68vh, 720px);
  height: auto;
  min-height: 1px;
  object-fit: contain;
  background: #0b1220;
}

@media (max-width: 640px) {
  .photo-preview-card { max-height: calc(100dvh - 2rem); }
  .photo-preview-stage,
  .photo-preview-stage img { max-height: 52dvh; }
  .photo-preview-stage { min-height: min(52dvh, 280px); display: grid; place-items: center; }
  .photo-preview-stage img { min-height: min(52dvh, 280px); object-fit: contain; }
}

.photo-preview-overlay {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  cursor: crosshair;
  touch-action: none;
}

.photo-preview-caption {
  padding: 0 0.15rem;
}

.photo-preview-edit-tools {
  display: grid;
  gap: 0.55rem;
  padding-top: 0.15rem;
}

.photo-preview-edit-tools .note {
  margin: 0;
}

.photo-preview-edit-tools .form-actions.compact-actions {
  white-space: normal;
  flex-wrap: wrap;
}

.photo-preview-edit-tools .privacy-blur-primary-actions {
  margin: 0;
}

.photo-preview-edit-tools .privacy-blur-primary-actions .button {
  width: 100%;
  justify-content: center;
  font-weight: 700;
}

.photo-preview-edit-tools .privacy-blur-secondary-actions {
  margin: 0;
}

.upload-inline {
  display: grid;
  gap: 0.45rem;
  min-width: min(100%, 260px);
}

.upload-inline input[type="file"],
.upload-inline input[type="text"] {
  width: 100%;
}

label.photo-rights-check {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  gap: 0.55rem;
  font-size: 0.84rem;
  color: var(--muted);
  font-weight: 600;
  line-height: 1.35;
}

label.photo-rights-check input[type="checkbox"] {
  margin: 0;
  width: 1rem;
  height: 1rem;
  flex: 0 0 auto;
}

label.photo-rights-check span {
  flex: 1 1 auto;
  min-width: 0;
}

.photo-select-preview {
  display: grid;
  gap: 0.4rem;
  padding: 0.45rem;
  border: 1px solid var(--border);
  border-radius: 0.75rem;
  background: color-mix(in srgb, var(--surface) 88%, transparent);
}

.photo-select-preview.hidden {
  display: none;
}

.photo-select-preview img {
  width: 100%;
  max-height: 160px;
  object-fit: cover;
  border-radius: 0.55rem;
  display: block;
}

.photo-select-preview-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.photo-select-preview-name {
  font-size: 0.78rem;
  color: var(--muted);
  word-break: break-all;
  line-height: 1.3;
}

.small-button {
  padding: 0.35rem 0.65rem;
  font-size: 0.8rem;
}

.photo-status-row { margin: 0.45rem 0; }

.photo-card-actions {
  display: grid;
  gap: 0.35rem;
}

.photo-card-actions .button {
  width: 100%;
  white-space: normal;
  line-height: 1.25;
  text-align: center;
}

.admin-photo-tools {
  display: grid;
  gap: 0.55rem;
  min-width: 190px;
  max-width: 250px;
}

.admin-photo-tools > .button {
  width: 100%;
  white-space: normal;
  line-height: 1.25;
}

.admin-photo-tools .photo-gallery {
  margin: 0;
}

.admin-photo-tools .photo-thumb {
  max-width: 100%;
}

.button {
  -webkit-font-smoothing: antialiased;
  text-shadow: none;
}

.badge {
  display: inline-flex;
  align-items: center;
  text-shadow: none;
  -webkit-font-smoothing: antialiased;
}

.trip-list {
  display: grid;
  gap: 1.15rem;
  margin-top: 1rem;
}

.trip-card {
  border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
  border-radius: 1.2rem;
  padding: 0;
  overflow: hidden;
  background:
    linear-gradient(160deg, color-mix(in srgb, var(--accent) 8%, transparent), transparent 42%),
    var(--surface);
  box-shadow: var(--shadow);
  animation: pageFadeIn 0.35s ease;
}

.trip-card-header {
  padding: 1.05rem 1.15rem 0.95rem;
}

.trip-card-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.55rem;
}

.trip-privacy-badge {
  background: color-mix(in srgb, var(--accent) 16%, var(--surface));
  color: var(--accent-strong);
  border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--border));
}

.trip-place-count {
  color: var(--muted);
  font-size: 0.88rem;
  font-weight: 650;
}

.trip-card-header h3 {
  margin: 0 0 0.75rem;
  font-size: clamp(1.15rem, 1.7vw, 1.4rem);
  letter-spacing: -0.02em;
  line-height: 1.2;
}

.trip-card-facts {
  list-style: none;
  margin: 0;
  padding: 0.8rem 0.9rem;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
  gap: 0.75rem 1.1rem;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  border-radius: 0.95rem;
  background: color-mix(in srgb, var(--surface-soft) 72%, transparent);
}

.trip-card-facts li {
  display: grid;
  gap: 0.18rem;
  min-width: 0;
}

.trip-card-fact-label {
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
}

.trip-card-fact-value {
  color: var(--text);
  font-weight: 650;
  line-height: 1.35;
}

.trip-card-fact-link {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  margin: 0;
  color: var(--accent-strong);
  font: inherit;
  font-weight: 650;
  line-height: 1.35;
  text-align: left;
  text-decoration: underline;
  text-underline-offset: 0.15em;
  cursor: pointer;
}

.trip-card-fact-link:hover,
.trip-card-fact-link:focus-visible {
  color: var(--accent);
}

.trip-car-nav-links {
  margin-top: 0.55rem;
}

.trip-car-nav-note {
  margin: 0.35rem 0 0;
}

.trip-composer-header-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.trip-wizard-stepper {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0.6rem 0 1rem;
}

.trip-wizard-step-chip {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.4rem 0.75rem 0.4rem 0.45rem;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface);
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 700;
  cursor: default;
}

.trip-wizard-step-chip:not(:disabled) {
  cursor: pointer;
}

.trip-wizard-step-chip:disabled {
  opacity: 0.6;
}

.trip-wizard-step-num {
  display: grid;
  place-items: center;
  width: 1.5rem;
  height: 1.5rem;
  flex: 0 0 auto;
  border-radius: 50%;
  background: color-mix(in srgb, var(--accent) 14%, transparent);
  color: var(--accent);
  font-size: 0.78rem;
}

.trip-wizard-step-chip.is-current {
  border-color: var(--accent);
  color: var(--text);
  background: color-mix(in srgb, var(--accent) 10%, var(--surface));
}

.trip-wizard-step-chip.is-current .trip-wizard-step-num {
  background: var(--accent);
  color: var(--surface);
}

.trip-wizard-step-chip.is-complete .trip-wizard-step-num {
  background: color-mix(in srgb, var(--accent) 26%, transparent);
  color: var(--accent);
}

@media (max-width: 620px) {
  .trip-wizard-step-label { display: none; }
  .trip-wizard-step-chip { padding: 0.35rem; }
}

.trip-step-heading {
  grid-column: 1 / -1;
  margin: 0 0 0.3rem;
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--text);
}

.trip-wizard-nav {
  display: flex;
  justify-content: space-between;
  gap: 0.6rem;
  margin-top: 0.4rem;
}

.trip-wizard-review {
  padding: 0.85rem 1rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface) 92%, var(--accent) 8%);
}

.trip-wizard-review-title {
  margin: 0 0 0.5rem;
  font-weight: 800;
}

.trip-travel-panel {
  margin-top: 0.35rem;
  padding: 0.9rem 1rem;
  border: 1px solid color-mix(in srgb, var(--border) 88%, var(--accent) 12%);
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface) 92%, var(--accent) 8%);
}

.trip-travel-panel-header {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 0.7rem;
}

.trip-travel-panel-header .note { margin: 0.2rem 0 0; }

.trip-travel-modes {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr));
  gap: 0.55rem;
}

.trip-travel-mode {
  display: grid;
  gap: 0.2rem;
  width: 100%;
  text-align: left;
  padding: 0.7rem 0.8rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
  color: var(--text);
  cursor: pointer;
  font: inherit;
}

.trip-travel-mode:hover:not(:disabled) {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
}

.trip-travel-mode.is-selected {
  border-color: color-mix(in srgb, var(--accent) 70%, var(--border));
  background: color-mix(in srgb, var(--accent) 12%, var(--surface));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 35%, transparent);
}

.trip-travel-mode:disabled,
.trip-travel-mode.is-unavailable {
  opacity: 0.55;
  cursor: not-allowed;
}

.trip-travel-mode-label { font-weight: 750; }
.trip-travel-mode-duration { font-size: 0.95rem; }
.trip-travel-mode-meta { font-size: 0.8rem; color: var(--muted); }

.trip-travel-detail {
  margin-top: 0.75rem;
  padding: 0.75rem 0.85rem;
  border-radius: 12px;
  border: 1px dashed color-mix(in srgb, var(--border) 80%, var(--accent) 20%);
  background: color-mix(in srgb, var(--surface-soft) 70%, transparent);
}

.trip-travel-detail p { margin: 0 0 0.45rem; }
.trip-travel-detail .action-row { margin-top: 0.55rem; }

.trip-card-travel {
  margin-top: 0.7rem;
  padding: 0.65rem 0.75rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--border) 85%, var(--accent) 15%);
  background: color-mix(in srgb, var(--surface-soft) 65%, transparent);
}

.trip-card-travel p { margin: 0.2rem 0; }
.trip-depart-countdown { font-weight: 750; color: var(--text); }

.trip-card-notes {
  margin: 0.85rem 0 0;
  padding: 0.75rem 0.85rem;
  border-left: 2px solid color-mix(in srgb, var(--accent) 40%, var(--border));
  color: color-mix(in srgb, var(--text) 92%, var(--muted));
  white-space: pre-wrap;
  line-height: 1.55;
}

.trip-card-body {
  padding: 0 1.15rem 0.35rem;
}

.trip-card-section-label {
  margin: 0 0 0.55rem;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--accent) 70%, var(--muted));
}

.flight-search-tester-list {
  display: grid;
  gap: 0.45rem;
  margin: 0.75rem 0 0.35rem;
  max-height: min(22rem, 48vh);
  overflow: auto;
  padding: 0.65rem 0.75rem;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  border-radius: 0.9rem;
  background: color-mix(in srgb, var(--surface-soft) 50%, var(--surface));
}

.flight-search-tester-list.is-disabled {
  opacity: 0.55;
}

.flight-search-tester-list .flight-search-tester {
  margin: 0;
  align-items: flex-start;
}

.trip-flight-list,
.trip-flight-offer-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.65rem;
}

.trip-flight-item,
.trip-flight-offer {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.8rem;
  min-width: 0;
  padding: 0.75rem 0.85rem;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  border-radius: 0.95rem;
  background: color-mix(in srgb, var(--surface-soft) 55%, var(--surface));
}

.trip-flight-offer .button { flex-shrink: 0; }

.trip-flight-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.2rem 0.7rem;
  margin: 0.2rem 0 0.15rem;
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.35;
}

.trip-flight-route {
  font-weight: 750;
  color: color-mix(in srgb, var(--text) 88%, var(--muted));
}

.trip-flight-price {
  font-weight: 800;
  color: var(--accent-strong, var(--accent));
  letter-spacing: 0.01em;
}

.trip-flight-provider {
  margin-top: 0.1rem;
  font-size: 0.78rem;
}

.trip-flight-item .trip-item-copy strong,
.trip-flight-offer .trip-item-copy strong {
  overflow-wrap: anywhere;
  word-break: break-word;
}

.trip-empty-places.compact { padding: 0.75rem 0.85rem; }

.trip-card-body .trip-item-list + .trip-card-section-label,
.trip-card-body .trip-empty-places + .trip-card-section-label,
.trip-card-body .trip-flight-list + .trip-card-section-label,
.trip-card-body .trip-lodging-list + .trip-card-section-label {
  margin-top: 1.1rem;
}

.trip-stay-prefill {
  margin: 0.15rem 0 0.65rem;
}

.modal-header > .button {
  flex-shrink: 0;
  white-space: nowrap;
}

.trip-stay-card .trip-flight-results {
  margin-top: 0.55rem;
  gap: 0.45rem;
}

.trip-stay-card .trip-card-section-label {
  margin-top: 0.85rem;
}

.trip-stay-card #tripStayDirectoryWrap .trip-card-section-label,
.trip-stay-card > .trip-card-section-label:first-of-type {
  margin-top: 0.35rem;
}

.trip-stay-list {
  gap: 0.4rem;
}

.trip-stay-row {
  align-items: center;
  gap: 0.65rem;
  padding: 0.55rem 0.7rem;
  border-radius: 0.85rem;
}

.trip-stay-row .trip-item-copy strong {
  margin-bottom: 0.05rem;
  line-height: 1.25;
  font-size: 0.95rem;
}

.trip-stay-partner-note {
  margin-top: 0.1rem;
  font-size: 0.78rem;
  line-height: 1.3;
}

.trip-stay-row-actions {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.35rem;
  flex: 0 0 auto;
  max-width: 100%;
}

.trip-stay-row-actions .button {
  white-space: nowrap;
  flex: 0 0 auto;
  padding: 0.32rem 0.58rem;
  font-size: 0.78rem;
  line-height: 1.2;
}

.trip-stay-directory-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.25rem 0.55rem;
  margin: 0.1rem 0 0;
  font-size: 0.8rem;
}

.trip-stay-directory-meta .trip-stay-open-link {
  font-size: inherit;
}

.trip-stay-stars .hotel-stars-badge {
  vertical-align: middle;
  min-height: 1.35rem;
  padding: 0.12rem 0.4rem;
  font-size: 0.72rem;
}

.trip-stay-secondary-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.65rem;
  margin-top: 0.2rem;
}

.trip-stay-open-link {
  appearance: none;
  border: 0;
  background: none;
  padding: 0;
  margin: 0;
  color: color-mix(in srgb, var(--accent) 82%, var(--text));
  font: inherit;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.3;
  text-decoration: underline;
  text-underline-offset: 0.12em;
  cursor: pointer;
}

a.trip-stay-open-link {
  display: inline;
}

.trip-stay-rates-note {
  margin: 0.45rem 0 0;
  font-size: 0.78rem;
}

.trip-lodging-address {
  display: inline-block;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.trip-lodging-nav-links {
  margin-top: 0.35rem;
}

.trip-lodging-item.trip-stay-row {
  align-items: center;
}

@media (max-width: 720px) {
  .trip-stay-row {
    flex-direction: column;
    align-items: stretch;
    gap: 0.45rem;
    padding: 0.6rem 0.65rem;
  }
  .trip-stay-row-actions {
    width: 100%;
    flex-wrap: nowrap;
    justify-content: stretch;
  }
  .trip-stay-row-actions .button {
    flex: 1 1 0;
    width: auto;
    min-width: 0;
  }
  /* Keep Book/Save on one line — override generic trip action stacking */
  .trip-lodging-item .trip-item-actions.trip-stay-row-actions,
  #tripStayModal .trip-item-actions.trip-stay-row-actions,
  #tripRailModal .trip-item-actions.trip-stay-row-actions,
  #tripBusModal .trip-item-actions.trip-stay-row-actions {
    width: 100%;
  }
  #tripStayModal .trip-item-actions.trip-stay-row-actions .button,
  #tripRailModal .trip-item-actions.trip-stay-row-actions .button,
  #tripBusModal .trip-item-actions.trip-stay-row-actions .button,
  .trip-lodging-item .trip-item-actions.trip-stay-row-actions .button {
    flex: 1 1 0;
    width: auto;
    min-width: 0;
  }
}

.trip-flight-card {
  width: min(100%, 52rem);
  max-height: min(92vh, 54rem);
  overflow: auto;
}

.trip-flight-form { margin-top: 0.35rem; }

.trip-train-leg-price-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.trip-flight-results {
  margin-top: 1rem;
  display: grid;
  gap: 0.7rem;
  min-width: 0;
}

.trip-flight-results-heading {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 850;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.trip-item-list {
  display: grid;
  gap: 0.55rem;
  padding: 0;
  margin: 0 0 0.35rem;
  list-style: none;
}

.trip-item-list li,
.trip-item {
  display: flex;
  justify-content: space-between;
  gap: 0.85rem;
  align-items: flex-start;
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  border-radius: 0.9rem;
  padding: 0.75rem 0.8rem;
  background: color-mix(in srgb, var(--surface-soft) 55%, transparent);
}

.trip-item-copy {
  min-width: 0;
  flex: 1 1 auto;
}

.trip-item-copy strong {
  display: block;
  margin-bottom: 0.15rem;
}

.trip-flight-item-title {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-bottom: 0.15rem;
}

.trip-flight-item-title strong {
  margin-bottom: 0;
}

.trip-flight-item-date {
  font-weight: 400;
  font-size: 0.86rem;
  color: var(--muted);
}

.trip-item-note {
  margin: 0.45rem 0 0;
  color: color-mix(in srgb, var(--text) 90%, var(--muted));
  white-space: pre-wrap;
}

.trip-item-actions {
  flex: 0 0 auto;
}

.trip-empty-places {
  margin: 0 0 0.35rem;
  padding: 1rem 1.05rem;
  border: 1px dashed color-mix(in srgb, var(--accent) 35%, var(--border));
  border-radius: 0.95rem;
  background: color-mix(in srgb, var(--surface-soft) 45%, transparent);
}

.trip-empty-places p {
  margin: 0 0 0.25rem;
  font-weight: 700;
}

#tripDateDuration {
  margin: -.15rem 0 .15rem;
  font-weight: 700;
  color: var(--accent);
}
#tripDateDuration.is-warning {
  color: #9a3412;
}

.trip-card-actions {
  padding: 0.85rem 1.15rem 1.1rem;
  border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
  margin-top: 0.55rem;
  background: color-mix(in srgb, var(--surface-soft) 35%, transparent);
}

.empty-state.compact {
  padding: 0.75rem;
  margin: 0.75rem 0;
}

@media (max-width: 720px) {
  .trip-card-header,
  .trip-card-body,
  .trip-card-actions {
    padding-left: 0.95rem;
    padding-right: 0.95rem;
  }
  .trip-item,
  .trip-item-list li,
  .trip-flight-item,
  .trip-flight-offer {
    flex-direction: column;
    align-items: stretch;
    gap: 0.65rem;
  }
  .trip-flight-item,
  .trip-flight-offer {
    padding: 0.7rem 0.75rem;
  }
  .trip-item-copy,
  .trip-flight-item .trip-item-copy,
  .trip-flight-offer .trip-item-copy {
    width: 100%;
    min-width: 0;
  }
  .trip-flight-meta {
    gap: 0.15rem 0.55rem;
  }
  .trip-item-actions,
  .trip-card-actions,
  .trip-flight-item .trip-item-actions {
    width: 100%;
  }
  .trip-item-actions .button,
  .trip-card-actions .button,
  .trip-flight-item .trip-item-actions .button,
  .trip-flight-offer > .button {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
  }
  /* Stay finder / lodging: keep Book + Save on one line */
  #tripStayModal .trip-stay-row,
  #tripRailModal .trip-stay-row,
  #tripBusModal .trip-stay-row,
  .trip-lodging-item.trip-stay-row {
    gap: 0.45rem;
    padding: 0.6rem 0.65rem;
  }
  #tripStayModal .trip-stay-row-actions,
  #tripRailModal .trip-stay-row-actions,
  #tripBusModal .trip-stay-row-actions,
  .trip-lodging-item .trip-stay-row-actions {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    gap: 0.35rem;
  }
  #tripStayModal .trip-stay-row-actions .button,
  #tripRailModal .trip-stay-row-actions .button,
  #tripBusModal .trip-stay-row-actions .button,
  .trip-lodging-item .trip-stay-row-actions .button {
    flex: 1 1 0;
    width: auto;
    min-width: 0;
    white-space: nowrap;
  }
  .trip-flight-card {
    width: 100%;
    max-width: 100%;
    margin: 0;
    border-radius: 1.1rem;
    padding: 1rem 0.9rem;
  }
  .trip-flight-form.inline-form,
  .trip-flight-form.wide-form {
    grid-template-columns: minmax(0, 1fr);
  }
  .trip-flight-form .form-actions {
    flex-direction: column;
    align-items: stretch;
  }
  .trip-flight-form .form-actions .button {
    width: 100%;
  }
  .trip-flight-form label,
  .trip-flight-form input,
  .trip-flight-form select {
    min-width: 0;
    max-width: 100%;
  }
}


.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: grid;
  place-items: center;
  padding: 1rem;
  background: rgba(0, 0, 0, 0.58);
}

/* Leave-site warning must sit above Find flights / Find accommodation / Find trains / Find bus / trip selector
   (same z-index + later DOM siblings would otherwise cover Continue). */
#externalLinkModal {
  z-index: 70;
}

.modal-card {
  width: min(720px, 100%);
  max-height: 88vh;
  overflow: auto;
  border: 1px solid var(--border);
  border-radius: 1.4rem;
  padding: 1.2rem;
  background: var(--surface);
  box-shadow: var(--shadow);
}

.modal-header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 1rem;
}

.modal-header h2 { margin-top: 0; font-size: clamp(1.3rem, 2.4vw, 1.75rem); line-height: 1.25; }

.trip-selector-list {
  display: grid;
  gap: 0.65rem;
  margin: 1rem 0;
}

.trip-selector-option {
  display: flex;
  align-items: flex-start;
  gap: 0.8rem;
  border: 1px solid var(--border);
  border-radius: 1rem;
  padding: 0.85rem;
  background: var(--surface-soft);
  cursor: pointer;
}

.trip-selector-option input { width: auto; margin-top: 0.2rem; }
.trip-selector-option small { display: block; color: var(--muted); margin-top: 0.2rem; }
.trip-selector-option.already-added { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, var(--surface-soft)); }
.modal-actions { margin-top: 1rem; }

.external-link-modal-card {
  width: min(30rem, 100%);
  padding: 1rem 1.1rem 1.05rem;
  border-radius: 1.1rem;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--surface-soft) 72%, var(--surface)) 0%, var(--surface) 100%);
  border-color: color-mix(in srgb, var(--accent) 18%, var(--border));
  box-shadow: 0 16px 36px color-mix(in srgb, var(--accent) 14%, transparent);
}
.external-link-modal-header {
  align-items: flex-start;
  flex-direction: row;
  gap: 0.75rem;
  margin-bottom: 0.55rem;
}
.external-link-modal-intro {
  min-width: 0;
  flex: 1;
}
.external-link-modal-card .eyebrow {
  margin: 0 0 0.28rem;
  font-size: 0.68rem;
  letter-spacing: 0.14em;
}
.external-link-modal-card h2 {
  margin: 0;
  font-size: clamp(1.15rem, 2.6vw, 1.4rem);
  line-height: 1.25;
  font-weight: 750;
}
.external-link-close {
  flex: 0 0 auto;
  display: inline-grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  margin: -0.15rem -0.2rem 0 0;
  padding: 0;
  border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--border));
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface-soft) 80%, var(--surface));
  color: var(--text);
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
  white-space: nowrap;
}
.external-link-close:hover {
  border-color: color-mix(in srgb, var(--accent) 40%, var(--border));
  background: color-mix(in srgb, var(--accent) 10%, var(--surface));
}
.external-link-close:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--accent) 55%, transparent);
  outline-offset: 2px;
}
.external-link-body {
  margin: 0;
  color: var(--muted);
  font-size: 0.92rem;
  line-height: 1.45;
}
.external-link-destination {
  display: grid;
  gap: 0.2rem;
  margin: 0.75rem 0 0;
  padding: 0.55rem 0.7rem;
  border: 1px solid color-mix(in srgb, var(--accent) 12%, var(--border));
  border-radius: 0.7rem;
  background: color-mix(in srgb, var(--surface-soft) 88%, var(--surface));
  min-width: 0;
}
.external-link-destination-label {
  font-size: 0.68rem;
  font-weight: 750;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
}
.external-link-destination-url {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.78rem;
  line-height: 1.35;
  color: var(--accent-strong);
  text-decoration: none;
}
.external-link-destination-url:hover {
  text-decoration: underline;
}
.external-link-modal-actions {
  margin-top: 0.9rem;
  gap: 0.55rem;
}
.external-link-modal-actions .button {
  padding: 0.55rem 0.95rem;
  font-size: 0.9rem;
}
.place-advert-actions-card { max-width: 26rem; }
.place-advert-actions-buttons {
  margin-top: 0.9rem;
  flex-direction: column;
  align-items: stretch;
}
.place-advert-actions-buttons .button {
  width: 100%;
  text-align: center;
  padding: 0.75rem 1rem;
}

html[data-theme="plum_mist"] .external-link-modal-card,
html[data-theme="plum_mist_motion"] .external-link-modal-card {
  background:
    linear-gradient(165deg, color-mix(in srgb, var(--lavender) 55%, var(--surface)) 0%, var(--surface) 62%);
  border-color: color-mix(in srgb, var(--accent) 22%, var(--border));
  box-shadow: 0 18px 40px rgba(68, 31, 92, 0.14);
}
html[data-theme="plum_mist"] .external-link-destination,
html[data-theme="plum_mist_motion"] .external-link-destination {
  background: color-mix(in srgb, var(--mist-wash) 70%, var(--surface));
  border-color: color-mix(in srgb, var(--accent) 16%, var(--border));
}

@media (max-width: 640px) {
  .modal-card { border-radius: 1rem; padding: 1rem; }
  .modal-header { align-items: stretch; flex-direction: column; }
  .external-link-modal-card {
    padding: 0.9rem 0.95rem 0.95rem;
    border-radius: 1rem;
  }
  .external-link-modal-header {
    align-items: flex-start;
    flex-direction: row;
  }
  .external-link-modal-actions {
    width: 100%;
  }
  .external-link-modal-actions .button {
    flex: 1 1 auto;
  }
}

/* v0.6.2 Location search foundation */
.search-panel {
  display: grid;
  gap: 0.8rem;
  padding: 1rem;
  margin: 0 0 1rem;
  border: 1px solid var(--border);
  border-radius: 1rem;
  background: var(--surface-soft);
}

.location-search-panel label {
  display: grid;
  gap: 0.35rem;
  font-weight: 700;
}

.search-results {
  display: grid;
  gap: 1rem;
}

.search-result-group {
  padding: 0.85rem;
  border: 1px solid var(--border);
  border-radius: 0.9rem;
  background: var(--surface);
}

.search-result-group h3 {
  margin: 0 0 0.65rem;
}

.search-result-list {
  display: grid;
  gap: 0.5rem;
}

.search-result-item {
  display: grid;
  gap: 0.2rem;
  width: 100%;
  padding: 0.75rem;
  border: 1px solid var(--border);
  border-radius: 0.75rem;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.search-result-item:hover,
.search-result-item:focus-visible {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent);
  outline: none;
}

/* v0.6.3 Locations search UX polish */
.compact-search-panel {
  padding: 0.85rem;
  gap: 0.55rem;
}
.search-row {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto;
  gap: 0.75rem;
  align-items: end;
}
.compact-actions {
  margin: 0;
  white-space: nowrap;
}
.search-results {
  grid-template-columns: 1fr;
  align-items: stretch;
  gap: 0.75rem;
}
.search-result-group {
  padding: 0.7rem;
}
.search-result-details {
  margin: 0;
}
.search-result-details > summary {
  list-style: none;
}
.search-result-details > summary::-webkit-details-marker {
  display: none;
}
.search-result-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0;
  cursor: pointer;
  user-select: none;
  border-radius: 0.55rem;
  padding: 0.15rem 0.2rem;
}
.search-result-details[open] > .search-result-heading {
  margin-bottom: 0.55rem;
}
.search-result-heading:hover,
.search-result-heading:focus-visible {
  outline: none;
  background: color-mix(in srgb, var(--accent) 10%, transparent);
}
.search-result-heading-main {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 0;
}
.search-result-chevron {
  width: 0.55rem;
  height: 0.55rem;
  border-right: 2px solid var(--muted);
  border-bottom: 2px solid var(--muted);
  transform: rotate(-45deg);
  transition: transform 0.15s ease;
  flex: 0 0 auto;
}
.search-result-details[open] > .search-result-heading .search-result-chevron {
  transform: rotate(45deg);
}
.search-result-heading h3 {
  margin: 0;
  font-size: 0.95rem;
}
.search-result-item {
  position: relative;
  padding-right: 3.8rem;
}
.search-result-title {
  font-weight: 800;
}
.search-result-summary {
  color: var(--muted);
  font-size: 0.88rem;
}
.search-result-more {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 0.65rem 0.15rem 0.15rem;
}
.search-result-more .button {
  min-height: 2rem;
}
.search-result-action {
  position: absolute;
  right: 0.75rem;
  top: 0.75rem;
  color: var(--accent);
  font-size: 0.78rem;
  font-weight: 800;
}
.compact-empty {
  padding: 0.75rem;
}
.selected-location-banner {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.75rem 0.9rem;
  border: 1px solid var(--accent);
  border-radius: 1rem;
  background: color-mix(in srgb, var(--accent) 12%, transparent);
}
.selected-location-card {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 14%, transparent);
}
@media (max-width: 900px) {
  .search-row {
    grid-template-columns: 1fr;
  }
  .compact-actions {
    white-space: normal;
  }
}
.brand { text-decoration: none; color: inherit; min-width: 0; max-width: 100%; }
.logo-mark.has-logo { background: transparent; box-shadow: none; overflow: hidden; }
.logo-mark img { width: 100%; height: 100%; object-fit: contain; display: block; border-radius: inherit; }
.header-left {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  min-width: 0;
  flex: 1 1 auto;
}
.header-right { display: flex; align-items: center; justify-content: flex-end; gap: 1rem; flex: 0 0 auto; }
.language-switcher {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  max-width: 100%;
  z-index: 40;
}
.language-switcher-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  margin: 0;
  min-width: 0;
  max-width: min(100vw - 8rem, 14rem);
  min-height: 2.15rem;
  padding: 0.28rem 0.55rem 0.28rem 0.4rem;
  border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface) 92%, transparent);
  color: var(--text);
  cursor: pointer;
  line-height: 1.15;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
.language-switcher-toggle:hover,
.language-switcher-toggle:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 40%, var(--border));
  background: color-mix(in srgb, var(--accent) 10%, var(--surface));
  outline: none;
}
.language-switcher.is-open .language-switcher-toggle {
  border-color: color-mix(in srgb, var(--accent) 40%, var(--border));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 18%, transparent);
}
.language-switcher-caret {
  width: 0.35rem;
  height: 0.35rem;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg) translateY(-1px);
  opacity: 0.7;
  flex: 0 0 auto;
}
.language-switcher.is-open .language-switcher-caret {
  transform: rotate(-135deg) translateY(-1px);
}
.language-switcher-list {
  position: absolute;
  top: calc(100% + 0.35rem);
  right: 0;
  left: auto;
  margin: 0;
  padding: 0.28rem;
  list-style: none;
  min-width: max(12.5rem, 100%);
  width: max-content;
  max-width: min(90vw, 18rem);
  border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
  border-radius: 0.85rem;
  background: color-mix(in srgb, var(--surface) 96%, transparent);
  box-shadow: 0 14px 36px rgba(15, 23, 42, 0.18);
  display: grid;
  gap: 0.15rem;
  z-index: 50;
}
.language-switcher-list.hidden {
  display: none;
}
.language-flag-button {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.55rem;
  width: 100%;
  margin: 0;
  min-height: 2.25rem;
  padding: 0.35rem 0.65rem 0.35rem 0.4rem;
  border: 1px solid transparent;
  border-radius: 0.65rem;
  background: transparent;
  color: var(--text);
  cursor: pointer;
  line-height: 1.2;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  text-align: left;
}
.language-flag-button:hover,
.language-flag-button:focus-visible {
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  outline: none;
}
.language-flag-button.is-active {
  border-color: color-mix(in srgb, var(--accent) 40%, var(--border));
  background: color-mix(in srgb, var(--accent) 12%, var(--surface));
}
.language-flag {
  width: 1.35rem;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 0.15rem;
  display: block;
  flex: 0 0 auto;
  box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.12);
  pointer-events: none;
}
.language-flag-code,
.language-flag-label {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  pointer-events: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.main-nav {
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  gap: 0;
  flex-wrap: nowrap;
  width: 100%;
  max-width: 62rem;
  margin: 0 auto;
  padding: 0.2rem 0 0.15rem;
}
.main-nav > a,
.main-nav > .nav-dropdown {
  flex: 1 1 0;
  text-align: center;
  min-width: 0;
}
.main-nav > a {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.08rem;
  padding: 0.4rem 0.5rem 0.45rem;
  border-radius: 0.7rem;
  min-width: 0;
}
.main-nav > a:hover,
.main-nav > a.active-nav-link {
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 10%, transparent);
}
.main-nav > a strong,
.main-nav .nav-dropdown-trigger strong {
  font-weight: 700;
  font-size: 0.92rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.main-nav > a small,
.main-nav .nav-dropdown-trigger small {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 600;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.nav-dropdown-trigger > span:first-child {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.08rem;
  min-width: 0;
}
.main-nav-mobile-only { display: none !important; }
.header-utils {
  display: inline-flex;
  align-items: center;
  gap: 0;
  flex: 0 0 auto;
}
.header-util-link {
  color: var(--muted);
  text-decoration: none;
  font-weight: 700;
  font-size: 0.88rem;
  padding: 0.45rem 0.7rem;
  border-radius: 0.65rem;
  white-space: nowrap;
}
.header-util-link:hover,
.header-util-link.active-nav-link {
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 10%, transparent);
}
.header-nav-divider {
  width: 1px;
  height: 1.35rem;
  background: color-mix(in srgb, var(--border) 92%, var(--text));
  margin: 0 0.35rem;
  flex: 0 0 auto;
}
.nav-dropdown {
  position: relative;
  display: flex;
  justify-content: center;
}
.nav-dropdown-trigger {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--muted);
  font: inherit;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  width: 100%;
  padding: 0.4rem 0.5rem 0.45rem;
  border-radius: 0.7rem;
}
.nav-dropdown-trigger:hover,
.nav-dropdown.is-open > .nav-dropdown-trigger,
.nav-dropdown-trigger.active-nav-link {
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 10%, transparent);
}
.nav-dropdown-caret {
  width: 0;
  height: 0;
  border-left: 0.28rem solid transparent;
  border-right: 0.28rem solid transparent;
  border-top: 0.32rem solid currentColor;
  opacity: 0.75;
  transition: transform 0.18s ease;
}
.nav-dropdown.is-open .nav-dropdown-caret {
  transform: rotate(180deg);
}
.nav-dropdown-menu {
  position: absolute;
  top: calc(100% + 0.45rem);
  left: 50%;
  transform: translateX(-50%) translateY(-4px);
  min-width: 16rem;
  padding: 0.4rem;
  border: 1px solid var(--border);
  border-radius: 1rem;
  background: var(--surface);
  box-shadow: var(--shadow);
  z-index: 60;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.16s ease, transform 0.16s ease, visibility 0.16s;
  text-align: left;
}
.nav-dropdown.is-open .nav-dropdown-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.nav-dropdown-menu a {
  display: grid;
  gap: 0.12rem;
  padding: 0.7rem 0.75rem;
  border-radius: 0.75rem;
  text-decoration: none;
  color: inherit;
  white-space: normal;
}
.nav-dropdown-menu a:hover,
.nav-dropdown-menu a:focus-visible,
.nav-dropdown-menu a.active-nav-link {
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  color: var(--accent);
  outline: none;
}
.nav-dropdown-menu strong {
  font-size: 0.9rem;
}
.nav-dropdown-menu small {
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 600;
}
.profile-menu-wrap { position: relative; }
.profile-menu-button {
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.4rem 0.75rem 0.4rem 0.4rem;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 8px 22px rgba(0,0,0,0.08);
}
.profile-avatar {
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: var(--accent);
  color: var(--accent-contrast, white);
  font-weight: 900;
  letter-spacing: 0.03em;
  overflow: hidden;
  flex-shrink: 0;
}
.profile-avatar-guest {
  background: color-mix(in srgb, var(--accent) 88%, #000 12%);
}
.profile-guest-icon {
  display: block;
  width: 1.05rem;
  height: 1.05rem;
}
.profile-avatar.has-photo {
  background: transparent;
  padding: 0;
}
.profile-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.profile-picture-section {
  margin: 1.1rem 0 1.35rem;
  padding-top: 0.85rem;
  border-top: 1px solid var(--border);
}
.profile-picture-heading {
  margin: 0 0 0.35rem;
  font-size: 1rem;
}
.profile-picture-row {
  display: flex;
  gap: 1rem;
  align-items: center;
  margin-top: 0.75rem;
}
.profile-picture-preview {
  width: 5rem;
  height: 5rem;
  border-radius: 999px;
  overflow: hidden;
  background: var(--accent);
  color: var(--accent-contrast, white);
  display: grid;
  place-items: center;
  font-weight: 900;
  font-size: 1.45rem;
  letter-spacing: 0.03em;
  flex-shrink: 0;
}
.profile-picture-preview.has-photo {
  background: transparent;
}
.profile-picture-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.profile-picture-controls {
  display: grid;
  gap: 0.5rem;
  flex: 1;
  min-width: 0;
}
.profile-picture-file-label {
  display: grid;
  gap: 0.35rem;
  font-size: 0.86rem;
  color: var(--muted);
}
.profile-picture-file-label input[type="file"] {
  width: 100%;
  max-width: 100%;
}
.profile-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 0.6rem);
  min-width: 13rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 1rem;
  padding: 0.45rem;
  box-shadow: var(--shadow);
  z-index: 30;
}
.profile-menu a,
.profile-menu-action {
  width: 100%;
  border: 0;
  background: transparent;
  color: var(--text);
  text-decoration: none;
  font: inherit;
  font-weight: 800;
  text-align: left;
  display: block;
  border-radius: 0.75rem;
  padding: 0.65rem 0.75rem;
  cursor: pointer;
}
.profile-menu a:hover,
.profile-menu-action:hover { background: var(--surface-soft); color: var(--accent); }
@media (max-width: 860px) and (min-width: 761px) {
  .site-header { align-items: stretch; }
  .header-top-row {
    flex-wrap: wrap;
    gap: 0.55rem;
  }
  .header-left {
    flex: 1 1 auto;
    min-width: 0;
    gap: 0.55rem;
  }
  .header-right {
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.45rem;
  }
  .main-nav {
    max-width: none;
    font-size: 0.86rem;
  }
  .main-nav > a,
  .nav-dropdown-trigger {
    font-size: 0.86rem;
    padding: 0.5rem 0.4rem;
  }
  .brand { min-width: 0; }
  .brand p { display: none; }
}

/* v0.6.5 profile menu and navigation polish */
.profile-menu { min-width: 16rem; }
.profile-menu.is-guest-auth {
  /* Size from the viewport — not the narrow Sign in button wrap */
  width: 22.5rem;
  min-width: 0;
  max-width: min(22.5rem, calc(100vw - 1.5rem));
  max-height: min(80vh, 42rem);
  overflow-x: hidden;
  overflow-y: auto;
  padding: 0.55rem;
}
.profile-menu.is-guest-auth .guest-auth-menu,
.profile-menu.is-guest-auth .guest-auth-form,
.profile-menu.is-guest-auth .guest-auth-links,
.profile-menu.is-guest-auth .guest-auth-link-row,
.profile-menu.is-guest-auth .password-input-wrap {
  max-width: 100%;
  min-width: 0;
}
.profile-menu:not(.is-guest-auth) {
  min-width: 16rem;
  width: auto;
  max-height: none;
  overflow: visible;
}
.guest-auth-menu {
  display: grid;
  gap: 0.45rem;
  padding: 0.1rem 0.15rem 0.25rem;
}
.guest-auth-form {
  display: grid;
  gap: 0.55rem;
}
.guest-auth-success {
  display: grid;
  gap: 0.6rem;
  padding: 0.4rem 0.1rem 0.2rem;
  text-align: center;
}
.guest-auth-success-title {
  margin: 0;
  font-weight: 700;
  font-size: 1.02rem;
}
.guest-auth-success-message {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}
.guest-auth-success .button {
  justify-self: center;
}
.guest-login-form {
  gap: 0.4rem;
}
.guest-login-form .guest-auth-form-header {
  margin: 0;
}
.guest-login-form .guest-auth-form-header h3 {
  margin: 0 0 0.1rem;
  font-size: 0.98rem;
}
.guest-login-form > label {
  gap: 0.2rem;
}
.guest-login-form .oauth-actions:not(.has-oauth) {
  display: none;
}
.guest-login-form .oauth-actions.has-oauth {
  margin-top: 0.15rem;
}
.guest-auth-form-compact {
  gap: 0.4rem;
  padding-top: 0.2rem;
}
.guest-auth-form-header h3 {
  margin: 0;
  font-size: 1rem;
}
.guest-auth-form label {
  display: grid;
  gap: 0.3rem;
  font-size: 0.86rem;
  font-weight: 700;
}
.guest-auth-form-compact label {
  gap: 0.2rem;
  font-size: 0.78rem;
}
.guest-auth-form input {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
.guest-auth-form-compact input,
.guest-auth-form-compact .password-input-wrap input {
  padding: 0.45rem 0.6rem;
  font-size: 0.9rem;
}
.guest-auth-form .button {
  width: 100%;
}
.guest-auth-form-compact .button {
  padding: 0.5rem 0.75rem;
  font-size: 0.88rem;
}
.guest-auth-form .auth-helper,
.guest-auth-form .note {
  margin: 0;
  font-size: 0.82rem;
}
.guest-auth-form-compact .auth-helper,
.guest-auth-form-compact .note,
.guest-auth-form-compact .form-message {
  font-size: 0.75rem;
  line-height: 1.35;
}
.guest-auth-form .oauth-actions {
  display: grid;
  gap: 0.4rem;
}
.guest-auth-form-compact .oauth-actions {
  gap: 0.3rem;
}
.guest-auth-form .oauth-button {
  width: 100%;
  text-align: center;
}
.guest-auth-form-compact .oauth-button {
  padding: 0.45rem 0.65rem;
  font-size: 0.82rem;
}
.guest-auth-form-compact .auth-divider {
  margin: 0.15rem 0;
  font-size: 0.72rem;
}
.guest-auth-links {
  display: grid;
  gap: 0.35rem;
  margin-top: 0.15rem;
}
.guest-auth-link-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.55rem;
  align-items: stretch;
}
.guest-auth-link {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--accent);
  font: inherit;
  font-weight: 700;
  font-size: 0.84rem;
  padding: 0.4rem 0.25rem;
  border-radius: 0.45rem;
  cursor: pointer;
  text-align: center;
  width: 100%;
}
.guest-auth-link:hover,
.guest-auth-link:focus-visible {
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  outline: none;
}
.guest-auth-link.is-active {
  color: var(--text);
  box-shadow: inset 0 -2px 0 var(--accent);
}
.guest-auth-panel {
  padding-top: 0.15rem;
}
.guest-auth-banner {
  display: none;
}
.guest-auth-banner.hidden {
  display: none !important;
}
@media (max-width: 760px) {
  .guest-auth-banner:not(.hidden) {
    display: block;
    margin: 0;
    padding: 0.75rem 0.85rem 0.9rem;
    border-bottom: 1px solid var(--border);
    background:
      linear-gradient(180deg, color-mix(in srgb, var(--surface-soft) 70%, transparent), transparent 4.5rem),
      var(--surface);
  }
  .guest-auth-banner-inner {
    display: grid;
    gap: 0.7rem;
    width: min(100%, 28rem);
    margin: 0 auto;
  }
  .guest-auth-banner-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
  }
  .guest-auth-banner-copy {
    display: grid;
    gap: 0.15rem;
    min-width: 0;
  }
  .guest-auth-banner-copy strong {
    font-size: 1.05rem;
  }
  .guest-auth-banner-copy span {
    color: var(--muted);
    font-size: 0.88rem;
  }
  .guest-auth-banner-close {
    appearance: none;
    border: 1px solid var(--border);
    background: var(--surface-soft);
    color: var(--text);
    border-radius: 0.7rem;
    padding: 0.4rem 0.7rem;
    font: inherit;
    font-size: 0.82rem;
    font-weight: 700;
    cursor: pointer;
    flex: 0 0 auto;
  }
  .guest-auth-banner .guest-auth-menu {
    padding: 0;
  }
  .guest-auth-banner .guest-login-form .guest-auth-form-header h3 {
    font-size: 0.95rem;
  }
}
.menu-email-notice {
  display: grid;
  gap: 0.4rem;
  margin: 0.2rem 0 0.55rem;
  padding: 0.7rem 0.75rem;
  border: 1px solid color-mix(in srgb, var(--accent) 35%, var(--border));
  border-radius: 0.85rem;
  background: color-mix(in srgb, var(--accent) 10%, transparent);
}
.menu-email-notice strong,
.menu-email-notice span {
  display: block;
}
.menu-email-notice span {
  color: var(--muted);
  font-size: 0.82rem;
}
.menu-email-notice .button {
  width: 100%;
}
.profile-menu-summary {
  padding: 0.75rem 0.8rem;
  border-bottom: 1px solid var(--border);
  margin-bottom: 0.35rem;
}
.profile-menu-summary strong,
.profile-menu-summary span,
.profile-menu-summary small { display: block; }
.profile-menu-summary strong { color: var(--text); font-size: 0.98rem; }
.profile-menu-summary span { color: var(--muted); font-size: 0.86rem; margin-top: 0.2rem; overflow-wrap: anywhere; }
.profile-menu-summary small { color: var(--muted); font-size: 0.78rem; margin-top: 0.25rem; text-transform: capitalize; }
.profile-menu-group { padding: 0.3rem 0; border-bottom: 1px solid var(--border); }
.profile-menu-group:last-of-type { border-bottom: 0; }
.profile-menu-heading {
  display: block;
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.35rem 0.75rem 0.15rem;
}
.notifications-menu-button { width: 100%; min-height: 2.65rem; display: flex; align-items: center; gap: 0.55rem; padding: 0.55rem 0.75rem; border: 0; border-radius: 0.7rem; background: transparent; color: var(--text); font: inherit; font-weight: 750; text-align: left; cursor: pointer; }
.notifications-menu-button:hover, .notifications-menu-button[aria-expanded="true"] { background: var(--surface-soft); color: var(--accent); }
.notifications-unread-badge { margin-left: auto; min-width: 1.4rem; height: 1.4rem; display: inline-grid; place-items: center; padding: 0 0.35rem; border-radius: 999px; background: #e9486d; color: #fff; font-size: 0.72rem; font-weight: 900; }
.notifications-menu-panel { margin: 0.2rem 0.45rem 0.5rem; border: 1px solid var(--border); border-radius: 0.8rem; background: var(--surface); box-shadow: 0 12px 30px rgba(10, 20, 35, 0.14); overflow: hidden; }
.notifications-menu-header { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; padding: 0.65rem 0.7rem; border-bottom: 1px solid var(--border); font-size: 0.78rem; }
.notifications-menu-header button { border: 0; background: transparent; color: var(--accent); font: inherit; font-weight: 750; cursor: pointer; }
.notifications-menu-list { max-height: min(21rem, 55vh); overflow-y: auto; }
.notification-item { width: 100%; display: grid; grid-template-columns: 1.6rem minmax(0, 1fr); gap: 0.5rem; padding: 0.7rem; border: 0; border-bottom: 1px solid var(--border); background: transparent; color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.notification-item:last-child { border-bottom: 0; }
.notification-item:hover { background: var(--surface-soft); }
.notification-item.is-unread { background: color-mix(in srgb, var(--accent) 10%, var(--surface)); }
.notification-item.is-unread strong::after { content: ""; display: inline-block; width: 0.42rem; height: 0.42rem; margin-left: 0.4rem; border-radius: 50%; background: var(--accent); vertical-align: middle; }
.notification-item strong, .notification-item small, .notification-item time { display: block; }
.notification-item strong { font-size: 0.82rem; line-height: 1.3; }
.notification-item small { margin-top: 0.18rem; color: var(--muted); font-size: 0.76rem; line-height: 1.35; }
.notification-item time { margin-top: 0.28rem; color: var(--muted); font-size: 0.69rem; }
.notification-item-icon { padding-top: 0.05rem; }
.notifications-empty { margin: 0; padding: 1rem 0.75rem; text-align: center; }
.profile-menu-action { margin-top: 0.3rem; color: var(--danger, #ef4444); }
.profile-menu-button:focus-visible,
.main-nav a:focus-visible,
.profile-menu a:focus-visible,
.profile-menu-action:focus-visible {
  outline: 3px solid rgba(94, 210, 236, 0.35);
  outline-offset: 2px;
}
@media (max-width: 760px) {
  #profileMenuLabel { display: none; }
  .profile-menu-button { padding: 0.35rem; }
  .profile-menu-button.is-guest {
    padding: 0.4rem;
  }
  .profile-menu-button.is-guest #profileMenuLabel {
    display: none;
  }
  /* iOS: avoid zoom/clip when focusing login fields */
  .guest-auth-form input,
  .guest-auth-form-compact input,
  .guest-auth-form-compact .password-input-wrap input {
    font-size: 16px;
  }
  .guest-auth-form input:focus {
    outline: 2px solid color-mix(in srgb, var(--accent) 55%, transparent);
    outline-offset: -1px;
  }
}

/* v0.7.0 location-first country/city pages */
.location-context-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.75rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.location-context-header-main {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  min-width: 0;
}
.location-context-header-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.35rem;
  max-width: 16rem;
}
.location-context-header-actions .button {
  white-space: nowrap;
}
.compact-refresh-message {
  margin: 0;
  text-align: right;
  font-size: 0.85rem;
  max-width: 16rem;
}
@media (max-width: 720px) {
  .location-context-header {
    grid-template-columns: 1fr;
  }
  .location-context-header-actions {
    align-items: flex-start;
    max-width: none;
  }
  .compact-refresh-message { text-align: left; }
}
.country-section-nav {
  margin: 0 0 1.25rem;
  padding: 0.85rem 1rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: color-mix(in srgb, var(--surface-soft) 70%, var(--surface));
}
.country-section-nav-label {
  margin: 0 0 0.55rem;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--accent);
}
.country-section-nav-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 0.55rem;
}
.country-section-nav-item {
  position: relative;
}
.country-section-nav-link {
  appearance: none;
  margin: 0;
  padding: 0.4rem 0.75rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  font: inherit;
  font-size: 0.88rem;
  font-weight: 600;
  line-height: 1.3;
  cursor: pointer;
  text-decoration: none;
}
.country-section-nav-link:hover,
.country-section-nav-link:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 55%, var(--border));
  color: var(--accent-strong);
  outline: none;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 28%, transparent);
}
.country-section-nav-preview {
  display: none;
  position: absolute;
  left: 0;
  top: calc(100% + 0.45rem);
  z-index: 40;
  width: min(18.5rem, calc(100vw - 2.5rem));
  padding: 0.75rem 0.85rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface);
  box-shadow: var(--shadow);
  color: var(--text);
  pointer-events: none;
}
.country-section-nav-preview strong {
  display: block;
  margin: 0 0 0.35rem;
  font-size: 0.92rem;
  color: var(--text);
}
.country-section-nav-preview p {
  margin: 0;
  font-size: 0.84rem;
  line-height: 1.4;
  color: var(--muted);
  font-weight: 400;
}
.country-section-nav-item:hover .country-section-nav-preview,
.country-section-nav-item:focus-within .country-section-nav-preview {
  display: block;
}
@media (max-width: 720px) {
  .country-section-nav-preview {
    left: 50%;
    transform: translateX(-50%);
  }
}
#country-section-nav,
#country-section-overview,
#country-section-states,
#country-section-info,
#country-section-exchange,
#country-section-advisory,
#country-section-vignette,
#country-section-advice,
#country-section-embassies,
#country-section-cities,
#country-section-places,
#country-section-experiences,
#country-section-safety {
  scroll-margin-top: 5.5rem;
}
.country-section-top-link {
  appearance: none;
  margin-left: auto;
  padding: 0.2rem 0.45rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  color: var(--accent);
  font: inherit;
  font-size: 0.78rem;
  font-weight: 650;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
  flex: 0 0 auto;
  align-self: center;
}
.country-section-top-link:hover,
.country-section-top-link:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 55%, var(--border));
  color: var(--accent-strong);
  outline: none;
}
.country-section-top-row {
  justify-content: flex-end;
  margin-bottom: 0.55rem;
}
.country-vignette-line .inline-text-link,
.country-meta .inline-text-link {
  appearance: none;
  margin: 0 0 0 0.45rem;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--accent);
  font: inherit;
  font-weight: 650;
  text-align: left;
  text-decoration: underline;
  text-underline-offset: 0.15em;
  cursor: pointer;
}
.country-vignette-line .inline-text-link:hover,
.country-vignette-line .inline-text-link:focus-visible,
.country-meta .inline-text-link:hover,
.country-meta .inline-text-link:focus-visible {
  color: var(--accent-strong);
  outline: none;
}
#countryPage,
#cityPage,
#continentPage {
  scroll-margin-top: 5.5rem;
}
.location-context-header .eyebrow,
.location-context-header h2,
.location-context-header p {
  flex-basis: 100%;
  margin: 0;
}
.location-context-card {
  margin-bottom: 1rem;
}
.location-context-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1rem;
  margin-bottom: 1rem;
}
.context-block {
  margin-top: 1.25rem;
}
.live-info-stack {
  display: grid;
  gap: 0.65rem;
}
.live-info-panel {
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 12px;
  padding: 0.65rem 0.85rem;
  background: rgba(0, 0, 0, 0.12);
}
.live-info-panel summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}
.live-info-panel summary::-webkit-details-marker { display: none; }
.live-info-panel summary small {
  opacity: 0.75;
}
.live-info-body {
  margin-top: 0.75rem;
}
.safety-contacts-panel {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}
.safety-contacts-panel > .section-heading-row {
  margin: 0 0 0.55rem;
  padding-bottom: 0.35rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
  align-items: center;
  gap: 0.65rem;
  flex-wrap: wrap;
}
.safety-contacts-panel > .section-heading-row h3 {
  margin: 0;
  font-size: 0.98rem;
}
.safety-contacts-panel .safety-card-list {
  margin-top: 0.35rem;
  min-width: 0;
}
.safety-contacts-panel .safety-card {
  min-width: 0;
  max-width: 100%;
}
.safety-contacts-panel .card-topline {
  flex-wrap: wrap;
  gap: 0.35rem 0.65rem;
  min-width: 0;
}
.travel-safety-source-grid {
  display: grid;
  gap: 0.85rem;
  margin-top: 0.75rem;
}
.travel-safety-source-card {
  border: 1px solid var(--border);
  border-radius: 1rem;
  padding: 0.9rem 1rem;
  background: color-mix(in srgb, var(--surface-soft) 55%, transparent);
}
.travel-safety-source-card h4 {
  margin: 0.35rem 0 0.45rem;
  font-size: 1.05rem;
}

.country-auto-refresh-status {
  margin: 0 0 0.75rem;
  padding: 0.65rem 0.8rem;
  border-radius: 12px;
  border: 1px solid rgba(34, 197, 94, 0.28);
  background: rgba(34, 197, 94, 0.1);
  font-size: 0.92rem;
}
.city-weather-block .button {
  margin-top: 0.35rem;
}
.city-weather-body {
  margin-top: 0.85rem;
}
.weather-current-card {
  --weather-sky-a: color-mix(in srgb, var(--surface-soft) 72%, white);
  --weather-sky-b: color-mix(in srgb, var(--lavender, var(--surface-soft)) 42%, var(--surface));
  --weather-sky-glow: color-mix(in srgb, var(--accent-soft) 20%, transparent);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--accent) 16%, var(--border));
  border-radius: 1rem;
  padding: 1rem 1.1rem;
  margin-bottom: 0.85rem;
  background:
    radial-gradient(ellipse 85% 70% at 94% 6%, var(--weather-sky-glow), transparent 58%),
    linear-gradient(148deg, var(--weather-sky-a) 0%, var(--weather-sky-b) 100%);
  box-shadow: 0 12px 30px color-mix(in srgb, var(--accent) 7%, transparent);
}
.weather-current-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 10% 88%, color-mix(in srgb, var(--mist-wash, var(--surface-soft)) 55%, transparent), transparent 46%),
    linear-gradient(112deg, color-mix(in srgb, white 28%, transparent) 0%, transparent 52%);
  opacity: 0.85;
}
.weather-current-card > *:not(.weather-current-icon-watermark) {
  position: relative;
  z-index: 1;
}
/* Condition icon wash — right side, full height, fades left (flag-watermark style) */
.weather-current-icon-watermark {
  display: block;
  position: absolute;
  inset: auto;
  right: -0.35rem;
  top: 50%;
  left: auto;
  bottom: auto;
  transform: translateY(-50%);
  height: 118%;
  width: auto;
  max-width: 58%;
  max-height: none;
  object-fit: contain;
  object-position: center right;
  opacity: 0.2;
  pointer-events: none;
  user-select: none;
  z-index: 0;
  mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.45) 36%, rgba(0, 0, 0, 0.92) 100%);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.45) 36%, rgba(0, 0, 0, 0.92) 100%);
}
.weather-current-card.weather-sky-clear {
  --weather-sky-a: color-mix(in srgb, #fff6df 38%, white);
  --weather-sky-b: color-mix(in srgb, var(--lavender, var(--surface-soft)) 48%, #f7f0fa);
  --weather-sky-glow: color-mix(in srgb, #e8d7a8 34%, transparent);
}
.weather-current-card.weather-sky-cloud {
  --weather-sky-a: color-mix(in srgb, var(--surface-soft) 80%, white);
  --weather-sky-b: color-mix(in srgb, var(--lavender, var(--surface-soft)) 62%, #e8e4ef);
  --weather-sky-glow: color-mix(in srgb, var(--accent) 10%, transparent);
}
.weather-current-card.weather-sky-fog {
  --weather-sky-a: color-mix(in srgb, #ece8f0 70%, white);
  --weather-sky-b: color-mix(in srgb, var(--lavender, var(--surface-soft)) 55%, #ddd8e4);
  --weather-sky-glow: color-mix(in srgb, var(--muted) 12%, transparent);
}
.weather-current-card.weather-sky-rain {
  --weather-sky-a: color-mix(in srgb, #e4e8f4 55%, white);
  --weather-sky-b: color-mix(in srgb, var(--lavender, var(--surface-soft)) 58%, #d8dceb);
  --weather-sky-glow: color-mix(in srgb, #7a8bb8 22%, transparent);
}
.weather-current-card.weather-sky-snow {
  --weather-sky-a: color-mix(in srgb, #f4f7fb 78%, white);
  --weather-sky-b: color-mix(in srgb, var(--lavender, var(--surface-soft)) 40%, #e8eef8);
  --weather-sky-glow: color-mix(in srgb, #b8c8e0 28%, transparent);
}
.weather-current-card.weather-sky-storm {
  --weather-sky-a: color-mix(in srgb, var(--surface-soft) 70%, #d8d0e4);
  --weather-sky-b: color-mix(in srgb, var(--accent) 10%, #ebe3f4);
  --weather-sky-glow: color-mix(in srgb, var(--accent) 18%, transparent);
}
.weather-current-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.4rem;
}
.weather-current-topline strong {
  font-size: 1.02rem;
  letter-spacing: -0.01em;
  color: var(--accent-strong, var(--text));
}
.weather-current-main {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  margin-bottom: 0.55rem;
}
.weather-current-temp {
  font-size: clamp(2rem, 4.2vw, 2.45rem);
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: var(--accent-strong, var(--text));
}
.weather-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.weather-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  filter: drop-shadow(0 2px 8px color-mix(in srgb, var(--accent) 16%, transparent));
}
.weather-icon-lg {
  width: 4.5rem;
  height: 4.5rem;
}
.weather-icon-md {
  width: 2.75rem;
  height: 2.75rem;
}
.weather-icon-sm {
  width: 2.35rem;
  height: 2.35rem;
  margin: 0.15rem 0 0.35rem;
}
.weather-icon-emoji {
  font-size: 1.8em;
  line-height: 1;
}
.weather-icon-lg .weather-icon-emoji { font-size: 2.6em; }
.weather-icon-sm .weather-icon-emoji { font-size: 1.45em; }
.weather-forecast-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 0.65rem;
  margin-bottom: 0.75rem;
}
.weather-day-card {
  border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
  border-radius: 0.85rem;
  padding: 0.7rem 0.75rem;
  background:
    linear-gradient(160deg, color-mix(in srgb, var(--surface) 94%, white), color-mix(in srgb, var(--surface-soft) 38%, transparent));
  box-shadow: 0 4px 14px color-mix(in srgb, var(--accent) 4%, transparent);
}
.weather-day-label {
  font-weight: 600;
  margin-bottom: 0.25rem;
  letter-spacing: -0.01em;
}
.weather-day-cond {
  margin-bottom: 0.35rem;
  opacity: 0.9;
  font-size: 0.92rem;
  color: var(--muted);
}
.weather-day-temps {
  margin-bottom: 0.2rem;
}
.place-reviews-block {
  margin-top: 1.25rem;
}
.place-review-list {
  display: grid;
  gap: 0.75rem;
  margin-bottom: 1rem;
}
.place-review-card {
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 12px;
  padding: 0.85rem 1rem;
  background: rgba(0, 0, 0, 0.1);
}
.place-review-form {
  display: grid;
  gap: 0.75rem;
  margin-top: 0.75rem;
}
.place-review-photos {
  display: grid;
  gap: 0.6rem;
  margin-top: 0.65rem;
}
.post-detail-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
  margin-bottom: 0.85rem;
}
.experience-detail {
  animation: pageFadeIn 0.35s ease;
}
.experience-detail-header h3 {
  margin: 0.35rem 0 0.4rem;
  font-size: clamp(1.55rem, 2.4vw, 2rem);
  letter-spacing: -0.02em;
  line-height: 1.2;
}
.experience-detail-byline {
  margin: 0 0 0.85rem;
  color: var(--muted);
}
.experience-detail-facts {
  list-style: none;
  margin: 1.15rem 0 0;
  padding: 0.85rem 1rem;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
  gap: 0.85rem 1.25rem;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  border-radius: 1rem;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--accent) 8%, transparent), transparent 55%),
    color-mix(in srgb, var(--surface-soft) 70%, transparent);
}
.experience-detail-fact {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}
.experience-detail-fact-label {
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
}
.experience-detail-fact-value {
  color: var(--text);
  font-weight: 650;
  line-height: 1.35;
}
.experience-detail-body {
  margin-top: 1.15rem;
}
.experience-detail-note {
  margin: 0;
  padding: 0.95rem 0 0.15rem;
}
.experience-detail-note.is-featured {
  padding: 1.15rem 1.15rem 1.2rem;
  border-radius: 1.1rem;
  border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--border));
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--accent) 10%, transparent), transparent 70%),
    color-mix(in srgb, var(--surface) 92%, transparent);
  box-shadow: 0 10px 28px color-mix(in srgb, var(--accent) 8%, transparent);
}
.experience-detail-note h4 {
  margin: 0 0 0.45rem;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--accent) 75%, var(--muted));
}
.experience-detail-note.is-featured h4 {
  color: var(--accent-strong);
}
.experience-detail-note p {
  margin: 0;
  color: var(--text);
  white-space: pre-wrap;
  line-height: 1.65;
  font-size: 1.02rem;
}
.experience-detail-notes {
  display: grid;
  gap: 0.15rem;
  margin-top: 0.85rem;
  padding-top: 0.35rem;
  border-top: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.experience-detail-notes .experience-detail-note {
  padding: 0.95rem 0 0.95rem 0.95rem;
  border-left: 2px solid color-mix(in srgb, var(--accent) 35%, var(--border));
}
.experience-detail-notes .experience-detail-note + .experience-detail-note {
  border-top: 1px solid color-mix(in srgb, var(--border) 55%, transparent);
}
.experience-detail-notes .experience-detail-note p {
  font-size: 0.98rem;
  line-height: 1.55;
  color: color-mix(in srgb, var(--text) 92%, var(--muted));
}
@media (max-width: 720px) {
  .experience-detail-facts {
    grid-template-columns: 1fr;
    padding: 0.8rem 0.9rem;
  }
  .experience-detail-note.is-featured {
    padding: 1rem 0.95rem;
  }
}
.experience-chat-block {
  margin-top: 1.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--border);
}
.experience-chat-block h4 {
  margin: 0;
}
.experience-chat-list {
  display: grid;
  gap: 0.7rem;
  max-height: 32rem;
  overflow: auto;
  margin: 0.85rem 0 1rem;
  padding: 0.75rem;
  border: 1px solid var(--border);
  border-radius: 1rem;
  background: color-mix(in srgb, var(--surface-soft) 55%, transparent);
}
.experience-chat-message {
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  border-radius: 0.95rem;
  padding: 0.75rem 0.85rem;
  background: color-mix(in srgb, var(--surface) 88%, transparent);
}
.experience-chat-message.is-own {
  border-color: color-mix(in srgb, var(--accent) 35%, var(--border));
  background: color-mix(in srgb, var(--surface) 78%, var(--accent) 8%);
}
.experience-chat-message.is-experience-author {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
}
.experience-chat-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
  margin-bottom: 0.35rem;
}
.experience-chat-message > p {
  margin: 0 0 0.45rem;
  color: var(--text);
  white-space: pre-wrap;
}
.experience-chat-actions {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.45rem;
  flex-wrap: wrap;
}
.experience-chat-like-button.is-liked {
  cursor: default;
}
.experience-chat-replies {
  display: grid;
  gap: 0.55rem;
  margin-top: 0.7rem;
  padding-left: 0.85rem;
  border-left: 2px solid color-mix(in srgb, var(--accent) 35%, var(--border));
  min-width: 0;
}
.experience-chat-replies .experience-chat-message {
  min-width: 0;
}
.experience-chat-replies .experience-chat-actions {
  gap: 0.4rem;
}
.experience-chat-replies .experience-chat-like-button {
  flex: 0 0 auto;
}
.experience-chat-reply-slot:not(:empty) {
  margin-top: 0.65rem;
}
.experience-chat-reply-form {
  display: grid;
  gap: 0.55rem;
  padding: 0.65rem 0.7rem;
  border: 1px dashed color-mix(in srgb, var(--accent) 40%, var(--border));
  border-radius: 0.8rem;
  background: color-mix(in srgb, var(--surface) 82%, var(--accent) 6%);
}
.experience-chat-form {
  display: grid;
  gap: 0.75rem;
}
.place-rating-summary {
  margin-right: 0.75rem;
}
.badge.muted {
  opacity: 0.75;
}
.section-heading-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  margin-bottom: 0.75rem;
}
.section-heading-row h3 {
  margin: 0;
}
.compact-location-card .button {
  margin-top: 0.75rem;
}

/* v0.7.1 country/city navigation polish */
.clickable-location-card,
.clickable-card {
  cursor: pointer;
  transition: transform 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}
.clickable-location-card:hover,
.clickable-location-card:focus-visible,
.clickable-card:hover,
.clickable-card:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(94, 210, 236, 0.55);
  background: color-mix(in srgb, var(--surface-soft) 62%, transparent);
  outline: none;
}
.location-card-hint {
  display: none;
}
.location-map-card {
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface-soft) 42%, transparent);
  border-radius: 1.2rem;
  padding: 1rem;
  min-height: 18rem;
  margin: 1rem 0;
  display: flex;
  flex-direction: column;
}
.location-map-heading {
  flex: 0 0 auto;
  flex-direction: row;
  align-items: center;
  flex-wrap: nowrap;
  gap: 0.65rem;
  margin-bottom: 0.55rem;
  padding-bottom: 0.4rem;
}
.location-map-heading h3 {
  min-width: 0;
  flex: 1 1 auto;
}
.location-map-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  flex: 0 0 auto;
  flex-wrap: nowrap;
}
.location-map-card iframe,
.location-map-canvas,
.country-state-map-canvas {
  width: 100%;
  min-height: 15rem;
  height: 15rem;
  flex: 1 1 auto;
  border: 0;
  border-radius: 0.9rem;
  overflow: hidden;
  background: var(--surface);
  z-index: 0;
}
.location-map-card > .small-muted {
  flex: 0 0 auto;
  margin: 0.55rem 0 0;
}
.map-load-fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: 1.25rem;
  text-align: center;
}
.map-load-fallback .small-muted {
  margin: 0;
  max-width: 26rem;
}
.location-map-canvas .maplibregl-map,
.country-state-map-canvas .maplibregl-map,
.country-state-map-card .maplibregl-map {
  width: 100%;
  height: 100%;
  min-height: 15rem;
  border-radius: 0.9rem;
  font: inherit;
}
.location-map-canvas .maplibregl-ctrl-attrib,
.country-state-map-canvas .maplibregl-ctrl-attrib {
  font-size: 0.72rem;
}
.country-states-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 0.55rem;
}
.country-state-chip {
  display: inline-flex;
  align-items: baseline;
  gap: 0.25rem;
  padding: 0.35rem 0.65rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface-soft) 55%, transparent);
  font-size: 0.92rem;
}
.country-state-chip small {
  color: var(--muted);
  font-size: 0.78rem;
}
.empty-map {
  display: grid;
  align-content: center;
}
.facts-grid {
  display: grid;
  grid-template-columns: minmax(9rem, 0.4fr) 1fr;
  gap: 0.5rem 1rem;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface-soft) 32%, transparent);
  border-radius: 1.2rem;
  padding: 1rem;
}
.facts-grid dt {
  font-weight: 800;
  color: var(--text);
}
.facts-grid dd {
  margin: 0;
  color: var(--muted);
}
.city-country-strip {
  margin-bottom: 1rem;
}
.city-country-strip > .small-muted {
  margin: 0 0 0.4rem;
}
@media (max-width: 760px) {
  .facts-grid { grid-template-columns: 1fr; }
}

.business-summary {
  margin-top: -0.25rem;
}

.place-contact-link,
.place-contact-inline {
  color: inherit;
  white-space: nowrap;
}

.place-contact-link {
  text-decoration: underline;
  text-underline-offset: 0.18em;
}

.place-contact-icon {
  display: inline-block;
  margin-right: 0.25em;
  font-size: 0.9em;
  text-decoration: none;
}

.facts-grid a,
.place-detail a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 0.18em;
}

.currency-converter { display: grid; gap: 0.7rem; }
.exchange-rate-block .note { margin-top: 0; }
.converter-row { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; }
.converter-controls label {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.35rem;
  font-weight: 700;
}
.converter-row select,
.converter-controls input[type="number"] {
  width: auto;
  min-width: 8rem;
  padding: 0.45rem 0.65rem;
}
.converter-controls select { min-width: 14rem; }
.converter-quick-picks {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}
.converter-quick-picks .button.active {
  border-color: rgba(94, 210, 236, 0.7);
  background: rgba(94, 210, 236, 0.16);
}
.currency-converter-result {
  line-height: 1.5;
  padding: 0.85rem 1rem;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 12px;
  background: rgba(0, 0, 0, 0.12);
}
.converter-main-result {
  font-size: 1.05rem;
  margin-bottom: 0.25rem;
}
.converter-reverse-result {
  margin-bottom: 0.35rem;
}


.dashboard-hero {
  position: relative;
  overflow: hidden;
  min-height: clamp(220px, 34vw, 390px);
  border: 1px solid var(--border);
  border-radius: 1.5rem;
  margin: 0 0 1.2rem;
  box-shadow: var(--shadow);
  background: var(--surface-soft);
}
.dashboard-hero-media {
  position: absolute;
  inset: 0;
  background-position: center;
  background-size: cover;
  transform: scale(1.01);
}
.dashboard-hero.hero-media-default .dashboard-hero-media {
  background-image:
    linear-gradient(105deg, rgba(13, 20, 32, 0.55) 0%, rgba(13, 20, 32, 0.18) 48%, transparent 72%),
    var(--hero-photo-overview, url("/assets/images/heroes/overview.jpg"));
  background-position: center, center right;
  background-size: cover;
}
.dashboard-hero-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .68;
  transform: scale(1.01);
  pointer-events: none;
  z-index: 0;
}
.dashboard-hero.hero-media-video-active:not(.hero-video-ready) .dashboard-hero-media {
  background-color: #101b2b;
}
.dashboard-hero.hero-media-video-active.hero-video-ready .dashboard-hero-media {
  background-image: none !important;
  background-color: #101b2b;
}
.dashboard-hero.hero-media-video-active .dashboard-hero-video {
  display: block;
}
.dashboard-hero-video.hidden {
  display: none;
}
.dashboard-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.dashboard-hero.hero-overlay-dark::after { background: linear-gradient(90deg, rgba(13,20,32,.86), rgba(13,20,32,.34), rgba(13,20,32,.12)); }
.dashboard-hero.hero-overlay-light::after { background: linear-gradient(90deg, rgba(245,247,251,.90), rgba(245,247,251,.44), rgba(245,247,251,.10)); }
.dashboard-hero.hero-overlay-none::after { display: none; }
.dashboard-hero-content {
  position: relative;
  z-index: 1;
  max-width: 46rem;
  padding: clamp(1.25rem, 4vw, 3rem);
  min-height: inherit;
  display: flex;
  flex-direction: column;
  justify-content: end;
}
.dashboard-hero-content h3 {
  margin: 0 0 .65rem;
  font-size: clamp(2rem, 6vw, 4rem);
  line-height: 1;
}
.dashboard-hero-content p:not(.eyebrow) {
  margin: 0;
  color: var(--text);
  font-size: clamp(1rem, 2vw, 1.25rem);
  max-width: 42rem;
}
.dashboard-hero.hero-overlay-dark .dashboard-hero-content h3,
.dashboard-hero.hero-overlay-dark .dashboard-hero-content p:not(.eyebrow) { color: #fff; text-shadow: 0 2px 18px rgba(0,0,0,.45); }
.dashboard-hero.hero-overlay-dark .eyebrow { color: #9be3f6; text-shadow: 0 2px 18px rgba(0,0,0,.45); }

/* v0.8.1 hero layout and visibility controls */
.dashboard-hero.hero-height-compact { min-height: clamp(170px, 24vw, 270px); }
.dashboard-hero.hero-height-normal { min-height: clamp(220px, 34vw, 390px); }
.dashboard-hero.hero-height-large { min-height: clamp(300px, 44vw, 560px); }
.dashboard-hero.hero-media-video-active.hero-video-size-small {
  min-height: clamp(140px, 18vw, 220px);
  height: auto;
}
.dashboard-hero.hero-media-video-active.hero-video-size-normal {
  min-height: clamp(240px, 36vw, 420px);
  height: auto;
}
.dashboard-hero.hero-media-video-active.hero-video-size-fullscreen {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
  margin-top: 0;
  margin-bottom: 1.2rem;
  border-radius: 0;
  border-left: 0;
  border-right: 0;
  min-height: calc(100vh - 5.5rem);
  min-height: calc(100dvh - 5.5rem);
  height: calc(100vh - 5.5rem);
  height: calc(100dvh - 5.5rem);
}
.dashboard-hero.hero-media-video-active.hero-video-size-fullscreen .dashboard-hero-video {
  opacity: 0.82;
}
.dashboard-hero-video:not(.is-playing) {
  opacity: 0;
}
.dashboard-hero.hero-media-video-active .dashboard-hero-video.is-playing {
  opacity: 0.68;
}
.dashboard-hero.hero-media-video-active.hero-video-size-fullscreen .dashboard-hero-video.is-playing {
  opacity: 0.82;
}
.hero-video-size-controls {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
}
.hero-video-size-controls .hero-video-size-toggle {
  pointer-events: auto;
  appearance: none;
  border: 1px solid rgba(255, 255, 255, 0.35);
  background: rgba(13, 20, 32, 0.55);
  color: #fff;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 0.7rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  backdrop-filter: blur(6px);
  transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}
.hero-video-size-controls .hero-video-size-toggle:hover {
  background: rgba(13, 20, 32, 0.78);
  border-color: rgba(155, 227, 246, 0.65);
}
.hero-video-size-controls .hero-video-expand,
.hero-video-size-controls .hero-video-collapse {
  position: absolute;
  top: 0.85rem;
  right: 0.85rem;
}
.hero-video-size-controls .hero-video-collapse-chevron {
  position: absolute;
  left: 50%;
  bottom: 0.95rem;
  transform: translateX(-50%);
  width: 3rem;
  height: 2.35rem;
  border-radius: 999px;
}
.hero-video-size-controls .hero-video-collapse-chevron:hover {
  transform: translateX(-50%) translateY(-1px);
}
.hero-video-icon {
  display: block;
  width: 1rem;
  height: 1rem;
  position: relative;
}
.hero-video-icon-expand,
.hero-video-icon-collapse {
  border: 2px solid currentColor;
  border-radius: 0.15rem;
  box-sizing: border-box;
}
.hero-video-icon-expand::before,
.hero-video-icon-collapse::before {
  content: "";
  position: absolute;
  background: currentColor;
}
.hero-video-icon-expand::before {
  inset: 0.18rem;
  border: 1.5px solid currentColor;
  background: transparent;
  border-radius: 0.05rem;
}
.hero-video-icon-collapse {
  width: 0.78rem;
  height: 0.78rem;
}
.hero-video-icon-collapse::before {
  inset: -0.28rem;
  border: 1.5px solid currentColor;
  background: transparent;
  border-radius: 0.05rem;
  opacity: 0.55;
}
.hero-video-icon-chevron {
  width: 0.9rem;
  height: 0.9rem;
}
.hero-video-icon-chevron::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 55%;
  width: 0.55rem;
  height: 0.55rem;
  border-left: 2px solid currentColor;
  border-top: 2px solid currentColor;
  transform: translate(-50%, -35%) rotate(45deg);
  background: transparent;
}
/* Full-bleed hero: expand main so fullscreen video is not clipped inside the content column */
body.hero-fullscreen-active main {
  width: 100%;
  max-width: none;
  margin: 0;
}
body.hero-fullscreen-active main > :not(#dashboardHero):not(#upcomingTripStrip) {
  width: min(var(--shell-max), calc(100% - 2rem));
  margin-left: auto;
  margin-right: auto;
}
body.hero-fullscreen-active .global-dashboard-hero {
  max-width: none;
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}
body.hero-fullscreen-active #upcomingTripStrip {
  width: min(var(--shell-max), calc(100% - 2rem));
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 720px) {
  .dashboard-hero.hero-media-video-active.hero-video-size-fullscreen {
    min-height: calc(100vh - 7.5rem);
    min-height: calc(100dvh - 7.5rem);
    height: calc(100vh - 7.5rem);
    height: calc(100dvh - 7.5rem);
  }
  .dashboard-hero.hero-media-video-active.hero-video-size-small {
    min-height: clamp(120px, 28vw, 180px);
  }
}
.dashboard-hero.hero-fit-cover .dashboard-hero-media { background-size: cover; }
.dashboard-hero.hero-fit-contain .dashboard-hero-media { background-size: contain; background-repeat: no-repeat; background-color: var(--surface-soft); }
.dashboard-hero.hero-overlay-dark.hero-overlay-strength-light::after { background: linear-gradient(90deg, rgba(13,20,32,.58), rgba(13,20,32,.22), rgba(13,20,32,.06)); }
.dashboard-hero.hero-overlay-dark.hero-overlay-strength-medium::after { background: linear-gradient(90deg, rgba(13,20,32,.80), rgba(13,20,32,.36), rgba(13,20,32,.12)); }
.dashboard-hero.hero-overlay-dark.hero-overlay-strength-strong::after { background: linear-gradient(90deg, rgba(13,20,32,.94), rgba(13,20,32,.62), rgba(13,20,32,.26)); }
.dashboard-hero.hero-overlay-light.hero-overlay-strength-light::after { background: linear-gradient(90deg, rgba(245,247,251,.64), rgba(245,247,251,.28), rgba(245,247,251,.08)); }
.dashboard-hero.hero-overlay-light.hero-overlay-strength-medium::after { background: linear-gradient(90deg, rgba(245,247,251,.86), rgba(245,247,251,.48), rgba(245,247,251,.16)); }
.dashboard-hero.hero-overlay-light.hero-overlay-strength-strong::after { background: linear-gradient(90deg, rgba(245,247,251,.96), rgba(245,247,251,.72), rgba(245,247,251,.34)); }
.dashboard-hero[data-text-position="top-left"] .dashboard-hero-content { justify-content: start; align-items: start; text-align: left; }
.dashboard-hero[data-text-position="top-center"] .dashboard-hero-content { justify-content: start; align-items: center; text-align: center; margin-inline: auto; }
.dashboard-hero[data-text-position="top-right"] .dashboard-hero-content { justify-content: start; align-items: end; text-align: right; margin-left: auto; }
.dashboard-hero[data-text-position="center-left"] .dashboard-hero-content { justify-content: center; align-items: start; text-align: left; }
.dashboard-hero[data-text-position="center"] .dashboard-hero-content { justify-content: center; align-items: center; text-align: center; margin-inline: auto; }
.dashboard-hero[data-text-position="center-right"] .dashboard-hero-content { justify-content: center; align-items: end; text-align: right; margin-left: auto; }
.dashboard-hero[data-text-position="bottom-left"] .dashboard-hero-content { justify-content: end; align-items: start; text-align: left; }
.dashboard-hero[data-text-position="bottom-center"] .dashboard-hero-content { justify-content: end; align-items: center; text-align: center; margin-inline: auto; }
.dashboard-hero[data-text-position="bottom-right"] .dashboard-hero-content { justify-content: end; align-items: end; text-align: right; margin-left: auto; }
.dashboard-hero.hero-text-shadow .dashboard-hero-content h3,
.dashboard-hero.hero-text-shadow .dashboard-hero-content p,
.dashboard-hero.hero-text-shadow .dashboard-hero-content .eyebrow { text-shadow: 0 2px 20px rgba(0,0,0,.58); }
@media (max-width: 720px) {
  .dashboard-hero[data-text-position] .dashboard-hero-content { align-items: start; text-align: left; margin-left: 0; margin-right: 0; }
  .dashboard-hero.hero-height-large { min-height: clamp(260px, 78vw, 390px); }
  .dashboard-hero-content h3 { font-size: clamp(2rem, 12vw, 3rem); }
}

/* v0.8.2 country safety and embassy directory */
.safety-card-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 0.85rem;
}
.safety-card,
.compact-embassy-card {
  border: 1px solid var(--border);
  border-radius: 1rem;
  background: var(--surface);
  padding: 1rem;
}
/* Author .directory-card { display:flex } otherwise overrides the HTML hidden attribute. */
.directory-card[hidden],
.compact-embassy-card[hidden] {
  display: none !important;
}
.safety-card h4,
.compact-embassy-card h4 { margin: .35rem 0 .4rem; }
.compact-embassy-card.has-flag-watermark {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.compact-embassy-card.has-flag-watermark > *:not(.country-card-flag-watermark) {
  position: relative;
  z-index: 1;
}
.compact-embassy-card .card-topline-start {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  align-items: center;
  min-width: 0;
  flex: 1 1 auto;
}
.compact-embassy-card .card-topline > .pin-icon-button {
  margin-left: auto;
  flex: 0 0 auto;
  align-self: flex-start;
}
.compact-facts {
  display: grid;
  grid-template-columns: minmax(7rem, auto) 1fr;
  gap: .35rem .7rem;
  margin: .65rem 0 0;
}
.compact-facts dt { font-weight: 800; color: var(--text); }
.compact-facts dd { margin: 0; color: var(--muted); overflow-wrap: anywhere; }
.compact-directory {
  border: 1px solid var(--border);
  border-radius: 1.1rem;
  background: var(--surface-soft);
  padding: .25rem;
}
.compact-directory summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem;
}
.compact-directory summary::-webkit-details-marker { display: none; }
.compact-directory summary span:first-child { display: grid; gap: .25rem; }
.compact-directory summary small { color: var(--muted); font-weight: 600; }
.embassy-directory-grid { padding: 0 1rem 1rem; }
.embassy-browse {
  display: grid;
  gap: 0.85rem;
  margin-top: 0.85rem;
}
.embassy-directory-controls {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0.75rem 1rem;
}
.embassy-directory-controls label {
  display: grid;
  gap: 0.3rem;
}
.embassy-directory-controls span {
  font-size: 0.86rem;
  font-weight: 700;
  color: var(--muted);
}
.embassy-popular-strip {
  display: grid;
  gap: 0.55rem;
}
.embassy-popular-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 0.65rem;
}
.embassy-popular-card {
  position: relative;
  display: grid;
  gap: 0.25rem;
  text-align: left;
  border: 1px solid var(--border);
  border-radius: 0.9rem;
  background: var(--surface-soft);
  padding: 0.8rem 0.9rem;
  cursor: pointer;
  color: inherit;
  overflow: hidden;
}
.embassy-popular-card:hover,
.embassy-popular-card:focus-visible {
  border-color: color-mix(in srgb, var(--accent, #2f6fed) 45%, var(--border));
  outline: none;
}
.embassy-popular-card .badge {
  width: fit-content;
}
.embassy-card-highlight {
  outline: 2px solid color-mix(in srgb, var(--accent, #2f6fed) 70%, transparent);
  outline-offset: 2px;
}
@media (max-width: 720px) {
  .compact-facts { grid-template-columns: 1fr; }
  .safety-contacts-panel {
    padding-inline: 0.15rem;
  }
  .safety-contacts-panel .safety-card-list {
    grid-template-columns: minmax(0, 1fr);
  }
  .safety-contacts-panel .card-topline .small-muted {
    max-width: 100%;
  }
}

/* v0.8.5 public landing and auth polish */
.auth-panel { overflow: hidden; }
.auth-landing {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
  gap: 1.2rem;
  align-items: stretch;
  margin-bottom: 1.2rem;
  padding: clamp(1.1rem, 3vw, 1.6rem);
  min-height: clamp(22rem, 48vw, 30rem);
  border: 1px solid var(--border);
  border-radius: 1.4rem;
  background: color-mix(in srgb, var(--surface-soft) 58%, transparent);
}
.auth-landing-media {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    linear-gradient(105deg, rgba(255, 250, 255, 0.96) 0%, rgba(255, 250, 255, 0.86) 38%, rgba(255, 250, 255, 0.42) 64%, rgba(255, 250, 255, 0.12) 84%, transparent 94%),
    var(--hero-photo-auth, url("/assets/images/heroes/auth.jpg"));
  background-position: center, center right;
  background-size: cover;
  transform: scale(1.02);
  filter: saturate(0.7) contrast(0.9) brightness(1.06);
  opacity: 0.9;
}
.auth-landing-copy,
.auth-landing .auth-benefits-card {
  position: relative;
  z-index: 1;
}
.auth-landing-copy h2 { font-size: clamp(2rem, 5vw, 3.4rem); margin-bottom: 0.85rem; }
.auth-landing-copy p:not(.eyebrow) { color: var(--muted); font-size: 1.05rem; max-width: 62ch; margin: 0; }
.auth-landing-actions { margin-top: 1.2rem; }
.auth-benefits-card {
  border: 1px solid var(--border);
  border-radius: 1.2rem;
  background: color-mix(in srgb, var(--surface) 88%, transparent);
  backdrop-filter: blur(4px);
  padding: 1rem;
}

/* Directory entry photo strips disabled — misty plum shell only (Overview/Auth keep photos). */
.page-entry-hero {
  display: block;
  border-radius: 1.5rem;
  overflow: hidden;
  margin: 0 0 1.2rem;
  box-shadow: var(--shadow);
}
.page-entry-hero img {
  display: block;
  width: 100%;
  height: clamp(160px, 26vw, 280px);
  object-fit: cover;
}
.auth-benefits-card h3 { margin: 0 0 0.8rem; }
.benefit-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 0.75rem; }
.benefit-list li { display: grid; gap: 0.15rem; padding-bottom: 0.75rem; border-bottom: 1px solid var(--border); }
.benefit-list li:last-child { border-bottom: 0; padding-bottom: 0; }
.benefit-list span { color: var(--muted); font-size: 0.92rem; }
.auth-flow-card {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.8rem;
  margin-bottom: 1.2rem;
}
.flow-step {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 0.7rem;
  row-gap: 0.15rem;
  align-items: start;
  border: 1px solid var(--border);
  border-radius: 1rem;
  background: var(--surface);
  padding: 0.9rem;
}
.flow-step span {
  width: 1.8rem;
  height: 1.8rem;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: var(--accent);
  color: var(--accent-contrast, white);
  font-weight: 900;
  grid-row: span 2;
}
.flow-step small { color: var(--muted); }
.compact-auth-header h2 { font-size: clamp(1.5rem, 4vw, 2.1rem); }
.auth-box-header { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; margin-bottom: 0.35rem; }
.auth-box-header h3 { margin: 0; }
.auth-helper { color: var(--muted); margin: 0 0 0.4rem; }
.oauth-actions {
  display: grid;
  gap: 0.55rem;
  margin: 0.75rem 0 0.35rem;
}
.oauth-button {
  text-align: center;
  text-decoration: none;
}
.oauth-button.oauth-google {
  background: #fff;
  color: #1f1f1f;
  border: 1px solid #dadce0;
}
.oauth-button.oauth-apple {
  background: #111;
  color: #fff;
  border: 1px solid #111;
}
.auth-divider {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 0.6rem;
  margin: 0.85rem 0 0.75rem;
  color: var(--muted);
  font-size: 0.86rem;
}
.auth-divider::before,
.auth-divider::after {
  content: '';
  height: 1px;
  background: var(--border);
}
.badge.muted { background: transparent; }
.profile-card {
  max-width: 820px;
}
.profile-identity {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1rem 1.25rem;
  align-items: center;
  padding: 0.35rem 0 1.1rem;
  border-bottom: 1px solid var(--border);
  margin-bottom: 1rem;
}
.profile-identity-avatar {
  width: 5.5rem;
  height: 5.5rem;
  font-size: 1.55rem;
}
.profile-identity-copy .eyebrow {
  margin: 0 0 0.2rem;
}
.profile-identity-copy h3 {
  margin: 0;
  font-size: 1.45rem;
  line-height: 1.2;
}
.profile-identity-email,
.profile-identity-meta {
  margin: 0.25rem 0 0;
  color: var(--muted);
  font-size: 0.92rem;
}
.profile-identity-meta {
  text-transform: capitalize;
}
.profile-identity-photo {
  grid-column: 1 / -1;
  display: grid;
  gap: 0.45rem;
}
.profile-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 1.5rem;
  margin: 0 0 1.15rem;
  padding: 0.25rem 1rem 0.65rem;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}
.account-license-panel,
.plans-current-license {
  margin-top: 1rem;
  padding: 0.95rem 1rem;
  border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--border));
  border-radius: 1rem;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--accent) 10%, transparent), transparent 60%),
    color-mix(in srgb, var(--surface-soft) 55%, var(--surface));
}
.account-license-topline {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.85rem;
}
.account-license-topline .eyebrow,
.account-license-topline .page-section-kicker {
  margin: 0 0 0.2rem;
}
.account-license-topline h3,
.account-license-topline h4 {
  margin: 0;
  font-size: 1.15rem;
}
.account-license-panel .note,
.plans-current-license .note {
  margin: 0.55rem 0 0.35rem;
}
.account-license-places {
  list-style: none;
  margin: 0.55rem 0 0;
  padding: 0;
  display: grid;
  gap: 0.4rem;
}
.account-license-places li {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.4rem 0;
  border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
  font-size: 0.9rem;
}
.account-license-places li span {
  color: var(--muted);
  white-space: nowrap;
}
.account-license-panel .form-actions {
  margin-top: 0.75rem;
}
.plans-current-license {
  margin: 0 0 1rem;
}
.profile-facts::before {
  content: "Account overview";
  grid-column: 1 / -1;
  padding: 0.65rem 0 0.35rem;
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.profile-fact {
  display: grid;
  grid-template-columns: minmax(7rem, 0.8fr) minmax(0, 1.2fr);
  align-items: baseline;
  gap: 0.75rem;
  padding: 0.5rem 0;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 65%, transparent);
}
.profile-fact span {
  color: var(--muted);
  font-size: 0.78rem;
}
.profile-fact strong {
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.3;
  overflow-wrap: break-word;
  word-break: normal;
}
@media (max-width: 760px) {
  .profile-facts { grid-template-columns: 1fr; }
}
.profile-section-card {
  border: 1px solid var(--border);
  border-radius: 1rem;
  padding: 0.85rem 1rem 0.35rem;
  background: var(--surface);
  margin-top: 0.85rem;
}
.profile-section-details {
  border: 1px solid var(--border);
  border-radius: 1rem;
  padding: 0.15rem 1rem 0.35rem;
  background: var(--surface);
  margin-top: 0.85rem;
}
.profile-section-details > summary {
  cursor: pointer;
  list-style: none;
  font-weight: 800;
  padding: 0.85rem 0;
}
.profile-section-details > summary::-webkit-details-marker { display: none; }
.profile-section-details > summary::after {
  content: '+';
  float: right;
  color: var(--muted);
  font-weight: 700;
}
.profile-section-details[open] > summary::after { content: '–'; }
.profile-settings-form { margin-top: 0.35rem; }
.profile-actions {
  margin-top: 1.25rem;
  padding-top: 0.85rem;
  border-top: 1px solid var(--border);
}
@media (min-width: 720px) {
  .profile-identity {
    grid-template-columns: auto 1fr minmax(12rem, 16rem);
  }
  .profile-identity-photo {
    grid-column: auto;
  }
}
@media (max-width: 820px) {
  .auth-landing, .auth-flow-card { grid-template-columns: 1fr; }
  .auth-landing { padding: 1rem; }
}

.imported-place-image {
  margin: 0.9rem 0 1rem;
  border: 1px solid var(--border);
  border-radius: 1rem;
  overflow: hidden;
  background: var(--surface-soft);
  text-align: center;
}
.imported-place-image img {
  /* Portrait sources (e.g. a tall tower shot) hug their own scaled size and sit centered,
     instead of stretching to the full card width and leaving a large empty letterboxed
     panel beside a narrow photo. */
  display: inline-block;
  width: auto;
  max-width: 100%;
  max-height: 360px;
  object-fit: contain;
}
.imported-place-image figcaption {
  padding: 0.65rem 0.8rem;
  color: var(--muted);
  font-size: 0.82rem;
}
.imported-place-image.card-image {
  margin: -0.2rem -0.2rem 0.85rem;
  border-radius: 0.9rem;
}
.imported-place-image.card-image img {
  width: 100%;
  height: 155px;
  max-height: 155px;
  object-fit: cover;
}
.imported-place-image.thumb-image {
  flex-shrink: 0;
  margin: 0;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 0.55rem;
}
.imported-place-image.thumb-image img {
  width: 100%;
  height: 100%;
  max-height: none;
  object-fit: cover;
}

/* v0.8.10 embassy type visibility filters */
.badge.visibility-hidden {
  border-color: rgba(239, 68, 68, .65);
  color: #fecaca;
}
.badge.visibility-visible {
  border-color: rgba(132, 204, 22, .65);
  color: #d9f99d;
}

/* v0.9.2 — Separate admin portal route, grouped admin pages, and dark admin theme */
body.admin-route-active main > section:not(#admin) {
  display: none !important;
}
body.admin-route-active #admin {
  margin-top: 1.25rem;
}
.admin-control-center, .admin-section-bar, .legal-card {
  border: 1px solid color-mix(in srgb, var(--border) 82%, rgba(255,255,255,.14));
  border-radius: 18px;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--surface) 88%, rgba(255,255,255,.06)), color-mix(in srgb, var(--surface-soft) 72%, transparent));
  padding: 1rem;
  margin-bottom: 1rem;
  box-shadow: var(--shadow);
  color: var(--text);
}
.admin-control-center h3,
.admin-section-bar strong {
  color: var(--heading);
}
.admin-section-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 0.85rem;
  margin-top: 1rem;
}
.admin-section-card {
  appearance: none;
  text-align: left;
  border: 1px solid color-mix(in srgb, var(--border) 78%, rgba(255,255,255,.18));
  border-radius: 16px;
  padding: 1rem;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--surface-soft) 78%, rgba(255,255,255,.08)), color-mix(in srgb, var(--surface) 88%, transparent));
  color: var(--text);
  cursor: pointer;
  min-height: 108px;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}
.admin-section-card:hover, .admin-section-card:focus-visible {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--accent) 62%, white 14%);
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.22);
  outline: none;
}
.admin-section-card strong { display: block; font-size: 1.03rem; margin-bottom: 0.35rem; color: var(--heading); }
.admin-section-card span { display: block; color: var(--muted); line-height: 1.35; }
.admin-section-bar { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.admin-section-hidden { display: none !important; }
.load-timer {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 0.25rem 0.6rem;
  font-size: 0.86rem;
  background: color-mix(in srgb, var(--accent) 16%, var(--surface-soft));
  color: var(--heading);
  border: 1px solid color-mix(in srgb, var(--accent) 32%, var(--border));
  margin-left: 0.5rem;
  white-space: nowrap;
}
.footer-legal { margin: 0.2rem 0 0; color: var(--muted); font-size: 0.92rem; }
.footer-legal a { color: inherit; text-decoration: underline; }
.legal-prose-body { line-height: 1.55; max-width: 48rem; }
.legal-prose-body p { margin: 0 0 0.9rem; white-space: normal; }
.auth-legal-note { margin: 0.35rem 0 0.75rem; font-size: 0.9rem; }
.auth-legal-note a { color: inherit; text-decoration: underline; }
.account-data-panel .danger-zone {
  margin-top: 1rem;
  padding: 0.85rem 1rem;
  border: 1px solid color-mix(in srgb, #b42318 35%, var(--border));
  border-radius: 0.75rem;
  background: color-mix(in srgb, #b42318 6%, var(--surface-soft));
}
.danger-button {
  background: #b42318;
  border-color: #b42318;
  color: #fff;
}
.danger-button:hover { filter: brightness(0.95); }

/* Essential cookie notice */
.cookie-notice {
  position: fixed;
  left: 1rem;
  right: 1rem;
  bottom: 1rem;
  z-index: 40;
  display: flex;
  gap: 0.85rem;
  align-items: center;
  justify-content: space-between;
  max-width: 42rem;
  margin: 0 auto;
  padding: 0.85rem 1rem;
  border-radius: 0.85rem;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 92%, var(--accent) 8%);
  box-shadow: 0 10px 30px color-mix(in srgb, #000 16%, transparent);
}
.cookie-notice-text { margin: 0; color: var(--text); font-size: 0.92rem; line-height: 1.4; }
.cookie-notice .button { flex-shrink: 0; white-space: nowrap; }
.pwa-install-banner {
  position: fixed;
  left: 1rem;
  right: 1rem;
  bottom: 1rem;
  z-index: 41;
  display: flex;
  gap: 0.85rem;
  align-items: center;
  justify-content: space-between;
  max-width: 42rem;
  margin: 0 auto;
  padding: 0.9rem 1rem;
  border-radius: 0.85rem;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 90%, var(--accent) 10%);
  box-shadow: 0 10px 30px color-mix(in srgb, #000 16%, transparent);
}
.pwa-install-close {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  display: grid;
  place-items: center;
  width: 1.9rem;
  height: 1.9rem;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--muted, var(--text));
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
}
.pwa-install-close:hover,
.pwa-install-close:focus-visible { background: color-mix(in srgb, var(--text) 10%, transparent); color: var(--text); }
.pwa-install-copy { margin: 0; }
.pwa-install-copy strong { display: block; margin-bottom: 0.2rem; color: var(--text); }
.pwa-install-copy p { margin: 0; color: var(--muted, var(--text)); font-size: 0.9rem; line-height: 1.4; }
.pwa-install-actions { display: flex; gap: 0.5rem; flex-shrink: 0; }
.moderation-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.25rem;
  margin: 0 0 1rem;
  padding: 0.75rem 1rem;
  border: 1px solid var(--border);
  border-radius: 0.75rem;
  background: color-mix(in srgb, var(--surface) 94%, var(--accent) 6%);
  font-size: 0.92rem;
}
.moderation-summary span { color: var(--text); }
@media (max-width: 720px) {
  .cookie-notice,
  .pwa-install-banner { flex-direction: column; align-items: stretch; bottom: 0.75rem; }
  .pwa-install-actions { width: 100%; }
  .pwa-install-actions .button { flex: 1; }
}
@media (max-width: 720px) {
  .admin-section-bar { align-items: flex-start; flex-direction: column; }
  .load-timer { margin-left: 0; margin-top: 0.35rem; }
}


/* v0.9.1 — Public page-based navigation and focused detail views */
.main-nav a.active-nav-link {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 0.35rem;
}
.public-page-mode .public-panel-active {
  animation: pageFadeIn 140ms ease-out;
}
#places.place-detail-active > .page-stack,
#places.place-detail-active .panel-header,
#places.place-detail-active .page-entry-hero,
#places.place-detail-active .filters-row,
#places.place-detail-active #publicPlacesFeaturedNote,
#places.place-detail-active #publicPlacesMessage,
#places.place-detail-active #placesPageAdverts,
#places.place-detail-active #publicPlacesAdverts,
#places.place-detail-active #publicPlacesSearchResults,
#places.place-detail-active #publicPlacesTopLiked,
#places.place-detail-active #publicPlacesPinned,
#experiences.post-detail-active > .page-stack,
#experiences.post-detail-active .panel-header,
#experiences.post-detail-active .page-entry-hero,
#experiences.post-detail-active .filters-row,
#experiences.post-detail-active #publicPostsMessage,
#experiences.post-detail-active #experiencesPageAdverts,
#experiences.post-detail-active #experienceTopLikedPlaces,
#experiences.post-detail-active #publicPostsGrid,
#experiences.post-detail-active #publicPostsPagination {
  display: none !important;
}
#placeDetail:not(.hidden),
#postDetail:not(.hidden) {
  margin-top: 0;
  min-height: 45vh;
}
.location-context-header {
  position: relative;
}
.location-context-header .button,
#closePlaceDetail,
#closePostDetail {
  margin-bottom: 0.85rem;
}
@keyframes pageFadeIn {
  from { opacity: 0.72; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (max-width: 720px) {
  #placeDetail:not(.hidden),
  #postDetail:not(.hidden) {
    min-height: 60vh;
  }
  .location-context-header .button,
  #closePlaceDetail,
  #closePostDetail {
    width: 100%;
  }
}

/* v0.9.4 — Personal pages, main navigation, admin separation, and compact trip preview */
.upcoming-trip-strip {
  margin: 0.7rem 0 0.9rem;
  padding: 0.45rem 0.8rem;
  border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--border));
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface-soft) 74%, transparent);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.08);
}
.upcoming-trip-link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  color: var(--text);
  text-decoration: none;
  font-size: 0.92rem;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.upcoming-trip-link span,
.upcoming-trip-link small { color: var(--muted); }
.upcoming-trip-link strong { color: var(--accent); overflow: hidden; text-overflow: ellipsis; }
.upcoming-trip-weather-host {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  margin-left: 0.1rem;
  min-width: 0;
}
.upcoming-trip-weather-host[hidden] { display: none !important; }
.upcoming-trip-weather {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  color: var(--text);
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  min-width: 0;
  max-width: 100%;
}
.upcoming-trip-weather-now,
.upcoming-trip-weather-trip {
  display: inline-flex;
  align-items: center;
  gap: 0.22rem;
  min-width: 0;
}
.upcoming-trip-weather-label {
  color: var(--muted);
  font-weight: 600;
  font-size: 0.78em;
  letter-spacing: 0.01em;
  white-space: nowrap;
}
.upcoming-trip-weather-sep {
  color: var(--muted);
  font-weight: 500;
  opacity: 0.8;
  margin: 0 0.05rem;
}
.upcoming-trip-weather-note {
  color: var(--muted);
  font-weight: 550;
  font-size: 0.8em;
  max-width: 11rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.upcoming-trip-weather .weather-icon-sm {
  width: 1.15rem;
  height: 1.15rem;
  flex-shrink: 0;
}
.upcoming-trip-weather .weather-icon-sm img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.upcoming-trip-weather .weather-icon-sm .weather-icon-emoji {
  font-size: 1rem;
  line-height: 1;
}
.upcoming-trip-temp {
  color: var(--text);
  font-size: 0.9em;
  letter-spacing: 0.01em;
  white-space: nowrap;
}
.advice-card { min-height: 13rem; }
@media (max-width: 640px) {
  .upcoming-trip-strip { border-radius: 1rem; padding: 0.45rem 0.65rem; }
  .upcoming-trip-link { justify-content: flex-start; font-size: 0.85rem; }
  .upcoming-trip-link small { display: none; }
  .upcoming-trip-weather-host,
  .upcoming-trip-weather { display: inline-flex; }
  .upcoming-trip-weather-label { display: none; }
  .upcoming-trip-weather { gap: 0.2rem; }
  .upcoming-trip-weather-note { max-width: 6.5rem; font-size: 0.74em; }
}


/* v0.9.5 Dashboard, pins, and global banner polish */
.global-dashboard-hero { margin: 1rem auto 0; max-width: var(--shell-max); width: 100%; }
.dashboard-search-card { display: grid; gap: 1rem; padding: 1rem; border: 1px solid rgba(255,255,255,.12); border-radius: 22px; background: rgba(255,255,255,.055); box-shadow: 0 18px 45px rgba(0,0,0,.24); }
.dashboard-search-card label { display: grid; gap: .45rem; font-weight: 700; }
.dashboard-search-card input[type="search"] { font-size: 1.05rem; padding: .9rem 1rem; border-radius: 16px; }
.dashboard-pin-toolbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin: 1.2rem 0 .7rem; }
.dashboard-pins {
  margin: .6rem 0 1.3rem;
  /* Cap growth once pins pile up — otherwise this column stretches the whole dashboard row
     (the Guides box next to it matches row height via align-self:stretch), leaving a wall of
     empty space in Guides once someone has ~10+ pins. Scrolls internally past this height instead. */
  max-height: 620px;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-gutter: stable;
  padding-right: .3rem;
}
.dashboard-pin-group { margin: 1rem 0; }
.dashboard-pin-group-collapsible > summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  gap: .55rem;
}
.dashboard-pin-group-collapsible > summary::-webkit-details-marker { display: none; }
.dashboard-pin-group-collapsible > summary::before {
  content: '▸';
  font-size: .85rem;
  opacity: .7;
}
.dashboard-pin-group-collapsible[open] > summary::before { content: '▾'; }
.dashboard-pin-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-top: .65rem;
}
.dashboard-pin-chip {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .35rem .7rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--border) 82%, var(--accent) 18%);
  background: color-mix(in srgb, var(--surface) 90%, var(--accent) 10%);
  color: inherit;
  font: inherit;
  font-weight: 650;
  cursor: pointer;
}
.dashboard-pin-chip:hover { border-color: color-mix(in srgb, var(--accent) 48%, var(--border)); background: color-mix(in srgb, var(--surface) 80%, var(--accent) 20%); }
.dashboard-pin-chip .country-flag { width: 22px; height: 15px; }
.dashboard-pins-chips .dashboard-pin-card-actions { display: none; }
.dashboard-pin-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: .9rem; }
.dashboard-pins-wide_cards .dashboard-pin-grid { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }
.dashboard-pins-full_width_sections .dashboard-pin-grid, .dashboard-pins-list .dashboard-pin-grid { grid-template-columns: 1fr; }
.dashboard-pins-minimal .dashboard-pin-card p { display: none; }
.dashboard-pins-density-very_compact .dashboard-pin-card { padding: .65rem; }
.dashboard-pins-density-comfortable .dashboard-pin-card { padding: 1.15rem; }
.dashboard-pin-card { border: 1px solid var(--border); border-radius: 18px; padding: .9rem; background: var(--surface); color: var(--text); }
.dashboard-pin-card h4 { margin: .35rem 0; }
.dashboard-pin-title {
  display: flex;
  align-items: center;
  gap: 0.55rem;
}
.dashboard-pin-title .country-flag {
  width: 32px;
  height: 22px;
}
.dashboard-pin-weather-host {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin: 0.15rem 0;
}
.dashboard-pin-weather-host[hidden] { display: none !important; }
.dashboard-pin-weather {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  color: var(--text);
  font-weight: 650;
  font-variant-numeric: tabular-nums;
}
.dashboard-pin-weather .weather-icon-sm {
  width: 1.15rem;
  height: 1.15rem;
  flex-shrink: 0;
}
.dashboard-pin-weather .weather-icon-sm img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.dashboard-pin-weather .weather-icon-sm .weather-icon-emoji {
  font-size: 1rem;
  line-height: 1;
}
.dashboard-pin-weather-temp {
  color: var(--text);
  font-size: 0.9em;
  white-space: nowrap;
}
.dashboard-quick-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: .9rem; margin-top: 1rem; }
.quick-card { display: grid; gap: .35rem; padding: 1rem; border-radius: 18px; border: 1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.055); text-decoration: none; color: inherit; }
.quick-card:hover { transform: translateY(-1px); border-color: rgba(255,255,255,.25); }
.search-result-card { display: flex; align-items: center; justify-content: space-between; gap: 1rem; text-align: left; width: 100%; }
.search-result-card > div:first-child { display: grid; gap: .2rem; }
.search-result-actions { display: flex; flex-wrap: wrap; gap: .45rem; justify-content: flex-end; }
.pin-button { white-space: nowrap; }
.hero-fit-stretch .dashboard-hero-media { background-size: 100% 100%; }
.hero-fit-center .dashboard-hero-media, .hero-fit-original .dashboard-hero-media { background-size: auto; background-repeat: no-repeat; }
.hero-fit-tile .dashboard-hero-media { background-size: auto; background-repeat: repeat; }
@media (max-width: 720px) {
  .dashboard-pin-toolbar, .search-result-card { flex-direction: column; align-items: stretch; }
  .search-result-actions { justify-content: flex-start; }
  .global-dashboard-hero { margin-top: .5rem; }
}

/* v0.9.11 Dashboard pin cards and pin animation polish */
.visually-hidden {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.pin-icon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.35rem;
  min-height: 2.35rem;
  padding: .45rem .65rem;
  line-height: 1;
  border-radius: 999px;
}
.pin-icon-button .pin-icon {
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1;
  transition: transform .18s ease;
}
.pin-icon-button:hover .pin-icon,
.pin-icon-button:focus-visible .pin-icon {
  transform: scale(1.15);
}
.pin-icon-button.is-pinned {
  border-color: color-mix(in srgb, var(--accent) 72%, var(--border));
  background: color-mix(in srgb, var(--accent) 16%, var(--surface));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 16%, transparent), 0 10px 24px color-mix(in srgb, var(--accent) 12%, transparent);
}
.add-to-trip-icon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.35rem;
  min-height: 2.35rem;
  padding: .45rem .65rem;
  line-height: 1;
  border-radius: 999px;
}
.add-to-trip-icon-button .add-to-trip-icon {
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1;
  transition: transform .18s ease;
}
.add-to-trip-icon-button:hover .add-to-trip-icon,
.add-to-trip-icon-button:focus-visible .add-to-trip-icon {
  transform: scale(1.15);
}
.pin-pop { animation: pin-pop .6s ease; }
@keyframes pin-pop {
  0% { transform: scale(1); }
  35% { transform: scale(1.18) rotate(-3deg); }
  70% { transform: scale(.96); }
  100% { transform: scale(1); }
}
.dashboard-pin-card {
  position: relative;
  min-height: 180px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: .55rem;
  overflow: hidden;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, opacity .18s ease;
}
.dashboard-pin-card::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle at top right, rgba(93, 214, 241, .12), transparent 42%);
  opacity: .85;
}
.dashboard-pin-card > * { position: relative; }
.dashboard-pin-card:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--accent) 42%, var(--border));
  box-shadow: 0 18px 38px rgba(0, 0, 0, .18);
}
.dashboard-pin-card-top { gap: .5rem; }
.dashboard-pin-card h4 { font-size: 1.08rem; line-height: 1.25; }
.pin-subtitle, .pin-summary { line-height: 1.35; }
.pin-summary {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.dashboard-pin-card-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: .55rem;
  margin-top: auto;
}
.dashboard-pin-card.clickable-pin-card {
  cursor: pointer;
}
.dashboard-pin-card.clickable-pin-card:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--accent) 70%, transparent);
  outline-offset: 2px;
}
.dashboard-pin-card.pin-remove {
  opacity: 0;
  transform: scale(.96) translateY(4px);
}
.dashboard-pins-minimal .dashboard-pin-card { min-height: 132px; }
.dashboard-pins-list .dashboard-pin-card,
.dashboard-pins-full_width_sections .dashboard-pin-card { min-height: 0; }
@media (max-width: 720px) {
  .dashboard-pin-card { min-height: 0; }
  .dashboard-pin-card-actions { justify-content: flex-end; }
}

.experience-hierarchy {
  display: grid;
  gap: 1.75rem;
}
.experience-top-liked-places {
  margin: 0 0 1.5rem;
}
.experience-top-liked-places .directory-grid {
  margin-top: 0.35rem;
}
.experience-top-liked-card {
  position: relative;
}
.experience-top-liked-rank {
  flex: 0 0 auto;
  min-width: 1.55rem;
  height: 1.55rem;
  padding: 0 0.35rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent, #0f766e) 88%, #000 12%);
  color: #fff;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1;
  box-shadow: 0 1px 2px rgb(0 0 0 / 18%);
}
.experience-top-liked-card .card-topline {
  gap: 0.45rem;
}
.experience-top-liked-card .card-topline .place-type-badge {
  margin-right: auto;
}
.place-top-liked-card .card-topline .place-type-badge {
  margin-right: auto;
}
.experience-country-group > h3 {
  margin: 0 0 0.85rem;
  font-size: 1.35rem;
}
.experience-city-group {
  margin: 0 0 1.15rem 0.15rem;
}
.experience-city-group > h4 {
  margin: 0 0 0.65rem;
  font-size: 1.08rem;
  color: var(--text);
}
.experience-type-group {
  margin: 0 0 1rem 0.35rem;
}
.experience-type-group > h5 {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin: 0 0 0.55rem;
  font-size: 0.95rem;
  color: var(--muted);
  font-weight: 800;
}
.experience-type-group .directory-grid {
  margin: 0;
}

/* v0.9.12 Dashboard pin card size and contrast polish */
.dashboard-pin-grid {
  grid-template-columns: repeat(auto-fit, minmax(190px, 260px));
  align-items: stretch;
}
.dashboard-pins-wide_cards .dashboard-pin-grid {
  grid-template-columns: repeat(auto-fit, minmax(260px, 340px));
}
.dashboard-pins-full_width_sections .dashboard-pin-grid,
.dashboard-pins-list .dashboard-pin-grid {
  grid-template-columns: minmax(0, 1fr);
}
.dashboard-pin-card {
  min-height: 0;
  padding: .75rem .8rem;
  gap: .35rem;
  color: var(--text);
  border: 1px solid color-mix(in srgb, var(--border) 82%, var(--accent) 12%);
  background: linear-gradient(145deg, color-mix(in srgb, var(--surface) 94%, var(--accent) 6%), color-mix(in srgb, var(--surface-soft) 82%, var(--surface) 18%));
  box-shadow: 0 10px 24px rgba(22, 33, 52, .08), inset 0 0 0 1px color-mix(in srgb, var(--surface) 72%, transparent);
}
.dashboard-pin-card::before {
  background: radial-gradient(circle at top right, color-mix(in srgb, var(--accent) 20%, transparent), transparent 36%);
  opacity: .75;
}
.dashboard-pin-card h4 {
  margin: .2rem 0 .05rem;
  font-size: 1rem;
  line-height: 1.18;
  color: var(--text);
}
.dashboard-pin-card .badge {
  padding: .28rem .55rem;
  font-size: .78rem;
}
.dashboard-pin-card .small-muted,
.pin-subtitle,
.pin-summary {
  color: var(--muted);
}
.pin-subtitle,
.pin-summary {
  margin: .1rem 0;
  line-height: 1.25;
}
.pin-summary {
  -webkit-line-clamp: 2;
}
.dashboard-pin-card-actions {
  margin-top: .35rem;
}
.dashboard-pins-density-very_compact .dashboard-pin-card {
  padding: .55rem .65rem;
}
.dashboard-pins-density-comfortable .dashboard-pin-card {
  padding: .95rem;
}
@media (max-width: 720px) {
  .dashboard-pin-grid,
  .dashboard-pins-wide_cards .dashboard-pin-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .dashboard-pin-card {
    padding: .75rem;
  }
}

/* v0.9.14 Dashboard pin card dark mode contrast fix */

/* v0.9.20 Background Import Job Foundation */
.import-job-panel {
  margin-top: 1rem;
  padding: 1rem;
  border: 1px solid var(--border-color, rgba(148, 163, 184, 0.35));
  border-radius: 18px;
  background: color-mix(in srgb, var(--surface-color, #ffffff) 92%, transparent);
}
.import-job-panel .admin-table td {
  vertical-align: top;
}
.import-job-panel .form-message {
  min-height: 1.4rem;
}


/* v0.9.21 Background Import Jobs dark mode and message cleanup */
.import-job-panel {
  background: color-mix(in srgb, var(--surface) 94%, transparent) !important;
  color: var(--text);
  box-shadow: var(--shadow);
}
.import-job-panel .note,
.import-job-panel label,
.import-job-panel .small-muted,
.import-job-panel .compact-dl dt,
.import-job-panel .admin-table th {
  color: var(--muted);
}
.import-job-panel h3,
.import-job-panel .compact-dl dd,
.import-job-panel .admin-table td,
.import-job-panel .user-line {
  color: var(--text);
}
.import-job-panel input,
.import-job-panel select,
.import-job-panel textarea {
  background: var(--bg);
  color: var(--text);
  border-color: var(--border);
}
.import-job-panel .import-summary {
  background: color-mix(in srgb, var(--surface-soft) 72%, transparent);
  border-color: var(--border);
  color: var(--text);
}
.import-job-panel .form-message,
.form-message.safe-message {
  color: var(--muted);
  background: color-mix(in srgb, var(--surface-soft) 55%, transparent);
  border: 1px solid var(--border);
  border-radius: .85rem;
  padding: .65rem .8rem;
}
.form-message.warning-message {
  color: var(--text);
  background: color-mix(in srgb, #f59e0b 12%, var(--surface));
  border: 1px solid color-mix(in srgb, #f59e0b 40%, var(--border));
  border-radius: .85rem;
  padding: .65rem .8rem;
}
@media (prefers-color-scheme: dark) {
  .import-job-panel {
    background: color-mix(in srgb, var(--surface) 96%, #000 4%) !important;
    border-color: var(--border);
  }
  .import-job-panel input,
  .import-job-panel select,
  .import-job-panel textarea {
    background: #0b1220;
    color: var(--text);
  }
}


.status-pill {
  display: inline-flex;
  align-items: center;
  border: 1px solid color-mix(in srgb, var(--accent) 40%, var(--border));
  border-radius: 999px;
  padding: 0.3rem 0.7rem;
  background: color-mix(in srgb, var(--accent) 16%, var(--surface));
  color: var(--accent-strong);
  font-size: 0.82rem;
  font-weight: 700;
}
.status-pill.neutral {
  border-color: color-mix(in srgb, var(--muted) 35%, var(--border));
  background: color-mix(in srgb, var(--muted) 12%, var(--surface));
  color: var(--text);
}


.content-model-inline-note {
  margin-bottom: 1rem;
  padding: .75rem .85rem;
  border: 1px solid var(--border);
  border-radius: .9rem;
  background: color-mix(in srgb, var(--surface-soft) 48%, transparent);
}

.country-import-reactivation-panel {
  border-style: solid;
}
.country-import-reactivation-panel .confirmation-toolbar {
  align-items: flex-end;
}
.checkbox-label {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-weight: 700;
}
.checkbox-label input {
  width: auto;
  min-width: 1rem;
}


/* v0.9.50-r8: Country-City Browsing Validation */
.browse-validation-slot {
  margin: 1rem 0;
}

.browse-validation-panel,
.admin-readonly-panel {
  border: 1px solid var(--border);
  border-radius: 1.1rem;
  background: color-mix(in srgb, var(--surface-soft) 58%, transparent);
  padding: 1rem;
}

.public-browse-validation {
  margin-bottom: 1rem;
}

.mini-stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(135px, 1fr));
  gap: .75rem;
  margin: .85rem 0;
}

.mini-stat-card {
  border: 1px solid var(--border);
  border-radius: .95rem;
  background: color-mix(in srgb, var(--surface) 78%, transparent);
  padding: .75rem;
  min-height: 5rem;
}

.mini-stat-card strong {
  display: block;
  font-size: 1.35rem;
  line-height: 1.1;
}

.mini-stat-card span {
  display: block;
  color: var(--muted);
  font-weight: 750;
  margin-top: .25rem;
}

.mini-stat-card small {
  display: block;
  color: var(--muted);
  margin-top: .25rem;
}

.browse-country-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: .55rem;
  margin-top: .75rem;
}

.browse-country-chip {
  border: 1px solid var(--border);
  border-radius: .85rem;
  background: color-mix(in srgb, var(--surface) 76%, transparent);
  color: var(--text);
  cursor: pointer;
  display: grid;
  gap: .2rem;
  padding: .7rem .8rem;
  text-align: left;
}

.browse-country-chip:hover,
.browse-country-chip:focus {
  border-color: var(--accent);
  outline: none;
}

.browse-country-chip span {
  font-weight: 850;
}

.browse-country-chip small {
  color: var(--muted);
}

.validation-status-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: .5rem;
  margin: .75rem 0;
}

.validation-status-grid p,
.safe-message,
.warning-box {
  border: 1px solid var(--border);
  border-radius: .85rem;
  background: color-mix(in srgb, var(--surface) 76%, transparent);
  margin: 0;
  padding: .65rem .75rem;
}

.safe-message {
  border-color: rgba(34, 197, 94, .35);
}

.warning-box {
  border-color: rgba(251, 191, 36, .45);
}

.warning-box ul {
  margin: .45rem 0 0;
  padding-left: 1.1rem;
}

.compact-table-wrap {
  margin-top: .8rem;
}

.compact-admin-table td,
.compact-admin-table th {
  font-size: .9rem;
}


/* v0.9.50-r9: Country-City Browser Polish */
.location-browser-controls {
  border: 1px solid var(--border);
  border-radius: 1.1rem;
  background: color-mix(in srgb, var(--surface-soft) 52%, transparent);
  margin: 1rem 0;
  padding: 1rem;
}

.polished-browser-panel {
  display: grid;
  gap: .9rem;
}

.polished-stat-grid {
  grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
}

.browser-safety-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
}

.safety-chip {
  border: 1px solid var(--border);
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface) 74%, transparent);
  color: var(--muted);
  display: inline-flex;
  font-size: .82rem;
  font-weight: 800;
  padding: .32rem .65rem;
}

.safety-chip.safe {
  border-color: rgba(34, 197, 94, .35);
}

.safety-chip.warning {
  border-color: rgba(251, 191, 36, .45);
}

.safety-chip.danger {
  border-color: rgba(248, 113, 113, .55);
}

.browser-result-note {
  align-items: center;
  border: 1px solid var(--border);
  border-radius: .9rem;
  background: color-mix(in srgb, var(--surface) 72%, transparent);
  display: flex;
  flex-wrap: wrap;
  gap: .5rem 1rem;
  justify-content: space-between;
  padding: .7rem .8rem;
}

.browser-result-note span {
  color: var(--muted);
}

.browser-country-sections,
.admin-browser-split {
  display: grid;
  gap: .9rem;
}

.browse-country-card-grid {
  display: grid;
  gap: .55rem;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.compact-country-grid {
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
}

.browse-country-card {
  border: 1px solid var(--border);
  border-radius: .9rem;
  background: color-mix(in srgb, var(--surface) 76%, transparent);
  color: var(--text);
  cursor: pointer;
  display: grid;
  gap: .35rem;
  padding: .75rem .85rem;
  text-align: left;
}

.browse-country-card:hover,
.browse-country-card:focus {
  border-color: var(--accent);
  outline: none;
}

.browse-country-card.no-city {
  border-style: dashed;
}

.browse-country-card-main {
  display: grid;
  gap: .15rem;
}

.browse-country-card-main strong {
  font-weight: 900;
}
.browse-country-name {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
}
.browse-country-name .country-flag {
  width: 32px;
  height: 22px;
}

.browse-country-card-main small,
.browse-country-card-meta {
  color: var(--muted);
}

.browse-country-card-status {
  align-self: start;
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--muted);
  display: inline-flex;
  font-size: .78rem;
  font-weight: 800;
  justify-self: start;
  padding: .2rem .5rem;
}

.compact-heading {
  gap: .65rem;
  margin-bottom: .55rem;
}

@media (min-width: 980px) {
  .browser-country-sections,
  .admin-browser-split {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .browser-result-note {
    align-items: flex-start;
    flex-direction: column;
  }
}




.compact-note {
  font-size: .85rem;
  margin: 0;
}



/* v0.9.50-r17: guarded controlled publish action */
.button.danger {
  background: rgba(220, 38, 38, 0.92);
  color: white;
}


.checkbox-label {
  align-items: center;
  display: flex;
  gap: .55rem;
  font-weight: 800;
}

.checkbox-label input[type="checkbox"] {
  width: auto;
}


.compact-details .code-block {
  display: block;
  max-height: 18rem;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
  padding: 0.8rem;
  border-radius: 0.8rem;
  background: rgba(15, 23, 42, 0.06);
}

.compact-details {
  margin-top: 0.8rem;
}

.compact-details summary {
  cursor: pointer;
  font-weight: 700;
}







.checkbox-label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.checkbox-label input {
  width: auto;
}


/* v0.9.50-r24 Admin Places cleanup */
.places-workflow-guide {
  margin-bottom: 1rem;
}
.primary-place-workflow-panel {
  border-color: rgba(59, 130, 246, 0.35);
}
.admin-advanced-place-tools,
.admin-manual-place-editor {
  margin: 1rem 0;
  border: 1px solid var(--border);
  border-radius: 1rem;
  background: rgba(15, 23, 42, 0.24);
}
.admin-advanced-place-tools > summary,
.admin-manual-place-editor > summary {
  cursor: pointer;
  padding: 0.9rem 1rem;
  font-weight: 700;
}
.admin-advanced-place-tools > .note,
.admin-manual-place-editor > .note {
  margin: 0 1rem 1rem;
}
.admin-manual-place-editor form,
.admin-manual-place-editor .table-wrap {
  margin-left: 1rem;
  margin-right: 1rem;
}


/* r25 Import Tools Wizard cleanup */
.import-wizard-panel {
  border: 1px solid rgba(31, 117, 163, 0.18);
  background: linear-gradient(180deg, rgba(244, 250, 255, 0.92), rgba(255, 255, 255, 0.98));
}

.import-wizard-layout {
  display: grid;
  grid-template-columns: minmax(180px, 240px) 1fr;
  gap: 1rem;
  align-items: start;
  margin-top: 1rem;
}

.import-wizard-stack {
  display: grid;
  gap: 1rem;
  margin-top: 1rem;
}

.import-wizard-nav {
  display: none;
}

.import-wizard-tab {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  width: 100%;
  border: 1px solid rgba(23, 55, 79, 0.14);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.88);
  padding: 0.8rem 0.9rem;
  color: var(--text-color, #183247);
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}

.import-wizard-tab span {
  display: inline-grid;
  place-items: center;
  width: 1.65rem;
  height: 1.65rem;
  border-radius: 999px;
  background: rgba(31, 117, 163, 0.12);
  color: #1f75a3;
}

.import-wizard-tab.active,
.import-wizard-tab:hover {
  border-color: rgba(31, 117, 163, 0.42);
  box-shadow: 0 8px 24px rgba(14, 67, 101, 0.08);
  background: #ffffff;
}

.import-wizard-tab.active span {
  background: #1f75a3;
  color: #fff;
}

.import-wizard-pages {
  min-width: 0;
}

.import-wizard-world-card,
.import-wizard-page,
.import-wizard-extra {
  border: 1px solid rgba(23, 55, 79, 0.12);
  border-radius: 18px;
  padding: 1rem;
  background: rgba(255, 255, 255, 0.95);
  box-shadow: 0 12px 34px rgba(14, 67, 101, 0.07);
}

.import-wizard-world-card {
  display: block;
  margin-bottom: 0;
  border-color: rgba(31, 117, 163, 0.28);
  background: linear-gradient(180deg, rgba(244, 250, 255, 0.98), rgba(255, 255, 255, 0.98));
}

.import-wizard-divider {
  border: 0;
  border-top: 1px solid rgba(23, 55, 79, 0.12);
  margin: 1.25rem 0 1rem;
}

.import-wizard-extra {
  display: block;
}

.import-wizard-extra > summary {
  cursor: pointer;
  font-weight: 700;
  list-style: none;
}

.import-wizard-extra > summary::-webkit-details-marker {
  display: none;
}

.import-wizard-extra[open] > summary {
  margin-bottom: 0.85rem;
}

.import-wizard-page {
  display: none;
}

.import-wizard-page.active {
  display: block;
}

.wizard-reference-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(135px, 1fr));
  gap: 0.55rem;
  margin: 0.75rem 0 1rem;
}

.wizard-reference-grid span {
  border: 1px solid rgba(31, 117, 163, 0.16);
  border-radius: 999px;
  padding: 0.55rem 0.75rem;
  background: rgba(31, 117, 163, 0.07);
  font-weight: 700;
  text-align: center;
}

.wizard-three-column {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
  margin: 0.75rem 0;
}

.import-wizard-advanced {
  margin-top: 1rem;
  border-color: rgba(130, 91, 20, 0.24);
}

.import-wizard-advanced > summary {
  font-weight: 800;
}

@media (max-width: 780px) {
  .import-wizard-layout,
  .wizard-three-column {
    grid-template-columns: 1fr;
  }

  .import-wizard-nav {
    position: static;
  }
}


/* Import Tools contrast — theme tokens (Plum Mist light + dark schemes) */
.import-wizard-panel {
  border-color: var(--border);
  background: color-mix(in srgb, var(--surface) 94%, var(--surface-soft));
  color: var(--text);
  box-shadow: var(--shadow);
}

.import-wizard-panel .eyebrow {
  color: var(--accent);
}

.import-wizard-panel h3,
.import-wizard-panel h4,
.import-wizard-panel strong,
.import-reset-notice h3,
.import-reset-notice h4 {
  color: var(--text);
}

.import-wizard-panel .note,
.import-wizard-panel .small-muted,
.import-wizard-panel .wizard-field-note,
.import-wizard-panel label,
.import-reset-notice .note {
  color: var(--muted);
}

.import-wizard-panel select,
.import-wizard-panel input:not([type="checkbox"]):not([type="radio"]),
.import-wizard-panel textarea {
  color: var(--text);
  background: var(--surface);
  border-color: var(--border);
}

.import-wizard-panel .admin-readonly-panel {
  background: color-mix(in srgb, var(--surface-soft) 78%, var(--surface));
  border-color: var(--border);
  color: var(--text);
}

.import-wizard-panel .import-summary,
.import-wizard-panel .form-message.safe-message,
.import-wizard-panel .import-summary-state {
  color: var(--text);
  background: color-mix(in srgb, var(--surface) 90%, var(--surface-soft));
  border: 1px solid var(--border);
}

.import-wizard-panel .import-summary-state .small-muted,
.import-wizard-panel .form-message.safe-message .small-muted {
  color: var(--muted);
}

.import-wizard-tab {
  background: color-mix(in srgb, var(--surface) 92%, var(--surface-soft));
  color: var(--text);
  border-color: var(--border);
}

.import-wizard-tab span {
  background: color-mix(in srgb, var(--accent) 14%, transparent);
  color: var(--accent);
}

.import-wizard-tab.active,
.import-wizard-tab:hover {
  background: color-mix(in srgb, var(--accent) 12%, var(--surface));
  color: var(--text);
  border-color: color-mix(in srgb, var(--accent) 42%, var(--border));
}

.import-wizard-tab.active span {
  background: var(--accent);
  color: var(--accent-contrast);
}

.import-wizard-page,
.import-wizard-extra {
  background: color-mix(in srgb, var(--surface) 96%, var(--surface-soft));
  color: var(--text);
  border-color: var(--border);
  box-shadow: none;
}

.import-wizard-world-card {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--accent) 8%, var(--surface)),
    color-mix(in srgb, var(--surface) 96%, var(--surface-soft))
  );
  color: var(--text);
  border-color: color-mix(in srgb, var(--accent) 28%, var(--border));
  box-shadow: none;
}

.wizard-reference-grid span {
  color: var(--text);
  background: color-mix(in srgb, var(--accent) 10%, var(--surface));
  border-color: color-mix(in srgb, var(--accent) 28%, var(--border));
}

.import-wizard-primary-action {
  min-width: min(100%, 18rem);
}

.import-wizard-result {
  margin-top: 0.85rem;
}

.import-wizard-download-report {
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 0.9rem;
  background: color-mix(in srgb, var(--surface-soft) 72%, var(--surface));
  color: var(--text);
}

.import-wizard-download-report .compact-dl {
  margin: 0.5rem 0;
}

.import-wizard-download-report .compact-dl dt {
  color: var(--muted);
}

.import-wizard-download-report .compact-dl dd,
.import-wizard-download-report p,
.import-wizard-download-report strong {
  color: var(--text);
}

.import-wizard-download-report .safe-message {
  color: var(--text);
}

.import-wizard-download-report .warning-message {
  color: var(--text);
}

.import-reset-notice {
  background: color-mix(in srgb, var(--surface-soft) 70%, var(--surface));
  color: var(--text);
  border-color: var(--border);
}


.wizard-field-note {
  align-self: end;
  margin: 0;
  padding: 0.55rem 0;
}

.import-wizard-safety-box {
  margin: 1rem 0;
  padding: 0.9rem 1rem;
  border: 1px solid var(--border);
  border-radius: 0.85rem;
  background: color-mix(in srgb, var(--surface-soft) 70%, var(--surface));
  color: var(--text);
}

.import-wizard-cleanup-card h5 {
  margin: 0 0 0.35rem;
  color: var(--text);
}

.import-wizard-key-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin: 0.65rem 0;
}

.import-wizard-key-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--border));
  border-radius: 999px;
  padding: 0.35rem 0.45rem 0.35rem 0.7rem;
  background: color-mix(in srgb, var(--accent) 10%, var(--surface));
  color: var(--text);
}

.import-wizard-key-chip code {
  color: var(--accent-strong, var(--accent));
  background: transparent;
  font-weight: 700;
}

.wizard-inline-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: end;
}

.wizard-inline-controls label {
  min-width: min(100%, 16rem);
  color: var(--text);
}

.button.tiny {
  min-height: 0;
  padding: 0.25rem 0.55rem;
  font-size: 0.78rem;
}


.import-wizard-copyable-row {
  display: grid;
  gap: 0.35rem;
  margin: 0.75rem 0;
}

.import-wizard-copyable-row input {
  width: 100%;
  border: 1px solid var(--border);
  border-radius: 0.75rem;
  background: var(--surface);
  color: var(--text);
  padding: 0.65rem 0.8rem;
  font: inherit;
}


/* v0.9.50-r45: media/search/location display repairs */
.logo-mark.has-logo {
  width: 3.4rem;
  height: 3.4rem;
  min-width: 3.4rem;
  border-radius: 0.7rem;
  background: transparent;
  box-shadow: none;
  overflow: visible;
}
.logo-mark.has-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 0;
}
.dashboard-hero-media {
  z-index: 0;
  overflow: hidden;
}
.dashboard-hero-video {
  display: block;
  background: #101b2b;
}
.search-result-title {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.search-result-title .country-flag {
  width: 28px;
  height: 20px;
}
.search-result-flag {
  font-size: 1.15em;
  line-height: 1;
}
.context-block .form-actions.compact-actions {
  margin-top: 0.8rem;
}

/* r101 — Featured place placements */
.badge.featured-badge {
  border-color: color-mix(in srgb, #c9a227 55%, var(--border));
  background: color-mix(in srgb, #c9a227 16%, transparent);
  color: #8a6a12;
  font-weight: 900;
}
.badge.advert-badge {
  border-color: color-mix(in srgb, #b45309 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 18%, transparent);
  color: #92400e;
  font-weight: 900;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  font-size: 0.68rem;
}
.badge.capital-badge {
  border-color: color-mix(in srgb, #2563eb 45%, var(--border));
  background: color-mix(in srgb, #2563eb 14%, transparent);
  color: #1d4ed8;
  font-weight: 900;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  font-size: 0.68rem;
  padding: 0.15rem 0.5rem;
}
@media (prefers-color-scheme: dark) {
  .badge.featured-badge {
    color: #f0d78c;
    border-color: rgba(240, 215, 140, 0.45);
    background: rgba(240, 215, 140, 0.12);
  }
  .badge.capital-badge {
    color: #93c5fd;
    border-color: rgba(147, 197, 253, 0.45);
    background: rgba(147, 197, 253, 0.14);
  }
  .badge.advert-badge {
    color: #fbbf24;
    border-color: rgba(251, 191, 36, 0.45);
    background: rgba(251, 191, 36, 0.12);
  }
}
.places-adverts-strip {
  margin: 0 0 1.15rem;
  padding: 0.75rem 0.85rem 0.9rem;
  border: 1px dashed color-mix(in srgb, #b45309 35%, var(--border));
  border-radius: 0.9rem;
  background: color-mix(in srgb, #f59e0b 6%, var(--surface, #fff));
}
.location-place-adverts {
  margin-top: 0.35rem;
}
.page-stack > .page-place-adverts,
.page-stack .page-place-adverts {
  margin: 0.15rem 0 0.35rem;
}
#countryPageContent .page-place-adverts,
#cityPageContent .page-place-adverts,
#continentPageContent .page-place-adverts {
  margin: 0;
}
.location-place-adverts-empty {
  margin: 0.35rem 0 0;
}
.places-adverts-row .places-adverts-empty {
  /* The Places page's empty-state message renders inside the same 5-column grid as the ad
     cards, so without this it's squeezed into a single column and wraps across 8+ lines. */
  grid-column: 1 / -1;
}
.places-adverts-heading {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin-bottom: 0.65rem;
}
.places-adverts-row {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.55rem;
}
.place-advert-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-width: 0;
  margin: 0;
  padding: 0.45rem 0.5rem 0.55rem;
  border: 1px solid color-mix(in srgb, #b45309 28%, var(--border));
  border-radius: 0.7rem;
  background: color-mix(in srgb, var(--surface, #fff) 92%, #f59e0b 8%);
  cursor: pointer;
  transition: border-color 120ms ease, transform 120ms ease;
}
.place-advert-card:hover,
.place-advert-card:focus-visible {
  border-color: color-mix(in srgb, #b45309 55%, var(--border));
  transform: translateY(-1px);
  outline: none;
}
.place-advert-card .advert-badge {
  align-self: flex-start;
  margin: 0;
}
.place-advert-card .imported-place-image.card-image {
  margin: 0;
  border-radius: 0.45rem;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  max-height: 3.4rem;
}
.place-advert-card .imported-place-image.card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.place-advert-card-body {
  min-width: 0;
}
.place-advert-card-body h4 {
  margin: 0;
  font-size: 0.82rem;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.place-advert-card-body .small-muted {
  margin: 0.15rem 0 0;
  font-size: 0.72rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (max-width: 900px) {
  .places-adverts-row {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
    min-width: 0;
    width: 100%;
    gap: 0.5rem;
    padding-bottom: 0.15rem;
    scroll-snap-type: x proximity;
  }
  .place-advert-card {
    flex: 0 0 8.5rem;
    scroll-snap-align: start;
  }
}
@media (max-width: 620px) {
  /* Matches isMobileSearchViewport()'s breakpoint, where pagePlaceAdvertsSlotCount
     caps at 2 cards — size them to fill the row instead of a fixed narrow width,
     so there's no partial third card clipped at the edge. */
  .place-advert-card {
    flex: 0 0 calc(50% - 0.25rem);
  }
}
.place-card-featured {
  border-color: color-mix(in srgb, #c9a227 40%, var(--border));
  box-shadow: 0 0 0 1px color-mix(in srgb, #c9a227 18%, transparent), var(--shadow);
}
.featured-request-panel .compact-actions {
  gap: 0.65rem;
}

.plans-ea-banner,
.plans-intro-offer-banner {
  margin: 0 0 1.25rem;
  padding: 0.9rem 1.1rem;
  border: 1px solid var(--border);
  border-radius: 1rem;
  background: color-mix(in srgb, var(--surface-soft) 70%, transparent);
  line-height: 1.45;
}
.plans-intro-offer-banner {
  border-color: color-mix(in srgb, var(--accent) 35%, var(--border));
  background: color-mix(in srgb, var(--accent) 10%, var(--surface));
}
.plans-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  margin-bottom: 1.5rem;
}
.plan-card {
  padding: 1.1rem 1.15rem;
  border: 1px solid var(--border);
  border-radius: 1.1rem;
  background: color-mix(in srgb, var(--surface-soft) 45%, transparent);
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}
.plan-card-topline {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0.65rem;
}
.plan-card-topline h3 {
  margin: 0;
  min-width: 0;
  flex: 1 1 auto;
}
.plan-card-price {
  display: grid;
  gap: 0.15rem;
  margin: 0 0 0.25rem;
}
.plan-card-price strong {
  font-size: 1.2rem;
}
.plan-card-price-year {
  display: block;
}
.plan-card ul,
.plan-type-card ul {
  margin: 0.75rem 0 0;
  padding-left: 1.1rem;
  display: grid;
  gap: 0.35rem;
}
.plan-card-licensed,
.plan-card-licensed_plus.is-recommended {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
}
.plan-card.is-recommended {
  border-color: color-mix(in srgb, #3d8b6e 50%, var(--border));
  background: color-mix(in srgb, #3d8b6e 8%, var(--surface));
}
.plan-recommended-badge {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  border-radius: 999px;
  padding: 0.28rem 0.65rem;
  border: 1px solid color-mix(in srgb, var(--accent) 45%, var(--border));
  background: color-mix(in srgb, var(--accent) 16%, var(--surface));
  color: var(--accent-strong);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.plan-card-offer {
  margin-top: auto;
  padding: 0.7rem 0.8rem;
  border-radius: 0.8rem;
  border: 1px solid color-mix(in srgb, #3d8b6e 40%, var(--border));
  background: color-mix(in srgb, #3d8b6e 12%, transparent);
  font-size: 0.9rem;
  line-height: 1.4;
}
.plans-subdomain-footnote {
  margin: 0.35rem 0 0;
}
.plans-comparison-wrap,
.plans-ads-grid {
  margin-top: 0.35rem;
}
.plans-comparison-scroll {
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: 1rem;
  background: color-mix(in srgb, var(--surface) 92%, transparent);
}
.plans-comparison-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 720px;
  font-size: 0.92rem;
}
.plans-comparison-table th,
.plans-comparison-table td {
  padding: 0.7rem 0.85rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  text-align: center;
}
.plans-comparison-table th:first-child,
.plans-comparison-table td:first-child,
.plans-comparison-table tbody th {
  text-align: left;
}
.plans-comparison-table thead th {
  background: color-mix(in srgb, var(--surface-soft) 70%, transparent);
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
}
.plans-comparison-table tr.is-ad-row td,
.plans-comparison-table tr.is-ad-row th {
  background: color-mix(in srgb, var(--accent) 8%, transparent);
}
.plans-compare-yes { color: #7ddea0; font-weight: 700; }
.plans-compare-no { color: var(--muted); }
.plans-compare-text { color: var(--text); }
.plans-compare-carousel {
  display: none;
  flex-direction: column;
  align-items: center;
  gap: 0.55rem;
  margin-top: 0.7rem;
}
.plans-compare-carousel[hidden] {
  display: none !important;
}
.plans-compare-carousel-plan {
  margin: 0;
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--text);
  letter-spacing: 0.01em;
}
.plans-compare-carousel-dots {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
}
.plans-compare-carousel-dot {
  width: 0.55rem;
  height: 0.55rem;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: color-mix(in srgb, var(--muted) 48%, transparent);
  cursor: pointer;
  transition: width 160ms ease, background-color 160ms ease;
}
.plans-compare-carousel-dot.is-active {
  width: 1.35rem;
  background: var(--accent);
}
.plans-compare-carousel-dot:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--accent) 55%, transparent);
  outline-offset: 3px;
}
.plans-ads-grid {
  display: grid;
  gap: 0.9rem;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
.plan-ad-card {
  padding: 1rem 1.1rem;
  border: 1px solid var(--border);
  border-radius: 1.05rem;
  background: color-mix(in srgb, var(--surface-soft) 40%, transparent);
}
.plan-ad-card h3 { margin: 0; }
.plans-type-extras h3 {
  margin: 0 0 0.85rem;
}
.plans-type-grid {
  display: grid;
  gap: 0.85rem;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}
.plan-type-card {
  padding: 0.85rem 1rem;
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  border-radius: 0.9rem;
}
.plan-type-card h4 {
  margin: 0;
}
.place-owner-panel,
.place-claim-panel,
.featured-request-panel {
  margin: 1.15rem 0;
  padding: 1.15rem 1.2rem;
  border: 1px solid var(--border);
  border-radius: 1.15rem;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--surface-soft) 72%, transparent), transparent 55%),
    color-mix(in srgb, var(--surface) 92%, transparent);
}
.place-owner-kicker {
  margin: 0 0 0.35rem;
  color: var(--accent);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.place-claim-panel h4,
.featured-request-panel h4 {
  margin: 0 0 0.45rem;
  font-size: 1.15rem;
}
.place-claim-panel .note,
.featured-request-panel .note {
  max-width: 62ch;
}
.place-claim-form {
  display: grid;
  gap: 0.85rem;
  margin-top: 0.95rem;
}
.place-claim-form textarea {
  width: 100%;
  min-height: 5.5rem;
  border: 1px solid var(--border);
  border-radius: 0.9rem;
  padding: 0.8rem 0.9rem;
  background: var(--bg);
  color: var(--text);
  font: inherit;
  resize: vertical;
}
.place-claim-form .form-actions,
.featured-request-panel .form-actions {
  margin-top: 0.15rem;
}
.advert-preview {
  margin: 0.95rem 0;
}
.advert-preview-label {
  margin: 0 0 0.5rem;
}
.place-advert-card-preview-wrap {
  max-width: 220px;
}
.place-advert-card-preview-wrap .place-advert-card {
  cursor: default;
  pointer-events: none;
}
.warning-note {
  margin: 0.75rem 0 0;
  padding: 0.75rem 0.9rem;
  border: 1px solid color-mix(in srgb, #c9a227 35%, var(--border));
  border-left: 3px solid color-mix(in srgb, #c9a227 75%, transparent);
  background: color-mix(in srgb, #c9a227 10%, transparent);
  border-radius: 0.75rem;
  line-height: 1.45;
}
.checkbox-inline {
  display: flex;
  align-items: flex-start;
  gap: 0.7rem;
  margin: 0;
  font-size: 0.92rem;
  font-weight: 650;
  line-height: 1.4;
  color: var(--text);
}
.checkbox-inline input[type="checkbox"] {
  width: auto;
  min-width: 1.15rem;
  max-width: 1.15rem;
  height: 1.15rem;
  margin: 0.15rem 0 0;
  flex: 0 0 auto;
  accent-color: var(--accent);
}
.checkbox-inline span {
  min-width: 0;
  flex: 1 1 auto;
}

/* r100 / r165 — Sitewide mobile layout polish */
html {
  overflow-x: hidden;
  max-width: 100%;
}
body {
  overflow-x: hidden;
  max-width: 100%;
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right);
}
.brand > div { min-width: 0; }
.brand h1 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.main-nav-toggle {
  display: none;
  width: 2.55rem;
  height: 2.55rem;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 0.9rem;
  background: var(--surface);
  color: var(--text);
  cursor: pointer;
  place-items: center;
  gap: 0.16rem;
  flex-direction: column;
  flex: 0 0 auto;
  box-shadow: 0 6px 16px rgb(0 0 0 / 10%);
}
.main-nav-toggle span {
  display: block;
  width: 1.05rem;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
  transform-origin: center;
  transition: transform 0.18s ease, opacity 0.18s ease;
}
.site-header.nav-open .main-nav-toggle {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
  color: var(--accent);
}
.site-header.nav-open .main-nav-toggle span:nth-child(1) {
  transform: translateY(0.22rem) rotate(45deg);
}
.site-header.nav-open .main-nav-toggle span:nth-child(2) {
  opacity: 0;
  transform: scaleX(0.2);
}
.site-header.nav-open .main-nav-toggle span:nth-child(3) {
  transform: translateY(-0.22rem) rotate(-45deg);
}
@media (max-width: 760px) {
  .site-header {
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: 0;
    padding-left: max(0.85rem, env(safe-area-inset-left));
    padding-right: max(0.85rem, env(safe-area-inset-right));
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
  }
  .header-top-row {
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.55rem;
  }
  .brand {
    flex: 1 1 auto;
    min-width: 0;
  }
  .brand p { display: none; }
  .header-left {
    flex: 1 1 auto;
    min-width: 0;
    gap: 0.4rem;
  }
  .header-right {
    flex: 0 0 auto;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.35rem;
    margin-left: 0;
    min-width: 0;
  }
  .header-utils { display: none; }
  .language-switcher {
    max-width: none;
    flex: 0 0 auto;
  }
  .language-switcher-toggle {
    max-width: min(42vw, 11.5rem);
    min-height: 2rem;
    padding: 0.2rem 0.45rem 0.2rem 0.3rem;
  }
  .language-flag-label {
    font-size: 0.7rem;
  }
  .language-flag-button {
    min-height: 2.1rem;
    padding: 0.28rem 0.5rem 0.28rem 0.35rem;
  }
  .language-flag {
    width: 1.2rem;
  }
  .main-nav-toggle {
    display: inline-grid;
    width: 2.45rem;
    height: 2.45rem;
  }
  .profile-menu-wrap {
    flex: 0 0 auto;
  }
  .profile-menu-button {
    min-height: 2.45rem;
    min-width: 2.45rem;
  }
  .main-nav {
    display: none;
    position: absolute;
    left: max(0.75rem, env(safe-area-inset-left));
    right: max(0.75rem, env(safe-area-inset-right));
    top: calc(100% + 0.4rem);
    width: auto;
    max-width: none;
    max-height: calc(100vh - 100% - 1.2rem);
    overflow-y: auto;
    margin: 0;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    flex-wrap: nowrap;
    gap: 0.2rem;
    padding: 0.55rem;
    border: 1px solid color-mix(in srgb, var(--border) 80%, var(--accent) 20%);
    border-radius: 1.1rem;
    background: color-mix(in srgb, var(--surface) 94%, var(--surface-soft) 6%);
    box-shadow: 0 18px 40px rgb(0 0 0 / 28%);
    z-index: 45;
    backdrop-filter: blur(10px);
  }
  .site-header.nav-open .main-nav { display: flex; }
  .main-nav > a,
  .main-nav > .nav-dropdown {
    flex: 0 0 auto;
    width: 100%;
    text-align: left;
  }
  .main-nav a,
  .main-nav .nav-dropdown-trigger {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.1rem;
    width: 100%;
    padding: 0.7rem 0.95rem;
    border-radius: 0.85rem;
    border: 1px solid transparent;
    color: var(--text);
    justify-content: flex-start;
    text-align: left;
  }
  .main-nav a strong,
  .main-nav .nav-dropdown-trigger strong {
    font-weight: 750;
    font-size: 1rem;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
  }
  .main-nav a small,
  .main-nav .nav-dropdown-trigger small {
    color: var(--muted);
    font-size: 0.8rem;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
  }
  .nav-dropdown-trigger > span:first-child {
    align-items: flex-start;
  }
  .main-nav a:hover,
  .main-nav a:focus-visible,
  .main-nav .nav-dropdown-trigger:hover,
  .main-nav .nav-dropdown-trigger:focus-visible {
    background: var(--surface-soft);
    border-color: var(--border);
    text-decoration: none;
    outline: none;
  }
  .main-nav a.active-nav-link,
  .main-nav .nav-dropdown-trigger.active-nav-link {
    background: color-mix(in srgb, var(--accent) 18%, var(--surface-soft));
    border-color: color-mix(in srgb, var(--accent) 35%, var(--border));
    color: var(--accent-strong);
  }
  .main-nav-mobile-only { display: block !important; }
  .nav-dropdown { display: block; }
  .nav-dropdown-menu {
    position: static;
    left: auto;
    transform: none;
    min-width: 0;
    width: 100%;
    margin-top: 0.25rem;
    box-shadow: none;
    border-color: color-mix(in srgb, var(--border) 80%, transparent);
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    display: none;
  }
  .nav-dropdown.is-open .nav-dropdown-menu {
    display: grid;
    transform: none;
  }
  .nav-dropdown-menu a {
    white-space: normal;
  }
  .profile-menu-wrap {
    flex: 0 0 auto;
  }
  .profile-menu,
  .profile-menu.is-guest-auth,
  .profile-menu:not(.is-guest-auth) {
    position: fixed;
    top: max(4.5rem, calc(env(safe-area-inset-top) + 3.75rem));
    left: max(0.75rem, env(safe-area-inset-left));
    right: max(0.75rem, env(safe-area-inset-right));
    width: auto;
    min-width: 0;
    max-width: none;
    max-height: calc(100dvh - 5.5rem - env(safe-area-inset-bottom));
    overflow: auto;
    z-index: 50;
  }
  /* Guest sign-in uses the in-flow banner on phones; hide the header dropdown shell */
  body.guest-auth-banner-open .profile-menu.is-guest-auth {
    display: none;
  }
  .panel-header,
  .section-heading-row {
    flex-direction: column;
    align-items: stretch;
  }
  .panel-header .badge,
  .section-heading-row .badge {
    align-self: flex-start;
  }
  .converter-controls select,
  .converter-controls input[type="number"],
  .converter-row select {
    min-width: 0;
    width: 100%;
  }
  .converter-row,
  .converter-controls label { width: 100%; }
  .admin-toolbar label {
    min-width: 0;
    width: 100%;
  }
  .filters-row label {
    min-width: 0;
    width: 100%;
  }
  .button,
  .heart-button { min-height: 2.75rem; }
  .profile-menu-button { min-height: 2.45rem; }
  .location-context-header-actions .button,
  .form-actions .button { width: 100%; }
  .form-actions { width: 100%; }
  .place-card-actions .button.secondary:not(.pin-icon-button):not(.add-to-trip-icon-button) {
    flex: 1 1 100%;
    white-space: normal;
    text-align: center;
  }
  .dashboard-pins-wide_cards .dashboard-pin-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  main {
    width: min(var(--shell-max), calc(100% - 1.5rem));
    max-width: 100%;
  }
  .panel,
  .card,
  .status-card,
  .hero { max-width: 100%; min-width: 0; }
  .hero { grid-template-columns: 1fr; }
}

@media (max-width: 400px) {
  .site-header {
    gap: 0.4rem;
    padding-top: 0.7rem;
    padding-bottom: 0.7rem;
  }
  .logo-mark {
    width: 2.45rem;
    height: 2.45rem;
    border-radius: 0.85rem;
  }
  .brand h1 {
    font-size: 0.95rem;
  }
  .language-switcher {
    max-width: none;
  }
  .language-switcher-toggle {
    min-width: 2.55rem;
    min-height: 1.9rem;
    padding: 0.14rem 0.35rem 0.14rem 0.22rem;
  }
  .language-flag {
    width: 1.05rem;
  }
  .main-nav-toggle,
  .profile-menu-button {
    width: 2.25rem;
    height: 2.25rem;
    min-width: 2.25rem;
    min-height: 2.25rem;
  }
}

.noscript-banner {
  margin: 0;
  padding: 0.85rem 1rem;
  background: #0f172a;
  color: #f8fafc;
  text-align: center;
  font-size: 0.95rem;
}
.mfa-settings-panel {
  display: grid;
  gap: 0.9rem;
  padding-top: 0.35rem;
}
.mfa-qr-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
}
.mfa-qr-image {
  width: 220px;
  height: 220px;
  border-radius: 0.75rem;
  border: 1px solid var(--border);
  background: #fff;
}
.mfa-secret-block {
  min-width: min(100%, 16rem);
  display: grid;
  gap: 0.35rem;
}
.mfa-manual-secret {
  display: inline-block;
  padding: 0.55rem 0.7rem;
  border-radius: 0.55rem;
  border: 1px dashed var(--border);
  background: color-mix(in srgb, var(--surface-soft, #f8fafc) 80%, transparent);
  word-break: break-all;
  font-size: 0.92rem;
}
.mfa-backup-panel {
  display: grid;
  gap: 0.7rem;
  padding: 0.85rem;
  border: 1px solid var(--border);
  border-radius: 0.85rem;
  background: color-mix(in srgb, var(--surface-soft, #f8fafc) 70%, transparent);
}
.mfa-backup-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.35rem;
  grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
}
.mfa-backup-list code {
  display: block;
  padding: 0.4rem 0.55rem;
  border-radius: 0.45rem;
  border: 1px solid var(--border);
  text-align: center;
  font-size: 0.9rem;
}

/* r173 — Public pages visual + layout polish */
.page-stack {
  display: grid;
  gap: 1.35rem;
}
.page-section {
  display: grid;
  gap: 0.85rem;
  padding: 1.05rem 1.15rem;
  border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
  border-radius: 1.2rem;
  background:
    linear-gradient(160deg, color-mix(in srgb, var(--surface-soft) 55%, transparent), transparent 58%),
    color-mix(in srgb, var(--surface) 94%, transparent);
}
.page-section.is-quiet {
  padding: 0.85rem 1rem;
  background: color-mix(in srgb, var(--surface) 70%, transparent);
  border-style: dashed;
}
.page-section-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.85rem;
  flex-wrap: wrap;
}
.page-section-header h3 {
  margin: 0;
  font-size: 1.12rem;
}
.page-section-header .note,
.page-section > .note:first-of-type {
  margin: 0;
  max-width: 68ch;
}
.page-section-kicker {
  margin: 0 0 0.2rem;
  color: var(--accent);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.panel > .page-stack {
  margin-top: 0.35rem;
}
.panel-header {
  margin-bottom: 1.25rem;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 75%, transparent);
}
.panel-header h2 {
  letter-spacing: -0.02em;
}
.panel-header .note {
  margin: 0.35rem 0 0;
  max-width: 62ch;
}
.filters-row {
  margin: 0;
  padding: 0.95rem 1rem;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  border-radius: 1.1rem;
  background: color-mix(in srgb, var(--bg) 55%, var(--surface));
  gap: 0.85rem 1rem;
}
.filters-row + .form-message,
.filters-row + .note {
  margin-top: 0.75rem;
}
.context-block {
  margin-top: 0;
  padding: 1.05rem 1.15rem;
  border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
  border-radius: 1.2rem;
  background:
    linear-gradient(160deg, color-mix(in srgb, var(--surface-soft) 42%, transparent), transparent 60%),
    color-mix(in srgb, var(--surface) 92%, transparent);
}
.section-heading-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  margin-bottom: 0.55rem;
  padding-bottom: 0.45rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.section-heading-row h3 {
  margin: 0;
  font-size: 1.08rem;
  letter-spacing: -0.01em;
}
.section-heading-row .page-section-kicker {
  margin-bottom: 0.15rem;
}
.section-heading-row > .badge {
  flex: 0 0 auto;
  margin-top: 0.15rem;
}
.empty-state,
.compact-empty {
  border-style: dashed;
  background: color-mix(in srgb, var(--surface-soft) 28%, transparent);
  color: var(--muted);
  text-align: center;
}
.directory-grid {
  gap: 0.95rem;
}
.directory-card {
  border-radius: 1.15rem;
  transition: transform 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}

/* Dashboard */
#dashboard .page-stack { margin-top: 0.15rem; }
#dashboard .dashboard-search-card {
  margin: 0;
  border-color: color-mix(in srgb, var(--accent) 22%, var(--border));
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--accent) 10%, transparent), transparent 55%),
    color-mix(in srgb, var(--surface) 92%, transparent);
}
#dashboard .dashboard-pins-section,
#dashboard .dashboard-quick-section {
  margin: 0;
}
#dashboard .dashboard-pin-toolbar {
  margin: 0;
  align-items: center;
}
#dashboard .dashboard-pins {
  margin: 0;
}
#dashboard .dashboard-quick-grid {
  margin: 0;
}
#dashboard .quick-card {
  border-radius: 1.05rem;
  background:
    linear-gradient(160deg, color-mix(in srgb, var(--surface-soft) 60%, transparent), transparent 70%),
    color-mix(in srgb, var(--surface) 88%, transparent);
  transition: transform 0.15s ease, border-color 0.15s ease;
}
#dashboard .quick-card strong {
  font-size: 1.02rem;
}
#dashboard .quick-card span {
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.35;
}

/* Locations */
#locations .page-stack { gap: 1.2rem; }
#locations .location-browse-section {
  display: grid;
  gap: 0.85rem;
}
#locations .location-browser-controls {
  margin: 0;
  padding: 0.95rem 1rem;
  border: 1px dashed color-mix(in srgb, var(--accent) 28%, var(--border));
  border-radius: 1.05rem;
  background: color-mix(in srgb, var(--surface-soft) 35%, transparent);
}
#locations .location-browser-controls .filters-row {
  background: transparent;
  border: 0;
  padding: 0;
}
#locations .places-adverts-strip,
#locations #publicLocationsGrid {
  margin: 0;
}

/* Country / city context pages */
#countryPageContent,
#cityPageContent,
#continentPageContent {
  display: grid;
  /* minmax(0, 1fr), not the bare 1fr/auto default: without it, a child with wide
     intrinsic content (e.g. a horizontally-scrolling adverts row of non-wrapping
     cards) forces this single implicit column — and the whole page — wider than
     the viewport instead of staying put and scrolling internally. */
  grid-template-columns: minmax(0, 1fr);
  gap: 1.25rem;
}

/* Country page visual polish */
#countryPageContent {
  gap: 1.1rem;
}
#countryPageContent > .location-context-header {
  margin-bottom: 0;
  padding: 1.15rem 1.25rem 1.2rem;
  border: 1px solid color-mix(in srgb, var(--border) 78%, transparent);
  border-radius: 1.15rem;
  background:
    radial-gradient(ellipse 90% 120% at 0% 0%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 55%),
    linear-gradient(165deg, color-mix(in srgb, var(--surface-soft) 55%, transparent), transparent 62%),
    color-mix(in srgb, var(--surface) 96%, transparent);
}
#countryPageContent > .location-context-header h2 {
  margin: 0.15rem 0 0.35rem;
  font-size: clamp(1.55rem, 2.4vw, 1.95rem);
  letter-spacing: -0.03em;
  line-height: 1.15;
}
#countryPageContent > .location-context-header .location-title-row {
  align-items: center;
  gap: 0.7rem;
}
#countryPageContent > .location-context-header .location-title-row .country-flag {
  width: 36px;
  height: 26px;
  border-radius: 4px;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--border) 80%, transparent);
}
#countryPageContent .location-context-header-main > p:not(.eyebrow) {
  max-width: 58ch;
  color: var(--muted);
  line-height: 1.45;
}

#countryPageContent > .country-section-nav,
#countryPageContent #country-section-nav {
  margin: 0;
  padding: 0.75rem 0.9rem 0.85rem;
  border: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
  border-radius: 0.95rem;
  background: color-mix(in srgb, var(--surface) 88%, var(--surface-soft));
}
#countryPageContent .country-section-nav-label {
  margin: 0 0 0.5rem;
  letter-spacing: 0.08em;
  font-size: 0.72rem;
}
#countryPageContent .country-section-nav-links {
  gap: 0.35rem 0.4rem;
}
#countryPageContent .country-section-nav-link {
  padding: 0.32rem 0.62rem;
  border-radius: 8px;
  border-color: color-mix(in srgb, var(--border) 85%, transparent);
  background: color-mix(in srgb, var(--bg) 35%, var(--surface));
  font-size: 0.84rem;
  font-weight: 650;
  transition:
    color 150ms ease,
    border-color 150ms ease,
    background-color 150ms ease;
}
#countryPageContent .country-section-nav-link:hover,
#countryPageContent .country-section-nav-link:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 50%, var(--border));
  color: var(--accent-strong);
  background: color-mix(in srgb, var(--accent) 10%, var(--surface));
  box-shadow: none;
}
#countryPageContent .country-section-nav-preview {
  display: block;
  visibility: hidden;
  opacity: 0;
  transform: translateY(0.25rem);
  transition:
    opacity 150ms ease,
    transform 150ms ease,
    visibility 150ms ease;
  border-radius: 0.75rem;
  border-color: color-mix(in srgb, var(--border) 80%, transparent);
}
#countryPageContent .country-section-nav-item:hover .country-section-nav-preview,
#countryPageContent .country-section-nav-item:focus-within .country-section-nav-preview {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
}

#countryPageContent #country-section-overview.country-overview-grid,
#countryPageContent .country-overview-grid {
  margin: 0;
  gap: 0.9rem;
  align-items: stretch;
}
#countryPageContent .country-overview-grid > .country-card.location-context-card,
#countryPageContent .country-overview-grid > .country-state-map-card,
#countryPageContent .country-overview-grid > .directory-card {
  height: 100%;
  margin: 0;
  border: 1px solid color-mix(in srgb, var(--border) 78%, transparent);
  border-radius: 1.05rem;
  background:
    linear-gradient(165deg, color-mix(in srgb, var(--surface-soft) 38%, transparent), transparent 55%),
    color-mix(in srgb, var(--surface) 97%, transparent);
}
#countryPageContent .country-overview-grid > .country-card.location-context-card {
  padding: 1rem 1.1rem 1.05rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
#countryPageContent .country-overview-grid > .country-card.location-context-card > *:not(.country-card-flag-watermark) {
  position: relative;
  z-index: 1;
}
.country-card.has-flag-watermark {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.country-card.has-flag-watermark > *:not(.country-card-flag-watermark) {
  position: relative;
  z-index: 1;
}
.country-card-flag-watermark {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-height: none;
  object-fit: cover;
  object-position: center;
  opacity: 0.06;
  pointer-events: none;
  user-select: none;
  z-index: 0;
  filter: saturate(0.85) contrast(0.95);
}
@media (prefers-color-scheme: dark) {
  .country-card-flag-watermark {
    opacity: 0.08;
    filter: saturate(0.9) contrast(1.05) brightness(1.05);
  }
}
#countryPageContent .country-overview-grid .country-card-heading {
  margin-top: 0.15rem;
  margin-bottom: 0.15rem;
}
#countryPageContent .country-overview-grid .country-card-heading h3 {
  font-size: 1.28rem;
  letter-spacing: -0.02em;
}
#countryPageContent .country-overview-grid .country-meta,
#countryPageContent .country-overview-grid .country-vignette-line,
#countryPageContent .country-overview-grid .small-muted {
  margin: 0.1rem 0;
  line-height: 1.4;
}
#countryPageContent .country-section-top-row {
  margin: 0 0 0.35rem;
  padding: 0;
  border: 0;
  background: transparent;
  justify-content: flex-end;
}
#countryPageContent .country-section-top-link {
  border-radius: 7px;
  border-color: color-mix(in srgb, var(--border) 80%, transparent);
  background: color-mix(in srgb, var(--surface) 92%, transparent);
  color: var(--muted);
  transition:
    color 150ms ease,
    border-color 150ms ease,
    background-color 150ms ease;
}
#countryPageContent .country-section-top-link:hover,
#countryPageContent .country-section-top-link:focus-visible {
  color: var(--accent-strong);
  border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
  background: color-mix(in srgb, var(--accent) 8%, var(--surface));
}

#countryPageContent .context-block {
  margin-top: 0;
  padding: 1rem 1.1rem 1.05rem;
  border: 1px solid color-mix(in srgb, var(--border) 78%, transparent);
  border-radius: 1.05rem;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--surface-soft) 28%, transparent), transparent 4.5rem),
    color-mix(in srgb, var(--surface) 96%, transparent);
}
#countryPageContent .section-heading-row {
  margin-bottom: 0.7rem;
  padding-bottom: 0.5rem;
  border-bottom-color: color-mix(in srgb, var(--border) 55%, transparent);
  align-items: center;
}
#countryPageContent .section-heading-row h3 {
  font-size: 1.12rem;
  letter-spacing: -0.02em;
}
#countryPageContent .facts-grid {
  border: 0;
  border-radius: 0.75rem;
  padding: 0.55rem 0.15rem;
  background: transparent;
  gap: 0.55rem 1.1rem;
}
#countryPageContent .facts-grid dt {
  font-weight: 700;
  font-size: 0.9rem;
  color: var(--muted);
}
#countryPageContent .facts-grid dd {
  color: var(--text);
}
#countryPageContent .exchange-rate-block,
#countryPageContent .live-info-block,
#countryPageContent .travel-safety-end-block {
  border-color: color-mix(in srgb, var(--accent) 16%, var(--border));
}
#countryPageContent .live-info-panel {
  border: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
  border-radius: 0.85rem;
  padding: 0.7rem 0.85rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--surface));
}
#countryPageContent .live-info-panel[open] {
  border-color: color-mix(in srgb, var(--accent) 24%, var(--border));
}
#countryPageContent .country-states-grid {
  gap: 0.55rem;
}
#countryPageContent .country-state-chip {
  border-radius: 0.75rem;
  border-color: color-mix(in srgb, var(--border) 82%, transparent);
  background: color-mix(in srgb, var(--bg) 30%, var(--surface));
}
#countryPageContent .page-place-adverts {
  margin: 0;
}

@media (prefers-reduced-motion: reduce) {
  #countryPageContent .country-section-nav-link,
  #countryPageContent .country-section-nav-preview,
  #countryPageContent .country-section-top-link {
    transition: none;
  }
  #countryPageContent .country-section-nav-preview {
    transform: none;
  }
}

.location-context-header {
  padding: 1rem 1.1rem;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  border-radius: 1.2rem;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--accent) 8%, transparent), transparent 50%),
    color-mix(in srgb, var(--surface) 94%, transparent);
}
.location-context-header h2 {
  margin: 0.2rem 0;
  letter-spacing: -0.02em;
}
.live-info-block,
.travel-safety-end-block,
.city-weather-block {
  border-color: color-mix(in srgb, var(--accent) 18%, var(--border));
}
.city-weather-block {
  background:
    radial-gradient(ellipse 70% 55% at 100% 0%, color-mix(in srgb, var(--accent-soft) 10%, transparent), transparent 60%),
    linear-gradient(160deg, color-mix(in srgb, var(--mist-wash, var(--surface-soft)) 55%, var(--surface)), var(--surface));
}
.live-info-stack {
  gap: 0.7rem;
}
.live-info-panel {
  border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
  border-radius: 0.95rem;
  padding: 0.75rem 0.9rem;
  background: color-mix(in srgb, var(--bg) 45%, var(--surface));
}
.live-info-panel[open] {
  border-color: color-mix(in srgb, var(--accent) 28%, var(--border));
}
.live-info-panel[data-live-section="weather"] {
  background:
    radial-gradient(ellipse 80% 60% at 100% 0%, color-mix(in srgb, var(--accent-soft) 12%, transparent), transparent 55%),
    linear-gradient(155deg, color-mix(in srgb, var(--mist-wash, var(--surface-soft)) 50%, var(--surface)), color-mix(in srgb, var(--bg) 35%, var(--surface)));
}
.live-info-panel[data-live-section="weather"][open] {
  border-color: color-mix(in srgb, var(--accent) 32%, var(--border));
}
.live-info-panel summary strong {
  font-size: 0.98rem;
}
.live-info-panel summary small {
  color: var(--muted);
  font-size: 0.82rem;
}

/* Places */
#places .page-stack { gap: 1.2rem; }
#places .places-filters-section .filters-row { margin: 0; }
.places-search-results-block,
.places-top-liked-block,
.places-pinned-block {
  margin-top: 0;
}
.places-search-results-block {
  border-color: color-mix(in srgb, var(--accent) 22%, var(--border));
}
.places-top-liked-block .directory-grid,
.places-pinned-block .directory-grid,
.places-search-results-block .directory-grid {
  margin-top: 0.35rem;
}

/* Experiences + Advice */
#experiences .page-stack,
#advice .page-stack {
  gap: 1.2rem;
}
#experiences .experience-top-liked-places,
#advice .advice-results-section {
  margin-top: 0;
}
#experiences .experience-hierarchy {
  margin-top: 0;
}

/* Plans */
#plans .page-stack { gap: 1.2rem; }
#plans .plans-ea-banner {
  margin: 0;
  border-radius: 1.05rem;
  border-color: color-mix(in srgb, var(--accent) 25%, var(--border));
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--accent) 12%, transparent), transparent 60%),
    color-mix(in srgb, var(--surface-soft) 55%, transparent);
}
#plans .plans-grid {
  margin: 0;
}
#plans .plans-type-extras {
  margin-top: 0;
  padding-top: 0.35rem;
  border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.plan-card {
  border-radius: 1.15rem;
  background:
    linear-gradient(160deg, color-mix(in srgb, var(--surface-soft) 50%, transparent), transparent 65%),
    var(--surface);
}

/* Profile / account */
#auth .page-stack { gap: 1.2rem; }
#auth .profile-identity {
  margin: 0;
  padding: 1rem 1.1rem;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  border-radius: 1.15rem;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--accent) 8%, transparent), transparent 55%),
    color-mix(in srgb, var(--surface) 94%, transparent);
}
#auth .profile-section-card,
#auth .profile-section-details {
  margin: 0;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  border-radius: 1.1rem;
  background: color-mix(in srgb, var(--surface) 92%, transparent);
  overflow: hidden;
}
#auth .profile-section-details > summary {
  cursor: pointer;
  list-style: none;
  padding: 0.9rem 1rem;
  font-weight: 750;
}
#auth .profile-section-details > summary::-webkit-details-marker { display: none; }
#auth .profile-section-details .profile-settings-form,
#auth .profile-section-details .mfa-settings-panel {
  padding: 0 1rem 1rem;
  border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
#auth .profile-security-stack,
#auth .profile-prefs-stack {
  display: grid;
  gap: 0.85rem;
}
#auth .auth-landing {
  align-items: stretch;
}
#auth .auth-benefits-card,
#auth .auth-flow-card {
  border-radius: 1.15rem;
}

/* My Trips / Experiences / Advice */
/* Profile cards: major areas are deliberately separate instead of nested together. */
#auth:has(#profilePanel:not(.hidden)) { border-color: transparent; background: transparent; box-shadow: none; }
#auth:has(#profilePanel:not(.hidden)) > .profile-intro-card, #auth #profilePanel .profile-major-card, #auth #profilePanel > .page-stack > .profile-section-card, #auth #profilePanel > .page-stack > .profile-prefs-stack, #auth #profilePanel > .page-stack > .profile-security-stack { border: 1px solid color-mix(in srgb, var(--border) 82%, transparent); border-radius: 1.15rem; padding: 1.15rem; background: linear-gradient(145deg, color-mix(in srgb, var(--accent) 6%, transparent), transparent 58%), var(--surface); box-shadow: 0 10px 28px color-mix(in srgb, var(--text) 8%, transparent); }
#auth:has(#profilePanel:not(.hidden)) > .profile-intro-card { margin-bottom: 1.2rem; }
#auth #profilePanel { max-width: none; padding: 0; border: 0; background: transparent; box-shadow: none; }
#auth #profilePanel > .page-stack { gap: 1.2rem; }
#auth #profilePanel .profile-account-card .profile-identity { margin: 0; padding: 0 0 1rem; border: 0; border-bottom: 1px solid color-mix(in srgb, var(--border) 68%, transparent); border-radius: 0; background: transparent; }
#auth #profilePanel .profile-account-card .profile-facts { margin: 0; padding: .35rem 0 0; border: 0; }
#auth #profilePanel .profile-account-card .account-license-panel { margin-top: 1rem; }
#auth #profilePanel > .page-stack > .profile-section-card, #auth #profilePanel > .page-stack > .profile-prefs-stack, #auth #profilePanel > .page-stack > .profile-security-stack { margin: 0; }
#auth #profilePanel .profile-section-card { overflow: visible; }
#auth #profilePanel .profile-section-card > fieldset, #auth #profilePanel .profile-prefs-stack .profile-settings-form > fieldset, #auth #profilePanel .profile-security-stack .profile-settings-form > fieldset, #auth #profilePanel .profile-section-details .profile-settings-form > fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
#auth #profilePanel .profile-section-card > fieldset > legend, #auth #profilePanel .profile-prefs-stack fieldset > legend { float: left; width: 100%; margin: 0 0 .65rem; padding: 0; color: var(--accent); font-size: .78rem; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
#auth #profilePanel .profile-section-card > fieldset > legend + *, #auth #profilePanel .profile-prefs-stack fieldset > legend + * { clear: both; }
#auth #profilePanel .profile-prefs-stack, #auth #profilePanel .profile-security-stack { gap: .9rem; }
#auth #profilePanel .profile-prefs-stack > .profile-section-card { padding: 0; border: 0; background: transparent; box-shadow: none; }
#auth #profilePanel .profile-section-details { margin: 0; box-shadow: none; }
#auth #profilePanel .profile-actions { margin: 0; padding: 0; border: 0; }
@media (max-width: 650px) { #auth:has(#profilePanel:not(.hidden)) { padding-inline: 0; } #auth:has(#profilePanel:not(.hidden)) > .profile-intro-card, #auth #profilePanel .profile-major-card, #auth #profilePanel > .page-stack > .profile-section-card, #auth #profilePanel > .page-stack > .profile-prefs-stack, #auth #profilePanel > .page-stack > .profile-security-stack { padding: 1rem; border-radius: 1rem; } }


#myTrips .page-stack,
#myExperiences .page-stack,
#myAdvice .page-stack {
  gap: 1.25rem;
}
#myTrips .trip-compose-section,
#myExperiences .experience-compose-section,
#myAdvice .advice-compose-section {
  border-color: color-mix(in srgb, var(--accent) 18%, var(--border));
}
#myTrips .trip-list,
#myExperiences .table-wrap,
#myAdvice .table-wrap {
  margin: 0;
}
.my-experiences-photo-policy {
  margin: 0 0 0.75rem;
}
#myExperiences .my-experiences-table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
}
#myExperiences .my-experiences-table .experience-column { width: 25%; }
#myExperiences .my-experiences-table .target-column { width: 14%; }
#myExperiences .my-experiences-table .status-column { width: 10%; }
#myExperiences .my-experiences-table .updated-column { width: 14%; }
#myExperiences .my-experiences-table .photos-column { width: 23%; }
#myExperiences .my-experiences-table .actions-column { width: 14%; }
#myExperiences .my-experiences-table th:last-child,
#myExperiences .my-experiences-table td:last-child {
  white-space: normal;
  overflow: visible;
  overflow-wrap: normal;
}
#myExperiences .my-experiences-table td:last-child .action-row .button {
  white-space: nowrap;
  overflow: visible;
  text-overflow: clip;
  min-width: max-content;
}
#myExperiences .my-experiences-table td {
  overflow-wrap: break-word;
  word-break: normal;
}
#myExperiences .my-experiences-table td:nth-child(3),
#myExperiences .my-experiences-table .upload-inline,
#myExperiences .my-experiences-table .upload-inline input,
#myExperiences .my-experiences-table .upload-inline button {
  min-width: 0;
  max-width: 100%;
}
#myExperiences .my-experiences-table .upload-inline input[type="file"] { width: 100%; }

#myExperiences .my-experiences-table td:nth-child(4) {
  white-space: nowrap;
}
#myAdvice .my-advice-table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
}
#myAdvice .my-advice-table .guide-column { width: 32%; }
#myAdvice .my-advice-table .target-column { width: 16%; }
#myAdvice .my-advice-table .category-column { width: 12%; }
#myAdvice .my-advice-table .status-column { width: 12%; }
#myAdvice .my-advice-table .updated-column { width: 14%; }
#myAdvice .my-advice-table .actions-column { width: 14%; }
#myAdvice .my-advice-table th:last-child,
#myAdvice .my-advice-table td:last-child {
  white-space: normal;
  overflow: visible;
  overflow-wrap: normal;
}
#myAdvice .my-advice-table td:last-child .action-row .button {
  white-space: nowrap;
  overflow: visible;
  text-overflow: clip;
  min-width: max-content;
}
#myAdvice .my-advice-table td:nth-child(4) {
  white-space: nowrap;
}
#myTrips .inline-form.wide-form,
#myExperiences .inline-form.wide-form,
#myAdvice .inline-form.wide-form {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

@media (max-width: 760px) {
  .page-section,
  .context-block,
  .location-context-header {
    padding: 0.9rem;
    border-radius: 1rem;
  }
  .filters-row {
    padding: 0.8rem;
  }
  #dashboard .dashboard-pin-toolbar {
    flex-direction: column;
    align-items: stretch;
  }
}


#myExperiences .my-experience-create-button,
#myExperiences .my-experience-create-inline,
#myTrips .my-content-create-button,
#myAdvice .my-content-create-button { white-space: nowrap; }
#myExperiences .experience-composer-header,
#myTrips .trip-composer-header,
#myAdvice .advice-composer-header { align-items: center; gap: 1rem; }
#myExperiences .experience-compose-section,
#myTrips .trip-compose-section,
#myAdvice .advice-compose-section { box-shadow: 0 1rem 2.5rem color-mix(in srgb, var(--ink) 10%, transparent); }
#myExperiences #myExperiencesListMessage:empty { display: none; }
@media (max-width: 760px) {
  #myExperiences .panel-header, #myExperiences .experience-composer-header, #myExperiences .experience-list-section .page-section-header,
  #myTrips .panel-header, #myTrips .trip-composer-header, #myTrips .trip-list-section .page-section-header,
  #myAdvice .panel-header, #myAdvice .advice-composer-header, #myAdvice .advice-list-section .page-section-header { align-items: stretch; }
  #myExperiences .my-experience-create-button, #myExperiences .my-experience-create-inline, #myExperiences #closeExperienceComposerButton,
  #myTrips .my-content-create-button, #myTrips #closeTripComposerButton,
  #myAdvice .my-content-create-button, #myAdvice #closeAdviceComposerButton { width: 100%; }
}
@media (max-width: 760px) {
  #myExperiences .table-wrap { overflow: visible; }
  #myExperiences .my-experiences-table,
  #myExperiences .my-experiences-table tbody,
  #myExperiences .my-experiences-table tr,
#myExperiences .my-experiences-table th:last-child { white-space: nowrap; overflow-wrap: normal; }
  #myExperiences .my-experiences-table td { display: block; width: 100%; }
  #myExperiences .my-experiences-table colgroup,
  #myExperiences .my-experiences-table thead { display: none; }
  #myExperiences .my-experiences-table tbody { display: grid; gap: 1rem; }
  #myExperiences .my-experiences-table tr { padding: 0.85rem; border: 1px solid var(--border); border-radius: 1rem; background: color-mix(in srgb, var(--surface-soft) 35%, var(--surface)); }
#myExperiences .my-experiences-table th:last-child { white-space: nowrap; overflow-wrap: normal; }
  #myExperiences .my-experiences-table td { padding: 0.65rem 0; border: 0; border-bottom: 1px solid var(--border); white-space: normal; }
  #myExperiences .my-experiences-table td:last-child { border-bottom: 0; padding-bottom: 0; }
  #myExperiences .my-experiences-table td:nth-child(n+2)::before { display: block; margin-bottom: 0.3rem; color: var(--muted); font-size: 0.7rem; font-weight: 850; letter-spacing: 0.08em; text-transform: uppercase; content: attr(data-label); }
  #myExperiences .my-experiences-table .action-row,
  #myExperiences .my-experiences-table .action-row .button { width: 100%; }
  #myExperiences .my-experiences-table .action-row .button {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    line-height: 1.25;
  }
  #myAdvice .table-wrap { overflow: visible; }
  #myAdvice .my-advice-table,
  #myAdvice .my-advice-table tbody,
  #myAdvice .my-advice-table tr,
  #myAdvice .my-advice-table th:last-child { white-space: nowrap; overflow-wrap: normal; }
  #myAdvice .my-advice-table td { display: block; width: 100%; }
  #myAdvice .my-advice-table colgroup,
  #myAdvice .my-advice-table thead { display: none; }
  #myAdvice .my-advice-table tbody { display: grid; gap: 1rem; }
  #myAdvice .my-advice-table tr { padding: 0.85rem; border: 1px solid var(--border); border-radius: 1rem; background: color-mix(in srgb, var(--surface-soft) 35%, var(--surface)); }
  #myAdvice .my-advice-table td { padding: 0.65rem 0; border: 0; border-bottom: 1px solid var(--border); white-space: normal; }
  #myAdvice .my-advice-table td:last-child { border-bottom: 0; padding-bottom: 0; }
  #myAdvice .my-advice-table td:nth-child(n+2)::before { display: block; margin-bottom: 0.3rem; color: var(--muted); font-size: 0.7rem; font-weight: 850; letter-spacing: 0.08em; text-transform: uppercase; content: attr(data-label); }
  #myAdvice .my-advice-table .action-row,
  #myAdvice .my-advice-table .action-row .button { width: 100%; }
  #myAdvice .my-advice-table .action-row .button {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    line-height: 1.25;
  }
}

.my-reviews-list { display: grid; gap: 1rem; }
.my-review-card { padding: 1rem; border: 1px solid var(--border); border-radius: 1rem; background: color-mix(in srgb, var(--surface-soft) 28%, var(--surface)); }
.my-review-card h3 { margin: 0.45rem 0 0; }
.my-review-card > p { margin: 0.75rem 0; }
.my-review-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.my-review-edit-form { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--border); }
.review-edit-state.is-locked { color: #e39a45; font-weight: 750; }
@media (max-width: 620px) { .my-review-heading { display: grid; } .my-review-card .action-row, .my-review-card .action-row .button { width: 100%; } }

.search-input-clear-wrap { position: relative; display: block; width: 100%; min-width: 0; }
.search-input-clear-wrap > input[type="search"] { width: 100%; padding-right: 2.7rem; }
/* z-index must beat the plum_mist theme's `#globalLocationSearch { z-index: 6 }` below,
   or the input paints over this button and swallows its clicks. */
.search-input-clear-button { position: absolute; top: 50%; right: 0.55rem; transform: translateY(-50%); z-index: 20; width: 2rem; height: 2rem; display: grid; place-items: center; padding: 0; border: 0; border-radius: 50%; background: color-mix(in srgb, var(--surface-soft) 72%, transparent); color: var(--muted); font-size: 1.45rem; line-height: 1; cursor: pointer; }
.search-input-clear-button:hover, .search-input-clear-button:focus-visible { background: var(--surface-soft); color: var(--text); outline: 2px solid color-mix(in srgb, var(--accent) 45%, transparent); }
input[type="search"]::-webkit-search-cancel-button { display: none; }

.import-type-selector { display: flex; flex-wrap: wrap; gap: 0.65rem 1rem; margin: 0.85rem 0 0.35rem; padding: 0.8rem 0.9rem; border: 1px solid var(--border); border-radius: 0.9rem; }
.import-type-selector legend { padding: 0 0.35rem; color: var(--muted); font-weight: 800; }
.import-type-selector label { display: inline-flex; align-items: center; gap: 0.4rem; width: auto; }
.import-type-selector input { width: 1rem; margin: 0; }

/* Embassy importer: compact preview-first workflow */
.embassy-import-card {
  padding: 0;
  overflow: hidden;
  border-color: color-mix(in srgb, var(--accent) 28%, var(--border));
  background: linear-gradient(
    145deg,
    color-mix(in srgb, var(--accent) 8%, var(--surface)),
    color-mix(in srgb, var(--surface) 96%, var(--surface-soft)) 42%
  );
  color: var(--text);
}
.embassy-import-card[open] > summary { margin-bottom: 0; }
.embassy-import-summary {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: .8rem;
  padding: 1rem 1.1rem !important;
  color: var(--text);
}
.embassy-import-summary-icon,
.embassy-import-step {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  width: 2rem;
  height: 2rem;
  border-radius: .7rem;
  background: color-mix(in srgb, var(--accent) 14%, var(--surface));
  color: var(--accent);
  font-weight: 850;
}
.embassy-import-summary > span:nth-child(2) { display: grid; gap: .12rem; }
.embassy-import-summary small { color: var(--muted); font-weight: 600; }
.embassy-import-body { display: grid; gap: 1rem; padding: 0 1.1rem 1.1rem; }
.embassy-import-intro {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: .8rem;
  padding: .8rem;
  border-radius: .9rem;
  background: color-mix(in srgb, var(--surface-soft) 70%, var(--surface));
  border: 1px solid var(--border);
}
.embassy-import-intro p { margin: 0; color: var(--muted) !important; }
.embassy-import-fields {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.3fr) minmax(10rem, .8fr) minmax(9rem, .65fr);
  gap: .75rem;
}
.embassy-import-fields label { gap: .4rem; font-size: .88rem; color: var(--text); }
.embassy-import-fields select { min-width: 0; }
.embassy-import-bulk,
.embassy-import-preview-row,
.embassy-import-confirmation {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: .8rem;
  padding: .85rem;
  border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--border));
  border-radius: .95rem;
  background: color-mix(in srgb, var(--surface-soft) 68%, var(--surface));
  color: var(--text);
}
.embassy-import-bulk > div:nth-child(2) { display: grid; gap: .12rem; }
.embassy-import-bulk small { color: var(--muted); }
.embassy-import-bulk-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  justify-content: flex-end;
}
.embassy-import-job-result { margin: 0; padding: 0 .15rem; }
.embassy-import-preview-row > div { display: grid; gap: .12rem; }
.embassy-import-preview-row small,
.embassy-import-confirmation small { color: var(--muted); }
.embassy-import-result { margin: 0; padding: 0 .15rem; }
.embassy-import-result:has(.compact-list) {
  padding: .85rem;
  border-radius: .9rem;
  background: color-mix(in srgb, var(--surface-soft) 62%, var(--surface));
  border: 1px solid var(--border);
}
.embassy-confirm-check {
  display: flex !important;
  align-items: center;
  gap: .75rem;
  min-width: 0;
  cursor: pointer;
}
.embassy-confirm-check input {
  width: 1.15rem !important;
  height: 1.15rem;
  margin: 0;
  accent-color: var(--accent);
  flex: 0 0 auto;
}
.embassy-confirm-check span { display: grid; gap: .1rem; color: var(--text); }
.embassy-import-confirmation:has(input:checked) {
  border-color: color-mix(in srgb, #34d399 46%, var(--border));
  background: color-mix(in srgb, #34d399 12%, var(--surface));
}
.embassy-import-footnote {
  margin: -.25rem .2rem 0 !important;
  color: var(--muted) !important;
  font-size: .82rem;
}
@media (max-width: 980px) {
  .embassy-import-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
  .embassy-import-fields { grid-template-columns: 1fr; }
  .embassy-import-intro,
  .embassy-import-bulk,
  .embassy-import-preview-row,
  .embassy-import-confirmation { grid-template-columns: auto minmax(0, 1fr); }
  .embassy-import-intro .button,
  .embassy-import-bulk-actions,
  .embassy-import-preview-row .button,
  .embassy-import-confirmation .button { grid-column: 1 / -1; width: 100%; }
  .embassy-import-bulk-actions { justify-content: stretch; }
  .embassy-import-bulk-actions .button { flex: 1 1 auto; }
}


/* Import tools information architecture */
.import-tools-heading { align-items: center; gap: 1.25rem; margin-bottom: 1.2rem; }
.import-setup-visibility-toggle { display: flex; align-items: center; gap: .7rem; min-width: 230px; padding: .75rem .9rem; border: 1px solid var(--border); border-radius: 14px; background: color-mix(in srgb, var(--surface) 88%, var(--surface-soft)); color: var(--text); cursor: pointer; }
.import-setup-visibility-toggle input { width: 1.05rem; height: 1.05rem; accent-color: var(--accent); }
.import-setup-visibility-toggle span { display: grid; gap: .1rem; line-height: 1.2; color: var(--text); }
.import-setup-visibility-toggle strong { color: var(--text); }
.import-setup-visibility-toggle small { color: var(--muted); font-size: .76rem; }
.import-tool-category { display: grid; gap: .8rem; }
.import-tool-category + .import-tool-category { margin-top: 1.15rem; padding-top: 1.15rem; border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent); }
.import-tool-category-heading { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .85rem; padding: .25rem .15rem .45rem; }
.import-tool-category-heading-standalone { margin-top: .35rem; padding: 1rem .2rem .55rem; border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent); }
.import-tool-category-heading .eyebrow { margin: 0 0 .12rem; color: var(--accent); }
.import-tool-category-heading h4 { margin: 0; font-size: 1.04rem; color: var(--text); }
.import-tool-category-heading p:not(.eyebrow) { margin: .18rem 0 0; color: var(--muted); font-size: .84rem; }
.import-tool-category-heading .status-pill { color: var(--accent-strong, var(--accent)); background: color-mix(in srgb, var(--accent) 14%, var(--surface)); border-color: color-mix(in srgb, var(--accent) 36%, var(--border)); }
.import-tool-category-number { display: grid; place-items: center; width: 2.35rem; height: 2.35rem; border-radius: 12px; color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, var(--surface)); border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--border)); font-weight: 800; font-size: .76rem; }
.import-tool-card { padding: 1rem; border: 1px solid color-mix(in srgb, var(--border) 82%, transparent); border-radius: 16px; background: color-mix(in srgb, var(--surface) 92%, var(--surface-soft)); box-shadow: 0 8px 22px color-mix(in srgb, var(--text) 8%, transparent); color: var(--text); }
.import-tool-card > h4 { display: flex; align-items: center; flex-wrap: wrap; gap: .55rem; margin-top: 0; color: var(--text); }
.import-frequency-badge, .import-source-badge { display: inline-flex; align-items: center; min-height: 1.45rem; padding: .12rem .5rem; border-radius: 999px; background: color-mix(in srgb, var(--accent) 12%, var(--surface)); border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--border)); color: var(--accent-strong, var(--accent)); font-size: .69rem; font-weight: 750; letter-spacing: .02em; }
.import-wizard-extra > summary { display: flex; align-items: center; gap: .45rem; color: var(--text); }
.import-wizard-extra > summary small { display: block; margin-left: auto; color: var(--muted); font-weight: 500; font-size: .78rem; }
.hide-completed-import-setup [data-import-tool-category="setup"] { display: none; }
@media (max-width: 720px) { .import-tools-heading { align-items: stretch; } .import-setup-visibility-toggle { min-width: 0; width: 100%; } .import-tool-category-heading { grid-template-columns: auto minmax(0,1fr); } .import-tool-category-heading .status-pill { display: none; } .import-wizard-extra > summary { flex-wrap: wrap; } .import-wizard-extra > summary small { width: 100%; margin-left: 0; } }


/* Airport directory */
.airport-directory-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:1rem}.airport-card{padding:1.05rem;border:1px solid var(--border);border-radius:18px;background:linear-gradient(145deg,color-mix(in srgb,var(--surface-strong) 94%,transparent),color-mix(in srgb,var(--surface) 82%,transparent));box-shadow:0 10px 26px rgba(0,0,0,.09)}.airport-card-top{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:.7rem;align-items:start}.airport-card-top h4{margin:0 0 .16rem}.airport-card-top p{margin:0;color:var(--muted);font-weight:750;letter-spacing:.08em}.airport-rank{display:grid;place-items:center;width:2rem;height:2rem;border-radius:10px;background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--accent);font-weight:850}.airport-facts{display:flex;flex-wrap:wrap;gap:.45rem;margin:.9rem 0}.airport-facts span{padding:.38rem .55rem;border-radius:9px;background:color-mix(in srgb,var(--surface) 74%,transparent);border:1px solid color-mix(in srgb,var(--border) 70%,transparent);font-size:.78rem}.airport-transport{margin:.7rem 0;line-height:1.5}.airport-card-actions{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem;margin-top:.9rem}.airport-card-highlight{outline:2px solid color-mix(in srgb,var(--accent) 70%,transparent);outline-offset:2px}.airport-city-switcher{display:grid;gap:.4rem;margin:.1rem 0 .75rem}.airport-city-switcher-label{margin:0;color:var(--muted);font-size:.82rem;font-weight:700}.airport-city-chip-row{display:flex;flex-wrap:nowrap;gap:.45rem;overflow-x:auto;padding-bottom:.12rem;-webkit-overflow-scrolling:touch;scrollbar-width:thin}.airport-city-chip{appearance:none;flex:0 0 auto;border:1px solid var(--border);border-radius:999px;background:transparent;color:inherit;padding:.38rem .75rem;font:inherit;font-size:.82rem;font-weight:750;cursor:pointer;white-space:nowrap}.airport-city-chip:hover,.airport-city-chip:focus-visible{border-color:color-mix(in srgb,var(--accent) 45%,var(--border));color:var(--accent)}.airport-city-chip.is-active{border-color:color-mix(in srgb,var(--accent) 55%,var(--border));color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent)}.airport-city-chip:focus-visible{outline:2px solid color-mix(in srgb,var(--accent) 48%,transparent);outline-offset:2px}@media(max-width:560px){.airport-card-top{grid-template-columns:auto minmax(0,1fr)}.airport-card-top>.badge{grid-column:2}}

/* City ride-hailing */
.ride-hailing-block{padding:1rem 1.05rem}
.ride-hailing-app-list{display:flex;flex-wrap:wrap;gap:.55rem;margin:.85rem 0 .35rem}
.ride-hailing-app-chip{display:inline-flex;align-items:center;padding:.42rem .72rem;border:1px solid color-mix(in srgb,var(--accent) 28%,var(--border));border-radius:999px;background:color-mix(in srgb,var(--accent) 10%,var(--surface));font-weight:750;font-size:.9rem}
.ride-hailing-notes{margin:.55rem 0 0;color:var(--text);line-height:1.45}
.ride-hailing-admin-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(9.5rem,1fr));gap:.45rem .75rem;margin:.35rem 0 .75rem}
.city-ride-hailing-fields{margin:.35rem 0 0;padding:.85rem 1rem;border:1px solid var(--border);border-radius:1rem;background:color-mix(in srgb,var(--surface-soft) 45%,var(--surface))}
.city-ride-hailing-fields legend{padding:0 .35rem;font-weight:800}



/* Regional destination cards */
#countryPageContent .country-states-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:.75rem}#countryPageContent .country-state-card{display:grid;align-content:start;gap:.55rem;padding:.85rem .9rem;border-radius:14px;font-size:.86rem;box-shadow:0 8px 20px rgba(0,0,0,.06)}.state-card-heading{display:flex;align-items:center;justify-content:space-between;gap:.65rem}.state-card-heading strong{font-size:.98rem}.state-card-stats{display:flex;flex-wrap:wrap;gap:.35rem}.state-card-stats span{padding:.22rem .45rem;border-radius:8px;background:color-mix(in srgb,var(--accent) 9%,transparent);color:var(--muted);font-size:.73rem;font-weight:700}.country-state-card p{margin:0;line-height:1.45}.country-state-card p strong{color:var(--text)}.state-major-cities{display:grid;gap:.35rem}.state-major-cities>strong{color:var(--text)}.state-city-list{list-style:disc;margin:.1rem 0 0;padding-left:1.25rem}.state-city-item{display:list-item;line-height:1.45}.state-city-row{display:inline-flex;align-items:center;gap:.32rem;flex-wrap:wrap;max-width:100%}.state-major-city-link{appearance:none;border:0;background:none;padding:0;margin:0;color:var(--accent);font:inherit;font-weight:750;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.16em;cursor:pointer;text-align:left}.state-major-city-link:hover,.state-major-city-link:focus-visible{color:var(--accent-strong)}.state-major-city-plain{color:var(--text)}.state-city-airport-icon{appearance:none;border:0;padding:0;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:1.05rem;height:1.05rem;border-radius:999px;color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,transparent);line-height:1;cursor:pointer}.state-city-airport-icon:hover,.state-city-airport-icon:focus-visible{background:color-mix(in srgb,var(--accent) 22%,transparent);color:var(--accent-strong)}.state-city-airport-icon:focus-visible{outline:2px solid color-mix(in srgb,var(--accent) 48%,transparent);outline-offset:2px}.airport-maps-links{margin-top:.7rem}.airport-directory-block .section-heading-row{flex-wrap:wrap;gap:.55rem}.state-city-airport-svg{display:block;width:.72rem;height:.72rem}html[data-theme="plum_mist"] .state-city-airport-icon,html[data-theme="plum_mist_motion"] .state-city-airport-icon{color:var(--accent);background:color-mix(in srgb,var(--accent) 16%,transparent)}@media(max-width:560px){#countryPageContent .country-states-grid{grid-template-columns:1fr}}


/* Global long-page back to top */
.global-back-to-top{position:fixed;right:max(1rem,calc((100vw - var(--shell-max))/2 + 1rem));bottom:max(1rem,env(safe-area-inset-bottom));z-index:850;display:inline-flex;align-items:center;gap:.42rem;min-height:2.7rem;padding:.62rem .85rem;border:1px solid color-mix(in srgb,var(--accent) 46%,var(--border));border-radius:999px;background:color-mix(in srgb,var(--surface-strong) 94%,transparent);color:var(--accent);font:inherit;font-size:.82rem;font-weight:800;box-shadow:0 12px 30px rgba(0,0,0,.24);backdrop-filter:blur(12px);cursor:pointer;transition:transform 140ms ease,opacity 140ms ease,background-color 140ms ease}.global-back-to-top:hover{transform:translateY(-2px);background:color-mix(in srgb,var(--accent) 12%,var(--surface-strong))}.global-back-to-top:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 48%,transparent);outline-offset:3px}.global-back-to-top.hidden{display:none}@media(max-width:720px){.global-back-to-top{right:.75rem;bottom:max(.75rem,env(safe-area-inset-bottom));min-height:2.55rem;padding:.56rem .72rem}.global-back-to-top span:last-child{display:none}}@media(prefers-reduced-motion:reduce){.global-back-to-top{transition:none}}
/* Mobile-only: jump down to Places search / OSM results (pairs with ↑ back-to-top). */
.mobile-places-jump-results{display:none}
@media(max-width:720px){
  .mobile-places-jump-results{
    position:fixed;
    right:.75rem;
    bottom:max(.75rem,env(safe-area-inset-bottom));
    z-index:850;
    display:inline-flex;
    align-items:center;
    gap:.42rem;
    min-height:2.55rem;
    padding:.56rem .72rem;
    border:1px solid color-mix(in srgb,var(--accent) 46%,var(--border));
    border-radius:999px;
    background:color-mix(in srgb,var(--surface-strong) 94%,transparent);
    color:var(--accent);
    font:inherit;
    font-size:.82rem;
    font-weight:800;
    box-shadow:0 12px 30px rgba(0,0,0,.24);
    backdrop-filter:blur(12px);
    cursor:pointer;
    transition:transform 140ms ease,opacity 140ms ease,background-color 140ms ease;
  }
  .mobile-places-jump-results:hover{transform:translateY(2px);background:color-mix(in srgb,var(--accent) 12%,var(--surface-strong))}
  .mobile-places-jump-results:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 48%,transparent);outline-offset:3px}
  .mobile-places-jump-results.hidden{display:none}
  .mobile-places-jump-results span:last-child{display:none}
  body:has(#globalBackToTopButton:not(.hidden)) .mobile-places-jump-results:not(.hidden){
    bottom:calc(max(.75rem,env(safe-area-inset-bottom)) + 3.15rem);
  }
}
@media(prefers-reduced-motion:reduce){.mobile-places-jump-results{transition:none}}


/* Controlled hybrid list loading */
.hybrid-load-control{position:relative;display:grid;justify-items:center;gap:.45rem;padding:1rem;margin-top:.65rem;border:1px dashed color-mix(in srgb,var(--accent) 28%,var(--border));border-radius:14px;background:color-mix(in srgb,var(--surface) 76%,transparent);text-align:center}.hybrid-load-control p{margin:0}.hybrid-load-control .button{min-width:9.5rem}.hybrid-load-sentinel{position:absolute;left:0;right:0;bottom:0;height:1px;pointer-events:none}.hybrid-auto-note{max-width:34rem}.hybrid-load-status{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:.35rem .65rem;padding:.85rem;margin-top:.65rem;border-radius:12px;background:color-mix(in srgb,var(--accent) 8%,var(--surface));color:var(--muted);text-align:center}.hybrid-load-status strong{color:var(--text)}@media(max-width:560px){.hybrid-load-control{padding:.8rem}.hybrid-load-control .button{width:100%}}


/* Licensing intent */
.licensing-interest-panel{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(12rem,.75fr);gap:.75rem 1rem;align-items:end;margin-top:1rem;padding:1rem;border:1px solid color-mix(in srgb,var(--accent) 32%,var(--border));border-radius:14px;background:color-mix(in srgb,var(--accent) 7%,var(--surface))}.licensing-interest-panel h4,.licensing-interest-panel p{margin-top:0}.licensing-interest-panel .full-span,.licensing-interest-panel .form-message{grid-column:1/-1}.licensing-interest-panel.is-recorded{grid-template-columns:minmax(0,1fr) auto;align-items:center}.licensing-interest-check{padding:.75rem;border:1px solid color-mix(in srgb,var(--accent) 24%,var(--border));border-radius:10px;background:color-mix(in srgb,var(--accent) 6%,transparent)}.licensing-intent-admin{display:grid;gap:.1rem;margin-top:.35rem;color:var(--muted);font-size:.76rem}.licensing-intent-admin strong{color:var(--accent)}@media(max-width:680px){.licensing-interest-panel,.licensing-interest-panel.is-recorded{grid-template-columns:1fr}.licensing-interest-panel.is-recorded .button{width:100%}}

.licensing-interest-disclosure{margin:.65rem 0 0;padding-left:1.15rem;color:var(--muted);font-size:.82rem;line-height:1.5}.licensing-interest-disclosure li+li{margin-top:.2rem}


/* Public place trust badges */
.hotel-stars-badge{display:inline-flex;align-items:center;gap:.12rem;min-height:1.55rem;padding:.18rem .48rem;border-radius:999px;border:1px solid color-mix(in srgb,#d4a017 42%,var(--border));background:color-mix(in srgb,#d4a017 14%,var(--surface));color:#a67c00;font-size:.78rem;font-weight:850;letter-spacing:.02em;line-height:1;white-space:nowrap}
.hotel-stars-badge .hotel-stars-superior{margin-left:.08rem;font-size:.68rem;font-weight:900}
.traveler-osm-place-results .hotel-stars-badge{margin-left:.35rem;vertical-align:middle}
.place-trust-badge{display:inline-flex;align-items:center;gap:.38rem;min-height:1.85rem;padding:.28rem .62rem .28rem .42rem;border:1px solid transparent;border-radius:999px;font-size:.75rem;font-weight:850;letter-spacing:.015em;line-height:1;white-space:nowrap;text-shadow:none;box-shadow:0 6px 16px rgba(0,0,0,.16);-webkit-font-smoothing:antialiased}
.place-trust-badge svg{width:1.12rem;height:1.12rem;flex:0 0 auto;overflow:visible}
.place-trust-badge svg>path:first-child{fill:currentColor;stroke:currentColor;stroke-width:1.1;stroke-linejoin:round}
.place-trust-badge .badge-icon-mark{fill:none;stroke:var(--surface-strong);stroke-width:2.35;stroke-linecap:round;stroke-linejoin:round}
.place-trust-badge.is-claimed{color:#2ed3b7;background:color-mix(in srgb,#0c594f 82%,var(--surface-strong));border-color:color-mix(in srgb,#2ed3b7 58%,var(--border))}
.place-trust-badge.is-licensed{color:#ffd66b;background:linear-gradient(135deg,color-mix(in srgb,#6a5012 76%,var(--surface-strong)),color-mix(in srgb,#3d2d75 52%,var(--surface-strong)));border-color:color-mix(in srgb,#ffd66b 66%,var(--border));box-shadow:0 7px 19px rgba(64,45,8,.25),inset 0 1px 0 rgba(255,255,255,.13)}
.place-trust-badge.is-licensed .badge-icon-mark{stroke:#30250d}
@media(max-width:560px){.place-trust-badge{min-height:1.72rem;padding:.24rem .52rem .24rem .36rem;font-size:.7rem}.place-trust-badge svg{width:1rem;height:1rem}}


/* Admin listing status preview lab */
.listing-status-preview{border-color:color-mix(in srgb,var(--accent) 34%,var(--border));background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 6%,var(--surface)),var(--surface))}.listing-status-preview>summary{display:flex;align-items:center;gap:.6rem}.listing-preview-toolbar{display:grid;grid-template-columns:minmax(0,1fr) minmax(14rem,.34fr);gap:1rem;align-items:end;padding:1rem}.listing-preview-toolbar h3{margin:.15rem 0}.listing-preview-toolbar .note{margin-bottom:0}.listing-status-preview-canvas{position:relative;margin:0 1rem 1rem;padding:1rem;padding-top:2.8rem;border:1px dashed color-mix(in srgb,var(--accent) 38%,var(--border));border-radius:18px;background:color-mix(in srgb,var(--surface-strong) 88%,transparent);overflow:hidden}.listing-preview-ribbon{position:absolute;top:.65rem;right:-2.4rem;width:11rem;padding:.3rem;background:#d97706;color:#fff;text-align:center;font-size:.68rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;transform:rotate(8deg);box-shadow:0 4px 10px rgba(0,0,0,.2)}.listing-preview-columns{display:grid;grid-template-columns:minmax(250px,.78fr) minmax(300px,1.22fr);gap:1rem;align-items:start}.listing-preview-card{cursor:default;max-width:25rem}.listing-preview-image{display:grid;place-items:center;min-height:8rem;margin:-.1rem -.1rem .8rem;border-radius:14px;background:radial-gradient(circle at 35% 25%,rgba(255,214,107,.28),transparent 34%),linear-gradient(135deg,#243b53,#102a43)}.listing-preview-image span{font-size:3rem;filter:drop-shadow(0 6px 10px rgba(0,0,0,.25))}.listing-preview-detail{padding:1rem;border:1px solid var(--border);border-radius:15px;background:var(--surface)}.listing-preview-detail h3{margin:.75rem 0 .3rem}.listing-preview-detail dl{display:grid;grid-template-columns:minmax(7rem,.32fr) 1fr;gap:.65rem 1rem;margin:1rem 0 0}.listing-preview-detail dt{font-weight:800;color:var(--muted)}.listing-preview-detail dd{margin:0}.listing-preview-private-note{margin-top:1rem;padding:.75rem;border:1px solid color-mix(in srgb,#a78bfa 48%,var(--border));border-radius:11px;background:color-mix(in srgb,#7c3aed 9%,transparent)}.place-trust-badge.is-preview{color:#c4b5fd;background:color-mix(in srgb,#4c1d95 58%,var(--surface-strong));border-color:color-mix(in srgb,#a78bfa 62%,var(--border))}.place-trust-badge.is-preview .badge-icon-mark{fill:var(--surface-strong);stroke:var(--surface-strong)}@media(max-width:760px){.listing-preview-toolbar,.listing-preview-columns{grid-template-columns:1fr}.listing-preview-detail dl{grid-template-columns:1fr;gap:.2rem}.listing-preview-detail dd+dt{margin-top:.5rem}}


/* Place claim verification */
.claim-verification-help{margin-top:-.35rem;padding:.7rem;border-left:3px solid color-mix(in srgb,var(--accent) 55%,var(--border));background:color-mix(in srgb,var(--accent) 6%,transparent)}.claim-verification-summary{display:grid;gap:.18rem;margin-bottom:.4rem}.claim-verification-summary strong{color:var(--accent)}.claim-verification-confirm{display:inline-flex;align-items:center;gap:.35rem;padding:.35rem .5rem;border:1px solid color-mix(in srgb,#f8d678 42%,var(--border));border-radius:9px;color:#f8d678;font-size:.72rem;font-weight:750}.claim-verification-confirm input{width:1rem;height:1rem;accent-color:var(--accent)}


/* Honest empty place-data state */
.place-data-empty{display:grid;justify-items:center;gap:.35rem}.place-data-empty strong{color:var(--text)}


/* Owner external place discovery */
.owner-place-discovery-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(14rem,.65fr) auto;gap:.7rem;align-items:end;width:min(100%,58rem);margin-top:.75rem;padding:1rem;border:1px solid color-mix(in srgb,var(--accent) 35%,var(--border));border-radius:14px;background:color-mix(in srgb,var(--accent) 7%,var(--surface));text-align:left}.owner-place-discovery-form>div:first-child{display:grid;gap:.2rem}.owner-place-discovery-form .form-message,.owner-place-candidates{grid-column:1/-1}.owner-place-candidates{display:grid;gap:.55rem}.owner-place-candidate{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.7rem;align-items:center;padding:.7rem;border:1px solid var(--border);border-radius:11px;background:var(--surface)}.owner-place-candidate>div{display:grid;gap:.15rem}.owner-place-candidate span,.owner-place-candidate small{color:var(--muted)}@media(max-width:760px){.owner-place-discovery-form,.owner-place-candidate{grid-template-columns:1fr}.owner-place-discovery-form .button,.owner-place-candidate .button{width:100%}}


/* Traveler and business intent separation */
.business-listing-onboarding{border-color:color-mix(in srgb,var(--accent) 34%,var(--border));background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 7%,var(--surface)),var(--surface))}.business-listing-onboarding .page-section-header{align-items:start}.business-onboarding-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.55rem;margin:0 0 1rem;padding:0;list-style:none}.business-onboarding-steps li{display:flex;align-items:center;gap:.45rem;padding:.65rem;border:1px solid var(--border);border-radius:11px;background:color-mix(in srgb,var(--surface-strong) 84%,transparent);font-size:.8rem;font-weight:750}.business-onboarding-steps li span:first-child{display:grid;place-items:center;width:1.55rem;height:1.55rem;flex:0 0 auto;border-radius:8px;background:color-mix(in srgb,var(--accent) 15%,transparent);color:var(--accent)}.business-owner-search{grid-template-columns:repeat(3,minmax(0,1fr)) auto;margin-top:0;width:100%}.business-owner-search>button{align-self:end;width:auto;min-height:2.75rem;padding:.62rem 1rem;font-size:.84rem;white-space:nowrap}.business-owner-search .full-span{grid-column:1/-1}@media(max-width:900px){.business-onboarding-steps{grid-template-columns:repeat(2,minmax(0,1fr))}.business-owner-search{grid-template-columns:1fr 1fr}.business-owner-search>button{width:100%}}@media(max-width:560px){.business-onboarding-steps,.business-owner-search{grid-template-columns:1fr}}


/* Dashboard automatic OSM location fallback */
.external-location-results{display:grid;gap:.8rem}.external-location-heading{display:flex;align-items:start;justify-content:space-between;gap:1rem}.external-location-heading h3{margin:.15rem 0}.external-location-candidate{grid-template-columns:minmax(0,1fr) auto;align-items:center}.external-location-candidate>div{display:grid;gap:.18rem}.osm-attribution{margin:0}@media(max-width:620px){.external-location-candidate{grid-template-columns:1fr}.external-location-candidate .button{width:100%}}

/* Location discovery queue progress */
.external-location-results [data-import-location-candidate]:disabled{opacity:.62;cursor:wait}
.global-search-queue-note{color:var(--accent);font-weight:750}

/* Admin Activity Monitor */
.admin-activity-monitor{margin:.85rem 0 1rem;padding:1rem;border:1px solid color-mix(in srgb,var(--accent) 44%,var(--border));border-radius:18px;background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 10%,var(--surface-strong)),color-mix(in srgb,var(--surface) 94%,transparent));box-shadow:0 12px 30px rgba(0,0,0,.14)}.admin-activity-monitor-heading{display:flex;align-items:start;justify-content:space-between;gap:1rem;padding-bottom:.75rem;border-bottom:1px solid var(--border)}.admin-activity-monitor-heading h3{margin:.12rem 0;font-size:1.25rem}.admin-activity-monitor-heading .note{margin:0}.admin-activity-monitor-list{display:grid;gap:.5rem;margin-top:.75rem}.activity-monitor-empty{padding:.8rem;border:1px dashed var(--border);border-radius:11px;color:var(--muted);text-align:center}.activity-monitor-item{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:.65rem;align-items:start;padding:.7rem .75rem;border:1px solid var(--border);border-radius:12px;background:color-mix(in srgb,var(--surface) 86%,transparent)}.activity-monitor-item p{margin:.16rem 0 0;color:var(--muted);line-height:1.4}.activity-monitor-item time{color:var(--muted);font-size:.72rem}.activity-monitor-indicator{width:.7rem;height:.7rem;margin-top:.3rem;border-radius:50%;background:var(--muted)}.activity-monitor-item.is-active{border-color:color-mix(in srgb,var(--accent) 50%,var(--border));background:color-mix(in srgb,var(--accent) 8%,var(--surface))}.activity-monitor-item.is-active .activity-monitor-indicator{background:var(--accent);box-shadow:0 0 0 .28rem color-mix(in srgb,var(--accent) 15%,transparent);animation:activity-monitor-pulse 1.4s ease-in-out infinite}.activity-monitor-item.is-issue{border-color:rgba(248,214,120,.42)}.activity-monitor-item.is-issue .activity-monitor-indicator{background:#f8d678}.activity-monitor-item.is-success .activity-monitor-indicator{background:#2ed3b7}@keyframes activity-monitor-pulse{50%{transform:scale(.72);opacity:.62}}@media(max-width:620px){.admin-activity-monitor-heading{display:grid}.activity-monitor-item{grid-template-columns:auto minmax(0,1fr)}.activity-monitor-item time{grid-column:2}}@media(prefers-reduced-motion:reduce){.activity-monitor-item.is-active .activity-monitor-indicator{animation:none}}


/* Traveler automatic OSM place fallback */
.places-osm-extras{display:grid;gap:.8rem;margin-top:.85rem}
.places-osm-extras:empty{display:none;margin:0}
.traveler-osm-place-results{grid-column:1/-1;display:grid;gap:.8rem;padding:1rem;border:1px solid color-mix(in srgb,var(--accent) 38%,var(--border));border-radius:16px;background:color-mix(in srgb,var(--accent) 7%,var(--surface))}.traveler-osm-place-results [data-import-traveler-place]:disabled{opacity:.62;cursor:wait}


/* Manual OSM search alongside local place matches */
.manual-osm-place-fallback{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.65rem;align-items:center;padding:.85rem 1rem;border:1px dashed color-mix(in srgb,var(--accent) 46%,var(--border));border-radius:14px;background:color-mix(in srgb,var(--accent) 5%,var(--surface))}.manual-osm-place-fallback>div{display:grid;gap:.15rem}.manual-osm-place-fallback .full-span{grid-column:1/-1;margin:0}.manual-osm-place-fallback .osm-browse-elsewhere{margin-top:.15rem}.manual-osm-place-fallback.is-searching{border-style:solid;border-color:color-mix(in srgb,var(--accent) 62%,var(--border));background:linear-gradient(120deg,color-mix(in srgb,var(--accent) 10%,var(--surface)),color-mix(in srgb,var(--accent) 4%,var(--surface)),color-mix(in srgb,var(--accent) 12%,var(--surface)));background-size:200% 100%;animation:osm-search-sheen 1.4s ease-in-out infinite}.manual-osm-place-fallback.is-gated{grid-template-columns:auto minmax(0,1fr);gap:.75rem;padding:1rem 1.05rem;border:1.5px dashed color-mix(in srgb,var(--accent) 62%,var(--border));background:color-mix(in srgb,var(--accent) 14%,var(--surface));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 12%,transparent)}.manual-osm-place-fallback.is-gated .osm-gate-icon{display:grid;place-items:center;flex:0 0 auto;width:2.15rem;height:2.15rem;border-radius:999px;background:color-mix(in srgb,var(--accent) 18%,var(--surface));color:var(--accent);border:1px solid color-mix(in srgb,var(--accent) 40%,var(--border))}.manual-osm-place-fallback.is-gated .osm-gate-icon svg{display:block}.manual-osm-place-fallback.is-gated .osm-gate-message{margin:0;font-size:.95rem;line-height:1.45;font-weight:700;color:var(--text)}.osm-include-hostels{display:inline-flex;align-items:center;gap:.45rem;margin-top:.45rem;width:fit-content;font-size:.82rem;font-weight:700;color:var(--text);cursor:pointer}.osm-include-hostels input{width:1.05rem;height:1.05rem;accent-color:var(--accent);cursor:pointer}.osm-search-progress{grid-column:1/-1;display:flex;align-items:center;gap:.75rem;margin-top:.15rem;padding:.7rem .8rem;border-radius:12px;border:1px solid color-mix(in srgb,var(--accent) 38%,var(--border));background:color-mix(in srgb,var(--accent) 8%,var(--surface))}.osm-search-progress strong{display:block}.osm-search-progress .small-muted{display:block;margin-top:.1rem}.osm-search-progress.is-standalone{margin-top:.85rem}.osm-search-spinner{flex:0 0 auto;width:1.35rem;height:1.35rem;border-radius:50%;border:2.5px solid color-mix(in srgb,var(--accent) 25%,var(--border));border-top-color:var(--accent);animation:osm-search-spin .7s linear infinite}.button.is-searching{opacity:.82;cursor:wait}@keyframes osm-search-spin{to{transform:rotate(360deg)}}@keyframes osm-search-sheen{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}@media(max-width:620px){.manual-osm-place-fallback{grid-template-columns:1fr}.manual-osm-place-fallback.is-gated{grid-template-columns:auto minmax(0,1fr)}.manual-osm-place-fallback .button{width:100%}}@media(prefers-reduced-motion:reduce){.manual-osm-place-fallback.is-searching,.osm-search-spinner{animation:none}}
.osm-load-more-row{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:.55rem;margin-top:.35rem}
.manual-place-create{grid-column:1/-1;display:grid;gap:.75rem;padding:1rem;border:1px solid color-mix(in srgb,var(--accent) 28%,var(--border));border-radius:14px;background:color-mix(in srgb,var(--accent) 4%,var(--surface))}.manual-place-create>div:first-child{display:grid;gap:.2rem}.manual-place-create form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}.manual-place-create .full-span{grid-column:1/-1}.manual-place-create label{display:grid;gap:.25rem;font-size:.82rem}.manual-place-create .form-actions{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}@media(max-width:620px){.manual-place-create form{grid-template-columns:1fr}}
.manual-place-website-preview{display:grid;gap:.45rem;padding:.85rem .9rem;border:1px dashed color-mix(in srgb,var(--warning, #b7791f) 55%,var(--border));border-radius:12px;background:color-mix(in srgb,var(--warning, #b7791f) 8%,var(--surface))}.manual-place-website-preview-head{display:flex;flex-wrap:wrap;align-items:center;gap:.45rem}.manual-place-website-preview-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.55rem;align-items:end}.manual-place-website-preview-row label{display:grid;gap:.25rem;font-size:.82rem;margin:0}.manual-place-website-preview #manualPlaceWebsitePreviewMessage{margin:0}@media(max-width:620px){.manual-place-website-preview-row{grid-template-columns:1fr}.manual-place-website-preview-row .button{width:100%}}
#adminPlaceFromWebsiteAccessPanel{margin:.85rem 0 1.1rem;padding:1rem;border:1px solid var(--border);border-radius:14px;background:color-mix(in srgb,var(--surface) 92%,var(--accent) 8%);display:grid;gap:.65rem}#adminPlaceFromWebsiteAccessPanel h4{margin:0}#adminPlaceFromWebsiteAccessPanel textarea{width:100%;min-height:3.5rem}

/* Place search actions */
.place-search-actions{align-self:end;margin:0}
.place-search-actions .button{min-height:2.75rem}

/* Traveler place result actions — same bottom action row as local place cards */
.traveler-osm-place-results .owner-place-candidate.place-result-card{display:grid;grid-template-columns:1fr;gap:.45rem;align-content:start;padding:.65rem .75rem}
.traveler-osm-place-results .place-result-card-body{display:grid;gap:.08rem}
.traveler-osm-place-results .place-card-actions{margin-top:.15rem;justify-content:flex-start}
.traveler-osm-place-results .place-card-actions .button{width:auto;min-height:2.15rem;padding:.38rem .7rem;font-size:.76rem}
.traveler-osm-place-results [data-claim-traveler-place]:disabled,.traveler-osm-place-results [data-import-traveler-place]:disabled{opacity:.62;cursor:wait}
.place-result-claim-state{align-self:center;white-space:nowrap}
@media(max-width:620px){.traveler-osm-place-results .place-card-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}.traveler-osm-place-results .place-card-actions .button{width:100%}}
/* Compact OpenStreetMap place candidates */
.traveler-osm-place-results{gap:.6rem;padding:.75rem}.traveler-osm-place-results .external-location-heading h3{font-size:1.05rem}.traveler-osm-place-results .owner-place-candidates{display:grid;grid-template-columns:repeat(auto-fit,minmax(17rem,25rem));justify-content:start;gap:.55rem}.traveler-osm-place-results .owner-place-candidate>div:first-child{gap:.08rem}.traveler-osm-place-results .owner-place-candidate strong{font-size:.92rem}.traveler-osm-place-results .owner-place-candidate span,.traveler-osm-place-results .owner-place-candidate small{font-size:.76rem;line-height:1.3}@media(max-width:620px){.traveler-osm-place-results .owner-place-candidates{grid-template-columns:1fr}}


/* Community reputation, traveler cards, and helpfulness */
.traveler-stamp{
  display:inline-block;
  position:relative;
  vertical-align:middle;
  margin:.2rem .35rem;
}
.traveler-stamp summary{
  list-style:none;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  padding:.28rem .55rem;
  border:1px solid var(--border);
  border-radius:999px;
  background:linear-gradient(135deg, color-mix(in srgb, var(--accent) 14%, transparent), color-mix(in srgb, var(--accent) 8%, var(--surface-soft)));
  color:var(--text);
  font-size:.83rem;
  font-weight:750;
}
.traveler-stamp summary::-webkit-details-marker{display:none}
.traveler-stamp summary:hover,
.traveler-stamp[open] summary{
  border-color:color-mix(in srgb, var(--accent) 45%, var(--border));
  background:color-mix(in srgb, var(--accent) 12%, var(--surface));
}
.traveler-rank-icon{
  display:grid;
  place-items:center;
  width:1.65rem;
  height:1.65rem;
  border-radius:50%;
  background:color-mix(in srgb, var(--accent) 22%, var(--surface-soft));
  color:var(--accent-strong);
  box-shadow:0 0 0 2px color-mix(in srgb, var(--accent) 22%, transparent);
}
.traveler-rank-label{color:var(--muted);font-size:.72rem}
.rank-green .traveler-rank-icon{background:#176b49;color:#eafff4}
.rank-cyan .traveler-rank-icon{background:#087d91;color:#e8fbff}
.rank-blue .traveler-rank-icon{background:#2459a6;color:#eef5ff}
.rank-violet .traveler-rank-icon{background:#7148a5;color:#f6efff}
.rank-teal .traveler-rank-icon{background:#087b75;color:#e8fffc}
.rank-amber .traveler-rank-icon{background:#9a6812;color:#fff8e8}
.rank-gold .traveler-rank-icon{background:linear-gradient(135deg,#b77400,#ffd967);color:#152033}
.traveler-card-popover{
  position:absolute;
  z-index:30;
  left:0;
  top:calc(100% + .35rem);
  display:grid;
  gap:.35rem;
  width:min(300px,80vw);
  padding:.85rem;
  border:1px solid color-mix(in srgb, var(--accent) 40%, var(--border));
  border-radius:14px;
  background:var(--surface);
  color:var(--text);
  box-shadow:0 16px 38px color-mix(in srgb, var(--text) 14%, transparent);
  text-align:left;
  font-size:.85rem;
}
.traveler-card-popover strong{color:var(--text)}
.traveler-card-popover span,
.traveler-card-popover p{color:var(--text)}
.traveler-card-popover .small-muted,
.traveler-card-popover small{color:var(--muted)}
.traveler-rank-line{color:var(--accent-strong);font-weight:700}
.traveler-card-popover p{margin:.2rem 0}
.helpful-vote-button.active{
  border-color:color-mix(in srgb, #30b377 55%, var(--border));
  background:color-mix(in srgb, #30b377 16%, var(--surface));
  color:color-mix(in srgb, #176b49 70%, var(--text));
}
.traveler-card-preview-wrap{
  display:grid;
  gap:.7rem;
  margin:.85rem 0 1rem;
  padding:1rem;
  border:1px solid color-mix(in srgb, var(--border) 82%, transparent);
  border-radius:1rem;
  background:linear-gradient(145deg, color-mix(in srgb, var(--accent) 7%, transparent), transparent 55%), var(--surface-soft);
}
.traveler-card-preview-wrap > .auth-helper{margin:0}
.traveler-card-preview-panel{
  display:grid;
  gap:.85rem;
}
.traveler-card-preview-stamp{display:flex;align-items:center}
.traveler-card-preview-body{
  display:grid;
  gap:.4rem;
  width:min(100%, 22rem);
  padding:.95rem 1rem;
  border:1px solid color-mix(in srgb, var(--accent) 45%, var(--border));
  border-radius:14px;
  background:var(--surface);
  color:var(--text);
  box-shadow:0 14px 34px color-mix(in srgb, var(--text) 10%, transparent);
  font-size:.9rem;
}
.traveler-card-preview-body strong{color:var(--text)}
.traveler-card-preview-body span,
.traveler-card-preview-body p{color:var(--text)}
.traveler-card-preview-body .small-muted,
.traveler-card-preview-body small{color:var(--muted)}
.traveler-card-preview-identity{
  display:flex;
  align-items:center;
  gap:.75rem;
}
.traveler-card-preview-identity > div:last-child{
  display:grid;
  gap:.2rem;
  min-width:0;
}
.traveler-card-preview-avatar{
  width:3rem;
  height:3rem;
  border-radius:50%;
  display:grid;
  place-items:center;
  overflow:hidden;
  flex-shrink:0;
  background:color-mix(in srgb, var(--accent) 18%, var(--surface));
  color:var(--accent);
  font-weight:850;
  letter-spacing:.04em;
}
.traveler-card-preview-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.traveler-card-preview-body p{margin:.15rem 0}
.community-rank-preview{
  font-size:.92rem;
  line-height:1.45;
}

.community-privacy-options{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem 1rem;margin:.7rem 0}.community-privacy-options label{display:inline-flex;align-items:center;gap:.4rem;flex:0 0 auto;width:auto;white-space:nowrap;overflow-wrap:normal;word-break:normal}.community-privacy-options input[type="checkbox"]{flex:0 0 auto;width:1rem;margin:0}.community-rank-preview{margin:.8rem 0;padding:.7rem .85rem;border:1px solid var(--border);border-radius:12px;background:rgba(63,174,216,.08)}

/* Author-name traveler card hover / tap preview (groups feed, comments, composer) */
.traveler-card-hover{
  position:relative;
  display:inline-flex;
  vertical-align:baseline;
  max-width:100%;
}
.traveler-card-hover-trigger{
  appearance:none;
  border:0;
  background:transparent;
  padding:0;
  margin:0;
  font:inherit;
  font-weight:800;
  color:inherit;
  cursor:pointer;
  text-align:left;
  border-radius:0.2rem;
  text-decoration:underline;
  text-decoration-color:transparent;
  text-underline-offset:0.18em;
  transition:text-decoration-color 140ms ease,color 140ms ease;
}
.traveler-card-hover-trigger:hover,
.traveler-card-hover-trigger:focus-visible,
.traveler-card-hover.is-open .traveler-card-hover-trigger{
  text-decoration-color:color-mix(in srgb, var(--accent) 55%, transparent);
  color:var(--accent-strong);
  outline:none;
}
.traveler-card-hover-trigger:focus-visible{
  box-shadow:0 0 0 2px color-mix(in srgb, var(--accent) 35%, transparent);
}
.traveler-card-name-plain{font-weight:800}
.traveler-card-hover-panel{
  position:absolute;
  z-index:80;
  left:0;
  top:calc(100% + 0.4rem);
  display:none;
  width:min(22rem, calc(100vw - 2rem));
  padding:0;
  border:1px solid color-mix(in srgb, var(--accent) 40%, var(--border));
  border-radius:14px;
  background:var(--surface);
  box-shadow:0 16px 38px color-mix(in srgb, var(--text) 14%, transparent);
  color:var(--text);
  text-align:left;
  font-size:0.9rem;
}
.traveler-card-hover.is-open .traveler-card-hover-panel,
.traveler-card-hover-panel:not([hidden]){
  display:block;
}
.traveler-card-hover-panel[hidden]{display:none !important}
.traveler-card-hover-panel .traveler-card-preview-panel{
  gap:0.7rem;
  padding:0.85rem 0.95rem;
}
.traveler-card-hover-panel .traveler-card-preview-body{
  width:auto;
  max-width:none;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.traveler-card-hover-panel .traveler-rank-line{color:var(--accent);font-weight:700}
#groups .group-post-author-line .traveler-card-hover,
#groups .group-comment-bubble .traveler-card-hover,
#groups .groups-composer-author-line .traveler-card-hover{
  max-width:100%;
}
#groups .group-comment-bubble{position:relative;overflow:visible}
#groups .group-post-meta,
#groups .group-post-author-line,
#groups .groups-composer-author-copy{overflow:visible}

@media (max-width:650px){.traveler-rank-label{display:none}.traveler-card-popover{position:fixed;left:1rem;right:1rem;top:auto;bottom:1rem;width:auto}.traveler-card-hover-panel{position:fixed;left:1rem;right:1rem;top:auto;bottom:1rem;width:auto}.form-grid.three-col{grid-template-columns:1fr}}


.helpful-vote-button{display:inline-flex;align-items:center;gap:.4rem}


.helpful-vote-button>span{display:inline-block;margin-left:.28rem;min-width:.7ch}
.traveler-rank-inline{display:inline-flex;align-items:center;gap:.38rem;font-size:.82rem;font-weight:750}.traveler-rank-inline .traveler-rank-icon{width:1.55rem;height:1.55rem;font-size:.88rem}

.experience-card-author{display:flex;align-items:center;min-height:2rem;margin:.15rem 0 .35rem}.experience-card-author .traveler-stamp{margin:0}


/* Help / Support utilities — calm in top bar; Support pill only in mobile drawer */
.header-utils .support-nav-link {
  color: var(--muted);
  background: transparent;
  border-radius: 0.65rem;
  padding: 0.45rem 0.7rem;
  font-weight: 700;
  box-shadow: none;
}
.header-utils .support-nav-link:hover,
.header-utils .support-nav-link:focus-visible {
  color: var(--accent);
  filter: none;
  background: color-mix(in srgb, var(--accent) 10%, transparent);
}
.header-utils .help-nav-link { color: var(--muted); }
.main-nav .support-nav-link{color:#07131f;background:linear-gradient(135deg,#62d5f1,#8be8c8);border-radius:999px;padding:.55rem .85rem;font-weight:850;box-shadow:0 5px 18px rgba(55,194,225,.2)}.main-nav .support-nav-link:hover,.main-nav .support-nav-link:focus-visible{color:#07131f;filter:brightness(1.06)}.main-nav .help-nav-link{color:#8fe6f7}.quick-card-help,.quick-card-support{border-color:color-mix(in srgb,var(--accent) 42%,var(--border))}.quick-card-support{background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 12%,var(--surface)),var(--surface))}.help-panel-header{align-items:center}.help-topic-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}.help-topic-card{border:1px solid var(--border);border-radius:15px;background:var(--surface);overflow:hidden}.help-topic-card summary{display:flex;align-items:center;gap:.65rem;padding:1rem;cursor:pointer;font-weight:800}.help-topic-card summary>span[aria-hidden="true"]{display:grid;place-items:center;flex:0 0 2rem;width:2rem;height:2rem;border-radius:50%;background:color-mix(in srgb,var(--accent) 14%,var(--surface-strong));color:var(--accent)}.help-topic-card summary>span[data-i18n]{display:block;min-width:0;width:auto;height:auto;color:inherit;line-height:1.35;overflow-wrap:normal;word-break:normal}.help-topic-card p{margin:0;padding:0 1rem 1rem;color:var(--muted);line-height:1.55}.help-support-callout{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:1rem;padding:1rem 1.15rem;border:1px solid color-mix(in srgb,var(--accent) 48%,var(--border));border-radius:16px;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 12%,var(--surface)),var(--surface))}.help-support-callout p{margin:.25rem 0 0;color:var(--muted)}@media(max-width:900px){.help-topic-grid{grid-template-columns:1fr}.main-nav .support-nav-link{border-radius:10px}.help-support-callout{align-items:stretch;flex-direction:column}}


/* Keep translated search placeholders readable (full-width inputs; short i18n strings) */
#advice .advice-filters-section .filters-row label:has(#publicAdviceSearch),
#groups .filters-row label:has(#groupsSearch),
#places .places-filters-section .filters-row label:has(#publicPlaceSearch) {
  min-width: min(100%, 22rem);
}
#advice .advice-filters-section #publicAdviceSearch,
#groups #groupsSearch,
#places #publicPlaceSearch,
#experiences #publicPostSearch {
  width: 100%;
  min-width: 0;
  text-overflow: ellipsis;
}

/* Experience search: keep translated placeholders readable */
#experiences .experiences-filters-section .filters-row{display:grid;grid-template-columns:minmax(0,48rem) auto;align-items:end;justify-content:start}
#experiences .experiences-filters-section .filters-row label{width:100%;min-width:0}
#experiences .experiences-filters-section #publicPostSearch{width:100%;min-width:0}
@media(max-width:620px){#experiences .experiences-filters-section .filters-row{grid-template-columns:minmax(0,1fr)}#experiences .experiences-filters-section .experience-search-button{display:none}}


/* Strong outer boundary for the complete Activity Monitor */
#adminActivityMonitor.admin-activity-monitor{position:relative;padding:1.15rem;border:1px solid transparent;border-radius:24px;overflow:hidden;background:linear-gradient(145deg,color-mix(in srgb,var(--surface-strong) 94%,var(--accent) 6%),color-mix(in srgb,var(--surface) 97%,transparent)) padding-box,linear-gradient(135deg,color-mix(in srgb,var(--accent) 72%,#a9efff),color-mix(in srgb,var(--accent) 24%,var(--border)) 55%,color-mix(in srgb,#53d6bb 42%,var(--border))) border-box;box-shadow:0 16px 38px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.045)}
#adminActivityMonitor .admin-activity-monitor-heading{padding:.05rem .1rem .85rem}
#adminActivityMonitor .admin-activity-monitor-list{gap:.55rem}
#adminActivityMonitor .activity-monitor-item{border-radius:14px;background:color-mix(in srgb,var(--surface) 89%,transparent);box-shadow:inset 0 1px 0 rgba(255,255,255,.025)}
@media(max-width:620px){#adminActivityMonitor.admin-activity-monitor{padding:.85rem;border-radius:19px}#adminActivityMonitor .activity-monitor-item{border-radius:12px}}

.place-relevance-badge {
  margin-left: auto;
  color: var(--accent-strong);
  border-color: color-mix(in srgb, var(--accent) 42%, var(--border));
  background: color-mix(in srgb, var(--accent) 14%, var(--surface));
  font-weight: 800;
  white-space: nowrap;
}
/* Searchable traveler country/city selectors.
   Mobile: one combobox control. Desktop: native select only. */
.location-select-search {
  width: 100%;
  margin: 0.4rem 0 0.5rem;
}
.location-select-search + select,
.location-select-native {
  width: 100%;
}
.location-select-combobox,
.places-location-combobox {
  display: none;
}
@media (max-width: 760px) {
  .location-select-combobox,
  .places-location-combobox,
  .location-select-search {
    display: block;
    min-height: 46px;
    font-size: 16px;
  }
  .location-select-native,
  .places-location-native {
    display: none;
  }
}
@media (min-width: 761px) {
  .location-select-native,
  .places-location-native {
    display: block;
  }
  .location-select-combobox,
  .places-location-combobox,
  .location-select-search {
    display: none;
  }
}
/* Place-to-trip membership status and management. */
.trip-membership-control {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .45rem;
  max-width: 100%;
}
.trip-membership-label {
  display: inline-flex;
  align-items: center;
  min-height: 2rem;
  max-width: 14rem;
  padding: .3rem .65rem;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--muted);
  font-size: .82rem;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.trip-membership-control.is-in-trip .trip-membership-label {
  border-color: rgba(93, 214, 241, .65);
  background: rgba(93, 214, 241, .12);
  color: var(--text);
}
.trip-manage-text { font-size: .82rem; font-weight: 700; }
@media (max-width: 760px) {
  .trip-membership-control { width: 100%; }
  .trip-membership-label { max-width: min(100%, 13rem); }
  .trip-membership-control .add-to-trip-icon-button { min-height: 44px; }
}
/* Sleek trip membership controls and selector. */
.trip-membership-control { gap: .38rem; flex-wrap: nowrap; }
.trip-membership-label {
  gap: .4rem;
  min-height: 2.3rem;
  max-width: 11.5rem;
  padding: .35rem .72rem .35rem .42rem;
  border-color: color-mix(in srgb, var(--accent) 62%, var(--border));
  background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 18%, var(--surface)), color-mix(in srgb, #53d6bb 10%, var(--surface)));
  color: var(--text);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 5px 14px rgba(0,0,0,.08);
  font-weight: 750;
}
.trip-membership-check {
  display: grid;
  place-items: center;
  flex: 0 0 1.35rem;
  width: 1.35rem;
  height: 1.35rem;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--accent), #53d6bb);
  color: #07131f;
  font-size: .76rem;
  font-weight: 950;
  box-shadow: 0 2px 7px color-mix(in srgb, var(--accent) 30%, transparent);
}
.trip-membership-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.trip-membership-control .add-to-trip-icon-button {
  gap: .3rem;
  min-width: auto;
  min-height: 2.3rem;
  padding: .38rem .72rem;
  border-color: color-mix(in srgb, var(--accent) 32%, var(--border));
  background: color-mix(in srgb, var(--surface-strong) 88%, transparent);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
.trip-membership-control .add-to-trip-icon-button:hover,
.trip-membership-control .add-to-trip-icon-button:focus-visible {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 12%, var(--surface));
  transform: translateY(-1px);
}
.trip-membership-control .add-to-trip-icon { font-size: 1rem; }
.trip-manage-text { letter-spacing: .01em; }
.trip-selector-option { transition: border-color .16s ease, background .16s ease, transform .16s ease, box-shadow .16s ease; }
.trip-selector-option:hover { transform: translateY(-1px); border-color: color-mix(in srgb, var(--accent) 45%, var(--border)); }
.trip-selector-option:has(input:checked) {
  border-color: color-mix(in srgb, var(--accent) 68%, var(--border));
  background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 12%, var(--surface-soft)), color-mix(in srgb, #53d6bb 6%, var(--surface-soft)));
  box-shadow: inset 3px 0 0 var(--accent), 0 8px 20px rgba(0,0,0,.07);
}
.trip-selector-option input { accent-color: var(--accent); transform: scale(1.12); }
@media (max-width: 760px) {
  .trip-membership-control { width: auto; max-width: 100%; }
  .trip-membership-label { max-width: 10rem; }
  .trip-membership-control .add-to-trip-icon-button { min-height: 42px; }
}
@media (max-width: 390px) {
  .trip-membership-control { flex-wrap: wrap; }
  .trip-membership-label { max-width: 100%; }
}
/* Inline editing for a traveler own place review. */
.review-owner-actions { margin-top: .75rem; }
.place-review-edit-form {
  margin-top: .85rem;
  padding: .9rem;
  border: 1px solid color-mix(in srgb, var(--accent) 38%, var(--border));
  border-radius: 14px;
  background: color-mix(in srgb, var(--accent) 6%, var(--surface));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}
.place-review-edit-form label { display: grid; gap: .38rem; }
.place-review-edit-form textarea { resize: vertical; }
@media (max-width: 620px) {
  .review-owner-actions .button { min-height: 42px; }
  .place-review-edit-form { padding: .75rem; }
}
/* Traveler place-review likes. */
.place-review-like-button {
  display: inline-flex;
  margin-top: .35rem;
  min-width: 3.2rem;
  min-height: 2.25rem;
  padding: .35rem .65rem;
}
.place-review-like-button.is-liked {
  border-color: rgba(239, 88, 125, .72);
  background: rgba(239, 88, 125, .13);
  color: #ff7898;
}
.place-review-like-button:disabled { cursor: not-allowed; opacity: .55; }
@media (max-width: 620px) { .place-review-like-button { min-height: 42px; } }
.trip-manage-icon {
  width: 1.22rem;
  height: 1.22rem;
  flex: 0 0 1.22rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.trip-membership-control .add-to-trip-icon-button:hover .trip-manage-icon,
.trip-membership-control .add-to-trip-icon-button:focus-visible .trip-manage-icon { transform: scale(1.06); }
/* Country/city type filters are a mobile-only enhancement; desktop keeps native selects. */
@media (max-width: 760px) {
  #places .filters-row .places-location-native,
  #places .filters-row .location-select-native { display: none; }
  #places .filters-row .places-location-combobox,
  #places .filters-row .location-select-combobox { display: block; margin: .38rem 0 0; min-height: 46px; font-size: 16px; }
}
@media (min-width: 761px) {
  #places .filters-row .places-location-native,
  #places .filters-row .location-select-native { display: block; }
  #places .filters-row .places-location-combobox,
  #places .filters-row .location-select-combobox { display: none; }
}
/* Places search: clear What + Where structure. */
#places .places-filters-section .filters-row {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  grid-template-areas:
    "what-heading where-heading"
    "query country"
    "type city"
    "sort actions";
  gap: .78rem 1.2rem;
  padding: 1.1rem;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: color-mix(in srgb, var(--surface) 88%, transparent);
}
#places .places-filters-section .filters-row > * { min-width: 0; }
.places-filter-heading {
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: 0 0 .7rem;
  border-bottom: 1px solid var(--border);
}
.places-filter-heading > span {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border-radius: 10px;
  background: color-mix(in srgb, var(--accent) 14%, var(--surface-strong));
  color: var(--accent);
  font-size: 1.15rem;
  font-weight: 900;
}
.places-filter-heading strong, .places-filter-heading small { display: block; }
.places-filter-heading small { margin-top: .12rem; color: var(--muted); font-size: .78rem; }
.places-filter-heading-what { grid-area: what-heading; }
.places-filter-heading-where { grid-area: where-heading; }
#places .filters-row label:has(#publicPlaceSearch) { grid-area: query; }
#places .filters-row label:has(#publicPlaceType) { grid-area: type; }
#places .filters-row label:has(#publicPlaceSort) { grid-area: sort; max-width: 18rem; }
#places .filters-row label:has(#publicPlaceCountry) { grid-area: country; }
#places .filters-row label:has(#publicPlaceCity) { grid-area: city; }
#places .filters-row .place-search-actions { grid-area: actions; align-self: end; justify-content: flex-start; }
#places .filters-row label { width: 100%; min-width: 0; }
#places .filters-row input, #places .filters-row select { width: 100%; }
@media (max-width: 760px) {
  #places .places-filters-section .filters-row {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "what-heading" "query" "type" "sort" "where-heading" "country" "city" "actions";
    gap: .72rem;
    padding: .9rem;
  }
  #places .places-filter-heading-where { margin-top: .45rem; }
  #places .filters-row label:has(#publicPlaceSort) { max-width: none; }
  #places .filters-row .place-search-actions { width: 100%; }
  #places .filters-row .place-search-actions .button:first-child { flex: 1; }
}
@media (max-width: 650px) {
  #communityProfileForm .form-actions:has(button[type="submit"]),
  #localePreferenceForm .form-actions:has(button[type="submit"]),
  #dashboardPreferenceForm .form-actions:has(button[type="submit"]) { display: none; }
  #communityProfileMessage:not(:empty),
  #localePreferenceMessage:not(:empty),
  #dashboardPreferenceMessage:not(:empty) { margin-top: .8rem; padding: .65rem .75rem; border-radius: .75rem; background: color-mix(in srgb, var(--accent) 10%, var(--surface-soft)); color: var(--text); font-weight: 700; }
}
/* Profile + personal pages share the same shell width as the welcome hero. */
@media (min-width: 651px) {
  #auth:has(#profilePanel:not(.hidden)) { width: 100%; margin-inline: auto; padding: 0; }
  #auth:has(#profilePanel:not(.hidden)) > .profile-intro-card,
  #auth #profilePanel .profile-major-card,
  #auth #profilePanel > .page-stack > .profile-section-card,
  #auth #profilePanel > .page-stack > .profile-prefs-stack,
  #auth #profilePanel > .page-stack > .profile-security-stack { padding: clamp(1.2rem, 2.5vw, 1.55rem); }
  #auth #profilePanel .form-grid.three-col { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
  #auth #profilePanel .profile-prefs-stack #localePreferenceForm > fieldset { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
  #auth #profilePanel .profile-prefs-stack #localePreferenceForm > fieldset > legend,
  #auth #profilePanel .profile-prefs-stack #localePreferenceForm > fieldset > .auth-helper,
  #auth #profilePanel .profile-prefs-stack #localePreferenceForm > fieldset > .full-span { grid-column: 1 / -1; }
  #auth #profilePanel .profile-section-card .form-actions,
  #auth #profilePanel .profile-prefs-stack .form-actions { margin-top: .25rem; }
}
@media (max-width: 760px) {
  #auth #profilePanel .form-grid.three-col { display: grid; grid-template-columns: 1fr; gap: .85rem; }
}
/* Mobile wordmark moved below the trip strip; colors follow every active theme. */
.mobile-brand-line { display: none; }
@media (max-width: 760px) {
  .site-header .brand > div:not(.logo-mark) { display: none; }
  .mobile-brand-line:not(.hidden) {
    display: grid;
    justify-items: center;
    gap: .55rem;
    margin: .9rem auto .8rem;
    padding: .2rem 1rem;
    color: var(--text);
    text-align: center;
    font-size: clamp(1.25rem, 6vw, 1.65rem);
    font-weight: 850;
    line-height: 1.15;
    letter-spacing: -.015em;
    text-shadow: 0 4px 16px color-mix(in srgb, var(--text) 12%, transparent);
  }
  .mobile-brand-line:not(.hidden)::after {
    content: "";
    width: 3.2rem;
    height: .22rem;
    border-radius: 999px;
    background: var(--accent);
    box-shadow: 0 3px 12px color-mix(in srgb, var(--accent) 38%, transparent);
  }
  .upcoming-trip-strip.hidden + .mobile-brand-line:not(.hidden) { margin-top: .75rem; }
}
@media (min-width: 761px) { .mobile-brand-line { display: none !important; } }
/* Personal profile-menu pages use the same separated-card language as My Profile. */
:is(#myTrips, #myReviews, #myExperiences, #myAdvice, #myBusinessSites, #moderation):not(.hidden) {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  width: 100%;
  margin-inline: auto;
}
:is(#myTrips, #myReviews, #myExperiences, #myAdvice, #myBusinessSites, #moderation) > .panel-header,
:is(#myTrips, #myReviews, #myExperiences, #myAdvice, #myBusinessSites, #moderation) > .page-stack > .page-section {
  margin: 0;
  border: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
  border-radius: 1.15rem;
  padding: clamp(1.05rem, 2.5vw, 1.45rem);
  background: linear-gradient(145deg, color-mix(in srgb, var(--accent) 6%, transparent), transparent 58%), var(--surface);
  box-shadow: 0 10px 28px color-mix(in srgb, var(--text) 8%, transparent);
}
:is(#myTrips, #myReviews, #myExperiences, #myAdvice, #myBusinessSites, #moderation) > .panel-header {
  margin-bottom: 1.2rem;
}
:is(#myTrips, #myReviews, #myExperiences, #myAdvice, #myBusinessSites, #moderation) > .page-stack {
  display: grid;
  gap: 1.2rem;
}
:is(#myTrips, #myReviews, #myExperiences, #myAdvice, #myBusinessSites, #moderation) > .page-stack > .page-section .page-section-header {
  padding-bottom: .85rem;
  margin-bottom: .95rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 65%, transparent);
}
:is(#myTrips, #myReviews, #myExperiences, #myAdvice, #myBusinessSites, #moderation) > .page-stack > .page-section .page-section-header + :is(form, .form-message, .table-wrap, .trip-list, .my-reviews-list) {
  margin-top: 0;
}
@media (max-width: 760px) {
  :is(#myTrips, #myReviews, #myExperiences, #myAdvice, #myBusinessSites, #moderation) > .panel-header,
  :is(#myTrips, #myReviews, #myExperiences, #myAdvice, #myBusinessSites, #moderation) > .page-stack > .page-section {
    padding: 1rem;
    border-radius: 1rem;
  }
  :is(#myTrips, #myReviews, #myExperiences, #myAdvice, #myBusinessSites, #moderation) > .panel-header {
    align-items: stretch;
  }
}
.moderator-center { width: 100%; margin-inline: auto; }
.moderation-list { display: grid; gap: .8rem; margin-top: 1rem; }
.moderation-card { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: 1rem; border: 1px solid var(--border); border-radius: 1rem; background: var(--surface-soft); }
.moderation-card > div:first-child { min-width: 0; }
.moderation-card p { margin: .3rem 0 0; overflow-wrap: anywhere; }
.moderation-history-item { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: .25rem 1rem; padding: .8rem 0; border-bottom: 1px solid var(--border); }
.moderation-history-item p { grid-column: 1 / -1; margin: 0; color: var(--muted); }
@media (max-width: 760px) { .moderation-card { flex-direction: column; } .moderation-card .action-row { width: 100%; } .moderation-card .button { flex: 1 1 auto; } }

/* Licensed business website showcase — keep theme-readable contrast (no forced dark panel). */
.business-websites-showcase {
  overflow: hidden;
  border-color: color-mix(in srgb, var(--accent) 28%, var(--border));
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--accent) 10%, transparent), transparent 55%),
    var(--surface);
  color: var(--text);
}
.business-websites-showcase .page-section-header h3,
.business-websites-showcase h4,
.business-websites-showcase h5 {
  color: var(--text);
}
.business-websites-showcase .note,
.business-websites-showcase .small-muted,
.business-websites-showcase .page-section-header .note {
  color: var(--muted);
}
.business-website-showcase-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px;
  align-items: end;
  padding-top: 8px;
}
.business-website-showcase-grid h4 {
  margin: 0 0 6px;
  font-size: 1.08rem;
}
.business-website-showcase-grid .form-actions {
  justify-content: flex-end;
}
.business-address-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 14px 0;
}
.business-address-options article {
  min-width: 0;
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: color-mix(in srgb, var(--bg) 55%, var(--surface-soft));
  color: var(--text);
}
.business-address-options .status-pill {
  background: color-mix(in srgb, var(--accent) 18%, var(--surface));
  border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
  color: var(--accent-strong);
}
.business-websites-showcase > .page-section-header > .status-pill.neutral {
  background: color-mix(in srgb, var(--muted) 14%, var(--surface));
  border-color: color-mix(in srgb, var(--muted) 40%, var(--border));
  color: var(--text);
}
.business-address-options h5 {
  margin: 12px 0 6px;
  font-size: 1rem;
  color: var(--text);
}
.business-address-options p {
  margin: 5px 0;
  overflow-wrap: anywhere;
  color: var(--muted);
}
.business-address-options strong {
  display: inline-block;
  font-size: 0.95rem;
  color: var(--accent-strong);
  font-weight: 750;
}
@media (max-width: 760px) {
  .business-website-showcase-grid {
    grid-template-columns: 1fr;
  }
  .business-website-showcase-grid .form-actions {
    justify-content: stretch;
  }
  .business-website-showcase-grid .button {
    width: 100%;
  }
  .business-address-options {
    grid-template-columns: 1fr;
  }
}

/* Licensed business owner workspace */
.business-site-owner-list{display:grid;gap:14px}.business-site-owner-card{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px;border:1px solid var(--border);border-radius:18px;background:var(--surface-soft)}.business-site-owner-card h4{margin:6px 0 2px}.business-site-owner-card p{margin:0;color:var(--muted)}.business-site-editor-form{display:grid;gap:20px}.business-editor-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.business-theme-fields{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:16px;border:1px solid var(--border);border-radius:16px}.business-theme-fields legend{font-weight:800;padding:0 8px}.business-theme-fields input[type=color]{min-height:48px;padding:4px}@media(max-width:760px){.business-site-owner-card{align-items:stretch;flex-direction:column}.business-site-owner-card .form-actions{width:100%}.business-editor-grid,.business-theme-fields{grid-template-columns:1fr}.business-site-editor-form .form-actions .button{width:100%}}
.premium-subdomain-input{display:flex;align-items:center;gap:6px;min-width:310px}.premium-subdomain-input input{min-width:150px}.premium-subdomain-input span{white-space:nowrap;color:var(--muted);font-size:.85rem}

.place-nav-actions {
  margin: 0.55rem 0 0.85rem;
}
.place-more-info {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem 0.75rem;
  margin: 0 0 0.85rem;
}
.place-more-info.is-compact {
  margin: 0.35rem 0 0;
}
.place-more-info-label {
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.place-more-info-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.65rem;
}
.place-more-info-link {
  font-size: 0.86rem;
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 0.12em;
}
.trip-item-actions .navigate-to-place {
  text-decoration: none;
}

/* Best time to visit — monthly climate strip */
.climate-season-block {
  margin-top: 1rem;
}
.climate-best-line {
  margin: 0 0 0.45rem;
  font-size: 1.05rem;
}
.climate-month-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0.55rem;
  margin: 0.85rem 0 0.75rem;
}
.climate-month-card {
  display: grid;
  gap: 0.28rem;
  padding: 0.7rem 0.55rem 0.65rem;
  border: 1px solid var(--border);
  border-radius: 0.95rem;
  background: color-mix(in srgb, var(--surface-soft) 72%, transparent);
  min-width: 0;
}
.climate-month-card.is-great {
  border-color: color-mix(in srgb, #34d399 55%, var(--border));
  background: color-mix(in srgb, #34d399 12%, var(--surface));
}
.climate-month-card.is-good {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
  background: color-mix(in srgb, var(--accent) 10%, var(--surface));
}
.climate-month-card.is-mixed {
  border-color: color-mix(in srgb, #fbbf24 40%, var(--border));
}
.climate-month-card.is-tough {
  opacity: 0.88;
}
.climate-month-card.is-best {
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 55%, transparent);
}
.climate-month-label {
  font-weight: 850;
  letter-spacing: 0.02em;
}
.climate-month-temps {
  display: flex;
  align-items: baseline;
  gap: 0.35rem;
  font-variant-numeric: tabular-nums;
}
.climate-month-temps strong {
  font-size: 1.05rem;
}
.climate-month-temps span {
  color: var(--muted);
  font-size: 0.86rem;
}
.climate-month-rain {
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.25;
}
.climate-month-tag {
  justify-self: start;
  margin-top: 0.15rem;
  padding: 0.12rem 0.45rem;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--accent-contrast, #04131c);
  background: color-mix(in srgb, var(--accent) 82%, white 10%);
}
.climate-month-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 0.85rem;
  margin: 0 0 0.65rem;
  padding: 0;
  list-style: none;
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.3;
}
.climate-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}
.climate-legend-swatch {
  width: 0.72rem;
  height: 0.72rem;
  flex: 0 0 auto;
  border: 2px solid var(--border);
  border-radius: 0.28rem;
  background: color-mix(in srgb, var(--surface-soft) 72%, transparent);
}
.climate-legend-swatch.is-great {
  border-color: color-mix(in srgb, #34d399 55%, var(--border));
  background: color-mix(in srgb, #34d399 12%, var(--surface));
}
.climate-legend-swatch.is-good {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
  background: color-mix(in srgb, var(--accent) 10%, var(--surface));
}
.climate-legend-swatch.is-mixed {
  border-color: color-mix(in srgb, #fbbf24 40%, var(--border));
}
.climate-legend-swatch.is-tough {
  opacity: 0.55;
}
.climate-legend-swatch.is-best {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 55%, transparent);
  background: color-mix(in srgb, var(--accent) 82%, white 10%);
}
@media (max-width: 900px) {
  .climate-month-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
@media (max-width: 620px) {
  .climate-month-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* Signup spam-risk badges in admin users table */
.admin-user-risk {
  margin-top: .35rem;
  display: inline-flex;
}
tr.is-spam-suspect td:first-child {
  box-shadow: inset 3px 0 0 color-mix(in srgb, #b45309 70%, transparent);
}

.turnstile-slot {
  margin: .35rem 0 .75rem;
  min-height: 0;
}
.turnstile-slot:not([hidden]) {
  min-height: 65px;
}

/* Mobile only: max two bordered box levels so text stays readable.
   Desktop nesting is unchanged. Outer page-section / context-block / place-detail
   stays L1; nested panels flatten to dividers; interactive leaf cards stay L2. */
@media (max-width: 720px) {
  /* Shared flatten tokens applied via grouped selectors below */
  .page-section > .filters-row,
  #places .places-filters-section .filters-row,
  #experiences .experiences-filters-section .filters-row,
  #advice .advice-filters-section .filters-row,
  #locations .filters-row,
  #locations .page-section > .location-browser-controls,
  #locations .browse-validation-panel,
  #dashboard .page-section > .dashboard-search-card,
  #globalSearchResults .search-result-group,
  #publicPlacesSearchResults .manual-osm-place-fallback,
  #publicPlacesSearchResults .manual-place-create,
  #publicPlacesSearchResults .manual-place-website-preview,
  #publicPlacesSearchResults .traveler-osm-place-results,
  #publicPlacesSearchResults .osm-search-progress,
  #publicPlacesSearchResults .osm-search-progress.is-standalone,
  .places-osm-extras > .manual-osm-place-fallback,
  .places-osm-extras > .manual-place-create,
  .places-osm-extras > .manual-place-website-preview,
  .places-osm-extras > .traveler-osm-place-results,
  .places-osm-extras > .osm-search-progress,
  .context-block .hybrid-load-control,
  .places-search-results-block .hybrid-load-control,
  .context-block .live-info-panel,
  .live-info-block .live-info-panel,
  .live-info-stack .live-info-panel,
  .live-info-body .travel-safety-source-card,
  .context-block > .country-auto-refresh-status,
  .embassy-block > .compact-directory,
  .visa-embassy-block > .compact-directory,
  .page-stack > .places-adverts-strip,
  #places .places-adverts-strip,
  #continentPageContent .places-adverts-strip,
  #countryPageContent .places-adverts-strip,
  #cityPageContent .places-adverts-strip,
  #placeDetail .place-owner-panel,
  #placeDetail .place-claim-panel,
  #placeDetail .featured-request-panel,
  #placeDetail .licensing-interest-panel,
  #placeDetail .licensing-interest-check,
  #placeDetail .location-map-card,
  #postDetail .experience-detail-facts,
  #postDetail .experience-detail-note.is-featured,
  #postDetail .experience-chat-list,
  #plans .business-address-options > article,
  #plans .business-onboarding-steps > li,
  #plans .owner-place-discovery-form,
  #plans .owner-place-candidate,
  #plans .plans-ea-banner,
  #plans .plans-current-license,
  #plans .plans-intro-offer-banner,
  #plans .plan-card-offer,
  #plans .plan-type-card,
  #plans .listing-preview-detail,
  #plans .listing-preview-private-note,
  #plans .listing-status-preview-canvas,
  #auth .auth-landing .auth-benefits-card,
  #auth .auth-flow-card .flow-step,
  #auth .account-license-panel,
  #auth .community-rank-preview,
  #auth .profile-prefs-stack > .profile-section-details,
  #auth .profile-security-stack > .profile-section-details,
  #auth .mfa-backup-panel,
  #auth .verification-banner,
  #myTrips .trip-empty-places,
  #myBusinessSites .business-theme-fields,
  #help .help-support-callout,
  #impressum .legal-card > .empty-state,
  #publicLocationsGrid > .empty-state,
  #publicAdviceGrid > .empty-state,
  #publicPostsGrid > .empty-state,
  #dashboardPins > .empty-state,
  #myTripsList > .empty-state,
  #myReviewsList > .empty-state,
  #myBusinessSitesList > .empty-state,
  #publicPlacesSearchResults .directory-grid > .empty-state,
  #publicPlacesTopLiked .directory-grid > .empty-state,
  #publicPlacesPinned .directory-grid > .empty-state,
  .context-block > .empty-state,
  .context-block .directory-grid > .empty-state.compact-empty,
  #plansAdvertising > .empty-state,
  #plans .plans-comparison-scroll {
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  /* Filters / search frames → no inner box, just spacing */
  .page-section > .filters-row,
  #places .places-filters-section .filters-row,
  #experiences .experiences-filters-section .filters-row,
  #advice .advice-filters-section .filters-row,
  #locations .filters-row,
  #locations .page-section > .location-browser-controls,
  #dashboard .page-section > .dashboard-search-card {
    padding: 0.25rem 0 0;
  }

  /* Nested groups / panels → divider rows */
  #globalSearchResults .search-result-group,
  #locations .browse-validation-panel,
  #publicPlacesSearchResults .manual-osm-place-fallback,
  #publicPlacesSearchResults .manual-place-create,
  #publicPlacesSearchResults .manual-place-website-preview,
  #publicPlacesSearchResults .traveler-osm-place-results,
  #publicPlacesSearchResults .osm-search-progress,
  #publicPlacesSearchResults .osm-search-progress.is-standalone,
  .places-osm-extras > .manual-osm-place-fallback,
  .places-osm-extras > .manual-place-create,
  .places-osm-extras > .manual-place-website-preview,
  .places-osm-extras > .traveler-osm-place-results,
  .places-osm-extras > .osm-search-progress,
  .context-block .hybrid-load-control,
  .places-search-results-block .hybrid-load-control,
  .context-block .live-info-panel,
  .live-info-block .live-info-panel,
  .live-info-stack .live-info-panel,
  .live-info-body .travel-safety-source-card,
  .context-block > .country-auto-refresh-status,
  .embassy-block > .compact-directory,
  .visa-embassy-block > .compact-directory,
  .page-stack > .places-adverts-strip,
  #places .places-adverts-strip,
  #continentPageContent .places-adverts-strip,
  #countryPageContent .places-adverts-strip,
  #cityPageContent .places-adverts-strip,
  #placeDetail .place-owner-panel,
  #placeDetail .place-claim-panel,
  #placeDetail .featured-request-panel,
  #placeDetail .licensing-interest-panel,
  #placeDetail .licensing-interest-check,
  #placeDetail .location-map-card,
  #postDetail .experience-detail-facts,
  #postDetail .experience-detail-note.is-featured,
  #postDetail .experience-chat-list,
  #plans .business-address-options > article,
  #plans .business-onboarding-steps > li,
  #plans .owner-place-discovery-form,
  #plans .plans-ea-banner,
  #plans .plans-current-license,
  #plans .plans-intro-offer-banner,
  #plans .plan-card-offer,
  #plans .plan-type-card,
  #plans .listing-preview-detail,
  #plans .listing-preview-private-note,
  #auth .auth-landing .auth-benefits-card,
  #auth .auth-flow-card .flow-step,
  #auth .account-license-panel,
  #auth .community-rank-preview,
  #auth .profile-prefs-stack > .profile-section-details,
  #auth .profile-security-stack > .profile-section-details,
  #auth .mfa-backup-panel,
  #auth .verification-banner,
  #myTrips .trip-empty-places,
  #myBusinessSites .business-theme-fields,
  #help .help-support-callout {
    border-top: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
    padding: 0.85rem 0 0.2rem;
    margin-top: 0.55rem;
  }

  .live-info-stack .live-info-panel:last-child {
    border-bottom: 0;
  }

  /* Climate / weather cells: drop heavy chrome; keep weather atmosphere wash */
  .climate-season-block .climate-month-card {
    border: 0;
    border-radius: 0.55rem;
    background: color-mix(in srgb, var(--surface-soft) 22%, transparent);
    box-shadow: none;
    padding: 0.55rem 0.45rem;
  }
  .city-weather-block .weather-current-card,
  .live-info-panel[data-live-section="weather"] .weather-current-card {
    border-radius: 0.85rem;
    box-shadow: 0 8px 20px color-mix(in srgb, var(--accent) 5%, transparent);
    padding: 0.85rem 0.9rem;
  }
  .city-weather-block .weather-day-card,
  .live-info-panel[data-live-section="weather"] .weather-day-card {
    border: 0;
    border-radius: 0.65rem;
    box-shadow: none;
    padding: 0.55rem 0.5rem;
    background: color-mix(in srgb, var(--surface) 70%, var(--surface-soft));
  }

  /* Leaf-like nested list rows → horizontal dividers (not frames-in-frames) */
  #globalSearchResults .search-result-item,
  .external-location-results .external-location-candidate,
  #globalSearchResults .owner-place-candidate,
  #publicPlacesSearchResults .traveler-osm-place-results .owner-place-candidate,
  #publicPlacesSearchResults .traveler-osm-place-results .owner-place-candidate.place-result-card,
  .places-osm-extras .traveler-osm-place-results .owner-place-candidate,
  .places-osm-extras .traveler-osm-place-results .owner-place-candidate.place-result-card,
  #plans .owner-place-candidate,
  #myTrips .trip-card .trip-item,
  #myTrips .trip-card .trip-flight-item,
  #placeDetail .place-review-card,
  #postDetail .experience-chat-message,
  #locations .mini-stat-card {
    border: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--border) 78%, transparent);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    padding: 0.75rem 0;
  }

  #globalSearchResults .search-result-item:last-child,
  .external-location-results .external-location-candidate:last-child,
  #globalSearchResults .owner-place-candidate:last-child,
  #publicPlacesSearchResults .traveler-osm-place-results .owner-place-candidate:last-child,
  .places-osm-extras .traveler-osm-place-results .owner-place-candidate:last-child,
  #plans .owner-place-candidate:last-child,
  #myTrips .trip-card .trip-item:last-child,
  #myTrips .trip-card .trip-flight-item:last-child,
  #placeDetail .place-review-card:last-child,
  #postDetail .experience-chat-message:last-child {
    border-bottom: 0;
  }

  #publicPlacesSearchResults .traveler-osm-place-results .owner-place-candidates,
  .places-osm-extras .traveler-osm-place-results .owner-place-candidates {
    gap: 0;
  }

  #publicPlacesSearchResults .manual-osm-place-fallback.is-searching,
  .places-osm-extras > .manual-osm-place-fallback.is-searching {
    animation: none;
    background: transparent;
  }

  /* Keep OSM sign-in/verify gate visible on mobile (do not flatten to a divider) */
  #publicPlacesSearchResults .manual-osm-place-fallback.is-gated,
  .places-osm-extras > .manual-osm-place-fallback.is-gated {
    border: 1.5px dashed color-mix(in srgb, var(--accent) 62%, var(--border));
    border-radius: 14px;
    background: color-mix(in srgb, var(--accent) 14%, var(--surface));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 12%, transparent);
    padding: 1rem 1.05rem;
    margin-top: 0.55rem;
  }

  /* Progress inside an OSM strip must not add a third box */
  #publicPlacesSearchResults .manual-osm-place-fallback .osm-search-progress,
  .places-osm-extras .manual-osm-place-fallback .osm-search-progress {
    border: 0;
    border-top: 0;
    margin-top: 0.45rem;
    padding: 0.35rem 0 0;
    background: transparent;
  }

  /* Empty prompts inside an L1 panel: no dashed inner box */
  #publicLocationsGrid > .empty-state,
  #publicAdviceGrid > .empty-state,
  #publicPostsGrid > .empty-state,
  #dashboardPins > .empty-state,
  #myTripsList > .empty-state,
  #myReviewsList > .empty-state,
  #myBusinessSitesList > .empty-state,
  #publicPlacesSearchResults .directory-grid > .empty-state,
  #publicPlacesTopLiked .directory-grid > .empty-state,
  #publicPlacesPinned .directory-grid > .empty-state,
  .context-block > .empty-state,
  .context-block .directory-grid > .empty-state.compact-empty,
  #plansAdvertising > .empty-state,
  #impressum .legal-card > .empty-state {
    padding: 0.7rem 0;
  }
}

/* ===== Groups (additive community layer) ===== */
#groups .groups-layout {
  display: grid;
  grid-template-columns: minmax(14rem, 17rem) minmax(0, 1fr) minmax(13rem, 16rem);
  gap: 1rem;
  align-items: start;
}
#groups .groups-col {
  display: grid;
  gap: 0.75rem;
  padding: 1rem;
  border: 1px solid var(--border);
  border-radius: 1.1rem;
  background: var(--surface);
}
#groups .groups-col .kicker,
#groups .groups-col .page-section-kicker {
  margin: 0;
  color: var(--accent);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
#groups .groups-col h3 {
  margin: 0;
  font-size: 1.05rem;
}
#groups .group-list {
  display: grid;
  gap: 0.35rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
#groups .group-list button[data-open-group] {
  width: 100%;
  display: grid;
  grid-template-columns: 2.4rem 1fr;
  gap: 0.55rem;
  align-items: center;
  padding: 0.45rem;
  border: 0;
  border-radius: 0.75rem;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
#groups .group-list button[data-open-group]:hover,
#groups .group-list button[data-open-group].is-active {
  background: color-mix(in srgb, var(--accent) 10%, transparent);
}
#groups .group-avatar {
  width: 2.4rem;
  height: 2.4rem;
  border-radius: 0.7rem;
  background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 55%, #888), color-mix(in srgb, var(--accent) 25%, #333));
}
#groups .group-list strong {
  display: block;
  font-size: 0.88rem;
}
#groups .group-list small {
  color: var(--muted);
  font-size: 0.74rem;
}
#groups .privacy-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.12rem 0.45rem;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 800;
  border: 1px solid var(--border);
  color: var(--muted);
}
#groups .privacy-pill.is-private {
  border-color: color-mix(in srgb, var(--accent) 40%, var(--border));
  color: var(--accent);
}
#groups .groups-detail-top {
  display: flex;
  flex-wrap: wrap;
  gap: 0.85rem;
  justify-content: space-between;
  align-items: flex-start;
}
#groups .groups-detail-banner {
  height: 8.5rem;
  margin: 0 0 0.85rem;
  border-radius: 1rem;
  overflow: hidden;
  background:
    radial-gradient(circle at 22% 30%, color-mix(in srgb, var(--accent) 32%, transparent), transparent 55%),
    linear-gradient(135deg, color-mix(in srgb, var(--surface-soft) 75%, #d5dde8), color-mix(in srgb, var(--accent) 30%, #8b9aaf));
}
#groups .groups-detail-banner.has-banner,
#groups .groups-suggest-cover.has-banner,
#groups .groups-create-preview-cover.has-banner {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
#groups .groups-detail-banner.has-banner {
  background-color: color-mix(in srgb, var(--surface-soft) 40%, #c8d0dc);
}
#groups .groups-suggest-cover.has-banner span,
#groups .groups-detail-banner.has-banner span {
  display: none;
}
#groups .groups-detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}
#groups .groups-composer {
  display: grid;
  gap: 0.55rem;
  padding-top: 0.85rem;
  border-top: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
#groups .groups-composer-card {
  display: grid;
  gap: 0.85rem;
  padding: 1rem 1.05rem 1.05rem;
  border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
  border-radius: 1.15rem;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--surface-soft) 42%, var(--surface)), var(--surface));
  box-shadow: 0 10px 28px color-mix(in srgb, #102033 8%, transparent);
}
#groups .groups-composer-author {
  display: flex;
  gap: 0.7rem;
  align-items: center;
}
#groups .groups-composer-avatar,
#groups .groups-avatar {
  flex: 0 0 auto;
  width: 2.55rem;
  height: 2.55rem;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  color: var(--accent-contrast);
  background: linear-gradient(145deg, color-mix(in srgb, var(--accent) 78%, #fff), color-mix(in srgb, var(--accent-strong) 70%, #333));
  overflow: hidden;
}
#groups .groups-composer-avatar.has-photo img,
#groups .groups-avatar.has-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#groups .groups-avatar-sm { width: 2.25rem; height: 2.25rem; font-size: 0.72rem; }
#groups .groups-avatar-xs { width: 1.7rem; height: 1.7rem; font-size: 0.62rem; }
#groups .groups-composer-author-line {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.4rem;
  align-items: baseline;
  font-size: 0.95rem;
}
#groups .groups-composer-feeling-line,
#groups .group-post-feeling {
  color: var(--muted);
  font-weight: 500;
}
#groups .groups-feeling-emoji {
  font-family: "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", sans-serif;
}
#groups .groups-composer-audience {
  display: inline-flex;
  margin-top: 0.2rem;
  padding: 0.14rem 0.55rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
  background: color-mix(in srgb, var(--surface-soft) 55%, transparent);
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 700;
}
#groups .groups-composer-editor {
  position: relative;
  display: block;
  margin: 0;
}
#groups .groups-composer-editor textarea {
  width: 100%;
  min-height: 7.5rem;
  resize: vertical;
  border: 0;
  border-radius: 0.95rem;
  padding: 0.85rem 2.6rem 0.85rem 0.95rem;
  background: color-mix(in srgb, var(--surface-soft) 48%, var(--surface));
  color: inherit;
  font: inherit;
  line-height: 1.45;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--border) 75%, transparent);
  transition: box-shadow 160ms ease, background 160ms ease;
}
#groups .groups-composer-editor textarea:focus {
  outline: none;
  background: var(--surface);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 45%, var(--border)), 0 0 0 3px color-mix(in srgb, var(--accent) 14%, transparent);
}
#groups .groups-composer-emoji-anchor {
  position: absolute;
  right: 0.55rem;
  bottom: 0.55rem;
}
#groups .groups-icon-btn {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--muted);
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  cursor: pointer;
  padding: 0;
  transition: background 150ms ease, color 150ms ease, transform 150ms ease;
}
#groups .groups-icon-btn svg {
  width: 1.15rem;
  height: 1.15rem;
}
#groups .groups-icon-btn:hover,
#groups .groups-icon-btn:focus-visible,
#groups .groups-icon-btn[aria-expanded="true"] {
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  color: var(--accent);
  outline: none;
}
#groups .groups-emoji-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
}
#groups .groups-emoji-picker {
  position: absolute;
  bottom: calc(100% + 0.35rem);
  right: 0;
  left: auto;
  z-index: 12;
  display: grid;
  grid-template-columns: repeat(8, minmax(1.7rem, 1fr));
  gap: 0.2rem;
  width: min(18rem, 78vw);
  padding: 0.45rem;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  border-radius: 0.85rem;
  background: var(--surface);
  box-shadow: 0 12px 30px color-mix(in srgb, #0b1520 16%, transparent);
  animation: groupsPopoverIn 160ms ease;
}
#groups .groups-emoji-picker.hidden,
#groups .groups-feeling-panel.hidden,
#groups .groups-menu.hidden {
  display: none;
}
#groups .groups-emoji-btn {
  appearance: none;
  border: 0;
  background: transparent;
  border-radius: 0.45rem;
  min-height: 1.85rem;
  font-size: 1.15rem;
  line-height: 1;
  cursor: pointer;
  font-family: "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", sans-serif;
}
#groups .groups-emoji-btn:hover,
#groups .groups-emoji-btn:focus-visible {
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  outline: none;
}
#groups .groups-feeling-panel {
  display: grid;
  gap: 0.65rem;
  padding: 0.75rem;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  border-radius: 1rem;
  background: var(--surface);
  box-shadow: 0 14px 34px color-mix(in srgb, #102033 12%, transparent);
  animation: groupsPopoverIn 170ms ease;
}
#groups .groups-feeling-panel-head {
  display: grid;
  grid-template-columns: 2rem 1fr 2rem;
  align-items: center;
  gap: 0.35rem;
}
#groups .groups-feeling-panel-head strong {
  text-align: center;
  font-size: 0.98rem;
}
#groups .groups-feeling-tabs {
  display: flex;
  gap: 0.15rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
#groups .groups-feeling-tab {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-weight: 700;
  font-size: 0.86rem;
  padding: 0.45rem 0.7rem;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
}
#groups .groups-feeling-tab.is-active {
  color: var(--accent);
  border-bottom-color: var(--accent);
}
#groups .groups-feeling-search input {
  width: 100%;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  background: color-mix(in srgb, var(--surface-soft) 55%, var(--surface));
  padding: 0.55rem 0.9rem;
  font: inherit;
}
#groups .groups-feeling-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.3rem;
  max-height: 14rem;
  overflow: auto;
}
#groups .groups-feeling-option {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  border-radius: 0.75rem;
  padding: 0.45rem 0.55rem;
  cursor: pointer;
  transition: background 140ms ease;
}
#groups .groups-feeling-option:hover,
#groups .groups-feeling-option.is-selected {
  background: color-mix(in srgb, var(--accent) 10%, transparent);
}
#groups .groups-feeling-option-emoji {
  font-size: 1.35rem;
  line-height: 1;
  font-family: "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", sans-serif;
}
#groups .groups-composer-add-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.55rem;
  padding: 0.55rem 0.7rem;
  border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
  border-radius: 0.95rem;
  background: color-mix(in srgb, var(--surface-soft) 28%, var(--surface));
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--muted);
}
#groups .groups-composer-add-icons {
  display: inline-flex;
  gap: 0.35rem;
  align-items: center;
}
#groups .groups-add-icon {
  appearance: none;
  width: 2.2rem;
  height: 2.2rem;
  border-radius: 999px;
  border: 1.5px solid transparent;
  background: color-mix(in srgb, var(--surface) 80%, transparent);
  display: inline-grid;
  place-items: center;
  cursor: pointer;
  transition: transform 150ms ease, background 150ms ease, box-shadow 150ms ease;
}
#groups .groups-add-icon svg {
  width: 1.15rem;
  height: 1.15rem;
}
#groups .groups-add-icon.is-photo {
  color: #2f9e6b;
  border-color: color-mix(in srgb, #2f9e6b 35%, transparent);
}
#groups .groups-add-icon.is-video {
  color: #3b82c4;
  border-color: color-mix(in srgb, #3b82c4 35%, transparent);
}
#groups .groups-add-icon.is-feeling {
  color: #c9892b;
  border-color: color-mix(in srgb, #c9892b 38%, transparent);
}
#groups .groups-add-icon.is-place {
  color: #c45454;
  border-color: color-mix(in srgb, #c45454 35%, transparent);
}
#groups .groups-add-icon:hover,
#groups .groups-add-icon.is-active {
  transform: translateY(-1px);
  box-shadow: 0 6px 14px color-mix(in srgb, #102033 10%, transparent);
  background: var(--surface);
}
#groups .groups-composer-footer {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  align-items: end;
}
#groups .groups-composer-footer label {
  flex: 0 1 8.5rem;
  min-width: 0;
}
#groups .groups-composer-footer select {
  width: 100%;
}
#groups .groups-composer-post-btn {
  margin-left: auto;
  min-width: 7rem;
}
#groups .group-comment-form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  align-items: center;
}
#groups .group-comment-input-wrap {
  flex: 1 1 12rem;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.2rem 0.35rem 0.2rem 0.85rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  background: color-mix(in srgb, var(--surface-soft) 45%, var(--surface));
}
#groups .group-comment-input-wrap input[name="body"] {
  flex: 1 1 auto;
  min-width: 0;
  border: 0;
  background: transparent;
  padding: 0.45rem 0;
  font: inherit;
  color: inherit;
}
#groups .group-comment-input-wrap input[name="body"]:focus {
  outline: none;
}
#groups .group-post-body,
#groups .group-comment p,
#groups #groupsComposerBody {
  font-family: inherit, "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", sans-serif;
}
#groups .groups-photo-preview img {
  max-width: min(100%, 16rem);
  border-radius: 0.75rem;
  display: block;
  margin-bottom: 0.4rem;
}
#groups .groups-video-preview video,
#groups .group-post-video {
  display: block;
  max-width: min(100%, 28rem);
  border-radius: 0.85rem;
  margin: 0.45rem 0;
  background: #0b1520;
}
#groups .groups-event-fields {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
}
#groups .groups-event-fields label {
  flex: 1 1 12rem;
}
#groups .groups-feed-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin: 0.35rem 0 0.55rem;
}
#groups .groups-feed-tabs .chip-btn.is-active {
  border-color: color-mix(in srgb, var(--accent) 55%, var(--border));
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 10%, transparent);
}
#groups .groups-event-meta {
  margin: 0 0 0.4rem;
  font-size: 0.88rem;
}
#groups .groups-feed {
  display: grid;
  gap: 0.85rem;
}
#groups .group-post {
  padding: 0.95rem 0;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 78%, transparent);
}
#groups .group-post:last-child {
  border-bottom: 0;
}
#groups .group-post-head {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 0.65rem;
  align-items: start;
  margin-bottom: 0.45rem;
}
#groups .group-post-meta {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}
#groups .group-post-author-line {
  display: flex;
  flex-wrap: wrap;
  gap: 0.2rem 0.35rem;
  align-items: baseline;
}
#groups .group-post-submeta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
}
#groups .group-post-overflow,
#groups .groups-share-wrap {
  position: relative;
}
#groups .group-post-body {
  margin: 0 0 0.45rem;
  white-space: pre-wrap;
}
#groups .group-post-photo {
  display: block;
  max-width: min(100%, 28rem);
  border-radius: 0.85rem;
  margin: 0.45rem 0;
}
#groups .group-post-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.2rem;
  margin-top: 0.35rem;
}
#groups .groups-action-btn {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 0.86rem;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.45rem 0.7rem;
  border-radius: 0.7rem;
  cursor: pointer;
  transition: background 140ms ease, color 140ms ease;
}
#groups .groups-action-btn svg {
  width: 1.1rem;
  height: 1.1rem;
}
#groups .groups-action-btn em {
  font-style: normal;
  font-weight: 800;
  color: inherit;
  opacity: 0.85;
}
#groups .groups-action-btn:hover,
#groups .groups-action-btn:focus-visible,
#groups .groups-action-btn.is-active,
#groups .groups-action-btn[aria-expanded="true"] {
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  color: var(--accent);
  outline: none;
}
#groups .groups-menu {
  position: absolute;
  top: calc(100% + 0.3rem);
  right: 0;
  z-index: 14;
  min-width: 12.5rem;
  display: grid;
  gap: 0.15rem;
  padding: 0.4rem;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  border-radius: 0.9rem;
  background: var(--surface);
  box-shadow: 0 14px 32px color-mix(in srgb, #102033 14%, transparent);
  animation: groupsPopoverIn 150ms ease;
}
#groups .groups-menu button {
  appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 650;
  display: flex;
  align-items: center;
  gap: 0.65rem;
  width: 100%;
  text-align: left;
  padding: 0.55rem 0.65rem;
  border-radius: 0.65rem;
  cursor: pointer;
}
#groups .groups-menu button svg {
  width: 1.05rem;
  height: 1.05rem;
  color: var(--muted);
  flex: 0 0 auto;
}
#groups .groups-menu button:hover,
#groups .groups-menu button:focus-visible {
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  outline: none;
}
@keyframes groupsPopoverIn {
  from { opacity: 0; transform: translateY(4px) scale(0.98); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
#groups .groups-pending-panel {
  margin: 0.65rem 0 0.35rem;
  padding: 0.75rem 0.85rem;
  border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--border));
  border-radius: 0.85rem;
  background: color-mix(in srgb, var(--accent) 6%, transparent);
  display: grid;
  gap: 0.55rem;
}
#groups .groups-pending-head {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
  align-items: baseline;
}
#groups .groups-pending-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.45rem;
}
#groups .groups-pending-list li {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.45rem;
  align-items: center;
}
#groups .groups-pending-actions {
  display: flex;
  gap: 0.35rem;
}
#groups .groups-pending-hint {
  margin: 0.35rem 0 0;
  color: var(--accent);
  font-size: 0.9rem;
}
#groups .groups-pending-badge {
  display: inline-block;
  min-width: 1.1rem;
  padding: 0.05rem 0.35rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent) 18%, transparent);
  color: var(--accent);
  font-weight: 800;
  font-size: 0.72rem;
  text-align: center;
}
#groups .groups-suggest-reason {
  display: block;
  font-style: normal;
  font-size: 0.72rem;
  font-weight: 750;
  color: var(--accent);
  margin: 0.15rem 0;
}
#groups .groups-forwarded-meta {
  margin: 0 0 0.35rem;
  font-size: 0.82rem;
  color: var(--muted);
}
#groups .group-post.is-shared-target {
  outline: 2px solid color-mix(in srgb, var(--accent) 55%, transparent);
  outline-offset: 4px;
  border-radius: 0.65rem;
}
#groups .groups-forward-dialog {
  border: 1px solid var(--border);
  border-radius: 1rem;
  padding: 1.1rem 1.2rem;
  max-width: min(28rem, calc(100vw - 2rem));
  background: var(--surface, #fff);
  color: inherit;
}
#groups .groups-forward-dialog::backdrop {
  background: color-mix(in srgb, #0b1520 45%, transparent);
}
#groups .groups-forward-dialog form {
  display: grid;
  gap: 0.75rem;
}
#groups .groups-forward-dialog h3 {
  margin: 0;
}
#groups .groups-forward-actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.45rem;
  flex-wrap: wrap;
}
#groups .chip-btn {
  border: 1px solid var(--border);
  background: transparent;
  color: inherit;
  border-radius: 999px;
  padding: 0.28rem 0.7rem;
  font: inherit;
  font-size: 0.82rem;
  font-weight: 700;
  cursor: pointer;
}
#groups .chip-btn:hover {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
  color: var(--accent);
}
#groups .group-comments {
  margin-top: 0.65rem;
  display: grid;
  gap: 0.55rem;
}
#groups .group-comment {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.5rem;
  align-items: start;
  padding: 0.25rem 0;
}
#groups .group-comment-bubble {
  padding: 0.45rem 0.7rem;
  border-radius: 0.85rem;
  background: color-mix(in srgb, var(--surface-soft) 55%, var(--surface));
}
#groups .group-comment p {
  margin: 0.15rem 0 0;
}
#groups .groups-suggest-head {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
  align-items: end;
}
#groups .groups-suggestions {
  display: block;
}
#groups .groups-suggest-scroller {
  display: grid;
  gap: 0.7rem;
}
#groups .groups-suggest-card {
  display: grid;
  gap: 0.55rem;
  padding: 0;
  border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
  border-radius: 1rem;
  background: var(--surface);
  overflow: hidden;
  box-shadow: 0 8px 20px color-mix(in srgb, #102033 7%, transparent);
  transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}
#groups .groups-suggest-card:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--accent) 35%, var(--border));
  box-shadow: 0 12px 26px color-mix(in srgb, #102033 10%, transparent);
}
#groups .groups-suggest-open {
  appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  padding: 0;
  cursor: pointer;
  display: grid;
}
#groups .groups-suggest-cover {
  height: 5.6rem;
  display: grid;
  place-items: center;
  color: var(--accent-contrast);
  font-weight: 800;
  font-size: 1.35rem;
  background:
    radial-gradient(circle at 20% 20%, color-mix(in srgb, var(--accent) 55%, transparent), transparent 55%),
    linear-gradient(135deg, color-mix(in srgb, var(--accent) 70%, #888), color-mix(in srgb, var(--accent-strong) 55%, #2a3344));
}
#groups .groups-suggest-cover[data-seed="a"],
#groups .groups-suggest-cover[data-seed="b"],
#groups .groups-suggest-cover[data-seed="c"] {
  background:
    radial-gradient(circle at 80% 30%, color-mix(in srgb, var(--accent) 40%, transparent), transparent 50%),
    linear-gradient(145deg, color-mix(in srgb, var(--accent-strong) 60%, #5a6a7a), color-mix(in srgb, var(--accent) 55%, #1f2a38));
}
#groups .groups-suggest-body {
  display: grid;
  gap: 0.15rem;
  padding: 0.15rem 0.8rem 0;
}
#groups .groups-suggest-meta,
#groups .groups-suggest-privacy {
  color: var(--muted);
  font-size: 0.78rem;
}
#groups .groups-suggest-join {
  margin: 0 0.75rem 0.75rem;
  width: calc(100% - 1.5rem);
}
#groups .groups-create-panel {
  margin-top: 0.85rem;
  padding-top: 0.85rem;
  border-top: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
#groups .groups-create-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(14rem, 0.95fr);
  gap: 1rem;
  align-items: start;
}
#groups .groups-create-form {
  display: grid;
  gap: 0.75rem;
  max-width: none;
  padding: 1rem;
  border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
  border-radius: 1.1rem;
  background: color-mix(in srgb, var(--surface-soft) 35%, var(--surface));
}
#groups .groups-create-form-head h3 {
  margin: 0.15rem 0 0.25rem;
}
#groups .groups-create-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
}
#groups .groups-create-banner-field {
  display: grid;
  gap: 0.35rem;
}
#groups .groups-create-banner-field > span:first-child {
  font-weight: 700;
  font-size: 0.92rem;
}
#groups .groups-create-banner-hint {
  margin: 0;
  font-size: 0.82rem;
}
#groups .groups-create-banner-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}
#groups .groups-create-banner-pick {
  margin: 0;
  cursor: pointer;
  width: auto;
}
#groups .groups-create-submit {
  width: 100%;
}
#groups .groups-create-preview-cover.has-banner {
  background-color: color-mix(in srgb, var(--surface-soft) 35%, #c4ceda);
}
#groups .groups-create-preview {
  display: grid;
  gap: 0.45rem;
}
#groups .groups-create-preview-label {
  margin: 0;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
}
#groups .groups-create-preview-card {
  border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
  border-radius: 1.1rem;
  overflow: hidden;
  background: var(--surface);
  box-shadow: 0 12px 28px color-mix(in srgb, #102033 9%, transparent);
}
#groups .groups-create-preview-cover {
  height: 7.5rem;
  background:
    radial-gradient(circle at 30% 40%, color-mix(in srgb, var(--accent) 28%, transparent), transparent 55%),
    linear-gradient(135deg, color-mix(in srgb, var(--surface-soft) 80%, #d7e0ec), color-mix(in srgb, var(--accent) 28%, #8ea0b5));
}
#groups .groups-create-preview-body {
  display: grid;
  gap: 0.4rem;
  padding: 0.9rem 1rem 1rem;
}
#groups .groups-create-preview-body h4 {
  margin: 0;
  font-size: 1.2rem;
}
#groups .groups-create-preview-body h4.is-placeholder,
#groups .groups-create-preview-body .note.is-placeholder {
  color: var(--muted);
  font-weight: 600;
}
#groups .groups-create-preview-composer {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin-top: 0.35rem;
  padding: 0.55rem 0.7rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface-soft) 55%, var(--surface));
  color: var(--muted);
  font-size: 0.88rem;
}
#groups #groupsShowMine.is-active {
  border-color: color-mix(in srgb, var(--accent) 50%, var(--border));
  color: var(--accent);
}
#groups .group-post-translation {
  margin: 0 0 0.45rem;
  color: var(--muted);
  font-size: 0.92rem;
}
.content-translation {
  margin: 0.35rem 0 0;
  color: var(--muted);
  font-size: 0.92rem;
}
.experience-detail-note [data-translate-content],
.place-review-card [data-translate-content] {
  margin-top: 0.4rem;
}

@media (max-width: 980px) {
  #groups .groups-layout {
    grid-template-columns: 1fr;
  }
  #groups .groups-col {
    min-width: 0;
    max-width: 100%;
  }
  #groups .groups-create-layout {
    grid-template-columns: 1fr;
  }
  #groups .groups-suggest-scroller {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(min(13.5rem, 100%), 72vw);
    gap: 0.75rem;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 0.25rem;
    scroll-snap-type: x mandatory;
  }
  #groups .groups-suggest-card {
    scroll-snap-align: start;
    min-width: 0;
  }
}

@media (max-width: 720px) {
  /* Keep Groups within the mobile two-box nesting budget */
  #groups .groups-col {
    border: 0;
    border-radius: 0;
    background: transparent;
    padding: 0.35rem 0;
  }
  #groups .groups-toolbar-section {
    border: 1px solid var(--border);
    border-radius: 1rem;
    padding: 0.85rem;
    background: var(--surface);
  }
  #groups .groups-col-feed {
    border: 1px solid var(--border);
    border-radius: 1rem;
    padding: 0.85rem;
    background: var(--surface);
  }
  #groups .groups-composer-card,
  #groups .groups-create-form,
  #groups .groups-create-preview-card {
    box-shadow: none;
  }
  #groups .groups-suggest-card,
  #groups .group-post {
    border-left: 0;
    border-right: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
  #groups .groups-suggest-card {
    border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
    border-radius: 1rem;
    background: var(--surface);
  }
  #groups .group-post {
    border-bottom: 1px solid color-mix(in srgb, var(--border) 78%, transparent);
    padding-left: 0;
    padding-right: 0;
  }
  #groups .group-post:last-child {
    border-bottom: 0;
  }
  #groups .groups-composer-footer {
    align-items: stretch;
  }
  #groups .groups-composer-post-btn {
    margin-left: 0;
    width: 100%;
  }
  #groups .groups-feeling-grid {
    grid-template-columns: 1fr;
  }
}

/* —— Plum Mist / Plum Mist Motion (dashboard layout) —— */
.plum-hero-badge,
.plum-hero-features-rotator,
.plum-hero-features,
.plum-search-ideas,
.plum-search-hint,
.plum-trip-guide-section,
.plum-dashboard-cta,
.dashboard-pin-flag-watermark {
  display: none;
}

html[data-theme="plum_mist"] body,
html[data-theme="plum_mist_motion"] body,
html[data-theme="plum_mist"] body button,
html[data-theme="plum_mist_motion"] body button,
html[data-theme="plum_mist"] body input,
html[data-theme="plum_mist_motion"] body input,
html[data-theme="plum_mist"] body select,
html[data-theme="plum_mist_motion"] body select,
html[data-theme="plum_mist"] body textarea,
html[data-theme="plum_mist_motion"] body textarea {
  font-family: "Plus Jakarta Sans", "Segoe UI", sans-serif;
}

html[data-theme="plum_mist"] body,
html[data-theme="plum_mist_motion"] body {
  /* Main misty plum core (kept): quiet atmosphere under lavender wash */
  background-color: var(--bg);
  background-image:
    radial-gradient(circle at top left, color-mix(in srgb, var(--lavender) 48%, transparent), transparent 26rem),
    radial-gradient(circle at 88% 18%, color-mix(in srgb, var(--accent) 8%, transparent), transparent 22rem),
    linear-gradient(180deg, color-mix(in srgb, var(--bg) 88%, transparent), color-mix(in srgb, var(--bg) 96%, transparent)),
    var(--mist-photo);
  background-position: center top, center top, center, center top;
  background-size: auto, auto, auto, cover;
  background-repeat: no-repeat;
  -webkit-font-smoothing: antialiased;
}

html[data-theme="plum_mist"] .eyebrow,
html[data-theme="plum_mist_motion"] .eyebrow {
  color: var(--accent);
  letter-spacing: .12em;
}

html[data-theme="plum_mist"] .button:not(.secondary):not(.danger),
html[data-theme="plum_mist_motion"] .button:not(.secondary):not(.danger) {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--accent-contrast);
}
html[data-theme="plum_mist"] .button:not(.secondary):not(.danger):hover,
html[data-theme="plum_mist_motion"] .button:not(.secondary):not(.danger):hover {
  background: var(--accent-strong);
  border-color: var(--accent-strong);
}
html[data-theme="plum_mist"] .button.secondary,
html[data-theme="plum_mist_motion"] .button.secondary {
  background: var(--surface);
  color: var(--accent);
  border-color: color-mix(in srgb, var(--accent) 35%, var(--border));
}

html[data-theme="plum_mist"] #dashboardHero.plum-mist-hero,
html[data-theme="plum_mist_motion"] #dashboardHero.plum-mist-hero,
html[data-theme="plum_mist"] #dashboardHero.plum-mist-hero.hero-media-video-active.hero-video-size-normal,
html[data-theme="plum_mist_motion"] #dashboardHero.plum-mist-hero.hero-media-video-active.hero-video-size-normal,
html[data-theme="plum_mist"] #dashboardHero.plum-mist-hero.hero-height-large,
html[data-theme="plum_mist_motion"] #dashboardHero.plum-mist-hero.hero-height-large {
  min-height: clamp(28rem, 54vw, 36rem);
  height: auto;
  border-radius: 1.35rem;
  border: 0;
  isolation: isolate;
  /* Mist wash under hero media (replaces darker solid purple shell) */
  background:
    linear-gradient(105deg, rgba(255, 250, 255, 0.35) 0%, transparent 55%),
    var(--mist-wash);
  margin-bottom: 0;
  z-index: 0;
  /* Let the overlapping start card receive clicks/typing in the overlap zone */
  pointer-events: none;
}
html[data-theme="plum_mist"] #dashboardHero.plum-mist-hero .dashboard-hero-media,
html[data-theme="plum_mist_motion"] #dashboardHero.plum-mist-hero .dashboard-hero-media {
  background-position: center right !important;
  transform: none;
  /* Calmer photo: brand/text stay primary */
  filter: saturate(0.68) contrast(0.9) brightness(1.08);
  opacity: 0.88;
}
html[data-theme="plum_mist"] #dashboardHero.plum-mist-hero .dashboard-hero-video,
html[data-theme="plum_mist_motion"] #dashboardHero.plum-mist-hero .dashboard-hero-video {
  opacity: 0.85;
  object-position: center right;
  transform: none;
  filter: saturate(0.72) contrast(0.92) brightness(1.05);
}
html[data-theme="plum_mist"] #dashboardHero.plum-mist-hero::after,
html[data-theme="plum_mist_motion"] #dashboardHero.plum-mist-hero::after {
  display: block;
  z-index: 1;
  background: linear-gradient(105deg, rgba(255, 250, 255, 0.97) 0%, rgba(255, 250, 255, 0.9) 38%, rgba(255, 250, 255, 0.48) 62%, rgba(255, 250, 255, 0.14) 82%, transparent 94%);
}
html[data-theme="plum_mist"] #dashboardHero.plum-mist-hero .dashboard-hero-content,
html[data-theme="plum_mist_motion"] #dashboardHero.plum-mist-hero .dashboard-hero-content {
  z-index: 2;
  max-width: 34rem;
  justify-content: flex-start;
  min-height: 0;
  height: auto;
  padding: clamp(1.5rem, 4vw, 2.4rem);
  /* Keep all three feature rows above the overlapping start card */
  padding-bottom: clamp(4.25rem, 9vw, 5.75rem);
}
html[data-theme="plum_mist"] #dashboardHero.plum-mist-hero .dashboard-hero-content h3,
html[data-theme="plum_mist_motion"] #dashboardHero.plum-mist-hero .dashboard-hero-content h3 {
  /* Fixed (not theme-variable) color: this card always sits on its own light
     photo scrim below, in both light and dark mode, so its text must not
     switch to the page's dark-mode (light-on-dark) palette or it disappears. */
  color: #441f5c;
  text-shadow: none;
  font-size: clamp(2rem, 4.6vw, 3.15rem);
  letter-spacing: -0.03em;
  line-height: 1.05;
  margin-bottom: .55rem;
}
html[data-theme="plum_mist"] #dashboardHero.plum-mist-hero .dashboard-hero-content p:not(.eyebrow),
html[data-theme="plum_mist_motion"] #dashboardHero.plum-mist-hero .dashboard-hero-content p:not(.eyebrow) {
  color: #6d6478;
  text-shadow: none;
  font-size: 1.02rem;
  max-width: 28ch;
  line-height: 1.45;
  margin-bottom: 1.35rem;
}
html[data-theme="plum_mist"] #dashboardHero.plum-mist-hero .eyebrow,
html[data-theme="plum_mist_motion"] #dashboardHero.plum-mist-hero .eyebrow {
  color: #5c2d7a;
  text-shadow: none;
}
html[data-theme="plum_mist"] #dashboardHero.plum-mist-hero .hero-video-size-controls,
html[data-theme="plum_mist_motion"] #dashboardHero.plum-mist-hero .hero-video-size-controls {
  display: none !important;
  pointer-events: none !important;
}

html[data-theme="plum_mist"] .plum-hero-badge,
html[data-theme="plum_mist_motion"] .plum-hero-badge {
  display: grid;
  place-items: center;
  position: absolute;
  top: 1.15rem;
  right: 1.15rem;
  z-index: 3;
  width: 2.85rem;
  height: 2.85rem;
  border-radius: 999px;
  background: var(--accent);
  color: #fff;
  box-shadow: 0 10px 24px rgba(68, 31, 92, 0.28);
  font-size: 1.15rem;
  text-decoration: none;
  pointer-events: auto;
}
html[data-theme="plum_mist"] .plum-hero-badge:hover,
html[data-theme="plum_mist_motion"] .plum-hero-badge:hover {
  background: var(--accent-strong);
}

html[data-theme="plum_mist"] .plum-hero-features-rotator,
html[data-theme="plum_mist_motion"] .plum-hero-features-rotator {
  display: grid;
}
html[data-theme="plum_mist"] .plum-hero-features,
html[data-theme="plum_mist_motion"] .plum-hero-features {
  display: grid;
  grid-area: 1 / 1;
  gap: 1.1rem;
  list-style: none;
  margin: 0;
  padding: 0;
  opacity: 1;
  transition: opacity .5s ease;
}
html[data-theme="plum_mist"] .plum-hero-features.is-hidden,
html[data-theme="plum_mist_motion"] .plum-hero-features.is-hidden {
  opacity: 0;
  pointer-events: none;
}
html[data-theme="plum_mist"] .plum-hero-features li,
html[data-theme="plum_mist_motion"] .plum-hero-features li {
  display: block;
}
@media (prefers-reduced-motion: reduce) {
  html[data-theme="plum_mist"] .plum-hero-features,
  html[data-theme="plum_mist_motion"] .plum-hero-features {
    transition: none;
  }
}
html[data-theme="plum_mist"] .plum-feature-link,
html[data-theme="plum_mist_motion"] .plum-feature-link {
  display: grid;
  grid-template-columns: 2.7rem 1fr;
  gap: .85rem;
  align-items: start;
  text-decoration: none;
  color: inherit;
  pointer-events: auto;
  border-radius: .85rem;
  padding: .25rem .4rem .25rem .15rem;
  margin: -.25rem -.4rem -.25rem -.15rem;
  transition: background-color .18s ease, transform .18s ease;
}
html[data-theme="plum_mist"] .plum-feature-link:hover,
html[data-theme="plum_mist_motion"] .plum-feature-link:hover {
  background: color-mix(in srgb, var(--accent) 8%, white);
  transform: translateX(2px);
}
html[data-theme="plum_mist"] .plum-feature-link:hover strong,
html[data-theme="plum_mist_motion"] .plum-feature-link:hover strong {
  color: var(--accent-strong);
}
html[data-theme="plum_mist"] .plum-feature-icon,
html[data-theme="plum_mist_motion"] .plum-feature-icon {
  width: 2.7rem;
  height: 2.7rem;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: color-mix(in srgb, var(--accent) 12%, white);
  color: var(--accent);
  font-size: 1.15rem;
}
html[data-theme="plum_mist"] .plum-hero-features strong,
html[data-theme="plum_mist_motion"] .plum-hero-features strong {
  display: block;
  font-size: 1.08rem;
  margin-bottom: .15rem;
  /* Fixed color, same reasoning as .dashboard-hero-content h3 above: this
     list always sits on the hero's light photo scrim, in both color modes. */
  color: #3b1f4a;
}
html[data-theme="plum_mist"] .plum-hero-features p,
html[data-theme="plum_mist_motion"] .plum-hero-features p {
  margin: 0 !important;
  color: #6d6478 !important;
  font-size: .94rem !important;
  line-height: 1.45;
  max-width: none !important;
  text-shadow: none !important;
}

/* Shared mist surfaces (search, adverts, business+CTA band) */
.plum-mist-photo,
.plum-mist-surface,
.plum-mist-band,
.plum-business-strip,
.plum-groups-button {
  display: none;
}

/* Secondary mist bands: CSS mist wash only (no hero JPEG layers). */
html[data-theme="plum_mist"] .plum-mist-surface,
html[data-theme="plum_mist_motion"] .plum-mist-surface,
html[data-theme="plum_mist"] .plum-mist-band,
html[data-theme="plum_mist_motion"] .plum-mist-band {
  display: block;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-radius: 1.45rem;
  border: 1px solid color-mix(in srgb, var(--accent) 14%, var(--border));
  background:
    radial-gradient(circle at 12% 20%, color-mix(in srgb, var(--lavender) 70%, transparent), transparent 42%),
    linear-gradient(105deg, color-mix(in srgb, var(--mist-wash) 92%, var(--surface)), color-mix(in srgb, var(--lavender) 55%, var(--mist-wash)));
  box-shadow: 0 10px 24px rgba(68, 31, 92, 0.06);
}
html[data-theme="plum_mist"] .plum-mist-band,
html[data-theme="plum_mist_motion"] .plum-mist-band {
  display: grid;
  gap: 1rem;
  padding: 1.15rem;
  margin: 0;
}
html[data-theme="plum_mist"] .plum-mist-surface::after,
html[data-theme="plum_mist_motion"] .plum-mist-surface::after,
html[data-theme="plum_mist"] .plum-mist-band::after,
html[data-theme="plum_mist_motion"] .plum-mist-band::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(105deg, rgba(239, 232, 246, 0.55) 0%, rgba(239, 232, 246, 0.28) 45%, rgba(247, 242, 251, 0.18) 100%);
}
html[data-theme="plum_mist"] .plum-mist-surface > *:not(.plum-mist-photo),
html[data-theme="plum_mist_motion"] .plum-mist-surface > *:not(.plum-mist-photo),
html[data-theme="plum_mist"] .plum-mist-band > *:not(.plum-mist-photo),
html[data-theme="plum_mist_motion"] .plum-mist-band > *:not(.plum-mist-photo) {
  position: relative;
  z-index: 1;
}

html[data-theme="plum_mist"] #dashboard,
html[data-theme="plum_mist_motion"] #dashboard {
  position: relative;
  z-index: 5;
  margin-top: -3.25rem;
  border-radius: 1.25rem;
  border: 1px solid var(--border);
  box-shadow: var(--shadow);
  background: var(--surface);
  padding: 1.35rem 1.4rem 1.2rem;
  pointer-events: auto;
}
html[data-theme="plum_mist"] #dashboard .dashboard-search-card,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-search-card,
html[data-theme="plum_mist"] #dashboard #globalLocationSearch,
html[data-theme="plum_mist_motion"] #dashboard #globalLocationSearch {
  position: relative;
  z-index: 6;
  pointer-events: auto;
}
html[data-theme="plum_mist"] #dashboard .dashboard-intro,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-intro,
html[data-theme="plum_mist"] #dashboard .dashboard-pins-section .note,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-pins-section .note,
html[data-theme="plum_mist"] #dashboard .dashboard-quick-section,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-quick-section,
html[data-theme="plum_mist"] #dashboard .dashboard-pin-toolbar .small-button,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-pin-toolbar .small-button {
  display: none;
}
html[data-theme="plum_mist"] #dashboard .panel-header,
html[data-theme="plum_mist_motion"] #dashboard .panel-header {
  align-items: flex-start;
  margin-bottom: 1.1rem;
}
html[data-theme="plum_mist"] #dashboard .panel-header h2,
html[data-theme="plum_mist_motion"] #dashboard .panel-header h2 {
  font-size: clamp(1.35rem, 2.5vw, 1.75rem);
  letter-spacing: -0.02em;
}
html[data-theme="plum_mist"] #dashboard .dashboard-primary-actions .button.secondary,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-primary-actions .button.secondary {
  background: transparent;
  border: 0;
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: .18em;
  padding-inline: .35rem;
  box-shadow: none;
}
html[data-theme="plum_mist"] #dashboard .dashboard-search-section .page-section-kicker,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-search-section .page-section-kicker,
html[data-theme="plum_mist"] #dashboard .dashboard-pins-section .page-section-kicker,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-pins-section .page-section-kicker {
  display: none;
}
html[data-theme="plum_mist"] #dashboard .dashboard-search-section,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-search-section {
  padding: 1.55rem 1.55rem 1.45rem;
  overflow: visible;
}
html[data-theme="plum_mist"] #dashboard #dashboardPageAdverts,
html[data-theme="plum_mist_motion"] #dashboard #dashboardPageAdverts {
  display: block;
  padding: 1.1rem 1.2rem 1.2rem;
  margin: 0;
  border-style: solid;
  border-color: color-mix(in srgb, var(--accent) 14%, var(--border));
  background: transparent;
}
html[data-theme="plum_mist"] #dashboard #dashboardPageAdverts .places-adverts-heading,
html[data-theme="plum_mist_motion"] #dashboard #dashboardPageAdverts .places-adverts-heading {
  position: relative;
  z-index: 1;
}
/* ADVERTS pill — same structure as base .badge.advert-badge; champagne/brass hue only */
html[data-theme="plum_mist"] .badge.advert-badge,
html[data-theme="plum_mist_motion"] .badge.advert-badge {
  border-color: color-mix(in srgb, var(--advert-badge-line) 72%, var(--border));
  background: color-mix(in srgb, var(--advert-badge-wash) 32%, transparent);
  color: var(--advert-badge-ink);
}
html[data-theme="plum_mist"] #dashboard #dashboardPageAdverts .places-adverts-row > *,
html[data-theme="plum_mist_motion"] #dashboard #dashboardPageAdverts .places-adverts-row > * {
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(3px);
  border-color: color-mix(in srgb, var(--accent) 14%, var(--border));
}
html[data-theme="plum_mist"] #dashboard .dashboard-search-card,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-search-card {
  border: 0;
  background: transparent;
  box-shadow: none;
  padding: 0;
}
html[data-theme="plum_mist"] #dashboard .dashboard-search-card label > span:not(.search-input-clear-wrap),
html[data-theme="plum_mist_motion"] #dashboard .dashboard-search-card label > span:not(.search-input-clear-wrap) {
  display: none;
}
html[data-theme="plum_mist"] #dashboard .dashboard-search-section h3,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-search-section h3 {
  margin: 0 0 .25rem;
  font-size: 1.15rem;
  letter-spacing: -0.01em;
}
html[data-theme="plum_mist"] #dashboard .plum-search-hint,
html[data-theme="plum_mist_motion"] #dashboard .plum-search-hint {
  display: block;
  margin: 0 0 .85rem;
  color: var(--muted);
  font-size: .9rem;
}
html[data-theme="plum_mist"] #dashboard .dashboard-search-card > label,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-search-card > label {
  display: block;
  border: 1px solid color-mix(in srgb, var(--accent) 18%, var(--border));
  border-radius: .95rem;
  background: rgba(255, 255, 255, 0.82);
  backdrop-filter: blur(4px);
  min-height: 3rem;
  padding: 0 .95rem;
  box-shadow: 0 8px 20px rgba(68, 31, 92, 0.06);
  transition: border-color 140ms ease, box-shadow 140ms ease;
}
/* Soft plum focus ring on the pill (replaces harsh browser-default black outline). */
html[data-theme="plum_mist"] #dashboard .dashboard-search-card > label:focus-within,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-search-card > label:focus-within {
  border-color: color-mix(in srgb, var(--accent) 55%, var(--border));
  box-shadow:
    0 0 0 3px color-mix(in srgb, var(--accent) 28%, transparent),
    0 8px 20px rgba(68, 31, 92, 0.08);
}
html[data-theme="plum_mist"] #dashboard .dashboard-search-card input,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-search-card input {
  border: 0;
  background: transparent;
  min-height: 3rem;
  width: 100%;
  box-shadow: none;
  color: var(--text);
  outline: none;
}
html[data-theme="plum_mist"] #dashboard .dashboard-search-card input:focus,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-search-card input:focus,
html[data-theme="plum_mist"] #dashboard .dashboard-search-card input:focus-visible,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-search-card input:focus-visible {
  outline: none;
  box-shadow: none;
}
html[data-theme="plum_mist"] #dashboard .dashboard-search-card input::placeholder,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-search-card input::placeholder {
  color: var(--muted);
  opacity: 1;
}
html[data-theme="plum_mist"] #dashboard .compact-actions,
html[data-theme="plum_mist_motion"] #dashboard .compact-actions {
  margin-top: .7rem;
}
html[data-theme="plum_mist"] .plum-search-ideas,
html[data-theme="plum_mist_motion"] .plum-search-ideas {
  display: flex;
  gap: .65rem;
  align-items: flex-start;
  margin-top: .95rem;
  padding: .75rem .9rem;
  border-radius: .85rem;
  /* Fixed (not theme-variable) colors: the text color here is fixed dark
     brown, so the background must stay fixed pale-yellow in dark mode too,
     or the two go dark-on-dark together. */
  background: color-mix(in srgb, #fff6df 88%, white);
  border: 1px dashed #e8d7a8;
  color: #5a4a2a;
  font-size: .86rem;
  line-height: 1.4;
  position: relative;
  z-index: 1;
}
html[data-theme="plum_mist"] .plum-ideas-bulb,
html[data-theme="plum_mist_motion"] .plum-ideas-bulb {
  flex: 0 0 auto;
  width: 1.55rem;
  height: 1.55rem;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: #ffe9a8;
  color: #8a6a18;
  font-size: .9rem;
}
html[data-theme="plum_mist"] .plum-search-ideas p,
html[data-theme="plum_mist_motion"] .plum-search-ideas p {
  margin: 0;
}

html[data-theme="plum_mist"] #dashboard .page-stack,
html[data-theme="plum_mist_motion"] #dashboard .page-stack {
  display: grid;
  gap: 1.35rem;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
}
html[data-theme="plum_mist"] #dashboard .dashboard-search-section,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-search-section,
html[data-theme="plum_mist"] #dashboard #dashboardPageAdverts,
html[data-theme="plum_mist_motion"] #dashboard #dashboardPageAdverts,
html[data-theme="plum_mist"] #dashboard .plum-mist-band,
html[data-theme="plum_mist_motion"] #dashboard .plum-mist-band {
  grid-column: 1 / -1;
}
html[data-theme="plum_mist"] #dashboard .dashboard-pins-section,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-pins-section {
  grid-column: 1;
  display: block;
}
html[data-theme="plum_mist"] #dashboard .plum-trip-guide-section,
html[data-theme="plum_mist_motion"] #dashboard .plum-trip-guide-section {
  display: flex;
  flex-direction: column;
  grid-column: 2;
  grid-row: 3;
  align-self: stretch;
  min-height: 100%;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 1.35rem;
  padding: 1.55rem 1.45rem 1.45rem;
  margin: 0;
}
html[data-theme="plum_mist"] #dashboard .dashboard-pins-section,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-pins-section {
  grid-row: 3;
}
html[data-theme="plum_mist"] #dashboard .dashboard-pins-section h3,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-pins-section h3 {
  margin: 0 0 1rem;
  font-size: 1.15rem;
  letter-spacing: -0.01em;
}
html[data-theme="plum_mist"] #dashboard .plum-trip-guide-section h3,
html[data-theme="plum_mist_motion"] #dashboard .plum-trip-guide-section h3 {
  margin: 0 0 1.25rem;
  font-size: clamp(1.3rem, 2.1vw, 1.55rem);
  line-height: 1.2;
  letter-spacing: -0.02em;
}
html[data-theme="plum_mist"] #dashboard .dashboard-pin-group,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-pin-group {
  margin: 0 0 1rem;
}
html[data-theme="plum_mist"] #dashboard .dashboard-pin-grid,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-pin-grid {
  grid-template-columns: 1fr;
  gap: .65rem;
}
html[data-theme="plum_mist"] #dashboard .dashboard-pin-card,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-pin-card {
  position: relative;
  display: grid;
  grid-template-columns: 2.2rem minmax(0, 1fr) auto;
  gap: .75rem;
  align-items: center;
  padding: .7rem .8rem;
  border-radius: .9rem;
  background: var(--surface);
  overflow: hidden;
  isolation: isolate;
  min-height: 0;
  box-shadow: none;
}
html[data-theme="plum_mist"] #dashboard .plum-sample-pins,
html[data-theme="plum_mist_motion"] #dashboard .plum-sample-pins {
  display: grid;
  gap: .75rem;
  margin-top: 1rem;
}
html[data-theme="plum_mist"] #dashboard .plum-sample-pins-label,
html[data-theme="plum_mist_motion"] #dashboard .plum-sample-pins-label,
html[data-theme="plum_mist"] #dashboard .plum-sample-pins-loading,
html[data-theme="plum_mist_motion"] #dashboard .plum-sample-pins-loading {
  margin: 0;
  text-align: left;
  font-size: .86rem;
}
html[data-theme="plum_mist"] #dashboard .plum-sample-pin-grid,
html[data-theme="plum_mist_motion"] #dashboard .plum-sample-pin-grid {
  grid-template-columns: 1fr;
  gap: .65rem;
}
html[data-theme="plum_mist"] #dashboard .dashboard-pin-card-sample,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-pin-card-sample {
  grid-template-columns: 2.2rem minmax(0, 1fr);
  cursor: pointer;
}
html[data-theme="plum_mist"] #dashboard .dashboard-pin-card-sample:hover,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-pin-card-sample:hover {
  border-color: color-mix(in srgb, var(--accent) 35%, var(--border));
  background: color-mix(in srgb, var(--accent) 5%, var(--surface));
}
html[data-theme="plum_mist"] #dashboard .dashboard-pin-card::before,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-pin-card::before {
  display: none;
}
html[data-theme="plum_mist"] #dashboard .dashboard-pin-card > *:not(.dashboard-pin-flag-watermark),
html[data-theme="plum_mist_motion"] #dashboard .dashboard-pin-card > *:not(.dashboard-pin-flag-watermark) {
  position: relative;
  z-index: 1;
}
html[data-theme="plum_mist"] #dashboard .dashboard-pin-flag-watermark,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-pin-flag-watermark {
  display: block;
  position: absolute;
  right: -.15rem;
  top: 50%;
  transform: translateY(-50%);
  width: min(46%, 9.5rem);
  height: 140%;
  object-fit: cover;
  object-position: center;
  opacity: 0.16;
  pointer-events: none;
  user-select: none;
  filter: saturate(1.05) contrast(1.05);
  mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.55) 38%, rgba(0,0,0,.9) 100%);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.55) 38%, rgba(0,0,0,.9) 100%);
  z-index: 0;
}
html[data-theme="plum_mist"] #dashboard .dashboard-pin-title,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-pin-title {
  display: contents;
}
html[data-theme="plum_mist"] #dashboard .dashboard-pin-title .country-flag,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-pin-title .country-flag {
  width: 2.2rem;
  height: 2.2rem;
  border-radius: 999px;
  object-fit: cover;
  object-position: center;
  background: color-mix(in srgb, var(--lavender) 80%, white);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--border) 70%, transparent);
  grid-column: 1;
  grid-row: 1 / span 2;
}
html[data-theme="plum_mist"] #dashboard .dashboard-pin-title span,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-pin-title span {
  grid-column: 2;
  font-size: .92rem;
  margin: 0;
}
html[data-theme="plum_mist"] #dashboard .dashboard-pin-card .pin-subtitle,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-pin-card .pin-subtitle,
html[data-theme="plum_mist"] #dashboard .dashboard-pin-card .pin-summary,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-pin-card .pin-summary {
  grid-column: 2;
  margin: 0;
  font-size: .78rem;
}
html[data-theme="plum_mist"] #dashboard .dashboard-pin-card-actions,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-pin-card-actions {
  grid-column: 3;
  grid-row: 1 / span 2;
  margin: 0;
}
html[data-theme="plum_mist"] #dashboard .dashboard-pin-card-actions .unpin-icon-button,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-pin-card-actions .unpin-icon-button {
  width: 1.85rem;
  height: 1.85rem;
  min-height: 1.85rem;
  border-radius: 999px;
  padding: 0;
  background: color-mix(in srgb, var(--accent) 14%, var(--surface));
  color: var(--accent);
  border: 0;
}
html[data-theme="plum_mist"] #dashboard .dashboard-pin-card-actions .pin-icon,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-pin-card-actions .pin-icon {
  font-size: 0;
}
html[data-theme="plum_mist"] #dashboard .dashboard-pin-card-actions .unpin-icon-button::before,
html[data-theme="plum_mist_motion"] #dashboard .dashboard-pin-card-actions .unpin-icon-button::before {
  content: "−";
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1;
}

html[data-theme="plum_mist"] .plum-guide-list,
html[data-theme="plum_mist_motion"] .plum-guide-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 1.15rem;
  flex: 1 1 auto;
  align-content: start;
}
html[data-theme="plum_mist"] .plum-guide-list li,
html[data-theme="plum_mist_motion"] .plum-guide-list li {
  display: grid;
  grid-template-columns: 2.65rem 1fr;
  gap: .85rem;
  align-items: start;
}
html[data-theme="plum_mist"] .plum-guide-icon,
html[data-theme="plum_mist_motion"] .plum-guide-icon {
  width: 2.65rem;
  height: 2.65rem;
  border-radius: .8rem;
  display: grid;
  place-items: center;
  background: var(--lavender);
  color: var(--accent);
  font-size: 1.05rem;
}
html[data-theme="plum_mist"] .plum-guide-list strong,
html[data-theme="plum_mist_motion"] .plum-guide-list strong {
  display: block;
  font-size: 1rem;
  margin-bottom: .18rem;
}
html[data-theme="plum_mist"] .plum-guide-list p,
html[data-theme="plum_mist_motion"] .plum-guide-list p {
  margin: 0;
  color: var(--muted);
  font-size: .9rem;
  line-height: 1.45;
}
html[data-theme="plum_mist"] .plum-guide-foot,
html[data-theme="plum_mist_motion"] .plum-guide-foot {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .65rem;
  margin-top: auto;
  padding-top: 1.35rem;
}
html[data-theme="plum_mist"] .plum-guide-button,
html[data-theme="plum_mist_motion"] .plum-guide-button,
html[data-theme="plum_mist"] .plum-guide-button:not(.secondary):not(.danger),
html[data-theme="plum_mist_motion"] .plum-guide-button:not(.secondary):not(.danger) {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--accent-contrast);
  min-height: 2.75rem;
  padding-inline: 1.35rem;
  font-weight: 750;
}
html[data-theme="plum_mist"] .plum-guide-button:hover,
html[data-theme="plum_mist_motion"] .plum-guide-button:hover,
html[data-theme="plum_mist"] .plum-guide-button:not(.secondary):not(.danger):hover,
html[data-theme="plum_mist_motion"] .plum-guide-button:not(.secondary):not(.danger):hover {
  background: var(--accent-strong);
  border-color: var(--accent-strong);
}
html[data-theme="plum_mist"] .plum-groups-button,
html[data-theme="plum_mist_motion"] .plum-groups-button {
  display: inline-flex;
  min-height: 2.75rem;
  padding-inline: 1.35rem;
  font-weight: 750;
  color: var(--accent);
  border-color: color-mix(in srgb, var(--accent) 40%, var(--border));
  background: transparent;
}
html[data-theme="plum_mist"] .plum-groups-button:hover,
html[data-theme="plum_mist_motion"] .plum-groups-button:hover {
  background: color-mix(in srgb, var(--accent) 8%, white);
  border-color: var(--accent);
}

html[data-theme="plum_mist"] .plum-business-strip,
html[data-theme="plum_mist_motion"] .plum-business-strip {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 1rem 1.25rem;
  align-items: center;
  margin: 0;
  padding: 1.25rem 1.45rem;
  border-radius: 1.2rem;
  border: 1px solid color-mix(in srgb, var(--accent) 16%, rgba(255,255,255,.55));
  background: rgba(255, 255, 255, 0.34);
  backdrop-filter: blur(3px);
  box-shadow: 0 10px 24px rgba(68, 31, 92, 0.06);
}
html[data-theme="plum_mist"] .plum-business-mark,
html[data-theme="plum_mist_motion"] .plum-business-mark {
  width: 3.6rem;
  height: 3.6rem;
  border-radius: 1rem;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--accent) 16%, var(--border));
  background: color-mix(in srgb, var(--accent) 10%, white);
  flex: 0 0 auto;
}
html[data-theme="plum_mist"] .plum-business-mark img,
html[data-theme="plum_mist_motion"] .plum-business-mark img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
html[data-theme="plum_mist"] .plum-business-copy h3,
html[data-theme="plum_mist_motion"] .plum-business-copy h3 {
  margin: 0 0 .25rem;
  font-size: 1.15rem;
  letter-spacing: -0.015em;
}
html[data-theme="plum_mist"] .plum-business-copy p,
html[data-theme="plum_mist_motion"] .plum-business-copy p {
  margin: 0;
  color: var(--muted);
  font-size: .9rem;
  max-width: 46ch;
}
html[data-theme="plum_mist"] .plum-business-action,
html[data-theme="plum_mist_motion"] .plum-business-action,
html[data-theme="plum_mist"] .plum-business-action:not(.secondary):not(.danger),
html[data-theme="plum_mist_motion"] .plum-business-action:not(.secondary):not(.danger) {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--accent-contrast);
  min-height: 2.75rem;
  padding-inline: 1.2rem;
  white-space: nowrap;
  font-weight: 750;
}
html[data-theme="plum_mist"] .plum-business-action:hover,
html[data-theme="plum_mist_motion"] .plum-business-action:hover {
  background: var(--accent-strong);
  border-color: var(--accent-strong);
}

html[data-theme="plum_mist"] .plum-dashboard-cta,
html[data-theme="plum_mist_motion"] .plum-dashboard-cta {
  display: grid;
  grid-template-columns: minmax(5.5rem, 7rem) minmax(0, 1fr) auto;
  gap: 1.15rem 1.5rem;
  align-items: center;
  min-height: 8.25rem;
  margin: 0;
  padding: 1.85rem 1.85rem 1.85rem 1.6rem;
  border-radius: 1.2rem;
  overflow: visible;
  background: rgba(255, 255, 255, 0.28);
  backdrop-filter: blur(3px);
  border: 1px solid color-mix(in srgb, var(--accent) 14%, rgba(255,255,255,.55));
  box-shadow: 0 10px 24px rgba(68, 31, 92, 0.06);
}
html[data-theme="plum_mist"] .plum-cta-plane,
html[data-theme="plum_mist_motion"] .plum-cta-plane {
  position: relative;
  z-index: 2;
  width: 9.5rem;
  height: 2.8rem;
  margin: -1.1rem .1rem -.7rem -.35rem;
  display: grid;
  place-items: center;
  background: transparent;
  border: 0;
  box-shadow: none;
  text-decoration: none;
  filter: drop-shadow(0 10px 14px rgba(68, 31, 92, 0.18));
  transform: rotate(-14deg) translateY(.1rem);
  transition: transform .22s ease, filter .22s ease;
}
html[data-theme="plum_mist"] .plum-cta-plane img,
html[data-theme="plum_mist_motion"] .plum-cta-plane img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  background: transparent;
  pointer-events: none;
}
html[data-theme="plum_mist"] .plum-cta-plane:hover,
html[data-theme="plum_mist_motion"] .plum-cta-plane:hover {
  transform: rotate(-14deg) translate(.2rem, -.45rem) scale(1.05);
  filter: drop-shadow(0 16px 20px rgba(68, 31, 92, 0.26));
}
html[data-theme="plum_mist"] .plum-cta-copy,
html[data-theme="plum_mist_motion"] .plum-cta-copy,
html[data-theme="plum_mist"] .plum-cta-action,
html[data-theme="plum_mist_motion"] .plum-cta-action {
  position: relative;
  z-index: 1;
}
html[data-theme="plum_mist"] .plum-dashboard-cta h3,
html[data-theme="plum_mist_motion"] .plum-dashboard-cta h3 {
  margin: 0 0 .35rem;
  font-size: clamp(1.25rem, 2.2vw, 1.45rem);
  letter-spacing: -0.015em;
}
html[data-theme="plum_mist"] .plum-dashboard-cta p,
html[data-theme="plum_mist_motion"] .plum-dashboard-cta p {
  margin: 0;
  color: var(--muted);
  font-size: .95rem;
  max-width: 36ch;
}
html[data-theme="plum_mist"] .plum-cta-action,
html[data-theme="plum_mist_motion"] .plum-cta-action {
  min-height: 2.85rem;
  padding-inline: 1.2rem;
  white-space: nowrap;
}

@media (max-width: 860px) {
  html[data-theme="plum_mist"] #dashboard,
  html[data-theme="plum_mist_motion"] #dashboard {
    margin-top: -2rem;
  }
  html[data-theme="plum_mist"] #dashboard .page-stack,
  html[data-theme="plum_mist_motion"] #dashboard .page-stack {
    grid-template-columns: 1fr;
  }
  html[data-theme="plum_mist"] #dashboard .dashboard-pins-section,
  html[data-theme="plum_mist_motion"] #dashboard .dashboard-pins-section,
  html[data-theme="plum_mist"] #dashboard .plum-trip-guide-section,
  html[data-theme="plum_mist_motion"] #dashboard .plum-trip-guide-section,
  html[data-theme="plum_mist"] #dashboard .plum-mist-band,
  html[data-theme="plum_mist_motion"] #dashboard .plum-mist-band {
    grid-column: 1;
    grid-row: auto;
  }
  html[data-theme="plum_mist"] .plum-mist-band,
  html[data-theme="plum_mist_motion"] .plum-mist-band {
    padding: .9rem;
  }
  html[data-theme="plum_mist"] .plum-business-strip,
  html[data-theme="plum_mist_motion"] .plum-business-strip,
  html[data-theme="plum_mist"] .plum-dashboard-cta,
  html[data-theme="plum_mist_motion"] .plum-dashboard-cta {
    grid-template-columns: 1fr;
    text-align: center;
    justify-items: center;
  }
  html[data-theme="plum_mist"] .plum-dashboard-cta,
  html[data-theme="plum_mist_motion"] .plum-dashboard-cta {
    padding: 2.1rem 1.35rem 1.6rem;
    min-height: 10rem;
  }
  html[data-theme="plum_mist"] .plum-cta-plane,
  html[data-theme="plum_mist_motion"] .plum-cta-plane {
    margin: -1.2rem 0 -.3rem;
    width: 7.5rem;
    height: 2.3rem;
  }
html[data-theme="plum_mist"] .plum-dashboard-cta p,
html[data-theme="plum_mist_motion"] .plum-dashboard-cta p,
html[data-theme="plum_mist"] .plum-business-copy p,
html[data-theme="plum_mist_motion"] .plum-business-copy p {
  max-width: 28ch;
}
}

/* Plum Mist — replace darker purple page/section fills site-wide */
html[data-theme="plum_mist"] .upcoming-trip-strip,
html[data-theme="plum_mist_motion"] .upcoming-trip-strip {
  background:
    radial-gradient(circle at 18% 0%, color-mix(in srgb, var(--lavender) 55%, transparent), transparent 55%),
    linear-gradient(180deg, color-mix(in srgb, var(--mist-wash) 88%, transparent), color-mix(in srgb, var(--surface) 92%, transparent));
  border-color: color-mix(in srgb, var(--accent) 18%, var(--border));
}
html[data-theme="plum_mist"] .auth-landing,
html[data-theme="plum_mist_motion"] .auth-landing {
  background: var(--mist-wash);
  border-color: color-mix(in srgb, var(--accent) 14%, var(--border));
}
html[data-theme="plum_mist"] .auth-landing-media,
html[data-theme="plum_mist_motion"] .auth-landing-media {
  background-image:
    linear-gradient(105deg, rgba(255, 250, 255, 0.97) 0%, rgba(255, 250, 255, 0.9) 38%, rgba(255, 250, 255, 0.48) 64%, rgba(255, 250, 255, 0.14) 84%, transparent 94%),
    var(--hero-photo-auth);
  background-position: center, center 40%;
  background-size: cover;
  filter: saturate(0.7) contrast(0.9) brightness(1.06);
  opacity: 0.9;
}
html[data-theme="plum_mist"] .auth-landing-copy h2,
html[data-theme="plum_mist_motion"] .auth-landing-copy h2 {
  color: var(--accent-strong);
  letter-spacing: -0.03em;
}
html[data-theme="plum_mist"] .auth-benefits-card,
html[data-theme="plum_mist_motion"] .auth-benefits-card {
  background: rgba(255, 255, 255, 0.82);
  border-color: color-mix(in srgb, var(--accent) 16%, var(--border));
  box-shadow: 0 12px 28px rgba(68, 31, 92, 0.1);
}
html[data-theme="plum_mist"] .page-section,
html[data-theme="plum_mist_motion"] .page-section {
  background:
    linear-gradient(160deg, color-mix(in srgb, var(--mist-wash) 42%, transparent), color-mix(in srgb, var(--surface) 88%, transparent) 62%),
    color-mix(in srgb, var(--surface) 94%, transparent);
}
html[data-theme="plum_mist"] #groups .group-avatar,
html[data-theme="plum_mist_motion"] #groups .group-avatar,
html[data-theme="plum_mist"] #groups .groups-composer-avatar,
html[data-theme="plum_mist_motion"] #groups .groups-composer-avatar,
html[data-theme="plum_mist"] #groups .groups-avatar,
html[data-theme="plum_mist_motion"] #groups .groups-avatar {
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--lavender) 80%, var(--surface)), color-mix(in srgb, var(--mist-wash) 70%, var(--accent-soft)));
  color: var(--accent-strong);
}
html[data-theme="plum_mist"] #groups .groups-suggest-cover,
html[data-theme="plum_mist_motion"] #groups .groups-suggest-cover,
html[data-theme="plum_mist"] #groups .groups-suggest-cover[data-seed="a"],
html[data-theme="plum_mist_motion"] #groups .groups-suggest-cover[data-seed="a"] {
  color: var(--accent-strong);
  background:
    radial-gradient(circle at 22% 28%, color-mix(in srgb, var(--lavender) 75%, var(--surface)), transparent 58%),
    linear-gradient(145deg, color-mix(in srgb, var(--mist-wash) 70%, var(--surface)), color-mix(in srgb, var(--lavender) 60%, var(--mist-wash)));
}
html[data-theme="plum_mist"] #groups .groups-suggest-cover[data-seed="b"],
html[data-theme="plum_mist_motion"] #groups .groups-suggest-cover[data-seed="b"] {
  color: var(--accent-strong);
  background:
    radial-gradient(circle at 78% 30%, color-mix(in srgb, var(--accent-soft) 28%, transparent), transparent 55%),
    linear-gradient(160deg, color-mix(in srgb, var(--mist-wash) 65%, var(--surface)), color-mix(in srgb, var(--lavender) 70%, var(--surface-soft)));
}
html[data-theme="plum_mist"] #groups .groups-suggest-cover[data-seed="c"],
html[data-theme="plum_mist_motion"] #groups .groups-suggest-cover[data-seed="c"] {
  color: var(--accent-strong);
  background:
    radial-gradient(circle at 40% 80%, color-mix(in srgb, var(--accent) 12%, transparent), transparent 50%),
    linear-gradient(125deg, color-mix(in srgb, var(--lavender) 55%, var(--surface)), color-mix(in srgb, var(--mist-wash) 80%, var(--lavender)));
}
html[data-theme="plum_mist"] #groups .groups-detail-banner:not(.has-banner),
html[data-theme="plum_mist_motion"] #groups .groups-detail-banner:not(.has-banner),
html[data-theme="plum_mist"] #groups .groups-create-preview-cover:not(.has-banner),
html[data-theme="plum_mist_motion"] #groups .groups-create-preview-cover:not(.has-banner) {
  background:
    radial-gradient(circle at 18% 30%, color-mix(in srgb, var(--lavender) 70%, transparent), transparent 55%),
    linear-gradient(105deg, color-mix(in srgb, var(--mist-wash) 78%, var(--surface)) 0%, color-mix(in srgb, var(--lavender) 55%, var(--mist-wash)) 100%);
}
html[data-theme="plum_mist"] #groups .groups-suggest-cover.has-banner,
html[data-theme="plum_mist_motion"] #groups .groups-suggest-cover.has-banner {
  color: transparent;
}
html[data-theme="plum_mist"] .places-adverts-strip:not(.plum-mist-surface),
html[data-theme="plum_mist_motion"] .places-adverts-strip:not(.plum-mist-surface) {
  border-style: solid;
  border-color: color-mix(in srgb, var(--accent) 14%, var(--border));
  background:
    radial-gradient(circle at 10% 20%, color-mix(in srgb, var(--lavender) 55%, transparent), transparent 48%),
    linear-gradient(105deg, color-mix(in srgb, var(--mist-wash) 90%, transparent), color-mix(in srgb, var(--surface) 88%, transparent));
}

/* Local weather — soft Plum Mist atmosphere + condition-icon wash */
html[data-theme="plum_mist"] .weather-current-card,
html[data-theme="plum_mist_motion"] .weather-current-card {
  border-color: color-mix(in srgb, var(--accent) 18%, var(--border));
  box-shadow: 0 14px 32px rgba(68, 31, 92, 0.08);
}
html[data-theme="plum_mist"] .weather-current-icon-watermark,
html[data-theme="plum_mist_motion"] .weather-current-icon-watermark {
  opacity: 0.22;
}
html[data-theme="plum_mist"] .live-info-panel[data-live-section="weather"],
html[data-theme="plum_mist_motion"] .live-info-panel[data-live-section="weather"],
html[data-theme="plum_mist"] .city-weather-block,
html[data-theme="plum_mist_motion"] .city-weather-block {
  border-color: color-mix(in srgb, var(--accent) 20%, var(--border));
  background:
    radial-gradient(ellipse 75% 55% at 100% 0%, color-mix(in srgb, var(--lavender) 42%, transparent), transparent 58%),
    linear-gradient(155deg, color-mix(in srgb, var(--mist-wash) 72%, white), color-mix(in srgb, var(--surface) 94%, transparent));
}
html[data-theme="plum_mist"] .weather-day-card,
html[data-theme="plum_mist_motion"] .weather-day-card {
  border-color: color-mix(in srgb, var(--accent) 12%, var(--border));
  background:
    linear-gradient(160deg, rgba(255, 255, 255, 0.88), color-mix(in srgb, var(--lavender) 28%, transparent));
}
html[data-theme="plum_mist"] .weather-current-temp,
html[data-theme="plum_mist_motion"] .weather-current-temp,
html[data-theme="plum_mist"] .weather-current-topline strong,
html[data-theme="plum_mist_motion"] .weather-current-topline strong {
  color: var(--accent-strong);
}
html[data-theme="plum_mist"] .upcoming-trip-weather,
html[data-theme="plum_mist_motion"] .upcoming-trip-weather {
  border-radius: 999px;
  padding: 0.15rem 0.45rem;
  background: color-mix(in srgb, var(--mist-wash) 55%, transparent);
}

/* r356/r359 — Phone viewport: kill page-level horizontal scroll (desktop unchanged).
   Prefer root-cause shrink/wrap/contain; overflow-x on shell is a last guard.
   r359: plans comparison stays an internal swipe scroller with edge fades. */
@media (max-width: 720px) {
  html,
  body {
    overflow-x: hidden;
    max-width: 100%;
  }

  .site-header,
  main,
  .panel,
  .page-stack,
  .page-section,
  .context-block,
  .card,
  .directory-card,
  .place-detail,
  .status-card,
  .global-dashboard-hero,
  .dashboard-hero,
  .hero,
  .upcoming-trip-strip,
  #dashboard,
  #places,
  #experiences,
  #advice,
  #groups,
  #airlines,
  #auth,
  #myTrips,
  #myExperiences,
  #myAdvice,
  #myReviews,
  #myBusinessSites,
  #plans,
  #locations,
  #admin,
  #help,
  #impressum,
  #moderation {
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  main {
    width: min(var(--shell-max), calc(100% - 1.25rem));
  }

  .site-header {
    width: 100%;
  }

  /* Flex/grid children must be allowed to shrink below content size */
  .header-left,
  .header-right,
  .brand,
  .panel-header,
  .page-section-header,
  .filters-row > *,
  .search-result-card > div:first-child,
  .plan-card-topline,
  .trip-card-topline,
  .trip-flight-item,
  .trip-flight-offer,
  .trip-item-copy,
  .place-detail-heading,
  .location-context-header-main,
  .groups-composer-author,
  #groups .groups-layout,
  #groups .groups-col,
  #groups .groups-composer-card,
  #groups .group-post-head,
  #groups .group-post-meta,
  #groups .group-comment-bubble,
  #groups .groups-composer-editor,
  #groups .groups-composer-editor textarea {
    min-width: 0;
  }

  /* Rigid auto-fit mins → one column on phone */
  .dashboard-pin-grid,
  .dashboard-pins-wide_cards .dashboard-pin-grid,
  .dashboard-quick-grid,
  .safety-card-list,
  .safety-contacts-panel .safety-card-list,
  .directory-grid,
  .plans-grid,
  .plans-ads-grid,
  .plans-type-grid,
  .polished-stat-grid,
  .grid-section,
  .traveler-osm-place-results .owner-place-candidates,
  .admin-section-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  /* Internal swipe rows — never expand the page */
  .places-adverts-row,
  #groups .groups-suggest-scroller,
  .plans-comparison-scroll,
  .table-wrap {
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
  }

  .places-adverts-row {
    width: 100%;
  }

  /* Plans comparison: contain wide table in an internal scroller (page stays fixed). */
  #plans .plans-comparison-wrap,
  .plans-comparison-wrap {
    position: relative;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
  }

  #plans .plans-comparison-scroll,
  .plans-comparison-scroll {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    border: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
    border-radius: 0.85rem;
    background: color-mix(in srgb, var(--surface) 94%, transparent);
    scrollbar-gutter: stable;
  }

  .plans-comparison-table {
    width: max-content;
    min-width: 36rem;
    max-width: none;
  }

  .plans-comparison-table th:first-child,
  .plans-comparison-table td:first-child,
  .plans-comparison-table tbody th {
    position: sticky;
    left: 0;
    z-index: 1;
    min-width: 7.5rem;
    max-width: 42vw;
    box-shadow: 1px 0 0 color-mix(in srgb, var(--border) 70%, transparent);
    background: color-mix(in srgb, var(--surface) 96%, transparent);
  }

  .plans-comparison-table thead th:first-child {
    z-index: 2;
    background: color-mix(in srgb, var(--surface-soft) 82%, var(--surface));
  }

  .plans-comparison-table tr.is-ad-row th,
  .plans-comparison-table tr.is-ad-row td:first-child {
    background: color-mix(in srgb, var(--accent) 10%, var(--surface));
  }

  /* Edge fades — visible cue that only the table swipes */
  .plans-comparison-wrap::before,
  .plans-comparison-wrap::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 1.65rem;
    pointer-events: none;
    z-index: 3;
    opacity: 0;
    transition: opacity 160ms ease;
  }

  .plans-comparison-wrap::before {
    left: 0;
    border-radius: 0.85rem 0 0 0.85rem;
    background: linear-gradient(
      to right,
      color-mix(in srgb, var(--surface) 92%, transparent),
      transparent
    );
  }

  .plans-comparison-wrap::after {
    right: 0;
    border-radius: 0 0.85rem 0.85rem 0;
    background: linear-gradient(
      to left,
      color-mix(in srgb, var(--surface) 92%, transparent),
      transparent
    );
  }

  .plans-comparison-wrap.is-compare-scrollable:not(.is-compare-start)::before,
  .plans-comparison-wrap.is-compare-scrollable:not(.is-compare-end)::after {
    opacity: 1;
  }

  /* Mobile plan carousel: one license column at a time (swipe / dots), no free table drag */
  #plans .plans-comparison-wrap.is-compare-carousel,
  .plans-comparison-wrap.is-compare-carousel {
    overflow: hidden;
  }

  #plans .plans-comparison-wrap.is-compare-carousel::before,
  #plans .plans-comparison-wrap.is-compare-carousel::after,
  .plans-comparison-wrap.is-compare-carousel::before,
  .plans-comparison-wrap.is-compare-carousel::after {
    display: none;
  }

  #plans .plans-comparison-wrap.is-compare-carousel .plans-comparison-scroll,
  .plans-comparison-wrap.is-compare-carousel .plans-comparison-scroll {
    overflow-x: hidden;
    touch-action: pan-y;
    overscroll-behavior-x: none;
    -webkit-overflow-scrolling: auto;
    scrollbar-gutter: auto;
  }

  .plans-comparison-wrap.is-compare-carousel .plans-comparison-table {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    table-layout: fixed;
  }

  .plans-comparison-wrap.is-compare-carousel .plans-comparison-table th:first-child,
  .plans-comparison-wrap.is-compare-carousel .plans-comparison-table td:first-child,
  .plans-comparison-wrap.is-compare-carousel .plans-comparison-table tbody th {
    position: static;
    left: auto;
    z-index: auto;
    min-width: 0;
    max-width: none;
    width: 58%;
    box-shadow: none;
  }

  .plans-comparison-wrap.is-compare-carousel .plans-comparison-table [data-plan-col] {
    display: none;
    width: 42%;
  }

  .plans-comparison-wrap.is-compare-carousel[data-active-plan="0"] .plans-comparison-table [data-plan-col="0"],
  .plans-comparison-wrap.is-compare-carousel[data-active-plan="1"] .plans-comparison-table [data-plan-col="1"],
  .plans-comparison-wrap.is-compare-carousel[data-active-plan="2"] .plans-comparison-table [data-plan-col="2"],
  .plans-comparison-wrap.is-compare-carousel[data-active-plan="3"] .plans-comparison-table [data-plan-col="3"] {
    display: table-cell;
  }

  .plans-comparison-wrap.is-compare-carousel .plans-compare-carousel {
    display: flex;
  }

  details[data-admin-section="users"] .table-wrap {
    margin-inline: 0;
    padding-inline: 0;
    max-width: 100%;
  }

  /* Media / embeds stay inside the column */
  .panel img,
  .page-section img,
  .directory-card img:not(.airline-card-flag-watermark):not(.country-card-flag-watermark):not(.dashboard-pin-flag-watermark),
  .imported-place-image img,
  #groups .group-post-photo,
  #groups .groups-photo-preview img,
  #groups .groups-video-preview video,
  #groups .group-post-video,
  .modal-card img,
  .place-advert-card img {
    max-width: 100%;
    height: auto;
  }

  /* Long unbroken strings / URLs */
  .panel,
  .page-section,
  .directory-card,
  .group-post-body,
  .group-comment-bubble,
  .profile-menu-summary,
  .form-message,
  a {
    overflow-wrap: anywhere;
  }

  /* Chip / tool rows wrap instead of forcing page scroll */
  .dashboard-pin-chip-row,
  .browser-safety-chip-row,
  .import-wizard-key-chip-row,
  .ride-hailing-app-list,
  #groups .groups-feed-tabs,
  .airport-facts,
  .state-card-stats {
    max-width: 100%;
    flex-wrap: wrap;
  }

  /* Upcoming trip strip */
  .upcoming-trip-link {
    min-width: 0;
    max-width: 100%;
  }

  /* Groups composer / create / comments */
  #groups .groups-create-row {
    grid-template-columns: 1fr;
  }
  #groups .groups-composer-add-row {
    flex-direction: column;
    align-items: stretch;
  }
  #groups .groups-composer-add-icons {
    justify-content: flex-start;
    flex-wrap: wrap;
  }
  #groups .groups-emoji-picker {
    width: min(18rem, calc(100% - 0.5rem));
    max-width: calc(100vw - 2.5rem);
  }
  #groups .groups-feeling-panel,
  #groups .groups-menu {
    max-width: min(100%, calc(100vw - 2rem));
  }
  #groups .group-comment-form {
    flex-direction: column;
    align-items: stretch;
  }
  #groups .group-comment-input-wrap {
    flex: 1 1 auto;
    width: 100%;
  }
  #groups .groups-detail-actions {
    width: 100%;
  }
  #groups .groups-detail-actions .button {
    flex: 1 1 auto;
  }

  /* Plum Mist CTA plane rotation can stick past the card edge */
  html[data-theme="plum_mist"] .plum-dashboard-cta,
  html[data-theme="plum_mist_motion"] .plum-dashboard-cta {
    overflow: hidden;
    width: 100%;
  }
  html[data-theme="plum_mist"] .plum-business-strip,
  html[data-theme="plum_mist_motion"] .plum-business-strip,
  html[data-theme="plum_mist"] .plum-mist-band,
  html[data-theme="plum_mist_motion"] .plum-mist-band,
  html[data-theme="plum_mist"] .plum-cta-action,
  html[data-theme="plum_mist_motion"] .plum-cta-action,
  html[data-theme="plum_mist"] .plum-business-action,
  html[data-theme="plum_mist_motion"] .plum-business-action {
    max-width: 100%;
    min-width: 0;
  }
  html[data-theme="plum_mist"] .plum-cta-action,
  html[data-theme="plum_mist_motion"] .plum-cta-action,
  html[data-theme="plum_mist"] .plum-business-action,
  html[data-theme="plum_mist_motion"] .plum-business-action {
    white-space: normal;
    width: 100%;
    justify-content: center;
  }

  /* Multi-column import / embassy forms */
  .embassy-import-fields,
  .embassy-import-summary,
  .embassy-import-intro,
  .embassy-import-preview-row,
  .embassy-import-confirmation {
    grid-template-columns: minmax(0, 1fr);
  }

  /* Profile identity / facts */
  .profile-fact {
    grid-template-columns: minmax(0, 1fr);
  }
  .profile-identity {
    grid-template-columns: minmax(0, 1fr);
  }

  /* Modals fit the phone */
  .modal-backdrop {
    padding: 0.75rem;
    box-sizing: border-box;
  }
  .modal-card,
  .external-link-modal-card {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  /* Compact nowrap labels that fight narrow widths */
  .compact-actions,
  .pin-button,
  .load-timer,
  .place-card-actions .button.secondary:not(.pin-icon-button):not(.add-to-trip-icon-button) {
    white-space: normal;
  }

  .action-row {
    max-width: 100%;
  }

  /* Listing preview ribbon stays clipped inside its canvas */
  .listing-status-preview-canvas {
    overflow: hidden;
    max-width: 100%;
  }

  /* Climate month cells already shrink with minmax(0,1fr) */
  .climate-month-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  /* Avoid 100vw scrollbar inflation on language chip */
  .language-switcher-toggle {
    max-width: min(42vw, 11.5rem);
  }
}

/* Place quiet / best-time indicator */
.place-quiet-badge {
  color: color-mix(in srgb, var(--accent) 72%, var(--muted));
  border-color: color-mix(in srgb, var(--accent) 34%, var(--border));
  background: color-mix(in srgb, var(--accent) 10%, var(--surface-soft));
  font-weight: 800;
}
.place-quiet-card-line {
  margin: 0.15rem 0 0.35rem;
  line-height: 1.35;
}
.place-quiet-times {
  margin: 0.85rem 0 1rem;
  padding: 0.85rem 1rem;
  border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--border));
  border-radius: 1rem;
  background: color-mix(in srgb, var(--accent) 6%, var(--surface-soft));
}
.place-quiet-times .section-heading-row {
  margin-bottom: 0.45rem;
}
.place-quiet-times h4 {
  margin: 0;
  font-size: 1rem;
}
.place-quiet-times .compact-facts {
  margin: 0.35rem 0 0.5rem;
}
.place-quiet-vote {
  margin-top: 0.85rem;
  padding-top: 0.75rem;
  border-top: 1px dashed color-mix(in srgb, var(--accent) 28%, var(--border));
}
.place-quiet-vote-prompt {
  margin: 0 0 0.45rem;
}
.place-quiet-vote-time-picker {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  margin-bottom: 0.5rem;
}
.place-quiet-vote-time-picker label {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  font-size: 0.78rem;
  color: var(--muted);
  font-weight: 700;
}
.place-quiet-vote-time-picker select {
  border: 1px solid var(--border);
  border-radius: 0.6rem;
  background: var(--surface);
  color: var(--text);
  padding: 0.35rem 0.55rem;
  font-size: 0.82rem;
}
.place-quiet-vote-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-bottom: 0.45rem;
}
.place-quiet-vote-btn.is-selected {
  border-color: color-mix(in srgb, var(--accent) 55%, var(--border));
  background: color-mix(in srgb, var(--accent) 16%, var(--surface-soft));
  font-weight: 800;
}
.place-quiet-vote-mine:empty {
  display: none;
}
.place-quiet-vote-summary,
.place-quiet-vote-insight {
  margin: 0.25rem 0;
}
.place-price-vote {
  display: inline-flex;
  gap: 0.3rem;
}
.place-price-vote-btn {
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface);
  color: var(--text);
  padding: 0.35rem 0.6rem;
  font-weight: 800;
  font-size: 0.82rem;
  cursor: pointer;
  min-height: 2rem;
  transition: transform 0.15s ease, border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}
.place-price-vote-btn:hover {
  border-color: var(--accent);
  color: var(--accent);
}
.place-price-vote-btn.is-selected {
  border-color: color-mix(in srgb, var(--accent) 55%, var(--border));
  background: color-mix(in srgb, var(--accent) 16%, var(--surface-soft));
  color: var(--accent-strong);
}
.place-price-vote-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.place-price-vote.compact .place-price-vote-btn {
  padding: 0.28rem 0.48rem;
  font-size: 0.76rem;
  min-height: 1.8rem;
}
.place-price-vote-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin-top: 0.6rem;
}
.place-price-vote-select {
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface);
  color: var(--text);
  padding: 0.28rem 1.5rem 0.28rem 0.65rem;
  font-weight: 800;
  font-size: 0.78rem;
  min-height: 1.9rem;
  cursor: pointer;
  max-width: 6.5rem;
}
.place-price-vote-select:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.quiet-times-admin-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem 1.25rem;
  margin-top: 0.35rem;
}
.quiet-times-admin-heading {
  margin: 0 0 0.4rem;
  font-weight: 800;
  color: var(--muted);
  font-size: 0.9rem;
}
.quiet-times-admin-col .checkbox-row {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin: 0.2rem 0;
  font-size: 0.92rem;
}
@media (max-width: 720px) {
  .quiet-times-admin-grid {
    grid-template-columns: 1fr;
  }
  .auth-landing {
    min-height: clamp(18rem, 72vw, 24rem);
  }
}

/* Plum Mist Motion — intentional, slow photo presence (not decorative noise). */
@media (prefers-reduced-motion: no-preference) {
  html[data-theme="plum_mist_motion"] #dashboardHero.plum-mist-hero .dashboard-hero-media,
  html[data-theme="plum_mist_motion"] .auth-landing-media {
    animation: tht-hero-drift 32s ease-in-out infinite alternate;
  }
  html[data-theme="plum_mist_motion"] .weather-current-card::before {
    background-size: 140% 140%;
    animation: tht-weather-mist-shift 28s ease-in-out infinite alternate;
  }
  /* Secondary strips stay still — less photo motion site-wide */
}
@keyframes tht-hero-drift {
  from { transform: scale(1.01) translate3d(0, 0, 0); }
  to { transform: scale(1.035) translate3d(-0.7%, -0.35%, 0); }
}
@keyframes tht-weather-mist-shift {
  from { background-position: 8% 80%, 0% 50%; opacity: 0.78; }
  to { background-position: 18% 70%, 100% 40%; opacity: 0.95; }
}

/* Thin-section empty states: guidance + clear next steps */
.experiences-empty-state,
.groups-empty-feed,
.groups-empty-list {
  display: grid;
  gap: 0.65rem;
  justify-items: start;
}
.experiences-empty-state p,
.groups-empty-feed p,
.groups-empty-list p { margin: 0; }
.experiences-empty-actions,
.groups-empty-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}
.experiences-getting-started {
  margin-top: 0.25rem;
}
.experiences-getting-started .note { max-width: 42rem; }
.import-summary-panel { margin: 0 0 1rem; }
/* Defer layout and paint work for off-screen content without hiding it from navigation. */
.page-section,
.context-block {
  content-visibility: auto;
  contain-intrinsic-size: auto 560px;
}

@media (max-width: 700px) {
  .page-section,
  .context-block { contain-intrinsic-size: auto 720px; }
  /* These promo/CTA cards are far shorter than the generic 720px estimate above;
     without a tighter estimate they render as a large blank block until scrolled
     into view, then jump-shrink to their real size. */
  .plum-business-strip { contain-intrinsic-size: auto 340px; }
  .plum-dashboard-cta { contain-intrinsic-size: auto 290px; }
}


/* Complete city destination cover */
.city-cover-image {
  margin: 0 0 1.25rem;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 1.15rem;
  background: var(--surface-soft);
  box-shadow: var(--shadow-soft);
}
.city-cover-image img {
  display: block;
  width: 100%;
  height: clamp(14rem, 42vw, 34rem);
  object-fit: cover;
  object-position: center;
}
.city-cover-image figcaption {
  padding: .55rem .8rem;
  color: var(--text-muted);
  font-size: .78rem;
  line-height: 1.35;
}


/* Curated city itineraries */
.city-suggested-itineraries {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--border);
}
.city-suggested-itineraries h4 {
  margin: .1rem 0 .7rem;
  font-size: 1.15rem;
}
.city-itinerary-grid,
.city-itinerary ol {
  display: grid;
  gap: .65rem;
}
.city-itinerary {
  padding: .9rem;
  border: 1px solid var(--border);
  border-radius: .95rem;
  background: color-mix(in srgb, var(--surface) 90%, transparent);
}
.city-itinerary-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .8rem;
}
.city-itinerary-heading h5 {
  margin: 0;
  font-size: 1rem;
}
.city-itinerary ol {
  margin: .8rem 0 0;
  padding-left: 1.5rem;
}
.city-itinerary-stop {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: .5rem;
  padding: .7rem;
  border: 1px solid var(--border);
  border-radius: .75rem;
  background: var(--surface);
}
.city-itinerary-stop p {
  margin: .25rem 0 0;
  color: var(--muted);
  font-size: .84rem;
}
.city-itinerary-stop-info {
  display: flex;
  align-items: flex-start;
  gap: .6rem;
  min-width: 0;
}
.city-itinerary-stop-text {
  min-width: 0;
}
.city-itinerary-time {
  display: block;
  margin-bottom: .12rem;
  color: var(--accent);
  font-size: .75rem;
  font-weight: 800;
}
.city-itinerary-stop-actions {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: wrap;
  gap: .4rem;
}


/* Dashboard intent discovery */
.dashboard-discovery-shortcuts {
  display: grid;
  gap: .55rem;
  margin-top: .9rem;
}
.dashboard-discovery-shortcuts > strong {
  font-size: .86rem;
}
.dashboard-discovery-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
}
.dashboard-discovery-chips button {
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: .48rem .75rem;
  background: var(--surface);
  color: var(--text);
  font: inherit;
  font-size: .82rem;
  font-weight: 750;
  cursor: pointer;
}
.dashboard-discovery-chips button:hover,
.dashboard-discovery-chips button:focus-visible {
  border-color: var(--accent);
  color: var(--accent);
}
.dashboard-search-term-cloud {
  display: grid;
  gap: .55rem;
  margin-top: .9rem;
}
.dashboard-search-term-cloud > strong {
  font-size: .86rem;
}
.search-term-cloud {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .3rem .65rem;
}
.search-term-cloud-item {
  border: 0;
  background: none;
  padding: .1rem .05rem;
  font: inherit;
  line-height: 1.2;
  cursor: pointer;
  max-width: 100%;
  overflow-wrap: break-word;
  transition: font-size 200ms ease, font-weight 200ms ease, color 200ms ease;
}
.search-term-cloud-item:hover,
.search-term-cloud-item:focus-visible {
  text-decoration: underline;
  filter: brightness(1.15);
}
@media (prefers-reduced-motion: reduce) {
  .search-term-cloud-item {
    transition: none;
  }
}


/* Collapsed city itinerary disclosures */
.city-itinerary > summary,
.city-itinerary-server > summary {
  cursor: pointer;
  list-style: none;
}
.city-itinerary > summary::-webkit-details-marker,
.city-itinerary-server > summary::-webkit-details-marker { display: none; }
.city-itinerary-heading > strong {
  margin: 0;
  font-size: 1rem;
}
.city-itinerary-summary-meta,
.city-itinerary-server > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .65rem;
}
.city-itinerary-toggle {
  display: inline-block;
  width: .65rem;
  height: .65rem;
  flex: 0 0 auto;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  transition: transform .18s ease;
}
.city-itinerary[open] .city-itinerary-toggle,
.city-itinerary-server[open] .city-itinerary-toggle { transform: rotate(225deg); }
.city-itinerary-content { margin-top: .7rem; }
.city-itinerary-content > p:first-child { margin-top: 0; }
.city-itinerary > summary:focus-visible,
.city-itinerary-server > summary:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 4px;
  border-radius: .35rem;
}


/* Curated city reasons to visit */
.city-why-visit {
  margin-top: 1rem;
}
.city-why-visit h3,
.city-why-visit h4 {
  margin: .1rem 0 .7rem;
}
.city-why-visit-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
}
.city-why-visit-grid article {
  padding: .9rem;
  border: 1px solid var(--border);
  border-radius: .9rem;
  background: color-mix(in srgb, var(--surface) 90%, transparent);
}
.city-why-visit-grid h4,
.city-why-visit-grid h5 {
  margin: 0 0 .35rem;
  font-size: .98rem;
}
.city-why-visit-grid p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}
@media (max-width: 760px) {
  .city-why-visit-grid { grid-template-columns: 1fr; }
}


/* Curated city practical planning */
.city-practical-planning {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--border);
}
.city-practical-planning h3,
.city-practical-planning h4 { margin: .1rem 0 .7rem; }
.city-practical-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
}
.city-practical-grid article {
  padding: .9rem;
  border: 1px solid var(--border);
  border-radius: .9rem;
  background: color-mix(in srgb, var(--surface) 90%, transparent);
}
.city-practical-grid h4,
.city-practical-grid h5 { margin: 0 0 .35rem; font-size: .98rem; }
.city-practical-grid p { margin: 0 0 .5rem; color: var(--muted); line-height: 1.55; }
.city-practical-grid a { font-size: .82rem; font-weight: 750; }
@media (max-width: 700px) {
  .city-practical-grid { grid-template-columns: 1fr; }
}


/* Curated city experience collections */
.city-experience-collections {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--border);
}
.city-experience-collections h3,
.city-experience-collections h4 { margin: .1rem 0 .7rem; }
.city-experience-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
}
.city-experience-grid > article {
  padding: .9rem;
  border: 1px solid var(--border);
  border-radius: .9rem;
  background: color-mix(in srgb, var(--surface) 90%, transparent);
}
.city-experience-grid h4,
.city-experience-grid h5 { margin: 0 0 .35rem; font-size: .98rem; }
.city-experience-grid > article > p { margin: 0 0 .6rem; color: var(--muted); }
.city-experience-grid ul { display: grid; gap: .4rem; margin: 0; padding: 0; list-style: none; }
.city-experience-place {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: .5rem;
  padding: .55rem .65rem;
  border: 1px solid var(--border);
  border-radius: .7rem;
  background: var(--surface);
}
.city-experience-place-info {
  display: flex;
  align-items: center;
  gap: .6rem;
  min-width: 0;
}
.city-experience-place-info strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.city-experience-place-actions {
  display: flex;
  align-items: center;
  gap: .4rem;
  flex-wrap: wrap;
  justify-content: flex-start;
}
@media (max-width: 760px) {
  .city-experience-grid { grid-template-columns: 1fr; }
}