/* GENERATED by scripts/make-dark.js from styles.css and phone.css, after the hand-written part in dark.src.css. Do not edit; run "npm run dark". */
/* The dark look: navy page, slightly lighter cards, soft blue accent, Figtree type. Same layout and wording as the other looks; only colours and type change.
 * Colour tokens are set here by hand. Every colour written straight into styles.css / phone.css is turned dark by scripts/make-dark.js (appended below). */
@font-face { font-family: 'Figtree'; font-style: normal; font-weight: 300 900; font-display: swap; src: url('/fonts/figtree-latin-wght.woff2') format('woff2'); }
[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0b1220; --surface: #141d30; --surface-2: #1b2740; --surface-3: #172036;
  --ink: #e8edf7; --ink-1: #cbd5e8; --ink-2: #9aa8c2; --ink-3: #8c9ab5;
  --line: #2b3a5c; --line-soft: #263250; --line-strong: #4a5b80; --line-faint: #1f2a44;
  --brand: #6b9bff; --brand-soft: #1a2a52; --on-brand: #0b1220; --select-bg: #1f3a78;
  --warn: #f5b355; --warn-bg: #2b2110; --warn-soft: #3a2a10; --warn-ink: #f5c27a;
  --bad: #ff8a8a; --bad-ink: #ffb4b4; --good-bg: #12301f; --good-ink: #5fd48a; --vote-ink: #c4b5fd;
  --toast-bg: #e8edf7; --toast-ink: #0b1220; --toast-act: #1d4ed8;
  --font: 'Figtree', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}
[data-theme="dark"] body, [data-theme="dark"] button, [data-theme="dark"] input, [data-theme="dark"] select, [data-theme="dark"] textarea { font-family: var(--font); }
[data-theme="dark"] body { background: var(--bg); color: var(--ink); }
[data-theme="dark"] input, [data-theme="dark"] select, [data-theme="dark"] textarea { background: var(--surface-2); color: var(--ink); border-color: var(--line); }
[data-theme="dark"] ::placeholder { color: var(--ink-3); }
[data-theme="dark"] a { color: var(--brand); }
[data-theme="dark"] .btn, [data-theme="dark"] button.btn { background: var(--surface); color: var(--ink); border-color: var(--line); }
/* blue fills carry dark text, so they stay readable on the soft blue */
[data-theme="dark"] .btn.primary, [data-theme="dark"] .tabs button.active, [data-theme="dark"] .tabs .add-day, [data-theme="dark"] .mode-seg .btn.on, [data-theme="dark"] .attr-tabs button.on,
[data-theme="dark"] .dbcard.on, [data-theme="dark"] .cal-d.on, [data-theme="dark"] #itinerary .stop-quick .act.primary, [data-theme="dark"] .next-card, [data-theme="dark"] .next-card .btn,
[data-theme="dark"] .tab-opts .opt.on { background: var(--brand); border-color: var(--brand); color: var(--on-brand) !important; }
[data-theme="dark"] .btn.primary:hover { background: #8fb1ff; }
[data-theme="dark"] .tabs button.active .ti, [data-theme="dark"] .tabs button.active small, [data-theme="dark"] .tabs button.active .muted { color: var(--on-brand) !important; opacity: .85; }
[data-theme="dark"] .tabs button.active *, [data-theme="dark"] .btn.primary *, [data-theme="dark"] .attr-tabs button.on *, [data-theme="dark"] .dbcard.on * { color: var(--on-brand) !important; }
[data-theme="dark"] #tabBar button[aria-selected="true"] { color: var(--brand); }
[data-theme="dark"] .modal, [data-theme="dark"] .modal-overlay .modal { background: var(--surface); color: var(--ink); }
[data-theme="dark"] .modal-overlay { background: rgba(2, 6, 16, .66); }
[data-theme="dark"] .sheet-grip, [data-theme="dark"] body:not(.on-landing) #right { background: var(--surface); }
[data-theme="dark"] .map-off { background: var(--surface-3); color: var(--ink-2); }
[data-theme="dark"] .undo-toast { box-shadow: 0 10px 24px rgba(0, 0, 0, .5); }
[data-theme="dark"] #app > .anchor-card, [data-theme="dark"] .travel-card, [data-theme="dark"] .stop-quick .act { border-color: var(--line); }
[data-theme="dark"] img { opacity: .93; }
[data-theme="dark"] .tour-tx a, [data-theme="dark"] .trip-link { color: var(--ink); }
[data-theme="dark"] .next-card .btn { background: rgba(11, 18, 32, .18); border-color: transparent; color: var(--on-brand) !important; }
[data-theme="dark"] .sec-attr.attr-overlay { background: var(--bg) !important; border-color: var(--line-soft) !important; }
[data-theme="dark"] .sec-attr.attr-overlay .sec-h, [data-theme="dark"] .sec-attr.attr-overlay .attr-h { color: var(--ink) !important; }

/* ---- the same rules, in dark colours ---- */
[data-theme="dark"] .notice { background: hsl(55, 30%, 23%) !important; }
[data-theme="dark"] .tag { background: hsl(226, 30%, 20%) !important; color: hsl(244, 44%, 76%) !important; }
[data-theme="dark"] .leg { color: hsl(175, 62%, 76%) !important; }
[data-theme="dark"] .day-card { border: 1px solid hsl(216, 6%, 30%) !important; }
[data-theme="dark"] #divider { background: hsl(216, 7%, 25%) !important; }
[data-theme="dark"] .sug:hover { background: hsl(33, 30%, 19%) !important; }
[data-theme="dark"] .pill { color: hsl(175, 62%, 76%) !important; }
[data-theme="dark"] .plan-box { border: 1px solid hsl(228, 25%, 30%) !important; }
[data-theme="dark"] .anchor.set { background: hsl(138, 30%, 19%) !important; border: 1px solid hsl(141, 25%, 30%) !important; }
[data-theme="dark"] .tab-head .gt { color: hsl(175, 62%, 76%) !important; background: hsl(167, 30%, 22%) !important; }
[data-theme="dark"] .tab-head .gw { color: hsl(26, 72%, 76%) !important; }
[data-theme="dark"] .tabs .slot.filled { border: 2px solid hsl(142, 25%, 30%) !important; }
[data-theme="dark"] .tabs .slot.filled:hover { background: hsl(141, 30%, 24%) !important; }
[data-theme="dark"] .choice { border: 2px solid hsl(220, 7%, 30%) !important; }
[data-theme="dark"] .choice:hover { border-color: hsl(212, 25%, 30%) !important; }
[data-theme="dark"] .choice.on { background: hsl(214, 30%, 19%) !important; }
[data-theme="dark"] .sec-itin { background: hsl(219, 30%, 19%) !important; border: 1px solid hsl(221, 25%, 30%) !important; }
[data-theme="dark"] .sec-itin .summary { border: 1px solid hsl(222, 25%, 30%) !important; }
[data-theme="dark"] .sec-itin .sec-h { color: hsl(226, 57%, 76%) !important; }
[data-theme="dark"] .sec-attr { background: hsl(39, 30%, 20%) !important; border: 1px solid hsl(37, 25%, 30%) !important; }
[data-theme="dark"] .sec-attr .sec-h { color: hsl(35, 80%, 76%) !important; }
[data-theme="dark"] .added { color: hsl(142, 57%, 76%) !important; }
[data-theme="dark"] body.dragging .tabs button[data-day] { outline: 2px dashed hsl(212, 25%, 30%) !important; }
[data-theme="dark"] .sugroup { background: hsl(43, 30%, 18%) !important; border: 1px solid hsl(38, 25%, 30%) !important; }
[data-theme="dark"] .sec-attr { background: hsl(258, 30%, 19%) !important; border: 1px solid hsl(257, 25%, 30%) !important; }
[data-theme="dark"] .sugroup { background: hsl(257, 30%, 18%) !important; border-color: hsl(258, 25%, 30%) !important; }
[data-theme="dark"] .mode-note { border-color: hsl(258, 25%, 30%) !important; }
[data-theme="dark"] .sec-attr .badge { background: hsl(260, 30%, 20%) !important; }
[data-theme="dark"] .sec-itin.state-warn { background: hsl(44, 30%, 22%) !important; }
[data-theme="dark"] .sec-itin.state-warn .itin-note { color: hsl(26, 72%, 76%) !important; }
[data-theme="dark"] .sec-itin.state-good { background: hsl(143, 26%, 20%) !important; border: 1px solid hsl(139, 23%, 30%) !important; }
[data-theme="dark"] .sec-itin.state-good .summary { border-color: hsl(142, 24%, 30%) !important; }
[data-theme="dark"] .sec-itin.state-good .itin-note { color: hsl(142, 57%, 76%) !important; background: hsl(142, 30%, 18%) !important; }
[data-theme="dark"] .chev { background: hsl(260, 30%, 20%) !important; }
[data-theme="dark"] .attr-summary { color: hsl(264, 54%, 76%) !important; }
[data-theme="dark"] .chip.good { background: hsl(145, 30%, 19%) !important; border-color: hsl(141, 25%, 30%) !important; }
[data-theme="dark"] .chip.warn { border-color: hsl(48, 25%, 30%) !important; }
[data-theme="dark"] .chip.bad { background: hsl(0, 30%, 18%) !important; border-color: hsl(0, 25%, 30%) !important; }
[data-theme="dark"] .mark.lock { background: hsl(226, 30%, 20%) !important; color: hsl(244, 44%, 76%) !important; }
[data-theme="dark"] .mark.fix { background: hsl(326, 30%, 20%) !important; color: hsl(336, 60%, 76%) !important; }
[data-theme="dark"] .late { background: hsl(0, 30%, 18%) !important; border: 1px solid hsl(0, 25%, 30%) !important; }
[data-theme="dark"] .good-txt { color: hsl(142, 57%, 76%) !important; }
[data-theme="dark"] .sg-list li { border-bottom: 1px solid hsl(34, 25%, 30%) !important; }
[data-theme="dark"] .sg-vote { border: 1px solid hsl(31, 25%, 30%) !important; }
[data-theme="dark"] .sg-vote.on { background: hsl(32, 30%, 25%) !important; }
[data-theme="dark"] .today { border: 1px solid hsl(213, 25%, 30%) !important; }
[data-theme="dark"] .today-late { color: hsl(26, 72%, 76%) !important; }
[data-theme="dark"] .wx-tip { background: hsl(214, 30%, 19%) !important; border: 1px solid hsl(213, 25%, 30%) !important; }
[data-theme="dark"] .mark.busy.busy { background: hsl(0, 30%, 20%) !important; }
[data-theme="dark"] .top-div { border-top: 1px solid hsl(214, 10%, 30%) !important; }
[data-theme="dark"] .stop-actions [data-state=on]::after { color: hsl(224, 61%, 76%) !important; }
[data-theme="dark"] .card-group.out, [data-theme="dark"] .card-group.back { background: hsl(204, 30%, 20%) !important; }
[data-theme="dark"] .card-group.tour { background: hsl(152, 30%, 19%) !important; }
[data-theme="dark"] .menu-attr { background: hsl(258, 30%, 19%) !important; border-color: hsl(257, 25%, 30%) !important; }
[data-theme="dark"] .menu-attr.on { background: hsl(259, 30%, 21%) !important; }
[data-theme="dark"] .chip.rv.bad { background: hsl(0, 30%, 20%) !important; border-color: hsl(0, 25%, 30%) !important; }
[data-theme="dark"] .chip.rv.easy { background: hsl(152, 30%, 19%) !important; color: hsl(163, 70%, 76%) !important; }
[data-theme="dark"] .chip.recent, [data-theme="dark"] .chip.recent-clear { border: 1px solid hsl(257, 25%, 30%) !important; }
[data-theme="dark"] .park-tip { background: hsl(138, 30%, 19%) !important; border: 1px solid hsl(141, 25%, 30%) !important; }
[data-theme="dark"] .badge.src { background: hsl(167, 30%, 22%) !important; color: hsl(176, 55%, 76%) !important; }
[data-theme="dark"] .attr-ctx { background: hsl(260, 30%, 20%) !important; border: 1px solid hsl(257, 25%, 30%) !important; }
[data-theme="dark"] .attr-days { border: 1px dashed hsl(257, 25%, 30%) !important; }
[data-theme="dark"] .attr-tabs button.drop-over { background: hsl(260, 30%, 20%) !important; }
[data-theme="dark"] .chip.stay-link { border: 1px solid hsl(228, 25%, 30%) !important; color: hsl(244, 44%, 76%) !important; }
[data-theme="dark"] .chip.stay-link:hover { background: hsl(226, 30%, 20%) !important; }
[data-theme="dark"] .archived-box { border: 1px solid hsl(212, 12%, 30%) !important; }
[data-theme="dark"] .cal-wd .we { color: hsl(26, 72%, 76%) !important; }
[data-theme="dark"] .cal-d.we { background: hsl(33, 30%, 19%) !important; color: hsl(15, 63%, 76%) !important; }
[data-theme="dark"] .cal-d.span { color: hsl(224, 51%, 76%) !important; }
[data-theme="dark"] .cal-d.we.span { background: hsl(213, 30%, 23%) !important; }
[data-theme="dark"] .cal-key .k.we { background: hsl(32, 30%, 25%) !important; }
[data-theme="dark"] .cal-key .k.span { background: hsl(213, 30%, 23%) !important; }
[data-theme="dark"] .chip.cal-chip { background: hsl(33, 30%, 19%) !important; border: 1px solid hsl(31, 25%, 30%) !important; color: hsl(15, 63%, 76%) !important; }
[data-theme="dark"] .chip.cal-chip.lw { background: hsl(183, 30%, 19%) !important; color: hsl(194, 56%, 76%) !important; }
[data-theme="dark"] .stay-tab.on { border-color: hsl(228, 25%, 30%) !important; color: hsl(244, 44%, 76%) !important; }
[data-theme="dark"] .badge.private { background: hsl(0, 30%, 20%) !important; }
[data-theme="dark"] .chip.rv.vote { border-color: hsl(234, 25%, 30%) !important; color: hsl(244, 44%, 76%) !important; }
[data-theme="dark"] .badge.ver { background: hsl(80, 30%, 22%) !important; color: hsl(86, 55%, 76%) !important; }
[data-theme="dark"] .menu-attr:hover { background: hsl(262, 30%, 21%) !important; }
[data-theme="dark"] .landing { background: var(--page, hsl(220, 10%, 19%)) !important; }
[data-theme="dark"] .map-off { background: hsl(213, 20%, 19%) !important; }
[data-theme="dark"] .sug-pv-act .btn.on::first-letter { color: hsl(347, 62%, 76%) !important; }
[data-theme="dark"] .dflag, [data-theme="dark"] .dflag.light, [data-theme="dark"] .dflag.busy, [data-theme="dark"] .tabs button.active .dflag { color: hsl(44, 79%, 76%) !important; }
[data-theme="dark"] .stay-status.ok { background: hsl(141, 30%, 21%) !important; color: hsl(143, 51%, 76%) !important; }
[data-theme="dark"] .stay-status.wait { background: hsl(48, 30%, 23%) !important; color: hsl(23, 66%, 76%) !important; }
[data-theme="dark"] .stay-head.ok { border-color: hsl(142, 25%, 30%) !important; }
[data-theme="dark"] .live-pin span { border: 2px solid hsl(0, 0%, 30%) !important; }
@media (max-width: 820px) {
  [data-theme="dark"] #itinerary .tl-time .tl-dur { color: hsl(175, 62%, 76%) !important; }
}
@media (max-width: 820px) {
  [data-theme="dark"] .day-box .insights .chip.bad { background: var(--bad-bg, hsl(0, 30%, 18%)) !important; }
}

/* Hand-written rules that must come after the generated ones. */
@media (max-width: 820px) { [data-theme="dark"] .sec-itin, [data-theme="dark"] .sec-itin.state-warn, [data-theme="dark"] .sec-itin.state-good { background: none !important; border: 0 !important; } }
[data-theme="dark"] .day-box .summary { border: 0 !important; background: none !important; }
[data-theme="dark"] .tabs button.travel-out.active, [data-theme="dark"] .tabs button.travel-back.active { background: #4fd1be !important; border-color: #4fd1be !important; }
[data-theme="dark"] .tabs button.travel-out.active *, [data-theme="dark"] .tabs button.travel-back.active * { color: #0b1220 !important; }
[data-theme="dark"] .sec-top .role-note { background: var(--brand-soft) !important; color: var(--ink) !important; }
[data-theme="dark"] .sd-head > .ok-note { background: var(--good-bg) !important; color: var(--good-ink) !important; border: 0 !important; }

/* neutral days: no green or yellow wrap around a day, its tabs or the park notes */
html[data-theme="dark"] .sec-itin, html[data-theme="dark"] .sec-itin.state-warn, html[data-theme="dark"] .sec-itin.state-good { background: none !important; border: 0 !important; box-shadow: none !important; }
html[data-theme="dark"] .sec-itin.state-warn .sec-h, html[data-theme="dark"] .sec-itin.state-good .sec-h { color: var(--ink-3) !important; }
html[data-theme="dark"] .tabs button.replan, html[data-theme="dark"] .attr-tabs button.replan, html[data-theme="dark"] .dbcard.replan { border-color: var(--line) !important; background: var(--surface) !important; box-shadow: none !important; }
html[data-theme="dark"] .tabs button.replan.active, html[data-theme="dark"] .attr-tabs button.replan.on, html[data-theme="dark"] .dbcard.replan.on { background: var(--brand) !important; border-color: var(--brand) !important; }
html[data-theme="dark"] .park-tip { background: var(--surface-2) !important; border-color: var(--line-soft) !important; }
@media (min-width: 821px) {
  html[data-theme="dark"] .itin-h { background: var(--bg) !important; }
  html[data-theme="dark"] .itinerary .leg, html[data-theme="dark"] .lunch { background: var(--surface) !important; border-color: var(--line-soft) !important; }
  html[data-theme="dark"] .lunch { border-left-color: var(--warn) !important; } html[data-theme="dark"] .itinerary .leg { border-left-color: #0f766e !important; }
}
html[data-theme="dark"] .tabs .daybox > .slot.filled, html[data-theme="dark"] .tabs .startbox > .slot.filled { border-width: 0 !important; background: color-mix(in srgb, var(--good-bg) 45%, transparent) !important; }
html[data-theme="dark"] .tabs .daybox > .slot.filled { border-left: 1px solid var(--line-faint) !important; }
html[data-theme="dark"] .tabs .daybox > .slot.filled:hover, html[data-theme="dark"] .tabs .startbox > .slot.filled:hover { background: var(--brand-soft) !important; }
html[data-theme="dark"] .tabs .daybox > .startcol > .slot, html[data-theme="dark"] .tabs .daybox > .startcol > .slot.filled { border-width: 0 !important; }
html[data-theme="dark"] .tabs .daybox > .startcol > .slot + .slot { border-top: 1px solid var(--line-faint) !important; }
html[data-theme="dark"] .tabs .daybox > .startcol > .slot.filled { background: color-mix(in srgb, var(--good-bg) 45%, transparent) !important; }