.pricing-page { letter-spacing: 0; }
.pricing-page main { scroll-margin-top: 90px; }
.pricing-page section[id] { scroll-margin-top: 90px; }
.pricing-page p { margin: 0; }
.pricing-page button, .pricing-page input { font: inherit; letter-spacing: 0; }
.pricing-page button { cursor: pointer; }
.pricing-page summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
.pricing-page .icon { width: 17px; height: 17px; flex-shrink: 0; opacity: .78; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.pricing-page .nav-links [aria-current="page"] { color: var(--text); }
.pricing-page .language-switch button { min-width: 34px; height: 28px; display: inline-grid; place-items: center; padding: 0 6px; border: 0; border-radius: 4px; background: transparent; color: var(--text-soft); font-size: 12px; font-weight: 700; line-height: 1; }
.pricing-page .language-switch button:hover { color: var(--text); background: var(--surface-strong); }
.pricing-page .language-switch [aria-pressed="true"] { color: var(--text); background: var(--surface-raised); box-shadow: 0 1px 3px rgba(44, 55, 62, .1); }
.plans-section { padding-block: 48px 40px; }
.page-heading { margin-bottom: 28px; text-align: center; }
.pricing-page .page-heading h1 { max-width: none; width: 100%; }
.pricing-page h1 { font-family: var(--font-display); font-size: 46px; font-weight: 600; line-height: 1.25; margin: 0; overflow-wrap: anywhere; }
.pricing-page .text-link { font-size: 15px; }
.plan-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: stretch; gap: 18px; border: 0; padding: 0; margin: 0; min-width: 0; }
.plan-card { position: relative; border: 1px solid var(--border); border-radius: var(--radius); padding: 24px 28px; background: var(--surface-raised); display: flex; flex-direction: column; min-width: 0; transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease; }
.plan-card:has(:focus-visible) { border-color: var(--border-strong); box-shadow: 0 12px 28px rgba(20, 24, 26, .08); }
@media (hover: hover) and (pointer: fine) {
  .plan-card:hover { transform: translateY(-6px); border-color: var(--border-strong); box-shadow: 0 12px 28px rgba(20, 24, 26, .08); }
}
.plan-heading { display: flex; align-items: center; gap: 10px; min-height: 34px; }
.plan-heading h2 { margin: 0; font-family: var(--font-display); font-size: 24px; line-height: 1.4; font-weight: 600; }
.plan-price { display: flex; flex-wrap: wrap; align-items: baseline; margin-top: 14px; gap: 2px; min-height: 62px; }
.plan-price .currency { font-size: 24px; font-weight: 500; }
.plan-price > strong { font-size: 48px; font-weight: 600; line-height: 1.25; }
.price-unit { margin-left: 9px; color: var(--text-soft); font-size: 14px; }
.pricing-page .plan-credits { display: flex; align-items: baseline; gap: 8px; margin-top: 4px; }
.plan-credits strong { font-size: 27px; font-weight: 600; font-variant-numeric: tabular-nums; }
.plan-credits span { color: var(--text-soft); font-size: 16px; }
.plans-section .plan-output { margin: -8px 0 16px; color: var(--text-soft); font-size: 12px; line-height: 1.5; }
.pricing-page .plan-bonus { color: var(--text); font-size: 16px; line-height: 1.6; margin-top: 4px; min-height: 52px; overflow-wrap: anywhere; }
.pricing-page .plan-note { font-size: 16px; line-height: 1.6; color: var(--text-soft); margin-block: 12px 24px; }
.plan-benefits { display: grid; gap: 9px; margin-block: 20px 24px; }
.plan-benefits p, .plan-benefits li { display: flex; gap: 8px; align-items: flex-start; font-size: 16px; line-height: 1.6; }
.plan-benefits span { min-width: 0; overflow-wrap: anywhere; }
.plan-feature-list { padding: 0; margin-block: 0 24px; list-style: none; }
.plan-benefits .icon { margin-top: 3px; width: 15px; height: 15px; }
.plan-models { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 24px; }
.plan-model-group h3 { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font-size: 16px; line-height: 1.5; font-weight: 650; }
.plan-model-group ul { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.plan-model-group li { font-size: 16px; line-height: 1.6; color: var(--text-soft); overflow-wrap: anywhere; }
.plan-model-status { grid-column: 1 / -1; font-size: 16px; line-height: 1.6; color: var(--text-soft); }
.pricing-page .plan-model-toggle { grid-column: 1 / -1; justify-self: start; display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 8px 0; border: 0; background: transparent; text-align: left; font-size: 16px; color: var(--text-soft); }
.plan-model-toggle:hover { color: var(--text); }
html:has(.pricing-page) { scrollbar-gutter: stable; }
html:has(.model-directory[open]), .pricing-page:has(.model-directory[open]) { overflow: hidden; }
.model-directory { box-sizing: border-box; width: min(960px, calc(100% - 48px)); height: min(740px, 85dvh); max-height: calc(100dvh - 32px); margin: auto; padding: 0; border: 1px solid var(--border); border-radius: 8px; background: var(--bg); color: var(--text); overflow: hidden; box-shadow: 0 24px 80px rgba(20, 24, 26, .2); }
.model-directory[open] { display: grid; grid-template-rows: auto auto auto minmax(0, 1fr) auto; }
.model-directory::backdrop { background: rgba(20, 24, 26, .4); }
.model-directory-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 24px 24px 16px; }
.model-directory-header h2 { margin: 0 0 4px; font-size: 24px; font-weight: 650; line-height: 1.4; }
.model-directory-header p { color: var(--text-soft); font-size: 14px; }
.model-icon-button { display: inline-grid; place-items: center; width: 36px; height: 36px; padding: 0; flex: 0 0 36px; border: 0; border-radius: 4px; background: transparent; }
.model-icon-button:hover:not(:disabled) { background: var(--surface-strong); }
.model-icon-button:disabled { opacity: .3; cursor: default; }
.model-directory button:focus-visible, .model-directory select:focus-visible, .model-directory-results:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.model-directory-filters { display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: 12px; padding: 0 24px 16px; }
.model-search { display: flex; align-items: center; gap: 10px; padding: 3px 5px 3px 12px; min-width: 0; border: 1px solid var(--border-strong); border-radius: 4px; background: var(--surface-raised); }
.model-search:focus-within { outline: 2px solid var(--accent); outline-offset: -1px; }
.model-search input { width: 100%; min-width: 0; height: 34px; padding: 0; border: 0; outline: 0; background: transparent; color: var(--text); font-size: 16px; }
.model-search input::-webkit-search-cancel-button { display: none; }
.model-provider { min-width: 0; }
.model-provider select { width: 100%; height: 44px; padding: 0 12px; border: 1px solid var(--border-strong); border-radius: 4px; color: var(--text); background: var(--surface-raised); font: inherit; font-size: 15px; }
.model-directory-tabs { display: flex; gap: 20px; padding: 0 24px; border-bottom: 1px solid var(--border); overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; }
.model-directory-tabs button { display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; min-height: 46px; padding: 8px 0; border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--text-soft); font-size: 14px; white-space: nowrap; }
.model-directory-tabs button[aria-selected="true"] { border-bottom-color: var(--accent); color: var(--text); font-weight: 650; }
.model-directory-tabs small { font-size: 12px; font-variant-numeric: tabular-nums; color: var(--text-soft); }
.model-directory-results { min-width: 0; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 0 24px; }
.model-directory table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 14px; }
.model-directory th { position: sticky; top: 0; z-index: 1; background: var(--bg); color: var(--text-soft); font-size: 12px; font-weight: 500; text-align: left; }
.model-directory th:first-child { width: 55%; }
.model-directory th:nth-child(2) { width: 27%; }
.model-directory th, .model-directory td { padding: 12px 12px 12px 0; border-bottom: 1px solid var(--border); line-height: 1.5; overflow-wrap: anywhere; }
.model-directory td:first-child { font-weight: 550; }
.model-directory td:nth-child(n+2) { color: var(--text-soft); }
.model-directory-empty { display: flex; min-height: 220px; flex-direction: column; align-items: center; justify-content: center; gap: 16px; color: var(--text-soft); }
.model-directory-empty button { border: 0; background: transparent; }
.model-directory-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 68px; padding: 12px 24px; border-top: 1px solid var(--border); font-size: 13px; color: var(--text-soft); }
.model-directory-footer nav { display: flex; align-items: center; gap: 8px; }
.model-directory-footer nav span { min-width: 100px; text-align: center; font-variant-numeric: tabular-nums; }
.model-directory [hidden] { display: none !important; }
@media (max-width: 680px) {
  .model-directory { width: 100%; max-width: 100%; height: 100dvh; max-height: 100dvh; margin: 0; border: 0; border-radius: 0; }
  .model-directory-header { padding: max(16px, env(safe-area-inset-top)) 16px 16px; }
  .model-directory-header h2 { font-size: 22px; }
  .model-directory-filters { grid-template-columns: minmax(0, 1fr); gap: 10px; padding-inline: 16px; }
  .model-directory-tabs { padding-inline: 16px; gap: 20px; }
  .model-directory-results { padding-inline: 16px; }
  .model-directory th:first-child { width: 62%; }
  .model-directory th:nth-child(2) { width: 38%; }
  .model-directory th:last-child, .model-directory td:last-child { display: none; }
  .model-directory-footer { flex-wrap: wrap; padding: 10px 16px max(10px, env(safe-area-inset-bottom)); gap: 4px 10px; }
  .model-directory-footer nav { margin-left: auto; }
}
#recharge { scroll-margin-top: 110px; }
.plan-checkout { margin-top: auto; }
.wechat-purchase { display: flex; align-items: center; justify-content: center; gap: 3px; width: 100%; min-height: 32px; margin-top: 4px; background: transparent; border: 0; padding: 3px 0; color: var(--text-soft); font-size: 14px; }
.wechat-purchase:hover { color: var(--text); }
.wechat-purchase:focus-visible, .wallet-close:focus-visible, .wallet-cancel:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.wechat-purchase:disabled { cursor: not-allowed; opacity: .5; }
.wallet-confirmation { width: min(420px, calc(100% - 32px)); max-height: calc(100dvh - 32px); overflow: auto; padding: 28px; border: 1px solid var(--border); border-radius: 8px; color: var(--text); background: var(--surface-raised); box-shadow: 0 20px 60px rgba(20, 24, 26, .16); }
.wallet-confirmation::backdrop { background: rgba(20, 24, 26, .35); }
.wallet-confirmation h2 { margin: 0 32px 12px 0; font-size: 22px; line-height: 1.5; }
.wallet-close { position: absolute; top: 16px; right: 16px; display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 4px; background: transparent; }
.wallet-close:hover { background: var(--surface); }
.wallet-pack { font-size: 16px; color: var(--text-soft); }
.pricing-page .wallet-amount { margin-top: 20px; font-size: 30px; font-weight: 600; line-height: 1.5; }
.pricing-page .wallet-note { margin: 8px 0 24px; font-size: 14px; line-height: 1.8; color: var(--text-soft); }
.wallet-cancel { display: block; min-height: 36px; margin: 8px auto 0; padding: 4px 16px; border: 0; color: var(--text-soft); background: transparent; font-size: 15px; }
.plan-payment-status { color: var(--text-soft); font-size: 14px; line-height: 1.6; }
.purchase-button, .free-download { width: 100%; min-height: 44px; border: 1px solid var(--border); padding: 8px 12px; border-radius: var(--control-radius); color: var(--text-soft); background: var(--surface); font-size: 16px; font-weight: 650; }
.free-download { display: flex; align-items: center; justify-content: center; gap: 8px; color: var(--text); }
.free-download:hover { background: var(--surface-strong); }
.plan-card--free .plan-price > strong { font-size: 36px; }
.purchase-button:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
.purchase-button:disabled { cursor: not-allowed; }
.pricing-section-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.pricing-section-heading h2, .usage-dialog-header h2 { font-family: var(--font-display); font-size: 26px; font-weight: 600; line-height: 1.4; margin: 0; overflow-wrap: anywhere; }
.pricing-section-heading > p { color: var(--text-soft); font-size: 16px; line-height: 1.6; }
.benefits-section { padding-block: 36px; border-block: 1px solid var(--border); }
.usage-open { display: inline-grid; place-items: center; align-self: center; flex: 0 0 32px; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 4px; background: transparent; color: var(--text-soft); }
.usage-open:hover { background: var(--surface); }
.usage-open:focus-visible, .usage-close:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.pricing-page:has(.usage-dialog[open]) { overflow: hidden; }
.usage-dialog { box-sizing: border-box; width: min(1100px, calc(100% - 32px)); max-height: calc(100dvh - 48px); margin: auto; padding: 28px 32px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg); color: var(--text); overflow-y: auto; overscroll-behavior: contain; }
.usage-dialog::backdrop { background: rgba(20, 24, 26, .45); }
.usage-dialog-header { position: sticky; top: -28px; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-block: 8px; background: var(--bg); }
.usage-close { display: grid; place-items: center; flex: 0 0 36px; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 4px; background: transparent; }
.usage-close:hover { background: var(--surface-strong); }
.usage-content { padding-top: 24px; }
.usage-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 24px; margin-bottom: 26px; }
.usage-links { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 24px; }
.usage-links > p { font-size: 14px; color: var(--text-soft); }
.price-refresh { display: inline-grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 1px solid var(--border); border-radius: 4px; background: var(--surface-raised); }
.price-refresh:disabled { opacity: .5; cursor: wait; }
.price-refresh:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.usage-modes { display: inline-flex; flex-wrap: wrap; max-width: 100%; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 3px; gap: 3px; }
.usage-modes button { min-height: 40px; display: flex; align-items: center; justify-content: center; gap: 7px; border: 0; border-radius: 4px; background: transparent; color: var(--text-soft); padding: 5px 14px; font-size: 15px; }
.usage-modes button[aria-pressed="true"] { background: var(--surface-raised); color: var(--text); box-shadow: 0 1px 3px rgba(44, 55, 62, .1); }
.usage-controls { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 18px 28px; padding-bottom: 24px; }
.usage-controls [hidden], .usage-length[hidden] { display: none; }
.usage-model-control { display: flex; flex-direction: column; gap: 7px; min-width: 0; width: 260px; max-width: 100%; }
.usage-model-control > span { color: var(--text-soft); font-size: 14px; }
.usage-model-control select { width: 100%; height: 42px; padding: 0 12px; border: 1px solid var(--border-strong); border-radius: var(--radius); background: var(--surface-raised); font: inherit; font-size: 16px; color: var(--text); }
.usage-model-control select:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.usage-dubbing-control { display: flex; align-items: center; gap: 8px; min-height: 42px; font-size: 16px; cursor: pointer; }
.usage-dubbing-control input { accent-color: var(--accent); width: 17px; height: 17px; margin: 0; }
.usage-reference { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; padding-block: 20px 22px; border-top: 1px solid var(--border); }
.usage-reference > div { min-width: 0; max-width: 820px; }
.reference-heading { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 14px; }
.reference-heading strong { font-size: 16px; font-weight: 650; }
.reference-heading > span { color: var(--text-soft); font-size: 14px; }
.pricing-page .usage-reference p { margin-top: 8px; font-size: 16px; color: var(--text-soft); line-height: 1.9; }
#usage-rate { font-size: 16px; font-weight: 650; white-space: nowrap; }
.usage-breakdown { display: flex; flex-wrap: wrap; gap: 24px 48px; margin-block: 22px 16px; }
.usage-breakdown > div { min-width: 0; }
.usage-breakdown dt { font-size: 14px; color: var(--text-soft); }
.usage-breakdown dd { display: flex; flex-direction: column; gap: 4px; margin: 4px 0 0; font-size: 16px; }
.usage-breakdown dd > span { color: var(--text-soft); }
.usage-breakdown strong { font-weight: 600; }
.pricing-page .usage-condition-note { max-width: 1100px; font-size: 14px; line-height: 1.9; color: var(--text-soft); }
.pricing-page .usage-item > .usage-length { display: block; min-height: 0; font-size: 14px; line-height: 1.8; color: var(--text-soft); margin-top: 10px; }
.pricing-page .usage-item > .usage-length[hidden] { display: none; }
.usage-amount .usage-approx { font-size: 14px; }
.usage-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px; padding: 24px 0; border-block: 1px solid var(--border); }
.usage-item + .usage-item { border-left: 1px solid var(--border); padding-left: 30px; }
.usage-item > span { font-size: 16px; color: var(--text-soft); }
.pricing-page .usage-item > p { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px; margin-block: 7px 3px; min-height: 49px; }
.usage-item strong { font-size: 36px; line-height: 1.3; font-weight: 600; font-variant-numeric: tabular-nums; }
.usage-item p > span { font-size: 14px; color: var(--text-soft); }
.pricing-page .usage-disclaimer { max-width: 960px; font-size: 14px; color: var(--text-soft); line-height: 1.9; margin-top: 16px; }
.faq-section { padding-block: 32px 40px; border-top: 1px solid var(--border); }
.faq-section .pricing-section-heading { margin-bottom: 20px; }
.pricing-faq-list details { border-bottom: 1px solid var(--border); padding-block: 18px; }
.pricing-faq-list summary { font-size: 17px; font-weight: 650; cursor: pointer; list-style-position: outside; margin-left: 16px; padding-left: 6px; }
.pricing-faq-list summary::marker { font-size: 10px; color: var(--text-soft); }
.pricing-faq-list details > p { padding: 14px 22px 4px; max-width: 960px; color: var(--text-soft); font-size: 16px; line-height: 1.9; }
@media (max-width: 1100px) {
  .plan-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .plan-card { padding: 22px; }
  .plan-heading h2 { font-size: 22px; }
  .pricing-section-heading { gap: 28px; }
  .plan-models { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 800px) {
  .plan-card { padding: 20px 17px; }
  .plan-heading { gap: 6px; }
  .plan-heading h2 { font-size: 20px; }
  .plan-price { flex-wrap: wrap; }
  .price-unit { margin-left: 5px; }
  .pricing-section-heading { display: block; }
  .pricing-section-heading > p { margin-top: 14px; max-width: 640px; }
}
@media (max-width: 680px) {
  .pricing-page h1 { font-size: 32px; }
  .plans-section { padding-block: 32px; }
  .plan-grid { grid-template-columns: 1fr; gap: 16px; }
  .plan-card { padding: 24px; }
  .plan-heading h2 { font-size: 24px; }
  .plan-price { margin-top: 18px; }
  .price-unit { margin-left: 10px; }
  .pricing-section-heading h2, .usage-dialog-header h2 { font-size: 24px; }
  .usage-dialog { width: calc(100% - 24px); max-height: calc(100dvh - 24px); padding: 16px; }
  .usage-dialog-header { top: -16px; }
  .plan-models { grid-template-columns: 1fr; }
  .usage-toolbar { flex-direction: column; align-items: flex-start; gap: 12px; margin-bottom: 20px; }
  .usage-modes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; max-width: 100%; }
  .usage-modes button { min-width: 0; min-height: 44px; padding: 5px 8px; line-height: 1.4; overflow-wrap: anywhere; }
  .usage-modes .icon { display: none; }
  .usage-controls { gap: 18px; }
  .usage-model-control { width: 100%; }
  .usage-reference { flex-direction: column; gap: 14px; }
  #usage-rate { white-space: normal; }
  .usage-breakdown { display: grid; grid-template-columns: 1fr; gap: 16px; }
  .usage-breakdown dd { flex-direction: row; flex-wrap: wrap; gap: 4px 16px; }
  .usage-grid { grid-template-columns: 1fr; padding-block: 0; gap: 0; }
  .usage-item { padding: 20px 0; }
  .usage-item + .usage-item { border-left: 0; border-top: 1px solid var(--border); padding-left: 0; }
  .pricing-page .usage-item > p { margin-bottom: 0; min-height: 0; }
  .usage-item strong { font-size: 30px; }
  .pricing-faq-list summary { font-size: 16px; line-height: 1.8; }
  .pricing-page .footer-inner { grid-template-columns: 1fr; gap: 12px; }
  .pricing-page .footer-links { gap: 24px; }
}
@media (max-width: 360px) {
  .pricing-page .language-switch button { min-width: 30px; }
  .plan-card { padding: 22px; }
  .usage-modes { width: 100%; gap: 1px; }
  .usage-modes button { flex: 1; padding-inline: 6px; }
  .usage-modes .icon { display: none; }
}
@media (prefers-reduced-motion: reduce) { .plan-card { transition: none; transform: none; } }
.purchase-feedback { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 8px 16px; padding-top: 16px; }
.purchase-feedback:has([data-payment-status][hidden]):has([data-reload-payments][hidden]) { display: none; }
.purchase-feedback button { background: transparent; border: 0; cursor: pointer; font: inherit; font-size: 15px; padding: 4px 0; }
.pricing-page [hidden] { display: none !important; }
.purchase-button:not(:disabled) { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); cursor: pointer; }
.purchase-button:not(:disabled):hover { background: var(--accent-hover); }
.pricing-page .page-heading > p { max-width: 780px; margin: 16px auto 0; color: var(--text-soft); font-size: 17px; line-height: 1.8; }
.pricing-view-tabs { display: flex; align-items: center; justify-content: center; width: fit-content; max-width: 100%; margin: 0 auto 24px; padding: 4px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); }
.pricing-view-tabs button { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 42px; padding: 8px 20px; border: 0; border-radius: 5px; color: var(--text-soft); background: transparent; font-size: 15px; font-weight: 650; }
.pricing-view-tabs button:hover { color: var(--text); }
.pricing-view-tabs button[aria-pressed="true"] { color: var(--accent-ink); background: var(--accent); box-shadow: 0 2px 6px rgba(20, 24, 26, .12); }
.pricing-view-tabs button span { padding: 3px 6px; border-radius: 4px; color: var(--text); background: var(--surface-strong); font-size: 11px; white-space: nowrap; }
.pricing-view-tabs button[aria-pressed="true"] span { color: var(--accent); background: var(--accent-ink); }
.pricing-view-tabs button:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.subscription-notice { max-width: 760px; margin: -4px auto 26px; color: var(--text-soft); text-align: center; font-size: 14px; line-height: 1.7; }
.plan-description { min-height: 24px; margin-top: 6px !important; color: var(--text-soft); font-size: 14px; line-height: 1.6; }
.plan-billing { min-height: 22px; color: var(--text-soft); font-size: 13px; line-height: 1.6; }
.pricing-page .plan-trial { min-height: 50px; align-items: flex-start; color: var(--text-soft); font-size: 14px; line-height: 1.7; }
.plan-card--recommended { border-color: var(--text); box-shadow: 0 10px 30px rgba(20, 24, 26, .08); }
.plan-recommended { position: absolute; top: -13px; right: 18px; padding: 4px 10px; border-radius: 4px; color: var(--accent-ink); background: var(--accent); font-size: 12px; font-weight: 700; }
.subscription-button:disabled { color: var(--text-soft); background: var(--surface); opacity: 1; }
.plan-grid:has([data-plan-card]) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.plan-features { margin-bottom: 18px; padding-top: 14px; border-top: 1px solid var(--border); }
.plan-features h3 { margin: 0; font-size: 15px; line-height: 1.5; }
.plan-features ul { display: grid; grid-template-columns: 1fr; gap: 8px; margin: 10px 0 0; padding: 0; list-style: none; }
.plan-features li { display: flex; align-items: flex-start; gap: 6px; min-width: 0; color: var(--text-soft); font-size: 11px; line-height: 1.5; }
.plan-features li .icon { flex: 0 0 16px; margin-top: 1px; filter: none; }
.plan-features .plan-additional-benefits { grid-template-columns: 1fr; gap: 4px; margin-top: 8px; padding-top: 0; border-top: 0; }
.plan-additional-benefits li { font-size: 12px; }
.plan-model-benefits { margin-bottom: 24px; padding-top: 18px; border-top: 1px solid var(--border); }
.plan-model-benefits > h3 { margin: 0; font-size: 15px; line-height: 1.5; }
.featured-model-list { display: grid; gap: 9px; margin: 14px 0 0; padding: 0; list-style: none; }
.featured-model { display: flex; align-items: center; gap: 11px; min-width: 0; padding: 11px; border: 1px solid var(--border); border-radius: 8px; background: rgba(255, 255, 255, .42); }
.featured-model-icon { display: grid; place-items: center; flex: 0 0 34px; width: 34px; height: 34px; padding: 5px; border-radius: 7px; background: #f4f6f8; }
.model-logo { object-fit: contain; border-radius: 4px; background: #f4f6f8; }
.featured-model-icon .model-logo { width: 24px; height: 24px; }
.featured-model-copy { display: grid; min-width: 0; gap: 2px; }
.featured-model-copy small { color: var(--text-faint); font-size: 10px; line-height: 1.4; }
.featured-model-copy strong { font-size: 13px; font-weight: 650; line-height: 1.4; overflow-wrap: anywhere; }
.plan-model-series { margin-top: 14px; border: 1px solid var(--border); border-radius: 8px; background: rgba(255, 255, 255, .32); }
.plan-model-series summary { padding: 10px 11px; cursor: pointer; color: var(--text-soft); font-size: 12px; font-weight: 650; }
.plan-model-series summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.model-family-groups { margin-top: 14px; }
.model-family-row { display: grid; grid-template-columns: 44px minmax(0, 1fr); align-items: center; gap: 8px; padding-block: 8px; }
.model-family-groups section + section { border-top: 1px solid var(--border); }
.model-family-groups h4 { margin: 0; color: var(--text-faint); font-size: 10px; font-weight: 650; overflow-wrap: anywhere; }
.model-logo-row { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.model-logo-item { position: relative; display: block; flex: 0 0 26px; width: 26px; height: 26px; padding: 3px; border-radius: 6px; background: #f4f6f8; cursor: default; }
.model-logo-item:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.model-family-groups .model-logo { width: 20px; height: 20px; }
.model-logo-item::after { content: attr(data-name); position: absolute; z-index: 20; left: 50%; bottom: calc(100% + 7px); width: max-content; max-width: 170px; padding: 5px 7px; border-radius: 5px; color: #fff; background: #1f2021; box-shadow: 0 4px 14px rgba(0, 0, 0, .16); font-size: 11px; line-height: 1.4; text-align: center; white-space: normal; pointer-events: none; opacity: 0; transform: translate(-50%, 4px); transition: opacity 120ms ease, transform 120ms ease; }
.model-logo-item:hover::after, .model-logo-item:focus-visible::after { opacity: 1; transform: translate(-50%, 0); }
.featured-models-note { margin-top: 12px !important; color: var(--text-faint); font-size: 11px; line-height: 1.6; }
.subscription-rules { padding-block: 38px; }
.subscription-rules ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 32px; margin: 0; padding: 0; list-style: none; }
.subscription-rules li { display: flex; align-items: flex-start; gap: 10px; color: var(--text-soft); font-size: 15px; line-height: 1.8; }
.subscription-rules li .icon { margin-top: 4px; }
.plans-section {
  --text: #1f2021;
  --text-soft: #5b6266;
  --text-faint: #70797e;
  --border: #d2d6d4;
  --border-strong: #b6bdb8;
  --surface: #eff2f3;
  --surface-raised: #fbfcfc;
  --surface-strong: #e2e6e8;
  --accent: #F59E0B;
  --accent-hover: #FBBF24;
  --accent-ink: #211600;
  --accent-soft: #A15E00;
  position: relative;
  isolation: isolate;
  padding-block: 64px 58px;
  color: var(--text);
}
.plans-section::before { content: ""; position: absolute; z-index: -1; inset: 0; left: 50%; width: 100vw; transform: translateX(-50%); background: var(--bg); }
.plans-section .page-heading { margin-bottom: 30px; }
.plans-section h1 { font-size: 54px; letter-spacing: -.035em; }
.plans-section .page-heading > p { color: var(--text-soft); }
.plans-section .plan-grid { gap: 20px; }
.plans-section .plan-card { padding: 28px 24px; border: 1px solid rgba(255, 255, 255, .58); border-radius: 12px; background: rgba(252, 249, 243, .8); box-shadow: 0 18px 44px rgba(45, 61, 63, .13); backdrop-filter: blur(16px) saturate(1.12); -webkit-backdrop-filter: blur(16px) saturate(1.12); }
.plans-section .plan-card:hover { border-color: rgba(255, 255, 255, .88); box-shadow: 0 22px 54px rgba(45, 61, 63, .18); }
.plans-section .plan-card--recommended { border-color: var(--accent); background: rgba(255, 248, 236, .9); box-shadow: 0 0 0 1px rgba(245, 158, 11, .12), 0 24px 64px rgba(83, 61, 25, .18); }
.plans-section .plan-heading h2 { font-family: var(--font-sans); font-size: 23px; font-weight: 750; letter-spacing: -.02em; }
.plan-save { margin-left: auto; padding: 4px 7px; border-radius: 5px; color: var(--accent-soft); background: rgba(245, 158, 11, .14); font-size: 11px; font-weight: 700; }
.plans-section .plan-recommended { top: -14px; right: 18px; padding: 5px 12px; color: var(--accent-ink); background: var(--accent); box-shadow: 0 4px 16px rgba(245, 158, 11, .2); }
.plans-section .plan-description { color: var(--text-soft); }
.plans-section .plan-price { margin-top: 20px; }
.plans-section .plan-price > strong { font-family: var(--font-sans); font-size: 58px; font-weight: 650; letter-spacing: -.055em; }
.plans-section .plan-price .currency { font-family: var(--font-sans); font-weight: 500; }
.plans-section .price-unit { font-size: 13px; }
.plans-section .plan-billing { color: var(--text-soft); }
.plans-section .plan-credits { box-sizing: border-box; margin: 16px 0 20px; padding: 13px 14px; border: 1px solid rgba(245, 158, 11, .13); border-radius: 8px; background: rgba(245, 158, 11, .055); }
.plans-section .plan-credits strong { font-family: var(--font-sans); font-size: 27px; letter-spacing: -.03em; }
.plans-section .plan-credits span { font-size: 13px; }
.plans-section .plan-trial { min-height: 0; color: var(--text-soft); }
.plans-section .plan-checkout { margin: 0 0 24px; }
.plans-section .purchase-button, .plans-section .free-download { min-height: 48px; border-radius: 8px; font-size: 15px; font-weight: 750; }
.plans-section .subscription-button:disabled { border-color: var(--accent); color: var(--accent-ink); background: var(--accent); cursor: default; }
.plans-section .free-download { border: 1px solid var(--border-strong); color: var(--text); background: rgba(255, 255, 255, .48); }
.plans-section .free-download:hover { border-color: var(--accent); color: var(--accent-soft); background: rgba(245, 158, 11, .08); }
.plans-section .plan-feature-list { margin-bottom: 22px; }
.plans-section .plan-benefits .icon { filter: none; opacity: .82; }
.plans-section .plan-model-benefits { padding-top: 20px; }
.plans-section .plan-bonus, .plans-section .plan-note, .plans-section .plan-payment-status { color: var(--text-soft); }
.plans-section .wechat-purchase { color: var(--text-soft); }
.plans-section .wechat-purchase:hover { color: var(--accent-soft); }
.plans-section .usage-open { color: var(--accent-soft); }
.plans-section .usage-open .icon, .plans-section .free-download .icon { filter: none; }
.plans-section .usage-open:hover { background: rgba(245, 158, 11, .1); }
.plans-section h1 { font-size: 44px; }
.plans-section .page-heading > p { font-size: 15px; }
.plans-section .plan-heading h2 { font-size: 20px; }
.plans-section .plan-description { font-size: 13px; }
.plans-section .plan-price > strong { font-size: 48px; }
.plans-section .plan-price .currency { font-size: 20px; }
.plans-section .plan-credits strong { font-size: 22px; }
.plans-section .plan-benefits p, .plans-section .plan-benefits li { font-size: 14px; }
.plans-section .plan-model-benefits > h3 { font-size: 15px; }
.plans-section .purchase-button, .plans-section .free-download { min-height: 46px; font-size: 14px; }
.subscription-notice { font-size: 13px; }
.plans-section { padding-block: 44px 50px; }
.plans-section .page-heading { margin-bottom: 22px; }
.plans-section .page-heading > p { margin-top: 10px; }
.plans-section .pricing-view-tabs { margin-bottom: 18px; }
.plans-section .subscription-notice { margin-bottom: 20px; }
.plans-section .plan-card { padding: 24px 22px; }
.plans-section .plan-description { min-height: 0; margin-top: 4px !important; line-height: 1.5; }
.plans-section .plan-price { min-height: 52px; margin-top: 12px; }
.plans-section .plan-billing { min-height: 18px; line-height: 1.5; }
.plans-section .plan-checkout { margin-bottom: 12px; }
.plans-section .plan-credits { margin: 12px 0 16px; padding: 10px 12px; }
.plans-section .plan-feature-list { gap: 6px; margin-bottom: 16px; }
.plans-section .plan-note { margin-block: 0 14px; }
.plans-section .plan-bonus { min-height: 40px; }
.plans-section .plan-model-benefits { margin-bottom: 18px; padding-top: 14px; }
.plans-section .featured-model-list { gap: 7px; margin-top: 10px; }
.plans-section .featured-model { padding: 8px 9px; }
.plans-section .plan-model-series { margin-top: 10px; }
.plans-section .plan-model-series summary { padding-block: 8px; }
.plans-section .featured-models-note { margin-top: 8px !important; line-height: 1.5; }
.plans-section .plan-features { margin-bottom: 12px; padding-top: 10px; }
.plans-section .plan-features ul { gap: 6px 10px; margin-top: 8px; }
.plans-section .plan-feature-list { margin-bottom: 12px; }
.plans-section .plan-model-benefits { margin-bottom: 12px; padding-top: 10px; }
.discount-model-row { display: flex; flex-wrap: nowrap; gap: 5px; margin: 12px 0 0; padding: 0; }
.discount-model-row .model-logo-item { display: flex; flex-direction: column; align-items: center; gap: 6px; flex-basis: 22px; width: 22px; min-height: 38px; }
.discount-model-row .model-logo { width: 16px; height: 16px; }
.discount-model-row .model-discount-badge { padding: 1px 4px; border-radius: 3px; color: #FFF; background: #EF4444; font-size: 9px; font-weight: 500; line-height: 1.3; }
.pricing-page .model-discount { display: inline-flex; margin-top: 8px; padding: 0; color: var(--accent-soft); background: transparent; font-size: 11px; font-weight: 650; line-height: 1.5; }
.plans-section .plan-checkout { margin-top: 0; }
.plans-section .plan-support { margin-top: auto; padding-top: 12px; color: var(--text-soft); font-size: 13px; line-height: 1.5; }
.plan-features .feature-unavailable { opacity: .35; }
.plan-features .feature-unlimited { margin-left: auto; padding: 2px 6px; border-radius: 4px; color: var(--accent-soft); background: rgba(255, 221, 0, .1); font-size: 10px; font-weight: 500; line-height: 1.4; }
.plan-features .feature-note { margin-left: auto; color: var(--text-soft); font-size: 11px; font-weight: 500; text-align: right; }
.plan-features .feature-tag { padding: 2px 6px; border: 1px solid rgba(255, 221, 0, .22); border-radius: 4px; color: var(--accent-soft); background: rgba(255, 221, 0, .08); font-size: 10px; }
@media (max-width: 1100px) {
  .plan-grid:has([data-plan-card]) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 800px) {
  .subscription-rules ul { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
  .pricing-page .page-heading > p { font-size: 14px; }
  .pricing-view-tabs { width: 100%; }
  .pricing-view-tabs button { flex: 1; min-width: 0; padding-inline: 8px; font-size: 13px; }
  .pricing-view-tabs button span { display: none; }
  .subscription-notice { text-align: left; }
  .plan-grid:has([data-plan-card]) { grid-template-columns: 1fr; }
  .plans-section { padding-block: 36px 38px; }
  .plans-section h1 { font-size: 30px; letter-spacing: -.02em; }
  .plans-section .plan-card { padding: 24px 22px; }
  .plans-section .plan-price > strong { font-size: 44px; }
}

/* Kilo-inspired pricing theme: near-black surfaces, restrained borders and a yellow action color. */
.pricing-page {
  color-scheme: dark;
  --bg: #111416;
  --surface: #181b1d;
  --surface-raised: #1a1e20;
  --surface-strong: #252a2c;
  --text: rgba(247, 248, 245, .92);
  --text-soft: #aeb4b5;
  --text-faint: #7e8789;
  --border: rgba(255, 255, 255, .14);
  --border-strong: rgba(255, 255, 255, .3);
  --accent: #f4d914;
  --accent-hover: #f8e34a;
  --accent-ink: #111;
  --accent-soft: #d2bd2f;
  --accent-muted: #c7b637;
  background: var(--bg);
  color: var(--text);
}

.pricing-page .site-header {
  border-bottom-color: var(--border);
  background: rgba(17, 20, 22, .92);
  color: var(--text);
}

.pricing-page .brand-mark { filter: invert(1); }
.pricing-page .nav-links a,
.pricing-page .footer-links a { color: rgba(255, 255, 255, .68); }
.pricing-page .nav-links a:hover,
.pricing-page .footer-links a:hover { color: var(--text); }
.pricing-page .nav-links [aria-current="page"] {
  padding: 6px 12px;
  border-radius: 4px;
  color: var(--accent-ink);
  background: var(--accent);
  text-decoration: none;
}
.pricing-page .nav-actions .button {
  border-color: var(--accent);
  color: var(--accent-ink);
  background: var(--accent);
}
.pricing-page .nav-actions .button:hover { background: var(--accent-hover); }
.pricing-page .menu-toggle { border-color: var(--border); }
.pricing-page .menu-toggle span { background: var(--text); }
.pricing-page .site-header .nav-links { background: var(--bg); border-bottom-color: var(--border); }
.pricing-page .site-footer { border-top-color: var(--border); background: var(--bg); }

.pricing-page .plans-section {
  --text: rgba(247, 248, 245, .92);
  --text-soft: #aeb4b5;
  --text-faint: #7e8789;
  --border: rgba(255, 255, 255, .14);
  --border-strong: rgba(255, 255, 255, .3);
  --surface: #181b1d;
  --surface-raised: #1a1e20;
  --surface-strong: #252a2c;
  --accent: #f4d914;
  --accent-hover: #f8e34a;
  --accent-ink: #111;
  --accent-soft: #d2bd2f;
  --accent-muted: #c7b637;
  background: transparent;
}
.pricing-page .plans-section::before { background: var(--bg); }
.pricing-page .plans-section h1,
.pricing-page .pricing-section-heading h2,
.pricing-page .usage-dialog-header h2 { color: var(--text); }
.pricing-page .plans-section .page-heading > p,
.pricing-page .subscription-notice { color: var(--text-soft); }

.pricing-page .pricing-view-tabs {
  border-color: var(--border);
  background: var(--surface);
}
.pricing-page .pricing-view-tabs button { color: var(--text-soft); }
.pricing-page .pricing-view-tabs button:hover { color: var(--text); }
.pricing-page .pricing-view-tabs button[aria-pressed="true"] {
  color: var(--accent-ink);
  background: var(--accent);
  box-shadow: none;
}
.pricing-page .pricing-view-tabs button span {
  color: var(--accent);
  background: rgba(17, 17, 17, .2);
}
.pricing-page .pricing-view-tabs button[aria-pressed="true"] span {
  color: var(--accent-ink);
  background: rgba(17, 17, 17, .16);
}

.pricing-page .plans-section .plan-card {
  border-color: var(--border);
  border-radius: 4px;
  background: var(--surface);
  box-shadow: 0 20px 40px rgba(0, 0, 0, .2);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  transform-origin: center;
  transition: transform 220ms cubic-bezier(.2, .8, .2, 1), border-color 180ms ease, box-shadow 180ms ease, background 180ms ease;
}
@keyframes pricing-card-pop {
  from { transform: translateY(0) scale(1); }
  to { transform: translateY(-7px) scale(1.012); }
}
.pricing-page .plans-section .plan-card:hover {
  border-color: rgba(255, 221, 0, .22);
  box-shadow: 0 28px 56px rgba(0, 0, 0, .36);
  transform: translateY(-7px) scale(1.012);
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .pricing-page .plans-section .plan-card:hover { animation: pricing-card-pop 240ms ease-out both; }
}
@media (prefers-reduced-motion: reduce) {
  .pricing-page .plans-section .plan-card { animation: none; transition: none; transform: none; }
}
.pricing-page .plans-section .plan-card:has(:focus-visible) {
  border-color: rgba(255, 221, 0, .42);
  box-shadow: 0 0 0 1px rgba(255, 221, 0, .1), 0 20px 40px rgba(0, 0, 0, .22);
}
.pricing-page .plans-section .plan-card--recommended {
  border-color: rgba(255, 221, 0, .38);
  background: #141719;
  box-shadow: 0 0 0 1px rgba(255, 221, 0, .06), 0 24px 52px rgba(0, 0, 0, .3);
}
.pricing-page .plans-section .plan-card--recommended::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 2px;
  background: var(--accent);
}
.pricing-page .plans-section .plan-card--recommended:hover { border-color: var(--accent); }
.pricing-page .plans-section .plan-heading h2,
.pricing-page .plans-section .plan-features h3,
.pricing-page .plans-section .plan-model-benefits > h3 { color: var(--text); }
.pricing-page .plans-section .plan-price > strong,
.pricing-page .plans-section .plan-price .currency,
.pricing-page .plans-section .plan-credits strong { color: var(--text); }
.pricing-page .plans-section .plan-card--free .plan-price > strong,
.pricing-page .plans-section .plan-card--recommended .plan-price > strong { color: var(--accent); }
.pricing-page .plans-section .plan-billing,
.pricing-page .plans-section .plan-description,
.pricing-page .plans-section .plan-credits span,
.pricing-page .plans-section .plan-note,
.pricing-page .plans-section .plan-bonus,
.pricing-page .plans-section .plan-payment-status { color: var(--text-soft); }
.pricing-page .plans-section .plan-save {
  color: var(--accent-soft);
  border: 1px solid rgba(255, 221, 0, .22);
  background: rgba(255, 221, 0, .07);
}
.pricing-page .plans-section .plan-recommended {
  border: 1px solid var(--accent);
  color: var(--accent-ink);
  background: var(--accent);
  box-shadow: 0 4px 16px rgba(244, 217, 20, .18);
}
.pricing-page .plans-section .plan-credits {
  border-color: rgba(255, 221, 0, .14);
  background: rgba(255, 221, 0, .045);
}
.pricing-page .plans-section .subscription-button:disabled,
.pricing-page .purchase-button:not(:disabled) {
  border-color: rgba(255, 221, 0, .65);
  color: var(--accent);
  background: transparent;
}
.pricing-page .plans-section .subscription-button:disabled:hover,
.pricing-page .purchase-button:not(:disabled):hover { background: rgba(255, 221, 0, .08); }
.pricing-page .plans-section .free-download {
  border-color: var(--border-strong);
  color: var(--text);
  background: transparent;
}
.pricing-page .plans-section .free-download:hover {
  border-color: var(--accent);
  color: var(--accent);
  background: rgba(255, 221, 0, .08);
}
.pricing-page .plans-section .plan-benefits .icon,
.pricing-page .plans-section .plan-features .icon,
.pricing-page .subscription-rules .icon,
.pricing-page .plans-section .usage-open .icon {
  filter: brightness(0) saturate(100%) invert(79%) sepia(67%) saturate(550%) hue-rotate(6deg) brightness(92%) contrast(89%);
  opacity: .82;
}
.pricing-page .plans-section .plan-features,
.pricing-page .plans-section .plan-model-benefits,
.pricing-page .model-family-groups section + section { border-color: var(--border); }
.pricing-page .plans-section .plan-features li,
.pricing-page .plans-section .model-family-groups h4,
.pricing-page .plans-section .featured-models-note { color: var(--text-soft); }
.pricing-page .plans-section .model-logo-item,
.pricing-page .plans-section .featured-model-icon { background: #f4f4f4; }
.pricing-page .plans-section .model-logo-item::after { color: #111; background: #f5f5f5; }
.pricing-page .plans-section .wechat-purchase,
.pricing-page .plans-section .usage-open { color: var(--text-soft); }
.pricing-page .plans-section .wechat-purchase:hover,
.pricing-page .plans-section .usage-open:hover { color: var(--accent); background: rgba(255, 221, 0, .08); }

.pricing-page .subscription-rules,
.pricing-page .faq-section { border-color: var(--border); background: var(--bg); }
.pricing-page .subscription-rules li,
.pricing-page .pricing-section-heading > p,
.pricing-page .pricing-faq-list details > p { color: var(--text-soft); }
.pricing-page .pricing-faq-list details { border-color: var(--border); }
.pricing-page .pricing-faq-list summary { color: var(--text); }
.pricing-page .pricing-faq-list summary::marker { color: var(--accent); }
.pricing-page .text-link { color: var(--accent); }

.pricing-page .usage-dialog,
.pricing-page .wallet-confirmation {
  border-color: var(--border);
  background: var(--surface);
  color: var(--text);
  box-shadow: 0 28px 70px rgba(0, 0, 0, .45);
}
.pricing-page .usage-dialog::backdrop,
.pricing-page .wallet-confirmation::backdrop { background: rgba(0, 0, 0, .7); }
.pricing-page .usage-dialog-header { background: var(--surface); }
.pricing-page .usage-modes,
.pricing-page .price-refresh,
.pricing-page .usage-model-control select { border-color: var(--border); background: var(--bg); }
.pricing-page .usage-modes button { color: var(--text-soft); }
.pricing-page .usage-modes button[aria-pressed="true"] { color: var(--accent-ink); background: var(--accent); box-shadow: none; }
.pricing-page .usage-reference,
.pricing-page .usage-grid { border-color: var(--border); }
.pricing-page .usage-item + .usage-item { border-color: var(--border); }
.pricing-page #usage-rate,
.pricing-page .usage-item strong { color: var(--accent); }
.pricing-page .usage-close:hover,
.pricing-page .wallet-close:hover { background: var(--surface-strong); }

@media (max-width: 680px) {
  .pricing-page .nav-links [aria-current="page"] { padding: 14px 12px; }
}

.pricing-page .plan-save {
  border-color: rgba(239, 68, 68, .38);
  color: #F87171;
  background: rgba(239, 68, 68, .1);
}
.pricing-page .pricing-view-tabs button span,
.pricing-page .pricing-view-tabs button[aria-pressed="true"] span {
  color: #F87171;
  background: rgba(239, 68, 68, .14);
}

.pricing-page .nav-links [aria-current="page"] {
  padding: 6px 0;
  color: var(--text);
  background: transparent;
}
.pricing-page .site-header .nav-actions .button,
.pricing-page .site-header .nav-actions .button:hover {
  border-color: transparent;
  color: var(--text);
  background: transparent;
}

.pricing-page .pricing-view-tabs button { border: 1px solid transparent; }
.pricing-page .pricing-view-tabs button[aria-pressed="true"] {
  border-color: var(--accent);
  color: var(--accent);
  background: transparent;
  box-shadow: none;
}
.pricing-page .pricing-view-tabs button[aria-pressed="true"] span { background: transparent; }

.pricing-page .plan-save,
.pricing-page .pricing-view-tabs button span,
.pricing-page .pricing-view-tabs button[aria-pressed="true"] span {
  border-color: #EF4444;
  color: #FFF;
  background: #EF4444;
}

.pricing-page .plans-section .plan-save {
  margin-left: 0;
  border-color: #EF4444;
  color: #FFF;
  background: #EF4444;
}

.pricing-page .plans-section .subscription-button:not(:disabled) {
  border-color: var(--accent);
  color: var(--accent-ink);
  background: var(--accent);
}
.pricing-page .plans-section .subscription-button:not(:disabled):hover { background: var(--accent-hover); }

.pricing-page h1,
.pricing-page .pricing-section-heading h2,
.pricing-page .usage-dialog-header h2,
.pricing-page .plans-section .plan-heading h2,
.pricing-page .plans-section .plan-price > strong,
.pricing-page .plans-section .plan-credits strong,
.pricing-page .plans-section .plan-features h3,
.pricing-page .plans-section .plan-model-benefits > h3,
.pricing-page .plan-recommended,
.pricing-page .plan-save,
.pricing-page .pricing-faq-list summary { font-weight: 500; }
.pricing-page .pricing-view-tabs button,
.pricing-page .plans-section .purchase-button,
.pricing-page .plans-section .free-download { font-weight: 500; }

.pricing-page .pricing-view-tabs { border-color: rgba(255, 255, 255, .08); }
.pricing-page .pricing-view-tabs button[aria-pressed="true"] { border-color: rgba(255, 221, 0, .35); }

.pricing-page .plan-save,
.pricing-page .pricing-view-tabs button span {
  padding: 2px 6px;
  line-height: 1.3;
}

.pricing-page .plans-section .plan-credits {
  border: 0;
  background: transparent;
  padding: 0;
}
.pricing-page .plans-section .plan-credits strong {
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0;
}

.pricing-page .plans-section .model-logo-item,
.pricing-page .plans-section .featured-model-icon,
.pricing-page .model-logo { background: #D6D9D6; }

.pricing-page .discount-model-row .model-logo-item { padding: 0; background: transparent; }
.pricing-page .discount-model-row .model-logo {
  box-sizing: border-box;
  width: 18px;
  height: 18px;
  padding: 0;
  border-radius: 4px;
  background: #FFF;
  filter: drop-shadow(0 0 2px rgba(255, 255, 255, .38)) drop-shadow(0 2px 3px rgba(0, 0, 0, .35));
}

.plan-features .feature-note,
.plan-features .feature-tag,
.plan-features .feature-unlimited {
  padding: 2px 6px;
  border: 0;
  border-radius: 4px;
  color: var(--text-soft);
  background: rgba(255, 221, 0, .1);
  font-size: 10px;
  font-weight: 500;
  line-height: 1.4;
}

.pricing-page .plans-section .plan-features .icon {
  color: var(--text-soft);
  filter: brightness(0) invert(1);
  opacity: 1;
}

.pricing-page .plans-section .purchase-button,
.pricing-page .plans-section .free-download {
  font-size: 16px;
  font-weight: 600;
}