/* Cobalt Commerce & Account v4 */
:root {
  --cb-bg: #080d14;
  --cb-bg-deep: #05080d;
  --cb-surface: #101925;
  --cb-surface-2: #142030;
  --cb-surface-3: #19283a;
  --cb-border: #223249;
  --cb-border-soft: rgba(126,153,190,.17);
  --cb-text: #f5f8fc;
  --cb-copy: #b7c4d4;
  --cb-muted: #7f91a8;
  --cb-faint: #586a81;
  --cb-blue: #3b82f6;
  --cb-blue-2: #60a5fa;
  --cb-cyan: #22d3ee;
  --cb-green: #2dd4bf;
  --cb-yellow: #fbbf24;
  --cb-red: #fb7185;
  --cb-purple: #8b5cf6;
  --cb-radius: 12px;
  --cb-radius-sm: 8px;
  --cb-shell: min(1180px, calc(100% - 40px));
  --cb-shadow: 0 22px 60px rgba(0,0,0,.25);
}
* { box-sizing: border-box; }
html { color-scheme: dark; }
body.cb-billing-body {
  min-width: 320px;
  min-height: 100dvh;
  margin: 0;
  color: var(--cb-text);
  background: var(--cb-bg);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 14px;
  line-height: 1.5;
  text-rendering: optimizeLegibility;
}
.cb-billing-body a { color: inherit; text-decoration: none; }
.cb-billing-body button,
.cb-billing-body input,
.cb-billing-body select,
.cb-billing-body textarea { font: inherit; }
.cb-billing-body ::selection { color: #fff; background: rgba(59,130,246,.48); }
.cb-billing-body :focus-visible { outline: 2px solid var(--cb-blue-2); outline-offset: 2px; }
.cb-shell { min-height: 100dvh; }
.cb-topbar {
  position: sticky;
  z-index: 100;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: 66px;
  padding: 0 clamp(18px,4vw,44px);
  border-bottom: 1px solid var(--cb-border-soft);
  background: #0a1019;
}
.cb-brand { display: flex; align-items: center; gap: 10px; min-width: 0; }
.cb-brand img { width: 34px; height: 34px; border-radius: 9px; object-fit: cover; }
.cb-brand span { min-width: 0; }
.cb-brand strong { display: block; overflow: hidden; color: #fff; font-size: 14px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.cb-brand small { display: block; color: var(--cb-muted); font-size: 8px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.cb-top-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.cb-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid var(--cb-border);
  border-radius: 8px;
  color: #dbe5f2;
  background: #121c2a;
  box-shadow: none;
  font-size: 12px;
  font-weight: 750;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
  cursor: pointer;
  transition: border-color .16s ease, background .16s ease, color .16s ease;
}
.cb-button:hover { color: #fff; border-color: #3b5b7f; background: #17263a; }
.cb-button.primary { color: #fff; border-color: var(--cb-blue); background: var(--cb-blue); }
.cb-button.primary:hover { border-color: var(--cb-blue-2); background: #4b91f7; }
.cb-button.ghost { background: transparent; }
.cb-button.danger { color: #ff9cad; border-color: rgba(251,113,133,.32); background: rgba(251,113,133,.08); }
.cb-button.small { min-height: 32px; padding: 0 10px; border-radius: 7px; font-size: 10px; }
.cb-layout { width: var(--cb-shell); margin: 0 auto; padding: clamp(48px,6vw,78px) 0 72px; }
.cb-layout > * { min-width: 0; }
.cb-hero {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 34px;
  margin-bottom: 28px;
  padding-bottom: 28px;
  border-bottom: 1px solid var(--cb-border-soft);
}
.cb-hero > div:first-child { max-width: 820px; }
.cb-eyebrow { display: block; margin-bottom: 9px; color: var(--cb-blue-2); font-size: 9px; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.cb-hero h1 { margin: 0; color: #fff; font-size: clamp(36px,5vw,58px); font-weight: 840; line-height: 1.02; letter-spacing: -.055em; }
.cb-hero p { max-width: 760px; margin: 13px 0 0; color: var(--cb-muted); font-size: 14px; line-height: 1.65; }
.cb-hero-meta { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 7px; }
.cb-status,
.cb-chip,
.cb-plan-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 26px;
  padding: 0 9px;
  border: 1px solid var(--cb-border);
  border-radius: 999px;
  color: #a9bad0;
  background: #0c1420;
  font-size: 9px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}
.cb-status::before { content: ""; width: 6px; height: 6px; margin-right: 6px; border-radius: 50%; background: #64748b; }
.cb-status.active,
.cb-status.approved,
.cb-status.completed { color: #9df4df; border-color: rgba(45,212,191,.3); background: rgba(45,212,191,.08); }
.cb-status.active::before,
.cb-status.approved::before,
.cb-status.completed::before { background: var(--cb-green); box-shadow: 0 0 0 3px rgba(45,212,191,.12); }
.cb-status.failed,
.cb-status.cancelled,
.cb-status.payment_failed { color: #ffabb9; border-color: rgba(251,113,133,.3); background: rgba(251,113,133,.08); }
.cb-status.failed::before,
.cb-status.cancelled::before,
.cb-status.payment_failed::before { background: var(--cb-red); }
.cb-status.suspended,
.cb-status.pending { color: #ffdc82; border-color: rgba(251,191,36,.3); background: rgba(251,191,36,.08); }
.cb-status.suspended::before,
.cb-status.pending::before { background: var(--cb-yellow); }
.cb-plan-badge.pro { color: #dcecff; border-color: rgba(59,130,246,.4); background: rgba(59,130,246,.12); }
.cb-chip { color: #b9c7d8; }
.cb-section { margin-top: 30px; padding-top: 30px; border-top: 1px solid var(--cb-border-soft); }
.cb-section:first-of-type { margin-top: 0; padding-top: 0; border-top: 0; }
.cb-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 16px; }
.cb-section-head h2 { margin: 0; color: #fff; font-size: clamp(22px,2.5vw,30px); font-weight: 800; line-height: 1.1; letter-spacing: -.035em; }
.cb-section-head h3 { margin: 0; color: #fff; }
.cb-section-head p { max-width: 760px; margin: 7px 0 0; color: var(--cb-muted); }
.cb-grid { display: grid; gap: 14px; }
.cb-grid.two { grid-template-columns: repeat(2,minmax(0,1fr)); }
.cb-grid.three { grid-template-columns: repeat(3,minmax(0,1fr)); }
.cb-grid.four { grid-template-columns: repeat(4,minmax(0,1fr)); }
.cb-panel {
  min-width: 0;
  border: 1px solid var(--cb-border-soft);
  border-radius: var(--cb-radius);
  background: var(--cb-surface);
  box-shadow: none;
  overflow: hidden;
}
.cb-panel.accent { border-color: rgba(59,130,246,.48); box-shadow: inset 0 3px 0 var(--cb-blue); }
.cb-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  min-height: 66px;
  padding: 16px 18px;
  border-bottom: 1px solid var(--cb-border-soft);
  background: #121d2b;
}
.cb-panel-head h3 { margin: 0; color: #fff; font-size: 15px; font-weight: 780; }
.cb-panel-head p { margin: 5px 0 0; color: var(--cb-muted); font-size: 11px; }
.cb-panel-body { padding: 18px; }
.cb-kpi { padding: 18px; }
.cb-kpi small { display: block; color: var(--cb-muted); font-size: 9px; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.cb-kpi strong { display: block; margin-top: 10px; color: #fff; font-size: clamp(24px,3vw,34px); font-weight: 830; line-height: 1; }
.cb-kpi span { display: block; margin-top: 8px; color: var(--cb-muted); font-size: 10px; }
.cb-server-list,
.cb-subscription-list,
.cb-transaction-list { display: grid; gap: 0; }
.cb-server-row,
.cb-subscription-row,
.cb-transaction-row {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto auto;
  align-items: center;
  gap: 14px;
  min-height: 70px;
  padding: 12px 0;
  border-bottom: 1px solid var(--cb-border-soft);
}
.cb-server-row:first-child,
.cb-subscription-row:first-child,
.cb-transaction-row:first-child { padding-top: 0; }
.cb-server-row:last-child,
.cb-subscription-row:last-child,
.cb-transaction-row:last-child { padding-bottom: 0; border-bottom: 0; }
.cb-server-main { display: flex; align-items: center; gap: 12px; min-width: 0; }
.cb-server-main img,
.cb-server-avatar { width: 42px; height: 42px; min-width: 42px; border: 1px solid var(--cb-border); border-radius: 10px; background: #0b121d; object-fit: cover; }
.cb-server-avatar { display: grid; place-items: center; }
.cb-server-main > div,
.cb-row-copy { min-width: 0; }
.cb-server-main strong,
.cb-row-copy strong { display: block; overflow: hidden; color: #fff; font-size: 12px; font-weight: 760; text-overflow: ellipsis; white-space: nowrap; }
.cb-server-main small,
.cb-row-copy small { display: block; overflow: hidden; margin-top: 4px; color: var(--cb-muted); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.cb-empty { padding: 38px 18px; color: var(--cb-muted); text-align: center; }
.cb-empty strong { display: block; margin-bottom: 6px; color: #fff; font-size: 14px; }
.cb-price { display: flex; align-items: baseline; gap: 7px; margin-bottom: 18px; color: #fff; font-size: clamp(32px,4vw,46px); font-weight: 850; line-height: 1; letter-spacing: -.045em; }
.cb-price small { color: var(--cb-muted); font-size: 10px; font-weight: 650; letter-spacing: 0; }
.cb-feature-list { display: grid; gap: 10px; margin: 0 0 20px; padding: 0; list-style: none; }
.cb-feature-list li { position: relative; padding-left: 23px; color: var(--cb-copy); font-size: 12px; }
.cb-feature-list li::before { content: "✓"; position: absolute; left: 0; top: 0; color: var(--cb-green); font-weight: 900; }
.cb-note {
  padding: 14px 16px;
  border: 1px solid var(--cb-border-soft);
  border-radius: 9px;
  color: var(--cb-copy);
  background: #0e1723;
  font-size: 11px;
  line-height: 1.65;
}
.cb-note.warning { color: #ffe1a0; border-color: rgba(251,191,36,.28); background: rgba(251,191,36,.07); }
.cb-note.danger { color: #ffb0bd; border-color: rgba(251,113,133,.28); background: rgba(251,113,133,.07); }
.cb-flash { display: grid; gap: 4px; margin-bottom: 18px; padding: 14px 16px; border: 1px solid rgba(59,130,246,.28); border-radius: 9px; color: #cfe2ff; background: rgba(59,130,246,.08); }
.cb-flash.success { color: #b6f5e5; border-color: rgba(45,212,191,.28); background: rgba(45,212,191,.07); }
.cb-flash.error { color: #ffb2bf; border-color: rgba(251,113,133,.28); background: rgba(251,113,133,.07); }
.cb-flash strong { color: inherit; }
.cb-flash p { margin: 0; color: inherit; opacity: .82; }
.cb-form { display: grid; gap: 14px; }
.cb-form-row { display: flex; align-items: end; gap: 10px; flex-wrap: wrap; }
.cb-form-row > .cb-input { flex: 1 1 260px; }
.cb-field { display: grid; gap: 7px; color: var(--cb-copy); }
.cb-field > span { color: #9eb0c6; font-size: 9px; font-weight: 750; letter-spacing: .05em; text-transform: uppercase; }
.cb-field > small { color: var(--cb-muted); font-size: 9px; }
.cb-input,
.cb-select,
.cb-textarea {
  width: 100%;
  min-height: 42px;
  padding: 0 12px;
  border: 1px solid var(--cb-border);
  border-radius: 8px;
  outline: 0;
  color: var(--cb-text);
  background: #0b121d;
  box-shadow: none;
}
.cb-textarea { min-height: 120px; padding: 11px 12px; resize: vertical; }
.cb-input::placeholder,
.cb-textarea::placeholder { color: #607187; }
.cb-input:focus,
.cb-select:focus,
.cb-textarea:focus { border-color: var(--cb-blue); box-shadow: 0 0 0 3px rgba(59,130,246,.12); }
.cb-checkbox { display: inline-flex; align-items: center; gap: 8px; color: var(--cb-copy); font-size: 11px; }
.cb-checkbox input { accent-color: var(--cb-blue); }
.cb-table-wrap {
  width: 100%;
  overflow: auto;
  border: 1px solid var(--cb-border-soft);
  border-radius: var(--cb-radius);
  background: var(--cb-surface);
}
.cb-table { width: 100%; min-width: 760px; border-collapse: collapse; }
.cb-table th,
.cb-table td { padding: 12px 14px; border-bottom: 1px solid var(--cb-border-soft); text-align: left; vertical-align: middle; }
.cb-table th { position: sticky; z-index: 2; top: 0; color: #8fa2ba; background: #121d2b; font-size: 9px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.cb-table td { color: var(--cb-copy); font-size: 11px; }
.cb-table tr:last-child td { border-bottom: 0; }
.cb-table tr:hover td { background: rgba(96,165,250,.025); }
.cb-table form { margin: 0; }
.cb-table code,
.cb-code,
.cb-note code { padding: 3px 6px; border-radius: 5px; color: #acd0ff; background: #0a111b; font-family: "SFMono-Regular", Consolas, monospace; font-size: 9px; overflow-wrap: anywhere; }
.cb-tabs {
  display: flex;
  align-items: center;
  gap: 3px;
  margin: 0 0 18px;
  padding: 4px;
  border: 1px solid var(--cb-border-soft);
  border-radius: 10px;
  background: #0d1622;
  overflow-x: auto;
}
.cb-tabs a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 0 12px;
  border-radius: 7px;
  color: var(--cb-muted);
  font-size: 10px;
  font-weight: 750;
  white-space: nowrap;
}
.cb-tabs a:hover { color: #fff; background: #142338; }
.cb-tabs a.active { color: #fff; background: var(--cb-blue); }
.cb-tab-panel { min-width: 0; }
.cb-owner-nav {
  position: sticky;
  top: 82px;
  align-self: start;
  display: grid;
  gap: 4px;
  padding: 10px;
  border: 1px solid var(--cb-border-soft);
  border-radius: 10px;
  background: #0d1622;
}
.cb-owner-nav a { min-height: 38px; padding: 0 10px; display: flex; align-items: center; border-radius: 7px; color: var(--cb-muted); font-size: 10px; font-weight: 750; }
.cb-owner-nav a:hover { color: #fff; background: #142338; }
.cb-owner-nav a.active { color: #fff; background: rgba(59,130,246,.18); box-shadow: inset 3px 0 0 var(--cb-blue); }
.cb-owner-menu { display: grid; grid-template-columns: 190px minmax(0,1fr); gap: 16px; min-width: 0; }
.cb-split { display: grid; grid-template-columns: minmax(0,1fr) minmax(300px,.42fr); gap: 16px; }
.cb-sticky { position: sticky; top: 84px; align-self: start; }
.cb-personalizer-preview { overflow: hidden; border: 1px solid var(--cb-border-soft); border-radius: var(--cb-radius); background: var(--cb-surface); }
.cb-personalizer-banner { min-height: 140px; background: linear-gradient(135deg,#172b45,#10203a 52%,#16223b); background-position: center; background-size: cover; }
.cb-personalizer-card { position: relative; display: flex; gap: 14px; padding: 20px 18px 18px; }
.cb-personalizer-avatar { width: 74px; height: 74px; margin-top: -50px; border: 5px solid var(--cb-surface); border-radius: 22px; background: #0b121d; object-fit: cover; }
.cb-personalizer-copy h3 { margin: 0; color: #fff; }
.cb-personalizer-copy p { margin: 6px 0 0; color: var(--cb-muted); font-size: 11px; }
.cb-paywall { min-height: 100dvh; display: grid; place-items: center; padding: 28px; }
.cb-paywall-mark { width: 72px; height: 72px; margin: 0 auto 20px; display: grid; place-items: center; border: 1px solid rgba(59,130,246,.35); border-radius: 20px; color: var(--cb-blue-2); background: rgba(59,130,246,.1); font-size: 28px; }
.cb-paywall .cb-panel { width: min(620px,100%); text-align: center; }
.cb-paywall-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 9px; margin-top: 18px; }
.cb-danger-zone { border-color: rgba(251,113,133,.28); }

@media (max-width: 1000px) {
  .cb-grid.four { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .cb-grid.three { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .cb-owner-menu { grid-template-columns: 1fr; }
  .cb-owner-nav { position: static; display: flex; overflow-x: auto; }
  .cb-owner-nav a { white-space: nowrap; }
  .cb-split { grid-template-columns: 1fr; }
  .cb-sticky { position: static; }
}
@media (max-width: 720px) {
  .cb-topbar { align-items: flex-start; min-height: 0; padding: 12px 14px; }
  .cb-brand small { display: none; }
  .cb-top-actions { justify-content: flex-end; }
  .cb-top-actions .cb-button { min-height: 36px; padding: 0 10px; font-size: 10px; }
  .cb-layout { width: min(100% - 28px,1180px); padding: 42px 0 58px; }
  .cb-hero { align-items: stretch; flex-direction: column; gap: 18px; }
  .cb-hero h1 { font-size: clamp(34px,12vw,48px); }
  .cb-hero-meta { justify-content: flex-start; }
  .cb-grid.two,
  .cb-grid.three,
  .cb-grid.four { grid-template-columns: 1fr; }
  .cb-server-row,
  .cb-subscription-row,
  .cb-transaction-row { grid-template-columns: minmax(0,1fr) auto; }
  .cb-server-row > .cb-button,
  .cb-subscription-row > .cb-button,
  .cb-transaction-row > .cb-button { grid-column: 1 / -1; width: 100%; }
  .cb-section-head { align-items: stretch; flex-direction: column; }
  .cb-form-row { align-items: stretch; flex-direction: column; }
  .cb-form-row > * { width: 100%; }
  .cb-tabs { margin-inline: -2px; }
}
.cb-pricing-hero { align-items:center; }
.cb-billing-toggle { display:flex;padding:4px;border:1px solid var(--cb-border);border-radius:10px;background:#0d1622; }
.cb-billing-toggle button { min-height:38px;padding:0 13px;border:0;border-radius:7px;color:var(--cb-muted);background:transparent;font-size:10px;font-weight:750;cursor:pointer;white-space:nowrap; }
.cb-billing-toggle button span { display:block;color:#7adbc8;font-size:7px; }
.cb-billing-toggle button.active { color:#fff;background:var(--cb-blue); }
.cb-billing-toggle button.active span { color:#dcecff; }
.cb-pricing-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px; }
.cb-plan-card { position:relative;min-width:0;padding:28px;border:1px solid var(--cb-border-soft);border-radius:14px;background:var(--cb-surface);overflow:hidden; }
.cb-plan-card header h2 { margin:0;color:#fff;font-size:30px;font-weight:830;letter-spacing:-.04em; }
.cb-plan-card header p { min-height:48px;margin:8px 0 0;color:var(--cb-muted);font-size:12px;line-height:1.6; }
.cb-plan-pro { border-color:rgba(59,130,246,.55);background:linear-gradient(155deg,rgba(59,130,246,.13),var(--cb-surface) 38%);box-shadow:inset 0 3px 0 var(--cb-blue); }
.cb-plan-recommended { position:absolute;top:16px;right:16px;padding:5px 8px;border-radius:6px;color:#dcecff;background:rgba(59,130,246,.18);font-size:7px;font-weight:900;letter-spacing:.08em; }
.cb-plan-price { display:flex;align-items:flex-end;gap:12px;margin:28px 0 20px; }
.cb-plan-price strong { color:#fff;font-size:46px;font-weight:860;line-height:.9;letter-spacing:-.055em; }
.cb-plan-price span { color:var(--cb-muted);font-size:9px;line-height:1.45; }
.cb-plan-card>.cb-button { width:100%; }
.cb-plan-divider { height:1px;margin:24px 0;background:var(--cb-border-soft); }
.cb-plan-includes { display:block;margin-bottom:14px;color:#fff;font-size:11px; }
.cb-addon-price { display:flex;align-items:baseline;gap:8px;margin-bottom:18px; }
.cb-addon-price strong { color:#fff;font-size:30px;font-weight:830;letter-spacing:-.04em; }
.cb-addon-price span { color:var(--cb-muted);font-size:9px; }
.cb-pricing-points article { padding:20px;border-top:2px solid var(--cb-blue);background:transparent; }
.cb-pricing-points strong { color:#fff;font-size:13px; }
.cb-pricing-points p { margin:8px 0 0;color:var(--cb-muted);font-size:11px;line-height:1.65; }
.cb-pricing-cta { display:flex;align-items:center;justify-content:space-between;gap:30px;margin-top:34px;padding:28px;border:1px solid rgba(59,130,246,.38);border-radius:14px;background:linear-gradient(110deg,rgba(59,130,246,.15),rgba(16,25,37,.96) 50%,rgba(34,211,238,.06)); }
.cb-pricing-cta h2 { margin:0;color:#fff;font-size:30px;font-weight:830;letter-spacing:-.04em; }
.cb-pricing-cta p { max-width:700px;margin:8px 0 0;color:var(--cb-muted);font-size:11px; }
@media(max-width:800px){.cb-pricing-grid{grid-template-columns:1fr}.cb-pricing-hero{align-items:stretch}.cb-billing-toggle{align-self:flex-start}.cb-pricing-cta{align-items:stretch;flex-direction:column}.cb-pricing-cta .cb-button{width:100%}}
.cb-account-hero { display:flex;align-items:center;justify-content:space-between;gap:28px;margin-bottom:18px;padding:26px;border:1px solid rgba(59,130,246,.34);border-radius:14px;background:linear-gradient(115deg,rgba(59,130,246,.15),rgba(16,25,37,.96) 48%,rgba(34,211,238,.05)); }
.cb-account-profile { display:flex;align-items:center;gap:18px;min-width:0; }
.cb-account-avatar { display:grid;place-items:center;width:64px;height:64px;min-width:64px;border:1px solid rgba(96,165,250,.35);border-radius:17px;color:#dcecff;background:rgba(59,130,246,.15);font-size:18px;font-weight:850; }
.cb-account-profile h1 { margin:0;color:#fff;font-size:clamp(28px,4vw,44px);font-weight:840;line-height:1.04;letter-spacing:-.05em; }
.cb-account-profile p { max-width:720px;margin:8px 0 0;color:var(--cb-muted);font-size:12px; }
.cb-account-state { display:flex;justify-content:flex-end;flex-wrap:wrap;gap:7px; }
.cb-account-summary { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px; }
.cb-account-summary article { min-width:0;padding:17px;border:1px solid var(--cb-border-soft);border-radius:10px;background:var(--cb-surface); }
.cb-account-summary small { display:block;color:var(--cb-muted);font-size:8px;font-weight:750;letter-spacing:.06em;text-transform:uppercase; }
.cb-account-summary strong { display:block;overflow:hidden;margin-top:9px;color:#fff;font-size:24px;font-weight:820;text-overflow:ellipsis;white-space:nowrap; }
.cb-account-summary span { display:block;margin-top:7px;overflow:hidden;color:var(--cb-muted);font-size:9px;text-overflow:ellipsis;white-space:nowrap; }
.cb-account-server-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px; }
.cb-account-server-card { display:flex;align-items:center;justify-content:space-between;gap:14px;min-width:0;padding:15px;border:1px solid var(--cb-border-soft);border-radius:11px;background:var(--cb-surface); }
.cb-account-server-card:hover { border-color:#355170;background:#121e2d; }
.cb-account-server-plan { display:flex;align-items:center;gap:8px; }
@media(max-width:950px){.cb-account-summary{grid-template-columns:repeat(2,1fr)}.cb-account-server-grid{grid-template-columns:1fr}.cb-account-hero{align-items:flex-start;flex-direction:column}.cb-account-state{justify-content:flex-start}}
@media(max-width:600px){.cb-account-summary{grid-template-columns:1fr}.cb-account-profile{align-items:flex-start}.cb-account-avatar{width:52px;height:52px;min-width:52px}.cb-account-server-card{align-items:stretch;flex-direction:column}.cb-account-server-plan{justify-content:space-between}}

.cb-plan-state-note{margin:12px 0 0;padding:11px 12px;border-left:2px solid var(--cb-yellow);color:#d6c689;background:rgba(251,191,36,.055);font-size:11px;line-height:1.55}

/* COBALT OWN APP PERSONALIZER START */
.cb-personalizer-hero { margin-bottom: 18px; }
.cb-personalizer-tabs {
  display: inline-flex;
  gap: 4px;
  margin: 0 0 26px;
  padding: 4px;
  border: 1px solid var(--cb-border-soft);
  border-radius: 10px;
  background: #0b1420;
}
.cb-personalizer-tabs a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 15px;
  border-radius: 7px;
  color: var(--cb-muted);
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
}
.cb-personalizer-tabs a:hover { color: #fff; background: #142235; }
.cb-personalizer-tabs a.active { color: #fff; background: var(--cb-blue); box-shadow: 0 8px 24px rgba(59,130,246,.18); }
.cb-rate-limit-note { margin-bottom: 18px; }
.cb-custom-status-grid {
  display: grid;
  grid-template-columns: minmax(0,1.55fr) minmax(310px,.85fr);
  gap: 14px;
  margin-bottom: 16px;
}
.cb-custom-bot-identity .cb-panel-body {
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto;
  align-items: center;
  gap: 15px;
}
.cb-custom-bot-avatar {
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  overflow: hidden;
  border: 1px solid rgba(96,165,250,.32);
  border-radius: 16px;
  color: #cfe2ff;
  background: rgba(59,130,246,.12);
  font-size: 11px;
  font-weight: 900;
}
.cb-custom-bot-avatar img { width: 100%; height: 100%; object-fit: cover; }
.cb-custom-bot-identity h2 { margin: 3px 0 0; color: #fff; font-size: 20px; font-weight: 840; letter-spacing: -.025em; }
.cb-custom-bot-identity p { margin: 5px 0 0; overflow-wrap: anywhere; color: var(--cb-muted); font-size: 10px; }
.cb-custom-bot-metrics .cb-panel-body,
.cb-custom-bot-metrics {
  display: grid;
  grid-template-columns: 1fr;
  align-content: center;
}
.cb-custom-bot-metrics > div {
  min-width: 0;
  padding: 13px 16px;
  border-bottom: 1px solid var(--cb-border-soft);
}
.cb-custom-bot-metrics > div:last-child { border-bottom: 0; }
.cb-custom-bot-metrics small { display: block; color: var(--cb-muted); font-size: 7px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.cb-custom-bot-metrics strong { display: block; overflow: hidden; margin-top: 6px; color: #fff; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.cb-custom-setup-grid,
.cb-custom-control-grid { align-items: stretch; margin-bottom: 16px; }
.cb-step-list { display: grid; gap: 0; }
.cb-step-list > div {
  display: grid;
  grid-template-columns: 34px minmax(0,1fr);
  gap: 12px;
  padding: 13px 0;
  border-bottom: 1px solid var(--cb-border-soft);
}
.cb-step-list > div:first-child { padding-top: 0; }
.cb-step-list > div:last-of-type { margin-bottom: 15px; }
.cb-step-list > div > span {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 8px;
  color: #cfe2ff;
  background: rgba(59,130,246,.13);
  font-size: 8px;
  font-weight: 900;
}
.cb-step-list p { margin: 0; }
.cb-step-list strong { display: block; color: #fff; font-size: 11px; }
.cb-step-list small { display: block; margin-top: 4px; color: var(--cb-muted); font-size: 9px; line-height: 1.55; }
.cb-secret-input { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; letter-spacing: .025em; }
.cb-action-row { display: flex; flex-wrap: wrap; gap: 8px; }
.cb-action-row form { margin: 0; }
.cb-security-panel .cb-feature-list { margin: 0; }
.cb-security-panel .cb-feature-list li { position: relative; padding-left: 22px; }
.cb-security-panel .cb-feature-list li::before { content: "✓"; position: absolute; left: 0; color: #45d6b0; font-weight: 900; }
.cb-danger-zone {
  display: grid;
  gap: 12px;
  margin-top: 8px;
  padding: 16px;
  border: 1px solid rgba(251,113,133,.28);
  border-radius: 10px;
  background: rgba(251,113,133,.035);
}
.cb-custom-owner-kpis { margin-bottom: 16px; }
.cb-custom-owner-table td { vertical-align: top; }
.cb-custom-owner-table .cb-owner-bot-cell { display: flex; align-items: center; gap: 10px; min-width: 190px; }
.cb-custom-owner-table .cb-owner-bot-cell img,
.cb-custom-owner-table .cb-owner-bot-placeholder { width: 34px; height: 34px; min-width: 34px; border-radius: 9px; object-fit: cover; background: #101d2c; }
.cb-custom-owner-table .cb-owner-bot-placeholder { display: grid; place-items: center; color: var(--cb-blue-2); font-size: 8px; font-weight: 900; }
.cb-custom-owner-table code { overflow-wrap: anywhere; }
.cb-custom-owner-actions { display: grid; gap: 7px; min-width: 180px; }
.cb-custom-owner-actions form { margin: 0; }
.cb-custom-owner-actions .cb-form-row { gap: 6px; }
.cb-custom-owner-actions .cb-input,
.cb-custom-owner-actions .cb-select { min-height: 34px; font-size: 9px; }
.cb-custom-owner-actions .cb-button { width: 100%; }

@media (max-width: 900px) {
  .cb-custom-status-grid { grid-template-columns: 1fr; }
  .cb-custom-bot-metrics { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .cb-custom-bot-metrics > div { border-right: 1px solid var(--cb-border-soft); border-bottom: 0; }
  .cb-custom-bot-metrics > div:last-child { border-right: 0; }
}
@media (max-width: 620px) {
  .cb-personalizer-tabs { display: flex; width: 100%; overflow-x: auto; }
  .cb-personalizer-tabs a { flex: 1 0 auto; }
  .cb-custom-bot-identity .cb-panel-body { grid-template-columns: auto minmax(0,1fr); }
  .cb-custom-bot-identity .cb-status { grid-column: 1 / -1; justify-self: start; }
  .cb-custom-bot-metrics { grid-template-columns: 1fr; }
  .cb-custom-bot-metrics > div { border-right: 0; border-bottom: 1px solid var(--cb-border-soft); }
  .cb-custom-bot-metrics > div:last-child { border-bottom: 0; }
  .cb-action-row { flex-direction: column; }
  .cb-action-row form,
  .cb-action-row .cb-button { width: 100%; }
}
/* COBALT OWN APP PERSONALIZER END */

/* COBALT PURCHASE OPTIONS V1 START */
.cb-purchase-form { margin-top: 20px; }
.cb-purchase-explainer {
  margin-top: -2px;
  padding: 11px 12px;
  border-left: 2px solid rgba(96,165,250,.55);
  color: #9db0c7;
  background: rgba(59,130,246,.055);
  font-size: 9px;
  line-height: 1.6;
}
.cb-purchase-price-list {
  display: grid;
  margin: 18px 0;
  border-top: 1px solid var(--cb-border-soft);
}
.cb-purchase-price-list > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 13px 0;
  border-bottom: 1px solid var(--cb-border-soft);
}
.cb-purchase-price-list > div.is-subscription { border-bottom-color: rgba(96,165,250,.3); }
.cb-purchase-price-list span { min-width: 0; }
.cb-purchase-price-list strong,
.cb-purchase-price-list small { display: block; }
.cb-purchase-price-list strong { color: #eef5ff; font-size: 10px; }
.cb-purchase-price-list small { margin-top: 4px; color: var(--cb-muted); font-size: 8px; }
.cb-purchase-price-list b { flex: 0 0 auto; color: #fff; font-size: 11px; }
.cb-subscription-row > code { color: #7890aa; font-size: 8px; overflow-wrap: anywhere; }
@media (max-width: 620px) {
  .cb-purchase-price-list > div { align-items: flex-start; flex-direction: column; gap: 8px; }
  .cb-subscription-row > code { grid-column: 1 / -1; }
}
/* COBALT PURCHASE OPTIONS V1 END */
