/**handles:kzs-site**/
/* ============================================================================
   Site CSS – V4.15
   Notes:
   - Address pane guardrail: force 50/50 pairs + clear stray width caps
   - Account page shell (#kzs-account) added; reuses quiz design tokens
   - Account summary + subscription layout moved from inline MU CSS to here
   ========================================================================== */

/* Design tokens */
#kzs-quiz, #kzs-report, #kzs-account {
  --kzs-bg: #ffffff;
  --kzs-muted: #6b7280;
  --kzs-text: #111827;
  --kzs-text-2: #333333;       /* darker body copy on mobile */
  --kzs-border: #e5e7eb;
  --kzs-border-2: #d1d5db;
  --kzs-soft: #f9fafb;
  --kzs-soft-2: #f3f4f6;

  /* Blue palette */
  --kzs-active: #2d7de0;      /* blue btn bg */
  --kzs-active-600: #1a5cb8;  /* blue btn hover */
  --kzs-active-soft: rgba(57,143,252,.12); /* active tab bg */
  --kzs-ring: rgba(57,143,252,.5); /* blue focus ring */

  --kzs-danger-bg: #fee2e2;   /* red-100 */
  --kzs-danger-bd: #fecaca;   /* red-200 */
  --kzs-danger-tx: #991b1b;   /* red-800 */
  color: var(--kzs-text);
}

/* Report / Step 7 — widen legacy .kzs-wrap to match 1340px container */
#kzs-report .kzs-wrap,
#kzs-report.kzs-wrap{
  max-width: 1340px;
}
/* Step 7 – tighten outer padding around Stripe checkout */
#kzs-report .kzs-main{
   padding: 0 !important;
}

/* Report shell – center Step 7 on the teal background */
#kzs-report{
  max-width: 1340px;
  margin: 0 auto;
  padding: 0px;
}

/* Quiz shell – single white card, no green gap */
#kzs-quiz .kzs-quiz-wrap,
#kzs-quiz.kzs-quiz-wrap{
  display:flex;
  align-items:stretch;
  gap:0;
  background:#fff;
  border-radius:22px;
  border:1px solid var(--kzs-border);
  box-shadow:0 10px 30px rgba(0,0,0,.06);
  overflow:hidden;
  height:775px;
}
#kzs-quiz .kzs-steps{
  background:#fff;
  width:300px;
  flex:0 0 300px;
  border-right:0;
  border-radius:0;
}
#kzs-quiz .kzs-main{
  background:#fff;
  border-radius:0;
  flex:1 1 auto;
  min-width:0;
  display:flex;
  flex-direction:column;
  height:100%;
}
#kzs-quiz .kzs-pane{
  flex:1 1 auto;
  display:none;
  flex-direction:column;
}
#kzs-quiz .kzs-pane.active{
  display:flex;
  overflow:auto;
  padding:5px;
}

/* Driving option layouts */
#kzs-quiz .kzs-driving-layout{
  display:grid;
  gap:12px;
  width:100%;
  max-width:100%;
}
#kzs-quiz .kzs-driving-layout-item{
  width:100%;
  text-align:left;
  border:1px solid var(--kzs-border);
  border-radius:12px;
  background:#fff;
  padding:14px 16px;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
#kzs-quiz .kzs-driving-layout-item.is-selected{
  border-color: #2d7de0;
  box-shadow: 0 0 0 2px rgba(57,143,252,.2);
  background: rgba(57,143,252,.06);
}
#kzs-quiz .kzs-driving-layout-title{
  font-size:1rem;
  font-weight:700;
  color:var(--kzs-text);
}
#kzs-quiz .kzs-driving-layout-sub{
  font-size:.95rem;
  color:var(--kzs-muted);
}
#kzs-quiz .kzs-driving-layout--tiles{
  grid-template-columns:repeat(2,minmax(0,1fr));
  align-content:start;
}
#kzs-quiz .kzs-driving-layout--tiles .kzs-driving-layout-item{
  min-height:108px;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
}
#kzs-quiz .kzs-driving-layout--tiles .kzs-driving-layout-item--wide{
  grid-column:1 / -1;
}
#kzs-quiz .kzs-pane .kzs-desktop-controls,
#kzs-quiz .kzs-pane .kzs-btn-row{
  margin-top:auto;
}
#kzs-quiz .kzs-steps .kzs-gauge-wrap{
  padding-bottom:16px;
  margin:0 12px 12px;
  border-bottom:1px solid var(--kzs-border);
}
@media (max-width: 768px){
  #kzs-quiz .kzs-quiz-wrap,
  #kzs-quiz.kzs-quiz-wrap{
    display:block;
    border-radius:0;
    border:0;
    box-shadow:none;
    height:auto;
    overflow:visible;
  }
  #kzs-quiz .kzs-steps{
    border-right:0;
    width:auto;
    flex:1 1 auto;
  }
  #kzs-quiz .kzs-main{
    height:auto;
  }
}

/* --------------------------------------------------------------------------
   Address pane guardrail (scoped)
   - Ensure each .kzs-row in Step 0 is a true 2-col 50/50
   - Clear any inline/builder width caps on those fields/controls
   -------------------------------------------------------------------------- */

.kzs-lead a {
  font-size:17px;
  font-weight:500;
  color:#0B0B69;
}

.kzs-lead p {
	font-size:17px;
}

#kzs-quiz #kzs-pane-addr .kzs-row{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
#kzs-quiz #kzs-pane-addr .kzs-row > .kzs-field{
  flex: 1 1 0 !important;
  width: auto !important;
  max-width: none !important;    /* beats inline max-width */
  min-width: 280px;              /* keeps pairs until container is narrow */
}
#kzs-quiz #kzs-pane-addr .kzs-row > .kzs-field input[type="text"],
#kzs-quiz #kzs-pane-addr .kzs-row > .kzs-field input[type="tel"],
#kzs-quiz #kzs-pane-addr .kzs-row > .kzs-field input[type="email"],
#kzs-quiz #kzs-pane-addr .kzs-row > .kzs-field input[type="number"],
#kzs-quiz #kzs-pane-addr .kzs-row > .kzs-field select{
  width: 100% !important;
  max-width: none !important;    /* beats inline max-width on inputs/selects */
}

/* Mobile: force single-column stack for address fields */
@media (max-width: 768px){
  #kzs-quiz #kzs-pane-addr .kzs-row{
    flex-direction: column;
    flex-wrap: nowrap;
  }
  #kzs-quiz #kzs-pane-addr .kzs-row > .kzs-field{
    flex: 0 0 100% !important;
    width: 100% !important;
    min-width: 100% !important;
  }
}

/* Headings + copy */
#kzs-quiz h1, #kzs-quiz h2, #kzs-quiz h3 { color: var(--kzs-text); margin: 0 0 .35rem; }
#kzs-quiz p { color: var(--kzs-muted); }

/* Pane min-heights */
#kzs-quiz .kzs-pane, #kzs-report .kzs-pane{
  min-height: clamp(420px, 50vh, 760px);
}

/* Inputs */
#kzs-quiz select,
#kzs-quiz input[type="text"],
#kzs-quiz input[type="tel"],
#kzs-quiz input[type="email"],
#kzs-quiz input[type="number"]{
  width: 100%;
  padding: .55rem .75rem;
  border: 1px solid var(--kzs-border);
  border-radius: 10px;
  background: #fff;
  color: var(--kzs-text);
  line-height: 1.3;
}
#kzs-quiz select:focus,
#kzs-quiz input:focus{
  outline: 2px solid rgba(57,143,252,.5);
  outline-offset: 2px;
  border-color: #2d7de0;
}

/* Field spacing */
#kzs-quiz .kzs-field{ margin: 7px 0; }

/* Prev/Next buttons (in-pane) */
#kzs-quiz .kzs-prev,
#kzs-quiz .kzs-next{
  display: inline-flex; align-items:center; gap:.5rem;
  padding:.55rem .9rem; border-radius:10px; border:1px solid var(--kzs-border-2);
  background: var(--kzs-soft); color: var(--kzs-text); font-weight:600;
}
#kzs-quiz .kzs-next{
  background: var(--kzs-active); border-color: #398ffc; color: #fff;
}
#kzs-quiz .kzs-prev:hover{ background: var(--kzs-soft-2); }
#kzs-quiz .kzs-next:hover{ background: var(--kzs-active-600); border-color: var(--kzs-active-600); }
#kzs-quiz .kzs-prev:focus, #kzs-quiz .kzs-next:focus{ outline:2px solid var(--kzs-ring); outline-offset:2px; }
#kzs-quiz .kzs-next:disabled{ background:#e5e7eb; border-color:#e5e7eb; color:#6b7280; cursor:not-allowed; }

/* Sidebar steps + accordion */
#kzs-steps .kzs-step{
  display:flex; align-items:center; gap:.6rem;
  padding:.55rem .7rem; border-radius:10px; cursor:pointer;
  margin-bottom:5px;
}
#kzs-steps .kzs-step.active{
  background: var(--kzs-active-soft);
  border: 1px solid #2d7de0;
}
#kzs-steps .kzs-step:hover{ background: var(--kzs-soft-2); }
#kzs-steps .kzs-step .kzs-step-title{ font-weight:600; color:var(--kzs-text); }

/* Icon styling - diagnostic */
#kzs-steps .kzs-ico {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.5em;
  height: 1.5em;
  font-size: 1.5rem;
  min-width: 1.5em;
  margin-right: 0.25rem;
}

#kzs-steps .kzs-ico i {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: #111827;
  font-size: 1em;
}


/* Vehicle sublist */
#kzs-veh-sublist{
  overflow:hidden; max-height:0; opacity:0;
  transition:max-height .28s ease, opacity .28s ease;
  margin:6px 10px 0 42px; border:1px solid var(--kzs-border); border-radius:10px; background:#fafafa;
}
#kzs-step-vehicle[aria-expanded="true"] + #kzs-veh-sublist{ max-height: 520px; opacity:1; }
#kzs-veh-sublist .kzs-subitem{
  padding:8px 12px; border-top:1px dashed var(--kzs-border); color:var(--kzs-text);
}
#kzs-veh-sublist .kzs-subitem:first-child{ border-top:0; }
#kzs-veh-sublist .kzs-subitem:hover{ background: var(--kzs-soft); }

/* Count badge */
#kzs-veh-count{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:18px; height:18px; padding:0 4px; margin-left:auto;
  font-size:.75rem; color:#fff; background:var(--kzs-active); border-radius:999px;
}

/* Results table */
#kzs-quiz .kzs-results-wrap{ margin-top:.5rem; }
#kzs-quiz .kzs-results-table{
  width:100%; border-collapse:separate; border-spacing:0; border:1px solid var(--kzs-border);
  border-radius:12px; overflow:hidden; background:#fff;
}
#kzs-quiz .kzs-results-table thead th{
  background:#f8fafc; color:#374151; text-align:left; font-weight:700; padding:.6rem .75rem; border-bottom:1px solid var(--kzs-border);
}
#kzs-quiz .kzs-results-table tbody td{
  padding:.6rem .75rem; border-top:1px solid var(--kzs-border);
}
#kzs-quiz .kzs-results-table tbody tr:hover{ background:#f9fafb; }

/* Choose/Add buttons (results rows) */
#kzs-quiz .kzs-choose{
  display:inline-flex; align-items:center; justify-content:center; min-width:92px;
  padding:.45rem .8rem; border-radius:10px; border:1px solid #398ffc;
  background: var(--kzs-active); color:#fff; font-weight:600;
}
#kzs-quiz .kzs-choose:hover{ background:var(--kzs-active-600); border-color:var(--kzs-active-600); }
#kzs-quiz .kzs-choose:focus{ outline:2px solid var(--kzs-ring); outline-offset:2px; }
#kzs-quiz .kzs-choose[disabled]{ background:#e5e7eb; border-color:#e5e7eb; color:#6b7280; cursor:not-allowed; }

/* Your Vehicles (cards) */
#kzs-quiz .kzs-veh-list{ display:grid; gap:10px; margin-top:10px; }
#kzs-quiz .kzs-veh-card{
  display:flex; flex-direction:column; gap:8px;
  padding:12px 14px; background:#fff; border:1px solid var(--kzs-border); border-radius:12px;
}
#kzs-quiz .kzs-veh-card .meta strong{ color:var(--kzs-text); }
#kzs-quiz .kzs-veh-card .meta small,
#kzs-quiz .kzs-veh-card .meta .sub{ color:var(--kzs-muted); }
#kzs-quiz .kzs-veh-card .actions{ display:flex; gap:8px; flex-wrap:wrap; }

/* Small buttons */
#kzs-quiz .kzs-sm-btn{
  padding:.38rem .68rem; border-radius:10px; border:1px solid var(--kzs-border-2);
  background: var(--kzs-soft); color:var(--kzs-text); font-weight:700;
}
#kzs-quiz .kzs-sm-btn:hover{ background: var(--kzs-soft-2); }
#kzs-quiz .kzs-sm-btn:focus{ outline:2px solid var(--kzs-ring); outline-offset:2px; }
#kzs-quiz .kzs-sm-btn.danger{ border-color:var(--kzs-danger-bd); background:var(--kzs-danger-bg); color:var(--kzs-danger-tx); }
#kzs-quiz .kzs-sm-btn.danger:hover{ background:#fecaca; }

/* Empty states */
#kzs-quiz .kzs-empty{
  padding:12px 14px; border:1px dashed var(--kzs-border); border-radius:10px; color:var(--kzs-muted);
  background:#fff; margin-top:8px;
}

/* Quick-Add */
#kzs-quiz #kzs-quickadd{ margin-top:10px; }
#kzs-quiz #kzs-quickadd .kzs-mini-wrap{ border:1px solid var(--kzs-border); border-radius:12px; padding:10px; background:#fff; }
#kzs-quiz #kzs-quickadd .kzs-mini-row{ display:flex; gap:10px; flex-wrap:wrap; }
#kzs-quiz #kzs-quickadd .kzs-mini-row.fuel select{ min-width:220px; }
#kzs-quiz #kzs-quickadd .kzs-mini-row.ymm > *{ flex:1 1 0; min-width:180px; }
#kzs-quiz #kzs-quickadd select{ width:100%; }
#kzs-quiz #kzs-quickadd .kzs-note{ color:var(--kzs-muted); margin:8px 2px 0; }

/* Driving pills */
#kzs-quiz #kzs_driving_for{ margin-left:.35rem; color:var(--kzs-muted); font-weight:600; }
#kzs-quiz #kzs-driving-group{ width:100%; }
#kzs-quiz #kzs-driving-group .kzs-pills{
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:10px;
  width:100%;
}
#kzs-quiz #kzs-driving-group .kzs-pill{
  display:flex; align-items:center; justify-content:center; text-align:center;
  border:1px solid var(--kzs-border); border-radius:14px; padding:14px 10px; background:#fff; cursor:pointer;
  font-weight:800; color:#374151;
  min-width:0;
}
#kzs-quiz #kzs-driving-group .kzs-pill:hover{ background:var(--kzs-soft); }
#kzs-quiz #kzs-driving-group .kzs-pill[aria-checked="true"]{
  background: var(--kzs-active-soft);
  border-color: #2d7de0;
  box-shadow: 0 0 0 3px rgba(57,143,252,.2);
}
#kzs-quiz #kzs-driving-group .kzs-pill:focus{ outline:2px solid rgba(57,143,252,.5); outline-offset:2px; }
#kzs-quiz #kzs-driving-custom{ display:none; margin-top:8px; }
#kzs-quiz #kzs-driving-custom.show{ display:block; }

/* Inline compare output */
#kzs-quiz .kzs-compare-out{
  margin-top:12px; padding:12px 14px;
  border:1px solid var(--kzs-border); background:#f9fafb; border-radius:10px; color:#374151;
}
#kzs-quiz .kzs-compare-out strong{ color:#111827; }

/* Compare cards */
#kzs-quiz .kzs-compare-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  width:100%;
  max-width:920px;
}
#kzs-quiz .kzs-compare-option{
  border:1px solid var(--kzs-border);
  border-radius:12px;
  background:#fff;
  padding:14px;
  text-align:center;
  display:flex;
  flex-direction:column;
  gap:10px;
  min-height:156px;
  cursor:pointer;
  align-items:center;
}
#kzs-quiz .kzs-compare-option:hover{ background:var(--kzs-soft); }
#kzs-quiz .kzs-compare-option:focus{ outline:2px solid var(--kzs-ring); outline-offset:2px; }
#kzs-quiz .kzs-compare-option[aria-checked="true"]{
  background: var(--kzs-active-soft);
  border-color: #2d7de0;
  box-shadow: 0 0 0 3px rgba(57,143,252,.2);
}
#kzs-quiz .kzs-compare-title{
  font-weight:700;
  color:var(--kzs-text);
  font-size:1.02rem;
  text-align:center;
}
#kzs-quiz .kzs-compare-media{
  margin-top:auto;
  border:1px dashed var(--kzs-border-2);
  border-radius:10px;
  min-height:78px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--kzs-muted);
  font-size:.9rem;
  background:#f8fafc;
  width:100%;
}
#kzs-quiz .kzs-compare-media img{
  display:block;
  width:100%;
  height:100%;
  max-height:160px;
  object-fit:cover;
  border-radius:8px;
}
@media (max-width: 768px){
  #kzs-quiz .kzs-compare-grid{
    grid-template-columns:1fr;
  }
}

/* Accessibility helpers */
#kzs-quiz [role="button"]{ cursor:pointer; }
#kzs-quiz [tabindex="0"]:focus{ outline:2px solid var(--kzs-ring); outline-offset:2px; }

/* Results table responsive */
@media (max-width: 640px){
  #kzs-quiz .kzs-results-table thead{ display:none; }
  #kzs-quiz .kzs-results-table tr{ display:block; border-top:1px solid var(--kzs-border); }
  #kzs-quiz .kzs-results-table td{ display:block; padding:.5rem .75rem; }
  #kzs-quiz .kzs-results-table td:last-child{ text-align:right; }
}

/* Gauge: hide numeric readout (left desktop gauge) */
#kzs-quiz .kzs-gauge-value { opacity: 0; pointer-events: none; }

/* ===== Overlay (moved here from H) ===== */
#kzs-overlay{
  position:fixed; inset:0; z-index:99999;
  display:none; align-items:center; justify-content:center;
  background:rgba(255,255,255,.55);
  backdrop-filter:saturate(1.05) blur(2px);
}
#kzs-overlay.show{ display:flex; }
.kzs-ovl-card{
  width:min(92vw,560px);
  background:#fff; color:#111827; border-radius:14px;
  border:1px solid #e5e7eb; padding:20px 22px;
  box-shadow:0 10px 30px rgba(0,0,0,.18);
  display:flex; flex-direction:column; align-items:center; text-align:center; gap:12px;
}
.kzs-ovl-spinner{
  width:56px; height:56px; border-radius:999px;
  border:4px solid #e5e7eb; border-top-color:#16a34a;
  animation:kzs-spin .75s linear infinite;
}
@keyframes kzs-spin{ to{ transform:rotate(360deg); } }
.kzs-ovl-title{ font-weight:800; font-size:18px; line-height:1.25; color:#111827; }
.kzs-ovl-snippet{ color:#374151; line-height:1.45; }

/* ===== Mobile layout (≤768px) ===== */
@media (max-width: 768px){

  /* Slightly darker body copy, larger base size */
  #kzs-quiz p, #kzs-report p { color: var(--kzs-text-2); }
  #kzs-quiz, #kzs-report { font-size: 18px; }

  /* Stronger form contrast + sizing */
  #kzs-quiz .kzs-label{
    font-size: 16px;
    font-weight: 700;
    color: #111827;
  }
  #kzs-quiz input[type="text"],
  #kzs-quiz input[type="tel"],
  #kzs-quiz input[type="email"],
  #kzs-quiz input[type="number"],
  #kzs-quiz select{
    font-size: 16px;
    padding: .7rem .85rem;
    border-color: #cbd5e1;
    box-shadow: inset 0 1px 0 rgba(0,0,0,.04);
  }
  #kzs-quiz input::placeholder{ color:#94a3b8; }

  /* Mobile steps bar (tabs) */
  .kzs-quiz-wrap .kzs-steps, #kzs-quiz .kzs-steps {
    position: sticky;
    top: 0;
    z-index: 50;
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 10px 12px;
    margin: 0 0 12px;
    background: #fff;
    border-bottom: 1px solid var(--kzs-border);
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }
  /* Remove main card rounding on mobile */
  #kzs-quiz .kzs-main, .kzs-quiz-wrap .kzs-main{
    border-radius: 0 !important;
  }
  /* Prevent horizontal scroll bleed from the tabs */
  #kzs-quiz, .kzs-quiz-wrap{ overflow-x: hidden; }
  #kzs-steps{ overflow-x: auto; overscroll-behavior-x: contain; }
  #kzs-steps .kzs-step {
    flex: 0 0 auto;
    border: 1px solid var(--kzs-border);
    background: var(--kzs-soft);
  }
  #kzs-steps .kzs-step.active{
    background: var(--kzs-active-soft);
    border-color: #2d7de0;
  }
  #kzs-steps .kzs-step-title{ white-space: nowrap; }
  #kzs-steps .kzs-ico { font-size: 1.1rem; width: 1.2em; height: 1.2em; }
  #kzs-steps .kzs-gauge-wrap,
  #kzs-steps #kzs-veh-sublist { display: none !important; }

  /* Footer shown (mobile-only) alongside sticky tabs */
  #kzs-mobile-footer{ display: flex; }

  /* Room for sticky steps */
  #kzs-quiz .kzs-main, .kzs-quiz-wrap .kzs-main { padding-bottom: 12px; }

  /* Mobile: use footer nav only */
  #kzs-quiz .kzs-pane .kzs-prev,
  #kzs-quiz .kzs-pane .kzs-next,
  #kzs-quiz .kzs-pane .kzs-btn-row{ display: none; }

  /* Driving pills: keep 2-col until narrow, then stack */
#kzs-quiz #kzs-driving-group .kzs-pills{
  display: grid;
  width: 100%;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-columns: 1fr;
  justify-items: stretch;
  align-items: stretch;
  margin-bottom: 12px;
}
#kzs-quiz #kzs-driving-custom.show{
  display:block;
  margin-left:15px;
}
  #kzs-quiz #kzs-driving-group .kzs-pill{
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  /* Pane min-height tuned for mobile */
  #kzs-quiz .kzs-pane, #kzs-report .kzs-pane{
    min-height: clamp(380px, 40vh, 680px);
  }
}

@media (max-width: 420px){
  #kzs-quiz #kzs-driving-group .kzs-pills{ grid-template-columns: 1fr; }
}

/* Desktop should not show the sticky footer */
@media (min-width: 769px){
  #kzs-mobile-footer{ display: none !important; }
}

/* ===== Mobile Footer Nav (authoritative, consolidated) ===== */
@media (max-width: 768px){
  body #kzs-mobile-footer{
    display:flex !important;
    position:fixed !important;
  }
  #kzs-mobile-footer{
    position:fixed; left:0; right:0; bottom:env(safe-area-inset-bottom); z-index:99990;
    background:#fff; /* hard floor */
    border-top:1px solid var(--kzs-border);
    padding:8px 12px 6px;
    display:flex; align-items:center; gap:10px; justify-content:space-between;
    box-shadow:0 -6px 18px rgba(0,0,0,.05);
    box-sizing:border-box;
    isolation:isolate;
    padding-right:calc(10px + env(safe-area-inset-right));
    max-width:100vw;
    overflow:hidden;
  }

  /* Base button shape (theme-proof) */
  #kzs-mobile-footer .kzs-nav-btn{
  position:relative;
  display:inline-flex; align-items:center; justify-content:center;
  height:44px; padding:0 14px;
  border-radius:10px; border:1px solid var(--kzs-border-2);
  font-weight:700;
  font-size:16px !important;
  line-height:1.1;
  letter-spacing:0;
  text-transform:none;
  -webkit-appearance:none; appearance:none; background:transparent; background-image:none;
  box-shadow:0 1px 0 var(--kzs-border-2), 0 2px 8px rgba(0,0,0,.08);
  overflow:hidden; z-index:0;
}

  /* Paint layer — ONE place we allow !important to beat theme BGs */
  #kzs-mobile-footer .kzs-nav-btn::before{
    content:""; position:absolute; inset:0; border-radius:inherit; z-index:-1;
    background:var(--kzs-soft) !important;
  }
  #kzs-mobile-footer .kzs-nav-btn[disabled]{ opacity:.45; cursor:not-allowed; }

  /* Prev — soft green, dark text */
  #kzs-mobile-footer #kzs_mb_prev{ color:var(--kzs-text); border-color:var(--kzs-border-2); }
  #kzs-mobile-footer #kzs_mb_prev::before{ background:var(--kzs-active-soft) !important; }
  #kzs-mobile-footer #kzs_mb_prev:hover::before{ background:var(--kzs-soft-2) !important; }

  /* Next — solid green, white text */
  #kzs-mobile-footer #kzs_mb_next{ color:#fff; border-color:var(--kzs-active); }
  #kzs-mobile-footer #kzs_mb_next::before{ background:var(--kzs-active) !important; }
  #kzs-mobile-footer #kzs_mb_next:hover::before{ background:var(--kzs-active-600) !important; }

  /* Reset — navy, white text */
  #kzs-mobile-footer #kzs_mb_reset{ color:#fff; border-color:#0B0B69; border-radius:14px; }
  #kzs-mobile-footer #kzs_mb_reset::before{ background:#0B0B69 !important; }
  #kzs-mobile-footer #kzs_mb_reset:hover::before{ background:#0a0a57 !important; }

  /* Progress pill */
  #kzs-mg{
    position:relative; flex:1 1 auto; min-width:0; height:44px;
    border-radius:10px; border:1px solid var(--kzs-border);
    background:#e5e7eb; display:flex; align-items:center; justify-content:center; padding:0 14px;
    transition:background-color .25s ease, box-shadow .25s ease;
  }
  #kzs-mg .content{ position:relative; z-index:1; display:flex; align-items:center; gap:10px; }
  #kzs-mg .label{
    font-weight:700;
    font-size:16px;
    color:#ffffff;
    letter-spacing:.2px;
  }
  #kzs-mg .val, #kzs-mg .unit{ display:none; }

  /* Tier backgrounds (dual scheme) */
  #kzs-mg.tier-low,     #kzs-mg.low     { background:#dcfce7; }
  #kzs-mg.tier-med,     #kzs-mg.med     { background:#fef9c3; }
  #kzs-mg.tier-high,    #kzs-mg.high    { background:#fee2e2; }
  #kzs-mg.tier-extreme, #kzs-mg.extreme { background:#fecaca; }

  /* Very narrow devices */
  @media (max-width:380px){
    #kzs-mobile-footer{ gap:6px; padding-left:8px; padding-right:8px; }
    #kzs-mobile-footer .kzs-nav-btn{ padding:0 12px; font-size:13px; }
  }
}
/* --- Footer pills: final color lock (beats theme button rules) --- */
@media (max-width:768px){
  /* paint BOTH the element and the ::before layer */
  #kzs-mobile-footer #kzs_mb_next,
  #kzs-mobile-footer #kzs_mb_next::before{
    background-color: var(--kzs-active) !important;
  }
  #kzs-mobile-footer #kzs_mb_next{
    border-color: #398ffc !important;
    color:#fff !important;
  }
  #kzs-mobile-footer #kzs_mb_prev,
  #kzs-mobile-footer #kzs_mb_prev::before{
    background-color: var(--kzs-active-soft) !important;
  }
  #kzs-mobile-footer #kzs_mb_prev{
    border-color: var(--kzs-border-2) !important;
    color: var(--kzs-text) !important;
  }
  #kzs-mobile-footer #kzs_mb_reset,
  #kzs-mobile-footer #kzs_mb_reset::before{
    background-color:#0B0B69 !important;
  }
  #kzs-mobile-footer #kzs_mb_reset{
    border-color:#0B0B69 !important;
    color:#fff !important;
  }
}

/* --- FINAL OVERRIDE: lock footer button paints (beats theme 'button { background: ... }') --- */
@media (max-width:768px){
  /* NEXT: solid green */
  #kzs-mobile-footer button#kzs_mb_next.kzs-nav-btn,
  #kzs-mobile-footer #kzs_mb_next{
    background: var(--kzs-active) !important;
    background-image: none !important;
    border-color: #398ffc !important;
    color: #fff !important;
  }
  #kzs-mobile-footer #kzs_mb_next:hover{
    background: var(--kzs-active-600) !important;
    border-color: var(--kzs-active-600) !important;
  }

  /* PREV: soft green */
  #kzs-mobile-footer button#kzs_mb_prev.kzs-nav-btn,
  #kzs-mobile-footer #kzs_mb_prev{
    background: var(--kzs-active-soft) !important;
    background-image: none !important;
    border-color: var(--kzs-border-2) !important;
    color: var(--kzs-text) !important;
  }
  #kzs-mobile-footer #kzs_mb_prev:hover{
    background: var(--kzs-soft-2) !important;
  }

  /* RESET: brand navy */
  #kzs-mobile-footer button#kzs_mb_reset.kzs-nav-btn,
  #kzs-mobile-footer #kzs_mb_reset{
    background: #0B0B69 !important;
    background-image: none !important;
    border-color: #0B0B69 !important;
    color: #fff !important;
  }
  #kzs-mobile-footer #kzs_mb_reset:hover{
    background: #0a0a57 !important;
  }
}
/* FINAL MOBILE BUTTON PAINT LOCK — executes after everything else */
@media (max-width:768px){
  #kzs-mobile-footer #kzs_mb_next{
    background: var(--kzs-active) !important;
    background-image: none !important;
    border-color: #398ffc !important;
    color: #fff !important;
  }
  #kzs-mobile-footer #kzs_mb_next:hover{
    background: var(--kzs-active-600) !important;
    border-color: var(--kzs-active-600) !important;
  }

  #kzs-mobile-footer #kzs_mb_prev{
    background: var(--kzs-active-soft) !important;
    background-image: none !important;
    border-color: var(--kzs-border-2) !important;
    color: var(--kzs-text) !important;
  }
  #kzs-mobile-footer #kzs_mb_prev:hover{
    background: var(--kzs-soft-2) !important;
  }

  #kzs-mobile-footer #kzs_mb_reset{
    background: #0B0B69 !important;
    background-image: none !important;
    border-color: #0B0B69 !important;
    color: #fff !important;
  }
  #kzs-mobile-footer #kzs_mb_reset:hover{
    background: #0a0a57 !important;
  }
}
/* === Mobile Footer Fix Pack (lock button paints) === */
@media (max-width:768px){

  /* Footer background must always be solid */
  #kzs-mobile-footer{
    background:#fff !important;
    border-top:1px solid var(--kzs-border);
    isolation:isolate;
  }

  /* Normalize any theme cosmetics on our buttons */
#kzs-mobile-footer .kzs-nav-btn{
  -webkit-appearance:none; appearance:none;
  background-image:none !important;
  background:transparent;            /* we'll paint per-ID below */
  filter:none !important;
  text-transform:none;
  letter-spacing:0;
  border-radius:14px; border:1px solid var(--kzs-border-2);
  height:44px; padding:0 14px;
  font-weight:700;
  font-size:16px !important;
  line-height:1.1;
  box-shadow:0 1px 0 var(--kzs-border-2), 0 2px 8px rgba(0,0,0,.08);
}

  #kzs-mobile-footer .kzs-nav-btn[disabled]{ opacity:.45; cursor:not-allowed; }

  /* PREV — soft green pill, dark text */
  #kzs-mobile-footer button#kzs_mb_prev.kzs-nav-btn{
    background-color:var(--kzs-active-soft) !important;
    border-color:var(--kzs-border-2) !important;
    color:var(--kzs-text) !important;
  }
  #kzs-mobile-footer button#kzs_mb_prev.kzs-nav-btn:hover{
    background-color:var(--kzs-soft-2) !important;
  }

  /* NEXT — solid green, white text */
  #kzs-mobile-footer button#kzs_mb_next.kzs-nav-btn{
    background-color:var(--kzs-active) !important;
    border-color:#398ffc !important;
    color:#fff !important;
  }
  #kzs-mobile-footer button#kzs_mb_next.kzs-nav-btn:hover{
    background-color:var(--kzs-active-600) !important;
    border-color:var(--kzs-active-600) !important;
  }

  /* RESET — brand navy, white text */
  #kzs-mobile-footer button#kzs_mb_reset.kzs-nav-btn{
    background-color:#0B0B69 !important;
    border-color:#0B0B69 !important;
    color:#fff !important;
  }
  #kzs-mobile-footer button#kzs_mb_reset.kzs-nav-btn:hover{
    background-color:#0a0a57 !important;
  }
}
/* Apply input/select styles to the report as well */
#kzs-report select,
#kzs-report input[type="text"],
#kzs-report input[type="tel"],
#kzs-report input[type="email"],
#kzs-report input[type="number"]{
  width:100%; padding:.55rem .75rem; border:1px solid var(--kzs-border);
  border-radius:10px; background:#fff; color:#kzs-text); line-height:1.3;
}
#kzs-report select:focus,
#kzs-report input:focus{
  outline:2px solid var(--kzs-ring); outline-offset:2px; border-color:var(--kzs-active);
}

/* Status + select + button inside Step 7 finish block */
#kzs-report .kzs-status { font-size:13px; color:#4b5563; }
#kzs-report .kzs-select { width:100%; padding:.55rem .75rem; border:1px solid var(--kzs-border); border-radius:10px; background:#fff; }
#kzs-report .kzs-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:20px 18px; font-weight:700; border-radius:10px;
  background:#0d0d7a; color:#fff; border:none; cursor:pointer;
  font-size:16px;
}
#kzs-report .kzs-btn:focus{ outline:3px solid var(--kzs-ring); outline-offset:2px; }
#kzs-report .kzs-btn[disabled]{ opacity:.6; cursor:not-allowed; }

/* Stripe checkout shell – no extra card, just a wrapper */
#kzs-checkout-shell{
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
  max-width: none;
}

/* Make any Stripe iframe/element stretch */
#kzs-checkout-shell iframe,
#kzs-checkout-shell .StripeElement,
#kzs-checkout-shell [id*="stripe"]{ width:100% !important; }

/* If your pane/main area is a grid or flex with an empty right column,
   collapse to a single column for Step 7 only */
#kzs-report .kzs-pane[data-step="7"]{
  display: block !important;        /* beats any grid/flex two-column layout */
}
#kzs-report .kzs-pane[data-step="7"] .kzs-row{
  display:flex; gap:10px; flex-wrap:wrap;
}
/* Kill the quiz two-column grid on the REPORT page */
#kzs-report.kzs-quiz-wrap,          /* in case id and class share the node */
#kzs-report .kzs-quiz-wrap{
  display: block !important;
}

/* If the layout is using CSS grid on .kzs-quiz-wrap, collapse to one column */
#kzs-report .kzs-quiz-wrap{
  grid-template-columns: 1fr !important;
}

/* Hide any steps/sidebar that might exist by theme/template */
#kzs-report .kzs-steps{ display:none !important; }

/* Step 7 – single column, no outer white card */
#kzs-report .kzs-main{
  width: 100% !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

#kzs-report .kzs-pane[data-step="7"]{
  display: block !important;
  width: 100% !important;
}

#kzs-report #kzs_finish_block{
  width: 100% !important;
  max-width: none !important;
}

/* Report checkout layout polish */
#kzs-report .kzs-pane[data-step="7"] { padding-top: 6px; }
#kzs-report #kzs_finish_block .kzs-row { gap: 12px; }
#kzs-report #kzs_finish_block .kzs-field { margin: 8px 0; }
#kzs-report .kzs-plan-tiers{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:50px;
}
#kzs-report .kzs-report-hero{
  text-align:center;
  margin-bottom:22px;
}
#kzs-report .kzs-report-title{
  margin:0 0 6px;
}
#kzs-report .kzs-report-subtitle{
  margin:0;
  color:var(--kzs-muted);
}
#kzs-report .kzs-plan-card{
  background: var(--kzs-soft);
  border:1px solid var(--kzs-border);
  border-radius:10px;
  padding:25px;
  text-align:left;
  cursor:pointer;
  font:inherit;
  color:var(--kzs-text);
  display:flex;
  flex-direction:column;
  min-height:150px;
  position:relative;
}
#kzs-report .kzs-plan-footer{
  margin-top:auto;
  display:flex;
  flex-direction:column;
  gap:8px;
  text-align:center;
}
#kzs-report .kzs-plan-card:hover{
  background: var(--kzs-soft-2);
}
#kzs-report .kzs-plan-card:focus{
  outline:2px solid var(--kzs-ring);
  outline-offset:2px;
}
#kzs-report .kzs-plan-card.is-selected{
  background: var(--kzs-active-soft);
  border-color:#2d7de0;
  box-shadow:0 0 0 1px rgba(209,213,219,.6);
}
#kzs-report .kzs-plan-title{
  font-weight:700;
  margin:0 0 4px;
  font-size:30px;
}
#kzs-report .kzs-plan-copy{
  font-size:.9rem;
  color:var(--kzs-muted);
  margin:0 0 8px;
  white-space:normal;
  line-height:1.3;
  text-transform:none;
}
#kzs-report .kzs-plan-list{
  margin:0 0 10px;
  padding:0;
  list-style:none;
  display:grid;
  gap:0;
}
#kzs-report .kzs-plan-list li{
  position:relative;
  padding-left:22px;
  padding:25px 0 15px 40px;
  font-size:.9rem;
  color:var(--kzs-text);
  line-height:1.35;
}
#kzs-report .kzs-plan-list li::before{
  content:"\2713";
  position:absolute;
  left:0;
  top:25px;
  font-weight:700;
  color:var(--kzs-text);
}
#kzs-report .kzs-plan-price{
  font-weight:600;
  margin-top:0;
}
#kzs-report .kzs-plan-cta{
  width:100%;
}
#kzs-report .kzs-plan-card[data-tier="champion"] .kzs-plan-cta{
  background: linear-gradient(90deg, #11ad1e, #1216ab);
  color:#fff;
}
#kzs-report .kzs-plan-card[data-tier="hero"] .kzs-plan-cta{
  background: linear-gradient(90deg, #f4da88, #bb861b, #f4da88);
  color:#fff;
}
#kzs-report .kzs-btn-ghost{
  background:#f3f6f4;
  color:#22302a;
}
#kzs-report .kzs-report-step{
  display:none;
}
#kzs-report .kzs-report-step.is-active{
  display:block;
}
#kzs-report .kzs-plan-badge{
  position:absolute;
  top:-10px;
  left:50%;
  transform:translateX(-50%);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:2px 10px;
  border-radius:999px;
  font-size:.7rem;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  background:#0f1a13;
  color:#fff;
  box-shadow:0 0 0 4px #fff;
}
@media (max-width: 900px){
  #kzs-report .kzs-plan-tiers{
    grid-template-columns:1fr;
  }
}

/* Stripe Address + Card rows */
#kzs_report #kzs_address_el,
#kzs-report #kzs_card_number,
#kzs-report #kzs_card_exp,
#kzs-report #kzs_card_cvc { background:#fff; }

/* On wide screens keep card inputs on one line; on small screens stack */
@media (max-width: 720px){
  #kzs-report #kzs_finish_block .kzs-row { flex-direction: column; }
}
/* Size modifiers for special CTA */
#kzs-quiz .kzs-btn-lg,
#kzs-report .kzs-btn-lg{
  padding: .75rem 1.15rem;     /* bigger hit area */
  font-size: 1rem;             /* slight type upsize */
  border-radius: 12px;         /* a touch rounder to read as “primary” */
  line-height: 1.1;
}
#kzs-quiz .kzs-btn-wide,
#kzs-report .kzs-btn-wide{ 
  min-width: 220px;            /* keeps that “wide” look */
}
/* icon spacing stays tidy at larger size */
#kzs-quiz .kzs-btn-lg i,
#kzs-report .kzs-btn-lg i{ margin-right: .5rem; }

/* Desktop Reset: match Prev/Next + beat theme button paints */
#kzs-quiz .kzs-desktop-controls .kzs-btn,
#kzs-quiz .kzs-desktop-controls button.kzs-btn{
  -webkit-appearance:none; appearance:none;
  background-image:none; box-shadow:none; filter:none;
  text-transform:none; letter-spacing:0;
}

#kzs-quiz .kzs-desktop-controls .kzs-btn-ghost{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.55rem .9rem; border-radius:10px; font-weight:600; line-height:1.1;
  background:transparent; border:1px solid var(--kzs-border-2);
  color: var(--kzs-text); cursor:pointer;
}
#kzs-quiz .kzs-desktop-controls .kzs-btn-ghost:hover{
  background: var(--kzs-soft-2);
}

/* Layout helpers (ensure far-right alignment) */
#kzs-quiz .kzs-desktop-controls{ display:flex; align-items:center; gap:.75rem; }
#kzs-quiz .kzs-controls-left{ display:flex; align-items:center; gap:.5rem; }
#kzs-quiz .kzs-controls-right{ margin-left:auto; display:flex; align-items:center; }

/* Optional: hide desktop reset only on truly small screens */
@media (max-width:640px){ .kzs_desktop_reset{ display:none !important; } }

.pac-container { z-index: 999999 !important; }

/* ============================================================================
   Account page shell – mirrors quiz layout (#kzs-account)
   ========================================================================== */

/* Shell spacing + layout */
#kzs-account{
  padding: 2rem 1rem;
  width: min(1340px, calc(100vw - 2rem));
  max-width: none;
  margin: 0 auto;
  display: block;
  box-sizing: border-box;
}
#kzs-account .kzs-account-card{
  max-width: none;
  width: 100%;
  margin: 0 auto;
  background: var(--kzs-bg);
  border: 1px solid var(--kzs-border);
  box-shadow: 0 10px 30px rgba(0,0,0,.06);
  border-radius: 22px;
  padding: 0;
  min-height:600px;
  overflow:hidden;
  box-sizing: border-box;
}
#kzs-account .kzs-account-columns{
  display:flex;
  gap:0;
  align-items: stretch;
  width: 100%;
  box-sizing: border-box;
}

/* Each column is its own card, like the quiz */
#kzs-account .kzs-account-sidebar,
#kzs-account .kzs-account-main{
  background: var(--kzs-bg);
  border-radius: 0;
  border: 0;
  box-shadow: none;
}

#kzs-account .kzs-account-sidebar{
  width:300px;
  flex:0 0 300px;
  padding: 1.5rem 1.35rem;
  display:flex;
  flex-direction:column;
  gap:1.5rem;
  min-height: 400px; 
  border-right:0;
  border-radius:0;
}
#kzs-account .kzs-account-main{
  flex:1 1 auto;
  width:100%;
  min-width:0;
  padding: 1.75rem 2rem;
}

/* Sidebar nav – like quiz steps */
#kzs-account .kzs-account-nav{
  display:flex;
  flex-direction:column;
  gap:5px;
}
#kzs-account .kzs-account-nav-item{
  border:1px solid var(--kzs-border);
  text-align:left;
  padding:.55rem .7rem;
  border-radius:10px;
  cursor:pointer;
  font-size:.95rem;
  font-weight:600;
  letter-spacing:0;
  text-transform:none;
  background: var(--kzs-soft);
  color: var(--kzs-text);
  transition: background-color .18s ease, box-shadow .18s ease, color .18s ease;
  display:flex;
  align-items:center;
  gap:.6rem;
}
#kzs-account .kzs-account-nav-item:hover{
  background: var(--kzs-soft-2);
}
#kzs-account .kzs-account-nav-item.is-active{
  background: var(--kzs-active-soft);
  color: var(--kzs-text);
  border-color:#2d7de0;
}
#kzs-account .kzs-account-nav-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:1.5em;
  height:1.5em;
  font-size:1.1rem;
}

/* Gauge alignment */
#kzs-account .kzs-account-gauge{
  margin:0 12px 12px;
  padding-bottom:16px;
  border-bottom:1px solid var(--kzs-border);
}

/* Panes */
#kzs-account .kzs-account-pane{
  display:none;
}
#kzs-account .kzs-account-pane.is-active{
  display:block;
}
#kzs-account .kzs-account-heading{
  font-size:1.45rem;
  margin:0 0 .35rem;
}
#kzs-account .kzs-account-intro{
  margin:0 0 1.5rem;
  color:var(--kzs-muted);
}

/* Sticker section */
#kzs-account .kzs-sticker-section{
  margin-top:1rem;
}
#kzs-account .kzs-sticker-current{
  margin-bottom:1.5rem;
  position:relative;
}
#kzs-account .kzs-sticker-subheading{
  font-size:1rem;
  font-weight:600;
  margin-bottom:.5rem;
}
#kzs-account .kzs-sticker-image-wrap{
  max-width:420px;
  border-radius:16px;
  overflow:hidden;
  border:1px solid var(--kzs-border);
  background:#fff;
}
#kzs-account .kzs-sticker-image{
  display:block;
  width:100%;
  height:auto;
}
#kzs-account .kzs-sticker-remove{
  position:absolute;
  top:12px;
  right:12px;
  width:32px;
  height:32px;
  border-radius:999px;
  border:1px solid var(--kzs-border);
  background:#fff;
  color:var(--kzs-text);
  font-size:18px;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow:0 4px 10px rgba(0,0,0,.08);
}
#kzs-account .kzs-sticker-remove:hover{
  background:var(--kzs-soft);
}
#kzs-account .kzs-sticker-meta{
  font-size:.9rem;
  color:var(--kzs-muted);
  margin-top:.5rem;
}
#kzs-account .kzs-sticker-empty{
  padding:12px 14px;
  border-radius:12px;
  border:1px dashed var(--kzs-border);
  background:#fff;
  color:var(--kzs-muted);
}

/* My Vehicle cards */
#kzs-account .kzs-sticker-current,
#kzs-account .kzs-sticker-form,
#kzs-account .kzs-sticker-empty{
  background: var(--kzs-bg);
  border: 1px solid var(--kzs-border);
  border-radius: 20px;
  box-shadow: 0 10px 30px rgba(0,0,0,.06);
  padding: 20px 22px;
}

/* My Vehicle pane — full width single column stack */
#kzs-account .kzs-account-pane[data-kzs-tab="vehicle"] .kzs-sticker-section{
  display:flex;
  flex-direction:column;
  gap:1.25rem;
}
#kzs-account .kzs-account-pane[data-kzs-tab="vehicle"] .kzs-sticker-current,
#kzs-account .kzs-account-pane[data-kzs-tab="vehicle"] .kzs-sticker-empty,
#kzs-account .kzs-account-pane[data-kzs-tab="vehicle"] .kzs-sticker-form{
  width:100%;
}
#kzs-account .kzs-account-pane[data-kzs-tab="vehicle"] .kzs-sticker-form{
  border-top:0;
  padding-top:22px;
  margin-top:0;
}
@media (max-width: 900px){
  #kzs-account .kzs-account-pane[data-kzs-tab="vehicle"] .kzs-sticker-section{
    display:block;
    padding:0 1rem;
  }
  #kzs-account .kzs-account-pane[data-kzs-tab="vehicle"] .kzs-sticker-current,
  #kzs-account .kzs-account-pane[data-kzs-tab="vehicle"] .kzs-sticker-empty{
    margin-bottom:1rem;
  }
  #kzs-account .kzs-account-pane[data-kzs-tab="vehicle"] .kzs-sticker-form{
    border-top:0;
    padding-top:22px;
    margin-top:0;
  }
}

/* Sticker form */
#kzs-account .kzs-sticker-form{
  border-top:0;
  padding-top:0;
  margin-top:0;
}
#kzs-account .kzs-sticker-field{
  margin-bottom:1rem;
}
#kzs-account .kzs-sticker-field label,
#kzs-account .kzs-sticker-permission legend{
  display:block;
  font-weight:600;
  margin-bottom:.5rem;
}
#kzs-account .kzs-sticker-permission label{
  margin-right:1.5rem;
  font-weight:500;
}

/* Impact panel */
#kzs-account .kzs-impact-panel{
  background:transparent;
  padding:0;
}
#kzs-account .kzs-impact-cards{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:18px;
  align-items:stretch;
}
#kzs-account .kzs-impact-card{
  background:#fff;
  border:1px solid var(--kzs-border);
  border-radius:16px;
  padding:14px 16px;
  box-shadow:0 4px 14px rgba(0,0,0,.04);
  position:relative;
  min-height:110px;
  display:flex;
  flex-direction:column;
  gap:.28rem;
}
#kzs-account .kzs-impact-card--streak,
#kzs-account .kzs-impact-card--compare{
  grid-column:1 / -1;
}
#kzs-account .kzs-impact-card--streak{
  background:#0B0B69;
  color:#fff;
  border-color:transparent;
  flex-direction:row;
  align-items:center;
  gap:1.5rem;
}
#kzs-account .kzs-impact-card--streak .kzs-streak-text{
  flex:1;
  display:flex;
  flex-direction:column;
  gap:.35rem;
}
#kzs-account .kzs-impact-card--streak .kzs-impact-value,
#kzs-account .kzs-impact-card--streak .kzs-impact-value span{
  font-size:2.4rem;
  color:#fff;
}
#kzs-account .kzs-impact-card--trees{
  padding-right:16px;
}
#kzs-account .kzs-trees-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
}
#kzs-account .kzs-trees-header .kzs-impact-value{
  flex:1;
}
#kzs-account .kzs-trees-img{
  height:56px;
  width:auto;
  flex-shrink:0;
  display:block;
}
#kzs-account .kzs-impact-card--streak .kzs-impact-label,
#kzs-account .kzs-impact-card--streak .kzs-impact-note,
#kzs-account .kzs-impact-card--streak .kzs-impact-unit{
  color:#dbe3ff;
}
#kzs-account .kzs-impact-label{
  margin:0 0 .4rem;
  font-size:.85rem;
  font-weight:600;
  color:#0B0B69;
}
#kzs-account .kzs-impact-value{
  margin:0;
  font-size:2.2rem;
  font-weight:700;
  display:flex;
  align-items:baseline;
  gap:.35rem;
  color:var(--kzs-text);
}
#kzs-account .kzs-impact-unit{
  font-size:.95rem;
  font-weight:400;
  color:var(--kzs-muted);
}
#kzs-account .kzs-impact-sub{
  color:var(--kzs-muted);
}
#kzs-account .kzs-impact-note{
  margin:.6rem 0 0;
  color:var(--kzs-muted);
  font-size:.9rem;
}
#kzs-account .kzs-impact-icon{
  position:absolute;
  right:0;
  bottom:0;
  width:78px;
  height:54px;
  color:#0B0B69;
  pointer-events:none;
}
#kzs-account .kzs-impact-icon svg{
  width:100%;
  height:100%;
  display:block;
}
#kzs-account .kzs-impact-card--compare .kzs-impact-note{
  margin-top:0;
  line-height:1.45;
  font-size:.95rem;
}
#kzs-account .kzs-impact-empty{
  margin-top:1.25rem;
  padding:16px;
  border-radius:14px;
  border:1px dashed var(--kzs-border);
  color:var(--kzs-muted);
  text-align:center;
  background:#fff;
}

/* Streak dot grid */
#kzs-account .kzs-streak-dots{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:6px;
  flex-shrink:0;
  width:220px;
}
#kzs-account .kzs-streak-dot{
  width:100%;
  aspect-ratio:1;
  border-radius:3px;
  background:rgba(255,255,255,.15);
}
#kzs-account .kzs-streak-dot.is-done{
  background:rgba(255,255,255,.4);
}
#kzs-account .kzs-streak-dot.is-active{
  background:#4ade80;
}

/* Card top row (label + chip) */
#kzs-account .kzs-impact-card-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:.5rem;
  margin-bottom:.1rem;
}
#kzs-account .kzs-impact-card-top .kzs-impact-label{
  margin:0;
}

/* Pill chips */
#kzs-account .kzs-impact-chip{
  display:inline-block;
  padding:.25rem .65rem;
  border-radius:999px;
  font-size:.72rem;
  font-weight:600;
  line-height:1.3;
  white-space:nowrap;
  text-align:center;
  flex-shrink:0;
}
#kzs-account .kzs-impact-chip--green{
  background:#dcfce7;
  color:#166534;
}
#kzs-account .kzs-impact-chip--navy{
  background:#e0e7ff;
  color:#1e2a78;
}
#kzs-account .kzs-impact-chip small{
  display:block;
  font-size:.68rem;
  font-weight:500;
}

/* Secondary sub-label */
#kzs-account .kzs-impact-sub{
  margin:.1rem 0 .5rem;
  font-size:.82rem;
  color:var(--kzs-muted);
}

/* Progress bar */
#kzs-account .kzs-impact-bar-wrap{
  display:flex;
  align-items:center;
  gap:.6rem;
  margin:.3rem 0 .5rem;
}
#kzs-account .kzs-impact-bar{
  flex:1;
  height:7px;
  border-radius:999px;
  background:var(--kzs-border);
  overflow:hidden;
}
#kzs-account .kzs-impact-bar-fill{
  height:100%;
  border-radius:999px;
  background:#0B0B69;
  transition:width .4s ease;
}
#kzs-account .kzs-impact-bar-pct{
  font-size:.78rem;
  font-weight:600;
  color:var(--kzs-muted);
  min-width:2.2rem;
  text-align:right;
}

/* Icon badge note */
#kzs-account .kzs-impact-badge{
  display:flex;
  align-items:center;
  gap:.45rem;
  margin-top:auto;
  padding:.45rem .65rem;
  border-radius:10px;
  background:var(--kzs-soft);
  font-size:.82rem;
  color:var(--kzs-muted);
}
#kzs-account .kzs-impact-badge i{
  flex-shrink:0;
  font-size:.8rem;
  color:#0B0B69;
}

/* Comparison stat boxes */
#kzs-account .kzs-compare-stats{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.6rem;
  margin-top:auto;
}
#kzs-account .kzs-compare-stat{
  display:flex;
  align-items:center;
  gap:.5rem;
  padding:.5rem .6rem;
  border-radius:10px;
  background:var(--kzs-soft);
}
#kzs-account .kzs-compare-stat i{
  font-size:1.1rem;
  color:#0B0B69;
  flex-shrink:0;
}
#kzs-account .kzs-compare-stat div{
  display:flex;
  flex-direction:column;
  gap:.1rem;
}
#kzs-account .kzs-compare-stat strong{
  font-size:.78rem;
  font-weight:700;
  color:var(--kzs-text);
  line-height:1.2;
}
#kzs-account .kzs-compare-stat span{
  font-size:.72rem;
  color:var(--kzs-muted);
  line-height:1.2;
}

@media (max-width: 600px){
  #kzs-account .kzs-impact-value{ font-size:1.6rem; }
  #kzs-account .kzs-compare-stats{ grid-template-columns:1fr; }
}

/* ===== Mobile Accordion Layout (≤768px) ===== */
@media (max-width: 768px){
  #kzs-account{
      padding:0;
      width:100vw;
      max-width:100%;
      margin:0;
    }
  #kzs-account .kzs-account-card{
    border-radius:0;
    width:100%;
    height:auto;
    min-height:auto;
    overflow:visible;
  }

  #kzs-account .kzs-account-columns{
    display:block;
    gap:0;
  }

  /* Mobile: tabs layout matching quiz */
  #kzs-account .kzs-account-sidebar{
    width:100%;
    padding:0;
    display:block;
    min-height:auto;
    background:transparent;
    border:none;
    box-shadow:none;
    margin:0;
  }

  /* Main content takes full width */
  #kzs-account .kzs-account-main{
    width:100%;
    padding:0;
    border-radius:0;
    border:none;
    box-shadow:none;
    overflow-x:hidden;
  }

  /* Panes behave like tabs (only active visible) */
  #kzs-account .kzs-account-pane{
    background: var(--kzs-bg);
    border-radius:0;
    border:0;
    box-shadow:none;
    padding:0;
    display:none;
    width:100%;
    box-sizing:border-box;
    padding-bottom:2.5rem;
  }

  /* Active pane visible */
  #kzs-account .kzs-account-pane.is-active{
    display:block;
  }

  /* Horizontal tabs */
  #kzs-account .kzs-account-nav{
      display:flex;
      flex-direction:row;
      flex-wrap:nowrap;
      gap:8px;
      overflow-x:auto;
      overscroll-behavior-x: contain;
      padding:10px 12px;
      margin:0 0 12px;
      background:#fff;
      border-bottom:1px solid var(--kzs-border);
      -webkit-overflow-scrolling:touch;
      scrollbar-width:thin;
      position:sticky;
      top:0;
      z-index:50;
    }

  #kzs-account .kzs-account-nav-item{
    flex:0 0 auto;
    padding:.55rem .7rem;
    border-radius:10px;
    border:1px solid var(--kzs-border);
    background: var(--kzs-soft);
    color: var(--kzs-text);
    font-size:.95rem;
    text-align:left;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    transition: background-color 0.18s ease, color 0.18s ease;
  }

  #kzs-account .kzs-account-nav-item:hover{
    background: var(--kzs-soft);
  }

  #kzs-account .kzs-account-nav-item.is-active{
    background: var(--kzs-active-soft);
    color: var(--kzs-text);
    border-color:#2d7de0;
  }

  /* Content inside accordion pane */
  #kzs-account .kzs-account-pane .kzs-account-heading,
  #kzs-account .kzs-account-pane .kzs-account-intro,
  #kzs-account .kzs-account-pane > *:not(.kzs-account-heading):not(.kzs-account-intro){
    padding:0 1rem;
  }

  #kzs-account .kzs-account-pane .kzs-account-heading{
    padding-top:1rem;
    font-size:1.2rem;
  }

  #kzs-account .kzs-account-pane .kzs-account-intro{
    padding-bottom:0.5rem;
  }

  /* Wrap all content except heading/intro for padding */
  #kzs-account .kzs-account-pane > *:last-child{
    padding-bottom:2.5rem;
  }

  /* Sticker section on mobile accordion */
  #kzs-account .kzs-account-pane[data-kzs-tab="vehicle"] .kzs-sticker-section{
    display:block;
    padding:0 1rem;
  }

  #kzs-account .kzs-account-pane[data-kzs-tab="vehicle"] .kzs-sticker-form{
    border-top:1px solid var(--kzs-border);
    padding:1rem;
    margin:0;
  }

  /* Gauge relocated below accordion on mobile */
  #kzs-account .kzs-account-gauge{
      display:none;
    }

  #kzs-account .kzs-gauge-img{
    margin:0 auto;
    display:block;
    max-width:280px;
  }

  /* Impact cards single column on mobile */
  #kzs-account .kzs-impact-cards{
    grid-template-columns:1fr;
  }
  #kzs-account .kzs-impact-card--streak{
    flex-direction:column;
    align-items:stretch;
  }
  #kzs-account .kzs-streak-dots{
    width:100%;
  }

  /* Subscription manager single column on mobile */
  #kzs-account .kzs-submgr .kzs-grid{
    grid-template-columns:1fr !important;
  }
}

/* Button reuse */
#kzs-account .kzs-btn.kzs-btn-primary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.7rem 1.4rem;
  border-radius:999px;
  border:none;
  cursor:pointer;
  background: var(--kzs-active);
  color:#fff;
  font-weight:700;
}
#kzs-account .kzs-btn.kzs-btn-primary:hover{
  background: var(--kzs-active-600);
}
#kzs-account .kzs-btn.kzs-btn-primary:focus{
  outline:2px solid var(--kzs-ring);
  outline-offset:2px;
}

/* Status text */
#kzs-account .kzs-sticker-status{
  margin-top:.75rem;
  font-size:.9rem;
}
#kzs-account .kzs-status-error{
  color:#b00020;
}
#kzs-account .kzs-status-success{
  color:#166534;
}

/* Responsive */
@media (max-width: 900px){
  #kzs-account .kzs-account-columns{
    flex-direction:column;
  }
  #kzs-account .kzs-account-sidebar{
    width:100%;
  }
}
#kzs-account .kzs-gauge-img{
  display:block;
  max-width:100%;
  height:auto;
}

/* User Info table – give labels some breathing room */
#kzs-account .kzs-summary-table{
  border-collapse: collapse;
}
#kzs-account .kzs-summary-table th,
#kzs-account .kzs-summary-table td{
  padding: 2px 0 6px;
}
#kzs-account .kzs-summary-table th,
#kzs-account .kzs-summary-table span{
  padding-right: 10px;      /* space between “Address” and the address text */
  white-space: nowrap;      /* keep labels on one line */
  vertical-align: top;      /* align multi-line values nicely */
  color: var(--kzs-muted);
  font-weight: 600;
}
#kzs-account .kzs-summary-table td{
  color: var(--kzs-text);
}

/* ============================================================================
   Account summary + subscription layout (moved from MU inline)
   ========================================================================== */

/* My Info – summary grid inside account main */
#kzs-account .kzs-acct-summary{
  margin: 1rem 0;
}

#kzs-account .kzs-acct-summary{
  display:flex;
  flex-direction:column;
  gap:18px;
}
#kzs-account .kzs-summary-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  align-items:start;
}
#kzs-account .kzs-summary-card--primary{
  width:100%;
}

/* Impact & Plan KV grid — 2 columns of rows */
#kzs-account .kzs-summary-kv-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0;
}
#kzs-account .kzs-summary-kv-grid .kzs-kv{
  display:flex;
  flex-direction:column;
  gap:.15rem;
  padding:.6rem .75rem .6rem 0;
  border-bottom:1px dashed var(--kzs-border);
}
#kzs-account .kzs-summary-kv-grid .kzs-kv:nth-last-child(-n+2){
  border-bottom:0;
}
#kzs-account .kzs-kv-label{
  display:flex;
  align-items:center;
  gap:.4rem;
  font-size:.75rem;
  font-weight:600;
  color:var(--kzs-muted);
  text-transform:uppercase;
  letter-spacing:.03em;
}
#kzs-account .kzs-kv-label i{
  color:#0B0B69;
  font-size:.8rem;
  width:14px;
  text-align:center;
}
#kzs-account .kzs-kv-val{
  font-size:.95rem;
  font-weight:600;
  color:var(--kzs-text);
}
#kzs-account .kzs-kv-mono{
  font-family:monospace;
  font-size:.82rem;
  word-break:break-all;
}

/* Section headings with icon */
#kzs-account .kzs-summary-heading{
  display:flex;
  align-items:center;
  gap:.5rem;
  margin-bottom:.75rem !important;
}
#kzs-account .kzs-summary-heading i{
  color:#0B0B69;
}

/* Vehicle rows */
#kzs-account .kzs-vehicle-row{
  padding:.55rem 0;
  border-bottom:1px dashed var(--kzs-border);
}
#kzs-account .kzs-vehicle-row:last-of-type{
  border-bottom:0;
}
#kzs-account .kzs-vehicle-title{
  display:flex;
  align-items:center;
  gap:.5rem;
  font-size:.95rem;
  color:var(--kzs-text);
  margin-bottom:.25rem;
}
#kzs-account .kzs-vehicle-title i{
  color:#0B0B69;
}
#kzs-account .kzs-vehicle-meta{
  display:flex;
  gap:1rem;
  font-size:.82rem;
  color:var(--kzs-muted);
  padding-left:1.4rem;
}
#kzs-account .kzs-vehicle-meta i{
  color:#0B0B69;
  margin-right:.2rem;
}
#kzs-account .kzs-summary-footnote{
  margin:.75rem 0 0;
  font-size:.78rem;
  color:var(--kzs-muted);
  display:flex;
  align-items:center;
  gap:.4rem;
}

/* Contact rows */
#kzs-account .kzs-contact-rows{
  display:flex;
  flex-direction:column;
  gap:.75rem;
}
#kzs-account .kzs-contact-row{
  display:flex;
  align-items:flex-start;
  gap:.65rem;
}
#kzs-account .kzs-contact-row > i{
  color:#0B0B69;
  margin-top:.15rem;
  flex-shrink:0;
}
#kzs-account .kzs-contact-row > div{
  display:flex;
  flex-direction:column;
  gap:.1rem;
}
#kzs-account .kzs-contact-label{
  font-size:.72rem;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.03em;
  color:var(--kzs-muted);
}
#kzs-account .kzs-contact-val{
  font-size:.92rem;
  color:var(--kzs-text);
  line-height:1.5;
}

@media (max-width: 900px){
  #kzs-account .kzs-summary-row{
    grid-template-columns:1fr;
  }
  #kzs-account .kzs-summary-kv-grid{
    grid-template-columns:1fr;
  }
}

/* Shared card styling for summary + subscription cards */
#kzs-account .kzs-account-main .kzs-card{
  background: var(--kzs-bg);
  border: 1px solid var(--kzs-border);
  border-radius: 20px;
  padding: 20px 22px;
  box-shadow: 0 10px 30px rgba(0,0,0,.06);
}



/* Vehicle table inside My Info */
#kzs-account .kzs-table-wrap{
  overflow-x:auto;
  margin-top:8px;
}
#kzs-account .kzs-table{
  width:100%;
  border-collapse:collapse;
  table-layout:fixed;
}
#kzs-account .kzs-table th,
#kzs-account .kzs-table td{
  padding:.5rem .6rem;
  border-bottom:1px solid var(--kzs-border);
  text-align:left;
}
#kzs-account .kzs-table th:nth-child(1),
#kzs-account .kzs-table td:nth-child(1){
  width:48%;
  white-space:normal;
  overflow-wrap:anywhere;
}
#kzs-account .kzs-table th:nth-child(2),
#kzs-account .kzs-table td:nth-child(2){
  width:22%;
  white-space:normal;
  overflow-wrap:anywhere;
}
#kzs-account .kzs-table th:nth-child(3),
#kzs-account .kzs-table td:nth-child(3){
  width:30%;
  white-space:nowrap;
}
#kzs-account .kzs-table th{
  font-weight:600;
}
#kzs-account .kzs-table tfoot td{
  border-top:2px solid var(--kzs-border);
}

/* My Subscription – sub manager block inside account main */
#kzs-account .kzs-submgr{
  --kzs-accent: var(--brand-accent, #66BB6A);
  --kzs-accent-700:#3d8f41;
  --kzs-card:#ffffff;
  --kzs-muted:#6b7280;
  --kzs-ring: rgba(102,187,106,.35);
  color:#1b1f22;
}
#kzs-account .kzs-submgr *{
  box-sizing:border-box;
}

/* Let sub-manager use the full width of the account-main card */
#kzs-account .kzs-submgr .kzs-wrap{
  max-width:none;
  margin:0;
  padding:0;
}

#kzs-account .kzs-submgr .kzs-sub-grid{
  display:grid;
  gap:20px;
  grid-template-columns:1fr 2fr;   /* same feel as My Info */
}
#kzs-account .kzs-submgr .kzs-sub-stack{
  display:grid;
  gap:18px;
  align-items:center;
  justify-content:center;
  align-content:start;
}
#kzs-account .kzs-submgr .kzs-sub-card{
  border-radius:20px;
}
#kzs-account .kzs-submgr .kzs-sub-plan{
  color:#fff;
  text-align:center;
  background: linear-gradient(180deg, #f4da88 0%, #0b0b69 70%);
}
#kzs-account .kzs-submgr .kzs-sub-plan.tier-starter{
  background:#0b0b69;
  max-height:200px;
}
#kzs-account .kzs-submgr .kzs-sub-plan.tier-champion{
  background: linear-gradient(180deg, #f4da88 0%, #0b0b69 70%);
}
#kzs-account .kzs-submgr .kzs-sub-plan.tier-hero{
  background: linear-gradient(180deg, #f4da88 0%, #bb861b 40%, #0b0b69 100%);
}
#kzs-account .kzs-submgr .kzs-sub-plan-name{
  margin:0 0 .75rem;
  font-size:1.05rem;
  font-weight:700;
  color:#f5f7ff;
}
#kzs-account .kzs-submgr .kzs-sub-plan-blurb{
  margin:0 0 .5rem;
  font-size:.85rem;
  line-height:1.35;
  color:#f5f7ff;
}
#kzs-account .kzs-submgr .kzs-sub-pricing{
  background:#ffffff;
  color:var(--kzs-text);
  text-align:center;
}
#kzs-account .kzs-submgr .kzs-sub-pricing-title{
  margin:0 0 .5rem;
  font-size:.9rem;
  font-weight:600;
  color:var(--kzs-text);
}
#kzs-account .kzs-submgr .kzs-sub-pricing-amount{
  font-size:2rem;
  font-weight:700;
  margin:0 0 .35rem;
  color:#0b0b69;
}
#kzs-account .kzs-submgr .kzs-sub-pricing-note{
  margin:0 0 .75rem;
  font-size:.85rem;
  color:var(--kzs-text);
}
#kzs-account .kzs-submgr .kzs-sub-pricing-help{
  margin:0;
  font-size:.8rem;
  color:var(--kzs-muted);
}
#kzs-account .kzs-submgr .kzs-sub-pricing-help a{
  color:#0b0b69;
  text-decoration:underline;
}
#kzs-account .kzs-submgr .kzs-sub-details{
  display:flex;
  flex-direction:column;
  gap:0.5rem;
  padding-bottom:0;
}
#kzs-account .kzs-submgr .kzs-payment-method-form{
  border-top:1px solid var(--kzs-border);
  padding-top:1rem;
}
#kzs-account .kzs-submgr .kzs-sub-form-title{
  margin:0 0 1rem;
  font-size:.85rem;
  font-weight:600;
  color:#374151;
  text-transform:uppercase;
  letter-spacing:.05em;
}
#kzs-account .kzs-submgr .kzs-form-row{
  display:flex;
  gap:1rem;
}
#kzs-account .kzs-submgr .kzs-form-row .kzs-form-group{
  flex:1 1 0%;
}
@media (max-width: 900px){
  #kzs-account .kzs-submgr .kzs-sub-grid{
    grid-template-columns:1fr;
  }
  #kzs-account .kzs-submgr .kzs-form-row{
    flex-direction:column;
  }
}
@media (max-width:900px){
  #kzs-account .kzs-submgr .kzs-grid{
    grid-template-columns:1fr;
  }
}

/* Cards inside subscription manager reuse account-main card style */
#kzs-account .kzs-submgr .kzs-card{
  background:var(--kzs-card);
  border-radius:20px;
  box-shadow:0 10px 30px rgba(0,0,0,.08);
  padding:18px;
  border:1px solid var(--kzs-border);
}

#kzs-account .kzs-submgr .kzs-header{
  text-align:left;
  margin:0 0 10px;
}
#kzs-account .kzs-submgr .kzs-h1{
  font:600 24px/1.2 system-ui;
  margin:0 0 6px;
}
#kzs-account .kzs-submgr .kzs-h2{
  font:600 18px/1.2 system-ui;
  margin:14px 0 8px;
}
#kzs-account .kzs-submgr .kzs-divider{
  height:1px;
  background:#e6ece8;
  margin:18px 0;
}
#kzs-account .kzs-submgr .kzs-field{
  margin-top:10px;
}
#kzs-account .kzs-submgr .kzs-label{
  font-size:12px;
  color:#6b7280;
}
#kzs-account .kzs-submgr .kzs-strong{
  font-weight:800;
}
#kzs-account .kzs-submgr .kzs-input{
  width:100%;
  border:2px solid #e2e8e4;
  border-radius:12px;
  padding:10px 12px;
  font-size:16px;
  background:#fff;
}
#kzs-account .kzs-submgr .kzs-input:focus{
  border-color:var(--kzs-accent);
  box-shadow:0 0 0 4px var(--kzs-ring);
  outline:none;
}
#kzs-account .kzs-submgr .kzs-help{
  font-size:12px;
  color:#6b7280;
  margin-top:6px;
}
#kzs-account .kzs-submgr .kzs-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:10px;
}

#kzs-account .kzs-account-pane[data-kzs-tab="subscription"] .kzs-account-intro{
  margin-bottom:1rem;
}
#kzs-account .kzs-submgr .kzs-plan-change .kzs-actions{
  flex-wrap:nowrap;
  align-items:center;
}
#kzs-account .kzs-submgr .kzs-plan-change [data-sub-plan-select]{
  flex:1 1 360px;
  min-width:320px;
}
#kzs-account .kzs-submgr .kzs-plan-change [data-sub-action="change-plan"]{
  flex:0 0 auto;
}
#kzs-account .kzs-submgr .kzs-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 14px;
  border:0;
  border-radius:12px;
  cursor:pointer;
  font-weight:800;
  letter-spacing:.02em;
}
#kzs-account .kzs-submgr .kzs-btn-primary{
  background:var(--kzs-accent);
  color:#fff;
}
#kzs-account .kzs-submgr .kzs-btn-primary:hover{
  background:var(--kzs-accent-700);
}
#kzs-account .kzs-submgr .kzs-btn-ghost{
  background:#f3f6f4;
  color:#22302a;
}
#kzs-account .kzs-submgr .kzs-disclaimer{
  font-size:12px;
  color:#6b7280;
  margin-top:10px;
}

/* Summary pill on right side */
#kzs-account .kzs-submgr .kzs-summary{
  background:#0f1a13;
  color:#dfe7e2;
  border-radius:16px;
  padding:18px;
  line-height:1.4;
}
#kzs-account .kzs-submgr .kzs-summary strong{
  color:#fff;
}
#kzs-account .kzs-submgr .kzs-sumbig{
  font-size:28px;
  margin:6px 0;
}

/* Status rows grid in left card */
#kzs-account .kzs-submgr .kzs-fake-card{
  display:grid;
  gap:10px;
  grid-template-columns:1fr 140px 100px;
}
#kzs-account .kzs-submgr .kzs-fake-card.kzs-rows{
  grid-template-columns:1fr 1fr;
}
@media (max-width:640px){
  #kzs-account .kzs-submgr .kzs-fake-card{
    grid-template-columns:1fr;
  }
  #kzs-account .kzs-submgr .kzs-fake-card.kzs-rows{
    grid-template-columns:1fr;
  }
}

/* Status messages */
#kzs-account .kzs-submgr .kzs-status{
  margin-top:12px;
  font-size:14px;
}
#kzs-account .kzs-submgr .kzs-status.ok{
  color:#065f46;
}
#kzs-account .kzs-submgr .kzs-status.err{
  color:#b91c1c;
}

/* Payment method pill */
#kzs-account .kzs-submgr .kzs-pm{
  padding:10px 12px;
  border:2px solid #e2e8e4;
  border-radius:12px;
  background:#fff;
}

/* Calculation details list */
#kzs-account .kzs-submgr .kzs-list{
  list-style:none;
  padding:0;
  margin:0;
}
#kzs-account .kzs-submgr .kzs-list li{
  display:flex;
  justify-content:space-between;
  padding:8px 0;
  border-bottom:1px solid #eef2ef;
}
#kzs-account .kzs-submgr .kzs-li-l{
  color:#6b7280;
}

/* Mobile responsive for subscription manager */
@media (max-width: 900px){
  #kzs-account .kzs-submgr .kzs-grid{
    grid-template-columns:1fr;
  }
  
  #kzs-account .kzs-submgr .kzs-card{
    padding:18px;
  }
  
  #kzs-account .kzs-submgr .kzs-h1{
    font-size:20px;
  }
  
  #kzs-account .kzs-submgr .kzs-h2{
    font-size:16px;
  }
}

@media (max-width: 640px){
  #kzs-account .kzs-submgr{
    margin:0 -1rem;
  }
  
  #kzs-account .kzs-submgr .kzs-card{
    border-radius:12px;
    padding:16px;
    margin:0 1rem 1rem;
  }
  
  #kzs-account .kzs-submgr .kzs-h1{
    font-size:18px;
  }
  
  #kzs-account .kzs-submgr .kzs-h2{
    font-size:14px;
  }
  
  #kzs-account .kzs-submgr .kzs-summary{
    padding:14px;
  }
  
  #kzs-account .kzs-submgr .kzs-sumbig{
    font-size:24px;
  }
  
  #kzs-account .kzs-submgr .kzs-btn{
    padding:8px 12px;
    font-size:14px;
  }
  #kzs-account .kzs-submgr .kzs-plan-change .kzs-actions{
    flex-wrap:wrap;
  }
  #kzs-account .kzs-submgr .kzs-plan-change [data-sub-plan-select]{
    min-width:0;
    width:100%;
  }
}

/* Payment method form styling */
#kzs-account .kzs-submgr .kzs-payment-method-form{
  width:100%;
}

#kzs-account .kzs-submgr .kzs-form-group{
  margin-bottom:.75rem;
}

#kzs-account .kzs-submgr .kzs-form-group label{
  display:block;
  font-weight:600;
  font-size:14px;
  margin-bottom:0.5rem;
  color:var(--kzs-text);
}

#kzs-account .kzs-submgr .kzs-stripe-element{
  border:2px solid var(--kzs-border);
  border-radius:12px;
  padding:12px;
  background:#fff;
}

#kzs-account .kzs-submgr .kzs-form-error{
  color:#b91c1c;
  font-size:13px;
  margin-top:0.5rem;
}

#kzs-account .kzs-submgr .kzs-form-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:1rem;
}

#kzs-account .kzs-submgr .kzs-form-status{
  margin-top:1rem;
  padding:12px;
  border-radius:10px;
  font-size:14px;
}

#kzs-account .kzs-submgr .kzs-form-status.ok{
  background:#d1fae5;
  color:#065f46;
  border:1px solid #a7f3d0;
}

#kzs-account .kzs-submgr .kzs-form-status.err{
  background:#fee2e2;
  color:#b91c1c;
  border:1px solid #fecaca;
}