/* Mana branding: one background for the app, portal and sign-in.
   Images stay behind solid reading surfaces; explicit themes win over the OS. */
:root {
    --mana-background: url('/assets/images/08cc9f3c75bc.svg?v=2');
    --mana-background-overlay: rgba(248, 250, 252, .48);
    --mana-brand-line: rgba(0, 85, 255, .24);
}
[data-theme="dark"] {
    --mana-background: url('/assets/images/0797054afdc6.svg');
    --mana-background-overlay: rgba(15, 17, 23, .40);
    --mana-brand-line: rgba(71, 131, 255, .36);
}
@media (prefers-color-scheme: dark) {
    :root:not([data-theme]) {
        --mana-background: url('/assets/images/0797054afdc6.svg');
        --mana-background-overlay: rgba(15, 17, 23, .40);
    }
}
body, [data-theme] body {
    background-color: var(--bg-primary);
    background-image: linear-gradient(var(--mana-background-overlay), var(--mana-background-overlay)), var(--mana-background);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
}
/* Menus, forms and long text retain the shared opaque theme surfaces. */
#main-content, .kp-main { background: transparent; }
.header-wrapper, .kp-body .kp-topbar {
    background: var(--bg-secondary);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    box-shadow: inset 0 -2px var(--mana-brand-line);
}
.kp-body .kp-brand { box-shadow: inset 0 -2px var(--mana-brand-line); }
.logo-icon, .kp-brand-logo {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    background: var(--bg-secondary);
    box-shadow: 0 0 0 1px var(--border-color);
}
/* The source image has generous transparent margins. Crop those margins,
   keeping the complete mark inside the existing header dimensions. */
.logo-icon img, .kp-brand-logo img {
    width: 140%;
    height: 140%;
    max-width: none;
    object-fit: contain;
    flex-shrink: 0;
}
.kp-mobile-brand { display: none; }
@media (max-width: 768px) {
    :root { --mana-background-overlay: rgba(248, 250, 252, .64); }
    [data-theme="dark"] { --mana-background-overlay: rgba(15, 17, 23, .58); }
    @media (prefers-color-scheme: dark) {
        :root:not([data-theme]) { --mana-background-overlay: rgba(15, 17, 23, .58); }
    }
    body, [data-theme] body { background-attachment: scroll; background-size: auto 100vh; background-position: center top; }
    .kp-mobile-brand {
        display: inline-flex;
        align-items: center;
        gap: .5rem;
        color: var(--text-primary);
        font-size: 1rem;
        font-weight: 700;
        text-decoration: none;
        white-space: nowrap;
        min-height: 44px;
    }
    .kp-mobile-brand .kp-brand-logo { width: 32px; height: 32px; }
    .kp-header-heading .kp-topbar-title { display: none; }
}
@media (max-width: 380px) {
    .kp-mobile-brand > span:last-child { display: none; }
}
@media (prefers-contrast: more) {
    body { background-image: none !important; }
    .header-wrapper, .kp-body .kp-topbar { box-shadow: none; }
}
@media print {
    body { background-image: none !important; background-color: white !important; }
    .logo-icon, .kp-brand-logo { box-shadow: none; }
}
