/* Skyhook: night-sky navy + signal orange. */
:root { --ink:#10233f; --muted:#42566f; --faint:#71849a; --paper:#f3f5f8; --white:#fff; --line:#d5dde6; --accent:#ff690f; --accent-d:#c94f05; --blue:#1d5bd6; --bad:#b3261e; --good:#0b6b3a; --warn:#fff3e0;
  --display:"Bricolage Grotesque","Avenir Next","Segoe UI",system-ui,sans-serif; --body:"Public Sans",system-ui,-apple-system,"Segoe UI",sans-serif; --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace; }
* { box-sizing:border-box; }
html { scroll-padding-top:110px; }
body { margin:0; font:400 15.5px/1.55 var(--body); color:var(--ink); background:var(--paper); -webkit-font-smoothing:antialiased; }
a { color:var(--blue); text-underline-offset:3px; }
:focus-visible { outline:3px solid var(--blue); outline-offset:2px; border-radius:4px; }
code { font:12.5px var(--mono); background:#e6ecf3; padding:1px 6px; border-radius:4px; word-break:break-all; }
.wrap { max-width:1180px; margin:0 auto; padding-left:24px; padding-right:24px; }
.muted { color:var(--muted); } .small { font-size:13.5px; } .grow { flex:1; }
h1,h2,h3 { font-family:var(--display); letter-spacing:-.02em; line-height:1.1; margin:0; }
h1 { font-size:34px; } h2 { font-size:22px; } h3 { font-size:17px; }
.top { position:sticky; top:0; z-index:30; background:var(--paper); border-bottom:1px solid var(--line); }
.top-in { display:flex; align-items:center; gap:16px; padding-top:10px; padding-bottom:10px; }
.brand { display:flex; align-items:center; gap:10px; font:800 22px var(--display); letter-spacing:-.03em; color:var(--ink); text-decoration:none; }
.nav { display:flex; gap:2px; margin-left:8px; flex:1; flex-wrap:wrap; }
.nav a { padding:8px 11px; border-radius:6px; color:var(--muted); text-decoration:none; font-weight:600; }
.nav a:hover { color:var(--ink); background:#e6ecf3; }
.nav a[aria-current=page] { color:var(--ink); box-shadow:inset 0 -3px 0 var(--accent); border-radius:6px 6px 0 0; }
.status { display:flex; align-items:center; gap:8px; padding:9px 13px; border:1.5px solid var(--line); border-radius:6px; background:var(--white); color:var(--ink); font:500 14px var(--body); cursor:pointer; white-space:nowrap; }
.status:hover { border-color:var(--ink); } .status i { width:10px; height:10px; border-radius:50%; background:var(--faint); }
.status.ok i { background:var(--good); } .status.no i { background:var(--accent); box-shadow:0 0 0 2px var(--ink); }
.strip { background:var(--ink); color:#e8eef7; }
.strip-in { display:flex; align-items:center; gap:12px; padding-top:8px; padding-bottom:8px; min-height:40px; }
.verb { font:700 12px var(--mono); padding:2px 7px; border-radius:4px; background:var(--accent); color:#fff; }
.url { flex:1; min-width:0; padding:0; background:none; color:#e8eef7; font:13px var(--mono); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; word-break:normal; }
.url em { font-style:normal; color:#8aa4c6; }
.state { font:600 13px var(--mono); white-space:nowrap; color:#9fd9a8; } .state.wait { color:#ffc27d; } .state.bad { color:#ffb4a8; }
.state.flash { animation:flash .6s ease-out; } @keyframes flash { from { background:var(--accent); color:#fff; } to { background:transparent; } }
.strip-btn { border:1px solid #4a6485; background:none; color:#e8eef7; border-radius:6px; padding:4px 10px; font:500 13px var(--body); cursor:pointer; white-space:nowrap; }
.strip-btn:hover { background:#1a3358; } .strip-btn span { margin-left:4px; color:#ffc27d; font-weight:700; }
.log { position:fixed; z-index:40; right:24px; top:112px; width:min(560px,calc(100vw - 32px)); max-height:calc(100vh - 140px); overflow:auto; padding:18px 20px; background:var(--white); border:1.5px solid var(--ink); border-radius:10px; box-shadow:8px 8px 0 rgb(16 35 63/.15); }
.log-head { display:flex; justify-content:space-between; align-items:center; }
.log-head button { border:0; background:none; color:var(--blue); font:600 14px var(--body); cursor:pointer; text-decoration:underline; }
.call { padding:11px 0; border-top:1px solid var(--line); font-size:14px; } .call .m { display:flex; gap:10px; align-items:baseline; margin-bottom:4px; }
.call .st { font:700 12px var(--mono); color:var(--good); } .call .st.bad { color:var(--bad); } .call code { display:block; background:#eef2f7; } .call .meta { color:var(--muted); margin-top:4px; font-size:13px; }
main { padding-top:28px; padding-bottom:56px; min-height:70vh; }
.foot { padding-top:20px; padding-bottom:36px; color:var(--muted); font-size:13px; border-top:1px solid var(--line); }

/* forms */
.panel { background:var(--white); border:1.5px solid var(--ink); border-radius:10px; padding:18px 20px; }
.form { display:grid; grid-template-columns:repeat(12,1fr); gap:12px 14px; align-items:end; }
.field { display:flex; flex-direction:column; gap:4px; position:relative; grid-column:span 3; min-width:0; }
.field.w2 { grid-column:span 2; } .field.w4 { grid-column:span 4; } .field.w6 { grid-column:span 6; } .field.w12 { grid-column:span 12; }
.field > span { font:600 12.5px var(--body); color:var(--muted); text-transform:uppercase; letter-spacing:.04em; }
.field input,.field select { width:100%; padding:10px 12px; border:1.5px solid var(--line); border-radius:6px; font:15px var(--body); color:var(--ink); background:var(--white); }
.field input:focus,.field select:focus { border-color:var(--ink); }
.field small { color:var(--muted); font-size:12.5px; }
.suggest { position:absolute; z-index:20; top:100%; left:0; right:0; margin:2px 0 0; padding:4px; list-style:none; background:var(--white); border:1.5px solid var(--ink); border-radius:6px; max-height:300px; overflow:auto; box-shadow:0 8px 20px rgb(0 0 0/.12); }
.suggest li { padding:8px 10px; border-radius:4px; cursor:pointer; } .suggest li:hover { background:#e9f0fb; } .suggest small { color:var(--muted); }
.btn { padding:10px 18px; border:1.5px solid var(--accent); border-radius:6px; background:var(--accent); color:#fff; font:700 15px var(--body); cursor:pointer; }
.btn:hover { background:var(--accent-d); border-color:var(--accent-d); } .btn.ghost { background:var(--white); color:var(--ink); border-color:var(--ink); } .btn.ghost:hover { background:#e9f0fb; }
.btn.quiet { background:none; border-color:transparent; color:var(--blue); text-decoration:underline; } .btn.sm { padding:6px 12px; font-size:14px; } .btn[disabled] { opacity:.5; cursor:default; }
.tabs { display:flex; gap:4px; flex-wrap:wrap; margin:14px 0; } .tabs a,.tabs button { padding:8px 14px; border:1.5px solid var(--line); border-radius:999px; background:var(--white); color:var(--ink); text-decoration:none; font:600 14px var(--body); cursor:pointer; }
.tabs [aria-current=true] { background:var(--ink); border-color:var(--ink); color:#fff; }
.chips { display:flex; gap:6px; flex-wrap:wrap; } .chip { padding:3px 10px; border-radius:999px; background:#e6ecf3; font-size:13px; font-weight:500; } .chip.hot { background:var(--warn); color:#7a3a00; } .chip.ok { background:#dff3e6; color:var(--good); }

/* layout of results */
.layout { display:grid; grid-template-columns:260px 1fr; gap:24px; margin-top:20px; align-items:start; }
@media (max-width:900px) { .layout { grid-template-columns:1fr; } .field { grid-column:span 6; } .nav { display:none; } }
.side { background:var(--white); border:1px solid var(--line); border-radius:10px; padding:14px 16px; position:sticky; top:120px; max-height:calc(100vh - 140px); overflow:auto; }
.side h3 { font-size:14px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); margin:14px 0 6px; } .side h3:first-child { margin-top:0; }
.side label { display:flex; align-items:center; gap:8px; padding:3px 0; font-size:14.5px; cursor:pointer; } .side label small { margin-left:auto; color:var(--faint); }
.side input[type=number],.side input[type=text],.side select { width:100%; padding:7px 9px; border:1.5px solid var(--line); border-radius:6px; font:14px var(--body); }
.bar { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin:6px 0 12px; } .bar select { padding:7px 10px; border:1.5px solid var(--line); border-radius:6px; font:14px var(--body); }
.list { display:flex; flex-direction:column; gap:12px; }
.card { background:var(--white); border:1px solid var(--line); border-radius:10px; padding:14px 16px; }
.card:hover { border-color:var(--ink); }
.row { display:flex; gap:16px; align-items:center; } .row > .grow { min-width:0; }
.price { font:800 24px var(--display); letter-spacing:-.02em; white-space:nowrap; } .price small { display:block; font:500 12px var(--body); color:var(--muted); letter-spacing:0; }
.price.low { color:var(--good); }
.loading { padding:40px; text-align:center; color:var(--muted); } .spin { display:inline-block; width:16px; height:16px; border:3px solid var(--line); border-top-color:var(--accent); border-radius:50%; animation:sp .8s linear infinite; vertical-align:-3px; margin-right:8px; } @keyframes sp { to { transform:rotate(360deg); } }
.error { background:#fdecea; color:#7a1710; border:1px solid #f1b9b3; padding:12px 14px; border-radius:8px; margin:12px 0; }
.empty { padding:30px; text-align:center; color:var(--muted); }
.notice { background:var(--warn); border:1px solid #f4cf9b; padding:10px 14px; border-radius:8px; font-size:14px; margin:10px 0; }

/* flights */
.leg { display:grid; grid-template-columns:120px 1fr 90px; gap:14px; align-items:center; padding:6px 0; }
.leg img { height:26px; max-width:100px; object-fit:contain; } .leg .t { display:flex; align-items:center; gap:10px; font:700 18px var(--display); } .leg .t i { flex:1; height:2px; background:var(--line); position:relative; min-width:30px; } .leg .t i b { position:absolute; left:50%; top:-9px; transform:translateX(-50%); font:500 11px var(--body); background:var(--white); padding:0 4px; color:var(--muted); white-space:nowrap; }
.leg small { color:var(--muted); display:block; font:400 13px var(--body); }
.offers { width:100%; border-collapse:collapse; font-size:14px; } .offers td,.offers th { padding:8px 6px; border-top:1px solid var(--line); text-align:left; vertical-align:middle; } .offers th { font-size:12px; color:var(--muted); text-transform:uppercase; border-top:0; }
.offers img { height:22px; vertical-align:middle; margin-right:8px; max-width:80px; object-fit:contain; }
.tag { font:700 11px var(--body); text-transform:uppercase; letter-spacing:.05em; padding:2px 7px; border-radius:4px; background:var(--ink); color:#fff; margin-right:6px; }
.tag.cheap { background:var(--good); }
.cal { display:grid; grid-template-columns:repeat(7,1fr); gap:3px; } .cal b { text-align:center; font-size:12px; color:var(--muted); } .cal div { padding:6px 2px; text-align:center; border-radius:4px; font-size:12px; line-height:1.25; min-height:44px; }
.cal .GREEN,.cal .LOW,.cal .cheap { background:#d4f0dc; } .cal .ORANGE,.cal .MEDIUM,.cal .normal { background:#ffe8c7; } .cal .RED,.cal .HIGH,.cal .expensive { background:#f9cdc8; }
.bars { display:flex; align-items:flex-end; gap:6px; height:120px; } .bars div { flex:1; background:var(--blue); border-radius:3px 3px 0 0; min-width:10px; position:relative; } .bars span { position:absolute; bottom:-18px; left:50%; transform:translateX(-50%); font-size:11px; color:var(--muted); }

/* stays */
.stay { display:grid; grid-template-columns:240px 1fr 190px; gap:16px; padding:0; overflow:hidden; }
.stay .ph { background:#dfe6ef center/cover no-repeat; min-height:190px; } .stay .mid { padding:14px 0; } .stay .end { padding:14px 16px 14px 0; display:flex; flex-direction:column; align-items:flex-end; justify-content:space-between; text-align:right; }
.score { display:inline-flex; align-items:center; gap:8px; } .score b { background:var(--ink); color:#fff; border-radius:6px 6px 6px 0; padding:3px 8px; font-weight:700; }
@media (max-width:760px) { .stay { grid-template-columns:1fr; } .stay .end { align-items:flex-start; text-align:left; padding:0 16px 14px; } }
.gallery { display:grid; grid-template-columns:2fr 1fr 1fr; gap:6px; height:340px; border-radius:10px; overflow:hidden; } .gallery div { background:#dfe6ef center/cover no-repeat; } .gallery div:first-child { grid-row:span 2; }
.grid2 { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:12px; } .poi { display:flex; justify-content:space-between; gap:10px; padding:5px 0; border-bottom:1px dashed var(--line); font-size:14px; }
.review { padding:12px 0; border-top:1px solid var(--line); } .review p { margin:4px 0; } .review .pos::before { content:'+ '; color:var(--good); font-weight:800; } .review .neg::before { content:'− '; color:var(--bad); font-weight:800; }
.meter { height:10px; background:#e6ecf3; border-radius:5px; overflow:hidden; flex:1; } .meter i { display:block; height:100%; background:var(--accent); }

/* tiles */
.tiles { display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:14px; }
.tile { display:flex; flex-direction:column; background:var(--white); border:1px solid var(--line); border-radius:10px; overflow:hidden; text-decoration:none; color:inherit; cursor:pointer; text-align:left; padding:0; font:inherit; }
.tile:hover { border-color:var(--ink); } .tile .ph { height:130px; background:#dfe6ef center/cover no-repeat; } .tile .b { padding:10px 12px; } .tile .b b { display:block; } .tile .b small { color:var(--muted); }
.hero { padding:36px 0 18px; } .hero h1 { font-size:44px; max-width:760px; } .hero p { max-width:620px; color:var(--muted); font-size:17px; }
pre.json { background:#0d1b30; color:#d6e3f5; padding:14px; border-radius:8px; overflow:auto; max-height:520px; font:12.5px/1.5 var(--mono); }
.kv { display:grid; grid-template-columns:160px 1fr; gap:4px 12px; font-size:14px; } .kv dt { color:var(--muted); } .kv dd { margin:0; }

/* dialogs */
dialog { border:1.5px solid var(--ink); border-radius:12px; padding:0; max-width:min(900px,calc(100vw - 24px)); width:100%; color:var(--ink); } dialog::backdrop { background:rgb(10 20 40/.55); }
.dlg-head { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:14px 20px; border-bottom:1px solid var(--line); position:sticky; top:0; background:var(--white); z-index:2; }
.dlg-head button { border:0; background:none; color:var(--blue); font:600 14px var(--body); cursor:pointer; text-decoration:underline; } .dlg-body { padding:16px 20px 20px; max-height:78vh; overflow:auto; }
.settings form { padding:20px 24px; } .settings .dlg-head { padding:0 0 12px; margin-bottom:12px; } .settings .field { grid-column:auto; margin:10px 0; }
.dlg-foot { display:flex; gap:10px; align-items:center; margin-top:16px; } .keyrow { display:flex; gap:8px; } .keyrow input { flex:1; }
.test { padding:10px 12px; border-radius:6px; background:#eef2f7; font-size:14px; margin-top:8px; } .test.ok { background:#dff3e6; } .test.bad { background:#fdecea; }

/* dialog polish */
dialog { box-shadow:0 24px 60px rgb(10 20 40/.35); border:0; border-radius:16px; }
.dlg-head { padding:16px 20px 14px; } .dlg-head h2 { margin:0; font-size:19px; }
.dlg-head button.x, #settingsClose { width:34px; height:34px; border-radius:50%; border:1.5px solid var(--line); background:var(--white); color:var(--ink); font:400 22px/1 var(--body); text-decoration:none; display:grid; place-items:center; padding:0 0 2px; cursor:pointer; flex:none; }
.dlg-head button.x:hover, #settingsClose:hover { background:var(--ink); color:#fff; border-color:var(--ink); }
.settings { max-width:min(560px,calc(100vw - 24px)); } .settings form { padding:22px 26px 24px; }
.settings .dlg-head { padding:0; margin:0 0 14px; border:0; position:static; }
.settings .field { display:block; margin:14px 0 0; } .settings .field > span { display:block; margin-bottom:6px; font:600 12px var(--body); letter-spacing:.04em; text-transform:uppercase; color:var(--muted,#5b6b80); }
.settings .field input, .settings .field select { width:100%; box-sizing:border-box; height:42px; padding:0 12px; border:1.5px solid var(--line); border-radius:10px; font:400 15px var(--body); background:var(--white); }
.settings .field input:focus, .settings .field select:focus { outline:0; border-color:var(--blue); box-shadow:0 0 0 3px rgb(30 100 220/.15); }
.settings .field small { display:block; margin-top:6px; color:var(--muted,#5b6b80); font-size:12.5px; }
.settings .field2 { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.settings .keyrow input { flex:1; } .settings .keyrow .btn { height:42px; }
.settings .dlg-foot { margin-top:22px; padding-top:16px; border-top:1px solid var(--line); }

/* flight details dialog */
dialog.fd { max-width:min(760px,calc(100vw - 24px)); } dialog.fd .dlg-body { padding:0; background:#f6f8fb; }
.fd-top { display:flex; gap:14px; align-items:center; padding:18px 22px; background:linear-gradient(135deg,#10233f,#1d3c6e); color:#fff; } .fd-top img { background:#fff; border-radius:8px; padding:4px; }
.fd-top h3 { margin:0; font:800 22px var(--head,var(--body)); } .fd-top .small { color:#c6d3e6; }
.fd-sec { padding:16px 22px 0; } .fd-sec h3 { margin:0 0 10px; font-size:15px; letter-spacing:.02em; }
.ftabs { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(138px,1fr); gap:10px; overflow-x:auto; padding:2px 2px 8px; }
.ftab { display:grid; gap:3px; text-align:left; padding:12px 14px; border:1.5px solid var(--line); border-radius:14px; background:#fff; cursor:pointer; font:inherit; color:var(--ink); transition:border-color .15s, box-shadow .15s; }
.ftab b { font-size:18px; } .ftab:hover { border-color:#9db4d6; } .ftab.on { border-color:var(--accent); box-shadow:0 0 0 3px rgb(255 105 15/.16); }
.bags { display:flex; gap:12px; font-size:13px; color:var(--muted); margin-top:2px; }
.pick { background:#fff; border:1px solid var(--line); border-radius:14px; padding:14px 16px; }
.offer { display:flex; align-items:center; gap:12px; padding-bottom:12px; border-bottom:1px solid var(--line); margin:0 0 12px; } .offer img { border-radius:6px; } .offer .tag { margin-left:8px; font-size:11px; }
.big { font-size:22px; } .iconbtn { width:30px; height:30px; border-radius:50%; border:1.5px solid var(--line); background:#fff; cursor:pointer; font-size:14px; color:var(--muted); }
.amlist { list-style:none; padding:0; margin:10px 0 0; display:grid; grid-template-columns:1fr 1fr; gap:10px 18px; } .am { display:flex; gap:10px; align-items:center; font-size:14.5px; }
.ai { width:22px; height:22px; border-radius:50%; display:grid; place-items:center; font:700 12px var(--body); font-style:normal; flex:none; } .ai.ok { background:var(--good); color:#fff; } .ai.fee { background:var(--ink); color:#fff; } .ai.no { background:var(--line); color:var(--muted); }
.morebtn { margin-top:12px; width:100%; border:0; border-top:1px solid var(--line); background:none; padding:10px 0 0; color:var(--blue); font:600 14px var(--body); cursor:pointer; }
.legbox { background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden; margin-bottom:14px; } .leg-h { display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; padding:14px 16px; border-bottom:1px solid var(--line); } .leg-h b { font-size:16px; }
.seg { padding:14px 16px 16px; } .seg-head { display:flex; align-items:center; gap:10px; margin-bottom:12px; } .seg-head .chip { margin-left:auto; }
.rail { position:relative; display:grid; gap:0; } .rail::before { content:""; position:absolute; left:7px; top:16px; bottom:16px; border-left:2px solid #c9d3df; }
.stop { display:flex; gap:14px; align-items:flex-start; } .dot { width:16px; height:16px; border-radius:50%; background:#fff; border:3px solid var(--ink); flex:none; margin-top:4px; z-index:1; box-sizing:border-box; }
.stop-t { display:flex; align-items:baseline; gap:10px; } .tm { font-size:19px; } .ap { color:var(--ink); } .ap .code { color:var(--muted); font-weight:600; }
.ride { padding:12px 0 12px 30px; }
.chips { display:flex; flex-wrap:wrap; gap:8px; margin:14px 0 0; } .chip { display:inline-flex; align-items:center; padding:4px 10px; border-radius:999px; border:1px solid var(--ink); font:600 12.5px var(--body); } .chip.soft { border-color:var(--line); background:#eef2f7; color:var(--muted); }
.cabin { list-style:none; margin:12px 0 0; padding:12px 14px; background:#eef2f7; border-radius:12px; display:grid; gap:8px; font-size:14px; } .cabin li { display:flex; gap:10px; align-items:center; } .fi { width:22px; text-align:center; flex:none; }
.lay { display:flex; align-items:center; gap:8px; margin:16px -16px -16px; padding:12px 16px; background:#fff7ec; border-top:1px solid #f1d9b5; border-bottom:1px solid #f1d9b5; color:#7a4a05; }
.pb .pbr { padding:10px 0; border-bottom:1px solid var(--line); } .pb .total { border-bottom:0; font-size:18px; }
@media (max-width:620px) { .amlist { grid-template-columns:1fr; } }

/* price breakdown dialog */
dialog.pbd { max-width:min(420px,calc(100vw - 24px)); } dialog.pbd .dlg-body { padding:18px 22px 22px; }
.pbk-site { display:flex; align-items:center; gap:10px; padding-bottom:14px; border-bottom:1px solid var(--line); } .pbk-site img { border-radius:6px; }
.pbk-rows { padding:6px 0; } .pbk-row { display:flex; align-items:center; gap:12px; padding:12px 0; font-size:15.5px; } .pbk-ic { width:30px; height:30px; display:grid; place-items:center; background:#eef2f7; border-radius:8px; font-size:15px; }
.pbk-total { display:flex; justify-content:space-between; align-items:baseline; padding:14px 0 4px; border-top:1.5px solid var(--ink); font-size:16px; } .pbk-total b { font-size:26px; }
.pbk-note { margin:2px 0 16px; } .pbk-cta { width:100%; height:46px; font-size:16px; border-radius:12px; }
.pbk-link { display:block; text-align:center; margin-top:14px; color:var(--blue); font:600 14.5px var(--body); text-decoration:none; } .pbk-link:hover { text-decoration:underline; }

.pager { display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin:16px 0; }

/* filter panel */
.fsec { border-bottom:1px solid var(--line); } .fsec > summary { display:flex; justify-content:space-between; align-items:center; gap:8px; padding:11px 2px; cursor:pointer; list-style:none; font-size:14.5px; } .fsec > summary::-webkit-details-marker { display:none; }
.fsec > summary::after { content:'⌄'; color:var(--muted); margin-left:auto; padding-left:8px; } .fsec[open] > summary::after { content:'⌃'; }
.fbody { padding:0 2px 12px; } .fbody .scroll { max-height:230px; overflow:auto; } .ghead { font:700 12px var(--body); text-transform:uppercase; letter-spacing:.05em; color:var(--muted); margin:8px 0 2px; }
.hist { display:flex; align-items:flex-end; gap:2px; height:56px; margin:8px 0; } .hist i { flex:1; background:var(--ink); border-radius:2px 2px 0 0; opacity:.85; }
.two { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:6px 0; } .col { display:grid !important; gap:3px; }
.fact { position:sticky; bottom:-14px; background:var(--white); padding:10px 0 2px; margin-top:6px; border-top:1px solid var(--line); display:grid; gap:8px; }

.side label.off { opacity:.45; } .side label.all { font-weight:700; } .side label.sub { padding-left:22px; } .side .ghead { font:700 13.5px var(--body); text-transform:none; letter-spacing:0; color:var(--ink); margin:8px 0 2px; }
.fbody .scroll { max-height:260px; }
.legs{grid-column:1/-1;display:grid;gap:8px;width:100%}.legrow{padding:0;margin:0}

/* ---- stay detail ---- */
.stay-head{display:flex;gap:16px;align-items:flex-start;margin:10px 0 14px;flex-wrap:wrap}
.ratebox{display:flex;gap:10px;align-items:center;text-decoration:none;color:inherit;background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px 12px}
.ratebox>b,.rbig>b{background:var(--ink);color:#fff;border-radius:8px 8px 8px 0;padding:6px 10px;font-size:20px}
.ratebox small{display:block;color:var(--muted,#667)}
.tone-good{background:#0b7a4b!important}.tone-mid{background:#b7791f!important}.tone-low{background:#c0392b!important}
.mosaic{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:200px 200px;gap:6px;border-radius:14px;overflow:hidden}
.mo{border:0;padding:0;cursor:pointer;background:#dfe6ef center/cover no-repeat;position:relative}.mo:hover{filter:brightness(.92)}
.mo.m0{grid-row:1/3}.mo-more{position:absolute;inset:0;background:rgba(10,20,40,.55);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px}
@media(max-width:720px){.mosaic{grid-template-columns:1fr 1fr;grid-template-rows:200px 120px 120px}.mo.m0{grid-column:1/3;grid-row:1}}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px}.pg{aspect-ratio:4/3;border:0;border-radius:8px;cursor:pointer;background:#dfe6ef center/cover no-repeat}.pg:hover{filter:brightness(.9)}
.chip.pick{cursor:pointer;background:#fff}.chip.pick.on{background:var(--ink);color:#fff}.chip.soft{border-color:var(--line);font-weight:500}
.pv{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;min-height:60vh;justify-content:center}.pv-img{max-width:100%;max-height:72vh;border-radius:8px;object-fit:contain}.pv-cap{font-size:13px;color:#667}
.pv-nav{position:absolute;top:40%;width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.92);box-shadow:0 2px 8px rgba(0,0,0,.25);font-size:26px;cursor:pointer}.pv-nav.l{left:8px}.pv-nav.r{right:8px}
.cols{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;margin-top:18px}@media(max-width:900px){.cols{grid-template-columns:1fr}}
.sec{margin:0 0 26px}.sec h2{margin:0 0 10px}.about p{margin:0 0 6px;line-height:1.55}.linkbtn{background:none;border:0;color:var(--accent);font-weight:600;cursor:pointer;padding:0}
.hl{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;margin-top:12px}.hlcard{background:#f2f6fb;border-radius:10px;padding:10px 12px}.hlcard b{display:block}.hlcard span{font-size:13px;color:#556}
.amgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px 14px;margin-bottom:10px}.am{display:flex;gap:8px;align-items:center}.am i{color:#0b7a4b;font-style:normal;font-weight:800}
.amcats{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:8px;margin-top:10px}.amcat{background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px 12px}.amcat summary{cursor:pointer;font-weight:600}.amcat ul{margin:8px 0 0;padding-left:18px;font-size:13px}
.side2 .card{position:sticky;top:76px}.fact{display:flex;justify-content:space-between;gap:8px;padding:6px 0;border-bottom:1px dashed var(--line);font-size:14px}.fact span{color:#667}
.rhero{display:grid;grid-template-columns:minmax(260px,1fr) minmax(260px,1.2fr);gap:24px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px;margin:14px 0}@media(max-width:800px){.rhero{grid-template-columns:1fr}}
.rbig{display:flex;gap:14px;align-items:flex-start}.rbig>b{font-size:34px;padding:10px 14px}.rbig h2{margin:0}.sites{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.site{display:inline-flex;align-items:center;gap:5px;font-size:12px;background:#f2f6fb;border-radius:999px;padding:3px 9px}.site img{height:14px;max-width:60px;object-fit:contain}
.dbar{display:grid;grid-template-columns:90px 1fr 56px;gap:8px;align-items:center;font-size:13px;margin:5px 0}.dbar em{font-style:normal;text-align:right;color:#667}
.meter.t-good i{background:#0b7a4b}.meter.t-mid i{background:#d69e2e}.meter.t-low i{background:#c0392b}
.rsum{background:#eef4ff;border:1px solid #cfe0ff;border-radius:12px;padding:12px 16px;margin-bottom:18px}.rsum p{margin:6px 0 0;line-height:1.5}
.topics{display:flex;flex-wrap:wrap;gap:8px}.topic{display:inline-flex;gap:8px;align-items:center;border-radius:999px;padding:5px 12px;background:#f2f6fb;font-size:14px}.topic.pos{background:#e4f5ec}.topic.neg{background:#fbe6e3}
.pc{margin-bottom:18px}.pcbox{border-radius:12px;padding:12px 16px}.pcbox.pos{background:#eef9f3}.pcbox.neg{background:#fdf0ee}.pcbox h3{margin:0 0 6px}.pcbox p{margin:5px 0;font-size:14px}
.rlist{display:grid;gap:12px;margin-top:12px}.rev{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px}.rev p{margin:8px 0 0;line-height:1.5;padding-left:22px;position:relative}
.rev p.pos::before,.rev p.neg::before{position:absolute;left:0;font-weight:800}.rev p.pos::before{content:'+';color:#0b7a4b}.rev p.neg::before{content:'−';color:#c0392b}
.rev-h{display:flex;gap:10px;align-items:center}.pill{color:#fff;border-radius:7px 7px 7px 0;padding:3px 8px;font-weight:700;font-size:14px}
.sgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}.scard{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;text-decoration:none;color:inherit}.scard:hover{border-color:var(--ink)}
.scard .ph{height:160px;background:#dfe6ef center/cover no-repeat;position:relative}.scard .b{padding:10px 12px;display:flex;flex-direction:column;gap:4px;flex:1}.scard .nm{line-height:1.25}.save{position:absolute;left:8px;top:8px;background:#0b7a4b;color:#fff;font-size:12px;font-weight:700;border-radius:999px;padding:3px 9px}
.dlg.wide{width:min(1100px,94vw);max-width:94vw}
.grid2.pc{grid-template-columns:1fr 1fr}@media(max-width:700px){.grid2.pc{grid-template-columns:1fr}}

/* ---- date picker ---- */
.datefld{cursor:pointer;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%23556' stroke-width='1.6'%3E%3Crect x='2' y='3' width='12' height='11' rx='2'/%3E%3Cpath d='M2 7h12M5 1v3M11 1v3'/%3E%3C/svg%3E") right 10px center no-repeat;padding-right:32px}
.datepop{position:absolute;z-index:1000;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 12px 40px rgba(10,20,40,.22);padding:12px 14px;width:min(620px,94vw)}
.dp-head{display:flex;align-items:center;gap:8px;margin-bottom:6px}.dp-hint{font-weight:700;text-align:center}
.dpnav,.dpx{width:32px;height:32px;border-radius:50%;border:1px solid var(--line);background:#fff;cursor:pointer;font-size:18px;line-height:1}.dpnav:hover,.dpx:hover{background:#eef2f8}
.dp-months{display:grid;grid-template-columns:1fr 1fr;gap:18px}@media(max-width:640px){.dp-months{grid-template-columns:1fr}.dp-months .mon:last-child{display:none}}
.mon h4{margin:4px 0 6px;text-align:center}.dgrid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}.dh{text-align:center;font-size:11px;color:#778;padding:2px 0}
.dd{aspect-ratio:1;border:0;background:none;border-radius:50%;cursor:pointer;font:500 13px var(--body)}.dd:hover:not(:disabled){background:#e6eefb}.dd.in{background:#e6eefb;border-radius:0}.dd.sel{background:var(--ink);color:#fff}.dd.today{box-shadow:inset 0 0 0 1px var(--ink)}.dd.off{color:#c3cad6;cursor:default}
.dp-foot{display:flex;align-items:center;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}
.pvbar{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.strip{display:flex;gap:6px;overflow-x:auto;padding:10px 2px 2px;margin-top:6px}.th{flex:none;width:76px;height:56px;border:2px solid transparent;border-radius:6px;cursor:pointer;background:#dfe6ef center/cover no-repeat;opacity:.7}.th.on{border-color:var(--ink);opacity:1}
.gal .pgrid{max-height:68vh;overflow-y:auto;padding-right:4px}
.gal .pv{min-height:0}.gal .pv-img{max-height:58vh}
.albums{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px;max-height:68vh;overflow-y:auto;padding:2px}
.album{display:flex;flex-direction:column;gap:2px;text-align:left;background:none;border:0;padding:0;cursor:pointer;font:inherit}.album .cover{aspect-ratio:4/3;border-radius:12px;background:#dfe6ef center/cover no-repeat;margin-bottom:6px}.album:hover .cover{filter:brightness(.9)}.album small{color:#667}
/* fixed-size gallery so the dialog never jumps while a photo loads */
.gal{min-height:min(74vh,640px)}
.gal .pv{height:min(58vh,520px);background:#eef2f8 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'%3E%3Ccircle cx='20' cy='20' r='14' fill='none' stroke='%23c3cad6' stroke-width='4'/%3E%3Cpath d='M20 6a14 14 0 0 1 14 14' fill='none' stroke='%230b1f3a' stroke-width='4'%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 20 20' to='360 20 20' dur='.8s' repeatCount='indefinite'/%3E%3C/path%3E%3C/svg%3E") center no-repeat;border-radius:10px;overflow:hidden}
.gal .pv-img{max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity .15s;border-radius:0}.gal .pv-img.ready{opacity:1}
.gal .pgrid,.gal .albums{min-height:min(62vh,540px);align-content:start}
/* ---- in the area ---- */
.nbhd{display:flex;gap:14px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:14px;padding:10px;margin-bottom:14px}.nbimg{width:120px;height:70px;border-radius:10px;background:#dfe6ef center/cover no-repeat;flex:none}
.areagrid{display:grid;grid-template-columns:minmax(260px,1fr) minmax(0,1fr);gap:20px}@media(max-width:760px){.areagrid{grid-template-columns:1fr}}
.areamap{width:100%;height:auto;display:block}.legend{display:flex;gap:14px;font-size:12px;color:#667;margin-top:6px}.legend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:5px}
.plist{display:grid;gap:2px}.plist .place{display:flex;gap:10px;align-items:center;padding:8px 4px;border-bottom:1px solid var(--line)}.plist .place b{display:block;font-weight:600;font-size:14px}.plist .place small{color:#778;font-size:12px}
.pic{font-style:normal;width:30px;height:30px;border-radius:50%;background:#eef3f8;display:grid;place-items:center;font-size:14px;flex:none}
.walk{font-size:12px;font-weight:600;background:#eef3f8;border-radius:999px;padding:3px 9px;white-space:nowrap}
.transport{margin-top:18px}.tgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}.tcard{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 14px}.tcard h4{margin:0 0 4px}
/* ---- prices tab ---- */
.pricehead{display:flex;gap:16px;align-items:center;margin:12px 0 16px}.fromp{text-align:right}.fromp small{display:block;color:#667}.fromp b{font-size:22px}
.rgroup{margin-bottom:18px}.rgroup>h3{margin:0 0 8px}
.room2{background:#fff;border:1px solid var(--line);border-radius:14px;margin-bottom:12px;overflow:hidden}.room2-h{display:flex;gap:10px;align-items:center;padding:12px 16px;background:#f5f8fc;border-bottom:1px solid var(--line)}
.offer2{display:grid;grid-template-columns:150px minmax(0,1fr) auto auto;gap:14px;align-items:center;padding:12px 16px;border-top:1px solid var(--line)}.offer2:first-child{border-top:0}.offer2.best{background:#f3fbf6}
.prov{display:flex;align-items:center;gap:8px}.prov img{height:22px;max-width:80px;object-fit:contain}.prov b{font-size:13px}
.perks{display:flex;flex-wrap:wrap;gap:6px}.perk{font-size:12px;font-weight:600;border-radius:999px;padding:3px 10px;background:#eef2f8;color:#445}.perk.ok{background:#e1f4e9;color:#0b6b43}.perk.blue{background:#e5eeff;color:#2450b8}
.pr{text-align:right;display:flex;flex-direction:column;align-items:flex-end}.pr b{font-size:18px}.pr small{color:#667;font-size:12px}.bestflag{font-size:11px;font-weight:700;color:#0b7a4b;text-transform:uppercase;letter-spacing:.03em}
@media(max-width:720px){.offer2{grid-template-columns:1fr auto}.perks{grid-column:1/3;order:3}}
/* ---- cars: listing cards + detail page ---- */
.carcard{background:#fff;border:1px solid var(--line);border-radius:16px;margin-bottom:14px;cursor:pointer;overflow:hidden}.carcard:hover{border-color:var(--ink);box-shadow:0 6px 22px rgba(10,20,40,.08)}
.cc-top{display:grid;grid-template-columns:240px minmax(0,1fr)}@media(max-width:640px){.cc-top{grid-template-columns:1fr}}
.cc-img{background:#f3f6fa;display:grid;place-items:center;padding:12px}.cc-img img{max-width:100%;max-height:150px;object-fit:contain}
.cc-info{padding:14px 16px}.cc-info h3{margin:0 0 2px;font-size:20px}
.cc-specs{display:flex;flex-wrap:wrap;gap:6px 16px;margin:10px 0;font-weight:600}.cc-specs.big{font-size:16px}
.cc-badges{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.agency{height:30px;max-width:100px;object-fit:contain;background:#fff;border:1px solid var(--line);border-radius:6px;padding:2px 4px}
.cc-bottom{display:flex;gap:14px;align-items:center;padding:12px 16px;border-top:1px solid var(--line);background:#fafcfe}.cc-price{text-align:right}.cc-price b{font-size:22px;display:block}.cc-price small{color:#667}
.cardetail{max-width:900px}.cd-hero{background:#f3f6fa;border-radius:16px;display:grid;place-items:center;padding:18px;margin-top:10px}.cd-hero img{max-width:100%;max-height:300px;object-fit:contain}
.cd-title h1{margin:12px 0 2px}
.offerlist{display:grid;gap:14px}.offerbox{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px}.offerbox.best{border-color:#0b7a4b;box-shadow:0 0 0 1px #0b7a4b inset}
.ob-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:12px}.sitelogo{height:36px;max-width:140px;object-fit:contain;display:block;margin-bottom:4px}
.ob-price{text-align:right;display:flex;flex-direction:column;align-items:flex-end}.ob-price b{font-size:24px}.ob-price small{color:#667}
.dealbtn{display:block;width:100%;padding:14px;font-size:17px;border-radius:12px;background:linear-gradient(90deg,#ff6a13,#e8391e);border:0;color:#fff;cursor:pointer;font-weight:700}
.checks{list-style:none;margin:14px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:8px 16px}.checks li{padding-left:24px;position:relative;font-size:14px}.checks li::before{position:absolute;left:0;font-weight:800}.checks li.ok::before{content:'✓';color:#0b7a4b}.checks li.no::before{content:'!';color:#b7791f}
.supplier{display:flex;align-items:center;gap:10px;padding:16px 0;border-bottom:1px solid var(--line);margin-top:16px}.supplier .agency{height:38px;max-width:120px}
.pudo{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden}.osm{width:100%;height:260px;border:0;display:block}.pudo-info{padding:14px 16px;display:grid;gap:4px}.strong{font-weight:700;font-size:17px}
.calmonths{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px 22px}.calmonth h4{margin:0 0 6px;font-size:15px}
/* picker: price colours, legend, summary boxes */
.dd.lv-g{background:#d4f0dc}.dd.lv-o{background:#ffe0b8}.dd.lv-r{background:#f7c4bd}.dd.lv-g:hover:not(:disabled){background:#bfe8cc}
.dd{border-radius:8px}.dd.sel,.dd.sel.lv-g,.dd.sel.lv-o,.dd.sel.lv-r{background:var(--ink);color:#fff}.dd.in:not(.sel){border-radius:0}.dd.off{background:#f3f5f8;color:#b4bcc9}
.monh{display:flex;justify-content:space-between;margin:6px 4px 8px;font-size:15px}
.dp-legend{display:flex;gap:8px;align-items:center;margin-top:8px}.lg{font-weight:700;font-size:13px;border-radius:6px;padding:3px 12px;color:#fff}.lg.g{background:#37724a}.lg.o{background:#b5621f}.lg.r{background:#8a1f23}
.dp-boxes{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}.dbox{border:1px solid var(--line);border-radius:10px;padding:8px 12px;cursor:pointer;display:grid;gap:2px}.dbox.act{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink) inset}.dbox small{color:#667}.dtime{border:0;background:none;color:#1a6fc4;font:600 14px var(--body);padding:0}
.dp-foot .btn{padding:10px 22px}
/* one set of price colours for the legend, the picker days and the price-calendar days */
:root{--p-g:#cfeedb;--p-o:#ffddb0;--p-r:#f6b9b1;--p-g-ink:#1d6b3f;--p-o-ink:#8a4b08;--p-r-ink:#9a2418}
.cal .GREEN,.cal .LOW,.cal .cheap,.dd.lv-g{background:var(--p-g)}
.cal .ORANGE,.cal .MEDIUM,.cal .normal,.dd.lv-o{background:var(--p-o)}
.cal .RED,.cal .HIGH,.cal .expensive,.dd.lv-r{background:var(--p-r)}
.lg{color:#222;border:1px solid rgba(0,0,0,.08)}.lg.g{background:var(--p-g);color:var(--p-g-ink)}.lg.o{background:var(--p-o);color:var(--p-o-ink)}.lg.r{background:var(--p-r);color:var(--p-r-ink)}
/* ---- stays listing card ---- */
.stay2{display:grid;grid-template-columns:260px minmax(0,1fr) 230px;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;margin-bottom:14px}
@media(max-width:900px){.stay2{grid-template-columns:1fr}}
.stay2 .ph{display:block;min-height:220px;background:#dfe6ef center/cover no-repeat;position:relative}.stay2 .save{position:absolute;left:10px;top:10px;background:#0b7a4b;color:#fff;font-weight:700;font-size:12px;border-radius:999px;padding:4px 10px}.phcount{position:absolute;right:10px;bottom:10px;background:rgba(10,20,40,.7);color:#fff;font-size:12px;border-radius:999px;padding:3px 9px}
.stay2 .mid{padding:14px 16px;display:flex;flex-direction:column;gap:2px;min-width:0}.stay2 .mid h3{margin:2px 0;font-size:19px}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}.tag{font-size:12px;background:#eef3f8;border-radius:6px;padding:3px 8px;color:#334}
.clamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:8px 0 0;color:#556}
.stay2 .end{padding:14px 16px;border-left:1px solid var(--line);display:flex;flex-direction:column;align-items:flex-end;text-align:right;gap:2px;background:#fafcfe}
.was s{color:#778;font-size:14px;margin-right:6px}.deal{font-size:12px;font-weight:700;color:#0b7a4b}.stay2 .big{font-size:26px;font-weight:800}
.sites{width:100%;margin-top:8px;border-top:1px solid var(--line);padding-top:6px;display:grid;gap:4px}.siterow{display:flex;justify-content:space-between;align-items:center;font-size:13px}.siterow img{height:16px;max-width:60px;object-fit:contain}
/* ---- stay detail: trip bar, prices, amenities ---- */
.tripbar{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px 14px;margin:0 0 16px}
.tb-sum{display:grid;gap:1px;margin-right:auto;min-width:200px}.tb-sum small{color:#667}.tb-sum b{font-size:17px}
.tripbar .field.tb{margin:0;min-width:120px}.tripbar .field.tb input{width:100%}.tripbar .field.tb:nth-of-type(n+3){min-width:70px;max-width:90px}
.pricesec{background:#fff;border:2px solid var(--ink);border-radius:16px;padding:16px 18px}
.pfilters{display:grid;gap:8px;margin:10px 0 12px}.pf-row{display:flex;flex-wrap:wrap;gap:6px 8px;align-items:center}.pf-row>b{min-width:78px}
.offers2.flat .offer2{border-top:1px solid var(--line)}.offers2.flat .offer2:first-child{border-top:0}
.amtiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px;margin-bottom:12px}.amt{display:flex;gap:10px;align-items:center;background:#f5f8fc;border-radius:12px;padding:10px 12px;font-weight:600;font-size:14px}.amt i{font-style:normal;font-size:20px;width:26px;text-align:center}
.incl{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:6px 0 14px}
.amcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}.amcard{background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px 14px}.amcard h4{margin:0 0 8px}
.amul{list-style:none;margin:0;padding:0;display:grid;gap:6px}.amul li{display:flex;gap:8px;align-items:center;font-size:14px}.amul i{font-style:normal;width:20px;text-align:center}
.offer2{grid-template-columns:200px minmax(0,1fr) auto auto}.prov .small{font-size:12px}
/* ---- explore ---- */
.exp-top{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin-top:14px}.exp-top .field{flex:1;min-width:240px}
.exp-head{margin:18px 0 10px}.exp-pills{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:10px}
.pill-tab{position:relative;border:0;border-radius:12px;padding:12px;background:#e8edf4;font:600 15px var(--body);cursor:pointer}.pill-tab.on{background:var(--ink);color:#fff}.dotmark{display:inline-block;width:7px;height:7px;border-radius:50%;background:#1a9bd8;margin-left:6px;vertical-align:middle}
.exp-panel{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 16px;margin-bottom:12px}.exp-panel h3{margin:0 0 6px}.exp-panel input[type=range]{width:100%;margin:8px 0}
.seg2{display:inline-flex;background:#e8edf4;border-radius:10px;padding:3px;gap:2px;margin-bottom:10px}.seg2 button{border:0;background:none;padding:7px 14px;border-radius:8px;font:600 14px var(--body);cursor:pointer}.seg2 button.on{background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.15)}
.mapbox{margin-top:10px}.exp-map{width:100%;height:auto;display:block;border:1px solid var(--line);border-radius:14px}.mapdot:hover circle{r:8}

/* Forms: labels and inputs line up across a row; help text sits under the input and never pushes neighbours. */
.form.top { align-items:start; }
.form.top .field > span { text-transform:none; letter-spacing:0; font-size:13px; color:var(--ink); }
.form.top .field small { line-height:1.35; }
.field input,.field select,.field .btn { height:42px; box-sizing:border-box; }
.field .btn { display:flex; align-items:center; justify-content:center; padding-top:0; padding-bottom:0; }
.field.place { position:relative; }

/* Explore: one row per country, horizontal scroll, "See all" opens the whole country */
.country { margin:22px 0 8px; } .country h3 { margin:0; font-size:20px; } .country > .row { align-items:flex-end; margin-bottom:10px; }
.hscroll { display:flex; gap:14px; overflow-x:auto; padding-bottom:10px; scroll-snap-type:x proximity; }
.hscroll .tile { flex:0 0 250px; scroll-snap-align:start; }
.country .more { margin-top:12px; }
.tile .b small { display:block; }
.loading.mini { padding:10px 18px; display:flex; align-items:center; gap:8px; flex:0 0 auto; align-self:center; }
.btn.seeall { border-width:1.5px; font-weight:700; padding:7px 16px; }
.tile .b { min-width:0; }
.tile .price { margin-top:6px; }
.tile .tags { display:flex; flex-wrap:wrap; gap:4px; margin-top:6px; min-width:0; }
.tile .tags .chip { white-space:nowrap; max-width:100%; overflow:hidden; text-overflow:ellipsis; }

/* Explore filter panels (Distance, Themes): centred, big option buttons like the Kayak app */
.exp-panel .ctr { text-align:center; } .exp-panel h3.ctr { margin:6px 0 12px; font-size:18px; }
.opts { display:grid; gap:12px; margin:0 0 18px; } .opts.three { grid-template-columns:repeat(3,1fr); } .opts.themes { grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); }
.opt { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; padding:14px 10px; min-height:84px; border:1.5px solid var(--ink); border-radius:12px; background:var(--white); color:var(--ink); font:700 15px var(--body); cursor:pointer; }
.opt:hover { background:#eef3fa; } .opt.on { background:#dbe6f5; border-color:var(--ink); }
.opt .oi { width:26px; height:26px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; } .opt .oi circle { fill:none; }
.opt.tall { min-height:96px; } .opt .emo { font-style:normal; font-size:26px; line-height:1; } .opt small { font:500 12.5px var(--body); color:var(--muted); }
.exp-panel input[type=range] { display:block; width:100%; margin:6px 0 16px; accent-color:var(--accent); }
.panel-foot { display:flex; align-items:center; justify-content:space-between; gap:12px; border-top:1px solid var(--line); padding-top:12px; margin-top:6px; }
.panel-foot .linkbtn, .panel-foot .btn { font:700 15px var(--body); }
.linkbtn { border:0; background:none; color:var(--muted); cursor:pointer; padding:8px 4px; text-decoration:underline; }
@media (max-width:600px) { .opts.three { gap:8px; } }

/* Flight Tracker */
.ftlist { display:flex; flex-direction:column; gap:10px; } .ftrow { display:grid; grid-template-columns:200px 1fr 220px; gap:16px; align-items:center; background:var(--white); border:1px solid var(--line); border-radius:10px; padding:12px 16px; }
.ftl { display:flex; gap:10px; align-items:center; } .ftl img { width:36px; height:30px; object-fit:contain; } .ftl small, .ftt small, .ftr small { display:block; color:var(--muted); font-size:12.5px; }
.ftm { display:grid; gap:6px; } .ftt b { font-size:16px; } .late { color:#b3261e; font-weight:700; font-size:13px; } .early,.ontime { color:#1b7a43; font-weight:700; font-size:13px; }
.ftr { display:flex; flex-direction:column; gap:4px; align-items:flex-start; } .chip.st { font-weight:700; } .chip.st.ok { background:#d9f5e3; color:#14633a; } .chip.st.done { background:#e6ecf3; } .chip.st.wait { background:#fff1cf; color:#7a5200; }
@media (max-width:800px) { .ftrow { grid-template-columns:1fr; } }

/* Best Time to Travel */
.bthero { margin:10px 0 14px; } .bthimg { height:200px; border-radius:12px; background:#dfe6ef center/cover no-repeat; }
.btgrid { display:grid; grid-template-columns:repeat(auto-fit,minmax(340px,1fr)); gap:14px; margin-top:14px; } .btcard { background:var(--white); border:1px solid var(--line); border-radius:12px; padding:14px 16px; } .btcard h3 { margin:0 0 2px; }
.btbars { display:flex; align-items:flex-end; gap:6px; height:140px; margin:14px 0 22px; } .bar1 { position:relative; flex:1; height:100%; display:flex; align-items:flex-end; justify-content:center; } .bar1 i { display:block; width:100%; background:#9db4d4; border-radius:4px 4px 0 0; }
.bar1.hot i { background:var(--accent); } .bar1 span { position:absolute; bottom:-18px; font-size:11px; color:var(--muted); white-space:nowrap; } .btbars.warm .bar1 i { background:#f0a35c; } .btbars.rain .bar1 i { background:#6fb3e0; } .btbars.thin { gap:1px; } .btbars.thin .bar1 i { border-radius:1px 1px 0 0; }
.stats { display:grid; gap:10px; } .stats small { display:block; color:var(--muted); }
.ftrow { cursor:pointer; } .ftrow:hover { border-color:var(--ink); }
.ftdlg { width:min(760px,96vw); } .dthead { display:flex; gap:12px; align-items:center; margin-bottom:14px; } .dthead img { width:44px; height:38px; object-fit:contain; } .dthead small { display:block; color:var(--muted); } .dthead .chip { margin-left:auto; }
.dtprog { position:relative; height:6px; background:var(--line); border-radius:3px; margin:18px 8px 24px; } .dtprog i { display:block; height:100%; background:var(--accent); border-radius:3px; } .dtprog em { position:absolute; top:-11px; transform:translateX(-50%); font-style:normal; font-size:20px; }
.dtcols { display:grid; grid-template-columns:1fr 1fr; gap:22px; } .dtcol small { color:var(--muted); text-transform:uppercase; letter-spacing:.04em; font-size:12px; } .dtcol h3 { margin:2px 0; }
.dtl { display:flex; justify-content:space-between; gap:10px; padding:6px 0; border-bottom:1px solid var(--line); font-size:14px; } .dtl span { color:var(--muted); } .dtl .late { color:#b3261e; } .dtl .ontime { color:#1b7a43; }
.dtpos { margin-top:14px; padding:10px 12px; background:#eef6ff; border-radius:8px; display:flex; flex-direction:column; gap:2px; font-size:14px; }
@media (max-width:640px) { .dtcols { grid-template-columns:1fr; } }
.ftmap { height:300px; border-radius:10px; overflow:hidden; margin:0 0 14px; background:#1b2a3a; }
.ftplane { background:none; border:0; } .ftplane span { display:flex; align-items:center; justify-content:center; width:34px; height:34px; font-size:26px; line-height:1; transform-origin:50% 50%; color:#fff; text-shadow:0 1px 4px #000; }
.leaflet-tooltip.ftlbl { background:rgba(16,35,63,.85); border:0; color:#fff; font-weight:700; box-shadow:none; } .leaflet-tooltip-bottom.ftlbl::before { border-bottom-color:rgba(16,35,63,.85); }
.ftdlg .dlg-body { max-height:84vh; }
.ftmap .leaflet-tile-pane { filter: invert(1) hue-rotate(180deg) brightness(.9) contrast(.95) saturate(.8); }
.ftrefresh { margin-left:12px; } .ftevery { font:inherit; padding:2px 6px; border:1px solid var(--line, #d8dee8); border-radius:6px; background:#fff; }
.btwiz { margin-top:18px; background:#fff; border:1px solid var(--line); border-radius:10px; overflow:hidden; }
.wiztabs { display:flex; border-bottom:1px solid var(--line); overflow-x:auto; } .wiztabs button { flex:1; padding:14px 16px; background:none; border:0; border-bottom:3px solid transparent; font:600 15px var(--body); color:#5b6677; cursor:pointer; white-space:nowrap; } .wiztabs button.on { color:var(--ink); border-bottom-color:var(--ink); }
.wizmain { padding:22px; } .wizmain h2 { margin:0 0 14px; }
.wizpick { display:flex; gap:10px; margin-bottom:16px; } .wizpick select { flex:1; padding:12px; border:0; border-radius:8px; background:#e8edf3; font:15px var(--body); } .wizpick .btn { width:110px; }
.wizadvice, .wizbook { background:#fdf0e1; border-radius:8px; padding:20px; margin-bottom:16px; } .wizadvice h3, .wizbook h3 { margin:6px 0 10px; font-size:24px; } .wizadvice .btn, .wizbook .btn, .wizmain > .btn { display:inline-block; margin-top:8px; text-decoration:none; }
.wizbook { display:flex; gap:16px; } .wizicon { width:48px; height:48px; flex:none; display:flex; align-items:center; justify-content:center; background:#fff; border-radius:6px; font-size:22px; } .wizbook h3 { font-size:19px; margin-top:0; }
.wizrange { padding:14px; background:#eef2f6; border-radius:8px; margin-bottom:16px; font-size:17px; }
.wizcal { max-width:420px; margin:0 0 14px; } .wizcal h4 { margin:8px 0; } .calhead, .calgrid { display:grid; grid-template-columns:repeat(7,1fr); } .calhead span { text-align:center; font-size:13px; color:#5b6677; padding:6px 0; border-bottom:1px solid var(--line); }
.calday { aspect-ratio:1; border:0; background:none; display:flex; flex-direction:column; align-items:center; justify-content:center; font:15px var(--body); cursor:pointer; } .calday:disabled { color:#b9c0cb; cursor:default; } .calday small { font-size:10px; color:#7a8594; } .calday.in { background:#3a4350; color:#fff; } .calday.in small { color:#cfd6df; } .calday.edge { background:#1b2430; border-radius:6px; } .calday.has:not(.in):hover { background:#eef2f6; }
.wizdates { display:flex; gap:20px; padding:12px 0; margin-bottom:6px; } .wizdates div { flex:1; } .wizdates small { display:block; color:#5b6677; } .wizdates b { font-size:20px; }