.paid-account-page { background: #f7f9fa; color: #253c3e; }
.paid-account-page .app-shell { max-width: 1120px; }
.paid-account-page [hidden] { display: none !important; }
.paid-heading { padding: 28px 0 18px; }
.paid-heading h1 { font-size: 32px; margin: 16px 0; }
.paid-account-page h2 { font-size: 22px; }
.paid-account-page p { line-height: 1.6; overflow-wrap: anywhere; }
.paid-actions { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.paid-student-section { display: grid; grid-template-columns: minmax(0, 1fr) 240px; align-items: center; gap: 24px; border-block: 1px solid #bed1cd; border-top: 3px solid #347c63; padding: 24px 0; }
.paid-student-section img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.paid-account-page .field { display: grid; gap: 8px; max-width: 460px; margin: 16px 0; }
.paid-account-page select { width: 100%; min-width: 0; box-sizing: border-box; padding: 12px; font: inherit; background: white; border: 1px solid #8daba7; border-radius: 4px; }
.paid-billing { margin: 20px 0; }
.paid-billing summary { cursor: pointer; font-weight: 600; }
.paid-billing input, .paid-billing textarea { width: 100%; min-width: 0; padding: 10px; font: inherit; border: 1px solid #8daba7; border-radius: 4px; }
.paid-plan-section, #paid-form, .paid-history { padding: 24px 0; border-bottom: 1px solid #bed1cd; }
.paid-plans { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 22px 0; }
.paid-plan { display: grid; align-content: start; gap: 10px; border: 1px solid #a9c0ba; border-radius: 6px; padding: 20px; background: #fff; min-width: 0; cursor: pointer; }
.paid-plan:has(input:checked) { outline: 2px solid #347c63; outline-offset: -2px; background: #f0f8f3; }
.paid-plan:has(input:disabled) { cursor: default; }
.paid-plan strong { font-size: 20px; overflow-wrap: anywhere; }
.paid-plan .paid-price { font-size: 28px; font-weight: 700; color: #294a6a; }
.paid-plan p { margin: 0; }
.paid-plan input { width: 20px; height: 20px; accent-color: #347c63; }
.paid-plan .paid-soon { color: #8b491f; font-size: 14px; font-weight: 700; }
.paid-confirm { display: flex; gap: 12px; align-items: flex-start; line-height: 1.6; max-width: 760px; margin: 20px 0; }
.paid-confirm input { width: 20px; height: 20px; flex: 0 0 20px; accent-color: #347c63; }
.paid-account-page button { max-width: 100%; white-space: normal; }
.paid-account-page button:disabled { opacity: .55; cursor: not-allowed; }
.paid-account-page :focus-visible { outline: 3px solid #b65736; outline-offset: 3px; }
#paid-test, #paid-unavailable { padding: 14px 0; font-weight: 700; color: #8b491f; }
#paid-terms { white-space: pre-wrap; }
.paid-order { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; align-items: center; border-top: 1px solid #d1dedb; padding: 18px 0; }
.paid-order h3 { margin: 0; font-size: 18px; overflow-wrap: anywhere; }
.paid-order p { margin: 6px 0; font-size: 14px; }
.paid-footnote { color: #516467; font-size: 14px; }
@media (max-width: 720px) { .paid-plans { grid-template-columns: minmax(0, 1fr); } .paid-student-section { grid-template-columns: minmax(0, 1fr); } .paid-student-section img { max-width: 280px; } .paid-order { grid-template-columns: minmax(0, 1fr); } }