/* Suisse Int'l (Swiss Typefaces, licensed): drop the web fonts into public/fonts/ with these names.
   Until they are there, text falls back to Helvetica Neue (close on Apple devices), then Inter. */
@font-face{font-family:'Suisse Intl';src:url(fonts/SuisseIntl-Regular.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Suisse Intl';src:url(fonts/SuisseIntl-Medium.woff2) format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Suisse Intl';src:url(fonts/SuisseIntl-SemiBold.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Suisse Intl';src:url(fonts/SuisseIntl-Bold.woff2) format('woff2');font-weight:700 800;font-style:normal;font-display:swap}
/* =====================================================================
   ATOBE — the app. Light, quiet, one font (Inter), black
   text and one muted brass accent. The start screen keeps its own look;
   everything here applies only when the mark isn't showing.
   ===================================================================== */
body:not(.home),.lt{
  --bg:#f7f6f2;--card:#fff;--ink:#16150f;--sub:#6f6b63;--acc:#0A78C2;--line:#e8e5de;--line2:#d7d3c9;
  --ok:#2e7a4d;--okbg:#e9f3ec;--warn:#8f6210;--warnbg:#f8f0de;--bad:#a8462f;--badbg:#f7e8e3;--soft:#f1efe9;
  --sans:'Suisse Intl','Helvetica Neue',Helvetica,'Inter',Arial,sans-serif;--serif:var(--sans);--mono:var(--sans);--disp:var(--sans);--mark:var(--sans);
  background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.5;transition:none;color-scheme:light
}
body:not(.home) .grain{display:none}
body:not(.home) ::selection{background:#16150f;color:#fff}
body:not(.home) :focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.ic{width:20px;height:20px;flex:none}
.ic.dim{color:var(--line2);width:18px;height:18px}

/* ---------- shell ---------- */
.shell{min-height:100vh;min-height:100dvh}
.bar{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.bar-in{display:flex;align-items:center;gap:28px;max-width:1120px;height:64px;margin:0 auto;padding:0 24px}
.logo{display:flex;align-items:center;gap:9px;font-weight:600;font-size:16px;letter-spacing:-.01em;white-space:nowrap}
.logo svg{width:13px;height:22px}
.logo em{font-style:normal;font-weight:400;color:var(--sub)}
.links2{display:none;gap:4px}
.links2 a{position:relative;display:flex;align-items:center;gap:6px;height:64px;padding:0 12px;color:var(--sub);font-size:14.5px;transition:color .2s}
.links2 a:hover{color:var(--ink)}
.links2 a.on{color:var(--ink);font-weight:500}
.links2 a.on::after{content:'';position:absolute;left:12px;right:12px;bottom:-1px;height:2px;background:var(--ink)}
.cnt{display:grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--ink);color:#fff;font-style:normal;font-size:11px;font-weight:600}
.bar-r{display:flex;align-items:center;gap:10px;margin-left:auto}
.bar-r .btn{display:none}
@media(min-width:900px){.links2{display:flex}.bar-r .btn{display:inline-flex}}
.ib{display:grid;place-items:center;width:38px;height:38px;border:none;border-radius:50%;background:transparent;color:var(--ink);transition:background-color .2s}
.ib:hover{background:var(--soft)}
.me{display:grid;place-items:center;width:36px;height:36px;border:none;border-radius:50%;background:var(--soft);color:var(--ink);font-size:13px;font-weight:600}
.me.lg{width:48px;height:48px;font-size:16px}
.pg{max-width:1120px;margin:0 auto;padding:36px 24px 140px}
@media(min-width:900px){.pg{padding:44px 24px 80px}}
.tabs{position:fixed;left:0;right:0;bottom:0;z-index:40;display:grid;grid-template-columns:repeat(5,1fr);padding:6px 4px max(8px,env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--line)}
.tabs a{display:grid;justify-items:center;gap:2px;padding:6px 0;color:var(--sub);font-size:11.5px}
.tabs a.on{color:var(--ink);font-weight:500}
@media(min-width:900px){.tabs{display:none}}

/* ---------- type and basics ---------- */
.h1{margin:0 0 6px;font-weight:600;font-size:28px;line-height:1.2;letter-spacing:-.02em}
@media(min-width:900px){.h1{font-size:32px}}
.lead{margin:0 0 26px;max-width:620px;color:var(--sub);font-size:16px;line-height:1.55}
.mut{color:var(--sub)}
.sm2{font-size:14px;font-weight:400}
.fine{margin:18px 0 0;color:var(--sub);font-size:13px;line-height:1.5}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 20px;border:1px solid var(--ink);border-radius:999px;background:var(--ink);color:#fff;font:500 15px var(--sans);white-space:nowrap;cursor:pointer;transition:opacity .2s,background-color .2s}
.btn:hover{opacity:.88}
.btn.sm{height:36px;padding:0 16px;font-size:14px}
.btn.ghost{background:#fff;color:var(--ink);border-color:var(--line2)}
.btn.ghost:hover{border-color:var(--ink);opacity:1}
.btn.full{width:100%}
.btn[disabled]{opacity:.3;cursor:default}
.lnk{padding:0;border:none;background:none;color:var(--ink);font:500 15px var(--sans);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--line2);cursor:pointer}
.lnk:hover{text-decoration-color:var(--ink)}
.back{display:inline-flex;align-items:center;gap:4px;color:var(--sub);font-size:14.5px}
.back:hover{color:var(--ink)}
.back .ic{width:16px;height:16px}
.st{display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:999px;font-size:12.5px;font-weight:500;white-space:nowrap}
.st-ok{background:var(--okbg);color:var(--ok)}.st-wait{background:var(--warnbg);color:var(--warn)}.st-bad{background:var(--badbg);color:var(--bad)}.st-mute{background:var(--soft);color:var(--sub)}
.pol{font-size:13px;white-space:nowrap}
.pol.ok{color:var(--ok)}.pol.bad{color:var(--warn)}
.empty{display:grid;justify-items:start;gap:8px;padding:28px;border:1px dashed var(--line2);border-radius:14px;background:#fff}
.empty h3{margin:0;font-size:17px;font-weight:600}
.empty p{margin:0;color:var(--sub)}
.empty .btn{margin-top:6px}
.thumb{position:relative;overflow:hidden;border-radius:10px;aspect-ratio:4/3;background:var(--soft)}

/* sections and rows */
.sec{margin-top:40px}
.sec-h{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:12px}
.sec-h.top{align-items:center;margin-bottom:18px}
.sec-h.top .h1{margin:0}
.sec-h h2{margin:0;font-size:17px;font-weight:600;letter-spacing:-.01em}
.sec-h a{color:var(--sub);font-size:14.5px}
.sec-h a:hover{color:var(--ink)}
.sec-h a.btn,.sec-h a.btn:hover{color:#fff}
.sec-h a.btn.ghost,.sec-h a.btn.ghost:hover{color:var(--ink)}
.rows{overflow:hidden;border:1px solid var(--line);border-radius:14px;background:#fff}
.row{display:flex;align-items:center;gap:14px;min-height:64px;padding:14px 18px;border-top:1px solid var(--line)}
.row:first-child{border-top:none}
a.row{transition:background-color .2s}
a.row:hover{background:#fbfaf7}
.row>.ic{color:var(--sub)}
.grow{flex:1;min-width:0;display:grid;gap:1px}
.grow b{font-weight:500;font-size:15.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.grow .mut{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.db{display:grid;place-items:center;width:46px;height:50px;border:1px solid var(--line);border-radius:10px;color:var(--sub);font-size:11.5px;line-height:1.1;text-transform:uppercase;letter-spacing:.04em;flex:none}
.db b{color:var(--ink);font-size:18px;font-weight:600;letter-spacing:0}
@media(max-width:560px){.row.trip .st{display:none}}
.ul{display:flex;gap:26px;margin:0 0 18px;border-bottom:1px solid var(--line)}
.ul a{padding:10px 0;margin-bottom:-1px;border-bottom:2px solid transparent;color:var(--sub);font-size:15px}
.ul a.on{color:var(--ink);font-weight:500;border-color:var(--ink)}
.stats{display:grid;gap:12px;margin:0 0 30px;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr))}
.stats>div{display:grid;gap:2px;padding:18px 20px;border:1px solid var(--line);border-radius:14px;background:#fff}
.stats .mut{font-size:13.5px}
.stats b{font-size:22px;font-weight:600;letter-spacing:-.015em;font-variant-numeric:tabular-nums}
.box{display:grid;gap:4px;padding:20px;border:1px solid var(--line);border-radius:14px;background:#fff}
.big3{font-size:24px;font-weight:600;letter-spacing:-.015em;font-variant-numeric:tabular-nums}

/* ---------- home ---------- */
.starts{display:grid;gap:12px;margin-top:26px}
@media(min-width:700px){.starts{grid-template-columns:1fr 1fr}}
.start{display:grid;gap:6px;justify-items:start;padding:24px;border:1px solid var(--line);border-radius:16px;background:#fff;color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:border-color .2s,box-shadow .2s}
.start:hover{border-color:var(--ink);box-shadow:0 1px 0 var(--ink)}
.start .ic{width:24px;height:24px;color:var(--acc);margin-bottom:10px}
.start b{font-size:18px;font-weight:600;letter-spacing:-.01em}
.start span{color:var(--sub);font-size:14.5px}
.ask{padding:24px;border:1px solid var(--line);border-radius:16px;background:#fff}
.ask h2{margin:0 0 4px;font-size:17px;font-weight:600}
.ask p{margin:0 0 16px;color:var(--sub)}
.cin2{display:flex;gap:8px}
.cin2 input{flex:1;min-width:0;height:44px;padding:0 18px;border:1px solid var(--line2);border-radius:999px;background:#fff;font:15px var(--sans);color:var(--ink);outline:none}
.cin2 input:focus{border-color:var(--ink)}

/* ---------- booking ---------- */
.wz-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;font-size:14px}
.steps{display:flex;gap:6px;margin:0 0 34px;padding:0;list-style:none}
.steps li{flex:1;min-width:0;display:grid;gap:8px;font-size:13px;color:var(--sub)}
.steps li::before{content:'';height:3px;border-radius:3px;background:var(--line)}
.steps li.done::before,.steps li.now::before{background:var(--ink)}
.steps li.now{color:var(--ink);font-weight:600}
.steps li a{color:var(--ink)}
.steps li span,.steps li a{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:560px){.steps li:not(.now) span,.steps li:not(.now) a{visibility:hidden}}
.wz-grid{display:grid;gap:32px}
@media(min-width:960px){.wz-grid{grid-template-columns:minmax(0,1fr) 330px;align-items:start}}
.wz-main{min-width:0}
.sum{display:none}
@media(min-width:960px){.sum{position:sticky;top:88px;display:grid;gap:14px;padding:22px;border:1px solid var(--line);border-radius:16px;background:#fff}}
.sum-h{display:grid;gap:2px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.sum-h b{font-size:16px;font-weight:600}
.sum-h .mut{font-size:14px}
.sum-l{display:grid;gap:10px}
.sl{display:grid;grid-template-columns:54px 1fr auto;gap:10px;align-items:baseline;font-size:14px}
.sl .grow{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sl b{font-weight:500;font-variant-numeric:tabular-nums}
.sum-t{display:flex;justify-content:space-between;align-items:baseline;padding-top:14px;border-top:1px solid var(--line)}
.sum-t b{font-size:20px;font-weight:600;font-variant-numeric:tabular-nums}
.pl{font-size:13.5px;padding:10px 12px;border-radius:10px}
.pl.ok{background:var(--okbg);color:var(--ok)}.pl.bad{background:var(--warnbg);color:var(--warn)}
.mbar{position:fixed;left:0;right:0;bottom:62px;z-index:35;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 20px;background:#fff;border-top:1px solid var(--line)}
.mbar div{display:grid;line-height:1.2}
.mbar .mut{font-size:12.5px}
.mbar b{font-size:18px;font-weight:600}
@media(min-width:960px){.mbar{display:none}}
.who{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 26px}
.opt{display:grid;gap:3px;justify-items:start;padding:16px 18px;border:1px solid var(--line2);border-radius:14px;background:#fff;color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:border-color .2s,box-shadow .2s}
.opt b{font-size:16px;font-weight:600}
.opt span{color:var(--sub);font-size:14px}
.opt.on{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.form{display:grid;gap:18px 16px}
@media(min-width:640px){.form{grid-template-columns:1fr 1fr}.fld.wide{grid-column:1/-1}}
.fld{display:grid;gap:7px;min-width:0}
.fld>span:first-child{font-size:13.5px;font-weight:500;color:var(--ink)}
.fld input,.fld select,.fld textarea{width:100%;height:46px;padding:0 14px;border:1px solid var(--line2);border-radius:10px;background:#fff;color:var(--ink);font:15px var(--sans);outline:none;transition:border-color .2s;color-scheme:light}
.fld textarea{height:auto;padding:12px 14px;resize:vertical}
.fld input[type=file]{height:auto;padding:10px 12px}
.fld :is(input,select,textarea):focus{border-color:var(--ink)}
.tools{display:flex;justify-content:space-between;align-items:center;margin:0 0 14px}
.seg{display:inline-flex;gap:2px;padding:3px;border-radius:999px;background:var(--soft)}
.seg button{height:32px;padding:0 14px;border:none;border-radius:999px;background:transparent;color:var(--sub);font:14px var(--sans);cursor:pointer}
.seg button.on{background:#fff;color:var(--ink);font-weight:500;box-shadow:0 1px 2px rgba(0,0,0,.08)}
.list{display:grid;gap:10px}
.pick{overflow:hidden;border:1px solid var(--line);border-radius:14px;background:#fff;transition:border-color .2s,box-shadow .2s}
.pick:hover{border-color:var(--line2)}
.pick.on{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.pick-b{display:flex;align-items:center;gap:16px;width:100%;padding:16px 18px;border:none;background:none;color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.al,.hi{display:grid;place-items:center;width:42px;height:42px;border-radius:10px;background:var(--soft);color:var(--ink);font-size:12.5px;font-weight:600;letter-spacing:.03em;flex:none}
.hi{font-size:16px}
.hi .ic{width:20px;height:20px}
.ft{flex:1;min-width:0;display:grid;gap:2px}
.ft b{font-size:16px;font-weight:600}
.ft .mut{font-size:14px;line-height:1.4}
.fp{display:grid;justify-items:end;gap:1px;text-align:right;white-space:nowrap}
.fp b{font-size:16px;font-weight:600;font-variant-numeric:tabular-nums}
.fp .mut{font-size:13px}
.fares2{display:grid;gap:8px;padding:0 18px 18px}
@media(min-width:600px){.fares2{grid-template-columns:repeat(3,1fr)}}
.fare2{display:grid;gap:2px;justify-items:start;padding:12px 14px;border:1px solid var(--line2);border-radius:12px;background:#fff;color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.fare2 .mut{font-size:13px}
.fare2.on{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.skip{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 18px;margin-top:18px;font-size:14px}
.offs{display:grid;gap:14px}
@media(min-width:640px){.offs{grid-template-columns:1fr 1fr}}
.off2{display:flex;flex-direction:column;overflow:hidden;padding:0;border:1px solid var(--line);border-radius:16px;background:#fff;color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:border-color .2s,box-shadow .2s}
.off2:hover{border-color:var(--line2)}
.off2.on{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.off2-m{position:relative;display:block;aspect-ratio:16/9}
.off2-b{display:grid;gap:3px;padding:14px 16px 16px}
.off2-b b{font-size:16px;font-weight:600}
.off2-b .mut{font-size:14px}
.off2-p{display:flex;align-items:baseline;gap:6px;margin-top:6px}
.off2-p b{font-size:15px}
.chkrow{display:flex;align-items:center;gap:14px;padding:16px 18px;cursor:pointer}
.chkrow input{width:18px;height:18px;accent-color:var(--ink);flex:none}
.stepper{display:inline-flex;align-items:center;gap:16px;height:46px}
.stepper button{width:36px;height:36px;border:1px solid var(--line2);border-radius:50%;background:#fff;color:var(--ink);font-size:18px;cursor:pointer}
.stepper b{min-width:24px;text-align:center;font-size:17px;font-weight:600}
.wz-main>.form+.list{margin-top:22px}
.rvl{overflow:hidden;margin:0 0 28px;border:1px solid var(--line);border-radius:14px;background:#fff}
.rvi{display:grid;grid-template-columns:60px 1fr auto;gap:4px 14px;align-items:start;padding:16px 18px;border-top:1px solid var(--line)}
.rvi:first-child{border-top:none}
.rvi>.mut{font-size:13.5px;padding-top:1px}
.rvi .grow b{white-space:normal}
.rvp{display:grid;justify-items:end;font-variant-numeric:tabular-nums}
.rvp b{font-weight:600}
.rvi .lnk{grid-column:2;justify-self:start;font-size:14px}
.rvl .empty{border:none}

/* ---------- trip ---------- */
.th{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-top:16px}
.th .lead{margin-bottom:18px}
.note2{margin:0 0 24px;padding:12px 16px;border-radius:12px;background:var(--warnbg);color:var(--warn);font-size:14.5px}
.tgrid{display:grid;gap:28px}
@media(min-width:960px){.tgrid{grid-template-columns:minmax(0,1fr) 300px;align-items:start}}
.dy h3{margin:26px 0 4px;font-size:15px;font-weight:600}
.dy:first-child h3{margin-top:0}
.ti{display:grid;grid-template-columns:48px 38px 1fr;gap:12px;align-items:start;padding:14px 0;border-top:1px solid var(--line)}
.ti-t{padding-top:9px;color:var(--sub);font-size:13.5px;font-variant-numeric:tabular-nums}
.ti-i{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--soft);color:var(--ink)}
.ti-i .ic{width:18px;height:18px}
.ti-b{display:grid;gap:2px;min-width:0;padding-top:2px}
.ti-b b{font-weight:600;font-size:15.5px}
.ti-b .mut{font-size:14px}
.ref{justify-self:start;margin-top:5px;padding:2px 8px;border-radius:6px;background:var(--soft);font-size:12px;letter-spacing:.06em;font-variant-numeric:tabular-nums}
.side2{display:grid;gap:12px}
@media(min-width:960px){.side2{position:sticky;top:88px}}
.acts{display:grid;padding:6px 18px;border:1px solid var(--line);border-radius:14px;background:#fff}
.lnk2{display:flex;align-items:center;gap:10px;padding:12px 0;border:none;border-top:1px solid var(--line);background:none;color:var(--ink);font:15px var(--sans);text-align:left;cursor:pointer}
.lnk2:first-child{border-top:none}
.lnk2 .ic{width:18px;height:18px;color:var(--sub)}
.lnk2.red,.lnk2.red .ic{color:var(--bad)}
.mini2{grid-template-columns:auto 1fr;gap:6px 14px;font-size:14.5px}
.mini2 b{font-weight:500}
.acts.row3{display:flex;gap:8px;padding:0;border:none;background:none;margin-top:14px}

/* ---------- expenses, card, rewards, company ---------- */
.ex-d{width:52px;flex:none;color:var(--sub);font-size:13.5px;font-variant-numeric:tabular-nums}
.amt{min-width:92px;text-align:right;font-weight:500;font-variant-numeric:tabular-nums}
@media(max-width:560px){.ex2 .st{display:none}.ex2 .btn{display:none}}
.plus{color:var(--ok);font-weight:500}
.pk{width:90px;flex:none;color:var(--sub);font-size:14px}
.ap2{align-items:flex-start;flex-wrap:wrap}
.ap2 .grow b,.ap2 .grow .mut{white-space:normal}
.q{font-style:italic}
.ap-a{display:flex;gap:8px;align-items:center}
.cgrid{display:grid;gap:24px;margin-top:22px}
@media(min-width:900px){.cgrid{grid-template-columns:420px 1fr;align-items:start}}
.ccard{position:relative;aspect-ratio:1.586;max-width:420px;padding:24px 26px;border-radius:18px;overflow:hidden;color:#f2ede4;background:radial-gradient(120% 90% at 85% 0%,rgba(228,196,138,.25),transparent 55%),linear-gradient(145deg,#24201a,#0b0a08 70%);box-shadow:0 20px 40px -24px rgba(0,0,0,.5);display:flex;flex-direction:column;justify-content:space-between;transition:filter .4s}
.ccard.frozen{filter:grayscale(1) brightness(.85)}
.cc-t{display:flex;justify-content:space-between;align-items:flex-start;font-weight:600;letter-spacing:.3em;font-size:14px}
.cc-t svg{height:40px;width:auto}
.cc-chip{width:40px;height:30px;border-radius:7px;background:linear-gradient(135deg,#e4c48a,#a7864f)}
.cc-n{font-size:18px;letter-spacing:.16em;font-variant-numeric:tabular-nums}
.cc-f{display:flex;justify-content:space-between;font-size:12.5px;letter-spacing:.1em}
.cc-z{position:absolute;inset:0;display:grid;place-items:center;background:rgba(0,0,0,.3);font-size:20px;font-weight:600;letter-spacing:.3em;text-transform:uppercase}
.meter{display:block;height:6px;margin:12px 0 18px;border-radius:6px;background:var(--soft);overflow:hidden}
.meter i{display:block;height:100%;border-radius:6px;background:var(--ink)}
.okl{display:grid;gap:10px;margin:0;padding:0;list-style:none;font-size:15px}
.okl li{display:flex;gap:10px}
.okl li::before{content:'✓';color:var(--ok);font-weight:600}
.okl li.no::before{content:'×';color:var(--bad)}

/* ---------- sheets, toast, concierge: light inside the app ---------- */
body:not(.home) .modal{background:rgba(22,21,15,.32);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
body:not(.home) .sheet{max-width:560px;background:#fff;border:none;box-shadow:0 30px 80px -20px rgba(0,0,0,.35)}
body:not(.home) .sheet h3{margin:0 0 8px;font-size:22px;font-weight:600;letter-spacing:-.015em}
body:not(.home) .sheet .x{display:grid;place-items:center;border:none;background:var(--soft);color:var(--ink)}
body:not(.home) .sheet .x .ic{width:16px;height:16px}
.sheet-a{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.sheet .form{margin-top:16px}
.me-h{display:flex;align-items:center;gap:14px;margin:4px 0 12px}
.me-h div{display:grid}
.me-h b{font-size:17px;font-weight:600}
.me-h span:not(.me){color:var(--sub);font-size:14px}
.mlist{display:grid}
.mlist a{display:flex;align-items:center;gap:14px;padding:14px 2px;border-top:1px solid var(--line);font-size:15.5px}
.mlist .ic{color:var(--sub)}
body:not(.home) .toast{background:var(--ink);color:#fff;font-size:14px}
body:not(.home) .cpanel{background:rgba(247,246,242,.97)}
body:not(.home) .cp-h{color:var(--sub)}
body:not(.home) .cp-x{border-color:var(--line2);color:var(--ink)}
body:not(.home) .cin{background:#fff;border-color:var(--line2)}
body:not(.home) .cin input{color:var(--ink)}
body:not(.home) .cgo{background:var(--ink);color:#fff}
body:not(.home) .cm.me .bub{background:#ebe8e1;border-color:transparent}
body:not(.home) .cm.ai .bub{background:#fff;border-color:var(--line)}
body:not(.home) .cm.ai .bub p{font-weight:400;font-size:17px}
body:not(.home) .alt{background:#fff;border-color:var(--line)}
body:not(.home) .alt h3{font-weight:600;font-size:21px}
body:not(.home) .alt .hook{font-style:normal;font-size:16px;color:var(--acc)}
body:not(.home) .alt .meta{letter-spacing:.04em;text-transform:none;font-size:13.5px}
body:not(.home) .alt li b{text-transform:none;letter-spacing:0;font-size:13px}
body:not(.home) .pill{background:var(--ink);color:#fff}
body:not(.home) .think polygon{fill:var(--ink)}

/* =====================================================================
   SHAPES — after the shopping-list app: warm off-white, soft cards with a
   faint border, rounded rectangles for buttons (not capsules), small chips,
   tiny uppercase label pills, round selection dots, tinted header bands.
   Same Inter, same layout; no gradients except the thin heading bar.
   ===================================================================== */
body:not(.home),.lt{
  --bg:#fbfaf8;--card:#fbf8f4;--ink:#393946;--sub:#737b8c;--line:#ebe5e0;--line2:#e0d9d2;--soft:#f9f1ec;
  --acc:#0A6AAE;--acc10:rgba(31,156,240,.12);--acc30:rgba(31,156,240,.42);--shadow:0 2px 12px -4px rgba(0,0,0,.05);
  --ok:#3d8a6a;--okbg:rgba(89,192,175,.14);--warn:#a86a1c;--warnbg:rgba(240,168,117,.18);--bad:#b4473f;--badbg:rgba(224,108,108,.14)
}
/* headings: a thin brass bar beside the page title */
.h1{display:flex;align-items:center;gap:12px;font-weight:700;letter-spacing:-.025em}
.h1::before{content:'';flex:none;width:4px;height:.95em;border-radius:9px;background:linear-gradient(180deg,#d4b27a,#1F9CF0)}
.th .h1,.sec-h.top .h1{margin:0}

/* cards: 24 px corners, faint border, barely-there shadow */
.rows,.stats>div,.box,.start,.ask,.empty,.sum,.acts,.rvl,.pick,.off2,.opt{border-radius:24px;border:1px solid rgba(235,229,224,.7);background:var(--card);box-shadow:var(--shadow)}
.empty{border-style:dashed}
.rows{padding:6px}
.row{border-top:none;border-radius:14px;min-height:60px;padding:12px 14px}
a.row:hover{background:rgba(249,241,236,.7)}
.row+.row{box-shadow:0 -1px 0 rgba(235,229,224,.6)}
a.row+a.row:hover,a.row:hover+a.row{box-shadow:none}
.db{border:none;background:var(--soft);border-radius:14px}

/* tinted header band at the top of a grouped card, like KÖTT / DRYCK */
.band{display:flex;align-items:center;gap:8px;margin:-1px -1px 4px;padding:10px 18px;background:rgba(249,241,236,.8);color:var(--sub);font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;border-radius:24px 24px 0 0}
.dy{margin-top:18px;overflow:hidden;border:1px solid rgba(235,229,224,.7);border-radius:24px;background:var(--card);box-shadow:var(--shadow)}
.dy:first-child{margin-top:0}
.dy .ti{margin:0 14px;padding:14px 4px;border-top:1px solid rgba(235,229,224,.6)}
.dy .band+.ti{border-top:none}
.rvl{padding:0 0 4px}
.rvl .band{margin-bottom:0}
.rvi{border-top:1px solid rgba(235,229,224,.6);margin:0 4px}
.rvl .band+.rvi{border-top:none}

/* buttons: rounded rectangles; secondary is a tinted outline */
.btn{height:48px;border-radius:16px;padding:0 22px;background:var(--ink);border-color:var(--ink);font-weight:600;letter-spacing:-.005em}
.btn.sm{height:38px;border-radius:12px;padding:0 15px;font-weight:600}
.btn.ghost{background:var(--acc10);border:2px solid var(--acc30);color:var(--ink)}
.btn.ghost:hover{background:rgba(31,156,240,.14);border-color:var(--acc30)}
.btn[disabled]{opacity:.35}
.ib{border-radius:12px}
.me{border-radius:12px;background:var(--soft)}
.me.lg{border-radius:16px}
.lnk{font-weight:600;color:var(--acc);text-decoration:none}
.lnk:hover{color:var(--ink)}

/* chips: small rounded pills for filters, statuses and labels */
.seg{gap:6px;padding:0;background:none;flex-wrap:wrap}
.seg button{height:32px;padding:0 12px;border-radius:999px;background:var(--soft);color:var(--ink);font-size:12.5px;font-weight:500;box-shadow:none}
.seg button.on{background:var(--ink);color:#fff;box-shadow:none}
.st{height:22px;padding:0 9px;font-size:11.5px;font-weight:600}
.pol{font-weight:500}
.sl>.mut,.rvi>.mut{justify-self:start;padding:3px 8px;border-radius:999px;background:var(--soft);font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;line-height:1.3;height:fit-content}
.sl{grid-template-columns:auto 1fr auto}
.rvi{grid-template-columns:auto 1fr auto}
.steps li::before{height:4px;border-radius:9px}
.steps li.now::before{background:linear-gradient(90deg,#393946,#1F9CF0)}

/* choices: a round dot, and a brass ring when chosen */
.pick:hover{border-color:var(--line2)}
.pick.on,.off2.on,.opt.on,.fare2.on{border-color:transparent;box-shadow:0 0 0 2px var(--acc),var(--shadow)}
.pick.on{background:#fffdf9}
.rdo{flex:none;width:22px;height:22px;border:1.5px solid var(--line2);border-radius:50%;background:#fff;transition:border-color .2s,box-shadow .2s}
.pick.on .rdo{border-color:var(--acc);box-shadow:inset 0 0 0 5px var(--acc)}
.al,.hi{border-radius:12px;background:var(--soft)}
.fare2{border-radius:16px;border:1px solid var(--line);background:#fff}
.chkrow input{appearance:none;-webkit-appearance:none;width:22px;height:22px;border:1.5px solid var(--line2);border-radius:50%;background:#fff;display:grid;place-items:center;cursor:pointer}
.chkrow input:checked{border-color:var(--acc);background:var(--acc)}
.chkrow input:checked::after{content:'';width:9px;height:5px;margin-top:-2px;border:solid #fff;border-width:0 0 2px 2px;transform:rotate(-45deg)}
.chkrow input:disabled{opacity:.6}
.chkrow.on{box-shadow:0 0 0 2px var(--acc),var(--shadow)}
.who{gap:12px}
.opt{padding:18px 20px}
.off2{overflow:hidden}
.off2-m{margin:6px 6px 0;border-radius:18px;overflow:hidden}

/* fields: soft 16 px corners on the page colour */
.fld input,.fld select,.fld textarea,.cin2 input{border-radius:16px;border-color:var(--line);background:var(--bg)}
.fld :is(input,select,textarea):focus,.cin2 input:focus{border-color:var(--acc);box-shadow:0 0 0 3px var(--acc10)}
.stepper button{border-radius:12px}

/* summary, notes */
.sum{padding:20px}
.pl{border-radius:14px}
.note2{border-radius:16px}
.ref{border-radius:999px;padding:2px 9px;background:var(--soft);font-weight:600}
.ti-i{border-radius:12px;background:var(--soft)}

/* top bar: soft tinted tabs instead of an underline */
.bar{background:rgba(251,250,248,.9);border-bottom-color:rgba(235,229,224,.7)}
.links2 a{height:36px;border-radius:12px;padding:0 12px}
.links2 a.on{background:var(--soft)}
.links2 a.on::after{display:none}
.links2{gap:2px}
.cnt{border-radius:999px;background:var(--acc)}

/* phones: a floating rounded tab bar */
.tabs{left:14px;right:14px;bottom:max(14px,env(safe-area-inset-bottom));padding:6px;border:1px solid rgba(0,0,0,.05);border-radius:22px;background:rgba(255,255,255,.96);box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.06)}
.tabs a{border-radius:16px;padding:7px 0}
.tabs a.on{background:var(--ink);color:#fff}
.mbar{left:14px;right:14px;bottom:calc(max(14px,env(safe-area-inset-bottom)) + 76px);border:1px solid rgba(235,229,224,.8);border-radius:20px;box-shadow:var(--shadow)}
.pg{padding-bottom:180px}
@media(min-width:900px){.pg{padding-bottom:80px}}

/* sheets and the card visual */
body:not(.home) .sheet{border-radius:24px 24px 0 0;background:var(--card)}
@media(min-width:768px){body:not(.home) .sheet{border-radius:24px}}
body:not(.home) .sheet .x{border-radius:12px}
.mlist a{border-top-color:rgba(235,229,224,.6)}
.ccard{border-radius:24px}
.meter,.meter i{border-radius:9px}
.meter i{background:linear-gradient(90deg,#393946,#1F9CF0)}

/* the two ways to start: the main thing on Home */
.starts{gap:16px;margin-top:26px}
.start2{position:relative;display:block;overflow:hidden;min-height:210px;padding:0;border:none;border-radius:28px;background:#1d1b18;color:#fff;font:inherit;text-align:left;cursor:pointer;box-shadow:0 18px 40px -22px rgba(30,25,20,.55);transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s}
@media(min-width:700px){.start2{min-height:300px}}
.start2:hover{transform:translateY(-3px);box-shadow:0 26px 50px -24px rgba(30,25,20,.6)}
.start2:active{transform:translateY(-1px)}
.s2-m{position:absolute;inset:0}
.s2-m .media{transition:transform 1.4s cubic-bezier(.16,1,.3,1)}
.start2:hover .s2-m .media{transform:scale(1.04)}
.s2-m::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,13,10,.05) 0%,rgba(15,13,10,.2) 40%,rgba(15,13,10,.78) 100%)}
.s2-b{position:absolute;left:0;right:0;bottom:0;display:grid;gap:6px;justify-items:start;padding:24px}
@media(min-width:700px){.s2-b{padding:30px}}
.s2-k{display:inline-flex;align-items:center;gap:7px;margin-bottom:6px;padding:5px 11px 5px 9px;border-radius:999px;background:rgba(255,255,255,.16);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font-size:11.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.s2-k .ic{width:15px;height:15px}
.start2 b{font-size:28px;font-weight:700;letter-spacing:-.025em;line-height:1.1}
@media(min-width:700px){.start2 b{font-size:34px}}
.start2 .s2-b>span:not(.s2-k):not(.s2-go){max-width:40ch;color:rgba(255,255,255,.82);font-size:15px;line-height:1.45}
.s2-go{display:inline-flex;align-items:center;gap:6px;margin-top:12px;height:42px;padding:0 16px 0 18px;border-radius:14px;background:#fff;color:#393946;font-size:15px;font-weight:600}
.s2-go .ic{width:17px;height:17px}
.start2:hover .s2-go{background:#f9f1ec}

/* test pricing: what you save on ATOBE rates */
.save{display:grid;gap:2px;margin:-6px -6px 0;padding:14px 16px;border-radius:18px;background:var(--okbg);color:var(--ok)}
.save b{font-size:17px;font-weight:700;letter-spacing:-.01em}
.save span{font-size:13px;color:color-mix(in srgb,var(--ok) 80%,#fff)}
.save.idle{background:var(--soft);color:var(--ink)}
.save.idle span{color:var(--sub)}
s.was{color:var(--sub);font-size:12.5px;font-weight:400;text-decoration-color:rgba(115,123,140,.7)}
.slp{display:inline-flex;align-items:baseline;gap:7px;white-space:nowrap}
.fp s.was{margin-bottom:-1px}
.rvp s.was{margin-bottom:1px}
.sum-t .slp s.was{font-size:13.5px}
.sv{font-style:normal;color:var(--ok);font-weight:600}
.fine.c{margin:0;text-align:center;font-size:12px}
.sl .slp{flex-direction:column;align-items:flex-end;gap:0;line-height:1.25}
.sl .slp s.was{font-size:11.5px}
.mbar .sv{font-size:12.5px}

/* ---------- the vertical booking flow (#/plan) ---------- */
.top2{margin-top:16px}
.pl-head{display:grid;gap:12px;margin:14px 0 28px}
.pl-you{justify-self:end;max-width:min(560px,90%);padding:14px 18px;border-radius:20px 20px 6px 20px;background:#ebe8e1}
.pl-you .mut{display:block;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.05em}
.pl-you p{margin:2px 0 0;font-size:16px;line-height:1.45}
.pl-ai{display:flex;gap:12px;align-items:flex-start;max-width:min(640px,96%)}
.pl-mark{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:12px;background:var(--soft);color:var(--acc)}
.pl-mark svg{width:11px;height:19px}
.pl-ai p{margin:0;padding:14px 18px;border:1px solid rgba(235,229,224,.8);border-radius:20px 20px 20px 6px;background:var(--card);font-size:16px;line-height:1.5}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.chip{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:999px;background:var(--soft);color:var(--sub);font-size:12.5px;font-weight:500}
.pl-wait{display:flex;align-items:center;gap:14px;padding:30px 4px}
.think2 svg{width:14px;height:24px;overflow:visible}
.think2 polygon{fill:var(--acc);opacity:.14;animation:tk 1.5s ease-in-out infinite}
.think2 polygon:nth-child(1){animation-delay:.48s}.think2 polygon:nth-child(2){animation-delay:.36s}.think2 polygon:nth-child(3){animation-delay:.24s}.think2 polygon:nth-child(4){animation-delay:.12s}
.vflow{position:relative;display:grid;gap:14px;min-width:0}
.vflow::before{content:'';position:absolute;left:33px;top:30px;bottom:110px;width:2px;border-radius:2px;background:var(--line)}
.vs{position:relative;border:1px solid rgba(235,229,224,.7);border-radius:24px;background:var(--card);box-shadow:var(--shadow);scroll-margin-top:84px}
.vs.open{box-shadow:0 0 0 2px var(--acc),var(--shadow);border-color:transparent}
.vs.done:not(.open){background:#fff}
.vs-h{display:flex;align-items:center;gap:14px;padding:16px 18px}
.vs-n{display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:50%;background:var(--soft);color:var(--sub);font-size:13.5px;font-weight:700}
.vs.done .vs-n{background:var(--ok);color:#fff}
.vs.done .vs-n .ic{width:16px;height:16px}
.vs.open .vs-n{background:var(--ink);color:#fff}
.vs-h .grow b{font-size:16.5px;font-weight:600}
.vs-h .grow .mut{white-space:normal}
.needs{display:inline-flex;justify-self:start;height:22px;align-items:center;padding:0 9px;border-radius:999px;background:var(--warnbg);color:var(--warn);font-size:12px;font-weight:600}
.vs-b{padding:0 18px 20px 64px}
@media(max-width:620px){.vs-b{padding:0 14px 18px}}
.vs-b .list{margin-top:4px}
.lead.sm3{margin:0 0 12px;font-size:14.5px}
.rv2 .rvl{margin-bottom:16px}
.rvt{display:flex;justify-content:space-between;align-items:baseline;margin:0 4px;padding:14px 14px 16px;border-top:1px solid rgba(235,229,224,.8);font-weight:600}
.rvt b{font-size:20px}
.rv2 .pl{margin:0 0 16px}
.rv2 .form .btn.full{height:52px;font-size:16px}
.refine{margin-top:8px}
.refine input:disabled{opacity:.6}
.fp sup{font-size:10px;color:var(--warn)}
.ft b sup{font-size:10px;color:var(--warn);margin-left:2px}

/* ---------- sign-in sheet ---------- */
.au h3{margin:0 0 6px}
.au .lead{margin:0 0 18px;font-size:15px}
.gbtn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;height:48px;border:1px solid var(--line2);border-radius:16px;background:#fff;color:var(--ink);font:600 15px var(--sans);cursor:pointer}
.gbtn:hover{border-color:var(--ink)}
.gbtn svg{width:18px;height:18px}
.or{display:flex;align-items:center;gap:12px;margin:16px 0 4px;color:var(--sub);font-size:13px}
.or::before,.or::after{content:'';flex:1;height:1px;background:var(--line)}
.au-f{grid-template-columns:1fr!important;gap:12px!important}
.au-err{margin:0;color:var(--bad);font-size:14px}
.au-err:empty{display:none}
.au-sw{margin:14px 0 0;text-align:center;color:var(--sub);font-size:14px}
/* the sheet is light on the start screen too */
body.home .sheet:has(.au),body.home .sheet:has(.plcx){--disp:'Suisse Intl','Helvetica Neue',Helvetica,'Inter',Arial,sans-serif;--serif:'Suisse Intl','Helvetica Neue',Helvetica,'Inter',Arial,sans-serif;--mono:'Suisse Intl','Helvetica Neue',Helvetica,'Inter',Arial,sans-serif;--bg:#fbfaf8;--card:#fbf8f4;--ink:#393946;--sub:#737b8c;--line:#ebe5e0;--line2:#e0d9d2;--soft:#f9f1ec;--acc:#1F9CF0;--bad:#b4473f;--sans:'Suisse Intl','Helvetica Neue',Helvetica,'Inter',Arial,sans-serif;background:#fbf8f4;color:#393946;font-family:'Suisse Intl','Helvetica Neue',Helvetica,'Inter',Arial,sans-serif;color-scheme:light;border:none;border-radius:24px 24px 0 0}
@media(min-width:768px){body.home .sheet:has(.au),body.home .sheet:has(.plcx){border-radius:24px;max-width:460px}}
body.home .sheet:has(.au) .x,body.home .sheet:has(.plcx) .x{display:grid;place-items:center;border:none;background:#f9f1ec;color:#393946;border-radius:12px}
body.home .sheet:has(.au) .x .ic,body.home .sheet:has(.plcx) .x .ic{width:16px;height:16px}
body.home .sheet:has(.au) h3,body.home .sheet:has(.plcx) h3{font-size:22px;font-weight:600;letter-spacing:-.015em}

.vs .ft b{white-space:nowrap}

/* ---------- the plan under the chat on the start screen ---------- */
.hplan{display:none;position:relative;z-index:3;min-height:100vh;min-height:100svh;margin-top:-8px;padding:40px 24px 60px;border-radius:30px 30px 0 0;pointer-events:auto;box-shadow:0 -30px 70px -30px rgba(0,0,0,.7)}
.hplan.on{display:block;animation:hpin .9s cubic-bezier(.16,1,.3,1) both}
@keyframes hpin{from{opacity:0;transform:translateY(60px)}}
.hplan-in{max-width:1120px;margin:0 auto}
.hplan .sum{top:24px}
.hplan .vs{scroll-margin-top:20px}
.hplan .mbar{position:sticky;left:auto;right:auto;bottom:14px;margin-top:22px}
.hplan .pl-head{margin-top:0}
body.home:has(#hplan.on) .grain{display:none}

/* stages to the side: press one to go there */
.rail{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;position:sticky;top:0;z-index:5;margin:0 -24px 6px;padding:10px 24px;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.rail::-webkit-scrollbar{display:none}
.shell .rail{top:64px}
.rl{flex:none;display:flex;align-items:center;gap:9px;padding:6px 12px 6px 6px;border:1px solid rgba(235,229,224,.8);border-radius:14px;background:var(--card);color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:border-color .2s,box-shadow .2s,background-color .2s}
.rl:hover{border-color:var(--line2)}
.rl.on{border-color:transparent;box-shadow:0 0 0 2px var(--acc)}
.rl-n{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--soft);color:var(--sub);font-size:12px;font-weight:700;flex:none}
.rl.done .rl-n{background:var(--ok);color:#fff}
.rl.done .rl-n .ic{width:14px;height:14px}
.rl.on .rl-n{background:var(--ink);color:#fff}
.rl-t{display:grid;line-height:1.2}
.rl-t b{font-size:13.5px;font-weight:600}
.rl-t span{font-size:11.5px;color:var(--sub);white-space:nowrap}
@media(min-width:1100px){
  .pgrid{grid-template-columns:190px minmax(0,1fr) 300px}
  .rail{flex-direction:column;gap:4px;overflow:visible;top:24px;align-self:start;margin:0;padding:0;background:none;backdrop-filter:none;-webkit-backdrop-filter:none}
  .shell .rail{top:88px}
  .rl{padding:10px 12px 10px 10px;border-color:transparent;background:none}
  .rl:hover{background:var(--card);border-color:rgba(235,229,224,.8)}
  .rl.on{background:var(--card)}
  .rl-n{width:30px;height:30px}
  .rl-t b{font-size:14.5px}
  .rl-t span{font-size:12.5px}
  .rail::before{content:'';position:absolute;left:24px;top:24px;bottom:24px;width:2px;background:var(--line);z-index:-1}
}
@media(min-width:960px) and (max-width:1099px){.pgrid{grid-template-columns:minmax(0,1fr) 300px}.pgrid .rail{grid-column:1/-1}}
@media(max-width:959px){.pgrid{display:grid;grid-template-columns:minmax(0,1fr)}}
.pgrid{gap:28px}
.vflow::before{display:none}

/* one stage on screen at a time */
.hplan .pgrid{min-height:calc(100svh - 80px)}
.stagewrap{display:grid;gap:14px;align-content:start}
.stagewrap.fwd{animation:stF .55s cubic-bezier(.16,1,.3,1) both}
.stagewrap.bwd{animation:stB .55s cubic-bezier(.16,1,.3,1) both}
@keyframes stF{from{opacity:0;transform:translateY(48px)}}
@keyframes stB{from{opacity:0;transform:translateY(-48px)}}
.stepof{display:block;margin-bottom:1px;color:var(--sub);font-size:11.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase}
.vs-h .grow b{font-size:20px;letter-spacing:-.015em}
.vs-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px 18px;border-top:1px solid rgba(235,229,224,.7)}
.vs-nav .btn .ic{width:16px;height:16px}
.vs-nav .hint{font-size:12.5px}
@media(max-width:620px){.vs-nav .hint{display:none}}
.stagewrap .pl-head{margin:0 0 4px}
.stagewrap .refine{margin-top:18px}
.vs.open{box-shadow:var(--shadow);border-color:rgba(235,229,224,.7)}
.rl{min-width:0}
.rl-t{min-width:0}
.rl-t span{overflow:hidden;text-overflow:ellipsis;max-width:150px}
@media(min-width:1100px){.rail{min-width:0}.rl{width:100%}.rl-t span{max-width:130px}}

/* from the chat into the plan: a fade tied to the scroll (--fade 0 → 1) */
body.home:has(#hplan.on) #gl{opacity:calc(1 - var(--fade,0));transform:scale(calc(1 - var(--fade,0) * .08)) translateY(calc(var(--fade,0) * -4vh));transition:opacity .2s linear}
body.home:has(#hplan.on) #homebg{opacity:calc(1 - var(--fade,0))}
body.home:has(#hplan.on) .stage .cdock,body.home:has(#hplan.on) .open-app{opacity:calc(1 - var(--fade,0) * 1.8)}
body.home:has(#hplan.on)::after{content:'';position:fixed;inset:0;z-index:1;pointer-events:none;background:#fbfaf8;opacity:var(--fade,0)}
.hplan{border-radius:0;box-shadow:none;margin-top:0;background:transparent}
.hplan::before{content:'';position:absolute;left:0;right:0;top:-38vh;height:38vh;pointer-events:none;background:linear-gradient(to bottom,rgba(251,250,248,0),rgba(251,250,248,.55) 70%,#fbfaf8)}
.hplan::after{content:'';position:absolute;inset:0;z-index:-1;background:#fbfaf8}
.hplan-in{position:relative;opacity:calc(.15 + var(--fade,0) * .85);transform:translateY(calc((1 - var(--fade,0)) * 36px))}
.hplan.on{animation:none}
@media(prefers-reduced-motion:reduce){.hplan-in{opacity:1;transform:none}}
.hplan::before{opacity:min(1,calc(var(--fade,0) * 2.4))}

/* =====================================================================
   THE ROUTE — the plan as one screen: a porcelain globe on the left, one
   question at a time on the right, a quiet bar with progress, total and
   the next move at the bottom. Light, Inter, brass.
   ===================================================================== */
.hplan{height:100vh;height:100svh;min-height:0;padding:0}
.hplan .jr{opacity:calc(.1 + var(--fade,0) * .9);transform:translateY(calc((1 - var(--fade,0)) * 40px))}
@media(prefers-reduced-motion:reduce){.hplan .jr{opacity:1;transform:none}}
.jr{position:relative;display:grid;height:100%;grid-template-rows:34% 66%}
@media(min-width:960px){.jr{grid-template-columns:minmax(0,1.05fr) minmax(440px,1fr);grid-template-rows:none}}
.jr-page{height:calc(100svh - 64px - 88px);margin:-20px -24px 0;border-radius:24px;overflow:hidden}
@media(min-width:900px){.jr-page{height:calc(100svh - 64px - 60px)}}
/* left: the globe */
.jr-globe{position:relative;min-height:0;overflow:hidden;background:radial-gradient(80% 70% at 50% 45%,#fffdf9 0%,#f4efe7 62%,#ece5da 100%)}
.jr-globe canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.jr-pins{position:absolute;inset:0;pointer-events:none}
.gp{position:absolute;left:0;top:0;margin:-34px 0 0 0;padding:4px 10px;border-radius:999px;background:rgba(255,255,255,.88);box-shadow:0 4px 14px -6px rgba(60,45,20,.35);color:#393946;font-size:12px;font-weight:600;white-space:nowrap;translate:-50% 0;transition:opacity .35s;opacity:0}
.jr-cap{position:absolute;left:24px;bottom:22px;display:grid;gap:2px}
.jr-cap b{font-size:22px;font-weight:700;letter-spacing:.02em;color:#393946}
.jr-cap b i{font-style:normal;color:var(--acc);margin:0 4px}
.jr-cap .mut{font-size:12.5px}
@media(max-width:959px){.jr-cap{left:16px;bottom:12px}.jr-cap b{font-size:17px}}
/* right: one question */
.jr-panel{position:relative;display:flex;flex-direction:column;min-height:0;background:var(--bg);border-left:1px solid rgba(235,229,224,.8)}
@media(max-width:959px){.jr-panel{border-left:none;border-top:1px solid rgba(235,229,224,.8);border-radius:22px 22px 0 0;margin-top:-18px;box-shadow:0 -12px 30px -18px rgba(60,45,20,.25)}}
.jr-body{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:28px clamp(20px,3.4vw,44px) 24px;scrollbar-width:thin}
.jr-ask{display:flex;align-items:baseline;justify-content:space-between;gap:14px;padding-bottom:16px;margin-bottom:22px;border-bottom:1px solid rgba(235,229,224,.8);font-size:14px}
.jr-q{color:var(--sub);font-style:italic;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.jr-ask .lnk{flex:none;font-size:13.5px}
.jr-say{display:flex;gap:8px;margin:-10px 0 20px}
.jr-say input{flex:1;min-width:0;height:40px;padding:0 14px;border:1px solid var(--line2);border-radius:12px;background:#fff;font:14.5px var(--sans);color:var(--ink);outline:none}
.jr-say input:focus{border-color:var(--acc)}
.jr-step{display:grid;gap:14px}
.jr-step.fwd{animation:jrF .6s cubic-bezier(.16,1,.3,1) both}
.jr-step.bwd{animation:jrB .6s cubic-bezier(.16,1,.3,1) both}
@keyframes jrF{from{opacity:0;transform:translateY(34px)}}
@keyframes jrB{from{opacity:0;transform:translateY(-34px)}}
.jr-step>*{animation:inherit}
.jr-k{display:flex;align-items:center;gap:10px;color:var(--acc);font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.jr-k span{display:grid;place-items:center;min-width:30px;height:22px;padding:0 6px;border-radius:999px;background:var(--acc10);font-variant-numeric:tabular-nums;letter-spacing:.04em}
.jr-h{margin:0;font-size:clamp(28px,2.6vw,38px);font-weight:700;letter-spacing:-.03em;line-height:1.08}
.jr-sub{margin:-4px 0 6px;color:var(--sub);font-size:15px;line-height:1.5}
.jr-sub.pad{padding:16px 20px;margin:0}
.jr-ai{margin:0;font-size:16.5px;line-height:1.55;color:var(--ink)}
.jr-fine{margin:4px 0 0;color:var(--sub);font-size:13px}
.sk{display:grid;gap:10px;margin:8px 0 4px}
.sk i{display:block;height:72px;border-radius:18px;background:linear-gradient(90deg,#f1ece4 0%,#f8f4ee 40%,#f1ece4 80%);background-size:200% 100%;animation:skm 1.4s linear infinite}
.sk i:nth-child(2){opacity:.75}.sk i:nth-child(3){opacity:.5}
@keyframes skm{to{background-position:-200% 0}}
/* the sentence */
.mad p{margin:8px 0 0;font-size:clamp(21px,1.9vw,27px);line-height:2.05;letter-spacing:-.015em;color:var(--ink);font-weight:500}
.mad b{font-weight:700}
.mi{display:inline-flex;vertical-align:baseline}
.mi input,.mi select{height:42px;padding:0 14px;margin:0 2px;border:none;border-radius:12px;background:var(--acc10);box-shadow:inset 0 -2px 0 var(--acc30);color:var(--ink);font:600 .82em var(--sans);letter-spacing:-.01em;outline:none;cursor:pointer;color-scheme:light;appearance:none;-webkit-appearance:none;transition:box-shadow .2s,background-color .2s}
.mi select{padding-right:34px;background-image:linear-gradient(45deg,transparent 50%,var(--acc) 50%),linear-gradient(135deg,var(--acc) 50%,transparent 50%);background-position:calc(100% - 18px) 54%,calc(100% - 13px) 54%;background-size:5px 5px;background-repeat:no-repeat;background-color:var(--acc10)}
.mi input:focus,.mi select:focus{box-shadow:inset 0 -2px 0 var(--acc),0 0 0 3px var(--acc10)}
.mi.wide2 input{width:9.5em;cursor:text}
.mi input[type=date]{width:10.2em}
/* option cards */
.opts{display:grid;gap:10px}
.op{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:16px;width:100%;padding:16px 18px;border:1px solid rgba(235,229,224,.9);border-radius:20px;background:#fff;color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .3s,border-color .3s}
.op:hover{transform:translateY(-2px);box-shadow:0 12px 28px -18px rgba(60,45,20,.45);border-color:var(--line2)}
.op.on{border-color:transparent;box-shadow:0 0 0 2px var(--acc),0 14px 30px -20px rgba(10,100,170,.55);background:#fffdf8}
.op .tick{position:absolute;top:-8px;right:-8px;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--acc);color:#fff;transform:scale(0);transition:transform .35s cubic-bezier(.34,1.56,.64,1)}
.op .tick .ic{width:14px;height:14px}
.op.on .tick{transform:scale(1)}
.tg{position:absolute;top:-10px;left:16px;display:flex;gap:6px}
.tg span{height:20px;padding:0 8px;border-radius:999px;background:#393946;color:#fff;font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;line-height:20px}
.tg span.acc{background:var(--acc)}
.tg+.tick{}
.op:has(.tg){margin-top:6px}
.fo{grid-template-columns:minmax(120px,.9fr) minmax(0,1.3fr) auto}
.fo-a{display:flex;align-items:center;gap:12px;min-width:0}
.fo-a span{display:grid;min-width:0}
.fo-a b{font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fo-a small,.ho-b small{color:var(--sub);font-size:12.5px}
.mono2{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:12px;background:var(--soft);color:var(--ink);font-style:normal;font-size:12px;font-weight:700;letter-spacing:.04em}
.fo-t{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px}
.fo-t b{font-size:18px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.fo-t sup{font-size:10px;color:var(--warn);font-weight:700;margin-left:1px}
.fo-l{position:relative;display:grid;justify-items:center;padding-top:10px}
.fo-l i{position:absolute;left:0;right:0;top:4px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--line2),var(--acc30),var(--line2))}
.fo-l i::before,.fo-l i::after{content:'';position:absolute;top:-3px;width:8px;height:8px;border-radius:50%;background:#fff;border:2px solid var(--line2)}
.fo-l i::before{left:-2px}.fo-l i::after{right:-2px}
.fo-l u{position:absolute;left:50%;top:1px;width:8px;height:8px;margin-left:-4px;border-radius:50%;background:var(--acc)}
.fo-l em{margin-top:6px;font-style:normal;color:var(--sub);font-size:12px;white-space:nowrap}
.fo-p{display:grid;justify-items:end;gap:0;text-align:right;white-space:nowrap}
.fo-p b{font-size:17px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.fo-p small{font-size:12px;color:var(--sub)}
.okt{color:var(--ok)!important}.wt{color:var(--warn)!important}
@media(max-width:620px){.fo{grid-template-columns:1fr auto;row-gap:10px}.fo .fo-t{grid-column:1/-1;grid-row:2}.fo .fo-p{grid-row:1;grid-column:2}}
.ho{grid-template-columns:96px minmax(0,1fr) auto;padding:12px 18px 12px 12px}
.ho-m{position:relative;display:block;width:96px;height:76px;border-radius:14px;overflow:hidden}
.ho-b{display:grid;gap:3px;min-width:0}
.ho-b b{font-size:16px;font-weight:600;line-height:1.25}
.rt{display:flex;align-items:center;gap:7px;color:var(--sub);font-size:12.5px}
.rt i{font-style:normal;padding:2px 6px;border-radius:7px;background:#393946;color:#fff;font-size:11.5px;font-weight:700}
@media(max-width:560px){.ho{grid-template-columns:72px minmax(0,1fr);}.ho-m{width:72px;height:72px}.ho .fo-p{grid-column:2;justify-items:start;text-align:left}}
.co{grid-template-columns:auto minmax(0,1fr) auto}
.co-i{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--soft);color:var(--acc)}
.co-i.sm{width:36px;height:36px;border-radius:12px}
.skip2{justify-self:start;margin-top:2px;padding:10px 16px;border:1px dashed var(--line2);border-radius:14px;background:transparent;color:var(--sub);font:500 14px var(--sans);cursor:pointer;transition:border-color .2s,color .2s}
.skip2:hover,.skip2.on{border-color:var(--acc);color:var(--ink)}
/* the ticket */
.tk{position:relative;border-radius:22px;background:#fff;box-shadow:0 18px 40px -26px rgba(60,45,20,.45),0 0 0 1px rgba(235,229,224,.9);overflow:hidden}
.tk-h{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:20px 22px;background:linear-gradient(135deg,#2c2a33,#393946)}
.tk-h>div{display:grid;color:#fff}
.tk-h .r{text-align:right}
.tk-h small{color:rgba(255,255,255,.6);font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.tk-h b{font-size:30px;font-weight:700;letter-spacing:.02em;line-height:1.05}
.tk-h span{color:rgba(255,255,255,.75);font-size:13px}
.tk-m{justify-items:center;text-align:center;gap:6px}
.tk-line{display:flex;align-items:center;gap:6px;width:100%;color:#7CC7F7}
.tk-line i{flex:1;height:0;border-top:1.5px dashed rgba(124,199,247,.6)}
.tk-line .ic{width:18px;height:18px}
.tk-m small{color:rgba(255,255,255,.7)!important;font-size:11.5px!important;letter-spacing:.02em!important;text-transform:none!important;font-weight:500!important}
.tk-cut{position:relative;height:0;border-top:1.5px dashed rgba(235,229,224,1);margin:0 18px}
.tk-cut::before,.tk-cut::after{content:'';position:absolute;top:-11px;width:22px;height:22px;border-radius:50%;background:var(--bg)}
.tk-cut::before{left:-30px}.tk-cut::after{right:-30px}
.tk-r{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:14px;padding:14px 22px;border-bottom:1px solid rgba(235,229,224,.7)}
.tk-r .lnk{font-size:13px}
@media(max-width:560px){.tk-r{grid-template-columns:auto minmax(0,1fr) auto}.tk-r .lnk{grid-column:2}}
.tk-t{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;padding:18px 22px 20px}
.tk-t>div:first-child{display:grid;gap:4px}
.tk-t .mut{font-size:12.5px}
.tk-t b{font-size:28px;font-weight:700;letter-spacing:-.02em}
.sv2{justify-self:start;padding:3px 10px;border-radius:999px;background:var(--okbg);color:var(--ok);font-size:12.5px;font-weight:700}
.jr-f{grid-template-columns:1fr 1fr!important;margin-top:4px}
.jr-step .pl{margin:2px 0 0}
/* done */
.booked{justify-items:start;padding-top:6vh}
.okc{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--ok);color:#fff;animation:okp .7s cubic-bezier(.34,1.56,.64,1) both}
.okc .ic{width:30px;height:30px}
@keyframes okp{from{transform:scale(.3);opacity:0}}
.jr-acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
/* the bar */
.jr-bar{flex:none;display:grid;gap:12px;padding:14px clamp(20px,3.4vw,44px) max(16px,env(safe-area-inset-bottom));background:rgba(251,250,248,.94);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid rgba(235,229,224,.9)}
.jr-prog{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.jp{display:grid;gap:6px;padding:0;border:none;background:none;color:var(--sub);font:600 11.5px var(--sans);text-align:left;cursor:pointer}
.jp i{display:block;height:4px;border-radius:9px;background:var(--line);transition:background-color .4s}
.jp.ok i{background:#393946}
.jp.on i{background:linear-gradient(90deg,#393946,var(--acc))}
.jp.on{color:var(--ink)}
.jp:hover span{color:var(--ink)}
.jr-foot{display:flex;align-items:center;justify-content:space-between;gap:14px}
.jr-sum{display:grid;line-height:1.15}
.jr-sum span{color:var(--sub);font-size:12px}
.jr-sum b{font-size:22px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.jr-sum em{font-style:normal;color:var(--ok);font-size:12.5px;font-weight:600}
.jr-ctl{display:flex;gap:8px}
.jr-ctl .btn{height:48px;padding:0 20px}
.jr-ctl .btn .ic{width:17px;height:17px}
@media(max-width:480px){.hm2{display:none}.jr-ctl .btn.ghost{padding:0 14px}}

/* assumptions under the concierge's reply */
.jr-step .chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:-2px 0 4px}
.jr-step .chip{display:inline-flex;align-items:center;height:auto;min-height:28px;padding:4px 12px;border-radius:999px;background:var(--soft);color:var(--ink);font-size:13px;font-weight:500;line-height:1.3;white-space:normal}
.chips-k{color:var(--sub);font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin-right:2px}
/* the sentence: a calmer size, and a date that reads like words */
.mad p{font-size:clamp(20px,1.7vw,25px);line-height:2.1}
.mi.dt{position:relative}
.mi.dt input{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none}
.dtv{display:inline-flex;align-items:center;height:42px;padding:0 14px;margin:0 2px;border-radius:12px;background:var(--acc10);box-shadow:inset 0 -2px 0 var(--acc30);color:var(--ink);font-weight:600;font-size:.82em;letter-spacing:-.01em;cursor:pointer;white-space:nowrap;transition:box-shadow .2s}
.dtv:hover{box-shadow:inset 0 -2px 0 var(--acc)}
.mi.dt.nodate .dtv{color:var(--acc);box-shadow:inset 0 -2px 0 var(--acc);animation:dtp 2.4s ease-in-out infinite}
@keyframes dtp{50%{background:rgba(31,156,240,.16)}}

/* =====================================================================
   THE MAP — one map from the globe to the street (public/map.js), and
   the eight easy steps: yes/no tiles, quick dates, steppers, hotel list
   with filters and a chat box, the drive from the airport.
   ===================================================================== */
.jr-globe .jr-map{position:absolute;inset:0}
.jr-map .maplibregl-canvas{outline:none}
.jr-map .maplibregl-ctrl-attrib{background:rgba(255,255,255,.7);font:11px var(--sans);color:var(--sub)}
.jr-map .maplibregl-ctrl-attrib a{color:var(--sub)}
.jr-globe .jr-cap{z-index:2;pointer-events:none;padding:10px 14px;margin:-10px -14px;border-radius:16px;background:radial-gradient(closest-side,rgba(251,249,245,.85),rgba(251,249,245,0))}
@media(max-width:959px){.jr{transition:grid-template-rows .7s cubic-bezier(.16,1,.3,1)}.jr[data-step=stay],.jr[data-step=transfer]{grid-template-rows:44% 56%}}
/* airport pins */
.mpin{display:grid;justify-items:center;gap:4px;pointer-events:none;transition:opacity .4s}
.mpin span{padding:4px 10px;border-radius:999px;background:rgba(255,255,255,.94);box-shadow:0 4px 14px -6px rgba(60,45,20,.4);color:#393946;font:600 12px var(--sans);letter-spacing:.04em;white-space:nowrap}
.mpin i{order:2;width:12px;height:12px;border-radius:50%;background:#1F9CF0;box-shadow:0 0 0 3px rgba(255,255,255,.95),0 0 0 7px rgba(31,156,240,.18)}
.mpin.hide{opacity:0}
.mpin.ap i{background:#393946}
.mpin.ht i{background:#1F9CF0;width:14px;height:14px}
/* hotel price pins */
.hpin{padding:0;border:none;background:none;cursor:pointer;font:inherit}
.hpin b{position:relative;display:block;padding:6px 11px;border-radius:999px;background:#fff;color:#393946;font:700 12.5px var(--sans);font-variant-numeric:tabular-nums;white-space:nowrap;box-shadow:0 6px 16px -8px rgba(60,45,20,.5),0 0 0 1px rgba(57,57,70,.08);transition:transform .25s cubic-bezier(.34,1.56,.64,1),background-color .2s,color .2s;transform-origin:50% 100%}
.hpin b::after{content:'';position:absolute;left:50%;bottom:-5px;width:10px;height:10px;margin-left:-5px;background:inherit;transform:rotate(45deg);border-radius:0 0 3px 0;box-shadow:2px 2px 3px -2px rgba(60,45,20,.25)}
.hpin:hover b,.hpin.hl b{transform:scale(1.1)}
.hpin.on b{background:#393946;color:#fff;transform:scale(1.12)}
.hpin:focus-visible b{outline:2px solid var(--acc);outline-offset:2px}
/* the route card in step 1 */
.rt2{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;padding:22px;border-radius:22px;background:#fff;box-shadow:0 0 0 1px rgba(235,229,224,.9),0 16px 34px -26px rgba(60,45,20,.45)}
.rt2>div{display:grid;gap:2px;min-width:0}
.rt2 .r{text-align:right}
.rt2 small{color:var(--sub);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.rt2 b{font-size:clamp(20px,2vw,26px);font-weight:700;letter-spacing:-.02em;line-height:1.15;overflow-wrap:anywhere}
.rt2 span{color:var(--sub);font-size:13px}
.rt2-l{position:relative;display:flex;align-items:center;gap:6px;color:var(--acc)}
.rt2-l i{flex:1;border-top:1.5px dashed var(--acc30)}
.rt2-l .ic{width:20px;height:20px}
.rt2-l em{position:absolute;left:0;right:0;top:22px;text-align:center;font-style:normal;color:var(--sub);font-size:12px}
/* yes / no */
.yns{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:4px}
.yn{position:relative;display:grid;justify-items:start;gap:4px;padding:22px 20px 20px;border:1px solid rgba(235,229,224,.9);border-radius:22px;background:#fff;color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .3s,border-color .3s}
.yn:hover{transform:translateY(-3px);box-shadow:0 16px 30px -20px rgba(60,45,20,.5)}
.yn.on{border-color:transparent;box-shadow:0 0 0 2px var(--acc),0 16px 30px -20px rgba(10,100,170,.55);background:#fffdf8}
.yn-i{display:grid;place-items:center;width:52px;height:52px;margin-bottom:10px;border-radius:16px;background:var(--acc10);color:var(--acc)}
.yn-i .ic{width:26px;height:26px}
.yn b{font-size:19px;font-weight:700;letter-spacing:-.015em}
.yn small{color:var(--sub);font-size:13.5px}
.yn .tick{position:absolute;top:-8px;right:-8px;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--acc);color:#fff;transform:scale(0);transition:transform .35s cubic-bezier(.34,1.56,.64,1)}
.yn .tick .ic{width:14px;height:14px}
.yn.on .tick{transform:scale(1)}
@media(max-width:420px){.yns{grid-template-columns:1fr}.yn{grid-template-columns:auto 1fr;align-items:center;column-gap:14px}.yn-i{grid-row:span 2;margin:0}}
/* quick picks and steppers */
.qd{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
@media(max-width:560px){.qd{grid-template-columns:1fr 1fr}}
.qc{position:relative;display:grid;gap:2px;padding:14px 14px 13px;border:1px solid rgba(235,229,224,.9);border-radius:18px;background:#fff;color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:box-shadow .25s,border-color .25s,transform .3s cubic-bezier(.16,1,.3,1)}
.qc:hover{transform:translateY(-2px);border-color:var(--line2)}
.qc.on{border-color:transparent;box-shadow:0 0 0 2px var(--acc);background:#fffdf8}
.qc b{font-size:15px;font-weight:650;letter-spacing:-.01em}
.qc small{color:var(--sub);font-size:12.5px}
.qc.dp input{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none}
.qc.dp b,.qc.dp small{cursor:pointer}
.q4 .qc{text-align:center;justify-items:center;padding:16px 10px}
.stp{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:6px;padding:14px 16px 14px 20px;border-radius:20px;background:var(--soft)}
.stp-k{font-size:15px;font-weight:600}
.stp-c{display:flex;align-items:center;gap:14px}
.stp-c b{display:grid;justify-items:center;min-width:64px;font-size:30px;font-weight:700;letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums}
.stp-c b small{margin-top:3px;color:var(--sub);font-size:11.5px;font-weight:600;letter-spacing:.02em}
.stp-b{display:grid;place-items:center;width:44px;height:44px;border:none;border-radius:50%;background:#fff;color:var(--ink);cursor:pointer;box-shadow:0 2px 8px -4px rgba(60,45,20,.35);transition:transform .2s,opacity .2s}
.stp-b:hover{transform:scale(1.06)}
.stp-b:disabled{opacity:.35;cursor:default;transform:none}
.stp-b .ic{width:18px;height:18px}
.pur{margin-top:8px}
.pur i{font-style:normal;color:var(--sub);font-weight:500}
/* hotels */
.fbar{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.fc{height:34px;padding:0 14px;border:1px solid rgba(235,229,224,1);border-radius:999px;background:#fff;color:var(--ink);font:500 13.5px var(--sans);cursor:pointer;transition:background-color .2s,border-color .2s,color .2s}
.fc:hover{border-color:var(--line2)}
.fc.on{background:#393946;border-color:#393946;color:#fff}
.fs{margin-left:auto}
.fs select{height:34px;padding:0 30px 0 12px;border:1px solid rgba(235,229,224,1);border-radius:999px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%230A78C2' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 12px center;color:var(--ink);font:500 13.5px var(--sans);appearance:none;-webkit-appearance:none;cursor:pointer}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.hrep{display:flex;gap:10px;align-items:flex-start;margin:0;padding:12px 14px;border-radius:16px;background:var(--acc10);color:var(--ink);font-size:14px;line-height:1.45}
.hrep .ic{flex:none;width:18px;height:18px;margin-top:1px;color:var(--acc)}
.ho2{grid-template-columns:minmax(0,1fr) auto;padding:15px 18px}
.ho2 .bl{color:var(--ink);opacity:.78;font-size:13px;line-height:1.4;margin-top:2px}
.ho2 .rt{margin-top:4px}
.ho2.hl{border-color:var(--acc30);box-shadow:0 10px 24px -18px rgba(10,100,170,.6)}
.opts.busy{opacity:.45;pointer-events:none;transition:opacity .3s}
/* the chat box at the bottom of the hotel step */
.jr-chat{flex:none;display:grid;gap:8px;padding:10px clamp(20px,3.4vw,44px) 2px;background:var(--bg)}
.jr-chat-i{display:flex;align-items:center;gap:6px;height:50px;padding:0 6px 0 16px;border:1px solid var(--line2);border-radius:16px;background:#fff;box-shadow:0 8px 22px -18px rgba(60,45,20,.5);transition:border-color .2s,box-shadow .2s}
.jr-chat-i:focus-within{border-color:var(--acc);box-shadow:0 0 0 3px var(--acc10)}
.jr-chat input{flex:1;min-width:0;height:100%;border:none;background:none;font:15px var(--sans);color:var(--ink);outline:none}
.jr-chat .send{display:grid;place-items:center;flex:none;width:38px;height:38px;border:none;border-radius:12px;background:#393946;color:#fff;cursor:pointer}
.jr-chat .send .ic{width:18px;height:18px}
.jr-chat .send:disabled{opacity:.4}
.jr-chat-s{display:flex;align-items:center;gap:8px;color:var(--sub);font-size:13px}
.jr-chat-s i{width:14px;height:14px;border-radius:50%;border:2px solid var(--acc30);border-top-color:var(--acc);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
/* the road */
.road{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:18px;background:var(--soft)}
.road>.ic{flex:none;width:22px;height:22px;color:var(--acc)}
.road span{display:grid;gap:2px}
.road b{font-size:16px;font-weight:700;letter-spacing:-.01em}
.road small{color:var(--sub);font-size:13px}
.road.wait b{color:var(--sub)}
/* the bar: eight steps */
.jr-prog{grid-template-columns:repeat(8,1fr);gap:5px}
.jp span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:700px){.jp span{display:none}.jp.on span{display:block;overflow:visible}}
.jr-k span .ic{width:13px;height:13px}
.btn.dim{opacity:.55}
.btn.nudge{animation:nudge .45s cubic-bezier(.36,.07,.19,.97)}
@keyframes nudge{20%,60%{transform:translateX(-5px)}40%,80%{transform:translateX(5px)}}
/* phones: the map steps give the list room (no request line, a tighter head, filters on one scrolling row) */
@media(max-width:959px){
  .jr[data-step=stay],.jr[data-step=transfer]{grid-template-rows:38% 62%}
  .jr[data-step=stay] .jr-ask,.jr[data-step=transfer] .jr-ask{display:none}
  .jr[data-step=stay] .jr-body,.jr[data-step=transfer] .jr-body{padding-top:18px}
  .jr[data-step=stay] .jr-h,.jr[data-step=transfer] .jr-h{font-size:24px}
  .jr[data-step=stay] .jr-step{gap:10px}
  .jr[data-step=stay] .jr-sub{font-size:13.5px;margin:-6px 0 0}
  .fbar{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 -20px;padding:2px 20px}
  .fbar::-webkit-scrollbar{display:none}
  .fc,.fs{flex:none}
  .fs{margin-left:0}
  .jr-chat{padding-top:8px}
  .jr-chat-i{height:46px}
}

/* =====================================================================
   THE TRAVEL CARD — prepaid cards in the wallet, one per traveller, on the
   left where the map was. Sizes follow the card (container units).
   ===================================================================== */
.jr-prog{grid-template-columns:repeat(9,1fr)}
.jr-globe .jr-map,.jr-globe .jr-cap{transition:opacity .6s ease}
.jr[data-step=card] .jr-map,.jr[data-step=card] .jr-cap{opacity:0;pointer-events:none}
.jr-cards{position:absolute;inset:0;z-index:3;display:grid;place-items:center;align-content:safe center;padding:48px clamp(24px,4vw,56px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;opacity:0;visibility:hidden;transition:opacity .6s ease,visibility 0s .6s}
.jr[data-step=card] .jr-cards{opacity:1;visibility:visible;transition:opacity .6s ease .15s}
.tcs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 22px;width:min(100%,700px)}
.jr-cards[data-n="1"] .tcs{grid-template-columns:1fr;width:min(100%,420px)}
.tc{min-width:0;container-type:inline-size}
.tc.new{animation:tcIn .8s cubic-bezier(.34,1.4,.64,1) both;animation-delay:calc(var(--k) * 90ms)}
@keyframes tcIn{from{opacity:0;transform:translateY(34px) scale(.9) rotate(-4deg)}}
.tc-f{position:relative;display:grid;grid-template-rows:auto auto 1fr auto;aspect-ratio:1.586;padding:6.5cqw 7cqw;border-radius:5.5cqw;overflow:hidden;color:#fff;isolation:isolate;box-shadow:0 26px 50px -26px rgba(30,24,12,.6),0 2px 6px -2px rgba(30,24,12,.25)}
.tc-f::before{content:'';position:absolute;z-index:-1;right:-22%;bottom:-48%;width:78%;aspect-ratio:1;border-radius:50%;background:radial-gradient(currentColor .9px,transparent 1.3px) 0 0/7px 7px;opacity:.13;box-shadow:inset 0 0 0 1px currentColor}
.tc-f::after{content:'';position:absolute;z-index:-1;inset:0;background:radial-gradient(120% 90% at 0% 0%,rgba(255,255,255,.16),transparent 55%)}
.tc-f.ink{background:linear-gradient(135deg,#2a2830 0%,#3e3a47 55%,#2a2830 100%)}
.tc-f.sand{background:linear-gradient(135deg,#f1e7d4 0%,#dcc8a5 100%);color:#2c2a33}
.tc-f.brass{background:linear-gradient(135deg,#2AA2F0 0%,#8f6c37 100%)}
.tc-f.sage{background:linear-gradient(135deg,#e3e7dc 0%,#b8c3b1 100%);color:#2c2a33}
.tc-sheen{position:absolute;z-index:1;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.28) 48%,transparent 62%);transform:translateX(-110%);pointer-events:none}
.tc.new .tc-sheen{animation:sheen 1.6s cubic-bezier(.16,1,.3,1) .5s both}
@keyframes sheen{to{transform:translateX(110%)}}
.tc-top{display:flex;align-items:flex-start;justify-content:space-between}
.tc-brand{display:grid;font:700 5.2cqw/1 var(--sans);letter-spacing:-.01em}
.tc-brand small{margin-top:1cqw;font:600 2.7cqw var(--sans);letter-spacing:.16em;text-transform:uppercase;opacity:.7}
.tc-cur{padding:1cqw 2.6cqw;border-radius:99px;border:1px solid currentColor;font:700 3.2cqw var(--sans);letter-spacing:.08em;opacity:.85}
.tc-mid{display:flex;align-items:center;gap:3cqw;margin-top:5cqw}
.tc-chip{width:11cqw;aspect-ratio:1.33;border-radius:1.8cqw;background:linear-gradient(135deg,#C9E7FC,#1A95E6 60%,#BFE3FB);box-shadow:inset 0 0 0 .5px rgba(0,0,0,.25);position:relative}
.tc-chip::before{content:'';position:absolute;inset:28% 0;border-top:.5px solid rgba(60,40,10,.4);border-bottom:.5px solid rgba(60,40,10,.4)}
.tc-chip::after{content:'';position:absolute;inset:0 38%;border-left:.5px solid rgba(60,40,10,.4);border-right:.5px solid rgba(60,40,10,.4)}
.tc-nfc{width:6.5cqw!important;height:6.5cqw!important;opacity:.75}
.tc-bal{display:grid;align-content:end;gap:.6cqw}
.tc-bal b{font:700 9cqw/1 var(--sans);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.tc-bal span{font:500 3.4cqw var(--sans);opacity:.72}
.tc-bot{display:flex;align-items:flex-end;justify-content:space-between;gap:4cqw;margin-top:4cqw}
.tc-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:600 3.6cqw var(--sans);letter-spacing:.14em;text-transform:uppercase}
.tc-exp{display:grid;flex:none;text-align:right;font:600 3.2cqw var(--sans);letter-spacing:.04em}
.tc-exp small{font-size:2.4cqw;letter-spacing:.14em;text-transform:uppercase;opacity:.65}
.tc-amt{display:flex;align-items:center;gap:10px;height:48px;margin-top:14px;padding:0 16px;border:1px solid var(--line2);border-radius:16px;background:#fff;box-shadow:0 8px 20px -16px rgba(60,45,20,.5);transition:border-color .2s,box-shadow .2s;cursor:text}
.tc-amt:focus-within{border-color:var(--acc);box-shadow:0 0 0 3px var(--acc10)}
.tc-amt span{color:var(--acc);font:700 13px var(--sans);letter-spacing:.06em}
.tc-amt input{flex:1;min-width:0;height:100%;border:none;background:none;outline:none;color:var(--ink);font:700 18px var(--sans);font-variant-numeric:tabular-nums}
.jr-cards.preview .tcs{width:min(100%,400px)}
.jr-cards.preview .tc{animation:tcFloat 6s ease-in-out infinite}
@keyframes tcFloat{0%,100%{transform:rotate(-3deg) translateY(0)}50%{transform:rotate(-2deg) translateY(-8px)}}
.tc-hint{display:flex;align-items:center;justify-content:center;gap:8px;margin:26px auto 0;max-width:340px;color:var(--sub);font-size:13.5px;text-align:center;line-height:1.45}
.tc-hint .ic{flex:none;width:18px;height:18px;color:var(--acc)}
@media(prefers-reduced-motion:reduce){.tc.new,.jr-cards.preview .tc,.tc.new .tc-sheen{animation:none}}
@media(max-width:959px){
  .jr[data-step=card]{grid-template-rows:44% 56%}
  .jr[data-step=card] .jr-ask{display:none}
  .jr-cards{place-items:center start;padding:18px 0;overflow-x:auto;overflow-y:hidden}
  .tcs,.jr-cards[data-n="1"] .tcs,.jr-cards.preview .tcs{display:flex;gap:14px;width:auto;padding:0 20px;scroll-snap-type:x mandatory}
  .jr-cards[data-n="1"],.jr-cards.preview{place-items:center}
  .tc{flex:none;width:min(72vw,300px);scroll-snap-align:center}
  .tc-amt{height:42px;margin-top:10px}
  .tc-hint{display:none}
}
/* the panel */
.fx{display:grid;grid-template-columns:auto 1fr 1fr;align-items:center;gap:6px 16px;padding:16px 18px;border-radius:18px;background:#fff;box-shadow:0 0 0 1px rgba(235,229,224,.9)}
.fx-i{grid-row:span 2;display:grid;place-items:center;width:40px;height:40px;border-radius:13px;background:var(--acc10);color:var(--acc)}
.fx-i .ic{width:20px;height:20px}
.fx div{display:grid;gap:1px}
.fx small{color:var(--sub);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.fx b{font-size:16px;font-weight:700;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.fx p{grid-column:2/-1;margin:0;color:var(--ok);font-size:13px;font-weight:600}
@media(max-width:480px){.fx{grid-template-columns:auto 1fr}.fx p{grid-column:1/-1}.fx-i{grid-row:span 3}}
.pax{display:grid;gap:8px}
.px{display:flex;align-items:center;gap:12px;height:52px;padding:0 14px 0 8px;border:1px solid rgba(235,229,224,.9);border-radius:16px;background:#fff;transition:border-color .2s,background-color .2s}
.px.on{border-color:var(--acc30);background:#fffdf8}
.px-t{display:grid;place-items:center;flex:none;width:34px;height:34px;border:1.5px solid var(--line2);border-radius:11px;background:#fff;color:transparent;cursor:pointer;transition:background-color .2s,border-color .2s,color .2s}
.px.on .px-t{background:var(--acc);border-color:var(--acc);color:#fff}
.px-t .ic{width:16px;height:16px}
.px input{flex:1;min-width:0;height:100%;border:none;background:none;outline:none;color:var(--ink);font:500 15px var(--sans)}
.px-me{font-size:15px;font-weight:600}
.px-me i{margin-left:6px;padding:2px 8px;border-radius:99px;background:var(--soft);color:var(--sub);font-style:normal;font-size:11.5px;font-weight:600}
.fill{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.fill .chips-k{width:100%;margin-bottom:2px}
.fill-h{color:var(--sub);font-size:12.5px;margin-left:4px}
.csum{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;margin:0;padding:14px 16px;border-radius:16px;background:var(--soft);font-size:14px}
.csum b{font-size:17px;font-weight:700}
.csum span{color:var(--sub);font-size:13px;width:100%}
.perks{display:grid;gap:8px;margin:2px 0 0;padding:0;list-style:none;color:var(--sub);font-size:13.5px}
.perks li{display:flex;align-items:center;gap:10px}
.perks .ic{flex:none;width:18px;height:18px;color:var(--acc)}
.jr-sum b{white-space:nowrap}
@media(max-width:959px){
  .jr[data-step=card] .yns{grid-template-columns:1fr 1fr;gap:8px}
  .jr[data-step=card] .yn{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:16px}
  .jr[data-step=card] .yn-i{width:34px;height:34px;margin:0;border-radius:11px}
  .jr[data-step=card] .yn-i .ic{width:18px;height:18px}
  .jr[data-step=card] .yn b{font-size:15px}
  .jr[data-step=card] .yn small{display:none}
  .jr[data-step=card] .jr-h{font-size:24px}
  .jr[data-step=card] .jr-sub{font-size:13.5px}
}

/* =====================================================================
   ROUND 3 — answers as pills on top (no segmented bar), a chat box under
   every step, a range calendar, one stepper, a review you can tap.
   ===================================================================== */
.jr-top{flex:none;padding:14px clamp(20px,3.4vw,44px) 0;background:var(--bg);border-bottom:1px solid rgba(235,229,224,.8)}
.jr-line{height:3px;margin-bottom:10px;border-radius:3px;background:var(--line);overflow:hidden}
.jr-line i{display:block;height:100%;border-radius:3px;background:linear-gradient(90deg,#393946,var(--acc));transition:width .7s cubic-bezier(.16,1,.3,1)}
.crumbs{display:flex;gap:6px;margin:0 calc(-1 * clamp(20px,3.4vw,44px));padding:0 clamp(20px,3.4vw,44px) 12px;overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 28px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 28px),transparent 100%)}
.crumbs::-webkit-scrollbar{display:none}
.cr{flex:none;display:grid;align-content:center;gap:1px;min-height:44px;padding:5px 13px;border:1px solid transparent;border-radius:13px;background:none;color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:background-color .25s,border-color .25s,color .25s,transform .25s}
.cr-k{color:var(--sub);font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;transition:color .25s}
.cr em{max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-style:normal;font-size:13.5px;font-weight:600}
.cr em:empty{display:none}
.cr:not(.ok):not(.on) .cr-k{opacity:.6}
.cr.ok{background:#fff;border-color:rgba(235,229,224,1)}
.cr:hover{border-color:var(--line2)}
.cr.on{background:#393946;border-color:#393946}
.cr.on .cr-k{color:rgba(255,255,255,.62);opacity:1}
.cr.on em{color:#fff}
/* the chat box, under every step */
.jr-chat{border-top:1px solid rgba(235,229,224,.6);padding-top:10px}
.jr-said{display:flex;align-items:flex-start;gap:8px;margin:0;padding:9px 12px;border-radius:14px;background:var(--acc10);color:var(--ink);font-size:13.5px;line-height:1.45;animation:jrF .5s cubic-bezier(.16,1,.3,1) both}
.jr-said .ic{flex:none;width:16px;height:16px;margin-top:2px;color:var(--acc)}
/* the calendar */
.cal-head{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:8px}
.cal-sum{display:grid;gap:2px;padding:11px 16px;border:1px solid rgba(235,229,224,1);border-radius:16px;background:#fff;color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:box-shadow .2s,border-color .2s}
.cal-sum small{color:var(--sub);font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.cal-sum b{font-size:16px;font-weight:700;letter-spacing:-.01em;white-space:nowrap}
.cal-sum.on{border-color:transparent;box-shadow:0 0 0 2px var(--acc)}
.cal-sum:disabled{opacity:.5;cursor:default}
.cal-arr{color:var(--acc)}.cal-arr .ic{width:18px;height:18px}
.cal-n{grid-column:1/-1;color:var(--sub);font-size:13px}
.cal{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:26px;padding:16px 18px 14px;border-radius:22px;background:#fff;box-shadow:0 0 0 1px rgba(235,229,224,.9),0 14px 30px -26px rgba(60,45,20,.5)}
.cal-nav{position:absolute;top:14px;z-index:2;display:grid;place-items:center;width:34px;height:34px;border:none;border-radius:50%;background:var(--soft);color:var(--ink);cursor:pointer}
.cal-nav .ic{width:16px;height:16px}
.cal-nav:disabled{opacity:.35;cursor:default}
.cal-nav.prev{left:14px}.cal-nav.next{right:14px}
.cal-t{height:34px;line-height:34px;text-align:center;font-size:15px;font-weight:650}
.cal-w,.cal-g{display:grid;grid-template-columns:repeat(7,1fr)}
.cal-w{margin:6px 0 4px;color:var(--sub);font-size:11.5px;font-weight:600;text-align:center}
.cal-g{row-gap:2px}
.cal-g button{position:relative;height:40px;padding:0;border:none;background:none;color:var(--ink);font:500 14px var(--sans);font-variant-numeric:tabular-nums;cursor:pointer}
.cal-g button b{position:relative;z-index:1;display:grid;place-items:center;width:38px;height:38px;margin:auto;border-radius:50%;font-weight:inherit;transition:background-color .15s,color .15s}
.cal-g button:not(:disabled):hover b{background:var(--soft)}
.cal-g button:disabled{color:#cdc8bf;cursor:default}
.cal-g .t b{box-shadow:inset 0 0 0 1px var(--line2)}
.cal-g .in::before,.cal-g .hv::before{content:'';position:absolute;inset:3px 0;background:var(--acc10)}
.cal-g .s.rng::before{content:'';position:absolute;inset:3px 0 3px 50%;background:var(--acc10)}
.cal-g .e.rng::before{content:'';position:absolute;inset:3px 50% 3px 0;background:var(--acc10)}
.cal-g .s b,.cal-g .e b{background:#393946!important;color:#fff;font-weight:700}
@media(max-width:700px){.cal{grid-template-columns:1fr;padding:12px}.cal-m:last-child{display:none}.cal-g button{height:38px}.cal-g button b{width:36px;height:36px}.cal-sum b{font-size:14.5px}.cal-sum{padding:10px 12px}}
/* one stepper */
.stp.big{justify-content:center;gap:34px;margin-top:10px;padding:30px 20px}
.stp.big .stp-b{width:56px;height:56px}
.stp.big .stp-b .ic{width:22px;height:22px}
.stp.big b{min-width:96px;font-size:58px}
.stp.big b small{font-size:12.5px;margin-top:6px}
/* flights from more than one city */
.grp{display:flex;align-items:center;gap:12px;margin:10px 0 -2px}
.grp-i{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:#393946;color:#fff;font-size:11.5px;font-weight:700;letter-spacing:.04em}
.grp span{display:grid}
.grp b{font-size:15.5px;font-weight:650}
.grp small{color:var(--sub);font-size:12.5px}
.grp .grp-ok{display:grid;place-items:center;width:22px;height:22px;margin-left:auto;border-radius:50%;background:var(--ok);color:#fff}
.grp .grp-ok .ic{width:13px;height:13px}
/* review: the name on top, lines that show themselves on the map */
.tname{display:grid;gap:4px}
.tname small{color:var(--acc);font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.tname input{width:100%;padding:2px 0 6px;border:none;border-bottom:1.5px dashed var(--line2);background:none;color:var(--ink);font:700 clamp(26px,2.4vw,34px) var(--sans);letter-spacing:-.03em;outline:none;transition:border-color .2s}
.tname input:hover{border-bottom-color:var(--acc30)}
.tname input:focus{border-bottom:1.5px solid var(--acc)}
.tk-tip{display:flex;align-items:center;gap:6px;margin:0;padding:12px 22px 2px;color:var(--sub);font-size:12.5px}
.tk-tip .ic{width:15px;height:15px;color:var(--acc)}
.tk-r.go{cursor:pointer;transition:background-color .2s,box-shadow .2s}
.tk-r.go:hover{background:#fcfaf6}
.tk-r.go.on{background:#fbf6ec;box-shadow:inset 3px 0 0 var(--acc)}
.tk-r.go:focus-visible{outline:2px solid var(--acc);outline-offset:-2px}
@media(max-width:959px){.jr-top{padding:10px 16px 0}.crumbs{margin:0 -16px;padding:0 16px 10px}.cr{min-height:40px;padding:4px 11px}.cr em{font-size:12.5px;max-width:130px}.stp.big{padding:20px}.stp.big b{font-size:46px}}
.mpin.x i{order:0;width:10px;height:10px;background:#1A8BD6}
.mpin.x{margin-top:-5px}
.jr{grid-template-columns:minmax(0,1fr)}
@media(min-width:960px){.jr{grid-template-columns:minmax(0,1.05fr) minmax(440px,1fr)}}
.jr-panel,.jr-top{min-width:0}
/* the travel card, plain: the mark, the name, the dates it works */
.tc-f{grid-template-rows:1fr auto}
.tc-f::before{display:none}
.tc-logo{display:flex;align-items:center;gap:3cqw;align-self:start}
.tc-logo svg{width:6.5cqw;height:auto;display:block}
.tc-logo span{font:600 5.4cqw/1 var(--sans);letter-spacing:-.01em}
.tc-f.ink .tc-logo svg{color:#7CC7F7}
.tc-f.brass .tc-logo svg{color:#fff5e2}
.tc-f.sand .tc-logo svg,.tc-f.sage .tc-logo svg{color:#393946}
.tc-name{font-size:4.2cqw}
.tc-exp{font-size:3.4cqw}
.tc-amt em{flex:none;color:var(--sub);font-style:normal;font-size:12.5px;font-weight:500}
.tc-ro{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:12px 4px 0;font-size:13px;color:var(--sub)}
.tc-ro b{color:var(--ink);font-size:16px}
/* the 3D vehicles: on the map, and as icons in the cards */
.veh{pointer-events:none;will-change:transform}
.co-i.v3{background:radial-gradient(closest-side,#fffaf1,var(--soft));overflow:visible}
.v3i{display:block;width:150%;height:150%;margin:-25%;object-fit:contain;pointer-events:none;user-select:none}
.co-i.sm.v3 .v3i{width:160%;height:160%;margin:-30%}
.rt2-l .v3i{width:56px;height:56px;margin:-14px 0}
.road .v3i{flex:none;width:44px;height:44px;margin:-8px -4px}
.veh{filter:drop-shadow(0 0 .6px rgba(52,51,61,.75)) drop-shadow(0 3px 5px rgba(60,45,20,.22))}

/* =====================================================================
   MULTI-STOP — an itinerary list, one header per journey, stop tabs for
   hotels and transfers, nights per place, connection pins on the map.
   ===================================================================== */
.itn{display:grid;margin:2px 0 0;padding:18px 20px;border-radius:22px;background:#fff;box-shadow:0 0 0 1px rgba(235,229,224,.9),0 16px 34px -26px rgba(60,45,20,.45);list-style:none}
.itn li{position:relative;display:flex;align-items:center;gap:14px;min-height:38px}
.itn li>i{flex:none;width:14px;height:14px;margin:0 9px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 4px var(--acc10)}
.itn li.o>i{background:#393946;box-shadow:0 0 0 4px rgba(57,57,70,.08)}
.itn li.q{opacity:.5}
.itn li span{display:grid}
.itn li b{font-size:16.5px;font-weight:700;letter-spacing:-.01em}
.itn li small{color:var(--sub);font-size:12.5px}
.itn li.lg{min-height:34px;padding-left:4px}
.itn li.lg::before{content:'';position:absolute;left:15px;top:-6px;bottom:-6px;border-left:1.5px dashed var(--acc30)}
.itn li.lg .v3i,.itn li.lg>.ic{position:relative;flex:none;width:30px;height:30px;margin:0 -2px}
.itn li.lg small{margin-left:4px}
.leg{display:flex;align-items:center;gap:12px;margin:14px 0 -2px;padding-top:12px;border-top:1px solid rgba(235,229,224,.9)}
.jr-sub+.leg{margin-top:4px;padding-top:0;border-top:none}
.leg-i{display:grid;place-items:center;flex:none;width:44px;height:44px;border-radius:14px;background:radial-gradient(closest-side,#fffaf1,var(--soft))}
.leg-i .v3i{width:66px;height:66px;margin:-11px}
.leg span:not(.leg-i){display:grid}
.leg b{font-size:16px;font-weight:700;letter-spacing:-.01em}
.leg small{color:var(--sub);font-size:12.5px}
.leg .grp-ok{display:grid;place-items:center;width:22px;height:22px;margin-left:auto;border-radius:50%;background:var(--ok);color:#fff}
.leg .grp-ok .ic{width:13px;height:13px}
.stabs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:-2px 0 2px}
.stabs::-webkit-scrollbar{display:none}
.stab{flex:none;display:flex;align-items:center;gap:10px;padding:8px 14px 8px 8px;border:1px solid rgba(235,229,224,1);border-radius:16px;background:#fff;color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:background-color .2s,border-color .2s}
.stab i{display:grid;place-items:center;width:28px;height:28px;border-radius:10px;background:var(--soft);font-style:normal;font-size:12.5px;font-weight:700}
.stab i .ic{width:14px;height:14px}
.stab.ok i{background:var(--ok);color:#fff}
.stab span{display:grid;line-height:1.2}
.stab b{font-size:14px;font-weight:650}
.stab small{color:var(--sub);font-size:11.5px}
.stab.on{background:#393946;border-color:#393946;color:#fff}
.stab.on small{color:rgba(255,255,255,.65)}
.stab.on i{background:rgba(255,255,255,.14);color:#fff}
.stab.on.ok i{background:var(--ok)}
.spl{display:grid;gap:8px}
.spl-r{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px 10px 16px;border-radius:18px;background:var(--soft)}
.spl-r>span{display:grid}
.spl-r b{font-size:15px;font-weight:650}
.spl-r small{color:var(--sub);font-size:12px}
.spl .stp-c b{font-size:24px;min-width:50px}
.spl .stp-b{width:38px;height:38px}
.cal-g .mv b::after{content:'';position:absolute;left:50%;bottom:3px;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--acc)}
.cal-g .mv.in b::after,.cal-g .mv b::after{z-index:2}
/* connection pins: a small ring and the code under it */
.mpin.v{gap:2px}
.mpin.v i{order:0;width:9px;height:9px;background:#fff;box-shadow:0 0 0 2.5px #1F9CF0}
.mpin.v span{padding:2px 7px;font-size:10.5px;font-weight:700;background:rgba(255,255,255,.88)}

/* =====================================================================
   ROUND 5 — a calmer progress line, a floating chat pill, and options as
   soft borderless tiles (the chosen one turns ink). No outline borders.
   ===================================================================== */
/* the steps: names on a thin line; now is big, the neighbours medium, the rest small */
.jr-top{padding:14px 0 6px;border-bottom:none}
.jr-line{display:none}
.crumbs{gap:0;margin:0;padding:6px clamp(20px,3.4vw,44px) 10px;scroll-behavior:smooth;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 40px,#000 calc(100% - 40px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 40px,#000 calc(100% - 40px),transparent 100%)}
.cr{position:relative;display:grid;justify-items:center;align-content:start;gap:8px;min-width:78px;min-height:0;padding:0 8px;border:none!important;border-radius:0;background:none!important;color:var(--sub);text-align:center;transition:color .3s}
.cr::after{content:'';position:absolute;z-index:0;top:5px;left:50%;width:100%;height:1.5px;background:var(--line);transform:translateY(-50%)}
.cr:last-child::after{display:none}
.cr.past::after,.cr.ok.past::after{background:linear-gradient(90deg,#393946,#393946)}
.cr-d{position:relative;z-index:1;display:block;width:10px;height:10px;border-radius:50%;background:var(--bg);box-shadow:inset 0 0 0 1.5px var(--line2);transition:transform .35s cubic-bezier(.34,1.56,.64,1),background-color .3s,box-shadow .3s}
.cr.ok .cr-d{background:#393946;box-shadow:none}
.cr.on .cr-d{background:var(--acc);box-shadow:0 0 0 5px var(--acc10);transform:scale(1.25)}
.cr-k{display:block;white-space:nowrap;opacity:1!important;letter-spacing:0;text-transform:none;font-weight:500;font-size:12px;color:var(--sub);transition:font-size .35s cubic-bezier(.16,1,.3,1),color .3s}
.cr.far .cr-k{font-size:11.5px;color:#a7a196}
.cr.near .cr-k{font-size:13.5px;font-weight:600;color:var(--ink);opacity:.62!important}
.cr.on .cr-k{font-size:18px;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
.cr:hover .cr-k{color:var(--ink)}
.cr em{display:none}
@media(max-width:959px){.jr-top{padding:10px 0 4px}.crumbs{padding:4px 16px 8px}.cr{min-width:68px}.cr.on .cr-k{font-size:16px}}
/* the chat: a pill floating over the bottom of the step, the content fading out under it */
.jr-body{padding-bottom:96px}
.jr-bar{position:relative;border-top:1px solid rgba(235,229,224,.7)}
.jr-bar::before{content:'';position:absolute;left:0;right:0;bottom:100%;height:110px;background:linear-gradient(rgba(251,250,248,0),var(--bg) 78%);pointer-events:none}
.jr-chat{position:absolute;z-index:4;left:clamp(16px,3vw,36px);right:clamp(16px,3vw,36px);bottom:calc(100% + 14px);display:grid;justify-items:center;gap:8px;padding:0;border:none;background:none}
.jr-chat-i{width:100%;height:54px;padding:0 7px 0 22px;border:none!important;border-radius:999px;background:#fff;box-shadow:0 18px 40px -18px rgba(40,30,15,.42),0 2px 8px -2px rgba(40,30,15,.08),0 0 0 1px rgba(57,57,70,.05)}
.jr-chat-i:focus-within{box-shadow:0 18px 40px -18px rgba(40,30,15,.42),0 0 0 2px var(--acc30)}
.jr-chat .send{width:40px;height:40px;border-radius:50%}
.jr-said,.jr-chat-s{max-width:100%;padding:8px 14px;border-radius:999px;background:#fff;box-shadow:0 10px 26px -16px rgba(40,30,15,.4);font-size:13px}
.jr-said{background:#fffaf0}
.jr-chat-s{color:var(--sub)}
/* no outline borders: the browser's blue rings become a quiet brass one, only for the keyboard */
.jr button:focus,.jr input:focus,.jr select:focus{outline:none}
.jr button:focus-visible,.jr select:focus-visible{outline:2px solid var(--acc30);outline-offset:2px}
.jr *{-webkit-tap-highlight-color:transparent}
/* options: soft borderless tiles; the chosen one turns ink */
.op,.yn,.qc,.cal-sum,.px,.stab,.fc,.fs select{border:none!important}
.op{background:#f4f0e9;box-shadow:none;border-radius:22px}
.op:hover{transform:none;background:#eee8de;box-shadow:none}
.op:has(.tg){margin-top:0;padding-top:34px}
.tg{top:12px;left:18px}
.tg span{height:18px;padding:0 8px;line-height:18px;font-size:10px;background:rgba(57,57,70,.1);color:var(--ink)}
.tg span.acc{background:var(--acc10);color:var(--acc)}
.op .tick{top:12px;right:12px;width:20px;height:20px;background:var(--acc)}
.op.on{background:#2f2e37;color:#fff;box-shadow:0 22px 40px -26px rgba(30,25,15,.75)}
.op.on .ho-b small,.op.on .fo-a small,.op.on .bl,.op.on .rt,.op.on .fo-p small,.op.on .fo-l em{color:rgba(255,255,255,.62)!important}
.op.on .okt{color:#a8dcb9!important}.op.on .wt{color:#e6c28a!important}
.op.on s.was{color:rgba(255,255,255,.38)}
.op.on .mono2{background:rgba(255,255,255,.1);color:#fff}
.op.on .rt i{background:#fff;color:#2f2e37}
.op.on .fo-l i{background:rgba(255,255,255,.22)}
.op.on .fo-l i::before,.op.on .fo-l i::after{background:#2f2e37;border-color:rgba(255,255,255,.4)}
.op.on .tg span{background:rgba(255,255,255,.12);color:#fff}
.op.on .tg span.acc{background:rgba(124,199,247,.22);color:#BFE3FB}
.op.on .co-i.v3{background:radial-gradient(closest-side,rgba(255,255,255,.22),rgba(255,255,255,.04))}
.op .co-i{background:rgba(255,255,255,.7)}
.ho2.hl{background:#eee8de;box-shadow:none}
.yn{background:#f4f0e9;box-shadow:none}
.yn:hover{transform:none;background:#eee8de;box-shadow:none}
.yn.on{background:#2f2e37;color:#fff;box-shadow:0 22px 40px -26px rgba(30,25,15,.75)}
.yn.on small{color:rgba(255,255,255,.62)}
.yn.on .yn-i{background:rgba(255,255,255,.1);color:#BFE3FB}
.yn .tick{top:14px;right:14px;width:20px;height:20px}
.cal-sum{background:#f4f0e9}
.cal-sum.on{background:#2f2e37;color:#fff;box-shadow:none}
.cal-sum.on small{color:rgba(255,255,255,.6)}
.cal{background:#faf7f2;box-shadow:none}
.cal-nav{background:#efe9df}
.fc{background:#f1ece4}
.fc:hover{background:#e9e2d6}
.fc.on{background:#2f2e37;color:#fff}
.fs select{background-color:#f1ece4}
.stab{background:#f4f0e9}
.px{background:#f4f0e9}
.px.on{background:#fbf5ea}
.px-t{border:none;background:#fff}
.rt2,.itn,.fx{background:#f6f2eb;box-shadow:none}
.tk{box-shadow:0 24px 48px -30px rgba(40,30,15,.55)}
.tk-r.go.on{background:#f6efe2;box-shadow:inset 3px 0 0 var(--acc)}
.skip2{border:none;background:none;padding:8px 4px;color:var(--sub);text-decoration:underline;text-decoration-color:var(--line2);text-underline-offset:4px}
.skip2:hover,.skip2.on{color:var(--ink);text-decoration-color:var(--acc)}
.stp,.road,.spl-r,.csum{background:#f4f0e9}
.stp-b{box-shadow:none}

/* answered parts fold into one dark line; what's next fades in */
.sec,.reveal{display:grid;gap:10px}
.jr-body{position:relative}
.enter{animation:secIn .6s cubic-bezier(.16,1,.3,1) both}
@keyframes secIn{from{opacity:0;transform:translateY(12px)}}
@media(prefers-reduced-motion:reduce){.enter{animation:none}}
.pick{display:flex;align-items:center;gap:14px;width:100%;min-height:64px;padding:12px 12px 12px 14px;border:none;border-radius:20px;background:#2f2e37;color:#fff;font:inherit;text-align:left;cursor:pointer;box-shadow:0 18px 34px -24px rgba(30,25,15,.7);transition:transform .3s cubic-bezier(.16,1,.3,1),background-color .25s}
.pick:hover{background:#393846;transform:translateY(-1px)}
.pick .pk-i{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:13px;background:rgba(255,255,255,.1);color:#BFE3FB}
.pick .pk-i .ic{width:19px;height:19px}
.pick .pk-i .mono2{background:none;color:#fff;width:auto;height:auto}
.pick .pk-v .v3i{width:58px;height:58px;margin:-9px}
.pick .pk-b{display:grid;gap:2px;min-width:0}
.pick .pk-b b{font-size:15.5px;font-weight:650;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pick .pk-b b i{font-style:normal;color:#BFE3FB;margin:0 2px}
.pick .pk-b b sup{font-size:10px;color:#BFE3FB}
.pick .pk-b small{color:rgba(255,255,255,.6);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pick .pk-c{flex:none;margin-left:auto;padding:7px 13px;border-radius:999px;background:rgba(255,255,255,.12);font-size:12.5px;font-weight:600;color:#fff}
.leg+.pick,.grp+.pick{margin-top:2px}

/* the first plan loading: only the globe, turning, with the mark pulsing over it; the panel slides in when it's ready */
.jr{transition:grid-template-columns 1s cubic-bezier(.16,1,.3,1),grid-template-rows 1s cubic-bezier(.16,1,.3,1)}
.jr-panel{transition:opacity .6s ease .25s,transform .9s cubic-bezier(.16,1,.3,1)}
@media(min-width:960px){.jr[data-step=loading]{grid-template-columns:minmax(0,1fr) 0}}
@media(max-width:959px){.jr[data-step=loading]{grid-template-rows:100% 0}}
.jr[data-step=loading] .jr-panel{opacity:0;transform:translateX(40px);pointer-events:none;overflow:hidden;border:none;transition:opacity .25s ease,transform .5s ease}
@media(max-width:959px){.jr[data-step=loading] .jr-panel{transform:translateY(40px)}}
.jr[data-step=loading] .jr-cap{opacity:0}
.jr-load{position:absolute;inset:0;z-index:3;display:grid;place-items:center;pointer-events:none;opacity:0;transition:opacity .6s ease}
.jr[data-step=loading] .jr-load{opacity:1}
.jr-logo{display:grid;place-items:center;width:112px;height:112px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,252,246,.95),rgba(255,252,246,.6) 62%,rgba(255,252,246,0));color:#393946;animation:markPulse 2.2s ease-in-out infinite}
.jr-logo svg{width:40px;height:auto;display:block;filter:drop-shadow(0 6px 10px rgba(60,45,20,.18))}
@keyframes markPulse{0%,100%{transform:scale(.94);opacity:.72}50%{transform:scale(1.06);opacity:1}}
@media(prefers-reduced-motion:reduce){.jr-logo{animation:none}}

/* =====================================================================
   ROUND 6 — no slate blue in the plan. Picked things are highlighted in
   warm cream with a brass ring; the progress, the send button and the
   primary buttons are brass; text is a warm near-black. The travel cards
   keep their own design.
   ===================================================================== */
.jr{--ink:#2e2925;--hl:#fff8ea;--hl2:#fdf1da;--brass:#1F9CF0;--brass-d:#0A78C2}
.jr .jr-cap b{color:var(--ink)}
/* the primary buttons and the send button */
.jr .btn:not(.ghost){background:var(--brass);border-color:var(--brass);color:#fff}
.jr .btn:not(.ghost):hover{background:var(--brass-d);border-color:var(--brass-d);opacity:1}
.jr .btn.dim{background:#d9cbb3;border-color:#d9cbb3;opacity:1}
.jr-chat .send{background:var(--brass)}
.jr-chat .send:hover{background:var(--brass-d)}
/* the progress line */
.cr.ok .cr-d{background:var(--brass);box-shadow:none}
.cr.on .cr-d{background:var(--brass);box-shadow:0 0 0 5px rgba(31,156,240,.16)}
.cr.past::after,.cr.ok.past::after{background:var(--brass)}
.cr.on .cr-k,.cr.near .cr-k{color:var(--ink)}
/* picked: warm cream, a brass ring, everything inside stays readable */
.op.on,.yn.on{background:var(--hl);color:var(--ink);box-shadow:0 0 0 2px var(--brass),0 18px 36px -26px rgba(10,100,170,.55)}
.op.on .ho-b small,.op.on .fo-a small,.op.on .bl,.op.on .rt,.op.on .fo-p small,.op.on .fo-l em,.yn.on small{color:var(--sub)!important}
.op.on .bl{color:var(--ink)!important;opacity:.78}
.op.on .okt{color:var(--ok)!important}.op.on .wt{color:var(--warn)!important}
.op.on s.was{color:var(--sub)}
.op.on .mono2{background:#fff;color:var(--ink)}
.op.on .rt i{background:var(--brass);color:#fff}
.op.on .fo-l i{background:linear-gradient(90deg,var(--line2),var(--acc30),var(--line2))}
.op.on .fo-l i::before,.op.on .fo-l i::after{background:var(--hl);border-color:var(--brass)}
.op.on .tg span{background:rgba(31,156,240,.14);color:var(--brass-d)}
.op.on .tg span.acc{background:var(--brass);color:#fff}
.op.on .co-i.v3{background:radial-gradient(closest-side,#fff,var(--hl2))}
.yn.on .yn-i{background:#fff;color:var(--brass)}
.cal-sum.on{background:var(--hl);color:var(--ink);box-shadow:0 0 0 2px var(--brass)}
.cal-sum.on small{color:var(--sub)}
.cal-g .s b,.cal-g .e b{background:var(--brass)!important;color:#fff}
.cal-g .in::before,.cal-g .hv::before,.cal-g .s.rng::before,.cal-g .e.rng::before{background:rgba(31,156,240,.14)}
.fc.on{background:var(--hl);color:var(--brass-d);box-shadow:inset 0 0 0 1.5px var(--brass)}
.stab.on{background:var(--hl);color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--brass)}
.stab.on small{color:var(--sub)}
.stab.on i{background:var(--brass);color:#fff}
.stab.ok i,.stab.on.ok i{background:var(--ok);color:#fff}
.rt i{background:var(--brass)}
.grp-i{background:var(--hl2);color:var(--brass-d)}
.itn li.o>i{background:var(--brass-d);box-shadow:0 0 0 4px rgba(31,156,240,.12)}
.hpin.on b{background:var(--brass);color:#fff}
.mpin.ap i{background:var(--brass-d)}
.tg span{background:rgba(31,156,240,.12);color:var(--brass-d)}
/* the folded lines: the same warm highlight */
.pick{background:var(--hl);color:var(--ink);box-shadow:0 0 0 1.5px rgba(31,156,240,.45),0 14px 30px -24px rgba(10,100,170,.5)}
.pick:hover{background:var(--hl2)}
.pick .pk-i{background:#fff;color:var(--brass)}
.pick .pk-i .mono2{color:var(--ink)}
.pick .pk-b b i,.pick .pk-b b sup{color:var(--brass)}
.pick .pk-b small{color:var(--sub)}
.pick .pk-c{background:var(--brass);color:#fff}
/* the review ticket: brass, not slate */
.tk-h{background:linear-gradient(135deg,#3DAAF2,#0A78C2)}
.tk-line{color:#fff5e2}
.tk-line i{border-top-color:rgba(255,245,226,.55)}
.tk-r.go.on{background:var(--hl);box-shadow:inset 3px 0 0 var(--brass)}
/* loading: the mark in gold, just above the globe */
.jr-load{place-items:start center}
.jr-logo{position:absolute;left:50%;top:var(--gtop,22%);translate:-50% calc(-100% - 22px);width:auto;height:auto;background:none;border-radius:0;animation:markPulse 2.2s ease-in-out infinite}
.jr-logo svg{width:52px;filter:drop-shadow(0 8px 14px rgba(10,120,194,.28))}
.jr-logo svg g{fill:url(#g33gold)}
@media(max-width:959px){.jr-logo svg{width:44px}}
/* how many: a number you can type, the word on its own line under it */
.ppl{display:grid;justify-items:center;gap:6px;cursor:text}
.ppl input{width:120px;padding:0 0 4px;border:none;border-bottom:2px dashed var(--line2);background:none;color:var(--ink);font:700 58px/1 var(--sans);letter-spacing:-.03em;font-variant-numeric:tabular-nums;text-align:center;caret-color:var(--brass,#1F9CF0);outline:none;transition:border-color .2s}
.ppl input::placeholder{color:#d2c8b8}
.ppl input:hover{border-bottom-color:var(--acc30)}
.ppl input:focus{border-bottom:2px solid var(--brass,#1F9CF0)}
.ppl span{color:var(--sub);font:600 13px/1.2 var(--sans);letter-spacing:.01em}
@media(max-width:959px){.ppl input{font-size:46px;width:100px}}
/* the highlight, refined: a picked thing is a clean white tile lifting off the beige, a thin brass edge, a soft shadow */
.jr{--hl:#ffffff;--hl2:#fbf7f0}
.op.on,.yn.on{background:#fff;box-shadow:0 0 0 1.5px rgba(31,156,240,.85),0 16px 32px -20px rgba(10,90,160,.45)}
.op.on .fo-l i::before,.op.on .fo-l i::after{background:#fff}
.op.on .mono2{background:#f4f0e9}
.op.on .co-i.v3{background:radial-gradient(closest-side,#fffdf8,#f4efe6)}
.yn.on .yn-i{background:rgba(31,156,240,.1)}
.cal-sum.on,.stab.on{background:#fff;box-shadow:0 0 0 1.5px rgba(31,156,240,.85),0 10px 22px -16px rgba(10,90,160,.4)}
.fc.on{background:#fff;color:var(--ink);box-shadow:0 0 0 1.5px rgba(31,156,240,.85)}
.pick{background:#fff;box-shadow:0 0 0 1px rgba(31,156,240,.5),0 14px 28px -20px rgba(10,90,160,.45)}
.pick:hover{background:#fdfaf4}
.pick .pk-i{background:#f4f0e9}
.tk-r.go.on{background:#F1F8FE}
.op .tick,.yn .tick{background:var(--brass,#1F9CF0)}
/* yes / no, text only: a small brass label, the answer large, the route written out */
.yn.yt{gap:6px;padding:24px 24px 22px;min-height:150px;align-content:end}
.yt-k{color:var(--brass,#1F9CF0);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.yn.yt b{font-size:clamp(20px,1.7vw,23px);font-weight:700;letter-spacing:-.025em;line-height:1.15}
.yn.yt small{margin-top:4px;color:var(--sub);font-size:13.5px;line-height:1.45}
.yn.yt small i{font-style:normal;color:var(--brass,#1F9CF0);margin:0 2px}
.yn.yt .tick{top:18px;right:18px}
@media(max-width:959px){.yn.yt{min-height:0;padding:18px 18px 16px;display:grid;justify-items:start}.jr[data-step=card] .yn.yt small{display:block}}
@media(max-width:420px){.yns{grid-template-columns:1fr}}
.yn.yt{grid-template-columns:1fr!important;justify-items:start;align-items:start;text-align:left}
/* Travel, one journey at a time */
.legs-done{display:grid;gap:8px}
.legs-done .pick{min-height:58px}
.legs-done .pick .pk-b b{font-size:14.5px}
.leg.now{margin:2px 0 2px;padding-top:0;border-top:none}
.legs-next{display:grid;gap:2px;margin:6px 0 0;padding:10px 4px 0;border-top:1px solid rgba(235,229,224,.8);list-style:none}
.legs-next li{display:flex;align-items:center;gap:10px;color:var(--sub);font-size:13.5px}
.legs-next li .v3i,.legs-next li>.ic{flex:none;width:34px;height:34px;margin:-4px -2px;opacity:.55}
.legs-next li small{margin-left:auto;font-size:12.5px}
/* selected: filled with a soft brass; the unselected tiles stay beige */
.jr{--sel:linear-gradient(160deg,#E3F3FE 0%,#C3E4FB 100%);--sel-sub:#0B4F80}
.op.on,.yn.on,.cal-sum.on,.stab.on,.fc.on,.pick{background:var(--sel);box-shadow:0 0 0 1.5px rgba(10,120,194,.75),0 16px 30px -22px rgba(10,90,160,.5)}
.pick:hover{background:linear-gradient(160deg,#D6EDFD 0%,#B5DDFA 100%)}
.op.on .ho-b small,.op.on .fo-a small,.op.on .rt,.op.on .fo-p small,.op.on .fo-l em,.yn.on small,.cal-sum.on small,.stab.on small,.pick .pk-b small{color:var(--sel-sub)!important}
.op.on .okt{color:#2b6b43!important}.op.on .wt{color:#8a5a10!important}
.op.on s.was{color:rgba(11,79,128,.7)}
.op.on .mono2,.pick .pk-i,.op.on .co-i,.yn.on .yn-i{background:rgba(255,255,255,.55)}
.op.on .co-i.v3{background:radial-gradient(closest-side,rgba(255,255,255,.75),rgba(255,255,255,.2))}
.op.on .fo-l i{background:linear-gradient(90deg,rgba(10,120,194,.35),rgba(10,120,194,.6),rgba(10,120,194,.35))}
.op.on .fo-l i::before,.op.on .fo-l i::after{background:#D2EBFC;border-color:#0A78C2}
.op.on .tg span{background:rgba(255,255,255,.55);color:#0B4F80}
.op.on .tg span.acc{background:#0A78C2;color:#fff}
.op.on .tick,.yn.on .tick{background:#0A78C2}
.yt-k{transition:color .2s}.yn.on .yt-k{color:#0D5E96}
.yn.on small i,.pick .pk-b b i,.pick .pk-b b sup{color:#0A78C2}
.fc.on{color:var(--ink)}
.stab.on i{background:#0A78C2}
.pick .pk-c{background:#0A78C2}
/* fixes */
.jr{--soft:#f4f0e9}                                   /* the old pink-beige soft tone gave pinkish squares */
.tk-h{background:linear-gradient(135deg,#2c2a33,#393946)}   /* the ticket header goes back to its own dark */
.tk-line{color:#7CC7F7}.tk-line i{border-top-color:rgba(124,199,247,.6)}
/* scrolling rows clipped the ring of what's picked: give them room */
.stabs{padding:4px 3px 6px;margin:-4px -3px -2px}
.fbar{padding-top:3px;padding-bottom:3px}
.crumbs{padding-top:8px}
/* 3D vehicles sit free, no square behind them */
.pick .pk-v{width:44px;height:44px;background:none!important}
.pick .pk-v .v3i{width:54px;height:54px;margin:-5px}
.op .co-i.v3,.op.on .co-i.v3{background:none!important}
.co-i.v3 .v3i{width:140%;height:140%;margin:-20%}
.leg-i{background:none}
.stab i{background:#ebe5da}
.op .co-i:not(.v3){background:rgba(255,255,255,.7)}
@media(max-width:959px){
  .jr[data-step=card] .yn.yt{display:grid;align-items:start;gap:4px;padding:16px}
  .jr[data-step=card] .yn.yt small{display:block}
  .tname input{font-size:24px}
}
.tname input{text-overflow:ellipsis}
/* the icons are cropped square around the vehicle: fill the box evenly */
.co-i.v3 .v3i,.co-i.sm.v3 .v3i,.pick .pk-v .v3i,.leg-i .v3i,.road .v3i,.rt2-l .v3i,.itn li.lg .v3i,.legs-next li .v3i{width:100%;height:100%;margin:0;object-fit:contain}
.co-i.v3{padding:3px}
.pick .pk-v{display:grid;place-items:center;padding:4px}
.leg-i{padding:3px}
.road .v3i{width:40px;height:40px}
.rt2-l .v3i{width:44px;height:44px;margin:-8px 0}
.itn li.lg .v3i{width:26px;height:26px;margin:0}
.legs-next li .v3i{width:28px;height:28px}
/* the travel card's currencies */
.curs{display:grid;gap:8px}
.cur-row{display:flex;flex-wrap:wrap;gap:8px}
.cur{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 6px 0 14px;border-radius:14px;background:var(--sel,#D2EBFC);box-shadow:0 0 0 1.5px rgba(10,120,194,.6)}
.cur b{font-size:14.5px;font-weight:700;letter-spacing:.02em}
.cur small{color:var(--sel-sub,#0B4F80);font-size:12px}
.cur button{display:grid;place-items:center;width:28px;height:28px;border:none;border-radius:50%;background:rgba(255,255,255,.55);color:var(--ink);cursor:pointer}
.cur button .ic{width:13px;height:13px}
.cur:not(:has(button)){padding-right:14px}
.cur-add{position:relative;display:inline-flex;align-items:center;height:42px;padding:0 14px;border-radius:14px;background:#f4f0e9;color:var(--ink);font-size:14px;font-weight:600;cursor:pointer}
.cur-add span{display:inline-flex;align-items:center;gap:6px;pointer-events:none}
.cur-add .ic{width:15px;height:15px;color:var(--brass,#1F9CF0)}
.cur-add select{position:absolute;inset:0;opacity:0;cursor:pointer}
.fill .fc small{color:var(--sub);font-weight:500}
.tc-top2{display:flex;align-items:flex-start;justify-content:space-between;gap:3cqw}
.tc-curs{padding:1cqw 2.6cqw;border-radius:99px;border:1px solid rgba(255,255,255,.35);font:700 2.9cqw var(--sans);letter-spacing:.08em;color:rgba(255,255,255,.85);white-space:nowrap}
.tc-amts{display:grid;gap:8px;margin-top:14px}
.tc-amts .tc-amt{margin-top:0}
.tc-amts .tc-ro{margin:0 4px}
/* no Back / Continue in the bar: the way on sits at the end of the step */
.jr-foot{justify-content:space-between;min-height:48px}
.nx-w{display:flex;justify-content:flex-end;margin-top:6px;transition:opacity .35s ease,transform .45s cubic-bezier(.16,1,.3,1)}
.nx-w.off{opacity:0;transform:translateY(8px);pointer-events:none;height:0;margin:0;overflow:hidden}
.nx{display:inline-flex;align-items:center;gap:8px;height:46px;padding:0 10px 0 20px;border:none;border-radius:999px;background:var(--brass,#1F9CF0);color:#fff;font:600 15px var(--sans);cursor:pointer;box-shadow:0 12px 26px -16px rgba(10,90,160,.7);transition:background-color .2s,transform .25s cubic-bezier(.16,1,.3,1)}
.nx:hover{background:var(--brass-d,#0A78C2);transform:translateY(-1px)}
.nx span{padding:4px 10px;border-radius:999px;background:rgba(255,255,255,.18);font-size:13px;font-weight:600}
.nx span:empty{display:none}
.nx .ic{width:17px;height:17px;margin-right:4px}
.sec.nudge,.yns.nudge,.stp.nudge,.cal.nudge,.jr-h.nudge{animation:nudge .45s cubic-bezier(.36,.07,.19,.97)}
/* the map's zoom buttons, in the house look */
.jr-map .maplibregl-ctrl-top-right{top:14px;right:14px}
.jr-map .maplibregl-ctrl-group{border:none;border-radius:16px;overflow:hidden;background:rgba(255,255,255,.92);box-shadow:0 10px 24px -14px rgba(60,45,20,.45),0 0 0 1px rgba(57,57,70,.06);backdrop-filter:blur(8px)}
.jr-map .maplibregl-ctrl-group button{width:40px;height:40px}
.jr-map .maplibregl-ctrl-group button+button{border-top:1px solid rgba(235,229,224,.9)}
.jr-map .maplibregl-ctrl-group button:focus{box-shadow:none}
.jr-map .maplibregl-ctrl-group button:focus-visible{box-shadow:inset 0 0 0 2px rgba(31,156,240,.5)}
.jr[data-step=loading] .maplibregl-ctrl-top-left,.jr[data-step=card] .maplibregl-ctrl-top-left{opacity:0;pointer-events:none}
@media(max-width:959px){.jr-map .maplibregl-ctrl-top-right{top:10px;right:10px}.jr-map .maplibregl-ctrl-group button{width:36px;height:36px}}
/* review: the trip as a timeline, by day, a line running through the icons */
.tl-list{position:relative;padding:2px 0 6px}
.tl-list::before{content:'';position:absolute;left:40px;top:var(--tl-a,0);height:var(--tl-h,0);width:0;border-left:2px solid rgba(31,156,240,.4)}   /* from the first line's icon to the last (plTlLine) */
.tl-list .tk-r{position:relative;border-bottom:none;padding-top:10px;padding-bottom:10px}
.tl-list .tk-r .co-i{position:relative;z-index:1;background:#fff;box-shadow:0 0 0 4px #fff}
.tl-list .tk-r.on .co-i{box-shadow:0 0 0 4px #F1F8FE}
.tl-day{position:relative;z-index:1;padding:14px 22px 4px}
.tl-day span{display:inline-block;padding:4px 10px;border-radius:999px;background:#f4f0e9;color:var(--brass-d,#0A78C2);font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.tl-add{position:relative;z-index:1;padding:4px 22px 8px}
.tl-plus{display:flex;align-items:center;gap:14px;width:100%;padding:8px 12px 8px 0;border:none;background:none;color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.tl-pi{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:12px;background:#fff;border:1.5px dashed rgba(31,156,240,.6);color:var(--brass,#1F9CF0);transition:background-color .2s}
.tl-pi .ic{width:16px;height:16px}
.tl-plus span:last-child{display:grid}
.tl-plus b{font-size:14.5px;font-weight:600;color:var(--brass-d,#0A78C2)}
.tl-plus small{color:var(--sub);font-size:12.5px}
.tl-plus:hover .tl-pi,.tl-add.open .tl-pi{background:#EEF6FE}
.tl-opts{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 4px 50px}
.tl-o{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 14px 0 6px;border:none;border-radius:14px;background:#f4f0e9;color:var(--ink);font:inherit;cursor:pointer;transition:background-color .2s,box-shadow .2s}
.tl-o:hover{background:var(--sel,#D2EBFC);box-shadow:0 0 0 1.5px rgba(10,120,194,.6)}
.tl-ov{display:grid;place-items:center;width:34px;height:34px}
.tl-ov .v3i{width:100%;height:100%;object-fit:contain}
.tl-o b{font-size:13.5px;font-weight:600}
.tl-o small{color:var(--sub);font-size:12.5px}
@media(max-width:560px){.tl-list::before{left:34px}.tl-day{padding:12px 16px 2px}.tl-add{padding:4px 16px 8px}.tl-opts{margin-left:0}}
.jr-bar{z-index:6}   /* its blur makes it a layer of its own: keep it (and the chat pill) above the step */

/* =====================================================================
   SPLIT — who's paying, the shares, the invites, the shared trip
   ===================================================================== */
.pay-u{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.pay-u .lnk{margin-left:auto;font-size:13.5px}
.pay-p{display:grid;gap:8px}
.pp{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px 14px;padding:12px 14px;border-radius:18px;background:#f4f0e9}
.pp-who{display:grid;gap:6px;min-width:0}
.pp-who b{font-size:15px;font-weight:600}
.pp-who b i,.ppl b i{font-style:normal;color:var(--sub);font-weight:500;font-size:12.5px;margin-left:4px}
.pp-who small{color:var(--sub);font-size:12.5px}
.pp-who input{width:100%;height:38px;padding:0 12px;border:none;border-radius:11px;background:#fff;color:var(--ink);font:500 14px var(--sans);outline:none;box-shadow:inset 0 0 0 1px rgba(57,57,70,.06)}
.pp-who input:focus{box-shadow:inset 0 0 0 1.5px var(--brass,#1F9CF0)}
.pp-v{display:grid;grid-template-columns:auto auto;align-items:center;gap:2px 6px;justify-items:end}
.pp-v input{width:86px;height:44px;padding:0 10px;border:none;border-radius:12px;background:#fff;color:var(--ink);font:700 18px var(--sans);text-align:right;outline:none;font-variant-numeric:tabular-nums}
.pp-v input:focus{box-shadow:inset 0 0 0 1.5px var(--brass,#1F9CF0)}
.pp-v span{color:var(--brass-d,#0A78C2);font-size:13px;font-weight:700}
.pp-v em{grid-column:1/-1;font-style:normal;color:var(--sub);font-size:12px}
.pay-sum{margin:0;padding:10px 14px;border-radius:14px;background:#faf7f2;font-size:14px}
.pay-go{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-top:4px}
.pay-go small{color:var(--sub);font-size:12.5px;max-width:300px}
.pay-go .nx{text-decoration:none}
.lnk.red{color:var(--bad)}
.pp.live{grid-template-columns:minmax(0,1fr) auto}
.pp-send{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px}
.pp-send .fc{display:inline-flex;align-items:center;text-decoration:none;color:var(--ink);background:#fff}
.tag{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:999px;background:#fff;color:var(--ink);font-size:12px;font-weight:600;white-space:nowrap}
.tag.ok{background:var(--okbg);color:var(--ok)}
.tag.dim{color:var(--sub)}
.hold{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border-radius:18px;background:var(--sel,#D2EBFC);box-shadow:0 0 0 1.5px rgba(10,120,194,.45)}
.hold>.ic{flex:none;width:22px;height:22px;margin-top:1px;color:var(--brass-d,#0A78C2)}
.hold span{display:grid;gap:3px}
.hold b{font-size:15px;font-variant-numeric:tabular-nums}
.hold small{color:var(--sel-sub,#0B4F80);font-size:12.5px;line-height:1.45}
.mut2{font-style:normal!important;color:var(--sub)!important;font-weight:500!important}
.shr-in{display:grid;gap:10px;padding:16px;border-radius:20px;background:#faf7f2}
/* the invite page and the shared trip */
.join{display:grid;justify-items:center;gap:10px;max-width:460px;margin:12vh auto 0;text-align:center}
.join-mark svg{width:46px;height:auto}.join-mark svg g{fill:#3DAAF2}
.shr{display:grid;gap:18px}
.shr-h{display:grid;gap:4px}
.shr-h small{color:var(--brass,#1F9CF0);font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.shr-g{display:grid;gap:18px;align-items:start}
@media(min-width:900px){.shr-g{grid-template-columns:minmax(0,1fr) 320px}}
.shr-t{padding-bottom:4px}
.shr-s{display:grid;gap:12px}
.shr-s .box{display:grid;gap:8px;padding:18px;border-radius:22px;background:#fff;box-shadow:0 0 0 1px rgba(235,229,224,.9)}
.shr-s .box.mine{background:var(--sel,#D2EBFC);box-shadow:0 0 0 1.5px rgba(10,120,194,.5)}
.shr-s .box.mine .btn{background:var(--brass,#1F9CF0);border-color:var(--brass,#1F9CF0);color:#fff}
.ppl{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:10px;padding:6px 0;border-top:1px solid rgba(235,229,224,.8);font-size:14px}
.ppl:first-of-type{border-top:none}
.ppl span:not(.tag){color:var(--sub);font-variant-numeric:tabular-nums}
.tk-r.tl.new{background:#EEF7FE}
.tagn{margin-left:6px;padding:2px 7px;border-radius:999px;background:var(--brass,#1F9CF0);color:#fff;font-style:normal;font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;vertical-align:2px}
.gone,.miss{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:12px 22px;border-top:1px solid rgba(235,229,224,.8)}
.gone s{color:var(--sub);font-size:13.5px}
.miss .chip{background:#f4f0e9}
/* the route by hand */
.we-go{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px}
.we-go .fc{display:inline-flex;align-items:center;gap:6px}
.we-go .fc .ic{width:14px;height:14px;color:var(--brass,#1F9CF0)}
.we-go small{color:var(--sub);font-size:12.5px}
.we{display:grid;gap:8px}
.we-r{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:10px 12px;border-radius:18px;background:#f4f0e9}
.we-r.o{grid-template-columns:auto minmax(0,1fr)}
.we-d{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--brass,#1F9CF0);color:#fff;font-size:12.5px;font-weight:700}
.we-r.o .we-d{background:var(--brass-d,#0A78C2)}
.we-r label{display:grid;gap:2px;min-width:0}
.we-r small{color:var(--sub);font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.we-r input{width:100%;height:38px;padding:0 12px;border:none;border-radius:11px;background:#fff;color:var(--ink);font:600 15px var(--sans);outline:none;box-shadow:inset 0 0 0 1px rgba(57,57,70,.06)}
.we-r input:focus{box-shadow:inset 0 0 0 1.5px var(--brass,#1F9CF0)}
.we-n input{width:60px;text-align:center;font-variant-numeric:tabular-nums}
.we-x{display:flex;gap:4px}
.we-x button{display:grid;place-items:center;width:32px;height:32px;border:none;border-radius:10px;background:#fff;color:var(--ink);cursor:pointer}
.we-x button:disabled{opacity:.3;cursor:default}
.we-x button:nth-child(2) .ic{transform:rotate(180deg)}
.we-x .ic{width:14px;height:14px}
.we-add{display:inline-flex;align-items:center;gap:8px;justify-self:start;height:40px;padding:0 14px;border:1.5px dashed rgba(31,156,240,.55);border-radius:14px;background:none;color:var(--brass-d,#0A78C2);font:600 14px var(--sans);cursor:pointer}
.we-add .ic{width:15px;height:15px}
@media(max-width:560px){.we-r{grid-template-columns:auto minmax(0,1fr) auto}.we-x{grid-column:2/-1;justify-content:flex-end}}

/* =====================================================================
   AMBER — the main colour is a warm amber (yellow leaning into orange).
   Bright amber for fills, a deeper amber for text; dark text on amber,
   since white on yellow doesn't read.
   ===================================================================== */
.jr{--brass:#1F9CF0;--brass-d:#0A6AAE;--sel:linear-gradient(160deg,#EAF6FF 0%,#CDE8FC 100%);--sel-sub:#0B4F80}
.jr .btn:not(.ghost),.nx,.jr-chat .send,.pick .pk-c,.shr-s .box.mine .btn,.tagn,.we-d,.tl-o:hover b{color:#2e2925}
.jr .btn:not(.ghost){background:#1F9CF0;border-color:#1F9CF0}
.jr .btn:not(.ghost):hover,.nx:hover,.jr-chat .send:hover{background:#0F87D8;border-color:#0F87D8}
.jr .btn.dim{background:#CFE6F8;border-color:#CFE6F8;color:#0B4F80}
.nx{background:#1F9CF0;box-shadow:0 12px 26px -16px rgba(15,120,200,.65)}
.nx span{background:rgba(255,255,255,.4);color:#2e2925}
.jr-chat .send{background:#1F9CF0}
.pick .pk-c{background:#1F9CF0}
.op.on .tg span.acc,.tg span.acc{background:#1F9CF0;color:#2e2925}
.op .tick,.yn .tick,.op.on .tick,.yn.on .tick{background:#1F9CF0;color:#2e2925}
.rt i,.op.on .rt i{background:#1F9CF0;color:#2e2925}
.cal-g .s b,.cal-g .e b{background:#1F9CF0!important;color:#2e2925}
.hpin.on b{background:#1F9CF0;color:#2e2925}
.stab.on i,.we-d{background:#1F9CF0;color:#2e2925}
.we-r.o .we-d{background:#0F87D8}
.cr.ok .cr-d,.cr.on .cr-d{background:#1F9CF0}
.cr.on .cr-d{box-shadow:0 0 0 5px rgba(31,156,240,.22)}
.cr.past::after,.cr.ok.past::after{background:#1F9CF0}
.jr-line i{background:linear-gradient(90deg,#6FC2F5,#1F9CF0)}
.yt-k,.yn.on .yt-k,.tname small,.shr-h small,.chips-k{color:#0A6AAE}
.pick .pk-i,.op.on .mono2{color:#0A6AAE}
.pick .pk-b b i,.pick .pk-b b sup,.yn.on small i{color:#0A78C2}
.shr-s .box.mine .btn{background:#1F9CF0;border-color:#1F9CF0}
.tl-day span{color:#0A6AAE}
.tl-pi{border-color:rgba(31,156,240,.75);color:#0A78C2}
.tl-plus b{color:#0A6AAE}
.mpin i{background:#1F9CF0}
.mpin.ap i{background:#0A78C2}
.join-mark svg g{fill:#1F9CF0}
.okc{background:var(--ok)}
/* the airport and city picker */
.we-r label{position:relative}
.we-code{align-self:end;margin-bottom:6px;padding:4px 8px;border-radius:8px;background:#2e2925;color:#fff;font-size:12px;font-weight:700;letter-spacing:.06em}
.we-r.o{grid-template-columns:auto minmax(0,1fr) auto}
.we-r{grid-template-columns:auto minmax(0,1fr) auto auto auto}
.ap:not(.mpin){position:absolute;z-index:20;left:0;right:0;top:calc(100% + 6px);max-height:340px;overflow-y:auto;padding:6px;border-radius:18px;background:#fff;box-shadow:0 24px 50px -20px rgba(40,30,10,.4),0 0 0 1px rgba(57,57,70,.07)}
.ap[hidden]{display:none}
.ap-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;width:100%;padding:9px 10px;border:none;border-radius:12px;background:none;color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.ap-row.sub{padding-left:28px}
.ap-row:hover,.ap-row.on{background:#EAF6FF}
.ap-ic{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:#f4f0e9;color:var(--ink)}
.ap-row.sub .ap-ic{width:26px;height:26px;background:none}
.ap-ic .ic{width:16px;height:16px}
.ap-row span:nth-child(2){display:grid;min-width:0}
.ap-row b{font-size:14.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ap-row small{color:var(--sub);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:0;text-transform:none;font-weight:500}
.ap-code{padding:4px 8px;border-radius:8px;background:#2e2925;color:#fff;font-size:12px;font-weight:700;letter-spacing:.06em}
.ap-code.n{background:#f4f0e9;color:var(--sub)}
.ap-row.own b{color:#0A6AAE}
.ap-none{margin:0;padding:12px;color:var(--sub);font-size:13.5px}
.we{position:relative;z-index:2}
/* where do you want to go: one big field, places as chips in order */
.wz{display:grid;gap:14px;position:relative;z-index:2}
.wz-chips{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.wz-c{display:inline-flex;align-items:center;gap:8px;height:46px;padding:0 6px 0 8px;border-radius:999px;background:var(--sel,#D2EBFC);box-shadow:0 0 0 1.5px rgba(10,120,194,.45)}
.wz-c i{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#1F9CF0;color:#2e2925;font-style:normal;font-size:13px;font-weight:700}
.wz-c b{font-size:16px;font-weight:650;letter-spacing:-.01em}
.wz-c em{padding:3px 7px;border-radius:7px;background:#2e2925;color:#fff;font-style:normal;font-size:11px;font-weight:700;letter-spacing:.06em}
.wz-c button{display:grid;place-items:center;width:30px;height:30px;border:none;border-radius:50%;background:rgba(255,255,255,.6);color:var(--ink);cursor:pointer}
.wz-c button .ic{width:13px;height:13px}
.wz-ar{color:#0A78C2}.wz-ar .ic{width:16px;height:16px}
.wz-f{position:relative;display:flex;align-items:center;gap:12px;height:66px;padding:0 22px;border-radius:999px;background:#fff;box-shadow:0 18px 40px -22px rgba(40,30,10,.35),0 0 0 1px rgba(57,57,70,.07);transition:box-shadow .2s}
.wz-f:focus-within{box-shadow:0 18px 40px -22px rgba(40,30,10,.35),0 0 0 2px #1F9CF0}
.wz-f>.ic{flex:none;width:22px;height:22px;color:#0A78C2}
.wz-f input{flex:1;min-width:0;height:100%;border:none;background:none;outline:none;color:var(--ink);font:600 20px var(--sans);letter-spacing:-.01em}
.wz-f input::placeholder{color:#b6ad9f;font-weight:500}
.wz-f .ap{top:calc(100% + 8px);left:8px;right:8px}
.wz-from{margin:-4px 0 0 22px;color:var(--sub);font-size:14px}
.wz-from .lnk{font-size:14px}
.wz-ff{position:relative;display:inline-flex;align-items:center;gap:8px}
.wz-ff input{width:220px;height:36px;padding:0 12px;border:none;border-radius:11px;background:#fff;box-shadow:0 0 0 1.5px #1F9CF0;font:600 14px var(--sans);color:var(--ink);outline:none}
.wz-ff .ap{left:0;right:auto;width:340px}
.wz-go{display:flex;align-items:center;gap:14px;margin-top:6px}
.wz-go .nx:disabled{opacity:.45;cursor:default;transform:none}
@media(max-width:560px){.wz-f{height:58px;padding:0 18px}.wz-f input{font-size:17px}.wz-from{margin-left:18px}.wz-ff .ap{width:calc(100vw - 48px)}}
/* the first question over the globe: only the globe, the boxes above it, Continue below */
@media(min-width:960px){.jr[data-step=pick]{grid-template-columns:minmax(0,1fr) 0}}
@media(max-width:959px){.jr[data-step=pick]{grid-template-rows:100% 0}}
.jr[data-step=pick] .jr-panel{opacity:0;transform:translateX(40px);pointer-events:none;overflow:hidden;border:none}
.jr[data-step=pick] .jr-cap{opacity:0}
.jr-pickw{position:absolute;inset:0;z-index:4;display:none;pointer-events:none}
.jr[data-step=pick] .jr-pickw{display:block}
.pk-top{position:absolute;left:50%;top:max(28px,calc(var(--gtop,22%) - 40px));translate:-50% -100%;width:min(520px,calc(100% - 32px));display:grid;justify-items:center;gap:12px;pointer-events:auto}
.pk-top h2{margin:0;font-size:clamp(24px,2.2vw,32px);font-weight:700;letter-spacing:-.03em;text-align:center}
.pk-list{display:grid;gap:8px;width:100%}
.pk-f{position:relative;display:flex;align-items:center;gap:10px;height:60px;padding:0 10px 0 18px;border-radius:999px;background:#fff;box-shadow:0 18px 40px -22px rgba(40,30,10,.4),0 0 0 1px rgba(57,57,70,.07);transition:box-shadow .2s}
.pk-f:focus-within{box-shadow:0 18px 40px -22px rgba(40,30,10,.4),0 0 0 2px #1F9CF0}
.pk-f>.ic{flex:none;width:20px;height:20px;color:#0A78C2}
.pk-f input{flex:1;min-width:0;height:100%;border:none;background:none;outline:none;color:var(--ink);font:600 18px var(--sans)}
.pk-f input::placeholder{color:#b6ad9f;font-weight:500}
.pk-f.done{background:var(--sel,#DCEFFD)}
.pk-n{display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:50%;background:#1F9CF0;color:#2e2925;font-size:13px;font-weight:700}
.pk-f em{padding:3px 7px;border-radius:7px;background:#2e2925;color:#fff;font-style:normal;font-size:11px;font-weight:700;letter-spacing:.06em}
.pk-x,.pk-plus{display:grid;place-items:center;flex:none;width:36px;height:36px;border:none;border-radius:50%;background:rgba(255,255,255,.7);color:var(--ink);cursor:pointer}
.pk-plus{position:absolute;right:-48px;background:#1F9CF0;color:#2e2925;box-shadow:0 10px 22px -12px rgba(10,90,160,.7)}
.pk-x .ic{width:13px;height:13px}.pk-plus .ic{width:18px;height:18px}
.pk-f .ap{top:calc(100% + 8px);left:8px;right:8px}
.pk-from{margin:0;color:var(--sub);font-size:13.5px;text-align:center}
.pk-from .lnk{font-size:13.5px}
.pk-bot{position:absolute;left:50%;bottom:clamp(28px,6vh,60px);translate:-50% 0;display:grid;justify-items:center;gap:8px;pointer-events:auto}
.pk-bot .nx{height:52px;padding:0 14px 0 26px;font-size:16px}
.pk-bot .nx:disabled{opacity:.45;cursor:default}
@media(max-width:560px){.pk-plus{position:static}.pk-f{height:54px}}

/* =====================================================================
   BLUE — the main colour is the bright blue of the VS Code logo
   (#1F9CF0), white text on it, a deeper blue for links and labels.
   ===================================================================== */
.jr{--brass:#1F9CF0;--brass-d:#0A6AAE;--acc:#0A6AAE;--sel:linear-gradient(160deg,#EEF7FF 0%,#D3EBFD 100%);--sel-sub:#0B4F80}
.jr .btn:not(.ghost),.nx,.jr-chat .send,.pick .pk-c,.shr-s .box.mine .btn,.tagn,.we-d,.wz-c i,.pk-n,.tg span.acc,.op.on .tg span.acc,.op .tick,.yn .tick,.op.on .tick,.yn.on .tick,.rt i,.op.on .rt i,.cal-g .s b,.cal-g .e b,.hpin.on b,.stab.on i,.pk-plus{color:#fff}
.nx span{background:rgba(255,255,255,.22);color:#fff}
.jr .btn.dim{color:#0B4F80}
.ap-row:hover,.ap-row.on{background:#EAF6FF}
/* the first question sits at the top, clear of the globe however many cities there are */
.pk-top{top:clamp(24px,5vh,48px);translate:-50% 0}
/* the small arrow at the bottom: on to the next part */
.nxa{position:absolute;z-index:5;left:50%;bottom:calc(100% + 82px);translate:-50% 0;display:grid;place-items:center;width:44px;height:44px;border:none;border-radius:50%;background:#1F9CF0;color:#fff;cursor:pointer;box-shadow:0 12px 26px -12px rgba(15,120,200,.7);transition:opacity .3s ease,transform .3s cubic-bezier(.16,1,.3,1),background-color .2s}
.nxa .ic{width:20px;height:20px;transform:rotate(90deg)}
.nxa:hover{background:#0F87D8;transform:translateY(2px)}
.nxa.off{opacity:.35;box-shadow:none}
.nxa.nudge{animation:nudge .45s cubic-bezier(.36,.07,.19,.97)}
@media(max-width:959px){.nxa{width:40px;height:40px;bottom:calc(100% + 72px)}}
.jr-h3{margin:10px 0 2px;font-size:20px;font-weight:700;letter-spacing:-.02em}
.yn.yt b{margin-top:2px}

/* ---- DRAG: put the cities in order by their number ---- */
.pk-h{cursor:grab;touch-action:none;user-select:none}
.pk-h:active{cursor:grabbing}
.pk-list.dragging .pk-f{transition:transform .18s ease}
.pk-list.dragging .pk-f.drag{transition:none;z-index:3;box-shadow:0 10px 30px rgba(10,40,80,.18);position:relative}
.pk-h:hover{background:#1F9CF0;color:#fff}

/* ---- DICTATION: the mic while the box is empty, the send arrow once there's text (like Claude) ---- */
.dz-on .dz:not(.has) .send,.dz-on .dz:not(.has) .cgo{display:none}
.dz.has .mic{display:none}
.mic{position:relative;display:grid;place-items:center;flex:none;width:40px;height:40px;border:none;border-radius:50%;background:transparent;color:#393946;cursor:pointer;transition:background-color .2s,color .2s}
.mic:hover{background:rgba(57,57,70,.07)}
.mic:disabled{opacity:.4;cursor:default}
.mic .ic{width:20px;height:20px}
.cin .mic{width:44px;height:44px}
.mic-w{display:none;align-items:center;gap:3px;height:16px}
.mic-w i{width:3px;height:100%;border-radius:2px;background:currentColor;animation:micw 1s ease-in-out infinite}
.mic-w i:nth-child(2){animation-delay:-.75s}.mic-w i:nth-child(3){animation-delay:-.5s}.mic-w i:nth-child(4){animation-delay:-.25s}
@keyframes micw{0%,100%{transform:scaleY(.3)}50%{transform:scaleY(1)}}
.dz.rec .mic{background:#1F9CF0;color:#fff;box-shadow:0 0 0 0 rgba(31,156,240,.45);animation:micp 1.6s ease-out infinite}
.dz.rec .mic .ic{display:none}
.dz.rec .mic-w{display:flex}
@keyframes micp{0%{box-shadow:0 0 0 0 rgba(31,156,240,.45)}100%{box-shadow:0 0 0 12px rgba(31,156,240,0)}}
@media(prefers-reduced-motion:reduce){.mic-w i,.dz.rec .mic{animation:none}}

/* ---- PREVIOUS / NEXT: text buttons, centred under the chat box ---- */
.jr-pn{display:flex;justify-content:center;align-items:center;gap:10px;margin:-2px 0 2px}
.jr-pn button{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 18px;border-radius:999px;font:500 14px var(--sans);cursor:pointer;transition:background-color .2s,opacity .3s,border-color .2s}
.jr-pn .ic{width:16px;height:16px}
.jr-pn .pv{border:1px solid var(--line2);background:#fff;color:#393946}
.jr-pn .pv:hover{border-color:#393946}
.jr-pn .pv .ic{margin-left:-4px}
.jr-pn .nxa{position:static;translate:none;width:auto;border:1px solid #1F9CF0;background:#1F9CF0;color:#fff;box-shadow:none}
.jr-pn .nxa .ic{transform:none;margin-right:-4px}
.jr-pn .nxa:hover{background:#0F87D8;border-color:#0F87D8}
.jr-pn .nxa.off{opacity:.45}

/* ---- PREVIOUS / NEXT as small blue text links ---- */
.jr-pn{gap:22px;margin:-4px 0 0}
.jr-pn button,.jr-pn .nxa{height:auto;padding:4px 2px;border:none;border-radius:6px;background:none;box-shadow:none;color:#0A6AAE;font:500 13.5px var(--sans);gap:3px}
.jr-pn button:hover,.jr-pn .nxa:hover{background:none;color:#1F9CF0;text-decoration:underline;text-underline-offset:3px;transform:none}
.jr-pn .ic{width:14px;height:14px}
.jr-pn .pv .ic{margin-left:0}.jr-pn .nxa .ic{margin-right:0}
.jr-pn .nxa.off{opacity:.4}
.jr-pn .pv,.jr-pn .pv:hover{border:none;background:none;color:#0A6AAE}
.jr-pn .pv:hover{color:#1F9CF0}

/* ---- the progress line sits centred in the panel (auto margins keep it scrollable when it's wider) ---- */
.crumbs>.cr:first-child{margin-left:auto}
.crumbs>.cr:last-child{margin-right:auto}
@media(min-width:960px){.cr{min-width:64px;padding:0 4px}}

/* ---- confirmed choices: the chosen-tile card, not a long bar ---- */
.pk2{margin-top:4px}
.pk2 .yn b i{font-style:normal;color:var(--sub);margin:0 2px}
.pk2 .yn b sup{font-size:10px}
.legs-done{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
.legs-done .pk2{display:contents}
@media(max-width:420px){.legs-done{grid-template-columns:1fr}.pk2 .yn{display:grid;grid-template-columns:1fr}}
.pk2 .yn small i{font-style:normal}

/* ---- Confirm under the travellers ---- */
.ok-row{display:flex;justify-content:center;margin-top:18px}
.ok-b{min-width:180px}
.ok-b:disabled{opacity:.4;cursor:default}

/* ---- progress line: steps past the first open one are locked ---- */
.cr.lock{cursor:not-allowed;opacity:.55}
.cr.lock:hover .cr-k{color:#a7a196}

/* ---- the total: a bar along the bottom of the map that rolls up into the trip ---- */
.jr-tot{position:absolute;z-index:4;left:0;right:0;bottom:0;display:grid}
.jr-tot:empty{display:none}
.tt-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;padding:14px 24px max(14px,env(safe-area-inset-bottom));border:none;border-top:1px solid rgba(57,57,70,.08);background:rgba(251,250,248,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.tt-bar .jr-sum{display:flex;align-items:baseline;gap:10px}
.tt-bar .jr-sum span{font-size:12.5px;color:var(--sub)}
.tt-bar .jr-sum b{font-size:22px}
.tt-more{display:inline-flex;align-items:center;gap:4px;color:#0A6AAE;font-size:13.5px;font-weight:500}
.tt-more .ic{width:15px;height:15px;transition:transform .35s cubic-bezier(.16,1,.3,1)}
.jr-tot.open .tt-more .ic{transform:rotate(180deg)}
.tt-bar:hover .tt-more{color:#1F9CF0}
.tt-roll{display:grid;grid-template-rows:0fr;overflow:hidden;background:rgba(251,250,248,.96);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);transition:grid-template-rows .45s cubic-bezier(.16,1,.3,1)}
.jr-tot.open .tt-roll{grid-template-rows:1fr;border-top:1px solid rgba(57,57,70,.08);box-shadow:0 -18px 40px -28px rgba(40,30,15,.35)}
.tt-roll>*{min-height:0}
.tt-roll ul{margin:0;padding:10px 24px 4px;list-style:none;max-height:min(52vh,420px);overflow:auto}
.tt-roll li{display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid rgba(57,57,70,.06)}
.tt-roll li:last-child{border-bottom:none}
.tt-i{display:grid;place-items:center;width:34px;height:34px}
.tt-i .v3i{width:40px;height:40px}
.tt-i .ic{width:18px;height:18px;color:var(--sub)}
.tt-b{display:grid;gap:1px;min-width:0}
.tt-b b{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tt-b small{font-size:12px;color:var(--sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tt-c{font-size:14px;font-weight:600;font-variant-numeric:tabular-nums}
.tt-e{display:block!important;color:var(--sub);font-size:13.5px}
.tt-sum{display:flex;justify-content:space-between;align-items:baseline;padding:8px 24px 12px;border-top:1px solid rgba(57,57,70,.1)}
.tt-sum span{font-size:13px;color:var(--sub)}.tt-sum b{font-size:16px}
.jr-tot~.jr-cap,.jr-globe .jr-cap{bottom:86px}
@media(max-width:959px){.tt-bar{padding:10px 16px}.tt-bar .jr-sum b{font-size:18px}.jr-globe .jr-cap{bottom:62px}.tt-roll ul{padding:6px 16px 2px;max-height:24vh}.tt-sum{padding:6px 16px 8px}}

/* ===== FULLER STEPS (2026-11-11): time away tile, day by day strip, travellers as faces, quick picks ===== */
.yn.yt.info{cursor:default;background:var(--card,#fff);border:1px solid var(--line,#ece6dc);box-shadow:none;position:relative}
.yn.yt.info:hover{transform:none;border-color:var(--line,#ece6dc)}
.yn.yt.info .yt-k{color:var(--sub)}
.yn.yt.info small{line-height:1.6}
.yn.yt.info .aw-i{position:absolute;top:20px;right:20px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#EAF5FE;color:#1F9CF0}
.yn.yt.info .aw-i .ic{width:18px;height:18px}
.days{display:grid;gap:10px;margin-top:10px}
.days-s{overflow-x:auto;scrollbar-width:thin;margin:0 -4px;padding:0 4px 6px}
.days-g{display:grid;grid-template-rows:auto 44px;row-gap:12px;min-width:100%;padding:16px 10px 14px;border:1px solid var(--line,#ece6dc);border-radius:22px;background:var(--card,#fff)}
.dd-d{grid-row:1;display:grid;justify-items:center;gap:2px;padding:8px 0 7px;margin:0 3px;border-radius:12px;position:relative}
.dd-d small{font:600 11px/1 var(--sans);letter-spacing:.04em;text-transform:uppercase;color:var(--sub)}
.dd-d b{font:700 19px/1.1 var(--sans);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.dd-d em{position:absolute;top:-14px;font:600 10.5px/1 var(--sans);font-style:normal;color:#0A6AAE;letter-spacing:.03em;text-transform:uppercase}
.dd-d.we{background:var(--soft,#f4efe7)}
.dd-b{grid-row:2;align-self:center;height:40px;margin:0 16px;border-radius:12px;display:flex;align-items:center;gap:6px;padding:0 12px;min-width:0;overflow:hidden;white-space:nowrap;background:linear-gradient(135deg,#6CC2F7,#1F9CF0);color:#fff;box-shadow:0 6px 16px -8px rgba(31,156,240,.7)}
.dd-b b{font-size:14px;font-weight:700;overflow:hidden;text-overflow:ellipsis}
.dd-b small{font-size:12px;opacity:.85}
.dd-b.c1{background:linear-gradient(135deg,#7FD1C4,#2BA88F);box-shadow:0 6px 16px -8px rgba(43,168,143,.7)}
.dd-b.c2{background:linear-gradient(135deg,#F7B37A,#E8823A);box-shadow:0 6px 16px -8px rgba(232,130,58,.7)}
.dd-b.c3{background:linear-gradient(135deg,#B9A3F2,#7C5CE0);box-shadow:0 6px 16px -8px rgba(124,92,224,.7)}
.dd-m{grid-row:2;align-self:center;justify-self:center;z-index:1;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#1F9CF0;border:1.5px solid #1F9CF0;box-shadow:0 2px 8px rgba(0,0,0,.08)}
.dd-m .ic{width:17px;height:17px}
.avs{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:-4px auto 4px;max-width:520px}
.av{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:#EAF5FE;color:#1F9CF0;font:700 15px/1 var(--sans);position:relative;animation:avIn .35s cubic-bezier(.2,.9,.3,1.3) both;animation-delay:calc(var(--i,0) * 30ms)}
.av .ic{width:20px;height:20px}
.av.me{background:linear-gradient(135deg,#6CC2F7,#1F9CF0);color:#fff}
.av.me i{position:absolute;bottom:-17px;font:600 10.5px/1 var(--sans);font-style:normal;color:var(--sub)}
.av.ghost{background:none;border:1.5px dashed var(--line2,#d8cfc1);color:var(--sub)}
@keyframes avIn{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
.qk{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;margin-top:14px}
.qk .chips-k{width:100%;text-align:center;margin-bottom:2px}
.qk .fc.on{background:#1F9CF0;border-color:#1F9CF0;color:#fff}
@media(max-width:959px){.dd-d b{font-size:16px}.dd-b{height:36px;margin:0 12px}.av{width:40px;height:40px}}
@media(prefers-reduced-motion:reduce){.av{animation:none}}

/* ===== CHOSEN JOURNEY / HOTEL DETAILS (2026-11-11): fare, bags, add-ons; photos, room upgrade, breakfast ===== */
.lx,.hx{display:grid;gap:12px;margin-top:6px;padding:20px;border:1px solid var(--line,#ece6dc);border-radius:24px;background:var(--card,#fff)}
.lx+.lx{margin-top:4px}
.lx .chips-k,.hx .chips-k{margin-top:6px}
.lx-h{display:flex;align-items:center;gap:12px}
.lx-h>span:last-child{display:grid;gap:2px}
.lx-h b{font-size:17px;letter-spacing:-.01em}
.lx-h small{color:var(--sub);font-size:13px}
.lx-it{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;padding:14px 18px;border-radius:18px;background:var(--soft,#f4efe7)}
.lx-it>span:not(.lx-l){display:grid;gap:2px;text-align:center}
.lx-it b{font-size:24px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.lx-it sup{font-size:11px;color:var(--sub)}
.lx-it small{color:var(--sub);font-size:12px;font-weight:600;letter-spacing:.04em}
.lx-l{position:relative;display:grid;justify-items:center;padding-top:18px}
.lx-l i{position:absolute;top:8px;left:0;right:0;height:2px;background:repeating-linear-gradient(90deg,#1F9CF0 0 6px,transparent 6px 11px)}
.lx-l u{position:absolute;top:4px;left:calc(50% - 5px);width:10px;height:10px;border-radius:50%;background:#fff;border:2px solid #1F9CF0}
.lx-l em{font-style:normal;font-size:12.5px;color:var(--sub);white-space:nowrap}
.lx-ck,.hx-ck{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:16px;background:#EAF5FE;color:#0A6AAE}
.lx-ck .ic,.hx-ck .ic{flex:none;width:20px;height:20px;margin-top:1px}
.lx-ck span,.hx-ck span{display:grid;gap:2px}
.lx-ck b,.hx-ck b{font-size:14px}
.lx-ck small,.hx-ck small{font-size:12.5px;color:#2d6f9e;line-height:1.45}
.lx-fares{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.lx-f{position:relative;display:grid;align-content:start;gap:4px;padding:14px 14px 12px;border:1.5px solid var(--line,#ece6dc);border-radius:18px;background:#fff;color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:border-color .2s,background .2s}
.lx-f:hover{border-color:#9fd3f7}
.lx-f.on{border-color:#1F9CF0;background:linear-gradient(180deg,#F2F9FF,#E3F2FD)}
.lx-f b{font-size:16px}
.lx-f em{font-style:normal;font-size:13px;color:#0A6AAE;font-weight:600}
.lx-f ul{margin:6px 0 0;padding:0;list-style:none;display:grid;gap:4px}
.lx-f li{display:flex;gap:6px;align-items:flex-start;font-size:12.5px;color:var(--sub);line-height:1.35}
.lx-f li .ic{flex:none;width:13px;height:13px;margin-top:2px;color:#1F9CF0}
.lx-f .tick,.hx-r .tick{position:absolute;top:10px;right:10px;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:#1F9CF0;color:#fff;opacity:0;transform:scale(.6);transition:.2s}
.lx-f .tick .ic,.hx-r .tick .ic{width:12px;height:12px}
.lx-f.on .tick,.hx-r.on .tick{opacity:1;transform:none}
.lx-adds{display:grid;gap:8px}
.lx-a{display:grid;grid-template-columns:36px 1fr auto auto;align-items:center;gap:12px;width:100%;padding:10px 14px 10px 10px;border:1px solid var(--line,#ece6dc);border-radius:16px;background:#fff;color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:border-color .2s,background .2s}
div.lx-a{cursor:default;grid-template-columns:36px 1fr auto}
.lx-a.on{border-color:#9fd3f7;background:#F5FAFF}
.lx-ai{display:grid;place-items:center;width:36px;height:36px;border-radius:12px;background:var(--soft,#f4efe7);color:var(--sub)}
.lx-a.on .lx-ai{background:#1F9CF0;color:#fff}
.lx-ai .ic{width:18px;height:18px}
.lx-a>span:nth-child(2){display:grid;gap:1px}
.lx-a b{font-size:14px}
.lx-a small{font-size:12.5px;color:var(--sub)}
.lx-a em{font-style:normal;font-size:13px;font-weight:600;color:#0A6AAE;white-space:nowrap}
.lx-a .stp-c{gap:8px}
.lx-a .stp-c b{min-width:24px;font-size:18px}
.lx-a .stp-b{width:32px;height:32px}
.sw{position:relative;width:38px;height:22px;border-radius:999px;background:#ddd5c8;transition:background .2s}
.sw i{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:transform .2s}
.lx-a.on .sw{background:#1F9CF0}
.lx-a.on .sw i{transform:translateX(16px)}
.lx-sum{margin:2px 0 0;font-size:13px;color:var(--sub);text-align:right}
.gal{display:grid;gap:8px}
.gal-m{position:relative;aspect-ratio:16/9;border-radius:18px;overflow:hidden;background:var(--soft,#f4efe7)}
.gal-m img{width:100%;height:100%;object-fit:cover;display:block}
.gal-c{position:absolute;left:12px;bottom:12px;padding:4px 10px;border-radius:999px;background:rgba(0,0,0,.45);color:#fff;font-size:11.5px;font-weight:600;backdrop-filter:blur(6px)}
.gal-t{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.gal-t button{padding:0;border:2px solid transparent;border-radius:12px;overflow:hidden;aspect-ratio:3/2;background:var(--soft,#f4efe7);cursor:pointer;opacity:.75;transition:opacity .2s,border-color .2s}
.gal-t button:hover{opacity:1}
.gal-t button.on{border-color:#1F9CF0;opacity:1}
.gal-t img{width:100%;height:100%;object-fit:cover;display:block}
.hx-rooms{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.hx-r{position:relative;display:grid;align-content:start;padding:0;border:1.5px solid var(--line,#ece6dc);border-radius:18px;overflow:hidden;background:#fff;color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:border-color .2s}
.hx-r:hover{border-color:#9fd3f7}
.hx-r.on{border-color:#1F9CF0;box-shadow:0 8px 20px -14px rgba(31,156,240,.8)}
.hx-r img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block}
.hx-r>span:not(.tick){display:grid;gap:3px;padding:10px 12px 12px}
.hx-r b{font-size:14.5px}
.hx-r small{font-size:12px;color:var(--sub);line-height:1.35}
.hx-r em{font-style:normal;font-size:12.5px;font-weight:600;color:#0A6AAE;margin-top:2px}
@media(max-width:640px){.lx-fares,.hx-rooms{grid-template-columns:1fr}.hx-r{grid-template-columns:110px 1fr}.hx-r img{height:100%;aspect-ratio:auto}.lx,.hx{padding:14px}.lx-a{grid-template-columns:36px 1fr auto}.lx-a em{display:none}}

/* the trip details under the map: each line opens to its breakdown */
.tt-roll li{display:block;padding:0}
.tt-r{display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:12px;width:100%;padding:9px 0;border:none;background:none;color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.tt-r:hover .tt-b b{color:#0A6AAE}
.tt-c{display:flex;align-items:center;gap:6px}
.tt-c .ic{width:14px;height:14px;color:var(--sub);transform:rotate(180deg);transition:transform .3s}
.tt-roll li.open .tt-c .ic{transform:none;color:#1F9CF0}
.tt-d{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s cubic-bezier(.16,1,.3,1)}
.tt-d>div{min-height:0;overflow:hidden}
.tt-roll li.open .tt-d{grid-template-rows:1fr}
.tt-d dl{margin:0 0 6px 46px;padding:10px 14px;border-radius:14px;background:var(--soft,#f4efe7);display:grid;gap:6px}
.tt-d dl>div{display:flex;justify-content:space-between;gap:12px;font-size:13px}
.tt-d dt{color:var(--sub)}
.tt-d dd{margin:0;font-weight:600;font-variant-numeric:tabular-nums}
.tt-d dl>div.wt dt{color:#b4532a}
.tt-d .lnk{margin:0 0 10px 46px;font-size:13px}

/* the chat box: a blue light running round it */
@property --g33a{syntax:'<angle>';inherits:false;initial-value:0deg}
.jr-chat-i{position:relative}
.jr-chat-i::before,.jr-chat-i::after{content:'';position:absolute;inset:-2px;border-radius:inherit;background:conic-gradient(from var(--g33a),transparent 0deg,transparent 200deg,rgba(108,194,247,.35) 250deg,#6CC2F7 300deg,#1F9CF0 340deg,transparent 360deg);animation:g33ring 4.5s linear infinite;pointer-events:none}
.jr-chat-i::before{z-index:-1;padding:2px;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.jr-chat-i::after{z-index:-1;inset:-3px;filter:blur(9px);opacity:.6}
.jr-chat-i:focus-within::after{opacity:.85}
@keyframes g33ring{to{--g33a:360deg}}
@media(prefers-reduced-motion:reduce){.jr-chat-i::before,.jr-chat-i::after{animation:none;background:conic-gradient(from 0deg,#6CC2F7,#1F9CF0,#6CC2F7)}.jr-chat-i::after{opacity:.3}}

/* ===== WHO: invite the others (name + email or phone, required) ===== */
.av.named{background:#DCEFFD;color:#0A6AAE}
.inv{display:grid;gap:8px;margin-top:8px}
.inv-r{display:grid;grid-template-columns:40px 1fr 1.3fr 24px;align-items:center;gap:10px;padding:8px 12px 8px 8px;border:1px solid var(--line,#ece6dc);border-radius:16px;background:#fff;transition:border-color .2s,background .2s}
.inv-r.ok{border-color:#9fd3f7;background:#F5FAFF}
.av.sm{width:40px;height:40px;font-size:13.5px;animation:none}
.av.sm .ic{width:18px;height:18px}
.inv-r input{min-width:0;height:40px;padding:0 12px;border:1px solid transparent;border-radius:10px;background:var(--soft,#f4efe7);color:var(--ink);font:500 14px var(--sans);outline:none;transition:border-color .2s,background .2s}
.inv-r input:focus{border-color:#1F9CF0;background:#fff}
.inv-r input.miss{border-color:#e0895e;background:#fff6f1}
.inv-t{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#e9e3d9;color:#fff;transition:background .2s}
.inv-t .ic{width:13px;height:13px}
.inv-r.ok .inv-t{background:#1F9CF0}
@media(max-width:640px){.inv-r{grid-template-columns:40px 1fr 22px;row-gap:6px}.inv-r .av{grid-row:span 2}.inv-r .inv-c{grid-column:2}.inv-t{grid-row:1;grid-column:3}}

/* ===== CONFIRMED CHOICES: a slim line with a small Edit button instead of the big card ===== */
.pk3{display:flex;align-items:center;gap:14px;padding:12px 4px 14px;border-bottom:1px solid var(--line,#ece6dc)}
.pk3-b{flex:1;min-width:0;display:grid;gap:2px}
.pk3-b small{color:#0A6AAE;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.pk3-b b{font-size:17px;font-weight:700;letter-spacing:-.015em;line-height:1.3}
.pk3-b b i{font-style:normal;color:var(--sub);margin:0 3px}
.pk3-b>span{color:var(--sub);font-size:13.5px;line-height:1.45}
.pk-ed{flex:none;display:inline-flex;align-items:center;gap:5px;height:32px;padding:0 13px 0 11px;border:1px solid #cfe6f8;border-radius:999px;background:#F2F9FF;color:#0A6AAE;font:600 13px var(--sans);cursor:pointer;transition:background .2s,border-color .2s}
.pk-ed:hover{background:#E3F2FD;border-color:#9fd3f7}
.pk-ed .ic{width:14px;height:14px}
.legs-done{display:grid;grid-template-columns:1fr!important;gap:0}
.days-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap}
.days-a{color:var(--sub);font-size:13px}

/* hotel list: a photo on each card */
.op.ho2{grid-template-columns:112px minmax(0,1fr) auto;padding:12px 18px 12px 12px}
.ho-ph{align-self:stretch;width:112px;min-height:84px;border-radius:14px;overflow:hidden;background:var(--soft,#f4efe7)}
.ho-ph img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:640px){.op.ho2{grid-template-columns:80px minmax(0,1fr) auto;gap:12px}.ho-ph{width:80px;min-height:72px}}
.op.ho2 .tg{top:18px;left:18px}
.op.ho2 .tg span,.op.ho2.on .tg span{background:rgba(255,255,255,.92);color:var(--ink);box-shadow:0 1px 4px rgba(0,0,0,.15)}
.op.ho2 .tg span.acc,.op.ho2.on .tg span.acc{background:#1F9CF0;color:#fff}

/* calendar: while choosing the day back, the hovered day is the end of the range, like the start */
.cal-g .he::before{content:'';position:absolute;inset:3px 50% 3px 0;background:rgba(31,156,240,.14)}
.cal-g .s.hs::before{content:'';position:absolute;inset:3px 0 3px 50%;background:rgba(31,156,240,.14)}
.cal-g button.he b,.cal-g button.he:not(:disabled):hover b{background:#1F9CF0!important;color:#fff}
/* the closed trip details leave no strip above the total bar */
.jr-tot:not(.open) .tt-roll ul{padding-top:0;padding-bottom:0}
/* day strip: the plane circles sit beside the bar with a gap, not over its ends */
.dd-b{margin:0 25px}
@media(max-width:959px){.dd-b{margin:0 23px}}

/* ===== THE STOPS, STACKED IN THE MAP'S TOP RIGHT (drag to reorder) ===== */
.mstk{position:absolute;top:14px;right:14px;z-index:6;pointer-events:none}
.mstk-l{list-style:none;margin:0;padding:0;display:grid;gap:6px;justify-items:end}
.mstk-i{pointer-events:auto;display:flex;align-items:center;gap:8px;height:36px;padding:0 13px 0 5px;border-radius:999px;background:#fff;box-shadow:0 10px 24px -14px rgba(40,30,10,.45),0 0 0 1px rgba(57,57,70,.07);color:var(--ink);font:600 13px var(--sans);white-space:nowrap;user-select:none;-webkit-user-select:none;transition:transform .22s cubic-bezier(.16,1,.3,1),box-shadow .2s}
.mstk-i.mv{cursor:grab;touch-action:none}
.mstk-i.mv:hover{box-shadow:0 12px 26px -14px rgba(40,30,10,.5),0 0 0 1px rgba(31,156,240,.35)}
.mstk-i.drag{transition:box-shadow .2s;z-index:2;cursor:grabbing;box-shadow:0 18px 34px -14px rgba(40,30,10,.55),0 0 0 1.5px #1F9CF0}
.mstk-i i,.mstk-gh i{flex:none;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#1F9CF0;color:#fff;font-style:normal;font-size:12px;font-weight:700}
.mstk-i small{color:var(--sub);font-size:11.5px;font-weight:600}
.mstk-gh{position:fixed;z-index:80;display:flex;align-items:center;gap:10px;box-sizing:border-box;border-radius:999px;background:#fff;box-shadow:0 18px 40px -22px rgba(40,30,10,.4),0 0 0 1px rgba(57,57,70,.07);color:var(--ink);font-weight:600;white-space:nowrap;overflow:hidden;pointer-events:none}
.mstk-gh i{width:var(--n,30px);height:var(--n,30px)}
@media(max-width:959px){.mstk{top:10px;right:10px}.mstk-i{height:32px;font-size:12.5px}.mstk-i i{width:22px;height:22px;font-size:11px}}

/* each journey's add-ons sit right under it */
.leg-blk{display:grid;gap:10px;padding-bottom:10px}
.leg-blk+.leg-blk,.leg-blk+.pk3,.pk3+.leg-blk{margin-top:6px}
.leg-blk .ok-row{margin-top:4px}
/* hotel chosen: back to the list on top, Confirm floating above the chat bar */
.hx-back{justify-self:start;display:inline-flex;align-items:center;gap:6px;height:32px;margin:-4px 0 2px;padding:0 12px 0 8px;border:none;border-radius:999px;background:none;color:#0A6AAE;font:600 13.5px var(--sans);cursor:pointer}
.hx-back:hover{background:#F2F9FF}
.hx-back .ic{width:15px;height:15px}
.ok-float{position:sticky;bottom:10px;z-index:5;display:flex;justify-content:center;margin-top:4px;pointer-events:none}
.ok-float .btn{pointer-events:auto;min-width:200px;box-shadow:0 14px 30px -12px rgba(10,100,170,.55)}
/* Review: Book / Send for approval floats in the middle above the chat bar, like the Confirm buttons */

/* transfer: what kind of ride each option is, and the ride back heading */
.tk-k{color:#0A6AAE;font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.op.co .ho-b{display:grid;gap:1px}
.bk-h{margin:18px 0 0;font-size:20px;font-weight:700;letter-spacing:-.02em}

/* map: the start and each stop can be pressed; a city with several airports opens a small list */
.mpin.tap{pointer-events:auto;cursor:pointer}
.mpin.tap:hover span{box-shadow:0 0 0 1.5px #1F9CF0,0 6px 14px -6px rgba(0,0,0,.3)}
.mpop{position:absolute;z-index:30;width:min(340px,calc(100% - 20px));max-height:320px;overflow-y:auto;padding:6px;border-radius:18px;background:#fff;box-shadow:0 24px 50px -20px rgba(40,30,10,.4),0 0 0 1px rgba(57,57,70,.07);animation:mpopIn .22s cubic-bezier(.16,1,.3,1)}
@keyframes mpopIn{from{opacity:0;transform:translateY(-6px) scale(.98)}to{opacity:1;transform:none}}
/* stack: × to take a city off, asked first */
.mstk-x{display:grid;place-items:center;width:22px;height:22px;margin:0 -6px 0 2px;padding:0;border:none;border-radius:50%;background:none;color:var(--sub);cursor:pointer;transition:background .2s,color .2s}
.mstk-x:hover{background:#fdecea;color:#c2412d}
.mstk-x .ic{width:13px;height:13px}
.mstk-i.ask{gap:8px;padding:0 5px 0 14px;cursor:default}
.mstk-i.ask span{font-weight:500}
.mstk-i.ask span b{font-weight:700}
.mstk-yes,.mstk-no{height:26px;padding:0 11px;border:none;border-radius:999px;font:600 12.5px var(--sans);cursor:pointer}
.mstk-yes{background:#c2412d;color:#fff}
.mstk-no{background:var(--soft,#f4efe7);color:var(--ink)}
/* rental car: adjust the days */
.car-adj{display:grid;gap:10px;margin-top:-2px}
.car-t{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:11px 14px;border:1px solid var(--line,#ece6dc);border-radius:14px;background:#fff;color:var(--ink);font:500 13.5px var(--sans);text-align:left;cursor:pointer;transition:border-color .2s}
.car-t:hover{border-color:#9fd3f7}
.car-t b{display:inline-flex;align-items:center;gap:4px;flex:none;color:#0A6AAE;font-weight:600}
.car-t b .ic{width:14px;height:14px;transition:transform .25s}
.car-adj.open .car-t b .ic{transform:rotate(90deg)}
.car-b{display:grid;gap:6px;padding:2px 2px 4px}
.car-b .fld{display:grid;gap:6px}
.car-b .fld span{color:var(--sub);font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.car-b select{height:44px;padding:0 12px;border:1px solid var(--line2,#d8cfc1);border-radius:12px;background:#fff;color:var(--ink);font:500 14px var(--sans)}
.pk-back{color:#0A6AAE;font-weight:600}
/* the + under the stack, and its search */
.mstk-plus{pointer-events:auto;display:grid;place-items:center;width:36px;height:36px;margin:6px 0 0 auto;padding:0;border:none;border-radius:50%;background:#fff;color:#0A6AAE;box-shadow:0 10px 24px -14px rgba(40,30,10,.45),0 0 0 1px rgba(57,57,70,.07);cursor:pointer;transition:background .2s,color .2s}
.mstk-plus:hover{background:#1F9CF0;color:#fff}
.mstk-plus .ic{width:17px;height:17px}
.mstk-add{pointer-events:auto;position:relative;display:flex;align-items:center;gap:8px;width:250px;height:38px;margin:6px 0 0 auto;padding:0 12px;border-radius:999px;background:#fff;box-shadow:0 10px 24px -14px rgba(40,30,10,.45),0 0 0 1.5px #1F9CF0}
.mstk-add .ic{flex:none;width:16px;height:16px;color:var(--sub)}
.mstk-add input{flex:1;min-width:0;height:100%;border:none;background:none;outline:none;color:var(--ink);font:500 14px var(--sans)}
.mstk-add .ap{left:auto;right:0;width:320px;top:calc(100% + 6px)}
/* review: a roomier comment box */
#plf textarea[name=note]{width:100%;min-height:150px;resize:vertical;line-height:1.5}

/* buttons: Continue and Confirm sit up off the page */
.ok-b,.nx,.ok-float .btn,.ck-go{box-shadow:0 16px 32px -12px rgba(10,100,170,.6),0 5px 12px -5px rgba(10,100,170,.4)!important}
.ok-b:hover,.nx:hover,.ok-float .btn:hover,.ck-go:hover{box-shadow:0 20px 38px -12px rgba(10,100,170,.65),0 6px 14px -5px rgba(10,100,170,.45)!important}
.ok-b:disabled,.nx:disabled{box-shadow:none!important}
.pk-bot .nx.enter{animation:pkGo .45s cubic-bezier(.16,1,.3,1) both}
@keyframes pkGo{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:none}}
/* the lazy floats */
.ok-float.lazy{opacity:0;transform:translateY(14px);transition:opacity .3s ease,transform .35s cubic-bezier(.16,1,.3,1)}
.ok-float.lazy .btn{pointer-events:none}
.ok-float.lazy.show{opacity:1;transform:none}
.ok-float.lazy.show .btn{pointer-events:auto}
/* checkout: its own light window */
.ck-wrap{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:16px;background:rgba(20,18,15,.38);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;transition:opacity .25s}
.ck-wrap.on{opacity:1}
.ck-wrap .ck{position:relative;width:min(420px,100%);max-height:calc(100vh - 32px);overflow:auto;padding:26px 24px 20px;border-radius:26px;background:#fff;color:var(--ink,#2e2925);font-family:var(--sans,Inter,system-ui,sans-serif);box-shadow:0 30px 70px -20px rgba(0,0,0,.45);transform:translateY(10px) scale(.98);transition:transform .35s cubic-bezier(.16,1,.3,1)}
.ck-wrap.on .co{transform:none}
.ck-wrap .ck h3{font-size:22px;font-weight:700;letter-spacing:-.02em;font-family:inherit}
.ck-wrap .ck .lead{color:var(--sub,#7b746a);font-size:14px;font-family:inherit}
.ck-x{position:absolute;top:14px;right:14px;display:grid;place-items:center;width:34px;height:34px;padding:0;border:none;border-radius:50%;background:var(--soft,#f4efe7);color:var(--ink,#2e2925);cursor:pointer}
.ck-x .ic{width:16px;height:16px}
.ck-go{display:block;border:none;border-radius:999px;background:#1F9CF0;color:#fff;font:600 16px var(--sans,Inter,sans-serif);cursor:pointer}
.ck-go:disabled{opacity:.7}

.ck-wrap .ck{display:grid;gap:14px;font-family:'Suisse Intl',Inter,system-ui,-apple-system,'Segoe UI',sans-serif;text-align:left}
.ck-wrap .ck *{font-family:inherit}
.ck-wrap .ck h3{margin:0;padding-right:40px;color:#2e2925}
.ck-wrap .ck .lead{margin:-6px 0 0}
.ck-amt{display:grid;gap:2px;padding:16px 18px;border-radius:18px;background:#EAF5FE}
.ck-amt small{color:#2d6f9e;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.ck-amt b{font-size:30px;font-weight:700;letter-spacing:-.02em;color:#0A4F80}
.ck-ms{display:grid;gap:8px}
.ck-o{position:relative;display:grid;grid-template-columns:40px 1fr;align-items:center;gap:12px;width:100%;padding:12px 44px 12px 14px;border:1.5px solid #ece6dc;border-radius:16px;background:#fff;color:#2e2925;font-size:15px;text-align:left;cursor:pointer;transition:border-color .2s,background .2s}
.ck-o.on{border-color:#1F9CF0;background:#F5FAFF}
.ck-o>span:nth-child(2){display:grid;gap:1px}
.ck-o b{font-size:15px;font-weight:600}
.ck-o small{color:#7b746a;font-size:12.5px}
.ck-i{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:#f4efe7}
.ck-i .ic{width:20px;height:20px}
.ck-o .tick{position:absolute;top:50%;right:14px;width:22px;height:22px;margin-top:-11px;border-radius:50%;display:grid;place-items:center;background:#1F9CF0;color:#fff;opacity:0;transition:opacity .2s}
.ck-o .tick .ic{width:13px;height:13px}
.ck-o.on .tick{opacity:1}
.ck-go{width:100%;height:52px}
.ck-wrap .jr-fine{margin:0;color:#7b746a;font-size:12.5px;text-align:center}
.ck-x{color:#2e2925!important}.ck-x .ic{display:block;stroke:#2e2925}

/* sign-up: first and last name side by side, a note on what they're for, the username with its @ */
.au-f{grid-template-columns:1fr 1fr!important}
.au-f .wide{grid-column:1/-1}
.au-note{margin:-4px 0 0;color:var(--sub);font-size:12.5px;line-height:1.45}
.au-un{position:relative;display:block}
.au-un i{position:absolute;left:14px;top:50%;transform:translateY(-50%);font-style:normal;color:var(--sub);font-weight:600}
.au-un input{padding-left:30px!important}
.au-unh{display:block;margin-top:6px;color:var(--sub);font-size:12px}
.au-unh.ok{color:#2E8B57}
.au-unh.bad{color:#c2412d}
@media(max-width:420px){.au-f{grid-template-columns:1fr!important}}

/* page titles: no little gradient bar in front */
.h1::before{display:none!important}
/* the total under the map: the trip, and what you pay yourself */
.tt-bar .jr-sum .tt-me{font-size:13px;color:var(--sub);white-space:nowrap}
.tt-bar .jr-sum .tt-me b{font-size:15px;font-weight:650;color:var(--ink)}
@media(max-width:480px){.tt-bar .jr-sum{flex-wrap:wrap;row-gap:2px}.tt-bar .jr-sum em{display:none}}
.car-ok{justify-self:start;margin-top:6px}
/* a work trip with several organisations: which one */
.org-pick{display:grid;gap:10px;margin-top:16px}
.org-chips{display:flex;flex-wrap:wrap;gap:8px}
/* Review: the comment box as wide as the ticket above it, centred, the small print under it centred too */
#plf.jr-f{grid-template-columns:1fr!important;width:100%;margin-inline:auto}
#plf.jr-f .fld{grid-column:1/-1;width:100%}
#plf + .jr-fine{text-align:center}
/* Review: press a line for its details, as a drop-down under it */
.tk-r.tl{grid-template-columns:auto minmax(0,1fr) auto auto 18px}
.tl-chev{display:grid;place-items:center;color:var(--sub)}
.tl-chev .ic{width:14px;height:14px;transform:rotate(90deg);transition:transform .25s}
.tk-r.tl.on .tl-chev .ic{transform:rotate(-90deg)}
.tl-det{margin:-4px 22px 12px 72px;padding:12px 14px;border-radius:14px;background:var(--soft,#f4efe7);display:grid;gap:8px}
.tl-det .tl-info{display:flex;flex-wrap:wrap;gap:6px 14px;margin:0;font-size:13px;color:var(--sub)}
.tl-det dl{margin:0;display:grid;gap:6px}
.tl-det dl>div{display:flex;justify-content:space-between;gap:12px;font-size:13px}
.tl-det dd{margin:0;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.tl-det dl>div.wt dt{color:#b4532a}
.tl-det .lnk{justify-self:start;font-size:13px}
@media(max-width:560px){.tk-r.tl{grid-template-columns:auto minmax(0,1fr) auto}.tk-r.tl .tl-chev{display:none}.tl-det{margin:-4px 16px 12px 16px}}
/* Business or personal: one word and an icon per tile */
.yn.kt{display:grid;justify-items:start;align-content:space-between;gap:26px;min-height:132px}
.yn.kt .kt-i{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:rgba(10,106,174,.08);color:#0A6AAE}
.yn.kt .kt-i .ic{width:22px;height:22px}
.yn.kt b{font-size:22px;letter-spacing:-.01em}
.yn.kt.on .kt-i{background:#0A6AAE;color:#fff}
/* which organisation: a card per organisation, its picture large */
.org-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.org-card{position:relative;display:grid;justify-items:center;gap:10px;padding:18px 12px 16px;border:1.5px solid var(--line,#ece6dc);border-radius:18px;background:#fff;color:var(--ink);font:inherit;cursor:pointer;transition:border-color .2s,box-shadow .2s,transform .2s}
.org-card:hover{border-color:#9fd3f7;transform:translateY(-1px)}
.org-card b{font-size:15px;font-weight:600;text-align:center;line-height:1.25}
.org-card.on{border-color:#0A6AAE;box-shadow:0 0 0 3px rgba(10,106,174,.12);background:#f5faff}
.org-card .tick{position:absolute;top:10px;right:10px;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#0A6AAE;color:#fff;opacity:0;transform:scale(.6);transition:opacity .2s,transform .2s}
.org-card .tick .ic{width:13px;height:13px}
.org-card.on .tick{opacity:1;transform:none}
/* the days strip: each stay a quiet paper tile with a muted colour tab; the journeys between them as 3D vehicles */
.dd-b,.dd-b.c1,.dd-b.c2,.dd-b.c3{--tab:#b8a48c;background:#fbf8f3;color:var(--ink);border:1px solid #e7dfd3;box-shadow:0 1px 2px rgba(60,45,20,.06);padding-left:16px;position:relative}
.dd-b::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--tab)}
.dd-b.c1{--tab:#c29a85}.dd-b.c2{--tab:#9ea6ae}.dd-b.c3{--tab:#ab97a2}
.dd-b b{font-weight:650;color:var(--ink)}
.dd-b small{color:var(--sub);opacity:1}
.dd-m{width:40px;height:40px;background:#fff;color:var(--sub);border:1px solid #e7dfd3;box-shadow:0 2px 6px rgba(60,45,20,.08);overflow:visible}
.dd-m .v3i{width:34px;height:34px;margin:0}
.dd-b,.dd-b.c1,.dd-b.c2,.dd-b.c3{padding:0 10px 0 14px;gap:5px}
.dd-b b{flex:none;max-width:100%}
.dd-b small{min-width:0;overflow:hidden;text-overflow:ellipsis}
/* Business or personal: just the word */
.yn.kt{align-content:end;min-height:112px}
/* Return or one way: the word big, the route under it */
.yn.way b{font-size:22px;letter-spacing:-.01em}
/* the days strip: the 3D vehicles stand on their own, no circle behind them */
.dd-m{background:none;border:none;box-shadow:none;width:46px;height:46px}
.dd-m .v3i{width:46px;height:46px;filter:drop-shadow(0 3px 4px rgba(60,45,20,.18))}
.dd-m:not(.v3){background:#fff;border:1px solid #e7dfd3;width:34px;height:34px}
/* Who: the people, Instagram-like. A search field, matches as rows with their picture, the ones added as chips */
.ig{display:grid;gap:12px;margin-top:4px}
.ig-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.ig-n{color:var(--sub);font-size:12.5px}
.ig-chips{display:flex;flex-wrap:wrap;gap:8px}
.ig-chip{display:inline-flex;align-items:center;gap:8px;max-width:100%;padding:4px 6px 4px 4px;border:1px solid var(--line,#ece6dc);border-radius:999px;background:#fff;animation:igIn .25s ease-out}
.ig-chip .av-img{width:30px;height:30px;font-size:11px}
.ig-cb{display:grid;line-height:1.15;min-width:0}
.ig-cb b{font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ig-cb small{font-size:11.5px;color:var(--sub)}
.ig-chip button{display:grid;place-items:center;width:24px;height:24px;border:none;border-radius:50%;background:var(--soft,#f4efe7);color:var(--sub);cursor:pointer}
.ig-chip button:hover{background:#ece4d8;color:var(--ink)}
.ig-chip button .ic{width:12px;height:12px}
.ig-lk{background:var(--soft,#f4efe7);color:var(--sub)}
.ig-lk .ic{width:16px;height:16px}
.ig-s{display:flex;align-items:center;gap:10px;height:46px;padding:0 14px;border-radius:12px;background:#efebe5;color:var(--sub);transition:background .2s,box-shadow .2s}
.ig-s:focus-within{background:#fff;box-shadow:0 0 0 1.5px #c9bfb1}
.ig-s .ic{width:18px;height:18px;flex:none}
.ig-s input{flex:1;min-width:0;height:100%;border:none;background:none;outline:none;font:500 15px var(--sans);color:var(--ink)}
.ig-s input::placeholder{color:#9b9389}
.ig.miss .ig-s{box-shadow:0 0 0 1.5px #d9826a}
.ig-res{display:grid;gap:2px;min-height:24px}
.ig-hint{margin:2px 4px;color:var(--sub);font-size:13px}
.ig-r{display:flex;align-items:center;gap:12px;width:100%;padding:8px 6px;border:none;border-radius:12px;background:none;text-align:left;font:inherit;color:var(--ink);cursor:pointer;animation:igIn .2s ease-out}
.ig-r:hover,.ig-r:focus-visible{background:#f4f0ea;outline:none}
.ig-r .av-img.lg{width:44px;height:44px;font-size:14px}
.ig-rb{display:grid;flex:1;min-width:0;line-height:1.25}
.ig-rb b{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ig-rb small{color:var(--sub);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ig-add{flex:none;padding:7px 14px;border-radius:9px;background:#0A6AAE;color:#fff;font-size:13px;font-weight:600}
.ig-r-lk .ig-add{background:#ece6dc;color:var(--ink)}
.ig-done{display:flex;align-items:center;gap:8px;margin:0;color:#1f7a4d;font-size:13.5px;font-weight:500}
.ig-done .ic{width:16px;height:16px}
@keyframes igIn{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.ig-chip,.ig-r{animation:none}}
.ig{margin-top:14px}
/* a chosen rental car: one card */
.carc{display:grid;gap:16px;padding:18px 20px;border:1px solid #e7dfd3;border-radius:20px;background:#fff;box-shadow:0 10px 28px -22px rgba(60,45,20,.45)}
.carc-h{display:flex;align-items:center;gap:14px}
.carc-v{display:grid;place-items:center;flex:none;width:64px;height:48px}
.carc-v .v3i{width:72px;height:72px;margin:-12px -4px;filter:drop-shadow(0 4px 5px rgba(60,45,20,.18))}
.carc-v>.ic{width:26px;height:26px;color:var(--sub)}
.carc-n{display:grid;flex:1;min-width:0;line-height:1.25}
.carc-n small{color:var(--sub);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.carc-n b{font-size:18px;font-weight:650;letter-spacing:-.01em}
.carc-n em{font-style:normal;color:var(--sub);font-size:13px}
.carc-h .lnk{flex:none;font-size:13.5px}
.carc-g{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:14px 16px;border-radius:14px;background:#faf7f2}
.carc-g>div{display:grid;gap:2px;min-width:0}
.carc-g small{color:var(--sub);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.carc-g b{font-size:16px;font-weight:650}
.carc-g span{color:var(--sub);font-size:13px;line-height:1.35}
.carc-g>div:last-child{text-align:right}
.carc-ar{display:grid;place-items:center;color:#b8ab99}
.carc-ar .ic{width:18px;height:18px}
.carc-f{display:flex;align-items:center;justify-content:space-between;gap:14px}
.carc-s{display:flex;align-items:center;gap:12px}
.carc-s .stp-b{width:36px;height:36px}
.carc-s span{min-width:62px;text-align:center;font-size:14px;color:var(--sub)}
.carc-s span b{color:var(--ink);font-size:18px;font-weight:650}
.carc-p{display:grid;justify-items:end;line-height:1.2}
.carc-p b{font-size:20px;font-weight:700;letter-spacing:-.01em}
.carc-p small{color:var(--sub);font-size:12.5px}
.carc-r{margin:-4px 0 0;color:var(--sub);font-size:13px}
@media(max-width:480px){.carc{padding:16px}.carc-g{grid-template-columns:1fr;gap:8px}.carc-ar{display:none}.carc-g>div:last-child{text-align:left}}
.carc-s .stp-b{background:#f4efe7;box-shadow:none}.carc-s .stp-b:disabled{opacity:.4;cursor:default}
/* you, among the travellers */
.ig-chip.ig-you{border-color:#d9cfc1;background:#fbf8f3}
.ig-chip.ig-you .ig-cb small{color:#0A6AAE;font-weight:600}
.ig-chip.add{gap:8px;padding:4px 14px 4px 10px;border:1.5px dashed #d2c7b7;background:none;color:var(--sub);font:inherit;cursor:pointer}
.ig-chip.add:hover{border-color:#0A6AAE;color:#0A6AAE}
.ig-chip.add>.ic{width:16px;height:16px}
.ig{margin-top:6px}
.tl-items{display:flex;flex-wrap:wrap;gap:6px 14px;margin:0;padding:0;list-style:none;font-size:13px;color:var(--ink)}
.tl-items li{display:inline-flex;align-items:center;gap:6px}
.tl-items .ic{width:13px;height:13px;color:#1f7a4d}
.tl-warn{margin:0;color:#b4532a;font-size:13px}
/* the split once the invites are out: one list, a row per person */
.shl{display:grid;gap:12px}
.shl-h{display:flex;justify-content:flex-end;margin-top:-30px}
.shl-st{display:inline-flex;align-items:center;gap:7px;height:30px;padding:0 12px;border-radius:999px;background:#eef5fb;color:#0A6AAE;font-size:13px;font-weight:500}
.shl-st b{font-variant-numeric:tabular-nums;font-weight:700}
.shl-st .ic{width:15px;height:15px}
.shl-st.ok{background:#e8f4ec;color:#1f7a4d}.shl-st.bad{background:#fbece6;color:#b4532a}
.shl-list{display:grid;border:1px solid #e7dfd3;border-radius:16px;background:#fff;overflow:hidden}
.shl-r{display:flex;align-items:center;gap:12px;padding:12px 16px;border-top:1px solid #f0e9df}
.shl-r:first-child{border-top:none}
.shl-r .av-img{width:40px;height:40px;font-size:13px}
.shl-lk{background:var(--soft,#f4efe7);color:var(--sub)}.shl-lk .ic{width:17px;height:17px}
.shl-who{display:grid;flex:1;min-width:0;line-height:1.25}
.shl-who b{font-size:14.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shl-who small{color:var(--sub);font-size:12.5px}
.shl-amt{font-weight:650;font-variant-numeric:tabular-nums;white-space:nowrap}
.shl-tag{display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 10px;border-radius:999px;background:#f4efe7;color:var(--ink);font-size:12.5px;font-weight:600;white-space:nowrap}
.shl-tag.ok{background:#e8f4ec;color:#1f7a4d}.shl-tag.dim{color:var(--sub);font-weight:500}
.shl-tag .ic{width:13px;height:13px}
.shl-copy{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border:1px solid #e7dfd3;border-radius:999px;background:#fff;color:var(--ink);font:500 12.5px var(--sans);cursor:pointer;white-space:nowrap}
.shl-copy:hover{border-color:#0A6AAE;color:#0A6AAE}
.shl-copy .ic{width:14px;height:14px}
.shl-fine{margin:0;color:var(--sub);font-size:12.5px}
.shl-go{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.shl-open{display:inline-flex;align-items:center;gap:6px}
.shl-open .ic{width:16px;height:16px}
.shl-cancel{color:#9a6a5a;font-size:13.5px}
.shl-cancel:hover{color:#b4532a}
@media(max-width:560px){.shl-h{margin-top:0;justify-content:flex-start}.shl-r{flex-wrap:wrap}.shl-who{flex-basis:calc(100% - 60px)}.shl-amt{margin-left:52px}}
.shl-copy{width:112px;justify-content:center}
.shl-gap{visibility:hidden;border-color:transparent}
.shl-tag{min-width:74px;justify-content:center}
/* several cars: one card, a block per car, the window of days, Add another car */
.carc-c{display:grid;gap:14px}
.carc-sep{height:1px;background:#efe8dd;margin:2px -20px}
.carc-x{color:#9a6a5a}
.carc-w{display:grid;gap:8px}
.carc-w>small{color:var(--sub);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.carc-wins{display:flex;flex-wrap:wrap;gap:8px}
.carc-win{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px;border:1px solid #e7dfd3;border-radius:999px;background:#fff;color:var(--ink);font:500 13px var(--sans);cursor:pointer;white-space:nowrap}
.carc-win i{font-style:normal;color:var(--sub)}
.carc-win:hover{border-color:#9fd3f7}
.carc-win.on{border-color:#0A6AAE;background:#f0f7fd;color:#0A6AAE;font-weight:600}
.carc-add{display:grid;gap:10px;justify-items:start}
.carc-more{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border:1.5px dashed #d2c7b7;border-radius:14px;background:none;color:var(--ink);font:600 14px var(--sans);cursor:pointer}
.carc-more small{color:var(--sub);font-weight:400;font-size:12.5px}
.carc-more .ic{width:16px;height:16px;color:#0A6AAE}
.carc-more:hover{border-color:#0A6AAE}
.carc-opts{display:grid;gap:8px;width:100%}
.carc-o{display:flex;align-items:center;gap:12px;width:100%;padding:8px 14px 8px 8px;border:1px solid #e7dfd3;border-radius:14px;background:#fff;text-align:left;font:inherit;color:var(--ink);cursor:pointer}
.carc-o:hover{border-color:#0A6AAE}
.carc-v.sm{width:48px;height:36px}.carc-v.sm .v3i{width:52px;height:52px;margin:-8px -2px}
/* the split before the invites: the same people rows, the amount on the right */
.shl-in{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 12px;border:1px solid #e7dfd3;border-radius:12px;background:#faf7f2}
.shl-in:focus-within{border-color:#0A6AAE;background:#fff}
.shl-in input{width:92px;border:none;background:none;outline:none;text-align:right;font:650 15px var(--sans);font-variant-numeric:tabular-nums;color:var(--ink)}
.shl-in span{color:var(--sub);font-size:12.5px}
.pay-l{margin-top:4px}
.pay-who{justify-self:start;font-size:13px}
/* Review: a line opened, its details */
.rvd{display:grid;gap:14px;margin:-2px 22px 14px 72px;padding:16px 18px;border:1px solid #ece4d8;border-radius:16px;background:#fbf9f5;animation:igIn .22s ease-out}
.rvd-f{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px 18px;margin:0}
.rvd-f>div{display:grid;gap:3px;min-width:0}
.rvd-f dt{color:var(--sub);font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.rvd-f dd{display:grid;margin:0;font-size:14px;font-weight:600;color:var(--ink);line-height:1.3}
.rvd-f dd small{color:var(--sub);font-size:12.5px;font-weight:400}
.rvd-x{display:flex;flex-wrap:wrap;gap:6px;padding-top:12px;border-top:1px solid #ece4d8}
.rvd-x span{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 11px;border-radius:999px;background:#fff;border:1px solid #e7dfd3;font-size:12.5px;color:var(--ink)}
.rvd-x .ic{width:12px;height:12px;color:#1f7a4d}
.rvd-w{display:flex;align-items:center;gap:8px;margin:0;padding:9px 12px;border-radius:10px;background:#fbefe7;color:#a4532a;font-size:13px}
.rvd-w .ic{width:15px;height:15px;flex:none}
.rvd-a{display:flex;justify-content:flex-end}
.rvd-a .lnk{display:inline-flex;align-items:center;gap:4px;font-size:13px}
.rvd-a .lnk .ic{width:13px;height:13px}
@media(max-width:560px){.rvd{margin:-2px 12px 12px}.rvd-f{grid-template-columns:1fr 1fr}}
/* the travel card: the same people rows, the amount on each card on the right, a switch for who gets one */
.pax2{display:grid;gap:10px}
.shl-r.off .shl-who b{color:var(--sub)}
.pax2-amt{display:grid;justify-items:end;gap:4px}
.pax2-amt small{color:var(--sub);font-size:12px}
.pax2-no{color:var(--sub);font-size:13px}
.pax2-sw{position:relative;flex:none;width:42px;height:24px;border:none;border-radius:999px;background:#ddd5c9;cursor:pointer;transition:background .2s}
.pax2-sw i{position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:transform .2s}
.pax2-sw.on{background:#0A6AAE}.pax2-sw.on i{transform:translateX(18px)}
/* the days with a car: a bar over the stay, dragged by its ends or its middle */
.cdr-l{color:var(--sub);font-size:14px}.cdr-l b{color:var(--ink);font-size:18px;font-weight:650}
.cdr{display:grid;gap:8px;padding:6px 12px 0;user-select:none;-webkit-user-select:none}
.cdr-track{position:relative;height:36px;border-radius:12px;background:#f1ece4;cursor:pointer;touch-action:none}
.cdr-tick{position:absolute;top:10px;bottom:10px;width:1px;margin-left:-.5px;background:#ddd4c6}
.cdr-tick:first-child,.cdr-tick:last-of-type{opacity:0}
.cdr-sel{position:absolute;top:0;bottom:0;border-radius:12px;background:linear-gradient(180deg,#e4effa,#d5e7f7);box-shadow:inset 0 0 0 1.5px #0A6AAE;cursor:grab;touch-action:none;transition:left .12s ease-out,width .12s ease-out}
body.cdr-on,body.cdr-on .cdr-sel{cursor:grabbing}
body.cdr-on .cdr-sel{transition:none}
.cdr-h{position:absolute;top:50%;width:22px;height:22px;margin-top:-11px;border-radius:50%;background:#fff;box-shadow:0 0 0 1.5px #0A6AAE,0 2px 6px rgba(10,106,174,.3);cursor:ew-resize;touch-action:none}
.cdr-h::after{content:"";position:absolute;inset:7px 9px;border-left:1.5px solid #0A6AAE;border-right:1.5px solid #0A6AAE}
.cdr-h.a{left:-11px}.cdr-h.b{right:-11px}
.cdr-h:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(10,106,174,.35),0 0 0 1.5px #0A6AAE}
.cdr-days{position:relative;height:30px}
.cdr-days span{position:absolute;transform:translateX(-50%);display:grid;justify-items:center;color:var(--sub);font-size:11.5px;line-height:1.2;white-space:nowrap}
.cdr-days span b{color:var(--ink);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.cdr-days span:first-child{transform:none;justify-items:start}.cdr-days span:last-child{transform:translateX(-100%);justify-items:end}
/* the travel card: tap someone to give them a card; each card a small dark card with the money on it */
.pax3-h{color:var(--sub);font-size:12.5px;margin-top:-4px}
.pax3{cursor:pointer;transition:background .15s}
.pax3:hover{background:#fbf9f5}
.pax3:focus-visible{outline:2px solid #0A6AAE;outline-offset:-2px}
.pax3-f{position:relative;flex:none;display:grid}
.pax3-f .av-img{width:44px;height:44px;transition:box-shadow .2s,opacity .2s}
.pax3.on .pax3-f .av-img{box-shadow:0 0 0 2px #fff,0 0 0 4px #0A6AAE}
.pax3-ck{position:absolute;right:-4px;bottom:-4px;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#0A6AAE;color:#fff;box-shadow:0 0 0 2px #fff;opacity:0;transform:scale(.5);transition:opacity .2s,transform .2s}
.pax3-ck .ic{width:12px;height:12px}
.pax3.on .pax3-ck{opacity:1;transform:none}
.pax3.off .pax3-f .av-img{opacity:.55}
.pax3.off .shl-who b{color:var(--sub)}
.pxc{display:grid;gap:2px;min-width:150px;padding:10px 14px;border-radius:14px;background:linear-gradient(135deg,#43434f,#2c2c35);color:#fff;box-shadow:0 8px 18px -10px rgba(30,30,40,.6);cursor:default}
.pxc-r{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.pxc-r small{color:#9fd3f7;font-size:11px;font-weight:700;letter-spacing:.1em}
.pxc-r input{width:90px;border:none;border-bottom:1px solid transparent;background:none;outline:none;text-align:right;color:#fff;font:700 22px var(--sans);font-variant-numeric:tabular-nums;letter-spacing:-.01em;padding:0}
.pxc-r input:focus{border-bottom-color:rgba(255,255,255,.5)}
.pxc-r input::placeholder{color:rgba(255,255,255,.35)}
.pxc em{font-style:normal;color:rgba(255,255,255,.6);font-size:12px;text-align:right}
.pxc.off{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:150px;height:56px;padding:0 14px;border:1.5px dashed #d2c7b7;background:none;color:var(--sub);box-shadow:none;font-size:13px;font-weight:500;cursor:pointer}
.pxc.off .ic{width:15px;height:15px}
.pax3:hover .pxc.off{border-color:#0A6AAE;color:#0A6AAE}
/* Review details, second pass: a small timeline, quiet tags, pills */
.rvd{gap:12px;background:#fff;border-color:#ece4d8;box-shadow:0 6px 18px -14px rgba(60,45,20,.35)}
.rvd-t{display:grid;grid-template-columns:minmax(0,1fr) minmax(90px,.8fr) minmax(0,1fr);align-items:center;gap:12px}
.rvd-e{display:grid;gap:2px;min-width:0}
.rvd-e.r{text-align:right}
.rvd-e b{font-size:20px;font-weight:700;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.rvd-e b sup{font-size:11px;color:var(--sub);margin-left:2px}
.rvd-e span{color:var(--sub);font-size:12.5px;line-height:1.3}
.rvd-m{display:grid;justify-items:center;gap:4px}
.rvd-ln{display:flex;align-items:center;width:100%;gap:6px}
.rvd-ln i{flex:1;height:0;border-top:1.5px dashed #cfc5b6}
.rvd-ic{display:grid;place-items:center;width:30px;height:30px}
.rvd-ic .v3i{width:36px;height:36px;margin:0}.rvd-ic>.ic{width:18px;height:18px;color:var(--sub)}
.rvd-m small{color:var(--sub);font-size:11.5px;white-space:nowrap}
.rvd-g{display:flex;flex-wrap:wrap;gap:6px}
.rvd-g span{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:8px;background:#f4efe7;color:var(--ink);font-size:12.5px}
.rvd-x{padding-top:0;border-top:none}
.rvd-cards{display:flex;flex-wrap:wrap;gap:10px}
.rvd-cc{min-width:170px;gap:4px}
.rvd-cn{color:rgba(255,255,255,.75);font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.pxc-r b{color:#fff;font-size:20px;font-weight:700;font-variant-numeric:tabular-nums}
@media(max-width:560px){.rvd-t{grid-template-columns:1fr 70px 1fr}.rvd-e b{font-size:17px}}
/* cars at a stop, third pass: the cars side by side, one timeline of the stay with a lane per car (the Day by day look) */
.cc-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.cct{position:relative;display:flex;align-items:center;gap:10px;min-width:0;padding:12px 12px 12px 16px;border:1px solid #e7dfd3;border-radius:16px;background:#fbf8f3;animation:igIn .25s ease-out}
.cct::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;border-radius:16px 0 0 16px;background:var(--tab)}
.cct-v{display:grid;place-items:center;flex:none;width:52px;height:40px}
.cct-v .v3i{width:58px;height:58px;margin:-9px -3px;filter:drop-shadow(0 3px 4px rgba(60,45,20,.18))}
.cct-b{display:grid;flex:1;min-width:0;line-height:1.25}
.cct-b b{font-size:14.5px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cct-b small{color:var(--sub);font-size:12px}
.cct-b em{font-style:normal;font-size:12.5px;font-weight:600;margin-top:4px;white-space:nowrap}
.cct-b i{font-style:normal;color:var(--sub);font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cct-p{display:grid;justify-items:end;flex:none;line-height:1.2}
.cct-p b{font-size:15px;font-weight:700;font-variant-numeric:tabular-nums}
.cct-p small{color:var(--sub);font-size:12px}
.cct-x{position:absolute;top:6px;right:6px;display:grid;place-items:center;width:22px;height:22px;border:none;border-radius:50%;background:none;color:var(--sub);cursor:pointer}
.cct-x:hover{background:#efe8dd;color:var(--ink)}
.cct-x .ic{width:12px;height:12px}
.cct-x.lnk{position:static;width:auto;height:auto;border-radius:0;font-size:12.5px;color:#0A6AAE;align-self:flex-start}
.cct:has(.cct-x:not(.lnk)) .cct-p{margin-right:18px}
.cct.add{justify-content:center;gap:10px;border:1.5px dashed #d2c7b7;background:none;font:inherit;color:var(--ink);cursor:pointer;min-height:78px}
.cct.add::before{display:none}
.cct.add>.ic{width:18px;height:18px;color:#0A6AAE;flex:none}
.cct.add span{display:grid;text-align:left;line-height:1.25}.cct.add b{font-size:14px}.cct.add small{color:var(--sub);font-size:12px}
.cct.add:hover{border-color:#0A6AAE}
.cdt{display:grid;gap:10px}
.cdt-hd{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap}
.cdt-hd small{color:var(--sub);font-size:12px}
.cdt-gr{display:grid;gap:8px;padding:12px 10px 14px;border:1px solid var(--line,#ece6dc);border-radius:20px;background:#fff;user-select:none;-webkit-user-select:none}
.cdt-h{display:grid;grid-template-columns:repeat(var(--n),1fr)}
.cdt-d{display:grid;justify-items:center;gap:2px;padding:7px 0 6px;margin:0 2px;border-radius:12px}
.cdt-d small{font:600 11px/1 var(--sans);letter-spacing:.04em;text-transform:uppercase;color:var(--sub)}
.cdt-d b{font:700 17px/1.1 var(--sans);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.cdt-d.we{background:var(--soft,#f4efe7)}
.cdt-l{position:relative;height:42px;border-radius:12px;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(100% / var(--n) - 1px),#f1ebe2 calc(100% / var(--n) - 1px),#f1ebe2 calc(100% / var(--n)));cursor:pointer;touch-action:none}
.cdt-b{--tab:#b8a48c;position:absolute;top:3px;bottom:3px;display:flex;align-items:center;min-width:0;border:1px solid #e2d8ca;border-radius:11px;background:#fbf8f3;box-shadow:0 1px 3px rgba(60,45,20,.08);overflow:hidden;cursor:grab;touch-action:none;transition:left .14s ease-out,width .14s ease-out,box-shadow .2s}
.cdt-b::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--tab)}
.cdt-l.drag .cdt-b,body.cdr-on .cdt-b{transition:none}
.cdt-l.drag .cdt-b{cursor:grabbing;box-shadow:0 6px 16px -6px rgba(60,45,20,.35)}
.cdt-b:hover{box-shadow:0 3px 10px -4px rgba(60,45,20,.3)}
.cdt-n{display:flex;align-items:baseline;gap:6px;flex:1;min-width:0;padding:0 4px;pointer-events:none}
.cdt-n b{font-size:13px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cdt-n small{color:var(--sub);font-size:11.5px;white-space:nowrap}
.cdt-g{position:relative;flex:none;width:14px;align-self:stretch;cursor:ew-resize}
.cdt-g::after{content:"";position:absolute;top:50%;left:50%;width:4px;height:14px;margin:-7px 0 0 -2px;border-left:1.5px solid #c4b8a6;border-right:1.5px solid #c4b8a6;opacity:.7;transition:opacity .15s}
.cdt-b:hover .cdt-g::after,.cdt-g:focus-visible::after{opacity:1;border-color:#8f8273}
.cdt-g.a{margin-left:4px}
.cdt-g:focus-visible{outline:none;background:rgba(10,106,174,.08)}
/* two options that lean: hover grows one and shrinks the other, the choice stays big in the primary colour */
.lean{display:flex;gap:10px;width:100%}
.lean-o{flex:1 1 0;min-width:0;height:96px;display:grid;align-content:center;justify-items:start;gap:5px;padding:0 22px;border:none;border-radius:18px;background:#f4efe7;color:var(--ink);font:inherit;text-align:left;cursor:pointer;overflow:hidden;transition:flex-grow .5s cubic-bezier(.3,1.4,.5,1),background-color .2s,color .2s,box-shadow .2s}
.lean-o b{font-size:21px;font-weight:650;letter-spacing:-.01em;white-space:nowrap}
.lean-o small{max-width:100%;color:var(--sub);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:opacity .25s,color .2s}
.lean-o:hover{background:#ece5da}
.lean:not(.set):has(.lean-o:hover) .lean-o{flex-grow:.55}
.lean:not(.set):has(.lean-o:hover) .lean-o:hover{flex-grow:1.45}
.lean:not(.set):has(.lean-o:hover) .lean-o:not(:hover) small{opacity:0}
.lean.set .lean-o{flex-grow:.55;color:var(--sub)}
.lean.set .lean-o:not(.on) small{opacity:0}
.lean.set .lean-o.on{flex-grow:1.45;background:#0A6AAE;color:#fff;box-shadow:0 12px 24px -16px rgba(10,106,174,.8)}
.lean.set .lean-o.on small{color:rgba(255,255,255,.82)}
.lean-o:focus-visible{outline:none;box-shadow:0 0 0 4px rgba(31,156,240,.45)}
@media(prefers-reduced-motion:reduce){.lean-o{transition:background-color .2s,color .2s}}
@media(max-width:480px){.lean-o{height:84px;padding:0 16px}.lean-o b{font-size:18px}}
/* selected: the blue fill only, no ring around it */
.op.on,.yn.on,.cal-sum.on,.stab.on,.fc.on,.pick{border-color:transparent!important;box-shadow:0 16px 30px -22px rgba(10,90,160,.5)}
.org-card.on{border-color:transparent;box-shadow:0 12px 26px -18px rgba(10,90,160,.45);background:var(--sel,#e4f1fb)}
.carc-win.on{border-color:transparent}
.ig-hint.top{margin:-6px 2px 0}
.ig-res:empty{display:none}
/* the flights: just the dates */
.fl-dts{margin:2px 0 6px}
.fl-dt{display:inline-flex;align-items:center;gap:10px;height:40px;padding:0 16px;border-radius:12px;background:#f4efe7;color:var(--ink)}
.fl-dt .ic{width:17px;height:17px;color:#0A6AAE}
.fl-dt b{font-size:15.5px;font-weight:650}
.fl-dt i{font-style:normal;color:var(--sub)}
/* the road from where you arrive to the hotel: a slim route line, not a card */
.rte{display:grid;grid-template-columns:minmax(0,auto) minmax(80px,1fr) minmax(0,auto);align-items:center;gap:14px;margin:2px 0 14px;padding:4px 2px}
.rte-e{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:10px;align-items:center;min-width:0}
.rte-e b{grid-column:2;font-size:15px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rte-e small{grid-column:2;color:var(--sub);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rte-e>i{grid-row:1 / span 2}
.rte-e.r{grid-template-columns:minmax(0,1fr) auto;text-align:right}
.rte-e.r b,.rte-e.r small{grid-column:1}.rte-e.r>i{grid-column:2}
.rte-a{width:12px;height:12px;border-radius:50%;background:#fff;box-shadow:0 0 0 3px #0A6AAE}
.rte-h{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#0A6AAE;color:#fff}
.rte-h .ic{width:15px;height:15px}
.rte-m{position:relative;display:grid;place-items:center;height:30px}
.rte-l{position:absolute;left:0;right:0;top:50%;border-top:2px dashed #b9cfe2}
.rte-m em{position:relative;padding:3px 10px;border-radius:999px;background:#faf8f5;color:var(--ink);font-style:normal;font-size:12.5px;font-weight:600;white-space:nowrap}
.rte.wait .rte-m em{color:var(--sub);font-weight:500}
.rte.wait .rte-l{animation:rteRun 1.2s linear infinite}
@keyframes rteRun{to{background-position:20px 0}}
@media(max-width:560px){.rte{grid-template-columns:1fr;gap:6px}.rte-m{height:22px}.rte-e.r{grid-template-columns:auto minmax(0,1fr);text-align:left}.rte-e.r b,.rte-e.r small{grid-column:2}.rte-e.r>i{grid-column:1}}
/* the details: room to breathe under the line they open from, and the same details in Trip details under the map */
.rvd{margin:10px 22px 20px 72px}
@media(max-width:560px){.rvd{margin:8px 12px 16px}}
.tt-d .rvd{margin:6px 0 12px 46px;box-shadow:none}
.tt-roll li{grid-template-columns:34px 1fr auto}
.tt-roll li .tt-d{grid-column:1 / -1}
/* the days with a car: day cells to drag across, each car's days one soft capsule in its colour */
.cdx{display:grid;gap:8px;padding:12px 14px 14px;border:1px solid var(--line,#ece6dc);border-radius:20px;background:#fff;user-select:none;-webkit-user-select:none}
.cdx-row{display:grid;grid-template-columns:118px minmax(0,1fr);align-items:center;gap:10px}
.cdx-h{display:grid;grid-template-columns:repeat(var(--n),1fr)}
.cdx-d{display:grid;justify-items:center;gap:2px;padding:6px 0 5px;margin:0 3px;border-radius:12px}
.cdx-d small{font:600 11px/1 var(--sans);letter-spacing:.04em;text-transform:uppercase;color:var(--sub)}
.cdx-d b{font:700 17px/1.1 var(--sans);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.cdx-d.we{background:var(--soft,#f4efe7)}
.cdx-lab{display:flex;align-items:center;gap:8px;min-width:0;font-size:13px;font-weight:600;color:var(--ink)}
.cdx-lab i{flex:none;width:10px;height:10px;border-radius:50%;background:var(--tab)}
.cdx-lab{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cdx-t{position:relative;display:grid;grid-template-columns:repeat(var(--n),1fr);height:48px;border-radius:14px;cursor:pointer;touch-action:none;outline:none}
.cdx-t:focus-visible{box-shadow:0 0 0 3px rgba(31,156,240,.4)}
.cdx-c{display:grid;place-items:center;margin:3px;border-radius:11px;background:#f6f2ec;color:transparent;transition:background .15s,color .15s}
.cdx-c .ic{width:15px;height:15px}
.cdx-t:hover .cdx-c{color:#c4b8a6}
.cdx-c:hover{background:#efe8dd;color:#8f8273!important}
.cdx-b{position:absolute;top:3px;bottom:3px;display:flex;align-items:center;justify-content:center;border-radius:11px;background:color-mix(in srgb,var(--tab) 26%,#fff);box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--tab) 70%,#fff),0 4px 12px -8px rgba(60,45,20,.45);pointer-events:none;transition:left .16s cubic-bezier(.3,1.3,.5,1),width .16s cubic-bezier(.3,1.3,.5,1)}
.cdx-t.drag .cdx-b{transition:left .08s ease-out,width .08s ease-out;box-shadow:inset 0 0 0 1.5px var(--tab),0 8px 20px -8px rgba(60,45,20,.5)}
.cdx-b b{font-size:13px;font-weight:650;color:color-mix(in srgb,var(--tab) 45%,#2a2730);white-space:nowrap}
.cdx-e{position:absolute;top:50%;width:4px;height:18px;margin-top:-9px;border-radius:2px;background:color-mix(in srgb,var(--tab) 75%,#fff)}
.cdx-e.a{left:7px}.cdx-e.b{right:7px}
.cdx-hr{margin-bottom:-2px}
@media(max-width:560px){.cdx-row{grid-template-columns:1fr}.cdx-hr>span{display:none}.cdx-lab{margin-bottom:-4px}}
/* Day by day: each stay a thin line between the journeys, the city and nights in small text on it */
.dd-b,.dd-b.c1,.dd-b.c2,.dd-b.c3{position:relative;align-self:stretch;height:auto;display:block;margin:0 22px;padding:0;border:none;border-radius:0;background:none;box-shadow:none;overflow:visible}
.dd-b::before{content:"";position:absolute;left:0;right:0;top:50%;width:auto;height:2px;margin-top:-1px;border-radius:2px;background:var(--tab);opacity:.85}
.dd-b b,.dd-b small{position:absolute;bottom:calc(50% + 6px);white-space:nowrap}
.dd-b b{left:50%;transform:translateX(calc(-100% - 3px));font-size:12.5px;font-weight:650;color:var(--ink)}
.dd-b small{left:50%;transform:translateX(3px);font-size:12px;color:var(--sub)}
@media(max-width:959px){.dd-b,.dd-b.c1,.dd-b.c2,.dd-b.c3{margin:0 20px}}
/* lean buttons, calmer: a little wider and a little taller, so the other option stays easy to reach */
.lean{align-items:center;min-height:110px}
.lean-o{transition:flex-grow .45s cubic-bezier(.3,1.3,.5,1),height .45s cubic-bezier(.3,1.3,.5,1),background-color .2s,color .2s,box-shadow .2s}
.lean:not(.set):has(.lean-o:hover) .lean-o{flex-grow:.85}
.lean:not(.set):has(.lean-o:hover) .lean-o:hover{flex-grow:1.15;height:108px}
.lean.set .lean-o{flex-grow:.85}
.lean.set .lean-o.on{flex-grow:1.15;height:108px}
.lean:not(.set):has(.lean-o:hover) .lean-o:not(:hover) small,.lean.set .lean-o:not(.on) small{opacity:1}
@media(max-width:480px){.lean{min-height:98px}.lean:not(.set):has(.lean-o:hover) .lean-o:hover,.lean.set .lean-o.on{height:94px}}
/* the journey between two cities: grab it and drag it along the days */
.dd-m.drag{cursor:grab;touch-action:none;transition:transform .15s}
.dd-m.drag:hover{transform:translateY(-2px) scale(1.06)}
.dd-m.drag.on,body.cdr-on .dd-m.drag{cursor:grabbing}
.dd-m.drag.on{transform:translateY(-3px) scale(1.1)}
.dd-m.drag:focus-visible{outline:none;border-radius:12px;box-shadow:0 0 0 3px rgba(31,156,240,.4)}
.dd-m.drag::after{content:"";position:absolute;bottom:-6px;left:50%;width:18px;height:3px;margin-left:-9px;border-radius:2px;background:#cbbfae;opacity:0;transition:opacity .15s}
.dd-m.drag{position:relative}
.dd-m.drag:hover::after,.dd-m.drag.on::after{opacity:1}
/* the car timeline: the Day by day look; a car to drag at each pick-up, a small ring at a free return */
.cdl-g{row-gap:10px}
.cdl-m,.cdl-e{cursor:grab;touch-action:none;transition:transform .15s}
.cdl-m:hover,.cdl-e:hover{transform:translateY(-2px) scale(1.06)}
.cdl-m.on,.cdl-e.on,body.cdr-on .cdl-m,body.cdr-on .cdl-e{cursor:grabbing}
.cdl-m:focus-visible,.cdl-e:focus-visible{outline:none;border-radius:12px;box-shadow:0 0 0 3px rgba(31,156,240,.4)}
.cdl-e{width:22px!important;height:22px!important}
.cdl-e i{display:block;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 0 0 2.5px var(--tab),0 2px 5px rgba(60,45,20,.18)}
.cdl-add{justify-self:start;display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border:1.5px dashed #d2c7b7;border-radius:12px;background:none;color:var(--ink);font:600 13.5px var(--sans);cursor:pointer}
.cdl-add .ic{width:15px;height:15px;color:#0A6AAE}
.cdl-add:hover{border-color:#0A6AAE}
.cdl-g .dd-b .cdl-l{position:absolute;left:4px;right:4px;bottom:calc(50% + 6px);display:flex;justify-content:center;align-items:baseline;gap:5px;min-width:0}
.cdl-g .dd-b .cdl-l b,.cdl-g .dd-b .cdl-l small{position:static;transform:none;bottom:auto;left:auto}
.cdl-g .dd-b .cdl-l b{min-width:0;overflow:hidden;text-overflow:ellipsis}
.cdl-g .dd-b .cdl-l small{flex:none}
.days-g{position:relative}
/* the ride back: a heading that reads as the next part of the step */
.bk-hd{display:flex;align-items:center;gap:14px;margin:30px 0 4px;padding-top:22px;border-top:1px solid #ece4d8}
.bk-ic{display:grid;place-items:center;flex:none;width:56px;height:56px;border-radius:16px;background:#f4efe7}
.bk-ic .v3i{width:64px;height:64px;margin:0}.bk-ic>.ic{width:24px;height:24px;color:#0A6AAE}
.bk-k{display:block;color:#0A6AAE;font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.bk-hd .bk-h{margin:2px 0 0;font-size:28px;font-weight:700;letter-spacing:-.025em;line-height:1.15}
@media(max-width:560px){.bk-hd .bk-h{font-size:23px}}
.days-tip{display:flex;align-items:center;gap:8px;margin:2px 4px 0;color:var(--sub);font-size:13px}
.days-tip .ic{width:14px;height:14px;color:#0A6AAE;flex:none}
.bk-hd{border-top:none;padding-top:6px;margin-top:22px}
/* who drives each car: the people on the trip to pick from, and what their age means */
.drv{display:grid;gap:12px}
.drv-r{display:grid;gap:8px;padding:12px 14px;border:1px solid #ece4d8;border-radius:16px;background:#fbf9f5}
.drv-car{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:650}
.drv-car i{width:10px;height:10px;border-radius:50%;background:var(--tab)}
.drv-ppl{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.drv-p{display:inline-flex;align-items:center;gap:8px;padding:4px 12px 4px 4px;border:1px solid #e7dfd3;border-radius:999px;background:#fff;color:var(--ink);font:500 13px var(--sans);cursor:pointer;transition:background .15s,box-shadow .15s}
.drv-p .av-img{width:28px;height:28px;font-size:10.5px}
.drv-p:hover{border-color:#cfc5b6}
.drv-p.on{border-color:transparent;background:var(--sel,#e4f1fb);color:#0B4F80;font-weight:650}
.drv-age{display:inline-flex;align-items:center;gap:8px;margin-left:4px;font-size:12.5px;color:var(--sub)}
.drv-age select{height:34px;padding:0 10px;border:1px solid #e7dfd3;border-radius:10px;background:#fff;color:var(--ink);font:500 13px var(--sans)}
.drv-note{margin:0;font-size:12.5px;color:var(--sub)}
.drv-note.young{color:#8a5a10}
.drv-note.no{color:#b4532a;font-weight:600}
.drv-note.need{color:#0A6AAE}
.csum-top{margin:2px 0 14px}
.days-g{padding-top:30px}
.days-tip{margin:-2px 4px 2px}
/* a span of days (flights out and back, a hotel's check in and out): two dates and a dashed line between */
.spn{display:grid;grid-template-columns:auto minmax(60px,1fr) auto;align-items:center;gap:16px;margin:4px 0 18px;max-width:560px}
.spn-e{display:grid;gap:1px;line-height:1.15}
.spn-e.r{text-align:right}
.spn-e small{color:#0A6AAE;font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.spn-e b{font-size:24px;font-weight:700;letter-spacing:-.025em;font-variant-numeric:tabular-nums}
.spn-e span{color:var(--sub);font-size:12.5px}
.spn-m{display:flex;align-items:center;gap:8px;min-width:0}
.spn-m i{flex:1;border-top:1.5px dashed #c9bfb1}
.spn-m em{flex:none;padding:4px 11px;border-radius:999px;background:#f2ede6;color:var(--ink);font-style:normal;font-size:12.5px;font-weight:600;white-space:nowrap}
.spn:not(:has(.spn-m)){grid-template-columns:auto}
@media(max-width:480px){.spn-e b{font-size:20px}.spn{gap:10px}}
.stabs + .spn{margin-top:-26px}
.spn{margin-bottom:10px}
/* a car's options in its tile: driver, extra drivers, insurance, extras, as dropdowns */
.cc-row{grid-template-columns:1fr}
.cct{flex-wrap:wrap}
.cct-o{display:grid;gap:4px;width:100%;margin-top:12px;padding-top:14px;border-top:1px solid #ece4d8}
.cct-f{display:grid;gap:4px;min-width:150px}
.cct-f.sm{min-width:130px}
.cct-f>span,.cct-dd summary span{color:var(--sub);font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.cct-f select{height:38px;padding:0 30px 0 12px;border:1px solid #e2d8ca;border-radius:11px;background:#fff;color:var(--ink);font:500 13px var(--sans);max-width:300px}
.cct-dd{position:relative}
.cct-dd summary{display:grid;gap:4px;list-style:none;cursor:pointer}
.cct-dd summary::-webkit-details-marker{display:none}
.cct-dd summary b{display:flex;align-items:center;height:38px;padding:0 30px 0 12px;border:1px solid #e2d8ca;border-radius:11px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23736b60' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 11px center;font:500 13px var(--sans);color:var(--ink);white-space:nowrap;max-width:240px;overflow:hidden;text-overflow:ellipsis}
.cct-dd[open] summary b{border-color:#0A6AAE}
.cct-pop{position:absolute;z-index:20;top:calc(100% + 6px);left:0;min-width:240px;display:grid;gap:2px;padding:8px;border:1px solid #e7dfd3;border-radius:14px;background:#fff;box-shadow:0 14px 30px -14px rgba(40,30,15,.35)}
.cct-ck{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;cursor:pointer;font-size:13.5px}
.cct-ck:hover{background:#f6f2ec}
.cct-ck input{width:16px;height:16px;accent-color:#0A6AAE}
.cct-ck span{flex:1}
.cct-ck em{font-style:normal;color:var(--sub);font-size:12px}
.cct-o .drv-note{flex-basis:100%}

/* a journey you aren't booking: how you're coming (own flight, train, own car, already there) and, optionally, when */
.ownw{display:grid;gap:10px;margin:6px 0 18px}
.ownw-o{display:grid;grid-template-columns:repeat(auto-fit,minmax(112px,1fr));gap:8px}
.ownw-b{display:flex;align-items:center;gap:10px;min-height:52px;padding:8px 14px 8px 10px;border:none;border-radius:14px;background:#f4efe7;color:var(--ink);font:500 14px var(--sans);text-align:left;cursor:pointer;transition:background-color .2s,color .2s,box-shadow .2s}
.ownw-b:hover{background:#ece5d9}
.ownw-b.on{background:#0A6AAE;color:#fff;box-shadow:0 10px 20px -14px rgba(10,106,174,.8)}
.ownw-i{flex:none;width:32px;height:32px;display:grid;place-items:center;overflow:hidden}
.ownw-i .ic{width:20px;height:20px}
.ownw-ts{display:flex;flex-wrap:wrap;gap:10px}
.ownw-t{display:grid;gap:4px;padding:8px 12px;border-radius:12px;background:#f4efe7;min-width:170px}
.ownw-t small{color:var(--sub);font-size:12px}
.ownw-t input{border:none;background:transparent;font:600 16px var(--sans);color:var(--ink);padding:0}
.ownw-in{justify-self:start;margin:2px 0 10px}
.ownw-skip{margin-top:10px}

/* the options on a rental car: four even fields in a grid, each a label, one control and a quiet line under it */
.cco-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 12px}
.cct-o .drv-note .lnk{font-size:inherit;font-weight:600}
.cco-f{display:grid;gap:6px;min-width:0}
.cco-l{color:var(--sub);font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.cco-h{min-height:15px;color:var(--sub);font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cco-s{display:block;min-width:0}
.cco-s select,.cco-dd summary{width:100%;height:42px;padding:0 34px 0 14px;border:1px solid #e2d8ca;border-radius:12px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23736b60' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center;color:var(--ink);font:500 13.5px var(--sans);-webkit-appearance:none;appearance:none;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:border-color .15s,box-shadow .15s}
.cco-s select:hover,.cco-dd summary:hover{border-color:#cbbfae}
.cco-s select:focus-visible,.cco-dd[open] summary{outline:none;border-color:#0A6AAE;box-shadow:0 0 0 3px rgba(10,106,174,.12)}
.cco-dd{position:relative;min-width:0}
.cco-dd summary{display:flex;align-items:center;list-style:none}
.cco-dd summary::-webkit-details-marker{display:none}
.cco-pop{position:absolute;z-index:40;top:calc(100% + 6px);left:0;width:max(100%,250px);display:grid;gap:2px;padding:6px;border:1px solid #e7dfd3;border-radius:14px;background:#fff;box-shadow:0 18px 36px -16px rgba(40,30,15,.38);animation:ccoIn .16s ease-out}
.cco-f:nth-child(even) .cco-pop{left:auto;right:0}
@keyframes ccoIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.cco-ck{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:10px;cursor:pointer;font-size:13.5px}
.cco-ck:hover{background:#f6f2ec}
.cco-ck input{flex:none;width:16px;height:16px;margin:0;accent-color:#0A6AAE}
.cco-ck span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cco-ck em{flex:none;font-style:normal;color:var(--sub);font-size:12px}
.cct-o .drv-note{margin-top:2px}

/* on a phone the floating Confirm/Pay sits on a soft fade of the page, so the line under it reads as passing beneath
   it (not as a stray "Change" peeking out) */
@media(max-width:760px){
  .ok-float{margin:4px calc(-1 * clamp(20px,3.4vw,44px)) 0;padding:26px 16px 10px;background:linear-gradient(to bottom,transparent,var(--bg) 50%)}
  .ok-float::after{content:"";position:absolute;left:0;right:0;top:100%;height:48px;background:var(--bg);pointer-events:none}
  .ok-float.lazy:not(.show)::after{display:none}
}

/* cancelling a trip while planning: the light sheet of the planner, the destructive choice in red, keep in plain */
.plcx .lead{margin:0 0 22px;color:var(--sub);font-size:14.5px;line-height:1.55}
.plcx .sheet-a{display:flex;flex-wrap:wrap;gap:10px}
.plcx .btn{border-radius:12px;font:600 14.5px var(--sans);padding:12px 20px}
.plcx .btn.cx-go{background:#b4442d;color:#fff;border:none;box-shadow:none!important}
.plcx .btn.cx-go:hover{background:#9c3824}
.plcx .btn.cx-keep{background:#fff;color:var(--ink);border:1px solid var(--line2);box-shadow:none!important}
.plcx .btn.cx-keep:hover{border-color:#cbbfae}

/* your date of birth asked right at the rental car, when it's missing */
.cco-dob{display:grid;gap:6px;margin-top:6px;padding:12px 14px;border-radius:12px;background:#eef5fb;max-width:360px}
.cco-dob input{height:42px;padding:0 12px;border:1px solid #c9dcec;border-radius:10px;background:#fff;color:var(--ink);font:500 14px var(--sans)}
.cco-dob input:focus{outline:none;border-color:#0A6AAE;box-shadow:0 0 0 3px rgba(10,106,174,.14)}
.cco-dob.nudge,.drv-note.nudge{animation:nudge .45s cubic-bezier(.36,.07,.19,.97)}

/* notices while planning: the planner's own type and colours, not the old dark serif */
body.home .toast{font-family:'Suisse Intl','Helvetica Neue',Helvetica,'Inter',Arial,sans-serif;font-size:13.5px;font-weight:500;background:#393946;color:#fff;box-shadow:0 14px 30px -14px rgba(20,20,30,.45)}

/* the end of the Review ticket: the trip's total, any saving, then what you pay on its own line, in the accent */
.tk-sum{display:grid;gap:10px;padding:18px 22px 20px}
.tk-sr{display:flex;align-items:baseline;justify-content:space-between;gap:14px}
.tk-sr>span:first-child{display:grid;gap:2px;color:var(--sub);font-size:13.5px;font-weight:600}
.tk-sr small{color:var(--sub);font-size:12px;font-weight:400}
.tk-sv{display:flex;align-items:baseline;gap:10px}
.tk-sv b{font-size:22px;font-weight:700;letter-spacing:-.015em;font-variant-numeric:tabular-nums;color:var(--ink)}
.tk-sv .was{color:var(--sub);font-size:13px}
.tk-sr.tk-sav em{font-style:normal;color:#2f7d4f;font-size:13.5px;font-weight:650}
.tk-sr.tk-me{margin-top:4px;padding-top:14px;border-top:1px dashed #e2d8ca;align-items:center}
.tk-sr.tk-me>span:first-child{color:var(--ink);font-size:16px;font-weight:700}
.tk-sr.tk-me>b{font-size:30px;font-weight:750;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:#0A6AAE}

/* the money at the end of Review, in the split card (or a card of its own): total, saving, then what you pay */
.shr-in .tk-sum{padding:2px 0 16px;margin-bottom:14px;border-bottom:1px solid #ece4d8}
.shr-in.tk-pay .tk-sum{padding-bottom:2px;margin-bottom:0;border-bottom:none}
.shr-in.tk-pay{margin-bottom:12px}
.pay-sum:empty{display:none}

/* the day strip: the box grows with the days (never cut through), long stays get narrower days and scroll inside it */
.days-g{width:100%;min-width:min-content;box-sizing:border-box}
.days-g.dense .dd-d{margin:0 1px;padding:7px 0 6px}
.days-g.dense .dd-d b{font-size:15px}
.days-g.dense .dd-d small{font-size:9.5px;letter-spacing:0}

/* a Review line's details: always there, folded to no height; opening animates the height, the content fades in */
.rvdx-w{display:grid;grid-template-rows:0fr;transition:grid-template-rows .32s cubic-bezier(.2,.8,.2,1)}
.rvdx-w.open{grid-template-rows:1fr}
.rvdx-c{min-height:0;overflow:hidden}
.rvdx-w .rvd{animation:none;opacity:0;transform:translateY(-6px);transition:opacity .22s ease,transform .32s cubic-bezier(.2,.8,.2,1)}
.rvdx-w.open .rvd{opacity:1;transform:none;transition-delay:.06s}
.tl-chev{transition:transform .3s cubic-bezier(.2,.8,.2,1)}
@media(prefers-reduced-motion:reduce){.rvdx-w,.rvdx-w .rvd{transition:none}}

/* in the split card: the total opens it, You pay closes it (just above Create the invites) */
.shr-in .tk-sum.tk-sum-me{padding:14px 0 16px;margin:12px 0 0;border-top:1px solid #ece4d8;border-bottom:none}
.shr-in .tk-sum-me .tk-sr.tk-me{margin-top:0;padding-top:0;border-top:none}

/* every line that joins two things (two dates, two places, two times, a timeline) is the same straight blue line as the
   Review timeline: solid, never dotted or dashed */
.spn-m i,.rvd-ln i,.rt2-l i{border-top:2px solid rgba(31,156,240,.4)}
.tk-line i{border-top:2px solid rgba(124,199,247,.6)}
.rte-l{border-top:2px solid rgba(31,156,240,.4)}
.itn li.lg::before{border-left:2px solid rgba(31,156,240,.4)}
.lx-l i{background:rgba(31,156,240,.4)}
.tk-sr.tk-me{border-top-style:solid;border-top-color:#ece4d8}
.tname input,.ppl input{border-bottom-style:solid;border-bottom-color:rgba(31,156,240,.4)}

/* the two-way choices (Return / One way, Business / Personal): chosen in the app's own light blue */
.lean.set .lean-o.on{background:#1F9CF0;box-shadow:0 12px 24px -16px rgba(31,156,240,.85)}
.lean.set .lean-o.on small{color:rgba(255,255,255,.88)}

/* your child in the split: no share of their own, no link */
.shl-kid{justify-self:end;padding:8px 12px;border-radius:10px;background:#eef6fd;color:#0A6AAE;font-size:12.5px;font-weight:600;white-space:nowrap}
.ig-kids{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 10px}

/* the date picker (datepick.js): a field like the app's others, and a calendar like the planner's */
.dpk{position:relative;display:block;min-width:0}
.dpk-b{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;height:46px;padding:0 14px;border:1px solid #e2d8ca;border-radius:12px;background:#fff;color:var(--ink);font:500 14.5px var(--sans);text-align:left;cursor:pointer;box-sizing:border-box;transition:border-color .15s,box-shadow .15s}
.dpk-b span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.dpk-b span.ph{color:#9a948a}
.dpk-b .ic{flex:none;width:18px;height:18px;color:#8a8478}
.dpk-b:hover{border-color:#cbbfae}
.dpk.on .dpk-b,.dpk-b:focus-visible{outline:none;border-color:#1F9CF0;box-shadow:0 0 0 3px rgba(31,156,240,.15)}
.dpk.on .dpk-b .ic{color:#1F9CF0}
.cco-dob .dpk-b{height:42px;border-color:#c9dcec}
.dpk-pop{position:fixed;z-index:300;width:304px;padding:14px 14px 12px;border:1px solid #ece6dc;border-radius:18px;background:#fff;box-shadow:0 24px 50px -20px rgba(30,25,15,.35);animation:dpkIn .18s cubic-bezier(.2,.8,.2,1);font-family:'Suisse Intl','Helvetica Neue',Helvetica,'Inter',Arial,sans-serif;color:#393946}
@keyframes dpkIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.dpk-h{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:10px}
.dpk-nav{display:grid;place-items:center;width:32px;height:32px;border:none;border-radius:50%;background:#f4efe7;color:#393946;cursor:pointer;transition:background-color .15s}
.dpk-nav:hover:not([disabled]){background:#eaf5fe;color:#0A6AAE}.dpk-nav[disabled]{opacity:.3;cursor:default}
.dpk-sel{display:flex;gap:6px}
.dpk-sel select{height:32px;padding:0 26px 0 10px;border:1px solid #e7dfd3;border-radius:10px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%23736b60' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 9px center;-webkit-appearance:none;appearance:none;color:#393946;font:600 13.5px inherit;font-family:inherit;cursor:pointer}
.dpk-sel select:focus{outline:none;border-color:#1F9CF0}
.dpk-w,.dpk-g{display:grid;grid-template-columns:repeat(7,1fr)}
.dpk-w span{padding:4px 0 6px;text-align:center;color:#8a8478;font-size:11.5px;font-weight:600}
.dpk-g{row-gap:2px}
.dpk-g button{height:38px;padding:0;border:none;background:none;color:#393946;font:500 14px inherit;font-family:inherit;font-variant-numeric:tabular-nums;cursor:pointer}
.dpk-g button b{display:grid;place-items:center;width:36px;height:36px;margin:auto;border-radius:50%;font-weight:inherit;transition:background-color .15s,color .15s}
.dpk-g button:hover:not([disabled]) b,.dpk-g button:focus-visible b{background:#eef6fd;color:#0A6AAE}
.dpk-g button:focus{outline:none}
.dpk-g button.t b{box-shadow:inset 0 0 0 1.5px #1F9CF0}
.dpk-g button.sel b{background:#1F9CF0;color:#fff;font-weight:650;box-shadow:0 6px 14px -8px rgba(31,156,240,.9)}
.dpk-g button[disabled]{color:#c9c2b6;cursor:default}
.dpk-f{display:flex;justify-content:flex-end;margin-top:6px}
.dpk-clear{border:none;background:none;color:#8a8478;font:600 13px inherit;font-family:inherit;cursor:pointer}.dpk-clear:hover{color:#b4442d}

/* a username field like Instagram's: no @ in front; a mark inside on the right says free (✓), taken (✗) or checking */
.un-f{position:relative;display:block}
.au-un.un-f input{padding-left:14px!important;padding-right:44px!important}
.un-st{position:absolute;right:14px;top:50%;display:grid;place-items:center;width:20px;height:20px;margin-top:-10px;border-radius:50%;opacity:0;transform:scale(.6);transition:opacity .2s,transform .25s cubic-bezier(.2,.8,.2,1),background-color .2s;pointer-events:none}
.un-st.ok,.un-st.bad,.un-st.wait{opacity:1;transform:none}
.un-st.ok{background:#2f9e5f}
.un-st.ok::after{content:'';width:9px;height:5px;margin-top:-2px;border:solid #fff;border-width:0 0 2px 2px;transform:rotate(-45deg)}
.un-st.bad{background:#d0603f}
.un-st.bad::before,.un-st.bad::after{content:'';position:absolute;width:10px;height:2px;border-radius:1px;background:#fff;transform:rotate(45deg)}
.un-st.bad::after{transform:rotate(-45deg)}
.un-st.wait{border:2px solid #d9e8f5;border-top-color:#1F9CF0;animation:unSpin .8s linear infinite}
@keyframes unSpin{to{transform:rotate(360deg)}}
/* names as in the passport: a warning, not a footnote */
.au-warn{display:flex;gap:9px;align-items:flex-start;margin:-2px 0 2px;padding:10px 12px;border:1px solid #f1d3a2;border-radius:12px;background:#fff8ec;color:#7a5a2a;font-size:12.5px;line-height:1.45}
.au-warn .ic{flex:none;width:16px;height:16px;margin-top:1px;color:#c77a12}
.au-warn b{color:#5c3f10}

/* your details for the tickets, in Review: the planner's label, a warning, the fields, and Save to my profile */
.trv{margin:16px 0 14px}
.trv.open{display:grid;gap:12px;padding:20px;border:1px solid #ebe5e0;border-radius:20px;background:#fff}
.trv-sub{margin:-4px 0 0;color:var(--sub);font-size:13.5px}
.trv .au-warn{margin:0}
.trv-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 14px}
.trv-f{display:grid;gap:6px;min-width:0}.trv-f.wide{grid-column:1 / -1}
.trv-f>span:first-child{font-size:13px;font-weight:600;color:var(--ink)}
.trv-f input,.trv-ph select,.trv .dpk-b{width:100%;height:46px;padding:0 14px;border:1px solid #ebe5e0;border-radius:14px;background:#fff;color:var(--ink);font:500 14.5px var(--sans);box-sizing:border-box}
.trv-f input:focus,.trv-ph select:focus{outline:none;border-color:#1F9CF0;box-shadow:0 0 0 3px rgba(31,156,240,.14)}
.trv-f input.miss,.trv .dpk-b.miss{border-color:#d0603f;box-shadow:0 0 0 3px rgba(208,96,63,.14)}
.trv-ph{display:grid;grid-template-columns:116px minmax(0,1fr);gap:8px}
.trv-ph select{-webkit-appearance:none;appearance:none;padding-right:28px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23736b8c' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center}
.trv-sw{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:14px;background:#f4efe7;cursor:pointer}
.trv-sw span:first-child{display:grid;gap:1px}.trv-sw b{font-size:14px}.trv-sw small{color:var(--sub);font-size:12.5px}
@media(max-width:560px){.trv-g{grid-template-columns:minmax(0,1fr)}}
.trv .ax-sw i{background:#ddd5c9}.trv .ax-sw input:checked+i{background:#1F9CF0}
.trv-kid{display:grid;gap:10px;padding:14px;border-radius:16px;background:#faf8f5}
.trv-kh{display:flex;align-items:baseline;gap:10px}.trv-kh b{font-size:15px}.trv-kh small{color:var(--sub);font-size:12.5px}