h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

/* ══════════════════════════════════════════════════════════
   GLOBAL BASE
══════════════════════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; }

body {
    margin: 0;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans Arabic", sans-serif;
    font-size: 1rem;
    line-height: 1.5;
    color: var(--pms-fg);
    background: var(--pms-bg);
    overflow-x: hidden;
}

a { color: var(--pms-accent); text-decoration: none; }
a:hover { text-decoration: underline; }

/* ══════════════════════════════════════════════════════════
   SHELL LAYOUT  (topbar + sidebar + content)
══════════════════════════════════════════════════════════ */
.pms-shell {
    display: grid;
    grid-template-columns: var(--pms-sidebar-w, 260px) minmax(0, 1fr);
    grid-template-rows: var(--pms-topbar-h, 52px) minmax(0, 1fr);
    grid-template-areas: "topbar topbar" "sidebar content";
    min-height: 100vh;
    width: 100%;
    transition: grid-template-columns var(--pms-duration-ui, 180ms) var(--pms-ease-out, cubic-bezier(0.23, 1, 0.32, 1));
}
.pms-shell--collapsed {
    grid-template-columns: var(--pms-sidebar-w-collapsed, 56px) minmax(0, 1fr);
}

/* Top bar */
.pms-topbar {
    grid-area: topbar;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0 1rem;
    height: var(--pms-topbar-h, 52px);
    min-height: var(--pms-topbar-h, 52px);
    background: var(--pms-bg-alt);
    border-bottom: 1px solid var(--pms-border);
    position: sticky;
    top: 0;
    z-index: 200;
}
.pms-topbar-toggle {
    flex-shrink: 0;
    background: none;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.375rem;
    color: var(--pms-fg-muted);
    border-radius: 4px;
    transition:
        background-color 140ms cubic-bezier(0.23, 1, 0.32, 1),
        color 140ms cubic-bezier(0.23, 1, 0.32, 1);
}
.pms-topbar-toggle:hover { background: var(--pms-border); color: var(--pms-fg); }
.pms-topbar-title {
    font-weight: 700;
    font-size: 1.0625rem;
    color: var(--pms-accent);
    letter-spacing: -0.01em;
}
.pms-topbar-end {
    margin-inline-start: auto;
    display: flex;
    align-items: center;
    gap: 0.625rem;
}
.pms-topbar-btn {
    background: none;
    border: 1px solid var(--pms-border);
    border-radius: 6px;
    cursor: pointer;
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    color: var(--pms-fg);
    line-height: 1.4;
    transition: background-color 140ms cubic-bezier(0.23, 1, 0.32, 1);
}
.pms-topbar-btn:hover { background: var(--pms-border); }
.pms-lang-switcher {
    display: flex;
    gap: 0.125rem;
    font-size: 0.8125rem;
    font-weight: 500;
}
.pms-lang-switcher a {
    padding: 0.2rem 0.45rem;
    border-radius: 4px;
    color: var(--pms-fg-muted);
    border: 1px solid transparent;
}
.pms-lang-switcher a:hover { border-color: var(--pms-border); color: var(--pms-fg); text-decoration: none; }

/* Sidebar */
.pms-sidebar {
    grid-area: sidebar;
    display: flex;
    flex-direction: column;
    width: var(--pms-sidebar-w, 260px);
    max-width: var(--pms-sidebar-w, 260px);
    height: calc(100vh - var(--pms-topbar-h, 52px));
    position: sticky;
    top: var(--pms-topbar-h, 52px);
    overflow-y: auto;
    overflow-x: hidden;
    background: var(--pms-bg-alt);
    border-inline-end: 1px solid var(--pms-border);
    padding: 0;
}
.pms-sidebar::-webkit-scrollbar { width: 4px; }
.pms-sidebar::-webkit-scrollbar-thumb { background: var(--pms-border); border-radius: 2px; }

/* Brand header (top section of the 3-section sidebar) */
.pms-brand {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.875rem 0.875rem;
    border-bottom: 1px solid var(--pms-border);
    flex-shrink: 0;
}
.pms-brand-badge {
    flex-shrink: 0;
    width: 2rem;
    height: 2rem;
    border-radius: 8px;
    background: var(--pms-accent);
    color: var(--pms-accent-fg);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}
.pms-brand-name {
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--pms-fg);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* Atlas logo mark — sized by its badge container (topbar, sidebar, auth hero). */
.pms-logo-mark {
    display: block;
    width: 70%;
    height: 70%;
}

/* Scrollable nav body (middle section) */
.pms-navlist {
    flex: 1;
    overflow-y: auto;
    padding: 0.5rem 0;
}

/* Main content */
.pms-main {
    grid-area: content;
    padding: 1.25rem 1.5rem;
    min-width: 0;
    overflow-x: auto;
}

/* RTL: mirror sidebar to the right */
html[dir="rtl"] .pms-shell {
    grid-template-columns: var(--pms-sidebar-w, 260px) minmax(0, 1fr);
    grid-template-areas: "topbar topbar" "sidebar content";
}
html[dir="rtl"] .pms-shell--collapsed {
    grid-template-columns: var(--pms-sidebar-w-collapsed, 56px) minmax(0, 1fr);
}
html[dir="rtl"] .pms-sidebar {
    border-inline-end: none;
    border-inline-start: 1px solid var(--pms-border);
}

/* ══════════════════════════════════════════════════════════
   SIDEBAR NAV ITEMS
══════════════════════════════════════════════════════════ */
.pms-nav-item {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.45rem 0.75rem;
    margin: 1px 0.375rem;
    border-radius: 6px;
    font-size: 0.875rem;
    color: var(--pms-fg);
    text-decoration: none;
    transition:
        background-color 140ms cubic-bezier(0.23, 1, 0.32, 1),
        color 140ms cubic-bezier(0.23, 1, 0.32, 1);
    white-space: nowrap;
    overflow: hidden;
    cursor: pointer;
}
.pms-nav-item:hover {
    background: color-mix(in srgb, var(--pms-accent) 10%, transparent);
    color: var(--pms-accent);
    text-decoration: none;
}
.pms-nav-item.active {
    background: color-mix(in srgb, var(--pms-accent) 15%, transparent);
    color: var(--pms-accent);
    font-weight: 600;
}
.pms-nav-item--danger:hover {
    color: var(--pms-danger);
    background: color-mix(in srgb, var(--pms-danger) 10%, transparent);
}
.pms-nav-icon {
    font-size: 1rem;
    flex-shrink: 0;
    width: 1.25rem;
    text-align: center;
    line-height: 1;
}
.pms-nav-label {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* Collapsible group toggle button (replaces the old always-expanded group-label divider) */
.pms-nav-group-toggle {
    display: flex;
    align-items: center;
    width: calc(100% - 0.75rem);
    gap: 0.5rem;
    margin: 0.5rem 0.375rem 1px;
    padding: 0.45rem 0.75rem;
    border: none;
    border-radius: 6px;
    background: none;
    font: inherit;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--pms-fg-muted);
    cursor: pointer;
    white-space: nowrap;
}
.pms-nav-group-toggle:hover {
    background: color-mix(in srgb, var(--pms-accent) 8%, transparent);
    color: var(--pms-fg);
}
.pms-nav-group-label-text {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: start;
}
.pms-nav-chevron {
    flex-shrink: 0;
    font-size: 0.625rem;
    transition: transform 140ms cubic-bezier(0.23, 1, 0.32, 1);
}
.pms-nav-chevron--collapsed {
    transform: rotate(-90deg);
}
html[dir="rtl"] .pms-nav-chevron--collapsed {
    transform: rotate(90deg);
}
.pms-subnav {
    display: flex;
    flex-direction: column;
    gap: 1px;
    padding-bottom: 0.25rem;
}
.pms-nav-group-toggle[aria-expanded="false"] + .pms-subnav {
    display: none;
}
.pms-subnav .pms-nav-item {
    margin-inline-start: 0.875rem;
}
.pms-subnav-label {
    padding-block: 0.5rem 0.125rem;
    padding-inline: 1.375rem 0.75rem;
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--pms-fg-muted);
    white-space: nowrap;
    overflow: hidden;
}

/* Collapsed sidebar (icon-only rail) */
.pms-shell--collapsed .pms-sidebar {
    width: var(--pms-sidebar-w-collapsed, 56px);
    max-width: var(--pms-sidebar-w-collapsed, 56px);
}
.pms-shell--collapsed .pms-nav-label,
.pms-shell--collapsed .pms-brand-name,
.pms-shell--collapsed .pms-nav-who,
.pms-shell--collapsed .pms-nav-group-label-text,
.pms-shell--collapsed .pms-nav-chevron,
.pms-shell--collapsed .pms-subnav-label { display: none; }
.pms-shell--collapsed .pms-subnav { padding-inline-start: 0; }
.pms-shell--collapsed .pms-subnav .pms-nav-item { margin-inline-start: 0.25rem; }
.pms-shell--collapsed .pms-nav-group-toggle {
    justify-content: center;
    padding: 0.5rem;
    margin: 0.5rem 0.25rem 1px;
    width: calc(100% - 0.5rem);
}
.pms-shell--collapsed .pms-nav-item {
    justify-content: center;
    margin: 1px 0.25rem;
    padding: 0.5rem;
}

/* Bottom-pinned strip: signed-in user, change password, logout (bottom section) */
.pms-nav-bottom {
    flex-shrink: 0;
    padding: 0.5rem 0;
    border-top: 1px solid var(--pms-border);
}
.pms-nav-who {
    padding: 0.375rem 1.125rem 0.25rem;
    font-size: 0.75rem;
    color: var(--pms-fg-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.pms-topbar-user {
    font-size: 0.8125rem;
    color: var(--pms-fg-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 12rem;
}

#blazor-error-ui {
    display: none;
    position: fixed;
    inset-inline: 0;
    bottom: 0;
    z-index: 1000;
    padding: 0.75rem 1rem;
    background: #fff9c4;
    color: #1f2937;
    box-shadow: 0 -1px 3px rgba(15, 23, 42, 0.16);
}
#blazor-error-ui .reload {
    margin-inline-start: 0.25rem;
}
#blazor-error-ui .dismiss {
    position: absolute;
    inset-inline-end: 0.75rem;
    cursor: pointer;
}

/* ══════════════════════════════════════════════════════════
   AUTH PAGES (login / forgot password / reset password)

   Split layout: a branded hero rail on the inline-start side and
   a quiet form column on the other. Everything is driven by the
   shared --pms-* palette so both themes stay in sync; the hero is
   intentionally always dark, so its text uses fixed light values.
══════════════════════════════════════════════════════════ */
.pms-shell--login {
    display: block;
    min-height: 100vh;
}
/* Double class: the shared .pms-main padding/background is redefined further down
   this sheet, and the auth pages must stay edge-to-edge regardless of order. */
.pms-main.pms-main--login {
    min-height: 100vh;
    max-width: none;
    padding: 0;
    overflow: auto;
    background: var(--pms-bg);
}
.pms-auth {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
    min-height: 100vh;
    width: 100%;
    color: var(--pms-fg);
}

/* ── Hero rail ─────────────────────────────────────────── */
.pms-auth-hero {
    --hero-ink: #f4f7ff;
    --hero-ink-muted: color-mix(in srgb, #f4f7ff 68%, transparent);
    position: relative;
    display: flex;
    align-items: center;
    isolation: isolate;
    overflow: hidden;
    padding: clamp(2rem, 4vw, 3.5rem);
    color: var(--hero-ink);
    background:
        radial-gradient(118% 92% at 12% 8%,
            color-mix(in srgb, var(--pms-accent) 88%, #0b1533) 0%,
            transparent 58%),
        radial-gradient(96% 84% at 96% 94%,
            color-mix(in srgb, #0f766e 58%, #0b1533) 0%,
            transparent 62%),
        linear-gradient(155deg,
            color-mix(in srgb, var(--pms-accent) 42%, #0a1226) 0%,
            #0b122c 46%,
            color-mix(in srgb, #854d0e 16%, #080d1c) 100%),
        #0a1226;
}
.pms-auth-hero-art {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        url("img/login-abstract-art.png") center / cover no-repeat;
    opacity: 0.34;
    mix-blend-mode: soft-light;
    pointer-events: none;
}
html[dir="rtl"] .pms-auth-hero-art {
    transform: scaleX(-1);
}
html[data-theme="dark"] .pms-auth-hero {
    background:
        radial-gradient(118% 92% at 12% 8%,
            color-mix(in srgb, var(--pms-accent) 46%, #070c18) 0%,
            transparent 58%),
        radial-gradient(96% 84% at 96% 94%,
            color-mix(in srgb, #0f766e 40%, #070c18) 0%,
            transparent 62%),
        linear-gradient(155deg, #101a33 0%, #0a1020 52%, #080c17 100%),
        #080c17;
}
html[data-theme="dark"] .pms-auth-hero-art {
    opacity: 0.22;
}
.pms-auth-hero-inner {
    display: flex;
    flex-direction: column;
    gap: clamp(1.75rem, 4vh, 3rem);
    width: 100%;
    max-width: 32rem;
    margin-inline: auto;
}
.pms-auth-hero-copy {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}
.pms-auth-eyebrow {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    gap: 0.4rem;
    padding: 0.3rem 0.7rem;
    border: 1px solid color-mix(in srgb, var(--hero-ink) 22%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, var(--hero-ink) 10%, transparent);
    color: var(--hero-ink);
    font-size: 0.75rem;
    font-weight: 650;
    letter-spacing: 0.02em;
}
.pms-auth-hero-title {
    margin: 0;
    color: var(--hero-ink);
    font-size: clamp(1.85rem, 3.2vw, 2.6rem);
    font-weight: 750;
    line-height: 1.12;
    letter-spacing: -0.02em;
    text-wrap: balance;
}
.pms-auth-hero-copy p:not(.pms-auth-hero-title) {
    margin: 0;
    max-width: 34ch;
    color: var(--hero-ink-muted);
    font-size: 1rem;
    line-height: 1.6;
}
.pms-auth-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin: 0;
    padding: 0;
    list-style: none;
}
.pms-auth-chips li {
    padding: 0.35rem 0.75rem;
    border: 1px solid color-mix(in srgb, var(--hero-ink) 16%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, var(--hero-ink) 8%, transparent);
    color: var(--hero-ink-muted);
    font-size: 0.8125rem;
    font-weight: 600;
    white-space: nowrap;
}

/* ── Brand lockup (shared by hero + compact topbar) ────── */
.pms-auth-brand {
    display: inline-flex;
    align-items: center;
    min-width: 0;
    gap: 0.7rem;
}
.pms-auth-brand-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.4rem;
    height: 2.4rem;
    flex: 0 0 2.4rem;
    border-radius: 10px;
    background: color-mix(in srgb, #ffffff 16%, transparent);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, #ffffff 22%, transparent);
    color: #ffffff;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.04em;
}
.pms-auth-brand-text {
    display: flex;
    flex-direction: column;
    min-width: 0;
    line-height: 1.25;
}
.pms-auth-brand-text strong,
.pms-auth-brand-text small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.pms-auth-brand-text strong {
    font-size: 0.95rem;
    font-weight: 700;
}
.pms-auth-brand-text small {
    color: color-mix(in srgb, currentColor 62%, transparent);
    font-size: 0.78rem;
}
.pms-auth-brand--compact {
    display: none;
    color: var(--pms-fg);
}
.pms-auth-brand--compact .pms-auth-brand-mark {
    background: var(--pms-accent);
    box-shadow: none;
    color: var(--pms-accent-fg);
}

/* ── Form column ───────────────────────────────────────── */
.pms-auth-panel {
    display: grid;
    grid-template-rows: auto 1fr auto;
    grid-template-columns: minmax(0, 1fr);
    min-width: 0;
    padding: clamp(1rem, 2.5vw, 2rem);
    background: var(--pms-bg);
}
.pms-auth-topbar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem;
    min-width: 0;
}
.pms-auth-tools {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    gap: 0.4rem;
}
.pms-auth-lang {
    display: inline-flex;
    align-items: center;
    gap: 0.125rem;
    padding: 0.15rem;
    border: 1px solid var(--pms-border);
    border-radius: 9px;
    background: var(--pms-bg-alt);
}
.pms-auth-lang a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.15rem;
    min-height: 1.8rem;
    padding-inline: 0.45rem;
    border-radius: 6px;
    color: var(--pms-fg-muted);
    font-size: 0.75rem;
    font-weight: 700;
    text-decoration: none;
    transition:
        background-color var(--pms-duration-fast, 140ms) var(--pms-ease-out, ease),
        color var(--pms-duration-fast, 140ms) var(--pms-ease-out, ease);
}
.pms-auth-lang a.is-active {
    background: var(--pms-bg);
    box-shadow: var(--pms-shadow-sm);
    color: var(--pms-fg);
}
.pms-auth-theme {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.15rem;
    height: 2.15rem;
    border: 1px solid var(--pms-border);
    border-radius: 9px;
    background: var(--pms-bg-alt);
    color: var(--pms-fg-muted);
    cursor: pointer;
    transition:
        background-color var(--pms-duration-fast, 140ms) var(--pms-ease-out, ease),
        color var(--pms-duration-fast, 140ms) var(--pms-ease-out, ease),
        transform 140ms var(--pms-ease-out, ease);
}
.pms-auth-theme:active {
    transform: scale(0.94);
}
.pms-auth-theme-sun { display: none; }
html[data-theme="dark"] .pms-auth-theme-sun { display: block; }
html[data-theme="dark"] .pms-auth-theme-moon { display: none; }

/* Flex, not grid: a grid column sizes to the card's max-content width, which drifts
   off-centre whenever a page ships a longer subtitle than the login page does. */
.pms-auth-stage {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    padding-block: clamp(1.5rem, 5vh, 3rem);
}
.pms-auth-card {
    width: 100%;
    max-width: 24rem;
    animation: pms-auth-rise 320ms var(--pms-ease-out, cubic-bezier(0.23, 1, 0.32, 1)) both;
}
.pms-auth-card-head {
    margin-bottom: 1.4rem;
}
.pms-auth-card-head h1 {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.015em;
}
.pms-auth-card-head p {
    margin: 0.4rem 0 0;
    color: var(--pms-fg-muted);
    font-size: 0.9rem;
    line-height: 1.5;
}
.pms-auth-foot {
    display: flex;
    justify-content: center;
    color: var(--pms-fg-muted);
    font-size: 0.75rem;
}

/* ── Form ──────────────────────────────────────────────── */
.pms-auth-form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.pms-auth-field {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    min-width: 0;
}
.pms-auth-label {
    color: var(--pms-fg);
    font-size: 0.8125rem;
    font-weight: 600;
}
.pms-auth-control {
    position: relative;
    display: flex;
    align-items: center;
    min-width: 0;
}
.pms-auth-control-icon {
    position: absolute;
    inset-inline-start: 0.8rem;
    color: var(--pms-fg-muted);
    pointer-events: none;
    transition: color var(--pms-duration-fast, 140ms) var(--pms-ease-out, ease);
}
.pms-auth-control:focus-within .pms-auth-control-icon {
    color: var(--pms-accent);
}
.pms-auth-input {
    width: 100%;
    min-height: 2.75rem;
    padding-block: 0.6rem;
    padding-inline: 2.5rem 0.85rem;
    border: 1px solid var(--pms-border);
    border-radius: var(--pms-radius-control, 8px);
    background: var(--pms-bg-alt);
    color: var(--pms-fg);
    font: inherit;
    font-size: 0.9375rem;
    transition:
        border-color var(--pms-duration-fast, 140ms) var(--pms-ease-out, ease),
        box-shadow var(--pms-duration-fast, 140ms) var(--pms-ease-out, ease),
        background-color var(--pms-duration-fast, 140ms) var(--pms-ease-out, ease);
}
.pms-auth-input--reveal {
    padding-inline-end: 2.75rem;
}
.pms-auth-input::placeholder {
    color: color-mix(in srgb, var(--pms-fg-muted) 64%, transparent);
}
.pms-auth-input:hover:not(:focus) {
    border-color: var(--pms-border-strong);
}
.pms-auth-input:focus {
    outline: none;
    border-color: var(--pms-accent);
    background: var(--pms-bg);
    box-shadow: 0 0 0 3px var(--pms-focus-ring);
}
.pms-auth-input.invalid,
.pms-auth-input.modified.invalid {
    border-color: var(--pms-danger);
}
.pms-auth-reveal {
    position: absolute;
    inset-inline-end: 0.35rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border: none;
    border-radius: 6px;
    background: transparent;
    color: var(--pms-fg-muted);
    cursor: pointer;
    transition:
        background-color var(--pms-duration-fast, 140ms) var(--pms-ease-out, ease),
        color var(--pms-duration-fast, 140ms) var(--pms-ease-out, ease);
}
.pms-auth-reveal:hover {
    background: color-mix(in srgb, var(--pms-fg-muted) 12%, transparent);
    color: var(--pms-fg);
}
.pms-auth-reveal-off { display: none; }
.pms-auth-reveal[aria-pressed="true"] .pms-auth-reveal-on { display: none; }
.pms-auth-reveal[aria-pressed="true"] .pms-auth-reveal-off { display: block; }
.pms-auth-reveal[aria-pressed="true"] { color: var(--pms-accent); }

.pms-auth-hint {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    margin: 0;
    color: var(--pms-warning);
    font-size: 0.78rem;
    font-weight: 600;
}
.pms-auth-hint[hidden] {
    display: none;
}

.pms-auth-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
}
.pms-auth-check {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--pms-fg);
    cursor: pointer;
    font-size: 0.875rem;
}
.pms-auth-checkbox {
    width: 1rem;
    height: 1rem;
    flex: 0 0 auto;
    accent-color: var(--pms-accent);
    cursor: pointer;
}
.pms-auth-link {
    color: var(--pms-accent);
    font-size: 0.875rem;
    font-weight: 600;
    text-decoration: none;
}
.pms-auth-link:hover {
    text-decoration: underline;
}
.pms-auth-back {
    align-self: flex-start;
    margin-top: 0.15rem;
    color: var(--pms-fg-muted);
    font-size: 0.875rem;
    font-weight: 600;
    text-decoration: none;
}
.pms-auth-back:hover {
    color: var(--pms-accent);
    text-decoration: underline;
}
.pms-auth-submit {
    justify-content: center;
    width: 100%;
    min-height: 2.75rem;
    margin-top: 0.25rem;
    border-radius: var(--pms-radius-control, 8px);
    font-size: 0.9375rem;
    font-weight: 650;
    transition:
        transform 140ms var(--pms-ease-out, ease),
        opacity 140ms var(--pms-ease-out, ease),
        background-color 140ms var(--pms-ease-out, ease);
}
.pms-auth-submit:active {
    transform: scale(0.985);
}

/* ── Messages ──────────────────────────────────────────── */
.pms-auth-validation {
    display: none;
    list-style: none;
    margin: 0;
    padding: 0;
}
.pms-auth-validation:not(:empty),
.pms-auth-alert,
.pms-auth-status {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    margin: 0;
    padding: 0.7rem 0.8rem;
    border-radius: var(--pms-radius-control, 8px);
    font-size: 0.875rem;
    line-height: 1.45;
}
.pms-auth-validation:not(:empty),
.pms-auth-alert {
    border: 1px solid color-mix(in srgb, var(--pms-danger) 42%, transparent);
    background: color-mix(in srgb, var(--pms-danger) 9%, var(--pms-bg));
    color: var(--pms-danger);
}
.pms-auth-validation:not(:empty) {
    display: block;
}
.pms-auth-validation li + li {
    margin-top: 0.25rem;
}
.pms-auth-status {
    border: 1px solid color-mix(in srgb, var(--pms-success) 42%, transparent);
    background: color-mix(in srgb, var(--pms-success) 9%, var(--pms-bg));
    color: var(--pms-success);
}
.pms-auth-alert svg,
.pms-auth-status svg {
    flex: 0 0 auto;
    margin-top: 0.12rem;
}

@keyframes pms-auth-rise {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

/* ── Narrow viewports: hero collapses to a compact banner ─ */
@media (max-width: 1000px) {
    .pms-auth {
        grid-template-columns: minmax(0, 1fr);
    }
    .pms-auth-hero {
        display: none;
    }
    .pms-auth-brand--compact {
        display: inline-flex;
        flex: 0 1 auto;
        min-width: 0;
        margin-inline-end: auto;
        overflow: hidden;
    }
    .pms-auth-topbar {
        justify-content: space-between;
    }
}

@media (max-width: 480px) {
    .pms-auth-panel {
        padding: 0.875rem;
    }
    .pms-auth-brand--compact .pms-auth-brand-text small {
        display: none;
    }
    .pms-auth-card-head h1 {
        font-size: 1.35rem;
    }
}

/* ══════════════════════════════════════════════════════════
   DATA GRID
══════════════════════════════════════════════════════════ */
.pms-grid {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}
.pms-grid thead tr { background: var(--pms-accent); color: var(--pms-accent-fg); }
.pms-grid th {
    padding: 0.5rem 0.75rem;
    text-align: start;
    font-weight: 600;
    white-space: nowrap;
}
.pms-grid td {
    padding: 0.45rem 0.75rem;
    border-bottom: 1px solid var(--pms-border);
    vertical-align: middle;
}
.pms-grid tbody tr:nth-child(even) { background: var(--pms-bg-alt); }
.pms-grid tbody tr:hover { background: color-mix(in srgb, var(--pms-accent) 8%, transparent); }

/* Party directories */
.pms-directory-page {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.pms-directory-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-block: 0.25rem 0.5rem;
}
.pms-directory-heading {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    min-width: 0;
}
.pms-directory-heading h1 {
    margin: 0;
}
.pms-directory-heading-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    flex: 0 0 2.75rem;
    border: 1px solid var(--pms-border);
    border-radius: 8px;
    background: color-mix(in srgb, var(--pms-accent) 10%, var(--pms-bg));
    font-size: 1.35rem;
}
.pms-directory-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(5.5rem, auto));
    gap: 0.5rem;
}
.pms-directory-stats div {
    min-width: 5.5rem;
    padding: 0.5rem 0.625rem;
    border: 1px solid var(--pms-border);
    border-radius: 8px;
    background: var(--pms-bg);
}
.pms-directory-stats span {
    display: block;
    color: var(--pms-fg-muted);
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
}
.pms-directory-stats strong {
    display: block;
    margin-top: 0.125rem;
    font-size: 1.125rem;
}
.pms-party-filter {
    align-items: center;
}
.pms-party-filter .pms-party-search {
    flex: 1 1 22rem;
    min-width: 14rem;
}
.pms-party-filter .pms-party-search input {
    width: 100%;
}
.pms-switch-row {
    flex-direction: row !important;
    align-items: center;
    gap: 0.45rem !important;
    white-space: nowrap;
}
.pms-directory-table-wrap {
    width: 100%;
    overflow-x: auto;
    border: 1px solid var(--pms-border);
    border-radius: 8px;
    background: var(--pms-bg);
}
.pms-party-grid {
    min-width: 820px;
}
.pms-party-grid thead tr {
    background: var(--pms-bg-alt);
    color: var(--pms-fg-muted);
    border-bottom: 1px solid var(--pms-border);
}
.pms-party-grid th {
    font-size: 0.6875rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.pms-party-grid td {
    padding-block: 0.55rem;
}
.pms-party-name {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    min-width: 0;
}
.pms-party-name strong {
    font-size: 0.875rem;
    overflow-wrap: anywhere;
}
.pms-party-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    flex: 0 0 2rem;
    border-radius: 8px;
    background: color-mix(in srgb, var(--pms-accent) 16%, var(--pms-bg));
    color: var(--pms-accent);
    font-weight: 800;
}
.pms-muted-cell {
    color: var(--pms-fg-muted);
    font-variant-numeric: tabular-nums;
}
.pms-row-actions {
    text-align: end;
    vertical-align: middle;
    white-space: nowrap;
}
.pms-row-actions > * + * {
    margin-inline-start: 0.75rem;
}
.pms-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.5rem;
    padding: 0.125rem 0.5rem;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 700;
    white-space: nowrap;
}
.pms-chip + .pms-chip {
    margin-inline-start: 0.25rem;
}
.pms-chip-success {
    background: color-mix(in srgb, #15803d 12%, var(--pms-bg));
    border-color: color-mix(in srgb, #15803d 30%, var(--pms-border));
    color: #15803d;
}
.pms-chip-muted {
    background: var(--pms-bg-alt);
    border-color: var(--pms-border);
    color: var(--pms-fg-muted);
}
.pms-chip-info {
    background: color-mix(in srgb, #0369a1 12%, var(--pms-bg));
    border-color: color-mix(in srgb, #0369a1 30%, var(--pms-border));
    color: #0369a1;
}
.pms-chip-neutral {
    background: color-mix(in srgb, #854d0e 12%, var(--pms-bg));
    border-color: color-mix(in srgb, #854d0e 28%, var(--pms-border));
    color: #854d0e;
}
html[data-theme="dark"] .pms-chip-success { color: #86efac; }
html[data-theme="dark"] .pms-chip-info { color: #7dd3fc; }
html[data-theme="dark"] .pms-chip-neutral { color: #facc15; }

/* ══════════════════════════════════════════════════════════
   FORMS
══════════════════════════════════════════════════════════ */
.pms-form {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 1rem 1.5rem;
    margin-bottom: 1.5rem;
}
.pms-form label {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--pms-fg-muted);
}
.pms-form label input,
.pms-form label select,
.pms-form label textarea {
    font-size: 0.9375rem;
    font-family: inherit;
    color: var(--pms-fg);
    background: var(--pms-bg);
    border: 1px solid var(--pms-border);
    border-radius: 6px;
    padding: 0.375rem 0.625rem;
    transition:
        border-color 140ms cubic-bezier(0.23, 1, 0.32, 1),
        box-shadow 140ms cubic-bezier(0.23, 1, 0.32, 1);
}
.pms-form label input:focus,
.pms-form label select:focus,
.pms-form label textarea:focus {
    outline: none;
    border-color: var(--pms-accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--pms-accent) 20%, transparent);
}
.pms-date-input.e-control-wrapper.e-input-group {
    width: 100%;
    min-height: 2.25rem;
    color: var(--pms-fg);
    background: var(--pms-bg);
    border: 1px solid var(--pms-border);
    border-radius: 6px;
    box-shadow: none;
}
.pms-date-input.e-control-wrapper.e-input-group input.e-input {
    min-height: 2.125rem;
    padding: 0.375rem 0.625rem;
    color: var(--pms-fg);
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    direction: ltr;
}
.pms-date-input.e-control-wrapper.e-input-group .e-input-group-icon {
    color: var(--pms-fg-muted);
}
.pms-date-input.e-control-wrapper.e-input-group.e-input-focus {
    border-color: var(--pms-accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--pms-accent) 20%, transparent);
}
.pms-date-input.e-control-wrapper.e-input-group.e-disabled {
    opacity: 0.65;
}
.pms-form label textarea { resize: vertical; min-height: 5rem; }
.pms-form-wide {
    grid-column: 1 / -1;
}
.pms-field-hint {
    color: var(--pms-fg-muted);
    font-size: 0.75rem;
}
.pms-editor-page {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    max-width: 1180px;
}
.pms-editor-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}
.pms-editor-header h1 {
    margin: 0;
}
.pms-editor-card {
    border: 1px solid var(--pms-border);
    border-radius: 8px;
    background: var(--pms-bg);
    padding: 1rem;
}
.pms-editor-form {
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    margin-bottom: 0;
}
.pms-form-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--pms-border);
}

/* Filter panel */
.pms-filter-panel {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 0.75rem 1rem;
    padding: 0.75rem 1rem;
    background: var(--pms-bg-alt);
    border: 1px solid var(--pms-border);
    border-radius: 8px;
    margin-bottom: 1rem;
}
.pms-filter-panel label {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--pms-fg-muted);
}
.pms-filter-panel input:not([type="checkbox"]) {
    font-size: 0.875rem;
    font-family: inherit;
    color: var(--pms-fg);
    background: var(--pms-bg);
    border: 1px solid var(--pms-border);
    border-radius: 6px;
    padding: 0.3125rem 0.5rem;
}
.pms-filter-panel input:not([type="checkbox"]):focus {
    outline: none;
    border-color: var(--pms-accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--pms-accent) 20%, transparent);
}
.pms-filter-panel .pms-date-input.e-control-wrapper.e-input-group {
    min-width: 10rem;
}

/* Error list */
.pms-errors {
    list-style: none;
    margin: 0 0 1rem;
    padding: 0.75rem 1rem;
    background: color-mix(in srgb, var(--pms-danger) 10%, var(--pms-bg));
    border: 1px solid var(--pms-danger);
    border-radius: 6px;
    font-size: 0.875rem;
    color: var(--pms-danger);
}

/* ══════════════════════════════════════════════════════════
   BUTTONS
══════════════════════════════════════════════════════════ */
.pms-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.375rem 0.875rem;
    font-size: 0.875rem;
    font-weight: 500;
    font-family: inherit;
    border-radius: 6px;
    border: 1px solid transparent;
    cursor: pointer;
    text-decoration: none;
    transition:
        opacity 140ms cubic-bezier(0.23, 1, 0.32, 1),
        background-color 140ms cubic-bezier(0.23, 1, 0.32, 1),
        box-shadow 140ms cubic-bezier(0.23, 1, 0.32, 1);
    white-space: nowrap;
    line-height: 1.4;
    vertical-align: middle;
}
.pms-btn:disabled { opacity: 0.5; cursor: not-allowed; }
.pms-btn:hover { text-decoration: none; }
.pms-btn-primary { background: var(--pms-accent); color: var(--pms-accent-fg); border-color: var(--pms-accent); }
.pms-btn-primary:hover:not(:disabled) { opacity: 0.88; }
.pms-btn-secondary { background: transparent; color: var(--pms-accent); border-color: var(--pms-accent); }
.pms-btn-secondary:hover:not(:disabled) { background: color-mix(in srgb, var(--pms-accent) 10%, transparent); }
.pms-btn-danger { background: var(--pms-danger); color: #fff; border-color: var(--pms-danger); }
.pms-btn-danger:hover:not(:disabled) { opacity: 0.88; }
.pms-btn-success { background: #15803d; color: #fff; border-color: #15803d; }
.pms-btn-success:hover:not(:disabled) { background: #166534; border-color: #166534; }
.pms-btn-ghost { background: transparent; color: var(--pms-fg-muted); border-color: var(--pms-border); }
.pms-btn-ghost:hover:not(:disabled) { background: var(--pms-bg-alt); color: var(--pms-fg); }
.pms-btn-link { background: transparent; color: var(--pms-accent); border-color: transparent; padding-inline: 0.25rem; }
.pms-btn-link:hover:not(:disabled) { text-decoration: underline; }
.pms-btn-view {
    background: color-mix(in srgb, var(--pms-accent) 9%, var(--pms-bg));
    color: var(--pms-accent);
    border-color: color-mix(in srgb, var(--pms-accent) 24%, var(--pms-border));
}
.pms-btn-view:hover:not(:disabled) {
    background: color-mix(in srgb, var(--pms-accent) 15%, var(--pms-bg));
}

/* ══════════════════════════════════════════════════════════
   DASHBOARD
══════════════════════════════════════════════════════════ */
.pms-dashboard-page {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    width: 100%;
    max-width: 1480px;
}
.pms-dashboard-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.125rem 1.25rem;
    border: 1px solid color-mix(in srgb, var(--pms-border) 80%, var(--pms-accent));
    border-radius: 8px;
    background:
        linear-gradient(135deg,
            color-mix(in srgb, var(--pms-accent) 10%, var(--pms-bg)) 0%,
            var(--pms-bg) 44%,
            color-mix(in srgb, #0f766e 8%, var(--pms-bg-alt)) 100%);
    box-shadow: 0 14px 38px rgba(15, 23, 42, 0.08);
}
.pms-dashboard-header h1 {
    margin: 0;
    font-size: 1.8rem;
    line-height: 1.1;
}
.pms-dashboard-header p:last-child {
    max-width: 42rem;
    margin: 0.45rem 0 0;
    color: var(--pms-fg-muted);
}
.pms-dashboard-controls {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.625rem;
}
.pms-dashboard-controls > span {
    font-size: 0.8125rem;
    color: var(--pms-fg-muted);
    white-space: nowrap;
}
.pms-dashboard-alert {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0.875rem 1rem;
    border: 1px solid var(--pms-danger);
    border-radius: 8px;
    background: color-mix(in srgb, var(--pms-danger) 10%, var(--pms-bg));
    color: var(--pms-danger);
    font-size: 0.875rem;
}
.pms-dashboard-alert strong {
    font-size: 0.9375rem;
}
.pms-dashboard-alert span {
    overflow-wrap: anywhere;
}
.pms-dashboard-alert--subtle {
    border-color: color-mix(in srgb, #b45309 34%, var(--pms-border));
    background: color-mix(in srgb, #b45309 9%, var(--pms-bg));
    color: #92400e;
}
.pms-segmented {
    display: inline-flex;
    gap: 0.125rem;
    padding: 0.1875rem;
    background: color-mix(in srgb, var(--pms-bg-alt) 78%, var(--pms-bg));
    border: 1px solid var(--pms-border);
    border-radius: 8px;
}
.pms-segmented-item {
    min-width: 5rem;
    padding: 0.42rem 0.75rem;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--pms-fg-muted);
    cursor: pointer;
    font: inherit;
    font-size: 0.8125rem;
    font-weight: 700;
    line-height: 1.2;
    transition:
        background-color 140ms cubic-bezier(0.23, 1, 0.32, 1),
        color 140ms cubic-bezier(0.23, 1, 0.32, 1),
        box-shadow 140ms cubic-bezier(0.23, 1, 0.32, 1);
}
.pms-segmented-item:hover {
    color: var(--pms-fg);
    background: color-mix(in srgb, var(--pms-accent) 8%, transparent);
}
.pms-segmented-item.active {
    background: var(--pms-accent);
    color: var(--pms-accent-fg);
    box-shadow: 0 5px 14px color-mix(in srgb, var(--pms-accent) 30%, transparent);
}
.pms-dashboard-main {
    display: grid;
    grid-template-columns: minmax(0, 1.65fr) minmax(320px, 0.75fr);
    gap: 1rem;
}
.pms-dashboard-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}
.pms-dashboard-card {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--pms-border);
    border-radius: 8px;
    padding: 1rem;
    background:
        linear-gradient(180deg,
            color-mix(in srgb, var(--pms-bg-alt) 68%, var(--pms-bg)) 0%,
            var(--pms-bg) 100%);
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.06);
}
.pms-dashboard-card--wide {
    min-height: 28rem;
}
.pms-dashboard-card--focus {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
}
.pms-dashboard-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.875rem;
}
.pms-dashboard-card-head h2 {
    margin: 0;
    font-size: 1rem;
    line-height: 1.25;
}
.pms-dashboard-card-head p {
    margin: 0.2rem 0 0;
    color: var(--pms-fg-muted);
    font-size: 0.8125rem;
}
.pms-dashboard-card-head strong {
    color: var(--pms-fg);
    font-size: 1rem;
    line-height: 1.2;
    white-space: nowrap;
}
.pms-chart-canvas {
    display: block;
    width: 100%;
    height: 17rem;
}
.pms-dashboard-card--wide .pms-chart-canvas {
    height: 24rem;
}
.pms-chart-donut {
    display: block;
    width: 10rem;
    height: 10rem;
    flex: 0 0 10rem;
}
.pms-dashboard-donut-wrap {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.875rem;
    border-radius: 8px;
    background: color-mix(in srgb, var(--pms-accent) 7%, var(--pms-bg-alt));
}
.pms-dashboard-donut-wrap > div {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 0.2rem;
}
.pms-dashboard-donut-wrap strong {
    color: var(--pms-fg);
    font-size: 0.9375rem;
    line-height: 1.25;
    overflow-wrap: anywhere;
}
.pms-dashboard-share {
    color: var(--pms-accent);
    font-size: 2rem;
    font-weight: 800;
    line-height: 1;
}
.pms-dashboard-leaderboard {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}
.pms-dashboard-leaderboard-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.35rem 0.75rem;
    align-items: center;
    font-size: 0.8125rem;
}
.pms-dashboard-leaderboard-row span {
    min-width: 0;
    color: var(--pms-fg);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.pms-dashboard-leaderboard-row strong {
    color: var(--pms-fg-muted);
    font-size: 0.8125rem;
    white-space: nowrap;
}
.pms-dashboard-leaderboard-row i {
    grid-column: 1 / -1;
    display: block;
    height: 0.375rem;
    border-radius: 999px;
    background:
        linear-gradient(90deg, var(--pms-accent) var(--pms-share), transparent var(--pms-share)),
        color-mix(in srgb, var(--pms-border) 68%, transparent);
}

/* ══════════════════════════════════════════════════════════
   HOME
══════════════════════════════════════════════════════════ */
.pms-home {
    display: grid;
    gap: 1rem;
    max-width: 1240px;
    min-height: calc(100vh - var(--pms-topbar-h, 52px) - 2.5rem);
}
/* One-shot entrance: hero, then cards, then workbench, each rising 6px.
   Subtle and fast — the page is visited many times a day. */
@media (prefers-reduced-motion: no-preference) {
    .pms-home > * {
        animation: pms-home-enter 220ms var(--pms-ease-out) backwards;
    }
    .pms-home > :nth-child(2) { animation-delay: 40ms; }
    .pms-home > :nth-child(3) { animation-delay: 80ms; }
}
@keyframes pms-home-enter {
    from {
        opacity: 0;
        transform: translateY(6px);
    }
}
.pms-page-kicker {
    margin: 0 0 0.25rem;
    font-size: 0.6875rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--pms-accent);
}
.pms-home-shell {
    min-height: min(34rem, calc(100vh - var(--pms-topbar-h, 52px) - 5rem));
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(360px, 1.08fr);
    gap: 2rem;
    align-items: center;
    padding-block: clamp(1rem, 3.8vw, 3rem);
}
.pms-home-intro {
    max-width: 36rem;
}
.pms-home h1 {
    margin: 0.9rem 0 0;
    font-size: clamp(1.9rem, 3.4vw, 2.7rem);
    line-height: 1.12;
}
.pms-home-intro p {
    margin: 0.85rem 0 0;
    color: var(--pms-fg-muted);
    font-size: 1.02rem;
    line-height: 1.7;
}
.pms-home-today {
    display: flex;
    align-items: baseline;
    gap: 0.6rem;
    margin-top: 1.4rem;
    padding-block-start: 1rem;
    border-block-start: 1px solid var(--pms-rule-soft, var(--pms-border));
}
.pms-home-today-label {
    color: var(--pms-fg-muted);
    font-size: 0.6875rem;
    font-weight: 800;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}
.pms-home-today .pms-date {
    color: var(--pms-fg);
    font-weight: 650;
    font-variant-numeric: tabular-nums;
}
.pms-home-command-panel {
    padding: 1rem;
    border: 1px solid var(--pms-panel-border, var(--pms-border));
    border-radius: var(--pms-radius-panel);
    background: var(--pms-bg);
}
.pms-home-search {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    gap: 0.65rem;
    align-items: center;
    min-height: 3.8rem;
    padding: 0.55rem;
    border: 1px solid var(--pms-border);
    border-radius: var(--pms-radius-control);
    background: color-mix(in srgb, var(--pms-bg-alt) 82%, var(--pms-bg));
}
.pms-home-search:focus-within {
    border-color: var(--pms-accent);
    background: var(--pms-bg);
}
.pms-home-search-icon {
    position: relative;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: var(--pms-radius-control);
    background: color-mix(in srgb, var(--pms-accent) 12%, var(--pms-bg));
}
.pms-home-search-icon::before {
    content: "";
    position: absolute;
    inset: 0.58rem;
    background: var(--pms-accent);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.5 4a6.5 6.5 0 0 1 5.17 10.45l4.44 4.44-1.42 1.42-4.44-4.44A6.5 6.5 0 1 1 10.5 4Zm0 2a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9Z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.5 4a6.5 6.5 0 0 1 5.17 10.45l4.44 4.44-1.42 1.42-4.44-4.44A6.5 6.5 0 1 1 10.5 4Zm0 2a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9Z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.pms-home-search-input {
    min-width: 0;
    width: 100%;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--pms-fg);
    font: inherit;
    font-size: 1.02rem;
}
.pms-home-search-input::placeholder {
    color: var(--pms-fg-muted);
}
/* Key-cap hint for the "/" focus shortcut; decorative, hidden on touch layouts. */
.pms-home-search-kbd {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.7rem;
    height: 1.7rem;
    padding-inline: 0.4rem;
    border: 1px solid var(--pms-border);
    border-block-end-width: 2px;
    border-radius: var(--pms-radius-control);
    background: var(--pms-bg);
    color: var(--pms-fg-muted);
    font-family: inherit;
    font-size: 0.72rem;
    font-weight: 700;
}
.pms-home-search:focus-within .pms-home-search-kbd {
    display: none;
}
.pms-home-search-submit {
    min-height: 2.5rem;
    padding: 0.35rem 0.95rem;
    border: 1px solid var(--pms-accent);
    border-radius: var(--pms-radius-control);
    background: var(--pms-accent);
    color: var(--pms-accent-fg);
    cursor: pointer;
    font: inherit;
    font-weight: 760;
}
.pms-home-search-submit:disabled {
    border-color: var(--pms-border);
    background: color-mix(in srgb, var(--pms-border) 52%, var(--pms-bg-alt));
    color: var(--pms-fg-muted);
    cursor: default;
}
.pms-home-results,
.pms-home-quick-actions {
    display: grid;
    gap: 0.45rem;
    margin-top: 0.85rem;
}
.pms-home-panel-label {
    grid-column: 1 / -1;
    margin-block: 0.35rem 0.1rem;
    color: var(--pms-fg-muted);
    font-size: 0.6875rem;
    font-weight: 800;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}
.pms-home-result,
.pms-home-quick-action {
    width: 100%;
    border: 1px solid transparent;
    border-radius: var(--pms-radius-control);
    background: transparent;
    color: var(--pms-fg);
    cursor: pointer;
    font: inherit;
    text-align: start;
    text-decoration: none;
}
.pms-home-result {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-height: 3.25rem;
    padding: 0.55rem 0.65rem;
}
.pms-home-result-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    flex: 0 0 auto;
    border-radius: var(--pms-radius-control);
    background: color-mix(in srgb, var(--pms-accent) 11%, var(--pms-bg));
    color: var(--pms-accent);
}
/* The result mark is a corner-down-left "open" arrow; mirror it in RTL. */
[dir="rtl"] .pms-home-result-mark svg {
    transform: scaleX(-1);
}
.pms-home-result-copy {
    min-width: 0;
    display: grid;
    gap: 0.15rem;
}
.pms-home-result-title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 760;
}
.pms-home-result-meta {
    color: var(--pms-fg-muted);
    font-size: 0.84rem;
}
.pms-home-quick-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.pms-home-quick-action {
    display: grid;
    align-content: center;
    gap: 0.25rem;
    min-height: 4.4rem;
    padding: 0.75rem;
    border-color: var(--pms-border);
    background: color-mix(in srgb, var(--pms-bg-alt) 56%, var(--pms-bg));
}
.pms-home-quick-action span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 760;
}
.pms-home-quick-action small {
    color: var(--pms-fg-muted);
    font-size: 0.78rem;
}
.pms-home-empty {
    min-height: 3.2rem;
    display: flex;
    align-items: center;
    padding: 0.6rem 0.7rem;
    color: var(--pms-fg-muted);
    border-radius: var(--pms-radius-control);
    background: var(--pms-bg-alt);
}
.pms-home-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 0.75rem;
}
.pms-home-card {
    display: flex;
    align-items: flex-start;
    gap: 0.875rem;
    min-height: 6.25rem;
    padding: 1rem;
    color: var(--pms-fg);
    background: var(--pms-bg);
    border: 1px solid var(--pms-panel-border, var(--pms-border));
    border-radius: var(--pms-radius-panel);
    text-decoration: none;
}
.pms-home-card-icon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: var(--pms-radius-control);
    color: var(--pms-accent);
    background: color-mix(in srgb, var(--pms-accent) 12%, var(--pms-bg));
}
.pms-home-card strong,
.pms-home-card small {
    display: block;
}
.pms-home-card strong {
    font-size: 0.9875rem;
    line-height: 1.3;
}
.pms-home-card small {
    margin-top: 0.35rem;
    color: var(--pms-fg-muted);
    font-size: 0.8125rem;
    line-height: 1.45;
}
.pms-home-workbench {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}
.pms-home-panel {
    padding: 1rem;
    background: var(--pms-bg);
    border: 1px solid var(--pms-panel-border, var(--pms-border));
    border-radius: var(--pms-radius-panel);
}
.pms-home-panel h2 {
    margin: 0 0 0.75rem;
    color: var(--pms-fg-muted);
    font-size: 0.6875rem;
    font-weight: 800;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}
.pms-home-link-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 0.5rem;
}
.pms-home-link-list a {
    display: flex;
    align-items: center;
    min-height: 2.5rem;
    padding: 0.5rem 0.75rem;
    color: var(--pms-fg);
    background: var(--pms-bg-alt);
    border: 1px solid var(--pms-border);
    border-radius: var(--pms-radius-control);
    font-size: 0.875rem;
    font-weight: 500;
    text-decoration: none;
}

/* ══════════════════════════════════════════════════════════
   MISC UTILITIES
══════════════════════════════════════════════════════════ */
.pms-rate-badge { font-size: 0.8125rem; color: var(--pms-fg-muted); margin-bottom: 0.25rem; }
.pms-warning { color: #b45309; }
.pms-stale-notice {
    display: grid;
    gap: 0.5rem;
    margin-block: 0.75rem;
    padding: 0.75rem 1rem;
    border: 1px solid color-mix(in srgb, #b45309 35%, var(--pms-border));
    border-inline-start: 4px solid #b45309;
    border-radius: 0.5rem;
    background: color-mix(in srgb, #b45309 8%, var(--pms-bg));
}
.pms-stale-notice-title {
    font-weight: 700;
    color: #b45309;
}
.pms-stale-notice-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}
.pms-dialog-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: grid;
    place-items: center;
    padding: 1rem;
    background: color-mix(in srgb, #000 45%, transparent);
}
.pms-dialog {
    width: min(34rem, 100%);
    max-height: 90vh;
    overflow-y: auto;
    display: grid;
    gap: 0.75rem;
    padding: 1.25rem 1.5rem;
    border: 1px solid var(--pms-border);
    border-radius: 0.75rem;
    background: var(--pms-bg);
    box-shadow: 0 20px 50px color-mix(in srgb, #000 25%, transparent);
}
.pms-dialog-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}
.pms-dialog-header h2 {
    margin: 0;
    font-size: 1.1rem;
}
.pms-dialog-section {
    display: grid;
    gap: 0.35rem;
    padding: 0.6rem 0.75rem;
    border: 1px solid var(--pms-border);
    border-radius: 0.5rem;
    background: var(--pms-bg-alt);
}
.pms-dialog-section-title {
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--pms-fg-muted, #6b7280);
}
.pms-rate-details-btn {
    margin: 0.75rem 1rem 0.25rem;
    width: fit-content;
}
.pms-rate-help-link {
    background: none;
    border: none;
    padding: 0;
    margin-top: 0.15rem;
    font-size: 0.8rem;
    color: #0369a1;
    cursor: pointer;
    text-align: start;
    text-decoration: underline;
    width: fit-content;
}
.pms-success { color: var(--pms-success); }
.pms-hint { color: var(--pms-text-muted, #6b7280); font-size: 0.9em; }
.pms-error   { color: var(--pms-danger); }

/* ══════════════════════════════════════════════════════════
   SPINNER
══════════════════════════════════════════════════════════ */
.pms-spinner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 2.5rem 1rem;
    color: var(--pms-fg-muted);
    font-size: 0.9375rem;
}
.pms-spinner-ring {
    width: 1.5rem;
    height: 1.5rem;
    color: var(--pms-accent);
    flex-shrink: 0;
    animation: pms-spin 0.75s linear infinite;
}
@keyframes pms-spin { to { transform: rotate(360deg); } }

/* ══════════════════════════════════════════════════════════
   EMPTY STATE
══════════════════════════════════════════════════════════ */
.pms-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3.5rem 1rem;
    text-align: center;
    color: var(--pms-fg-muted);
}
.pms-empty-state-icon { font-size: 2.75rem; line-height: 1; margin-bottom: 0.75rem; }
.pms-empty-state-msg  { font-size: 0.9375rem; margin: 0; }

/* ══════════════════════════════════════════════════════════
   CONFIRM DELETE INLINE
══════════════════════════════════════════════════════════ */
.pms-confirm-inline {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}
.pms-btn-sm {
    padding: 0.2rem 0.55rem;
    font-size: 0.8125rem;
}

/* ══════════════════════════════════════════════════════════
   LOOKUP TYPEAHEAD
══════════════════════════════════════════════════════════ */
.pms-lookup {
    position: relative;
    display: inline-flex;
    align-items: center;
    width: 100%;
}
.pms-lookup-input {
    width: 100%;
    font-size: 0.9375rem;
    font-family: inherit;
    color: var(--pms-fg);
    background: var(--pms-bg);
    border: 1px solid var(--pms-border);
    border-radius: 6px;
    /* Logical padding so the 2rem gap for the clear/spinner icon flips in RTL */
    padding-block: 0.375rem;
    padding-inline-start: 0.625rem;
    padding-inline-end: 2rem;
    transition:
        border-color 140ms cubic-bezier(0.23, 1, 0.32, 1),
        box-shadow 140ms cubic-bezier(0.23, 1, 0.32, 1);
}
.pms-lookup-input:focus {
    outline: none;
    border-color: var(--pms-accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--pms-accent) 20%, transparent);
}
.pms-lookup-clear {
    position: absolute;
    inset-inline-end: 0.375rem;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--pms-fg-muted);
    font-size: 1.125rem;
    line-height: 1;
    padding: 0.125rem 0.25rem;
    border-radius: 3px;
    z-index: 1;
}
.pms-lookup-clear:hover { color: var(--pms-fg); background: var(--pms-border); }
.pms-lookup-spinner {
    position: absolute;
    inset-inline-end: 0.625rem;
    color: var(--pms-fg-muted);
    font-size: 1rem;
    pointer-events: none;
    z-index: 1;
}
.pms-lookup-results {
    position: absolute;
    top: calc(100% + 4px);
    inset-inline-start: 0;
    inset-inline-end: 0;
    z-index: 100;
    background: var(--pms-bg);
    border: 1px solid var(--pms-border);
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.14);
    max-height: 220px;
    overflow-y: auto;
    padding: 0.25rem 0;
    margin: 0;
    list-style: none;
}
.pms-lookup-results::-webkit-scrollbar { width: 4px; }
.pms-lookup-results::-webkit-scrollbar-thumb { background: var(--pms-border); border-radius: 2px; }
.pms-lookup-item {
    width: 100%;
    text-align: start;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.45rem 0.75rem;
    font-size: 0.875rem;
    font-family: inherit;
    color: var(--pms-fg);
    display: block;
    transition:
        background-color 140ms cubic-bezier(0.23, 1, 0.32, 1),
        color 140ms cubic-bezier(0.23, 1, 0.32, 1);
}
.pms-lookup-item:hover,
.pms-lookup-item--focused {
    background: color-mix(in srgb, var(--pms-accent) 10%, transparent);
    color: var(--pms-accent);
}
/* ══════════════════════════════════════════════════════════
   DETAIL PAGE — DEFINITION LIST
══════════════════════════════════════════════════════════ */
.pms-dl {
    display: grid;
    grid-template-columns: max-content 1fr;
    column-gap: 1.5rem;
    margin: 0 0 1.5rem;
    font-size: 0.9375rem;
}
.pms-dl dt {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--pms-fg-muted);
    padding: 0.4rem 0;
    white-space: nowrap;
    border-bottom: 1px solid var(--pms-border);
}
.pms-dl dd {
    margin: 0;
    padding: 0.4rem 0;
    color: var(--pms-fg);
    border-bottom: 1px solid var(--pms-border);
    word-break: break-word;
}

/* ══════════════════════════════════════════════════════════
   DETAIL PAGE — ACTION BAR
══════════════════════════════════════════════════════════ */
.pms-action-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 0;
    margin-bottom: 1.25rem;
    border-bottom: 1px solid var(--pms-border);
}
.pms-action-bar-back {
    margin-inline-end: auto;
}

.pms-money {
    display: inline-block;
    min-width: 0;
    font-variant-numeric: tabular-nums;
    unicode-bidi: isolate;
}

.pms-money-negative {
    color: var(--pms-danger);
    font-weight: 700;
}

.pms-date {
    unicode-bidi: plaintext;
}

.pms-syncfusion-grid-wrap {
    padding: 0;
    overflow: hidden;
}

.pms-syncfusion-grid.e-grid {
    border: 0;
    font-family: inherit;
    color: var(--pms-text);
}

.pms-syncfusion-grid .e-gridheader {
    border-color: var(--pms-border);
    background: color-mix(in srgb, var(--pms-panel) 92%, var(--pms-primary) 8%);
}

.pms-syncfusion-grid .e-headercell,
.pms-syncfusion-grid .e-rowcell {
    border-color: var(--pms-border);
    font-size: 0.88rem;
}

.pms-syncfusion-grid .e-headertext {
    color: var(--pms-muted);
    font-weight: 700;
}

.pms-syncfusion-grid .e-row:hover .e-rowcell {
    background: color-mix(in srgb, var(--pms-primary) 7%, transparent);
}

.pms-syncfusion-grid .e-gridpager {
    border-color: var(--pms-border);
    background: var(--pms-panel);
}

.pms-syncfusion-grid .e-currentitem,
.pms-syncfusion-grid .e-currentitem:hover {
    background: var(--pms-primary);
    color: #fff;
}

html[data-theme="dark"] .pms-syncfusion-grid.e-grid,
html[data-theme="dark"] .pms-syncfusion-grid .e-gridheader,
html[data-theme="dark"] .pms-syncfusion-grid .e-gridpager {
    background: var(--pms-panel);
    color: var(--pms-text);
}

/* ══════════════════════════════════════════════════════════
   MASTER-DETAIL SPLIT VIEW (desktop-app-style workspace:
   filtered list alongside the main nav, header+detail to the
   content side — see plan §7/Phase 11). Plain flex row: under
   dir="rtl" the browser mirrors the visual order on its own,
   no manual left/right flip needed.
══════════════════════════════════════════════════════════ */
.pms-split {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}
.pms-split-list {
    width: 300px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    background: var(--pms-bg-alt);
    border: 1px solid var(--pms-border);
    border-radius: 10px;
    height: calc(100vh - var(--pms-topbar-h) - 2.5rem);
    position: sticky;
    top: calc(var(--pms-topbar-h) + 1.25rem);
}
.pms-split-list-head {
    flex-shrink: 0;
    padding: 0.625rem;
    border-bottom: 1px solid var(--pms-border);
}
.pms-split-list-head input {
    width: 100%;
    font-size: 0.875rem;
    font-family: inherit;
    color: var(--pms-fg);
    background: var(--pms-bg);
    border: 1px solid var(--pms-border);
    border-radius: 6px;
    padding: 0.375rem 0.625rem;
}
.pms-split-list-body {
    flex: 1;
    overflow-y: auto;
}
.pms-split-list-body::-webkit-scrollbar { width: 4px; }
.pms-split-list-body::-webkit-scrollbar-thumb { background: var(--pms-border); border-radius: 2px; }
.pms-split-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    text-align: start;
    background: none;
    border: none;
    border-bottom: 1px solid var(--pms-border);
    padding: 0.5rem 0.75rem;
    font-size: 0.8125rem;
    font-family: inherit;
    color: var(--pms-fg);
    cursor: pointer;
}
.pms-split-item:hover { background: color-mix(in srgb, var(--pms-accent) 8%, transparent); }
.pms-split-item.active {
    background: color-mix(in srgb, var(--pms-accent) 15%, transparent);
    color: var(--pms-accent);
    font-weight: 600;
}
.pms-split-item-main { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pms-split-item-sub { font-size: 0.75rem; color: var(--pms-fg-muted); }
.pms-split-list-footer {
    flex-shrink: 0;
    border-top: 1px solid var(--pms-border);
    padding: 0.375rem 0.5rem;
}

.pms-split-main {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}
.pms-split-section {
    border: 1px solid var(--pms-border);
    border-radius: 10px;
    padding: 1rem 1.25rem;
    background: var(--pms-bg);
}
.pms-split-section h2 {
    margin: 0 0 0.75rem;
    font-size: 1.0625rem;
}

/* Parties master-detail workspace */
.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}
.pms-party-workspace {
    max-width: 1500px;
}
.pms-party-master {
    width: 430px;
    background: var(--pms-bg);
}
.pms-party-master-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    min-height: 4.25rem;
    padding: 0.75rem;
    border-bottom: 1px solid var(--pms-border);
}
.pms-party-master-toolbar > div {
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.pms-party-master-toolbar strong {
    overflow: hidden;
    font-size: 1.0625rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.pms-party-master-kicker {
    color: var(--pms-fg-muted);
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.pms-party-add {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    flex: 0 0 2rem;
    border: 0;
    border-radius: 7px;
    background: var(--pms-accent);
    color: var(--pms-accent-fg);
    font-size: 1.35rem;
    line-height: 1;
    cursor: pointer;
    transition:
        transform 120ms cubic-bezier(0.23, 1, 0.32, 1),
        opacity 140ms cubic-bezier(0.23, 1, 0.32, 1);
}
.pms-party-add:hover {
    color: var(--pms-accent-fg);
    text-decoration: none;
    opacity: 0.88;
}
.pms-party-add:active,
.pms-party-grid-select:active,
.pms-party-row-menu summary:active,
.pms-party-menu-action:active {
    transform: scale(0.97);
}
.pms-party-master .pms-split-list-head {
    padding: 0.625rem 0.75rem;
}
.pms-party-master-search {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    width: 100%;
    padding-inline: 0.625rem;
    border: 1px solid var(--pms-border);
    border-radius: 7px;
    background: var(--pms-bg-alt);
    color: var(--pms-fg-muted);
}
.pms-party-master .pms-party-master-search input {
    min-width: 0;
    padding-inline: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}
.pms-party-grid-head,
.pms-party-grid-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 92px 76px 34px;
    align-items: center;
}
.pms-party-grid-head {
    min-height: 2rem;
    padding-inline: 0.75rem;
    border-bottom: 1px solid var(--pms-border);
    background: var(--pms-bg-alt);
    color: var(--pms-fg-muted);
    font-size: 0.625rem;
    font-weight: 800;
    letter-spacing: 0.035em;
    text-transform: uppercase;
}
.pms-party-grid-head span:nth-child(3) {
    text-align: center;
}
.pms-party-grid-row {
    position: relative;
    min-height: 3.2rem;
    border-bottom: 1px solid var(--pms-border);
    border-inline-start: 3px solid transparent;
    background: var(--pms-bg);
}
.pms-party-grid-row.active {
    border-inline-start-color: var(--pms-accent);
    background: color-mix(in srgb, var(--pms-accent) 9%, var(--pms-bg));
}
.pms-party-grid-select {
    display: grid;
    grid-column: 1 / 4;
    grid-template-columns: minmax(0, 1fr) 92px 76px;
    align-items: center;
    align-self: stretch;
    min-width: 0;
    padding: 0.55rem 0.25rem 0.55rem 0.55rem;
    border: 0;
    background: transparent;
    color: var(--pms-fg);
    font: inherit;
    text-align: start;
    text-decoration: none;
    cursor: pointer;
    transition:
        transform 120ms cubic-bezier(0.23, 1, 0.32, 1),
        background-color 140ms cubic-bezier(0.23, 1, 0.32, 1);
}
.pms-party-grid-select:hover {
    color: var(--pms-fg);
    text-decoration: none;
}
[dir="rtl"] .pms-party-grid-select {
    padding: 0.55rem 0.55rem 0.55rem 0.25rem;
}
.pms-party-grid-name,
.pms-party-grid-currency {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.pms-party-grid-name {
    padding-inline-end: 0.5rem;
    font-size: 0.8125rem;
    font-weight: 700;
}
.pms-party-grid-currency {
    color: var(--pms-fg-muted);
    font-size: 0.75rem;
}
.pms-party-grid-status {
    justify-self: center;
    max-width: calc(100% - 0.35rem);
    overflow: hidden;
    padding: 0.12rem 0.35rem;
    border-radius: 999px;
    font-size: 0.625rem;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.pms-party-grid-status-active {
    background: color-mix(in srgb, #15803d 12%, var(--pms-bg));
    color: #15803d;
}
.pms-party-grid-status-deleted {
    background: var(--pms-bg-alt);
    color: var(--pms-fg-muted);
}
html[data-theme="dark"] .pms-party-grid-status-active {
    color: #86efac;
}
.pms-party-row-menu {
    position: relative;
    grid-column: 4;
    justify-self: center;
    z-index: 2;
}
.pms-party-row-menu[open] {
    z-index: 30;
}
.pms-party-row-menu summary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.8rem;
    height: 1.8rem;
    border-radius: 6px;
    border: 0;
    background: transparent;
    color: var(--pms-fg-muted);
    font: inherit;
    cursor: pointer;
    list-style: none;
    transition:
        transform 120ms cubic-bezier(0.23, 1, 0.32, 1),
        background-color 140ms cubic-bezier(0.23, 1, 0.32, 1),
        color 140ms cubic-bezier(0.23, 1, 0.32, 1);
}
.pms-party-row-menu summary::-webkit-details-marker {
    display: none;
}
.pms-party-row-menu summary span {
    font-size: 1.35rem;
    line-height: 1;
}
.pms-party-row-menu[open] summary {
    background: color-mix(in srgb, var(--pms-accent) 12%, var(--pms-bg));
    color: var(--pms-accent);
}
.pms-party-row-popover {
    position: absolute;
    inset-block-start: calc(100% + 0.35rem);
    inset-inline-end: 0;
    width: min(325px, calc(100vw - 2rem));
    padding: 0.45rem;
    border: 1px solid var(--pms-border);
    border-radius: 9px;
    background: var(--pms-bg);
    box-shadow: 0 14px 35px rgba(15, 23, 42, 0.18);
    transform-origin: top right;
}
[dir="rtl"] .pms-party-row-popover {
    transform-origin: top left;
}
.pms-party-master .pms-split-list-body:has(.pms-party-row-menu[open]) {
    padding-bottom: 19rem;
}
.pms-party-menu-action {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    min-height: 2.25rem;
    padding: 0.4rem 0.55rem;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--pms-fg);
    font: inherit;
    font-size: 0.8125rem;
    font-weight: 700;
    text-align: start;
    cursor: pointer;
    transition:
        transform 120ms cubic-bezier(0.23, 1, 0.32, 1),
        background-color 140ms cubic-bezier(0.23, 1, 0.32, 1);
}
.pms-party-menu-danger { color: var(--pms-danger); }
.pms-party-menu-success { color: #15803d; }
.pms-fingerprint {
    margin-top: 0.4rem;
    padding: 0.65rem 0.55rem 0.45rem;
    border-top: 1px solid var(--pms-border);
}
.pms-fingerprint-title {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-bottom: 0.55rem;
    color: var(--pms-fg);
    font-size: 0.75rem;
}
.pms-fingerprint dl {
    display: grid;
    grid-template-columns: minmax(80px, auto) 1fr;
    gap: 0.3rem 0.65rem;
    margin: 0;
    font-size: 0.6875rem;
}
.pms-fingerprint dt {
    color: var(--pms-fg-muted);
    font-weight: 600;
}
.pms-fingerprint dd {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
    color: var(--pms-fg);
}
.pms-party-master .pms-split-list-footer {
    color: var(--pms-fg-muted);
    font-size: 0.6875rem;
    text-align: center;
}
.pms-party-detail {
    gap: 0.875rem;
}
.pms-party-detail-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 4.25rem;
    padding: 0.55rem 0;
    border-bottom: 1px solid var(--pms-border);
}
.pms-party-detail-heading {
    min-width: 0;
}
.pms-party-heading-line {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    min-width: 0;
}
.pms-party-heading-line h1 {
    margin: 0;
    overflow: hidden;
    font-size: clamp(1.25rem, 2vw, 1.7rem);
    text-overflow: ellipsis;
    white-space: nowrap;
}
.pms-party-detail-heading p {
    margin: 0.2rem 0 0;
    color: var(--pms-fg-muted);
    font-size: 0.75rem;
}
.pms-party-save-group {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}
.pms-unsaved-indicator {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin-inline-end: 0.25rem;
    color: #a16207;
    font-size: 0.6875rem;
    font-weight: 700;
}
.pms-unsaved-indicator i {
    width: 0.45rem;
    height: 0.45rem;
    border-radius: 50%;
    background: #eab308;
}
.pms-party-detail-empty {
    display: grid;
    place-items: center;
    min-height: 55vh;
    border: 1px dashed var(--pms-border);
    border-radius: 10px;
    color: var(--pms-fg-muted);
    text-align: center;
}
.pms-party-detail-empty span {
    font-size: 2rem;
}
.pms-party-detail-empty p {
    margin: -8rem 1rem 0;
}
.pms-party-inactive-banner,
.pms-party-notice {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 0.8rem;
    border: 1px solid var(--pms-border);
    border-radius: 8px;
    font-size: 0.8125rem;
}
.pms-party-inactive-banner {
    background: var(--pms-bg-alt);
    color: var(--pms-fg-muted);
}
.pms-party-notice-success {
    border-color: color-mix(in srgb, #15803d 30%, var(--pms-border));
    background: color-mix(in srgb, #15803d 9%, var(--pms-bg));
    color: #15803d;
}
.pms-party-notice-error {
    border-color: color-mix(in srgb, var(--pms-danger) 35%, var(--pms-border));
    background: color-mix(in srgb, var(--pms-danger) 8%, var(--pms-bg));
    color: var(--pms-danger);
}
.pms-party-fieldset {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}
.pms-party-fieldset legend {
    margin-bottom: 1rem;
    color: var(--pms-fg);
    font-size: 1rem;
    font-weight: 800;
}
.pms-party-detail-form {
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    margin-bottom: 0;
}
.pms-party-fieldset[disabled] input,
.pms-party-fieldset[disabled] select,
.pms-party-fieldset[disabled] textarea {
    border-color: color-mix(in srgb, var(--pms-border) 80%, transparent);
    background: var(--pms-bg-alt);
    color: var(--pms-fg-muted);
    cursor: not-allowed;
    opacity: 0.72;
}
.pms-party-switch {
    align-self: end;
    min-height: 2.35rem;
}

/* Shared master-detail workspace for finance and administration records */
.pms-record-master {
    width: 430px;
}
.pms-record-grid-head,
.pms-record-grid-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 112px 76px 34px;
    align-items: center;
}
.pms-record-grid-head {
    min-height: 2rem;
    padding-inline: 0.75rem;
    border-bottom: 1px solid var(--pms-border);
    background: var(--pms-bg-alt);
    color: var(--pms-fg-muted);
    font-size: 0.625rem;
    font-weight: 800;
    letter-spacing: 0.035em;
    text-transform: uppercase;
}
.pms-record-grid-head span:nth-child(3) {
    text-align: center;
}
.pms-party-add:disabled {
    cursor: not-allowed;
    opacity: 0.5;
}
.pms-record-grid-head > .pms-record-sort {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    align-self: stretch;
    min-width: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    letter-spacing: inherit;
    text-align: start;
    text-transform: inherit;
    cursor: pointer;
}
.pms-record-grid-head > .pms-record-sort:hover {
    color: var(--pms-accent);
}
.pms-record-grid-head > .pms-record-sort:focus-visible {
    border-radius: 3px;
    outline: 2px solid var(--pms-accent);
    outline-offset: 2px;
}
.pms-record-grid-head > .pms-record-sort-centered {
    justify-content: center;
}
.pms-record-sort > span:first-child {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.pms-record-sort-indicator {
    flex: 0 0 auto;
    font-size: 0.7rem;
}
.pms-record-master-compact-primary .pms-record-grid-head,
.pms-record-master-compact-primary .pms-record-grid-row {
    grid-template-columns: 72px minmax(0, 1fr) 76px 34px;
}
.pms-record-master-compact-primary .pms-record-grid-select {
    grid-template-columns: 72px minmax(0, 1fr) 76px;
}
.pms-record-grid-row {
    position: relative;
    min-height: 3.2rem;
    border-bottom: 1px solid var(--pms-border);
    border-inline-start: 3px solid transparent;
    background: var(--pms-bg);
}
.pms-record-grid-row.active {
    border-inline-start-color: var(--pms-accent);
    background: color-mix(in srgb, var(--pms-accent) 9%, var(--pms-bg));
}
.pms-record-grid-select {
    display: grid;
    grid-column: 1 / 4;
    grid-template-columns: minmax(0, 1fr) 112px 76px;
    align-items: center;
    align-self: stretch;
    min-width: 0;
    padding: 0.55rem 0.25rem 0.55rem 0.55rem;
    border: 0;
    background: transparent;
    color: var(--pms-fg);
    font: inherit;
    text-align: start;
    cursor: pointer;
}
[dir="rtl"] .pms-record-grid-select {
    padding: 0.55rem 0.55rem 0.55rem 0.25rem;
}
.pms-record-grid-title,
.pms-record-grid-secondary {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.pms-record-grid-title {
    padding-inline-end: 0.5rem;
    font-size: 0.8125rem;
    font-weight: 700;
}
.pms-record-grid-secondary {
    color: var(--pms-fg-muted);
    font-size: 0.75rem;
}
.pms-record-row-popover {
    width: 180px;
}
.pms-record-list-extension {
    padding: 0.65rem 0.75rem;
    border-bottom: 1px solid var(--pms-border);
    background: var(--pms-bg-alt);
}
.pms-record-list-extension .pms-form {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 0.5rem;
    margin: 0;
}
.pms-record-list-extension .pms-form label {
    min-width: 0;
}
.pms-record-list-extension .pms-form input {
    width: 100%;
}
.pms-record-list-note {
    margin: 0;
    color: var(--pms-fg-muted);
    font-size: 0.75rem;
    line-height: 1.45;
}
.pms-record-detail-input {
    width: 100%;
}
.pms-record-detail-switch {
    min-height: 2.25rem;
}
.pms-inline-clear {
    margin-inline-start: 0.4rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--pms-accent);
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}
.pms-record-detail-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 0;
    margin: 0;
    border: 1px solid var(--pms-border);
    border-radius: 9px;
    overflow: hidden;
}
.pms-record-detail-field {
    min-width: 0;
    padding: 0.85rem 1rem;
    border-inline-end: 1px solid var(--pms-border);
    border-bottom: 1px solid var(--pms-border);
}
.pms-record-detail-field-wide {
    grid-column: 1 / -1;
}
.pms-record-detail-field dt {
    margin-bottom: 0.3rem;
    color: var(--pms-fg-muted);
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.025em;
    text-transform: uppercase;
}
.pms-record-detail-field dd {
    min-height: 1.35rem;
    margin: 0;
    overflow-wrap: anywhere;
    color: var(--pms-fg);
    font-size: 0.875rem;
    font-weight: 650;
}

@media (hover: hover) and (pointer: fine) {
    .pms-party-grid-row:not(.active):hover {
        background: color-mix(in srgb, var(--pms-accent) 5%, var(--pms-bg));
    }
    .pms-party-row-menu summary:hover {
        background: var(--pms-bg-alt);
        color: var(--pms-fg);
    }
    .pms-party-menu-danger:hover {
        background: color-mix(in srgb, var(--pms-danger) 9%, var(--pms-bg));
    }
    .pms-party-menu-success:hover {
        background: color-mix(in srgb, #15803d 9%, var(--pms-bg));
    }
}

@media (prefers-reduced-motion: reduce) {
    .pms-party-add,
    .pms-party-grid-select,
    .pms-party-row-menu summary,
    .pms-party-menu-action {
        transition-duration: 0ms;
    }
}

.pms-toolbar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.625rem;
    margin-bottom: 0.875rem;
}
.pms-toolbar-spacer { margin-inline-start: auto; }

.pms-pager {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.875rem;
    padding: 0.5rem 0;
}
.pms-pager-info {
    font-size: 0.8125rem;
    color: var(--pms-fg-muted);
    white-space: nowrap;
}

@media (max-width: 960px) {
    .pms-split { flex-direction: column; }
    .pms-split-list {
        width: 100%;
        height: auto;
        max-height: 40vh;
        position: static;
    }
    .pms-directory-header {
        align-items: stretch;
        flex-direction: column;
    }
    .pms-directory-stats {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .pms-party-filter .pms-toolbar-spacer {
        margin-inline-start: 0;
    }
    .pms-editor-header,
    .pms-form-actions {
        align-items: stretch;
        flex-direction: column;
    }
    .pms-party-master {
        width: 100%;
    }
    .pms-record-master {
        width: 100%;
    }
    .pms-party-detail-toolbar {
        align-items: stretch;
        flex-direction: column;
    }
    .pms-party-save-group {
        justify-content: flex-end;
    }
}

@media (max-width: 560px) {
    .pms-party-grid-head,
    .pms-party-grid-row {
        grid-template-columns: minmax(0, 1fr) 72px 68px 34px;
    }
    .pms-party-grid-select {
        grid-template-columns: minmax(0, 1fr) 72px 68px;
    }
    .pms-record-grid-head,
    .pms-record-grid-row {
        grid-template-columns: minmax(0, 1fr) 86px 68px 34px;
    }
    .pms-record-grid-select {
        grid-template-columns: minmax(0, 1fr) 86px 68px;
    }
    .pms-record-master-compact-primary .pms-record-grid-head,
    .pms-record-master-compact-primary .pms-record-grid-row {
        grid-template-columns: 64px minmax(0, 1fr) 68px 34px;
    }
    .pms-record-master-compact-primary .pms-record-grid-select {
        grid-template-columns: 64px minmax(0, 1fr) 68px;
    }
    .pms-party-save-group {
        flex-wrap: wrap;
    }
    .pms-unsaved-indicator {
        width: 100%;
    }
}

/* ══════════════════════════════════════════════════════════
   REPORTS CARD GRID
══════════════════════════════════════════════════════════ */
.pms-report-section { margin-bottom: 2rem; }
.pms-report-section-title {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--pms-fg-muted);
    margin: 0 0 0.75rem;
    padding-bottom: 0.375rem;
    border-bottom: 1px solid var(--pms-border);
}
.pms-report-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 0.625rem;
}
.pms-report-search {
    position: relative;
    max-width: 26rem;
    margin-bottom: 1.25rem;
}
.pms-report-search-icon {
    position: absolute;
    inset-inline-start: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--pms-fg-muted);
    pointer-events: none;
}
.pms-report-search-input {
    width: 100%;
    font-size: 0.875rem;
    font-family: inherit;
    color: var(--pms-fg);
    background: var(--pms-bg);
    border: 1px solid var(--pms-border);
    border-radius: 8px;
    padding: 0.5rem 0.75rem;
    padding-inline-start: 2.25rem;
}
.pms-report-search-input:focus {
    outline: none;
    border-color: var(--pms-accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--pms-accent) 20%, transparent);
}
.pms-report-card {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    background: var(--pms-bg-alt);
    border: 1px solid var(--pms-border);
    border-radius: 8px;
    text-decoration: none;
    color: var(--pms-fg);
    transition:
        border-color 140ms cubic-bezier(0.23, 1, 0.32, 1),
        box-shadow 140ms cubic-bezier(0.23, 1, 0.32, 1),
        transform 120ms cubic-bezier(0.23, 1, 0.32, 1);
}
.pms-report-card:hover {
    border-color: var(--pms-accent);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    transform: translateY(-1px);
    color: var(--pms-accent);
    text-decoration: none;
}
.pms-report-card-icon { font-size: 1.25rem; flex-shrink: 0; line-height: 1; }
.pms-report-card-text {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    flex: 1;
    min-width: 0;
}
.pms-report-card-name { font-size: 0.875rem; font-weight: 500; }
.pms-report-card-desc {
    font-size: 0.75rem;
    line-height: 1.35;
    color: var(--pms-fg-muted);
}

/* ══════════════════════════════════════════════════════════
   DASHBOARD KPI STRIP
══════════════════════════════════════════════════════════ */
.pms-kpi-strip {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}
.pms-kpi-strip--dashboard {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-bottom: 0;
}
.pms-kpi-tile {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    padding: 1rem 1.125rem;
    background: var(--pms-bg-alt);
    border: 1px solid var(--pms-border);
    border-radius: 8px;
    border-inline-start: 3px solid var(--pms-accent);
}
.pms-kpi-strip--dashboard .pms-kpi-tile {
    min-width: 0;
    min-height: 7.25rem;
    background:
        linear-gradient(160deg,
            color-mix(in srgb, var(--pms-bg-alt) 75%, var(--pms-bg)) 0%,
            var(--pms-bg) 100%);
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.055);
}
.pms-kpi-tile--strong {
    border-inline-start-color: #0f766e;
    background:
        linear-gradient(160deg,
            color-mix(in srgb, #0f766e 12%, var(--pms-bg)) 0%,
            var(--pms-bg) 100%) !important;
}
.pms-kpi-label {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--pms-fg-muted);
}
.pms-kpi-value {
    font-size: 1.375rem;
    font-weight: 700;
    color: var(--pms-fg);
    line-height: 1.15;
}
.pms-kpi-sub { font-size: 0.75rem; color: var(--pms-fg-muted); }
.pms-kpi-strip--dashboard .pms-kpi-sub {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    align-items: center;
}
.pms-kpi-trend {
    display: inline-flex;
    align-items: center;
    min-width: 2.8rem;
    justify-content: center;
    padding: 0.08rem 0.375rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--pms-border) 55%, transparent);
    color: var(--pms-fg-muted);
    font-weight: 700;
}
.pms-kpi-trend--up {
    background: color-mix(in srgb, #15803d 12%, var(--pms-bg));
    color: #15803d;
}
.pms-kpi-trend--down {
    background: color-mix(in srgb, var(--pms-danger) 12%, var(--pms-bg));
    color: var(--pms-danger);
}

/* ══════════════════════════════════════════════════════════
   ACCESSIBILITY — SKIP TO CONTENT
══════════════════════════════════════════════════════════ */
.pms-skip-link {
    position: absolute;
    inset-inline-start: 0;
    top: 0;
    z-index: 9999;
    padding: 0.625rem 1.25rem;
    background: var(--pms-accent);
    color: var(--pms-accent-fg);
    font-weight: 600;
    font-size: 0.875rem;
    text-decoration: none;
    border-radius: 0 0 6px 0;
    transform: translateY(-100%);
    transition: transform 120ms cubic-bezier(0.23, 1, 0.32, 1);
}
.pms-skip-link:focus {
    transform: translateY(0);
    outline: 3px solid var(--pms-accent-fg);
    outline-offset: -3px;
}

/* ══════════════════════════════════════════════════════════
   ACCESSIBILITY — FOCUS VISIBLE
   Restore a visible ring for keyboard navigation on elements
   that suppress the browser default outline.
══════════════════════════════════════════════════════════ */
.pms-btn:focus-visible,
.pms-topbar-btn:focus-visible,
.pms-topbar-toggle:focus-visible,
.pms-nav-item:focus-visible,
.pms-nav-group-toggle:focus-visible,
.pms-lookup-item:focus-visible,
.pms-lookup-clear:focus-visible,
.pms-report-card:focus-visible,
.pms-auth-lang a:focus-visible,
.pms-auth-theme:focus-visible,
.pms-auth-checkbox:focus-visible,
.pms-auth-reveal:focus-visible,
.pms-segmented-item:focus-visible {
    outline: 2px solid var(--pms-accent);
    outline-offset: 2px;
}
a:focus-visible {
    outline: 2px solid var(--pms-accent);
    outline-offset: 2px;
    border-radius: 2px;
}
/* Inputs: augment their existing box-shadow ring with an outline */
.pms-lookup-input:focus-visible,
.pms-form label input:focus-visible,
.pms-form label select:focus-visible,
.pms-form label textarea:focus-visible,
.pms-filter-panel input:focus-visible,
.pms-auth-input:focus-visible {
    outline: 2px solid var(--pms-accent);
    outline-offset: 1px;
}

/* ══════════════════════════════════════════════════════════
   RESPONSIVE (narrow viewports — the shell had no breakpoint
   at all before, so the sidebar never adapted to small screens)
══════════════════════════════════════════════════════════ */
@media (max-width: 1060px) {
    .pms-home-shell {
        grid-template-columns: 1fr;
        align-items: start;
        gap: 1.25rem;
        min-height: auto;
    }
    .pms-dashboard-main {
        grid-template-columns: 1fr;
    }
    .pms-dashboard-grid,
    .pms-kpi-strip--dashboard {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 820px) {
    .pms-dashboard-header {
        align-items: stretch;
        flex-direction: column;
    }
    .pms-dashboard-controls {
        justify-content: space-between;
    }
    /* On small screens the sidebar is an off-canvas drawer over the content
       (shell.js starts it collapsed there): the old stacked "topbar/sidebar/content"
       rows pushed the content more than a screen down and the collapsed rail still
       reserved a tall empty band. */
    .pms-shell,
    .pms-shell--collapsed {
        grid-template-columns: 1fr;
        grid-template-areas: "topbar" "content";
    }
    .pms-sidebar {
        position: fixed;
        inset-block-start: var(--pms-topbar-h, 52px);
        inset-inline-start: 0;
        z-index: 60;
        width: min(300px, 85vw);
        max-width: 85vw;
        height: calc(100vh - var(--pms-topbar-h, 52px));
        max-height: none;
        overflow-y: auto;
        border-inline-end: 1px solid var(--pms-border);
    }
    .pms-shell--collapsed .pms-sidebar {
        display: none;
    }
}

@media (max-width: 720px) {
    .pms-dashboard-page {
        gap: 0.75rem;
    }
    .pms-dashboard-header,
    .pms-dashboard-card,
    .pms-kpi-strip--dashboard .pms-kpi-tile {
        padding: 0.875rem;
    }
    .pms-dashboard-grid,
    .pms-kpi-strip--dashboard {
        grid-template-columns: 1fr;
    }
    .pms-dashboard-card--wide {
        min-height: auto;
    }
    .pms-chart-canvas,
    .pms-dashboard-card--wide .pms-chart-canvas {
        height: 16rem;
    }
    .pms-dashboard-donut-wrap {
        align-items: flex-start;
        flex-direction: column;
    }
    .pms-dashboard-controls {
        flex-direction: column;
        align-items: stretch;
    }
    .pms-segmented {
        width: 100%;
    }
    .pms-segmented-item {
        flex: 1;
        min-width: 0;
    }
    .pms-home-shell {
        padding-top: 1rem;
    }
    .pms-home-quick-actions {
        grid-template-columns: 1fr;
    }
    .pms-home-search {
        grid-template-columns: auto minmax(0, 1fr);
    }
    .pms-home-search-kbd {
        display: none;
    }
    .pms-home-search-submit {
        grid-column: 1 / -1;
    }
    .pms-home-workbench {
        grid-template-columns: 1fr;
    }
}

/* ══════════════════════════════════════════════════════════
   EMIL DESIGN-ENGINEERING PASS
   Shared polish for every application surface. Motion stays
   fast, interruptible, and limited to interaction feedback.
══════════════════════════════════════════════════════════ */
:root {
    --pms-ease-out: cubic-bezier(0.23, 1, 0.32, 1);
    --pms-ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
    --pms-ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
    --pms-duration-press: 120ms;
    --pms-duration-fast: 140ms;
    --pms-duration-ui: 180ms;
    --pms-radius-control: 8px;
    --pms-radius-panel: 11px;
}

html {
    color-scheme: light;
    background: var(--pms-canvas);
}

html[data-theme="dark"] {
    color-scheme: dark;
}

body {
    background: var(--pms-canvas);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

button,
input,
select,
textarea {
    font: inherit;
}

::selection {
    background: color-mix(in srgb, var(--pms-accent) 24%, transparent);
}

h1,
h2,
h3 {
    color: var(--pms-fg);
    text-wrap: balance;
}

h1 {
    letter-spacing: -0.028em;
    line-height: 1.14;
}

h2,
h3 {
    letter-spacing: -0.016em;
}

.pms-main {
    padding: clamp(1rem, 2.2vw, 1.6rem) clamp(1rem, 2.5vw, 2rem);
    background: var(--pms-canvas);
}

.pms-shell {
    transition: grid-template-columns var(--pms-duration-ui) var(--pms-ease-out);
}

/* Shell and navigation */
.pms-topbar {
    padding-inline: clamp(0.75rem, 2vw, 1.25rem);
    background: color-mix(in srgb, var(--pms-bg) 94%, transparent);
    border-bottom-color: color-mix(in srgb, var(--pms-border) 88%, transparent);
    box-shadow: 0 1px 0 color-mix(in srgb, var(--pms-border) 45%, transparent);
}

.pms-topbar-title {
    letter-spacing: -0.018em;
}

.pms-topbar-toggle,
.pms-topbar-btn {
    min-width: 2.25rem;
    min-height: 2.25rem;
    align-items: center;
    justify-content: center;
    border-radius: var(--pms-radius-control);
    transition:
        transform var(--pms-duration-press) var(--pms-ease-out),
        background-color var(--pms-duration-fast) var(--pms-ease-out),
        border-color var(--pms-duration-fast) var(--pms-ease-out),
        color var(--pms-duration-fast) var(--pms-ease-out);
}

.pms-topbar-toggle {
    padding: 0.45rem;
}

.pms-sidebar {
    background: var(--pms-bg);
    border-color: var(--pms-border);
    scrollbar-color: var(--pms-border-strong) transparent;
}

.pms-brand {
    min-height: 3.75rem;
    padding-inline: 0.75rem;
}

.pms-brand-badge {
    border-radius: var(--pms-radius-control);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, #fff 16%, transparent);
}

.pms-nav-item,
.pms-nav-group-toggle {
    min-height: 2.25rem;
    border-radius: var(--pms-radius-control);
    transition:
        transform var(--pms-duration-press) var(--pms-ease-out),
        background-color var(--pms-duration-fast) var(--pms-ease-out),
        color var(--pms-duration-fast) var(--pms-ease-out);
}

.pms-nav-item.active {
    background: color-mix(in srgb, var(--pms-accent) 12%, var(--pms-bg));
    box-shadow: inset 2px 0 0 var(--pms-accent);
}

[dir="rtl"] .pms-nav-item.active {
    box-shadow: inset -2px 0 0 var(--pms-accent);
}

.pms-nav-group-toggle {
    margin-top: 0.625rem;
}

.pms-nav-chevron {
    transition: transform var(--pms-duration-fast) var(--pms-ease-out);
}

.pms-nav-bottom {
    background: color-mix(in srgb, var(--pms-bg-alt) 68%, var(--pms-bg));
}

/* Page surfaces */
.pms-editor-card,
.pms-filter-panel,
.pms-directory-table-wrap,
.pms-split-list,
.pms-split-section,
.pms-dashboard-header,
.pms-dashboard-card,
.pms-kpi-tile,
.pms-home-command-panel,
.pms-home-panel {
    border-color: var(--pms-border);
    border-radius: var(--pms-radius-panel);
    box-shadow: var(--pms-shadow-sm);
}

.pms-editor-card,
.pms-split-section,
.pms-dashboard-card,
.pms-kpi-tile,
.pms-home-panel {
    background: var(--pms-bg);
}

.pms-editor-card {
    padding: clamp(1rem, 2vw, 1.35rem);
}

.pms-editor-header h1,
.pms-directory-heading h1 {
    font-size: clamp(1.4rem, 2.2vw, 1.75rem);
}

.pms-filter-panel {
    padding: 0.875rem;
    background: color-mix(in srgb, var(--pms-bg-alt) 78%, var(--pms-bg));
}

.pms-directory-heading-icon {
    border-radius: var(--pms-radius-panel);
    box-shadow: var(--pms-shadow-sm);
}

.pms-directory-stats div {
    border-radius: var(--pms-radius-control);
    box-shadow: var(--pms-shadow-sm);
}

/* Form controls */
.pms-form {
    gap: 1rem 1.25rem;
}

.pms-form label,
.pms-filter-panel label {
    gap: 0.35rem;
    color: var(--pms-fg-muted);
    font-size: 0.78rem;
    font-weight: 650;
}

.pms-form label > input:not([type="checkbox"]):not([type="radio"]):not(.e-input),
.pms-form label > select,
.pms-form label > textarea,
.pms-filter-panel label > input:not([type="checkbox"]):not([type="radio"]):not(.e-input),
.pms-lookup-input,
.pms-split-list-head input {
    min-height: 2.5rem;
    padding: 0.5rem 0.7rem;
    border: 1px solid var(--pms-border);
    border-radius: var(--pms-radius-control);
    background: var(--pms-bg);
    color: var(--pms-fg);
    box-shadow: inset 0 1px 1px color-mix(in srgb, #000 3%, transparent);
    transition:
        border-color var(--pms-duration-fast) var(--pms-ease-out),
        box-shadow var(--pms-duration-fast) var(--pms-ease-out),
        background-color var(--pms-duration-fast) var(--pms-ease-out);
}

.pms-form label > textarea {
    line-height: 1.5;
}

.pms-form input::placeholder,
.pms-form textarea::placeholder,
.pms-filter-panel input::placeholder,
.pms-lookup-input::placeholder {
    color: color-mix(in srgb, var(--pms-fg-muted) 76%, transparent);
}

.pms-form label > input:not([type="checkbox"]):not([type="radio"]):not(.e-input):focus,
.pms-form label > select:focus,
.pms-form label > textarea:focus,
.pms-filter-panel label > input:not([type="checkbox"]):not([type="radio"]):not(.e-input):focus,
.pms-lookup-input:focus,
.pms-split-list-head input:focus {
    outline: none;
    border-color: var(--pms-accent);
    background: var(--pms-bg);
    box-shadow: 0 0 0 3px var(--pms-focus-ring);
}

.pms-date-input.e-control-wrapper.e-input-group {
    min-height: 2.5rem;
    border-radius: var(--pms-radius-control);
    transition:
        border-color var(--pms-duration-fast) var(--pms-ease-out),
        box-shadow var(--pms-duration-fast) var(--pms-ease-out);
}

.pms-date-input.e-control-wrapper.e-input-group.e-input-focus {
    box-shadow: 0 0 0 3px var(--pms-focus-ring);
}

:where(input, select, textarea):disabled,
:where(input, select, textarea)[readonly],
.pms-party-fieldset[disabled] input,
.pms-party-fieldset[disabled] select,
.pms-party-fieldset[disabled] textarea {
    border-color: color-mix(in srgb, var(--pms-border) 78%, transparent);
    background: color-mix(in srgb, var(--pms-bg-alt) 82%, var(--pms-bg));
    color: var(--pms-fg-muted);
    box-shadow: none;
    cursor: not-allowed;
    opacity: 0.72;
}

:where(input[type="checkbox"], input[type="radio"]) {
    accent-color: var(--pms-accent);
}

.valid.modified:not([type="checkbox"]) {
    outline: none;
    border-color: color-mix(in srgb, var(--pms-success) 62%, var(--pms-border));
}

.invalid:not([type="checkbox"]) {
    outline: none;
    border-color: var(--pms-danger);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--pms-danger) 14%, transparent);
}

.validation-message {
    margin-top: 0.15rem;
    color: var(--pms-danger);
    font-size: 0.75rem;
    font-weight: 600;
}

/* Buttons and pressable controls */
.pms-btn {
    min-height: 2.375rem;
    justify-content: center;
    padding: 0.45rem 0.9rem;
    border-radius: var(--pms-radius-control);
    font-weight: 650;
    line-height: 1.2;
    box-shadow: 0 1px 1px color-mix(in srgb, #000 5%, transparent);
    transition:
        transform var(--pms-duration-press) var(--pms-ease-out),
        opacity var(--pms-duration-fast) var(--pms-ease-out),
        background-color var(--pms-duration-fast) var(--pms-ease-out),
        border-color var(--pms-duration-fast) var(--pms-ease-out),
        color var(--pms-duration-fast) var(--pms-ease-out),
        box-shadow var(--pms-duration-fast) var(--pms-ease-out);
}

.pms-btn-primary {
    box-shadow:
        0 1px 1px color-mix(in srgb, #000 8%, transparent),
        inset 0 1px 0 color-mix(in srgb, #fff 16%, transparent);
}

.pms-btn-secondary,
.pms-btn-ghost,
.pms-btn-link {
    box-shadow: none;
}

.pms-btn-sm {
    min-height: 2rem;
    padding: 0.3rem 0.65rem;
}

.pms-btn:disabled,
.pms-btn[aria-disabled="true"] {
    opacity: 0.48;
    box-shadow: none;
    cursor: not-allowed;
    transform: none;
}

.pms-btn:not(:disabled):active,
.pms-topbar-btn:not(:disabled):active,
.pms-topbar-toggle:not(:disabled):active,
.pms-nav-item:active,
.pms-nav-group-toggle:not(:disabled):active,
.pms-segmented-item:not(:disabled):active,
.pms-lookup-clear:not(:disabled):active,
.pms-lookup-item:not(:disabled):active,
.pms-split-item:not(:disabled):active,
.pms-home-search-submit:not(:disabled):active,
.pms-home-result:not(:disabled):active,
.pms-home-quick-action:not(:disabled):active,
.pms-home-card:active,
.pms-home-link-list a:active,
.pms-report-card:active,
.pms-inline-clear:not(:disabled):active {
    transform: scale(0.97);
}

/* Tables and dense data views */
.pms-grid {
    border: 1px solid var(--pms-border);
    border-collapse: separate;
    border-spacing: 0;
    border-radius: var(--pms-radius-panel);
    overflow: hidden;
    background: var(--pms-bg);
    box-shadow: var(--pms-shadow-sm);
}

.pms-grid thead tr {
    background: color-mix(in srgb, var(--pms-bg-alt) 86%, var(--pms-bg));
    color: var(--pms-fg-muted);
}

.pms-grid th {
    padding-block: 0.65rem;
    border-bottom: 1px solid var(--pms-border);
    font-size: 0.69rem;
    font-weight: 750;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.pms-grid td {
    padding-block: 0.58rem;
}

.pms-grid tbody tr {
    transition: background-color var(--pms-duration-fast) var(--pms-ease-out);
}

.pms-grid tbody tr:nth-child(even) {
    background: color-mix(in srgb, var(--pms-bg-alt) 48%, var(--pms-bg));
}

.pms-grid tbody tr:last-child td {
    border-bottom: 0;
}

.pms-syncfusion-grid.e-grid {
    background: var(--pms-bg);
}

.pms-syncfusion-grid .e-gridheader {
    background: color-mix(in srgb, var(--pms-bg-alt) 86%, var(--pms-bg));
}

.pms-syncfusion-grid .e-headertext {
    font-size: 0.69rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

/* Master-detail workspaces */
.pms-split {
    gap: 1.125rem;
}

.pms-split-list {
    background: var(--pms-bg);
}

.pms-split-list-head {
    background: color-mix(in srgb, var(--pms-bg-alt) 72%, var(--pms-bg));
}

.pms-party-master-search {
    min-height: 2.5rem;
    border-radius: var(--pms-radius-control);
    background: var(--pms-bg);
    transition:
        border-color var(--pms-duration-fast) var(--pms-ease-out),
        box-shadow var(--pms-duration-fast) var(--pms-ease-out);
}

.pms-party-master-search:focus-within {
    border-color: var(--pms-accent);
    box-shadow: 0 0 0 3px var(--pms-focus-ring);
}

.pms-party-master-toolbar,
.pms-party-detail-toolbar {
    background: var(--pms-bg);
}

.pms-party-grid-row,
.pms-record-grid-row,
.pms-split-item {
    transition:
        background-color var(--pms-duration-fast) var(--pms-ease-out),
        border-color var(--pms-duration-fast) var(--pms-ease-out);
}

.pms-party-grid-row.active,
.pms-record-grid-row.active {
    background: color-mix(in srgb, var(--pms-accent) 10%, var(--pms-bg));
}

.pms-party-grid-select,
.pms-record-grid-select,
.pms-party-row-menu summary,
.pms-party-menu-action,
.pms-inline-clear {
    transition:
        transform var(--pms-duration-press) var(--pms-ease-out),
        background-color var(--pms-duration-fast) var(--pms-ease-out),
        color var(--pms-duration-fast) var(--pms-ease-out);
}

.pms-party-row-popover {
    border-radius: var(--pms-radius-panel);
    border-color: var(--pms-border-strong);
    box-shadow: var(--pms-shadow-md);
}

.pms-party-row-menu[open] .pms-party-row-popover {
    opacity: 1;
    transform: translateY(0) scale(1);
    transition:
        opacity var(--pms-duration-fast) var(--pms-ease-out),
        transform var(--pms-duration-fast) var(--pms-ease-out);
}

@starting-style {
    .pms-party-row-menu[open] .pms-party-row-popover {
        opacity: 0;
        transform: translateY(-4px) scale(0.98);
    }
}

.pms-party-detail-empty {
    min-height: min(55vh, 32rem);
    border-radius: var(--pms-radius-panel);
    background: color-mix(in srgb, var(--pms-bg-alt) 54%, transparent);
}

.pms-party-detail-empty p {
    max-width: 28rem;
}

.pms-party-inactive-banner,
.pms-party-notice,
.pms-errors,
.pms-dashboard-alert {
    border-radius: var(--pms-radius-control);
}

.pms-party-fieldset legend {
    margin-bottom: 0.875rem;
    letter-spacing: -0.012em;
}

.pms-record-detail-grid {
    border-radius: var(--pms-radius-panel);
    background: var(--pms-bg);
    box-shadow: var(--pms-shadow-sm);
}

.pms-record-detail-field {
    background: var(--pms-bg);
}

/* Dashboard, home, reports, and empty states */
.pms-dashboard-header {
    box-shadow: var(--pms-shadow-sm);
}

.pms-dashboard-card,
.pms-kpi-strip--dashboard .pms-kpi-tile {
    box-shadow: var(--pms-shadow-sm);
}

.pms-segmented-item {
    transition:
        transform var(--pms-duration-press) var(--pms-ease-out),
        background-color var(--pms-duration-fast) var(--pms-ease-out),
        color var(--pms-duration-fast) var(--pms-ease-out),
        box-shadow var(--pms-duration-fast) var(--pms-ease-out);
}

.pms-segmented-item.active {
    box-shadow: 0 2px 7px color-mix(in srgb, var(--pms-accent) 24%, transparent);
}

.pms-home-search {
    transition:
        border-color var(--pms-duration-fast) var(--pms-ease-out),
        box-shadow var(--pms-duration-fast) var(--pms-ease-out),
        background-color var(--pms-duration-fast) var(--pms-ease-out);
}

.pms-home-search:focus-within {
    box-shadow: 0 0 0 3px var(--pms-focus-ring);
}

.pms-home-search-submit,
.pms-home-result,
.pms-home-quick-action,
.pms-home-card,
.pms-home-link-list a,
.pms-report-card {
    transition:
        transform var(--pms-duration-press) var(--pms-ease-out),
        background-color var(--pms-duration-fast) var(--pms-ease-out),
        border-color var(--pms-duration-fast) var(--pms-ease-out),
        color var(--pms-duration-fast) var(--pms-ease-out),
        box-shadow var(--pms-duration-fast) var(--pms-ease-out);
}

.pms-home-card,
.pms-report-card {
    background: var(--pms-bg);
    box-shadow: var(--pms-shadow-sm);
}

.pms-report-card {
    border-radius: var(--pms-radius-panel);
}

.pms-empty-state {
    min-height: 13rem;
    margin-block: 0.5rem;
    padding: 2rem 1rem;
    border: 1px dashed var(--pms-border-strong);
    border-radius: var(--pms-radius-panel);
    background: color-mix(in srgb, var(--pms-bg-alt) 62%, transparent);
}

.pms-empty-state-icon {
    opacity: 0.72;
}

.pms-pager {
    min-height: 3rem;
}

/* Keyboard focus stays obvious without overpowering pointer use. */
:where(
    .pms-btn,
    .pms-topbar-btn,
    .pms-topbar-toggle,
    .pms-nav-item,
    .pms-nav-group-toggle,
    .pms-segmented-item,
    .pms-lookup-clear,
    .pms-lookup-item,
    .pms-split-item,
    .pms-party-grid-select,
    .pms-record-grid-select,
    .pms-party-row-menu summary,
    .pms-party-menu-action,
    .pms-home-search-submit,
    .pms-home-result,
    .pms-home-quick-action,
    .pms-home-card,
    .pms-home-link-list a,
    .pms-report-card,
    .pms-inline-clear
):focus-visible {
    outline: 2px solid var(--pms-accent);
    outline-offset: 2px;
}

/* Hover motion only appears on devices with a real pointing hover state. */
@media (hover: hover) and (pointer: fine) {
    .pms-topbar-toggle:hover,
    .pms-topbar-btn:hover {
        background: var(--pms-bg-alt);
        color: var(--pms-fg);
    }

    .pms-nav-item:hover,
    .pms-nav-group-toggle:hover {
        background: color-mix(in srgb, var(--pms-accent) 8%, var(--pms-bg));
    }

    .pms-btn-primary:hover:not(:disabled),
    .pms-btn-danger:hover:not(:disabled) {
        opacity: 0.92;
        box-shadow:
            0 3px 8px color-mix(in srgb, #000 10%, transparent),
            inset 0 1px 0 color-mix(in srgb, #fff 16%, transparent);
    }

    .pms-btn-secondary:hover:not(:disabled),
    .pms-btn-ghost:hover:not(:disabled),
    .pms-btn-view:hover:not(:disabled) {
        border-color: var(--pms-border-strong);
        box-shadow: var(--pms-shadow-sm);
    }

    .pms-grid tbody tr:hover,
    .pms-syncfusion-grid .e-row:hover .e-rowcell,
    .pms-party-grid-row:not(.active):hover,
    .pms-record-grid-row:not(.active):hover,
    .pms-split-item:not(.active):hover {
        background: color-mix(in srgb, var(--pms-accent) 6%, var(--pms-bg));
    }

    .pms-report-card:hover {
        border-color: color-mix(in srgb, var(--pms-accent) 58%, var(--pms-border));
        box-shadow: var(--pms-shadow-md);
        transform: translateY(-1px);
    }

    /* Home surfaces hover flat: recolour only, no lift, no shadow —
       elevation on this page comes from the canvas contrast alone. */
    .pms-home-card:hover {
        border-color: color-mix(in srgb, var(--pms-accent) 58%, var(--pms-border));
        background: color-mix(in srgb, var(--pms-accent) 4%, var(--pms-bg));
    }

    .pms-home-result:hover,
    .pms-home-quick-action:hover,
    .pms-home-link-list a:hover {
        border-color: color-mix(in srgb, var(--pms-accent) 38%, var(--pms-border));
        background: color-mix(in srgb, var(--pms-accent) 7%, var(--pms-bg));
    }
}

@media (max-width: 720px) {
    .pms-main {
        padding: 0.875rem;
    }

    .pms-topbar {
        padding-inline: 0.625rem;
    }

    .pms-topbar-user {
        display: none;
    }

    .pms-topbar-title {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .pms-filter-panel {
        align-items: stretch;
    }

    .pms-filter-panel label {
        flex: 1 1 12rem;
    }

    .pms-form-actions .pms-btn {
        width: 100%;
    }
}

/* ══════════════════════════════════════════════════════════
   REDUCED MOTION
══════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    .pms-spinner-ring         { animation: none; opacity: 0.7; }
    .pms-shell                { transition: none; }
    .pms-skip-link            { transition: none; }
    .pms-nav-item,
    .pms-report-card,
    .pms-btn,
    .pms-topbar-btn,
    .pms-topbar-toggle,
    .pms-auth-input,
    .pms-auth-theme,
    .pms-auth-submit,
    .pms-auth-lang a,
    .pms-auth-reveal,
    .pms-lookup-input,
    .pms-lookup-item,
    .pms-segmented-item      { transition: none; }
    .pms-auth-card           { animation: none; }
}

/* ══════════════════════════════════════════════════════════
   PRINT STYLES
══════════════════════════════════════════════════════════ */
.pms-capital-workspace {
    display: contents;
}

.pms-print-sheet {
    display: none;
}

@media print {
    /* ── Hide navigation chrome ── */
    .pms-sidebar,
    .pms-topbar,
    .pms-skip-link,
    .pms-filter-panel,
    .pms-action-bar,
    .pms-kpi-strip,
    #blazor-error-ui {
        display: none !important;
    }

    /* ── Full-width content ── */
    .pms-shell  { display: block !important; }
    .pms-main   { padding: 0 !important; max-width: 100% !important; }

    /* ── Colors and fonts ── */
    body {
        background: #fff !important;
        color: #000 !important;
        font-size: 11pt;
    }
    a { color: #000 !important; text-decoration: underline; }

    /* ── Data grid ── */
    .pms-grid {
        border-collapse: collapse !important;
        width: 100% !important;
        font-size: 10pt;
    }
    .pms-grid thead tr {
        background: #e8e8e8 !important;
        color: #000 !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
    .pms-grid th,
    .pms-grid td {
        border: 1px solid #bbb !important;
        padding: 0.25rem 0.5rem !important;
    }
    .pms-grid tbody tr:nth-child(even) {
        background: #f5f5f5 !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    /* ── Page breaks ── */
    .pms-grid tr { page-break-inside: avoid; }
    h1, h2, h3  { page-break-after: avoid; }
    .pms-dl     { page-break-inside: avoid; }

    /* ── Definition list ── */
    .pms-dl { border: 1px solid #ccc; }
    .pms-dl dt, .pms-dl dd { border-bottom-color: #ddd !important; }

    /* ── Capital receipt and journal ── */
    .pms-capital-workspace {
        display: block;
    }
    .pms-capital-workspace-printing > .pms-record-workspace {
        display: none !important;
    }
    .pms-capital-workspace-printing > .pms-print-sheet {
        display: block !important;
        max-width: 190mm;
        margin: 0 auto;
        color: #000;
    }
    .pms-print-header {
        padding-bottom: 1rem;
        border-bottom: 2px solid #222;
        text-align: center;
    }
    .pms-print-header p {
        margin: 0 0 0.25rem;
        color: #555;
        font-size: 9pt;
        font-weight: 700;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }
    .pms-print-header h1 {
        margin: 0 0 0.35rem;
        font-size: 20pt;
    }
    .pms-print-details {
        display: grid;
        grid-template-columns: 42mm 1fr;
        margin: 1.5rem 0 0;
        border: 1px solid #bbb;
    }
    .pms-print-details dt,
    .pms-print-details dd {
        margin: 0;
        padding: 0.55rem 0.75rem;
        border-bottom: 1px solid #ddd;
    }
    .pms-print-details dt {
        background: #f1f1f1;
        font-weight: 700;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
    .pms-print-details dt:last-of-type,
    .pms-print-details dd:last-of-type {
        border-bottom: 0;
    }
    .pms-print-meta {
        margin: 1rem 0;
        font-weight: 700;
    }
    .pms-print-signatures {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 3rem;
        margin-top: 4rem;
    }
    .pms-print-signatures span {
        padding-top: 0.5rem;
        border-top: 1px solid #555;
        text-align: center;
    }
}