/* UI v2 — cohesive NOC application skin.
   This file intentionally follows style.css and normalizes its historical cascade. */

/* 1. Foundations and tokens */
body.ui-v2 {
    --background: 210 25% 97%;
    --foreground: 218 36% 15%;
    --card: 0 0% 100%;
    --card-foreground: 218 36% 15%;
    --popover: 0 0% 100%;
    --popover-foreground: 218 36% 15%;
    --primary: 211 78% 42%;
    --primary-foreground: 0 0% 100%;
    --secondary: 214 28% 94%;
    --secondary-foreground: 218 31% 21%;
    --muted: 214 27% 95%;
    --muted-foreground: 215 16% 43%;
    --accent: 211 75% 94%;
    --accent-foreground: 211 78% 32%;
    --destructive: 0 72% 51%;
    --destructive-foreground: 0 0% 100%;
    --border: 214 25% 86%;
    --input: 214 25% 80%;
    --ring: 211 78% 48%;
    --success: 158 64% 34%;
    --success-soft: 153 52% 94%;
    --warning: 36 87% 45%;
    --warning-soft: 42 95% 92%;
    --info: 211 78% 48%;
    --info-soft: 211 80% 95%;
    --violet: 252 60% 54%;
    --violet-soft: 250 75% 96%;
    --rose-soft: 0 86% 96%;
    --radius: .5rem;
    --radius-sm: .375rem;
    --radius-lg: .75rem;
    --shadow-card: 0 1px 2px rgba(15, 23, 42, .05), 0 3px 10px rgba(15, 23, 42, .04);
    --shadow-soft: 0 16px 40px rgba(15, 23, 42, .14);
    --sidebar-width: 16rem;
    --topbar-height: 4.25rem;
    --layer-content: 1;
    --layer-sidebar: 30;
    --layer-header: 40;
    --layer-backdrop: 50;
    --layer-drawer: 60;
    --layer-toast: 70;
    --layer-modal: 80;
    margin: 0;
    background: hsl(var(--background));
    color: hsl(var(--foreground));
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
    font-size: 15px;
    line-height: 1.5;
}

body.ui-v2.theme-dark {
    --background: 220 28% 8%;
    --foreground: 210 25% 94%;
    --card: 220 24% 11%;
    --card-foreground: 210 25% 94%;
    --popover: 220 23% 12%;
    --popover-foreground: 210 25% 94%;
    --primary: 210 90% 65%;
    --primary-foreground: 222 40% 10%;
    --secondary: 219 19% 17%;
    --secondary-foreground: 210 25% 94%;
    --muted: 219 20% 15%;
    --muted-foreground: 215 15% 66%;
    --accent: 215 32% 19%;
    --accent-foreground: 210 90% 72%;
    --destructive: 0 72% 60%;
    --border: 218 18% 22%;
    --input: 218 18% 28%;
    --ring: 210 90% 65%;
    --success-soft: 157 42% 15%;
    --warning-soft: 37 48% 16%;
    --info-soft: 213 42% 18%;
    --violet-soft: 250 30% 18%;
    --rose-soft: 0 38% 17%;
    --shadow-card: 0 1px 2px rgba(0, 0, 0, .3), 0 4px 12px rgba(0, 0, 0, .16);
    --shadow-soft: 0 20px 48px rgba(0, 0, 0, .42);
}

body.ui-v2 *, body.ui-v2 *::before, body.ui-v2 *::after { box-sizing: border-box; }
body.ui-v2::before, body.ui-v2::after,
body.ui-v2 .app-shell::before, body.ui-v2 .app-shell::after,
body.ui-v2 .main-shell::before, body.ui-v2 .main-shell::after,
body.ui-v2 .content-shell::before, body.ui-v2 .content-shell::after,
body.ui-v2 .sidebar::before, body.ui-v2 .sidebar::after,
body.ui-v2 .topbar::before, body.ui-v2 .topbar::after,
body.ui-v2 .panel::before, body.ui-v2 .panel::after { content: none !important; display: none !important; }
body.ui-v2 h1, body.ui-v2 h2, body.ui-v2 h3, body.ui-v2 h4 { font-family: inherit; letter-spacing: -.02em; }
body.ui-v2 :focus-visible { outline: 2px solid hsl(var(--ring)); outline-offset: 2px; }
body.ui-v2 [hidden] { display: none !important; }
body.ui-v2 .icon { width: 1rem; height: 1rem; }

/* 2. Application frame and layering */
body.ui-v2 .app-shell { display: flex; min-height: 100dvh; background: hsl(var(--background)); }
body.ui-v2 .sidebar {
    position: sticky; inset: 0 auto auto 0; z-index: var(--layer-sidebar);
    width: var(--sidebar-width); min-width: var(--sidebar-width); height: 100dvh;
    display: flex; flex-direction: column; overflow: hidden;
    border: 0; border-right: 1px solid hsl(var(--border));
    background: hsl(221 32% 13%); color: hsl(210 25% 94%);
    box-shadow: none; backdrop-filter: none;
}
body.ui-v2.theme-dark .sidebar { background: hsl(222 33% 7%); }
body.ui-v2 .main-shell { min-width: 0; flex: 1; display: flex; flex-direction: column; }
body.ui-v2 .topbar {
    position: sticky; top: 0; z-index: var(--layer-header); min-height: var(--topbar-height);
    display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    padding: .65rem clamp(1rem, 2vw, 1.75rem); border: 0; border-bottom: 1px solid hsl(var(--border));
    background: hsl(var(--card) / .96); box-shadow: 0 1px 0 rgba(15,23,42,.02); backdrop-filter: blur(12px);
}
body.ui-v2 .content-shell { position: relative; z-index: var(--layer-content); flex: 1; width: 100%; max-width: 100rem; margin: 0 auto; padding: 1.5rem clamp(1rem, 2vw, 2rem) 2.5rem; }
body.ui-v2 .sidebar-backdrop { z-index: var(--layer-backdrop); background: rgba(2, 6, 23, .62); backdrop-filter: blur(2px); }

/* 3. Sidebar and topbar navigation */
body.ui-v2 .sidebar-brand { min-height: var(--topbar-height); padding: .75rem 1rem; border-bottom: 1px solid rgba(255,255,255,.1); gap: .65rem; }
body.ui-v2 .sidebar-brand-link { gap: .75rem; min-width: 0; }
body.ui-v2 .sidebar-logo { width: 2.35rem; height: 2.35rem; border-radius: var(--radius-sm); background: white; padding: .25rem; }
body.ui-v2 .brand-mark-image { display: block; width: 100%; height: 100%; object-fit: contain; }
body.ui-v2 .sidebar-brand h1 { color: white; font-size: .96rem; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body.ui-v2 .sidebar-eyebrow { color: hsl(211 90% 72%); font-size: .65rem; }
body.ui-v2 .sidebar-brand-note { display: none; }
body.ui-v2 .sidebar-nav { flex: 1; overflow-y: auto; padding: .8rem .7rem; }
body.ui-v2 .nav-group { gap: .15rem; margin: 0 0 .2rem; }
body.ui-v2 .nav-link { min-height: 2.65rem; margin: 0 0 .2rem; padding: .55rem .65rem; gap: .7rem; border: 1px solid transparent; border-radius: var(--radius-sm); color: hsl(215 18% 72%); font-size: .88rem; font-weight: 600; box-shadow: none; }
body.ui-v2 .nav-link-main { display: flex; align-items: center; gap: .7rem; min-width: 0; flex: 1; }
body.ui-v2 .nav-link:hover { color: white; background: rgba(255,255,255,.07); }
body.ui-v2 .nav-link.active { color: white; background: hsl(211 78% 42%); border-color: transparent; box-shadow: none; }
body.ui-v2 .nav-icon-wrap { width: 1.8rem; height: 1.8rem; background: transparent; border-radius: var(--radius-sm); }
body.ui-v2 .nav-link.active .nav-icon-wrap { background: rgba(255,255,255,.12); color: white; }
body.ui-v2 .nav-chevron { margin-left: auto; transition: transform .18s ease; }
body.ui-v2 .nav-group[open] .nav-chevron { transform: rotate(180deg); }
body.ui-v2 .nav-submenu { gap: .1rem; margin: .1rem 0 .35rem 2.5rem; padding: 0 0 0 .65rem; border-left: 1px solid rgba(255,255,255,.14); }
body.ui-v2 .nav-sublink { min-height: 2rem; padding: .4rem .55rem; color: hsl(215 16% 68%); border-radius: var(--radius-sm); font-size: .8rem; }
body.ui-v2 .nav-sublink:hover, body.ui-v2 .nav-sublink.active { color: white; background: rgba(255,255,255,.08); }
body.ui-v2 .nav-subicon { display: none; }
body.ui-v2 .sidebar-footer { gap: .45rem; padding: .8rem 1rem; border-top: 1px solid rgba(255,255,255,.1); }
body.ui-v2 .sidebar-meta { color: hsl(215 15% 61%); font-size: .65rem; }
body.ui-v2 .drawer-account { display: none; }
body.ui-v2 .sidebar-collapse-toggle, body.ui-v2 .sidebar-close, body.ui-v2 .sidebar-toggle { border: 1px solid hsl(var(--border)); border-radius: var(--radius-sm); background: hsl(var(--card)); color: hsl(var(--foreground)); box-shadow: none; }
body.ui-v2 .sidebar-collapse-toggle { color: hsl(215 18% 78%); background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.14); }
body.ui-v2 .topbar-title-group { gap: .75rem; }
body.ui-v2 .topbar-eyebrow { font-size: .65rem; color: hsl(var(--muted-foreground)); }
body.ui-v2 .topbar h2 { font-size: 1.05rem; font-weight: 700; }
body.ui-v2 .topbar-actions { gap: .6rem; flex-wrap: nowrap; }
body.ui-v2 .theme-switch, body.ui-v2 .user-menu-trigger { min-height: 2.45rem; border: 1px solid hsl(var(--border)); border-radius: var(--radius-sm); background: hsl(var(--card)); box-shadow: none; }
body.ui-v2 .theme-switch { padding: .25rem .3rem .25rem .7rem; font-size: .8rem; }
body.ui-v2 .theme-switch-thumb { width: 1.75rem; height: 1.75rem; border-radius: var(--radius-sm); }
body.ui-v2 .user-menu-trigger { padding: .25rem .55rem .25rem .3rem; }
body.ui-v2 .user-avatar { width: 1.85rem; height: 1.85rem; border-radius: var(--radius-sm); background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); font-size: .78rem; }
body.ui-v2 .user-chip-name { font-size: .82rem; }
body.ui-v2 .user-chip-role { font-size: .68rem; }
body.ui-v2 .user-menu-dropdown { top: calc(100% + .45rem); width: 15rem; padding: .55rem; border-radius: var(--radius); box-shadow: var(--shadow-soft); z-index: var(--layer-toast); }

/* 4. Page structure, panels, statistics and responsive grids */
body.ui-v2 .page, body.ui-v2 .grid { gap: 1.25rem; }
body.ui-v2 .page-header, body.ui-v2 .section-head { align-items: center; gap: 1rem; }
body.ui-v2 .page-heading { gap: .8rem; }
body.ui-v2 .page-icon { width: 2.65rem; height: 2.65rem; border: 1px solid hsl(var(--border)); border-radius: var(--radius); background: hsl(var(--card)); color: hsl(var(--primary)); box-shadow: var(--shadow-card); }
body.ui-v2 .page-title { font-size: clamp(1.45rem, 2.5vw, 1.9rem); font-weight: 720; letter-spacing: -.035em; }
body.ui-v2 .page-subtitle, body.ui-v2 .muted, body.ui-v2 .helper-text, body.ui-v2 .panel-subtitle { color: hsl(var(--muted-foreground)); }
body.ui-v2 .panel, body.ui-v2 .summary-card, body.ui-v2 .stat-card, body.ui-v2 .mini-card, body.ui-v2 .quick-action-card, body.ui-v2 .hero-panel {
    border: 1px solid hsl(var(--border)); border-radius: var(--radius-lg); background: hsl(var(--card)); box-shadow: var(--shadow-card);
}
body.ui-v2 .panel { padding: 1.15rem; }
body.ui-v2 .panel-head { align-items: center; margin-bottom: 1rem; }
body.ui-v2 .panel-title { font-size: 1rem; font-weight: 700; }
body.ui-v2 .summary-grid, body.ui-v2 .stat-grid, body.ui-v2 .page-grid { gap: 1rem; }
body.ui-v2 .summary-card, body.ui-v2 .stat-card, body.ui-v2 .mini-card { min-height: auto; padding: 1rem; }
body.ui-v2 .summary-card { gap: .65rem; }
body.ui-v2 .summary-card.success, body.ui-v2 .summary-card.danger, body.ui-v2 .summary-card.info, body.ui-v2 .summary-card.warning, body.ui-v2 .summary-card.violet { background: hsl(var(--card)); }
body.ui-v2 .summary-card.success { border-left: 3px solid hsl(var(--success)); }
body.ui-v2 .summary-card.danger { border-left: 3px solid hsl(var(--destructive)); }
body.ui-v2 .summary-card.info { border-left: 3px solid hsl(var(--info)); }
body.ui-v2 .summary-card.warning { border-left: 3px solid hsl(var(--warning)); }
body.ui-v2 .summary-card.violet { border-left: 3px solid hsl(var(--violet)); }
body.ui-v2 .summary-card-icon, body.ui-v2 .quick-action-icon { width: 2.25rem; height: 2.25rem; border-radius: var(--radius-sm); }
body.ui-v2 .summary-card-value, body.ui-v2 .stat-value { font-size: clamp(1.35rem, 2.5vw, 1.8rem); font-family: ui-monospace, "Cascadia Code", monospace; letter-spacing: -.04em; }
body.ui-v2 .mini-grid, body.ui-v2 .quick-action-grid { gap: 1rem; }
body.ui-v2 .mini-card { border-radius: var(--radius); box-shadow: none; }
body.ui-v2 .mini-card-value { font-family: ui-monospace, "Cascadia Code", monospace; }
body.ui-v2 .quick-action-card { border-radius: var(--radius); box-shadow: none; transform: none; }
body.ui-v2 .quick-action-card:hover { transform: none; border-color: hsl(var(--primary) / .45); box-shadow: var(--shadow-card); }
body.ui-v2 .hero-panel { padding: 1.25rem; background: hsl(var(--card)); }
body.ui-v2 .security-banner { background: hsl(var(--info-soft)); }
body.ui-v2 .danger-zone { background: hsl(var(--rose-soft)); border-color: hsl(var(--destructive) / .35); }

/* 5. Forms and controls */
body.ui-v2 .form-grid { gap: 1rem; }
body.ui-v2 .label { margin-bottom: .4rem; color: hsl(var(--foreground)); font-size: .82rem; font-weight: 650; }
body.ui-v2 .input, body.ui-v2 .select, body.ui-v2 .textarea {
    min-height: 2.65rem; padding: .65rem .75rem; border: 1px solid hsl(var(--input)); border-radius: var(--radius-sm);
    background: hsl(var(--card)); color: hsl(var(--foreground)); box-shadow: inset 0 1px 1px rgba(15,23,42,.025);
}
body.ui-v2 .textarea { min-height: 7rem; }
body.ui-v2 .input:hover, body.ui-v2 .select:hover, body.ui-v2 .textarea:hover { border-color: hsl(var(--muted-foreground) / .55); }
body.ui-v2 .input:focus, body.ui-v2 .select:focus, body.ui-v2 .textarea:focus { border-color: hsl(var(--ring)); box-shadow: 0 0 0 3px hsl(var(--ring) / .13); outline: 0; }
body.ui-v2 .input:disabled, body.ui-v2 .select:disabled, body.ui-v2 .textarea:disabled { opacity: .65; cursor: not-allowed; background: hsl(var(--muted)); }
body.ui-v2 .checkbox-list { border-style: solid; border-radius: var(--radius); background: hsl(var(--muted) / .5); }
body.ui-v2 .toolbar-grid { gap: .9rem; }
body.ui-v2 .button { min-height: 2.5rem; padding: .6rem .85rem; border-radius: var(--radius-sm); font-size: .85rem; font-weight: 650; line-height: 1.15; box-shadow: none; transform: none; }
body.ui-v2 .button:hover { transform: none; }
body.ui-v2 .button-primary { border-color: hsl(var(--primary)); background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); }
body.ui-v2 .button-primary:hover { filter: brightness(.94); }
body.ui-v2 .button-secondary { border-color: hsl(var(--border)); background: hsl(var(--card)); }
body.ui-v2 .button-secondary:hover, body.ui-v2 .button-ghost:hover { background: hsl(var(--muted)); }
body.ui-v2 .button-danger { border-color: hsl(var(--destructive)); }
body.ui-v2 .badge { padding: .25rem .5rem; border-radius: 999px; font-size: .7rem; font-weight: 700; }
body.ui-v2 .content-alert, body.ui-v2 .flash, body.ui-v2 .page-note { border-style: solid; border-radius: var(--radius); box-shadow: none; }

/* 6. Data tables and operational lists */
body.ui-v2 .table-wrap { width: 100%; overflow: auto; border: 1px solid hsl(var(--border)); border-radius: var(--radius); }
body.ui-v2 .panel > .table-wrap { margin-top: .25rem; }
body.ui-v2 table { min-width: 42rem; border-collapse: separate; border-spacing: 0; background: hsl(var(--card)); font-size: .86rem; }
body.ui-v2 th, body.ui-v2 td { padding: .75rem .8rem; border-bottom: 1px solid hsl(var(--border)); vertical-align: middle; }
body.ui-v2 thead th { position: sticky; top: 0; z-index: 2; background: hsl(var(--muted)); color: hsl(var(--muted-foreground)); font-size: .68rem; font-weight: 750; letter-spacing: .055em; }
body.ui-v2 tbody tr:last-child td { border-bottom: 0; }
body.ui-v2 tbody tr:hover { background: hsl(var(--accent) / .45); }
body.ui-v2 .table-actions { gap: .4rem; }
body.ui-v2 .table-footer { padding-top: .9rem; }
body.ui-v2 .page-size-button { border-radius: var(--radius-sm); box-shadow: none; }
body.ui-v2 .recent-item, body.ui-v2 .status-row, body.ui-v2 .recent-activity-item { border-color: hsl(var(--border)); }
body.ui-v2 .empty-state { padding: 1.5rem; }

/* 7. Toasts, dropdowns, dialogs and modals */
body.ui-v2 .toast-stack { top: calc(var(--topbar-height) + .75rem); right: 1rem; z-index: var(--layer-toast); width: min(calc(100vw - 2rem), 23rem); pointer-events: none; }
body.ui-v2 .auth-toast-stack { top: 1rem; }
body.ui-v2 .toast-item { padding: .8rem; border: 1px solid hsl(var(--border)); border-left: 3px solid hsl(var(--info)); border-radius: var(--radius); background: hsl(var(--popover)); box-shadow: var(--shadow-soft); pointer-events: none; }
body.ui-v2 .toast-success { border-left-color: hsl(var(--success)); }
body.ui-v2 .toast-warning { border-left-color: hsl(var(--warning)); }
body.ui-v2 .toast-error { border-left-color: hsl(var(--destructive)); }
body.ui-v2 .toast-icon { width: 1.8rem; height: 1.8rem; border-radius: var(--radius-sm); }
body.ui-v2 .toast-close { pointer-events: auto; border-radius: var(--radius-sm); }
body.ui-v2 .modal-shell { z-index: var(--layer-modal); padding: 1rem; }
body.ui-v2 .modal-backdrop { background: rgba(2, 6, 23, .68); backdrop-filter: blur(3px); }
body.ui-v2 .modal-card { width: min(100%, 46rem); max-height: calc(100dvh - 2rem); padding: 1.25rem; border: 1px solid hsl(var(--border)); border-radius: var(--radius-lg); background: hsl(var(--card)); box-shadow: var(--shadow-soft); }
body.ui-v2 .modal-head, body.ui-v2 .dialog-head { padding-bottom: .85rem; margin-bottom: 1rem; border-bottom: 1px solid hsl(var(--border)); }
body.ui-v2 .modal-close, body.ui-v2 .dialog-close { border-radius: var(--radius-sm); background: hsl(var(--card)); }
body.ui-v2 .dialog-card { top: calc(var(--topbar-height) + 1rem); }

/* 8. Authentication */
body.ui-v2 .auth-shell { min-height: 100dvh; padding: 2rem 1rem; background: hsl(var(--background)); }
body.ui-v2 .auth-gradient { background: linear-gradient(135deg, hsl(var(--info-soft)), transparent 55%); opacity: .8; }
body.ui-v2 .auth-grid { display: none; }
body.ui-v2 .auth-stage { width: min(100%, 28rem); }
body.ui-v2 .login-card { gap: 1.35rem; padding: 1.75rem; border: 1px solid hsl(var(--border)); border-radius: var(--radius-lg); background: hsl(var(--card)); box-shadow: var(--shadow-soft); backdrop-filter: none; }
body.ui-v2 .login-header-icon { width: 3.5rem; height: 3.5rem; border-radius: var(--radius); background: hsl(var(--primary)); }

/* 9. Collapsed sidebar */
@media (min-width: 961px) {
    body.ui-v2.sidebar-collapsed .sidebar { width: 4.75rem; min-width: 4.75rem; }
    body.ui-v2.sidebar-collapsed .sidebar-brand { padding-inline: .55rem; }
    body.ui-v2.sidebar-collapsed .sidebar-logo { width: 2rem; height: 2rem; }
    body.ui-v2.sidebar-collapsed .sidebar-nav { padding-inline: .55rem; }
    body.ui-v2.sidebar-collapsed .nav-link { justify-content: center; padding-inline: .45rem; }
}

/* 10. Tablet drawer and mobile bottom navigation */
body.ui-v2 .mobile-nav { display: none; }
@media (max-width: 960px) {
    body.ui-v2.app-layout { padding-bottom: 4.4rem; }
    body.ui-v2 .sidebar {
        position: fixed; top: 0; bottom: 0; left: 0; z-index: var(--layer-drawer); width: min(19rem, 86vw); min-width: 0;
        transform: translateX(-102%); transition: transform .2s ease; box-shadow: var(--shadow-soft);
    }
    body.ui-v2.sidebar-open .sidebar { transform: translateX(0); }
    body.ui-v2 .sidebar-close, body.ui-v2 .sidebar-toggle { display: inline-flex; align-items: center; justify-content: center; }
    body.ui-v2 .sidebar-collapse-toggle { display: none; }
    body.ui-v2 .drawer-account { display: grid; gap: .55rem; padding-top: .65rem; }
    body.ui-v2 .drawer-account .button { width: 100%; }
    body.ui-v2 .topbar { padding-inline: 1rem; }
    body.ui-v2 .content-shell { padding: 1.1rem 1rem 1.75rem; }
    body.ui-v2 .mobile-nav {
        position: fixed; inset: auto 0 0; z-index: var(--layer-header); height: 4.4rem;
        display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; align-items: stretch;
        padding: .35rem max(.35rem, env(safe-area-inset-right)) calc(.35rem + env(safe-area-inset-bottom)) max(.35rem, env(safe-area-inset-left));
        border-top: 1px solid hsl(var(--border)); background: hsl(var(--card) / .98); box-shadow: 0 -4px 20px rgba(15,23,42,.08); backdrop-filter: blur(12px);
    }
    body.ui-v2 .mobile-nav-link { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .1rem; min-width: 0; border-radius: var(--radius-sm); color: hsl(var(--muted-foreground)); font-size: .65rem; font-weight: 650; }
    body.ui-v2 .mobile-nav-link .nav-icon-wrap { width: 1.7rem; height: 1.7rem; background: transparent; }
    body.ui-v2 .mobile-nav-link.active { color: hsl(var(--primary)); background: hsl(var(--accent)); }
    body.ui-v2 .mobile-nav-link.active .nav-icon-wrap { background: transparent; color: inherit; }
    body.ui-v2 .toast-stack { top: calc(var(--topbar-height) + .5rem); left: 1rem; right: 1rem; width: auto; }
}

@media (max-width: 760px) {
    body.ui-v2 .topbar-eyebrow, body.ui-v2 .theme-switch > span:not(.theme-switch-thumb), body.ui-v2 .user-copy { display: none; }
    body.ui-v2 .topbar h2 { font-size: .95rem; }
    body.ui-v2 .page-header, body.ui-v2 .section-head, body.ui-v2 .panel-head { align-items: flex-start; }
    body.ui-v2 .page-actions, body.ui-v2 .panel-actions { width: 100%; }
    body.ui-v2 .page-actions .button, body.ui-v2 .panel-actions .button { flex: 1 1 auto; }
    body.ui-v2 .summary-card, body.ui-v2 .stat-card { grid-column: span 12; }
    body.ui-v2 .mini-grid, body.ui-v2 .quick-action-grid, body.ui-v2 .insight-grid, body.ui-v2 .split-layout, body.ui-v2 .hero-panel { grid-template-columns: 1fr; }
    body.ui-v2 .toolbar-grid { grid-template-columns: 1fr; }
    body.ui-v2 .toolbar-grid > [class*="field-span-"] { grid-column: auto; }
    body.ui-v2 .panel { padding: 1rem; }
    body.ui-v2 .table-footer, body.ui-v2 .table-footer-group { align-items: stretch; }
    body.ui-v2 .modal-shell { align-items: end; padding: 0; }
    body.ui-v2 .modal-card { width: 100%; max-height: 92dvh; border-radius: var(--radius-lg) var(--radius-lg) 0 0; border-bottom: 0; }
}

@media (max-width: 480px) {
    body.ui-v2 .content-shell { padding-inline: .75rem; }
    body.ui-v2 .topbar { padding-inline: .75rem; }
    body.ui-v2 .page-icon { display: none; }
    body.ui-v2 .page-title { font-size: 1.35rem; }
    body.ui-v2 .button-row { align-items: stretch; }
    body.ui-v2 .button-row .button { flex: 1 1 100%; }
    body.ui-v2 .mobile-nav-label { max-width: 3.9rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

@media (prefers-reduced-motion: reduce) {
    body.ui-v2 *, body.ui-v2 *::before, body.ui-v2 *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
