/* ================================================================
   KURUKSHETRA — visual system
   Palette drawn from the material culture of the Mahabharata era:
   Painted Grey Ware clay, oxidised copper, river slate, bone and
   weathered sandstone. Deliberately restrained — the photographs
   carry the colour, the interface stays quiet.
   ================================================================ */
:root{
  /* surfaces */
  --bone:#F5F2EC;          /* page */
  --surface:#FFFFFF;       /* cards */
  --surface-2:#FAF8F4;
  --stone:#E4DED2;         /* hairlines */
  --stone-2:#D3CABA;

  /* ink */
  --ink:#1A1814;
  --ink-2:#4A4439;
  --muted:#7A7264;

  /* accents */
  --clay:#9A4A33;          /* terracotta — primary action */
  --clay-deep:#7A3826;
  --clay-wash:#F6EBE6;
  --slate:#27404E;         /* river slate — navigation */
  --slate-deep:#1B2E39;
  --brass:#9C7C3C;         /* muted brass — highlights only */
  --brass-wash:#F5EFE2;

  /* status */
  --open:#3E6B4B;
  --open-wash:#EBF2ED;
  --shut:#A34437;
  --shut-wash:#F8ECEA;

  --shadow-1:0 1px 2px rgba(26,24,20,.05), 0 2px 8px rgba(26,24,20,.04);
  --shadow-2:0 4px 16px rgba(26,24,20,.10);
  --shadow-3:0 12px 34px rgba(26,24,20,.16);

  --r-xs:8px; --r-sm:12px; --r:16px; --r-lg:20px; --r-xl:26px;
  --tap:48px; --maxw:480px;

  --sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,"Georgia",serif;
  --deva:"Noto Sans Devanagari","Nirmala UI",system-ui,sans-serif;

  /* grounded motion — short, flat, no bounce */
  --ease:cubic-bezier(.22,.61,.36,1);
  --t-fast:140ms; --t:190ms; --t-slow:260ms;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:var(--sans); color:var(--ink); background:#E9E4DA;
  line-height:1.5; font-size:calc(16px*var(--ts)); -webkit-tap-highlight-color:transparent;
  -webkit-font-smoothing:antialiased;
}
:lang(hi){font-family:var(--deva); line-height:1.72}
button{font-family:inherit;color:inherit}
img{max-width:100%;display:block}
h1,h2,h3,h4{margin:0;font-weight:600}
p{margin:0}

#app{
  max-width:var(--maxw); margin:0 auto; min-height:100vh; min-height:100dvh;
  background:var(--bone); position:relative; overflow-x:hidden;
  box-shadow:0 0 0 1px rgba(26,24,20,.05);
}

/* ---------- type ---------- */
.display{font-family:var(--serif); font-weight:600; letter-spacing:-.01em; color:var(--ink)}
:lang(hi) .display{font-family:var(--deva); letter-spacing:0}
.eyebrow{font-size:calc(10.5px*var(--ts));letter-spacing:.15em;text-transform:uppercase;color:var(--brass);font-weight:700}
:lang(hi) .eyebrow{letter-spacing:.06em}
.muted{color:var(--muted)}
.tnum{font-variant-numeric:tabular-nums}

/* ---------- header ---------- */
header{
  position:sticky; top:0; z-index:40; background:rgba(245,242,236,.92);
  backdrop-filter:saturate(1.4) blur(12px); -webkit-backdrop-filter:saturate(1.4) blur(12px);
  border-bottom:1px solid var(--stone);
}
.hbar{display:flex;align-items:center;gap:8px;padding:9px 14px;min-height:58px}
.brand{display:flex;align-items:center;gap:10px;min-width:0;border:0;background:none;
  cursor:pointer;padding:0;min-height:44px}
.seal{width:38px;height:38px;flex:0 0 auto;border-radius:10px;display:grid;place-items:center;
  background:#fff;border:1px solid var(--stone);overflow:hidden;padding:2px;box-shadow:var(--shadow-1)}
.seal img{width:100%;height:100%;object-fit:contain}
.seal svg{width:23px;height:23px}
.wordmark{line-height:1.15;min-width:0;text-align:left}
.wordmark b{font-family:var(--serif);font-size:calc(16.5px*var(--ts));display:block;font-weight:600;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:lang(hi) .wordmark b{font-family:var(--deva);font-size:calc(16px*var(--ts))}
.wordmark span{font-size:calc(9.5px*var(--ts));letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-weight:700}
.hspace{flex:1}
.iconbtn{width:44px;height:44px;min-width:44px;border:0;background:transparent;border-radius:var(--r-sm);
  display:grid;place-items:center;color:var(--ink-2);cursor:pointer;transition:background var(--t-fast) var(--ease)}
.iconbtn:active{background:rgba(26,24,20,.06)}
.iconbtn svg{width:21px;height:21px}
.langbtn{border:1px solid var(--stone-2);background:var(--surface);border-radius:999px;height:44px;
  min-width:52px;padding:0 12px;font-weight:700;font-size:calc(12.5px*var(--ts));color:var(--ink-2);cursor:pointer;
  display:flex;align-items:center;justify-content:center;letter-spacing:.03em}

/* ---------- layout ---------- */
main{padding:0 16px calc(88px + env(safe-area-inset-bottom))}
.screen{animation:rise var(--t) var(--ease) both}
@keyframes rise{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.sec{margin:26px 0}
.sec-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 13px}
.sec-head h2{font-family:var(--serif);font-size:calc(19.5px*var(--ts));font-weight:600}
:lang(hi) .sec-head h2{font-family:var(--deva);font-size:calc(19px*var(--ts))}
.link{color:var(--clay);font-weight:650;font-size:calc(13px*var(--ts));background:none;border:0;cursor:pointer;
  padding:11px 4px;min-height:44px;display:inline-flex;align-items:center;gap:4px}
.link svg{width:14px;height:14px}

/* ---------- buttons ---------- */
.btn{appearance:none;border:0;cursor:pointer;border-radius:var(--r-sm);font-weight:650;font-size:calc(15px*var(--ts));
  min-height:var(--tap);padding:0 18px;display:inline-flex;align-items:center;justify-content:center;
  gap:9px;width:100%;transition:transform var(--t-fast) var(--ease),background var(--t-fast) var(--ease);
  letter-spacing:-.005em}
.btn svg{width:18px;height:18px;flex:0 0 auto}
.btn:active{transform:translateY(1px)}
.btn.primary{background:var(--clay);color:#fff}
.btn.primary:active{background:var(--clay-deep)}
.btn.nav{background:var(--slate);color:#fff}
.btn.nav:active{background:var(--slate-deep)}
.btn.ghost{background:var(--surface);border:1px solid var(--stone-2);color:var(--ink)}
.btn.quiet{background:rgba(26,24,20,.05);color:var(--ink)}
.btn.sm{min-height:40px;font-size:calc(13px*var(--ts));padding:0 14px;width:auto;border-radius:10px}
.btn:disabled{opacity:.4;cursor:default}

/* ---------- chips ---------- */
.chip{border:1px solid var(--stone-2);background:var(--surface);border-radius:999px;padding:0 15px;
  font-size:calc(13.5px*var(--ts));font-weight:600;color:var(--ink-2);cursor:pointer;white-space:nowrap;
  min-height:42px;display:inline-flex;align-items:center;gap:7px;
  transition:background var(--t-fast) var(--ease),border-color var(--t-fast) var(--ease)}
.chip svg{width:15px;height:15px}
.chip.on{background:var(--ink);border-color:var(--ink);color:var(--bone)}
.chip.on.warm{background:var(--clay);border-color:var(--clay);color:#fff}
.hscroll{display:flex;gap:8px;overflow-x:auto;padding:2px 16px 10px;margin:0 -16px;scrollbar-width:none}
.hscroll::-webkit-scrollbar{display:none}

/* ---------- status + tags ---------- */
.status{display:inline-flex;align-items:center;gap:5px;font-size:calc(11.5px*var(--ts));font-weight:700;
  border-radius:6px;padding:4px 8px;letter-spacing:.01em}
.status.open{background:var(--open-wash);color:var(--open)}
.status.shut{background:var(--shut-wash);color:var(--shut)}
.status::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;flex:0 0 auto}
.tag{font-size:calc(11.5px*var(--ts));color:var(--ink-2);border-radius:6px;padding:4px 8px;font-weight:600;
  display:inline-flex;align-items:center;gap:5px;background:rgba(26,24,20,.045)}
.tag svg{width:13px;height:13px;color:var(--muted)}
.tag.brass{background:var(--brass-wash);color:#6E5624}
.tag.brass svg{color:#9C7C3C}

/* ---------- cards ---------- */
.card{background:var(--surface);border:1px solid var(--stone);border-radius:var(--r);box-shadow:var(--shadow-1)}
.ph{background:var(--stone);position:relative;overflow:hidden}
.ph img{width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity var(--t-slow) var(--ease)}
.ph img.in{opacity:1}
.ph::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(26,24,20,.06);pointer-events:none}

/* note / callout */
.note{background:var(--surface-2);border:1px solid var(--stone);border-radius:var(--r-sm);
  padding:11px 13px;font-size:calc(12.5px*var(--ts));color:var(--ink-2);display:flex;gap:9px;line-height:1.55}
.note svg{width:15px;height:15px;flex:0 0 auto;margin-top:2px;color:var(--brass)}
/* ---------- splash / language gate ---------- */
.splash{position:fixed;inset:0;z-index:200;display:flex;flex-direction:column;
  background:radial-gradient(120% 78% at 50% 26%,#2A4453 0%,#1B2E39 52%,#132631 100%);
  color:#F2EEE6;overflow:hidden;padding:0 26px calc(30px + env(safe-area-inset-bottom))}
.splash .rays{position:absolute;left:50%;top:20%;width:150vw;height:150vw;transform:translate(-50%,-50%);
  z-index:0;opacity:0;background:conic-gradient(from 0deg,
    rgba(232,201,138,.055) 0deg 8deg,transparent 8deg 30deg,
    rgba(232,201,138,.055) 30deg 38deg,transparent 38deg 60deg,
    rgba(232,201,138,.055) 60deg 68deg,transparent 68deg 90deg,
    rgba(232,201,138,.055) 90deg 98deg,transparent 98deg 120deg,
    rgba(232,201,138,.055) 120deg 128deg,transparent 128deg 150deg,
    rgba(232,201,138,.055) 150deg 158deg,transparent 158deg 180deg,
    rgba(232,201,138,.055) 180deg 188deg,transparent 188deg 210deg,
    rgba(232,201,138,.055) 210deg 218deg,transparent 218deg 240deg,
    rgba(232,201,138,.055) 240deg 248deg,transparent 248deg 270deg,
    rgba(232,201,138,.055) 270deg 278deg,transparent 278deg 300deg,
    rgba(232,201,138,.055) 300deg 308deg,transparent 308deg 330deg,
    rgba(232,201,138,.055) 330deg 338deg,transparent 338deg 360deg);
  animation:raysIn 1.5s var(--ease) .35s forwards, spin 150s linear infinite}
@keyframes raysIn{to{opacity:1}}
@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
.splash .crest{position:relative;z-index:2;flex:1;display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;padding-top:26px}
.splash .halo{position:absolute;width:min(74vw,300px);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(232,201,138,.20),rgba(232,201,138,0) 66%);
  top:calc(50% - 74px);left:50%;transform:translate(-50%,-50%) scale(.6);opacity:0;
  animation:haloIn 1.5s var(--ease) .2s forwards}
@keyframes haloIn{to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.splash .seal{width:min(46vw,178px);aspect-ratio:1;position:relative;z-index:1;border-radius:24px;overflow:hidden;
  opacity:0;transform:scale(.84);filter:drop-shadow(0 10px 30px rgba(0,0,0,.42));
  animation:sealIn 1.05s var(--ease) .1s forwards}
.splash .seal img{width:100%;height:100%;object-fit:contain}
@keyframes sealIn{to{opacity:1;transform:scale(1)}}
.splash .board{margin-top:20px;font-size:calc(9.5px*var(--ts));letter-spacing:.24em;text-transform:uppercase;
  font-weight:700;color:#C8A967;opacity:0;animation:up .7s var(--ease) .62s forwards}
.splash .boardhi{font-family:var(--deva);font-size:calc(12px*var(--ts));color:rgba(242,238,230,.6);
  margin-top:5px;font-weight:600;opacity:0;animation:up .7s var(--ease) .72s forwards}
.splash .rule{width:52px;height:1px;background:linear-gradient(90deg,transparent,#C8A967,transparent);
  margin:20px auto;transform:scaleX(0);animation:ruleIn .8s var(--ease) .86s forwards}
@keyframes ruleIn{to{transform:scaleX(1)}}
.splash h1{font-family:var(--serif);font-size:clamp(34px,10.5vw,46px);font-weight:600;
  letter-spacing:-.02em;line-height:1;opacity:0;animation:up .78s var(--ease) .96s forwards}
.splash h1 .dev{display:block;font-family:var(--deva);font-size:.66em;color:#E0CFA8;
  margin-top:11px;letter-spacing:0;font-weight:600}
.splash .kos{margin-top:16px;font-size:calc(11px*var(--ts));letter-spacing:.2em;text-transform:uppercase;
  color:rgba(242,238,230,.5);font-weight:700;opacity:0;animation:up .78s var(--ease) 1.1s forwards}
@keyframes up{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:none}}
.splash .gate{position:relative;z-index:2;opacity:0;animation:up .8s var(--ease) 1.34s forwards}
.splash .ask{text-align:center;font-size:calc(12.5px*var(--ts));color:rgba(242,238,230,.62);margin-bottom:14px}
.splash .ask .h{font-family:var(--deva);display:block;margin-top:3px}
.splash .langs{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.splash .lang{position:relative;overflow:hidden;border-radius:var(--r);cursor:pointer;
  background:rgba(242,238,230,.07);border:1px solid rgba(242,238,230,.2);color:#F2EEE6;
  padding:19px 12px 17px;display:flex;flex-direction:column;align-items:center;gap:5px;
  transition:background var(--t) var(--ease),border-color var(--t) var(--ease),transform var(--t-fast) var(--ease)}
.splash .lang:active{transform:scale(.975)}
.splash .lang .big{font-size:calc(25px*var(--ts));font-weight:600;line-height:1.1}
.splash .lang .big.dev{font-family:var(--deva);font-size:calc(26px*var(--ts))}
.splash .lang .sub{font-size:calc(10.5px*var(--ts));letter-spacing:.13em;text-transform:uppercase;
  color:rgba(242,238,230,.5);font-weight:700}
.splash .lang .tick{position:absolute;top:9px;right:9px;width:19px;height:19px;border-radius:50%;
  background:#C8A967;color:#1B2E39;display:grid;place-items:center;opacity:0;transform:scale(.5)}
.splash .lang .tick svg{width:12px;height:12px;stroke-width:3}
.splash .lang.chosen{background:rgba(232,201,138,.17);border-color:#C8A967}
.splash .lang.chosen .tick{opacity:1;transform:scale(1);transition:.2s var(--ease)}
.splash .foot{text-align:center;color:rgba(242,238,230,.38);font-size:calc(11px*var(--ts));margin-top:15px}
/* exit: seal lifts, gate drops, whole plate dissolves */
.splash.leaving{pointer-events:none}
.splash.leaving .crest{animation:crestOut .5s var(--ease) forwards}
.splash.leaving .gate{animation:gateOut .34s var(--ease) forwards}
.splash.leaving .rays{animation:raysOut .5s var(--ease) forwards}
@keyframes crestOut{to{opacity:0;transform:translateY(-26px) scale(1.06)}}
@keyframes gateOut{to{opacity:0;transform:translateY(18px)}}
@keyframes raysOut{to{opacity:0}}
.splash.gone{animation:plateOut .34s var(--ease) .06s forwards}
@keyframes plateOut{to{opacity:0;visibility:hidden}}

/* ---------- hub ---------- */
.hub{display:grid;gap:10px}
.hubcard{display:flex;gap:14px;align-items:center;text-align:left;padding:15px;border-radius:var(--r);
  background:var(--surface);border:1px solid var(--stone);box-shadow:var(--shadow-1);cursor:pointer;width:100%;
  transition:transform var(--t-fast) var(--ease)}
.hubcard:active{transform:scale(.99)}
.hubcard .ic{width:44px;height:44px;flex:0 0 auto;border-radius:var(--r-sm);display:grid;place-items:center;
  background:var(--clay-wash);color:var(--clay)}
.hubcard .ic.slate{background:#EAEEF0;color:var(--slate)}
.hubcard .ic.brass{background:var(--brass-wash);color:var(--brass)}
.hubcard .ic svg{width:23px;height:23px}
.hubcard h3{font-family:var(--serif);font-size:calc(16.5px*var(--ts))}
:lang(hi) .hubcard h3{font-family:var(--deva);font-size:calc(16px*var(--ts))}
.hubcard p{margin-top:2px;font-size:calc(12.5px*var(--ts));color:var(--muted);line-height:1.45}
.hubcard .go{margin-left:auto;color:var(--stone-2);display:grid;place-items:center;flex:0 0 auto}
.hubcard .go svg{width:18px;height:18px}

/* ---------- theme tiles ---------- */
.themes{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.tile{position:relative;border-radius:var(--r);overflow:hidden;aspect-ratio:1.42/1;cursor:pointer;border:0;
  padding:12px;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;
  background:var(--slate);box-shadow:var(--shadow-1);transition:transform var(--t-fast) var(--ease)}
.tile:active{transform:scale(.985)}
.tile .tbg{position:absolute;inset:0;z-index:0}
.tile .tbg img{width:100%;height:100%;object-fit:cover}
.tile .tveil{position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(20,30,36,.15) 0%,rgba(20,30,36,.78) 100%)}
.tile .ti{position:relative;z-index:2;color:rgba(255,255,255,.9);margin-bottom:6px}
.tile .ti svg{width:20px;height:20px}
.tile .tl{position:relative;z-index:2;color:#fff;font-weight:650;font-size:calc(14px*var(--ts));text-align:left;line-height:1.25}
:lang(hi) .tile .tl{font-size:calc(13.5px*var(--ts))}
.tile .tc{position:relative;z-index:2;color:rgba(255,255,255,.62);font-size:calc(11px*var(--ts));font-weight:600;margin-top:2px}

/* ---------- place cards ---------- */
.plist{display:grid;gap:11px}
.pcard{display:flex;gap:13px;padding:11px;cursor:pointer;align-items:stretch;text-align:left;width:100%;
  transition:transform var(--t-fast) var(--ease)}
.pcard:active{transform:scale(.995)}
.pcard .ph{width:92px;height:92px;flex:0 0 auto;border-radius:var(--r-sm)}
.pcard .body{min-width:0;flex:1;display:flex;flex-direction:column}
.pcard h3{font-family:var(--serif);font-size:calc(15.5px*var(--ts));line-height:1.22;font-weight:600}
:lang(hi) .pcard h3{font-family:var(--deva);font-size:calc(15px*var(--ts));line-height:1.4}
.pcard .alt{font-size:calc(12px*var(--ts));color:var(--muted);margin-top:2px}
.pcard .sub{font-size:calc(12.5px*var(--ts));color:var(--ink-2);margin-top:5px;line-height:1.42;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pcard .meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:7px;align-items:center}

/* horizontal feature rail */
.rail{display:flex;gap:12px;overflow-x:auto;padding:2px 16px 12px;margin:0 -16px;
  scroll-snap-type:x mandatory;scrollbar-width:none}
.rail::-webkit-scrollbar{display:none}
.fcard{scroll-snap-align:start;flex:0 0 82%;max-width:300px;border-radius:var(--r);overflow:hidden;
  background:var(--surface);border:1px solid var(--stone);box-shadow:var(--shadow-1);cursor:pointer;
  text-align:left;padding:0;display:block}
.fcard .ph{aspect-ratio:16/10}
.fcard .in{padding:12px 13px 13px}
.fcard h3{font-family:var(--serif);font-size:calc(16px*var(--ts));font-weight:600;line-height:1.2}
:lang(hi) .fcard h3{font-family:var(--deva);font-size:calc(15.5px*var(--ts))}
.fcard p{margin-top:4px;font-size:calc(12.5px*var(--ts));color:var(--muted);line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.fcard .meta{display:flex;gap:6px;margin-top:9px;flex-wrap:wrap}

/* route/circuit card */
.rcard{padding:13px;display:flex;gap:13px;align-items:center;cursor:pointer;width:100%;text-align:left}
.rcard .ic{width:42px;height:42px;border-radius:var(--r-sm);flex:0 0 auto;display:grid;place-items:center;
  background:var(--brass-wash);color:var(--brass)}
.rcard .ic svg{width:22px;height:22px}
.rcard h3{font-family:var(--serif);font-size:calc(15.5px*var(--ts));font-weight:600}
:lang(hi) .rcard h3{font-family:var(--deva);font-size:calc(15px*var(--ts))}
.rcard p{margin-top:2px;font-size:calc(12.5px*var(--ts));color:var(--muted)}

/* ---------- bottom nav ---------- */
nav.tab{position:fixed;left:0;right:0;bottom:0;z-index:50;max-width:var(--maxw);margin:0 auto;
  background:rgba(245,242,236,.94);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border-top:1px solid var(--stone);display:flex;padding:5px 4px calc(5px + env(safe-area-inset-bottom))}
nav.tab button{flex:1;border:0;background:none;padding:7px 2px 5px;display:flex;flex-direction:column;
  align-items:center;gap:4px;color:var(--muted);font-size:calc(10px*var(--ts));font-weight:650;cursor:pointer;
  min-height:52px;letter-spacing:.01em;transition:color var(--t-fast) var(--ease)}
nav.tab button svg{width:22px;height:22px}
nav.tab button.on{color:var(--clay)}
:lang(hi) nav.tab button{font-size:calc(10.5px*var(--ts))}

/* ---------- page head ---------- */
.phead{display:flex;align-items:center;gap:11px;padding:10px 0 14px;min-height:44px}
.phead .back{background:var(--surface);border:1px solid var(--stone);width:42px;height:42px;
  border-radius:var(--r-sm);display:grid;place-items:center;cursor:pointer;color:var(--ink);flex:0 0 auto}
.phead .back svg{width:20px;height:20px}
.phead h1{font-family:var(--serif);font-size:calc(21px*var(--ts));font-weight:600;min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:lang(hi) .phead h1{font-family:var(--deva);font-size:calc(20px*var(--ts))}
/* ---------- planner ---------- */
.steps{display:flex;gap:5px;margin:2px 0 20px}
.steps i{height:3px;border-radius:2px;flex:1;background:var(--stone-2);
  transition:background var(--t) var(--ease)}
.steps i.on{background:var(--clay)}
.q{font-family:var(--serif);font-size:calc(23px*var(--ts));font-weight:600;line-height:1.22;letter-spacing:-.015em}
:lang(hi) .q{font-family:var(--deva);font-size:calc(21px*var(--ts));letter-spacing:0}
.qs{color:var(--muted);font-size:calc(13.5px*var(--ts));margin-top:7px;margin-bottom:20px;line-height:1.5}
.opts{display:grid;gap:9px}
.opt{display:flex;align-items:center;gap:13px;background:var(--surface);border:1px solid var(--stone-2);
  border-radius:var(--r-sm);padding:14px;cursor:pointer;text-align:left;width:100%;min-height:var(--tap);
  transition:border-color var(--t-fast) var(--ease),background var(--t-fast) var(--ease)}
.opt.on{border-color:var(--clay);background:var(--clay-wash)}
.opt .oi{width:36px;height:36px;border-radius:9px;background:rgba(26,24,20,.05);display:grid;
  place-items:center;color:var(--ink-2);flex:0 0 auto}
.opt.on .oi{background:rgba(154,74,51,.12);color:var(--clay)}
.opt .oi svg{width:19px;height:19px}
.opt b{font-size:calc(14.5px*var(--ts));font-weight:600;display:block}
.opt small{display:block;color:var(--muted);font-size:calc(12px*var(--ts));margin-top:2px}
.opt .chk{margin-left:auto;width:21px;height:21px;border-radius:50%;border:1.5px solid var(--stone-2);
  flex:0 0 auto;display:grid;place-items:center}
.opt.on .chk{border-color:var(--clay);background:var(--clay)}
.opt.on .chk::after{content:"";width:9px;height:5px;border-left:2px solid #fff;border-bottom:2px solid #fff;
  transform:rotate(-45deg) translate(1px,-1px)}
.tgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}
.tgrid .chip{justify-content:center}
.field{display:block;margin:16px 0}
.field label{font-size:calc(12px*var(--ts));font-weight:700;color:var(--ink-2);display:block;margin:0 0 7px;
  letter-spacing:.02em;text-transform:uppercase}
:lang(hi) .field label{text-transform:none;letter-spacing:0;font-size:calc(12.5px*var(--ts))}
.field input{width:100%;min-height:var(--tap);border:1px solid var(--stone-2);border-radius:var(--r-sm);
  padding:0 13px;font-size:calc(15px*var(--ts));background:var(--surface);color:var(--ink);font-family:inherit}
.wrap{display:flex;flex-wrap:wrap;gap:8px}
details.more summary{cursor:pointer;font-weight:650;color:var(--clay);padding:14px 2px;list-style:none;
  display:flex;align-items:center;gap:8px;font-size:calc(14px*var(--ts));min-height:44px}
details.more summary::-webkit-details-marker{display:none}
details.more summary svg{width:15px;height:15px;transition:transform var(--t) var(--ease)}
details.more[open] summary svg{transform:rotate(90deg)}
.planbar{position:fixed;left:0;right:0;bottom:0;z-index:45;max-width:var(--maxw);margin:0 auto;
  padding:14px 16px calc(14px + env(safe-area-inset-bottom));display:flex;gap:10px;
  background:linear-gradient(180deg,rgba(245,242,236,0),var(--bone) 26%)}
.planbar .btn:first-child{flex:0 0 88px}
.planbar .btn:last-child{flex:1}

/* ---------- itinerary ---------- */
.summ{padding:18px;border-radius:var(--r-lg);background:var(--slate-deep);color:#EDE9E0;box-shadow:var(--shadow-2)}
.summ .eyebrow{color:#C8A967}
.summ h2{font-family:var(--serif);font-size:calc(22px*var(--ts));font-weight:600;margin-top:6px;line-height:1.18;color:#fff}
:lang(hi) .summ h2{font-family:var(--deva);font-size:calc(20px*var(--ts))}
.mgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;margin:16px 0 14px;
  background:rgba(237,233,224,.14);border-radius:var(--r-sm);overflow:hidden}
.mcell{background:var(--slate-deep);padding:11px 12px}
.mcell b{display:block;font-family:var(--serif);font-size:calc(19px*var(--ts));font-weight:600;color:#fff;letter-spacing:-.01em}
.mcell span{font-size:calc(11px*var(--ts));color:rgba(237,233,224,.6);font-weight:600;letter-spacing:.03em;text-transform:uppercase}
:lang(hi) .mcell span{text-transform:none;letter-spacing:0;font-size:calc(11.5px*var(--ts))}
.fin{display:flex;align-items:center;gap:8px;font-size:calc(13px*var(--ts));font-weight:650;color:#A8D0B4;
  background:rgba(168,208,180,.13);border-radius:9px;padding:9px 12px}
.fin svg{width:16px;height:16px}
.acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}

.tl{margin:22px 0 4px;position:relative}
.tl-item{display:flex;gap:13px}
.tl-gut{display:flex;flex-direction:column;align-items:center;flex:0 0 26px;padding-top:2px}
.tl-dot{width:26px;height:26px;border-radius:50%;background:var(--clay);color:#fff;font-weight:700;
  font-size:calc(12.5px*var(--ts));display:grid;place-items:center;flex:0 0 auto;font-variant-numeric:tabular-nums}
.tl-bar{flex:1;width:1.5px;background:var(--stone-2);margin:5px 0}
.tl-card{flex:1;margin-bottom:4px;padding:11px;cursor:pointer;text-align:left;min-width:0}
.tl-top{display:flex;gap:12px}
.tl-card .ph{width:70px;height:70px;border-radius:10px;flex:0 0 auto}
.tl-card h3{font-family:var(--serif);font-size:calc(15px*var(--ts));line-height:1.2;font-weight:600}
:lang(hi) .tl-card h3{font-family:var(--deva);font-size:calc(14.5px*var(--ts))}
.tl-when{display:flex;gap:5px;flex-wrap:wrap;margin-top:6px;font-size:calc(11.5px*var(--ts));color:var(--muted)}
.tl-when b{color:var(--ink);font-weight:650;font-variant-numeric:tabular-nums}
.tl-why{font-size:calc(12.5px*var(--ts));color:var(--ink-2);margin-top:9px;line-height:1.5;
  padding-left:10px;border-left:2px solid var(--stone-2)}
.tl-btns{display:flex;gap:7px;margin-top:10px}
.leg{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:calc(12px*var(--ts));font-weight:600;
  padding:7px 0 7px 39px}
.leg svg{width:14px;height:14px;color:var(--slate)}
.dropped{font-size:calc(12.5px*var(--ts));color:var(--ink-2);background:var(--surface-2);border:1px solid var(--stone);
  border-radius:var(--r-sm);padding:12px 13px;line-height:1.75}

/* ---------- journey ---------- */
.jcard{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-2);border:1px solid var(--stone)}
.jcard .ph{aspect-ratio:16/11;position:relative}
.jcard .ov{position:absolute;inset:auto 0 0 0;z-index:2;padding:15px;color:#fff;
  background:linear-gradient(180deg,rgba(20,26,30,0),rgba(20,26,30,.86))}
.jcard .ov .st{font-size:calc(10px*var(--ts));letter-spacing:.16em;text-transform:uppercase;font-weight:700;
  color:rgba(255,255,255,.72)}
:lang(hi) .jcard .ov .st{letter-spacing:.04em;text-transform:none;font-size:calc(11px*var(--ts))}
.jcard .ov h2{font-family:var(--serif);font-size:calc(22px*var(--ts));font-weight:600;margin-top:4px;line-height:1.15}
:lang(hi) .jcard .ov h2{font-family:var(--deva);font-size:calc(20px*var(--ts))}
.jmeta{padding:12px;display:flex;gap:7px;flex-wrap:wrap;background:var(--surface)}
.jsub{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:9px}
.jprog{font-size:calc(12px*var(--ts));color:var(--muted);text-align:center;margin:16px 0 0;font-weight:600}

/* ---------- detail ---------- */
.hero{position:relative;margin:0 -16px;aspect-ratio:4/3;background:var(--stone)}
.hero .ph{position:absolute;inset:0}
.hero .grad{position:absolute;inset:0;z-index:2;
  background:linear-gradient(180deg,rgba(20,26,30,.42) 0%,rgba(20,26,30,0) 34%,rgba(20,26,30,0) 62%,rgba(26,24,20,.5) 100%)}
.hero .fbtn{position:absolute;top:12px;z-index:3;background:rgba(255,255,255,.94);width:40px;height:40px;
  border-radius:50%;border:0;display:grid;place-items:center;box-shadow:var(--shadow-1);cursor:pointer;color:var(--ink)}
.hero .fbtn svg{width:20px;height:20px}
.hero .b-back{left:12px} .hero .b-fav{right:12px}
.hero .credit{position:absolute;right:10px;bottom:9px;z-index:3;font-size:calc(9.5px*var(--ts));color:rgba(255,255,255,.72);
  background:rgba(20,26,30,.4);padding:3px 7px;border-radius:5px;backdrop-filter:blur(4px)}
.dtitle{margin-top:16px}
.dtitle h1{font-family:var(--serif);font-size:calc(26px*var(--ts));line-height:1.12;font-weight:600;letter-spacing:-.02em}
:lang(hi) .dtitle h1{font-family:var(--deva);font-size:calc(23px*var(--ts));letter-spacing:0;line-height:1.35}
.dtitle .alt{color:var(--muted);font-size:calc(15px*var(--ts));margin-top:4px}
.dmeta{display:flex;gap:7px;flex-wrap:wrap;align-items:center;margin:13px 0}
.blk{margin:24px 0}
.blk h2{font-family:var(--serif);font-size:calc(18px*var(--ts));font-weight:600;margin-bottom:11px;
  display:flex;align-items:center;gap:9px}
:lang(hi) .blk h2{font-family:var(--deva);font-size:calc(17.5px*var(--ts))}
.blk h2 svg{width:17px;height:17px;color:var(--brass);flex:0 0 auto}
.prose{font-size:calc(14.5px*var(--ts));line-height:1.68;color:var(--ink-2)}
:lang(hi) .prose{font-size:calc(15px*var(--ts));line-height:1.82}
.prose p+p{margin-top:12px}
.ncards{display:grid;gap:8px}
.ncard{background:var(--surface);border:1px solid var(--stone);border-radius:var(--r-sm);
  padding:12px 13px;border-left:2.5px solid var(--brass)}
.ncard b{font-size:calc(10.5px*var(--ts));color:var(--brass);text-transform:uppercase;letter-spacing:.08em;
  display:block;margin-bottom:4px;font-weight:700}
:lang(hi) .ncard b{text-transform:none;letter-spacing:.02em;font-size:calc(12px*var(--ts))}
.ncard p{font-size:calc(13.5px*var(--ts));line-height:1.55;color:var(--ink-2)}
.facts{background:var(--surface);border:1px solid var(--stone);border-radius:var(--r);overflow:hidden}
.frow{display:flex;justify-content:space-between;gap:14px;padding:12px 14px;
  border-bottom:1px solid var(--stone);font-size:calc(13.5px*var(--ts));align-items:flex-start}
.frow:last-child{border-bottom:0}
.frow .k{color:var(--muted);font-weight:600;flex:0 0 auto}
.frow .v{text-align:right;font-weight:600;color:var(--ink)}
.frow .v.hi{font-weight:600}
.inside{display:grid;gap:8px}
.ins{display:flex;gap:11px;align-items:flex-start;background:var(--surface);border:1px solid var(--stone);
  border-radius:var(--r-sm);padding:11px 12px}
.ins .n{width:22px;height:22px;border-radius:50%;background:var(--clay-wash);color:var(--clay);
  font-size:calc(11px*var(--ts));font-weight:700;display:grid;place-items:center;flex:0 0 auto;margin-top:1px}
.ins b{font-size:calc(13.5px*var(--ts));font-weight:650;display:block}
.ins p{font-size:calc(12.5px*var(--ts));color:var(--muted);margin-top:3px;line-height:1.5}
.dockbar{position:sticky;bottom:calc(88px + env(safe-area-inset-bottom));z-index:20;display:flex;gap:9px;
  padding:12px 0;background:linear-gradient(180deg,rgba(245,242,236,0),var(--bone) 30%)}

/* ---------- map ---------- */
.mapbox{margin:0 -16px;position:relative;height:calc(100vh - 268px);min-height:380px;background:#DCE3E2}
.mapbox svg{width:100%;height:100%;display:block}
.mtools{position:absolute;top:12px;left:0;right:0;display:flex;gap:7px;overflow-x:auto;
  padding:0 12px 4px;scrollbar-width:none}
.mtools::-webkit-scrollbar{display:none}
.mtools .chip{min-height:44px;padding:0 14px;font-size:calc(12.5px*var(--ts));box-shadow:var(--shadow-1)}
.mkey{position:absolute;bottom:12px;left:12px;background:rgba(255,255,255,.95);border:1px solid var(--stone);
  border-radius:10px;padding:9px 11px;font-size:calc(10.5px*var(--ts));box-shadow:var(--shadow-1);max-width:58%}
.mkey b{display:block;color:var(--ink);margin-bottom:5px;font-size:calc(10px*var(--ts));text-transform:uppercase;letter-spacing:.08em}
:lang(hi) .mkey b{text-transform:none;letter-spacing:0;font-size:calc(11.5px*var(--ts))}
.mkey i{display:inline-flex;align-items:center;gap:5px;margin:2px 8px 2px 0;font-style:normal;color:var(--ink-2)}
.mkey i::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--d,var(--clay))}
.gattr{position:absolute;right:10px;bottom:10px;font-size:calc(9px*var(--ts));color:var(--muted);
  background:rgba(255,255,255,.8);padding:2px 6px;border-radius:4px}

/* ---------- sheet, toast, misc ---------- */
.scrim{position:fixed;inset:0;background:rgba(20,18,14,.42);z-index:70;opacity:0;
  transition:opacity var(--t) var(--ease);pointer-events:none;backdrop-filter:blur(2px)}
.scrim.on{opacity:1;pointer-events:auto}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:71;max-width:var(--maxw);margin:0 auto;
  background:var(--bone);border-radius:var(--r-xl) var(--r-xl) 0 0;box-shadow:0 -8px 40px rgba(20,18,14,.28);
  transform:translateY(101%);transition:transform var(--t-slow) var(--ease);
  padding:8px 18px calc(20px + env(safe-area-inset-bottom));max-height:88vh;overflow-y:auto}
.sheet.on{transform:none}
.sheet .grab{width:38px;height:4px;border-radius:2px;background:var(--stone-2);margin:6px auto 14px}
.toast{position:fixed;bottom:calc(100px + env(safe-area-inset-bottom));left:50%;
  transform:translateX(-50%) translateY(14px);background:var(--ink);color:var(--bone);padding:11px 17px;
  border-radius:10px;font-size:calc(13.5px*var(--ts));font-weight:600;z-index:90;opacity:0;
  transition:opacity var(--t) var(--ease),transform var(--t) var(--ease);max-width:86%;text-align:center}
.toast.on{opacity:1;transform:translateX(-50%) translateY(0)}
.search{display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--stone-2);
  border-radius:var(--r-sm);padding:0 13px;min-height:var(--tap)}
.search svg{width:19px;height:19px;color:var(--muted);flex:0 0 auto}
.search input{border:0;outline:0;flex:1;font-size:calc(15px*var(--ts));background:transparent;min-height:44px;
  font-family:inherit;min-width:0;color:var(--ink)}
.empty{text-align:center;color:var(--muted);padding:52px 22px}
.empty svg{width:44px;height:44px;color:var(--stone-2);margin:0 auto 12px}
.empty p.t{font-family:var(--serif);font-size:calc(17px*var(--ts));color:var(--ink);font-weight:600;margin-bottom:6px}
.sw{width:52px;height:32px;appearance:none;background:var(--stone-2);border-radius:999px;position:relative;
  cursor:pointer;transition:background var(--t) var(--ease);flex:0 0 auto;border:0}
.sw:checked{background:var(--clay)}
.sw::after{content:"";position:absolute;top:3px;left:3px;width:26px;height:26px;border-radius:50%;
  background:#fff;transition:transform var(--t) var(--ease);box-shadow:0 1px 3px rgba(0,0,0,.2)}
.sw:checked::after{transform:translateX(20px)}
/* ---------- hero carousel ---------- */
.hero-c{margin:4px -16px 0;position:relative}
.hero-track{display:flex;gap:11px;overflow-x:auto;scroll-snap-type:x mandatory;
  scrollbar-width:none;padding:2px 16px 13px;scroll-behavior:smooth;-webkit-overflow-scrolling:touch}
.hero-track::-webkit-scrollbar{display:none}
.hero-slide{flex:0 0 calc(100% - 58px);scroll-snap-align:center;position:relative;border:0;padding:0;
  aspect-ratio:4/5;max-height:60vh;border-radius:var(--r-xl);overflow:hidden;cursor:pointer;
  background:var(--stone-2);display:block;text-align:left;box-shadow:var(--shadow-2);
  transition:transform var(--t-fast) var(--ease)}
.hero-slide:active{transform:scale(.988)}
.hs-img{position:absolute;inset:0;z-index:0}
.hs-img img{width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s var(--ease)}
.hs-img img.in{opacity:1}
.hs-scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,
  rgba(16,22,26,.46) 0%,rgba(16,22,26,.06) 30%,rgba(16,22,26,.24) 52%,rgba(16,22,26,.9) 100%)}
.hs-body{position:absolute;inset:auto 0 0 0;z-index:2;padding:17px 17px 18px;color:#fff}
.hs-kick{display:flex;align-items:center;gap:8px;font-size:calc(9.5px*var(--ts));letter-spacing:.19em;
  text-transform:uppercase;font-weight:700;color:#E8C98A}
.hs-kick::before{content:"";width:15px;height:1px;background:#E8C98A;flex:0 0 auto}
:lang(hi) .hs-kick{letter-spacing:.06em;text-transform:none;font-size:calc(11px*var(--ts))}
.hs-name{display:block;font-family:var(--serif);font-size:calc(24px*var(--ts));font-weight:600;line-height:1.13;margin-top:9px;
  text-shadow:0 1px 12px rgba(0,0,0,.4)}
:lang(hi) .hs-name{font-family:var(--deva);font-size:calc(21px*var(--ts));line-height:1.32}
.hs-alt{display:block;font-size:calc(13px*var(--ts));color:rgba(255,255,255,.7);margin-top:3px}
.hs-fact{display:flex;gap:9px;margin-top:12px;padding-top:12px;font-size:calc(12.8px*var(--ts));line-height:1.52;
  color:rgba(255,255,255,.92);border-top:1px solid rgba(255,255,255,.22)}
:lang(hi) .hs-fact{font-size:calc(13px*var(--ts));line-height:1.68}
.hs-fact svg{width:15px;height:15px;flex:0 0 auto;color:#E8C98A;margin-top:2px}
.hero-dots{display:flex;gap:6px;justify-content:center;padding:0 0 2px}
.hero-dots i{width:6px;height:6px;border-radius:3px;background:var(--stone-2);
  transition:width var(--t) var(--ease),background var(--t) var(--ease)}
.hero-dots i.on{background:var(--clay);width:19px}
/* ---------- install card ---------- */
.dl{margin:24px 0 10px;padding:16px;border-radius:var(--r);background:var(--slate-deep);color:#EDE9E0}
.dl .row{display:flex;gap:13px;align-items:center}
.dl .ic{width:42px;height:42px;border-radius:11px;background:rgba(232,201,138,.15);color:#E8C98A;
  display:grid;place-items:center;flex:0 0 auto}
.dl .ic svg{width:22px;height:22px}
.dl h3{font-family:var(--serif);font-size:calc(16px*var(--ts));color:#fff;font-weight:600}
:lang(hi) .dl h3{font-family:var(--deva);font-size:calc(15.5px*var(--ts))}
.dl p{font-size:calc(12px*var(--ts));color:rgba(237,233,224,.6);margin-top:3px;line-height:1.5}
.dl .go{width:100%;margin-top:14px;background:#E8E3D8;color:var(--slate-deep);border:0;
  border-radius:var(--r-sm);min-height:46px;font-weight:700;font-size:calc(14.5px*var(--ts));cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:9px;font-family:inherit}
.dl .go svg{width:18px;height:18px}
.dl .plats{display:flex;gap:7px;justify-content:center;margin-top:10px;
  font-size:calc(10.5px*var(--ts));color:rgba(237,233,224,.45);font-weight:600;letter-spacing:.04em}
.steps-io{display:grid;gap:9px;margin-top:4px}
.step-io{display:flex;gap:12px;align-items:flex-start;background:var(--surface);
  border:1px solid var(--stone);border-radius:var(--r-sm);padding:12px 13px}
.step-io .n{width:23px;height:23px;border-radius:50%;background:var(--clay);color:#fff;font-size:calc(11.5px*var(--ts));
  font-weight:700;display:grid;place-items:center;flex:0 0 auto;margin-top:1px}
.step-io b{font-size:calc(13.5px*var(--ts));display:block;font-weight:650}
.step-io p{font-size:calc(12.5px*var(--ts));color:var(--muted);margin-top:2px;line-height:1.5}
.step-io .mini{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;
  border-radius:5px;background:var(--clay-wash);color:var(--clay);vertical-align:-5px;margin:0 2px}
.step-io .mini svg{width:13px;height:13px}
/* ---------- page motion ---------- */
main.screen{animation:pageIn .3s var(--ease) both}
@keyframes pageIn{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
main.screen.fwd{animation:pageFwd .32s var(--ease) both}
@keyframes pageFwd{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:none}}
main.screen.rev{animation:pageRev .32s var(--ease) both}
@keyframes pageRev{from{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:none}}
/* children arrive in sequence rather than all at once */
.stagger>*{animation:itemIn .42s var(--ease) both}
@keyframes itemIn{from{opacity:0;transform:translateY(11px)}to{opacity:1;transform:none}}
.stagger>*:nth-child(1){animation-delay:.03s}
.stagger>*:nth-child(2){animation-delay:.07s}
.stagger>*:nth-child(3){animation-delay:.11s}
.stagger>*:nth-child(4){animation-delay:.15s}
.stagger>*:nth-child(5){animation-delay:.19s}
.stagger>*:nth-child(6){animation-delay:.23s}
.stagger>*:nth-child(7){animation-delay:.26s}
.stagger>*:nth-child(8){animation-delay:.29s}
.stagger>*:nth-child(n+9){animation-delay:.32s}
.hero .ph img{animation:heroIn .7s var(--ease) both}
@keyframes heroIn{from{opacity:0;transform:scale(1.05)}to{opacity:1;transform:none}}



:focus-visible{outline:2.5px solid var(--slate);outline-offset:2px;border-radius:6px}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}

/* ================================================================
   WEATHER · DATE PICKER · WALKTHROUGH
   Same restrained system: bone surfaces, hairline stone rules,
   slate for sky, clay for the one thing that matters.
   ================================================================ */
.wx{background:var(--surface);border:1px solid var(--stone);border-radius:var(--r-lg);
    box-shadow:var(--shadow-1);overflow:hidden;margin:16px 16px 0;text-align:left;width:calc(100% - 32px);
    display:block;padding:0;color:inherit;cursor:pointer;transition:box-shadow var(--t) var(--ease),transform var(--t) var(--ease)}
.wx:active{transform:scale(.992);box-shadow:var(--shadow-2)}
.wx-sky{position:relative;padding:15px 16px 13px;background:
  linear-gradient(160deg,#2E4A5B 0%,#27404E 52%,#1B2E39 100%);color:#F0EDE6;overflow:hidden}
.wx-sky.night{background:linear-gradient(160deg,#1F2E3A 0%,#16232D 55%,#101A21 100%)}
.wx-sky.rain{background:linear-gradient(160deg,#3A4C56 0%,#2C3C46 55%,#1E2A31 100%)}
.wx-sky.hot{background:linear-gradient(160deg,#8A5233 0%,#7A3F28 55%,#5E2E1D 100%)}
.wx-sky:before{content:"";position:absolute;inset:0;
  background:radial-gradient(120% 80% at 84% 8%,rgba(255,255,255,.14),transparent 62%);pointer-events:none}
.wx-row{display:flex;align-items:flex-start;gap:13px;position:relative}
.wx-ic{width:46px;height:46px;flex:0 0 auto;color:#F3EFE6;opacity:.96}
.wx-ic svg{width:46px;height:46px;stroke-width:1.35}
.wx-t{flex:1;min-width:0}
.wx-temp{font-family:var(--serif);font-size:calc(34px*var(--ts));line-height:1;font-weight:600;letter-spacing:-.02em;
  display:flex;align-items:baseline;gap:8px}
.wx-temp small{font-size:calc(12.5px*var(--ts));font-family:var(--sans);font-weight:500;opacity:.72;letter-spacing:.01em}
.wx-desc{font-size:calc(13px*var(--ts));margin-top:5px;opacity:.9;line-height:1.4}
.wx-loc{font-size:calc(10.5px*var(--ts));letter-spacing:.13em;text-transform:uppercase;opacity:.6;margin-top:7px;
  display:flex;align-items:center;gap:6px}
.wx-loc .live{width:5px;height:5px;border-radius:50%;background:#8FC79B;box-shadow:0 0 0 3px rgba(143,199,155,.2)}
.wx-stats{display:flex;gap:14px;margin-top:12px;flex-wrap:wrap;position:relative}
.wx-stats span{display:flex;align-items:center;gap:5px;font-size:calc(11.5px*var(--ts));opacity:.82}
.wx-stats svg{width:14px;height:14px;stroke-width:1.6}
.wx-adv{padding:12px 16px;display:flex;flex-direction:column;gap:9px;background:var(--surface)}
.wx-adv .a{display:flex;gap:10px;align-items:flex-start}
.wx-adv .a .ai{width:26px;height:26px;flex:0 0 auto;border-radius:8px;display:grid;place-items:center;
  background:var(--clay-wash);color:var(--clay)}
.wx-adv .a .ai svg{width:15px;height:15px}
.wx-adv .a p{font-size:calc(12.8px*var(--ts));line-height:1.5;color:var(--ink-2)}
.wx-adv .a b{color:var(--ink);font-weight:600}
.wx-foot{border-top:1px solid var(--stone);padding:9px 16px;display:flex;align-items:center;
  justify-content:space-between;font-size:calc(11.5px*var(--ts));color:var(--muted);background:var(--surface-2)}
.wx-foot svg{width:15px;height:15px}
.wx-skel{height:14px;border-radius:7px;background:linear-gradient(90deg,rgba(255,255,255,.12),rgba(255,255,255,.24),rgba(255,255,255,.12));
  background-size:200% 100%;animation:shim 1.3s linear infinite}
@keyframes shim{0%{background-position:200% 0}100%{background-position:-200% 0}}
/* gentle life in the icon */
.wx-ic .spin{transform-origin:12px 12px;animation:slowspin 26s linear infinite}
.wx-ic .drift{animation:drift 5.5s ease-in-out infinite}
.wx-ic .fall{animation:fall 1.5s linear infinite}
@keyframes slowspin{to{transform:rotate(360deg)}}
@keyframes drift{0%,100%{transform:translateX(0)}50%{transform:translateX(1.4px)}}
@keyframes fall{0%{opacity:0;transform:translateY(-2px)}40%{opacity:1}100%{opacity:0;transform:translateY(3.5px)}}
@media (prefers-reduced-motion:reduce){.wx-ic .spin,.wx-ic .drift,.wx-ic .fall,.wx-skel{animation:none}}

/* hourly strip inside the sheet */
.hrs{display:flex;gap:8px;overflow-x:auto;padding:4px 0 8px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.hrs::-webkit-scrollbar{display:none}
.hrs .h{flex:0 0 auto;width:62px;border:1px solid var(--stone);border-radius:var(--r-sm);
  padding:10px 6px;text-align:center;background:var(--surface-2)}
.hrs .h .hh{font-size:calc(10.5px*var(--ts));color:var(--muted);letter-spacing:.06em}
.hrs .h svg{width:22px;height:22px;margin:6px auto;color:var(--slate);display:block}
.hrs .h .ht{font-size:calc(14px*var(--ts));font-weight:600;font-family:var(--serif)}
.hrs .h .hp{font-size:calc(10px*var(--ts));color:var(--slate);margin-top:3px;opacity:.85}
.wxgrid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:12px}
.wxgrid .c{border:1px solid var(--stone);border-radius:var(--r-sm);padding:11px 12px;background:var(--surface-2)}
.wxgrid .c .k{font-size:calc(10px*var(--ts));letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
.wxgrid .c .v{font-family:var(--serif);font-size:calc(17px*var(--ts));font-weight:600;margin-top:4px}

/* ---------- date picker ---------- */
.cal{border:1px solid var(--stone);border-radius:var(--r);background:var(--surface);
     padding:12px 12px 14px;box-shadow:var(--shadow-1)}
.cal-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px}
.cal-h b{font-family:var(--serif);font-size:calc(15.5px*var(--ts));font-weight:600}
.cal-h button{width:34px;height:34px;border-radius:10px;border:1px solid var(--stone);
  background:var(--surface-2);display:grid;place-items:center;cursor:pointer}
.cal-h button:disabled{opacity:.35;cursor:default}
.cal-h button svg{width:17px;height:17px}
.cal-w{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;margin-bottom:5px}
.cal-w i{font-style:normal;text-align:center;font-size:calc(10px*var(--ts));letter-spacing:.09em;
  text-transform:uppercase;color:var(--muted);padding:3px 0}
.cal-g{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.cal-g button{aspect-ratio:1;border:0;background:transparent;border-radius:10px;font-size:calc(14px*var(--ts));
  color:var(--ink);cursor:pointer;display:grid;place-items:center;position:relative;font-family:inherit}
.cal-g button.mut{color:var(--stone-2);cursor:default}
.cal-g button.today:after{content:"";position:absolute;bottom:6px;width:4px;height:4px;border-radius:50%;background:var(--clay)}
.cal-g button.on{background:var(--clay);color:#fff;font-weight:600;box-shadow:var(--shadow-1)}
.cal-g button.on:after{background:#fff}
.cal-g button:disabled{color:var(--stone-2);cursor:default}
.when{display:flex;align-items:center;gap:10px;border:1px solid var(--stone);border-radius:var(--r);
  padding:12px 14px;background:var(--brass-wash);margin-bottom:12px}
.when .ic{width:34px;height:34px;border-radius:10px;background:var(--surface);border:1px solid var(--stone);
  display:grid;place-items:center;color:var(--brass);flex:0 0 auto}
.when .ic svg{width:18px;height:18px}
.when b{display:block;font-size:calc(14px*var(--ts));font-weight:600}
.when p{font-size:calc(11.5px*var(--ts));color:var(--muted);margin-top:2px}

/* ---------- walkthrough ---------- */
.demo{display:flex;flex-direction:column;gap:2px}
.demostep{display:flex;gap:12px;align-items:flex-start;padding:13px 2px;border-bottom:1px solid var(--stone)}
.demostep:last-child{border-bottom:0}
.demostep .n{width:27px;height:27px;flex:0 0 auto;border-radius:50%;background:var(--slate);color:#fff;
  display:grid;place-items:center;font-size:calc(12.5px*var(--ts));font-weight:600;font-family:var(--serif)}
.demostep b{font-size:calc(14.5px*var(--ts));font-weight:600;display:block}
.demostep p{font-size:calc(12.8px*var(--ts));color:var(--ink-2);line-height:1.55;margin-top:3px}
.demostep .ic{width:30px;height:30px;flex:0 0 auto;border-radius:9px;background:var(--clay-wash);
  color:var(--clay);display:grid;place-items:center}
.demostep .ic svg{width:16px;height:16px}



/* ================================================================
   SAARTHI — header chip, time block, floating glass tab bar
   ================================================================ */
.hbar{gap:7px;padding:8px 12px;min-height:56px}
.wordmark b{font-size:calc(15.5px*var(--ts));max-width:38vw}
:lang(hi) .wordmark b{font-size:calc(15px*var(--ts))}

/* ---- the small weather + clock in the header ---- */
.wxchip{display:flex;align-items:center;gap:6px;border:1px solid var(--stone);
  background:var(--surface);border-radius:999px;padding:4px 10px 4px 7px;cursor:pointer;
  min-height:36px;color:var(--ink);flex:0 0 auto;box-shadow:var(--shadow-1);
  transition:transform var(--t-fast) var(--ease)}
.wxchip:active{transform:scale(.95)}
.wxchip .wxg{width:19px;height:19px;color:var(--slate);display:grid;place-items:center}
.wxchip .wxg svg{width:19px;height:19px;stroke-width:1.6}
.wxchip .wxn{display:flex;flex-direction:column;line-height:1.06;align-items:flex-start}
.wxchip .wxn b{font-size:calc(12.5px*var(--ts));font-weight:700;font-family:var(--serif)}
.wxchip .wxn i{font-style:normal;font-size:calc(9.5px*var(--ts));letter-spacing:.04em;color:var(--muted);
  font-weight:600;font-variant-numeric:tabular-nums}
.wxchip .wxn i.tick{animation:tickIn .45s var(--ease)}
@keyframes tickIn{from{opacity:.25;transform:translateY(-1.5px)}to{opacity:1;transform:none}}
/* the glyph keeps a slow pulse so the chip reads as live, not painted on */
.wxchip .wxg svg{animation:breathe 4.4s ease-in-out infinite}
@keyframes breathe{0%,100%{transform:scale(1);opacity:.92}50%{transform:scale(1.09);opacity:1}}

.wxsheet{display:flex;gap:14px;align-items:center}
.wxbig{width:62px;height:62px;flex:0 0 auto;color:var(--slate)}
.wxbig svg{width:62px;height:62px;stroke-width:1.25}
.wxsheet b.display{font-size:calc(30px*var(--ts));line-height:1}
.wxsheet p{font-size:calc(13px*var(--ts));color:var(--ink-2);margin-top:5px}
.wxrow{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
.wxrow span{display:flex;align-items:center;gap:5px;font-size:calc(12px*var(--ts));color:var(--ink-2);
  border:1px solid var(--stone);border-radius:999px;padding:6px 11px;background:var(--surface-2)}
.wxrow svg{width:14px;height:14px;color:var(--slate)}

/* ---- "How long do you have" ---- */
.tblock{margin:26px 0 4px;padding:20px 0 4px;border-top:1px solid var(--stone)}
.tb-head{display:flex;align-items:flex-start;gap:10px;margin-bottom:13px}
.tb-head h1{font-size:calc(21px*var(--ts));line-height:1.26;flex:1;letter-spacing:-.012em}
.daypick{position:relative;display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;
  border:1px solid var(--stone-2);background:var(--surface);border-radius:999px;
  padding:0 12px;min-height:38px;font-size:calc(12.5px*var(--ts));font-weight:650;color:var(--ink-2);
  cursor:pointer;box-shadow:var(--shadow-1);white-space:nowrap}
.daypick svg{width:15px;height:15px;color:var(--brass)}
.daypick input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer;
  border:0;padding:0;-webkit-appearance:none}
.tp-row{display:grid;gap:7px;margin-bottom:7px}
.tp-row.a{grid-template-columns:repeat(5,1fr)}
.tp-row.b{grid-template-columns:repeat(4,1fr)}
/* the pills are the one thing on this screen you are meant to press,
   so they carry the weight rather than sitting flush with the page */
.tpill{border:1px solid var(--slate);background:var(--slate);border-radius:14px;
  min-height:46px;font-size:calc(13.5px*var(--ts));font-weight:650;color:#F3EFE7;cursor:pointer;
  font-family:inherit;padding:0 4px;display:grid;place-items:center;box-shadow:var(--shadow-1);
  transition:transform var(--t-fast) var(--ease),background var(--t-fast) var(--ease),
             border-color var(--t-fast) var(--ease)}
.tp-row.b .tpill{font-size:calc(12.5px*var(--ts))}
:lang(hi) .tp-row.b .tpill{font-size:calc(11.5px*var(--ts))}
.tpill:active{transform:scale(.955);background:var(--clay);border-color:var(--clay);color:#fff}
.tb-note{font-size:calc(11.8px*var(--ts));color:var(--muted);line-height:1.5;margin:8px 2px 0}

/* ---- day row inside the planner ---- */
.when{position:relative;cursor:pointer}
.when .chev{color:var(--stone-2);display:grid;place-items:center;flex:0 0 auto}
.when .chev svg{width:17px;height:17px;transform:rotate(90deg)}
.when input[type=date]{position:absolute;inset:0;opacity:0;width:100%;height:100%;
  cursor:pointer;border:0;padding:0;-webkit-appearance:none}

/* ================================================================
   FLOATING GLASS TAB BAR
   Lifted off the bottom edge, translucent, with a pill that slides
   under whichever tab is live.
   ================================================================ */
nav.tab{
  position:fixed; left:0; right:0; z-index:50;
  bottom:calc(11px + env(safe-area-inset-bottom));
  max-width:calc(var(--maxw) - 24px); margin:0 auto; width:calc(100% - 24px);
  display:flex; padding:6px; border-radius:26px; border-top:0;
  background:rgba(252,250,246,.66);
  -webkit-backdrop-filter:blur(26px) saturate(190%);
  backdrop-filter:blur(26px) saturate(190%);
  border:1px solid rgba(255,255,255,.85);
  box-shadow:0 1px 0 rgba(255,255,255,.7) inset,
             0 10px 34px rgba(26,24,20,.17),
             0 2px 8px rgba(26,24,20,.09);
  overflow:hidden; isolation:isolate;
}
/* a hairline of light along the top edge — the thing that sells the glass */
nav.tab:after{content:"";position:absolute;left:14%;right:14%;top:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.95),transparent);pointer-events:none}
/* the sliding pill */
nav.tab:before{
  content:""; position:absolute; z-index:-1; top:6px; bottom:6px; left:6px;
  width:calc((100% - 12px)/5);
  transform:translateX(calc(var(--i,0) * 100%));
  border-radius:20px; background:var(--surface);
  box-shadow:0 2px 8px rgba(26,24,20,.14), 0 0 0 1px rgba(26,24,20,.05);
  transition:transform 420ms cubic-bezier(.34,1.32,.48,1);
}
nav.tab button{flex:1;border:0;background:none;padding:8px 2px 6px;display:flex;
  flex-direction:column;align-items:center;gap:3px;color:var(--muted);font-size:calc(9.5px*var(--ts));
  font-weight:700;cursor:pointer;min-height:50px;letter-spacing:.01em;position:relative;
  transition:color 240ms var(--ease)}
nav.tab button svg{width:21px;height:21px;transition:transform 420ms cubic-bezier(.34,1.32,.48,1)}
nav.tab button.on{color:var(--clay)}
nav.tab button.on svg{transform:translateY(-1px) scale(1.09)}
nav.tab button:active svg{transform:scale(.9)}
@media (prefers-reduced-motion:reduce){
  nav.tab:before,nav.tab button svg{transition:none}
  .wxchip .wxg svg{animation:none}
}
/* room for the bar to float over */
main.screen{padding-bottom:96px}

/* ================================================================
   TEXT SIZE — three steps, and they actually move
   Every font-size in this stylesheet is multiplied by --ts.
   ================================================================ */
:root{--ts:1}
body.big{--ts:1.16}
body.bigger{--ts:1.34}

.tsize{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.tsize button{border:1px solid var(--stone-2);background:var(--surface-2);border-radius:13px;
  padding:11px 4px 9px;cursor:pointer;font-family:inherit;color:var(--ink-2);
  display:flex;flex-direction:column;align-items:center;gap:3px;min-height:62px;justify-content:center;
  transition:background var(--t-fast) var(--ease),border-color var(--t-fast) var(--ease)}
.tsize button i{font-style:normal;font-family:var(--serif);font-weight:700;line-height:1}
.tsize button span{font-size:10.5px;font-weight:650;letter-spacing:.02em}
.tsize button.on{background:var(--clay-wash);border-color:var(--clay);color:var(--clay-deep)}

/* ---------- map ---------- */
.mfilter{display:flex;gap:7px;overflow-x:auto;padding:2px 16px 12px;-webkit-overflow-scrolling:touch;
  scrollbar-width:none}
.mfilter::-webkit-scrollbar{display:none}
.mapwrap{margin:0 16px;border:1px solid var(--stone);border-radius:var(--r-lg);overflow:hidden;
  box-shadow:var(--shadow-1);background:var(--surface-2)}
#leaf{height:min(62vh,470px);width:100%;background:#E8E4DA}
.mapfall svg{width:100%;height:auto;display:block}
.leaflet-container{font-family:var(--sans)}
.leaflet-control-attribution{font-size:9px!important;background:rgba(255,255,255,.8)!important}
.lmk-wrap{background:none;border:0}
.lmk{width:30px;height:30px;border-radius:50%;background:#fff;border:1.5px solid var(--stone-2);
  display:grid;place-items:center;color:var(--slate);box-shadow:0 2px 7px rgba(26,24,20,.24);
  transition:transform var(--t-fast) var(--ease)}
.lmk svg{width:16px;height:16px}
.lmk.on{border-color:var(--clay);color:var(--clay);border-width:2px}
.lmk-wrap:active .lmk{transform:scale(.9)}
.lnum{width:22px;height:22px;border-radius:50%;background:var(--clay);color:#fff;display:grid;
  place-items:center;font-size:11px;font-weight:700;box-shadow:0 2px 6px rgba(26,24,20,.3)}
.lme{display:block;width:18px;height:18px;border-radius:50%;background:var(--slate);
  border:2.5px solid #fff;box-shadow:0 0 0 6px rgba(39,64,78,.18)}

/* ---------------- reels ---------------- */
.reels{padding-top:4px}
.reels .sec-head h2{display:flex;align-items:center;gap:8px}
.reels .sec-head h2 svg{width:18px;height:18px;color:var(--clay)}
.reels .ig{font-size:calc(10.5px*var(--ts));letter-spacing:.13em;text-transform:uppercase;
  color:var(--muted);font-weight:700}
.reel-track{display:flex;gap:11px;overflow-x:auto;padding:2px 16px 4px;scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;scrollbar-width:none}
.reel-track::-webkit-scrollbar{display:none}
.reel{flex:0 0 auto;width:146px;scroll-snap-align:start;border:0;background:none;padding:0;
  cursor:pointer;text-align:left;color:inherit;transition:transform var(--t-fast) var(--ease)}
.reel:active{transform:scale(.96)}
.rfilm{display:block;position:relative;width:146px;height:auto;aspect-ratio:9/16;border-radius:var(--r);
  overflow:hidden;background:#1A1814;box-shadow:var(--shadow-2)}
/* the frames cross-fade, which is what makes a still read as a clip */
.rfilm img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;
  animation:reelFade 7.8s linear infinite}
.rfilm img:only-child{opacity:1;animation:reelPan 9s ease-in-out infinite alternate}
@keyframes reelFade{0%{opacity:0;transform:scale(1.06)}
  6%{opacity:1}30%{opacity:1;transform:scale(1)}38%{opacity:0}100%{opacity:0}}
@keyframes reelPan{from{transform:scale(1.04) translateY(1%)}to{transform:scale(1.1) translateY(-1.5%)}}
.rveil{position:absolute;inset:0;background:linear-gradient(to top,rgba(12,10,8,.62) 0%,
  rgba(12,10,8,.14) 42%,rgba(12,10,8,.22) 100%)}
.rplay{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:40px;height:40px;
  border-radius:50%;display:grid;place-items:center;color:#fff;
  background:rgba(20,17,14,.42);border:1.5px solid rgba(255,255,255,.85);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  animation:reelPulse 2.6s ease-in-out infinite}
.rplay svg{width:17px;height:17px;margin-left:2px}
@keyframes reelPulse{0%,100%{box-shadow:0 0 0 0 rgba(255,255,255,.34)}
  70%{box-shadow:0 0 0 11px rgba(255,255,255,0)}}
.rlive{position:absolute;top:8px;left:8px;font-size:8.5px;letter-spacing:.14em;font-weight:800;
  color:#fff;background:var(--clay);border-radius:5px;padding:3px 6px;line-height:1}
.rmeta{display:block;padding:8px 2px 0}
.rmeta b{display:block;font-size:calc(12.5px*var(--ts));font-weight:650;line-height:1.28;
  overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.rmeta i{display:block;font-style:normal;font-size:calc(11px*var(--ts));color:var(--muted);
  margin-top:2px;line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rmeta u{display:block;text-decoration:none;font-size:calc(10px*var(--ts));color:var(--clay);
  font-weight:700;margin-top:3px}
@media (prefers-reduced-motion:reduce){
  .rfilm img{animation:none}.rfilm img.on{opacity:1}.rplay{animation:none}
}

/* ================================================================
   MASTHEAD — home screen only. Seal and name centred on one line,
   the quick controls centred beneath.
   ================================================================ */
main.screen.home{padding-top:0}
.mast{margin:0 -16px;padding:calc(15px + env(safe-area-inset-top)) 16px 15px;text-align:center;background:var(--surface);
  border-bottom:1px solid var(--stone);box-shadow:0 1px 0 rgba(26,24,20,.03),0 6px 18px rgba(26,24,20,.045)}
.mast-quick .wxchip{background:var(--surface-2)}
.mast-line{display:flex;align-items:center;justify-content:center;gap:12px}
.mast-seal{width:56px;height:56px;flex:0 0 auto;border-radius:14px;background:#fff;
  border:1px solid var(--stone);overflow:hidden;padding:2px;box-shadow:var(--shadow-1);
  display:grid;place-items:center}
.mast-seal img{width:100%;height:100%;object-fit:contain}
.mast-name{display:block;text-align:left;line-height:1.1}
.mast-name b{font-family:var(--serif);font-size:calc(22px*var(--ts));font-weight:600;display:block;
  letter-spacing:-.01em;color:var(--ink)}
:lang(hi) .mast-name b{font-family:var(--deva);font-size:calc(21px*var(--ts))}
.mast-name i{display:block;font-style:normal;font-size:calc(9px*var(--ts));letter-spacing:.2em;
  text-transform:uppercase;color:var(--brass);font-weight:700;margin-top:3px}
.mast-quick{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:7px;margin-top:14px}
.mq{display:inline-flex;align-items:center;gap:6px;min-height:38px;padding:0 12px;
  border:1px solid var(--stone-2);background:var(--surface);border-radius:999px;cursor:pointer;
  font-family:inherit;font-size:calc(12.5px*var(--ts));font-weight:650;color:var(--ink-2);
  box-shadow:var(--shadow-1);white-space:nowrap;transition:transform var(--t-fast) var(--ease)}
.mq:active{transform:scale(.96)}
.mq svg{width:15px;height:15px;color:var(--brass)}
.mq.city{max-width:46%;overflow:hidden}
.mq.city span{overflow:hidden;text-overflow:ellipsis}
.mq.city svg.chev{width:13px;height:13px;color:var(--stone-2);transform:rotate(90deg);flex:0 0 auto}
.mq.ic{padding:0;width:38px;justify-content:center}
.mq.ic svg{width:17px;height:17px;color:var(--ink-2)}
.mast-quick .wxchip{min-height:38px}

/* ---------- town / language sheet ---------- */
.citylist{display:grid;gap:9px}
.cityrow{display:flex;align-items:center;gap:12px;width:100%;text-align:left;cursor:pointer;
  border:1px solid var(--stone);background:var(--surface);border-radius:var(--r);padding:12px;
  font-family:inherit;transition:border-color var(--t-fast) var(--ease)}
.cityrow.on{border-color:var(--clay);background:var(--clay-wash)}
.cityrow .cic{width:38px;height:38px;flex:0 0 auto;border-radius:11px;display:grid;place-items:center;
  background:var(--brass-wash);color:var(--brass)}
.cityrow.on .cic{background:var(--clay);color:#fff}
.cityrow .cic svg{width:19px;height:19px}
.cityrow .cmeta b{display:block;font-family:var(--serif);font-size:calc(15.5px*var(--ts));font-weight:600}
:lang(hi) .cityrow .cmeta b{font-family:var(--deva)}
.cityrow .cmeta i{display:block;font-style:normal;font-size:calc(12px*var(--ts));color:var(--muted);margin-top:2px}

/* ---------- quick add to an itinerary ---------- */
.pcard{position:relative}
.qadd{position:absolute;right:9px;bottom:9px;z-index:2;width:34px;height:34px;border-radius:11px;
  border:1px solid var(--stone-2);background:var(--surface);color:var(--ink-2);cursor:pointer;
  display:grid;place-items:center;box-shadow:var(--shadow-1);
  transition:transform var(--t-fast) var(--ease),background var(--t-fast) var(--ease)}
.qadd svg{width:17px;height:17px}
.qadd:active{transform:scale(.9)}
.qadd.on{background:var(--clay);border-color:var(--clay);color:#fff}
.qadd i{position:absolute;top:-5px;right:-5px;min-width:16px;height:16px;border-radius:9px;
  background:var(--brass);color:#fff;font-size:10px;font-style:normal;font-weight:800;
  display:grid;place-items:center;padding:0 3px}
.pcard .meta{padding-right:40px}

/* ---------- explore category chips ---------- */
.hscroll.cats{padding-bottom:6px}
.cats .chip{gap:6px}
.cats .chip i.cn{font-style:normal;font-size:calc(11px*var(--ts));font-weight:800;opacity:.55}
.exnote{margin:6px 0 14px;align-items:center}

/* ---------- itinerary cards ---------- */
.itcard{padding:13px;cursor:pointer}
.it-top{display:flex;align-items:center;gap:12px}
.it-thumbs{display:flex;flex:0 0 auto}
.it-thumbs .ph.t{width:38px;height:44px;border-radius:9px;margin-left:-13px;
  border:2px solid var(--surface);box-shadow:var(--shadow-1);overflow:hidden}
.it-thumbs .ph.t:first-child{margin-left:0}
.it-thumbs .ph.t img{width:100%;height:100%;object-fit:cover}
.it-meta{flex:1;min-width:0}
.it-meta b{display:block;font-size:calc(15.5px*var(--ts));font-weight:600;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.it-meta i{display:block;font-style:normal;font-size:calc(12px*var(--ts));color:var(--muted);margin-top:2px}
.it-meta i.town{color:var(--brass);font-weight:700;font-size:calc(10.5px*var(--ts));
  letter-spacing:.08em;text-transform:uppercase;margin-top:3px}
.it-go{color:var(--stone-2);display:grid;place-items:center;flex:0 0 auto}
.it-go svg{width:18px;height:18px}
.planbig{padding:16px 14px}
.planbig .ic{background:var(--clay-wash);color:var(--clay)}
.chevr{color:var(--stone-2);display:grid;place-items:center}
.chevr svg{width:18px;height:18px}

/* ---------- the add-to-itinerary sheet ---------- */
.bnew{display:flex;gap:8px;align-items:center}
.bnew input{flex:1;min-width:0;height:46px;border:1px solid var(--stone-2);background:var(--surface-2);
  border-radius:var(--r-sm);padding:0 13px;font-family:inherit;font-size:calc(14px*var(--ts));color:var(--ink)}
.bnew input:focus{outline:0;border-color:var(--clay);background:var(--surface)}
.bnew .btn.sm{flex:0 0 auto;width:auto;padding:0 14px;min-height:46px}
.blist{display:grid;gap:8px;margin-top:14px;max-height:44vh;overflow-y:auto}
.brow{display:flex;align-items:center;gap:11px;width:100%;text-align:left;cursor:pointer;
  border:1px solid var(--stone);background:var(--surface);border-radius:var(--r-sm);padding:10px 11px;
  font-family:inherit}
.brow.has{border-color:var(--clay);background:var(--clay-wash)}
.brow .bic{width:32px;height:32px;flex:0 0 auto;border-radius:9px;display:grid;place-items:center;
  background:var(--brass-wash);color:var(--brass)}
.brow.has .bic{background:var(--clay);color:#fff}
.brow .bic svg{width:16px;height:16px}
.brow .bmeta{flex:1;min-width:0}
.brow .bmeta b{display:block;font-size:calc(14px*var(--ts));font-weight:650;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.brow .bmeta i{display:block;font-style:normal;font-size:calc(11.5px*var(--ts));color:var(--muted)}
.brow .badd{flex:0 0 auto;font-size:calc(11.5px*var(--ts));font-weight:750;color:var(--clay)}

/* ---------- listen, on the place page ---------- */
.hero .acts{position:absolute;top:12px;right:12px;z-index:3;display:flex;align-items:center;gap:8px}
.hero .acts .fbtn{position:static}
.listenbtn{display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 14px;border:0;
  border-radius:999px;background:rgba(255,255,255,.94);color:var(--ink);cursor:pointer;
  font-family:inherit;font-size:calc(12.5px*var(--ts));font-weight:700;box-shadow:var(--shadow-1);
  transition:transform var(--t-fast) var(--ease),background var(--t-fast) var(--ease)}
.listenbtn svg{width:17px;height:17px;color:var(--clay)}
.listenbtn:active{transform:scale(.95)}
.listenbtn.on{background:var(--clay);color:#fff}
.listenbtn.on svg{color:#fff}
.dockit{flex:0 0 52px;padding:0}
.anchorc{padding:13px;display:flex;gap:12px;align-items:center;margin-top:10px}
.anchorc .ic{width:36px;height:36px;flex:0 0 auto;border-radius:10px;display:grid;place-items:center;
  background:var(--brass-wash);color:var(--brass)}
.anchorc .ic svg{width:19px;height:19px}
.anchorc b{display:block;font-size:calc(13px*var(--ts))}
.anchorc .muted{font-size:calc(12.5px*var(--ts))}

/* ---------- carousels keep an even gutter at both ends ---------- */
.rail{padding:2px 16px 12px;scroll-padding-inline:16px}
.rail:after,.reel-track:after,.hero-track:after{content:"";flex:0 0 4px;align-self:stretch}
.reel-track{scroll-padding-inline:16px}

/* the planner's button bar clears the floating tab bar */
.planbar{bottom:calc(74px + env(safe-area-inset-bottom))}
.dockbar{bottom:calc(92px + env(safe-area-inset-bottom))}

/* ================================================================
   OPENING PLATE
   The seal and the name rise, hold, then travel to the spot they
   occupy on the home screen. One move, not a cut.
   ================================================================ */
#boot{position:fixed;inset:0;z-index:300;display:none;flex-direction:column;
  align-items:center;justify-content:center;gap:18px;
  background:radial-gradient(120% 90% at 50% 34%,#27404E 0%,#1B2E39 46%,#141F27 100%)}
#boot.run{display:flex}
#boot .b-seal{width:min(40vw,150px);aspect-ratio:1;border-radius:22px;background:#fff;
  padding:6px;display:grid;place-items:center;box-shadow:0 18px 48px rgba(0,0,0,.42);
  opacity:0;transform:scale(.86);animation:bootIn .72s var(--ease) .06s forwards;
  transition:transform .68s cubic-bezier(.66,0,.24,1)}
#boot .b-seal img{width:100%;height:100%;object-fit:contain}
#boot .b-name{text-align:center;opacity:0;transform:translateY(12px);
  animation:bootIn .66s var(--ease) .34s forwards;
  transition:transform .68s cubic-bezier(.66,0,.24,1),opacity .5s var(--ease)}
#boot .b-name b{display:block;font-family:var(--serif);font-size:clamp(26px,7.6vw,34px);
  font-weight:600;color:#F2EEE6;letter-spacing:-.01em}
#boot .b-name i{display:block;font-style:normal;margin-top:8px;font-size:11px;letter-spacing:.28em;
  text-transform:uppercase;color:#C8A967}
@keyframes bootIn{to{opacity:1;transform:none}}
#boot.out{background:transparent;transition:background .55s var(--ease)}
#boot.out .b-seal{box-shadow:none;animation:none;opacity:1;transform:none}
#boot.out .b-name{animation:none}
#boot.gone{display:none}
@media (prefers-reduced-motion:reduce){
  #boot .b-seal,#boot .b-name{animation:none;opacity:1;transform:none;transition:none}
}

/* ---------- the order of the day, plotted ---------- */
.rpcard{padding:12px 12px 6px;overflow:hidden}
.rp{display:block;width:100%;height:auto;background:
  radial-gradient(circle at 1px 1px,rgba(26,24,20,.10) 1px,transparent 0) 0 0/17px 17px,
  var(--surface-2);border-radius:var(--r-sm)}
.rp-line{fill:none;stroke:var(--clay);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:5 6;opacity:.85}
.rp-n circle{fill:var(--surface);stroke:var(--clay);stroke-width:2.2}
.rp-n text{fill:var(--clay);font-family:var(--sans);font-size:13px;font-weight:800}
.rp-n.start circle{fill:var(--slate);stroke:var(--slate)}
.rp-n.start text{fill:#fff}
.rp-n.end circle{fill:var(--clay);stroke:var(--clay)}
.rp-n.end text{fill:#fff}
.rp-n{cursor:pointer}
.rp-key{display:grid;gap:1px;margin-top:10px}
.rp-key button{display:flex;align-items:center;gap:9px;width:100%;text-align:left;border:0;
  background:none;padding:7px 2px;cursor:pointer;font-family:inherit;border-top:1px solid var(--stone)}
.rp-key button:first-child{border-top:0}
.rp-key i{flex:0 0 auto;width:21px;height:21px;border-radius:7px;background:var(--clay-wash);
  color:var(--clay);font-style:normal;font-size:11px;font-weight:800;display:grid;place-items:center}
.rp-key span{flex:1;min-width:0;font-size:calc(13px*var(--ts));color:var(--ink);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rp-key em{flex:0 0 auto;font-style:normal;font-size:calc(11.5px*var(--ts));color:var(--muted);font-weight:650}
.itfix{display:flex;flex-wrap:wrap;gap:6px}
.itfix .tag{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.opt small{display:block;font-size:calc(11.5px*var(--ts));color:var(--muted);margin-top:2px;
  font-weight:500;line-height:1.4}

/* the mark stands on its own — no plate, no ring around it */
.mast-seal{width:76px;height:76px;border-radius:0;background:none;border:0;padding:0;
  box-shadow:none;overflow:visible}
.mast-seal img{width:100%;height:100%;object-fit:contain;border-radius:16px}
.mast-line{gap:14px}
.mast-name b{font-size:calc(24px*var(--ts))}
:lang(hi) .mast-name b{font-size:calc(23px*var(--ts))}
.seal{background:none;border:0;padding:0;box-shadow:none;border-radius:0}
.seal img{border-radius:9px}
#boot .b-seal{background:none;padding:0;box-shadow:none;border-radius:0}
#boot .b-seal img{border-radius:24px}
.splash .seal{border-radius:0}

/* room to breathe above the carousel */
.hero-c{margin:22px -16px 0}

/* the planner's buttons stay reachable without scrolling to the end.
   position:fixed is unreliable inside an animated ancestor, so this
   sticks to the scroller instead — the same pattern as the place page. */
.planbar{position:sticky;bottom:calc(74px + env(safe-area-inset-bottom));z-index:30}

/* titles wrap instead of running off the card */
.pcard h3,.fcard .fh{overflow-wrap:anywhere}
.tix{display:inline-grid;place-items:center;width:16px;height:16px;vertical-align:-2px;
  margin-right:5px;color:var(--brass)}
.tix svg{width:16px;height:16px}

/* close-by cards carry the same detail as a list card */
.fcard{display:flex;flex-direction:column;position:relative}
.fcard .in{padding:12px 13px 13px;display:flex;flex-direction:column;gap:0}
.fcard .fh{font-family:var(--serif);font-size:calc(15.5px*var(--ts));font-weight:600;line-height:1.24;
  display:block}
:lang(hi) .fcard .fh{font-family:var(--deva)}
.fcard .fp{margin-top:5px;font-size:calc(12.5px*var(--ts));color:var(--ink-2);line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.fcard .meta{display:flex;gap:6px;margin-top:9px;flex-wrap:wrap;padding-right:38px}
.fcard .qadd{right:10px;bottom:10px}

/* start / finish search */
.psearch{margin-top:12px;border:1px solid var(--stone-2);background:var(--surface);
  border-radius:var(--r);padding:13px}
.psearch label{display:block;font-size:calc(11px*var(--ts));letter-spacing:.09em;
  text-transform:uppercase;font-weight:750;color:var(--muted);margin-bottom:8px}
.psrow{display:flex;gap:8px;align-items:center;position:relative}
.psic{position:absolute;left:11px;top:50%;transform:translateY(-50%);color:var(--stone-2);
  display:grid;place-items:center;pointer-events:none}
.psic svg{width:16px;height:16px}
.psrow input{flex:1;min-width:0;height:46px;border:1px solid var(--stone-2);background:var(--surface-2);
  border-radius:var(--r-sm);padding:0 12px 0 34px;font-family:inherit;
  font-size:calc(14px*var(--ts));color:var(--ink)}
.psrow input:focus{outline:0;border-color:var(--clay);background:var(--surface)}
.psrow .btn.sm{flex:0 0 auto;width:auto;padding:0 14px;min-height:46px}
.psres{display:grid;gap:1px;margin-top:6px}
.psitem{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:0;background:none;
  padding:10px 2px;cursor:pointer;font-family:inherit;border-top:1px solid var(--stone)}
.psitem svg{width:16px;height:16px;color:var(--brass);flex:0 0 auto}
.psitem b{display:block;font-size:calc(13.5px*var(--ts));font-weight:650;color:var(--ink)}
.psitem i{display:block;font-style:normal;font-size:calc(11.5px*var(--ts));color:var(--muted);
  margin-top:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.psmsg{font-size:calc(12.5px*var(--ts));color:var(--muted);padding:10px 2px 2px;line-height:1.5}

.note.warn{border-color:var(--brass);background:var(--brass-wash)}
.note.warn svg{color:var(--brass)}
/* build-your-own, under the time pills */
.orline{display:flex;align-items:center;gap:10px;margin:14px 0 11px}
.orline i{flex:1;height:1px;background:var(--stone)}
.orline span{font-size:calc(11px*var(--ts));letter-spacing:.12em;text-transform:uppercase;
  font-weight:750;color:var(--muted)}
.btn.own{width:100%;min-height:48px;border-style:dashed;border-width:1.5px;
  border-color:var(--stone-2);color:var(--ink-2);font-weight:700}
.btn.own svg{color:var(--clay)}

/* the quick row is one line, always */
.mast-quick{flex-wrap:nowrap;gap:6px;width:100%}
.mq.city{flex:1 1 auto;min-width:0;max-width:none}
.mq{flex:0 0 auto}
.mq.ic{flex:0 0 36px;width:36px}
.mast-quick .wxchip{flex:0 0 auto;min-height:36px;padding:3px 9px 3px 6px}
.mast-quick .wxchip .wxn i{white-space:nowrap}
@media (max-width:430px){
  /* the labels give way before the row ever wraps */
  .mast-quick{gap:5px}
  .mq.lang svg{display:none}
  .mq.lang{padding:0 10px}
  .mast-quick .wxchip .wxn i{display:none}
  .mast-quick .wxchip .wxn b{font-size:calc(13px*var(--ts))}
  .mq.city svg:not(.chev){display:none}
}
@media (max-width:340px){
  .mast-quick .wxchip{display:none}
}


/* Map place preview card (formerly injected by the map popup). */
.sheet .ph{width:86px;height:86px;border-radius:12px;flex:0 0 auto}

/* International Gita Master 2026 — three swipeable 16:9 event banners */
.gm-sec{margin-top:14px;margin-bottom:22px}
.gm-track{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;
  padding:0 16px 5px;margin:0 -16px}
.gm-track::-webkit-scrollbar{display:none}
.gm-banner{position:relative;isolation:isolate;display:flex;flex:0 0 88%;min-width:0;aspect-ratio:16/9;
  flex-direction:column;justify-content:space-between;overflow:hidden;scroll-snap-align:center;
  border:1px solid rgba(255,255,255,.2);border-radius:var(--r);padding:14px 16px;color:#fff;text-align:left;
  cursor:pointer;box-shadow:var(--shadow-2);transition:transform var(--t-fast) var(--ease)}
.gm-banner:active{transform:scale(.99)}
.gm-tone-1{background:radial-gradient(100% 120% at 100% 0%,rgba(201,168,103,.48),transparent 55%),linear-gradient(130deg,#172A36,#274957 58%,#6D5031)}
.gm-tone-2{background:radial-gradient(100% 120% at 90% 15%,rgba(229,197,129,.45),transparent 48%),linear-gradient(130deg,#4B2B25,#7C4631 55%,#1D3441)}
.gm-tone-3{background:radial-gradient(100% 120% at 85% 12%,rgba(232,201,138,.46),transparent 48%),linear-gradient(130deg,#1B2E39,#394B43 58%,#7C6236)}
.gm-banner::before{content:"";position:absolute;z-index:0;width:62%;aspect-ratio:1;right:-12%;top:-42%;border:1px solid rgba(255,255,255,.18);border-radius:50%;
  box-shadow:0 0 0 16px rgba(255,255,255,.035),0 0 0 34px rgba(255,255,255,.03),0 0 0 54px rgba(255,255,255,.02);pointer-events:none}
.gm-banner::after{content:"";position:absolute;z-index:0;width:34%;aspect-ratio:1;right:8%;bottom:-35%;border:1px solid rgba(232,201,138,.35);border-radius:50%;pointer-events:none}
.gm-art{position:absolute;inset:0;z-index:-1;width:100%;height:100%;object-fit:cover;opacity:.42}
.gm-copy{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-width:0}
.gm-copy i{font-style:normal;font-size:9px;font-weight:750;letter-spacing:.14em;color:#E8C98A}
.gm-copy b{font-family:var(--serif);font-size:clamp(19px,5.3vw,27px);line-height:1.06;letter-spacing:-.02em}
.gm-copy small{font-size:calc(11px*var(--ts));color:rgba(255,255,255,.76);margin-top:2px}
.gm-action{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center;gap:10px;
  font-size:calc(11.5px*var(--ts));font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#F5E6C4}
.gm-action b{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;font-size:19px;border:1px solid rgba(245,230,196,.45)}

/* Permanent discovery tiles for the added tirtha index and artists/show page */
.feature-tile{isolation:isolate;border:1px solid rgba(255,255,255,.16)}
.feature-tile::before{content:"";position:absolute;z-index:0;inset:0;opacity:1}
.feature-tile.kos-tile::before{background:radial-gradient(90% 100% at 100% 0%,rgba(213,178,108,.55),transparent 52%),linear-gradient(135deg,#233A46,#1B2E39 65%,#543F2D)}
.feature-tile.artists-tile::before{background:radial-gradient(85% 105% at 100% 0%,rgba(218,165,120,.45),transparent 53%),linear-gradient(135deg,#462E30,#713F39 54%,#273D48)}
.feature-shortcuts{display:grid;gap:8px;margin:0 0 12px}
.feature-shortcut{display:flex;align-items:center;gap:11px;width:100%;min-height:58px;padding:10px 13px;text-align:left;
  color:var(--ink);background:var(--surface);border:1px solid var(--stone);border-radius:var(--r-sm);box-shadow:var(--shadow-1);cursor:pointer}
.feature-shortcut>svg{width:20px;height:20px;flex:0 0 auto;color:var(--clay)}
.feature-shortcut span{min-width:0;flex:1}
.feature-shortcut b,.feature-shortcut small{display:block}
.feature-shortcut b{font-size:calc(13px*var(--ts))}
.feature-shortcut small{font-size:calc(11px*var(--ts));color:var(--muted);margin-top:2px}
.feature-shortcut i{font-style:normal;font-size:24px;color:var(--muted)}

/* 48 Kos index: filter facets map directly to the workbook columns. */
.index-intro{margin:-7px 0 13px;color:var(--muted);font-size:calc(13px*var(--ts));line-height:1.55}
.index-search{height:48px;display:flex;align-items:center;gap:9px;margin:0 0 10px;padding:0 12px;
  color:var(--muted);background:var(--surface);border:1px solid var(--stone-2);border-radius:var(--r-sm)}
.index-search>span{display:grid;place-items:center;flex:0 0 auto}
.index-search svg{width:18px;height:18px}
.index-search input{width:100%;min-width:0;height:100%;border:0;outline:0;background:transparent;color:var(--ink);
  font:inherit;font-size:calc(13px*var(--ts))}
.index-search input::placeholder{color:var(--muted);opacity:.85}
.index-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.index-filter{display:flex;min-width:0;flex-direction:column;gap:4px;color:var(--muted);font-size:calc(10.5px*var(--ts));font-weight:700}
.index-filter select{width:100%;min-width:0;height:43px;padding:0 8px;background:var(--surface);color:var(--ink-2);
  border:1px solid var(--stone-2);border-radius:9px;font:inherit;font-size:calc(11.5px*var(--ts));font-weight:600}
.index-reset{min-height:38px;padding:5px 3px;margin:2px 0 5px}
.index-category-sec{margin-top:12px}
.index-category-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.index-category{min-width:0;min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 12px;text-align:left;cursor:pointer}
.index-category span{min-width:0}
.index-category b,.index-category small{display:block}
.index-category b{font-size:calc(12.5px*var(--ts));line-height:1.2;overflow-wrap:anywhere}
.index-category small{margin-top:4px;color:var(--muted);font-size:calc(10.5px*var(--ts))}
.index-category i{font-style:normal;color:var(--clay);font-size:22px;flex:0 0 auto}
.index-results-sec{margin-top:20px}
.index-list{gap:9px}
.index-place{padding:12px 13px;min-width:0}
.index-place-layout{min-width:0}
.index-place-layout.has-photo{display:grid;grid-template-columns:72px minmax(0,1fr);align-items:start;gap:11px}
.index-place-photo{display:block;width:72px;height:72px;object-fit:cover;border-radius:9px;background:var(--surface-2)}
.index-place-copy{min-width:0}
.index-place-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.index-serial{display:inline-block;margin-bottom:2px;color:var(--brass);font-size:calc(10px*var(--ts));font-weight:750;letter-spacing:.08em}
.index-place h3{font-family:var(--serif);font-size:calc(15.5px*var(--ts));line-height:1.25;overflow-wrap:anywhere}
.index-location{margin-top:4px;color:var(--muted);font-size:calc(12px*var(--ts))}
.index-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.index-benefit{margin-top:8px;color:var(--ink-2);font-size:calc(12px*var(--ts));line-height:1.45}
.index-benefit b{color:var(--muted);font-weight:650}
.index-empty{margin-top:6px}

/* Artists & Shows: show information already in the place records, with a
   permanent place for artist profiles when that data is supplied. */
.artist-list{display:grid;gap:9px}
.artist-note{margin-bottom:8px}
.artist-profile{display:flex;align-items:center;gap:12px;padding:12px}
.artist-profile>img,.artist-placeholder{width:58px;height:58px;flex:0 0 auto;border-radius:12px;object-fit:cover}
.artist-placeholder{display:grid;place-items:center;color:var(--clay);background:var(--clay-wash)}
.artist-placeholder svg{width:22px;height:22px}
.artist-profile h3{font-family:var(--serif);font-size:calc(15px*var(--ts))}
.artist-profile p{margin-top:4px;color:var(--ink-2);font-size:calc(12px*var(--ts));line-height:1.45}
.feature-show{width:100%;display:flex;align-items:center;gap:11px;padding:12px;text-align:left;cursor:pointer}
.show-icon{display:grid;place-items:center;width:40px;height:40px;flex:0 0 auto;border-radius:11px;background:var(--brass-wash);color:var(--brass)}
.show-icon svg{width:19px;height:19px}
.show-copy{min-width:0;flex:1}
.show-copy b,.show-copy small{display:block}
.show-copy b{font-family:var(--serif);font-size:calc(14px*var(--ts));line-height:1.25}
.show-copy small{margin-top:3px;color:var(--muted);font-size:calc(11.5px*var(--ts));line-height:1.4}
.feature-show>i{font-style:normal;color:var(--muted);font-size:23px}

@media (max-width:360px){
  .gm-banner{flex-basis:92%;padding:12px}
  .gm-copy b{font-size:19px}
  .index-filters{gap:6px}
  .index-filter select{font-size:10.5px;padding:0 5px}
  .index-category{padding:10px}
}

/* Compact category chips keep the places visible without stacking filter forms. */
.index-category-bar{margin:10px 0 2px}
.index-category-bar-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:5px}
.index-category-bar-head b{font-size:calc(12.5px*var(--ts));font-weight:700;color:var(--ink-2)}
.index-category-bar-head span{font-size:calc(10px*var(--ts));font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.index-category-chips{gap:7px;padding:2px 16px 8px;margin:0 -16px}
.index-category-chip{flex:0 0 auto;min-height:38px;padding:0 11px;font-size:calc(11.5px*var(--ts));gap:7px}
.index-category-chip i{font-style:normal;font-size:10px;font-variant-numeric:tabular-nums;opacity:.7}
.index-category-chip.on.warm i{opacity:.9}
.index-more-toggle{width:100%;min-height:46px;display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:7px 11px;margin:0 0 3px;text-align:left;background:var(--surface);border:1px solid var(--stone);border-radius:var(--r-sm);cursor:pointer}
.index-more-toggle b,.index-more-toggle small{display:block}
.index-more-toggle b{font-size:calc(12px*var(--ts));font-weight:700;color:var(--ink-2)}
.index-more-toggle small{margin-top:1px;font-size:calc(10px*var(--ts));color:var(--muted)}
.index-more-count{min-width:27px;height:27px;display:grid;place-items:center;padding:0 6px;border-radius:999px;
  color:var(--clay);background:var(--clay-wash);font-size:calc(12px*var(--ts));font-weight:750}
.index-more-panel{padding:10px;background:var(--surface-2);border:1px solid var(--stone);border-radius:var(--r-sm);margin:7px 0 2px}
.index-more-panel .index-filters{grid-template-columns:repeat(2,minmax(0,1fr))}
.index-more-panel .index-reset{margin:5px 0 0}
.index-results-sec{margin-top:14px}
@media(max-width:360px){
  .index-category-chip{padding:0 9px;gap:5px}
  .index-more-panel .index-filters{grid-template-columns:1fr}
  .index-place-layout.has-photo{grid-template-columns:62px minmax(0,1fr);gap:9px}
  .index-place-photo{width:62px;height:62px}
}