/* ──────── Settings hub ──────── */
.st-page { padding: 24px 32px 64px; max-width: 1240px; margin: 0 auto; position: relative; }
.st-page-head { margin-bottom: 24px; }
.st-page-head h1 {
  font-family: var(--serif);
  font-size: 32px;
  line-height: 1.05;
  letter-spacing: -.018em;
  margin: 0 0 6px;
}
.st-page-head p { font-size: 14px; color: var(--gray-600); margin: 0; max-width: 600px; line-height: 1.55; }

/* Split: left tabs / right content */
.st-split {
  display: grid;
  grid-template-columns: 230px 1fr;
  gap: 24px;
  align-items: flex-start;
}

.st-tabs {
  position: sticky;
  top: 80px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 8px;
  background: #fff;
  border: 1px solid var(--gray-200);
  border-radius: 12px;
}
.st-tab {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 8px;
  background: transparent;
  border: 0;
  text-align: left;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--gray-700);
  cursor: pointer;
  transition: all .12s ease;
  position: relative;
}
.st-tab:hover { background: var(--gray-50); color: var(--text-primary); }
.st-tab.on {
  background: var(--green-50);
  color: var(--green-800);
}
.st-tab.on::before {
  content: "";
  position: absolute;
  left: -8px;
  top: 9px;
  bottom: 9px;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: var(--green-700);
}
.st-tab svg { color: var(--gray-500); flex-shrink: 0; }
.st-tab.on svg { color: var(--green-700); }

.st-content { min-width: 0; }
.st-section { margin: 0 0 18px; padding: 0 4px; }
.st-section h3 {
  font-family: var(--serif);
  font-size: 22px;
  letter-spacing: -.012em;
  margin: 0 0 4px;
  line-height: 1.1;
}
.st-section p {
  font-size: 13px;
  color: var(--gray-600);
  margin: 0;
  line-height: 1.55;
  max-width: 600px;
}

.st-card {
  background: #fff;
  border: 1px solid var(--gray-200);
  border-radius: 14px;
  padding: 22px 24px;
  margin-bottom: 18px;
}
.st-card-h {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--gray-500);
  margin: -4px 0 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--gray-100);
}

/* Profile avatar row */
.st-avatar-row {
  display: flex;
  align-items: center;
  gap: 18px;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--gray-100);
  margin-bottom: 22px;
}
.st-avatar {
  width: 80px; height: 80px;
  border-radius: 20px;
  background: linear-gradient(135deg, var(--green-600), var(--green-700));
  color: #fff;
  font-family: var(--serif);
  font-size: 30px;
  font-weight: 700;
  display: grid;
  place-items: center;
  letter-spacing: -.015em;
  flex-shrink: 0;
  box-shadow: 0 1px 0 rgba(255,255,255,.18) inset, 0 4px 14px -3px rgba(43,83,20,.3);
}

/* Grids/fields */
.st-grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.st-field { display: flex; flex-direction: column; gap: 6px; }
.st-field.full { grid-column: 1 / -1; }
.st-field label {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--text-primary);
}
.st-field input,
.st-field select,
.st-field textarea {
  width: 100%;
  padding: 11px 13px;
  background: #fff;
  border: 1px solid var(--gray-300);
  border-radius: 9px;
  font-size: 13.5px;
  font-family: inherit;
  color: var(--text-primary);
  outline: 0;
  transition: border-color .12s ease, box-shadow .12s ease;
}
.st-field input:focus,
.st-field select:focus,
.st-field textarea:focus {
  border-color: var(--green-700);
  box-shadow: 0 0 0 3px rgba(59,124,15,.12);
}
.st-field input:read-only { background: var(--gray-50); color: var(--gray-700); cursor: not-allowed; }
.st-field .hint { font-size: 11.5px; color: var(--gray-500); }
.st-field .hint a { color: var(--brand-700); font-weight: 700; }

/* Row pattern (toggles / pickers next to label+desc) */
.st-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 16px;
  align-items: center;
  padding: 12px 0;
  border-top: 1px solid var(--gray-100);
}
.st-row:first-of-type { padding-top: 0; border-top: 0; }
.st-row .t {
  font-size: 13.5px;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 2px;
}
.st-row .d {
  font-size: 12.5px;
  color: var(--gray-600);
  line-height: 1.45;
}

/* Segmented buttons */
.st-seg {
  display: inline-flex;
  background: var(--gray-100);
  padding: 3px;
  border-radius: 9px;
  gap: 2px;
}
.st-seg button {
  padding: 7px 14px;
  border-radius: 6px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--gray-600);
  background: transparent;
  border: 0;
  text-transform: capitalize;
  cursor: pointer;
}
.st-seg button.on {
  background: #fff;
  color: var(--green-800);
  box-shadow: 0 1px 2px rgba(0,0,0,.05);
}

/* Foot CTAs */
.st-foot {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 16px;
}

/* Password tips */
.st-pw-tips {
  margin-top: 16px;
  padding: 14px 16px;
  background: var(--gray-50);
  border: 1px solid var(--gray-200);
  border-radius: 10px;
}
.st-pw-tips strong {
  display: block;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--gray-700);
  margin-bottom: 8px;
}
.st-pw-tips ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 5px; }
.st-pw-tips li {
  font-size: 12.5px;
  color: var(--gray-600);
  display: flex;
  align-items: center;
  gap: 8px;
}
.st-pw-tips li svg { color: var(--gray-400); }
.st-pw-tips li.ok { color: var(--green-700); }
.st-pw-tips li.ok svg { color: var(--green-700); }

/* Linked accounts row */
.st-linked-row {
  display: grid;
  grid-template-columns: 44px 1fr auto;
  gap: 14px;
  align-items: center;
  padding: 14px 0;
  border-top: 1px solid var(--gray-100);
}
.st-linked-row:first-child { border-top: 0; padding-top: 0; }
.st-linked-mark {
  width: 44px; height: 44px;
  border-radius: 10px;
  background: var(--gray-100);
  color: var(--gray-700);
  font-family: var(--serif);
  font-size: 18px;
  font-weight: 700;
  display: grid;
  place-items: center;
}
.st-linked-body .t {
  font-size: 13.5px;
  font-weight: 700;
  color: var(--text-primary);
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 2px;
}
.st-linked-pill {
  font-size: 9.5px;
  letter-spacing: .06em;
  text-transform: uppercase;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 4px;
  background: var(--green-50);
  color: var(--green-800);
  border: 1px solid var(--green-200);
}
.st-linked-body .d { font-size: 12.5px; color: var(--gray-600); }

/* Success modal */
.st-modal-scrim {
  position: fixed; inset: 0;
  background: rgba(14, 22, 18, .42);
  backdrop-filter: blur(2px);
  z-index: 999;
  display: grid;
  place-items: center;
  animation: rg-fade-in .14s ease;
}
.st-modal {
  width: 360px;
  max-width: calc(100vw - 32px);
  background: #fff;
  border-radius: 16px;
  padding: 28px 28px 24px;
  text-align: center;
  box-shadow: 0 24px 64px -16px rgba(14, 22, 18, .35);
  animation: st-pop .25s cubic-bezier(.34, 1.56, .64, 1);
}
@keyframes st-pop { from { transform: scale(.85); opacity: 0; } to { transform: scale(1); opacity: 1; } }
@keyframes rg-fade-in { from { opacity: 0; } to { opacity: 1; } }
.st-modal-art {
  width: 64px; height: 64px;
  border-radius: 50%;
  background: var(--green-50);
  border: 4px solid #D1FADF;
  color: var(--green-700);
  margin: 0 auto 14px;
  display: grid;
  place-items: center;
}
.st-modal h3 {
  font-family: var(--serif);
  font-size: 22px;
  letter-spacing: -.012em;
  margin: 0 0 8px;
}
.st-modal p {
  font-size: 13.5px;
  color: var(--gray-600);
  line-height: 1.5;
  margin: 0 0 18px;
}
.st-modal .btn { width: 100%; justify-content: center; }

@media (max-width: 880px) {
  .st-split { grid-template-columns: 1fr; }
  .st-tabs { position: static; flex-direction: row; overflow-x: auto; }
  .st-tab.on::before { display: none; }
  .st-grid-2 { grid-template-columns: 1fr; }
}

/* ── Load Balancing policy ── */
.lb-block { padding: 4px 0 18px; border-bottom: 1px solid var(--gray-100); margin-bottom: 18px; }
.lb-block:last-child { border-bottom: 0; margin-bottom: 0; padding-bottom: 0; }
.lb-block-head { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 800; color: var(--text-primary); margin-bottom: 4px; }
.lb-block-head svg { color: var(--green-700); }
.lb-block-sub { font-size: 12.5px; color: var(--gray-500); margin: 0 0 14px; }
.lb-radio-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 12px 0; }
.lb-radio { display: flex; gap: 10px; align-items: flex-start; padding: 13px 14px; border: 1.5px solid var(--gray-200); border-radius: 12px; cursor: pointer; transition: border-color .12s ease, background .12s ease; }
.lb-radio.on { border-color: var(--green-600); background: var(--green-25, #fafef5); }
.lb-radio input { margin-top: 2px; flex-shrink: 0; accent-color: var(--green-700); }
.lb-radio strong { display: block; font-size: 13.5px; font-weight: 700; }
.lb-radio span { display: block; font-size: 12px; color: var(--gray-500); margin-top: 2px; line-height: 1.4; }
.lb-weights { display: flex; gap: 14px; flex-wrap: wrap; padding: 12px 14px; background: var(--gray-50); border-radius: 11px; margin-bottom: 12px; }
.lb-weight { display: flex; align-items: center; gap: 7px; }
.lb-weight label { font-size: 12.5px; font-weight: 700; }
.lb-weight input { width: 58px; padding: 7px 9px; border: 1px solid var(--gray-300); border-radius: 8px; font-family: inherit; font-size: 13px; font-weight: 700; text-align: center; }
.lb-weight-unit { font-size: 11.5px; color: var(--gray-500); }
.lb-check { display: flex; align-items: flex-start; gap: 9px; font-size: 13px; color: var(--text-primary); cursor: pointer; }
.lb-check input { margin-top: 2px; flex-shrink: 0; accent-color: var(--green-700); }
.lb-levers { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.lb-lever { border: 1px solid var(--gray-200); border-radius: 12px; padding: 13px 14px; }
.lb-lever-top { display: flex; align-items: center; gap: 7px; font-size: 12.5px; font-weight: 800; }
.lb-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.lb-dot.under { background: #2E90FA; } .lb-dot.high { background: var(--error-500); } .lb-dot.cap { background: var(--gray-700); }
.lb-lever-ctl { display: flex; align-items: center; gap: 8px; margin: 10px 0 8px; }
.lb-lever-ctl span { font-size: 18px; font-weight: 800; color: var(--gray-400); }
.lb-lever-ctl input { width: 72px; padding: 9px 11px; border: 1px solid var(--gray-300); border-radius: 9px; font-family: inherit; font-size: 18px; font-weight: 800; text-align: center; color: var(--text-primary); }
.lb-lever-ctl input:focus { border-color: var(--green-700); box-shadow: 0 0 0 3px rgba(59,124,15,.12); outline: 0; }
.lb-lever-hint { font-size: 11.5px; color: var(--gray-500); line-height: 1.45; }
.lb-preview { margin-top: 16px; padding: 14px; background: var(--gray-50); border-radius: 12px; }
.lb-preview-label { font-size: 10.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--gray-500); margin-bottom: 10px; }
.lb-preview-scale { display: flex; gap: 8px; flex-wrap: wrap; }
.lb-preview-step { display: flex; flex-direction: column; align-items: center; gap: 5px; flex: 1; min-width: 64px; }
.lb-preview-pip { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; font-size: 14px; font-weight: 800; color: #fff; }
.lb-preview-pip.idle { background: var(--gray-400); } .lb-preview-pip.under { background: #2E90FA; }
.lb-preview-pip.ok { background: var(--green-600); } .lb-preview-pip.high { background: var(--error-500); }
.lb-preview-txt { font-size: 11px; font-weight: 700; color: var(--gray-600); text-align: center; }
.lb-seg { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.lb-seg button { text-align: left; padding: 12px 14px; border: 1.5px solid var(--gray-200); border-radius: 12px; background: #fff; cursor: pointer; font-family: inherit; transition: border-color .12s ease, background .12s ease; }
.lb-seg button.on { border-color: var(--green-600); background: var(--green-25, #fafef5); }
.lb-seg button strong { display: block; font-size: 13.5px; font-weight: 700; }
.lb-seg button span { display: block; font-size: 11.5px; color: var(--gray-500); margin-top: 2px; }
@media (max-width: 720px) {
  .lb-radio-row, .lb-levers, .lb-seg { grid-template-columns: 1fr; }
}


/* Premium subscription operations — live billing and exact token ledger */
.saas-usage-skeleton{height:180px;border-radius:18px;background:linear-gradient(100deg,#edf4ef 20%,#f9fcfa 40%,#edf4ef 60%);background-size:220% 100%;animation:saasShimmer 1.25s infinite}
@keyframes saasShimmer{to{background-position-x:-220%}}
.saas-usage-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 26px;border:1px solid #cfe6d5;border-radius:20px;background:radial-gradient(circle at 82% 15%,rgba(89,190,103,.2),transparent 28%),linear-gradient(135deg,#0a3921,#135e31);color:#fff;box-shadow:0 18px 38px -26px #08351e}
.saas-usage-hero.warning{background:radial-gradient(circle at 82% 15%,rgba(255,207,93,.22),transparent 28%),linear-gradient(135deg,#253d1d,#78611b)}
.saas-usage-hero.danger{background:radial-gradient(circle at 82% 15%,rgba(255,132,116,.2),transparent 28%),linear-gradient(135deg,#43221e,#7c3027)}
.saas-eyebrow{display:block;margin-bottom:7px;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#b9e7c5}
.saas-usage-number{font-family:var(--font-display,inherit);font-size:36px;font-weight:850;line-height:1.05;letter-spacing:-.025em}.saas-usage-number small{font-family:var(--font-sans,inherit);font-size:14px;font-weight:650;color:#d8eadf;letter-spacing:0}
.saas-usage-hero p{margin:9px 0 0;color:#cce0d3;font-size:13px}
.saas-usage-ring{--usage:0%;width:100px;height:100px;flex:0 0 100px;border-radius:50%;display:grid;place-content:center;text-align:center;background:radial-gradient(circle at center,#104b2b 57%,transparent 59%),conic-gradient(#7ee38c var(--usage),rgba(255,255,255,.14) 0)}
.saas-usage-ring b{font-size:19px}.saas-usage-ring span{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:#cfe4d5}
.saas-meter{height:9px;margin:18px 0;border-radius:99px;background:#eaf0ec;overflow:hidden}.saas-meter i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#28a745,#75cf67);transition:width .4s ease}.saas-meter i.warning{background:linear-gradient(90deg,#d79d22,#f0c849)}.saas-meter i.danger{background:linear-gradient(90deg,#ce4e3a,#ec7b65)}
.saas-kpi-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin:0 0 18px}.saas-kpi-grid>div{padding:14px;border:1px solid #e2e9e4;border-radius:14px;background:#fbfdfb}.saas-kpi-grid span,.saas-kpi-grid b{display:block}.saas-kpi-grid span{font-size:11px;color:#718077;margin-bottom:6px}.saas-kpi-grid b{font-size:16px;color:#13261a}
.saas-billing-row,.saas-pack-head,.saas-log-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 0;border-top:1px solid #e8ede9}.saas-billing-row p,.saas-pack-head p{margin:3px 0 0;font-size:12px;color:#718077}
.saas-thresholds{display:flex;gap:7px}.saas-thresholds button{min-width:54px;padding:8px 10px;border:1px solid #d5ddd7;border-radius:10px;background:#fff;color:#415348;font-weight:750;cursor:pointer}.saas-thresholds button.active{border-color:#288c43;background:#edf9ef;color:#176c2d}.saas-thresholds button:disabled{opacity:.5;cursor:not-allowed}
.saas-pack-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:18px}.saas-pack-grid button{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border:1px solid #cadbd0;border-radius:14px;background:linear-gradient(180deg,#fff,#f5faf6);color:#163d25;cursor:pointer}.saas-pack-grid button:hover{border-color:#2b9848;box-shadow:0 9px 24px -18px #126428}.saas-pack-grid button:disabled{opacity:.55;cursor:not-allowed}
.saas-log-head>div{display:flex;align-items:baseline;gap:10px}.saas-log-head span{font-size:12px;color:#768078}
.saas-usage-log{border:1px solid #dfe7e1;border-radius:15px;overflow:hidden}.saas-log-row{display:grid;grid-template-columns:1.3fr 1.7fr 1fr .7fr .7fr .7fr;gap:12px;align-items:center;padding:11px 13px;border-top:1px solid #edf1ee;font-size:12px}.saas-log-row:first-child{border-top:0}.saas-log-row.head{background:#f5f8f6;color:#627067;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.055em}.saas-log-row b,.saas-log-row small{display:block}.saas-log-row small{margin-top:3px;color:#7d8981;font-size:10px;overflow:hidden;text-overflow:ellipsis}.saas-empty{padding:28px;text-align:center;color:#718077;border:1px dashed #d9e1db;border-radius:14px;background:#fbfdfb}
@media(max-width:1100px){.saas-kpi-grid{grid-template-columns:repeat(3,1fr)}.saas-log-row{grid-template-columns:1.2fr 1.7fr .8fr .7fr}.saas-log-row>*:nth-child(3),.saas-log-row>*:nth-child(4){display:none}}
@media(max-width:720px){.saas-usage-hero{align-items:flex-start;padding:20px}.saas-usage-number{font-size:28px}.saas-usage-ring{width:82px;height:82px;flex-basis:82px}.saas-kpi-grid{grid-template-columns:repeat(2,1fr)}.saas-billing-row{align-items:flex-start;flex-direction:column}.saas-pack-grid{grid-template-columns:1fr}.saas-log-row{grid-template-columns:1fr .65fr}.saas-log-row>*:nth-child(2),.saas-log-row>*:nth-child(3),.saas-log-row>*:nth-child(4),.saas-log-row>*:nth-child(5){display:none}}


/* ───── Premium Subscription & Features workspace v2 ───── */
.set-standalone.subscription-mode .set-pane{
  background:
    radial-gradient(circle at 92% 3%, rgba(92,171,76,.10), transparent 24rem),
    linear-gradient(180deg,#f7faf8 0,#f3f7f4 100%);
  padding:0;
}
.set-standalone.subscription-mode .set-pane>.crumbs,
.set-standalone.subscription-mode .set-pane>.page-head{display:none}
.set-standalone.subscription-mode .set-content{max-width:none}
.subscription-saas-page{
  --sub-ink:#102719;
  --sub-muted:#64746a;
  --sub-border:#dce6df;
  --sub-green:#17752f;
  --sub-green-dark:#0b3c20;
  --sub-green-soft:#eef8f0;
  max-width:1480px;
  margin:0 auto;
  padding:34px clamp(22px,3.4vw,56px) 88px;
  color:var(--sub-ink);
}
.subscription-scroll-target{scroll-margin-top:88px}
.sub-command-hero{
  position:relative;
  isolation:isolate;
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(380px,.75fr);
  gap:34px;
  overflow:hidden;
  padding:38px;
  border:1px solid rgba(186,225,191,.22);
  border-radius:28px;
  color:#fff;
  background:
    radial-gradient(circle at 88% 0,rgba(141,231,119,.28),transparent 31%),
    radial-gradient(circle at 63% 120%,rgba(51,167,84,.28),transparent 44%),
    linear-gradient(135deg,#082b19 0%,#0d4726 48%,#126331 100%);
  box-shadow:0 28px 70px -40px rgba(6,48,25,.72);
}
.sub-command-hero::before,.sub-command-hero::after{content:"";position:absolute;z-index:-1;border:1px solid rgba(255,255,255,.10);border-radius:50%}
.sub-command-hero::before{width:310px;height:310px;right:-95px;top:-155px}
.sub-command-hero::after{width:190px;height:190px;right:125px;bottom:-130px}
.sub-command-eyebrow{display:inline-flex;align-items:center;gap:7px;margin-bottom:14px;color:#bdeabf;font-size:11px;font-weight:850;letter-spacing:.12em;text-transform:uppercase}
.sub-command-copy h2{margin:0;font-family:var(--serif);font-size:clamp(34px,4vw,52px);line-height:1;letter-spacing:-.035em;color:#fff}
.sub-command-copy>p{max-width:720px;margin:15px 0 0;color:rgba(235,249,238,.78);font-size:15px;line-height:1.65}
.sub-command-status{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.sub-command-status span{display:inline-flex;align-items:center;gap:7px;padding:7px 10px;border:1px solid rgba(255,255,255,.13);border-radius:999px;background:rgba(255,255,255,.07);color:#e3f6e6;font-size:11.5px;font-weight:700;backdrop-filter:blur(10px)}
.sub-command-status i{width:7px;height:7px;border-radius:50%;background:#7ee08a;box-shadow:0 0 0 4px rgba(126,224,138,.13)}
.sub-command-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.sub-command-actions .btn{height:44px;padding:0 17px;border-radius:12px;font-weight:800}
.sub-hero-primary{border:1px solid #d9ffd9!important;background:#e9ffe6!important;color:#103b20!important;box-shadow:0 10px 28px -16px rgba(0,0,0,.65)}
.sub-hero-primary:hover{background:#fff!important}
.sub-hero-primary:disabled{opacity:.55}
.sub-hero-secondary{border:1px solid rgba(255,255,255,.19)!important;background:rgba(255,255,255,.08)!important;color:#fff!important}
.sub-hero-secondary:hover{background:rgba(255,255,255,.14)!important}
.sub-command-summary{align-self:stretch;display:flex;flex-direction:column;justify-content:space-between;padding:22px;border:1px solid rgba(255,255,255,.16);border-radius:22px;background:rgba(255,255,255,.09);box-shadow:inset 0 1px 0 rgba(255,255,255,.08);backdrop-filter:blur(14px)}
.sub-command-plan{padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,.12)}
.sub-command-plan span,.sub-command-mini-grid span{display:block;color:rgba(231,247,234,.66);font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.sub-command-plan strong{display:block;margin-top:7px;font-family:var(--serif);font-size:30px;line-height:1;color:#fff}
.sub-command-plan small{display:block;margin-top:5px;color:#cce9d2;font-size:13px}
.sub-command-mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}
.sub-command-mini-grid>div{padding:13px;border:1px solid rgba(255,255,255,.10);border-radius:14px;background:rgba(5,37,19,.18)}
.sub-command-mini-grid strong{display:block;margin-top:7px;color:#fff;font-size:16px;line-height:1.15;overflow-wrap:anywhere}
.sub-page-nav{
  position:sticky;
  top:0;
  z-index:30;
  display:flex;
  gap:5px;
  width:max-content;
  max-width:100%;
  margin:18px auto 34px;
  padding:6px;
  overflow-x:auto;
  border:1px solid rgba(210,223,214,.94);
  border-radius:15px;
  background:rgba(255,255,255,.9);
  box-shadow:0 12px 30px -24px rgba(10,46,25,.46);
  backdrop-filter:blur(14px);
  scrollbar-width:none;
}
.sub-page-nav::-webkit-scrollbar{display:none}
.sub-page-nav button{display:inline-flex;align-items:center;gap:7px;white-space:nowrap;padding:9px 13px;border:0;border-radius:10px;background:transparent;color:#526158;font:700 12.5px/1 inherit;cursor:pointer}
.sub-page-nav button:hover{background:var(--sub-green-soft);color:var(--sub-green)}
.sub-section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:26px;margin:0 0 16px;padding:0 3px}
.sub-section-heading>div>span{display:block;margin-bottom:5px;color:var(--sub-green);font-size:10.5px;font-weight:850;letter-spacing:.12em;text-transform:uppercase}
.sub-section-heading h3{margin:0;font-family:var(--serif);font-size:27px;line-height:1.05;letter-spacing:-.02em}
.sub-section-heading>p{max-width:520px;margin:0;color:var(--sub-muted);font-size:12.5px;line-height:1.5;text-align:right}
.subscription-overview,.subscription-plans-section,.subscription-ai-section,.subscription-addons,.subscription-comparison{margin-top:34px}
.subscription-saas-page .card.pad{
  border:1px solid var(--sub-border);
  border-radius:22px;
  padding:26px;
  background:rgba(255,255,255,.96);
  box-shadow:0 16px 44px -34px rgba(11,54,29,.36),0 1px 2px rgba(16,39,25,.03);
}
.subscription-saas-page .card.pad>div:first-child h3{font-size:20px!important;letter-spacing:-.015em}
.subscription-saas-page .card.pad>div:first-child svg{width:18px;height:18px}
.subscription-overview>.card.pad,.subscription-plans-section>.card.pad,.subscription-ai-section>.card.pad,.subscription-comparison>.card.pad{margin-bottom:18px!important}
.subscription-plans-section>.card.pad{padding:29px}
.subscription-saas-page .sub-cycle{margin:4px 0 22px;padding:5px;border:1px solid #dbe4dd;background:#f3f6f4}
.subscription-saas-page .sub-cycle button{min-width:112px;justify-content:center;padding:9px 16px}
.subscription-saas-page .sub-plans{gap:16px}
.subscription-saas-page .sub-plan{min-height:510px;padding:22px;border-radius:22px;border-color:rgba(255,255,255,.2);box-shadow:0 22px 48px -28px rgba(11,58,28,.72);transform:translateY(0);transition:transform .18s ease,box-shadow .18s ease}
.subscription-saas-page .sub-plan:hover{transform:translateY(-4px);box-shadow:0 28px 58px -28px rgba(11,58,28,.78)}
.subscription-saas-page .sub-plan:nth-child(1){background:linear-gradient(155deg,#38ad51,#299b41)}
.subscription-saas-page .sub-plan:nth-child(2){background:linear-gradient(155deg,#24823a,#176b30)}
.subscription-saas-page .sub-plan:nth-child(3){background:linear-gradient(155deg,#1b5d31,#123f24)}
.subscription-saas-page .sub-plan:nth-child(4){background:linear-gradient(155deg,#0f4126,#082f1c)}
.subscription-saas-page .sub-plan-pop{top:-11px;left:22px;padding:5px 12px}
.subscription-saas-page .sub-plan-name{padding:6px 12px}
.subscription-saas-page .sub-plan-price{margin:18px 0 5px}
.subscription-saas-page .sub-plan-amt{font-size:38px;line-height:1}
.subscription-saas-page .sub-plan-tag{min-height:58px;margin:11px 0 16px;font-size:13px}
.subscription-saas-page .sub-plan-feats{gap:10px;margin-bottom:22px}
.subscription-saas-page .sub-plan-feats li{align-items:flex-start;font-size:12.5px;line-height:1.35}
.subscription-saas-page .sub-plan-cta{min-height:44px;border-radius:12px}
.subscription-ai-section>.card.pad{padding:0!important;overflow:hidden}
.subscription-ai-section>.card.pad>div:first-child{padding:25px 28px 0}
.subscription-ai-section>.card.pad>p{padding:0 28px}
.subscription-ai-section>.card.pad>div:last-child{padding:14px 28px 28px}
.subscription-ai-section .saas-usage-hero{border-radius:20px;padding:27px 29px}
.subscription-ai-section .saas-usage-number{font-size:40px}
.subscription-ai-section .saas-kpi-grid{gap:12px}
.subscription-ai-section .saas-kpi-grid>div{padding:15px;border-radius:15px}
.subscription-ai-section .saas-billing-row,.subscription-ai-section .saas-pack-head,.subscription-ai-section .saas-log-head{padding:18px 0}
.subscription-ai-section .saas-pack-grid button{min-height:60px;border-radius:15px}
.subscription-addons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.subscription-grid-heading{grid-column:1/-1}
.subscription-addons>.card.pad{height:100%;margin:0!important;padding:25px}
.subscription-addons>.card.pad:first-of-type{grid-column:1/-1}
.subscription-addons .st-row,.subscription-addons .set-row{padding:14px 0}
.subscription-comparison table{border:1px solid #e1e8e3;border-radius:16px;overflow:hidden}
.subscription-comparison thead{position:sticky;top:54px;z-index:1;background:#f4f8f5}
.subscription-comparison th{font-size:10.5px!important;padding:12px 10px!important}
.subscription-comparison td{padding:11px 10px!important}
.subscription-comparison tbody tr:hover{background:#f8fbf9}
.subscription-comparison tbody td:first-child{min-width:240px}
@media(max-width:1280px){
  .sub-command-hero{grid-template-columns:1fr 360px}
  .subscription-saas-page .sub-plans{grid-template-columns:repeat(2,minmax(0,1fr))}
  .subscription-saas-page .sub-plan{min-height:470px}
}
@media(max-width:960px){
  .sub-command-hero{grid-template-columns:1fr;padding:30px}
  .sub-command-summary{display:grid;grid-template-columns:1fr 1.35fr;gap:18px}
  .sub-command-plan{padding:0 18px 0 0;border:0;border-right:1px solid rgba(255,255,255,.12)}
  .sub-command-mini-grid{margin:0}
  .subscription-addons{grid-template-columns:1fr}
  .subscription-grid-heading,.subscription-addons>.card.pad:first-of-type{grid-column:auto}
  .sub-section-heading{align-items:flex-start;flex-direction:column;gap:7px}
  .sub-section-heading>p{text-align:left}
}
@media(max-width:720px){
  .subscription-saas-page{padding:18px 14px 64px}
  .sub-command-hero{padding:24px 20px;border-radius:22px}
  .sub-command-copy h2{font-size:34px}
  .sub-command-summary{display:block}
  .sub-command-plan{padding:0 0 16px;border:0;border-bottom:1px solid rgba(255,255,255,.12)}
  .sub-command-mini-grid{margin-top:15px}
  .sub-page-nav{justify-content:flex-start;margin:12px 0 28px}
  .subscription-saas-page .card.pad{padding:20px;border-radius:18px}
  .subscription-saas-page .sub-plans{grid-template-columns:1fr}
  .subscription-saas-page .sub-plan{min-height:0}
  .subscription-ai-section>.card.pad>div:first-child{padding:21px 20px 0}
  .subscription-ai-section>.card.pad>p{padding:0 20px}
  .subscription-ai-section>.card.pad>div:last-child{padding:12px 20px 22px}
  .sub-command-actions .btn{flex:1;justify-content:center}
}
@media(max-width:520px){
  .sub-command-mini-grid{grid-template-columns:1fr 1fr}
  .sub-command-status span:nth-child(2){display:none}
  .sub-section-heading h3{font-size:23px}
}