/* Theme tokens. Light is the base; dark applies when the OS prefers dark (unless
   the user forced light) OR when data-theme="dark" is set by the toggle. The dark
   var block is duplicated (media query + [data-theme=dark]) because plain CSS can't
   share a value set across both — keep the two blocks identical. */
:root{
  color-scheme: light;
  --bg:#f7f8fa; --card:#fff; --ink:#1b2330; --muted:#667085; --line:#e6e9ef;
  --green:#1a7f43; --greenbg:#e7f6ec; --amber:#8a6500; --amberbg:#fdf3da;
  --blue:#0b5cad; --bluebg:#e9f1fb; --red:#b42318; --chip:#eef1f6; --gold:#7a5b00; --goldbg:#fcf2cf;
  --note-ink:#143a63; --note-border:#cfe0f4; --warn-ink:#5c4400; --warn-border:#f0deb0;
  --th-bg:#eff2f7; --th-ink:#3a4658; --th-sorted:#e7eef7; --row-hover:#fafbfd; --row-open:#eef4fb;
  --surface2:#fbfcff; --field-line:#f0f3f8; --chip-active-bg:#1b2330; --chip-active-ink:#fff;
  --dash:#b9c0cc; --mock-bg:#fde8e8; --mock-border:#f3c0c0; --mock-ink:#7a1b1b; --ctl-bg:#fff;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme: dark;
    --bg:#0f141a; --card:#161c24; --ink:#e7ebf2; --muted:#9aa6b6; --line:#28303b;
    --green:#46c47a; --greenbg:#11301e; --amber:#d7a93c; --amberbg:#2c2410;
    --blue:#5aa2e8; --bluebg:#122638; --red:#f0857a; --chip:#222c37; --gold:#d9b44a; --goldbg:#2e2710;
    --note-ink:#bcd6f5; --note-border:#2a3f5a; --warn-ink:#e0c074; --warn-border:#4a3f1e;
    --th-bg:#1c242e; --th-ink:#aab6c6; --th-sorted:#232f3c; --row-hover:#1b222b; --row-open:#1d2733;
    --surface2:#131922; --field-line:#222c37; --chip-active-bg:#e7ebf2; --chip-active-ink:#0f141a;
    --dash:#586675; --mock-bg:#3a1a1a; --mock-border:#5a2a2a; --mock-ink:#f0a0a0; --ctl-bg:#1c242e;
  }
}
:root[data-theme="dark"]{
  color-scheme: dark;
  --bg:#0f141a; --card:#161c24; --ink:#e7ebf2; --muted:#9aa6b6; --line:#28303b;
  --green:#46c47a; --greenbg:#11301e; --amber:#d7a93c; --amberbg:#2c2410;
  --blue:#5aa2e8; --bluebg:#122638; --red:#f0857a; --chip:#222c37; --gold:#d9b44a; --goldbg:#2e2710;
  --note-ink:#bcd6f5; --note-border:#2a3f5a; --warn-ink:#e0c074; --warn-border:#4a3f1e;
  --th-bg:#1c242e; --th-ink:#aab6c6; --th-sorted:#232f3c; --row-hover:#1b222b; --row-open:#1d2733;
  --surface2:#131922; --field-line:#222c37; --chip-active-bg:#e7ebf2; --chip-active-ink:#0f141a;
  --dash:#586675; --mock-bg:#3a1a1a; --mock-border:#5a2a2a; --mock-ink:#f0a0a0; --ctl-bg:#1c242e;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);
  font:14px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
.wrap{max-width:1280px;margin:0 auto;padding:22px}
h1{font-size:22px;margin:0 0 2px}
.sub{color:var(--muted);margin:0 0 14px;font-size:13px}
.langswitch{margin:0 0 6px;font-size:12.5px}
.langswitch a{color:var(--blue);text-decoration:none;font-weight:600}
.langswitch a:hover{text-decoration:underline}
.guidelink{margin:-8px 0 14px}
.guidelink a{color:var(--blue);text-decoration:none;font-weight:600}
.guidelink a:hover{text-decoration:underline}
.note{background:var(--bluebg);border:1px solid var(--note-border);border-radius:10px;padding:10px 14px;margin:0 0 10px;font-size:12.5px;color:var(--note-ink)}
.note b{color:var(--note-ink)}
.warn{background:var(--amberbg);border:1px solid var(--warn-border);border-radius:10px;padding:10px 14px;margin:0 0 12px;font-size:12.5px;color:var(--warn-ink)}
.warn ul{margin:6px 0 0;padding-left:18px}
.warn li{margin:2px 0}
details.ebhow{background:var(--amberbg);border:1px solid var(--warn-border);border-radius:10px;padding:8px 14px;margin:0 0 12px;font-size:12.5px;color:var(--warn-ink)}
details.ebhow summary{cursor:pointer;font-weight:600;list-style:none}
details.ebhow summary::-webkit-details-marker{display:none}
details.ebhow summary::before{content:"▸ ";color:var(--amber)}
details.ebhow[open] summary::before{content:"▾ "}
details.ebhow ul{margin:8px 0 2px;padding-left:18px}
details.ebhow li{margin:2px 0}
.controls{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 12px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.vibelabel{font-size:12.5px;color:var(--muted);align-self:center;font-weight:600}
input[type=search]{padding:7px 11px;border:1px solid var(--line);border-radius:8px;font-size:13px;min-width:160px;background:var(--ctl-bg);color:var(--ink)}
.chip{padding:5px 11px;border-radius:20px;border:1px solid var(--line);background:var(--chip);color:var(--ink);font-size:12.5px;cursor:pointer;user-select:none}
.chip.active{background:var(--chip-active-bg);color:var(--chip-active-ink);border-color:var(--chip-active-bg)}
.toggle{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--ink);cursor:pointer;padding:5px 8px;border:1px solid var(--line);border-radius:8px;background:var(--ctl-bg)}
.themetoggle{cursor:pointer;border:1px solid var(--line);border-radius:8px;background:var(--ctl-bg);color:var(--ink);font-size:14px;line-height:1;padding:5px 9px}
.themetoggle:hover{border-color:var(--muted)}
select{border:none;background:transparent;font:inherit;color:var(--ink);cursor:pointer}
.tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px}
table{width:100%;border-collapse:collapse;background:var(--card)}
th,td{padding:9px 11px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top;font-size:13px}
th{background:var(--th-bg);color:var(--th-ink);font-size:11px;text-transform:uppercase;letter-spacing:.03em;cursor:pointer;white-space:nowrap;position:sticky;top:0}
th .ar{opacity:.4;font-size:10px}
th.sorted{background:var(--th-sorted);color:var(--ink)}
th .ar.on{opacity:1;color:var(--blue)}
tr:hover td{background:var(--row-hover)}
.city{font-weight:700;font-size:14.5px}
.vibe{color:var(--muted);font-size:11.5px}
.reg{color:var(--muted);font-size:12px;white-space:nowrap}
.price{font-variant-numeric:tabular-nums;font-weight:600;white-space:nowrap}
.air{color:var(--muted);font-size:11.5px}
.pill{display:inline-block;padding:0 6px;border-radius:10px;font-size:10.5px;font-weight:700;vertical-align:middle}
.ns{background:var(--greenbg);color:var(--green)}
.via{background:var(--amberbg);color:var(--amber)}
.eb{background:var(--goldbg);color:var(--gold);font-weight:700;font-size:10px;padding:0 6px;border-radius:10px}
.dash{color:var(--dash)}
.prem0{color:var(--green);font-weight:700}
.premN{color:var(--ink);font-variant-numeric:tabular-nums}
.pts{font-weight:700;font-variant-numeric:tabular-nums;color:var(--gold)}
.ptssub{color:var(--muted);font-size:10.5px}
.seas{color:var(--amber);font-size:11px}
.chk{color:var(--amber);font-size:11px}
.hint{color:var(--amber);font-size:11.5px;white-space:normal}
.nsind{color:var(--green);font-size:10.5px;margin-top:2px;font-weight:600}
.links{margin-top:3px;font-size:11px;white-space:nowrap}
a.book{color:var(--blue);font-weight:700;text-decoration:none;cursor:pointer}
a.book:hover{text-decoration:underline}
a.cmp{color:var(--muted);text-decoration:none;margin-left:8px;cursor:pointer}
a.cmp:hover{text-decoration:underline}
a.stay{display:inline-block;margin-top:3px;color:var(--blue);font-size:11px;text-decoration:none;cursor:pointer}
a.stay:hover{text-decoration:underline}
.disclosure{margin-top:8px;font-size:11px;color:var(--muted)}
.range{font-variant-numeric:tabular-nums;white-space:nowrap}
.rangesub{color:var(--muted);font-size:10.5px}
.skipped{color:var(--muted);font-size:12px;margin:10px 2px 0}
.routelinks{margin:16px 2px 0}
.rl-title{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.03em;margin-bottom:6px}
.rl-links{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12.5px}
.rl-links a{color:var(--blue);text-decoration:none}
.rl-links a:hover{text-decoration:underline}
.skipped b{color:var(--ink)}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:11.5px;color:var(--muted);margin:10px 0 0;align-items:center}
.count{font-size:12px;color:var(--muted);margin-left:auto}
.foot{color:var(--muted);font-size:11.5px;margin-top:14px;line-height:1.6}
.mock{background:var(--mock-bg);border:1px solid var(--mock-border);color:var(--mock-ink);border-radius:8px;padding:6px 10px;font-size:12px;margin:0 0 12px;font-weight:600}

/* Slim clickable rows + expandable detail */
tr.mainrow{cursor:pointer}
tr.mainrow.open td{background:var(--row-open)}
td.exp{width:30px;text-align:center;color:var(--muted);font-size:12px;user-select:none}
.detailrow>td{padding:0;background:var(--surface2)}
.detail{display:grid;grid-template-columns:auto;gap:2px;padding:12px 16px 14px}
.field{display:flex;gap:12px;padding:3px 0;align-items:baseline;border-bottom:1px solid var(--field-line)}
.field:last-child{border-bottom:none}
.flabel{flex:0 0 150px;color:var(--muted);font-size:10.5px;text-transform:uppercase;letter-spacing:.03em}
.fval{font-size:13px}
.fval .price{margin-right:2px}

/* Programmatic SEO route pages */
.page .crumbs{font-size:12.5px;margin:0 0 8px}
.page .cmp{margin:14px 0}
.page .cmp th{width:44%;font-size:11px;vertical-align:top}
.page .ctas{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0}
.page .ctas a.book{display:inline-block;background:var(--blue);color:#fff;padding:9px 14px;border-radius:8px;font-weight:700;text-decoration:none}
.page .ctas a.book:hover{filter:brightness(.92)}
.page .related{font-size:12.5px;margin-top:16px}
.page .related a{color:var(--blue);text-decoration:none}
.page .related a:hover{text-decoration:underline}
/* Content guide: ranked multi-column table (scrolls horizontally on mobile) */
.page .gtable{overflow-x:auto;margin:16px 0}
.page .gtable .cmp{margin:0;width:100%}
.page .gtable .cmp th{width:auto;text-align:left;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.03em;white-space:nowrap}
.page .gtable .cmp td{white-space:nowrap}
.page .gtable .cmp td a{color:var(--blue);text-decoration:none;font-weight:600}
.page .gtable .cmp td a:hover{text-decoration:underline}

/* Responsive: collapse the MAIN table into cards on narrow screens. */
@media (max-width:780px){
  .wrap{padding:14px}
  .tablewrap{overflow:visible;border:none;border-radius:0}
  .tablewrap table,.tablewrap thead,.tablewrap tbody,.tablewrap th,.tablewrap td,.tablewrap tr{display:block}
  .tablewrap thead{display:none}
  .tablewrap tr{background:var(--card);border:1px solid var(--line);border-radius:12px;margin:0 0 10px;padding:8px 6px;overflow:hidden}
  .tablewrap td{border:none;padding:5px 12px;text-align:left}
  .tablewrap td::before{content:attr(data-label);display:block;color:var(--muted);font-size:10.5px;text-transform:uppercase;letter-spacing:.03em;margin-bottom:1px}
  .tablewrap td.cityCell{border-bottom:1px solid var(--line);margin-bottom:4px;padding-bottom:8px}
  .tablewrap td.cityCell::before{display:none}
  .tablewrap td.exp{display:none}
  .links{white-space:normal}
  .count{margin-left:0}
  /* detail panel inside a card */
  .detailrow{padding:0}
  .detailrow>td{padding:0}
  .detailrow td::before{display:none}
  .detail{padding:10px 12px}
  .field{flex-direction:column;gap:1px;border-bottom:1px solid var(--field-line)}
  .flabel{flex:none}
}
