:root{
  --bg:#f8faff;
  --fg:#1f2d3d;
  --card:#ffffff;
  --muted:#667085;
  --primary:#2563eb;
  --primary-hover:#1d4ed8;
  --border:#e4eaf4;
  --shadow-sm:0 2px 10px rgba(15, 23, 42, 0.04);
  --shadow-md:0 8px 24px rgba(15, 23, 42, 0.06);
  --ok-bg:#f3fbf5;
  --ok-bd:#cfead6;
  --warn-bg:#fff8e8;
  --warn-bd:#f0dca2;

  /* ── App-shell (sidebar layout) tokens ─────────────────────── */
  --surface:#fff;
  --text:#0f172a;
  --text-soft:#334155;
  --accent:#3b82f6;
  --accent-strong:#2563eb;
  --success:#10b981;
  --danger:#ef4444;
  --sb-bg:#ffffff;
  --sb-strong:#0f172a;
  --sb-item:#64748b;
  --sb-item-hover:#2563eb;
  --sb-w:256px;
  --sb-w-mini:72px;
  --topbar-h:60px;
  --radius:12px;
  --radius-sm:8px;
  --shadow:0 1px 3px rgba(15,23,42,.06), 0 8px 24px rgba(15,23,42,.06);
}

*{ box-sizing:border-box; }

body{
  font-family: Arial, sans-serif;
  margin:0;
  padding:0;
  background:linear-gradient(180deg, #f6f9ff 0%, #fbfcff 220px, #f9fbff 100%);
  color:var(--fg);
}

.container{
  max-width:1200px;
  margin:0 auto;
  padding:0;
}

h1{
  text-align:center;
  color:var(--fg);
  font-size:30px;
  margin:24px 0 28px;
  letter-spacing:.2px;
}

.program-card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:16px;
  padding:28px 24px;
  box-shadow:var(--shadow-md);
  margin-bottom:22px;
  text-align:center;
  transition:transform .15s ease, box-shadow .2s ease, border-color .2s ease;
}

.program-card:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 28px rgba(15, 23, 42, 0.08);
  border-color:#d8e3f5;
}

.program-card h2{
  margin:0 0 12px;
  font-size:24px;
  line-height:1.3;
  color:var(--fg);
}

.program-card p{
  font-size:18px;
  color:var(--muted);
  margin:8px 0;
}

.program-card .price{
  font-size:28px;
  font-weight:750;
  margin:14px 0;
  color:var(--primary);
}

.program-card select{
  margin:12px auto 6px;
  padding:10px 12px;
  font-size:16px;
  border-radius:10px;
  border:1px solid #cfd8e6;
  background:#fff;
  color:var(--fg);
  min-width:220px;
}

.program-card .muted{
  color:var(--muted);
  font-size:14px;
  margin-top:4px;
}

.btn-row{
  display:flex;
  gap:12px;
  justify-content:center;
  flex-wrap:wrap;
  margin-top:16px;
}

.btn{
  display:inline-block;
  padding:11px 18px;
  font-size:16px;
  line-height:1;
  border-radius:10px;
  border:1px solid transparent;
  cursor:pointer;
  text-decoration:none;
  transition:transform .06s ease, background .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.btn:active{ transform: translateY(1px); }
.btn:focus-visible{ outline:2px solid #000; outline-offset:2px; }

.btn--primary{
  background:var(--primary);
  color:#fff;
  border-color:var(--primary);
  box-shadow:0 4px 12px rgba(37, 99, 235, 0.18);
}

.btn--primary:hover{
  background:var(--primary-hover);
  border-color:var(--primary-hover);
}

.btn--secondary{
  background:#fff;
  color:var(--primary);
  border-color:#bfd3ff;
}

.btn--secondary:hover{
  background:#f4f8ff;
  border-color:#9fc0ff;
}

/* Top bar */
.topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:16px;
}

.brand{ font-weight:700; color:#222; letter-spacing:.2px; }
.brand-link{ color:inherit; text-decoration:none; }

.auth{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.hello{
  color:#444;
  font-size:14px;
  max-width:360px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* Auth modal */
.modal-backdrop{
  position:fixed; inset:0;
  background:rgba(0,0,0,.45);
  display:none;
  align-items:center;
  justify-content:center;
  padding:20px;
  z-index:9999;
}
.modal{
  width:min(520px, 100%);
  background:#fff;
  border-radius:12px;
  box-shadow:0 10px 30px rgba(0,0,0,.25);
  overflow:hidden;
}
.modal-header{
  padding:16px 18px;
  border-bottom:1px solid #eee;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.modal-title{ font-size:18px; font-weight:700; margin:0; }
.modal-close{
  background:transparent;
  border:0;
  font-size:22px;
  cursor:pointer;
  line-height:1;
  padding:4px 8px;
}
.modal-body{ padding:18px; color:#333; }
.modal-body p{ margin:0 0 12px; color:#555; }
.modal-actions{ display:flex; gap:12px; flex-wrap:wrap; margin-top:10px; }
.modal-actions .btn{ flex:1; text-align:center; }
.modal-note{ margin-top:10px; font-size:13px; color:#777; }

/* prevent page scroll when modal open */
body.modal-open { overflow: hidden; touch-action: none; }

/* mobile-friendly modal sizing */
.modal-backdrop .modal{
  width: min(520px, calc(100vw - 24px));
  max-height: calc(100vh - 24px);
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/* better tap targets on mobile */
.modal-backdrop .btn{ min-height:44px; }
.modal-backdrop .modal-close{ min-width:44px; min-height:44px; }

/* На узких экранах кнопки модалки (Continue / Pay from balance / Cancel)
   идут одна под другой на всю ширину, а не жмутся в один ряд. */
@media(max-width:700px){
  .modal-actions{ flex-direction:column; }
  .modal-actions .btn{ width:100%; }
}

/* Auth pages (login/register) */
.auth-card{
  max-width:520px;
  margin:40px auto 0;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:14px;
  box-shadow:var(--shadow-md);
  padding:20px;
  text-align:left;
}

.auth-card h1{
  margin:0 0 10px;
  font-size:28px;
  text-align:center;
}

.auth-row{ margin:12px 0; }

.auth-row label{
  display:block;
  font-size:14px;
  margin-bottom:6px;
  color:var(--fg);
}

.auth-row input{
  width:100%;
  padding:10px 12px;
  border:1px solid #ccc;
  border-radius:8px;
  font-size:16px;
}

.auth-hint{
  font-size:13px;
  color:var(--muted);
  margin-top:10px;
  line-height:1.35;
}

.auth-hint a{ color:var(--primary); }
.auth-hint a:hover{ text-decoration:underline; }

.auth-error{
  background:#fff3f3;
  border:1px solid #ffd0d0;
  color:#a40000;
  padding:10px 12px;
  border-radius:10px;
  margin:12px 0;
}

.auth-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:14px;
}

.auth-actions .btn{
  flex:1;
  text-align:center;
}

.storefront-intro{
  display:grid;
  grid-template-columns: 2fr 1fr;
  gap:18px;
  margin:0 0 24px;
  align-items:stretch;
}

.storefront-intro__main,
.storefront-intro__side{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:16px;
  box-shadow:var(--shadow-md);
  padding:22px 22px;
}

.storefront-intro__main h2{
  margin:0 0 12px;
  font-size:24px;
  color:var(--fg);
}

.storefront-intro__main p{
  margin:10px 0;
  color:var(--muted);
  font-size:16px;
  line-height:1.65;
}

.storefront-intro__side{
  display:flex;
  flex-direction:column;
  gap:12px;
  justify-content:center;
}

.storefront-badge{
  background:#f8fbff;
  border:1px solid #d9e7ff;
  border-radius:12px;
  padding:12px 14px;
  color:#334155;
  font-size:14px;
  line-height:1.5;
}

.storefront-note{
  margin:0 0 24px;
  background:#fffaf0;
  border:1px solid #f3dfb5;
  border-radius:14px;
  padding:16px 18px;
  color:#6b5a2b;
  font-size:14px;
  line-height:1.65;
  box-shadow:var(--shadow-sm);
}

.storefront-note a{
  color:var(--primary);
  text-decoration:none;
}

.storefront-note a:hover{
  text-decoration:underline;
}

.program-card .card-note{
  margin-top:10px;
  font-size:14px;
  line-height:1.55;
  color:var(--muted);
}

@media (max-width:900px){
  .storefront-intro{
    grid-template-columns: 1fr;
  }
}

/* ── Footer ─────────────────────────────────────────────────── */
.site-footer{
  margin-top:40px;
  border-top:1px solid var(--border);
  background:var(--bg);
}
.site-footer__inner{
  max-width:1100px;
  margin:0 auto;
  padding:18px 24px 26px;
}
.site-footer__top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  flex-wrap:wrap;
  margin-bottom:12px;
}
.site-footer__brand{ color:var(--fg); font-size:14px; }
.site-footer__brand strong{ font-weight:600; }
.site-footer__links{ display:flex; flex-wrap:wrap; gap:10px 12px; }
.site-footer__links a{
  display:inline-block;
  text-decoration:none;
  color:var(--primary);
  font-size:14px;
  padding:6px 10px;
  border:1px solid var(--border);
  border-radius:8px;
  background:var(--card);
  transition:.2s ease;
}
.site-footer__links a:hover{
  background:#f0f6ff;
  border-color:#bcd4ff;
  color:#0056b3;
}
.site-footer__note a{ color:var(--primary); text-decoration:none; }
.site-footer__note a:hover{ text-decoration:underline; }
.site-footer__bottom{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  flex-wrap:wrap;
  border-top:1px solid var(--border);
  padding-top:12px;
}
.site-footer__note{ color:var(--muted); font-size:13px; line-height:1.6; max-width:760px; }
.site-footer__copy{ color:var(--muted); font-size:13px; white-space:nowrap; }

@media(max-width:700px){
  .site-footer__top,
  .site-footer__bottom{ flex-direction:column; align-items:flex-start; }
  .site-footer__copy{ white-space:normal; }
}

/* ── Account page ────────────────────────────────────────────── */
.account-grid{ display:grid; grid-template-columns:1fr; gap:16px; margin-top:14px; }

.account-tabs{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:14px;
  border-bottom:1px solid var(--border);
}
.account-tab{
  appearance:none;
  border:1px solid transparent;
  background:transparent;
  cursor:pointer;
  white-space:nowrap;
  padding:10px 14px;
  font-size:14px;
  font-weight:700;
  color:var(--muted);
  border-radius:10px 10px 0 0;
  margin-bottom:-1px;
}
.account-tab:hover{ color:var(--fg); }
.account-tab.is-active{
  color:var(--primary);
  background:var(--card);
  border-color:var(--border);
  border-bottom-color:var(--card);
}

@media(max-width:700px){
  .account-tabs{
    border-bottom:0;
    gap:8px;
  }
  .account-tab{
    flex:1 1 calc(50% - 4px);
    text-align:center;
    white-space:normal;
    border-radius:10px;
    border-color:var(--border);
    background:var(--card);
    margin-bottom:0;
  }
  .account-tab.is-active{
    border-color:var(--primary);
  }
}
.account-tabpanel{ display:none; }
.account-tabpanel.is-active{ display:block; }
.account-tabpanel .account-grid{ margin-top:16px; }

.history-filter{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:10px 0 4px; }
.history-filter label{ font-size:13px; color:var(--muted); }
.history-filter select{
  padding:8px 10px;
  border:1px solid var(--border);
  border-radius:8px;
  background:var(--card);
  color:var(--fg);
  font-size:14px;
  max-width:100%;
}

.card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:12px;
  box-shadow:0 6px 18px rgba(0,0,0,.05);
  padding:16px;
}
.kv{ display:grid; grid-template-columns:180px 1fr; gap:8px 12px; margin-top:10px; }
.kv .k{ color:var(--muted); font-size:14px; }
.kv .v{ font-weight:600; }

.order{ border-top:1px solid var(--border); padding-top:12px; margin-top:12px; }
.order:first-child{ border-top:0; padding-top:0; margin-top:0; }
.order-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; flex-wrap:wrap; }

.badge{
  display:inline-block;
  font-size:12px;
  padding:4px 8px;
  border-radius:999px;
  border:1px solid var(--border);
  background:var(--card);
  color:var(--fg);
}
.items{ margin-top:10px; }
.item{ padding:8px 0; border-bottom:1px dashed var(--border); }
.item:last-child{ border-bottom:0; }

.pager{ display:flex; gap:10px; justify-content:center; margin-top:14px; flex-wrap:wrap; }
.pager .btn{ min-width:120px; text-align:center; }
.btn-small{ padding:6px 10px; font-size:13px; border-radius:8px; }

.edit-box{ border:1px solid var(--border); border-radius:12px; padding:14px; background:var(--bg); }
.edit-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; }
.edit-title{ font-weight:800; }

.vin-check-card{ display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }
.vin-check-title{ font-weight:800; font-size:18px; margin-bottom:4px; }
.vin-check-desc{ color:var(--muted); font-size:14px; line-height:1.45; }
.vin-check-stats{ display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; }
.vin-check-stat{
  display:inline-block;
  padding:6px 9px;
  border:1px solid var(--border);
  border-radius:999px;
  background:var(--bg);
  font-size:13px;
}
.vin-check-count{ font-weight:800; color:var(--primary); }
.seed-account-plans{ margin-top:12px; padding:10px 12px; border:1px solid var(--border); border-radius:10px; background:var(--bg); }
.seed-account-plans__title{ color:var(--muted); font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.3px; margin-bottom:8px; }
.seed-account-plan-list{ display:grid; gap:7px; }
.seed-account-plan{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px 10px; border:1px solid var(--border); border-radius:8px; background:var(--card); }
.seed-account-plan__limit{ color:var(--fg); font-size:13px; font-weight:800; }
.seed-account-plan__until{ color:var(--muted); font-size:13px; text-align:right; }
.seed-account-plans__note{ margin-top:8px; color:var(--muted); font-size:12px; line-height:1.4; }

/* Wallet card (account page) */
.wallet-topup-form{ display:flex; flex-direction:column; gap:12px; max-width:360px; }
.wallet-field label{ display:block; font-size:13px; color:var(--muted); margin-bottom:6px; }
.wallet-topup-form input{
  width:100%;
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:8px;
  font-size:16px; /* избегаем авто-зума на iOS при фокусе */
  background:var(--card);
  color:var(--fg);
  box-sizing:border-box;
}
.wallet-topup-form .btn{ width:100%; }

.wallet-hint{ font-size:13px; color:var(--muted); margin:8px 0 16px; }

.wallet-history{ display:flex; flex-direction:column; gap:10px; margin-top:4px; }
.wallet-history-row{ border:1px solid var(--border); border-radius:10px; padding:10px 12px; }
.wallet-history-row__top{ display:flex; justify-content:space-between; align-items:baseline; gap:8px; flex-wrap:wrap; }
.wallet-history-row__type{ font-weight:700; }
.wallet-history-row__amount{ font-weight:800; white-space:nowrap; }
.wallet-history-row__amount.is-positive{ color:#059669; }
.wallet-history-row__amount.is-negative{ color:#dc2626; }
.wallet-history-row__meta{ display:flex; justify-content:space-between; gap:8px; margin-top:4px; font-size:12px; color:var(--muted); flex-wrap:wrap; }
.wallet-history-row__note{ margin-top:6px; font-size:13px; color:var(--fg); word-break:break-word; }

@media(min-width:560px){
  .wallet-topup-form{ flex-direction:row; align-items:flex-end; max-width:none; }
  .wallet-topup-form .wallet-field{ flex:1; max-width:220px; }
  .wallet-topup-form .btn{ width:auto; padding:10px 20px; }
}

/* Key/creds row base */
.key-row{ margin-top:6px; font-size:13px; }
.offline-creds{ font-size:13px; }

@media(max-width:700px){
  /* Profile grid: stack label above value */
  .kv{
    grid-template-columns:1fr;
    gap:3px 0;
  }
  .kv .k{ margin-top:10px; font-size:13px; }
  .kv .k:first-child{ margin-top:0; }

  /* Long monospace content (keys, VINs) wraps instead of overflowing */
  .badge{
    word-break:break-all;
    white-space:normal;
    max-width:100%;
    display:inline-block;
  }

  /* Key/credentials row: wrap buttons below badge */
  .key-row,
  .offline-creds{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
    margin-top:8px;
  }
  .key-row .btn,
  .offline-creds .btn{
    margin-left:0 !important;
  }
  .key-row .badge,
  .offline-creds .badge{
    flex-shrink:1;
    min-width:0;
  }

  /* Vin-check card stacks vertically */
  .vin-check-card{ flex-direction:column; align-items:flex-start; }
  .seed-account-card > div:first-child{ width:100%; }
  .seed-account-plan{ align-items:flex-start; flex-direction:column; gap:3px; }
  .seed-account-plan__until{ text-align:left; }

  /* Order head: tighter on mobile */
  .order-head{ gap:8px; }
}

/* ── Success page ────────────────────────────────────────────── */
#dynamic-links{ display:flex; justify-content:center; flex-wrap:wrap; gap:10px; }
#dynamic-links .btn{ margin:0 !important; }
.order-loading{ padding:8px 0 4px; }
.order-spinner{
  width:36px; height:36px;
  border:3px solid var(--border);
  border-top-color:var(--primary);
  border-radius:50%;
  animation:mb-spin .8s linear infinite;
  margin:0 auto 12px;
}
@keyframes mb-spin{ to{ transform:rotate(360deg); } }
.order-loading-text{ margin:0 0 4px; font-weight:600; color:var(--fg); }
.order-loading-hint{ margin:0; font-size:13px; color:var(--muted); }

/* ── Home page ───────────────────────────────────────────────── */
.home-hero{ text-align:center; padding:8px 0 24px; }
.home-hero h1{ font-size:32px; font-weight:800; margin:0 0 12px; line-height:1.25; letter-spacing:-.2px; }
.hero-sub{ font-size:16px; color:var(--muted); max-width:600px; margin:0 auto 18px; line-height:1.65; }
.hero-badges{ display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }
.hero-badge{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:999px;
  padding:6px 16px;
  font-size:13px;
  color:var(--fg);
  box-shadow:var(--shadow-sm);
}
.section-head{
  font-size:11px; font-weight:800; text-transform:uppercase;
  letter-spacing:1.2px; color:var(--muted);
  margin:28px 0 14px; padding-bottom:8px; border-bottom:1px solid var(--border);
}
.product-grid{ display:grid; grid-template-columns:1fr; gap:18px; margin-bottom:4px; }
.product-grid--diagnostic{ gap:16px; }
/* Adaptive column count (set per section in index.php from the visible-card count):
   pg-1 = lone card at a natural width, pg-2 = two per row, pg-3 = three per row. */
.program-card{ text-align:left; display:flex; flex-direction:column; }
.card-tag{
  display:inline-block; font-size:11px; font-weight:700;
  text-transform:uppercase; letter-spacing:.7px;
  padding:3px 9px; border-radius:6px;
  background:#eef3ff; color:var(--primary);
  margin-bottom:10px; width:fit-content;
}
.card-tag.ct-green{ background:#ecfdf5; color:#059669; }
.card-tag.ct-amber{ background:#fffbeb; color:#b45309; }
.card-tag.ct-purple{ background:#f5f3ff; color:#7c3aed; }
.card-desc{ font-size:14px; color:var(--muted); line-height:1.6; margin:0 0 12px; flex:1; }
.program-card p.card-desc{ font-size:14px; }
.card-price-row{ display:flex; align-items:baseline; gap:10px; margin:0 0 12px; }
.price-note{ font-size:13px; color:var(--muted); }
.program-card .price{ margin:0; }
.product-grid .program-card .btn-row{ margin-top:auto; padding-top:10px; }

@media(min-width:701px){
  .product-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .product-grid.pg-1{ grid-template-columns:minmax(0,460px); }
  .product-grid.pg-2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .product-grid.pg-3{ grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media(min-width:701px) and (max-width:1050px){
  .product-grid.pg-3{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}

/* ── Product doc pages — common base ────────────────────────── */

:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc){ color:var(--fg); }
:is(.seedkey-doc){ color:var(--fg); }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .container{ max-width:1100px; margin:0 auto; }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .hero{ padding:8px 0 6px; }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .hero h1{ margin:0 0 6px; font-size:32px; }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .hero p{ margin:0; color:var(--muted); }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .card{
  background:var(--card); border:1px solid var(--border); border-radius:10px;
  padding:20px; box-shadow:var(--shadow-sm); margin:18px 0;
}
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) h2{ margin:0 0 10px; font-size:22px; }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) h3{ margin:0 0 8px; font-size:18px; }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) p,
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) li{ color:var(--fg); line-height:1.65; }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .muted{ color:var(--muted); }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .small{ font-size:13px; color:var(--muted); }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .space{ height:8px; }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .btn-row{ display:flex; gap:12px; flex-wrap:wrap; }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .btn{
  display:inline-block; padding:10px 16px; font-size:16px; line-height:1; border-radius:8px;
  border:1px solid transparent; text-decoration:none; cursor:pointer;
  transition:.2s background,.2s border-color,.06s transform; user-select:none;
}
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .btn:active{ transform:translateY(1px); }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .btn--primary{ background:var(--primary); color:#fff; border-color:var(--primary); }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .btn--primary:hover{ background:var(--primary-hover); border-color:var(--primary-hover); }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .btn--secondary{ background:var(--card); color:var(--primary); border-color:var(--primary); }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .btn--secondary:hover{ background:var(--bg); }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .btn[disabled]{ opacity:.6; cursor:not-allowed; pointer-events:none; }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .cols{ display:grid; grid-template-columns:1fr; gap:16px; }
@media(min-width:900px){
  :is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .cols{ grid-template-columns:2fr 1fr; }
}
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .steps{ counter-reset:step; display:grid; gap:14px; }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .step{
  border:1px dashed var(--border); border-radius:10px;
  padding:14px 14px 14px 54px; position:relative; background:var(--card);
}
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .step::before{
  counter-increment:step; content:counter(step);
  position:absolute; left:12px; top:12px;
  width:28px; height:28px; border-radius:50%;
  display:grid; place-items:center;
  background:var(--primary); color:#fff; font-weight:700;
}
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .step h3{ margin:0 0 6px; font-size:18px; }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .kbd{
  display:inline-block; padding:2px 6px;
  border:1px solid var(--border); border-bottom-width:2px;
  border-radius:4px; background:var(--card); font-family:monospace;
}
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .gallery{ display:grid; gap:12px; grid-template-columns:repeat(2,1fr); }
@media(min-width:900px){
  :is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) .gallery{ grid-template-columns:repeat(3,1fr); }
}
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) figure{
  margin:0; border:1px solid var(--border); border-radius:10px;
  overflow:hidden; background:var(--card); box-shadow:var(--shadow-sm);
}
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) figure img{ display:block; width:100%; height:auto; cursor:zoom-in; }
/* EZS screenshots come from mixed sources (app windows, a photographed
   connector label) with very different native aspect ratios — box them into
   a common ratio so the grid reads as one set instead of jagged rows. */
.ezs-doc .gallery figure img{ aspect-ratio:4/3; object-fit:contain; background:var(--bg); }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) figcaption{
  padding:8px 10px; font-size:14px; color:var(--fg);
  border-top:1px solid var(--border); background:var(--bg);
}
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) details{
  border:1px solid var(--border); border-radius:10px; padding:12px 14px; background:var(--card);
}
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) details+details{ margin-top:10px; }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) summary{ cursor:pointer; font-weight:600; }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) a:not(.btn){ color:var(--primary); }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) a:not(.btn):hover{ color:var(--primary-hover); text-decoration:underline; }
:is(.amg-menu-doc,.fullfix-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc,.legal-doc) select{
  background:var(--card); color:var(--fg); border-color:var(--border);
}

/* Lightbox — shared (not fullfix). z-index must clear .sidebar (1100) and
   .sidebar-backdrop (1050) — both are position:fixed and were painting over
   the enlarged image. */
:is(.amg-menu-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc) .lightbox{
  position:fixed; inset:0; display:none;
  align-items:center; justify-content:center;
  background:rgba(0,0,0,.85); z-index:1200;
}
:is(.amg-menu-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc) .lightbox.is-open{ display:flex; }
:is(.amg-menu-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc) .lightbox__inner{ position:relative; max-width:96vw; max-height:94vh; }
:is(.amg-menu-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc) .lightbox__img{
  display:block; max-width:96vw; max-height:86vh; border-radius:10px; box-shadow:0 6px 20px rgba(0,0,0,.4);
}
:is(.amg-menu-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc) .lightbox__caption{
  color:#fff; text-align:center; margin-top:8px; font-size:14px; opacity:.9;
}
:is(.amg-menu-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc) .lightbox__close,
:is(.amg-menu-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc) .lightbox__prev,
:is(.amg-menu-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc) .lightbox__next{
  position:absolute; top:50%; transform:translateY(-50%);
  width:30px; height:30px; border-radius:50%; display:grid; place-items:center;
  background:rgba(255,255,255,.12); color:#fff; border:1px solid rgba(255,255,255,.3);
  backdrop-filter:blur(6px); cursor:pointer; user-select:none;
}
:is(.amg-menu-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc) .lightbox__close{ top:-16px; right:-16px; transform:none; }
:is(.amg-menu-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc) .lightbox__prev{ left:-56px; }
:is(.amg-menu-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc) .lightbox__next{ right:-56px; }
@media(max-width:700px){
  :is(.amg-menu-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc) .lightbox__prev{ left:8px; }
  :is(.amg-menu-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc) .lightbox__next{ right:8px; }
  :is(.amg-menu-doc,.mbsoft-doc,.navpin-doc,.navcheck-doc,.offline-doc,.star3-doc,.ezs-doc,.truck-doc) .lightbox__close{ right:8px; top:8px; }
}

/* ── Legal pages ─────────────────────────────────────────────── */
.legal-doc ul{ padding-left:20px; }
.legal-doc .toc{ display:grid; gap:10px; }
.legal-doc .toc a{
  display:block; padding:10px 12px;
  border:1px solid var(--border); border-radius:8px;
  text-decoration:none; color:var(--fg); background:var(--card);
}
.legal-doc .toc a:hover{ background:var(--bg); border-color:var(--primary); }
.legal-doc .note{
  border-left:4px solid var(--primary); background:var(--bg);
  padding:12px 14px; border-radius:8px;
}
.legal-doc .meta-list{ list-style:none; padding:0; margin:0; }
.legal-doc .meta-list li{ padding:6px 0; border-bottom:1px solid var(--border); }
.legal-doc .meta-list li:last-child{ border-bottom:none; }
.legal-doc .policy-box{ border-radius:10px; padding:14px 16px; margin-top:12px; }
.legal-doc .policy-box--ok{ background:var(--ok-bg); border:1px solid var(--ok-bd); color:#0b5d2a; }
.legal-doc .policy-box--warn{ background:var(--warn-bg); border:1px solid var(--warn-bd); color:#6b5500; }
.legal-doc table{ width:100%; border-collapse:collapse; margin-top:12px; }
.legal-doc th,
.legal-doc td{ padding:10px 12px; border:1px solid var(--border); text-align:left; vertical-align:top; }
.legal-doc th{ background:var(--bg); font-weight:700; }
.legal-doc .contact-grid{ display:grid; grid-template-columns:1fr; gap:16px; }
@media(min-width:800px){ .legal-doc .contact-grid{ grid-template-columns:1fr 1fr; } }
.legal-doc a:not(.btn){ color:var(--primary); }
.legal-doc a:not(.btn):hover{ color:var(--primary-hover); text-decoration:underline; }

[data-theme="dark"] .legal-doc .policy-box--ok{ color:#34d399; }
[data-theme="dark"] .legal-doc .policy-box--warn{ color:#d4a845; }

/* ── AMG page ────────────────────────────────────────────────── */
.amg-menu-doc .price-table{ width:100%; border-collapse:collapse; margin-top:10px; }
.amg-menu-doc .price-table th,
.amg-menu-doc .price-table td{ border:1px solid var(--border); padding:10px 12px; text-align:left; vertical-align:top; }
.amg-menu-doc .price-table th{ background:var(--bg); }
.amg-menu-doc .note-box{ border-radius:10px; padding:14px 16px; margin-top:12px; }
.amg-menu-doc .note-box--warn{ background:#fff8e8; border:1px solid #f0dca2; color:#6b5500; }
.amg-menu-doc .note-box--ok{ background:#f3fbf5; border:1px solid #cfead6; color:#0b5d2a; }

.amg-pay-box{ margin-top:14px; padding-top:14px; border-top:1px solid var(--border); }
.amg-pay-box__label{ display:block; font-size:14px; font-weight:600; margin-bottom:8px; color:var(--fg); }
.amg-pay-box__select{
  width:100%; padding:10px 12px; border:1px solid var(--border);
  border-radius:8px; background:var(--card); color:var(--fg); font-size:15px;
}
.amg-pay-box__price-row{
  margin-top:12px; display:flex; justify-content:space-between; align-items:center;
  gap:12px; padding:10px 12px; border:1px solid var(--border); border-radius:8px; background:var(--bg);
}
.amg-pay-box__btn{ width:100%; margin-top:12px; }

/* ── Navigation PIN page ─────────────────────────────────────── */
.nav-check-inline{
  margin:10px 0 14px; padding:9px 10px;
  border-left:3px solid var(--primary); background:var(--bg);
  border-radius:6px; font-size:13px; line-height:1.4; color:var(--fg);
}
.nav-check-inline a{ font-weight:600; color:var(--primary); text-decoration:none; }
.nav-check-inline a:hover{ text-decoration:underline; }
.nav-pay-box{ margin-top:14px; padding-top:14px; border-top:1px solid var(--border); }
.nav-pay-box__label{ display:block; font-size:14px; font-weight:600; margin-bottom:8px; color:var(--fg); }
.nav-pay-box__select{
  width:100%; padding:10px 12px; border:1px solid var(--border);
  border-radius:8px; background:var(--card); color:var(--fg); font-size:15px; margin-bottom:12px;
}
.nav-pay-box__price-row{
  margin-top:4px; display:flex; justify-content:space-between; align-items:center;
  gap:12px; padding:10px 12px; border:1px solid var(--border); border-radius:8px; background:var(--bg);
}
.nav-pay-box__btn{ width:100%; margin-top:12px; }
.nav-pay-box__btn[disabled]{ opacity:.6; cursor:not-allowed; pointer-events:none; }
.nav-pay-box__input{
  width:100%; padding:10px 12px; border:1px solid var(--border);
  border-radius:8px; background:var(--card); color:var(--fg); font-size:15px;
  margin-bottom:12px; text-transform:uppercase;
}
.nav-pay-box__input.is-invalid{ border-color:#c62828; box-shadow:0 0 0 2px rgba(198,40,40,.08); }
.nav-pay-box__input.is-valid{ border-color:#2e7d32; box-shadow:0 0 0 2px rgba(46,125,50,.08); }
.nav-pay-box__hint--error{ color:#c62828; }
.nav-pay-box__hint--ok{ color:#2e7d32; }

/* ── VIN check / data card page ──────────────────────────────── */
.vin-history{ display:grid; gap:8px; margin-top:10px; }
.vin-history__item{ padding:8px 10px; border:1px solid var(--border); border-radius:8px; background:var(--bg); }
.vin-history__vin{ font-family:monospace; font-weight:700; color:var(--fg); }
.vin-history__date{ margin-top:3px; font-size:12px; color:var(--muted); }
.vin-history__btn{ border:0; padding:0; margin:0; background:transparent; cursor:pointer; text-align:left; color:var(--fg); }
.vin-history__btn:hover{ color:var(--primary); text-decoration:underline; }

.navcheck-search{ display:flex; gap:10px; flex-wrap:wrap; margin-top:14px; }
.navcheck-search input{
  flex:1 1 280px; padding:12px 14px; border:1px solid var(--border);
  border-radius:8px; background:var(--card); color:var(--fg); font-size:16px; text-transform:uppercase;
}
.navcheck-search input.is-invalid{ border-color:#c62828; box-shadow:0 0 0 3px rgba(198,40,40,.12); }
.navcheck-message{
  margin-top:12px; padding:10px 12px; border-radius:10px;
  border:1px solid #f1c40f; background:#fff8e1; color:#6b5500;
  font-size:14px; line-height:1.35; display:none;
}
.navcheck-message.ok{ border-color:#2ecc71; background:#ecfff3; color:#0b5d2a; }
.navcheck-message.err{ border-color:#e74c3c; background:#fff1f0; color:#7a0b00; }
.navcheck-message.info{ border-color:#6aa9ff; background:#eef6ff; color:#174a7a; }
.navcheck-grid{ display:grid; grid-template-columns:170px 1fr; gap:10px 12px; margin-top:12px; }
.navcheck-grid label{ font-weight:600; color:var(--fg); align-self:center; }
.navcheck-grid input{ width:100%; padding:9px 10px; border:1px solid var(--border); border-radius:7px; background:var(--bg); color:var(--fg); }
@media(max-width:600px){ .navcheck-grid{ grid-template-columns:1fr; } }
.navcheck-status{ margin-top:14px; padding:12px 14px; border-radius:10px; border:1px solid var(--border); background:var(--bg); }
.navcheck-status.good{ border-color:#2ecc71; background:#ecfff3; color:#0b5d2a; }
.navcheck-status.warn{ border-color:#f1c40f; background:#fff8e1; color:#6b5500; }
.navcheck-status.bad{ border-color:#e74c3c; background:#fff1f0; color:#7a0b00; }
.navcheck-status__line+.navcheck-status__line{ margin-top:8px; }
.navcheck-status__line--important{ padding:9px 10px; border:1px solid #e74c3c; border-radius:8px; background:#fff1f0; color:#7a0b00; font-weight:700; }
.navcheck-status__line--manual{ padding:9px 10px; border:1px solid #f1c40f; border-radius:8px; background:#fff8e1; color:#6b5500; font-weight:700; }
.sa-pills{ display:flex; gap:6px; flex-wrap:wrap; margin-top:10px; }
.sa-pill{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:44px; padding:5px 8px; border-radius:999px;
  border:1px solid var(--border); background:var(--card);
  font-family:monospace; font-size:13px; cursor:pointer;
}
.sa-pill.nav-good{ border-color:#2ecc71; background:#ecfff3; color:#0b5d2a; }
.sa-pill.nav-bad{ border-color:#e74c3c; background:#fff1f0; color:#7a0b00; }
.sa-pill.hu{ border-color:#6aa9ff; background:#eef6ff; color:#174a7a; }
.navcheck-table-wrap{ margin-top:16px; overflow:auto; border:1px solid var(--border); border-radius:10px; }
.navcheck-table{ width:100%; border-collapse:collapse; background:var(--card); }
.navcheck-table th,
.navcheck-table td{ padding:10px 12px; border-bottom:1px solid var(--border); text-align:left; vertical-align:top; }
.navcheck-table th{ background:var(--bg); font-weight:700; }
.navcheck-table tr:last-child td{ border-bottom:none; }
.navcheck-table tr.nav-good td{ background:#ecfff3; }
.navcheck-table tr.nav-bad td{ background:#fff1f0; }
.navcheck-table tr.hu td{ background:#eef6ff; }
.navcheck-table tr.sa-focus td{ outline:2px solid var(--primary); outline-offset:-2px; }

/* ── Offline Account page ────────────────────────────────────── */
.offline-doc .hint{ font-size:13px; color:var(--muted); margin-top:6px; }
.offline-doc .alert{ border:1px solid var(--border); background:var(--card); border-radius:10px; padding:12px 14px; }
.offline-doc .alert--danger{ border-color:rgba(176,0,32,.25); background:rgba(176,0,32,.04); }
.offline-doc .alert--ok{ border-color:rgba(10,122,53,.25); background:rgba(10,122,53,.04); }
.offline-doc .alert b{ display:block; margin-bottom:6px; }
.offline-doc .form-grid{ display:grid; grid-template-columns:1fr; gap:12px; }
@media(min-width:900px){
  .offline-doc .form-grid{ grid-template-columns:1fr 1fr; }
  .offline-doc .form-grid .full{ grid-column:1 / -1; }
}
.offline-doc label{ font-size:13px; color:var(--muted); display:block; margin:0 0 6px; }
.offline-doc input{
  width:100%; padding:10px 12px; border:1px solid var(--border);
  border-radius:8px; background:var(--card); color:var(--fg); font-size:14px;
}
.offline-doc input:focus{ outline:none; border-color:rgba(37,99,235,.55); box-shadow:0 0 0 3px rgba(37,99,235,.12); }

/* ZenZefi certificate extractor */
.zenzefi-doc{ color:var(--fg); }
.zenzefi-doc .container{ max-width:1100px; margin:0 auto; display:flex; flex-direction:column; }
.zenzefi-doc .hero{ padding:8px 0 6px; }
.zenzefi-doc .hero h1{ margin:0 0 6px; font-size:32px; text-align:left; }
.zenzefi-doc .hero p{ margin:0; color:var(--muted); }
.zenzefi-doc .cols{ display:grid; grid-template-columns:1fr; gap:16px; align-items:start; }
@media(min-width:900px){
  .zenzefi-doc .cols{ grid-template-columns:2fr 1fr; }
}
.zenzefi-doc .card{ border-radius:10px; padding:20px; box-shadow:var(--shadow-sm); margin:18px 0; }
.zenzefi-doc h2{ margin:0 0 10px; font-size:22px; }
.zenzefi-doc h3{ margin:0 0 8px; font-size:18px; }
.zenzefi-doc p,
.zenzefi-doc li{ color:var(--fg); line-height:1.65; }
.zenzefi-doc .muted{ color:var(--muted); }
.zenzefi-doc .small{ font-size:13px; color:var(--muted); }
.zenzefi-doc .steps{ counter-reset:step; display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.zenzefi-doc .step{
  border:1px dashed var(--border); border-radius:10px;
  padding:14px 14px 14px 54px; position:relative; background:var(--card);
}
.zenzefi-doc .step::before{
  counter-increment:step; content:counter(step);
  position:absolute; left:12px; top:12px; width:28px; height:28px;
  border-radius:50%; display:grid; place-items:center;
  background:var(--primary); color:#fff; font-weight:700;
}
.zen-alert{
  margin:18px 0 0; border-radius:10px; padding:12px 14px;
  border:1px solid var(--border); background:var(--card); line-height:1.45;
}
.zen-alert b{ display:block; margin-bottom:4px; }
.zen-alert--danger{ border-color:rgba(176,0,32,.25); background:rgba(176,0,32,.04); }
.zen-alert--ok{ border-color:rgba(10,122,53,.25); background:rgba(10,122,53,.04); }
.zenzefi-doc details{ border:1px solid var(--border); border-radius:10px; padding:12px 14px; background:var(--card); }
.zenzefi-doc details+details{ margin-top:10px; }
.zenzefi-doc summary{ cursor:pointer; font-weight:600; }
.zen-path-list{ display:grid; gap:8px; margin:10px 0 12px; padding:0; list-style:none; }
.zen-path-list code{
  display:block; padding:9px 10px; border:1px solid var(--border); border-radius:8px;
  background:var(--bg); color:var(--fg); font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
  font-size:13px; line-height:1.45; white-space:normal; overflow-wrap:anywhere;
}
.zen-upload{ display:grid; gap:14px; min-width:0; max-width:100%; }
.zen-file{
  display:grid; gap:6px; padding:22px; border:1px dashed rgba(37,99,235,.38);
  border-radius:10px; background:linear-gradient(180deg,#f8fbff 0%,var(--bg) 100%); cursor:pointer;
  transition:.16s border-color,.16s box-shadow,.16s transform;
  min-width:0; max-width:100%; box-sizing:border-box;
}
.zen-file:hover{ border-color:var(--primary); box-shadow:0 10px 24px rgba(37,99,235,.08); transform:translateY(-1px); }
.zen-file__title{ font-weight:800; color:var(--primary); }
.zen-file__hint{ color:var(--muted); font-size:13px; line-height:1.45; }
.zen-file input{ margin-top:8px; width:100%; max-width:100%; min-width:0; box-sizing:border-box; color:var(--muted); }
.zen-results__head{ display:flex; justify-content:space-between; align-items:flex-start; gap:12px; flex-wrap:wrap; }
.zen-results{ order:20; }
.zen-faq-card{ order:30; }
.zen-results__head h2{ margin-bottom:4px; }
.zen-empty{ margin-top:14px; padding:16px; border:1px dashed var(--border); border-radius:10px; background:var(--bg); color:var(--muted); }
.zen-table-wrap{ margin-top:14px; overflow:auto; border:1px solid var(--border); border-radius:10px; background:var(--card); }
.zen-table{ width:100%; border-collapse:separate; border-spacing:0; background:var(--card); min-width:640px; }
.zen-table th,
.zen-table td{ padding:12px 14px; border-bottom:1px solid var(--border); text-align:left; vertical-align:middle; font-size:14px; line-height:1.35; }
.zen-table th{ padding:11px 14px; border-bottom:1px solid var(--border); text-align:left; vertical-align:bottom; background:var(--bg); color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.45px; }
.zen-table th:first-child,
.zen-table td:first-child{ width:74px; text-align:center; }
.zen-table th:nth-child(2){ width:18%; }
.zen-table th:nth-child(3){ width:12%; }
.zen-table th:nth-child(4){ width:28%; }
.zen-table th:nth-child(5){ width:24%; }
.zen-table tr:last-child td{ border-bottom:none; }
.zen-table tbody tr{ transition:.14s background; }
.zen-table tbody tr:hover td{ background:#f8fbff; }
.zen-table td:nth-child(4){ font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:13px; color:var(--fg); }
.zen-cert-check{ width:18px; height:18px; accent-color:var(--primary); cursor:pointer; }
.zen-results__actions{ justify-content:flex-end; }
@media(max-width:760px){
  :is(.seedkey-doc,.zenzefi-doc) .steps{ grid-template-columns:1fr; }
  .zen-table-wrap{ border:none; overflow:visible; }
  .zen-table{ display:block; min-width:0; background:transparent; }
  .zen-table thead{ display:none; }
  .zen-table tbody{ display:grid; gap:10px; }
  .zen-table tr{ display:grid; gap:7px; border:1px solid var(--border); border-radius:8px; padding:12px; background:var(--card); }
  .zen-table td{ display:flex; justify-content:space-between; gap:12px; padding:0; border-bottom:0; }
  .zen-table td::before{ content:attr(data-label); color:var(--muted); font-size:11px; font-weight:800; text-transform:uppercase; }
  .zen-table tbody tr:hover td{ background:transparent; }
  .zen-results__actions{ justify-content:stretch; }
  .zen-results__actions .btn{ width:100%; text-align:center; }
}

/* Seed-key calculator */
.seedkey-doc .container{ max-width:1180px; margin:0 auto; }
.seedkey-doc .hero{ padding:8px 0 6px; }
.seedkey-doc .hero h1{ margin:0 0 6px; font-size:32px; }
.seedkey-doc .hero p{ margin:0; color:var(--muted); }
.seed-layout{ display:grid; grid-template-columns:1fr; gap:16px; align-items:start; }
@media(min-width:980px){
  .seed-layout{ grid-template-columns:minmax(0, 2fr) 360px; }
  .seed-side{ position:sticky; top:18px; }
}
.seed-section-head,
.seed-panel-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.seed-seo{ margin:12px 0 16px; }
.seed-seo h2{ margin:0 0 8px; font-size:22px; }
.seed-seo p{ margin:0 0 10px; color:var(--fg); line-height:1.6; }
.seed-ecu-index{ margin-top:8px; }
.seed-ecu-index summary{ display:inline-flex; align-items:center; gap:8px; cursor:pointer; color:var(--primary); font-weight:800; padding:7px 10px; border:1px solid var(--border); border-radius:6px; background:#f8fbff; }
.seed-ecu-index summary::marker{ color:var(--muted); }
.seed-ecu-index[open] summary{ margin-bottom:10px; }
.seed-ecu-index__groups{ max-height:260px; overflow:auto; padding:4px 12px; border:1px solid var(--border); border-radius:6px; background:linear-gradient(180deg,#fbfdff 0%,#f7faff 100%); }
.seed-ecu-index__group{ display:grid; grid-template-columns:34px minmax(0,1fr); gap:10px; padding:10px 0; border-bottom:1px solid #e7eef8; }
.seed-ecu-index__group:last-child{ border-bottom:0; }
.seed-ecu-index__letter{ display:flex; align-items:center; justify-content:center; width:28px; height:28px; border-radius:6px; background:#eaf2ff; color:var(--primary); font-weight:900; font-size:13px; }
.seed-ecu-index__group p{ margin:0; color:#334767; font-size:13px; line-height:1.65; overflow-wrap:anywhere; }
.seed-access{ display:flex; align-items:center; justify-content:space-between; gap:14px; margin:10px 0 16px; padding:12px 16px; }
.seed-access__title{ font-weight:800; color:var(--fg); }
.seed-access__items{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; color:var(--muted); font-size:14px; }
.seed-access__items strong{ color:var(--fg); }
.seed-plans{ margin:0 0 16px; }
.seed-plans h2{ margin:0 0 6px; font-size:22px; }
.seed-plan__limit{ font-weight:800; color:var(--fg); line-height:1.25; }
.seed-plan__period{ color:var(--muted); font-size:13px; margin-top:3px; }
.seed-plan__price{ margin:16px 0 8px; font-weight:900; font-size:22px; color:var(--fg); }
.seed-plan__pay{ width:100%; text-align:center; margin-top:12px; }
.seed-section-head h2,
.seed-panel h2{ margin:0 0 6px; font-size:22px; }
.seed-search-label,
.seed-form label{ display:block; margin:14px 0 6px; color:var(--muted); font-size:13px; font-weight:700; }
.seed-search,
.seed-input{
  width:100%; padding:11px 12px; border:1px solid var(--border); border-radius:8px;
  background:var(--card); color:var(--fg); font-size:15px;
}
.seed-search:focus,
.seed-input:focus{ outline:none; border-color:rgba(37,99,235,.55); box-shadow:0 0 0 3px rgba(37,99,235,.12); }
.seed-input.is-invalid{ border-color:#c62828; box-shadow:0 0 0 3px rgba(198,40,40,.12); }
.seed-table-wrap{ margin-top:14px; overflow:visible; border:1px solid var(--border); border-radius:10px; }
.seed-table{ width:100%; border-collapse:collapse; background:var(--card); min-width:0; table-layout:fixed; }
.seed-table th,
.seed-table td{ padding:11px 12px; border-bottom:1px solid var(--border); text-align:left; vertical-align:top; font-size:14px; line-height:1.35; font-family:Arial, sans-serif; font-weight:400; }
.seed-table th{ padding:10px 12px; border-bottom:1px solid var(--border); text-align:left; vertical-align:bottom; background:var(--bg); color:var(--muted); font-size:12px; line-height:1.25; font-family:Arial, sans-serif; font-weight:700; text-transform:uppercase; letter-spacing:.2px; }
.seed-table th:nth-child(1),
.seed-table td:nth-child(1){ width:22%; }
.seed-table th:nth-child(2),
.seed-table td:nth-child(2){ width:15%; }
.seed-table th:nth-child(3),
.seed-table td:nth-child(3),
.seed-table th:nth-child(4),
.seed-table td:nth-child(4){ width:10%; }
.seed-table th:nth-child(5),
.seed-table td:nth-child(5){ width:43%; overflow-wrap:anywhere; word-break:break-all; }
.seed-table tr:last-child td{ border-bottom:none; }
.seed-table tbody tr{ cursor:pointer; }
.seed-table tbody tr:hover td,
.seed-table tbody tr.is-selected td{ background:#f4f8ff; }
.seed-ecu-cell{ color:var(--fg); font-weight:600; overflow-wrap:anywhere; }
.seed-len{ font-size:13px; color:var(--fg); white-space:nowrap; }
.seed-origin{ display:block; color:var(--fg); font-size:11.5px; line-height:1.28; overflow:visible; overflow-wrap:anywhere; word-break:break-all; white-space:normal; }
.seed-empty{ padding:16px; color:var(--muted); text-align:center; }
.seed-panel__empty{ min-height:220px; display:grid; align-content:center; }
.seed-panel__empty[hidden]{ display:none; }
.seed-panel.has-selection .seed-panel__empty{ display:none; }
.seed-form[hidden]{ display:none; }
.seed-kicker{ color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.8px; font-weight:800; }
.seed-selected{ display:grid; gap:10px; margin:14px 0; }
.seed-selected div{ padding:10px 12px; border:1px solid var(--border); border-radius:8px; background:var(--bg); }
.seed-selected span{ display:block; font-size:12px; color:var(--muted); margin-bottom:3px; }
.seed-selected strong{ display:block; color:var(--fg); word-break:break-word; }
.seed-output{ font-family:monospace; }
.seed-check{ display:flex; align-items:center; gap:8px; margin:12px 0 4px; color:var(--fg); font-size:14px; font-weight:700; }
.seed-check input{ width:16px; height:16px; margin:0; accent-color:var(--primary); }
.seed-actions{ display:grid; grid-template-columns:1fr; gap:10px; margin-top:14px; }
.seed-actions .btn{ width:100%; text-align:center; }
.seed-error{ margin-top:7px; color:#c62828; font-size:13px; }
.seed-form .hint{ font-size:13px; color:var(--muted); margin-top:6px; }
.seed-modal-close{ display:none; }
.seed-modal-backdrop{ position:fixed; inset:0; background:rgba(15,23,42,.55); z-index:9998; }

/* ── "What is it" / "How it works" / FAQ content on the seed page ──── */
/* Match the look of the shared product-doc ".card"/h2 style used on the other 7 pages */
.seedkey-block{ border-radius:10px; padding:20px; box-shadow:var(--shadow-sm); margin:18px 0; }
.seedkey-block h2{ margin:0 0 10px; font-size:22px; }
.seedkey-doc .space{ height:8px; }
.seedkey-doc .steps{ counter-reset:step; display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.seedkey-doc .step{
  border:1px dashed var(--border); border-radius:10px;
  padding:14px 14px 14px 54px; position:relative; background:var(--card);
}
.seedkey-doc .step::before{
  counter-increment:step; content:counter(step);
  position:absolute; left:12px; top:12px;
  width:28px; height:28px; border-radius:50%;
  display:grid; place-items:center;
  background:var(--primary); color:#fff; font-weight:700;
}
.seedkey-doc .step h3{ margin:0 0 6px; font-size:18px; }
.seedkey-faq details{
  border:1px solid var(--border); border-radius:10px; padding:12px 14px; background:var(--card);
}
.seedkey-faq details+details{ margin-top:10px; }
.seedkey-faq summary{ cursor:pointer; font-weight:600; }

@media(max-width:979px){
  .seedkey-doc .container{ padding:0; }
  .seedkey-doc .hero{ padding:6px 0 4px; }
  .seedkey-doc .hero h1{ font-size:28px; line-height:1.08; }
  .seed-access{ display:block; padding:12px; margin:10px 0 14px; }
  .seed-access__items{ display:grid; gap:4px; margin-top:6px; }
  .seed-table-wrap{ overflow:visible; border:none; border-radius:0; }
  .seed-table{ display:block; min-width:0; background:transparent; table-layout:auto; }
  .seed-table thead{ display:none; }
  .seed-table tbody{ display:grid; gap:12px; }
  .seed-table tr{
    display:grid; grid-template-columns:1fr auto; grid-template-areas:
      "ecu level"
      "seed key"
      "origin origin";
    gap:8px 10px; border:1px solid var(--border); border-radius:8px;
    background:var(--card); padding:12px; overflow:hidden;
  }
  .seed-table tr:last-child td{ border-bottom:none; }
  .seed-table td{
    display:block; width:auto !important; padding:0; border-bottom:none;
    background:transparent; font-size:14px; min-width:0;
  }
  .seed-table td::before{
    display:block; content:attr(data-label); color:var(--muted); font-size:10px; font-weight:700;
    text-transform:uppercase; letter-spacing:.2px; line-height:1.25; margin-bottom:2px;
  }
  .seed-table td:nth-child(1){ grid-area:ecu; }
  .seed-table td:nth-child(2){ grid-area:level; text-align:right; }
  .seed-table td:nth-child(3){ grid-area:seed; }
  .seed-table td:nth-child(4){ grid-area:key; }
  .seed-table td:nth-child(5){ grid-area:origin; padding-top:8px; border-top:1px solid var(--border); }
  .seed-table tbody tr:hover td,
  .seed-table tbody tr.is-selected td{ background:transparent; }
  .seed-table tbody tr:hover,
  .seed-table tbody tr.is-selected{ border-color:rgba(37,99,235,.45); box-shadow:0 0 0 3px rgba(37,99,235,.08); }
  .seed-ecu-cell{ font-size:16px; line-height:1.2; }
  .seed-len{ display:inline-block; padding:3px 7px; border:1px solid var(--border); border-radius:6px; background:var(--bg); font-size:12px; }
  .seed-origin{ font-size:11.5px; line-height:1.25; }
  .seed-side{ display:block; }
  .seed-panel{ display:none; }
  .seed-panel.is-modal-open{
    display:block; position:fixed; z-index:9999; left:0; right:0; bottom:0;
    max-height:calc(100vh - 22px); overflow:auto; -webkit-overflow-scrolling:touch;
    margin:0; padding:14px 16px 16px; border-radius:12px 12px 0 0; border-left:none; border-right:none; border-bottom:none;
  }
  .seed-panel.is-modal-open .seed-panel-head{ align-items:center; margin-bottom:6px; }
  .seed-panel.is-modal-open .seed-kicker{ font-size:10px; letter-spacing:.5px; }
  .seed-panel.is-modal-open .seed-selected{ grid-template-columns:1fr 1fr; gap:8px; margin:10px 0; }
  .seed-panel.is-modal-open .seed-selected div{ padding:8px 10px; }
  .seed-panel.is-modal-open .seed-selected span{ font-size:11px; margin-bottom:2px; }
  .seed-panel.is-modal-open .seed-form label{ margin:10px 0 5px; }
  .seed-panel.is-modal-open .seed-input{ padding:10px 11px; }
  .seed-panel.is-modal-open .seed-check{ margin:8px 0 4px; }
  .seed-panel.is-modal-open .seed-actions{ gap:8px; margin-top:10px; }
  .seed-panel.is-modal-open .seed-actions .btn{ padding-top:10px; padding-bottom:10px; }
  .seed-panel.is-modal-open .seed-form .small.muted{ margin:10px 0 0; font-size:12px; line-height:1.25; }
  .seed-panel.is-modal-open .seed-modal-close{
    display:grid; place-items:center; width:38px; height:38px; border:1px solid var(--border);
    border-radius:8px; background:var(--card); color:var(--fg); font-size:24px; line-height:1; cursor:pointer;
  }
}

[data-theme="dark"] .seed-table tbody tr:hover td,
[data-theme="dark"] .seed-table tbody tr.is-selected td{ background:#162033; }

/* ── Shared "tools" sidebar menu (all product pages) ─────────── */
.tools-nav__group{ padding-top:14px; margin-top:14px; border-top:1px solid var(--border); }
.tools-nav__group:first-child{ padding-top:0; margin-top:0; border-top:0; }
.tools-nav__group-title{
  color:var(--muted); font-size:12px; font-weight:800; text-transform:uppercase;
  letter-spacing:.4px; margin-bottom:10px;
}
.tools-nav__list{ display:grid; gap:6px; list-style:none; margin:0; padding:0; }
.tools-nav__link{
  display:flex; align-items:center; gap:10px; padding:8px; border-radius:10px;
  border:1px solid transparent;
  text-decoration:none; color:var(--fg); font-size:14px; font-weight:700;
  line-height:1.3;
  transition:.15s background, .15s border-color, .15s transform, .15s box-shadow;
}
.tools-nav__link:hover{
  background:#f8fbff; border-color:#d9e7ff;
  transform:translateY(-1px); box-shadow:var(--shadow-sm);
}
.tools-nav__link.is-current{
  background:#eef4ff; border-color:#d9e7ff; color:var(--primary); cursor:default;
}
.tools-nav__link.is-current:hover{ transform:none; box-shadow:none; }
.tools-nav__icon{
  display:grid; place-items:center; flex-shrink:0;
  width:30px; height:30px; border-radius:8px;
  background:#eef4ff; border:1px solid #d9e7ff;
  font-size:15px; line-height:1;
}
.tools-nav__link.is-current .tools-nav__icon{ background:#fff; border-color:var(--primary); }

[data-theme="dark"] .tools-nav__link:hover{ background:#162033; border-color:#2d4a7a; }
[data-theme="dark"] .tools-nav__link.is-current{ background:rgba(59,130,246,.18); border-color:#2d4a7a; }
[data-theme="dark"] .tools-nav__icon{ background:#162033; border-color:#2d4a7a; }
[data-theme="dark"] .tools-nav__link.is-current .tools-nav__icon{ background:#1e293b; border-color:var(--primary); }

/* ══════════════════════════════════════════════════════════════
   App shell: sidebar layout (replaces the old topbar navigation)
   ══════════════════════════════════════════════════════════════ */
.layout{ min-height:100vh; }

/* ── Sidebar ─────────────────────────────────────────────────── */
.sidebar{
  position:fixed; top:0; left:0; bottom:0;
  width:var(--sb-w);
  background:linear-gradient(180deg, #ffffff 0%, #eef3fb 100%);
  border-right:1px solid var(--border);
  display:flex; flex-direction:column;
  z-index:1100;
  transition:width .2s ease, transform .25s ease;
}
.sidebar-brand{
  display:flex; align-items:center; gap:10px;
  padding:16px 14px;
  border-bottom:1px solid rgba(148,163,184,.14);
  flex-shrink:0;
}
.sidebar-brand__logo{
  width:36px; height:36px; border-radius:10px; flex-shrink:0;
  background:linear-gradient(135deg, #3b82f6, #8b5cf6);
  display:grid; place-items:center;
  color:#fff; font-weight:800; font-size:14px; letter-spacing:.2px;
}
.sidebar-brand__name{
  color:var(--sb-strong); font-weight:800; font-size:15px; white-space:nowrap;
  overflow:hidden; text-overflow:ellipsis;
}
.sidebar-collapse-btn{
  margin-left:auto; flex-shrink:0;
  width:28px; height:28px; border-radius:8px;
  display:flex; align-items:center; justify-content:center;
  background:transparent; border:1px solid rgba(148,163,184,.25);
  color:var(--sb-item); cursor:pointer; padding:0;
  transition:.15s background;
}
.sidebar-collapse-btn:hover{ background:rgba(148,163,184,.12); }
.sidebar-collapse-btn svg{ width:16px; height:16px; transition:transform .2s ease; }

.sidebar-nav{
  flex:1 1 auto; overflow-y:auto; overflow-x:hidden;
  padding:12px 10px;
}
.sidebar-nav::-webkit-scrollbar{ width:6px; }
.sidebar-nav::-webkit-scrollbar-thumb{ background:rgba(148,163,184,.25); border-radius:99px; }
.sidebar-nav::-webkit-scrollbar-track{ background:transparent; }

.nav-item{
  display:flex; align-items:center; gap:12px; width:100%;
  padding:10px 12px; border-radius:10px;
  color:var(--sb-item); font-weight:600; font-size:14px;
  text-decoration:none; cursor:pointer; text-align:left;
  border:0; background:none; font-family:inherit;
}
button.nav-item{ appearance:none; }
.nav-item:hover{ background:rgba(148,163,184,.12); color:var(--sb-item-hover); }
.nav-item.active{
  background:var(--accent); color:#fff;
  box-shadow:0 4px 14px rgba(59,130,246,.35);
}
.nav-icon{ width:20px; height:20px; flex-shrink:0; }
.nav-label{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; flex:1 1 auto; }
.nav-caret{ width:16px; height:16px; flex-shrink:0; transition:transform .2s ease; }
.nav-group.open > .nav-item .nav-caret{ transform:rotate(180deg); }

.nav-sub{
  display:grid; gap:2px; overflow:hidden; max-height:0;
  margin:0 0 0 17px; padding-left:16px;
  border-left:1px solid rgba(148,163,184,.2);
}
.nav-group.open .nav-sub{ max-height:1000px; margin:2px 0 6px 17px; }
.nav-sub .nav-item{ font-size:13.5px; padding:8px 10px; }

.sidebar-footer{
  flex-shrink:0; padding:12px 10px 16px;
  border-top:1px solid rgba(148,163,184,.14);
}

.sidebar-backdrop{
  position:fixed; inset:0; z-index:1050;
  background:rgba(15,23,42,.5);
  opacity:0; pointer-events:none;
  transition:opacity .2s ease;
}
.sidebar-backdrop.open{ opacity:1; pointer-events:auto; }

/* ── Content / topbar / main card ───────────────────────────── */
.content{
  margin-left:var(--sb-w);
  min-height:100vh;
  display:flex; flex-direction:column;
  transition:margin-left .2s ease;
}
.topbar{
  position:sticky; top:0; z-index:900;
  height:var(--topbar-h);
  display:flex; align-items:center; gap:14px;
  padding:0 24px;
  background:rgba(255,255,255,.85);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
}
.topbar-hamburger{
  display:none;
  width:36px; height:36px; border-radius:9px; flex-shrink:0;
  align-items:center; justify-content:center;
  background:transparent; border:1px solid var(--border);
  color:var(--text); cursor:pointer; padding:0;
}
.topbar-hamburger svg{ width:20px; height:20px; }
.topbar-title{
  font-size:17px; font-weight:700; color:var(--text);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  text-decoration:none; min-width:0;
}
.topbar-title:hover{ color:var(--accent); }
.topbar-spacer{ flex:1 1 auto; }
.topbar-right{ display:flex; align-items:center; gap:10px; flex-shrink:0; }
.topbar-user{
  display:flex; align-items:center; gap:10px;
  text-decoration:none; color:var(--text);
}
.topbar-user__name{
  font-size:13.5px; font-weight:600; color:var(--text-soft);
  max-width:140px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.topbar-avatar{
  width:32px; height:32px; border-radius:50%; flex-shrink:0;
  background:linear-gradient(135deg, #3b82f6, #8b5cf6);
  color:#fff; font-weight:800; font-size:13px;
  display:grid; place-items:center;
}
.topbar-lang{
  display:inline-flex; align-items:center; gap:4px;
  font-size:13px; font-weight:700;
  background:var(--bg); border:1px solid var(--border);
  border-radius:999px; padding:6px 8px;
}
.topbar-lang a{ color:var(--muted); text-decoration:none; padding:2px 6px; border-radius:999px; }
.topbar-lang a.active{ color:#fff; background:var(--accent); }
.topbar-currency{
  display:inline-flex; align-items:center; gap:4px;
  font-size:13px; font-weight:700;
  background:var(--bg); border:1px solid var(--border);
  border-radius:999px; padding:6px 8px;
}
.topbar-currency a{ color:var(--muted); text-decoration:none; padding:2px 6px; border-radius:999px; }
.topbar-currency a.active{ color:#fff; background:var(--accent); }
.topbar-payhot-sandbox{
  font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.02em;
  color:#fff; background:#d97706; border-radius:999px; padding:4px 8px;
}
.topbar-theme-btn{
  width:34px; height:34px; border-radius:9px;
  display:flex; align-items:center; justify-content:center;
  background:var(--bg); border:1px solid var(--border);
  cursor:pointer; font-size:15px; padding:0;
}

/* ── Language switcher + theme toggle, mobile copy inside the sidebar ── */
.sidebar-footer__utils{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  margin-bottom:10px; padding-bottom:10px;
  border-bottom:1px solid rgba(148,163,184,.14);
}
.sidebar-lang{
  display:inline-flex; align-items:center; gap:4px;
  font-size:13px; font-weight:700;
  background:rgba(148,163,184,.12); border:1px solid rgba(148,163,184,.25);
  border-radius:999px; padding:6px 8px;
}
.sidebar-lang a{ color:var(--sb-item); text-decoration:none; padding:2px 6px; border-radius:999px; }
.sidebar-lang a.active{ color:#fff; background:var(--accent); }
.sidebar-currency{
  display:inline-flex; align-items:center; gap:4px;
  font-size:13px; font-weight:700;
  background:rgba(148,163,184,.12); border:1px solid rgba(148,163,184,.25);
  border-radius:999px; padding:6px 8px;
}
.sidebar-currency a{ color:var(--sb-item); text-decoration:none; padding:2px 6px; border-radius:999px; }
.sidebar-currency a.active{ color:#fff; background:var(--accent); }
.sidebar-theme-btn{
  width:34px; height:34px; border-radius:9px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  background:rgba(148,163,184,.12); border:1px solid rgba(148,163,184,.25);
  cursor:pointer; font-size:15px; padding:0; color:var(--sb-item);
}

.layout main{
  flex:1 1 auto;
  background:var(--surface);
  border-radius:16px;
  box-shadow:var(--shadow);
  margin:22px 24px 24px;
  padding:24px;
}

.content .site-footer{ margin:0 24px 24px; }

/* ── Responsive-safe tables that had no mobile handling before ── */
.amg-menu-doc .price-table,
.legal-doc table{
  display:block; overflow-x:auto; -webkit-overflow-scrolling:touch;
}

/* ── Mobile (≤900px) ─────────────────────────────────────────── */
@media (max-width:900px){
  .sidebar{
    width:280px;
    transform:translateX(-105%);
    box-shadow:0 0 40px rgba(15,23,42,.35);
  }
  .sidebar.open{ transform:translateX(0); }
  .content{ margin-left:0; }
  .topbar-hamburger{ display:inline-flex; }
  .sidebar-collapse-btn{ display:none; }
  .topbar-lang, .topbar-currency, .topbar-payhot-sandbox, .topbar-theme-btn{ display:none; }
  .layout main{ margin:14px 10px 10px; padding:14px; }
  .content .site-footer{ margin:0 10px 14px; }
}
body.no-scroll{ overflow:hidden; }

/* ── Desktop collapsed state ─────────────────────────────────── */
@media (min-width:901px){
  html.sb-collapsed .sidebar{ width:var(--sb-w-mini); }
  html.sb-collapsed .content{ margin-left:var(--sb-w-mini); }
  html.sb-collapsed .sidebar-brand__name,
  html.sb-collapsed .nav-label,
  html.sb-collapsed .nav-caret,
  html.sb-collapsed .nav-sub{ display:none; }
  html.sb-collapsed .sidebar-brand{ justify-content:center; padding:16px 8px; }
  html.sb-collapsed .sidebar-collapse-btn{ margin-left:0; }
  html.sb-collapsed .sidebar-collapse-btn svg{ transform:rotate(180deg); }
  html.sb-collapsed .nav-item{ justify-content:center; padding:10px; }
}
@media (min-width:901px){
  .sidebar-footer__utils{ display:none; }
}

[data-theme="dark"] .topbar{ background:rgba(15,23,42,.75); }
[data-theme="dark"] .topbar-hamburger,
[data-theme="dark"] .topbar-lang,
[data-theme="dark"] .topbar-currency,
[data-theme="dark"] .topbar-theme-btn{ background:var(--card); border-color:var(--border); color:var(--fg); }
[data-theme="dark"] .sidebar{ background:linear-gradient(180deg, #0a0f1c 0%, #060a13 100%); }

/* ── Dark theme ────────────────────────────────────────────── */
[data-theme="dark"] {
  --bg: #0f172a;
  --fg: #e2e8f0;
  --card: #1e293b;
  --muted: #94a3b8;
  --primary: #3b82f6;
  --primary-hover: #60a5fa;
  --border: #2d3f55;
  --shadow-sm: 0 2px 10px rgba(0,0,0,.25);
  --shadow-md: 0 8px 24px rgba(0,0,0,.35);
  --ok-bg: #001a0d;
  --ok-bd: #0a4a25;
  --warn-bg: #1e1500;
  --warn-bd: #4a3a0a;

  --surface:#1e293b;
  --text:#e2e8f0;
  --text-soft:#cbd5e1;
  --accent:#3b82f6;
  --accent-strong:#60a5fa;
  --sb-bg:#0a0f1c;
  --sb-strong:#fff;
  --sb-item:#94a3b8;
  --sb-item-hover:#e2e8f0;
}

[data-theme="dark"] body {
  background: linear-gradient(180deg, #0b1120 0%, #0f172a 220px, #0d1526 100%);
}

[data-theme="dark"] .btn--secondary {
  background: #1e293b;
  border-color: #2d4a7a;
}
[data-theme="dark"] .btn--secondary:hover {
  background: #263548;
  border-color: #3d5f96;
}

[data-theme="dark"] .program-card select,
[data-theme="dark"] .program-card input[type=email],
[data-theme="dark"] .auth-row input {
  background: var(--card);
  border-color: var(--border);
  color: var(--fg);
}

[data-theme="dark"] .modal { background: var(--card); }
[data-theme="dark"] .modal-header { border-bottom-color: var(--border); }
[data-theme="dark"] .modal-body { color: var(--fg); }
[data-theme="dark"] .modal-body p { color: var(--muted); }
[data-theme="dark"] .modal-close { color: var(--fg); }

[data-theme="dark"] .storefront-note {
  background: #151d2e;
  border-color: #253554;
  color: #94a3b8;
}
[data-theme="dark"] .storefront-note a { color: var(--primary-hover); }

[data-theme="dark"] .storefront-badge {
  background: #162033;
  border-color: #2d4a7a;
  color: var(--fg);
}

[data-theme="dark"] .auth-error {
  background: #1f0808;
  border-color: #5c1a1a;
  color: #f87171;
}

[data-theme="dark"] .login-notice { background: #162033; border-color: #2d4a7a; color: var(--muted); }
[data-theme="dark"] .hero-badge { background: var(--card); }

[data-theme="dark"] .card-tag { background: #1e3a5f; color: #60a5fa; }
[data-theme="dark"] .card-tag.ct-green { background: #0a2e1a; color: #34d399; }
[data-theme="dark"] .card-tag.ct-amber { background: #2a1a00; color: #fbbf24; }
[data-theme="dark"] .card-tag.ct-purple { background: #1e0a3e; color: #a78bfa; }

[data-theme="dark"] .site-footer__links a:hover{
  background:#263548;
  border-color:#3d5f96;
  color:var(--primary-hover);
}

/* ── Dark: doc pages ─────────────────────────────────────────── */
[data-theme="dark"] .amg-menu-doc .note-box--warn{ background:#1e1500; border-color:#4a3a0a; color:#d4a845; }
[data-theme="dark"] .amg-menu-doc .note-box--ok{ background:#001a0d; border-color:#0a4a25; color:#34d399; }

[data-theme="dark"] .navcheck-message{ background:#2a1e00; border-color:#7a6000; color:#d4a845; }
[data-theme="dark"] .navcheck-message.ok{ background:#001a0d; border-color:#0a4a25; color:#34d399; }
[data-theme="dark"] .navcheck-message.err{ background:#1f0808; border-color:#5c1a1a; color:#f87171; }
[data-theme="dark"] .navcheck-message.info{ background:#0a1e3a; border-color:#1e4a7a; color:#93c5fd; }
[data-theme="dark"] .navcheck-status.good{ background:#001a0d; border-color:#0a4a25; color:#34d399; }
[data-theme="dark"] .navcheck-status.warn{ background:#1e1500; border-color:#4a3a0a; color:#d4a845; }
[data-theme="dark"] .navcheck-status.bad{ background:#1f0808; border-color:#5c1a1a; color:#f87171; }
[data-theme="dark"] .navcheck-status__line--important{ background:#1f0808; border-color:#5c1a1a; color:#f87171; }
[data-theme="dark"] .navcheck-status__line--manual{ background:#1e1500; border-color:#4a3a0a; color:#d4a845; }
[data-theme="dark"] .sa-pill.nav-good{ background:#001a0d; border-color:#0a4a25; color:#34d399; }
[data-theme="dark"] .sa-pill.nav-bad{ background:#1f0808; border-color:#5c1a1a; color:#f87171; }
[data-theme="dark"] .sa-pill.hu{ background:#0a1e3a; border-color:#1e4a7a; color:#93c5fd; }
[data-theme="dark"] .navcheck-table tr.nav-good td{ background:#001a0d; }
[data-theme="dark"] .navcheck-table tr.nav-bad td{ background:#1f0808; }
[data-theme="dark"] .navcheck-table tr.hu td{ background:#0a1e3a; }