/* Page chrome, cards, sections */
  /* ---------- chittara / rangavalli grid, used sparingly ---------- */
  .chittara-bg{
    background-image: radial-gradient(var(--line) 1px, transparent 1.4px);
    background-size: 18px 18px;
  }

  a{color:var(--maroon);}
  a:hover{color:var(--maroon-dark);}

  .skip-link{
    position:absolute; left:12px; top:-48px; z-index:80;
    background:var(--maroon); color:var(--on-accent);
    padding:8px 14px; border-radius:20px; font-weight:600; font-size:14px;
    text-decoration:none;
  }
  .skip-link:focus{top:12px;}
  header{
    position:sticky; top:0; z-index:40;
    background:rgba(247,238,218,0.96);
    backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
    border-bottom:1.5px solid var(--line);
    padding-top:var(--safe-top);
  }
  .saree-border{
    height:8px;
    background-color:var(--kasuti-black);
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpolygon points='0,8 6,0 12,8' fill='%239C2436'/%3E%3Cpolygon points='0,8 6,3 12,8' fill='%23D4A017'/%3E%3C/svg%3E");
    background-repeat:repeat-x;
    background-size:12px 8px;
  }
  .header-inner{
    max-width:1180px; margin:0 auto; padding:10px 24px;
    display:flex; align-items:center; gap:12px;
    flex-wrap:nowrap; position:relative;
  }
  .brand{display:flex; align-items:center; gap:10px; flex:none; min-height:40px; cursor:pointer; text-decoration:none; color:inherit;}
  .brand:hover{color:inherit;}
  /* the toran cord sits 4.5 units into a 20-unit viewBox, so the drawn leaves
     hang below the box centre. Lift it to sit on the Kannada text's optical centre. */
  .brand-mark{width:48px;height:20px;flex:none;transform:translateY(-2px);}
  .brand-mark .cord{stroke:var(--kasuti-black); fill:none; stroke-width:1.4; stroke-linecap:round;}
  .brand-mark .leaf{fill:var(--leaf);}
  .brand-mark .rib{stroke:#143d22; fill:none; stroke-width:0.6;}
  .brand-mark .jasmine{fill:#F6F1E4; stroke:var(--maroon); stroke-width:0.5;}
  .brand-text{display:flex; align-items:center; line-height:1;}
  .brand-text .kn-cycle{
    font-size:17px; color:var(--maroon); font-weight:600;
    min-height:40px; align-items:center;
  }
  nav.main-nav{
    display:flex; align-items:center; justify-content:flex-end;
    gap:2px; flex:1 1 auto; min-width:0; flex-wrap:nowrap;
  }
  nav.main-nav a,
  .nav-sub-btn{
    font-size:13px; padding:8px 10px; border-radius:20px; text-decoration:none;
    color:var(--ink-soft); font-weight:500; white-space:nowrap;
  }
  nav.main-nav a:hover{background:var(--cream-2); color:var(--ink);}
  nav.main-nav a[aria-current="page"]{color:var(--ink); font-weight:600;}
  .nav-sub{position:relative; flex:none;}
  .nav-sub-btn{
    display:inline-flex; align-items:center; gap:6px;
    border:1.5px solid var(--line); background:var(--cream-2);
    font-family:inherit; cursor:pointer;
  }
  .nav-sub-btn::after{
    content:''; width:0; height:0;
    border-left:4px solid transparent; border-right:4px solid transparent;
    border-top:5px solid currentColor; transform:translateY(1px);
  }
  .nav-sub-btn:hover,
  .nav-sub-btn[aria-expanded="true"]{border-color:var(--maroon); color:var(--maroon);}
  .nav-sub-list{
    position:absolute; top:calc(100% + 8px); left:0; z-index:46;
    min-width:220px; display:flex; flex-direction:column; gap:2px;
    background:var(--cream); border:1.5px solid var(--line); border-radius:12px;
    padding:6px; box-shadow:0 10px 28px rgba(34,26,20,0.16);
  }
  .nav-sub-list[hidden]{display:none !important;}
  .nav-sub-list a{border-radius:8px; padding:10px 12px;}
  nav.main-nav a:hover{background:var(--cream-2); color:var(--ink);}
  .header-actions{display:flex; align-items:center; gap:8px; flex:none; margin-left:auto;}
  .nav-toggle{
    display:none;
    border:1px solid var(--line); background:var(--cream-2); color:var(--ink);
    padding:8px 14px; border-radius:20px; font-size:14px; font-weight:600;
    min-height:40px;
  }
  .agenda-pill{
    display:flex; align-items:center; gap:7px;
    background:var(--maroon); color:var(--on-accent); border:1.5px solid var(--maroon);
    padding:6px 14px; border-radius:99px; font-size:12.5px; font-weight:600;
  }
  .agenda-pill:hover{background:var(--maroon-dark); border-color:var(--maroon-dark);}
  .agenda-count{
    background:var(--gold); color:var(--ink); border-radius:99px;
    min-width:19px; height:19px; padding:0 5px; font-size:11px;
    display:inline-flex; align-items:center; justify-content:center;
  }
  .mode-toggle{display:flex; border:1.5px solid var(--line); border-radius:99px; overflow:hidden; flex:none;}
  .mode-toggle button{
    border:none; background:transparent; padding:6px 10px; font-size:12px; font-weight:600;
    color:var(--ink-soft); cursor:pointer; font-family:inherit; white-space:nowrap;
  }
  .mode-toggle button[data-active="true"]{background:var(--maroon); color:var(--on-accent);}
  .mode-cluster{display:flex; align-items:center; gap:6px; flex:none;}
  .mode-tip-btn{
    width:28px; height:28px; border-radius:99px; flex:none;
    border:1.5px solid var(--line); background:var(--cream-2); color:var(--ink-soft);
    font-size:13px; font-weight:700; line-height:1; padding:0;
  }
  .mode-tip-btn[aria-expanded="true"], .mode-tip-btn:hover{border-color:var(--maroon); color:var(--maroon);}
  .mode-tip{
    position:fixed; z-index:50; width:min(320px, calc(100vw - 24px));
    background:var(--cream); border:1.5px solid var(--line); border-radius:10px;
    padding:12px 14px; box-shadow:0 10px 28px rgba(34,26,20,0.16);
  }
  .mode-tip p{margin:0 0 8px; font-size:13px; color:var(--ink-soft); line-height:1.45;}
  .mode-tip p:last-child{margin-bottom:0;}
  .mode-tip strong{color:var(--ink); font-weight:600;}
  .explore-mode{margin-top:18px;}
  .explore-mode .mode-toggle button{padding:8px 14px;}
  body[data-mode="quickstart"] .stay-only{display:none !important;}

  /* ---------- hero ---------- */
  .hero{
    position:relative; overflow:hidden;
    background:transparent; color:var(--ink);
    padding:80px 24px 64px; text-align:center;
  }
  .hero-inner{max-width:1180px; margin:0 auto; position:relative; z-index:1;}
  .hero .eyebrow{
    font-size:13.5px; color:var(--maroon); margin:0 0 14px; font-weight:600; letter-spacing:0.02em;
  }
  .hero h1{font-size:clamp(32px,5vw,52px); line-height:1.08;}
  .hero p.lede{
    margin:20px auto 0; font-size:15.5px; max-width:720px; color:var(--ink-soft);
  }
  .hero-ornament{position:absolute; pointer-events:none; opacity:0.55;}
  .hero-ornament.side-l{top:0; left:8px; width:44px; height:94%;}
  .hero-ornament.side-r{top:0; right:8px; width:44px; height:94%;}
  .hero-ornament.mala-top{top:4px; left:50%; transform:translateX(-50%); width:min(680px,86%); opacity:0.8;}
  .hero-ornament.mala-bot{bottom:2px; left:50%; transform:translateX(-50%); width:min(680px,86%); opacity:0.8;}
  .hero-stats{
    margin-top:30px; display:flex; flex-wrap:wrap; gap:18px; justify-content:center;
  }
  .hero-stat{
    display:flex; align-items:center; gap:16px; text-align:left;
    background:rgba(247,238,218,0.94); border:1px solid var(--line);
    border-top:3px solid var(--maroon); border-radius:var(--radius);
    padding:16px 22px; max-width:330px; width:100%; color:inherit;
    font-family:inherit; cursor:pointer;
  }
  .hero-stat:hover{transform:translateY(-2px); box-shadow:0 8px 22px rgba(34,26,20,0.12);}
  .hero-stat:focus-visible{outline:3px solid var(--gold); outline-offset:3px;}
  .hero-stat:nth-child(2){border-top-color:var(--hampi-stone);}
  .hero-stat svg{flex:none; width:88px; height:58px;}
  .hero-stat-copy{min-width:0; display:flex; flex-direction:column; align-items:flex-start;}
  .hero-stat strong{
    display:block; font-family:'Baloo 2',sans-serif; font-size:30px; font-weight:800; color:var(--maroon);
    line-height:1; white-space:nowrap;
  }
  .hero-stat span{display:block; font-size:13px; color:var(--ink-soft); line-height:1.35; margin-top:4px;}
  .hero-stat small{display:block; margin-top:8px; color:var(--maroon); font-size:11.5px; font-weight:600;}

  .info-dialog{
    width:min(680px, calc(100vw - 28px)); max-height:min(82vh, 760px);
    margin:auto; padding:0; border:1.5px solid var(--line); border-radius:16px;
    background:var(--cream); color:var(--ink); box-shadow:0 24px 70px rgba(34,26,20,0.3);
  }
  .info-dialog::backdrop{background:rgba(32,28,23,0.58); backdrop-filter:blur(3px);}
  .info-dialog-inner{position:relative; padding:28px; overflow:auto; max-height:min(82vh, 760px);}
  .info-dialog-close{
    position:absolute; top:14px; right:14px; width:36px; height:36px;
    border:1.5px solid var(--line); border-radius:99px; background:var(--cream-2);
    color:var(--ink); font-size:24px; line-height:1;
  }
  .info-dialog-kicker{margin:0 44px 4px 0; color:var(--maroon); font-family:'Baloo Tamma 2',sans-serif; font-weight:600;}
  .info-dialog h2{font-size:28px; margin-right:44px;}
  .info-dialog h3{font-size:16px; margin:20px 0 8px;}
  .info-dialog h3 span{font-family:'Baloo Tamma 2',sans-serif; color:var(--maroon); margin-left:6px;}
  .info-dialog p{color:var(--ink-soft); font-size:14px; margin:8px 0 0;}
  .info-dialog-source{padding-top:14px; border-top:1px solid var(--line);}
  .info-dialog-source a{color:var(--maroon);}
  .akshara-grid{display:grid; grid-template-columns:repeat(5,minmax(42px,1fr)); gap:7px;}
  .akshara-grid span{
    display:grid; place-items:center; min-height:48px; border:1px solid var(--line);
    border-radius:8px; background:var(--cream-2); color:var(--maroon);
    font-family:'Baloo Tamma 2',sans-serif; font-size:24px; line-height:1;
  }
  .akshara-vowels{grid-template-columns:repeat(7,minmax(42px,1fr));}
  .akshara-short{grid-template-columns:repeat(2,minmax(42px,72px));}
  .elevation-list{display:grid; gap:10px; margin:22px 0;}
  .elevation-list div{display:grid; grid-template-columns:90px 1fr 56px; align-items:center; gap:10px; font-size:13px;}
  .elevation-list i{height:12px; border-radius:99px; background:var(--cream-2); overflow:hidden;}
  .elevation-list i::before{content:''; display:block; width:var(--elevation); min-width:4px; height:100%; background:var(--leaf);}
  .elevation-list strong{text-align:right; font-family:'IBM Plex Mono',monospace; font-size:12px;}

  /* ---------- controls (sticky only while Explore is on screen) ---------- */
  .controls{
    position:sticky; top:var(--header-h); z-index:30;
    background:color-mix(in srgb, var(--cream) 88%, transparent);
    backdrop-filter:blur(12px) saturate(1.08);
    -webkit-backdrop-filter:blur(12px) saturate(1.08);
    border:none;
    padding:10px 0 16px; margin:0 0 18px;
  }
  .controls-inner{
    max-width:1180px; margin:0 auto;
    display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
  }
  .pill-row{display:flex; gap:8px; flex-wrap:wrap;}
  #categoryPills{
    width:100%; flex-wrap:nowrap; overflow-x:auto; padding-bottom:2px;
    scrollbar-width:thin;
  }
  #categoryPills .pill{flex:none;}
  .subfilter-row{
    width:100%; padding:8px 0 2px 12px; border-left:3px solid var(--jacaranda);
  }
  .subfilter-row[hidden]{display:none !important;}
  .subfilter-row .pill{font-size:12px; padding:6px 12px;}
  .pill{
    border:1px solid var(--line); background:transparent;
    padding:7px 14px; border-radius:20px; font-size:13px; font-weight:500; color:var(--ink-soft);
  }
  .pill[data-active="true"]{
    background:var(--ink); color:var(--cream); border-color:var(--ink);
  }
  .tour-note{
    max-width:1180px; margin:0 auto 24px; padding:16px 18px;
    display:flex; align-items:center; justify-content:space-between; gap:20px;
    border:1px solid var(--line); border-left:4px solid var(--gold);
    border-radius:var(--radius); background:var(--cream-2);
  }
  .tour-note strong{font-family:'Baloo 2',sans-serif; font-size:17px;}
  .tour-note p{margin:3px 0 0; color:var(--ink-soft); font-size:13.5px;}
  .tour-note a{
    flex:none; color:var(--maroon); font-size:13px; font-weight:600;
    text-decoration-thickness:1px; text-underline-offset:3px;
  }
  .view-toggle{
    display:grid; grid-template-columns:1fr 1fr;
    width:min(100%, 260px);
    border:1px solid var(--line); border-radius:20px; overflow:hidden; flex:none;
  }
  .view-toggle button{
    border:none; background:transparent; padding:8px 12px; font-size:13px; font-weight:600; color:var(--ink-soft);
    min-width:0; width:100%;
  }
  .view-toggle button[data-active="true"]{background:var(--maroon); color:var(--on-accent);}

  section{max-width:1180px; margin:0 auto; padding:56px 24px; scroll-margin-top:88px; background:var(--cream);}
  .section-head{max-width:640px; margin-bottom:32px;}
  .why-about-grid{display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:start;}
  .why-about-grid .section-head{max-width:none; margin-bottom:0;}
  .about-side{padding-left:40px; border-left:1px solid var(--line); min-width:0;}
  @media (max-width:800px){
    .why-about-grid{grid-template-columns:1fr; gap:32px;}
    .about-side{padding-left:0; border-left:none; padding-top:28px; border-top:1px solid var(--line);}
  }
  .section-head .motif-icon{color:var(--maroon);}
  .section-head .kn{color:var(--maroon); font-size:14px; font-weight:600; margin-bottom:8px;}
  .section-head .kn-cycle{margin-bottom:8px; white-space:normal;}
  .section-head h1, .section-head h2{font-size:clamp(24px,3vw,34px);}
  .section-head p{color:var(--ink-soft); margin-top:10px; font-size:15.5px;}

  .rail-clip{
    position:relative;
    min-width:0;
  }
  .rail-clip::after{
    content:'';
    position:absolute;
    top:0; right:0; bottom:12px;
    width:28px;
    pointer-events:none;
    z-index:2;
    background:linear-gradient(90deg, transparent 0%, var(--rail-fade, var(--cream)) 100%);
  }
  .grid,
  .festival-grid,
  .dish-grid,
  .quip-grid,
  .region-row,
  .modern-list,
  .phrase-group-grid,
  .people-grid{
    --rail-cols: 3;
    --rail-peek: 22px;
    --rail-card: calc((100% - (var(--rail-cols) - 1) * 16px - var(--rail-peek)) / var(--rail-cols));
    display:flex;
    align-items:stretch;
    gap:16px;
    overflow-x:auto;
    overflow-y:hidden;
    padding:4px 8px 16px 0;
    scroll-padding-inline-end:24px;
    max-width:100%;
    min-width:0;
    scrollbar-width:thin;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
  }
  .grid > *,
  .festival-grid > *,
  .dish-grid > *,
  .quip-grid > *,
  .region-row > *,
  .modern-list > *,
  .phrase-group-grid > *,
  .people-grid > *{
    flex:0 0 var(--rail-card);
    width:var(--rail-card);
    min-width:0;
    max-width:none;
    box-sizing:border-box;
    align-self:stretch;
    display:flex;
    flex-direction:column;
  }
  .grid > p,
  .dish-grid > p{
    flex:1 1 auto;
    width:auto;
    max-width:none;
    min-height:0;
  }
  .people-grid{ --rail-cols: 2; margin-top:12px; }

  .grid .card{
    padding:0 0 14px;
    gap:0;
    overflow:hidden;
    min-height:0;
  }
  .grid .card .camera-roll,
  .grid .card .camera-roll-empty{
    padding:0;
    width:100%;
    max-width:100%;
    margin:0;
    order:-1;
    flex:none;
  }
  .grid .card .camera-roll{
    height:168px;
    overflow-x:auto;
    overflow-y:hidden;
  }
  .grid .card .camera-roll .photo-wait,
  .grid .card .camera-roll img{
    height:168px;
    width:100%;
    max-width:none;
    flex:0 0 100%;
    object-fit:cover;
  }
  .grid .card .camera-roll-empty{
    height:168px;
    min-height:168px;
    padding:16px 14px;
    font-size:11px;
    background:var(--cream-2);
    display:flex;
    align-items:center;
    box-sizing:border-box;
  }
  .grid .card .card-top{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:6px;
    padding:10px 14px 0;
    margin-bottom:0;
    flex:none;
    min-width:0;
  }
  .grid .card .card-top > div{min-width:0; width:100%;}
  .grid .card .card-title-row{min-width:0; width:100%;}
  .grid .card h3{
    font-size:17px; line-height:1.25; overflow-wrap:break-word;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  }
  .grid .card .tag{flex:none;}
  .grid .card .card-pronounce{
    flex-wrap:nowrap; min-width:0; width:100%;
  }
  .grid .card .card-kn{flex:none; white-space:nowrap;}
  .grid .card .card-say{
    min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  }
  .grid .card .card-body{
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
    padding:8px 14px 0;
    display:flex;
    flex-direction:column;
  }
  .grid .card p.blurb{
    flex:none;
    font-size:14px;
    line-height:1.5;
    margin:0;
    display:-webkit-box;
    -webkit-line-clamp:3;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }
  .grid .card .eat-here{margin-top:8px; flex:none;}
  .grid .card .eat-here .dish-try-list button:nth-child(n+4){display:none;}
  .grid .card .try-list li:nth-child(n+3){display:none;}
  .grid .card .skip-details p,
  .grid .card .skip-instead{display:none;}
  .grid .card .card-actions{
    padding:10px 14px 0;
    margin-top:auto;
    flex:none;
  }

  /* ---------- list view ---------- */
  .card{
    background:var(--card-surface);
    border:1px solid var(--line); border-top:3px solid var(--cat-color, var(--maroon));
    border-radius:var(--radius); padding:16px 18px;
    display:flex; flex-direction:column; gap:10px; position:relative; overflow:hidden;
    color:var(--ink);
  }
  .card > *{position:relative;}
  .card-top{display:flex; justify-content:space-between; align-items:flex-start; gap:10px;}
  .card-title-row{display:flex; align-items:center; gap:8px;}
  .card h3{font-size:17px; line-height:1.25;}
  .card .area{font-size:12.5px; color:var(--ink-soft); margin-top:3px;}
  .card-pronounce{display:flex; align-items:baseline; gap:6px; margin-top:4px; flex-wrap:wrap;}
  .card-kn{font-size:13px; color:var(--maroon);}
  .card-say{font-size:11px; color:var(--ink-soft); font-style:italic;}
  .pick-mark{
    width:22px; height:15px; flex:none; color:var(--gold);
    filter:drop-shadow(0 1px 0 rgba(0,0,0,0.12));
  }
  .pick-mark *{fill:currentColor; stroke:none;}
  .try-block{margin-top:8px;}
  .try-label{font-size:11px; font-weight:600; color:var(--maroon);}
  .try-list{margin:6px 0 0; padding:0; list-style:none; display:flex; flex-direction:column; gap:3px;}
  .try-list li{
    font-size:13px; color:var(--ink); line-height:1.4;
    padding-left:14px; position:relative;
  }
  .try-list li::before{
    content:''; position:absolute; left:0; top:0.5em;
    width:6px; height:6px; border-radius:50%; background:var(--gold);
  }
  .tag{
    font-size:11px; font-weight:600; text-transform:none; letter-spacing:0.01em;
    color:var(--cat-color, var(--maroon)); background:color-mix(in srgb, var(--cat-color, var(--maroon)) 16%, var(--cream));
    padding:3px 8px; border-radius:10px; white-space:nowrap;
  }
  .card p.blurb{font-size:14px; color:var(--ink-soft);}
  .personal-note{
    margin:12px 0 0; padding:9px 11px;
    border-left:3px solid var(--gold); background:var(--cream-2);
    font-size:13.5px; line-height:1.45; color:var(--ink);
  }
  .personal-note .try-label{display:block; margin-bottom:2px;}
  /* Only on entries someone else sent in. Aravind's own stay unsigned. */
  .added-by{
    margin:12px 0 0; font-size:11.5px; color:var(--ink-soft);
    letter-spacing:0.02em;
  }
  .added-by a{color:var(--maroon); text-decoration:none; border-bottom:1px solid color-mix(in srgb, var(--maroon) 35%, transparent);}
  .added-by a:hover{border-bottom-color:var(--maroon);}
  .field-anchors{
    display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:6px;
    margin:12px 0 0;
  }
  .field-anchors > div{
    min-width:0; padding:8px 9px; border:1px solid var(--line);
    border-radius:8px; background:var(--cream-2);
  }
  .field-anchors dt{
    margin:0 0 3px; color:var(--maroon); font-size:10px; font-weight:700;
    text-transform:uppercase; letter-spacing:0.04em;
  }
  .field-anchors dd{
    margin:0; color:var(--ink); font-size:11.5px; line-height:1.35;
    display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
  }
  /* full-bleed to the card edges, like .dish-photo. one photo fills the band;
     extra photos become a swipeable strip rather than a row of thumbnails. */
  .camera-roll{
    display:flex; gap:6px; overflow-x:auto; scroll-snap-type:x mandatory;
    width:calc(100% + 36px); margin:0 -18px;
  }
  /* photos are hot-linked to Wikimedia; a failed one removes itself (guide.js)
     and the empty band collapses rather than leaving a 180px gap. */
  .camera-roll:empty{display:none;}
  .camera-roll .photo-wait{
    height:180px; flex:0 0 100%; max-width:none; scroll-snap-align:start;
  }
  .camera-roll img{
    height:180px; object-fit:cover; flex:0 0 100%; max-width:none; scroll-snap-align:start;
    border:none; border-top:1px solid var(--line); border-bottom:1px solid var(--line);
    border-radius:0; background:transparent;
  }
  .photo-wait{
    position:relative; overflow:hidden; background:var(--cream-2);
    display:block;
  }
  .photo-wait-deco{
    position:absolute; inset:-8px; z-index:0; pointer-events:none;
    background-color:var(--kasuti-black);
    background-image:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpolygon points='0,8 6,0 12,8' fill='%239C2436'/%3E%3Cpolygon points='0,8 6,3 12,8' fill='%23D4A017'/%3E%3C/svg%3E"),
      radial-gradient(circle at 30% 40%, #F6F1E4 2.2px, transparent 2.4px),
      radial-gradient(circle at 70% 60%, #D6A419 2px, transparent 2.2px);
    background-size:12px 8px, 28px 28px, 36px 36px;
    animation:photo-wait-drift 1.8s linear infinite;
    opacity:0.9;
  }
  .photo-wait-copy{
    position:absolute; z-index:1; left:50%; top:50%; transform:translate(-50%,-50%);
    color:#F6F1E4; font-size:14px; text-align:center; white-space:nowrap;
    text-shadow:0 1px 0 rgba(0,0,0,0.35);
  }
  .photo-wait img{
    position:relative; z-index:2; width:100%; height:100%; object-fit:cover;
    opacity:0; transform:scale(1.06) translateY(6px);
    transition:opacity .55s ease, transform .55s cubic-bezier(.2,.8,.2,1);
  }
  .photo-wait.is-ready .photo-wait-deco,
  .photo-wait.is-ready .photo-wait-copy{
    opacity:0; transition:opacity .35s ease; pointer-events:none;
  }
  .photo-wait.is-ready img{opacity:1; transform:none;}
  @keyframes photo-wait-drift{
    from{background-position:0 0, 0 0, 8px 4px;}
    to{background-position:12px 0, 10px -8px, -6px 10px;}
  }
  .camera-roll-empty{
    font-size:11px; color:var(--ink-soft); opacity:0.85; font-style:italic; margin-top:-2px;
  }
  .camera-roll-empty a{color:var(--maroon); text-decoration:underline; font-style:normal;}
  .card-actions{display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
  .add-btn, .map-link-btn{
    display:inline-flex; align-items:center; justify-content:center;
    box-sizing:border-box; height:32px; padding:0 13px;
    border-radius:99px; font-size:12px; font-weight:600; line-height:1;
  }
  .add-btn{
    align-self:flex-start; border:1.5px solid var(--maroon); background:none; color:var(--maroon);
  }
  .add-btn:hover{background:var(--maroon); color:var(--on-accent);}
  .add-btn[data-added="true"]{background:var(--leaf); border-color:var(--leaf); color:#fff;}
  .map-link-btn{
    border:1.5px solid var(--line); background:transparent; color:var(--ink-soft);
    text-decoration:none;
  }
  .map-link-btn:hover{border-color:var(--maroon); color:var(--maroon);}
  .skip-details{margin-top:8px; font-size:13px;}
  .skip-details summary{
    cursor:pointer; color:var(--terracotta); font-weight:600; list-style:none;
  }
  .skip-details summary::-webkit-details-marker{display:none;}
  .skip-details summary::before{content:'→ '; }
  .skip-instead{
    margin-top:8px; padding:10px 12px;
    background:var(--cream-2); border-left:3px solid var(--leaf); border-radius:var(--radius);
  }
  .skip-instead .place{font-weight:600; color:var(--leaf);}
  .skip-instead .why{color:var(--ink-soft); margin-top:4px; font-size:12.5px;}
  .skip-instead button{margin-top:8px;}

  /* ---------- map view (Leaflet) ---------- */
  .map-wrap{
    background:var(--cream-2); border:1px solid var(--line); border-radius:var(--radius);
    height:520px; z-index:1;
  }
  .map-note{font-size:12px; color:var(--ink-soft); margin-top:10px;}
  .map-note a{color:var(--maroon); text-decoration:underline;}
  .leaflet-popup-content-wrapper{border-radius:var(--radius); font-family:'IBM Plex Sans',sans-serif; background:var(--card-surface); color:var(--ink);}
  .leaflet-popup-content{margin:12px 14px; font-size:13.5px; line-height:1.4;}
  .leaflet-popup-tip{background:var(--card-surface);}
  .map-popup-title{font-family:'Baloo 2',sans-serif; font-weight:700; font-size:15px; margin-bottom:3px;}
  .map-popup-area{font-size:11.5px; color:var(--ink-soft); margin-bottom:6px;}
  .leaflet-div-icon, .map-pin-wrap{background:transparent !important; border:none !important;}
  .map-pin-icon{
    display:block; width:18px; height:18px; border-radius:50% 50% 50% 0; transform:rotate(-45deg);
    border:2px solid #fff; box-shadow:0 1px 4px rgba(0,0,0,0.4);
  }

  /* ---------- ganda berunda watermark ---------- */
  .berunda-mark{
    position:absolute; right:-30px; bottom:-40px; width:260px; height:auto;
    opacity:0.14; pointer-events:none;
  }
  .berunda-mark path, .berunda-mark circle{stroke:var(--gold-light); fill:none; stroke-width:1.3;}

  /* ---------- karnataka: locations, food, festivals ---------- */
  .karnataka-sub{margin-top:44px;}
  .beyond-tabs{
    max-width:1180px; margin:0 auto 12px; padding:0 24px;
    display:flex; gap:8px; overflow-x:auto; scrollbar-width:thin;
  }
  .beyond-tabs button{
    flex:none; border:1px solid color-mix(in srgb, var(--on-accent) 55%, transparent);
    background:transparent; color:var(--on-accent); border-radius:99px;
    padding:8px 14px; font:600 13px inherit;
  }
  .beyond-tabs button[aria-selected="true"]{
    background:var(--on-accent); color:var(--kannada-bg); border-color:var(--on-accent);
  }
  .beyond-panel[hidden]{display:none;}
  .modern-item{
    background:var(--card-surface);
    border:1px solid var(--line); border-radius:var(--radius);
    padding:14px 16px; border-top:3px solid var(--terracotta);
    overflow:hidden; min-width:0;
  }
  .modern-item h4{font-size:15.5px; margin-bottom:8px; overflow-wrap:break-word;}
  .modern-item p{
    font-size:13.5px; color:var(--ink-soft); line-height:1.55; margin:0; flex:1;
    display:-webkit-box; -webkit-line-clamp:6; -webkit-box-orient:vertical; overflow:hidden;
  }
  .karnataka-sub:first-of-type{margin-top:28px;}
  .sub-head{max-width:640px; margin-bottom:20px;}
  .sub-head h3{font-size:clamp(19px,2.2vw,24px);}
  .sub-head p{color:var(--ink-soft); margin-top:6px; font-size:14.5px;}

  /* ---------- ganda berunda watermark, v2 (for comparison) ---------- */
  .festivals-sub{
    position:relative; overflow:hidden;
    background:var(--imperial-bg); border-radius:var(--radius); color:var(--imperial-text);
    padding:32px 28px;
    --rail-fade:var(--imperial-bg);
    /* Imperial Weave palette applied locally: these overrides only affect
       elements inside this subsection, borrowed by everything that already
       references --ink, --ink-soft, --maroon, --card-surface, --line. */
    --ink:var(--imperial-text);
    --ink-soft:var(--imperial-muted);
    --maroon:var(--imperial-kumkum);
    --gold-light:var(--imperial-gold);
    --card-surface:color-mix(in srgb, var(--imperial-text) 4%, var(--imperial-bg));
    --line:color-mix(in srgb, var(--imperial-text) 20%, transparent);
  }
  .berunda-mark-v2{
    position:absolute; right:-20px; top:-10px; width:230px; height:auto;
    opacity:0.09; pointer-events:none; color:var(--maroon);
  }
  .berunda-mark-v2 path{stroke:currentColor; fill:none; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round;}

  /* Tiny Hase Chittara - only used once, as the threshold into Karnataka. */
  .chittara-divider{
    height:16px;
    background-color:var(--maroon);
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12'%3E%3Cg fill='none' stroke='%23F6F1E4' stroke-width='0.8' stroke-linecap='square'%3E%3Crect x='1.5' y='1.5' width='9' height='9'/%3E%3Cpath d='M6 1.5 L6 10.5 M1.5 6 L10.5 6'/%3E%3Cpath d='M3.5 6 L6 3.5 L8.5 6 L6 8.5 Z'/%3E%3C/g%3E%3C/svg%3E");
    background-repeat:repeat; background-size:12px 12px;
  }

  /* ---------- inline motif icons ---------- */
  .motif-icon{width:18px; height:18px; flex:none; stroke:currentColor; fill:none; stroke-width:1.4;}
  .head-with-icon{display:flex; align-items:center; gap:7px; margin-bottom:2px;}
  .head-with-icon .kn{margin-bottom:0 !important;}

  /* ---------- region strip: six threads of karnataka ---------- */
  .region-row{background:transparent; border:none;}
  .region-card{
    background:var(--region-bg, var(--cream-2)); padding:20px 14px 14px; border-top:none;
    position:relative; overflow:hidden; color:var(--on-accent);
  }
  .region-card::after{
    content:''; position:absolute; top:0; left:0; right:0; height:8px; z-index:2; pointer-events:none;
    background-color:var(--kasuti-black);
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpolygon points='0,8 6,0 12,8' fill='%239C2436'/%3E%3Cpolygon points='0,8 6,3 12,8' fill='%23D4A017'/%3E%3C/svg%3E");
    background-repeat:repeat-x;
    background-size:12px 8px;
  }
  .region-card::before{
    content:''; position:absolute; inset:0;
    background-image:var(--region-pattern, none);
    background-size:var(--region-pattern-size, 20px 20px);
    opacity:var(--region-pattern-opacity, 0.38); pointer-events:none;
  }
  .region-card-inner{
    position:relative; z-index:1;
    padding:16px 16px 14px;
    background:color-mix(in srgb, var(--region-bg, #201C17) 38%, transparent);
    backdrop-filter:blur(4px) saturate(1.15);
    -webkit-backdrop-filter:blur(12px) saturate(1.15);
    border-radius:12px;
    flex:1 1 auto;
    display:flex;
    flex-direction:column;
    min-height:0;
  }
  .region-card h4{
    font-family:'Baloo 2',sans-serif; font-size:15.5px; font-weight:600; margin-bottom:6px;
    display:flex; align-items:center; gap:6px; color:var(--on-accent);
  }
  .region-card p{
    font-size:12.5px; color:color-mix(in srgb, var(--on-accent) 86%, transparent); line-height:1.45; position:relative;
    display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden;
  }
  .region-pronounce{display:flex; align-items:baseline; gap:6px; margin-bottom:6px; position:relative; flex-wrap:wrap;}
  .region-kn{font-size:13px; color:var(--region-color, var(--gold-light));}
  .region-say{font-size:11px; color:color-mix(in srgb, var(--on-accent) 78%, transparent); font-style:italic;}
  .region-card .speak-btn-sm{
    color:var(--on-accent); border-color:color-mix(in srgb, var(--on-accent) 35%, transparent);
    background:color-mix(in srgb, var(--on-accent) 12%, transparent);
  }
  .region-card .speak-btn-sm:hover{background:color-mix(in srgb, var(--on-accent) 22%, transparent);}
  .region-highlights{
    position:relative; margin:12px 0 0; padding:10px 0 0 18px;
    border-top:1px dashed color-mix(in srgb, var(--on-accent) 32%, transparent);
  }
  .region-highlights li{
    margin:0 0 6px; font-size:11.5px; line-height:1.45;
    color:color-mix(in srgb, var(--on-accent) 88%, transparent);
  }
  .flavor-list{margin-top:11px; display:flex; flex-direction:column; gap:4px; position:relative; flex:1;}
  .region-movie{margin-top:auto; padding-top:8px; border-top:1px dashed color-mix(in srgb, var(--on-accent) 32%, transparent); font-size:11.5px; color:color-mix(in srgb, var(--on-accent) 82%, transparent);}
  .flavor-item{font-size:11px; color:color-mix(in srgb, var(--on-accent) 82%, transparent); display:flex; align-items:baseline; gap:6px; line-height:1.4;}
  .flavor-item b{color:var(--on-accent); font-weight:600;}
  .flavor-dot{width:7px; height:7px; border-radius:50%; flex:none; margin-top:2px;}
  .flavor-dot.sweet{background:var(--gold);}
  .flavor-dot.spicy{background:#F0A3AE;}
  .flavor-dot.cold{background:#8ED4C8;}
  .flavor-dot.hot{background:#F0B27A;}
  .region-movie b{color:var(--on-accent); font-weight:600;}

  /* ---------- festivals ---------- */
  .festival-card{
    background:var(--card-surface);
    border:1px solid var(--line); border-radius:var(--radius); padding:22px 20px 18px;
    position:relative; overflow:hidden;
    display:flex; flex-direction:column; min-width:0;
  }
  .festival-card::before{
    content:''; position:absolute; top:0; left:0; right:0; height:8px; pointer-events:none;
    background-color:var(--kasuti-black);
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpolygon points='0,8 6,0 12,8' fill='%239C2436'/%3E%3Cpolygon points='0,8 6,3 12,8' fill='%23D4A017'/%3E%3C/svg%3E");
    background-repeat:repeat-x;
    background-size:12px 8px;
  }
  .festival-top{
    display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:start; gap:8px; margin-bottom:6px;
  }
  .festival-card h3{font-size:16.5px; line-height:1.25; overflow-wrap:anywhere; min-width:0;}
  .festival-when{font-size:11.5px; font-weight:600; color:var(--fest-color, var(--maroon)); white-space:nowrap;}
  .festival-where{font-size:12px; color:var(--ink-soft); margin-bottom:8px; overflow-wrap:anywhere;}
  .festival-card > p:not(.festival-credit){
    font-size:13.5px; color:var(--ink-soft); line-height:1.5; margin:0;
    display:-webkit-box; -webkit-line-clamp:6; -webkit-box-orient:vertical; overflow:hidden;
    flex:1;
  }
  .festival-credit{margin:8px 0 0; flex:none;}
  .festival-card a{color:var(--maroon); font-weight:600;}

  /* ---------- did you know ---------- */
  .quip-card{
    background:var(--card-surface);
    border:1px solid var(--line); border-radius:var(--radius);
    padding:16px 18px; border-top:3px solid var(--gold);
    overflow:hidden;
    min-width:0;
    height:100%;
    display:flex;
    flex-direction:column;
  }
  .quip-card.featured{
    display:flex;
    flex-direction:column;
    padding:20px 18px 18px;
    border-top-color:var(--maroon);
  }
  .quip-kicker{font-size:11px; font-weight:700; letter-spacing:0.04em; text-transform:uppercase; color:var(--maroon); margin-bottom:8px;}
  .quip-card h3{font-size:20px; line-height:1.3; margin:0; overflow-wrap:anywhere;}
  .quip-card.featured h3{font-size:20px;}
  .quip-kn{display:inline-grid; color:var(--maroon); font-size:13px; margin-top:6px; max-width:100%;}
  .quip-card p{font-size:14.5px; color:var(--ink-soft); line-height:1.55; margin:10px 0 0;}
  .quip-card.featured p{margin-top:10px; font-size:15px;}
  @media (max-width:800px){
    .quip-card.featured h3{font-size:20px;}
  }

  /* ---------- dishes ---------- */
  .dish-controls{margin-bottom:18px;}
  .dish-card{
    background:var(--card-surface);
    border:1px solid var(--line); border-radius:var(--radius); padding:16px 18px; overflow:hidden;
    color:var(--ink);
    min-width:0;
  }
  .dish-photo{
    width:calc(100% + 36px); max-width:none; margin:-16px -18px 12px; display:block; height:140px; object-fit:cover; flex:none;
  }
  .dish-card > .photo-wait{
    width:calc(100% + 36px); max-width:none; margin:-16px -18px 12px; height:140px;
  }
  .dish-card > .photo-wait img.dish-photo{width:100%; margin:0; height:140px;}
  .dish-photo:focus-visible, .camera-roll img:focus-visible{outline:2px solid var(--maroon); outline-offset:-2px;}
  .dish-name-row{display:flex; align-items:center; gap:8px; min-width:0;}
  .dish-name{font-family:'Baloo 2',sans-serif; font-weight:700; font-size:16px; overflow-wrap:anywhere; min-width:0;}
  .dish-kn-row{display:flex; align-items:center; gap:7px; margin-top:3px; flex-wrap:nowrap; min-width:0;}
  .dish-kn{font-size:15px; color:var(--maroon); overflow-wrap:normal; flex:none;}
  .dish-say{font-size:11.5px; color:var(--ink-soft); font-style:italic; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .dish-desc{font-size:13px; color:var(--ink-soft); margin-top:8px; line-height:1.5; flex:1;}
  .dish-grid .dish-desc{
    display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden;
  }
  .dish-grid .dish-photo, .dish-grid .dish-card > .photo-wait{height:150px; background:var(--cream-2);}
  .dish-grid .dish-card > .photo-wait img.dish-photo{height:150px;}
  .dish-photo-empty{
    display:flex; align-items:center; justify-content:center;
    color:var(--ink-soft); font-size:12px; font-style:italic; cursor:default;
  }
  .dish-try{
    margin-top:10px; padding-top:8px; border-top:1px dashed var(--line); flex:none;
  }
  .dish-try-label{font-size:11px; font-weight:600; color:var(--maroon); margin-bottom:6px;}
  .dish-try-list{display:flex; flex-wrap:wrap; gap:6px;}
  .dish-try-list button,
  .dish-try-list a{
    border:1.5px solid var(--line); background:transparent; color:var(--ink);
    border-radius:99px; padding:4px 10px; font-size:12px; font-weight:600; cursor:pointer;
    text-decoration:none; line-height:1.4;
  }
  .dish-try-list button:hover,
  .dish-try-list a:hover{border-color:var(--maroon); color:var(--maroon);}
  .dish-try-list .dish-try-static{
    padding:4px 2px; font-size:12px; font-weight:600; color:var(--ink-soft);
  }
  .dish-card .card-actions{margin-top:auto; padding-top:10px;}

  /* the notebook page and the guide preview both wrap instead of scrolling sideways */
  .dish-grid-page, .dish-grid-preview{
    display:grid; grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:16px; max-width:1180px; overflow:visible; padding:0;
  }
  .dish-grid-page{grid-template-columns:repeat(3, minmax(0, 1fr));}
  .dish-grid-page > *, .dish-grid-preview > *{flex:none; width:auto;}
  /* rows already even out the card heights, so let the description run */
  .dish-grid-page .dish-desc, .dish-grid-preview .dish-desc{
    display:block; -webkit-line-clamp:none; overflow:visible;
  }
  .dish-grid-page{margin-top:4px;}
  #dishEmpty{max-width:1180px; color:var(--ink-soft);}
  @media (max-width:1000px){
    .dish-grid-page{grid-template-columns:repeat(2, minmax(0, 1fr));}
    .dish-grid-preview{grid-template-columns:repeat(2, minmax(0, 1fr));}
  }
  @media (max-width:620px){
    .dish-grid-page, .dish-grid-preview{grid-template-columns:1fr;}
  }

  /* ---------- this not that ---------- */
  .tnt-section{
    background:transparent; color:var(--ink);
    position:relative; overflow:visible;
  }
  .shalya-mark{
    position:absolute; right:-18px; top:36px; width:168px; height:auto;
    opacity:0.12; pointer-events:none; color:var(--hampi-stone);
  }
  .shalya-mark .drape, .shalya-mark .fold{fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round;}
  .shalya-mark .kara{fill:none; stroke:var(--gold); stroke-width:3.2; stroke-linecap:square;}
  .tnt-section .section-head .kn{color:var(--maroon);}
  .tnt-section .section-head .motif-icon{color:var(--maroon);}
  .tnt-section .section-head p{color:var(--ink-soft);}
  .tnt-table{
    background:var(--card-surface);
    border:1px solid var(--line); border-radius:var(--radius);
    overflow:hidden;
  }
  .tnt-list{display:flex; flex-direction:column; gap:0;}
  .tnt-label-row{
    display:grid; grid-template-columns:minmax(140px,0.7fr) minmax(0,1.3fr); gap:28px;
    font-size:12px; font-weight:600; color:var(--maroon);
    letter-spacing:0.02em; margin:0;
    padding:12px 20px 10px;
    background:color-mix(in srgb, var(--maroon) 6%, var(--card-surface));
    border-bottom:1px solid var(--line);
    align-items:end;
  }
  .tnt-card{
    background:transparent;
    border:none; border-top:1px solid var(--line); border-radius:0;
    padding:14px 20px;
    display:grid; grid-template-columns:minmax(140px,0.7fr) minmax(0,1.3fr); gap:28px; align-items:baseline;
  }
  .tnt-kicker{display:none;}
  .tnt-card .often{
    margin:0; color:var(--ink); font-size:15.5px; font-family:'Baloo 2',sans-serif;
    font-weight:600; line-height:1.35;
  }
  .tnt-card .also{
    margin:0; color:var(--ink-soft); font-size:14.5px; font-weight:400; line-height:1.5;
  }
  .tnt-row{
    display:grid; grid-template-columns:1fr 1.4fr; gap:24px; align-items:start;
    padding:14px 18px;
    background:rgba(247,238,218,0.92); border:1px solid var(--line); border-radius:var(--radius);
  }
  .tnt-row .often{color:var(--ink); font-size:14.5px; font-family:'Baloo 2',sans-serif; font-weight:600;}
  .tnt-row .also{color:var(--ink-soft); font-size:13.5px; font-weight:400;}
  .tnt-arrow{display:none;}
  .tnt-section .section-head{max-width:none;}
  .india-stat-row{
    display:grid; grid-template-columns:minmax(160px, 220px) minmax(0, 1fr);
    gap:28px; align-items:start; margin-bottom:26px;
  }
  .india-stat{
    text-align:center; border:1px solid var(--line); border-radius:var(--radius);
    padding:18px 24px; background:rgba(247,238,218,0.92);
  }
  .india-stat strong{display:block; font-family:'Baloo 2',sans-serif; font-size:28px; color:var(--maroon); white-space:nowrap;}
  .india-stat span{display:block; font-size:12.5px; color:var(--ink-soft); margin-top:4px;}
  .india-map-caption{display:flex; flex-direction:column; gap:8px; max-width:none; min-width:0;}
  .india-map-caption p{font-size:14.5px; color:var(--ink-soft); margin:0; line-height:1.55;}

  /* ---------- skip the crowd ---------- */
  .skip-section{background:var(--cream-2);}
  .skip-section .section-head .kn{color:var(--terracotta);}
  .skip-section .section-head .motif-icon{color:var(--terracotta);}
  .skip-list{display:flex; flex-direction:column; gap:14px;}
  .skip-row{
    display:grid; grid-template-columns:1fr 32px 1fr; gap:18px; align-items:stretch;
    background:var(--card-surface); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden;
    position:relative; padding-top:8px;
  }
  .skip-row::before{
    content:''; position:absolute; top:0; left:0; right:0; height:8px;
    background-color:var(--kasuti-black);
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpolygon points='0,8 6,0 12,8' fill='%239C2436'/%3E%3Cpolygon points='0,8 6,3 12,8' fill='%23D4A017'/%3E%3C/svg%3E");
    background-repeat:repeat-x;
    background-size:12px 8px;
  }
  .skip-col{padding:16px 18px;}
  .skip-col.crowded{border-left:4px solid var(--ink-soft);}
  .skip-col.crowded .place{font-size:15.5px; font-weight:600; text-decoration:line-through; text-decoration-color:var(--line); text-decoration-thickness:1.5px;}
  .skip-col.crowded .why{font-size:12.5px; color:var(--ink-soft); margin-top:5px;}
  .skip-col.instead{border-left:4px solid var(--leaf);}
  .skip-col.instead .place{font-size:15.5px; font-weight:600; color:var(--leaf);}
  .skip-col.instead .area{font-size:12px; color:var(--ink-soft); margin-top:2px;}
  .skip-col.instead .why{font-size:13px; color:var(--ink-soft); margin-top:5px;}
  .skip-arrow{display:flex; align-items:center; justify-content:center; color:var(--gold); font-size:15px; background:var(--cream-2);}

  /* ---------- learn kannada ---------- */
  .kannada-section{background:var(--cream); color:var(--ink);}
  .kannada-section .section-head .kn{color:var(--maroon);}
  .kannada-section .section-head .motif-icon{color:var(--maroon);}
  .kannada-section .section-head p{color:var(--ink-soft);}
  .phrase-grid{display:flex; flex-direction:column; gap:28px; position:relative;}
  .phrase-group-title{
    font-family:'Baloo 2',sans-serif; font-size:14px; font-weight:700; color:var(--maroon);
    text-transform:none; letter-spacing:0.02em; margin-bottom:12px;
    padding-bottom:6px; border-bottom:1px solid var(--line);
  }
  .phrase-card{
    background:var(--card-surface);
    border:1px solid var(--line); border-radius:var(--radius);
    padding:16px 18px;
    min-width:0;
    overflow:hidden;
  }
  .phrase-card .p-kn{font-family:'Baloo Tamma 2',sans-serif; font-size:21px; font-weight:600; color:var(--maroon); overflow-wrap:break-word; min-width:0; white-space:normal;}
  .p-kn-row{display:flex; align-items:center; justify-content:space-between; gap:8px; min-width:0;}
  .speak-btn{
    background:color-mix(in srgb, var(--maroon) 10%, transparent); border:1px solid var(--line);
    color:var(--maroon); border-radius:50%;
    width:28px; height:28px; flex:none; font-size:13px; line-height:1;
    display:flex; align-items:center; justify-content:center;
  }
  .speak-btn:hover{background:color-mix(in srgb, var(--maroon) 18%, transparent);}
  .kannada-section .speak-btn{
    background:color-mix(in srgb, var(--maroon) 10%, transparent); border:1px solid var(--line);
    color:var(--maroon);
  }
  .speak-btn-sm{
    background:color-mix(in srgb, var(--maroon) 10%, transparent); border:1px solid var(--line);
    color:var(--maroon); width:20px; height:20px; font-size:10px;
    border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
  }
  .speak-btn-sm:hover{background:color-mix(in srgb, var(--maroon) 18%, transparent);}
  .voice-picker{
    display:flex; align-items:center; flex-wrap:wrap; gap:8px;
    margin:0 0 18px; font-size:13px;
  }
  .voice-label{color:var(--ink-soft); letter-spacing:0.04em; text-transform:uppercase; font-size:11px;}
  .voice-choice{
    background:transparent; border:1px solid var(--line); color:var(--maroon);
    border-radius:999px; padding:5px 13px; font:inherit; font-size:13px; cursor:pointer;
  }
  .voice-choice:hover{background:color-mix(in srgb, var(--maroon) 10%, transparent);}
  .voice-choice[aria-pressed="true"]{
    background:color-mix(in srgb, var(--maroon) 16%, transparent);
    border-color:var(--maroon); font-weight:600;
  }
  /* Hidden until kannada-voice.js confirms there is a second voice. */
  .speak-alt{display:none; font-size:12px;}
  body.has-voice-choice .speak-alt{display:inline-flex;}
  .p-kn-row .speak-alt{margin-left:6px;}
  .footer-preethi{display:inline-flex; align-items:center; gap:5px; vertical-align:middle;}
  .phrase-card .p-translit{font-size:13px; font-style:italic; color:var(--ink-soft); margin-top:2px;}
  .p-say{font-size:11.5px; color:var(--maroon); margin-top:3px; letter-spacing:0.02em;}
  .phrase-card .p-meaning{font-size:14.5px; font-weight:600; margin-top:8px;}
  .phrase-card .p-tip{
    font-size:12.5px; color:var(--ink-soft); margin-top:5px; line-height:1.4;
    display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
  }
  .p-examples{
    margin-top:9px; padding-top:8px; border-top:1px dashed var(--line);
    display:flex; flex-direction:column; gap:4px;
  }
  .p-example{font-size:12px; color:var(--ink-soft); display:flex; gap:6px; flex-wrap:wrap;}
  .p-ex-kn{font-family:'Baloo Tamma 2',sans-serif; color:var(--maroon); font-size:13px;}
  .p-ex-translit{font-style:italic;}
  .p-variant{
    margin-top:auto; padding-top:8px; border-top:1px dashed var(--line);
    font-size:12px; color:var(--ink-soft); overflow-wrap:anywhere;
  }
  .p-variant-label{display:block; font-weight:600; color:var(--maroon); margin-bottom:2px;}
  .p-variant-line{line-height:1.45;}

  /* ---------- history timeline ---------- */
  .history-section{background:transparent; position:relative;}
  .history-section .section-head .kn{color:var(--maroon);}
  .history-section .section-head .motif-icon{color:var(--maroon);}
  .history-grid{display:grid; grid-template-columns:1.1fr 1fr; gap:48px; align-items:start;}
  .note-pair{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:28px; align-items:stretch;}
  .rename-note{
    border:1px solid var(--line); border-radius:var(--radius);
    padding:18px 20px; margin-bottom:0; background:rgba(247,238,218,0.92);
  }
  .note-geology{border-left:none;}
  .note-geology h4{color:var(--ink);}
  .note-rename{border-left:none;}
  .note-rename h4{color:var(--ink);}
  .rename-note h4{font-family:'Baloo 2',sans-serif; font-size:15.5px; margin-bottom:8px; color:var(--ink);}
  .rename-note p{font-size:13.5px; color:var(--ink-soft); line-height:1.6; max-width:820px;}
  .credit-note{
    border:1px solid var(--line); border-left:4px solid var(--maroon);
    background:var(--card-surface); border-radius:var(--radius);
    padding:14px 16px; margin:16px 0 4px;
  }
  .why-section h3{font-size:18px; margin:20px 0 8px;}
  .credit-note p{color:var(--ink); font-size:15px; line-height:1.6; margin:0;}
  .credit-note a{color:var(--maroon); font-weight:600; text-decoration:underline;}
  @media (max-width:800px){
    .note-pair{grid-template-columns:1fr;}
  }
  .history-side{display:flex; flex-direction:column; gap:28px; position:sticky; top:100px;}
  .timeline{display:flex; flex-direction:column; gap:14px; max-width:820px;}
  .timeline-item{
    position:relative; padding:2px 0 2px 18px; border-left:3px solid var(--gold); cursor:pointer;
    display:block; width:100%; appearance:none; -webkit-appearance:none;
    background:transparent; border-top:none; border-right:none; border-bottom:none;
    font:inherit; color:inherit; text-align:left; border-radius:0;
  }
  .timeline-item:last-child{padding-bottom:2px;}
  .timeline-item::before{display:none;}
  .timeline-item .year{font-family:'Baloo 2',sans-serif; font-weight:700; color:var(--maroon); font-size:14px; margin-bottom:0; letter-spacing:0;}
  .timeline-item h4{font-size:15.5px; margin:0 0 5px;}
  .timeline-item p{font-size:13.5px; color:var(--ink-soft); line-height:1.5; margin:5px 0 0;}
  .timeline-item.active{padding-left:18px; background:rgba(247,238,218,0.55);}
  .timeline-item.active::before{display:none;}
  .timeline-item.active h4{color:var(--maroon);}
  .timeline-item:focus-visible{outline:2px solid var(--maroon); outline-offset:3px;}
  .areas-compare{display:flex; flex-direction:column; gap:26px;}
  .areas-col h4{font-size:14px; text-transform:none; color:var(--ink-soft); margin-bottom:10px; font-weight:600;}
  .areas-col ul{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:7px;}
  .areas-col li{
    font-size:14px; padding:9px 13px; background:var(--card-surface); border:1px solid var(--line);
    border-left:3px solid var(--areas-color, var(--hampi-stone)); border-radius:var(--radius);
  }

  /* ---------- about the guide / creator note ---------- */
  .creator-note{
    background:var(--card-surface); border:1px solid var(--line); border-left:4px solid var(--jacaranda);
    border-radius:var(--radius); padding:26px 28px; margin-bottom:32px;
  }
  .creator-note .head-with-icon{margin-bottom:12px;}
  .creator-note p{font-size:15px; color:var(--ink-soft); line-height:1.65; max-width:760px;}
  .creator-note p + p{margin-top:12px;}
  .creator-links{font-size:14px !important;}
  .creator-links a{color:var(--maroon); text-decoration:underline; font-weight:600;}
  .person-card{
    display:flex; gap:14px; align-items:flex-start;
    background:var(--card-surface); border:1px solid var(--line);
    border-left:4px solid var(--jacaranda); border-radius:var(--radius);
    padding:16px; margin-top:16px;
  }
  .person-card-lead{flex-direction:column;}
  .person-card-lead > div{min-width:0;}
  @media (min-width:560px){
    .person-card-lead{flex-direction:row;}
  }
  .person-avatar{
    width:56px; height:56px; border-radius:50%; object-fit:cover;
    border:2px solid var(--gold); background:var(--cream-2); flex:none;
  }
  .person-card h3{font-size:17px; margin:0 0 2px;}
  .person-role{font-size:12.5px; font-weight:600; color:var(--maroon); margin:0 0 8px;}
  .person-brief{font-size:14.5px; color:var(--ink-soft); line-height:1.5; margin:0;}
  .person-card p{font-size:14.5px; color:var(--ink-soft); line-height:1.6; margin:0;}
  .person-card p + p{margin-top:10px;}
  .person-more{margin-top:8px;}
  .person-more > summary,
  details.person-card > summary{
    cursor:pointer; list-style:none; color:var(--maroon); font-size:13px; font-weight:600;
  }
  .person-more > summary::-webkit-details-marker,
  details.person-card > summary::-webkit-details-marker{display:none;}
  .person-more > summary::after{content:' ▾'; font-size:10px;}
  .person-more[open] > summary::after{content:' ▴';}
  .person-more-body{margin-top:10px;}
  .people-more-head{font-size:15px; margin:22px 0 0; color:var(--ink);}
  .people-grid details.person-card{align-items:stretch; text-align:left; border-left-width:1px; padding:14px; margin-top:0; overflow:hidden;}
  .people-grid details.person-card > summary{
    display:flex; flex-direction:column; align-items:center; text-align:center; gap:8px;
  }
  .people-grid details.person-card > summary::after{content:none;}
  .people-grid details.person-card > summary::before{
    content:'More'; align-self:center; order:3; font-size:12px;
  }
  .people-grid details.person-card[open] > summary::before{content:'Less';}
  .people-grid .person-card p{font-size:13px;}
  .people-grid .person-more-body{text-align:center;}
  .people-grid .person-more-body a{color:var(--maroon); font-weight:600;}

  /* ---------- write in: spot + question ---------- */
  .write-in{
    background:var(--card-surface);
    border:1px solid var(--line); border-radius:var(--radius); overflow:hidden;
  }
  .write-in-tabs{
    display:flex; border-bottom:1px solid var(--line); padding:8px 10px; gap:6px;
  }
  .write-in-tabs button{
    border:1px solid var(--line); background:transparent;
    padding:8px 16px; border-radius:20px; font-size:13px; font-weight:600; color:var(--ink-soft);
  }
  .write-in-tabs button[aria-selected="true"]{
    background:var(--maroon); color:var(--on-accent); border-color:var(--maroon);
  }
  .write-in-panel{padding:22px 24px 20px;}
  .write-in-panel[hidden]{display:none;}
  .add-form{
    display:grid; grid-template-columns:1fr 1fr; gap:14px;
  }
  .add-form .full{grid-column:1/-1;}
  .add-form label{font-size:12.5px; font-weight:600; color:var(--ink-soft); display:block; margin-bottom:6px;}
  .add-form input, .add-form select, .add-form textarea{
    width:100%; padding:10px 12px; border:1px solid var(--line); border-radius:var(--radius);
    font-family:inherit; font-size:14px; background:var(--cream);
  }
  .add-form textarea{resize:vertical; min-height:56px;}
  .submit-btn{
    grid-column:1/-1; justify-self:start; background:var(--maroon); color:#fff; border:none;
    padding:11px 22px; border-radius:20px; font-weight:600; font-size:14px;
  }
  .submit-btn:hover{background:var(--maroon-dark);}
  .form-note{font-size:12.5px; color:var(--ink-soft); margin-top:12px;}
  .write-in-ways{
    display:flex; flex-wrap:wrap; gap:10px; margin:0 0 18px;
  }
  .write-in-ways a{
    display:inline-flex; align-items:center; min-height:42px; padding:9px 16px;
    border:1px solid var(--maroon); border-radius:99px; font-size:13px; font-weight:600;
  }
  .write-in-repo{color:var(--maroon); background:transparent;}

  /* Colophon lives at the end of the notebook. */
  #colophon{border-top:1px solid var(--line);}

  /* ---------- agenda drawer ---------- */
  .drawer-backdrop{
    position:fixed; inset:0; background:rgba(36,28,24,0.4); z-index:49;
    opacity:0; pointer-events:none; transition:opacity .2s ease;
  }
  .drawer-backdrop[data-open="true"]{opacity:1; pointer-events:auto;}
  .lightbox{
    position:fixed; inset:0; background:rgba(10,8,6,0.92); z-index:80;
    display:flex; align-items:center; justify-content:center; padding:32px;
    opacity:0; pointer-events:none; transition:opacity .2s ease;
  }
  .lightbox[data-open="true"]{opacity:1; pointer-events:auto;}
  .lightbox img{max-width:100%; max-height:100%; border-radius:4px; box-shadow:0 8px 40px rgba(0,0,0,0.5); cursor:default;}
  .lightbox-close{
    position:absolute; top:18px; right:22px; background:none; border:none;
    color:#F7EEDA; font-size:36px; line-height:1; cursor:pointer; padding:6px 10px;
  }
  .lightbox-close:hover{color:var(--gold-light);}
  .dish-photo:not(.dish-photo-empty), .camera-roll img{cursor:zoom-in;}
  .drawer{
    position:fixed; top:0; right:0; height:100%; width:min(380px,92vw); z-index:50;
    background:var(--cream); box-shadow:-8px 0 24px rgba(0,0,0,0.15);
    transform:translateX(100%); transition:transform .25s ease;
    display:flex; flex-direction:column;
  }
  .drawer[data-open="true"]{transform:translateX(0);}
  .drawer-head{padding:22px; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; align-items:center;}
  .drawer-kicker{font-size:15px; color:var(--maroon);}
  .drawer-kicker.kn-cycle{display:inline-grid;}
  .drawer-head h3{font-size:20px;}
  .drawer-close{
    background:none; border:1.5px solid var(--maroon); color:var(--maroon);
    border-radius:99px; width:30px; height:30px; font-size:14px; line-height:1;
  }
  .drawer-body{padding:16px 20px; overflow-y:auto; flex:1; display:flex; flex-direction:column; gap:10px;}
  .drawer-item{
    display:flex; justify-content:space-between; align-items:center; gap:10px;
    background:#fff; border:1px solid var(--line); border-left:3px solid var(--gold);
    border-radius:var(--radius); padding:10px 12px;
  }
  .drawer-item.is-done{opacity:0.55; border-left-color:var(--leaf);}
  .drawer-item.is-done .todo-name{text-decoration:line-through;}
  .todo-check{display:flex; align-items:flex-start; gap:10px; flex:1; min-width:0; cursor:pointer;}
  .todo-check input{margin-top:4px; flex:none; width:16px; height:16px;}
  .todo-name{display:block; font-weight:600; font-size:14px;}
  .drawer-item .meta{font-size:12px; color:var(--ink-soft);}
  .drawer-item button{background:none; border:none; color:var(--maroon); font-size:13px; font-weight:600;}
  .drawer-empty{color:var(--ink-soft); font-size:14px; padding-top:20px;}
  .drawer-foot{padding:16px 20px; border-top:1px solid var(--line); display:flex; flex-direction:column; gap:8px;}
  .copy-btn{
    width:100%; background:var(--leaf); color:#fff; border:none; padding:11px; border-radius:20px;
    font-weight:600; font-size:14px;
  }
  .copy-btn-alt{background:var(--cream-2); color:var(--ink); border:1px solid var(--line);}
  .drawer-hint{font-size:12px; color:var(--ink-soft); line-height:1.45; margin:4px 0 0;}
  .drawer-clear{background:none; border:none; color:var(--maroon); font-size:13px; font-weight:600; padding:4px 0;}

  /* ---------- about / customize ---------- */
  .about-grid{display:grid; grid-template-columns:1fr; max-width:640px; gap:32px;}
  .about-grid h3{font-size:16px; margin-bottom:8px;}
  .about-grid p{font-size:14.5px; color:var(--ink-soft);}
  code{background:var(--cream-2); padding:2px 6px; border-radius:4px; font-size:13px;}

  .sources-under-why{margin-top:22px;}
  .sources-under-why h3{font-size:15px; margin:0 0 8px;}
  .sources-under-why > p{font-size:14px; margin:0 0 10px;}
  .sources-grid{display:grid; grid-template-columns:1fr; gap:18px;}
  .sources-details{margin-top:8px;}
  .sources-details summary{
    cursor:pointer; font-weight:600; font-size:14.5px; color:var(--maroon);
    padding:10px 0; list-style:none; display:flex; align-items:center; gap:6px;
  }
  .sources-details summary::-webkit-details-marker{display:none;}
  .sources-details summary::before{content:'▸'; font-size:12px; transition:transform 0.2s;}
  .sources-details[open] summary::before{transform:rotate(90deg);}
  .sources-details .sources-grid{margin-top:20px;}
  .sources-col h4{font-size:13px; color:var(--maroon); font-weight:600; margin-bottom:8px; text-transform:none;}
  .sources-col h4 + h4{margin-top:18px;}
  .sources-col ul{list-style:none; padding:0; margin:0 0 4px; display:flex; flex-direction:column; gap:7px;}
  .sources-col a{font-size:13.5px; color:var(--ink-soft); text-decoration:underline; text-decoration-color:var(--line); text-underline-offset:2px;}
  .sources-col a:hover{color:var(--maroon); text-decoration-color:var(--maroon);}

  /* ---------- beyond the city gate ---------- */
  section#beyond-city{
    max-width:none; background:var(--kannada-bg); color:var(--on-accent);
    padding:56px 0;
    --rail-fade:var(--kannada-bg);
  }
  #beyond-city .section-head,
  #beyond-city .karnataka-sub{
    max-width:1180px; margin-left:auto; margin-right:auto; padding-left:24px; padding-right:24px;
    min-width:0;
  }
  #beyond-city .section-head{max-width:1180px;}
  #beyond-city .section-head .kn{color:var(--gold-light);}
  #beyond-city .section-head .motif-icon{color:var(--gold-light);}
  #beyond-city .section-head h2{color:var(--on-accent);}
  #beyond-city .section-head p{color:var(--on-accent);}
  #beyond-city .sub-head h3{color:var(--on-accent);}
  #beyond-city .sub-head p{color:var(--on-accent);}
  #beyond-city .festivals-sub .sub-head h3{color:var(--ink);}
  #beyond-city .festivals-sub .sub-head p{color:var(--ink-soft);}
  #beyond-city .region-card{border-radius:var(--radius);}

  /* ---------- mala / section ornaments ---------- */
  .mala-divider{
    max-width:620px; margin:0 auto; padding:0 24px 44px; opacity:0.75;
  }
  .mala-divider svg{width:100%; height:auto; display:block;}
  .section-ornament{
    position:absolute; pointer-events:none; opacity:0.4;
  }

  footer{border-top:1px solid var(--line); padding:32px 24px; text-align:center; background:var(--cream);}
  footer .kn{color:var(--maroon); font-weight:600; margin-bottom:6px; display:block;}
  footer p{color:var(--ink-soft); font-size:13px;}
  .footer-meta{font-size:11px !important; color:var(--ink-soft); opacity:0.6; margin-top:8px;}
  .gallery-grid{
    display:grid;
    grid-template-columns:repeat(6, minmax(0, 1fr));
    grid-auto-flow:dense;
    gap:12px;
    max-width:1180px;
  }
  .gallery-shot{grid-column:span 2; margin:0; min-width:0;}
  .gallery-shot.is-wide{grid-column:span 3;}
  .gallery-shot .photo-wait{
    position:relative; aspect-ratio:3/4; height:auto; border-radius:var(--radius);
    overflow:hidden; background:var(--cream-2);
  }
  .gallery-shot.is-wide .photo-wait{aspect-ratio:4/3;}
  .gallery-shot .photo-wait img,
  .gallery-img{
    position:absolute; inset:0; width:100%; height:100%; max-width:none;
    object-fit:cover; cursor:zoom-in; margin:0;
  }
  .gallery-shot figcaption{padding:8px 4px 2px;}
  .gallery-shot figcaption > p{margin:0; font-size:13.5px; color:var(--ink); line-height:1.4;}
  .gallery-shot-meta{margin:4px 0 0; font-size:12px; color:var(--ink-soft);}
  .gallery-by{margin-right:8px;}
  .gallery-map{
    border:0; background:none; padding:0; color:var(--maroon); font-weight:600;
    font-size:12px; cursor:pointer; font-family:inherit; text-decoration:none;
  }
  .gallery-map:hover{text-decoration:underline;}
  .gallery-more{margin:18px 0 0; max-width:1180px; font-size:15px;}
  .gallery-more a{color:var(--maroon); font-weight:700;}
  .race-pills{max-width:1180px; margin:0 0 22px;}
  .race-grid{
    display:grid; grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:16px; max-width:1180px;
  }
  .race-grid-preview{grid-template-columns:repeat(2, minmax(0, 1fr));}
  .race-card{
    background:#fff; border:1px solid var(--line); border-left:3px solid var(--maroon);
    border-radius:var(--radius); padding:16px 18px; min-width:0;
  }
  .race-kinds{display:flex; flex-wrap:wrap; gap:6px; margin:0 0 8px;}
  .race-kind{
    font-size:11px; font-weight:600; letter-spacing:0.02em;
    padding:2px 8px; border-radius:99px; background:var(--cream-2); color:var(--ink);
  }
  .race-kind.is-trail{background:var(--leaf); color:#fff;}
  .race-card h3{font-size:18px; margin:0 0 4px;}
  .race-where, .race-dist{margin:0; font-size:13px; color:var(--ink-soft);}
  .race-blurb{margin:10px 0 0; font-size:14.5px; color:var(--ink); line-height:1.45;}
  .race-link{margin:10px 0 0; font-size:13px; font-weight:600;}
  .race-empty{color:var(--ink-soft);}
  @media (max-width:800px){
    .race-grid, .race-grid-preview{grid-template-columns:1fr;}
  }
  body[data-page="photos"] #contribGallery{padding-top:36px;}
  body[data-page="photos"] #galleryEmpty{max-width:1180px; margin:0 24px; color:var(--ink-soft);}
  @media (max-width:800px){
    .gallery-grid{grid-template-columns:repeat(2, minmax(0, 1fr)); gap:10px;}
    .gallery-shot, .gallery-shot.is-wide{grid-column:span 1;}
    .gallery-shot.is-wide .photo-wait{aspect-ratio:4/3;}
  }
  .photo-credits{margin:22px 0 8px; text-align:left; max-width:720px;}
  .photo-credits h2{font-size:18px; color:var(--ink); margin-bottom:8px;}
  .photo-credits p{margin:0 0 10px;}
  .photo-credits .sources-details{margin-top:0;}
  .photo-credits .sources-details[open] .photo-credit-list{margin-top:12px;}
  .photo-credits ul{margin:0; padding:0; list-style:none; columns:2; column-gap:24px;}
  .photo-credits li{font-size:12px; color:var(--ink-soft); break-inside:avoid; margin:0 0 6px; line-height:1.35;}
  .photo-credits a{color:var(--maroon);}
  .photo-credits .credit-file{opacity:0.7;}
  @media (max-width:640px){
    .photo-credits ul{columns:1;}
  }

  @media (max-width:900px){
    .dish-grid, .festival-grid, .grid, .modern-list, .phrase-group-grid, .quip-grid, .region-row, .people-grid{ --rail-cols: 2; }
  }
  @media (max-width:720px){
    .header-inner{padding:10px 16px; gap:10px;}
    .brand-mark{width:42px;}
    .pallu-strip{top:56px; height:6px;}
    .nav-toggle{display:inline-flex; align-items:center;}
    nav.main-nav{
      display:none; position:absolute; left:0; right:0; top:100%;
      flex-direction:column; align-items:stretch; gap:0; flex:none;
      overflow:visible;
      border:0; border-radius:0; background:var(--cream);
      padding:8px 12px 12px; box-shadow:0 10px 20px rgba(34,26,20,0.08);
    }
    nav.main-nav.is-open{display:flex;}
    nav.main-nav a{padding:12px 14px; min-height:44px; display:flex; align-items:center;}
    /* same disclosure as desktop, so the label stays attached to its links */
    .nav-sub{display:block;}
    .nav-sub-btn{
      display:flex; width:100%; justify-content:space-between; align-items:center;
      padding:12px 14px; min-height:44px; font-size:13px;
      border:0; background:transparent; border-radius:0;
    }
    .nav-sub-list{
      display:flex; position:static; min-width:0; border:0; border-radius:0;
      padding:0 0 6px; box-shadow:none; background:transparent;
    }
    nav.main-nav .nav-sub-list a{padding-left:28px;}
    .hero{padding:48px 16px 40px;}
    .hero p.lede{font-size:16px;}
    .info-dialog-inner{padding:24px 18px;}
    .akshara-vowels{grid-template-columns:repeat(5,minmax(42px,1fr));}
    .elevation-list div{grid-template-columns:78px 1fr 52px; gap:7px;}
    section{padding:40px 16px; scroll-margin-top:72px;}
    .controls{
      padding:10px 10px; margin-left:-2px; margin-right:-2px;
    }
    .controls-inner{flex-direction:column; align-items:stretch; gap:10px;}
    .pill-row{
      flex-wrap:wrap;
    }
    .pill, .add-btn, .map-link-btn{
      min-height:40px; flex:none;
    }
    .view-toggle{width:100%;}
    .view-toggle button{min-height:40px;}
    .tour-note{align-items:flex-start; flex-direction:column; gap:10px;}
    .map-wrap{height:min(70vh, 420px);}
    .india-stat-row{grid-template-columns:1fr;}
    .tnt-row, .skip-row{grid-template-columns:1fr; gap:6px; padding:14px;}
    .tnt-arrow, .skip-arrow{display:none;}
    .tnt-label-row{display:none;}
    .tnt-card{grid-template-columns:1fr; gap:8px; align-items:start; padding:14px 16px;}
    .tnt-card:first-child{border-top:none;}
    .tnt-kicker{
      display:block; font-size:11px; font-weight:600; letter-spacing:0.04em;
      text-transform:uppercase; color:var(--maroon); margin-bottom:6px;
    }
    .dish-grid, .festival-grid, .grid, .modern-list, .phrase-group-grid, .quip-grid, .region-row, .people-grid{ --rail-cols: 1; --rail-peek: 28px; }
    .tnt-row .often, .tnt-row .also{font-size:14.5px;}
    .add-form{grid-template-columns:1fr;}
    .about-grid{grid-template-columns:1fr;}
    .sources-grid{grid-template-columns:1fr;}
    .hero-ornament.side-l, .hero-ornament.side-r{display:none;}
    .skip-col.instead{border-top:1px dashed var(--line);}
    .berunda-mark{display:none;}
    .berunda-mark-v2{display:none;}
    .elephant-mark{display:none;}
    .shalya-mark{width:110px; opacity:0.1; right:-28px;}
    .history-grid{grid-template-columns:1fr; gap:32px;}
    .areas-compare{position:static;}
    .history-side{position:static;}
    .drawer{width:100%; padding-bottom:var(--safe-bottom);}
    .lightbox{padding:16px;}
    .write-in-tabs{overflow-x:auto; -webkit-overflow-scrolling:touch;}
    .write-in-tabs button{flex:none; min-height:40px;}
  }
  /* brand + Menu + To-do stop fitting on one line on a phone */
  @media (max-width:430px){
    .brand-text .kn-cycle{font-size:15px;}
    .brand-mark{width:38px;}
    .nav-toggle{padding:8px 12px;}
    .agenda-pill{padding:6px 10px;}
    .agenda-label{display:none;}
  }