:root {
  --ink: #20343d;
  --ink-soft: #415760;
  --muted: #73858c;
  --line: rgba(37, 76, 88, .12);
  --paper: #fffdf9;
  --sand: #fff7e9;
  --blue: #3f8fb5;
  --blue-dark: #286d8a;
  --blue-soft: #dff1f6;
  --lagoon: #62b9c7;
  --green: #55ad87;
  --green-dark: #347d68;
  --green-soft: #e0f3e9;
  --coral: #ef7777;
  --coral-soft: #fde7df;
  --rose: #e56f94;
  --sun: #f4d36c;
  --sun-soft: #fff2b7;
  --purple: #9582bd;
  --white: #fff;
  --shadow-sm: 0 9px 28px rgba(42, 76, 85, .08);
  --shadow-md: 0 20px 52px rgba(39, 77, 88, .12);
  --shadow-lg: 0 30px 80px rgba(38, 72, 82, .17);
  --radius-sm: 16px;
  --radius-md: 24px;
  --radius-lg: 32px;
  --map-nav-clearance: 96px;
  font-family: "Nunito", system-ui, sans-serif;
  color: var(--ink);
  background: #fff;
  font-synthesis: none;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  background: #fff;
}
body.modal-open { overflow: hidden; }
body.map-active { overflow: hidden; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
button, a, select { -webkit-tap-highlight-color: transparent; }
button { border: 0; cursor: pointer; }
img { display: block; max-width: 100%; }
svg { display: block; width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
h1, h2, h3, p { margin-top: 0; }
h1, h2 { letter-spacing: -.04em; }
h1, h2, .brand-name { font-family: "Poppins", sans-serif; font-weight: 700; }
h1 em, h2 em { color: var(--rose); font-style: normal; }
.svg-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
[hidden] { display: none !important; }

:focus-visible { outline: 3px solid rgba(63, 143, 181, .35); outline-offset: 3px; }

.app-shell { width: min(100%, 1240px); min-height: 100vh; margin: 0 auto; padding: 0 32px 140px; }
.topbar {
  position: sticky;
  top: 0;
  z-index: 30;
  height: 88px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 20px;
  margin-inline: -32px;
  padding-inline: 32px;
  border-bottom: 1px solid rgba(37, 76, 88, .08);
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 10px 28px rgba(39, 77, 88, .06);
  -webkit-backdrop-filter: blur(16px) saturate(1.1);
  backdrop-filter: blur(16px) saturate(1.1);
}
body.map-active .topbar {
  position: fixed;
  inset: 0 0 auto;
  width: 100%;
  margin-inline: 0;
  padding-inline: max(32px, calc((100vw - 1176px) / 2));
  border-bottom: 1px solid rgba(37, 76, 88, .08);
  background: rgba(255, 255, 255, .6);
  box-shadow: 0 10px 32px rgba(39, 77, 88, .07);
  -webkit-backdrop-filter: blur(16px) saturate(1.1);
  backdrop-filter: blur(16px) saturate(1.1);
}
.brand { grid-column: 2; grid-row: 1; display: inline-flex; justify-self: center; align-items: center; gap: 11px; padding: 0; background: transparent; }
.brand-name { font-size: 1.48rem; font-weight: 700; letter-spacing: -.045em; }
.brand-mark { position: relative; display: block; width: 38px; height: 38px; transform: rotate(-8deg); }
.brand-mark i, .brand-mark b, .brand-mark em { position: absolute; display: block; border-radius: 70% 45% 62% 44%; }
.brand-mark i { inset: 2px 4px 8px 6px; background: var(--rose); transform: rotate(20deg); }
.brand-mark b { width: 23px; height: 24px; left: 2px; top: 12px; background: var(--sun); transform: rotate(-17deg); }
.brand-mark em { width: 8px; height: 8px; right: 8px; top: 8px; background: #fff; }
.today-pill { grid-column: 1; grid-row: 1; justify-self: start; display: flex; align-items: center; gap: 9px; padding: 7px 13px 7px 10px; border: 1px solid rgba(210, 166, 46, .18); border-radius: 999px; background: rgba(255,255,255,.7); box-shadow: 0 6px 20px rgba(71, 91, 92, .05); backdrop-filter: blur(14px); }
.weather-icon { display: grid; place-items: center; width: 33px; height: 33px; border-radius: 50%; background: var(--sun-soft); font-size: 1.06rem; }
.today-pill > span:last-child { display: flex; align-items: baseline; gap: 7px; }
.today-pill strong { font-size: .92rem; }
.today-pill small { color: var(--muted); font-size: .71rem; text-transform: capitalize; }
.topbar-actions { grid-column: 3; grid-row: 1; justify-self: end; display: flex; align-items: center; gap: 10px; }
.popover-wrap { position: relative; }
.round-button, .avatar-button { display: grid; place-items: center; width: 43px; height: 43px; border: 1px solid var(--line); border-radius: 50%; background: rgba(255,255,255,.78); box-shadow: var(--shadow-sm); }
.round-button { position: relative; }
.round-button svg { width: 20px; height: 20px; }
.notification-dot { position: absolute; right: 8px; top: 7px; width: 7px; height: 7px; border: 2px solid #fff; border-radius: 50%; background: var(--coral); }
.avatar-button { position: relative; color: #fff; border: 3px solid #fff; background: linear-gradient(145deg, var(--coral), var(--rose) 48%, var(--blue)); font-size: .72rem; font-weight: 800; }
.avatar-status { position: absolute; right: -1px; bottom: 0; width: 10px; height: 10px; border: 2px solid #fff; border-radius: 50%; background: var(--green); }
.popover { position: absolute; z-index: 80; top: calc(100% + 12px); right: 0; width: 270px; padding: 9px; border: 1px solid var(--line); border-radius: 20px; background: #fff; box-shadow: var(--shadow-lg); animation: pop-in .18s ease-out; }
@keyframes pop-in { from { opacity: 0; transform: translateY(-5px) scale(.97); } }
.popover::before { content: ""; position: absolute; right: 14px; top: -6px; width: 12px; height: 12px; border-left: 1px solid var(--line); border-top: 1px solid var(--line); background: #fff; transform: rotate(45deg); }
.profile-summary { display: flex; align-items: center; gap: 11px; padding: 10px 10px 14px; }
.profile-summary > span { display: grid; place-items: center; width: 39px; height: 39px; border-radius: 13px; color: #fff; background: linear-gradient(145deg, var(--coral), var(--blue)); font-size: .73rem; font-weight: 800; }
.profile-summary div { display: grid; gap: 2px; }
.profile-summary strong { font-size: .86rem; }
.profile-summary small { color: var(--muted); font-size: .7rem; }
.profile-popover > button { width: 100%; display: flex; align-items: center; justify-content: space-between; min-height: 40px; padding: 0 10px; border-radius: 11px; background: transparent; font-size: .79rem; text-align: left; }
.profile-popover > button:hover { background: #f6faf9; }
.profile-popover svg { width: 15px; height: 15px; color: var(--muted); }
.profile-popover hr { margin: 6px 8px; border: 0; border-top: 1px solid #edf0f0; }
.profile-popover .logout-button { color: #bb5f63; }
.menu-count, .plan-badge { min-width: 23px; padding: 3px 7px; border-radius: 999px; color: var(--rose); background: #fdeaf0; font-size: .62rem; text-align: center; }
.plan-badge { color: var(--green-dark); background: var(--green-soft); }
.notifications-popover { width: 310px; }
.popover-heading { display: flex; justify-content: space-between; align-items: center; padding: 9px 10px 12px; }
.popover-heading strong { font-family: "Poppins", sans-serif; }
.popover-heading span { color: var(--rose); font-size: .66rem; }
.notifications-popover button { display: flex; width: 100%; align-items: center; gap: 10px; padding: 10px; border-radius: 13px; background: transparent; text-align: left; }
.notifications-popover button:hover { background: #f8faf9; }
.notifications-popover button > span:last-child { display: grid; gap: 2px; }
.notifications-popover button strong { font-size: .75rem; }
.notifications-popover button small { color: var(--muted); font-size: .68rem; }
.notice-icon { display: grid; flex: 0 0 37px; place-items: center; height: 37px; border-radius: 12px; }
.notice-icon--mint { background: var(--green-soft); }.notice-icon--sun { background: var(--sun-soft); }

main { position: relative; }
.view { display: none; animation: view-in .28s ease-out; }
.view--active { display: block; }
@keyframes view-in { from { opacity: 0; transform: translateY(8px); } }
.eyebrow { margin-bottom: 7px; color: var(--blue); font-size: .69rem; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.welcome-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 34px 0 14px; }
.welcome-row .eyebrow { margin-bottom: 0; }
.view-heading h1, .subview-heading h1, .map-header h1, .planning-header h1 { margin-bottom: 0; font-size: clamp(2.25rem, 5vw, 4.35rem); line-height: 1.03; }
.location-chip { display: flex; flex: 0 0 auto; align-items: center; gap: 6px; margin-bottom: 8px; padding: 9px 12px; border-radius: 999px; color: var(--green-dark); background: var(--green-soft); font-size: .72rem; font-weight: 700; }
.location-chip svg { width: 15px; height: 15px; }
.hero-card { position: relative; overflow: hidden; padding: 50px; border-radius: 34px; background: linear-gradient(135deg, #fff1f6, #fff8e9); }
.hero-card > :not(.hero-card-cloud) { position: relative; z-index: 1; }
.hero-card-cloud { position: absolute; right: -30px; top: 20px; font-size: 100px; line-height: 1; }
.hero-card h1 { margin-bottom: 15px; font-size: 3.44rem; line-height: 1.15; }
.hero-card h1 em { color: var(--rose); }
.hero-card p { margin-bottom: 25px; color: var(--muted); font-size: 1.125rem; line-height: 1.55; }
.hero-card-search { display: flex; max-width: 930px; padding: 8px; border-radius: 18px; background: #fff; box-shadow: 0 12px 30px rgba(0,0,0,.08); }
.hero-card-search input { flex: 1; min-width: 0; padding: 15px; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 1rem; }
.hero-card-search input::placeholder { color: #95a3a8; }
.hero-card-search button { min-height: 48px; padding: 0 20px; border-radius: 14px; color: #fff; background: var(--rose); box-shadow: 0 10px 24px rgba(229,111,148,.22); font-weight: 800; }
.hero-card-search button:hover { filter: brightness(.97); transform: translateY(-1px); }
.primary-button { min-height: 48px; padding: 0 22px; border-radius: 15px; color: #fff; background: linear-gradient(135deg, var(--blue), var(--lagoon)); box-shadow: 0 10px 24px rgba(63,143,181,.23); font-weight: 800; font-size: .76rem; }
.primary-button:hover { filter: brightness(.97); transform: translateY(-1px); }
.quick-row { display: flex; gap: 8px; padding: 14px 0 24px; overflow-x: auto; scrollbar-width: none; }
.quick-row::-webkit-scrollbar, .activity-rail::-webkit-scrollbar, .search-chips::-webkit-scrollbar, .map-filter-row::-webkit-scrollbar { display: none; }
.quick-row button { flex: 0 0 auto; padding: 9px 13px; border: 1px solid var(--line); border-radius: 999px; background: rgba(255,255,255,.72); font-size: .69rem; font-weight: 700; }
.quick-row button:hover { border-color: rgba(63,143,181,.35); background: #fff; }
.quick-row span { margin-right: 3px; }

.memory-hero { position: relative; min-height: 370px; overflow: hidden; border-radius: 34px; color: #fff; background: linear-gradient(122deg, #e97875 0, #e78e7c 30%, #5eabc2 66%, #55a784 100%); box-shadow: 0 30px 70px rgba(66, 133, 144, .22); }
.memory-hero::after { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 80% 10%, rgba(255,255,255,.2), transparent 26%), linear-gradient(100deg, rgba(35,57,63,.12), transparent 60%); pointer-events: none; }
.memory-copy { position: relative; z-index: 4; width: 54%; padding: 55px 0 52px 58px; }
.editorial-tag { display: inline-block; padding: 6px 10px; border: 1px solid rgba(255,255,255,.34); border-radius: 999px; background: rgba(255,255,255,.14); font-size: .63rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.memory-copy h2 { margin: 20px 0 14px; color: #fff; font-size: clamp(2.15rem, 4vw, 3.6rem); line-height: .98; }
.memory-copy p { max-width: 470px; margin-bottom: 23px; color: rgba(255,255,255,.88); font-size: .9rem; line-height: 1.6; }
.white-button { min-height: 44px; padding: 0 17px; border-radius: 999px; color: var(--blue-dark); background: #fff; font-size: .73rem; font-weight: 800; }
.white-button span { margin-left: 8px; }
.memory-scene { position: absolute; z-index: 2; right: 0; bottom: 0; width: 52%; height: 100%; }
.scene-sun { position: absolute; right: 17%; top: 13%; width: 68px; height: 68px; border-radius: 50%; background: var(--sun); box-shadow: 0 0 0 20px rgba(244,211,108,.14); }
.scene-cloud { position: absolute; width: 92px; height: 24px; border-radius: 40px; background: rgba(255,255,255,.72); }
.scene-cloud::before, .scene-cloud::after { content: ""; position: absolute; bottom: 0; border-radius: 50%; background: inherit; }
.scene-cloud::before { left: 17px; width: 36px; height: 38px; }.scene-cloud::after { right: 13px; width: 29px; height: 30px; }
.scene-cloud--one { right: 2%; top: 35%; transform: scale(.75); }.scene-cloud--two { left: 5%; top: 18%; transform: scale(.5); opacity: .65; }
.scene-hill { position: absolute; bottom: -95px; border-radius: 50% 50% 0 0; }
.scene-hill--back { right: -12%; width: 105%; height: 270px; background: #8dd0ad; transform: rotate(-5deg); }
.scene-hill--front { right: -18%; bottom: -145px; width: 112%; height: 300px; background: #4b9b78; transform: rotate(7deg); }
.scene-tree { position: absolute; z-index: 2; bottom: 57px; color: #287358; font-size: 92px; line-height: .5; text-shadow: 0 39px 0 #78583e; }
.scene-tree--one { right: 13%; transform: scale(.85); }.scene-tree--two { left: 11%; bottom: 45px; transform: scale(.58); }
.scene-car { position: absolute; z-index: 4; right: 36%; bottom: 55px; font-size: 3.45rem; transform: rotate(-5deg); filter: drop-shadow(0 12px 8px rgba(40,70,60,.17)); }
.scene-car i { position: absolute; left: -85px; bottom: 4px; width: 94px; height: 4px; border-radius: 50%; background: rgba(255,255,255,.38); }
.scene-kite { position: absolute; z-index: 3; right: 36%; top: 16%; color: var(--coral); font-size: 2.3rem; transform: rotate(22deg); text-shadow: 19px 20px 0 transparent; }
.scene-kite::after { content: "⌁"; position: absolute; left: 12px; top: 22px; color: rgba(255,255,255,.75); font-size: 4rem; transform: rotate(30deg); }

.content-section { padding-top: 62px; }
.mood-section { padding-top: 24px; padding-bottom: 62px; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-bottom: 22px; }
.section-heading h2 { margin: 0; font-size: clamp(1.55rem, 3vw, 2.25rem); }
.text-link { padding: 7px 0; color: var(--blue-dark); background: transparent; font-size: .73rem; font-weight: 800; }
.text-link span { margin-left: 5px; }
.mood-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.mood-card { position: relative; min-height: 155px; padding: 20px 22px; overflow: hidden; border: 1px solid rgba(37,76,88,.07); border-radius: 25px; background: #fff; box-shadow: 0 10px 25px rgba(35,66,73,.07); text-align: left; transition: transform .2s, box-shadow .2s, border-color .2s; }
.mood-card::after { content: ""; position: absolute; right: -24px; bottom: -34px; width: 92px; height: 92px; border-radius: 50%; opacity: .55; transition: transform .25s; }
.mood-card:hover { border-color: rgba(63,143,181,.14); transform: translateY(-5px); box-shadow: 0 18px 38px rgba(35,66,73,.11); }
.mood-card:hover::after { transform: scale(1.12); }
.mood-card > span { position: relative; z-index: 1; display: block; margin-bottom: 14px; font-size: 2.35rem; line-height: 1; }
.mood-card strong, .mood-card small { display: block; }
.mood-card strong { position: relative; z-index: 1; margin-bottom: 5px; font-family: "Poppins", sans-serif; font-size: 1.06rem; }
.mood-card small { position: relative; z-index: 1; color: var(--muted); font-size: .7rem; }
.mood-card--green::after { background: var(--green-soft); }.mood-card--coral::after { background: var(--coral-soft); }.mood-card--blue::after { background: var(--blue-soft); }.mood-card--purple::after { background: #ebe5f4; }.mood-card--sun::after { background: var(--sun-soft); }.mood-card--mint::after { background: #dff2ec; }.mood-card--rose::after { background: #fbe1ea; }.mood-card--lagoon::after { background: #d9f2f3; }.mood-card--orange::after { background: #ffe4d4; }.mood-card--sky::after { background: #dceef8; }.mood-card--sand::after { background: #eee5d5; }.mood-card--lime::after { background: #e4f1ca; }

/* Toutes les thématiques */
.themes-view { padding-top: 10px; }
.themes-hero { position: relative; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr); min-height: 315px; overflow: hidden; border-radius: 32px; background: linear-gradient(125deg, #edf8f4 0%, #fff9e5 52%, #fff0f5 100%); }
.themes-hero-copy { position: relative; z-index: 2; align-self: center; padding: 34px 20px 38px 46px; }
.themes-back { margin-bottom: 20px; background: rgba(255,255,255,.76); box-shadow: 0 7px 20px rgba(65,87,96,.08); }
.themes-hero h1 { margin-bottom: 14px; font-size: clamp(2.35rem, 4.8vw, 4.1rem); line-height: 1.04; }
.themes-hero-copy > p:last-child { max-width: 660px; margin: 0; color: var(--ink-soft); font-size: .84rem; line-height: 1.65; }
.themes-hero-scene { position: relative; min-height: 285px; overflow: hidden; }
.themes-hero-scene::before, .themes-hero-scene::after { content: ""; position: absolute; border-radius: 50%; }
.themes-hero-scene::before { width: 345px; height: 345px; right: -20px; bottom: -220px; background: #91ccb5; box-shadow: -180px 55px 0 28px #b8ddc7; }
.themes-hero-scene::after { width: 205px; height: 205px; right: -65px; bottom: -110px; background: #67ad91; }
.themes-scene-sun, .themes-scene-cloud, .themes-scene-kite, .themes-scene-child { position: absolute; z-index: 2; line-height: 1; }.themes-scene-sun { right: 38px; top: 28px; font-size: 3.7rem; filter: drop-shadow(0 8px 12px rgba(229,179,57,.2)); }.themes-scene-cloud { left: 6%; top: 72px; font-size: 4rem; }.themes-scene-kite { right: 45%; top: 36px; font-size: 2.7rem; transform: rotate(-9deg); }.themes-scene-child { right: 87px; bottom: 32px; font-size: 6.6rem; filter: drop-shadow(0 12px 15px rgba(45,96,81,.14)); }
.themes-hero-scene i, .themes-hero-scene b { position: absolute; z-index: 3; bottom: 49px; width: 13px; height: 31px; border-radius: 80% 20% 70% 30%; background: var(--sun); transform: rotate(24deg); }.themes-hero-scene i { left: 15%; }.themes-hero-scene b { left: 24%; height: 41px; bottom: 34px; background: var(--coral); transform: rotate(-18deg); }
.themes-catalog { padding-top: 47px; }
.themes-heading { max-width: 680px; margin: 0 auto 29px; text-align: center; }.themes-heading h2 { margin: 4px 0 9px; font-size: clamp(1.9rem, 3.5vw, 2.75rem); }.themes-heading > p:last-child { margin: 0; color: var(--muted); font-size: .74rem; line-height: 1.55; }
.themes-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.theme-card { display: flex; min-width: 0; min-height: 190px; flex-direction: column; }.theme-card > span { margin-bottom: 18px; }.theme-card strong { max-width: 190px; }.theme-card > b { position: relative; z-index: 1; display: flex; align-items: center; gap: 5px; margin-top: auto; padding-top: 19px; color: var(--blue-dark); font-size: .61rem; font-weight: 900; }.theme-card > b i { font-style: normal; transition: transform .18s; }.theme-card:hover > b i { transform: translateX(4px); }
.activity-rail { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(265px, 31%); gap: 15px; padding: 2px 2px 16px; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none; }

.activity-card { position: relative; overflow: hidden; border: 1px solid rgba(35,77,88,.09); border-radius: 24px; background: #fff; box-shadow: var(--shadow-sm); scroll-snap-align: start; transition: transform .2s, box-shadow .2s; }
.activity-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.activity-photo { position: relative; height: 188px; overflow: hidden; background: linear-gradient(145deg, var(--blue-soft), var(--green-soft)); cursor: pointer; }
.activity-fallback { position: absolute; inset: 0; display: grid; place-items: center; font-size: 3.2rem; }
.activity-photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.activity-card:hover .activity-photo img { transform: scale(1.035); }
.activity-photo::after { content: ""; position: absolute; inset: 45% 0 0; background: linear-gradient(transparent, rgba(25,45,49,.2)); pointer-events: none; }
.activity-badge { position: absolute; z-index: 2; left: 12px; top: 12px; padding: 6px 9px; border-radius: 999px; background: rgba(255,255,255,.92); box-shadow: 0 5px 12px rgba(31,53,55,.1); font-size: .61rem; font-weight: 800; }
.favorite-button { position: absolute; z-index: 3; top: 11px; right: 11px; display: grid; place-items: center; width: 37px; height: 37px; padding: 0; border-radius: 50%; color: var(--ink); background: rgba(255,255,255,.94); box-shadow: 0 5px 14px rgba(36,56,59,.12); }
.favorite-button svg { width: 18px; height: 18px; }
.favorite-button.is-favorite { color: #fff; background: var(--rose); }
.favorite-button.is-favorite svg { fill: currentColor; }
.activity-card-body { padding: 16px 17px 17px; }
.activity-meta { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.activity-category { color: var(--blue); font-size: .62rem; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }
.rating { display: flex; align-items: center; gap: 4px; font-size: .68rem; font-weight: 800; }
.rating svg { width: 13px; height: 13px; fill: var(--sun); stroke: #d8ad34; }
.activity-card h3 { margin: 0 0 7px; font-family: "Poppins", sans-serif; font-size: 1.07rem; line-height: 1.17; letter-spacing: -.02em; }
.activity-location { margin-bottom: 13px; color: var(--muted); font-size: .68rem; }
.activity-facts { display: flex; align-items: center; justify-content: space-between; padding-top: 12px; border-top: 1px solid #edf1f0; font-size: .65rem; }
.activity-facts span { display: flex; align-items: center; gap: 4px; color: var(--ink-soft); }
.activity-facts svg { width: 14px; height: 14px; color: var(--blue); }
.activity-facts strong { font-size: .75rem; }

.guide-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.guide-grid > button { display: grid; grid-template-columns: 120px 1fr; align-items: center; gap: 23px; min-height: 160px; padding: 20px; border: 1px solid var(--line); border-radius: 26px; background: #fff; box-shadow: var(--shadow-sm); text-align: left; }
.guide-grid > button:hover { border-color: rgba(63,143,181,.25); }
.guide-illustration { display: grid; place-items: center; height: 116px; border-radius: 20px; font-size: 2.8rem; }
.guide-illustration--road { background: linear-gradient(145deg, var(--blue-soft), #dff0e2); }.guide-illustration--magic { background: linear-gradient(145deg, #fde5e0, #eee4f6); }
.guide-grid strong, .guide-grid small, .guide-grid b { display: block; }
.guide-grid strong { margin-bottom: 6px; font-family: "Poppins", sans-serif; font-size: 1.15rem; }
.guide-grid small { margin-bottom: 13px; color: var(--muted); line-height: 1.5; }
.guide-grid b { color: var(--blue-dark); font-size: .7rem; }

.adventure-journal-section { padding-top: 62px; }
.adventure-journal { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 30px; padding: 29px 31px; overflow: hidden; border: 1px solid rgba(37,76,88,.07); border-radius: 30px; background: #fff; box-shadow: 0 10px 25px rgba(35,66,73,.06); }
.adventure-journal::after { content: ""; position: absolute; right: -80px; top: -115px; width: 270px; height: 270px; border-radius: 50%; background: linear-gradient(145deg, rgba(253,231,223,.72), rgba(223,241,246,.55)); pointer-events: none; }
.adventure-journal-copy, .adventure-journal-badges { position: relative; z-index: 1; }
.adventure-journal-copy h2 { margin: 0 0 8px; font-size: clamp(1.55rem, 3vw, 2.2rem); }
.adventure-journal-copy h2 span { display: inline-block; margin-right: 5px; }
.adventure-journal-copy > p:last-child { max-width: 610px; margin: 0; color: var(--muted); font-size: .76rem; line-height: 1.55; }
.adventure-journal-badges { display: flex; justify-content: flex-end; gap: 9px; flex-wrap: wrap; }
.adventure-journal-badges button { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px; border-radius: 999px; font-size: .68rem; font-weight: 800; white-space: nowrap; transition: transform .18s, filter .18s; }
.adventure-journal-badges button:hover { filter: brightness(.98); transform: translateY(-2px); }
.adventure-journal-badges button:nth-child(1) { background: var(--sun); }
.adventure-journal-badges button:nth-child(2) { background: #a7ddc4; }
.adventure-journal-badges button:nth-child(3) { background: #cbe9f7; }

/* Search */
.search-view, .match-view, .map-view, .route-view, .planning-view { padding-top: 30px; }
.subview-heading { display: flex; align-items: center; gap: 17px; margin-bottom: 26px; }
.subview-heading h1, .map-header h1, .planning-header h1 { font-size: clamp(2.1rem, 4vw, 3.25rem); }
.back-button { display: grid; flex: 0 0 43px; place-items: center; height: 43px; border: 1px solid var(--line); border-radius: 50%; background: #fff; box-shadow: var(--shadow-sm); }
.search-toolbar { display: grid; grid-template-columns: 1fr auto; gap: 10px; }
.search-input { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; min-height: 58px; padding: 0 16px; border: 1px solid var(--line); border-radius: 18px; background: #fff; box-shadow: var(--shadow-sm); }
.search-input > svg { color: var(--blue); }
.search-input input { min-width: 0; height: 46px; border: 0; outline: 0; background: transparent; }
.search-input button { display: grid; place-items: center; width: 31px; height: 31px; border-radius: 50%; background: #f1f5f4; }
.search-input button svg { width: 15px; height: 15px; }
.filter-trigger { position: relative; display: flex; align-items: center; justify-content: center; gap: 7px; min-width: 115px; padding: 0 16px; border: 1px solid rgba(63,143,181,.22); border-radius: 18px; color: var(--blue-dark); background: var(--blue-soft); font-size: .75rem; font-weight: 800; }
.filter-trigger b { position: absolute; right: -6px; bottom: -6px; display: flex; align-items: center; justify-content: center; box-sizing: border-box; min-width: 22px; height: 22px; padding: 0 5px; border: 2px solid var(--paper); border-radius: 999px; color: #fff; background: var(--rose); box-shadow: 0 5px 11px rgba(69,51,63,.22); font-size: .58rem; line-height: 1; }
.search-chips, .map-filter-row { display: flex; gap: 8px; padding: 16px 0 6px; overflow-x: auto; scrollbar-width: none; }
.search-chips button, .map-filter-row button { flex: 0 0 auto; padding: 9px 14px; border: 1px solid var(--line); border-radius: 999px; background: #fff; font-size: .68rem; font-weight: 700; }
.search-chips button.is-active, .map-filter-row button.is-active { color: #fff; border-color: transparent; background: linear-gradient(135deg, var(--blue), var(--lagoon)); }
.results-heading { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 25px 0 16px; }
.results-heading p { margin: 0; color: var(--muted); font-size: .75rem; }.results-heading p strong { color: var(--ink); font-size: .94rem; }
.results-controls { display: flex; align-items: center; gap: 10px; }.results-heading label { color: var(--muted); font-size: .68rem; }
.results-heading select { padding: 6px 24px 6px 6px; border: 0; outline: 0; color: var(--ink); background: transparent; font-weight: 700; }
.favorite-view-toggle { display: flex; gap: 3px; padding: 3px; border: 1px solid var(--line); border-radius: 12px; background: #fff; box-shadow: var(--shadow-sm); }.favorite-view-toggle[hidden] { display: none; }.favorite-view-toggle button { display: grid; place-items: center; width: 34px; height: 32px; border-radius: 9px; color: var(--muted); background: transparent; transition: color .18s, background .18s, box-shadow .18s; }.favorite-view-toggle button:hover { color: var(--blue-dark); }.favorite-view-toggle button.is-active { color: #fff; background: linear-gradient(135deg, var(--blue), var(--lagoon)); box-shadow: 0 6px 13px rgba(63,143,181,.2); }.favorite-view-toggle svg { width: 16px; height: 16px; }
.activity-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 17px; }
.activity-grid--list { grid-template-columns: 1fr; gap: 10px; }
.favorite-list-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 13px; min-width: 0; padding: 10px; border: 1px solid rgba(35,77,88,.09); border-radius: 19px; background: #fff; box-shadow: var(--shadow-sm); transition: border-color .18s, box-shadow .18s, transform .18s; }.favorite-list-item:hover { border-color: rgba(63,143,181,.22); box-shadow: var(--shadow-md); transform: translateY(-2px); }
.favorite-list-main { display: grid; grid-template-columns: 116px minmax(0, 1fr); align-items: center; gap: 14px; min-width: 0; padding: 0; color: inherit; background: transparent; text-align: left; }.favorite-list-main:focus-visible { outline: 3px solid rgba(63,143,181,.28); outline-offset: 4px; border-radius: 13px; }
.favorite-list-thumb { position: relative; display: block; width: 116px; height: 84px; overflow: hidden; border-radius: 13px; background: linear-gradient(145deg, var(--blue-soft), var(--green-soft)); }.favorite-list-thumb img { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }.favorite-list-item:hover .favorite-list-thumb img { transform: scale(1.04); }.favorite-list-thumb .activity-fallback { font-size: 2rem; }.favorite-list-thumb .activity-badge { z-index: 2; left: 7px; top: 7px; max-width: calc(100% - 14px); padding: 4px 6px; overflow: hidden; font-size: .48rem; text-overflow: ellipsis; white-space: nowrap; }
.favorite-list-copy { display: block; min-width: 0; }.favorite-list-copy .activity-meta { justify-content: flex-start; gap: 13px; margin-bottom: 4px; }.favorite-list-copy > strong, .favorite-list-copy > small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.favorite-list-copy > strong { margin-bottom: 3px; font-family: "Poppins", sans-serif; font-size: .9rem; }.favorite-list-copy > small { color: var(--muted); font-size: .61rem; }
.favorite-list-facts { display: flex; align-items: center; gap: 13px; margin-top: 9px; font-size: .59rem; }.favorite-list-facts > span { display: flex; align-items: center; gap: 4px; color: var(--ink-soft); }.favorite-list-facts svg { width: 13px; height: 13px; color: var(--blue); }.favorite-list-facts b { color: var(--ink); font-size: .65rem; }
.favorite-list-actions { display: flex; align-items: center; gap: 7px; }.favorite-list-actions button { display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 42px; border-radius: 13px; font-size: .61rem; font-weight: 900; transition: transform .18s, box-shadow .18s; }.favorite-list-plan { padding: 0 12px; color: var(--blue-dark); background: var(--blue-soft); }.favorite-list-heart { width: 42px; padding: 0; color: #fff; background: var(--rose); }.favorite-list-actions svg { width: 16px; height: 16px; }.favorite-list-heart svg { fill: currentColor; }.favorite-list-actions button:hover { box-shadow: 0 8px 17px rgba(42,76,85,.12); transform: translateY(-1px); }
.infinite-loader { display: flex; align-items: center; justify-content: center; gap: 5px; min-height: 90px; color: var(--muted); }
.infinite-loader span { width: 7px; height: 7px; border-radius: 50%; background: var(--blue); animation: bounce 1.1s infinite; }.infinite-loader span:nth-child(2) { animation-delay: .14s; }.infinite-loader span:nth-child(3) { animation-delay: .28s; }.infinite-loader small { margin-left: 7px; }
@keyframes bounce { 0%, 60%, 100% { transform: translateY(0); opacity: .45; } 30% { transform: translateY(-5px); opacity: 1; } }
.empty-state { padding: 70px 20px; border: 1px dashed rgba(63,143,181,.3); border-radius: 25px; background: #f8fcfb; text-align: center; }.empty-state > span { font-size: 3rem; }.empty-state h2 { margin: 12px 0 6px; }.empty-state p { color: var(--muted); }

/* Match */
.view-heading { max-width: 720px; margin-bottom: 28px; }.view-heading--center { margin-left: auto; margin-right: auto; text-align: center; }.view-heading h1 { margin-bottom: 12px; }.view-heading > p:last-child { color: var(--muted); line-height: 1.55; }
.match-view .view-heading { margin-bottom: 18px; }
.match-view .view-heading h1 { margin-bottom: 0; }
.match-preferences { display: flex; justify-content: center; gap: 7px; margin-bottom: 18px; }
.match-preferences span, .match-preferences button { padding: 7px 10px; border-radius: 999px; background: #f0f6f5; color: var(--ink-soft); font-size: .63rem; font-weight: 700; }.match-preferences button { color: var(--blue-dark); background: var(--blue-soft); }
.match-deck { position: relative; width: min(100%, 500px); height: 440px; margin: 0 auto; perspective: 1000px; }
.match-card { position: absolute; inset: 0; touch-action: none; user-select: none; overflow: hidden; border: 5px solid #fff; border-radius: 31px; background: #fff; box-shadow: var(--shadow-lg); transform-origin: 50% 105%; transition: transform .3s ease, opacity .3s ease; }
.match-card:nth-last-child(2) { transform: translateY(9px) scale(.97) rotate(-1deg); opacity: .86; }.match-card:nth-last-child(3) { transform: translateY(18px) scale(.94) rotate(1deg); opacity: .65; }
.match-card.is-dragging { transition: none; }
.match-card-photo { position: absolute; inset: 0; }.match-card-photo img { width: 100%; height: 100%; object-fit: cover; pointer-events: none; }.match-card-photo::after { content: ""; position: absolute; inset: 30% 0 0; background: linear-gradient(transparent, rgba(18,35,38,.9)); }
.match-stamp { position: absolute; z-index: 3; top: 40px; padding: 8px 14px; border: 4px solid currentColor; border-radius: 10px; opacity: 0; font-size: 1.35rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }.match-stamp--yes { left: 25px; color: #fff; background: var(--green); transform: rotate(-10deg); }.match-stamp--no { right: 25px; color: #fff; background: var(--coral); transform: rotate(10deg); }
.match-card-content { position: absolute; z-index: 2; inset: auto 0 0; padding: 30px 27px 25px; color: #fff; }
.match-card-content > span { display: inline-block; padding: 5px 9px; border-radius: 999px; background: rgba(255,255,255,.2); backdrop-filter: blur(9px); font-size: .62rem; font-weight: 800; }
.match-card-content h2 { margin: 13px 0 5px; color: #fff; font-size: 2rem; line-height: 1; }.match-card-content p { margin-bottom: 18px; color: rgba(255,255,255,.82); font-size: .75rem; }
.match-card-facts { display: flex; gap: 16px; padding-top: 15px; border-top: 1px solid rgba(255,255,255,.25); }.match-card-facts span { display: flex; align-items: center; gap: 5px; font-size: .68rem; }.match-card-facts svg { width: 15px; height: 15px; color: var(--sun); }
.match-actions { position: fixed; z-index: 42; left: 50%; bottom: 108px; display: flex; align-items: center; justify-content: center; gap: 15px; width: min(calc(100% - 30px), 430px); margin: 0; transform: translateX(-50%); }
.match-action { display: grid; place-items: center; width: 57px; height: 57px; border: 1px solid var(--line); border-radius: 50%; background: #fff; box-shadow: var(--shadow-sm); }.match-action svg { width: 24px; height: 24px; }.match-action--yes, .match-action--no { width: 68px; height: 68px; }.match-action--yes { color: #fff; background: linear-gradient(145deg, var(--rose), var(--coral)); border: 0; box-shadow: 0 14px 30px rgba(229,111,148,.28); }.match-action--yes svg { fill: currentColor; }.match-action--no { color: var(--coral); }.match-action--undo, .match-action--details { width: 47px; height: 47px; color: var(--blue); }.match-action--undo svg, .match-action--details svg { width: 19px; height: 19px; }
.gesture-hint { display: flex; justify-content: space-between; width: min(100%, 420px); margin: 40px auto 0; color: var(--muted); font-size: .61rem; }
.match-complete { position: absolute; inset: 0; display: grid; place-items: center; padding: 38px; border: 1px solid var(--line); border-radius: 31px; background: linear-gradient(145deg, #fff, #f1faf7); box-shadow: var(--shadow-md); text-align: center; }.match-complete span { font-size: 3rem; }.match-complete h2 { margin: 15px 0 8px; }.match-complete p { color: var(--muted); line-height: 1.5; }

/* Map */
.planning-header { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.map-view { position: fixed; z-index: 10; inset: 0 0 var(--map-nav-clearance); padding: 0 !important; }
.community-map { position: absolute; inset: 0; min-height: 0; margin: 0; overflow: hidden; border: 0; border-radius: 0; background: #edf3f1; box-shadow: none; }
.leaflet-map { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; }
.leaflet-container { background: #edf3f1; font-family: "Nunito", sans-serif; }
.leaflet-tile-pane { filter: none; }
.leaflet-tile { outline: 1px solid transparent; -webkit-backface-visibility: hidden; backface-visibility: hidden; image-rendering: auto; }
.leaflet-control-zoom { overflow: hidden; border: 0 !important; border-radius: 13px !important; box-shadow: var(--shadow-sm) !important; }
.leaflet-control-zoom a { display: grid !important; place-items: center; width: 36px !important; height: 36px !important; color: var(--blue-dark) !important; border: 0 !important; background: rgba(255,255,255,.96) !important; font-family: "Nunito", sans-serif !important; line-height: 1 !important; }
.leaflet-control-zoom a + a { border-top: 1px solid var(--line) !important; }
.leaflet-control-attribution { padding: 2px 5px !important; color: #6f8085; background: rgba(255,255,255,.76) !important; font-size: 8px !important; backdrop-filter: blur(7px); }
.leaflet-control-attribution a { color: var(--blue-dark); }
.jevoeux-div-icon, .jevoeux-cluster-div-icon, .user-location-icon { border: 0 !important; background: transparent !important; }
.user-location-icon { width: 18px !important; height: 18px !important; }
.pin-marker { position: relative; width: 110px; height: 72px; }
.pin-bubble { display: grid; place-items: center; width: 47px; height: 47px; border: 3px solid #fff; border-radius: 50% 50% 50% 12px; color: #fff; background: var(--rose); box-shadow: 0 7px 11px rgba(42,72,73,.23); font-size: 1.16rem; transform: rotate(-45deg); transition: transform .18s ease, box-shadow .18s ease; }
.pin-emoji { transform: rotate(45deg); }
.pin-marker:hover .pin-bubble { box-shadow: 0 10px 17px rgba(42,72,73,.27); transform: translateY(-2px) rotate(-45deg) scale(1.06); }
.pin-community .pin-bubble { background: var(--green); }
.pin-private .pin-bubble { background: var(--purple); }
.pin-label { position: absolute; left: -25px; top: 50px; max-width: 100px; padding: 4px 7px; overflow: hidden; border: 1px solid rgba(32,52,61,.06); border-radius: 8px; color: var(--ink); background: rgba(255,255,255,.96); box-shadow: 0 4px 10px rgba(42,72,73,.08); font-size: .54rem; font-weight: 800; text-overflow: ellipsis; text-rendering: optimizeLegibility; white-space: nowrap; }
.map-cluster { position: relative; display: grid; place-items: center; align-content: center; width: 62px; height: 62px; border: 4px solid rgba(255,255,255,.94); border-radius: 50%; color: #fff; background: linear-gradient(145deg, var(--rose), var(--coral)); box-shadow: 0 0 0 7px rgba(229,111,148,.15), 0 11px 23px rgba(42,72,73,.25); transition: transform .18s ease, box-shadow .18s ease; }
.map-cluster::after { content: ""; position: absolute; inset: -10px; border: 1px solid rgba(229,111,148,.24); border-radius: inherit; }
.map-cluster strong, .map-cluster small { display: block; line-height: 1; }.map-cluster strong { font-family: "Poppins", sans-serif; font-size: 1rem; }.map-cluster small { margin-top: 4px; color: rgba(255,255,255,.88); font-size: .45rem; font-weight: 800; letter-spacing: .02em; }
.map-cluster--community { background: linear-gradient(145deg, var(--green), #65be95); box-shadow: 0 0 0 7px rgba(85,173,135,.16), 0 11px 23px rgba(42,72,73,.25); }.map-cluster--private { background: linear-gradient(145deg, var(--purple), #987fd5); box-shadow: 0 0 0 7px rgba(130,104,191,.15), 0 11px 23px rgba(42,72,73,.25); }.map-cluster--mixed { background: linear-gradient(145deg, var(--blue), var(--rose)); }
.jevoeux-cluster-div-icon:hover .map-cluster, .jevoeux-cluster-div-icon:focus .map-cluster { box-shadow: 0 0 0 9px rgba(229,111,148,.17), 0 14px 27px rgba(42,72,73,.29); transform: scale(1.06); }
.user-location-dot { position: relative; display: block; box-sizing: border-box; width: 18px; min-width: 18px; max-width: 18px; height: 18px; min-height: 18px; max-height: 18px; aspect-ratio: 1; border: 3px solid #fff; border-radius: 50%; background: #3f8fb5; box-shadow: 0 0 0 7px rgba(63,143,181,.16), 0 4px 10px rgba(35,77,89,.25); }
.user-location-dot::after { content: ""; position: absolute; inset: -9px; border: 2px solid rgba(63,143,181,.38); border-radius: 50%; animation: user-location-pulse 2.2s ease-out infinite; }
@keyframes user-location-pulse { 0% { opacity: .72; transform: scale(.68); } 72%, 100% { opacity: 0; transform: scale(1.5); } }
.map-overlay-panel { position: absolute; z-index: 800; top: 102px; left: 50%; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 18px; width: min(calc(100% - 48px), 1160px); padding: 13px 14px 13px 18px; border: 1px solid rgba(37,76,88,.13); border-radius: 22px; background: rgba(255,255,255,.91); box-shadow: 0 18px 52px rgba(34,73,84,.17); backdrop-filter: blur(18px) saturate(1.15); transform: translateX(-50%); }
.map-header { min-width: 190px; }
.map-header .eyebrow { margin-bottom: 2px; font-size: .55rem; }
.map-header h1 { margin: 0; font-size: 1.22rem; line-height: 1.1; letter-spacing: -.035em; }
.map-filter-row { justify-self: center; display: flex; min-width: 0; gap: 6px; padding: 0; overflow-x: auto; scrollbar-width: none; }
.map-filter-row button { flex: 0 0 auto; padding: 9px 12px; border-color: transparent; background: rgba(237,244,243,.88); }
.map-filter-row button.is-active { box-shadow: 0 7px 16px rgba(63,143,181,.18); }
.map-action-buttons { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.car-mode-button { position: relative; display: flex; align-items: center; gap: 8px; min-height: 46px; padding: 0 13px 0 7px; border: 1px solid rgba(63,143,181,.16); border-radius: 15px; color: var(--blue-dark); background: rgba(239,248,250,.96); box-shadow: 0 9px 22px rgba(63,143,181,.12); font-size: .7rem; font-weight: 800; white-space: nowrap; transition: color .2s ease, background .2s ease, box-shadow .2s ease, transform .2s ease; }
.car-mode-icon { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 11px; background: #fff; font-size: 1rem; box-shadow: inset 0 0 0 1px rgba(63,143,181,.1); }
.car-mode-button[aria-pressed="true"] { color: #fff; border-color: transparent; background: linear-gradient(135deg, var(--green), #66c398); box-shadow: 0 12px 27px rgba(85,173,135,.28); }
.car-mode-button[aria-pressed="true"]::after { content: ""; position: absolute; right: 7px; top: 6px; width: 6px; height: 6px; border: 2px solid #fff; border-radius: 50%; background: #5bd394; animation: car-mode-pulse 1.7s ease-out infinite; }
.car-mode-button[aria-pressed="true"] .car-mode-icon { background: rgba(255,255,255,.2); box-shadow: none; }
@keyframes car-mode-pulse { 65%, 100% { box-shadow: 0 0 0 8px rgba(255,255,255,0); } 0% { box-shadow: 0 0 0 0 rgba(255,255,255,.58); } }
.add-place-button { display: flex; align-items: center; gap: 9px; min-height: 46px; padding: 0 14px 0 8px; border-radius: 15px; color: #fff; background: linear-gradient(135deg, var(--rose), var(--coral)); box-shadow: 0 12px 26px rgba(229,111,148,.26); font-size: .7rem; font-weight: 800; white-space: nowrap; }
.add-place-icon { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid rgba(255,255,255,.25); border-radius: 11px; background: rgba(255,255,255,.17); }
.add-place-button svg { width: 19px; height: 19px; stroke-width: 2; }
.car-mode-panel { position: absolute; z-index: 830; top: 176px; right: max(24px, calc((100% - 1160px) / 2 + 8px)); width: min(calc(100% - 30px), 340px); padding: 17px; border: 1px solid rgba(37,76,88,.13); border-radius: 22px; color: var(--ink); background: rgba(255,255,255,.97); box-shadow: 0 22px 55px rgba(34,73,84,.22); backdrop-filter: blur(18px) saturate(1.12); animation: car-panel-in .22s ease-out; }
.car-mode-panel[hidden] { display: none; }
@keyframes car-panel-in { from { opacity: 0; transform: translateY(-8px) scale(.98); } }
.car-mode-heading { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 11px; }.car-mode-heading > span { display: grid; place-items: center; width: 43px; height: 43px; border-radius: 14px; background: var(--blue-soft); font-size: 1.25rem; }.car-mode-heading .eyebrow { margin-bottom: 1px; }.car-mode-heading h2 { margin: 0; font-size: 1.03rem; }.car-mode-heading button { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; color: var(--muted); background: #f1f5f4; }.car-mode-heading svg { width: 14px; height: 14px; }
.car-mode-status { display: flex; align-items: center; gap: 8px; min-height: 34px; margin: 14px 0 12px; padding: 8px 10px; border-radius: 11px; color: var(--muted); background: #f4f7f6; font-size: .61rem; font-weight: 700; }.car-mode-status i { flex: 0 0 8px; width: 8px; height: 8px; border-radius: 50%; background: #aab7b6; }.car-mode-panel.is-active .car-mode-status { color: var(--green-dark); background: var(--green-soft); }.car-mode-panel.is-active .car-mode-status i { background: var(--green); box-shadow: 0 0 0 5px rgba(85,173,135,.14); }.car-mode-panel.has-error .car-mode-status { color: #b64f55; background: #fff0f0; }.car-mode-panel.has-error .car-mode-status i { background: var(--coral); box-shadow: 0 0 0 5px rgba(229,111,118,.12); }
.car-mode-frequency { display: block; padding: 12px; border: 1px solid var(--line); border-radius: 14px; background: #fbfdfc; }.car-mode-frequency > span { display: flex; align-items: center; justify-content: space-between; gap: 10px; }.car-mode-frequency b { font-size: .65rem; }.car-mode-frequency output { padding: 4px 7px; border-radius: 8px; color: var(--blue-dark); background: var(--blue-soft); font-size: .58rem; font-weight: 800; }.car-mode-frequency input { width: 100%; height: 22px; margin: 10px 0 1px; accent-color: var(--blue); cursor: pointer; }.car-mode-frequency small { display: flex; justify-content: space-between; color: var(--muted); font-size: .49rem; }
.car-mode-toggle { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 44px; margin-top: 11px; border-radius: 13px; color: #fff; background: linear-gradient(135deg, var(--blue), var(--lagoon)); box-shadow: 0 11px 24px rgba(63,143,181,.2); font-size: .67rem; }.car-mode-toggle > span { font-size: .66rem; }.car-mode-panel.is-active .car-mode-toggle { color: #a3464c; background: #fff0f0; box-shadow: none; }.car-mode-panel.is-active .car-mode-toggle > span { font-size: .8rem; }
.community-map.is-car-mode .user-location-dot { background: var(--green); box-shadow: 0 0 0 9px rgba(85,173,135,.18), 0 4px 12px rgba(35,77,89,.25); }.community-map.is-car-mode .user-location-dot::after { border-color: rgba(85,173,135,.5); animation-duration: 1.4s; }
.pin-placement-overlay { position: absolute; z-index: 850; inset: 0; pointer-events: none; }
.pin-placement-target { position: absolute; left: 50%; top: 50%; width: 82px; height: 82px; border: 2px solid rgba(229,111,148,.62); border-radius: 50%; background: rgba(255,255,255,.14); box-shadow: 0 0 0 10px rgba(255,255,255,.38), 0 10px 32px rgba(42,72,73,.18); backdrop-filter: blur(2px); transform: translate(-50%, -50%); animation: target-breathe 1.9s ease-in-out infinite; }
.pin-placement-target::before, .pin-placement-target::after, .pin-placement-target > i { content: ""; position: absolute; left: 50%; top: 50%; background: #fff; box-shadow: 0 1px 4px rgba(35,65,71,.24); transform: translate(-50%, -50%); }
.pin-placement-target::before { width: 108px; height: 2px; }.pin-placement-target::after { width: 2px; height: 108px; }.pin-placement-target > i { z-index: 2; width: 9px; height: 9px; border: 3px solid #fff; border-radius: 50%; background: var(--rose); box-shadow: 0 0 0 5px rgba(229,111,148,.2), 0 3px 9px rgba(48,76,81,.24); }
.pin-placement-target > span { position: absolute; inset: 12px; z-index: 1; border: 1px dashed rgba(229,111,148,.78); border-radius: 50%; }
@keyframes target-breathe { 50% { box-shadow: 0 0 0 16px rgba(255,255,255,.2), 0 12px 35px rgba(42,72,73,.2); transform: translate(-50%, -50%) scale(1.035); } }
.pin-placement-card { position: absolute; left: 50%; bottom: 18px; display: grid; grid-template-columns: minmax(0, 1fr) 48px 48px; align-items: center; gap: 8px; width: min(calc(100% - 30px), 520px); padding: 9px; border: 1px solid rgba(37,76,88,.13); border-radius: 19px; background: rgba(255,255,255,.96); box-shadow: 0 20px 55px rgba(34,73,84,.23); backdrop-filter: blur(18px) saturate(1.12); pointer-events: auto; transform: translateX(-50%); animation: card-up .24s ease-out; }
.pin-placement-copy { display: flex; min-width: 0; align-items: center; gap: 10px; padding-left: 4px; }.pin-placement-copy > span { display: grid; flex: 0 0 39px; place-items: center; height: 39px; border-radius: 13px; background: var(--coral-soft); font-size: 1.1rem; }.pin-placement-copy > div { display: grid; min-width: 0; gap: 1px; }.pin-placement-copy strong { font-family: "Poppins", sans-serif; font-size: .72rem; }.pin-placement-copy small { color: var(--muted); font-size: .58rem; }.pin-placement-copy output { margin-top: 2px; color: var(--blue-dark); font-size: .54rem; font-weight: 800; }
.pin-placement-confirm, .pin-placement-cancel { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; color: #fff; box-shadow: 0 9px 20px rgba(41,76,83,.14); }.pin-placement-confirm { background: linear-gradient(135deg, var(--green), #69c79d); }.pin-placement-cancel { background: linear-gradient(135deg, var(--coral), #e56369); }.pin-placement-confirm span { font-size: 1.35rem; font-weight: 900; }.pin-placement-cancel svg { width: 20px; height: 20px; stroke-width: 2.5; }
.community-map :is(.map-overlay-panel, .locate-button, .map-legend) { transition: opacity .2s ease, transform .2s ease; }.community-map.is-placing-pin .map-overlay-panel { opacity: 0; pointer-events: none; transform: translate(-50%, -8px); }.community-map.is-placing-pin :is(.locate-button, .map-legend) { opacity: 0; pointer-events: none; transform: translateY(8px); }.community-map.is-placing-pin .leaflet-marker-pane { pointer-events: none; }.community-map.is-placing-pin .leaflet-container { cursor: grab; }.community-map.is-placing-pin .leaflet-container:active { cursor: grabbing; }
.place-position-summary { display: flex; align-items: center; gap: 10px; margin: -9px 0 2px; padding: 10px 12px; border: 1px solid rgba(85,173,135,.2); border-radius: 13px; color: var(--green-dark); background: var(--green-soft); }.place-position-summary svg { flex: 0 0 auto; width: 19px; height: 19px; }.place-position-summary span { display: grid; gap: 1px; }.place-position-summary small { color: var(--muted); font-size: .53rem; }.place-position-summary strong { font-size: .65rem; }
.map-view .leaflet-top { top: 183px; }
.locate-button { position: absolute; z-index: 700; right: 15px; bottom: 16px; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 14px; color: var(--blue); background: #fff; box-shadow: var(--shadow-sm); }.locate-button svg { width: 20px; height: 20px; }
.map-legend { position: absolute; z-index: 700; left: 15px; bottom: 16px; display: flex; gap: 13px; padding: 8px 11px; border-radius: 11px; background: rgba(255,255,255,.9); backdrop-filter: blur(10px); font-size: .56rem; }.map-legend span { display: flex; align-items: center; gap: 4px; }.map-legend i { width: 8px; height: 8px; border-radius: 50%; background: var(--rose); }.map-legend .legend-community { background: var(--green); }.map-legend .legend-private { background: var(--purple); }
.map-place-card { position: fixed; z-index: 900; left: 50%; bottom: calc(var(--map-nav-clearance) + 14px); width: min(calc(100% - 28px), 520px); padding: 17px; border: 1px solid var(--line); border-radius: 23px; background: rgba(255,255,255,.97); box-shadow: var(--shadow-lg); transform: translateX(-50%); animation: card-up .24s ease-out; }.map-place-card[hidden] { display: none; }
@keyframes card-up { from { opacity: 0; transform: translate(-50%, 15px); } }
.map-place-top { display: grid; grid-template-columns: auto 1fr auto; gap: 12px; align-items: center; }.map-place-icon { display: grid; place-items: center; width: 49px; height: 49px; border-radius: 16px; background: var(--green-soft); font-size: 1.35rem; }.map-place-top h3 { margin: 0 0 3px; font-family: "Poppins", sans-serif; font-size: 1rem; }.map-place-top p { margin: 0; color: var(--muted); font-size: .64rem; }.map-place-close { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: #f1f5f4; }.map-place-close svg { width: 14px; height: 14px; }.map-place-note { margin: 14px 0 0; padding-top: 12px; border-top: 1px solid #edf0ef; color: var(--ink-soft); font-size: .7rem; line-height: 1.5; }.map-rating-row { display: flex; justify-content: space-between; align-items: center; margin-top: 13px; }.map-rating-row > span { color: var(--muted); font-size: .64rem; }.map-rating-buttons { display: flex; gap: 3px; }.map-rating-buttons button { padding: 4px; color: #c9d0cf; background: transparent; }.map-rating-buttons button.is-active, .map-rating-buttons button:hover { color: #e5b83d; }.map-rating-buttons svg { width: 17px; height: 17px; fill: currentColor; }
.map-comment-form { margin-top: 11px; }.map-comment-form label { display: block; margin-bottom: 5px; color: var(--muted); font-size: .6rem; }.map-comment-form > div { display: grid; grid-template-columns: 1fr auto; gap: 6px; }.map-comment-form input { min-width: 0; height: 36px; padding: 0 10px; border: 1px solid var(--line); border-radius: 10px; outline: 0; font-size: .65rem; }.map-comment-form button { padding: 0 11px; border-radius: 10px; color: #fff; background: var(--green); font-size: .62rem; font-weight: 800; }

/* Route */
.route-layout { display: grid; grid-template-columns: minmax(340px, .82fr) minmax(430px, 1.18fr); align-items: start; gap: 18px; }
.surface-card { border: 1px solid var(--line); border-radius: 27px; background: rgba(255,255,255,.93); box-shadow: var(--shadow-sm); }
.route-form { padding: 25px; }.route-form label > span, .form-modal label > span { display: block; margin-bottom: 7px; color: var(--ink-soft); font-size: .68rem; font-weight: 700; }.route-form button[disabled] { opacity: .72; cursor: wait; }
.field-route { position: relative; display: grid; gap: 9px; padding-left: 29px; }.field-route label { padding: 10px 13px; border: 1px solid var(--line); border-radius: 14px; background: #fafcfb; }.field-route small { display: block; margin-bottom: 2px; color: var(--muted); font-size: .58rem; }.field-route input { width: 100%; border: 0; outline: 0; background: transparent; font-weight: 700; }.route-dots { position: absolute; left: 4px; top: 25px; bottom: 25px; width: 12px; border-left: 2px dotted #bfcac9; }.route-dots i, .route-dots b { position: absolute; left: -6px; width: 11px; height: 11px; border: 3px solid var(--blue); border-radius: 50%; background: #fff; }.route-dots i { top: 0; }.route-dots b { bottom: 0; border-color: var(--coral); border-radius: 50% 50% 50% 10px; transform: rotate(-45deg); }
.form-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }.route-form .form-row { margin-top: 18px; }.route-form select, .form-modal input, .form-modal select, .form-modal textarea { width: 100%; min-height: 45px; padding: 0 12px; border: 1px solid var(--line); border-radius: 12px; outline: 0; color: var(--ink); background: #fff; }.form-modal textarea { padding-top: 11px; resize: vertical; }.route-form fieldset { margin: 21px 0; padding: 0; border: 0; }.route-form legend { margin-bottom: 10px; font-size: .7rem; font-weight: 800; }.facility-choices { display: grid; grid-template-columns: repeat(2, 1fr); gap: 7px; }.facility-choices input, .option-pills input, .check-grid input { position: absolute; opacity: 0; pointer-events: none; }.facility-choices span { display: block; padding: 10px; border: 1px solid var(--line); border-radius: 11px; color: var(--muted); background: #fff; font-size: .63rem; text-align: center; cursor: pointer; }.facility-choices input:checked + span { border-color: rgba(63,143,181,.34); color: var(--blue-dark); background: var(--blue-soft); font-weight: 700; }
.primary-button--wide { width: 100%; }.primary-button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; }.primary-button svg { width: 17px; height: 17px; }
.route-result { min-height: 560px; overflow: hidden; }.route-result-empty, .route-result-loading { display: grid; place-items: center; align-content: center; min-height: 560px; padding: 40px; text-align: center; }.route-result-empty > span { font-size: 3.4rem; }.route-result-empty h2, .route-result-loading h2 { margin: 17px 0 7px; }.route-result-empty p, .route-result-loading p { max-width: 330px; color: var(--muted); line-height: 1.5; }.route-result-error { background: linear-gradient(145deg, #fff, #fff8f5); }
.route-loading-wheel { width: 45px; height: 45px; border: 5px solid var(--blue-soft); border-top-color: var(--coral); border-radius: 50%; animation: route-spin .8s linear infinite; }@keyframes route-spin { to { transform: rotate(360deg); } }
.route-map { position: relative; z-index: 0; isolation: isolate; height: 250px; overflow: hidden; background: #e7f0ec; }.route-leaflet-map { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; }.route-map .leaflet-container { background: #e7f0ec; }.route-map .leaflet-control-zoom { margin: 10px !important; transform: scale(.88); transform-origin: top left; }.route-map .leaflet-control-attribution { font-size: 7px !important; }.route-map .leaflet-overlay-pane .route-path-dotted { stroke-linecap: round; }.route-map-div-icon { border: 0 !important; background: transparent !important; }.route-map-badge { display: grid; place-items: center; width: 40px; height: 40px; border: 4px solid #fff; border-radius: 50%; color: #fff; background: var(--blue); box-shadow: 0 0 0 2px rgba(255,255,255,.44), 0 7px 16px rgba(39,70,73,.28); font-size: .72rem; font-weight: 800; }.route-map-badge--stop { color: var(--ink); background: var(--sun); }.route-map-badge--end { background: var(--coral); }.route-map-estimate { position: absolute; z-index: 500; top: 10px; right: 10px; padding: 6px 9px; border-radius: 999px; color: var(--ink-soft); background: rgba(255,255,255,.92); box-shadow: var(--shadow-sm); backdrop-filter: blur(8px); font-size: .54rem; font-weight: 800; }.route-map-unavailable { position: absolute; inset: 0; display: grid; place-items: center; margin: 0; padding: 20px; color: var(--muted); background: #eef4f1; text-align: center; }
.route-summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; padding: 18px; }.route-summary div { padding: 12px; border-radius: 13px; background: #f5f9f8; text-align: center; }.route-summary strong, .route-summary small { display: block; }.route-summary strong { font-size: .9rem; }.route-summary small { margin-top: 3px; color: var(--muted); font-size: .57rem; }.route-stops { padding: 0 20px 20px; }.route-stops-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }.route-stops-heading h3 { margin: 0; font-family: "Poppins", sans-serif; }.route-live-source { flex: 0 0 auto; padding: 5px 8px; border-radius: 999px; color: var(--green-dark); background: var(--green-soft); font-size: .52rem; font-weight: 800; text-decoration: none; }.route-live-source:hover { text-decoration: underline; }.route-stop { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; width: calc(100% + 16px); margin: 0 -8px; padding: 11px 8px; border-top: 1px solid #edf0ef; border-radius: 12px; color: inherit; background: transparent; text-align: left; cursor: pointer; transition: background .18s ease, transform .18s ease; }.route-stop:hover { background: #f5f9f8; transform: translateX(2px); }.route-stop:focus-visible { outline: 3px solid rgba(63,143,181,.28); outline-offset: 2px; }.route-stop-icon { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; background: var(--green-soft); }.route-stop strong, .route-stop small { display: block; }.route-stop strong { font-size: .73rem; }.route-stop small { margin-top: 3px; color: var(--muted); font-size: .59rem; }.route-stop-meta { display: flex; align-items: center; gap: 4px; }.route-stop b { color: var(--blue-dark); font-size: .61rem; white-space: nowrap; }.route-stop-meta svg { width: 15px; height: 15px; color: var(--muted); }.route-stop-empty { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 11px; padding: 14px; border: 1px dashed rgba(63,143,181,.28); border-radius: 15px; background: #f8fbfa; }.route-stop-empty > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--blue-soft); font-size: 1.25rem; }.route-stop-empty strong, .route-stop-empty small { display: block; }.route-stop-empty strong { font-size: .68rem; }.route-stop-empty small { margin-top: 4px; color: var(--muted); font-size: .57rem; line-height: 1.45; }.route-save { width: 100%; margin-top: 11px; min-height: 43px; border-radius: 13px; color: var(--blue-dark); background: var(--blue-soft); font-size: .7rem; font-weight: 800; }

/* Planning */
.planning-header { margin-bottom: 21px; }.planning-header > div:last-child { display: flex; align-items: center; gap: 8px; }.secondary-button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 45px; padding: 0 15px; border: 1px solid var(--line); border-radius: 14px; color: var(--blue-dark); background: #fff; font-size: .7rem; font-weight: 800; }.secondary-button svg { width: 17px; height: 17px; }.planning-header :is(.secondary-button, .primary-button) { min-height: 48px; gap: 9px; padding: 0 15px 0 9px; }.planning-action-icon { display: grid; flex: 0 0 30px; place-items: center; width: 30px; height: 30px; border-radius: 10px; transition: transform .18s ease; }.planning-action-icon svg { width: 17px; height: 17px; stroke-width: 2; }.planning-action-label { line-height: 1; }.planning-header .secondary-button .planning-action-icon { color: var(--blue-dark); background: linear-gradient(145deg, #edf8fb, var(--blue-soft)); box-shadow: inset 0 0 0 1px rgba(63,143,181,.08); }.planning-header .primary-button .planning-action-icon { color: #fff; background: rgba(255,255,255,.18); box-shadow: inset 0 0 0 1px rgba(255,255,255,.13); }.planning-header :is(.secondary-button, .primary-button):hover .planning-action-icon { transform: scale(1.06); }
.calendar-card { position: relative; padding: 19px 22px; }.calendar-title { display: flex; justify-content: center; align-items: center; gap: 18px; margin-bottom: 16px; }.calendar-title strong { font-family: "Poppins", sans-serif; }.calendar-title button { display: grid; place-items: center; width: 31px; height: 31px; border-radius: 50%; background: #f1f5f4; }.calendar-title svg { width: 15px; height: 15px; }.calendar-expand-button { position: absolute; z-index: 2; right: 15px; top: 14px; display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid rgba(63,143,181,.14); border-radius: 12px; color: var(--blue-dark); background: var(--blue-soft); transition: transform .18s, box-shadow .18s; }.calendar-expand-button:hover { box-shadow: 0 8px 18px rgba(63,143,181,.17); transform: translateY(-1px); }.calendar-expand-button svg { width: 17px; height: 17px; stroke-width: 2; }.flip { transform: rotate(180deg); }.week-strip { display: grid; grid-template-columns: repeat(7, 1fr); gap: 7px; }.week-day { position: relative; display: grid; place-items: center; gap: 5px; min-height: 69px; padding: 7px 3px; border-radius: 15px; background: transparent; }.week-day small { color: var(--muted); font-size: .57rem; text-transform: uppercase; }.week-day strong { font-size: .8rem; }.week-day.is-today { color: #fff; background: linear-gradient(145deg, var(--blue), var(--lagoon)); box-shadow: 0 9px 20px rgba(63,143,181,.2); }.week-day.is-today small { color: rgba(255,255,255,.8); }.week-day i { width: 4px; height: 4px; border-radius: 50%; background: var(--rose); }.week-day.is-today i { background: var(--sun); }
.agenda-layout { display: grid; grid-template-columns: 1fr 310px; gap: 18px; padding-top: 34px; }.agenda-list .section-heading > span { color: var(--muted); font-size: .7rem; }.agenda-item { position: relative; display: grid; grid-template-columns: 64px 92px 1fr auto; align-items: center; gap: 14px; min-height: 100px; margin-bottom: 10px; padding: 12px; border: 1px solid var(--line); border-radius: 20px; background: #fff; box-shadow: var(--shadow-sm); }.agenda-item--clickable { cursor: pointer; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }.agenda-item--clickable:hover { border-color: rgba(63,143,181,.24); box-shadow: var(--shadow-md); transform: translateY(-2px); }.agenda-item-hit { position: absolute; z-index: 1; inset: 0; width: 100%; border-radius: inherit; background: transparent; cursor: pointer; }.agenda-item-hit:focus-visible { outline: 3px solid rgba(63,143,181,.36); outline-offset: 3px; }.agenda-date { display: grid; place-items: center; align-self: stretch; border-radius: 14px; color: var(--blue-dark); background: var(--blue-soft); }.agenda-date strong { font-family: "Poppins", sans-serif; font-size: 1.35rem; }.agenda-date small { margin-top: -4px; font-size: .55rem; text-transform: uppercase; }.agenda-thumb { width: 92px; height: 73px; overflow: hidden; border-radius: 13px; background: var(--green-soft); }.agenda-thumb img { width: 100%; height: 100%; object-fit: cover; }.agenda-copy strong { display: block; margin-bottom: 5px; font-family: "Poppins", sans-serif; font-size: .92rem; }.agenda-copy span, .agenda-copy small { display: block; color: var(--muted); font-size: .63rem; }.agenda-copy small { margin-top: 5px; color: var(--ink-soft); }.agenda-more { position: relative; z-index: 2; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: #f2f6f5; }.agenda-more svg { width: 16px; height: 16px; }.agenda-empty { padding: 50px 20px; border: 1px dashed rgba(63,143,181,.3); border-radius: 22px; background: #f8fcfb; text-align: center; }.agenda-empty span { font-size: 2.5rem; }.agenda-empty h3 { margin: 12px 0 6px; font-family: "Poppins", sans-serif; }.agenda-empty p { color: var(--muted); font-size: .72rem; }
.planning-aside { display: grid; align-content: start; gap: 12px; }.weather-card, .calendar-help { padding: 20px; border-radius: 22px; }.weather-card { display: flex; gap: 13px; color: #fff; background: linear-gradient(135deg, var(--coral), #e98b79 45%, var(--sun)); box-shadow: 0 16px 35px rgba(225,130,97,.19); }.weather-card > span { font-size: 2rem; }.weather-card small, .weather-card strong { display: block; }.weather-card small { margin-bottom: 4px; color: rgba(255,255,255,.78); font-size: .6rem; }.weather-card strong { font-family: "Poppins", sans-serif; font-size: .9rem; }.weather-card p { margin: 7px 0 0; color: rgba(255,255,255,.82); font-size: .63rem; line-height: 1.45; }.calendar-help { border: 1px solid var(--line); background: #fff; box-shadow: var(--shadow-sm); }.calendar-help > span { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; background: var(--green-soft); font-size: 1.35rem; }.calendar-help h3 { margin: 14px 0 6px; font-family: "Poppins", sans-serif; }.calendar-help p { color: var(--muted); font-size: .67rem; line-height: 1.5; }.calendar-help button { padding: 0; color: var(--blue-dark); background: transparent; font-size: .68rem; font-weight: 800; }

/* Profil famille */
.profile-view { padding-top: 10px; }
.profile-hero { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, .62fr); align-items: stretch; min-height: 250px; overflow: hidden; border-radius: 28px; background: linear-gradient(125deg, #fff1f5 0%, #fff8e5 54%, #e6f5f2 100%); }
.profile-hero-copy { position: relative; z-index: 2; align-self: center; max-width: 760px; padding: 24px 18px 24px 36px; }
.profile-back { margin-bottom: 13px; background: rgba(255,255,255,.72); box-shadow: 0 7px 20px rgba(65,87,96,.08); }
.profile-hero h1 { margin-bottom: 9px; font-size: clamp(1.85rem, 3.35vw, 2.9rem); line-height: 1.04; }
.profile-hero-copy > p:not(.eyebrow) { max-width: 650px; margin-bottom: 0; color: var(--ink-soft); font-size: .76rem; line-height: 1.5; }
.profile-hero-side { position: relative; min-height: 230px; }
.profile-hero-scene { position: absolute; inset: 0; overflow: hidden; }
.profile-hero-scene::before { content: ""; position: absolute; width: 230px; height: 230px; right: 27px; bottom: -132px; border-radius: 50%; background: #aad9bc; box-shadow: -120px 38px 0 16px #7fc5b2; }
.profile-hero-scene::after { content: ""; position: absolute; width: 190px; height: 190px; right: -62px; bottom: -99px; border-radius: 50%; background: #73b99e; }
.profile-sun, .profile-cloud, .profile-family { position: absolute; z-index: 2; line-height: 1; }
.profile-sun { right: 28px; top: 96px; font-size: 2.7rem; filter: drop-shadow(0 8px 12px rgba(229,179,57,.2)); }
.profile-cloud { left: 7%; top: 125px; color: #fff; font-size: 3.1rem; opacity: .9; }
.profile-family { right: 55px; bottom: 24px; font-size: clamp(4.1rem, 6vw, 5.4rem); filter: drop-shadow(0 12px 15px rgba(45,96,81,.14)); }
.profile-hero-scene i, .profile-hero-scene b { position: absolute; z-index: 3; width: 12px; height: 28px; bottom: 58px; border-radius: 80% 20% 70% 30%; background: #f8d969; transform: rotate(25deg); }
.profile-hero-scene i { left: 17%; }.profile-hero-scene b { left: 24%; height: 38px; bottom: 42px; background: var(--coral); transform: rotate(-20deg); }
.profile-layout { display: grid; grid-template-columns: minmax(0, 1fr) 310px; align-items: start; gap: 20px; padding-top: 25px; }
.profile-form-column { display: grid; gap: 15px; min-width: 0; }
.profile-section { padding: 28px; }
.profile-section-heading { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 14px; margin-bottom: 23px; }
.profile-section-heading--count { grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; }
.profile-section-heading .eyebrow { margin-bottom: 3px; font-size: .58rem; }
.profile-section-heading h2 { margin-bottom: 5px; font-size: 1.38rem; }
.profile-section-heading > div > p:last-child { margin-bottom: 0; color: var(--muted); font-size: .69rem; line-height: 1.45; }
.profile-step { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 13px; font-family: "Poppins", sans-serif; font-size: .82rem; font-weight: 800; transform: rotate(-3deg); }
.profile-step--rose { color: #ac4d70; background: #fde8ef; }.profile-step--sun { color: #876612; background: var(--sun-soft); }.profile-step--blue { color: var(--blue-dark); background: var(--blue-soft); }
.profile-fields { display: grid; gap: 13px; }.profile-fields--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.profile-fields label > span, .child-fields label > span { display: block; margin-bottom: 7px; color: var(--ink-soft); font-size: .68rem; font-weight: 800; }
.profile-fields label > span b, .child-fields label > span b { color: var(--rose); }
.profile-fields input, .profile-fields select, .child-fields input, .child-fields select { width: 100%; min-height: 48px; padding: 0 13px; border: 1px solid var(--line); border-radius: 13px; outline: 0; color: var(--ink); background: #fbfdfc; transition: border-color .18s, box-shadow .18s, background .18s; }
.profile-fields input:focus, .profile-fields select:focus, .child-fields input:focus, .child-fields select:focus { border-color: rgba(63,143,181,.44); background: #fff; box-shadow: 0 0 0 4px rgba(63,143,181,.09); }
.profile-fields label > small { display: block; margin-top: 5px; color: var(--muted); font-size: .57rem; }
.child-count-stepper { display: grid; grid-template-columns: 37px minmax(84px, auto) 37px; align-items: center; padding: 5px; border: 1px solid var(--line); border-radius: 15px; background: #f7faf9; }
.child-count-stepper button { display: grid; place-items: center; width: 37px; height: 37px; border-radius: 11px; color: var(--blue-dark); background: #fff; box-shadow: 0 4px 12px rgba(38,72,82,.07); font-size: 1.2rem; font-weight: 800; }
.child-count-stepper button:disabled { color: #b9c4c5; box-shadow: none; cursor: not-allowed; }
.child-count-stepper output { padding: 0 9px; font-size: .67rem; font-weight: 800; text-align: center; white-space: nowrap; }
.children-list { display: grid; gap: 12px; }
.child-profile-card { position: relative; padding: 19px; overflow: hidden; border: 1px solid rgba(63,143,181,.12); border-radius: 21px; background: linear-gradient(145deg, #fbfefe, #f4faf8); }
.child-profile-card.has-error { border-color: rgba(229,111,148,.72); box-shadow: 0 0 0 4px rgba(229,111,148,.1); }
.child-profile-card:nth-child(3n + 2) { border-color: rgba(229,111,148,.13); background: linear-gradient(145deg, #fffdfd, #fff5f8); }
.child-profile-card:nth-child(3n) { border-color: rgba(244,211,108,.23); background: linear-gradient(145deg, #fffefb, #fff9e9); }
.child-card-heading { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.child-avatar { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 14px; background: var(--blue-soft); font-size: 1.2rem; transform: rotate(-3deg); }.child-profile-card:nth-child(3n + 2) .child-avatar { background: #fde8ef; }.child-profile-card:nth-child(3n) .child-avatar { background: var(--sun-soft); }
.child-card-heading div { display: grid; gap: 2px; }.child-card-heading strong { font-family: "Poppins", sans-serif; font-size: .86rem; }.child-card-heading small { color: var(--muted); font-size: .61rem; }
.child-fields { display: grid; grid-template-columns: minmax(180px, .65fr) minmax(0, 1.35fr); gap: 13px; align-items: start; }
.activity-preferences { min-width: 0; }.activity-preferences > span { display: block; margin-bottom: 7px; color: var(--ink-soft); font-size: .68rem; font-weight: 800; }
.activity-preferences > small { display: block; margin-top: 7px; color: var(--muted); font-size: .56rem; }
.activity-choice-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
.activity-choice-grid label, .need-choices label { position: relative; min-width: 0; }
.activity-choice-grid input, .need-choices input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.activity-choice-grid span { display: grid; place-items: center; gap: 3px; min-height: 58px; padding: 6px 3px; overflow: hidden; border: 1px solid var(--line); border-radius: 12px; color: var(--muted); background: #fff; font-size: .55rem; font-weight: 700; text-align: center; cursor: pointer; }
.activity-choice-grid span b { font-size: 1.15rem; font-weight: 400; }.activity-choice-grid input:checked + span { color: var(--blue-dark); border-color: rgba(63,143,181,.35); background: var(--blue-soft); box-shadow: 0 5px 13px rgba(63,143,181,.08); }.activity-choice-grid input:focus-visible + span, .need-choices input:focus-visible + span { outline: 3px solid rgba(63,143,181,.35); outline-offset: 2px; }
.family-needs { margin: 22px 0 0; padding: 0; border: 0; }.family-needs legend { margin-bottom: 10px; color: var(--ink-soft); font-size: .68rem; font-weight: 800; }.family-needs legend small { color: var(--muted); font-weight: 600; }
.need-choices { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; }.need-choices span { display: grid; place-items: center; min-height: 43px; padding: 7px; border: 1px solid var(--line); border-radius: 12px; color: var(--muted); background: #fff; font-size: .62rem; font-weight: 700; text-align: center; cursor: pointer; }.need-choices input:checked + span { color: var(--green-dark); border-color: rgba(85,173,135,.32); background: var(--green-soft); }
.profile-aside { position: sticky; top: 20px; display: grid; gap: 13px; }
.profile-progress-card, .profile-preview-card { padding: 21px; border: 1px solid var(--line); border-radius: 23px; background: #fff; box-shadow: var(--shadow-sm); }
.profile-progress-card { display: grid; justify-items: center; text-align: center; }
.profile-progress-ring { --progress: 0deg; display: grid; place-items: center; width: 96px; height: 96px; margin-bottom: 15px; border-radius: 50%; background: conic-gradient(var(--rose) var(--progress), #f0f3f2 0); transition: background .25s; }
.profile-progress-ring::before { content: ""; grid-area: 1 / 1; width: 76px; height: 76px; border-radius: 50%; background: #fff; }.profile-progress-ring strong { z-index: 1; grid-area: 1 / 1; font-family: "Poppins", sans-serif; font-size: 1.05rem; }
.profile-progress-card .eyebrow { margin-bottom: 4px; font-size: .55rem; }.profile-progress-card h3, .profile-preview-card h3 { margin: 0 0 7px; font-family: "Poppins", sans-serif; line-height: 1.35; }.profile-progress-card p:last-child { margin-bottom: 0; color: var(--muted); font-size: .64rem; line-height: 1.5; }
.profile-hero .profile-progress-card { position: absolute; z-index: 4; left: 14px; right: 14px; top: 15px; grid-template-columns: auto minmax(0, 1fr); justify-items: start; align-items: center; gap: 12px; margin: 0; padding: 10px 13px; border-color: rgba(255,255,255,.72); border-radius: 18px; background: rgba(255,255,255,.76); box-shadow: 0 9px 24px rgba(65,87,96,.08); text-align: left; backdrop-filter: blur(12px); }
.profile-hero .profile-progress-ring { width: 58px; height: 58px; margin: 0; }.profile-hero .profile-progress-ring::before { width: 46px; height: 46px; }.profile-hero .profile-progress-ring strong { font-size: .72rem; }.profile-hero .profile-progress-card .eyebrow { margin-bottom: 1px; font-size: .48rem; }.profile-hero .profile-progress-card h3 { margin-bottom: 2px; font-size: .78rem; }.profile-hero .profile-progress-card p:last-child { font-size: .56rem; line-height: 1.35; }
.profile-preview-card { overflow: hidden; background: linear-gradient(150deg, #eef8f5, #fff9e9); }.profile-preview-icon { display: grid; place-items: center; width: 47px; height: 47px; margin-bottom: 16px; border-radius: 15px; background: #fff; box-shadow: 0 8px 20px rgba(46,93,85,.08); font-size: 1.35rem; }.profile-preview-card .eyebrow { margin-bottom: 5px; font-size: .55rem; }.profile-preview-card h3 { font-size: .95rem; }.profile-preview-card ul { display: grid; gap: 10px; margin: 17px 0 0; padding: 15px 0 0; border-top: 1px solid rgba(37,76,88,.1); list-style: none; }.profile-preview-card li { display: flex; align-items: center; gap: 8px; color: var(--ink-soft); font-size: .64rem; }.profile-preview-card li span { font-size: .9rem; }

/* Centre d’aide */
.help-view { padding-top: 10px; }
.help-hero { position: relative; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr); min-height: 330px; overflow: hidden; border-radius: 32px; background: linear-gradient(125deg, #edf8f4 0%, #fff9e7 52%, #fff0f5 100%); }
.help-hero::before { content: ""; position: absolute; left: 45%; bottom: -160px; width: 320px; height: 320px; border-radius: 50%; background: rgba(255,255,255,.48); }
.help-hero-copy { position: relative; z-index: 2; align-self: center; max-width: 760px; padding: 34px 20px 38px 46px; }
.help-back { margin-bottom: 20px; background: rgba(255,255,255,.76); box-shadow: 0 7px 20px rgba(65,87,96,.08); }
.help-hero h1 { margin-bottom: 14px; font-size: clamp(2.25rem, 4.6vw, 3.9rem); line-height: 1.04; }
.help-hero-copy > p:not(.eyebrow) { max-width: 660px; margin-bottom: 19px; color: var(--ink-soft); font-size: .86rem; line-height: 1.65; }
.help-hero-tags { display: flex; flex-wrap: wrap; gap: 7px; }.help-hero-tags span { padding: 8px 12px; border: 1px solid rgba(37,76,88,.08); border-radius: 999px; background: rgba(255,255,255,.7); box-shadow: 0 5px 14px rgba(55,89,89,.05); font-size: .64rem; font-weight: 800; }
.help-hero-visual { position: relative; min-height: 300px; overflow: hidden; }
.help-hero-visual::before, .help-hero-visual::after { content: ""; position: absolute; border-radius: 50%; }.help-hero-visual::before { right: -65px; bottom: -120px; width: 330px; height: 330px; background: #8cc9b3; }.help-hero-visual::after { left: -35px; bottom: -155px; width: 280px; height: 280px; background: #68b69c; }
.help-visual-sun, .help-visual-spark { position: absolute; z-index: 3; line-height: 1; }.help-visual-sun { right: 31px; top: 24px; font-size: 3.8rem; filter: drop-shadow(0 8px 13px rgba(214,171,47,.18)); }.help-visual-spark { left: 4%; top: 78px; font-size: 2.2rem; transform: rotate(-12deg); }
.help-visual-card { position: absolute; z-index: 4; left: 50%; top: 52%; display: grid; grid-template-columns: 54px 1fr; grid-template-rows: repeat(3, 9px); align-items: center; gap: 9px 12px; width: 225px; padding: 22px; border: 6px solid rgba(255,255,255,.72); border-radius: 27px; background: #fff; box-shadow: 0 22px 48px rgba(40,88,76,.18); transform: translate(-50%, -44%) rotate(-4deg); }
.help-visual-card strong { grid-row: 1 / 4; display: grid; place-items: center; width: 54px; height: 54px; border-radius: 18px; color: #fff; background: linear-gradient(145deg, var(--rose), var(--coral)); font-family: "Poppins", sans-serif; font-size: 2rem; }.help-visual-card i, .help-visual-card b { height: 8px; border-radius: 999px; background: #dfeeed; }.help-visual-card i:last-of-type { width: 82%; background: var(--sun-soft); }.help-visual-card b { width: 58%; background: var(--blue-soft); }
.help-content { width: min(100%, 930px); margin: 0 auto; padding: 48px 0 8px; }
.help-section-heading { max-width: 650px; margin: 0 auto 24px; text-align: center; }.help-section-heading h2 { margin-bottom: 8px; font-size: clamp(1.8rem, 3.5vw, 2.6rem); }.help-section-heading > p:last-child { margin: 0; color: var(--muted); font-size: .75rem; line-height: 1.55; }
.help-faq { display: grid; gap: 10px; }
.help-faq-item { overflow: hidden; border: 1px solid var(--line); border-radius: 20px; background: #fff; box-shadow: 0 8px 24px rgba(42,76,85,.055); transition: border-color .18s, box-shadow .18s, background .18s; }.help-faq-item[open] { border-color: rgba(63,143,181,.22); background: linear-gradient(145deg, #fff, #fbfefd); box-shadow: 0 13px 32px rgba(42,76,85,.085); }
.help-faq-item summary { display: grid; grid-template-columns: 48px minmax(0, 1fr) 38px; align-items: center; gap: 13px; min-height: 76px; padding: 13px 15px; list-style: none; cursor: pointer; }.help-faq-item summary::-webkit-details-marker { display: none; }.help-faq-item summary:focus-visible { outline: 3px solid rgba(63,143,181,.3); outline-offset: -3px; border-radius: 18px; }
.help-faq-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 15px; font-size: 1.35rem; }.help-faq-icon--green { background: var(--green-soft); }.help-faq-icon--rose { background: #fde8ef; }.help-faq-icon--blue { background: var(--blue-soft); }.help-faq-icon--sun { background: var(--sun-soft); }.help-faq-icon--purple { background: #eee9f9; }.help-faq-icon--coral { background: var(--coral-soft); }
.help-faq-question strong, .help-faq-question small { display: block; }.help-faq-question strong { margin-bottom: 3px; font-family: "Poppins", sans-serif; font-size: .83rem; line-height: 1.35; }.help-faq-question small { color: var(--muted); font-size: .6rem; font-weight: 700; }
.help-faq-toggle { position: relative; width: 34px; height: 34px; border-radius: 50%; background: #f2f7f5; }.help-faq-toggle::before, .help-faq-toggle::after { content: ""; position: absolute; left: 50%; top: 50%; width: 12px; height: 2px; border-radius: 999px; background: var(--blue-dark); transform: translate(-50%, -50%); transition: transform .2s; }.help-faq-toggle::after { transform: translate(-50%, -50%) rotate(90deg); }.help-faq-item[open] .help-faq-toggle::after { transform: translate(-50%, -50%) rotate(0) scaleX(0); }
.help-faq-answer { margin: 0 15px 15px 76px; padding: 14px 15px 2px; border-top: 1px solid rgba(37,76,88,.08); }.help-faq-answer p { margin: 0 0 12px; color: var(--ink-soft); font-size: .7rem; line-height: 1.6; }.help-faq-answer button { display: inline-flex; align-items: center; gap: 7px; padding: 0; color: var(--blue-dark); background: transparent; font-size: .67rem; font-weight: 800; }.help-faq-answer button span { transition: transform .18s; }.help-faq-answer button:hover span { transform: translateX(3px); }
.help-reassurance { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 13px; margin-top: 17px; padding: 17px 18px; border-radius: 20px; background: linear-gradient(135deg, var(--sun-soft), #fff9e7); }.help-reassurance > span { display: grid; place-items: center; width: 43px; height: 43px; border-radius: 14px; background: #fff; font-size: 1.25rem; }.help-reassurance strong { display: block; margin-bottom: 3px; font-family: "Poppins", sans-serif; font-size: .78rem; }.help-reassurance p { margin: 0; color: var(--ink-soft); font-size: .65rem; }.help-reassurance button { padding: 10px 13px; border-radius: 12px; color: var(--blue-dark); background: rgba(255,255,255,.78); font-size: .64rem; font-weight: 800; white-space: nowrap; }

/* Abonnements */
.subscription-view { padding-top: 10px; }
.subscription-hero { position: relative; display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(200px, .4fr); min-height: 168px; overflow: hidden; border-radius: 25px; background: linear-gradient(125deg, #edf8f4 0%, #fff9e3 52%, #ffeef3 100%); }
.subscription-hero-copy { position: relative; z-index: 2; align-self: center; padding: 14px 15px 14px 66px; }
.subscription-back { position: absolute; left: 15px; top: 15px; margin: 0; background: rgba(255,255,255,.76); box-shadow: 0 7px 20px rgba(65,87,96,.08); }
.subscription-hero h1 { margin-bottom: 5px; font-size: clamp(1.7rem, 2.55vw, 2.2rem); line-height: 1.02; }
.subscription-hero-copy > p:not(.eyebrow) { max-width: 720px; margin-bottom: 8px; color: var(--ink-soft); font-size: .64rem; line-height: 1.35; }
.subscription-hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.subscription-hero-cta { display: inline-flex; align-items: center; gap: 9px; min-height: 36px; padding: 0 6px 0 13px; border-radius: 12px; color: #fff; background: linear-gradient(135deg, var(--rose), var(--coral)); box-shadow: 0 10px 23px rgba(229,111,148,.23); font-size: .62rem; font-weight: 900; transition: transform .18s, box-shadow .18s; }.subscription-hero-cta span { display: grid; place-items: center; width: 25px; height: 25px; border-radius: 8px; background: rgba(255,255,255,.2); transition: transform .18s; }.subscription-hero-cta:hover { box-shadow: 0 13px 27px rgba(229,111,148,.3); transform: translateY(-2px); }.subscription-hero-cta:hover span { transform: translateY(2px); }
.subscription-current { display: inline-flex; align-items: center; gap: 9px; padding: 8px 13px; border: 1px solid rgba(37,76,88,.08); border-radius: 999px; background: rgba(255,255,255,.72); box-shadow: 0 7px 18px rgba(43,84,82,.06); }
.subscription-current span { color: var(--muted); font-size: .6rem; font-weight: 700; }.subscription-current strong { color: var(--green-dark); font-family: "Poppins", sans-serif; font-size: .69rem; }
.subscription-hero-scene { position: relative; min-height: 168px; overflow: hidden; }
.subscription-hero-scene::before, .subscription-hero-scene::after { content: ""; position: absolute; border-radius: 50%; }
.subscription-hero-scene::before { width: 235px; height: 235px; right: -5px; bottom: -154px; background: #91ccb5; box-shadow: -118px 37px 0 22px #b7ddc6; }
.subscription-hero-scene::after { width: 135px; height: 135px; right: -42px; bottom: -66px; background: #67ad91; }
.subscription-sun, .subscription-cloud, .subscription-kite, .subscription-family { position: absolute; z-index: 2; line-height: 1; }
.subscription-sun { right: 22px; top: 17px; font-size: 2.55rem; filter: drop-shadow(0 8px 12px rgba(229,179,57,.2)); }.subscription-cloud { left: 4%; top: 43px; color: #fff; font-size: 2.8rem; opacity: .9; }.subscription-kite { right: 48%; top: 25px; font-size: 1.75rem; transform: rotate(-9deg); }.subscription-family { right: 42px; bottom: 22px; font-size: clamp(3.7rem, 5.3vw, 4.8rem); filter: drop-shadow(0 12px 15px rgba(45,96,81,.14)); }
.subscription-hero-scene i, .subscription-hero-scene b { position: absolute; z-index: 3; bottom: 31px; width: 10px; height: 22px; border-radius: 80% 20% 70% 30%; background: var(--sun); transform: rotate(24deg); }.subscription-hero-scene i { left: 15%; }.subscription-hero-scene b { left: 23%; height: 29px; bottom: 22px; background: var(--coral); transform: rotate(-18deg); }
.subscription-content { padding-top: 48px; }
.subscription-heading { max-width: 670px; margin: 0 auto 30px; text-align: center; }.subscription-heading h2 { margin: 4px 0 9px; font-size: clamp(1.9rem, 3.5vw, 2.75rem); }.subscription-heading > p:last-child { margin: 0; color: var(--muted); font-size: .75rem; line-height: 1.55; }
.subscription-plans { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; gap: 16px; }
.subscription-plan { position: relative; display: flex; min-width: 0; min-height: 470px; padding: 22px; flex-direction: column; border: 1px solid var(--line); border-radius: 25px; background: #fff; box-shadow: var(--shadow-sm); transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.subscription-plan:hover { box-shadow: var(--shadow-md); transform: translateY(-4px); }.subscription-plan--liberty { border-color: rgba(63,143,181,.38); background: linear-gradient(165deg, #f4fbff, #fff 43%); box-shadow: 0 18px 42px rgba(63,143,181,.16); }.subscription-plan.is-current { border-color: var(--green); box-shadow: 0 0 0 3px rgba(93,175,146,.12), var(--shadow-md); }
.subscription-popular { position: absolute; right: 20px; top: -13px; padding: 7px 11px; border-radius: 999px; color: #fff; background: linear-gradient(135deg, var(--blue), var(--lagoon)); box-shadow: 0 8px 18px rgba(63,143,181,.22); font-size: .56rem; font-weight: 900; letter-spacing: .03em; }
.subscription-plan-top { display: flex; align-items: center; gap: 9px; margin-bottom: 12px; }.subscription-plan-icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 14px; background: var(--green-soft); font-size: 1.3rem; }.subscription-plan--liberty .subscription-plan-icon { background: var(--blue-soft); }.subscription-plan--family .subscription-plan-icon { background: var(--sun-soft); }.subscription-plan-label { color: var(--muted); font-size: .57rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.subscription-plan h3 { margin: 0 0 6px; font-family: "Poppins", sans-serif; font-size: 1.45rem; }.subscription-plan-intro { min-height: 43px; margin: 0; color: var(--muted); font-size: .66rem; line-height: 1.5; }
.subscription-price { display: flex; align-items: baseline; gap: 7px; margin: 14px 0; }.subscription-price strong { font-family: "Poppins", sans-serif; font-size: 1.75rem; letter-spacing: -.04em; }.subscription-price span { color: var(--muted); font-size: .6rem; }
.subscription-travel-highlight { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 10px; margin: 0 0 12px; padding: 11px; border: 1px solid rgba(63,143,181,.15); border-radius: 15px; background: linear-gradient(135deg, var(--blue-soft), #eef8f5); }.subscription-travel-highlight > span { display: grid; place-items: center; width: 37px; height: 37px; border-radius: 12px; background: #fff; font-size: 1.15rem; }.subscription-travel-highlight strong, .subscription-travel-highlight small { display: block; }.subscription-travel-highlight strong { margin-bottom: 2px; font-size: .65rem; }.subscription-travel-highlight small { color: var(--muted); font-size: .54rem; line-height: 1.35; }
.subscription-plan ul { display: grid; gap: 10px; margin: 0 0 18px; padding: 14px 0 0; border-top: 1px solid var(--line); list-style: none; }.subscription-plan li { display: grid; grid-template-columns: 21px 1fr; align-items: start; gap: 7px; color: var(--ink-soft); font-size: .64rem; line-height: 1.4; }.subscription-plan li > span { display: grid; place-items: center; width: 19px; height: 19px; border-radius: 50%; color: var(--green-dark); background: var(--green-soft); font-size: .55rem; font-weight: 900; }.subscription-plan li.is-unavailable { color: var(--muted); opacity: .66; }.subscription-plan li.is-unavailable > span { color: var(--muted); background: #f1f4f3; }
.subscription-select { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; min-height: 50px; margin-top: auto; padding: 0 8px 0 17px; overflow: hidden; border: 1px solid rgba(63,143,181,.2); border-radius: 16px; color: var(--blue-dark); background: var(--blue-soft); font-size: .69rem; font-weight: 900; transition: transform .18s, box-shadow .18s; }.subscription-select > span { display: grid; place-items: center; flex: 0 0 auto; width: 32px; height: 32px; border-radius: 11px; color: #fff; background: var(--blue); font-size: .86rem; transition: transform .18s; }.subscription-select:hover:not(:disabled) { box-shadow: 0 11px 24px rgba(63,143,181,.2); transform: translateY(-2px); }.subscription-select:hover:not(:disabled) > span { transform: translateX(3px); }.subscription-select--primary { color: #fff; border-color: transparent; background: linear-gradient(135deg, var(--blue), var(--lagoon)); box-shadow: 0 12px 27px rgba(63,143,181,.24); }.subscription-select--primary > span { background: rgba(255,255,255,.2); }.subscription-select:disabled { color: var(--green-dark); border-color: rgba(93,175,146,.18); background: var(--green-soft); cursor: default; }.subscription-select:disabled > span { color: var(--green-dark); background: rgba(255,255,255,.56); }
.subscription-reassurance { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 18px; padding: 17px; border-radius: 22px; background: linear-gradient(135deg, #f2faf7, #fffaf0); }.subscription-reassurance > div { display: grid; grid-template-columns: auto 1fr; column-gap: 10px; align-items: center; padding: 8px 10px; }.subscription-reassurance span { grid-row: 1 / 3; display: grid; place-items: center; width: 39px; height: 39px; border-radius: 13px; background: #fff; font-size: 1.1rem; }.subscription-reassurance strong { font-family: "Poppins", sans-serif; font-size: .68rem; }.subscription-reassurance small { color: var(--muted); font-size: .57rem; line-height: 1.35; }

/* Paramètres */
.settings-view { padding-top: 10px; }
.settings-hero { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 260px; align-items: center; min-height: 255px; padding: 34px 42px; overflow: hidden; border-radius: 32px; background: linear-gradient(125deg, #edf7ff, #f8f1ff 54%, #fff5e4); }
.settings-hero > div:first-child { position: relative; z-index: 2; }
.settings-back { margin-bottom: 20px; background: rgba(255,255,255,.76); box-shadow: 0 7px 20px rgba(65,87,96,.08); }
.settings-hero h1 { margin: 0 0 8px; font-size: clamp(2.35rem, 5vw, 4rem); line-height: 1; }
.settings-hero > div:first-child > p:last-child { max-width: 650px; margin: 0; color: var(--ink-soft); font-size: .82rem; line-height: 1.55; }
.settings-hero-visual { position: relative; align-self: stretch; min-height: 180px; }
.settings-hero-visual::before, .settings-hero-visual::after { content: ""; position: absolute; border-radius: 50%; }
.settings-hero-visual::before { right: 3px; top: 6px; width: 165px; height: 165px; background: #172126; box-shadow: 0 18px 45px rgba(34,47,54,.2); }
.settings-hero-visual::after { right: 88px; bottom: -50px; width: 145px; height: 145px; background: rgba(255,255,255,.72); }
.settings-hero-visual > span, .settings-hero-visual > b { position: absolute; z-index: 2; font-size: 3rem; font-style: normal; }
.settings-hero-visual > span { left: 18px; top: 24px; }.settings-hero-visual > b { right: 52px; top: 52px; }
.settings-hero-visual > i { position: absolute; z-index: 3; left: 87px; top: 84px; width: 67px; height: 17px; border-radius: 999px; background: linear-gradient(90deg, var(--sun), var(--purple)); transform: rotate(-18deg); }
.settings-layout { display: grid; grid-template-columns: minmax(0, 1fr) 350px; align-items: start; gap: 20px; padding-top: 24px; }
.settings-main-column { display: grid; gap: 15px; min-width: 0; }
.settings-card { padding: 27px; }
.settings-card-heading { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 14px; margin-bottom: 21px; }
.settings-card-icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 14px; font-size: 1.15rem; font-weight: 900; transform: rotate(-3deg); }
.settings-card-icon--purple { color: #67538f; background: #eee6fb; }.settings-card-icon--rose { background: var(--coral-soft); }.settings-card-icon--green { background: var(--green-soft); }
.settings-card-heading .eyebrow { margin-bottom: 3px; font-size: .55rem; }
.settings-card-heading h2 { margin: 0 0 5px; font-size: 1.34rem; }
.settings-card-heading > div > p:last-child { margin: 0; color: var(--muted); font-size: .68rem; line-height: 1.45; }
.theme-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0; padding: 0; border: 0; }
.theme-option { position: relative; min-width: 0; cursor: pointer; }
.theme-option > input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.theme-choice { display: grid; grid-template-columns: 92px minmax(0, 1fr) auto; align-items: center; gap: 13px; min-height: 90px; padding: 11px; border: 1px solid var(--line); border-radius: 18px; background: #fbfdfc; transition: border-color .18s, box-shadow .18s, transform .18s; }
.theme-option:hover .theme-choice { transform: translateY(-2px); }
.theme-option > input:checked + .theme-choice { border-color: rgba(63,143,181,.5); box-shadow: 0 0 0 4px rgba(63,143,181,.09); }
.theme-option > input:focus-visible + .theme-choice { outline: 3px solid rgba(63,143,181,.35); outline-offset: 2px; }
.theme-preview { position: relative; display: block; width: 92px; height: 64px; overflow: hidden; border-radius: 12px; box-shadow: inset 0 0 0 1px rgba(37,76,88,.08); }
.theme-preview i { position: absolute; inset: 8px 9px auto; height: 7px; border-radius: 99px; }.theme-preview b, .theme-preview em { position: absolute; bottom: 9px; height: 33px; border-radius: 8px; }.theme-preview b { left: 9px; width: 31px; }.theme-preview em { right: 9px; width: 37px; }
.theme-preview--light { background: #fff; }.theme-preview--light i { background: #e5edf0; }.theme-preview--light b { background: #fde7df; }.theme-preview--light em { background: #dff1f6; }
.theme-preview--dark { background: #11191d; }.theme-preview--dark i { background: #34454c; }.theme-preview--dark b { background: #4e2e37; }.theme-preview--dark em { background: #183640; }
.theme-choice > span:nth-child(2) { display: grid; gap: 3px; }.theme-choice strong { font-size: .76rem; }.theme-choice small { color: var(--muted); font-size: .59rem; }
.theme-check { display: grid; place-items: center; width: 22px; height: 22px; border: 1px solid var(--line); border-radius: 50%; color: transparent; font-size: .65rem; font-style: normal; }
.theme-option > input:checked + .theme-choice .theme-check { color: #fff; border-color: var(--blue); background: var(--blue); }
.settings-rows { display: grid; }
.settings-switch-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; min-height: 70px; padding: 11px 0; border-top: 1px solid var(--line); cursor: pointer; }
.settings-switch-row:first-child { border-top: 0; }
.settings-row-icon { display: grid; place-items: center; width: 39px; height: 39px; border-radius: 13px; background: #f4f7f6; font-size: 1rem; }
.settings-row-copy { display: grid; gap: 3px; }.settings-row-copy strong { font-size: .76rem; }.settings-row-copy small { color: var(--muted); font-size: .62rem; line-height: 1.4; }
.switch-control { position: relative; display: block; flex: 0 0 auto; width: 48px; height: 28px; }
.switch-control input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.switch-control i { position: absolute; inset: 0; border-radius: 999px; background: #d8e0df; box-shadow: inset 0 0 0 1px rgba(37,76,88,.06); transition: background .2s; }
.switch-control i::after { content: ""; position: absolute; left: 3px; top: 3px; width: 22px; height: 22px; border-radius: 50%; background: #fff; box-shadow: 0 3px 8px rgba(38,65,70,.2); transition: transform .2s; }
.switch-control input:checked + i { background: linear-gradient(135deg, var(--blue), var(--lagoon)); }.switch-control input:checked + i::after { transform: translateX(20px); }
.switch-control input:focus-visible + i { outline: 3px solid rgba(63,143,181,.34); outline-offset: 3px; }
.settings-data-action { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 12px; padding: 16px; border-radius: 17px; background: #f5f9f8; }
.settings-data-action > div { display: grid; gap: 3px; }.settings-data-action strong { font-size: .73rem; }.settings-data-action small { color: var(--muted); font-size: .6rem; line-height: 1.4; }
.settings-aside { position: sticky; top: 20px; display: grid; gap: 14px; }
.settings-ad-card { position: relative; padding: 28px; overflow: hidden; border-radius: 28px; color: #fff; background: linear-gradient(145deg, #244955, #3f8fb5 55%, #62b9c7); box-shadow: 0 22px 54px rgba(39,102,122,.24); }
.settings-ad-card::after { content: ""; position: absolute; right: -65px; top: -70px; width: 190px; height: 190px; border-radius: 50%; background: rgba(255,255,255,.1); }
.settings-ad-card > * { position: relative; z-index: 1; }
.settings-plan-badge { display: inline-flex; padding: 6px 9px; border: 1px solid rgba(255,255,255,.3); border-radius: 999px; background: rgba(255,255,255,.13); font-size: .59rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.settings-ad-illustration { position: absolute; right: 25px; top: 22px; font-size: 2.6rem; transform: rotate(8deg); }
.settings-ad-card .eyebrow { margin: 30px 0 5px; color: rgba(255,255,255,.7); font-size: .54rem; }
.settings-ad-card h2 { margin: 0 0 9px; color: #fff; font-size: 1.55rem; line-height: 1.12; }
.settings-ad-card > p:not(.eyebrow) { margin: 0; color: rgba(255,255,255,.78); font-size: .68rem; line-height: 1.5; }
.settings-ad-toggle { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 22px 0 12px; padding: 13px; border: 1px solid rgba(255,255,255,.2); border-radius: 17px; background: rgba(255,255,255,.1); cursor: pointer; }
.settings-ad-toggle > span:first-child { display: grid; gap: 3px; }.settings-ad-toggle strong { color: #fff; font-size: .7rem; }.settings-ad-toggle small { color: rgba(255,255,255,.66); font-size: .57rem; }
.switch-control--light i { background: rgba(16,43,51,.42); }.settings-ad-card.is-ad-free .switch-control--light i { background: var(--sun); }
.settings-subscription-cta { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 50px; padding: 0 8px 0 16px; border-radius: 15px; color: var(--blue-dark); background: linear-gradient(135deg, #fff, var(--sun-soft)); box-shadow: 0 12px 28px rgba(17,52,61,.2); font-size: .7rem; font-weight: 900; transition: transform .18s, box-shadow .18s; }.settings-subscription-cta span { display: grid; place-items: center; width: 33px; height: 33px; border-radius: 11px; color: #fff; background: var(--rose); transition: transform .18s; }.settings-subscription-cta:hover { box-shadow: 0 15px 32px rgba(17,52,61,.25); transform: translateY(-2px); }.settings-subscription-cta:hover span { transform: translateX(3px); }
.settings-plan-note { display: block; margin-top: 11px; color: rgba(255,255,255,.58); font-size: .52rem; text-align: center; }
.settings-help-card { display: grid; grid-template-columns: auto 1fr; align-items: start; gap: 13px; padding: 20px; }.settings-help-card > span { display: grid; place-items: center; width: 43px; height: 43px; border-radius: 14px; background: var(--coral-soft); font-size: 1.15rem; }.settings-help-card .eyebrow { margin-bottom: 4px; font-size: .52rem; }.settings-help-card h3 { margin: 0 0 5px; font-family: "Poppins", sans-serif; font-size: .86rem; }.settings-help-card p:last-of-type { margin: 0 0 10px; color: var(--muted); font-size: .61rem; line-height: 1.45; }.settings-help-card button { padding: 0; color: var(--blue-dark); background: transparent; font-size: .62rem; font-weight: 900; }
.settings-danger-zone { display: flex; align-items: center; justify-content: space-between; gap: 25px; margin-top: 20px; padding: 24px 27px; border: 1px solid rgba(194,76,84,.2); border-radius: 24px; background: #fff9f8; }
.settings-danger-zone .eyebrow { margin-bottom: 3px; color: #b95861; font-size: .53rem; }.settings-danger-zone h2 { margin: 0 0 5px; font-size: 1.22rem; }.settings-danger-zone p:last-child { max-width: 720px; margin: 0; color: var(--muted); font-size: .65rem; line-height: 1.45; }
.delete-account-button, .delete-account-confirm { flex: 0 0 auto; min-height: 44px; padding: 0 16px; border: 1px solid rgba(194,76,84,.24); border-radius: 13px; color: #b84d57; background: #fff; font-size: .67rem; font-weight: 900; }
.delete-account-button:hover, .delete-account-confirm:hover { color: #fff; border-color: #c3515b; background: #c3515b; }
.delete-account-modal { width: min(calc(100% - 28px), 510px); padding: 32px; text-align: center; }
.delete-account-icon { display: grid; place-items: center; width: 62px; height: 62px; margin: 0 auto 17px; border-radius: 20px; background: #fff0ed; font-size: 1.7rem; }
.delete-account-modal .eyebrow { color: #b95861; }.delete-account-modal h2 { margin: 0 0 10px; font-size: 1.65rem; }.delete-account-modal > p:last-of-type { margin: 0 auto; max-width: 400px; color: var(--muted); font-size: .7rem; line-height: 1.55; }
.delete-account-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 23px; }.delete-account-actions .secondary-button, .delete-account-confirm { width: 100%; }

/* Connexion et inscription */
body.auth-active { overflow: auto; background: #fff; }
body.auth-active .app-shell { width: 100%; max-width: none; padding: 0; }
body.auth-active .topbar, body.auth-active .bottom-nav { display: none; }
body.auth-active #mainContent { min-height: 100dvh; }
body.auth-active .toast { bottom: 24px; }
.auth-view { min-height: 100dvh; }
.auth-shell { display: grid; grid-template-columns: minmax(420px, 1.05fr) minmax(500px, .95fr); min-height: 100dvh; background: #fff; }
.auth-visual { position: relative; display: flex; flex-direction: column; min-height: 100dvh; overflow: hidden; padding: 34px clamp(34px, 5vw, 76px) 48px; background: linear-gradient(145deg, #fff0f4 0%, #fff8df 51%, #dff4ee 100%); }
.auth-visual--register { background: linear-gradient(145deg, #e7f6f2 0%, #fff9df 52%, #fce7ed 100%); }
.auth-brand, .auth-mobile-brand { position: relative; z-index: 4; display: flex; align-items: center; gap: 11px; }
.auth-brand strong, .auth-mobile-brand strong { font-family: "Poppins", sans-serif; font-size: 1.48rem; letter-spacing: -.045em; }
.auth-story { position: relative; z-index: 4; width: min(100%, 620px); margin: auto 0; padding: 58px 0 210px; }
.auth-story .eyebrow { margin-bottom: 10px; }
.auth-story h1 { margin-bottom: 20px; font-size: clamp(2.7rem, 4.6vw, 5.2rem); line-height: .99; }
.auth-story > p:not(.eyebrow) { max-width: 580px; color: var(--ink-soft); font-size: clamp(.8rem, 1.15vw, 1rem); line-height: 1.65; }
.auth-benefits { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 25px; }
.auth-benefits span { padding: 8px 12px; border: 1px solid rgba(255,255,255,.75); border-radius: 999px; background: rgba(255,255,255,.6); box-shadow: 0 7px 18px rgba(53,91,89,.06); font-size: .64rem; font-weight: 800; backdrop-filter: blur(10px); }
.auth-testimonial { position: relative; max-width: 460px; margin-top: 24px; padding: 17px 19px 16px 47px; border: 1px solid rgba(255,255,255,.75); border-radius: 20px; background: rgba(255,255,255,.62); box-shadow: 0 10px 25px rgba(53,91,89,.07); backdrop-filter: blur(12px); }
.auth-testimonial > span { position: absolute; left: 16px; top: 8px; color: var(--rose); font-family: Georgia, serif; font-size: 2.5rem; line-height: 1; }
.auth-testimonial p { margin-bottom: 5px; color: var(--ink-soft); font-size: .69rem; font-weight: 700; line-height: 1.48; }.auth-testimonial small { color: var(--muted); font-size: .57rem; }
.auth-landscape { position: absolute; z-index: 1; inset: auto 0 0; height: 260px; overflow: hidden; }
.auth-landscape::before, .auth-landscape::after { content: ""; position: absolute; border-radius: 50% 50% 0 0; }
.auth-landscape::before { left: -8%; bottom: -145px; width: 74%; height: 275px; background: #91ccb0; transform: rotate(4deg); }
.auth-landscape::after { right: -13%; bottom: -168px; width: 78%; height: 305px; background: #62b39a; transform: rotate(-5deg); }
.auth-landscape > span { position: absolute; z-index: 3; line-height: 1; }
.auth-sun { right: 10%; top: 8px; font-size: 3.6rem; filter: drop-shadow(0 8px 15px rgba(220,174,55,.22)); }.auth-cloud { left: 12%; top: 52px; color: #fff; font-size: 4.8rem; opacity: .86; }.auth-car { left: 22%; bottom: 60px; font-size: 3rem; transform: rotate(-4deg); }.auth-family { right: 17%; bottom: 40px; font-size: 5rem; filter: drop-shadow(0 10px 13px rgba(40,88,74,.14)); }
.auth-landscape i, .auth-landscape b { position: absolute; z-index: 4; bottom: 35px; width: 10px; height: 34px; border-radius: 80% 20% 65% 35%; background: var(--sun); transform: rotate(25deg); }.auth-landscape i { left: 10%; }.auth-landscape b { right: 8%; height: 45px; background: var(--coral); transform: rotate(-18deg); }
.auth-panel { display: grid; place-items: center; min-width: 0; padding: 38px clamp(28px, 5vw, 78px); background: #fff; }
.auth-card { width: min(100%, 500px); padding: 24px 0; }
.auth-card--register { width: min(100%, 540px); }
.auth-mobile-brand { display: none; margin-bottom: 28px; }
.auth-card > .eyebrow { margin-bottom: 7px; }
.auth-card h2 { margin-bottom: 9px; font-family: "Poppins", sans-serif; font-size: clamp(2rem, 3vw, 3rem); line-height: 1.08; letter-spacing: -.045em; }
.auth-intro { margin-bottom: 24px; color: var(--muted); font-size: .74rem; line-height: 1.55; }
.auth-form { display: grid; gap: 14px; }
.auth-field-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
.auth-field { display: grid; gap: 7px; min-width: 0; }
.auth-field > span:first-child, .auth-field > label { color: var(--ink-soft); font-size: .65rem; font-weight: 800; }
.auth-field > input, .auth-password-control { width: 100%; min-height: 51px; border: 1px solid var(--line); border-radius: 14px; background: #fbfdfc; transition: border-color .18s, box-shadow .18s, background .18s; }
.auth-field > input { padding: 0 14px; outline: 0; }
.auth-password-control { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; overflow: hidden; }
.auth-password-control input { width: 100%; min-width: 0; height: 49px; padding: 0 4px 0 14px; border: 0; outline: 0; color: var(--ink); background: transparent; }
.auth-password-control button { align-self: stretch; padding: 0 13px; color: var(--blue-dark); background: transparent; font-size: .58rem; font-weight: 800; }
.auth-field > input:focus, .auth-password-control:focus-within { border-color: rgba(63,143,181,.5); background: #fff; box-shadow: 0 0 0 4px rgba(63,143,181,.09); }
.auth-options { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.auth-options > button, .auth-switch button, .auth-check button { padding: 0; color: var(--blue-dark); background: transparent; font-size: inherit; font-weight: 800; }
.auth-check { display: flex; align-items: flex-start; gap: 8px; color: var(--muted); font-size: .62rem; line-height: 1.45; cursor: pointer; }.auth-check input { flex: 0 0 auto; width: 15px; height: 15px; margin: 1px 0 0; accent-color: var(--blue); }.auth-check--terms { margin: 2px 0; }
.auth-options > button { font-size: .62rem; }
.auth-error { margin: -2px 0 0; padding: 9px 11px; border-radius: 11px; color: #a54850; background: #fff0f1; font-size: .61rem; font-weight: 700; }
.auth-submit { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 52px; border-radius: 15px; color: #fff; background: linear-gradient(135deg, var(--blue), var(--lagoon)); box-shadow: 0 12px 26px rgba(63,143,181,.23); font-size: .72rem; font-weight: 800; transition: transform .18s, box-shadow .18s; }.auth-submit:hover { box-shadow: 0 15px 30px rgba(63,143,181,.29); transform: translateY(-1px); }.auth-submit span { font-size: 1rem; }
.auth-divider { display: flex; align-items: center; gap: 12px; margin: 21px 0 14px; color: var(--muted); font-size: .55rem; }.auth-divider::before, .auth-divider::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.auth-socials { display: grid; grid-template-columns: repeat(2, 1fr); gap: 9px; }.auth-socials button { display: flex; align-items: center; justify-content: center; gap: 9px; min-height: 46px; border: 1px solid var(--line); border-radius: 13px; background: #fff; box-shadow: 0 6px 17px rgba(42,76,85,.05); font-size: .67rem; font-weight: 800; }.auth-socials b { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; color: var(--blue-dark); background: var(--blue-soft); font-family: "Poppins", sans-serif; font-size: .64rem; }
.auth-switch { margin: 21px 0 0; color: var(--muted); font-size: .65rem; text-align: center; }.auth-switch button { font-size: .65rem; }
.auth-reassurance { display: flex; align-items: flex-start; gap: 7px; margin: 17px 0 0; padding: 10px 12px; border-radius: 12px; color: var(--muted); background: var(--green-soft); font-size: .57rem; line-height: 1.45; }.auth-reassurance span { font-size: .8rem; }
.password-strength { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 9px; }.password-strength::before { content: ""; grid-column: 1; grid-row: 1; height: 4px; border-radius: 999px; background: #edf1f0; }.password-strength i { z-index: 1; grid-column: 1; grid-row: 1; width: var(--strength, 0%); height: 4px; border-radius: 999px; background: var(--strength-color, var(--coral)); transition: width .22s, background .22s; }.password-strength small { color: var(--muted); font-size: .52rem; }

@media (max-width: 820px) {
  .auth-shell { grid-template-columns: 1fr; }
  .auth-visual { min-height: 190px; padding: 20px 22px 48px; }
  .auth-brand strong { font-size: 1.25rem; }.auth-brand .brand-mark { width: 32px; height: 32px; }
  .auth-story { margin: 22px 0 0; padding: 0 0 65px; }.auth-story .eyebrow { margin-bottom: 5px; }.auth-story h1 { max-width: 430px; margin: 0; font-size: 2rem; line-height: 1.04; }
  .auth-story > p:not(.eyebrow), .auth-benefits, .auth-testimonial { display: none; }
  .auth-landscape { right: 0; left: auto; width: 48%; height: 155px; }.auth-landscape::before { left: -10%; bottom: -110px; width: 100%; height: 180px; }.auth-landscape::after { right: -40%; bottom: -105px; width: 110%; height: 180px; }
  .auth-sun { right: 11%; top: 6px; font-size: 2.25rem; }.auth-cloud { display: none; }.auth-car { left: 14%; bottom: 35px; font-size: 2rem; }.auth-family { right: 8%; bottom: 24px; font-size: 3rem; }
  .auth-panel { position: relative; z-index: 5; align-items: start; margin-top: -28px; padding: 0 14px 30px; background: transparent; }
  .auth-card, .auth-card--register { width: min(100%, 560px); padding: 25px 21px; border: 1px solid var(--line); border-radius: 28px; background: #fff; box-shadow: 0 22px 55px rgba(39,77,88,.14); }
}

@media (max-width: 480px) {
  .auth-visual { min-height: 174px; padding-inline: 17px; }.auth-story { margin-top: 17px; }.auth-story h1 { max-width: 270px; font-size: 1.67rem; }.auth-landscape { width: 52%; height: 140px; }
  .auth-panel { padding-inline: 10px; }.auth-card, .auth-card--register { padding: 23px 17px; border-radius: 25px; }.auth-card h2 { font-size: 1.85rem; }.auth-intro { margin-bottom: 20px; font-size: .68rem; }
  .auth-field-row { grid-template-columns: 1fr; }.auth-socials { grid-template-columns: 1fr; }.auth-options { align-items: flex-start; }
  .password-strength { grid-template-columns: 1fr; gap: 5px; }.password-strength small { grid-column: 1; }
}

/* Navigation */
.bottom-nav { position: fixed; z-index: 40; left: 50%; bottom: 18px; display: grid; grid-template-columns: repeat(5, 1fr); width: min(calc(100% - 30px), 700px); min-height: 78px; padding: 7px 11px; border: 1px solid rgba(37,76,88,.11); border-radius: 26px; background: rgba(255,255,255,.95); box-shadow: 0 20px 60px rgba(34,73,84,.18); backdrop-filter: blur(22px) saturate(1.15); transform: translateX(-50%); }
.bottom-nav-item { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; min-width: 0; padding: 5px 2px; border-radius: 17px; color: #85969b; background: transparent; font-size: .59rem; font-weight: 700; }.bottom-nav-item > svg { width: 22px; height: 22px; }.bottom-nav-item.is-active { color: var(--blue-dark); }.bottom-nav-item.is-active > span:last-of-type { text-decoration: underline; text-decoration-color: var(--coral); text-decoration-thickness: 2px; text-underline-offset: 4px; }.bottom-nav-item.is-active > svg { stroke-width: 2.35; }.bottom-nav-item--main { margin-top: -26px; color: var(--blue-dark); }.main-nav-icon { display: grid; place-items: center; width: 58px; height: 58px; border: 5px solid #fff; border-radius: 50%; color: #fff; background: linear-gradient(145deg, var(--coral), var(--rose) 45%, var(--blue)); box-shadow: 0 12px 28px rgba(229,111,148,.28), 0 5px 14px rgba(63,143,181,.17); }.main-nav-icon svg { width: 26px; height: 26px; stroke-width: 2.1; }.bottom-nav-item--main.is-active .main-nav-icon { box-shadow: 0 0 0 4px rgba(98,185,199,.15), 0 13px 30px rgba(229,111,148,.3); }.nav-badge { position: absolute; top: 0; right: calc(50% - 25px); display: grid; place-items: center; min-width: 18px; height: 18px; padding: 0 4px; border: 2px solid #fff; border-radius: 999px; color: #fff; background: var(--rose); font-size: .52rem; }.planning-dot { position: absolute; top: 7px; right: calc(50% - 18px); width: 6px; height: 6px; border-radius: 50%; background: var(--green); }

/* Modals */
.modal-backdrop { position: fixed; z-index: 60; inset: 0; background: rgba(27,48,54,.45); backdrop-filter: blur(4px); }
.modal { position: fixed; z-index: 70; left: 50%; top: 50%; width: min(calc(100% - 28px), 720px); max-height: min(88vh, 820px); overflow-y: auto; border-radius: 28px; background: #fff; box-shadow: var(--shadow-lg); transform: translate(-50%, -50%); animation: modal-in .22s ease-out; }
@keyframes modal-in { from { opacity: 0; transform: translate(-50%, -47%) scale(.98); } }
.modal-close { position: absolute; z-index: 3; right: 14px; top: 14px; display: grid; place-items: center; width: 39px; height: 39px; border-radius: 50%; background: rgba(255,255,255,.94); box-shadow: var(--shadow-sm); }.modal-close svg { width: 17px; height: 17px; }
.modal.month-calendar-modal { inset: 14px; width: auto; height: calc(100dvh - 28px); max-height: none; overflow: hidden; border-radius: 30px; transform: none; animation: month-modal-in .24s ease-out; }
@keyframes month-modal-in { from { opacity: 0; transform: scale(.985); } }
.month-calendar-shell { display: flex; flex-direction: column; height: 100%; min-height: 0; background: linear-gradient(150deg, #fff 0%, #fffdf8 58%, #f4fbf9 100%); }
.month-calendar-header { display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between; gap: 30px; padding: 25px 82px 18px 30px; border-bottom: 1px solid var(--line); }
.month-calendar-header .eyebrow { margin-bottom: 3px; font-size: .58rem; }.month-calendar-header h2 { margin-bottom: 3px; font-size: clamp(1.75rem, 3vw, 2.55rem); }.month-calendar-header > div > p:last-child { margin-bottom: 0; color: var(--muted); font-size: .68rem; }
.month-calendar-close { position: absolute; right: 25px; top: 25px; display: grid; place-items: center; width: 43px; height: 43px; border: 1px solid var(--line); border-radius: 14px; background: #fff; box-shadow: var(--shadow-sm); }.month-calendar-close svg { width: 18px; height: 18px; }
.month-weekdays { display: grid; flex: 0 0 auto; grid-template-columns: repeat(7, 1fr); gap: 8px; padding: 14px 28px 7px; }.month-weekdays span { color: var(--muted); font-size: .58rem; font-weight: 800; letter-spacing: .07em; text-align: center; text-transform: uppercase; }
.month-calendar-grid { --month-weeks: 6; display: grid; flex: 1 1 auto; grid-template-columns: repeat(7, minmax(0, 1fr)); grid-template-rows: repeat(var(--month-weeks), minmax(0, 1fr)); gap: 7px; min-height: 0; padding: 5px 28px 17px; }
.month-day, .month-day-spacer { min-width: 0; min-height: 0; border-radius: 15px; }.month-day-spacer { border: 1px dashed rgba(37,76,88,.06); background: rgba(245,248,247,.38); }
.month-day { position: relative; display: flex; flex-direction: column; align-items: stretch; gap: 5px; overflow: hidden; padding: 9px; border: 1px solid rgba(37,76,88,.1); background: rgba(255,255,255,.82); text-align: left; transition: border-color .18s, box-shadow .18s, transform .18s; }.month-day:hover { z-index: 1; border-color: rgba(63,143,181,.32); box-shadow: 0 10px 24px rgba(42,76,85,.11); transform: translateY(-1px); }.month-day.has-plan { border-color: rgba(85,173,135,.23); background: linear-gradient(145deg, #fff, #f2faf6); }
.month-day-number { display: grid; flex: 0 0 auto; place-items: center; width: 27px; height: 27px; border-radius: 9px; font-family: "Poppins", sans-serif; font-size: .69rem; font-weight: 800; }.month-day.is-today .month-day-number { color: #fff; background: linear-gradient(135deg, var(--blue), var(--lagoon)); box-shadow: 0 6px 14px rgba(63,143,181,.2); }
.month-day-events { display: grid; align-content: start; gap: 4px; min-height: 0; }.month-event { display: grid; grid-template-columns: 25px minmax(0, 1fr); align-items: center; gap: 5px; min-width: 0; padding: 5px; border-radius: 9px; color: var(--green-dark); background: var(--green-soft); }.month-event > b { display: grid; place-items: center; width: 25px; height: 25px; border-radius: 7px; background: rgba(255,255,255,.7); font-size: .83rem; font-weight: 400; }.month-event > span { display: grid; min-width: 0; }.month-event small { font-size: .48rem; line-height: 1.1; }.month-event strong { overflow: hidden; font-size: .55rem; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }.month-event-more { padding-left: 4px; color: var(--muted); font-size: .49rem; font-weight: 800; }
.month-calendar-legend { display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between; gap: 20px; padding: 10px 29px 13px; border-top: 1px solid var(--line); color: var(--muted); font-size: .58rem; }.month-calendar-legend span { display: flex; align-items: center; gap: 6px; font-weight: 700; }.month-calendar-legend i { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px var(--green-soft); }
.modal.day-plan-modal { width: min(calc(100% - 28px), 760px); }
.day-plan-header { padding: 28px 70px 25px 29px; background: linear-gradient(135deg, #fff1f5, #fff9e8 56%, #e8f6f2); }.day-plan-header > button { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 21px; padding: 8px 11px; border-radius: 11px; color: var(--blue-dark); background: rgba(255,255,255,.75); font-size: .62rem; font-weight: 800; }.day-plan-header > button svg { width: 14px; height: 14px; }.day-plan-header .eyebrow { margin-bottom: 5px; }.day-plan-header h2 { margin-bottom: 6px; font-size: 2rem; }.day-plan-header > p:last-child { margin-bottom: 0; color: var(--muted); font-size: .69rem; }
.day-plan-list { display: grid; gap: 12px; padding: 20px 22px 5px; }.day-plan-card { display: grid; grid-template-columns: 190px minmax(0, 1fr); overflow: hidden; border: 1px solid var(--line); border-radius: 21px; background: #fff; box-shadow: var(--shadow-sm); }.day-plan-visual { min-height: 235px; overflow: hidden; background: var(--blue-soft); }.day-plan-visual img { width: 100%; height: 100%; object-fit: cover; }.day-plan-visual > span { display: grid; place-items: center; height: 100%; font-size: 3rem; }.day-plan-copy { position: relative; padding: 21px; }.day-plan-time { position: absolute; right: 17px; top: 17px; padding: 6px 9px; border-radius: 999px; color: var(--blue-dark); background: var(--blue-soft); font-size: .61rem; font-weight: 800; }.day-plan-copy > p:first-of-type { margin-bottom: 5px; color: var(--green-dark); font-size: .58rem; font-weight: 800; text-transform: uppercase; }.day-plan-copy h3 { max-width: calc(100% - 55px); margin: 0 0 9px; font-family: "Poppins", sans-serif; font-size: 1.05rem; line-height: 1.3; }.day-plan-facts { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 10px; }.day-plan-facts span { padding: 5px 7px; border-radius: 8px; color: var(--ink-soft); background: #f4f8f7; font-size: .55rem; font-weight: 700; }.day-plan-description { margin-bottom: 11px; color: var(--muted); font-size: .62rem; line-height: 1.45; }.day-plan-note { margin-bottom: 12px; padding: 9px 10px; border-radius: 10px; background: var(--sand); }.day-plan-note span { display: block; margin-bottom: 2px; color: #9b792e; font-size: .5rem; font-weight: 800; text-transform: uppercase; }.day-plan-note p { margin: 0; color: var(--ink-soft); font-size: .59rem; }.day-plan-copy .secondary-button { min-height: 38px; }
.day-plan-empty { padding: 34px 20px; text-align: center; }.day-plan-empty > span { font-size: 3rem; }.day-plan-empty h3 { margin: 12px 0 5px; font-family: "Poppins", sans-serif; }.day-plan-empty p { margin-bottom: 0; color: var(--muted); font-size: .69rem; }.day-plan-add { width: calc(100% - 44px); margin: 13px 22px 22px; }
.detail-hero { position: relative; height: 310px; overflow: hidden; background: var(--blue-soft); }.detail-hero img { width: 100%; height: 100%; object-fit: cover; }.detail-hero::after { content: ""; position: absolute; inset: 55% 0 0; background: linear-gradient(transparent, rgba(21,41,44,.35)); }.detail-body { padding: 25px 27px 28px; }.detail-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 13px; }.detail-tags span { padding: 6px 9px; border-radius: 999px; color: var(--green-dark); background: var(--green-soft); font-size: .6rem; font-weight: 800; }.detail-tags .detail-event-tag { color: var(--blue-dark); background: var(--blue-soft); }.detail-body h2 { margin-bottom: 8px; font-size: 2rem; }.detail-body > p { color: var(--muted); font-size: .75rem; line-height: 1.65; }.detail-facts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 7px; margin: 18px 0; }.detail-facts div { padding: 12px 7px; border-radius: 13px; background: #f5f9f8; text-align: center; }.detail-facts strong, .detail-facts small { display: block; }.detail-facts strong { font-size: .76rem; }.detail-facts small { margin-top: 4px; color: var(--muted); font-size: .56rem; }.detail-facilities { padding: 15px; border-radius: 15px; background: var(--sand); }.detail-facilities strong { display: block; margin-bottom: 8px; font-size: .7rem; }.detail-facilities div { display: flex; flex-wrap: wrap; gap: 6px; }.detail-facilities span { font-size: .62rem; }.activity-source-link { display: inline-flex; align-items: center; gap: 5px; margin-top: 13px; color: var(--blue-dark); font-size: .65rem; font-weight: 800; text-decoration: none; }.activity-source-link:hover { text-decoration: underline; }.activity-source-link span { font-size: .8rem; }.detail-actions { display: grid; grid-template-columns: auto 1fr; gap: 9px; margin-top: 17px; }.detail-actions .secondary-button { min-width: 50px; padding: 0; }.detail-actions .secondary-button.is-favorite { color: #fff; border-color: var(--rose); background: var(--rose); }.detail-actions .secondary-button.is-favorite svg { fill: currentColor; }
.route-stop-detail-hero { isolation: isolate; background: linear-gradient(145deg, #e5f4f0, #eaf3f8 55%, #fff2df); }.route-stop-detail-hero::after { z-index: 1; inset: 45% 0 0; background: linear-gradient(transparent, rgba(14,31,34,.54)); pointer-events: none; }.route-stop-detail-photo { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; object-fit: cover; }.route-stop-detail-photo-fallback { position: absolute; z-index: 0; inset: 0; display: grid; place-items: center; align-content: center; gap: 7px; padding: 35px; color: var(--ink-soft); text-align: center; }.route-stop-detail-photo-fallback[hidden] { display: none; }.route-stop-detail-photo-fallback > span { display: grid; place-items: center; width: 68px; height: 68px; border-radius: 22px; background: rgba(255,255,255,.76); box-shadow: var(--shadow-sm); font-size: 2rem; }.route-stop-detail-photo-fallback strong { margin-top: 4px; font-family: "Poppins", sans-serif; font-size: .92rem; }.route-stop-detail-photo-fallback small { color: var(--muted); font-size: .61rem; }.route-stop-detail-position { position: absolute; z-index: 3; left: 14px; top: 14px; display: inline-flex; align-items: center; gap: 7px; padding: 7px 11px 7px 8px; border: 1px solid rgba(37,76,88,.1); border-radius: 12px; color: var(--ink); background: rgba(255,255,255,.94); box-shadow: var(--shadow-sm); backdrop-filter: blur(10px); font-size: .62rem; font-weight: 900; }.route-stop-detail-position b { display: grid; place-items: center; width: 27px; height: 27px; border-radius: 8px; background: var(--green-soft); font-size: .95rem; font-weight: 400; }.route-stop-photo-credit { position: absolute; z-index: 3; right: 13px; bottom: 12px; max-width: calc(100% - 26px); padding: 6px 9px; overflow: hidden; border-radius: 9px; color: #fff; background: rgba(17,32,35,.72); backdrop-filter: blur(8px); font-size: .52rem; font-weight: 700; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }.route-stop-photo-credit:hover { text-decoration: underline; }.route-stop-detail-note { margin: 14px 2px 0; font-size: .62rem !important; }.route-stop-detail-body .detail-facts strong { text-transform: none; }
.form-modal { width: min(calc(100% - 28px), 530px); padding: 30px; }.form-modal h2 { margin-bottom: 6px; font-size: 2rem; }.modal-intro { margin-bottom: 22px; color: var(--muted); font-size: .72rem; line-height: 1.5; }.form-modal form { display: grid; gap: 14px; }.form-modal .primary-button { margin-top: 5px; }.form-modal input:focus, .form-modal select:focus, .form-modal textarea:focus, .route-form select:focus { border-color: rgba(63,143,181,.4); box-shadow: 0 0 0 3px rgba(63,143,181,.09); }
.sheet { position: fixed; z-index: 70; left: 50%; bottom: 0; width: min(100%, 620px); max-height: 92vh; overflow-y: auto; padding: 13px 25px 0; border-radius: 28px 28px 0 0; background: #fff; box-shadow: var(--shadow-lg); transform: translateX(-50%); animation: sheet-in .25s ease-out; }.sheet[hidden] { display: none; } @keyframes sheet-in { from { transform: translate(-50%, 40px); opacity: .5; } }.sheet-handle { width: 42px; height: 5px; margin: 0 auto 18px; border-radius: 999px; background: #dce3e2; }.sheet-heading { display: flex; justify-content: space-between; align-items: center; }.sheet-heading h2 { margin-bottom: 0; }.sheet-heading button { display: grid; place-items: center; width: 37px; height: 37px; border-radius: 50%; background: #f2f6f5; }.sheet-heading button svg { width: 16px; height: 16px; }.filter-sheet fieldset { margin: 25px 0; padding: 0; border: 0; }.filter-sheet legend { display: flex; justify-content: space-between; width: 100%; margin-bottom: 12px; font-size: .72rem; font-weight: 800; }.filter-sheet output { color: var(--blue); }.option-pills { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }.option-pills span, .check-grid span { display: grid; place-items: center; min-height: 42px; padding: 6px; border: 1px solid var(--line); border-radius: 11px; color: var(--muted); font-size: .64rem; cursor: pointer; }.option-pills input:checked + span, .check-grid input:checked + span { color: var(--blue-dark); border-color: rgba(63,143,181,.34); background: var(--blue-soft); font-weight: 700; }.range-input { width: 100%; accent-color: var(--blue); }.range-labels { display: flex; justify-content: space-between; color: var(--muted); font-size: .56rem; }.check-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 7px; }.sheet-footer { position: sticky; bottom: 0; display: grid; grid-template-columns: auto 1fr; gap: 10px; margin: 0 -25px; padding: 14px 25px calc(14px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: rgba(255,255,255,.96); }.text-button { color: var(--blue-dark); background: transparent; font-size: .7rem; font-weight: 800; }
.toast { position: fixed; z-index: 100; left: 50%; bottom: 115px; max-width: calc(100% - 30px); padding: 11px 16px; border-radius: 999px; color: #fff; background: var(--ink); box-shadow: var(--shadow-md); font-size: .69rem; font-weight: 700; opacity: 0; pointer-events: none; transform: translate(-50%, 12px); transition: .25s; }.toast.is-visible { opacity: 1; transform: translate(-50%, 0); }

html[data-large-text="true"] { font-size: 17.5px; }
html[data-reduced-motion="true"] *, html[data-reduced-motion="true"] *::before, html[data-reduced-motion="true"] *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }

html[data-theme="dark"] {
  color-scheme: dark;
  --ink: #eef4f3;
  --ink-soft: #c1cecf;
  --muted: #94a6aa;
  --line: rgba(210, 229, 230, .14);
  --paper: #0e1518;
  --sand: #242018;
  --blue: #6db5d3;
  --blue-dark: #8ecbe1;
  --blue-soft: #18343e;
  --green: #68bd97;
  --green-dark: #86d1af;
  --green-soft: #18342a;
  --coral-soft: #432a2a;
  --sun-soft: #3c3420;
  --white: #172125;
  --shadow-sm: 0 9px 28px rgba(0, 0, 0, .18);
  --shadow-md: 0 20px 52px rgba(0, 0, 0, .25);
  --shadow-lg: 0 30px 80px rgba(0, 0, 0, .34);
  background: #0e1518;
}
html[data-theme="dark"] body { background: #0e1518; }
html[data-theme="dark"] .topbar { border-color: var(--line); background: rgba(14,21,24,.92); }
html[data-theme="dark"] .brand-name { color: var(--ink); }
html[data-theme="dark"] body.map-active .topbar { background: linear-gradient(rgba(14,21,24,.88), rgba(14,21,24,.5), transparent); }
html[data-theme="dark"] :is(.today-pill, .round-button, .popover, .hero-card-search, .quick-row button, .mood-card, .activity-card, .guide-grid > button, .adventure-journal, .surface-card, .route-form select, .form-modal input, .form-modal select, .form-modal textarea, .facility-choices span, .secondary-button, .agenda-item, .calendar-help, .profile-progress-card, .profile-preview-card, .activity-choice-grid span, .need-choices span, .bottom-nav, .modal, .sheet, .theme-choice, .settings-danger-zone, .delete-account-button) { color: var(--ink); border-color: var(--line); background: #172125; }
html[data-theme="dark"] :is(.favorite-list-item, .favorite-view-toggle) { color: var(--ink); border-color: var(--line); background: #172125; }
html[data-theme="dark"] :is(input, select, textarea) { color: var(--ink); }
html[data-theme="dark"] .hero-card { background: linear-gradient(135deg, #282027, #252219 55%, #17262a); }
html[data-theme="dark"] .profile-hero { background: linear-gradient(125deg, #2a2026, #292519 54%, #172b28); }
html[data-theme="dark"] .help-hero { background: linear-gradient(125deg, #172b28, #2d291c 54%, #2b2026); }
html[data-theme="dark"] .settings-hero { background: linear-gradient(125deg, #172a33, #251f31 54%, #30291d); }
html[data-theme="dark"] :is(.settings-back, .profile-back, .help-back, .subscription-back, .themes-back, .modal-close) { color: var(--ink); background: rgba(23,33,37,.86); }
html[data-theme="dark"] .themes-hero { background: linear-gradient(125deg, #172b28, #2d291c 54%, #2b2026); }
html[data-theme="dark"] :is(.help-faq-item, .help-faq-item[open], .help-visual-card) { border-color: var(--line); background: #172125; }
html[data-theme="dark"] .help-faq-toggle { background: #202c30; }
html[data-theme="dark"] .help-faq-answer { border-color: var(--line); }
html[data-theme="dark"] .help-reassurance { background: linear-gradient(135deg, #2d291c, #202522); }
html[data-theme="dark"] .help-reassurance > span, html[data-theme="dark"] .help-reassurance button, html[data-theme="dark"] .help-hero-tags span { color: var(--ink); border-color: var(--line); background: #202c30; }
html[data-theme="dark"] .subscription-hero { background: linear-gradient(125deg, #172b28, #2d291c 54%, #2b2026); }
html[data-theme="dark"] .subscription-current { border-color: var(--line); background: rgba(23,33,37,.78); }
html[data-theme="dark"] .subscription-plan { color: var(--ink); border-color: var(--line); background: #172125; }
html[data-theme="dark"] .subscription-plan--liberty { border-color: rgba(109,181,211,.35); background: linear-gradient(165deg, #17272d, #172125 48%); }
html[data-theme="dark"] .subscription-plan.is-current { border-color: var(--green); }
html[data-theme="dark"] .subscription-travel-highlight { border-color: var(--line); background: linear-gradient(135deg, #18343e, #1b2d29); }
html[data-theme="dark"] .subscription-travel-highlight > span { background: #202c30; }
html[data-theme="dark"] .subscription-plan li.is-unavailable > span { background: #202c30; }
html[data-theme="dark"] .subscription-reassurance { background: linear-gradient(135deg, #172b28, #2d291c); }
html[data-theme="dark"] .subscription-reassurance span { background: #202c30; }
html[data-theme="dark"] .popover::before { border-color: var(--line); background: #172125; }
html[data-theme="dark"] .profile-popover > button:hover { background: #202d31; }
html[data-theme="dark"] .profile-popover hr { border-color: var(--line); }
html[data-theme="dark"] :is(.settings-row-icon, .settings-data-action, .calendar-title button, .agenda-more, .map-place-close, .sheet-heading button) { background: #202c30; }
html[data-theme="dark"] :is(.profile-fields input, .profile-fields select, .child-fields input, .child-fields select, .child-count-stepper, .child-count-stepper button) { color: var(--ink); border-color: var(--line); background: #131d20; }
html[data-theme="dark"] :is(.child-profile-card, .child-profile-card:nth-child(3n + 2), .child-profile-card:nth-child(3n)) { background: linear-gradient(145deg, #182326, #141d20); }
html[data-theme="dark"] :is(.profile-preview-card, .agenda-empty, .route-result-error) { background: linear-gradient(145deg, #17282a, #262419); }
html[data-theme="dark"] .profile-progress-ring::before { background: #172125; }
html[data-theme="dark"] .profile-progress-ring { background: conic-gradient(var(--rose) var(--progress), #2a373a 0); }
html[data-theme="dark"] .route-stop:hover { background: #202c30; }
html[data-theme="dark"] .route-stop-empty { border-color: var(--line); background: #182326; }
html[data-theme="dark"] .route-stop-detail-hero { background: linear-gradient(145deg, #173039, #1d3332 55%, #332c20); }
html[data-theme="dark"] .route-stop-detail-position { color: var(--ink); border-color: var(--line); background: rgba(23,33,37,.94); }
html[data-theme="dark"] .route-stop-detail-photo-fallback > span { background: rgba(23,33,37,.76); }
html[data-theme="dark"] :is(.route-summary div, .detail-facts div) { background: #202c30; }
html[data-theme="dark"] .settings-danger-zone { border-color: rgba(229,111,118,.3); background: #281b1d; }
html[data-theme="dark"] .delete-account-icon { background: #3a2324; }
html[data-theme="dark"] .sheet-footer { border-color: var(--line); background: rgba(23,33,37,.96); }
html[data-theme="dark"] .main-nav-icon { border-color: #172125; }
html[data-theme="dark"] .nav-badge { border-color: #172125; }
html[data-theme="dark"] .pin-placement-card { color: var(--ink); border-color: var(--line); background: rgba(23,33,37,.96); }
html[data-theme="dark"] .place-position-summary { border-color: rgba(104,189,151,.25); background: #18342a; }
html[data-theme="dark"] .car-mode-panel { border-color: var(--line); background: rgba(23,33,37,.97); }
html[data-theme="dark"] .car-mode-heading button, html[data-theme="dark"] .car-mode-status { background: #202c30; }
html[data-theme="dark"] .car-mode-frequency { border-color: var(--line); background: #1b272b; }
html[data-theme="dark"] .leaflet-container { background: #172125; }
html[data-theme="dark"] .leaflet-tile-pane { filter: none; opacity: .72; }
html[data-theme="dark"] :is(.leaflet-control-zoom a, .leaflet-control-attribution) { color: var(--ink) !important; background: rgba(23,33,37,.94) !important; }
html[data-theme="dark"] .toast { color: #172125; background: #eef4f3; }
html[data-theme="dark"] body.auth-active, html[data-theme="dark"] .auth-shell, html[data-theme="dark"] .auth-panel { background: #0e1518; }
html[data-theme="dark"] .auth-visual { background: linear-gradient(145deg, #2b2026, #2d291c 52%, #172b28); }
html[data-theme="dark"] .auth-visual--register { background: linear-gradient(145deg, #172b28, #2d291c 52%, #2b2026); }
html[data-theme="dark"] :is(.auth-benefits span, .auth-testimonial, .auth-card, .auth-socials button) { color: var(--ink); border-color: var(--line); background: rgba(23,33,37,.92); }
html[data-theme="dark"] :is(.auth-field > input, .auth-password-control) { color: var(--ink); border-color: var(--line); background: #131d20; }
html[data-theme="dark"] .auth-field > input:focus, html[data-theme="dark"] .auth-password-control:focus-within { background: #172125; }
html[data-theme="dark"] .auth-error { color: #f1a2a8; background: #341f22; }
html[data-theme="dark"] .password-strength::before { background: #29363a; }

@media (max-width: 900px) {
  .app-shell { padding-left: 22px; padding-right: 22px; }
  .topbar { margin-inline: -22px; padding-inline: 22px; }
  body.map-active .topbar { padding-inline: 22px; }
  .memory-copy { width: 61%; padding-left: 40px; }.memory-scene { width: 50%; }
  .mood-grid { grid-template-columns: repeat(2, 1fr); }.activity-grid { grid-template-columns: repeat(2, 1fr); }.activity-rail { grid-auto-columns: minmax(265px, 45%); }
  .route-layout { grid-template-columns: 1fr; }.route-result { min-height: auto; }.route-result-empty { min-height: 340px; }
  .agenda-layout { grid-template-columns: 1fr; }.planning-aside { grid-template-columns: repeat(2, 1fr); }
  .profile-hero { grid-template-columns: minmax(0, 1fr) 260px; }.profile-hero-copy { padding-left: 36px; }.profile-family { right: 40px; }
  .profile-layout { grid-template-columns: 1fr; }.profile-aside { position: static; grid-template-columns: 1fr; }.profile-progress-card { grid-template-columns: auto 1fr; justify-items: start; align-items: center; gap: 17px; text-align: left; }.profile-progress-ring { margin: 0; }
  .help-hero { grid-template-columns: minmax(0, 1fr) 260px; }.help-hero-copy { padding-left: 36px; }
  .themes-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .settings-layout { grid-template-columns: 1fr; }.settings-aside { position: static; grid-template-columns: minmax(0, 1fr) minmax(260px, .7fr); align-items: stretch; }.settings-help-card { align-content: start; }
  .subscription-plans { grid-template-columns: 1fr; }.subscription-plan { min-height: 0; }.subscription-plan-intro { min-height: 0; }.subscription-reassurance { grid-template-columns: 1fr; }
  .adventure-journal { grid-template-columns: 1fr; gap: 21px; }.adventure-journal-badges { justify-content: flex-start; }
}

@media (max-width: 640px) {
  :root { --map-nav-clearance: 78px; }
  body { background: #fff; }
  .app-shell { padding: 0 15px 116px; }
  body.map-active .topbar { padding-inline: 15px; }
  .topbar { height: 70px; grid-template-columns: 1fr auto; margin-inline: -15px; padding-inline: 15px; }.today-pill { position: static; grid-column: 1; justify-self: start; transform: none; padding: 5px 8px; }.weather-icon { width: 28px; height: 28px; font-size: .9rem; }.today-pill > span:last-child { display: grid; gap: 0; }.today-pill strong { font-size: .75rem; }.today-pill small { font-size: .53rem; }.brand { position: absolute; grid-column: 1 / -1; left: 50%; transform: translateX(-50%); }.brand-name { font-size: 1.2rem; }.brand-mark { width: 31px; height: 31px; }.brand-mark i { inset: 1px 3px 7px 5px; }.brand-mark b { width: 19px; height: 20px; }.topbar-actions { grid-column: 2; }.round-button, .avatar-button { width: 38px; height: 38px; }.popover { position: fixed; left: 14px; right: 14px; top: 66px; width: auto; }.popover::before { display: none; }
  .welcome-row { align-items: center; padding: 23px 0 14px; }.location-chip { display: none; }
  .hero-card { padding: 30px; border-radius: 28px; }.hero-card-cloud { right: -24px; top: 16px; font-size: 88px; }.hero-card h1 { font-size: 2.35rem; }.hero-card p { font-size: .9rem; }.hero-card-search { padding: 7px; border-radius: 17px; }.hero-card-search input { padding: 12px 10px; font-size: .82rem; }.hero-card-search button { min-height: 44px; padding: 0 14px; font-size: .72rem; }
  .quick-row { padding-bottom: 18px; }
  .memory-hero { min-height: 455px; border-radius: 27px; }.memory-copy { width: 100%; padding: 31px 26px; }.memory-copy h2 { font-size: 2.35rem; }.memory-copy p { width: 86%; font-size: .76rem; }.memory-scene { width: 100%; height: 49%; }.scene-sun { width: 48px; height: 48px; }.scene-car { right: 38%; bottom: 40px; font-size: 2.8rem; }.scene-tree { bottom: 42px; font-size: 70px; }
  .content-section { padding-top: 44px; }.mood-section { padding-top: 18px; padding-bottom: 44px; }.section-heading { margin-bottom: 17px; }.section-heading h2 { font-size: 1.65rem; }.mood-grid { gap: 9px; }.mood-card { min-height: 134px; padding: 16px; border-radius: 20px; }.mood-card::after { right: -28px; bottom: -43px; }.mood-card > span { margin-bottom: 11px; font-size: 1.9rem; }.mood-card strong { font-size: .92rem; }.activity-rail { grid-auto-columns: 82%; }.activity-photo { height: 180px; }
  .guide-grid { grid-template-columns: 1fr; }.guide-grid > button { grid-template-columns: 90px 1fr; min-height: 135px; gap: 16px; padding: 15px; }.guide-illustration { height: 100px; }
  .search-view, .match-view, .map-view, .route-view, .planning-view, .profile-view, .settings-view, .help-view, .subscription-view, .themes-view { padding-top: 18px; }.subview-heading { margin-bottom: 19px; }.subview-heading h1, .map-header h1, .planning-header h1 { font-size: 2rem; }.search-toolbar { grid-template-columns: 1fr auto; }.filter-trigger { min-width: 54px; padding: 0; }.filter-trigger > span { display: none; }.results-heading { padding-top: 19px; }.results-controls { gap: 5px; }.results-heading label { font-size: 0; }.results-heading select { max-width: 112px; font-size: .62rem; }.activity-grid { grid-template-columns: 1fr; }.activity-grid .activity-photo { height: 205px; }.favorite-view-toggle button { width: 32px; }.favorite-list-item { gap: 7px; padding: 8px; border-radius: 16px; }.favorite-list-main { grid-template-columns: 82px minmax(0, 1fr); gap: 9px; }.favorite-list-thumb { width: 82px; height: 76px; border-radius: 11px; }.favorite-list-copy .activity-meta { gap: 8px; margin-bottom: 3px; }.favorite-list-copy .activity-category { font-size: .5rem; }.favorite-list-copy .rating { font-size: .56rem; }.favorite-list-copy > strong { font-size: .72rem; }.favorite-list-copy > small { font-size: .52rem; }.favorite-list-facts { gap: 7px; margin-top: 7px; font-size: .49rem; }.favorite-list-facts svg { width: 11px; height: 11px; }.favorite-list-facts b { font-size: .54rem; }.favorite-list-actions { flex-direction: column; gap: 5px; }.favorite-list-actions button { width: 38px; min-height: 38px; padding: 0; border-radius: 11px; }.favorite-list-plan > span { display: none; }
  .view-heading { margin-bottom: 20px; }.view-heading h1 { font-size: 2.35rem; }.match-view .view-heading { margin-bottom: 14px; }.match-preferences { overflow-x: auto; justify-content: flex-start; scrollbar-width: none; }.match-preferences > * { flex: 0 0 auto; }.match-deck { height: clamp(330px, calc(100dvh - 500px), 390px); }.match-card-content h2 { font-size: 1.72rem; }.match-actions { bottom: calc(88px + env(safe-area-inset-bottom)); }.match-action--yes, .match-action--no { width: 58px; height: 58px; }
  .map-overlay-panel { top: 82px; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; width: calc(100% - 24px); padding: 11px; border-radius: 20px; }
  .map-header { min-width: 0; padding-left: 3px; }.map-header .eyebrow { margin-bottom: 1px; }.map-header h1 { overflow: hidden; font-size: 1.05rem; text-overflow: ellipsis; white-space: nowrap; }
  .map-filter-row { grid-column: 1 / -1; grid-row: 2; justify-self: stretch; }
  .map-filter-row button { padding: 8px 11px; }
  .map-action-buttons { grid-column: 2; grid-row: 1; gap: 6px; }.car-mode-button, .add-place-button { width: 44px; height: 44px; min-height: 44px; padding: 0; border-radius: 14px; }
  .car-mode-button > span:last-child, .add-place-button > span:last-child { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
  .car-mode-icon { width: 44px; height: 44px; border-radius: 14px; background: transparent; box-shadow: none; }.car-mode-button[aria-pressed="true"]::after { right: 4px; top: 4px; }
  .car-mode-panel { inset: auto 12px 12px; width: auto; padding: 15px; border-radius: 20px; }.car-mode-status { margin: 12px 0 10px; }.car-mode-frequency { padding: 11px; }
  .add-place-icon { width: 44px; height: 44px; border: 0; border-radius: 14px; background: transparent; }
  .map-view .leaflet-top { top: 194px; }
  .map-legend { gap: 7px; max-width: calc(100% - 76px); flex-wrap: wrap; }.pin-label { display: none; }.leaflet-map.is-detail-zoom .pin-label { display: block; max-width: 118px; padding: 5px 7px; background: #fff; font-size: .57rem; }.map-cluster { width: 56px; height: 56px; border-width: 3px; }.map-cluster strong { font-size: .92rem; }.map-cluster small { font-size: .42rem; }
  .pin-placement-target { width: 68px; height: 68px; }.pin-placement-target::before { width: 92px; }.pin-placement-target::after { height: 92px; }.pin-placement-card { bottom: 12px; grid-template-columns: minmax(0, 1fr) 45px 45px; gap: 6px; width: calc(100% - 24px); padding: 8px; border-radius: 17px; }.pin-placement-copy { gap: 7px; padding-left: 1px; }.pin-placement-copy > span { flex-basis: 34px; height: 34px; border-radius: 11px; font-size: .95rem; }.pin-placement-copy strong { font-size: .65rem; }.pin-placement-copy small { font-size: .52rem; }.pin-placement-copy output { font-size: .49rem; }.pin-placement-confirm, .pin-placement-cancel { width: 45px; height: 45px; border-radius: 13px; }
  .route-layout { gap: 13px; }.route-form { padding: 19px; }.form-row { grid-template-columns: 1fr; }.route-form .form-row { grid-template-columns: repeat(2, 1fr); }.facility-choices { grid-template-columns: repeat(2, 1fr); }.route-map { height: 190px; }
  .planning-header { align-items: end; }.planning-header :is(.secondary-button, .primary-button) { width: 48px; min-height: 48px; padding: 0; }.planning-header .planning-action-label { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }.planning-header .planning-action-icon { flex-basis: 32px; width: 32px; height: 32px; }.calendar-card { padding: 15px 9px; }.week-strip { gap: 2px; }.week-day { min-height: 62px; }.agenda-layout { padding-top: 27px; }.agenda-item { grid-template-columns: 55px 1fr auto; gap: 10px; }.agenda-thumb { display: none; }.planning-aside { grid-template-columns: 1fr; }
  .adventure-journal-section { padding-top: 44px; }.adventure-journal { gap: 18px; padding: 23px 20px; border-radius: 25px; }.adventure-journal-copy h2 { font-size: 1.5rem; }.adventure-journal-badges { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }.adventure-journal-badges button { justify-content: center; padding: 0 10px; }.adventure-journal-badges button:last-child { grid-column: 1 / -1; }
  .profile-hero { grid-template-columns: 1fr; min-height: 0; border-radius: 24px; }.profile-hero-copy { padding: 21px 19px 16px; }.profile-hero h1 { font-size: 1.9rem; }.profile-hero-copy > p:not(.eyebrow) { font-size: .7rem; }.profile-back { margin-bottom: 12px; }.profile-hero-side { min-height: 0; padding: 0 19px 20px; }.profile-hero-scene { display: none; }.profile-hero .profile-progress-card { position: static; margin: 0; padding: 9px 11px; }.profile-hero .profile-progress-card p:last-child { font-size: .53rem; }
  .profile-layout { padding-top: 14px; }.profile-section { padding: 19px 17px; }.profile-section-heading { gap: 10px; margin-bottom: 19px; }.profile-section-heading--count { grid-template-columns: auto minmax(0, 1fr); }.profile-section-heading--count .child-count-stepper { grid-column: 1 / -1; width: 100%; margin-top: 5px; }.child-count-stepper { grid-template-columns: 39px 1fr 39px; }.profile-fields--two, .child-fields { grid-template-columns: 1fr; }.child-profile-card { padding: 16px 13px; }.activity-choice-grid { grid-template-columns: repeat(3, 1fr); }.need-choices { grid-template-columns: repeat(2, 1fr); }.profile-aside { grid-template-columns: 1fr; }.profile-progress-card { grid-template-columns: auto 1fr; gap: 15px; text-align: left; }.profile-progress-ring { width: 82px; height: 82px; }.profile-progress-ring::before { width: 64px; height: 64px; }
  .themes-hero { grid-template-columns: 1fr; min-height: 0; border-radius: 27px; }.themes-hero-copy { padding: 24px 22px 28px; }.themes-back { margin-bottom: 17px; }.themes-hero h1 { font-size: 2.25rem; }.themes-hero-copy > p:last-child { font-size: .75rem; }.themes-hero-scene { min-height: 175px; }.themes-hero-scene::before { right: 7%; bottom: -195px; }.themes-hero-scene::after { right: -45px; bottom: -135px; }.themes-scene-child { right: 17%; bottom: 20px; font-size: 4.8rem; }.themes-scene-sun { right: 23px; top: 6px; font-size: 3rem; }.themes-scene-cloud { left: 12%; top: 38px; font-size: 3.3rem; }.themes-scene-kite { right: 43%; top: 26px; font-size: 2rem; }.themes-catalog { padding-top: 35px; }.themes-heading { margin-bottom: 21px; padding: 0 8px; }.themes-heading h2 { font-size: 1.72rem; }.themes-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }.theme-card { min-height: 168px; padding: 16px 14px; border-radius: 20px; }.theme-card > span { margin-bottom: 12px; font-size: 1.9rem; }.theme-card strong { font-size: .87rem; }.theme-card small { font-size: .59rem; }.theme-card > b { padding-top: 13px; font-size: .56rem; }
  .help-hero { grid-template-columns: 1fr; min-height: 0; border-radius: 27px; }.help-hero-copy { padding: 24px 22px 27px; }.help-back { margin-bottom: 17px; }.help-hero h1 { font-size: 2.15rem; }.help-hero-copy > p:not(.eyebrow) { font-size: .76rem; }.help-hero-visual { min-height: 170px; }.help-hero-visual::before { right: -18px; bottom: -190px; }.help-hero-visual::after { left: -45px; bottom: -180px; }.help-visual-sun { right: 24px; top: 7px; font-size: 3rem; }.help-visual-spark { left: 10%; top: 46px; }.help-visual-card { top: 46%; width: 205px; padding: 17px; }.help-content { padding-top: 37px; }.help-section-heading { margin-bottom: 19px; padding: 0 7px; }.help-section-heading h2 { font-size: 1.75rem; }.help-faq-item { border-radius: 18px; }.help-faq-item summary { grid-template-columns: 43px minmax(0, 1fr) 34px; gap: 10px; min-height: 72px; padding: 11px; }.help-faq-icon { width: 43px; height: 43px; border-radius: 13px; font-size: 1.18rem; }.help-faq-question strong { font-size: .74rem; }.help-faq-toggle { width: 32px; height: 32px; }.help-faq-answer { margin: 0 11px 13px 64px; padding: 12px 4px 1px; }.help-reassurance { grid-template-columns: auto 1fr; padding: 15px; }.help-reassurance button { grid-column: 1 / -1; width: 100%; }
  .subscription-hero { display: block; min-height: 0; border-radius: 24px; }.subscription-hero-copy { padding: 21px 17px 21px 68px; }.subscription-back { left: 16px; top: 17px; }.subscription-hero h1 { font-size: 1.78rem; }.subscription-hero-copy > p:not(.eyebrow) { margin-bottom: 11px; font-size: .68rem; }.subscription-hero-scene { display: none; }.subscription-hero-actions { margin-left: -51px; }.subscription-hero-cta { min-height: 38px; }.subscription-current { padding: 7px 10px; }.subscription-content { padding-top: 31px; }.subscription-heading { margin-bottom: 22px; padding: 0 8px; }.subscription-heading h2 { font-size: 1.75rem; }.subscription-plan { padding: 21px 18px; border-radius: 23px; }.subscription-plan-intro { min-height: 0; }.subscription-reassurance { padding: 10px; }.subscription-reassurance > div { padding: 8px; }
  .settings-hero { grid-template-columns: 1fr; min-height: 0; padding: 24px 22px 27px; border-radius: 27px; }.settings-hero-visual { display: none; }.settings-back { margin-bottom: 18px; }.settings-hero h1 { font-size: 2.4rem; }.settings-hero > div:first-child > p:last-child { font-size: .74rem; }.settings-layout { padding-top: 14px; }.settings-card { padding: 20px 17px; }.settings-card-heading { gap: 11px; margin-bottom: 17px; }.settings-card-heading h2 { font-size: 1.16rem; }.theme-options { grid-template-columns: 1fr; }.theme-choice { grid-template-columns: 82px minmax(0, 1fr) auto; }.theme-preview { width: 82px; }.settings-switch-row { gap: 9px; }.settings-row-icon { width: 36px; height: 36px; }.settings-row-copy small { font-size: .59rem; }.settings-data-action { align-items: stretch; flex-direction: column; }.settings-data-action .secondary-button { width: 100%; }.settings-aside { grid-template-columns: 1fr; }.settings-ad-card { padding: 24px 21px; border-radius: 25px; }.settings-help-card { padding: 18px; }.settings-danger-zone { align-items: stretch; flex-direction: column; padding: 21px 18px; }.delete-account-button { width: 100%; }.delete-account-modal { top: auto; bottom: 0; width: 100%; padding: 28px 20px calc(22px + env(safe-area-inset-bottom)); border-radius: 26px 26px 0 0; transform: translateX(-50%); animation: sheet-in .25s ease-out; }.delete-account-actions { grid-template-columns: 1fr; }
  .bottom-nav { bottom: 0; width: 100%; min-height: 78px; padding: 7px 8px calc(7px + env(safe-area-inset-bottom)); border-width: 1px 0 0; border-radius: 0; }.bottom-nav-item { font-size: .54rem; }.bottom-nav-item > svg { width: 21px; height: 21px; }.bottom-nav-item--main { margin-top: -23px; }.main-nav-icon { width: 55px; height: 55px; }.toast { bottom: 94px; }
  .modal { max-height: 91vh; border-radius: 24px; }.detail-hero { height: 245px; }.detail-body { padding: 22px 19px; }.detail-body h2 { font-size: 1.65rem; }.detail-facts { grid-template-columns: repeat(2, 1fr); }.form-modal { top: auto; bottom: 0; width: 100%; max-height: 92vh; padding: 27px 20px calc(22px + env(safe-area-inset-bottom)); border-radius: 26px 26px 0 0; transform: translateX(-50%); animation: sheet-in .25s ease-out; }.form-modal h2 { font-size: 1.7rem; }.option-pills { grid-template-columns: repeat(2, 1fr); }
  .calendar-title { justify-content: flex-start; padding-left: 4px; }.calendar-title { gap: 9px; }.calendar-title strong { min-width: 105px; text-align: center; }.calendar-expand-button { right: 9px; top: 9px; }
  .modal.month-calendar-modal { inset: 0; width: 100%; height: 100dvh; max-height: none; border-radius: 0; }.month-calendar-header { min-height: 105px; padding: 19px 63px 13px 16px; }.month-calendar-header h2 { font-size: 1.55rem; }.month-calendar-close { right: 13px; top: 16px; width: 40px; height: 40px; }.month-weekdays { gap: 2px; padding: 9px 4px 5px; }.month-weekdays span { overflow: hidden; font-size: .46rem; letter-spacing: 0; text-overflow: ellipsis; }.month-calendar-grid { gap: 2px; padding: 2px 4px 6px; }.month-day, .month-day-spacer { border-radius: 9px; }.month-day { gap: 3px; padding: 4px; }.month-day-number { width: 23px; height: 23px; border-radius: 7px; font-size: .61rem; }.month-event { grid-template-columns: 20px minmax(0, 1fr); gap: 3px; padding: 3px; border-radius: 7px; }.month-event > b { width: 20px; height: 20px; font-size: .68rem; }.month-event strong { display: none; }.month-event small { font-size: .45rem; }.month-event-more { padding-left: 1px; font-size: .44rem; }.month-calendar-legend { padding: 8px 11px calc(9px + env(safe-area-inset-bottom)); }.month-calendar-legend small { display: none; }
  .modal.day-plan-modal { top: auto; bottom: 0; width: 100%; max-height: 94dvh; border-radius: 26px 26px 0 0; transform: translateX(-50%); animation: sheet-in .25s ease-out; }.day-plan-header { padding: 24px 58px 21px 18px; }.day-plan-header > button { margin-bottom: 17px; }.day-plan-header h2 { font-size: 1.55rem; }.day-plan-list { padding: 15px 14px 3px; }.day-plan-card { grid-template-columns: 1fr; }.day-plan-visual { min-height: 155px; max-height: 185px; }.day-plan-copy { padding: 17px; }.day-plan-add { width: calc(100% - 28px); margin: 11px 14px calc(16px + env(safe-area-inset-bottom)); }
}

@media (max-width: 380px) {
  .brand-name { display: none; }.hero-card { padding: 26px 22px; }.hero-card h1 { font-size: 2.05rem; }.hero-card p br { display: none; }.memory-copy h2 { font-size: 2.05rem; }.mood-card { padding: 16px 14px; }.mood-card strong { font-size: .84rem; }.adventure-journal-badges { grid-template-columns: 1fr; }.adventure-journal-badges button:last-child { grid-column: auto; }.bottom-nav-item { font-size: .49rem; }.route-form .form-row { grid-template-columns: 1fr; }
  .profile-hero h1 { font-size: 1.9rem; }.profile-step { width: 34px; height: 34px; }.profile-section-heading h2 { font-size: 1.18rem; }.activity-choice-grid { grid-template-columns: repeat(2, 1fr); }.profile-progress-card { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  .help-hero h1 { font-size: 1.92rem; }.help-hero-tags span { padding: 7px 9px; font-size: .57rem; }.help-faq-item summary { grid-template-columns: 40px minmax(0, 1fr) 30px; gap: 8px; }.help-faq-icon { width: 40px; height: 40px; }.help-faq-question strong { font-size: .7rem; }.help-faq-answer { margin-left: 58px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}