/* Shared console finish: stable pages, clear editing states and compact surfaces. */
html.vion-console { scroll-behavior: auto !important; scrollbar-gutter: stable; }
.vion-console body { min-width: 320px; }
.app-frame { --ui-accent: #53c6ff; --ui-good: #5cd7a6; --ui-danger: #ff9da6; }
.admin-frame { --ui-accent: #b6bbc3; --ui-good: #5cd7a6; --ui-danger: #ff9da6; --list-text: var(--admin-text); }
[data-theme="light"] .app-frame { --ui-accent: #006fae; --ui-good: #146d49; --ui-danger: #aa293b; }
[data-theme="light"] .admin-frame { --ui-accent: #575c64; --ui-good: #146d49; --ui-danger: #aa293b; }
.app-content, .admin-content { padding-bottom: 100px; }
.app-frame :is(article[id], section[id], details[id]),
.admin-frame :is(article[id], section[id], details[id]) { scroll-margin-top: 125px; }
.app-frame :is(button, a, input, select, textarea),
.admin-frame :is(button, a, input, select, textarea) { -webkit-tap-highlight-color: transparent; }
.app-frame :is(button, select), .admin-frame :is(button, select) { cursor: pointer; }
.app-frame :is(input, select, textarea):disabled,
.admin-frame :is(input, select, textarea):disabled { cursor: not-allowed; opacity: .6; }
.app-frame :is(input, textarea), .admin-frame :is(input, textarea) { caret-color: var(--ui-accent); }
.app-frame :focus-visible, .admin-frame :focus-visible { outline-color: var(--ui-accent) !important; }
.app-frame textarea, .admin-frame textarea { resize: vertical; min-height: 96px; line-height: 1.6; }
.app-frame form[aria-busy="true"], .admin-frame form[aria-busy="true"] { opacity: 1; }
form[aria-busy="true"] :is(button[type="submit"], button:not([type])) { cursor: progress; opacity: .7; }
form[aria-busy="true"] :is(input, select, textarea) { opacity: .75; }
.app-frame[data-updating]::after, .admin-frame[data-updating]::after {
  content: ""; position: fixed; z-index: 100; top: 0; left: 0; width: 100%; height: 3px;
  background: linear-gradient(90deg, transparent, var(--ui-accent), transparent);
  background-size: 45% 100%; background-repeat: no-repeat;
  animation: console-progress 1.4s ease-in-out infinite; pointer-events: none;
}
@keyframes console-progress { from { background-position: -85% 0; } to { background-position: 185% 0; } }
.form-feedback { grid-column: 1 / -1; flex: 1 1 100%; margin-top: 4px; color: var(--ui-good); font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
.form-feedback.is-error { color: var(--ui-danger); padding: 10px 12px; border: 1px solid currentColor; border-radius: 8px; }
.form-feedback:empty { display: none; }
.form-feedback.is-dirty { color: var(--ui-accent); }
.ui-status {
  display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding: 14px 46px 14px 18px;
  max-width: min(480px, calc(100vw - 32px)); right: 16px; bottom: max(16px, env(safe-area-inset-bottom));
  background: #15232e; border-color: #4b6978; box-shadow: 0 12px 40px #0004; pointer-events: auto;
  overflow-wrap: anywhere;
}
.ui-status.is-error { background: #321f27; border-color: #b85e70; }
.ui-status.is-pending { border-color: #7b8fa2; }
.ui-status button { font: inherit; cursor: pointer; color: inherit; }
.ui-status-close { position: absolute; right: 5px; top: 5px; width: 36px; height: 36px; border: 0; border-radius: 7px; background: transparent; }
.ui-status-close::before { content: "×"; font-size: 24px; line-height: 1; }
.ui-status-close:hover { background: #ffffff18; }
.ui-status-action { min-height: 36px; padding: 5px 10px; background: #ffffff0c; border: 1px solid #ffffff40; border-radius: 7px; }
.ui-status button:focus-visible { outline: 2px solid currentColor; outline-offset: 1px; }
[data-theme="light"] .ui-status { background: #fff; color: #193244; border-color: #9bb8c8; box-shadow: 0 12px 40px #16334920; }
[data-theme="light"] .ui-status.is-error { background: #fff5f5; color: #882139; border-color: #d48d9c; }
[data-theme="light"] .ui-status-action { border-color: #9bb8c8; }
[data-theme="light"] .ui-status-close:hover { background: #1932440c; }

/* Editing a price is a small, readable form on every screen size. */
.model-sale-grid > .table-scroll { align-items: start; }
.admin-frame .model-sale-card { background: var(--admin-panel); border-color: var(--admin-border); }
.admin-frame .model-sale-card h3 { font-size: 18px; line-height: 1.35; letter-spacing: -.02em; }
.model-sale-identity > div { min-width: 0; }
.model-sale-card header { align-items: flex-start; }
.model-sale-card .state-badge { white-space: normal; line-height: 1.4; padding: 5px 8px; }
.model-sale-card :is(.model-sale-spend, .price-directions) { font-size: 13px; line-height: 1.6; }
.admin-frame .model-sale-form label { font-size: 12px; color: var(--admin-muted); }
.admin-frame :is(.model-sale-form, .pricing-basis, [data-oem-provider-picker]) :is(input:not([type="hidden"]), select) {
  width: 100%; min-width: 0; min-height: 44px; border: 1px solid var(--admin-border);
  border-radius: 9px; padding: 10px 12px; font: inherit; color: var(--admin-text); background: var(--admin-input-bg);
}
.model-sale-form input { font-variant-numeric: tabular-nums; }
.model-sale-card footer { padding-top: 12px; border-top: 1px solid var(--admin-border); }
.model-sale-card details { color: var(--admin-muted); font-size: 13px; }
.model-sale-card summary { cursor: pointer; min-height: 36px; line-height: 1.6; }
.model-sale-card details[open] { color: var(--admin-text); }
.model-sale-card details code { white-space: normal; overflow-wrap: anywhere; }
.model-sale-status { display:flex; flex-wrap:wrap; gap:6px; }
.model-economics { border:1px solid var(--admin-border); border-radius:10px; overflow:hidden; font-size:13px; font-variant-numeric:tabular-nums; }
.model-economics > div { display:grid; grid-template-columns:minmax(0,1.3fr) repeat(2,minmax(0,1fr)); align-items:baseline; gap:8px; padding:8px 10px; }
.model-economics > div + div { border-top:1px solid var(--admin-border); }
.model-economics > div > :not(:first-child) { text-align:right; overflow-wrap:anywhere; }
.model-economics > div > :first-child { color:var(--admin-muted); overflow-wrap:anywhere; }
.model-economics-time > div { grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); }
.model-economics .economics-heading { background:var(--admin-panel-2); font-size:12px; }
.model-economics .economics-profit { background:color-mix(in srgb,var(--ui-good) 7%,transparent); }
.model-economics .economics-profit strong { color:var(--ui-good); }
.model-economics .economics-profit .is-loss { color:var(--ui-danger); }
.economics-comparison, .model-reference { font-size:12px; color:var(--admin-muted); }
.model-reference a { color:var(--ui-accent); display:inline-flex; align-items:center; gap:4px; }
.model-reference .is-stale { color:var(--ui-accent); }
.model-sale-card .model-sale-form { margin-top:10px; }
.model-sale-card .model-sale-form > button, .model-reference-form .reference-source { grid-column:1/-1; }
.model-sale-card .model-sale-form > button { justify-self:stretch; }
.model-sale-card footer { align-items:stretch; }
.model-sale-card footer > form { flex:1 1 160px; }
.model-sale-card footer button { width:100%; min-height:40px; }
.model-sale-card .model-sale-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.admin-frame .overview-traffic { grid-template-columns:repeat(3,minmax(0,1fr)); }
.dashboard-finance > .admin-metrics { margin:16px 0; }
.dashboard-finance [data-finance] { font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
@media (max-width:600px) { .admin-frame .overview-traffic { grid-template-columns:1fr; } }
.pricing-basis-card h2 { font-size: 18px; line-height: 1.4; margin: 0 0 16px; }
.pricing-basis-card > .admin-hint { margin-bottom: 0; }
.admin-frame [data-oem-provider-picker] { align-items: start; gap: 16px; }
[data-oem-provider-picker] > label { display: grid; gap: 7px; min-width: 0; }
[data-oem-provider-picker] > button { align-self: end; }
[data-oem-provider-picker] label small { font-size: 12px; color: var(--admin-muted); line-height: 1.5; }
[data-oem-model-search] { margin: 0; }

.list-tools { padding: 14px; margin: 12px 0 18px; border: 1px solid var(--list-border); border-radius: 12px; background: var(--list-panel); gap: 12px; }
.list-tools label { min-width: 140px; flex: 1 1 160px; }
.list-tools label:first-child { flex: 2 1 240px; }
.list-tools [data-list-count] { flex: 1 0 auto; font-variant-numeric: tabular-nums; }
.list-tools > button { min-height: 40px; }
.list-tools input, .list-tools select { min-width: 0; }
.admin-frame .customer-card { background: var(--admin-panel); border-color: var(--admin-border); }
.customer-card.blocked { border-left-color: var(--ui-accent); }
.customer-identity > strong { font-size: 16px; line-height: 1.4; }
.customer-balances { align-content: center; }
.customer-balances > div { min-width: 0; }
.customer-balances dd { font-size: 18px; letter-spacing: -.025em; }
.customer-card .customer-actions :is(button, a) { min-height: 40px; font-size: 13px; }
.customer-card .customer-actions .admin-danger-button { margin-left: auto; }
.customer-card .customer-actions form:last-child { margin-left: auto; }
.customer-card:focus-within, .model-sale-card:focus-within { border-color: var(--ui-accent); }
.app-frame .cc-segments { flex-wrap: wrap; }
.app-frame .cc-model-card:focus-within { border-color: var(--ui-accent); }
.app-frame .cc-model-grid { gap: 16px; }
.app-frame .cc-prices dd { letter-spacing: -.02em; }
.app-frame .cc-prices dt { line-height: 1.5; }
@media (max-width: 760px) {
  .list-tools { padding: 12px; }
  .app-frame :is(input, select, textarea), .admin-frame :is(input, select, textarea),
  .admin-frame :is(.model-sale-form, .pricing-basis, [data-oem-provider-picker]) :is(input, select) { font-size: 16px; }
  .app-frame .cc-filter-row { align-items: flex-start; }
  .ui-status { font-size: 13px; }
  .admin-frame [data-oem-provider-picker] { grid-template-columns: minmax(0, 1fr); }
  .customer-card .customer-actions { gap: 8px; }
}
@media (max-width: 420px) {
  .model-sale-form { grid-template-columns: minmax(0, 1fr); }
  .list-tools label { flex-basis: 100%; }
  .customer-balances { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .customer-balances > div { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
  .customer-balances dt { margin: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .app-frame[data-updating]::after, .admin-frame[data-updating]::after { animation: none; background-size: 100% 100%; }
}

/* Navigation remains recognisable while the next section loads. */
.app-sidebar a, .admin-sidebar a, .admin-section-tabs a { transition: background-color .15s, border-color .15s, color .15s; }
.app-sidebar a.is-loading, .admin-sidebar a.is-loading, .admin-section-tabs a.is-loading { color: var(--ui-accent); background: color-mix(in srgb, var(--ui-accent) 10%, transparent); }
.app-sidebar a.is-loading::after, .admin-sidebar a.is-loading::after, .admin-section-tabs a.is-loading::after {
  content: ""; flex: 0 0 12px; width: 12px; height: 12px; margin-left: auto;
  border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: nav-loading .8s linear infinite;
}
@keyframes nav-loading { to { transform: rotate(360deg); } }
.admin-section-tabs { max-width: 100%; gap: 4px; padding: 4px; }
.admin-section-tabs a { min-height: 40px; height: auto; padding: 8px 14px; font-size: 13px; line-height: 1.4; }
.app-topbar h1, .admin-topbar h1 { margin-bottom: 6px; }
.app-topbar p, .admin-topbar p { max-width: 72ch; line-height: 1.5; }
.app-frame form[data-dirty] .button.primary, .admin-frame form[data-dirty] .admin-primary-button { box-shadow: 0 0 0 2px color-mix(in srgb, var(--ui-accent) 28%, transparent); }
@media (max-width: 760px) {
  .admin-section-tabs { display: flex; flex-wrap: nowrap; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; }
  .admin-section-tabs a { flex-shrink: 0; }
  .app-topbar, .admin-topbar { min-height: 80px; padding-block: 12px; }
  .app-frame .gateway-state { max-width: 160px; line-height: 1.3; white-space: normal; text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
  .app-sidebar a, .admin-sidebar a, .admin-section-tabs a { transition: none; }
  .app-sidebar a.is-loading::after, .admin-sidebar a.is-loading::after, .admin-section-tabs a.is-loading::after { animation: none; }
}

.customer-directory { padding: 20px; }
.customer-directory .customer-card { padding: 14px 16px; gap: 12px; background: var(--admin-panel-2); }
.customer-directory .customer-identity { gap: 5px; }
.customer-results { color: var(--admin-muted); font-size: 13px; font-variant-numeric: tabular-nums; }
.customer-pagination { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:12px; margin-top:20px; padding-top:16px; border-top:1px solid var(--admin-border); }
.customer-pagination > span { color:var(--admin-muted); font-size:13px; }
.customer-pagination [aria-disabled] { opacity:.55; padding:10px; }
@media (max-width:760px) { .customer-directory { padding:12px; } .customer-directory .customer-filters { padding:0; border:0; } }

/* Keep routine model work close to the list; expand configuration on demand. */
.admin-payment-state { display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border:1px solid var(--admin-border); border-radius:9px; color:var(--admin-muted); font-size:12px; line-height:1.4; }
.pricing-settings { margin-bottom:20px; border:1px solid var(--admin-border); border-radius:12px; background:var(--admin-panel); }
.pricing-settings > summary { display:flex; flex-wrap:wrap; align-items:center; gap:8px 18px; padding:16px 18px; cursor:pointer; list-style:none; }
.pricing-settings > summary::after { content:'+'; font-size:20px; margin-left:auto; color:var(--ui-accent); }
.pricing-settings[open] > summary::after { content:'−'; }
.pricing-settings > summary small { color:var(--admin-muted); font-variant-numeric:tabular-nums; }
.pricing-settings > .pricing-basis { margin:0; padding:0 16px 16px; }
.model-catalog-toolbar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-bottom:12px; }
.model-catalog-toolbar .segmented-control { margin:0; }
.model-pagination { grid-column:1/-1; display:flex; justify-content:center; align-items:center; gap:16px; padding:16px 0 4px; color:var(--admin-muted); font-size:13px; }
.model-pagination[hidden] { display:none; }
.oem-source-help { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; padding:18px 20px; }
.oem-source-help > div { flex:1 1 320px; }
.request-safety-note { margin-top:20px; padding:16px; border:1px solid var(--admin-border); border-radius:10px; background:var(--admin-panel-2); }
.request-safety-note p { max-width:80ch; font-size:13px; line-height:1.6; }
.oem-source-help p { color:var(--admin-muted); font-size:13px; line-height:1.6; margin:6px 0 0; }
.admin-frame .pricing-settings:focus-within { border-color:var(--ui-accent); }
.admin-frame .model-sale-card { gap:10px; }
.admin-frame .model-sale-card .model-price-editor { padding-top:8px; }
.admin-frame .model-price-editor summary { color:var(--ui-accent); }
.admin-frame .pricing-settings, .admin-frame .model-sale-card { scroll-margin-top:120px; }
@media (max-width:600px) {
  .admin-payment-state { max-width:155px; padding:7px 9px; }
  .pricing-settings > summary { padding:14px; }
  .pricing-settings > .pricing-basis { padding:0 10px 10px; grid-template-columns:minmax(0,1fr); }
  .model-pagination { gap:10px; }
}

/* Graphite controls with silver accents in both console themes. */
.admin-frame .admin-primary-button {
  color:#f4f6f8; border-color:#718092;
  background:linear-gradient(135deg,#3f4956,#535f6e);
  box-shadow:inset 0 1px 0 #ffffff14;
}
.admin-frame .admin-primary-button:hover:not(:disabled) { background:#596879; border-color:#99a7b7; }
.admin-frame input[type="checkbox"], .admin-frame input[type="radio"] { accent-color:#6c7b8e; }

/* Sign-in has one purpose: company mark, fields and actionable feedback. */
.auth-page.auth-page-simple {
  min-height:100vh; min-height:100dvh; display:grid; place-items:center;
  padding:32px 20px; background:#0b0e12; color:#edf0f3; color-scheme:dark;
}
.auth-page-simple .auth-card-simple {
  width:100%; max-width:400px; margin:0; padding:32px;
  border:1px solid #303842; border-radius:18px; background:#14191f;
  box-shadow:0 20px 64px #00000030;
}
.auth-page-simple .auth-brand {
  position:static; display:flex; width:144px; height:64px; margin:0 auto 20px;
  align-items:center; justify-content:center;
}
.auth-page-simple .auth-brand img { width:144px; height:64px; object-fit:contain; }
.auth-page-simple h1 { font-size:24px; font-weight:600; line-height:1.3; text-align:center; margin:0 0 20px; }
.auth-page-simple .auth-description, .auth-page-simple .auth-help { color:#b6c0cc; font-size:14px; line-height:1.6; margin:0 0 22px; }
.auth-page-simple .auth-form { display:flex; flex-direction:column; gap:10px; margin:0; }
.auth-page-simple .auth-form label { font-size:14px; color:inherit; }
.auth-page-simple .auth-form input:not([type="hidden"]) {
  width:100%; min-width:0; height:48px; border:1px solid #505d6c;
  border-radius:9px; padding:0 14px; background:#0c1117; color:#edf0f3; font-size:16px;
}
.auth-page-simple .auth-form input::placeholder { color:#91a0b2; opacity:1; }
.auth-page-simple .digit-code { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:8px; }
.auth-page-simple .auth-form .digit-code input { padding:0; text-align:center; font-size:22px; }
.auth-page-simple .resend-line { display:flex; flex-wrap:wrap; gap:6px 10px; margin:20px 0 0; color:inherit; font-size:13px; }
.auth-page-simple .resend-line button { color:inherit; text-decoration:underline; text-underline-offset:3px; min-height:32px; }
.auth-page-simple .auth-submit {
  width:100%; min-height:48px; margin-top:12px; border:1px solid #718092;
  background:linear-gradient(135deg,#3f4956,#535f6e); color:#f4f6f8; box-shadow:none;
}
.auth-page-simple .auth-submit:hover { background:#596879; transform:none; box-shadow:none; }
.auth-page-simple :focus-visible { outline:2px solid #b9c7d8; outline-offset:3px; }
.auth-page-simple .auth-error { padding:12px; margin:0 0 18px; border:1px solid #ac5c68; border-radius:9px; color:#ffbac4; background:#421f28; font-size:14px; overflow-wrap:anywhere; }
.auth-page-simple .auth-help { margin:20px 0 0; font-size:13px; }
.auth-page-simple .auth-help a { color:inherit; text-decoration:underline; text-underline-offset:3px; }
[data-theme="light"] .auth-page-simple { background:#edf0f3; color:#202a37; color-scheme:light; }
[data-theme="light"] .auth-page-simple .auth-card-simple { background:#fff; border-color:#c3cbd5; box-shadow:0 20px 64px #25344812; }
[data-theme="light"] .auth-page-simple :is(.auth-description,.auth-help) { color:#526174; }
[data-theme="light"] .auth-page-simple .auth-form input:not([type="hidden"]) { background:#f8fafc; color:#202a37; border-color:#8795a7; }
[data-theme="light"] .auth-page-simple .auth-form input::placeholder { color:#657389; }
[data-theme="light"] .auth-page-simple :focus-visible { outline-color:#4a5f79; }
[data-theme="light"] .auth-page-simple .auth-error { background:#fff0f2; color:#92263a; border-color:#c96c7d; }
@media (max-width:440px) {
  .auth-page.auth-page-simple { padding:20px 16px; }
  .auth-page-simple .auth-card-simple { padding:26px 22px; }
}

/* Customer purchase and documentation: scoped, shared dark/light palette. */
.billing-page, .docs-page { display:grid; gap:20px; min-width:0; }
.billing-page > *, .docs-page > * { min-width:0; margin-block:0; }
.billing-page .billing-status { flex-wrap:wrap; gap:16px; }
.billing-page .billing-status > div:nth-child(2) { flex:1; }
.billing-page .billing-status h2 { font-variant-numeric:tabular-nums; }
.billing-page .billing-status h2 small { font-size:14px; font-weight:400; color:var(--app-muted); }
.billing-page :is(p,small), .docs-page p { line-height:1.65; }
.billing-page .buy-tokens-grid { grid-template-columns:minmax(0,1.3fr) minmax(280px,1fr); align-items:start; gap:32px; }
.billing-page .buy-tokens-amount-label, .buy-methods legend { font-size:14px; font-weight:600; color:var(--app-text); }
.billing-page .buy-tokens-amount { min-height:62px; }
.billing-page .buy-tokens-amount input { font-size:26px; min-width:0; }
.buy-presets { display:flex; flex-wrap:wrap; gap:8px; }
.buy-presets button { flex:1; min-width:78px; min-height:44px; padding:8px; border:1px solid var(--app-border); border-radius:9px; background:var(--app-surface-2); color:var(--app-text); cursor:pointer; font:inherit; font-size:13px; }
.buy-presets button[aria-pressed="true"] { border-color:var(--app-accent,#22b5f4); box-shadow:inset 0 0 0 1px var(--app-accent,#22b5f4); }
.billing-page [data-buy-range] { width:100%; min-height:32px; accent-color:var(--app-accent,#22b5f4); }
.billing-page [data-buy-error]:not([hidden]) { margin:0; padding:8px 12px; color:var(--app-text); border-left:3px solid #d76b7c; font-size:13px; }
.buy-methods { border:0; margin:8px 0 0; padding:0; min-width:0; }
.buy-methods legend { margin-bottom:12px; }
.billing-page .payment-tile { flex-direction:row; justify-content:flex-start; text-align:left; gap:10px; padding:14px; min-height:72px; }
.billing-page .payment-tile input { width:18px; height:18px; flex-shrink:0; accent-color:var(--app-accent,#22b5f4); }
.billing-page .payment-tile strong { display:block; font-size:14px; }
.billing-page .payment-tile small { display:block; font-size:12px; color:var(--app-muted); }
.billing-page .buy-tokens-summary { gap:16px; padding:24px; }
.buy-token-preview { display:grid; gap:5px; padding-bottom:16px; border-bottom:1px solid var(--app-border); }
.buy-token-preview strong { font-size:clamp(24px,2.5vw,34px); line-height:1.25; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.buy-token-preview span { color:var(--app-muted); font-size:13px; }
.billing-page .buy-tokens-row { gap:12px; align-items:baseline; flex-wrap:wrap; font-size:13px; }
.billing-page .buy-tokens-total { font-size:22px; }
.billing-page .buy-tokens-summary p { margin:0; font-size:12px; }
.billing-page .buy-tokens-summary > a { font-size:13px; display:inline-flex; align-items:center; gap:5px; }
.billing-page summary, .docs-guide summary { cursor:pointer; min-height:44px; padding:12px 0; font-size:14px; color:var(--app-text); }
.buy-rate-details .buy-tokens-row { margin:8px 0; }
.buy-offline { border:1px solid var(--app-border); padding:16px; border-radius:10px; margin-top:8px; }
.buy-offline p { margin:8px 0 0; font-size:13px; }
.billing-help-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.billing-help-grid > * { min-width:0; margin:0; }
.billing-faq h2, .docs-guide h2 { margin-top:0; font-size:18px; }
.billing-faq details + details, .docs-guide details + details { border-top:1px solid var(--app-border); }
.billing-faq details p, .docs-guide details p { margin:0 0 14px; font-size:13px; color:var(--app-muted); }
.docs-toc { display:flex; flex-wrap:wrap; gap:8px; }
.docs-toc a { display:inline-flex; align-items:center; min-height:44px; padding:10px 14px; border:1px solid var(--app-border); border-radius:10px; color:var(--app-text); background:var(--app-surface); font-size:13px; }
.docs-page [id] { scroll-margin-top:130px; }
.docs-page :is(ol,ul) { padding-left:24px; color:var(--app-muted); line-height:1.7; font-size:14px; }
.docs-page li + li { margin-top:10px; }
.docs-page li strong { color:var(--app-text); }
.docs-page code { overflow-wrap:anywhere; }
.docs-page .docs-examples { grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; }
.docs-page .docs-example pre { max-height:400px; overflow:auto; }
.docs-page .docs-example header { flex-wrap:wrap; gap:8px; }
.docs-page .docs-copy { min-height:36px; }
.docs-page .docs-notes { grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr)); }
.billing-page :focus-visible, .docs-page :focus-visible { outline:2px solid var(--app-accent,#22b5f4); outline-offset:3px; }
@media (max-width:1000px) {
  .billing-help-grid, .docs-page .docs-examples { grid-template-columns:1fr; }
}
@media (max-width:760px) {
  .billing-page .buy-tokens-grid { grid-template-columns:minmax(0,1fr); gap:20px; }
  .billing-page .buy-tokens-summary { padding:18px; }
  .billing-page .billing-status > .button { width:100%; justify-content:center; }
  .billing-page .buy-tokens-panel { padding:18px; }
  .billing-page .promo-form { flex-wrap:wrap; }
  .billing-page .promo-form input { width:100%; min-width:0; font-size:16px; }
  .billing-page .promo-form button { width:100%; }
}