.student-account-page{min-height:100vh}.student-account-layout{width:min(760px,calc(100% - 28px));margin:0 auto;padding:48px 0}.student-account-layout.student-profile-layout{width:min(1120px,calc(100% - 28px))}.student-account-card{background:var(--surface,#fff);border:1px solid var(--border-color,rgba(148,163,184,.28));border-radius:24px;padding:clamp(22px,4vw,42px);box-shadow:0 24px 70px rgba(15,23,42,.12)}.student-account-card.wide{width:100%}.student-account-card h1{margin:.2rem 0 .8rem;font-size:clamp(2rem,5vw,3.4rem)}.student-account-card h2{margin:.2rem 0 1rem}.student-account-form{display:grid;gap:16px;margin-top:24px;scroll-margin-top:20px}.student-account-form label{display:grid;gap:7px;font-weight:700}.student-account-form label span{display:flex;justify-content:space-between;gap:12px}.student-account-form small{font-weight:500;opacity:.68}.student-account-form input{width:100%;border:1px solid var(--border-color,rgba(148,163,184,.45));background:var(--surface-muted,rgba(248,250,252,.8));color:inherit;border-radius:12px;padding:13px 14px;font:inherit}.student-account-form button,.account-button{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:12px;padding:13px 18px;background:linear-gradient(135deg,#2563eb,#7c3aed);color:#fff;text-decoration:none;font-weight:800;cursor:pointer}.student-account-form button:disabled{opacity:.5;cursor:not-allowed}.account-button.secondary{background:var(--surface-muted,#e2e8f0);color:inherit}.account-button.danger{background:#b91c1c}.account-action-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}.account-link-list{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:20px}.account-section-links{justify-content:flex-start;padding:14px 16px;border:1px solid var(--border-color,rgba(148,163,184,.28));border-radius:14px}.account-section-links a{font-weight:800}.account-summary,.account-help{display:grid;gap:5px;margin-top:20px;padding:16px;border-radius:14px;background:var(--surface-muted,rgba(226,232,240,.55))}.shared-access-help{border:1px solid rgba(217,119,6,.32);background:rgba(245,158,11,.12)}.profile-header{display:flex;justify-content:space-between;align-items:flex-start;gap:24px}.profile-identity-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:24px 0}.profile-identity-grid>div{display:grid;gap:6px;padding:15px;border-radius:14px;background:var(--surface-muted,rgba(226,232,240,.55))}.profile-identity-grid span{font-size:.8rem;opacity:.7}.profile-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.profile-form-grid form{padding:20px;border:1px solid var(--border-color,rgba(148,163,184,.28));border-radius:18px}.password-reset-help{grid-template-columns:auto 1fr;align-items:start}.alert,.notice{margin:18px 0;padding:14px 16px;border-radius:12px}.alert{background:rgba(220,38,38,.12);border:1px solid rgba(220,38,38,.28)}.notice{background:rgba(22,163,74,.12);border:1px solid rgba(22,163,74,.28)}@media(max-width:820px){.profile-header{display:block}.profile-identity-grid{grid-template-columns:1fr 1fr}.profile-form-grid{grid-template-columns:1fr}}@media(max-width:520px){.student-account-layout{padding:22px 0}.profile-identity-grid{grid-template-columns:1fr}.account-link-list,.password-reset-help{display:grid}.account-button{width:100%}}

/* v231: account pages use the site-wide theme contract directly. This keeps
   text, notices, controls and form fields readable in both dark and light
   themes, including Minimal Dark where the legacy --surface alias is absent. */
.student-account-page {
    --account-bg: var(--site-background, linear-gradient(145deg, #030712, #07111f));
    --account-surface: var(--site-surface, var(--panel, #101d31));
    --account-surface-solid: var(--site-surface-solid, #111827);
    --account-surface-soft: var(--site-surface-soft, var(--panel-soft, #162640));
    --account-surface-muted: var(--site-surface-muted, #1e293b);
    --account-border: var(--site-border, var(--border, #2b3b55));
    --account-border-strong: var(--site-border-strong, #3f5d82);
    --account-text: var(--site-text, var(--text, #f8fafc));
    --account-muted: var(--site-muted, var(--muted, #b7c5d8));
    --account-primary: var(--site-primary, var(--portal-accent, #38bdf8));
    --account-secondary: var(--site-secondary, var(--portal-accent-2, #8b5cf6));
    --account-good: var(--site-good, #4ade80);
    --account-bad: var(--site-bad, #fb7185);
    color: var(--account-text);
    background: var(--account-bg);
}

.student-account-page .student-account-card {
    color: var(--account-text);
    background: var(--account-surface);
    border-color: var(--account-border);
    box-shadow: var(--site-shadow, 0 24px 70px rgba(0, 0, 0, .34));
}

.student-account-card :where(h1, h2, h3, label, strong) {
    color: var(--account-text);
}

.student-account-card :where(p, small, .profile-identity-grid span) {
    color: var(--account-muted);
}

.student-account-card .eyebrow,
.student-account-card a:not(.account-button) {
    color: var(--account-primary);
}

.student-account-card .account-button,
.student-account-card .student-account-form button {
    color: #fff !important;
    background: linear-gradient(135deg, var(--account-primary), var(--account-secondary));
}

.student-account-card .account-button.secondary {
    color: var(--account-text) !important;
    background: var(--account-surface-muted);
    border: 1px solid var(--account-border);
}

.student-account-card .account-button.danger {
    color: #fff !important;
    background: color-mix(in srgb, var(--account-bad) 82%, #7f1d1d);
}

.student-account-card .account-section-links,
.student-account-card .profile-form-grid form {
    color: var(--account-text);
    background: color-mix(in srgb, var(--account-surface-solid) 58%, transparent);
    border-color: var(--account-border);
}

.student-account-card :where(.account-summary, .account-help, .profile-identity-grid > div) {
    color: var(--account-text);
    background: var(--account-surface-soft);
    border-color: var(--account-border);
}

.student-account-card .student-account-form input {
    color: var(--account-text) !important;
    background: var(--account-surface-solid) !important;
    border-color: var(--account-border) !important;
    caret-color: var(--account-primary);
}

.student-account-card .student-account-form input::placeholder {
    color: var(--account-muted);
    opacity: .82;
}

.student-account-card .student-account-form input:focus-visible,
.student-account-card .account-button:focus-visible,
.student-account-card .student-account-form button:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--account-primary) 58%, transparent);
    outline-offset: 2px;
}

.student-account-card .notice,
.student-account-card .notice :where(strong, span) {
    color: var(--account-good) !important;
}

.student-account-card .notice {
    background: color-mix(in srgb, var(--account-good) 12%, var(--account-surface));
    border-color: color-mix(in srgb, var(--account-good) 42%, var(--account-border));
}

.student-account-card .alert,
.student-account-card .alert :where(strong, span) {
    color: var(--account-bad) !important;
}

.student-account-card .alert {
    background: color-mix(in srgb, var(--account-bad) 12%, var(--account-surface));
    border-color: color-mix(in srgb, var(--account-bad) 42%, var(--account-border));
}

@media (max-width: 520px) {
    .student-account-layout {
        padding-bottom: 108px;
    }
}

/* v232: profile actions and password-recovery help stay full-width on phones. */
.student-account-card .account-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.student-account-card .account-form-actions > :where(button, .account-button) {
    flex: 1 1 190px;
    min-width: 0;
}

.student-account-card .password-reset-help {
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
    align-items: start;
}

.student-account-card .password-reset-copy {
    display: block;
    min-width: 0;
    color: var(--account-muted);
    line-height: 1.65;
    overflow-wrap: normal;
    word-break: normal;
}

.student-account-card .password-reset-copy a {
    white-space: normal;
}

@media (max-width: 520px) {
    .student-account-card .account-form-actions > :where(button, .account-button) {
        flex-basis: 100%;
        width: 100%;
    }
}
