/* Trips home: quiet surfaces and a clear primary action, using brand tokens. */
body:has(.trips-home) {
  background:color-mix(in srgb,var(--bg) 58%,var(--surface-3) 42%);
  background-image:none;
}
body:has(.trips-home)::before {background:none!important}
[dir="rtl"] .home-art {transform:scaleX(-1)}
#view:has(.trips-home) [data-bui-root] {background:transparent}
.trips-home {font-family:"Plus Jakarta Sans",var(--font-body,system-ui),sans-serif;padding-block:8px 40px}
.home-heading {display:flex;justify-content:space-between;align-items:center;gap:16px;padding-block:24px 28px}
.home-heading h1 {font-size:32px;font-weight:700;line-height:1.12;letter-spacing:-.045em;color:var(--text)}
.home-heading p {font-size:13px;color:var(--text-muted);margin-top:8px;line-height:1.6;text-wrap:pretty}
.home-empty {position:relative;overflow:hidden;padding:30px 26px 26px;background:var(--page,var(--bg));border:0;border-radius:24px;box-shadow:0 8px 32px color-mix(in srgb,var(--text) 5%,transparent)}
.home-empty h2 {font-size:24px;font-weight:700;letter-spacing:-.035em;line-height:1.25;color:var(--text);margin:24px 0 9px}
.home-empty p {max-width:290px;font-size:14px;line-height:1.7;color:var(--text-muted);text-wrap:pretty}
.home-art {position:relative;width:132px;height:102px;isolation:isolate}
.home-art__back {position:absolute;inset:8px 0 8px 28px;background:var(--surface-2);border:1px solid color-mix(in srgb,var(--primary-text) 12%,transparent);border-radius:18px;transform:rotate(10deg)}
.home-art__front {position:absolute;inset:3px 25px 3px 2px;display:grid;place-items:center;background:var(--page,var(--bg));border:1px solid color-mix(in srgb,var(--primary-text) 15%,transparent);border-radius:18px;transform:rotate(-7deg);box-shadow:0 6px 18px color-mix(in srgb,var(--text) 7%,transparent);color:var(--primary-text)}
.home-art__front i {font-size:28px}
.home-art__route {position:absolute;inset-inline-end:0;bottom:3px;display:flex;align-items:center;gap:5px;padding:9px 12px;border-radius:12px;background:var(--primary-text);color:var(--on-primary);box-shadow:0 4px 12px color-mix(in srgb,var(--primary-text) 15%,transparent)}
.home-art__route span {width:4px;height:4px;border-radius:50%;background:currentColor;opacity:.8}
.home-art__route i {font-size:12px}
.home-start {display:flex;align-items:center;justify-content:center;gap:9px;width:100%;min-height:48px;border:0;border-radius:13px;margin-top:28px;background:var(--primary-text);color:var(--on-primary);font-size:14px;font-weight:600;box-shadow:0 3px 8px color-mix(in srgb,var(--primary-text) 12%,transparent);transition:transform .15s,filter .15s}
.home-start:hover {filter:brightness(.96)}
.home-start:active {transform:scale(.985)}
.home-join {display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:44px;margin-top:8px;font-size:13px;font-weight:600;color:var(--text-muted);border-radius:12px}
.home-join:hover {color:var(--primary-text);background:var(--surface-2)}
.home-start:focus-visible,.home-join:focus-visible,.home-promotion a:focus-visible,.home-promotion button:focus-visible {outline:3px solid var(--primary-text);outline-offset:4px}
.home-promotion {margin-block:18px;padding:18px 20px;border-radius:18px;background:color-mix(in srgb,var(--page,var(--bg)) 70%,transparent);border:1px solid color-mix(in srgb,var(--border) 16%,transparent);font-family:"Plus Jakarta Sans",var(--font-body,system-ui),sans-serif}
.home-promotion__meta {display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
.home-promotion__label {font-size:11px;font-weight:500;color:var(--text-muted);overflow-wrap:anywhere}
.home-promotion__upgrade {flex-shrink:0;min-height:44px;padding-inline:2px;font-size:11px;font-weight:600;color:var(--primary-text);display:flex;align-items:center;gap:6px}
.home-promotion__link {display:block;color:var(--text);border-radius:8px}
.home-promotion__link strong {font-size:14px;font-weight:600;line-height:1.5}
.home-promotion__link p {font-size:12px;line-height:1.7;color:var(--text-muted);margin-top:4px;text-wrap:pretty}
.home-promotion__link img {width:100%;max-height:160px;object-fit:cover;border-radius:12px;margin-block:8px 12px}
.home-promotion:has(.home-promotion__upgrade) {padding-top:8px}
body:has(.trips-home) header.sticky {background:color-mix(in srgb,var(--bg) 92%,transparent)!important;border-color:transparent!important;backdrop-filter:blur(16px)}
body:has(.trips-home) [data-language-picker] {border-color:color-mix(in srgb,var(--border) 22%,transparent);background:var(--page,var(--bg));color:var(--text);box-shadow:none;border-radius:14px;min-height:44px!important}
body:has(.trips-home) .bottom-nav {background:color-mix(in srgb,var(--page,var(--bg)) 94%,transparent);backdrop-filter:blur(16px);border-top:1px solid color-mix(in srgb,var(--border) 14%,transparent);box-shadow:none}
body:has(.trips-home) .nav-btn {font-size:10px;font-weight:600;gap:6px}
@media(min-width:768px) {
  .trips-home {padding-top:24px}
  .home-heading {padding-block:16px 32px}
  .home-heading h1 {font-size:36px}
  .home-empty {padding:38px 36px 32px}
  .home-empty p {max-width:360px}
  .home-start,.home-join {max-width:320px}
}
@media(prefers-reduced-motion:reduce) {.home-start {transition:none}}