/* Account-page surfaces use the shared leaderboard glass palette.
   Layout, portrait sizing, chart data, status colors and ad hosts stay in
   their existing page styles. */

:is(.page-dashboard, .page-profile, .page-analysis, .page-analytics,
    .page-settings, .page-notifications, .page-shop, .page-score-examples) {
    --account-glass-inset: inset 0 1px 0 rgba(255, 255, 255, .96),
        0 5px 14px rgba(22, 115, 161, .08);
    --account-glass-line: rgba(77, 161, 198, .22);
    --account-glass-selected: linear-gradient(145deg,
        rgba(255, 255, 255, .9), rgba(192, 243, 255, .66));
}

/* Retain the original page containers, with quieter corners at every size. */
.page-dashboard .dashboard-page .dashboard-card,
.page-profile :is(.profile-card, .profile-section-card, .profile-mobile-card, .profile-overall-card),
.page-analysis .responsive-ads-shell .analysis-card,
.page-analytics .responsive-ads-shell .site-ads-content > .analytics-page,
.page-settings .responsive-ads-shell .settings-card,
.page-notifications .notifications-card,
.page-shop .responsive-ads-shell .site-ads-content > .shop-page,
.page-shop :is(.shop-bundle, .shop-product, .shop-catalog-row, .shop-detail-card),
.page-score-examples .score-examples-panel {
    --surface-radius: var(--glass-radius);
    border-radius: var(--glass-radius);
}

.page-dashboard {
    --dashboard-ink: var(--glass-ink);
    --dashboard-muted: var(--glass-muted);
    --dashboard-border: var(--glass-edge);
    --dashboard-surface: var(--glass-panel);
    --dashboard-shadow: 0 5px 14px rgba(22, 115, 161, .08);
}

.page-dashboard .dashboard-page .dashboard-card {
    background: var(--glass-panel);
    border-color: var(--glass-edge);
    box-shadow: var(--glass-shadow);
}

.page-dashboard :is(.dashboard-summary-card, .selected-photo-overview,
    .photo-list-card, .stat-card, .confidence-meter-card, .photo-rating-section,
    .photo-management, .photo-item, .selected-empty, .dashboard-progress),
.page-profile :is(.rank-display > div, .stat-box, .photo-card, .empty-card,
    .progress-row, .profile-selected-stats, .ranked-photo-modal-stats > div),
.page-analysis :is(.analysis-purchase-gate, .analysis-existing-photo,
    .analysis-photo-item, .analysis-ratio-category),
.page-analytics :is(.analytics-summary-metric, .analytics-empty, .location-item),
.page-settings .settings-section,
.page-shop :is(.shop-upgrade, .shop-balance),
.page-score-examples .score-example-face {
    background: var(--glass-panel);
    border-color: var(--glass-edge);
    border-radius: var(--glass-radius);
    box-shadow: var(--account-glass-inset);
}

:is(.page-dashboard, .page-profile, .page-analysis, .page-analytics,
    .page-settings, .page-notifications, .page-shop) .account-preview-banner {
    background: var(--glass-panel);
    border-color: var(--glass-edge);
    border-radius: var(--glass-radius);
    color: var(--glass-muted);
    box-shadow: var(--account-glass-inset);
}

:is(.page-dashboard, .page-profile, .page-analysis, .page-analytics,
    .page-settings, .page-notifications, .page-shop) .account-preview-photo {
    background: var(--glass-panel);
    border-color: rgba(73, 164, 203, .4);
    color: var(--glass-muted);
}

/* Neutral copy only; state and confidence-tier selectors retain their colors. */
.page-dashboard :is(.dashboard-eyebrow, .dashboard-progress-lead, .dashboard-date-editor,
    .progress-empty, .progress-photo-meta span, .score-card-dialog p,
    .onboarding-modal-body, .upload-editor-help),
.page-dashboard .progress-status:not([data-tone="error"]),
.page-profile :is(.profile-label, .profile-username, .profile-location, .profile-bio,
    .rank-display p, .stat-box p, .section-header p, .photo-info, .empty-card,
    .profile-mobile-name p, .profile-mobile-bio, .profile-rated-heading > span,
    .profile-selected-stats dt, .profile-overall-card dt, .profile-rated-empty,
    .ranked-photo-modal-label, .ranked-photo-modal-stats dt, .ranked-photo-modal-estimate),
.page-analysis :is(.analysis-eyebrow, .analysis-lead, .analysis-existing-header p,
    .analysis-existing-empty, .analysis-empty-list, .analysis-photo-item span,
    .analysis-empty, .analysis-ratio-note, .analysis-ratio-item p,
    .landmark-editor-lead, .landmark-editor-sidebar-note, .landmark-editor-zoom-label,
    .landmark-editor-region, .landmark-editor-reset-note, .landmark-editor-scroll-hint,
    .ratio-unlock-dialog p),
.page-analysis :is(.analysis-status, .analysis-upload-status, .landmark-editor-status):not([data-tone="error"]):not([data-tone="ok"]),
.page-analytics :is(.analytics-header .eyebrow, .analytics-intro, .analytics-page .muted,
    .analytics-page .fallback, .analytics-summary-metric dt, .analytics-summary-caption,
    .analytics-empty, .metric-group-label small),
.page-analytics #analytics-status:not(:empty),
.page-settings :is(.settings-lead, .settings-field > span, .settings-help,
    .settings-section-description, .settings-secondary-link),
.page-settings .settings-status:not([data-tone="error"]):not([data-tone="ok"]),
.page-notifications :is(.notifications-subtitle, .notifications-empty,
    .notifications-item-body, .notifications-item-meta),
.page-shop :is(.shop-kicker, .shop-eyebrow, .shop-lead, .shop-description,
    .shop-privacy-note, .shop-license-note, .shop-upgrade span, .shop-value,
    .shop-price span, .shop-note, .shop-catalog-description, .shop-detail-summary),
.page-score-examples :is(.score-examples-kicker, .score-examples-intro,
    .score-examples-range, .score-example-caption, .score-examples-empty,
    .score-examples-status, .score-examples-note, .score-examples-note p + p) {
    color: var(--glass-muted);
}

.page-dashboard :is(.progress-chart-header h2, .progress-photo-meta strong,
    .photo-action-dialog h2, .score-card-dialog h2, .onboarding-modal-title),
.page-profile :is(.profile-title-row h1, .profile-mobile-name h1, .score,
    .stat-box > span, .section-header h2, .progress-row strong,
    .profile-rated-heading h2, .profile-overall-card h2,
    .profile-selected-stats dd:not([data-profile-confidence]),
    .ranked-photo-modal-details h2, .ranked-photo-modal-stats dd),
.page-analysis :is(.analysis-card h1, .analysis-photos h2, .analysis-ratios-panel h2,
    .analysis-purchase-gate h2, .analysis-existing-header h2,
    .analysis-existing-photo span, .analysis-photo-item strong, .analysis-empty strong,
    .analysis-ratio-item strong, .analysis-ratio-item .analysis-ratio-value,
    .landmark-editor-header h2, .landmark-editor-sidebar h3, .landmark-editor-item span),
.page-analytics :is(.analytics-page h1, .analytics-section h2, .analytics-summary-metric dd),
.page-settings :is(.settings-card h1, .settings-section h2, .settings-section-title,
    .settings-toggle, .settings-social-links > summary),
.page-notifications :is(.notifications-header h1, .notifications-item-title),
.page-shop :is(.shop-hero h1, .shop-product h2, .shop-bundle h2,
    .shop-detail-card h1, .shop-upgrade strong, .shop-upgrade b,
    .shop-price, .shop-catalog-name, .shop-catalog-offer),
.page-score-examples :is(.score-examples-header h1, .score-example-value) {
    color: var(--glass-ink);
}

/* Glass controls: retain all existing disabled, focus, pressed and danger cues. */
.page-dashboard :is(.dashboard-btn:not(#openScoreCard), .small-upload-btn,
    .face-action-btn:not(.danger):not(.primary), .progress-photo-actions button,
    .onboarding-modal-btn:not(.primary)),
.page-profile :is(.share-profile-btn, .social-links a, .profile-badges span,
    .ranked-photo-modal-close, .profile-photo-arrow),
.page-profile .profile-mobile-actions :is(.share-profile-btn, .report-trigger-btn),
.page-analysis :is(.analysis-existing-btn, .analysis-existing-close,
    .analysis-category-toggle, .landmark-editor-close, .landmark-editor-btn.ghost,
    .landmark-editor-zoom-btn, .landmark-editor-zoom-reset,
    .landmark-editor-reset-all:not(.is-selected)),
.page-settings :is(.settings-secondary-btn, .settings-actions button),
.page-notifications :is(.notifications-mark-all, .notifications-filter-toggle, .notifications-load-more),
.page-shop .shop-ratio-unlock button {
    background: var(--glass-control);
    border-color: var(--glass-edge);
    border-radius: var(--glass-control-radius);
    color: var(--glass-ink);
    box-shadow: var(--account-glass-inset);
}

.page-dashboard :is(.dashboard-btn:not(#openScoreCard), .small-upload-btn,
    .face-action-btn:not(.danger):not(.primary), .progress-photo-actions button):hover:not(:disabled),
.page-profile :is(.share-profile-btn, .social-links a, .ranked-photo-modal-close,
    .profile-photo-arrow):hover,
.page-profile .profile-mobile-actions :is(.share-profile-btn, .report-trigger-btn):hover,
.page-analysis :is(.analysis-existing-btn, .analysis-existing-close,
    .landmark-editor-close, .landmark-editor-btn.ghost, .landmark-editor-zoom-btn,
    .landmark-editor-zoom-reset):hover:not(:disabled),
.page-settings :is(.settings-secondary-btn, .settings-actions button):hover:not(:disabled),
.page-notifications :is(.notifications-mark-all, .notifications-filter-toggle,
    .notifications-load-more):hover:not(:disabled) {
    background: var(--account-glass-selected);
    box-shadow: inset 0 1px 0 #fff, 0 5px 15px rgba(12, 138, 187, .15);
}

.page-dashboard .face-action-btn.face-activation-btn[aria-pressed="true"] {
    background: var(--account-glass-selected);
    border-color: rgba(0, 176, 223, .65);
    box-shadow: inset 0 0 0 1px rgba(0, 176, 223, .16);
}

.page-dashboard :is(.face-action-btn.primary, .face-action-btn.danger, #openScoreCard),
.page-analysis :is(.analysis-upload-btn, .analysis-edit-landmarks-btn,
    .landmark-editor-btn.primary, .landmark-editor-reset-all.is-selected),
.page-shop .shop-btn,
.page-analytics .analytics-page button:not(.pill-switch-option),
.page-dashboard .onboarding-modal-btn.primary {
    border-radius: var(--glass-control-radius);
}

.page-analysis :is(.analysis-upload-btn, .landmark-editor-btn.primary,
    .landmark-editor-reset-all.is-selected),
.page-shop .shop-btn,
.page-analytics .analytics-page button:not(.pill-switch-option) {
    background: var(--glass-control);
    color: var(--glass-ink);
    border-color: rgba(0, 183, 229, .55);
    box-shadow: var(--glass-control-shadow), inset 0 0 0 1px rgba(0, 183, 229, .24);
}

.page-analysis :is(.analysis-upload-btn, .landmark-editor-btn.primary,
    .landmark-editor-reset-all.is-selected):hover:not(:disabled),
.page-shop .shop-btn:hover:not(:disabled),
.page-analytics .analytics-page button:not(.pill-switch-option):hover:not(:disabled) {
    background: var(--account-glass-selected);
}

.page-profile .share-profile-btn:focus-visible,
.page-profile .ranked-photo-modal-close:focus-visible,
.page-profile .ranked-photo-trigger:focus-visible {
    outline-color: #00a9db;
}

.page-dashboard #photoDialogFields :is(input, select),
.page-dashboard .progress-photo-actions input[type="date"],
.page-settings .settings-field :is(input, textarea, select),
.page-analytics .analytics-page :is(select, input) {
    background: var(--glass-control);
    border-color: var(--glass-edge);
    border-radius: var(--glass-control-radius);
    color: var(--glass-ink);
    box-shadow: inset 0 1px 0 #fff;
}

.page-settings .settings-field input[readonly] {
    background: rgba(230, 247, 255, .4);
    color: var(--glass-muted);
    box-shadow: none;
}

/* Dashboard and photo selection. */
.page-dashboard .dashboard-notice:not(.dashboard-notice--positive),
.page-dashboard #progressChartEmpty {
    background: var(--glass-control);
    border-color: var(--glass-edge);
    color: var(--glass-muted);
    box-shadow: var(--account-glass-inset);
}

.page-dashboard .photo-item:hover,
.page-analysis .analysis-photo-item:hover,
.page-analysis .analysis-existing-photo:hover:not(:disabled) {
    background: var(--account-glass-selected);
    border-color: rgba(85, 206, 239, .65);
}

.page-dashboard .photo-item.active,
.page-analysis .analysis-photo-item.active,
.page-profile .profile-photo-thumbnail[aria-current="true"] {
    background: var(--account-glass-selected);
    border-color: #00b7e5;
    box-shadow: inset 0 0 0 1px rgba(0, 183, 229, .2), 0 3px 12px rgba(0, 169, 219, .13);
}

.page-dashboard .selected-photo-image,
.page-profile :is(.profile-main-img, .profile-main-placeholder, .profile-rated-image),
.page-score-examples .score-example-face img {
    border-color: var(--glass-edge);
    background-color: rgba(224, 245, 253, .38);
}

.page-profile :is(.profile-main-img, .profile-main-placeholder, .profile-rated-image),
.page-profile .ranked-photo-modal-media img,
.page-analysis :is(.analysis-preview img, .analysis-overlay, .landmark-editor-viewport) {
    border-radius: var(--glass-radius);
}

.page-profile :is(.profile-badges span, .social-links a) {
    color: var(--glass-muted);
}

.page-profile .progress-row { color: var(--glass-muted); }
.page-profile .profile-main-placeholder span { color: var(--glass-muted); }

/* Analysis menus and ratio rows remain in their existing top-layer geometry. */
.page-analysis :is(.analysis-category-menu, .landmark-editor-reset-menu) {
    background: linear-gradient(145deg, rgba(249, 254, 255, .94), rgba(210, 244, 255, .88));
    border-color: var(--glass-edge);
    border-radius: var(--glass-control-radius);
    color: var(--glass-ink);
    box-shadow: var(--glass-shadow);
    backdrop-filter: blur(20px) saturate(1.2);
    -webkit-backdrop-filter: blur(20px) saturate(1.2);
}

.page-analysis .analysis-category-option {
    border-bottom-color: var(--account-glass-line);
}

.page-analysis .analysis-category-option:is(:hover, [aria-selected="true"]),
.page-analysis .analysis-ratio-item:is(:hover, .is-active),
.page-analysis .landmark-editor-item:is(:hover, .is-active),
.page-analysis .landmark-editor-reset-item:hover {
    background: rgba(172, 234, 253, .42);
}

.page-analysis .analysis-ratio-item.is-active {
    box-shadow: inset 0 0 0 1px rgba(0, 169, 219, .35);
}

.page-analysis .analysis-ratio-category-count {
    background: rgba(190, 235, 251, .5);
    color: var(--glass-muted);
    border-radius: var(--glass-control-radius);
}

.page-analysis .analysis-empty {
    background: rgba(225, 247, 255, .35);
    border-color: rgba(70, 168, 208, .4);
    border-radius: var(--glass-radius);
}

.page-analysis :is(.landmark-editor-scroll-hint, .landmark-editor-footer) {
    background: var(--glass-control);
}

.page-analysis .landmark-editor-reset-item { color: var(--glass-ink); }

.page-analysis :is(.analysis-ratio-item, .landmark-editor-header, .landmark-editor-footer),
.page-analytics :is(.analytics-section, .metric-row),
.page-settings .settings-social-links,
.page-profile .profile-mobile-links:has(a),
.page-shop .shop-offer-actions,
.page-score-examples .score-examples-note {
    border-color: var(--account-glass-line);
}

/* Notifications retain the unread edge and dot, with a brighter glass row. */
.page-notifications .notifications-item {
    border-radius: var(--glass-control-radius);
    color: var(--glass-ink);
}

.page-notifications .notifications-item:hover {
    background: rgba(255, 255, 255, .42);
}

.page-notifications .notifications-item.is-unread {
    background: var(--glass-control);
    box-shadow: inset 3px 0 0 #169bd2, inset 0 1px 0 rgba(255, 255, 255, .9),
        0 4px 12px rgba(22, 115, 161, .06);
}

/* Product panels preserve prices, purchase status and featured-offer cues. */
.page-shop :is(.shop-bundle, .shop-catalog-row) {
    background: var(--glass-panel);
    border-color: var(--glass-edge);
    box-shadow: var(--account-glass-inset);
}

.page-shop :is(.shop-bundle, .shop-catalog-featured) {
    border-color: rgba(0, 183, 229, .72);
    box-shadow: inset 0 1px 0 #fff, 0 5px 18px rgba(0, 165, 218, .12);
}

.page-shop .shop-catalog-row:hover {
    background: var(--account-glass-selected);
}

.page-shop .shop-feature-list li { color: var(--glass-ink); }
.page-shop .shop-balance { color: var(--glass-muted); }

/* Modal chrome uses a denser frost so copy stays legible above busy photos.
   The photo/editor canvases and generated share-card preview are untouched. */
.page-dashboard :is(.photo-action-dialog, .score-card-dialog, .onboarding-modal, .upload-editor-panel),
.page-profile .ranked-photo-modal,
.page-analysis :is(.analysis-existing-dialog, .landmark-editor-dialog, .ratio-unlock-dialog) {
    background: linear-gradient(145deg, rgba(249, 254, 255, .96), rgba(211, 243, 254, .92));
    border-color: var(--glass-edge);
    border-radius: var(--glass-radius);
    color: var(--glass-ink);
    box-shadow: 0 22px 65px rgba(9, 74, 112, .25), inset 0 1px 0 #fff;
    backdrop-filter: blur(24px) saturate(1.2);
    -webkit-backdrop-filter: blur(24px) saturate(1.2);
}

@media (min-width: 851px) {
    .page-profile .profile-card > .profile-hero-card {
        background: none;
        border: 0;
        border-radius: 0;
        box-shadow: none;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
}

@media (min-width: 601px) and (max-width: 850px) {
    .page-profile .profile-hero-card { border-radius: var(--glass-radius); }
}

@media (max-width: 600px) {
    .page-shop.page-shop-detail .shop-detail-card {
        --surface-radius: 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .page-shop-detail .shop-offer-actions > a {
        background: var(--glass-control);
        border-color: var(--glass-edge);
        border-radius: var(--glass-control-radius);
        color: var(--glass-ink);
        box-shadow: var(--account-glass-inset);
    }
}