/* ============================================================
   FREENY DEMO — dedicated mobile experience
   Loaded always; scoped under .m-app so it only applies to the
   mobile shell. Desktop styles are untouched.
   ============================================================ */

.m-app{
  min-height:100dvh;
  padding-bottom:calc(76px + env(safe-area-inset-bottom));
  background:var(--page);
}
.m-app .demobar{font-size:12.5px;padding:8px 14px;line-height:1.4}

/* ---------- top bar ---------- */
.m-hdr{
  position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:10px;
  padding:10px 14px;min-height:58px;background:var(--chrome);
  backdrop-filter:saturate(160%) blur(12px);border-bottom:1px solid var(--line);
}
.m-brandmark{display:flex;flex-direction:column;line-height:1;flex:none}
.m-brandmark .wm{font-weight:800;font-size:20px;letter-spacing:-.03em}
.m-brandmark .desc{font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--accent);font-weight:700;margin-top:2px}
.m-back{width:40px;height:40px;margin-inline-start:-8px;border-radius:50%;flex:none;
  display:flex;align-items:center;justify-content:center;background:var(--surface-2)}
[dir="rtl"] .m-back svg{transform:scaleX(-1)}
.m-title{flex:1;font-size:17px;font-weight:700;letter-spacing:-.022em;margin:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.m-langbtn{min-width:44px;height:40px;border:0;border-radius:999px;flex:none;
  background:var(--surface-2);font-size:13px;font-weight:700;cursor:pointer;padding:0 12px}

/* ---------- bottom tab bar ---------- */
.m-tabs{
  position:fixed;left:0;right:0;bottom:0;z-index:45;display:flex;align-items:flex-end;
  justify-content:space-around;gap:2px;padding:8px 6px calc(8px + env(safe-area-inset-bottom));
  background:var(--chrome);backdrop-filter:blur(14px);
  border-top:1px solid var(--line);box-shadow:0 -3px 16px rgba(16,24,32,.06);
}
.m-tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;
  min-height:52px;justify-content:center;color:var(--text-muted);
  font-size:10.5px;font-weight:600;letter-spacing:-.01em;text-align:center;border-radius:12px}
.m-tab span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.m-tab.on{color:var(--text)}
.m-tab.on svg{color:var(--accent)}
.m-tab-primary{flex:0 0 auto;min-height:0;margin-top:-22px}
.m-fab{width:54px;height:54px;border-radius:50%;background:var(--primary);color:#fff;
  display:flex;align-items:center;justify-content:center;box-shadow:0 6px 18px rgba(16,24,32,.28)}
.m-tab-primary:active .m-fab{transform:scale(.94)}

/* ---------- main ---------- */
.m-main{display:block}
.m-sect{padding:22px 16px 0}
.m-page{padding:18px 16px 28px}
.m-page > h2{font-size:25px;font-weight:800;letter-spacing:-.032em;margin:0 0 12px;line-height:1.15}
.m-page > p{color:var(--text-2);font-size:16.5px;margin:0 0 18px;line-height:1.55}
.m-lead{color:var(--text-2);font-size:16px;line-height:1.55;margin:0 0 18px}
.m-sh{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 0 12px}
.m-sh h3{font-size:19px;font-weight:800;letter-spacing:-.028em;margin:0}
.m-sh a{font-size:15px;font-weight:600;color:var(--accent);flex:none}
.m-empty,.m-count{padding:16px;color:var(--text-muted);font-size:15px}
.m-count{padding:12px 16px 6px}

/* ---------- hero ---------- */
.m-hero{padding:22px 16px 24px;background:var(--surface);border-bottom:1px solid var(--line)}
.m-pill{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:600;
  color:var(--accent);background:var(--accent-soft);padding:7px 13px;border-radius:999px;margin-bottom:14px}
.m-hero h2{font-size:29px;font-weight:800;letter-spacing:-.035em;line-height:1.12;margin:0 0 12px}
.m-hero p{color:var(--text-2);font-size:16.5px;line-height:1.55;margin:0 0 18px}
.m-hstats{display:flex;gap:8px;margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.m-hstats div{flex:1;min-width:0}
.m-hstats b{display:block;font-size:19px;font-weight:800;letter-spacing:-.03em;line-height:1.2}
.m-hstats span{display:block;font-size:12px;color:var(--text-muted);margin-top:3px;line-height:1.3}

.m-reassure{display:flex;flex-direction:column;gap:9px;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--r);padding:16px}
.m-reassure span{display:flex;align-items:center;gap:9px;font-size:15px;color:var(--text-2)}
.m-reassure svg{color:var(--accent);flex:none}

/* ---------- horizontal rails ---------- */
.m-rail{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;
  padding:2px 16px 8px;margin:0 -16px;-webkit-overflow-scrolling:touch}
.m-rail::-webkit-scrollbar{display:none}
.m-railcard{flex:0 0 190px;scroll-snap-align:start;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow-1)}
.m-railimg{aspect-ratio:16/11;background:var(--inset);position:relative;
  display:flex;align-items:center;justify-content:center;padding:8px}
.m-railimg img{width:100%;height:100%;object-fit:cover;display:block}
.m-railimg .ph{font-size:12px;color:var(--text-muted)}
.m-railbadge{position:absolute;top:8px;inset-inline-start:8px;font-size:11px;padding:3px 8px}
.m-railb{padding:11px 12px 13px;display:flex;flex-direction:column;gap:5px}
.m-railb b{font-size:14.5px;font-weight:700;letter-spacing:-.02em;line-height:1.25}
.m-rprice{font-size:17px;font-weight:800;letter-spacing:-.03em}
.m-rprice i{font-size:12.5px;font-weight:500;color:var(--text-muted);font-style:normal}

/* Fixed width, not fixed height — the Google quotes run from 14 words to
   50 and a fixed card would clip the long ones. The rail scroll-snaps so
   a partial next card is always visible; that peek is what tells a thumb
   there is more to swipe. */
.m-review{flex:0 0 260px;scroll-snap-align:start;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--r);padding:16px;box-shadow:var(--shadow-1);
  margin:0;display:flex;flex-direction:column;gap:9px}
.m-review blockquote{font-size:15px;line-height:1.55;color:var(--text-2);margin:0}
.m-review .who{font-size:13px;color:var(--text-muted);margin-top:auto}

/* ---------- tier ladder ---------- */
.m-ladder{display:flex;flex-direction:column;gap:10px}
.m-rung{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  padding:16px;display:flex;flex-direction:column;gap:6px;box-shadow:var(--shadow-1)}
.m-rung.top{border-color:var(--gold-fill)}
.m-rungtop{display:flex;align-items:center;justify-content:space-between;gap:10px}
.m-rungn{font-size:12.5px;font-weight:700;color:var(--text-muted);display:flex;align-items:center;gap:7px}
.m-rung.top .m-rungn{color:var(--gold)}
.m-rungc{font-size:12.5px;font-weight:600;color:var(--accent)}
.m-rung b{font-size:19px;font-weight:800;letter-spacing:-.028em}
.m-rungp{font-size:17px;font-weight:700;letter-spacing:-.025em}
.m-rungp i{font-size:13px;font-weight:500;color:var(--text-muted);font-style:normal}
.m-rung p{margin:0;font-size:14.5px;color:var(--text-2);line-height:1.5}

/* ---------- promo ---------- */
.m-promo{display:block;position:relative;overflow:hidden;background:var(--primary);color:#fff;
  border-radius:var(--r-lg);padding:20px 18px 22px;min-height:200px;box-shadow:var(--shadow-2)}
.m-promoeyebrow{display:block;font-size:12.5px;font-weight:700;color:var(--gold-fill);margin-bottom:7px}
.m-promo b{display:block;font-size:22px;font-weight:800;letter-spacing:-.03em;margin-bottom:8px}
.m-promo p{font-size:15px;line-height:1.5;color:rgba(255,255,255,.78);margin:0 0 12px;max-width:22ch}
.m-promolink{display:inline-flex;align-items:center;gap:6px;font-size:15px;font-weight:700;color:var(--gold-fill)}
.m-promo img{position:absolute;inset-inline-end:-38px;bottom:-10px;width:190px;opacity:.9;pointer-events:none}
[dir="rtl"] .m-promo img{transform:scaleX(-1)}
[dir="rtl"] .m-promolink svg{transform:scaleX(-1)}

/* ---------- filters ---------- */
.m-filterbar{display:flex;gap:8px;overflow-x:auto;padding:12px 16px;margin:0;
  position:sticky;top:58px;z-index:30;background:var(--page);border-bottom:1px solid var(--line)}
.m-filterbar::-webkit-scrollbar{display:none}
.m-chip{flex:none;padding:10px 16px;min-height:44px;display:inline-flex;align-items:center;
  border-radius:999px;background:var(--surface);border:1.5px solid var(--line);
  font-size:14.5px;font-weight:600;color:var(--text-2)}
.m-chip.on{background:var(--primary);border-color:var(--primary);color:#fff}

/* ---------- list rows ---------- */
.m-list{display:flex;flex-direction:column;gap:1px;background:var(--line);
  border-block:1px solid var(--line)}
.m-row{display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--surface)}
.m-row:active{background:var(--surface-2)}
.m-rowimg{width:94px;height:64px;flex:none;background:var(--inset);border-radius:10px;
  display:flex;align-items:center;justify-content:center;padding:5px}
.m-rowimg img{width:100%;height:100%;object-fit:cover;display:block}
.m-rowimg .ph{font-size:12px;color:var(--text-muted)}
.m-rowb{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.m-rowtop{display:flex;align-items:center;gap:7px}
.m-rowtop b{font-size:15.5px;font-weight:700;letter-spacing:-.022em;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.m-rowspec{font-size:13px;color:var(--text-muted)}
.m-rowprice{display:flex;align-items:baseline;gap:6px}
.m-rowprice b{font-size:18px;font-weight:800;letter-spacing:-.03em}
.m-rowprice i{font-size:12.5px;color:var(--text-muted);font-style:normal}
.m-row > svg{color:var(--text-muted);flex:none}
[dir="rtl"] .m-row > svg{transform:scaleX(-1)}
.m-row .chip{align-self:flex-start}

/* ---------- vehicle detail ---------- */
.m-vhero{position:relative;aspect-ratio:16/10;background:var(--inset);
  display:flex;align-items:center;justify-content:center;padding:14px}
.m-vhero img{width:100%;height:100%;object-fit:cover;display:block}
.m-vhero .ph{color:var(--text-muted)}
.m-vbadge{position:absolute;top:12px;inset-inline-start:12px}
.m-vbody{padding:18px 16px calc(90px + env(safe-area-inset-bottom))}
.m-vbody h2{font-size:24px;font-weight:800;letter-spacing:-.032em;margin:0 0 10px}
.m-vstatus{margin-bottom:18px}
.m-specgrid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin-bottom:22px}
.m-specgrid div{background:var(--surface);padding:12px 14px}
.m-specgrid span{display:block;font-size:12.5px;color:var(--text-muted);margin-bottom:3px}
.m-specgrid b{font-size:16px;font-weight:700;letter-spacing:-.02em}
.m-plats{display:flex;flex-wrap:wrap;gap:7px}
.m-costs{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.m-costs div{display:flex;justify-content:space-between;gap:12px;padding:13px 15px;
  border-bottom:1px solid var(--line);font-size:15.5px}
.m-costs div:last-child{border-bottom:0}
.m-costs span{color:var(--text-muted)}
.m-costs b{font-weight:700}
.m-costs .tot{background:var(--surface-2)}
.m-costs .tot b{font-size:19px;letter-spacing:-.03em}

/* sticky action bar (vehicle) */
.m-actionbar{position:fixed;left:0;right:0;bottom:calc(70px + env(safe-area-inset-bottom));
  z-index:42;display:flex;align-items:center;gap:12px;padding:10px 14px;
  background:var(--chrome);backdrop-filter:blur(12px);
  border-top:1px solid var(--line);box-shadow:0 -4px 18px rgba(16,24,32,.08)}
.m-abinfo{flex:1;display:flex;align-items:baseline;gap:4px}
.m-abinfo b{font-size:21px;font-weight:800;letter-spacing:-.03em}
.m-abinfo span{font-size:13.5px;color:var(--text-muted)}
.m-actionbar .btn{flex:none;min-width:158px}

/* ---------- booking ---------- */
.m-progress{padding:14px 16px 10px;background:var(--surface);border-bottom:1px solid var(--line);
  position:sticky;top:58px;z-index:30}
.m-pbar{height:6px;background:var(--surface-2);border-radius:999px;overflow:hidden}
.m-pbar i{display:block;height:100%;background:var(--accent);border-radius:999px;transition:width .35s ease}
.m-pmeta{display:flex;justify-content:space-between;gap:12px;margin-top:8px;font-size:13.5px}
.m-pmeta span{color:var(--text-muted)}
.m-pmeta b{font-weight:700}

.m-summary{background:var(--surface);border-bottom:1px solid var(--line)}
.m-summary > summary{display:flex;align-items:center;gap:11px;padding:11px 16px;
  list-style:none;cursor:pointer;min-height:60px}
.m-summary > summary::-webkit-details-marker{display:none}
.m-summary img{width:60px;height:42px;object-fit:cover;background:var(--inset);
  border-radius:8px;padding:3px;flex:none}
.m-sumtitle{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.m-sumtitle b{font-size:14.5px;font-weight:700;letter-spacing:-.02em;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.m-sumtitle i{font-size:12.5px;color:var(--text-muted);font-style:normal}
.m-summary > summary > svg{color:var(--text-muted);flex:none;transition:transform .2s}
.m-summary[open] > summary > svg{transform:rotate(180deg)}
.m-sumbody{padding:0 16px 14px}
.m-sumbody div{display:flex;justify-content:space-between;gap:12px;padding:9px 0;
  border-top:1px solid var(--line);font-size:14.5px}
.m-sumbody span{color:var(--text-muted)}
.m-sumbody b{font-weight:700}
.m-sumbody .tot b{font-size:17px;letter-spacing:-.025em}

.m-wiz{padding:18px 16px 28px}
.m-wiz .wiz-h{margin-bottom:18px}
.m-wiz .wiz-h .sn{display:none}
.m-wiz .wiz-h h2{font-size:24px;letter-spacing:-.032em;margin-bottom:8px}
.m-wiz .wiz-h p{font-size:16px}
.m-wiz .wiz-body{padding:0;background:none;border:0;box-shadow:none}
.m-wiz .steps,.m-wiz .summary,.m-wiz .stickybar{display:none}
.m-wiz .wiz-nav{position:sticky;bottom:calc(76px + env(safe-area-inset-bottom));
  background:linear-gradient(180deg,transparent,var(--page) 35%);
  padding-top:14px;margin-top:24px;gap:10px}
.m-wiz .wiz-nav .btn{min-width:0}
.m-wiz .fleet-grid{grid-template-columns:1fr;gap:12px}
.m-wiz .row2{grid-template-columns:1fr}
.m-wiz .tablewrap{border-radius:var(--r)}
.m-wiz table{min-width:0;font-size:14.5px}
.m-wiz th,.m-wiz td{padding:11px 12px}

/* ---------- portal ---------- */
.m-pcard{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  padding:18px 16px;margin:14px 16px;box-shadow:var(--shadow-1)}
.m-pcard h3{font-size:18px;font-weight:800;letter-spacing:-.026em;margin:0 0 14px}
.m-pcard-hero{text-align:center}
.m-phimg{aspect-ratio:16/9;background:var(--inset);border-radius:var(--r-sm);
  display:flex;align-items:center;justify-content:center;padding:10px;margin-bottom:14px}
.m-phimg img{max-width:100%;max-height:100%;object-fit:contain}
.m-pcard-hero > b{display:block;font-size:20px;font-weight:800;letter-spacing:-.03em}
.m-pref{display:inline-block;font-family:var(--font-mono);font-size:13.5px;color:var(--text-2);
  background:var(--surface-2);padding:5px 13px;border-radius:999px;margin:8px 0 14px}
.m-prow{display:flex;justify-content:space-between;gap:12px;padding:11px 0;
  border-top:1px solid var(--line);font-size:15.5px;text-align:start}
.m-prow span{color:var(--text-muted)}
.m-prow b{font-weight:700;text-align:end}
.m-prow b.ok{color:var(--accent)}
.m-payrow{display:flex;justify-content:space-between;gap:12px;padding:12px 0;
  border-top:1px solid var(--line)}
.m-payrow span{display:flex;flex-direction:column;gap:2px}
.m-payrow span.r{text-align:end}
.m-payrow b{font-size:15.5px;font-weight:700}
.m-payrow i{font-size:12.5px;color:var(--text-muted);font-style:normal}
.m-payrow i.ok{color:var(--accent);font-weight:600}
.m-mlabel{font-size:14.5px;color:var(--text-muted)}
.m-mbig{font-size:30px;font-weight:800;letter-spacing:-.035em;margin:4px 0 4px}

/* ---------- earnings ---------- */
.m-calcwrap{padding:18px 16px calc(150px + env(safe-area-inset-bottom))}
.m-calcbar{position:fixed;left:0;right:0;bottom:calc(70px + env(safe-area-inset-bottom));
  z-index:42;background:var(--surface);border-top:2px solid var(--accent);
  padding:14px 16px calc(10px);box-shadow:0 -6px 24px rgba(16,24,32,.12);
  max-height:44dvh;overflow-y:auto}
.m-calcbar .calc-line{padding:8px 0;font-size:14.5px}
.m-calcbar .calc-net{margin-top:10px;padding-top:10px}
.m-calcbar .calc-net .v{font-size:30px}
.m-calcbar h3{display:none}

/* ---------- accordion ---------- */
.m-acc{display:flex;flex-direction:column;gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.m-accitem{background:var(--surface)}
.m-accitem > summary{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:15px 16px;min-height:54px;cursor:pointer;list-style:none;
  font-size:16px;font-weight:700;letter-spacing:-.022em}
.m-accitem > summary::-webkit-details-marker{display:none}
.m-accitem > summary > svg{color:var(--text-muted);flex:none;transition:transform .2s}
.m-accitem[open] > summary > svg{transform:rotate(180deg)}
.m-accbody{padding:0 16px 16px}
.m-accbody p{margin:0;font-size:15.5px;line-height:1.6;color:var(--text-2)}
.m-ticks{list-style:none;padding:0;margin:0}
.m-ticks li{position:relative;padding:9px 0 9px 28px;font-size:15px;line-height:1.5;
  color:var(--text-2);border-top:1px solid var(--line)}
[dir="rtl"] .m-ticks li{padding:9px 28px 9px 0}
.m-ticks li:first-child{border-top:0}
.m-ticks li::before{position:absolute;inset-inline-start:0;top:10px;width:19px;height:19px;
  border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:800}
.m-ticks.yes li::before{content:"✓";background:var(--ok-soft);color:var(--ok)}
.m-ticks.no li::before{content:"!";background:var(--warn-soft);color:var(--warn)}

/* ---------- fees ---------- */
.m-fees{display:flex;flex-direction:column;gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.m-fee{background:var(--surface);padding:13px 15px;display:grid;
  grid-template-columns:1fr auto;gap:3px 12px;align-items:baseline}
.m-fee b{font-size:15.5px;font-weight:700;letter-spacing:-.02em}
.m-fee .amt{font-weight:800;font-size:15.5px;text-align:end}
.m-fee i{grid-column:1/-1;font-size:13px;color:var(--text-muted);font-style:normal}

/* ---------- ops ---------- */
.m-kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.m-kpi{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:15px}
.m-kpi span{display:block;font-size:13px;color:var(--text-muted);margin-bottom:5px}
.m-kpi b{font-size:26px;font-weight:800;letter-spacing:-.035em;line-height:1}
.m-kpi i{display:block;font-size:12px;color:var(--text-muted);font-style:normal;margin-top:5px}
.m-oprow{display:flex;align-items:center;gap:11px;padding:12px 14px;background:var(--surface)}
.m-oprow .u{font-family:var(--font-mono);font-size:12.5px;color:var(--text-muted);flex:none;width:48px}
.m-oprow .n{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;
  font-size:15px;font-weight:600;letter-spacing:-.02em}
.m-oprow .n i{font-size:12.5px;color:var(--text-muted);font-weight:400;font-style:normal}

/* ---------- links / footer ---------- */
.m-links{display:flex;flex-direction:column;gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.m-links a{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:15px 16px;min-height:54px;background:var(--surface);
  font-size:16px;font-weight:600;letter-spacing:-.02em}
.m-links a svg{color:var(--text-muted)}
[dir="rtl"] .m-links a svg{transform:scaleX(-1)}
.m-foot{padding:26px 0 8px;text-align:center}
.m-foot b{display:block;font-size:18px;font-weight:800;letter-spacing:-.03em;margin-bottom:8px}
.m-foot p{font-size:15px;color:var(--text-muted);margin:0 0 14px;line-height:1.5}
.m-foot span{display:block;font-size:13px;color:var(--text-muted);margin-top:16px}

/* ---------- confirmation / blank ---------- */
.m-conf{padding:34px 16px 30px;text-align:center}
.m-conf .tick{width:76px;height:76px;border-radius:50%;background:var(--accent);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:36px;margin:0 auto 18px;
  box-shadow:var(--shadow-2)}
.m-conf h2{font-size:27px;font-weight:800;letter-spacing:-.035em;margin:0 0 10px}
.m-conf .ref{display:inline-block;font-family:var(--font-mono);font-size:16px;
  background:var(--surface-2);padding:8px 18px;border-radius:999px;color:var(--text-2)}
.m-conf .m-pcard{margin-inline:0}
.m-blank{padding:60px 20px;text-align:center}
.m-blank h2{font-size:22px;font-weight:800;letter-spacing:-.03em;margin:0 0 10px}
.m-blank p{color:var(--text-muted);font-size:16px;margin:0 0 20px}

/* ---------- language sheet ---------- */
.m-sheet{position:fixed;inset:0;z-index:90}
.m-sheet[hidden]{display:none}
.m-sheet-scrim{position:absolute;inset:0;background:rgba(12,18,24,.45)}
.m-sheet-panel{position:absolute;left:0;right:0;bottom:0;background:var(--surface);
  border-radius:20px 20px 0 0;padding:10px 16px calc(24px + env(safe-area-inset-bottom));
  animation:sheetup .26s cubic-bezier(.2,.8,.3,1) both}
@keyframes sheetup{from{transform:translateY(100%)}to{transform:none}}
.m-sheet-grip{width:40px;height:4px;border-radius:999px;background:var(--line-2);margin:0 auto 14px}
.m-sheet-panel h3{font-size:18px;font-weight:800;letter-spacing:-.026em;margin:0 0 12px}
.m-langrow{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;
  min-height:52px;padding:13px 14px;border:0;background:none;border-radius:12px;
  font-size:17px;font-weight:600;cursor:pointer;text-align:start;color:var(--text)}
.m-langrow:active{background:var(--surface-2)}
.m-langrow.on{background:var(--accent-soft);color:var(--accent)}

/* ---------- RTL ---------- */
[dir="rtl"] body{text-align:right}
[dir="rtl"] .m-rail{padding-inline:16px}
[dir="rtl"] .m-tab-primary{margin-top:-22px}
[dir="rtl"] .calc-line,[dir="rtl"] .m-prow,[dir="rtl"] .m-costs div{flex-direction:row}
[dir="rtl"] .chip svg{transform:scaleX(-1)}
[dir="rtl"] .m-accitem > summary > svg,
[dir="rtl"] .m-summary > summary > svg{transform:none}
[dir="rtl"] .m-accitem[open] > summary > svg,
[dir="rtl"] .m-summary[open] > summary > svg{transform:rotate(180deg)}

/* the agreement on a phone: no sticky index, and the tables scroll */
.ag-mobile .ag-cols{grid-template-columns:1fr}
.ag-mobile .ag-art h3{font-size:20px}
.ag-mobile .ag-sum p{font-size:15.5px}
.ag-mobile .tablewrap{overflow-x:auto}

/* theme lives in the language sheet on a phone — full-width rows clear the
   44px tap minimum, which three icon buttons in a 58px header would not */