/* Account and purchase surfaces share the home editorial palette.
   Form fields, handlers, security widgets and payment state logic stay intact. */
:is(.account-page-shell, .account-dashboard-shell, .account-confirm-shell, .checkout-page, .payment-result-page, .pricing-catalog-page) {
    color: var(--ui-text, #edf3f5);
    font-size: 1rem;
    line-height: 1.7;
}

:is(.account-dashboard-shell, .checkout-page, .pricing-catalog-page) {
    width: min(1180px, calc(100% - 64px));
    margin: 0 auto;
    padding: 64px 0 88px;
}

:is(.account-page-shell, .account-dashboard-shell, .checkout-page, .payment-result-page, .pricing-catalog-page) :is(.section-kicker, .card-kicker) {
    color: var(--ui-accent, #77e0c4);
    font-size: .72rem;
    font-weight: 650;
    letter-spacing: .12em;
}

:is(.auth-copy, .account-dashboard-topbar, .checkout-hero, .license-hero, .payment-result-card) h1,
.account-confirm-shell h1 {
    color: var(--ui-text, #edf3f5);
    font-size: clamp(2.5rem, 4vw, 3.5rem);
    font-weight: 700;
    line-height: 1.16;
    letter-spacing: -.035em;
    overflow-wrap: anywhere;
}

/* Sign-in, registration, email/password recovery and confirmation. */
.account-page-shell {
    min-height: 0;
    padding: 64px 24px 88px;
    background: transparent;
}

/* Avoid the legacy main element adding a second set of horizontal gutters. */
.editorial-site .account-page-shell { width: 100%; max-width: none; margin: 0; }

.account-page-shell::before { content: none; }

.account-page-shell .auth-card,
.account-confirm-shell.section-shell {
    width: min(580px, 100%);
    padding: clamp(26px, 4vw, 44px);
    border: 1px solid var(--ui-line, #293b43);
    border-radius: 12px;
    background: var(--ui-surface, #101b23);
    box-shadow: none;
    backdrop-filter: none;
}

.account-confirm-shell.section-shell {
    width: min(680px, calc(100% - 48px));
    margin: 64px auto 88px;
}

.account-confirm-shell h1 { margin: 0 0 24px; }
.account-confirm-shell p { color: var(--ui-muted, #a5b3bd); }
.account-confirm-shell strong { color: var(--ui-text, #edf3f5); overflow-wrap: anywhere; }
.account-confirm-shell form { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.account-page-shell .auth-copy { margin-bottom: 28px; }
.account-page-shell .auth-copy p:not(.section-kicker) { margin: 18px 0 0; line-height: 1.7; }
.account-page-shell .auth-form { gap: 20px; }
.account-page-shell .auth-form label { gap: 9px; font-size: .88rem; font-weight: 600; }
.account-page-shell .auth-form label small { color: var(--ui-muted, #a5b3bd); font-weight: 400; line-height: 1.65; }
.account-page-shell .auth-form > .button { width: 100%; }
.account-page-shell :is(.auth-note, .auth-switch) { line-height: 1.7; font-size: .86rem; }
.account-page-shell .auth-switch a { font-weight: 650; text-underline-offset: 4px; }
.account-page-shell .auth-switch a:hover { text-decoration: underline; }
.account-page-shell .auth-divider { margin: 22px 0; color: var(--ui-muted, #a5b3bd); font-weight: 400; }
.account-page-shell .auth-divider::before,
.account-page-shell .auth-divider::after { background: var(--ui-line, #293b43); }
.account-page-shell .google-login-form { margin-bottom: 0; }
.account-page-shell .google-button { box-shadow: none; border-radius: 9px; }
.account-page-shell .form-success {
    margin-bottom: 24px;
    padding: 16px 18px;
    color: #c7f5e7;
    background: #16332b;
    border-color: #386554;
    border-radius: 9px;
    overflow-wrap: anywhere;
}
.account-page-shell .form-error,
.account-page-shell .field-error { color: #ffb0b0; font-weight: 500; }

/* Account navigation and data: keep the active/hidden pane contract. */
.account-dashboard-shell .account-dashboard-topbar {
    padding: 0 0 32px;
    border: 0;
    border-bottom: 1px solid var(--ui-line, #293b43);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
.account-dashboard-shell .account-dashboard-topbar p:not(.section-kicker) { max-width: 660px; margin: 18px 0 0; }
.account-dashboard-shell .account-role-actions { gap: 12px; margin-top: 22px; }
.account-dashboard-shell .account-dashboard-layout { grid-template-columns: 220px minmax(0, 1fr); gap: 28px; margin-top: 32px; }
.account-dashboard-shell :is(.account-sidebar, .account-content-panel) {
    border: 1px solid var(--ui-line, #293b43);
    border-radius: 12px;
    background: var(--ui-surface, #101b23);
    box-shadow: none;
    min-width: 0;
}
.account-dashboard-shell .account-sidebar { top: 24px; padding: 20px 12px 12px; }
.account-dashboard-shell .account-sidebar h2 { padding: 0 12px; margin-bottom: 16px; font-size: .8rem; font-weight: 650; letter-spacing: .07em; }
.account-dashboard-shell .account-sidebar nav { gap: 4px; }
.account-dashboard-shell .account-sidebar a { min-height: 44px; border-radius: 8px; font-size: .88rem; font-weight: 500; }
.account-dashboard-shell .account-sidebar a:hover { background: var(--ui-raised, #15232c); border-color: var(--ui-line, #293b43); }
.account-dashboard-shell .account-sidebar a.active { color: #c7f5e7; border-color: #386554; background: #16332b; font-weight: 650; }
.account-dashboard-shell .account-content-panel { padding: 28px; min-height: 440px; }
.account-dashboard-shell .account-panel-heading { margin-bottom: 24px; }
.account-dashboard-shell .account-panel-heading h2 { margin: 8px 0 0; font-size: clamp(1.55rem, 2.6vw, 2rem); line-height: 1.25; letter-spacing: -.025em; }
.account-dashboard-shell .account-heading-with-action { flex-wrap: wrap; align-items: center; gap: 16px; }
.account-dashboard-shell .overview-stat-grid { gap: 14px; }
.account-dashboard-shell :is(.overview-stat-grid article, .account-license-focus > div, .account-device-card, .saved-song-card, .support-ticket-card) {
    min-width: 0;
    padding: 20px;
    border: 1px solid var(--ui-line, #293b43);
    border-radius: 12px;
    background: var(--ui-raised, #15232c);
    box-shadow: none;
}
.account-dashboard-shell .account-license-price { background: var(--ui-raised, #15232c) !important; }
.account-dashboard-shell .overview-stat-grid article { min-height: 140px; }
.account-dashboard-shell :is(.overview-stat-grid span, .account-license-focus span) { color: var(--ui-muted, #a5b3bd); font-size: .72rem; font-weight: 600; letter-spacing: .08em; }
.account-dashboard-shell :is(.overview-stat-grid strong, .account-license-focus strong) { color: var(--ui-text, #edf3f5); font-weight: 650; line-height: 1.25; }
.account-dashboard-shell :is(.overview-stat-grid small, .account-license-focus small) { color: var(--ui-muted, #a5b3bd); font-weight: 400; }
.account-dashboard-shell .account-license-focus { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 24px; }
.account-dashboard-shell .account-license-focus strong { font-size: clamp(1.65rem, 3vw, 2.2rem); overflow-wrap: anywhere; }
.account-dashboard-shell .account-data-list { margin: 0; gap: 0; }
.account-dashboard-shell .account-data-list div { padding: 15px 0; border-color: var(--ui-line, #293b43); }
.account-dashboard-shell :is(.account-data-list dd, .account-device-card dd) { font-weight: 500; overflow-wrap: anywhere; }
.account-dashboard-shell .compact-credit { color: var(--ui-accent, #77e0c4); -webkit-text-fill-color: currentColor; background: none; font-weight: 650; }
.account-dashboard-shell .empty-copy { color: var(--ui-muted, #a5b3bd); max-width: 560px; line-height: 1.7; }
.account-dashboard-shell :is(.saved-song-card, .account-device-card) { gap: 20px; }
.account-dashboard-shell :is(.saved-song-card strong, .account-device-card strong, .support-ticket-card header strong) { color: var(--ui-text, #edf3f5); font-weight: 600; overflow-wrap: anywhere; }
.account-dashboard-shell :is(.saved-song-card span, .saved-song-card small, .account-device-card span, .account-device-card small, .support-ticket-card header span) { color: var(--ui-muted, #a5b3bd); line-height: 1.65; }
.account-dashboard-shell .saved-song-actions { flex-wrap: wrap; gap: 10px; }
.account-dashboard-shell .account-device-card dl { min-width: 0; }
.account-dashboard-shell .account-device-card dl div { grid-template-columns: 90px minmax(0, 1fr); }
.account-dashboard-shell .status-pill { border: 1px solid var(--ui-line, #293b43); background: #1a2e35; color: #c7d8db; font-weight: 600; white-space: normal; }
.account-dashboard-shell .support-ticket-card.unread { border-color: #386554; background: #142b27; }
.account-dashboard-shell .support-ticket-card > p { overflow-wrap: anywhere; }
.account-dashboard-shell .support-message { border-left-color: #4c737c; background: #101e27; }
.account-dashboard-shell .support-message.admin { border-left-color: var(--ui-accent, #77e0c4); background: #132b25; }
.account-dashboard-shell .support-message p { overflow-wrap: anywhere; }
.account-dashboard-shell .support-reply-form { gap: 12px; }
.account-dashboard-shell .support-reply-form .button { justify-self: start; }
.account-dashboard-shell .account-security-state { gap: 10px; margin-bottom: 24px; }
.account-dashboard-shell .account-security-form { max-width: 520px; gap: 20px; }

/* Pricing keeps every SKU, regional price and purchase form visible. */
.pricing-catalog-page .license-hero,
.checkout-page .checkout-hero { grid-template-columns: minmax(0, 1fr) 300px; align-items: start; gap: 40px; padding: 0 0 36px; border: 0; border-bottom: 1px solid var(--ui-line, #293b43); border-radius: 0; background: transparent; box-shadow: none; }
.pricing-catalog-page .license-hero h1 { font-size: clamp(2.5rem, 4vw, 3.5rem); line-height: 1.16; }
.pricing-catalog-page .license-hero p,
.checkout-page .checkout-hero p { color: var(--ui-muted, #a5b3bd); font-size: 1rem; line-height: 1.7; }
.pricing-catalog-page :is(.license-status-card, .annual-pricing-card, .plugin-pricing-card, .license-next-card, .license-flow, .turnstile-checkout-panel),
.checkout-page :is(.checkout-summary-card, .checkout-plan-card, .checkout-method-card, .checkout-payment-options, .manual-payment-card) {
    border: 1px solid var(--ui-line, #293b43);
    border-radius: 12px;
    background: var(--ui-surface, #101b23);
    box-shadow: none;
}
.pricing-catalog-page .pricing-region-card { min-height: 0; padding: 24px; gap: 12px; }
.pricing-catalog-page .pricing-region-card strong { font-size: 1.45rem; font-weight: 650; line-height: 1.35; }
.pricing-catalog-page .pricing-region-card small { color: var(--ui-muted, #a5b3bd); line-height: 1.65; }
.pricing-catalog-page .pricing-section { padding-top: 48px; }
.pricing-catalog-page .pricing-section-heading { margin-bottom: 28px; }
.pricing-catalog-page :is(.pricing-section-heading, .license-next-card, .license-flow) h2 { font-size: clamp(1.65rem, 3vw, 2.25rem); line-height: 1.25; letter-spacing: -.025em; }
.pricing-catalog-page .annual-plan-grid { gap: 20px; }
.pricing-catalog-page .annual-pricing-card { min-height: 360px; padding: 26px; }
.pricing-catalog-page .annual-pricing-card.featured { border-color: #52816f; background: #122720; box-shadow: none; }
.pricing-catalog-page .pricing-recommended { position: static; align-self: flex-start; margin-bottom: 18px; padding: 5px 9px; border-radius: 6px; font-weight: 650; letter-spacing: .05em; }
.pricing-catalog-page .pricing-product-identity { padding-right: 0; gap: 14px; min-width: 0; }
.pricing-catalog-page :is(.pricing-product-identity img, .plugin-pricing-card > img) { border-color: var(--ui-line, #293b43); border-radius: 10px; background: #0d161d; }
.pricing-catalog-page .pricing-product-identity h3 { font-size: 1.22rem; line-height: 1.35; overflow-wrap: anywhere; }
.pricing-catalog-page :is(.pricing-product-identity small, .plugin-pricing-copy small) { color: var(--ui-muted, #a5b3bd); }
.pricing-catalog-page .annual-pricing-card > p { margin: 22px 0 28px; font-size: .94rem; line-height: 1.7; }
.pricing-catalog-page .pricing-amount { flex-wrap: wrap; gap: 8px; }
.pricing-catalog-page .pricing-amount strong { font-size: clamp(1.9rem, 3vw, 2.45rem); font-weight: 650; line-height: 1.25; }
.pricing-catalog-page .pricing-amount span { color: var(--ui-muted, #a5b3bd); font-weight: 500; }
.pricing-catalog-page .perpetual-plugin-grid { gap: 16px; }
.pricing-catalog-page .plugin-pricing-card { grid-template-columns: 52px minmax(0, 1fr) auto; gap: 16px; padding: 20px; }
.pricing-catalog-page .plugin-pricing-card > img { width: 52px; height: 52px; }
.pricing-catalog-page .plugin-pricing-copy h3 { font-size: 1.02rem; line-height: 1.4; }
.pricing-catalog-page .plugin-pricing-copy > span { color: var(--ui-muted, #a5b3bd); font-weight: 400; }
.pricing-catalog-page .plugin-pricing-action { flex-direction: column; align-items: flex-end; gap: 8px; }
.pricing-catalog-page .plugin-pricing-action > strong { min-width: 0; font-size: 1.1rem; font-weight: 650; }
.pricing-catalog-page .pricing-payment-card { margin-top: 48px; padding: 28px; gap: 32px; }
.pricing-catalog-page .license-flow { padding: 28px; gap: 28px; }
.pricing-catalog-page .license-flow-steps { gap: 12px; }
.pricing-catalog-page .license-flow-steps article { background: var(--ui-raised, #15232c); border-color: var(--ui-line, #293b43); border-radius: 9px; padding: 16px; }
.pricing-catalog-page .license-flow-steps strong { color: var(--ui-accent, #77e0c4); background: #16332b; border: 1px solid #386554; font-weight: 600; }
.pricing-catalog-page .license-payment-logos .payment-logo-chip { background: var(--ui-raised, #15232c); border-color: var(--ui-line, #293b43); box-shadow: none; border-radius: 9px; }
.pricing-catalog-page .turnstile-checkout-panel { padding: 20px; }

/* Checkout separates the order summary from the available payment actions. */
.checkout-page .checkout-summary-card { padding: 24px; gap: 12px; }
.checkout-page .checkout-summary-card strong { font-size: 1.5rem; line-height: 1.3; overflow-wrap: anywhere; }
.checkout-page .checkout-summary-card small { color: var(--ui-muted, #a5b3bd); }
.checkout-page .checkout-grid { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 24px; align-items: start; }
.checkout-page :is(.checkout-plan-card, .checkout-method-card, .checkout-payment-options) { padding: 28px; }
.checkout-page :is(.checkout-plan-card, .checkout-method-card, .checkout-payment-options, .manual-payment-copy) h2 { font-size: clamp(1.55rem, 2.5vw, 2rem); line-height: 1.3; letter-spacing: -.025em; }
.checkout-page .checkout-price-pair { gap: 12px; margin: 24px 0; }
.checkout-page .checkout-price-pair div { padding: 18px; background: var(--ui-raised, #15232c); border-color: var(--ui-line, #293b43); border-radius: 9px; }
.checkout-page .checkout-price-pair strong { font-size: 2rem; line-height: 1.25; font-weight: 650; }
.checkout-page .checkout-price-pair small,
.checkout-page .checkout-feature-list { color: var(--ui-muted, #a5b3bd); line-height: 1.7; }
.checkout-page .checkout-method { min-width: 0; padding: 20px; border-color: var(--ui-line, #293b43); border-radius: 9px; background: var(--ui-raised, #15232c); box-shadow: none; }
.checkout-page .checkout-method.primary-method { grid-template-columns: 44px minmax(0, 1fr); gap: 14px; min-height: 0; }
.checkout-page .checkout-provider-mark { width: 44px; height: 44px; border-radius: 9px; box-shadow: none; }
.checkout-page .checkout-provider-mark.manual-mark img { width: 44px; height: 44px; }
.checkout-page .checkout-method-copy p { font-size: .9rem; line-height: 1.65; color: var(--ui-muted, #a5b3bd); }
.checkout-page .checkout-method-copy small { color: var(--ui-muted, #a5b3bd); line-height: 1.6; }
.checkout-page .checkout-method-title strong { font-weight: 650; }
.checkout-page .checkout-method-title span { color: #c7d8db; border-color: var(--ui-line, #293b43); background: #1a2e35; font-weight: 600; letter-spacing: .03em; }
.checkout-page .checkout-method > .checkout-pay-button { grid-column: 2; justify-self: stretch; min-width: 0; width: 100%; white-space: normal; line-height: 1.4; }
.checkout-page .checkout-pay-button > :is(span:not(.status-pill), strong, em) { color: inherit; }
.checkout-page .disabled-method { opacity: .65; background: transparent; }
.checkout-page .checkout-payment-options > form { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; }
.checkout-page .checkout-payment-options :is(.turnstile-shell, .checkout-alert) { flex-basis: 100%; }
.checkout-page .checkout-payment-options .status-pill { border: 1px solid #6e5935; border-radius: 5px; background: #342b1e; color: #f4d29b; font-size: .65rem; }
.checkout-page .manual-payment-card { grid-template-columns: minmax(0, 1fr) 300px; gap: 32px; padding: 32px; }
.checkout-page .manual-payment-copy p { color: var(--ui-muted, #a5b3bd); }
.checkout-page .manual-payment-details { gap: 0; }
.checkout-page .manual-payment-details div { grid-template-columns: 150px minmax(0, 1fr); padding: 14px 0; background: transparent; border: 0; border-bottom: 1px solid var(--ui-line, #293b43); border-radius: 0; }
.checkout-page .manual-payment-details dt { color: var(--ui-muted, #a5b3bd); font-size: .86rem; font-weight: 500; }
.checkout-page .manual-payment-details dd { color: var(--ui-text, #edf3f5); font-weight: 650; font-variant-numeric: tabular-nums; }
.checkout-page .manual-payment-details div:last-child dd { color: var(--ui-accent, #77e0c4); }
.checkout-page .manual-qr-card { padding: 20px; border-color: var(--ui-line, #293b43); border-radius: 12px; background: var(--ui-raised, #15232c); align-self: start; }
.checkout-page .manual-qr-card img { border-radius: 6px; padding: 8px; background: #fff; }
.checkout-page .manual-qr-card :is(strong, span) { overflow-wrap: anywhere; text-align: center; }
.checkout-page .manual-qr-card strong { color: var(--ui-text, #edf3f5); font-weight: 650; }
.checkout-page .manual-qr-card span { color: var(--ui-accent, #77e0c4); }
:is(.checkout-page, .pricing-catalog-page) .checkout-alert { padding: 16px 20px; border: 1px solid #546272; border-radius: 9px; background: #17232e; box-shadow: none; color: #d5e2ea; }
:is(.checkout-page, .pricing-catalog-page) .checkout-alert.error { background: #311e24; color: #ffc3c3; border-color: #795052; }

/* Payment outcomes retain distinct success, waiting and failure semantics. */
.payment-result-page { width: min(860px, calc(100% - 64px)); padding: 64px 0 88px; }
.payment-result-page .payment-result-card { padding: clamp(28px, 5vw, 52px); border-radius: 12px; border-color: var(--ui-line, #293b43); background: var(--ui-surface, #101b23); box-shadow: none; }
.payment-result-page .payment-result-card.paid { border-color: #426e5a; }
.payment-result-page .payment-result-card:is(.failed, .cancelled, .expired) { border-color: #795052; }
.payment-result-page .payment-result-symbol { width: 72px; height: 72px; margin-bottom: 24px; font-size: 34px; box-shadow: none; color: #c7d8db; border-color: #47616c; background: #192b35; }
.payment-result-page .payment-result-symbol.paid { color: var(--ui-accent, #77e0c4); border-color: #426e5a; background: #16332b; }
.payment-result-page .payment-result-symbol:is(.pending, .processing, .awaitingpayment, .awaitingconfirmation, .awaitingmanualreview) { color: #f4d29b; border-color: #6e5935; background: #342b1e; }
.payment-result-page .payment-result-symbol:is(.failed, .cancelled, .expired, .unavailable) { color: #ffb0b0; border-color: #795052; background: #311e24; }
.payment-result-page .payment-result-lead { max-width: 640px; color: var(--ui-muted, #a5b3bd); font-size: 1rem; line-height: 1.7; }
.payment-result-page .payment-result-refresh-note { border-radius: 9px; color: #e2c99f; border-color: #6e5935; background: #2b251d; font-size: .88rem; text-align: left; }
.payment-result-page .payment-result-pulse { flex: 0 0 8px; width: 8px; height: 8px; background: #f4d29b; box-shadow: none; animation: none; }
.payment-result-page .payment-result-spinner { border-color: #6e5935; border-top-color: #f4d29b; }
.payment-result-page .payment-result-details { margin-top: 32px; border-color: var(--ui-line, #293b43); background: var(--ui-line, #293b43); border-radius: 9px; }
.payment-result-page .payment-result-details div { padding: 18px 20px; background: var(--ui-raised, #15232c); }
.payment-result-page .payment-result-details dt { color: var(--ui-muted, #a5b3bd); font-weight: 500; letter-spacing: .05em; }
.payment-result-page .payment-result-details dd { color: var(--ui-text, #edf3f5); font-size: .92rem; font-weight: 500; }
.payment-result-page .payment-status-pill { color: #c7d8db; border-color: #47616c; background: #192b35; white-space: normal; }
.payment-result-page .payment-status-pill.paid { color: #c7f5e7; border-color: #426e5a; background: #16332b; }
.payment-result-page .payment-status-pill:is(.pending, .processing, .awaitingpayment, .awaitingconfirmation, .awaitingmanualreview) { color: #f4d29b; border-color: #6e5935; background: #342b1e; }
.payment-result-page .payment-status-pill:is(.failed, .cancelled, .expired) { color: #ffb0b0; border-color: #795052; background: #311e24; }
.payment-result-page .payment-result-security-note { color: var(--ui-muted, #a5b3bd); font-size: .8rem; line-height: 1.65; }

@media (max-width: 1000px) {
    .checkout-page .checkout-grid { grid-template-columns: 1fr; }
    .account-dashboard-shell .account-dashboard-layout { grid-template-columns: 190px minmax(0, 1fr); gap: 20px; }
    .account-dashboard-shell .overview-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .account-dashboard-shell .account-license-focus { grid-template-columns: 1fr; }
    .pricing-catalog-page .pricing-product-identity { padding-right: 0; }
    .pricing-catalog-page .annual-pricing-card { min-height: 0; }
}

@media (max-width: 900px) {
    :is(.account-dashboard-shell, .checkout-page, .pricing-catalog-page) { width: calc(100% - 40px); padding-top: 48px; }
    .account-dashboard-shell .account-dashboard-layout { grid-template-columns: 1fr; }
    .account-dashboard-shell .account-sidebar { position: static; padding: 16px; }
    .account-dashboard-shell .account-sidebar nav { display: flex; overflow-x: auto; gap: 6px; padding-bottom: 4px; }
    .account-dashboard-shell .account-sidebar a { flex: 0 0 auto; white-space: nowrap; }
    .account-dashboard-shell .account-sidebar h2 { padding-left: 4px; }
    .pricing-catalog-page .license-hero,
    .checkout-page .checkout-hero { grid-template-columns: 1fr; gap: 24px; }
    .pricing-catalog-page .pricing-region-card { max-width: 480px; }
    .pricing-catalog-page .perpetual-plugin-grid { grid-template-columns: 1fr; }
    .pricing-catalog-page .plugin-pricing-action { flex-direction: row; align-items: center; }
    .checkout-page .manual-payment-card { grid-template-columns: 1fr; gap: 28px; }
    .checkout-page .manual-qr-card { width: min(340px, 100%); justify-self: center; }
}

@media (max-width: 600px) {
    :is(.account-dashboard-shell, .checkout-page, .pricing-catalog-page, .payment-result-page) { width: calc(100% - 32px); padding: 36px 0 56px; }
    .account-page-shell { padding: 36px 16px 56px; }
    .account-page-shell .auth-card { padding: 26px 22px; }
    .account-confirm-shell.section-shell { width: calc(100% - 32px); margin: 36px auto 56px; padding: 26px 22px; }
    :is(.auth-copy, .account-dashboard-topbar, .checkout-hero, .license-hero, .payment-result-card) h1,
    .pricing-catalog-page .license-hero h1,
    .account-confirm-shell h1 { font-size: 2rem; line-height: 1.2; }
    .account-confirm-shell form .button { width: 100%; }
    .account-dashboard-shell .account-dashboard-layout { gap: 20px; margin-top: 24px; }
    .account-dashboard-shell .account-content-panel { padding: 20px; }
    .account-dashboard-shell .overview-stat-grid { gap: 10px; }
    .account-dashboard-shell .overview-stat-grid article { min-height: 126px; padding: 15px; }
    .account-dashboard-shell .overview-stat-grid strong { font-size: 1.4rem; }
    .account-dashboard-shell :is(.saved-song-card, .account-device-card) { grid-template-columns: 1fr; padding: 18px; }
    .account-dashboard-shell .saved-song-actions { justify-content: flex-start; }
    .account-dashboard-shell .support-ticket-card header { flex-wrap: wrap; gap: 12px; }
    .account-dashboard-shell .account-data-list div { grid-template-columns: 1fr; gap: 5px; }
    .pricing-catalog-page .pricing-section { padding-top: 36px; }
    .pricing-catalog-page .annual-pricing-card { padding: 24px; }
    .pricing-catalog-page .plugin-pricing-card { grid-template-columns: 48px minmax(0, 1fr); padding: 18px; }
    .pricing-catalog-page .plugin-pricing-card > img { width: 48px; height: 48px; }
    .pricing-catalog-page .plugin-pricing-action { grid-column: 1 / -1; justify-content: space-between; }
    .pricing-catalog-page :is(.pricing-payment-card, .license-flow) { padding: 22px; }
    .pricing-catalog-page .license-flow-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .checkout-page :is(.checkout-plan-card, .checkout-method-card, .checkout-payment-options, .manual-payment-card) { padding: 22px; }
    .checkout-page .checkout-price-pair { grid-template-columns: 1fr; }
    .checkout-page .checkout-method { padding: 16px; }
    .checkout-page .checkout-method > .checkout-pay-button { grid-column: 1 / -1; }
    .checkout-page .manual-payment-details div { grid-template-columns: 1fr; gap: 5px; }
    .checkout-page .manual-payment-actions { gap: 14px; }
    .checkout-page .manual-payment-actions .checkout-pay-button { width: 100%; white-space: normal; }
    .checkout-page .checkout-payment-options > form { align-items: stretch; flex-direction: column; }
    .payment-result-page .payment-result-card { padding: 28px 22px; }
    .payment-result-page .payment-result-details { grid-template-columns: 1fr; }
}

/* Flexible Turnstile needs 300px; reserve that space at a 320px viewport. */
@media (max-width: 420px) {
    .account-page-shell.account-with-challenge { padding-right: 0; padding-left: 0; }
    .account-with-challenge .auth-card { padding-right: 9px; padding-left: 9px; }
    .checkout-page .checkout-payment-options.checkout-with-challenge,
    .pricing-catalog-page .turnstile-checkout-panel {
        width: calc(100% + 32px);
        margin-right: -16px;
        margin-left: -16px;
        padding-right: 9px;
        padding-left: 9px;
    }
}