/* Owner 04.11: every glass surface uses the actual Milana widget material.
   Layout, semantic states and input behavior belong to the existing components. */
body.cmp-body,
body.cmp-body .cmp-chroma-stage ~ .cmp-app {
    --cmp-panel: var(--cmp-black-glass-bg);
    --cmp-side: var(--cmp-black-glass-bg);
}
body.cmp-body .cmp-guest {
    --cmp-g-card: var(--cmp-black-glass-bg);
    --cmp-g-card-soft: rgba(0, 0, 0, .5);
}

body.cmp-body :is(
    .cmp-board__intro, .cmp-docs-head, .cmp-files-head, .cmp-disc-head, .cmp-notify-head, .cmp-guest-admin-head, .cmp-search > header,
    .cmp-card, .cmp-rows, .cmp-dialog, .cmp-toast, .cmp-authcard,
    .cmp-side, .cmp-rail, .cmp-ctx, .cmp-top, .cmp-tabbar, .cmp-pagehead,
    .cmp-pcard, .cmp-board__card, .cmp-p3-stagefold,
    .cmp-p3-action-menu__items, .cmp-docs-more__list,
    .cmp-disc-sidebar, .cmp-disc-actions-menu > .cmp-disc-actions,
    .cmp-fileviewer-header, .cmp-fileviewer-toolbar,
    .cmp-guest__header, .cmp-guest__welcome-card, .cmp-guest__thread-card,
    .cmp-guest__thread-header-card, .cmp-guest__composer,
    .cmp-guest__notification-card
) {
    background: var(--cmp-black-glass-bg);
    background-image: none;
    border-color: var(--cmp-black-glass-line);
    box-shadow: var(--cmp-black-glass-shadow);
    backdrop-filter: blur(var(--cmp-black-glass-blur));
    -webkit-backdrop-filter: blur(var(--cmp-black-glass-blur));
}

/* Standalone feedback must be readable over the moving background too. */
body.cmp-body .cmp-pform__form > .cmp-formfoot {
    margin-top: 0;
    padding: 16px;
    border: 1px solid var(--cmp-black-glass-line);
    border-radius: var(--cmp-radius);
    background: var(--cmp-black-glass-bg);
    backdrop-filter: blur(var(--cmp-black-glass-blur));
    -webkit-backdrop-filter: blur(var(--cmp-black-glass-blur));
}
body.cmp-body :is(.cmp-files-screen, .cmp-docs-screen, .cmp-discussions, .cmp-notifications, .cmp-search)
    > :is(.cmp-files-status, .cmp-docs-status, .cmp-disc-status, .cmp-notify-status, .cmp-search-status):not(:empty) {
    margin: 0;
    padding: 12px 16px;
    border: 1px solid var(--cmp-black-glass-line);
    border-radius: 12px;
    background: var(--cmp-black-glass-bg);
    backdrop-filter: blur(var(--cmp-black-glass-blur));
    -webkit-backdrop-filter: blur(var(--cmp-black-glass-blur));
    color: var(--cmp-text);
    line-height: 1.6;
}

/* Keep text legible where screen headers sit directly over the animated field. */
body.cmp-body :is(.cmp-board__intro, .cmp-docs-head, .cmp-files-head, .cmp-disc-head, .cmp-notify-head, .cmp-guest-admin-head, .cmp-search > header, .cmp-pagehead) {
    min-width: 0;
    padding: clamp(12px, 2vw, 20px);
    border: 1px solid var(--cmp-black-glass-line);
    border-radius: var(--cmp-radius);
    overflow-wrap: anywhere;
}
/* Framed generic headers use the outer border, not another inset divider. */
body.cmp-body .cmp-pagehead > .cmp-pagehead__row {
    padding-bottom: 0;
    border-bottom: 0;
}
/* Use one glass layer around grouped content, without multiplying the tint. */
body.cmp-body :is(.cmp-card, .cmp-dialog) .cmp-card,
body.cmp-body .cmp-p3-stagefold .cmp-wf-block {
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
body.cmp-body :is(.cmp-pcard__footer, .cmp-board__footer) {
    background: rgba(0, 0, 0, .18);
}
body.cmp-body .cmp-p3-stagefold { border-radius: var(--cmp-radius); }

/* Modal hit areas remain active without adding another dark veil. */
body.cmp-body .cmp-dialog::backdrop,
body.cmp-body dialog.cmp-fileviewer-dialog::backdrop {
    background: transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    body.cmp-body :is(
        .cmp-board__intro, .cmp-docs-head, .cmp-files-head, .cmp-disc-head, .cmp-notify-head, .cmp-guest-admin-head, .cmp-search > header,
        .cmp-card, .cmp-rows, .cmp-dialog, .cmp-toast, .cmp-authcard,
        .cmp-side, .cmp-rail, .cmp-ctx, .cmp-top, .cmp-tabbar, .cmp-pagehead,
        .cmp-pcard, .cmp-board__card, .cmp-p3-stagefold,
        .cmp-p3-action-menu__items, .cmp-docs-more__list,
        .cmp-disc-sidebar, .cmp-disc-actions-menu > .cmp-disc-actions,
        .cmp-fileviewer-header, .cmp-fileviewer-toolbar,
        .cmp-guest__header, .cmp-guest__welcome-card, .cmp-guest__thread-card,
        .cmp-guest__thread-header-card, .cmp-guest__composer,
        .cmp-guest__notification-card
    ) { background: rgba(0, 0, 0, .96); }
}


/* One coherent top plate: title, navigation and its controls share the same material/insets. */
body.cmp-body .cmp-card.cmp-page-intro {
    display: grid;
    gap: 16px;
    min-width: 0;
    padding: clamp(12px, 2vw, 20px);
    margin: 0 0 20px;
    border: 1px solid var(--cmp-black-glass-line);
    border-radius: var(--cmp-radius);
    overflow: visible;
    background: var(--cmp-black-glass-bg);
    box-shadow: var(--cmp-black-glass-shadow);
    backdrop-filter: blur(var(--cmp-black-glass-blur));
    -webkit-backdrop-filter: blur(var(--cmp-black-glass-blur));
}
body.cmp-body .cmp-page-intro > :is(.cmp-pagehead, header) {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
body.cmp-body .cmp-page-intro > :is(
    .cmp-p3-toolbar, .cmp-u-toolbar, .cmp-p4-toolbar, .cmp-vs-toolbar,
    .cmp-search-toolbar, .cmp-search-scope, .cmp-search-status,
    .cmp-notify-filters, .cmp-notify-controls, .cmp-notify-status,
    .cmp-guest-admin-status, .cmp-vs-actions, .cmp-vs-note, .cmp-back
) { min-width: 0; margin: 0; }
body.cmp-body .cmp-page-intro > :is(.cmp-vs-alerts, .cmp-vs-actions):empty { display: none; }
@media (max-width: 767px) {
    body.cmp-body .cmp-card.cmp-page-intro { gap: 12px; border-radius: 14px; }
}