/* VoxAudio Public-D1 auth/account UI foundation — v1.7.0 */
:root {
    --vaa-bg: #f6f1e9;
    --vaa-surface: #fffdf9;
    --vaa-surface-soft: #fbf6ef;
    --vaa-text: #2e2925;
    --vaa-muted: #746b63;
    --vaa-border: #e2d8cc;
    --vaa-accent: #8f3f3f;
    --vaa-accent-strong: #71302f;
    --vaa-accent-soft: #f4e3df;
    --vaa-copper: #a86845;
    --vaa-success: #2f7654;
    --vaa-warning: #93611e;
    --vaa-danger: #a13838;
    --vaa-shadow: 0 18px 48px rgba(73, 52, 38, .11);
}

.voxaudio-auth-page,
.voxaudio-account-page,
.voxaudio-history-page,
.voxaudio-account-gifts-page,
.voxaudio-profile-page {
    min-height: 100vh;
    color: var(--vaa-text);
    background: var(--vaa-bg);
}

.voxaudio-auth-page :where(a, button, input, select, textarea):focus-visible,
.voxaudio-account-page :where(a, button, input, select, textarea):focus-visible,
.voxaudio-history-page :where(a, button, input, select, textarea):focus-visible,
.voxaudio-account-gifts-page :where(a, button, input, select, textarea):focus-visible,
.voxaudio-profile-page :where(a, button, input, select, textarea):focus-visible {
    outline: 3px solid rgba(143, 63, 63, .3);
    outline-offset: 3px;
}

/* Authentication */
.voxaudio-auth-page .page {
    grid-template-columns: minmax(0, 1.02fr) minmax(360px, .78fr);
    gap: clamp(24px, 5vw, 64px);
    padding: clamp(36px, 7vw, 78px) 0;
}

.voxaudio-auth-page .hero-panel {
    padding: clamp(28px, 4vw, 46px);
    color: var(--vaa-text);
    background: rgba(255, 253, 249, .72);
    border: 1px solid var(--vaa-border);
    box-shadow: none;
}

.voxaudio-auth-page .eyebrow {
    color: var(--vaa-accent-strong);
    background: var(--vaa-accent-soft);
    border-color: #e5c4bd;
}

.voxaudio-auth-page .dot {
    background: var(--vaa-copper);
    box-shadow: 0 0 0 5px rgba(168, 104, 69, .13);
}

.voxaudio-auth-page h1 {
    color: var(--vaa-text);
    font-size: clamp(38px, 5vw, 62px);
}

.voxaudio-auth-page .lead,
.voxaudio-auth-page .feature span {
    color: var(--vaa-muted);
}

.voxaudio-auth-page .feature {
    color: var(--vaa-text);
    background: var(--vaa-surface);
    border-color: var(--vaa-border);
}

.voxaudio-auth-page .card {
    color: var(--vaa-text);
    background: var(--vaa-surface);
    border: 1px solid var(--vaa-border);
    box-shadow: var(--vaa-shadow);
}

.voxaudio-auth-page .card-sub,
.voxaudio-auth-page .check {
    color: var(--vaa-muted);
}

.voxaudio-auth-page .field label {
    color: #514942;
}

.voxaudio-auth-page .input {
    min-height: 48px;
    color: var(--vaa-text);
    background: #fff;
    border-color: #cfc2b5;
}

.voxaudio-auth-page .input:focus {
    border-color: var(--vaa-accent);
    box-shadow: 0 0 0 4px rgba(143, 63, 63, .12);
}

.voxaudio-auth-page .password-toggle {
    min-width: 44px;
    min-height: 44px;
    right: 3px;
    color: var(--vaa-accent-strong);
    background: var(--vaa-surface-soft);
}

.voxaudio-auth-page .link {
    color: var(--vaa-accent-strong);
}

.voxaudio-auth-page .submit,
.voxaudio-auth-page .btn-primary {
    min-height: 48px;
    background: var(--vaa-accent);
    box-shadow: 0 12px 28px rgba(113, 48, 47, .2);
}

.voxaudio-auth-page .submit:hover,
.voxaudio-auth-page .btn-primary:hover {
    background: var(--vaa-accent-strong);
}

.voxaudio-auth-page .voxaudio-purchase-auth-notice {
    color: var(--vaa-accent-strong);
    background: var(--vaa-accent-soft);
    border-color: #dfbbb3;
}

/* Shared account surfaces */
.voxaudio-account-page .account-wrap,
.voxaudio-history-page .history-wrap,
.voxaudio-account-gifts-page > main.wrap,
.voxaudio-profile-page > main.wrap {
    padding-top: clamp(28px, 5vw, 58px);
    padding-bottom: 72px;
}

.voxaudio-account-page .account-hero,
.voxaudio-account-page .account-panel,
.voxaudio-account-page .library-card,
.voxaudio-account-page .payment-card,
.voxaudio-history-page .history-card,
.voxaudio-account-gifts-page .panel,
.voxaudio-profile-page .panel,
.voxaudio-profile-page .panel-dark {
    color: var(--vaa-text);
    background: var(--vaa-surface);
    border: 1px solid var(--vaa-border);
    box-shadow: var(--vaa-shadow);
}

.voxaudio-account-page .account-hero {
    position: relative;
    overflow: hidden;
    background: linear-gradient(120deg, #fffdf9 0%, #f8ebe5 100%);
}

.voxaudio-account-page .account-hero::after {
    content: "";
    position: absolute;
    width: 220px;
    height: 220px;
    right: -90px;
    top: -110px;
    border-radius: 50%;
    background: rgba(168, 104, 69, .1);
    pointer-events: none;
}

.voxaudio-account-page .eyebrow,
.voxaudio-account-gifts-page .eyebrow,
.voxaudio-profile-page .eyebrow {
    color: var(--vaa-accent-strong);
    background: var(--vaa-accent-soft);
    border-color: #e5c4bd;
}

.voxaudio-account-page .eyebrow-dot,
.voxaudio-account-gifts-page .dot,
.voxaudio-profile-page .dot {
    background: var(--vaa-copper);
    box-shadow: 0 0 0 5px rgba(168, 104, 69, .13);
}

.voxaudio-account-page :where(h1, h2, h3),
.voxaudio-history-page :where(h1, .book),
.voxaudio-account-gifts-page :where(h1, h2),
.voxaudio-profile-page :where(h1, h2) {
    color: var(--vaa-text);
}

.voxaudio-account-page :where(.muted, .hero-user, .subscription-meta, .book-author, .language-label, .payment-meta, .profile-line span),
.voxaudio-history-page :where(.chapter, .meta),
.voxaudio-account-gifts-page :where(.lead, .muted, th),
.voxaudio-profile-page :where(.lead, .muted, .panel-dark .muted, .side-line span) {
    color: var(--vaa-muted);
}

.voxaudio-account-page .account-panel.subscription-panel {
    background: linear-gradient(120deg, #fffdf9, #eff6ef);
}

.voxaudio-account-page .library-search,
.voxaudio-account-gifts-page :where(input, select, textarea),
.voxaudio-profile-page .input {
    min-height: 48px;
    color: var(--vaa-text);
    background: #fff;
    border-color: #cfc2b5;
}

.voxaudio-account-page .library-search::placeholder,
.voxaudio-profile-page .input::placeholder {
    color: #92877e;
}

.voxaudio-account-page .library-search:focus,
.voxaudio-account-gifts-page :where(input, select, textarea):focus,
.voxaudio-profile-page .input:focus {
    border-color: var(--vaa-accent);
    box-shadow: 0 0 0 4px rgba(143, 63, 63, .12);
}

.voxaudio-account-page .btn,
.voxaudio-account-gifts-page .btn,
.voxaudio-profile-page .btn,
.voxaudio-history-page :where(.back, .continue) {
    min-height: 46px;
    color: var(--vaa-text);
    background: var(--vaa-surface-soft);
    border: 1px solid var(--vaa-border);
}

.voxaudio-account-page .btn-primary,
.voxaudio-account-gifts-page .btn-primary,
.voxaudio-profile-page .btn-primary,
.voxaudio-history-page .continue {
    color: #fff;
    background: var(--vaa-accent);
    border-color: var(--vaa-accent);
    box-shadow: 0 10px 24px rgba(113, 48, 47, .17);
}

.voxaudio-account-page .btn-soft {
    color: var(--vaa-accent-strong);
    background: var(--vaa-accent-soft);
    border-color: #dfbbb3;
}

.voxaudio-account-page .library-card,
.voxaudio-account-page .payment-card,
.voxaudio-account-page .profile-line,
.voxaudio-account-page .empty-state {
    background: var(--vaa-surface-soft);
    border-color: var(--vaa-border);
    box-shadow: none;
}

.voxaudio-account-page .status-pill {
    color: var(--vaa-warning);
    background: #fff3d9;
    border-color: #ead09d;
}

.voxaudio-account-page .status-pill.active {
    color: var(--vaa-success);
    background: #e4f3e8;
    border-color: #b9d9c3;
}

.voxaudio-account-page .badge {
    color: #625a53;
    background: #f2ece5;
    border-color: #ded2c6;
}

.voxaudio-account-page .badge.paid,
.voxaudio-account-page .badge.gift {
    color: var(--vaa-success);
    background: #e4f3e8;
    border-color: #b9d9c3;
}

.voxaudio-account-page .badge.free {
    color: var(--vaa-warning);
    background: #fff3d9;
    border-color: #ead09d;
}

.voxaudio-account-page .badge.subscription,
.voxaudio-account-page .language-link {
    color: #5c4e85;
    background: #eee9f8;
    border-color: #d7ccef;
}

.voxaudio-account-page .payment-status.pending { color: var(--vaa-warning); }
.voxaudio-account-page .payment-status.failed,
.voxaudio-account-page .search-empty { color: var(--vaa-danger); }

/* Listening history */
.voxaudio-history-page .history-head {
    align-items: center;
}

.voxaudio-history-page .history-card {
    padding: 16px;
}

.voxaudio-history-page .cover {
    background: #e9dfd4;
    box-shadow: 0 8px 20px rgba(55, 39, 29, .12);
}

.voxaudio-history-page .progress {
    background: #e9dfd4;
}

.voxaudio-history-page .progress span {
    background: var(--vaa-copper);
}

.voxaudio-history-page .empty {
    color: var(--vaa-muted);
    background: var(--vaa-surface);
    border-color: var(--vaa-border);
}

/* Account gifts */
.voxaudio-account-gifts-page .hero,
.voxaudio-profile-page .hero {
    padding-top: 8px;
}

.voxaudio-account-gifts-page .panel {
    border-radius: 24px;
}

.voxaudio-account-gifts-page label,
.voxaudio-profile-page label,
.voxaudio-profile-page .field label {
    color: #514942;
}

.voxaudio-account-gifts-page th,
.voxaudio-account-gifts-page td {
    border-color: var(--vaa-border);
}

.voxaudio-account-gifts-page .code {
    color: var(--vaa-accent-strong);
}

.voxaudio-account-gifts-page .badge {
    color: #625a53;
    background: #f2ece5;
    border-color: #ded2c6;
}

.voxaudio-account-gifts-page .badge.active,
.voxaudio-account-gifts-page .notice,
.voxaudio-profile-page .status {
    color: var(--vaa-success);
    background: #e4f3e8;
    border-color: #b9d9c3;
}

.voxaudio-account-gifts-page .badge.redeemed {
    color: #5c4e85;
    background: #eee9f8;
    border-color: #d7ccef;
}

.voxaudio-account-gifts-page :where(.badge.canceled, .badge.expired, .error),
.voxaudio-profile-page .errors {
    color: var(--vaa-danger);
}

/* Profile and security */
.voxaudio-profile-page .grid,
.voxaudio-profile-page .stack {
    gap: 20px;
}

.voxaudio-profile-page .panel,
.voxaudio-profile-page .panel-dark {
    border-radius: 26px;
}

.voxaudio-profile-page .side-line {
    border-color: var(--vaa-border);
}

.voxaudio-profile-page .btn-danger {
    color: var(--vaa-danger);
    background: #fff4f1;
    border-color: #e8bdb5;
    box-shadow: none;
}

.voxaudio-profile-page .danger-zone {
    border-color: var(--vaa-border);
}

@media (max-width: 920px) {
    .voxaudio-auth-page .page {
        grid-template-columns: 1fr;
        max-width: 680px;
    }

    .voxaudio-auth-page .hero-panel {
        display: block;
    }

    .voxaudio-auth-page .feature-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .voxaudio-auth-page .page,
    .voxaudio-account-page .account-wrap,
    .voxaudio-history-page .history-wrap,
    .voxaudio-account-gifts-page > main.wrap,
    .voxaudio-profile-page > main.wrap {
        padding-top: 24px;
        padding-bottom: 48px;
    }

    .voxaudio-auth-page .hero-panel {
        padding: 24px;
        border-radius: 24px;
    }

    .voxaudio-auth-page .hero-panel h1 {
        font-size: clamp(32px, 11vw, 44px);
    }

    .voxaudio-auth-page .feature-grid {
        grid-template-columns: 1fr;
    }

    .voxaudio-auth-page .card,
    .voxaudio-account-page .account-hero,
    .voxaudio-account-page .account-panel,
    .voxaudio-account-gifts-page .panel,
    .voxaudio-profile-page .panel,
    .voxaudio-profile-page .panel-dark {
        border-radius: 22px;
    }

    .voxaudio-account-page .quick-actions .btn,
    .voxaudio-account-page .card-actions .btn,
    .voxaudio-account-gifts-page .btn,
    .voxaudio-profile-page .btn,
    .voxaudio-history-page .continue {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .voxaudio-auth-page *,
    .voxaudio-account-page *,
    .voxaudio-history-page *,
    .voxaudio-account-gifts-page *,
    .voxaudio-profile-page * {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
}
