/* Latus interactive demo — a working recreation of the app's own screens.
   Every value here comes from the Kotlin/Compose source (ui/theme/Color.kt,
   ui/components/LatusUI.kt, ui/components/LatusShell.kt and the screen files):
   1dp = 1px on a 393px-wide stage, the reference width the app is authored
   against. Scoped under .lx so nothing reaches the marketing page. */

.lx{
  /* palette — ui/theme/Color.kt, light theme */
  --p:#00A0C4;          /* Teal / primary            */
  --p2:#02718C;         /* TealDeep                  */
  --accent:#FFB703;     /* accent (amber)            */
  --gold:#FEE440;
  --good:#1FA97B;
  --ai:#48CAE4;         /* LatusAiA                  */
  --danger:#D14A3A;
  --page:#F1FAEE;       /* SandBg                    */
  --card:#fff;
  --surf2:#E4F4F7;      /* Surface2L                 */
  --surf3:#F7FCFA;
  --ink:#023047;
  --ink2:#4A6B7C;
  --ink3:#8AA5B2;       /* outline                   */
  --line:rgba(2,48,71,.09);
  --p-14:rgba(0,160,196,.14);
  --p-12:rgba(0,160,196,.12);
  --p-10:rgba(0,160,196,.10);
  --p-08:rgba(0,160,196,.08);
  --p-06:rgba(0,160,196,.06);
  --hero:linear-gradient(to bottom right,#00B4DB,#02718C);
  --ai-brush:linear-gradient(to bottom right,#48CAE4,#FEE440);
  --e1:0 1px 2px rgba(22,44,40,.06);
  --e2:0 1px 3px rgba(22,44,40,.07);
  --e3:0 2px 6px rgba(22,44,40,.10);
  --e6:0 4px 12px rgba(22,44,40,.10);
  --e7:0 7px 18px rgba(22,44,40,.10);
  --ease:cubic-bezier(.2,0,0,1);
  --lx-w:393px;--lx-h:840px;--k:1;
  display:flex;flex-direction:column;align-items:center;gap:14px}

/* ---------- frame ---------- */
.lx-frame{position:relative;flex:0 0 auto;padding:9px;background:#0b0f12;
  width:calc(var(--lx-w) * var(--k) + 18px);height:calc(var(--lx-h) * var(--k) + 18px);
  border-radius:calc(38px * var(--k) + 9px);box-shadow:0 24px 60px rgba(2,48,71,.22)}
.lx-stage{width:var(--lx-w);height:var(--lx-h);transform:scale(var(--k));transform-origin:top right;
  border-radius:38px;overflow:hidden;background:var(--page);color:var(--ink);
  font-family:Rubik,system-ui,sans-serif;font-size:14px;line-height:1.2;font-weight:400;
  position:relative;display:flex;flex-direction:column;text-align:right;-webkit-font-smoothing:antialiased}
.lx-stage :where(*){box-sizing:border-box;margin:0;padding:0}
.lx-stage :where(button){font:inherit;color:inherit;background:none;border:none;cursor:pointer;text-align:inherit;display:block}
.lx-stage .ms{line-height:1;flex:0 0 auto;font-variation-settings:'FILL' 1,'wght' 400,'GRAD' 0,'opsz' 24}
/* a weight other than 400 makes the browser synthesise the face and the icon
   ligature stops forming, so pin it above any descendant rule. */
.lx-stage .ms.material-symbols-rounded{font-weight:400;letter-spacing:normal;font-style:normal;color:inherit}
.lx-stage .ms.o{font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24}
/* AutoMirrored icons flip under RTL; content_copy also flips vertically */
.lx-stage .ms.mir{transform:scaleX(-1)}
.lx-stage .ms.cpy{transform:scaleY(-1)}
.lx-stage .ltr{direction:ltr;unicode-bidi:isolate}
.lx-press{transition:transform .14s var(--ease)}
.lx-press:active{transform:scale(.97)}

/* ---------- system bar ---------- */
.lx-sys{flex:0 0 auto;height:30px;display:flex;align-items:center;justify-content:space-between;
  padding:0 20px;font-size:13px;font-weight:600;color:var(--ink)}
.lx-sys .r{display:flex;align-items:center;gap:5px}
.lx-sys .sig{display:flex;gap:2px;align-items:flex-end}
.lx-sys .sig i{display:block;width:3px;background:var(--ink);border-radius:1px}
.lx-sys .sig i:nth-child(1){height:4px}.lx-sys .sig i:nth-child(2){height:6px}
.lx-sys .sig i:nth-child(3){height:8px}.lx-sys .sig i:nth-child(4){height:10px}
.lx-sys .bat{width:22px;height:11px;border:1.5px solid var(--ink);border-radius:3px;position:relative;opacity:.9}
.lx-sys .bat::after{content:"";position:absolute;inset:2px;left:5px;background:var(--ink);border-radius:1px}

/* ---------- top bar (LatusShell.LatusTopBar) ---------- */
.lx-bar{flex:0 0 auto;min-height:48px;display:flex;align-items:center;padding:2px 10px 6px}
.lx-bar .logo{width:34px;height:34px;border-radius:11px;background:var(--hero);color:#fff;
  display:grid;place-items:center;flex:0 0 auto}
.lx-bar .logo img{display:block;width:22px;height:22px}
.lx-bar .back{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;color:var(--ink2);flex:0 0 auto}
.lx-bar .back .ms{font-size:22px}
.lx-bar h2{font-size:21px;font-weight:700;padding-inline-start:4px;white-space:nowrap}
.lx-bar .sub{font-size:11.5px;font-weight:400;color:var(--ink2);padding-inline-start:4px;margin-top:2px}
.lx-bar .grow{flex:1 1 auto}
.lx-phase{display:inline-flex;align-items:center;gap:4px;border-radius:50px;background:var(--p-12);
  color:var(--p);padding:6px 8px 6px 6px;font-size:12.5px;font-weight:700;margin-inline-start:8px;flex:0 0 auto}
.lx-phase .ms{font-size:13px}
.lx-tap{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;color:var(--ink2);flex:0 0 auto}
.lx-tap .ms{font-size:22px}
.lx-tap.tonal{background:var(--surf2);color:var(--p)}
.lx-tap.amber{background:#FFEBC2;color:#3A2600}

/* ---------- scroll body ---------- */
.lx-body{flex:1 1 auto;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;
  padding:4px 16px 20px;display:flex;flex-direction:column;gap:14px}
.lx-body::-webkit-scrollbar{display:none}
/* the body is a column flex container: keep every child at its natural height
   instead of letting flexbox squash it when the page overflows. */
.lx-body>*{flex:0 0 auto}
.lx-body.nav{padding-bottom:112px}
.lx-body.p16{padding:16px;gap:16px}
.lx-body.p16.nav{padding-bottom:112px}
.lx-body.doors{padding:24px;gap:14px}
.lx-body.g10{gap:10px}

/* ---------- bottom nav ---------- */
.lx-nav{position:absolute;inset:auto 0 0 0;min-height:64px;background:var(--card);
  border-top:1px solid var(--line);display:flex;align-items:flex-end;justify-content:space-around;
  padding:6px 4px 10px;z-index:6}
.lx-nav .tab{flex:1 1 0;display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 0;
  font-size:11px;font-weight:600;color:var(--ink3);transition:transform .14s var(--ease)}
.lx-nav .tab .ms{font-size:24px}
.lx-nav .tab.on{color:var(--p);font-weight:700}
.lx-nav .tab:active,.lx-nav .fab:active{transform:scale(.97)}
.lx-nav .anchor{flex:1 1 0;display:flex;flex-direction:column;align-items:center;gap:5px;transform:translateY(-16px)}
.lx-nav .fab{width:56px;height:56px;border-radius:50%;background:var(--accent);color:var(--ink);
  display:grid;place-items:center;box-shadow:0 10px 22px rgba(255,183,3,.45);transition:transform .14s var(--ease)}
.lx-nav .fab .ms{font-size:27px}
.lx-nav .anchor>span{font-size:11px;font-weight:700;color:var(--accent)}

/* ---------- primitives (LatusUI.kt) ---------- */
.vy-card{background:var(--card);border-radius:22px;border:1px solid var(--line);box-shadow:var(--e2);padding:16px}
.vy-card.r16{border-radius:16px}
.vy-card.r18{border-radius:18px}
.vy-card.flat{box-shadow:var(--e1)}
.vy-soft{border-radius:13px;display:grid;place-items:center;flex:0 0 auto}
.vy-chip{display:inline-flex;align-items:center;gap:5px;border-radius:9px;padding:6px 11px;
  font-size:12px;font-weight:700;max-width:100%;min-width:0}
.vy-chip .ms{font-size:13px}
.vy-chip span{min-width:0}
.vy-bar{height:6px;border-radius:4px;background:rgba(2,48,71,.08);overflow:hidden}
.vy-bar i{display:block;height:100%;border-radius:4px;background:var(--p)}
.vy-orb{border-radius:12px;background:rgba(2,48,71,.14);display:grid;place-items:center;flex:0 0 auto}
.vy-aitag{display:inline-flex;align-items:center;gap:3px;border-radius:6px;padding:2px 7px;
  font-size:10px;font-weight:800;letter-spacing:.2px;background:rgba(72,202,228,.10);color:#023047}
.vy-aitag .ms{font-size:12px}
.vy-aitag.onbrush{background:rgba(255,255,255,.24);color:#fff}
.vy-sect{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 2px}
.vy-sect b{font-size:16.5px;font-weight:700}
.vy-sect a{font-size:12.5px;font-weight:700;color:var(--p)}
.vy-btn{display:flex;align-items:center;justify-content:center;gap:8px;height:50px;border-radius:13px;
  background:var(--p);color:#fff;font-size:15px;font-weight:700;width:100%;transition:filter .15s var(--ease)}
.vy-btn:active{filter:brightness(.94)}
.vy-btn .ms{font-size:18px}
.vy-btn.amber{background:var(--accent);color:var(--ink)}
.vy-btn.tonal{background:var(--p-08);border:1.2px solid rgba(0,160,196,.45);color:var(--p);height:48px;border-radius:14px;font-size:14.5px}
.vy-btn.h46{height:46px;border-radius:12px;font-size:14px}
.vy-btn.h44{height:44px;border-radius:12px;font-size:14px}
.vy-ghost{display:inline-flex;align-items:center;gap:5px;border-radius:9px;background:rgba(255,255,255,.18);
  color:#fff;padding:6px 12px;font-size:12px;font-weight:700}
.vy-ghost .ms{font-size:13px}

/* ---------- hero panel ---------- */
.hero-panel{border-radius:28px;background:var(--hero);box-shadow:var(--e6);padding:18px;
  display:flex;flex-direction:column;gap:10px;color:#fff}
.hero-panel .top{display:flex;align-items:center}
.hero-panel .count{font-size:44px;font-weight:800}
.hero-panel .say{font-size:13.5px;font-weight:600;color:rgba(255,255,255,.92);line-height:1.2}
.hero-panel .chips{display:flex;gap:8px;flex-wrap:wrap}

/* ---------- opening screen ---------- */
/* OpeningScreen.kt:121-130 — padding 16 + 12 bottom, 18dp between the four blocks. */
.lx-body.op{padding:16px 16px 28px;gap:18px}
.op-hero{display:flex;flex-direction:column;gap:14px;padding-block:4px}
.op-show{display:flex;flex-direction:column;gap:16px}
.op-ring{width:196px;height:196px;margin:0 auto;display:grid;place-items:center;position:relative}
.op-ring i{position:absolute;inset:0;border-radius:50%;border:2px solid var(--p);
  transform:scale(.85);opacity:.35;
  animation:op-pulse 2.6s cubic-bezier(0,0,.2,1) infinite}
.op-ring i:nth-child(2){animation-delay:-1.3s}
@keyframes op-pulse{from{transform:scale(.85);opacity:.35}to{transform:scale(1.25);opacity:0}}
.op-btn{width:168px;height:168px;border-radius:50%;background:var(--hero);color:#fff;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;
  box-shadow:0 6px 18px rgba(2,48,71,.22);animation:op-breathe 3.4s ease-in-out infinite alternate}
@keyframes op-breathe{to{transform:scale(1.03)}}
.op-btn .ms{font-size:38px;transform:scaleX(-1)}
.op-btn b{font-size:20px;font-weight:900}
.op-sub{text-align:center;font-size:13px;color:var(--ink2)}
.op-eyebrow{font-size:13px;font-weight:700;color:var(--ink3);padding:0 2px}
.op-group{display:flex;align-items:center;gap:8px;padding:0 2px}
.op-group i{width:24px;height:24px;border-radius:8px;background:var(--p-14);color:var(--p);display:grid;place-items:center;flex:0 0 auto}
.op-group .ms{font-size:13px}
.op-group b{font-size:13.5px;font-weight:900}
.op-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.op-gset{display:flex;flex-direction:column;gap:9px}
.op-tile{background:var(--card);border-radius:16px;border:1px solid var(--line);box-shadow:var(--e2);
  padding:11px;display:flex;gap:9px;align-items:center;transition:transform .14s var(--ease);text-align:right}
.op-tile:active{transform:scale(.98)}
.op-tile .vy-soft{width:36px;height:36px;border-radius:11px}
.op-tile .vy-soft .ms{font-size:19px}
.op-tile b{display:block;font-size:12.5px;font-weight:700;line-height:1.2}
.op-tile>span>span{display:block;font-size:10.5px;color:var(--ink2);line-height:1.2;margin-top:2px}
.op-enc{border-radius:22px;background:var(--ai-brush);box-shadow:var(--e6);padding:16px;
  display:flex;align-items:center;gap:13px;color:var(--ink)}
.op-enc .vy-orb{width:34px;height:34px}
.op-enc .vy-orb .ms{font-size:16px}
.op-enc b{display:block;font-size:15px;font-weight:700}
.op-enc b+span{display:block;font-size:12.5px;opacity:.9;margin-top:2px;line-height:1.35}
.op-pass{display:flex;flex-direction:column;gap:10px}
.op-stamps{display:flex;gap:12px;justify-content:flex-start}
.op-stamp{width:74px;text-align:center}
.op-stamp .ring{width:66px;height:66px;border-radius:50%;background:linear-gradient(135deg,var(--p),var(--accent));
  padding:2.5px;margin:0 auto}
.op-stamp .ring div{width:100%;height:100%;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:26px}
.op-stamp.empty .ring{background:none;border:1.5px dashed rgba(138,165,178,.45);padding:0;height:66px;border-radius:50%}
.op-stamp.empty u{display:block;width:38px;height:7px;border-radius:4px;background:rgba(138,165,178,.30);margin:6px auto 0}
.op-stamp.empty s{display:block;width:22px;height:6px;border-radius:4px;background:rgba(138,165,178,.22);margin:4px auto 0}
.op-stamp b{display:block;font-size:11.5px;font-weight:700;margin-top:6px}
.op-stamp span{display:block;font-size:10.5px;color:var(--ink3)}
.op-passfoot{font-size:11.5px;color:var(--ink3);padding:0 2px}

/* ---------- preview overlay ---------- */
.pv{position:absolute;inset:0;background:var(--page);z-index:14;display:flex;flex-direction:column;
  animation:pv-in .26s var(--ease)}
@keyframes pv-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.pv-top{display:flex;align-items:center;gap:10px;padding:12px 16px}
.pv-top .x{width:32px;height:32px;border-radius:50%;background:var(--surf2);display:grid;place-items:center}
.pv-top .x .ms{font-size:16px}
.pv-top b{font-size:17px;font-weight:700}
.pv-body{flex:1 1 auto;overflow-y:auto;scrollbar-width:none;padding:20px;display:flex;flex-direction:column;
  align-items:center;gap:16px;text-align:center}
.pv-body::-webkit-scrollbar{display:none}
.pv-body .vy-soft{width:62px;height:62px;border-radius:18px}
.pv-body .vy-soft .ms{font-size:30px}
.pv-body h3{font-size:22px;font-weight:900}
.pv-body .intro{font-size:14px;color:var(--ink2);line-height:1.45}
.pv-rows{width:100%;display:flex;flex-direction:column;gap:9px}
.pv-row{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px;
  display:flex;align-items:center;gap:11px;text-align:right}
.pv-row .vy-soft{width:34px;height:34px;border-radius:10px}
.pv-row .vy-soft .ms{font-size:15px}
.pv-row b{display:block;font-size:13.5px;font-weight:700}
.pv-row>span>span{display:block;font-size:11.5px;color:var(--ink2);margin-top:2px}
.pv-locked{display:flex;align-items:center;justify-content:center;gap:6px;font-size:12.5px;font-weight:600;color:var(--ink3)}
.pv-locked .ms{font-size:14px}
.pv-soon{width:100%;border-radius:12px;background:var(--p-10);color:var(--p);padding:10px 12px;
  display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600}
.pv-soon .ms{font-size:15px}
.pv-note{font-size:11.5px;color:var(--ink3)}
.pv-cta{width:100%;display:flex;flex-direction:column;align-items:center;gap:8px}
.pv-foot{padding:12px 16px}
.pv-foot .vy-btn{height:52px;border-radius:14px}

/* ---------- task cards (Pre) ---------- */
.tasks{display:flex;flex-direction:column;gap:9px}
.tasks .head{display:flex;align-items:center;gap:8px;padding:0 2px}
.tasks .head b{flex:1 1 auto;font-size:16.5px;font-weight:700;line-height:1.2}
.tasks .head span{font-size:12px;font-weight:700;color:var(--p);white-space:nowrap}
.task{background:var(--card);border-radius:16px;border:1px solid var(--line);box-shadow:0 2px 6px rgba(2,48,71,.10);
  padding:13px;display:flex;align-items:center;gap:12px;width:100%;transition:transform .14s var(--ease);text-align:right}
.task:active{transform:scale(.99)}
.task .vy-soft{width:38px;height:38px;border-radius:11px}
.task .vy-soft .ms{font-size:19px}
.task.done .vy-soft .ms{font-size:22px}
.task .txt{flex:1 1 auto;min-width:0}
.task b{display:block;font-size:14.5px;font-weight:700}
.task.done b{color:var(--ink2)}
.task .txt span{display:block;font-size:11.5px;color:var(--ink3);margin-top:2px}
.task .go{color:var(--ink3)}
.task .go .ms{font-size:18px}

/* ---------- AI prompt card ---------- */
.ai-panel{border-radius:22px;background:var(--ai-brush);box-shadow:var(--e6);padding:16px;
  display:flex;flex-direction:column;gap:13px;color:var(--ink)}
.ai-panel .r1{display:flex;align-items:center;gap:11px}
.ai-panel .vy-orb{width:36px;height:36px}
.ai-panel .vy-orb .ms{font-size:16px}
.ai-panel .r1 b{display:block;font-size:15.5px;font-weight:900}
.ai-panel .r1 b+span{display:block;font-size:12px;font-weight:500;opacity:.9;margin-top:2px}
.ai-panel .r2{display:flex;align-items:center;gap:8px}
.ai-panel .pill{flex:1 1 auto;background:#fff;border-radius:13px;padding:11px 13px;font-size:13px;
  font-weight:600;color:#000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ai-panel .send{width:42px;height:42px;border-radius:13px;background:#fff;color:var(--p);display:grid;place-items:center;flex:0 0 auto}
.ai-panel .send .ms{font-size:18px;transform:scaleX(-1)}

/* toolbox grid (DashboardScreen "ארגז הכלים") */
.tools{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.tool{background:none;border:0;box-shadow:none;border-radius:14px;padding:0;
  display:flex;flex-direction:column;align-items:center;gap:6px;transition:transform .14s var(--ease)}
.tool:active{transform:scale(.97)}
.tool .vy-soft{width:46px;height:46px;border-radius:14px}
.tool .vy-soft .ms{font-size:22px}
.tool>span:last-child{font-size:11px;font-weight:600;text-align:center}
.tool.off{opacity:.6;color:var(--ink3)}
.tools-note{font-size:10.5px;color:var(--ink3);text-align:center}


/* ---------- During dashboard ---------- */
.lx-phase .manual{background:rgba(255,183,3,.14);color:var(--accent);border-radius:50px;padding:2px 5px;font-size:9.5px;font-weight:900}
.hero-panel .kick{font-size:12px;font-weight:900;color:var(--accent)}
.hero-panel .act{font-size:24px;font-weight:900;color:#fff;line-height:1.2}
.hero-panel .meta{font-size:12.5px;color:rgba(255,255,255,.85)}
.hero-nav{margin-top:4px;align-self:flex-start;height:38px;border-radius:11px;background:#fff;color:var(--p);
  display:inline-flex;align-items:center;gap:6px;padding:0 16px;font-size:14px;font-weight:700}
.hero-nav .ms{font-size:16px}
.sect-label{font-size:16px;font-weight:700;padding:2px 2px 0}
.quick{display:flex;gap:11px}
.quick+.quick{margin-top:-3px}
.qtile{position:relative;flex:1 1 0;background:var(--card);border-radius:22px;border:1px solid var(--line);
  box-shadow:var(--e2);padding:14px 10px;display:flex;flex-direction:column;align-items:center;gap:8px;
  transition:transform .14s var(--ease)}
.qtile:active{transform:scale(.97)}
.qtile .vy-soft{width:44px;height:44px;border-radius:13px}
.qtile .vy-soft .ms{font-size:22px}
.qtile>span:last-child{font-size:13px;font-weight:600;text-align:center;line-height:1.2}
.qtile .vy-aitag{position:absolute;top:7px;right:7px;padding:1px 5px;font-size:9px}
.qtile .vy-aitag .ms{font-size:10px}
.today-card{padding:14px}
.today-row{display:flex;align-items:center;gap:10px;padding:8px 0}
.today-row .t{width:40px;flex:0 0 auto;font-size:12px;font-weight:700;color:var(--ink2);text-align:center}
.today-row .vy-soft{width:32px;height:32px;border-radius:9px}
.today-row .vy-soft .ms{font-size:16px}
.today-row b{flex:1 1 auto;font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.today-row .next{background:var(--accent);color:var(--ink);border-radius:50px;padding:3px 7px;font-size:10px;font-weight:900;flex:0 0 auto}
.today-sep{height:1px;background:rgba(2,48,71,.10)}
.wx-strip{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:0 2px}
.wx-strip::-webkit-scrollbar{display:none}
.wx-mini{flex:0 0 auto;width:54px;border-radius:14px;background:var(--card);border:1px solid var(--line);
  padding:10px 0;display:flex;flex-direction:column;align-items:center;gap:5px}
.wx-mini .dow{font-size:11px;font-weight:700;color:var(--ink2)}
.wx-mini .wx-tile{width:32px;height:32px;border-radius:10px}
.wx-mini .wx-tile .ms{font-size:17px}
.wx-mini .mx{font-size:13px;font-weight:800}
.wx-mini .mn{font-size:11px;font-weight:600;color:var(--ink3)}
.near-row{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:0 2px}
.near-row::-webkit-scrollbar{display:none}
.near-row .vy-chip{flex:0 0 auto}
.ph-row{display:flex;align-items:center;gap:12px;padding:12px 6px;border-radius:14px;width:100%;text-align:right}
.ph-row.on{background:var(--p-08)}
.ph-row .vy-soft{width:40px;height:40px;border-radius:12px}
.ph-row .vy-soft .ms{font-size:20px}
.ph-row b{display:block;font-size:15px;font-weight:700}
.ph-row span span{display:block;font-size:12px;color:var(--ink2);margin-top:2px}
.ph-row>span:nth-child(2){flex:1 1 auto}
.ph-row>.ms{color:var(--ink3);font-size:20px}
.ph-row.on>.ms{color:var(--good)}

/* ---------- itinerary ---------- */
.pl-head{display:flex;align-items:center;gap:14px}
.pl-head .vy-soft{width:46px;height:46px;border-radius:14px;background:var(--p-14);color:var(--p)}
.pl-head .vy-soft .ms{font-size:24px}
.pl-head .meta{flex:1 1 auto;min-width:0}
.pl-head .meta b{display:block;font-size:19px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pl-head .meta .dt{display:block;font-size:14px;color:var(--ink2);margin-top:2px}
.pl-head .meta em{display:block;font-style:normal;font-size:12px;color:var(--ink3);margin-top:2px}
.pl-head .acts{display:flex;gap:14px}
.pl-head .acts button{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;color:var(--p)}
.pl-head .acts .ms{font-size:20px}
.pl-strip{display:flex;align-items:center;gap:4px}
.pl-strip .arrow{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;color:var(--p);flex:0 0 auto}
.pl-strip .arrow.off,.pl-strip .arrow.off .ms{color:rgba(2,48,71,.3)}
.pl-strip .arrow .ms{font-size:22px}
.pl-days{flex:1 1 auto;display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:2px}
.pl-days::-webkit-scrollbar{display:none}
.pl-day{flex:0 0 auto;min-height:50px;border-radius:14px;background:var(--card);border:1px solid var(--line);
  padding:9px 12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  transition:background .16s var(--ease),border-color .16s var(--ease)}
.pl-day .l{display:flex;align-items:center;gap:4px;font-size:14px;font-weight:700;white-space:nowrap}
.pl-day .l .ms{font-size:12px}
.pl-day .d{font-size:11px;color:var(--ink3)}
.pl-day.locked .l{color:var(--ink3)}
.pl-day.on{background:var(--p);border-color:var(--p);color:#fff}
.pl-day.on .l{color:#fff}
.pl-day.on .d{color:rgba(255,255,255,.75)}
.pl-day.today{background:var(--p-14);border-color:transparent;flex-direction:row;gap:6px}
.pl-day.today .l{color:var(--p);font-size:13px}
.pl-hr{height:1px;background:var(--line)}
.pl-dayhead{display:flex;align-items:center;justify-content:space-between;gap:10px}
.pl-dayhead b{font-size:16px;font-weight:600}
.pl-dayhead .add{width:40px;height:40px;border-radius:13px;background:var(--p-14);color:var(--p);display:grid;place-items:center;flex:0 0 auto}
.pl-dayhead .add .ms{font-size:22px}
.pl-card{background:var(--card);border-radius:22px;border:1px solid var(--line);box-shadow:var(--e2);padding:14px}
.pl-card.today{background:var(--surf2);border:1.5px solid var(--p);box-shadow:none}
.pl-card .dh{display:flex;align-items:center;gap:10px}
.pl-card .dh .n{width:30px;height:30px;border-radius:9px;background:var(--p);color:#fff;display:grid;
  place-items:center;font-size:14px;font-weight:900;flex:0 0 auto}
.pl-card .dh b{display:block;font-size:15px;font-weight:700}
.pl-card .dh .sub{display:block;font-size:11.5px;color:var(--ink3);margin-top:2px}
.pl-card .dh .badge{margin-inline-start:auto;background:var(--accent);color:var(--ink);border-radius:50px;
  padding:4px 9px;font-size:11px;font-weight:900}
.pl-sep{height:1px;background:rgba(2,48,71,.07);margin:10px 0}
.pl-act{display:flex;align-items:flex-start;gap:10px;width:100%;text-align:right}
.pl-act+.pl-act{border-top:1px solid rgba(2,48,71,.06);margin-top:9px;padding-top:9px}
.pl-act .t{width:40px;flex:0 0 auto;padding-top:9px;font-size:12.5px;font-weight:700}
.pl-act .vy-soft{width:36px;height:36px;border-radius:11px}
.pl-act .vy-soft .ms{font-size:18px}
.pl-act .txt{flex:1 1 auto;min-width:0}
.pl-act .ttl{display:flex;align-items:center;gap:6px;padding-top:2px}
.pl-act .ttl b{font-size:15.5px;font-weight:700;line-height:1.25}
.pl-act .ttl .next{background:var(--accent);color:var(--ink);border-radius:50px;padding:3px 7px;font-size:10px;font-weight:900;flex:0 0 auto}
.pl-act p{font-size:13px;color:var(--ink2);line-height:1.25;padding-top:4px;white-space:pre-line}
.pl-act .row1{display:flex;align-items:center;gap:8px;padding-top:8px;min-width:0}
.pl-act .swap{display:inline-flex;align-items:center;gap:4px;border-radius:9px;background:rgba(72,202,228,.12);
  color:var(--ai);padding:5px 9px;font-size:12px;font-weight:600;margin-top:8px}
.pl-act .swap .ms{font-size:12px}
.pl-act .nav{display:inline-flex;align-items:center;gap:4px;border-radius:9px;background:var(--p-12);
  color:var(--p);padding:5px 9px;font-size:12px;font-weight:700;flex:0 0 auto}
.pl-act .nav .ms{font-size:12px}
.pl-act .pen{width:30px;height:30px;display:grid;place-items:center;color:var(--ink3);flex:0 0 auto}
.pl-act .pen .ms{font-size:16px}
.pl-act.fresh{animation:pop .5s var(--ease)}
@keyframes pop{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.pl-act.moved .t{animation:flash 1.6s var(--ease)}
@keyframes flash{30%{color:var(--good);transform:scale(1.15)}}
.pl-empty{font-size:13px;color:var(--ink3);padding:6px 2px;line-height:1.4}
.pl-aistrip{border-radius:18px;background:var(--ai-brush);padding:14px;display:flex;align-items:center;gap:10px;color:var(--ink)}
.pl-aistrip .ms{font-size:16px}
.pl-aistrip b{font-size:13.5px;font-weight:700;flex:1 1 auto}
.pl-aistrip .pill{background:#fff;border-radius:50px;height:34px;padding:0 14px;display:inline-flex;
  align-items:center;font-size:12.5px;font-weight:700;color:#B99700;flex:0 0 auto}
.pl-lock{background:var(--card);border-radius:16px;box-shadow:var(--e1);padding:16px;display:flex;flex-direction:column;gap:10px}
.pl-lock .h{display:flex;align-items:center;gap:8px;color:var(--p);font-size:14px;font-weight:700}
.pl-lock .h .ms{font-size:18px}
.pl-lock p{font-size:12px;color:var(--ink2);line-height:1.5}
.pl-lock .fine{font-size:12px;color:var(--ink3);text-align:center}
.pl-ghosts{display:flex;flex-direction:column;gap:10px}
.pl-ghost{display:flex;align-items:flex-start;gap:12px;animation:ghost 1.1s ease-in-out infinite alternate}
.pl-ghost>i{width:36px;height:36px;border-radius:11px;background:var(--surf2);flex:0 0 auto}
.pl-ghost .c{flex:1 1 auto;background:var(--card);border-radius:16px;box-shadow:var(--e1);padding:14px;
  display:flex;flex-direction:column;gap:8px}
.pl-ghost .c u{display:block;height:12px;width:30%;background:var(--surf2);border-radius:6px}
.pl-ghost .c s{display:block;height:16px;width:70%;background:var(--surf2);border-radius:6px}
@keyframes ghost{from{opacity:.2}to{opacity:.4}}

/* ---------- AI chat ---------- */
.ch-banner{border-radius:18px;background:linear-gradient(99deg,#48CAE4,#FEE440);padding:12px 14px;display:flex;align-items:center;gap:11px;color:var(--ink);flex:0 0 auto}
.ch-banner .vy-orb{width:36px;height:36px}
.ch-banner .vy-orb .ms{font-size:16px}
.ch-banner b{display:block;font-size:15px;font-weight:900}
.ch-banner b+span{display:block;font-size:12px;font-weight:500;opacity:.9;margin-top:2px}
.ch-banner .vy-aitag{margin-inline-start:auto}
.ch-line{display:flex;gap:9px;align-items:flex-start;animation:pop .3s var(--ease)}
.ch-line .av{width:28px;height:28px;border-radius:9px;background:var(--ai-brush);display:grid;place-items:center;flex:0 0 auto}
.ch-line .av .ms{font-size:16px;color:var(--ink)}
.ch-bub{background:var(--card);border:1px solid var(--line);border-radius:4px 16px 16px 16px;
  box-shadow:var(--e1);padding:11px 14px;font-size:14px;line-height:1.2;max-width:100%}
/* the intro line puts the mark on the right, so its notch flips */
.ch-line>.av:first-child+.ch-bub{border-radius:16px 4px 16px 16px}
.ch-line.me{justify-content:flex-start}
.ch-line.me .ch-bub{background:var(--p);color:#fff;border-color:transparent;border-radius:16px 16px 4px 16px}
.ch-typing{display:flex;gap:5px;align-items:center;padding:14px 16px}
.ch-typing i{width:7px;height:7px;border-radius:50%;background:var(--ink3);animation:bounce 1s infinite}
.ch-typing i:nth-child(2){animation-delay:.15s}.ch-typing i:nth-child(3){animation-delay:.3s}
@keyframes bounce{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-5px);opacity:1}}
.ch-cite{margin-top:9px;display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:700;color:var(--p)}
.ch-cite .ms{font-size:15px}
.ch-sug{margin-top:10px;background:var(--surf3);border:1px solid var(--line);border-radius:14px;padding:11px;
  display:flex;flex-direction:column;gap:9px}
.ch-sug .r{display:flex;align-items:flex-start;gap:9px}
.ch-sug .vy-soft{width:34px;height:34px;border-radius:10px}
.ch-sug .vy-soft .ms{font-size:16px}
.ch-sug b{display:block;font-size:13.5px;font-weight:700}
.ch-sug .d{display:block;font-size:11.5px;color:var(--ink2);margin-top:2px;line-height:1.35}
.ch-sug .add{margin-inline-end:auto;display:inline-flex;align-items:center;gap:5px;border-radius:9px;
  background:var(--p-12);color:var(--p);padding:7px 11px;font-size:12px;font-weight:700}
.ch-sug .add.done{background:rgba(31,169,123,.14);color:var(--good)}
.ch-sug .add .ms{font-size:14px}
.ch-nearby{margin-top:9px;display:flex;flex-direction:column;gap:7px}
.ch-nearby div{background:var(--surf2);border-radius:11px;padding:8px 10px;font-size:12.5px;display:flex;gap:7px;align-items:center}
.lx-stage .ch-nearby .ms{font-size:16px;color:var(--p2)}
.ch-nearby em{font-style:normal;margin-inline-start:auto;color:var(--ink3);font-size:11.5px}
.ch-ask{flex:0 0 auto;background:var(--page);padding:0 12px 10px}
.ch-chips{display:flex;flex-wrap:wrap;gap:8px;padding:0 0 8px}
.ch-chips button{border-radius:50px;background:var(--p-10);color:var(--p);padding:8px 13px;font-size:13px;font-weight:600}
.ch-input{display:flex;align-items:center;gap:8px;padding-top:10px}
.ch-input .box{flex:1 1 auto;min-height:56px;border-radius:20px;border:1px solid var(--ink3);background:transparent;
  display:flex;align-items:center;padding:0 16px;color:var(--ink2);font-size:13.5px}
.ch-input .send{width:48px;height:48px;border-radius:50%;background:rgba(255,183,3,.5);color:#fff;display:grid;place-items:center;flex:0 0 auto}
.ch-input .send .ms{font-size:19px;transform:scaleX(-1)}

/* ---------- wallet ---------- */
.wl-title{display:flex;align-items:flex-start;gap:10px}
.wl-title b{display:block;font-size:20px;font-weight:900}
.wl-title>span>span{display:block;font-size:12px;color:var(--ink2);margin-top:3px}
.wl-title .grow{flex:1 1 auto}
.wl-sec{font-size:14px;font-weight:700;color:var(--ink2);padding-top:4px}
.pass{background:var(--card);border-radius:18px;overflow:hidden;box-shadow:var(--e3)}
.pass .band{background:var(--p);color:#fff;padding:11px 16px;display:flex;align-items:center;gap:8px}
.pass .band .who{display:flex;align-items:center;gap:6px;font-size:14px;font-weight:700;flex:1 1 auto}
.pass .band .who .ms{font-size:15px}
.pass .band code{font-family:ui-monospace,Menlo,monospace;font-size:14px;font-weight:900}
.pass .band .when{text-align:left;flex:0 0 auto}
.pass .band .when b{display:block;font-size:13px;font-weight:900;line-height:1.1}
.pass .band .when span{display:block;font-size:10.5px;line-height:1.1;opacity:.85;font-weight:600}
.pass .route{display:flex;align-items:center;justify-content:space-between;padding:16px 16px 10px}
.pass .route .end{text-align:left}
.pass .route .end b{display:block;font-size:28px;font-weight:900;line-height:1}
.pass .route .end span{font-size:11px;color:rgba(2,48,71,.6)}
.pass .route .ms{font-size:22px;color:var(--p2);transform:rotate(90deg)}
.pass .rows{padding:0 16px 12px}
.pass .pax{font-size:12px;font-weight:600;color:var(--p)}
.pass .meta{font-size:11.5px;font-weight:600;color:var(--ink2);margin-top:3px}
.pass .foot{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;padding:0 16px 14px}
.pass .foot .conf{font-size:10px;color:rgba(2,48,71,.5);font-weight:400}
.pass .foot .conf b{display:block;font-size:14px;font-weight:700;color:var(--ink);font-family:ui-monospace,Menlo,monospace;margin-top:2px}
.pass .foot .show{color:var(--p);font-weight:700;font-size:12px}
.pass .gen{padding:14px 16px 2px}
.pass .gen b{font-size:15px;font-weight:700}
.pass .gen i{font-style:normal;font-size:14px;color:rgba(2,48,71,.7)}
.pass .gen p{font-size:12px;color:rgba(2,48,71,.7);margin-top:4px}
.pass .code{background:#fff;height:56px;padding:0 16px;display:flex;direction:ltr;
  align-items:center;justify-content:flex-start}
.pass .code i{display:block;height:36px;background:#000;flex:0 0 auto}
.pass .code i.sp{background:none}
.hotelpass{background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:var(--e2);
  padding:13px;display:flex;align-items:center;gap:12px}
.hotelpass .vy-soft{width:38px;height:38px;border-radius:11px}
.hotelpass .vy-soft .ms{font-size:19px}
.hotelpass b{display:block;font-size:15px;font-weight:700}
.hotelpass>span>span{display:block;font-size:12px;color:var(--ink2);margin-top:3px}
.hotelpass .ok{margin-inline-start:auto;color:var(--good)}
.hotelpass .ok .ms{font-size:20px}

/* pass detail dialog */
.pass-detail{background:var(--page)}
.pd-top{display:flex;align-items:center;padding:8px}
.pd-body{flex:1 1 auto;overflow-y:auto;scrollbar-width:none;padding:0 16px 20px}
.pd-body::-webkit-scrollbar{display:none}
.pd-head{border-radius:28px;padding:22px;color:#fff}
.pd-head .type{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:rgba(255,255,255,.72)}
.pd-head .type .ms{font-size:20px;color:#fff}
.pd-head .ttl{font-size:24px;font-weight:900;margin-top:8px}
.pd-head .route{display:flex;align-items:center;justify-content:space-between;margin-top:18px}
.pd-head .route .end b{display:block;font-size:34px;font-weight:900;line-height:1}
.pd-head .route .end span{font-size:12px;color:rgba(255,255,255,.72)}
.pd-head .route .ms{font-size:24px;transform:rotate(90deg)}
.pd-head .fields{display:flex;flex-wrap:wrap;gap:12px 22px;margin-top:18px}
.pd-head .fields span{display:block;font-size:11px;color:rgba(255,255,255,.72)}
.pd-head .fields b{display:block;font-size:16px;font-weight:700;margin-top:2px}
.pd-code{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:18px}
.pd-code .panel{width:100%;background:#fff;border-radius:18px;padding:14px;display:flex;direction:ltr;
  align-items:center}
.pd-code .panel i{display:block;height:99px;background:#000;flex:var(--bw) 1 0;min-width:0}
.pd-code .panel i.sp{background:none}
.pd-code .lbl{font-size:15px;font-weight:700;font-family:ui-monospace,Menlo,monospace;color:#fff}

/* ---------- budget ---------- */
.bg-set{display:flex;align-items:center;border-radius:12px;background:var(--surf2);padding:11px 14px}
.bg-set b{font-size:22px;font-weight:900;color:var(--ink)}
.bg-edit{height:38px;padding:0 12px;border-radius:11px;background:var(--p-10);color:var(--p);
  display:inline-flex;align-items:center;gap:5px;font-size:14px;font-weight:700}
.bg-edit .ms{font-size:17px}
.bg-total .lbl{font-size:12.5px;font-weight:600;color:var(--ink2)}
.bg-total .big{font-size:34px;font-weight:900;margin-top:3px}
.bg-total .of{font-size:12.5px;color:var(--ink3);margin-top:4px}
.bg-total .vy-bar{margin:14px 0}
.bg-legend{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12px;color:var(--ink2)}
.bg-legend span{flex:0 0 calc(50% - 7px);display:flex;align-items:center;gap:6px;min-width:0}
.bg-legend i{width:9px;height:9px;border-radius:3px;flex:0 0 auto}
.bg-legend em{font-style:normal;font-weight:700;color:var(--ink3);margin-inline-start:auto}
.bg-row{margin-bottom:10px}
.bg-row:last-child{margin-bottom:0}
.bg-row .l{display:flex;align-items:center;justify-content:space-between;font-size:14px;font-weight:500;margin-bottom:4px}
.bg-row .l em{font-style:normal;font-weight:600}
.bg-sum{border-top:1px solid rgba(2,48,71,.12);padding-top:10px;font-size:14px;font-weight:600}
.bg-hr{border-top:1px solid rgba(2,48,71,.12);margin:8px 0}
.bg-settle{display:flex;align-items:center;gap:10px}
.bg-settle .vy-soft{width:36px;height:36px;border-radius:10px}
.bg-settle .vy-soft .ms{font-size:18px}
.bg-settle b{font-size:16px;font-weight:600}
.bg-owe .ms{font-size:20px}
.bg-owe{background:var(--p-06);border-radius:10px;padding:10px 12px;display:flex;align-items:center;
  justify-content:space-between;gap:10px;margin-top:8px}
.bg-owe b{font-size:14px;font-weight:700;color:var(--ink)}
.bg-owe .sub{display:block;font-size:12px;color:var(--ink3);margin-top:1px}
.bg-owe .amt{font-size:16px;font-weight:900;color:var(--accent)}
.bg-exps{display:flex;flex-direction:column;gap:10px}
.bg-exp{background:var(--surf2);border-radius:14px;padding:13px 14px;display:flex;align-items:center;gap:12px;
  animation:pop .4s var(--ease)}
.bg-exp .dot{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;flex:0 0 auto}
.bg-exp .dot i{width:10px;height:10px;border-radius:50%;display:block}
.bg-exp b{display:block;font-size:14px;font-weight:600}
.bg-exp .amt{display:block;font-size:12px;color:var(--ink2);margin-top:3px}
.bg-exp .who{display:block;font-size:11px;font-weight:600;color:var(--p);margin-top:3px}
.bg-warn{border-radius:10px;padding:9px 12px;display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;margin-top:10px}
.bg-warn .ms{font-size:14px}

/* ---------- explore ---------- */
.ex-tabs{background:var(--card);display:flex;border-bottom:1px solid rgba(2,48,71,.10);position:relative;flex:0 0 auto}
.ex-tabs button{flex:1 1 0;height:72px;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:6px;font-size:14px;font-weight:600;color:var(--ink2)}
.ex-tabs button .ms{font-size:24px}
.ex-tabs button.on{color:var(--p)}
.ex-tabs .ind{position:absolute;bottom:0;height:3px;width:24px;background:var(--p);border-radius:3px 3px 0 0;
  transition:right .25s cubic-bezier(.4,0,.2,1)}
.ex-near{width:100%;border-radius:50px;background:var(--p-06);border:1px solid rgba(0,160,196,.45);
  padding:10px 14px;display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--p)}
.ex-near .ms{font-size:13px}
.ex-filters{display:flex;gap:7px;overflow-x:auto;scrollbar-width:none;padding:0 2px}
.ex-filters::-webkit-scrollbar{display:none}
.ex-filters button{flex:0 0 auto;border-radius:9px;padding:6px 11px;font-size:12px;font-weight:700}
.ex-ai{display:flex;align-items:center;gap:8px;padding:0 2px}
.ex-ai i{width:22px;height:22px;border-radius:7px;background:var(--p);color:#fff;display:grid;place-items:center;flex:0 0 auto}
.ex-ai .ms{font-size:12px}
.ex-ai span{font-size:13px;color:var(--ink2)}
.ex-sec{display:flex;align-items:center;gap:6px;padding:0 2px}
.ex-sec .ms{font-size:16px}
.ex-sec b{font-size:16px;font-weight:700}
.ex-card{background:var(--card);border-radius:16px;border:1px solid var(--line);
  box-shadow:0 1px 2px rgba(0,0,0,.10),0 2px 4px rgba(0,0,0,.05);padding:13px}
.ex-sec+.ex-card,.ex-card+.ex-card{margin-top:-3px}
.ex-card .head{display:flex;align-items:flex-start;gap:11px}
.ex-card .vy-soft{width:44px;height:44px;border-radius:13px}
.ex-card .vy-soft .ms{font-size:22px}
.ex-card .txt{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:4px}
.ex-card .txt b{font-size:15px;font-weight:700}
.ex-card .txt p{font-size:12.5px;color:var(--ink2);line-height:1.45}
.ex-rate{display:flex;align-items:center;gap:5px}
.ex-rate .pill{display:inline-flex;align-items:center;gap:3px;border-radius:50px;background:rgba(254,228,64,.14);
  padding:4px 8px;font-size:12px;font-weight:900;color:#FEE440}
.ex-rate .pill .ms{font-size:10px}
.ex-rate em{font-style:normal;font-size:11.5px;color:#8097A3}
.ex-none{font-size:11.5px;color:#8097A3}
.ex-card .x{color:rgba(2,48,71,.4)}
.ex-card .x .ms{font-size:18px}
.ex-book{margin-top:11px;height:44px;border-radius:12px;background:#FFEBC2;color:#3A2600;display:flex;
  align-items:center;justify-content:center;gap:7px;font-size:13.5px;font-weight:900;width:100%}
.ex-book .ms{font-size:17px}
.ex-prov{font-size:10px;color:rgba(74,107,124,.8);padding-top:4px;text-align:left}
.ex-bottom{display:flex;gap:9px}
.ex-bottom button{flex:1 1 0;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;
  gap:10px;font-size:14px;font-weight:700}
.ex-bottom .map{background:var(--surf2);color:var(--ink);border:1px solid var(--line)}
.ex-bottom .ai{background:var(--p);color:#fff}

/* ---------- translate ---------- */
.tr-card{background:var(--card);border-radius:22px;box-shadow:0 1px 3px rgba(2,48,71,.10),0 2px 6px rgba(2,48,71,.06);padding:18px}
.tr-langs{display:flex;align-items:center;justify-content:center;gap:12px}
.tr-langs .pill{border-radius:10px;padding:6px 14px;font-size:13px;font-weight:700;color:rgba(74,107,124,.7)}
.tr-langs .pill.on{background:var(--p-10);color:var(--p)}
.tr-langs .swap{width:28px;height:28px;border-radius:10px;display:grid;place-items:center;color:var(--ink2)}
.tr-langs .swap .ms{font-size:20px}
.tr-in{display:flex;align-items:flex-start;gap:10px;margin-top:14px}
.tr-in .field{flex:1 1 auto;font-size:18px;font-weight:600;color:var(--ink);min-height:26px;line-height:1.3}
.tr-in .field.ph{color:rgba(74,107,124,.6)}
.tr-in button{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;flex:0 0 auto}
.tr-in .mic{background:var(--p-10);color:var(--p)}
.tr-in .mic.rec{background:var(--p);color:#fff}
.tr-in .cam{background:var(--surf2);color:var(--ink2)}
.tr-in button .ms{font-size:20px}
.tr-div{display:flex;align-items:center;gap:9px;padding:15px 0}
.tr-div i{flex:1 1 auto;height:1px;background:rgba(138,165,178,.25)}
.tr-div span{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:800;color:var(--ai)}
.tr-div .ms{font-size:13px}
.tr-out{min-height:40px;font-size:20px;font-weight:700;color:var(--ai);line-height:1.25}
.tr-out.ltr{text-align:left}
.tr-out.ph{color:rgba(74,107,124,.45)}
.tr-eng{font-size:12px;color:rgba(74,107,124,.7);margin-top:6px}
.tr-actions{display:flex;gap:9px;padding-top:17px}
.tr-actions .vy-btn{flex:1 1 auto;font-size:14px}
.tr-actions .chip{width:50px;height:50px;border-radius:13px;background:var(--surf2);
  border:1px solid rgba(138,165,178,.25);color:var(--ink2);display:grid;place-items:center;flex:0 0 auto}
.tr-actions .chip .ms{font-size:18px}
.tr-phrase{background:var(--card);border-radius:22px;box-shadow:var(--e1);padding:12px 14px;
  display:flex;align-items:center;gap:12px;width:100%;text-align:right}
.tr-phrase .txt{flex:1 1 auto;min-width:0}
.tr-phrase b{display:block;font-size:14.5px;font-weight:700}
.tr-phrase .en{display:block;font-size:12.5px;color:var(--ink2);margin-top:3px;direction:ltr;text-align:right}
.tr-phrase .sp{width:40px;height:40px;border-radius:12px;background:var(--p-12);color:var(--p);
  display:grid;place-items:center;flex:0 0 auto}
.tr-phrase .sp .ms{font-size:18px}

/* ---------- weather ---------- */
.wx-cities{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:10px 12px}
.wx-cities::-webkit-scrollbar{display:none}
.wx-cities button{flex:0 0 auto;border-radius:10px;padding:8px 12px;font-size:13px;font-weight:600;
  display:flex;align-items:center;gap:5px;
  background:var(--card);border:1px solid var(--line);color:var(--ink2)}
.wx-cities button.on{background:var(--p-14);border-color:transparent;color:var(--p)}
.wx-cities button .ms{font-size:11px}
.wx-hero{background:var(--card);border-radius:22px;border:1px solid var(--line);
  box-shadow:0 7px 18px rgba(22,44,40,.07);padding:18px}
.wx-hero .top{display:flex;align-items:center;gap:16px}
.wx-tile{border-radius:20px;display:grid;place-items:center;flex:0 0 auto}
.wx-hero .wx-tile{width:66px;height:66px}
.wx-hero .wx-tile .ms{font-size:34px}
.wx-hero .temp{font-size:48px;font-weight:900;line-height:1.08}
.wx-hero .cap{font-size:13.5px;font-weight:600;color:var(--ink2);margin-top:3px}
.wx-meta{display:flex;gap:18px;margin-top:13px}
.wx-meta span{display:flex;align-items:center;gap:5px;font-size:13px;color:var(--ink2)}
.wx-meta .ms{font-size:14px}
.wx-tip{background:var(--card);border-radius:22px;border:1px solid var(--line);
  box-shadow:0 2px 6px rgba(22,44,40,.07);padding:14px;
  display:flex;align-items:flex-start;gap:11px}
.wx-tip .orb{width:32px;height:32px;border-radius:10px;background:rgba(72,202,228,.10);color:var(--ai);
  display:grid;place-items:center;flex:0 0 auto}
.wx-tip .orb .ms{font-size:14px}
.wx-tip b{display:block;font-size:14px;font-weight:700}
.wx-tip p{font-size:13px;color:var(--ink2);line-height:1.55;margin-top:3px}
.wx-day{background:var(--card);border-radius:14px;border:1px solid var(--line);
  box-shadow:0 2px 6px rgba(22,44,40,.07);
  padding:12px 14px;display:flex;align-items:center;gap:10px}
.wx-day.today{background:var(--p-14);border-color:var(--p);box-shadow:none}
.wx-day .lbl{flex:1 1 auto}
.wx-day .lbl b{display:block;font-size:13px;font-weight:600}
.wx-day.today .lbl b{font-weight:700;color:var(--p)}
.wx-day .lbl span{display:block;font-size:11px;color:rgba(74,107,124,.8);margin-top:3px}
.wx-day .wx-tile{width:40px;height:40px;border-radius:12px}
.wx-day .wx-tile .ms{font-size:21px}
.wx-day .cond{font-size:12.5px;color:var(--ink2);width:78px;text-align:center}
.wx-day .cond em{display:block;font-style:normal;font-size:11px;font-weight:600;color:var(--p);margin-top:2px}
.wx-day .tmp{display:flex;flex-direction:column;align-items:flex-end;width:72px;
  font-size:20px;font-weight:700;color:#26A69A}
.wx-day .tmp.hot{color:#FFB300}
.wx-day .tmp em{font-style:normal;font-size:12px;font-weight:400;color:rgba(74,107,124,.8)}

/* ---------- wizard ---------- */
.wz h3{font-size:22px;font-weight:900;text-align:center}
.wz .hint{font-size:13px;color:var(--ink2);text-align:center}
.wz-search{height:46px;border-radius:14px;background:var(--card);border:1px solid var(--line);
  display:flex;align-items:center;gap:9px;padding:0 14px;color:var(--ink3);font-size:13.5px}
.wz-search .ms{font-size:19px}
.wz-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.wz-dest{background:var(--card);border-radius:16px;border:1px solid var(--line);box-shadow:var(--e2);
  padding:14px 10px;text-align:center;transition:transform .14s var(--ease)}
.wz-dest:active{transform:scale(.97)}
.wz-dest .fl{font-size:30px;line-height:1}
.wz-dest b{display:block;font-size:14.5px;font-weight:700;margin-top:8px}
.wz-dest span{display:block;font-size:11.5px;color:var(--ink3);margin-top:3px}
.wz-opt{background:var(--card);border-radius:18px;padding:16px;
  display:flex;align-items:center;gap:12px;width:100%;transition:transform .14s var(--ease)}
.wz-opt:active{transform:scale(.99)}
.wz-opt .vy-soft{width:48px;height:48px;border-radius:14px}
.wz-opt .vy-soft .ms{font-size:21px}
.wz-opt .txt{flex:1 1 auto;text-align:right;min-width:0}
.wz-opt b{display:block;font-size:17px;font-weight:700}
.wz-opt .txt span{display:block;font-size:13px;color:var(--ink2);line-height:1.2;margin-top:2px}
.wz-opt .go{color:var(--p)}
.wz-opt .go .ms{font-size:20px}
.wz-q{font-size:15px;font-weight:700;padding:0 2px}
.wz-pick{display:flex;flex-wrap:wrap;gap:8px}
.wz-pick button{border-radius:14px;background:var(--card);border:1px solid var(--line);padding:10px 15px;
  font-size:13.5px;font-weight:600;transition:background .14s var(--ease),border-color .14s var(--ease)}
.wz-pick button.on{background:var(--p-14);border-color:var(--p);color:var(--p2);font-weight:700}
.wz-build{padding:28px 6px;display:flex;flex-direction:column;align-items:center;text-align:center}
.wz-build .orb{width:128px;height:128px;border-radius:50%;background:var(--hero);display:grid;place-items:center;
  color:#fff;animation:breathe 2.2s ease-in-out infinite}
.wz-build .orb .ms{font-size:48px}
@keyframes breathe{0%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(0,160,196,.34)}50%{transform:scale(1.05);box-shadow:0 0 0 20px rgba(0,160,196,0)}}
.wz-build h3{font-size:16px;font-weight:600;color:var(--p);margin-top:20px}
.wz-build .vy-bar{width:100%;margin-top:12px}
.wz-build .note{font-size:12.5px;color:var(--ink2);margin-top:10px}
.wz-steps{margin-top:20px;width:100%;max-width:260px;display:flex;flex-direction:column;gap:11px;text-align:right}
.wz-steps div{display:flex;align-items:center;gap:9px;font-size:13.5px;font-weight:600;color:var(--ink3);transition:color .3s var(--ease)}
.wz-steps div.on{color:var(--ink)}
.wz-steps .ms{font-size:19px;color:var(--good);opacity:0;transition:opacity .3s var(--ease)}
.wz-steps div.on .ms{opacity:1}


/* wizard — destination picker, dates, plan choice, personalize, build */
.wz-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.wz-plane{width:68px;height:68px;border-radius:18px;background:var(--p);color:#fff;display:grid;place-items:center;flex:0 0 auto}
.wz-plane .ms{font-size:30px;transform:rotate(-45deg)}
.wz-aicard{border-radius:18px;background:var(--ai-brush);box-shadow:0 4px 12px rgba(22,44,40,.12);
  padding:10px 14px;display:flex;flex-direction:column;gap:4px;align-items:center;color:var(--ink)}
.wz-aicard .r{display:flex;align-items:center;gap:6px}
.wz-aicard .vy-orb{width:22px;height:22px;border-radius:8px}
.wz-aicard .vy-orb .ms{font-size:12px}
.wz-aicard b{font-size:13.5px;font-weight:700}
.wz-aicard span{font-size:11px;opacity:.9}
.wz-head{display:flex;align-items:center;gap:8px}
.wz-head .grow{flex:1 1 auto}
.wz-head .back{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:var(--ink2)}
.wz-head .back .ms{font-size:22px}
.wz-head .fl{font-size:30px;line-height:1}
.wz-head .logo{width:40px;height:40px;border-radius:9px;background:var(--hero);color:#fff;display:grid;place-items:center;overflow:hidden}
.wz-head .logo img{display:block;width:40px;height:40px}
.wz h3.big{font-size:30px;font-weight:900;text-align:right}
.wz h3.mid{font-size:24px;font-weight:900;text-align:right;line-height:1.25}
.wz h3.mid26{font-size:26px;font-weight:900;text-align:right;line-height:1.25}
.wz p.sub{font-size:17px;color:var(--ink2);text-align:right;line-height:1.35;margin-top:-8px}
.wz-list{display:flex;flex-direction:column;gap:10px}
.wz-country{background:var(--card);border-radius:16px;box-shadow:var(--e2);padding:14px 16px;
  display:flex;align-items:center;gap:14px;width:100%;text-align:right;transition:transform .14s var(--ease)}
.wz-country:active{transform:scale(.99)}
.wz-country .fl{font-size:30px;line-height:1;flex:0 0 auto}
.wz-country b{display:block;font-size:17px;font-weight:700}
.wz-country span span{display:block;font-size:12px;color:var(--ink2);margin-top:3px}
.wz-country>span:nth-child(2){flex:1 1 auto;min-width:0}
.lx-stage .wz-country .ms{font-size:20px;color:var(--ink3)}
.wz-dates{height:52px;border-radius:14px;background:var(--p-10);display:flex;align-items:center;gap:10px;
  padding:0 14px;width:100%;color:var(--ink)}
.wz-dates .ms{font-size:15px;color:var(--p)}
.wz-dates b{font-size:15px;font-weight:700}
.wz-dates .grow{flex:1 1 auto}
.wz-verdict{border-radius:22px;background:var(--ai-brush);box-shadow:var(--e6);padding:16px;
  display:flex;align-items:flex-start;gap:12px;color:var(--ink);font-size:13.5px;line-height:1.4}
.wz-verdict .vy-orb{width:32px;height:32px;border-radius:10px}
.wz-verdict .vy-orb .ms{font-size:15px}
.wz-seg{display:flex;gap:5px}
.wz-seg i{flex:1 1 0;height:4px;border-radius:999px;background:rgba(2,48,71,.10)}
.wz-seg i.on{background:var(--p)}
.wz-opts{display:flex;flex-direction:column;gap:11px}
.wz-optrow{min-height:54px;border-radius:16px;border:1.5px solid rgba(2,48,71,.07);background:var(--card);
  padding:12px;text-align:center;transition:background .14s var(--ease),border-color .14s var(--ease)}
.wz-optrow b{display:block;font-size:16px;font-weight:700}
.wz-optrow span{display:block;font-size:13px;color:var(--ink2);margin-top:3px}
.wz-optrow.on{background:var(--p-14);border-color:rgba(0,160,196,.55)}
.wz-optrow.on b{color:var(--p)}
.wz-optrow.on span{color:rgba(0,160,196,.85)}
.wz-skip{font-size:14px;font-weight:600;color:var(--p);text-align:center;width:100%;padding:10px 0}
/* DestinationPicker.kt:258 — the search field's supportingText (labelSmall) */
.wz-support{font-size:11.5px;color:var(--ink3);text-align:right;margin-top:-8px}
/* TripDatesStep.kt:262-332 — season strip */
.season{display:flex;flex-direction:column;gap:12px;padding:16px}
.season .hd{display:flex;align-items:center;gap:10px}
.season .hd .vy-soft{width:34px;height:34px;border-radius:10px}
.season .hd .vy-soft .ms{font-size:17px}
.season .hd b{display:block;font-size:15px;font-weight:700}
.season .hd span span{display:block;font-size:11.5px;color:var(--ink3);margin-top:2px}
.season .bars{display:flex;gap:4px}
.season .mo{flex:1 1 0;display:flex;flex-direction:column;align-items:center;opacity:.4}
.season .mo.on{opacity:1}
.season .mo i{display:block;width:100%;border-radius:4px;margin-top:auto}
.season .mo>i{align-self:stretch}
.season .mo em{font-style:normal;font-size:8.5px;font-weight:600;color:var(--ink3);margin-top:4px;white-space:nowrap}
.season .mo.on em{font-weight:900;color:var(--ink)}
.season .mo.on i{border:2px solid var(--ink)}
.season .bars .mo{justify-content:flex-end;height:68px}
.season .lg{display:flex;gap:14px}
.season .lg span{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;color:var(--ink2)}
.season .lg i{width:8px;height:8px;border-radius:50%}
.build-card{border-radius:24px;background:var(--ai-brush);box-shadow:0 14px 30px rgba(2,48,71,.18);padding:26px;
  display:flex;flex-direction:column;align-items:center;gap:14px;color:var(--ink);margin-top:20px}
.build-card .orb{width:54px;height:54px;border-radius:16px;background:rgba(2,48,71,.14);display:grid;place-items:center}
.build-card .orb .ms{font-size:26px}
.build-card b{font-size:17px;font-weight:900}
.build-card .pct{font-size:15px;font-weight:900}
.build-card .track{width:260px;max-width:100%;height:6px;border-radius:4px;background:rgba(2,48,71,.28);overflow:hidden}
.build-card .track i{display:block;height:100%;border-radius:4px;background:#023047;transition:width .4s var(--ease)}
.build-card .hint{font-size:13px;opacity:.85;text-align:center;line-height:1.4;min-height:2.6em}
.build-note{font-size:14px;font-weight:600;color:var(--p);text-align:center;margin-top:14px}

/* ---------- sheets, toast, transitions ---------- */
.lx-scrim{position:absolute;inset:0;background:rgba(2,48,71,.32);opacity:0;pointer-events:none;
  transition:opacity .26s var(--ease);z-index:8}
.lx-scrim.on{opacity:1;pointer-events:auto}
.lx-sheet{position:absolute;inset:auto 0 0 0;background:var(--card);border-radius:28px 28px 0 0;
  padding:10px 18px 22px;transform:translateY(102%);transition:transform .32s var(--ease);z-index:9;
  max-height:84%;overflow-y:auto;scrollbar-width:none}
.lx-sheet::-webkit-scrollbar{display:none}
.lx-sheet.on{transform:none}
.lx-sheet .grab{width:42px;height:4px;border-radius:99px;background:rgba(2,48,71,.15);margin:0 auto 14px}
.lx-sheet h4{font-size:20px;font-weight:700}
.lx-sheet .lead{font-size:13px;color:var(--ink2);line-height:1.5;margin-top:6px;white-space:pre-line}
.lx-sheet .lbl{font-size:13px;font-weight:600;margin:14px 0 8px}
.sh-head{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.sh-head .vy-soft{width:44px;height:44px;border-radius:14px}
.sh-head .vy-soft .ms{font-size:22px}
.sh-head b{display:block;font-size:16.5px;font-weight:700}
.sh-head span{display:block;font-size:12px;color:var(--ink3);margin-top:3px}
.sh-rows{display:flex;flex-direction:column;gap:8px;margin:6px -6px 0}
.sh-div{height:1px;background:rgba(2,48,71,.09);margin:2px 6px}
.sh-row{display:flex;align-items:center;gap:12px;padding:12px 6px;border-radius:12px;font-size:14.5px;
  font-weight:600;width:100%;text-align:right;color:var(--ink)}
.lx-stage .sh-row .ms{font-size:20px;color:var(--p)}
.sh-row.ai{color:var(--ai)}
.sh-row.ai .ms{color:var(--ai)}
.sh-row.danger{color:var(--danger)}
.sh-row.danger .ms{color:var(--danger)}
.sh-row .soon{margin-inline-start:auto;font-size:10.5px;font-weight:700;color:var(--ink3);
  background:var(--surf2);border-radius:50px;padding:3px 8px}
.lx-toast{position:absolute;left:50%;bottom:86px;transform:translate(-50%,14px);background:var(--ink);color:#fff;
  border-radius:14px;padding:11px 16px;font-size:13px;font-weight:600;opacity:0;pointer-events:none;
  transition:all .28s var(--ease);z-index:16;display:flex;align-items:center;gap:7px;max-width:90%;text-align:right}
.lx-toast.on{opacity:1;transform:translate(-50%,0)}
.lx-stage .lx-toast .ms{font-size:18px;color:var(--gold)}
.lx-screen{position:absolute;inset:0;display:flex;flex-direction:column;background:var(--page)}
.lx-screen.enter{animation:screen-in .28s var(--ease)}
@keyframes screen-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.lx-view{position:relative;flex:1 1 auto;overflow:hidden}

/* ---------- guided tour + controls ---------- */
.lx-cursor{position:absolute;width:28px;height:28px;border-radius:50%;border:2px solid rgba(2,48,71,.45);
  background:rgba(255,255,255,.5);pointer-events:none;z-index:20;opacity:0;transform:translate(-50%,-50%);
  transition:opacity .3s var(--ease),left .45s var(--ease),top .45s var(--ease)}
.lx-cursor.on{opacity:1}
.lx-cursor.tap{animation:tap .4s var(--ease)}
@keyframes tap{50%{transform:translate(-50%,-50%) scale(.6);background:rgba(0,160,196,.5)}}
.lx-ctrls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center}
.lx-ctrls button{display:inline-flex;align-items:center;gap:5px;background:var(--surf2);color:var(--p2);
  border:none;border-radius:11px;height:36px;padding:0 13px;font-family:inherit;font-size:13px;font-weight:700;cursor:pointer}
.lx-ctrls button:hover{filter:brightness(.96)}
.lx-ctrls .ms{font-size:18px}
.lx-cap{font-weight:700;font-size:14.5px;color:var(--p2);text-align:center;min-height:1.4em;margin:0}
.lx-hint{display:flex;align-items:center;gap:5px;font-size:12.5px;color:var(--ink3);font-weight:600;margin:0}
.lx-hint .ms{font-size:15px}
.lx-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

@media (prefers-reduced-motion:reduce){
  .lx-stage *,.lx-cursor,.op-ring i{animation:none!important;transition:none!important}
  .op-ring i{opacity:.14;transform:scale(1.09)}
  .op-ring i:nth-child(2){opacity:0}
}