/* kit.css — pdf-editor-saas additions on the ui-landing-saas tokens (no raw colours).
 * Classes: .draft-banner .plan__billed .account .account__card .account__usage .account__actions .account__fine .visually-hidden */
.draft-banner { padding-block: var(--space-3); background: var(--negative-container); color: var(--text-emphasis); border-bottom: 2px solid var(--negative); font: var(--type-body-sm); }
.draft-banner strong { color: var(--text-emphasis); }
.plan__billed { min-height: 1.5em; margin-top: calc(-1 * var(--space-2)); font: var(--type-caption); color: var(--text-muted); }
.plan__billed::before { content: attr(data-annual); }
[data-billing="monthly"] .plan__billed::before { content: attr(data-monthly); }
.plan .btn[disabled] { opacity: 0.6; cursor: not-allowed; }
.account { display: grid; gap: var(--space-5); grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); margin-top: var(--space-6); }
.account__card { padding: var(--space-5); border: 1px solid var(--stroke); border-radius: var(--radius-l); background: var(--surface-raised); }
.account__card h2 { font: var(--type-h3); margin-bottom: var(--space-3); }
.account__usage { width: 100%; border-collapse: collapse; font: var(--type-body-sm); }
.account__usage th, .account__usage td { text-align: left; padding: var(--space-2) 0; border-bottom: 1px solid var(--stroke); }
.account__actions { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-4); }
.account__fine { margin-top: var(--space-4); font: var(--type-caption); color: var(--text-muted); }
.account__fine a { text-decoration: underline; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }