/* 延续实际付款页的MiSans、色值和玻璃轮廓；套餐沿产品内两列清单呈现。 */
@font-face { font-family: MiSans; src: url('/resource/fonts/MiSans-pricing.woff2') format('woff2'); font-weight: 100 900; font-display: swap; }
:root { --pricing-ink: #191919; --pricing-secondary: #555; --pricing-muted: #737373; --pricing-brand: #5163cb; }
* { box-sizing: border-box; }
body { margin: 0; color: var(--pricing-ink); background: #fff; font: 400 16px/1.65 MiSans, system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
[hidden] { display: none !important; }
#navbar-container header { background: rgb(255 255 255 / 94%); }
#navbar-container header > div, #footer-container footer > div { max-width: 1200px; }
#navbar-container header span.text-xl { font-weight: 500; }
#footer-container .space-x-4 { flex-shrink: 0; }
#footer-container a[title] { flex-shrink: 0; }
#footer-container .group > .absolute { display: none; }
#footer-container .group:hover > .absolute, #footer-container .group:focus-within > .absolute { display: block; opacity: 1; }
.pricing-main { width: min(100%, 948px); margin: 0 auto; padding: 128px 24px 72px; }
.pricing-heading { margin: 0 auto 36px; text-align: center; max-width: 680px; }
.pricing-heading h1 { margin: 0 0 12px; font-size: 30px; font-weight: 500; letter-spacing: -.02em; line-height: 1.4; }
.pricing-heading p { margin: 0; color: var(--pricing-secondary); font-size: 16px; line-height: 1.8; text-wrap: pretty; }
.plan-comparison { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: stretch; }
.plan-card { position: relative; min-width: 0; padding: 30px; border-radius: 24px; }
.plan-free { background: #f8f9fc; }
.plan-pro { background: radial-gradient(ellipse at 12% 0%, rgb(173 205 255 / 7%), transparent 65%), radial-gradient(ellipse at 90% 15%, rgb(214 194 255 / 6%), transparent 60%), rgb(255 255 255 / 78%); box-shadow: 0 8px 15px rgb(0 0 0 / 2%), 0 0 0 .5px rgb(0 0 0 / 9%), inset 0 11px 14px -11px rgb(0 0 0 / 9%), inset 0 -1px 1px rgb(255 255 255 / 90%); backdrop-filter: blur(3px) saturate(160%); }
.plan-card h2 { margin: 0; font-size: 21px; font-weight: 500; line-height: 1.5; }
.plan-pro h2 { color: var(--pricing-brand); }
.plan-description { margin: 6px 0 0; min-height: 26px; color: var(--pricing-muted); font-size: 15px; line-height: 1.7; }
.plan-price, .region-price { min-height: 98px; margin-top: 18px; }
.plan-price { display: flex; flex-wrap: wrap; align-items: baseline; align-content: center; gap: 0 8px; font-variant-numeric: tabular-nums; }
.region-price .plan-price { margin-top: 0; min-height: 62px; }
.price-amount { font-size: 44px; font-weight: 500; line-height: 1.35; letter-spacing: -1px; white-space: nowrap; }
.price-period { font-size: 15px; color: var(--pricing-muted); white-space: nowrap; }
.early-bird { margin: 0; font-size: 14px; color: var(--pricing-brand); line-height: 26px; }
.region-price [data-price-market="global"] { padding-top: 26px; }
.price-status { padding-top: 28px; margin: 0; font-size: 15px; color: var(--pricing-muted); }
.price-failure { font-size: 14px; color: var(--pricing-muted); }
.price-failure p { margin: 0 0 4px; }
.price-failure button { border: 0; padding: 4px 0; background: transparent; font: inherit; color: var(--pricing-brand); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.plan-features { list-style: none; display: grid; gap: 16px; margin: 20px 0 0; padding: 24px 0 0; border-top: 1px solid rgb(0 0 0 / 7%); }
.plan-features li { display: grid; grid-template-columns: 16px minmax(0, 1fr); gap: 10px; align-items: start; font-size: 16px; color: var(--pricing-secondary); }
.plan-features svg { margin-top: 5px; }
.plan-features .plan-gain { color: var(--pricing-brand); font-weight: 500; }
.purchase-notes { display: grid; grid-template-columns: 1.3fr 1fr; gap: 48px; margin: 38px 6px 0; }
.purchase-details { min-width: 0; font-size: 15px; line-height: 1.8; color: var(--pricing-secondary); }
.purchase-details h2 { margin: 0 0 12px; color: var(--pricing-ink); font-size: 17px; font-weight: 500; }
.purchase-details p { margin: 0 0 10px; }
.purchase-details a { color: var(--pricing-brand); text-decoration: underline; text-underline-offset: 3px; }
.skip-link { position: absolute; left: 24px; top: -80px; z-index: 100; padding: 12px 16px; background: #fff; color: var(--pricing-ink); }
.skip-link:focus { top: 12px; }
:focus-visible { outline: 2px solid var(--pricing-brand); outline-offset: 4px; }
@media (min-width: 641px) and (max-width: 850px) { .plan-description { min-height: 52px; } }
@media (max-width: 640px) {
    #footer-container .space-x-4 { position: relative; }
    #footer-container .space-x-4 .group { position: static; }
    #footer-container .group > .absolute { left: 0; right: auto; width: 240px; max-width: calc(100vw - 48px); }
    #footer-container .group > .absolute > div { max-width: 100%; }
    #footer-container .group > .absolute p { white-space: normal; }
    .pricing-main { padding: 108px 20px 44px; }
    .pricing-heading { text-align: left; margin-bottom: 26px; }
    .pricing-heading h1 { font-size: 26px; }
    .plan-comparison { grid-template-columns: 1fr; gap: 18px; }
    .plan-card { padding: 26px; }
    .plan-description { min-height: 0; }
    .plan-price, .region-price { min-height: 82px; }
    .plan-features { margin-top: 12px; padding-top: 20px; gap: 13px; }
    .purchase-notes { grid-template-columns: 1fr; gap: 20px; margin: 30px 4px 0; }
}
@media (prefers-reduced-transparency: reduce) { .plan-pro { background: #fff; backdrop-filter: none; } }
@media (forced-colors: active) { .plan-card { border: 1px solid CanvasText; } }
