/* NXT TRIP — product stylesheet (app + landing). Loaded only on NXT TRIP pages, after the shared
   layers. Personality: exploration, movement, premium travel. Visual language: generated
   destination covers (sky gradient + layered terrain, drawn from the trip), dashed route lines with
   the NXT node, boarding-pass tickets, day cards on a time rail. Tokens only, except the cover
   moods below, which are artwork colours (identical in light and dark). */

@layer product {
  /* ---------- Cover moods (one per trip cover colour) ---------- */
  .tc-blue   { --sky-a: #292929; --sky-b: #7A7A7A; --sun: #C7C7C7; --l1: #585858; --l2: #404040; --l3: #292929; --ink: #C7C7C7; }
  .tc-teal   { --sky-a: #353535; --sky-b: #959595; --sun: #E6E6E6; --l1: #666666; --l2: #4D4D4D; --l3: #313131; --ink: #E6E6E6; }
  .tc-green  { --sky-a: #2A2A2A; --sky-b: #878787; --sun: #D4D4D4; --l1: #636363; --l2: #494949; --l3: #2F2F2F; --ink: #D4D4D4; }
  .tc-orange { --sky-a: #2B2B2B; --sky-b: #959595; --sun: #E4E4E4; --l1: #717171; --l2: #545454; --l3: #343434; --ink: #E4E4E4; }
  .tc-red    { --sky-a: #1D1D1D; --sky-b: #727272; --sun: #D4D4D4; --l1: #535353; --l2: #3D3D3D; --l3: #242424; --ink: #D4D4D4; }
  .tc-pink   { --sky-a: #222222; --sky-b: #A3A3A3; --sun: #E8E8E8; --l1: #707070; --l2: #515151; --l3: #313131; --ink: #E8E8E8; }
  .tc-purple { --sky-a: #191919; --sky-b: #6D6D6D; --sun: #DBDBDB; --l1: #474747; --l2: #343434; --l3: #1F1F1F; --ink: #DBDBDB; }
  .tc-gray   { --sky-a: #212121; --sky-b: #9A9A9A; --sun: #F4F4F4; --l1: #6A6A6A; --l2: #4C4C4C; --l3: #2E2E2E; --ink: #F4F4F4; }

  .trip-cover { position: relative; overflow: hidden; isolation: isolate; background: linear-gradient(180deg, var(--sky-a, #292929) 0%, var(--sky-b, #7A7A7A) 78%); }
  .cv-svg { position: absolute; inset: 0; width: 100%; height: 100%; }
  .cv-sun { fill: var(--sun); }
  .cv-halo { fill: none; stroke: var(--sun); stroke-opacity: 0.22; stroke-width: 1; }
  .cv-l1 { fill: var(--l1); }
  .cv-l2 { fill: var(--l2); }
  .cv-l3 { fill: var(--l3); }
  .cv-snow { fill: none; stroke: #fff; stroke-opacity: 0.16; stroke-width: 1; }
  .tt-hills .cv-l1, .tt-dunes .cv-l1 { stroke: #fff; stroke-opacity: 0.08; stroke-width: 1; }
  .cv-glint { stroke: var(--sun); stroke-width: 2; stroke-linecap: round; opacity: 0.55; }
  .cv-route { fill: none; stroke: var(--ink); stroke-width: 2; stroke-dasharray: 2 7; stroke-linecap: round; opacity: 0.9; }
  .cv-stop { fill: none; stroke: var(--ink); stroke-width: 2; }
  .cv-node { fill: var(--ink); }
  @media (prefers-reduced-motion: no-preference) {
    .tp-hero .cv-route, .ov-hero .cv-route, .tl-hero .cv-route { animation: trip-dash 30s linear infinite; }
    .tp-hero .cv-node, .ov-hero .cv-node { animation: trip-node 2.6s var(--ease-in-out) infinite; transform-box: fill-box; transform-origin: center; }
  }
  @keyframes trip-dash { to { stroke-dashoffset: -180; } }
  @keyframes trip-node { 50% { transform: scale(1.35); opacity: 0.75; } }

  /* ---------- Small shared pieces ---------- */
  .tg { flex: none; }
  .tp-people { display: inline-flex; align-items: center; }
  .tp-faces { display: inline-flex; }
  .tp-faces .avatar { box-shadow: 0 0 0 2px var(--c-surface); }
  .tp-faces .avatar + .avatar, .tp-faces .tp-more { margin-left: -8px; }
  .tp-more { display: inline-grid; place-items: center; min-width: 28px; height: 28px; padding: 0 6px; border-radius: 14px; background: var(--c-surface2); color: var(--c-muted); font-size: var(--t-caption); font-weight: 700; box-shadow: 0 0 0 2px var(--c-surface); }
  .tp-note { display: flex; gap: var(--s-2); align-items: flex-start; margin-top: var(--s-6); max-width: 80ch; }
  .tp-note .i { margin-top: 2px; flex: none; }
  .tp-lead { margin: 0 0 var(--s-5); color: var(--c-muted); font-size: var(--t-small); }
  .tp-clear { display: flex; gap: var(--s-2); align-items: center; margin: 0; color: var(--c-success); font-weight: 600; }
  .tp-clear span { color: var(--c-text); font-weight: 500; }
  .tp-usage { margin-top: var(--s-5); display: grid; gap: var(--s-3); }
  .tp-usage .h-xs { margin: 0; }
  .tp-cols { display: grid; gap: var(--s-5); grid-template-columns: minmax(0, 1fr); margin-top: var(--s-5); }
  .tp-cols > .panel { margin: 0; }
  @media (min-width: 900px) { .tp-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  .tp-attn .tone-info .attn-icon { background: var(--c-info-soft); color: var(--c-info); }
  .tp-attn .step-title { margin: 0; font-weight: 600; }
  .tp-attn p { margin: 2px 0 0; }
  .tp-details > summary { font-weight: 600; font-size: var(--t-small); color: var(--c-link); padding: var(--s-2) 0; }
  .tp-details[open] > summary { margin-bottom: var(--s-4); }
  .tp-details-panel > summary { font-weight: 600; }
  .tp-details-panel[open] > summary { margin-bottom: var(--s-5); }
  .tp-status { align-items: flex-end; }
  .tp-status .field { min-width: 200px; }

  /* Rail blocks (split layout aside) */
  .rail-block + .rail-block { margin-top: var(--s-6); padding-top: var(--s-6); border-top: 1px solid var(--c-border); }
  .rail-title { font: 600 var(--t-h4)/1.3 var(--font-sans); margin: 0 0 var(--s-4); }
  .app-rail .form { max-width: none; gap: var(--s-4); }
  .app-rail .form .row > .field { flex: 1 1 120px; }
  .tp-next-steps { list-style: none; margin: 0 0 var(--s-4); padding: 0; display: grid; gap: var(--s-4); }
  .tp-next-steps li { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: var(--s-3); margin: 0; font-size: var(--t-small); color: var(--c-muted); }
  .tp-next-steps .i { color: var(--c-link); margin-top: 2px; }
  .tp-next-steps strong { color: var(--c-text); }

  /* ---------- Trip page frame ---------- */
  .trip-dest { display: block; font-weight: 600; color: var(--c-text); }
  .trip-facts { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-3); align-items: center; margin-top: var(--s-2); font-size: var(--t-small); color: var(--c-muted); }
  .trip-strip { margin: calc(var(--s-2) * -1) 0 var(--s-6); position: relative; }
  .trip-strip ul { list-style: none; margin: 0; padding: 0 0 2px; display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; scroll-snap-type: x proximity; }
  .trip-strip ul::-webkit-scrollbar { display: none; }
  .trip-strip li { margin: 0; flex: none; scroll-snap-align: start; }
  .trip-strip a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 var(--s-4); border-radius: var(--r-sm); border: 1px solid var(--c-border); background: var(--c-surface); color: var(--c-muted); font-size: var(--t-small); font-weight: 600; text-decoration: none; white-space: nowrap; }
  .trip-strip a:hover { color: var(--c-text); border-color: var(--c-border-strong); }
  .trip-strip a[aria-current='page'] { color: var(--c-on-primary); background: var(--c-primary); border-color: var(--c-primary); }
  .trip-strip a.is-locked { opacity: 0.7; }
  @media (min-width: 1024px) { .trip-strip { display: none; } }

  /* ---------- Route ribbon ---------- */
  .route { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
  .route li { margin: 0; }
  .rs { position: relative; display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: var(--s-3); align-items: start; }
  .rs-node { position: relative; z-index: 1; width: 14px; height: 14px; margin: 4px 5px; border-radius: 3px; background: var(--c-surface); border: 2px solid var(--c-link); }
  .rs.is-last .rs-node { background: var(--c-accent); border-color: var(--c-accent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--c-accent) 30%, transparent); }
  .rs-text { display: grid; gap: 2px; min-width: 0; padding-bottom: 2px; }
  .rs-name { font-weight: 650; overflow-wrap: anywhere; }
  .rs-name.is-code { font-family: var(--font-display); font-size: 1.375rem; letter-spacing: 0.02em; line-height: 1.1; }
  .rs-date { font-size: var(--t-caption); color: var(--c-muted); font-family: var(--font-mono); }
  .rs-stays { display: grid; gap: 2px; margin-top: 4px; }
  .rs-stays a { display: inline-flex; gap: 6px; align-items: center; font-size: var(--t-small); color: var(--c-muted); text-decoration: none; }
  .rs-stays a:hover { color: var(--c-link); }
  .rl { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: var(--s-3); min-height: 48px; align-items: center; }
  .rl::before { content: ''; grid-column: 1; grid-row: 1; justify-self: center; width: 2px; height: 100%; min-height: 48px; background: var(--c-link); opacity: 0.5; }
  .rl-unknown::before { background: repeating-linear-gradient(180deg, var(--c-border-strong) 0 4px, transparent 4px 9px); opacity: 1; }
  .rl > a, .rl > .tg, .rl > .rl-text { grid-column: 2; grid-row: 1; }
  .rl > a { display: inline-flex; gap: var(--s-2); align-items: center; color: inherit; text-decoration: none; justify-self: start; padding: 4px 10px 4px 8px; border-radius: var(--r-sm); background: var(--c-primary-soft); }
  .rl > a:hover { background: color-mix(in srgb, var(--c-primary) 18%, var(--c-surface)); }
  .rl:not(:has(> a)) { grid-template-columns: 24px auto minmax(0, 1fr); }
  .rl:not(:has(> a)) > .tg { grid-column: 2; color: var(--c-link); }
  .rl:not(:has(> a)) > .rl-text { grid-column: 3; }
  .rl > a .tg { color: var(--c-link); }
  .rl-unknown .tg, .rl-unknown > a .tg { color: var(--c-muted); }
  .rl-text { display: grid; gap: 0; min-width: 0; }
  .rl-mode { font-size: var(--t-small); font-weight: 600; }
  .rl-meta { font-size: var(--t-caption); color: var(--c-muted); font-family: var(--font-mono); }
  .rl-unknown .rl-mode { color: var(--c-muted); font-weight: 500; }
  @media (min-width: 900px) {
    .ov-route .route { columns: 3 220px; column-gap: var(--s-8); }
    .ov-route .route > li { break-inside: avoid; }
  }

  /* ---------- Route line (schematic SVG) ---------- */
  .rt { margin: var(--s-2) 0 var(--s-5); border-radius: var(--r-md); background: var(--c-surface2); border: 1px solid var(--c-border); overflow: hidden; }
  .rt-svg { display: block; width: 100%; height: auto; max-height: 260px; }
  .rt-grid { fill: none; stroke: var(--c-border); stroke-width: 1; opacity: 0.7; }
  .rt-seg { fill: none; stroke: var(--c-text); stroke-width: 2.5; stroke-linecap: round; }
  .rt-flight { stroke-dasharray: 1 7; stroke-width: 3; }
  .rt-train { stroke-width: 7; }
  .rt-train-in { stroke: var(--c-surface2); stroke-width: 3; stroke-dasharray: 2 5; }
  .rt-ferry { stroke-dasharray: 12 6; }
  .rt-unknown { stroke: var(--c-subtle); stroke-dasharray: 2 5; stroke-width: 2; }
  .rt-mode rect { fill: var(--c-surface); stroke: var(--c-border-strong); }
  .rt-mode path { fill: none; stroke: var(--c-text); stroke-width: 3.4; stroke-linecap: round; stroke-linejoin: round; }
  .rt-stop rect { fill: var(--c-surface); stroke: var(--c-text); stroke-width: 2.5; }
  .rt-stop.is-last rect { fill: var(--c-text); }
  .rt-name { fill: var(--c-text); font: 650 14px/1 var(--font-sans); }
  .rt-name.is-code { font: 650 19px/1 var(--font-display); letter-spacing: 0.02em; }
  .rt-date { fill: var(--c-muted); font: 500 11px/1 var(--font-mono); }
  @media (prefers-reduced-motion: no-preference) {
    .rt-flight { animation: trip-dash 18s linear infinite; }
  }
  @media (max-width: 639px) {
    .rt-wide { display: none; }
    .route.is-compact { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 4px; }
    .route.is-compact .rs { display: inline-flex; gap: 6px; align-items: center; }
    .route.is-compact .rs-node { width: 10px; height: 10px; margin: 0; }
    .route.is-compact .rs-date, .route.is-compact .rl-text { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
    .route.is-compact .rs-name.is-code { font-size: 1.0625rem; }
    .route.is-compact .rs-name { font-size: var(--t-small); }
    .route.is-compact .rl { display: inline-flex; min-height: 0; gap: 2px; align-items: center; color: var(--c-muted); }
    .route.is-compact .rl::before { display: none; }
    .route.is-compact .rl::after { content: ''; width: 14px; border-top: 2px solid var(--c-border-strong); }
    .route.is-compact .rl-unknown::after { border-top-style: dotted; }
  }
  @media (min-width: 640px) { .tp-hero-route .route.is-compact { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; } }

  /* ---------- Dashboard hero ---------- */
  .tp-hero { position: relative; display: grid; border-radius: var(--r-xl); overflow: hidden; border: 1px solid var(--c-border); background: var(--c-surface); box-shadow: var(--e-1); }
  .tp-hero-art { height: 200px; }
  .tp-hero-top { position: absolute; inset: 0 0 auto 0; height: 200px; display: flex; gap: var(--s-4); align-items: flex-end; padding: var(--s-5); color: #fff; background: linear-gradient(180deg, transparent 30%, rgb(12 12 12 / 0.55)); }
  .tp-count { display: grid; margin: 0; line-height: 1; flex: none; text-shadow: 0 1px 12px rgb(0 0 0 / 0.35); }
  .tp-count-n { font: 650 clamp(2.5rem, 2rem + 2.4vw, 3.75rem)/0.9 var(--font-display); letter-spacing: -0.04em; }
  .tp-count-of { font-size: var(--t-small); font-weight: 600; opacity: 0.9; margin-top: 4px; }
  .tp-hero-id { min-width: 0; }
  .tp-hero-id .overline { color: rgb(255 255 255 / 0.82); margin: 0 0 4px; }
  .tp-hero-id h2 { font: 650 clamp(1.375rem, 1.1rem + 1.2vw, 2rem)/1.1 var(--font-display); letter-spacing: -0.025em; color: #fff; }
  .tp-hero-id h2 a { color: inherit; text-decoration: none; }
  .tp-hero-id h2 a:hover { text-decoration: underline; text-decoration-thickness: 2px; }
  .tp-hero-facts { display: flex; flex-wrap: wrap; gap: var(--s-1) var(--s-3); align-items: center; margin: 6px 0 0; font-size: var(--t-small); color: rgb(255 255 255 / 0.9); }
  .tp-hero-facts .avatar { box-shadow: 0 0 0 2px rgb(255 255 255 / 0.65); }
  .tp-hero-route { padding: var(--s-5) var(--s-5) 0; margin: 0; }
  .tp-hero-route .rt { margin: var(--s-2) 0 0; }
  .tp-hero-ready { padding: var(--s-5); }
  .tp-hero-ready .overline { margin-bottom: var(--s-2); }
  @media (min-width: 1100px) {
    .tp-hero-ready .rd-list { grid-template-columns: repeat(5, minmax(0, 1fr)); column-gap: var(--s-5); }
    .tp-hero-ready .rd-row { border-top: 0; }
    .tp-hero-ready .rd-row a { grid-template-columns: 22px minmax(0, 1fr); grid-template-rows: auto auto 4px; row-gap: 4px; }
    .tp-hero-ready .rd-ic { grid-row: 1; }
    .tp-hero-ready .rd-val { grid-column: 1 / 3; font: 650 1.0625rem/1.2 var(--font-display); color: var(--c-text); }
    .tp-hero-ready .rd-bar { grid-column: 1 / 3; }
  }
  .tp-hero-actions { display: flex; flex-wrap: wrap; gap: var(--s-2); padding: 0 var(--s-5) var(--s-5); }
  @media (min-width: 900px) {
    .tp-hero-art, .tp-hero-top { height: 240px; }
    .tp-hero-top { padding: var(--s-6) var(--s-8); gap: var(--s-6); }
    .tp-hero-route { padding: var(--s-6) var(--s-8) 0; }
    .tp-hero-ready { padding: var(--s-6) var(--s-8); }
    .tp-hero-actions { padding: 0 var(--s-8) var(--s-6); }
  }
  .rd-list { list-style: none; margin: 0; padding: 0; display: grid; }
  .rd-row { margin: 0; border-top: 1px solid var(--c-border); }
  .rd-row:first-child { border-top: 0; }
  .rd-row a, .rd-row .rd-a { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; grid-template-rows: auto 4px; column-gap: var(--s-3); row-gap: 6px; align-items: center; padding: 10px 0; color: var(--c-text); text-decoration: none; }
  .rd-row a:hover .rd-label { color: var(--c-link); }
  .rd-ic { grid-row: 1 / 3; color: var(--c-muted); display: grid; }
  .rd-row.is-ok .rd-ic { color: var(--c-success); }
  .rd-label { font-size: var(--t-small); font-weight: 600; }
  .rd-val { font-size: var(--t-small); color: var(--c-muted); }
  .rd-bar { grid-column: 2 / 4; height: 4px; border-radius: 2px; background: var(--c-surface2); overflow: hidden; }
  .rd-bar i { display: block; height: 100%; background: var(--c-primary); border-radius: inherit; }
  .rd-row.is-ok .rd-bar i { background: var(--c-success); }

  .tp-today .panel-head { margin-bottom: var(--s-4); }
  .tp-today .overline { margin: 0 0 2px; }
  .tp-today, .tp-hero + .tp-today { margin-top: var(--s-5); }
  .tp-agenda { list-style: none; margin: 0; padding: 0; display: grid; }
  .tp-agenda li { display: grid; grid-template-columns: 52px 28px minmax(0, 1fr); gap: var(--s-2); align-items: center; padding: var(--s-2) 0; margin: 0; border-top: 1px dashed var(--c-border); }
  .tp-agenda li:first-child { border-top: 0; }
  .tp-agenda .num { font-family: var(--font-mono); font-size: var(--t-small); color: var(--c-muted); }
  .tp-agenda-ic { display: grid; place-items: center; width: 28px; height: 28px; border-radius: var(--r-sm); background: var(--c-primary-soft); color: var(--c-link); }

  .tp-soon { list-style: none; margin: 0; padding: 0; display: grid; }
  .tp-soon li { display: grid; grid-template-columns: 44px 30px minmax(0, 1fr); gap: var(--s-3); align-items: center; margin: 0; padding: var(--s-3) 0; border-top: 1px solid var(--c-border); }
  .tp-soon li:first-child { border-top: 0; padding-top: 0; }
  .tp-soon-when { display: grid; justify-items: center; line-height: 1; padding: 6px 0; border-radius: var(--r-sm); background: var(--c-surface2); }
  .tp-soon-when span { font-size: 0.625rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--c-muted); font-weight: 700; }
  .tp-soon-when strong { font: 650 1.125rem/1.1 var(--font-display); }
  .tp-soon-ic { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; border: 1px solid var(--c-border); color: var(--c-link); }
  .tp-soon-body { display: grid; min-width: 0; }
  .tp-soon-body a { font-weight: 600; color: var(--c-text); text-decoration: none; overflow-wrap: anywhere; }
  .tp-soon-body a:hover { color: var(--c-link); text-decoration: underline; }

  .tp-welcome { display: grid; border-radius: var(--r-xl); overflow: hidden; border: 1px solid var(--c-border); background: var(--c-surface); margin-bottom: var(--s-5); }
  .tp-welcome-art { min-height: 180px; }
  .tp-welcome-copy { padding: var(--s-6); display: grid; gap: var(--s-3); align-content: center; }
  .tp-welcome-copy h2 { font: 650 clamp(1.5rem, 1.2rem + 1.2vw, 2.125rem)/1.1 var(--font-display); letter-spacing: -0.025em; }
  .tp-welcome-copy p { margin: 0; color: var(--c-muted); }
  @media (min-width: 900px) { .tp-welcome { grid-template-columns: 1fr 1fr; } .tp-welcome-art { min-height: 300px; } .tp-welcome-copy { padding: var(--s-10); } }

  /* ---------- Trip cards (postcards) ---------- */
  .tp-shelf { margin-top: var(--s-8); }
  .tp-shelf > h2, .tp-shelf > .spread h2 { font: 600 var(--t-h3)/1.3 var(--font-sans); display: flex; gap: var(--s-2); align-items: center; }
  .tp-shelf > h2 { margin-bottom: var(--s-4); }
  .tp-shelf > .spread { margin-bottom: var(--s-4); }
  .tp-shelf:first-child { margin-top: 0; }
  .tp-shelf > p { margin: calc(var(--s-2) * -1) 0 var(--s-4); }
  .tcard-grid { display: grid; gap: var(--s-4); grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
  .tcard { position: relative; display: grid; grid-template-rows: auto 1fr; border: 1px solid var(--c-border); border-radius: var(--r-lg); overflow: hidden; background: var(--c-surface); transition: transform var(--d-base) var(--ease-out), box-shadow var(--d-base) var(--ease-out), border-color var(--d-fast); }
  .tcard:hover { transform: translateY(-2px); box-shadow: var(--e-2); border-color: var(--c-border-strong); }
  .tcard:focus-within { box-shadow: 0 0 0 2px var(--c-focus); }
  .tcard-cover { height: 112px; }
  .tcard.is-archived .tcard-cover { filter: grayscale(0.8); opacity: 0.75; }
  .tcard-body { display: grid; gap: var(--s-1); padding: var(--s-4) var(--s-4) var(--s-4); align-content: start; }
  .tcard-when { display: flex; justify-content: space-between; gap: var(--s-2); align-items: center; margin: 0; font-size: var(--t-caption); font-weight: 700; color: var(--c-link); text-transform: uppercase; letter-spacing: 0.06em; }
  .tcard-name { font: 650 1.125rem/1.25 var(--font-display); letter-spacing: -0.015em; margin-top: 2px; }
  .tcard-name a { color: var(--c-text); text-decoration: none; }
  .tcard-name a::after { content: ''; position: absolute; inset: 0; border-radius: inherit; }
  .tcard-name a:focus-visible { outline: none; }
  .tcard-meta { margin: 0; font-size: var(--t-small); color: var(--c-muted); overflow-wrap: anywhere; }
  .tcard-foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--s-1) var(--s-3); margin: var(--s-2) 0 0; padding-top: var(--s-3); border-top: 1px dashed var(--c-border); font-size: var(--t-caption); color: var(--c-muted); }

  /* ---------- New trip ---------- */
  .mood-picker { display: grid; gap: var(--s-2); }
  .mood-picker legend { font-weight: 600; font-size: var(--t-small); margin-bottom: 0; }
  .mood-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); gap: var(--s-2); margin-top: var(--s-2); }
  .mood { position: relative; display: grid; gap: 6px; padding: 6px; border-radius: var(--r-md); border: 1px solid var(--c-border); background: var(--c-surface); cursor: pointer; font-size: var(--t-caption); font-weight: 600; color: var(--c-muted); text-align: center; }
  .mood input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
  .mood-swatch { display: block; height: 40px; border-radius: var(--r-sm); background: linear-gradient(180deg, var(--sky-a) 0 34%, var(--sky-b) 34% 56%, var(--l1) 56% 72%, var(--l3) 72%); position: relative; }
  .mood-swatch::after { content: ''; position: absolute; width: 10px; height: 10px; border-radius: 50%; background: var(--sun); top: 6px; right: 10px; }
  .mood:has(input:checked) { border-color: var(--c-primary); box-shadow: 0 0 0 1px var(--c-primary); color: var(--c-text); }
  .mood:has(input:focus-visible) { outline: 2px solid var(--c-focus); outline-offset: 2px; }
  .trip-form .row > .field { flex: 1 1 200px; }

  /* ---------- Overview ---------- */
  .ov-hero { position: relative; border-radius: var(--r-xl); overflow: hidden; margin-bottom: var(--s-5); border: 1px solid var(--c-border); }
  .ov-hero-art { height: 180px; }
  .ov-hero-in { position: absolute; inset: auto 0 0 0; display: flex; justify-content: space-between; align-items: flex-end; gap: var(--s-4); padding: var(--s-5); color: #fff; background: linear-gradient(180deg, transparent, rgb(12 12 12 / 0.5)); }
  .ov-hero-meta { display: flex; gap: var(--s-2); align-items: center; font-size: var(--t-small); font-weight: 600; }
  .ov-hero-meta .avatar { box-shadow: 0 0 0 2px rgb(255 255 255 / 0.7); }
  @media (min-width: 900px) { .ov-hero-art { height: 220px; } .ov-hero-in { padding: var(--s-6) var(--s-8); } }
  .ov-days { list-style: none; margin: 0; padding: 0 0 4px; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(96px, 1fr); gap: 6px; overflow-x: auto; scrollbar-width: thin; }
  .ov-days li { margin: 0; }
  .ov-days a { display: grid; gap: 2px; padding: var(--s-3); border-radius: var(--r-md); border: 1px solid var(--c-border); background: var(--c-surface); color: var(--c-text); text-decoration: none; height: 100%; }
  .ov-days a:hover { border-color: var(--c-link); }
  .ov-days .is-free a { border-style: dashed; background: transparent; }
  .ov-days .is-past a { border-style: dashed; color: var(--c-muted); }
  .ov-days .is-today a { border-color: var(--c-primary); box-shadow: inset 0 0 0 1px var(--c-primary); background: var(--c-primary-soft); opacity: 1; }
  .ov-day-n { font: 600 var(--t-overline)/1.2 var(--font-mono); letter-spacing: 0.08em; text-transform: uppercase; color: var(--c-muted); }
  .ov-day-d { font-weight: 650; font-size: var(--t-small); }
  .ov-day-c { font-size: var(--t-caption); color: var(--c-link); font-weight: 600; }
  .is-free .ov-day-c { color: var(--c-muted); }
  .tp-stats { margin-top: var(--s-5); }
  .tp-stats .stat-label { display: flex; gap: 6px; align-items: center; }
  .ov-route .route { margin-top: var(--s-2); }

  /* ---------- Itinerary ---------- */
  .iti-nav { position: sticky; top: calc(var(--layout-header) + var(--s-2)); z-index: var(--z-raised); margin: 0 0 var(--s-5); padding: 6px; border-radius: var(--r-md); background: color-mix(in srgb, var(--c-bg) 88%, transparent); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border: 1px solid var(--c-border); }
  .iti-nav ol { list-style: none; margin: 0; padding: 0; display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; }
  .iti-nav ol::-webkit-scrollbar { display: none; }
  .iti-nav li { margin: 0; flex: none; }
  .iti-nav a { display: grid; grid-template-columns: auto auto; column-gap: 8px; align-items: center; min-height: 44px; padding: 4px 10px; border-radius: var(--r-sm); color: var(--c-text); text-decoration: none; }
  .iti-nav a:hover { background: var(--c-surface2); }
  .iti-nav-n { font: 600 var(--t-overline)/1.2 var(--font-mono); letter-spacing: 0.08em; text-transform: uppercase; color: var(--c-muted); }
  .iti-nav-d { grid-row: 2; font-size: var(--t-small); font-weight: 600; white-space: nowrap; }
  .iti-nav-c { grid-row: 1 / 3; grid-column: 2; display: grid; place-items: center; min-width: 22px; height: 22px; padding: 0 5px; border-radius: 11px; background: var(--c-primary-soft); color: var(--c-link); font-size: var(--t-caption); font-weight: 700; }
  .iti-nav a.is-free .iti-nav-c { background: transparent; color: var(--c-subtle); }
  .iti-nav a.is-today { background: var(--c-primary); color: var(--c-on-primary); }
  .iti-nav a.is-today .iti-nav-n { color: inherit; opacity: 0.85; }
  .iti-nav a.is-today .iti-nav-c { background: rgb(255 255 255 / 0.2); color: inherit; }

  .tday { position: relative; scroll-margin-top: calc(var(--layout-header) + 80px); padding: var(--s-5); border: 1px solid var(--c-border); border-radius: var(--r-lg); background: var(--c-surface); }
  .tday + .tday { margin-top: var(--s-4); }
  .tday.is-today { border-color: var(--c-primary); box-shadow: inset 4px 0 0 var(--c-primary); }
  .tday.is-past { background: color-mix(in srgb, var(--c-surface) 70%, var(--c-bg)); }
  .tday.is-ideas { border-style: dashed; background: transparent; }
  .tday.is-outside { border-color: color-mix(in srgb, var(--c-warning) 50%, var(--c-border)); }
  .tday-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--s-1) var(--s-3); margin-bottom: var(--s-4); }
  .tday-n, .tday-head .tday-n { font: 600 var(--t-overline)/1.2 var(--font-mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-link); padding: 4px 8px; border-radius: var(--r-xs); background: var(--c-primary-soft); }
  .tday-head h2 { font: 650 clamp(1.125rem, 1rem + 0.5vw, 1.375rem)/1.2 var(--font-display); letter-spacing: -0.015em; }
  .tday-c { margin-left: auto; }
  .tday-free { margin: 0; color: var(--c-muted); font-size: var(--t-small); padding: var(--s-3) var(--s-4); border-radius: var(--r-md); background: repeating-linear-gradient(135deg, transparent 0 8px, color-mix(in srgb, var(--c-border) 45%, transparent) 8px 9px); }
  .ti-list { list-style: none; margin: 0; padding: 0; display: grid; position: relative; }
  .ti-list.is-res-list { margin-bottom: var(--s-2); }
  .ti-list::before { content: ''; position: absolute; left: calc(52px + var(--s-3) + 14px); top: 10px; bottom: 10px; width: 2px; background: var(--c-border); border-radius: 1px; }
  .ti { position: relative; display: grid; grid-template-columns: 52px 30px minmax(0, 1fr); column-gap: var(--s-3); align-items: start; padding: var(--s-2) 0; margin: 0; }
  .ti-time { font: 500 var(--t-small)/30px var(--font-mono); color: var(--c-muted); text-align: right; }
  .ti-mark { position: relative; z-index: 1; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--c-surface); border: 2px solid var(--c-border-strong); color: var(--c-muted); }
  .ti-k-activity .ti-mark { border-color: var(--c-link); color: var(--c-link); }
  .ti-k-meal .ti-mark { border-color: var(--c-warning); color: var(--c-warning); }
  .ti-k-lodging .ti-mark { border-color: var(--c-success); color: var(--c-success); }
  .ti.is-res .ti-mark { background: var(--c-primary); border-color: var(--c-primary); color: var(--c-on-primary); border-radius: var(--r-sm); }
  .ti-body { min-width: 0; padding-top: 4px; }
  .ti-title { margin: 0; overflow-wrap: anywhere; }
  .ti-title a { color: var(--c-text); text-decoration: none; }
  .ti-title a:hover { color: var(--c-link); text-decoration: underline; }
  .ti-kind { font-size: var(--t-caption); color: var(--c-muted); font-weight: 500; }
  .ti.is-ai .ti-kind { color: var(--c-warning); }
  .ti-place { display: flex; flex-wrap: wrap; gap: 4px 6px; align-items: center; margin: 4px 0 0; font-size: var(--t-small); color: var(--c-muted); }
  .ti-place .tg { color: var(--c-subtle); }
  .ti-map a { font-size: var(--t-caption); font-weight: 600; }
  .ti-notes { margin: 6px 0 0; font-size: var(--t-small); padding-left: var(--s-3); border-left: 2px solid var(--c-border); }
  .ti-link { margin: 4px 0 0; font-size: var(--t-small); }
  .ti-link a { display: inline-flex; gap: 4px; align-items: center; }
  .ti-actions { grid-column: 3; display: flex; gap: 2px; margin-top: 4px; }
  .ti-actions form { margin: 0; }
  @media (min-width: 640px) { .ti { grid-template-columns: 52px 30px minmax(0, 1fr) auto; } .ti-actions { grid-column: 4; margin-top: 0; } }
  .ti-gap { position: relative; margin: 0; padding: 2px 0 2px calc(52px + 30px + var(--s-3) * 2); font-size: var(--t-caption); color: var(--c-muted); font-family: var(--font-mono); }
  .ti-form { max-width: none; }
  .tp-plot-in { display: grid; gap: var(--s-4); grid-template-columns: minmax(0, 1fr); align-items: start; }
  @media (min-width: 900px) { .tp-plot-in { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); } }
  .tp-plot { margin: 0 0 var(--s-5); }
  .tp-plot figcaption { margin-top: var(--s-3); }
  .plot-svg { width: 100%; height: auto; border-radius: var(--r-md); background: var(--c-surface2); }
  .pl-grid { fill: none; stroke: var(--c-border); stroke-width: 1; }
  .pl-line { fill: none; stroke: var(--c-link); stroke-width: 2.5; stroke-dasharray: 6 6; stroke-linecap: round; stroke-linejoin: round; }
  .pl-stop rect { fill: var(--c-primary); }
  .pl-stop text { fill: var(--c-on-primary); font: 700 11px/1 var(--font-sans); }
  .pl-stop:last-child rect { fill: var(--c-accent); }
  .pl-stop:last-child text { fill: var(--c-on-accent); }
  .tp-plot-legend { margin: 0; padding-left: 1.5em; display: grid; gap: 4px; font-size: var(--t-small); }
  .tp-plot-legend li { margin: 0; }

  /* ---------- Timeline ---------- */
  .tl-days { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-4); }
  .tl-day { margin: 0; padding: var(--s-5); border: 1px solid var(--c-border); border-radius: var(--r-lg); background: var(--c-surface); }
  .tl-day.is-today { border-color: var(--c-primary); }
  .tl-day-head { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-3); align-items: baseline; font: 650 1.125rem/1.2 var(--font-display); letter-spacing: -0.015em; margin-bottom: var(--s-3); }
  .tl-day-n { font: 600 var(--t-overline)/1.2 var(--font-mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-link); }
  .tl-entries { list-style: none; margin: 0; padding: 0; display: grid; }
  .tl-entries li { display: grid; grid-template-columns: 52px 26px minmax(0, 1fr); gap: var(--s-3); align-items: start; margin: 0; padding: var(--s-2) 0; border-top: 1px dashed var(--c-border); }
  .tl-entries li:first-child { border-top: 0; }
  .tl-t { font: 500 var(--t-small)/26px var(--font-mono); color: var(--c-muted); text-align: right; }
  .tl-g { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; color: var(--c-link); background: var(--c-primary-soft); }
  .tl-entries .is-res .tl-g { background: var(--c-primary); color: var(--c-on-primary); border-radius: var(--r-xs); }
  .tl-b { display: grid; min-width: 0; padding-top: 2px; }
  .tl-b a { font-weight: 600; overflow-wrap: anywhere; }

  /* ---------- Print ---------- */
  .tp-print-meta { color: var(--c-muted); }
  .tp-print-day { padding: var(--s-4) 0; border-top: 1px solid var(--c-border); break-inside: avoid; }
  .tp-print-day h2 { font: 650 1.125rem/1.3 var(--font-display); margin-bottom: var(--s-2); }
  .tp-print-day ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 4px; }
  .tp-print-day li { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: var(--s-3); margin: 0; }
  .tp-print-day .num { font-family: var(--font-mono); color: var(--c-muted); }

  /* ---------- Reservations: tickets ---------- */
  .tk-days { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-6); }
  .tk-days > li { margin: 0; }
  .tk-day { font: 600 var(--t-overline)/1.2 var(--font-mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-muted); margin-bottom: var(--s-3); display: flex; gap: var(--s-2); align-items: center; }
  .tk-list { display: grid; gap: var(--s-3); }
  .ticket { position: relative; display: grid; gap: var(--s-4); padding: var(--s-5); border-radius: var(--r-lg); background: var(--c-surface); border: 1px solid var(--c-border); }
  .ticket::before, .ticket::after { content: ''; position: absolute; top: 50%; width: 18px; height: 18px; margin-top: -9px; border-radius: 50%; background: var(--c-bg); border: 1px solid var(--c-border); }
  .ticket::before { left: -10px; clip-path: inset(0 0 0 50%); }
  .ticket::after { right: -10px; clip-path: inset(0 50% 0 0); }
  .ticket.is-flight { background: linear-gradient(115deg, var(--c-primary-soft), var(--c-surface) 45%); }
  .tk-head { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-3); align-items: center; }
  .tk-type { display: inline-flex; gap: 6px; align-items: center; font: 600 var(--t-overline)/1.2 var(--font-mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-link); }
  .tk-title { font-weight: 650; color: var(--c-text); text-decoration: none; overflow-wrap: anywhere; }
  a.tk-title:hover { color: var(--c-link); text-decoration: underline; }
  .tk-legs { display: grid; grid-template-columns: minmax(0, 1fr) minmax(56px, 1.2fr) minmax(0, 1fr); gap: var(--s-3); align-items: center; }
  .tk-end { display: grid; gap: 2px; min-width: 0; }
  .tk-end.is-to { text-align: right; justify-items: end; }
  .tk-code { font: 650 clamp(1.75rem, 1.4rem + 1.6vw, 2.5rem)/1 var(--font-display); letter-spacing: 0.01em; }
  .tk-time { font: 600 var(--t-body)/1.2 var(--font-mono); }
  .tk-date { font-size: var(--t-caption); color: var(--c-muted); }
  .tk-path { position: relative; display: flex; align-items: center; gap: 4px; color: var(--c-link); }
  .tk-path .tk-line { flex: 1; height: 0; border-top: 2px dashed color-mix(in srgb, var(--c-link) 55%, transparent); }
  .tk-dur { position: absolute; left: 50%; top: calc(100% + 4px); translate: -50% 0; font-size: var(--t-caption); color: var(--c-muted); white-space: nowrap; }
  .tk-facts { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-6); margin: 0; padding-top: var(--s-3); border-top: 1px dashed var(--c-border-strong); }
  .tk-facts div { display: grid; gap: 0; }
  .tk-facts dt { font: 600 0.625rem/1.4 var(--font-mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-muted); }
  .tk-facts dd { margin: 0; font-weight: 600; font-size: var(--t-small); }
  .tk-span { display: flex; flex-wrap: wrap; gap: var(--s-3) var(--s-5); align-items: center; }
  .tk-span > div:not(.tk-mid) { display: grid; gap: 2px; }
  .tk-k { font: 600 0.625rem/1.4 var(--font-mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-muted); }
  .tk-mid { flex: 1 1 60px; display: flex; align-items: center; justify-content: center; min-width: 60px; padding: 0 var(--s-2); font-size: var(--t-caption); font-weight: 700; color: var(--c-link); position: relative; }
  .tk-mid::before { content: ''; position: absolute; left: 0; right: 0; top: 50%; border-top: 2px dashed color-mix(in srgb, var(--c-link) 40%, transparent); }
  .tk-mid > * { position: relative; background: var(--c-surface); padding: 0 6px; }
  .tk-mid .tk-line { display: none; }
  .tk-where { display: flex; flex-wrap: wrap; gap: 4px 6px; align-items: center; margin: 0; font-size: var(--t-small); color: var(--c-muted); }
  .tk-foot { display: flex; flex-wrap: wrap; gap: var(--s-2); align-items: center; padding-top: var(--s-3); border-top: 1px dashed var(--c-border-strong); }
  .tk-chip { display: inline-flex; gap: 4px; align-items: center; font-size: var(--t-caption); color: var(--c-muted); }
  .tk-cost { margin-left: auto; font-weight: 700; }
  .tk-conf { font-size: 1rem; letter-spacing: 0.12em; font-weight: 600; padding: 2px 8px; border-radius: var(--r-xs); background: var(--c-surface2); }
  .res-detail { display: grid; gap: var(--s-5); }
  .res-detail > .panel { margin: 0; }
  @media (min-width: 1100px) { .res-detail { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); align-items: start; } }
  .res-form .res-flight { padding: var(--s-4); border-radius: var(--r-md); background: var(--c-surface2); }
  .res-form:has(select[name='type'] option[value='flight']:not(:checked)) .res-flight { display: none; }
  .res-form .row > .field { flex: 1 1 140px; }

  /* ---------- Budget ---------- */
  .bg-sum { display: grid; gap: var(--s-5); }
  .bg-sum-top { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--s-4); align-items: flex-end; }
  .bg-sum-top .overline { margin: 0 0 var(--s-1); }
  .bg-big { margin: 0; font: 650 clamp(2.25rem, 1.8rem + 2vw, 3.25rem)/1 var(--font-display); letter-spacing: -0.035em; }
  .bg-over { color: var(--c-error); font-weight: 700; }
  .bg-sum-facts { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-5); font-size: var(--t-small); color: var(--c-muted); }
  .bg-sum-facts strong { color: var(--c-text); font-size: 1rem; }
  .bg-cats { list-style: none; margin: 0; padding: var(--s-4) 0 0; border-top: 1px solid var(--c-border); display: grid; gap: var(--s-4); grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); }
  .bg-cats li { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: var(--s-3); align-items: center; margin: 0; }
  .bg-cat-ic { display: grid; place-items: center; width: 30px; height: 30px; border-radius: var(--r-sm); background: var(--c-primary-soft); color: var(--c-link); }
  .bg-cat { display: inline-flex; gap: 6px; align-items: center; white-space: nowrap; }
  .bg-cat .i { color: var(--c-muted); }
  .ledger { list-style: none; margin: 0; padding: 0; display: grid; }
  .lg-row { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; grid-template-areas: 'date main amt' 'date main del'; column-gap: var(--s-3); align-items: start; margin: 0; padding: var(--s-3) 0; border-top: 1px solid var(--c-border); }
  .lg-row:first-child { border-top: 0; padding-top: 0; }
  .lg-date { grid-area: date; display: grid; justify-items: center; line-height: 1; padding: 6px 0; border-radius: var(--r-sm); background: var(--c-surface2); }
  .lg-date span { font-size: 0.625rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--c-muted); font-weight: 700; }
  .lg-date strong { font: 650 1.125rem/1.1 var(--font-display); }
  .lg-ic { display: none; }
  .lg-main { grid-area: main; min-width: 0; }
  .lg-main p { margin: 0; }
  .lg-what { font-weight: 600; overflow-wrap: anywhere; }
  .lg-meta { display: flex; flex-wrap: wrap; gap: 0 var(--s-2); font-size: var(--t-caption); color: var(--c-muted); }
  .lg-meta span + span::before { content: '·'; margin-right: var(--s-2); }
  .lg-meta span:last-child { display: none; }
  .lg-split { margin-top: 4px !important; font-size: var(--t-caption); color: var(--c-muted); font-family: var(--font-mono); overflow-wrap: anywhere; }
  .lg-amt { grid-area: amt; display: grid; justify-items: end; gap: 2px; text-align: right; }
  .lg-amt strong { font: 650 1.0625rem/1.2 var(--font-display); }
  .lg-amt span { font-size: var(--t-caption); color: var(--c-muted); }
  .lg-rate { padding: 1px 6px; border: 1px dashed var(--c-border-strong); border-radius: var(--r-xs); color: var(--c-text) !important; font-weight: 600; }
  .lg-del { grid-area: del; justify-self: end; margin: 0; }
  @media (min-width: 720px) {
    .lg-row { grid-template-columns: 44px 32px minmax(0, 1fr) auto auto; grid-template-areas: 'date ic main amt del'; align-items: center; }
    .lg-ic { grid-area: ic; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--c-border); color: var(--c-text); }
  }
  .exp-form .row > .field { flex: 1 1 110px; }
  .exp-people { display: grid; gap: var(--s-2); }
  .exp-person { display: grid; gap: var(--s-2); padding: var(--s-2) 0; border-top: 1px solid var(--c-border); }
  .exp-person:first-of-type { border-top: 0; }
  .exp-w .field > label { font-weight: 500; color: var(--c-muted); }
  .exp-form:has(select[name='split_mode'] option[value='equal']:checked) .exp-w,
  .exp-form:has(select[name='split_mode'] option[value='equal']:checked) .exp-w-hint { display: none; }
  .tp-rates { list-style: none; margin: 0 0 var(--s-4); padding: 0; display: grid; gap: 4px; font-size: var(--t-small); }
  .tp-rates li { margin: 0; }

  /* ---------- Settle up ---------- */
  .st-bal { list-style: none; margin: 0; padding: 0; display: grid; }
  .st-bal li { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: 'who val' 'axis axis'; gap: var(--s-2) var(--s-3); align-items: center; margin: 0; padding: var(--s-3) 0; border-top: 1px solid var(--c-border); }
  .st-bal li:first-child { border-top: 0; }
  .st-who { grid-area: who; display: flex; gap: var(--s-2); align-items: center; font-weight: 600; min-width: 0; }
  .st-val { grid-area: val; font-size: var(--t-small); font-weight: 600; text-align: right; }
  .is-pos .st-val { color: var(--c-success); }
  .is-neg .st-val { color: var(--c-error); }
  .is-zero .st-val { color: var(--c-muted); }
  .st-axis { grid-area: axis; display: grid; grid-template-columns: 1fr 1fr; height: 10px; position: relative; }
  .st-axis::after { content: ''; position: absolute; left: 50%; top: -3px; bottom: -3px; width: 2px; margin-left: -1px; background: var(--c-border-strong); }
  .st-neg { display: flex; justify-content: flex-end; background: var(--c-surface2); border-radius: 5px 0 0 5px; overflow: hidden; }
  .st-pos { display: flex; background: var(--c-surface2); border-radius: 0 5px 5px 0; overflow: hidden; }
  .st-neg i { display: block; height: 100%; background: var(--c-error); border-radius: 5px 0 0 5px; }
  .st-pos i { display: block; height: 100%; background: var(--c-success); border-radius: 0 5px 5px 0; }
  @media (min-width: 720px) { .st-bal li { grid-template-columns: 200px minmax(0, 1fr) 160px; grid-template-areas: 'who axis val'; } }
  .st-transfers { list-style: none; margin: 0 0 var(--s-4); padding: 0; display: grid; gap: var(--s-3); }
  .st-transfers li { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-3); align-items: center; margin: 0; padding: var(--s-3) var(--s-4); border-radius: var(--r-md); border: 1px solid var(--c-border); background: var(--c-surface2); }
  .st-from, .st-to { display: inline-flex; gap: var(--s-2); align-items: center; }
  .st-arrow { color: var(--c-muted); display: inline-grid; }
  .st-amt { font: 650 1.125rem/1 var(--font-display); margin-left: auto; }
  .st-transfers form { margin: 0; }
  .st-rec { list-style: none; margin: 0; padding: 0; display: grid; }
  .st-rec li { display: flex; justify-content: space-between; gap: var(--s-3); align-items: center; margin: 0; padding: var(--s-2) 0; border-top: 1px solid var(--c-border); }
  .st-rec li:first-child { border-top: 0; }

  /* ---------- Packing & documents ---------- */
  .pk-total { margin-bottom: var(--s-5); padding: var(--s-4) var(--s-5); border-radius: var(--r-lg); background: var(--c-surface); border: 1px solid var(--c-border); }
  .pk-grid { display: grid; gap: var(--s-4); grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); align-items: start; }
  .pk-grid > .panel { margin: 0; }
  .pk-head { display: flex; gap: var(--s-3); align-items: center; margin-bottom: var(--s-4); }
  .pk-head h2 { font: 600 var(--t-h3)/1.3 var(--font-sans); }
  .pk-head p { margin: 2px 0 0; }
  .pk-ic { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--c-primary-soft); color: var(--c-link); flex: none; }
  .pk-list { list-style: none; margin: 0; padding: 0; display: grid; }
  .pk-item { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--s-2); align-items: center; margin: 0; padding: 2px 0; border-top: 1px solid var(--c-border); }
  .pk-item:first-child { border-top: 0; }
  .pk-item form { margin: 0; }
  .pk-toggle { display: grid; place-items: center; width: 40px; height: 40px; border: 0; background: none; padding: 0; cursor: pointer; border-radius: var(--r-sm); }
  .pk-toggle:hover { background: var(--c-surface2); }
  .pk-box { display: grid; place-items: center; width: 22px; height: 22px; border-radius: var(--r-xs); border: 2px solid var(--c-border-strong); color: transparent; transition: background var(--d-fast), border-color var(--d-fast); }
  span.pk-box { margin: 9px; }
  .pk-item.is-done .pk-box, .pk-box.is-on { background: var(--c-success); border-color: var(--c-success); color: #fff; }
  .pk-text { min-width: 0; overflow-wrap: anywhere; padding: 8px 0; }
  .pk-item.is-done .pk-text { color: var(--c-muted); text-decoration: line-through; text-decoration-color: color-mix(in srgb, var(--c-muted) 60%, transparent); }
  .pk-qty { font-size: var(--t-caption); font-weight: 700; color: var(--c-link); }
  .pk-back { margin: var(--s-5) 0 var(--s-2); }
  .doc-list { list-style: none; margin: 0 0 var(--s-5); padding: 0; display: grid; gap: var(--s-2); }
  .doc-list li { margin: 0; }

  /* ---------- Travelers ---------- */
  .tv-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-3); grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
  .tv-card { display: grid; gap: var(--s-3); align-content: start; margin: 0; padding: var(--s-5); border-radius: var(--r-lg); background: var(--c-surface); border: 1px solid var(--c-border); }
  .tv-card.is-paused { border-color: color-mix(in srgb, var(--c-warning) 50%, var(--c-border)); }
  .tv-card p { margin: 0; }
  .tv-who { display: flex; gap: var(--s-3); align-items: center; }
  .tv-name { font-weight: 650; }
  .tv-role { margin-top: 4px !important; display: flex; gap: 4px; flex-wrap: wrap; }
  .tv-role-form { display: flex; gap: var(--s-2); align-items: flex-end; }
  .tv-role-form .field { flex: 1; }
  .tv-role-form .field > label { font-size: var(--t-caption); color: var(--c-muted); }
  .tv-remove { margin: 0; }

  /* ---------- Calendar feed & AI drafts ---------- */
  .cal-panel, .ai-draft { display: grid; gap: var(--s-4); }
  .cal-panel > *, .ai-draft > * { margin: 0; }
  .cal-head { display: flex; gap: var(--s-4); align-items: flex-start; }
  .cal-head p { margin: 4px 0 0; color: var(--c-muted); }
  .cal-ic { display: grid; place-items: center; width: 48px; height: 48px; border-radius: var(--r-md); background: var(--c-primary-soft); color: var(--c-link); flex: none; }
  .cal-facts { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-2); font-size: var(--t-small); }
  .cal-facts li { display: flex; gap: var(--s-2); align-items: center; margin: 0; }
  .cal-facts .i { color: var(--c-success); }
  .cal-facts li:last-child .i { color: var(--c-muted); }
  .cal-link span { overflow-wrap: anywhere; }
  .ai-drafts { list-style: none; margin: 0; padding: 0; display: grid; }
  .ai-drafts li { display: flex; gap: var(--s-3); align-items: center; justify-content: space-between; margin: 0; padding: var(--s-3) 0; border-top: 1px solid var(--c-border); }
  .ai-drafts li:first-child { border-top: 0; }
  .ai-day legend { display: flex; gap: var(--s-2); align-items: center; float: left; width: 100%; margin-bottom: var(--s-4); font-size: 1rem; }
  .ai-day legend + * { clear: both; }
  .ai-day-d { font: 650 1.0625rem/1.2 var(--font-display); }
  .ai-picks { list-style: none; margin: 0; padding: 0; display: grid; }
  .ai-picks li { margin: 0; border-top: 1px solid var(--c-border); }
  .ai-picks li:first-child { border-top: 0; }
  .ai-pick { padding: var(--s-3) 0; align-items: flex-start; }
  .ai-pick-body { display: grid; gap: 2px; min-width: 0; }
  .ai-pick-head { display: flex; gap: var(--s-2); align-items: center; flex-wrap: wrap; }
  .ai-pick-head .tg { color: var(--c-link); }
  .ai-pick-t { font-family: var(--font-mono); font-size: var(--t-small); color: var(--c-muted); min-width: 3.2em; }
  .ai-pick:has(input:checked) .ai-pick-head strong { color: var(--c-link); }
  .ai-import { position: sticky; bottom: calc(var(--s-4)); z-index: var(--z-raised); display: grid; gap: var(--s-2); padding: var(--s-4); border-radius: var(--r-lg); background: var(--c-elevated); border: 1px solid var(--c-border); box-shadow: var(--e-3); }
  .ai-import p { margin: 0; }
  @media (max-width: 1023px) { .ai-import { bottom: calc(var(--layout-bottom-nav) + var(--s-3) + env(safe-area-inset-bottom)); } }

  /* ---------- Landing (/nxt-trip) ---------- */
  .trl-hero { position: relative; overflow: hidden; isolation: isolate; padding: clamp(48px, 7vw, 104px) 0 clamp(32px, 4vw, 56px); background: #000000; color: #fff; }
  .trl-hero::before { content: ''; position: absolute; inset: 0; z-index: -2; background: radial-gradient(55% 70% at 78% 30%, rgb(255 255 255 / 0.13), transparent 70%), radial-gradient(40% 50% at 0% 100%, rgb(255 255 255 / 0.06), transparent 70%); }
  .trl-topo { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; }
  .trl-topo path { fill: none; stroke: #fff; stroke-opacity: 0.17; stroke-width: 1; }
  .trl-topo.is-faint path { stroke-opacity: 0.07; }
  /* Phones: text runs across the contours, so they fade further. */
  @media (max-width: 767px) { .trl-topo path { stroke-opacity: 0.08; } .trl-topo.is-faint path { stroke-opacity: 0.05; } }
  .trl-hero-copy, .trl-chapters, .trl-honest { --c-text: #fff; --c-muted: rgb(255 255 255 / 0.78); --c-border: rgb(255 255 255 / 0.16); --c-link: #fff; --c-focus: #FFFFFF; --c-focus-inner: #000000; --c-primary: #FFFFFF; --c-on-primary: #000000; color-scheme: dark; }
  .trl-hero-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(var(--s-8), 5vw, var(--s-16)); align-items: center; }
  @media (min-width: 1100px) { .trl-hero-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); } }
  .trl-hero-copy { display: grid; gap: var(--s-5); align-content: center; }
  .trl-id { display: flex; gap: var(--s-3); align-items: center; margin: 0; }
  .trl-name { font: 650 1.25rem/1 var(--font-display); letter-spacing: 0.02em; }
  .trl-hero .badge-brand { background: rgb(255 255 255 / 0.12); color: #fff; }
  .trl-hero h1 { color: #fff; font-size: clamp(2.5rem, 1.3rem + 4.6vw, 5.25rem); line-height: 0.98; }
  .trl-em { display: block; font-style: italic; font-weight: 500; letter-spacing: -0.03em; }
  .trl-hero .lede { color: rgb(255 255 255 / 0.82); margin: 0; max-width: 58ch; }
  .trl-hero-copy .btn { --b-bg: #fff; --b-fg: #000000; --b-hover: rgb(255 255 255 / 0.88); }
  .trl-hero-copy .btn-secondary { --b-bg: transparent; --b-fg: #fff; --b-bd: rgb(255 255 255 / 0.4); --b-hover: rgb(255 255 255 / 0.08); }
  .trl-facts { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-5); font-size: var(--t-small); color: rgb(255 255 255 / 0.74); }
  .trl-facts li { display: inline-flex; gap: 6px; align-items: center; margin: 0; }
  .trl-hero-preview { min-width: 0; color: var(--c-text); }
  .trl-id .mark .mk-t { fill: #FFFFFF; } .trl-id .mark .mk-f { fill: #DEDEDE; } .trl-id .mark :is(.mk-l, .mk-n) { fill: #000000; } .trl-id .mark .mk-g { stroke: #000000; }
  .trl-hero-preview .preview { box-shadow: 0 30px 80px rgb(0 0 0 / 0.6), 0 0 0 1px rgb(255 255 255 / 0.1); }
  .trl-hero-preview .tab-panel { min-height: 360px; }
  .trl-chapters { list-style: none; margin-top: clamp(var(--s-10), 6vw, var(--s-16)); padding-top: var(--s-6); display: grid; gap: var(--s-5); grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); border-top: 1px solid rgb(255 255 255 / 0.16); }
  .trl-chapters li { display: grid; grid-template-columns: auto auto minmax(0, 1fr); column-gap: var(--s-2); row-gap: 4px; align-items: center; align-content: start; margin: 0; }
  .trl-chapters li > span:last-child { grid-column: 1 / -1; font-size: var(--t-small); color: rgb(255 255 255 / 0.7); }
  .trl-ch-n { font: 500 var(--t-caption)/1 var(--font-mono); color: rgb(255 255 255 / 0.6); }
  .trl-ch-ic { display: inline-grid; }
  .trl-chapters strong { font: 650 1.125rem/1.2 var(--font-display); }

  /* Preview panels */
  .trl-pv-day .tday { border: 0; padding: 0; box-shadow: none; background: none; }
  .tday-h { margin: 0; font: 650 1.25rem/1.2 var(--font-display); letter-spacing: -0.015em; }
  .iti-nav-mini { list-style: none; margin: 0 0 var(--s-4); padding: 4px; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 2px; border: 1px solid var(--c-border); border-radius: var(--r-md); }
  .iti-nav-mini li { display: grid; justify-items: center; margin: 0; padding: 6px 2px; border-radius: var(--r-sm); font-size: var(--t-caption); font-weight: 600; white-space: nowrap; }
  .iti-nav-mini li .num { font: 600 0.625rem/1.2 var(--font-mono); color: var(--c-muted); }
  .iti-nav-mini li.is-today { background: var(--c-primary); color: var(--c-on-primary); }
  .iti-nav-mini li.is-today .num { color: inherit; opacity: 0.8; }
  .trl-pv-route .rt { margin-top: 0; }
  .trl-pv-route .route.is-compact { margin-top: var(--s-4); }
  @media (min-width: 640px) { .trl-pv-route .route.is-compact { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; } }
  .trl-pv-cap, .trl-cap { display: flex; gap: 6px; align-items: center; margin: var(--s-3) 0 0; color: var(--c-muted); }
  .trl-pv-money { display: grid; gap: var(--s-4); }
  .trl-pv-money .bg-cats { grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); }
  .trl-pv-h { margin: 0; }
  .trl-pv-money .st-transfers { margin: 0; }
  .trl-pv-ready { display: grid; gap: var(--s-5); }
  .trl-pv-ready .attn-list { margin: 0; }

  /* Sections */
  .trl-route-stage { display: grid; gap: var(--s-5); }
  .trl-route-big { margin: 0; border-radius: var(--r-xl); background: var(--c-surface); box-shadow: var(--e-1); }
  .trl-route-big .rt-svg { max-height: 340px; }
  .trl-route-list { padding: var(--s-5); border-radius: var(--r-lg); background: var(--c-surface); border: 1px solid var(--c-border); }
  @media (min-width: 640px) { .trl-route-list { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; } }
  .trl-tickets { display: grid; gap: var(--s-4); grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); align-items: start; }
  .trl-duo { display: grid; gap: clamp(var(--s-8), 5vw, var(--s-16)); align-items: center; grid-template-columns: minmax(0, 1fr); }
  @media (min-width: 1024px) { .trl-duo { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); } .trl-duo.is-reverse .trl-duo-copy { order: 2; } }
  .trl-duo-copy .section-head { margin-bottom: var(--s-6); }
  .trl-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-3); }
  .trl-list li { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: var(--s-3); margin: 0; }
  .trl-list .i { margin-top: 3px; }
  .trl-postcards { margin-bottom: var(--s-2); }
  .trl-honest { background: #000000; color: #fff; }
  .trl-honest .h-section { color: #fff; }
  .trl-honest .section-lede { color: rgb(255 255 255 / 0.78); }
  .trl-honest .eyebrow { color: rgb(255 255 255 / 0.7); }
  .trl-trust { list-style: none; margin: 0; padding: 0; display: grid; gap: 1px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); background: rgb(255 255 255 / 0.14); border: 1px solid rgb(255 255 255 / 0.14); border-radius: var(--r-lg); overflow: hidden; }
  .trl-trust li { margin: 0; display: grid; gap: var(--s-2); align-content: start; padding: var(--s-6); background: #000000; }
  .trl-trust h3 { color: #fff; font-size: 1.0625rem; }
  .trl-trust p { margin: 0; color: rgb(255 255 255 / 0.74); font-size: var(--t-small); }
  @media (prefers-reduced-motion: no-preference) {
    .trl-topo path { stroke-dasharray: 4 10; animation: trip-dash 90s linear infinite; }
  }
}