:root {
    color-scheme: light;
    --color-page: #f5f7fb;
    --color-surface: #ffffff;
    --color-surface-raised: #fbfcfe;
    --color-border: #d9e0ea;
    --color-border-strong: #bdc8d8;
    --color-text: #1f2937;
    --color-muted: #667085;
    --color-subtle: #8a97a8;
    --color-brand: #0f766e;
    --color-brand-strong: #115e59;
    --color-brand-soft: #d8f3ef;
    --color-info: #2563eb;
    --color-info-soft: #dbeafe;
    --color-success: #16803c;
    --color-success-soft: #dcfce7;
    --color-warning: #b45309;
    --color-warning-soft: #fef3c7;
    --color-critical: #b42318;
    --color-critical-soft: #fee4e2;
    --shadow-soft: 0 12px 28px rgba(15, 23, 42, 0.08);
    --radius-card: 8px;
    --radius-control: 6px;
    --header-height: 0px;
    --sidebar-width: 280px;
    --sidebar-bg: #191b20;
    --sidebar-bg-deep: #08090c;
    --sidebar-border: rgba(229, 231, 235, 0.16);
    --sidebar-text: #f4f4f5;
    --sidebar-muted: #c6c8ce;
    --sidebar-subtle: #8f949d;
    --sidebar-accent: #f05a54;
    --sidebar-active: rgba(240, 90, 84, 0.16);
    --workspace-header-bg: #111318;
    --workspace-header-bg-deep: #0a0b0f;
    --workspace-header-border: rgba(229, 231, 235, 0.16);
    --workspace-header-text: #f4f4f5;
    --workspace-header-muted: #b7bec8;
    --workspace-header-subtle: #858d9a;
    --workspace-content-bg: #f5f7fb;
    --font-sans: "Segoe UI", "Inter", "Helvetica Neue", Arial, sans-serif;
}

@media (prefers-color-scheme: dark) {
    :root {
        color-scheme: dark;
        --color-page: #151619;
        --color-surface: #1b1d22;
        --color-surface-raised: #22252c;
        --color-border: #393f49;
        --color-border-strong: #505866;
        --color-text: #eef2f7;
        --color-muted: #b9c1cd;
        --color-subtle: #909aa8;
        --color-brand: #2dd4bf;
        --color-brand-strong: #5eead4;
        --color-brand-soft: rgba(45, 212, 191, 0.14);
        --color-info-soft: rgba(37, 99, 235, 0.18);
        --color-success-soft: rgba(22, 128, 60, 0.2);
        --color-warning-soft: rgba(180, 83, 9, 0.2);
        --color-critical-soft: rgba(180, 35, 24, 0.2);
        --shadow-soft: 0 12px 28px rgba(0, 0, 0, 0.28);
        --workspace-content-bg: #191b21;
    }
}

* {
    box-sizing: border-box;
}

html,
body {
    min-height: 100%;
}

body {
    margin: 0;
    background: var(--color-page);
    color: var(--color-text);
    font-family: var(--font-sans);
    font-size: 14px;
    line-height: 1.45;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input {
    font: inherit;
}

button {
    cursor: pointer;
}

h1,
h2,
h3,
p {
    margin: 0;
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid var(--color-success);
}

.invalid {
    outline: 1px solid var(--color-critical);
}

.validation-message {
    color: var(--color-critical);
}

.blazor-error-boundary {
    background: var(--color-critical-soft);
    border: 1px solid var(--color-critical);
    border-radius: var(--radius-card);
    color: var(--color-text);
    padding: 1rem;
}

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

.ops-shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
}

.ops-main {
    min-width: 0;
    min-height: 100vh;
    display: grid;
    grid-template-rows: auto 1fr;
}

.ops-content {
    background: var(--workspace-content-bg);
    min-width: 0;
    padding: 22px 28px 36px;
}

.app-brand {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.app-brand--sidebar {
    display: block;
    margin-bottom: 22px;
    padding: 0 2px 18px;
    border-bottom: 1px solid var(--sidebar-border);
}

.app-brand__logo {
    display: block;
    width: min(100%, 238px);
    height: auto;
    object-fit: contain;
    object-position: left center;
    filter: drop-shadow(0 10px 18px rgba(0, 0, 0, 0.34));
}

.global-search,
.toolbar__search {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    border: 1px solid var(--color-border);
    background: var(--color-surface-raised);
    border-radius: var(--radius-control);
    padding: 0 10px;
}

.global-search {
    height: 36px;
}

.global-search input,
.toolbar__search input {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--color-text);
}

.global-search input::placeholder,
.toolbar__search input::placeholder {
    color: var(--color-subtle);
}

.global-search kbd {
    border: 1px solid var(--color-border);
    border-radius: 4px;
    color: var(--color-muted);
    background: var(--color-surface);
    padding: 1px 6px;
    font-size: 0.72rem;
    white-space: nowrap;
}

.global-search__glyph,
.toolbar__search-glyph {
    width: 14px;
    height: 14px;
    border: 2px solid var(--color-subtle);
    border-radius: 50%;
    position: relative;
    flex: 0 0 auto;
}

.global-search__glyph::after,
.toolbar__search-glyph::after {
    content: "";
    width: 6px;
    height: 2px;
    background: var(--color-subtle);
    position: absolute;
    right: -5px;
    bottom: -2px;
    transform: rotate(45deg);
    border-radius: 2px;
}

.workspace-toolbar__actions {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.icon-button {
    width: 38px;
    height: 38px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-control);
    background: var(--color-surface-raised);
    color: var(--color-text);
    display: grid;
    place-items: center;
    position: relative;
}

.notification-button__glyph {
    width: 15px;
    height: 17px;
    border: 2px solid var(--color-muted);
    border-radius: 8px 8px 5px 5px;
    position: relative;
}

.notification-button__glyph::after {
    content: "";
    width: 7px;
    height: 2px;
    background: var(--color-muted);
    position: absolute;
    left: 2px;
    bottom: -5px;
    border-radius: 999px;
}

.notification-button__badge {
    position: absolute;
    top: -6px;
    right: -6px;
    min-width: 18px;
    height: 18px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: var(--color-critical);
    color: #fff;
    font-size: 0.68rem;
    font-weight: 800;
    border: 2px solid var(--color-surface);
}

.profile-menu {
    position: relative;
}

.profile-menu summary {
    list-style: none;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    height: 40px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-control);
    padding: 0 10px 0 6px;
    background: var(--color-surface-raised);
    cursor: pointer;
}

.profile-menu summary::-webkit-details-marker {
    display: none;
}

.profile-menu__avatar {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: var(--color-brand-soft);
    color: var(--color-brand-strong);
    font-weight: 800;
    font-size: 0.72rem;
}

.profile-menu__identity {
    display: grid;
    gap: 1px;
    min-width: 126px;
}

.profile-menu__identity span:first-child {
    font-weight: 700;
    font-size: 0.82rem;
}

.profile-menu__identity span:last-child {
    color: var(--color-muted);
    font-size: 0.72rem;
}

.profile-menu__panel {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 25;
    min-width: 210px;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    box-shadow: var(--shadow-soft);
    padding: 6px;
}

.profile-menu__panel a {
    display: block;
    padding: 9px 10px;
    border-radius: 5px;
    color: var(--color-text);
}

.profile-menu__panel a:hover {
    background: var(--color-brand-soft);
}

.left-nav {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.06) 0%, rgba(255, 255, 255, 0) 220px),
        radial-gradient(circle at 16% 0%, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0) 34%),
        linear-gradient(155deg, var(--sidebar-bg) 0%, #121419 48%, var(--sidebar-bg-deep) 100%);
    border-right: 1px solid var(--sidebar-border);
    box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.045);
    color: var(--sidebar-text);
    padding: 18px 14px;
    overflow-y: auto;
    position: sticky;
    top: 0;
    height: 100vh;
}

.left-nav__primary {
    display: grid;
    gap: 4px;
}

.left-nav__link {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 38px;
    padding: 0 10px;
    color: var(--sidebar-muted);
    border-radius: var(--radius-control);
    font-weight: 650;
}

.left-nav__link:hover,
.left-nav__link.active {
    background: linear-gradient(90deg, var(--sidebar-active), rgba(255, 255, 255, 0.04));
    box-shadow: inset 0 0 0 1px rgba(240, 90, 84, 0.18);
    color: var(--sidebar-text);
}

.left-nav__marker {
    width: 8px;
    height: 8px;
    border-radius: 3px;
    border: 1px solid currentColor;
}

.left-nav__link.active .left-nav__marker {
    background: currentColor;
    border-color: var(--sidebar-accent);
    color: var(--sidebar-accent);
}

.left-nav__section {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid var(--sidebar-border);
}

.left-nav__section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 9px;
}

.left-nav__section-header h2 {
    font-size: 0.75rem;
    text-transform: uppercase;
    color: var(--sidebar-text);
    letter-spacing: 0.08em;
}

.left-nav__section-header a {
    font-size: 0.75rem;
    color: var(--sidebar-accent);
    font-weight: 700;
}

.attention-list,
.activity-feed {
    display: grid;
    gap: 6px;
    margin: 0;
    padding: 0;
}

.attention-list__item {
    min-height: 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-radius: var(--radius-control);
    padding: 0 9px;
    background: rgba(255, 255, 255, 0.055);
    border: 1px solid rgba(255, 255, 255, 0.095);
    font-size: 0.82rem;
}

.attention-list__item strong {
    font-size: 0.82rem;
}

.attention-list__item--critical {
    color: #ff9b92;
    background: rgba(180, 35, 24, 0.2);
    border-color: rgba(255, 113, 99, 0.32);
}

.attention-list__item--high {
    color: #f6b766;
    background: rgba(180, 83, 9, 0.18);
    border-color: rgba(246, 183, 102, 0.26);
}

.attention-list__item--medium {
    color: #75a7ff;
    background: rgba(37, 99, 235, 0.2);
    border-color: rgba(117, 167, 255, 0.3);
}

.activity-feed {
    list-style: none;
}

.activity-feed__item {
    display: grid;
    grid-template-columns: 10px minmax(0, 1fr) auto;
    gap: 8px;
    align-items: start;
    padding: 6px 0;
    color: var(--sidebar-muted);
    font-size: 0.75rem;
}

.activity-feed__item strong,
.activity-feed__item span span {
    display: block;
    min-width: 0;
}

.activity-feed__item strong {
    color: var(--sidebar-text);
    font-size: 0.78rem;
}

.activity-feed__item time {
    color: var(--sidebar-subtle);
    white-space: nowrap;
}

.activity-feed__dot {
    width: 8px;
    height: 8px;
    margin-top: 5px;
    border-radius: 50%;
    background: var(--color-info);
}

.activity-feed__item--success .activity-feed__dot {
    background: var(--color-success);
}

.module-header {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.045) 0%, rgba(255, 255, 255, 0) 88px),
        linear-gradient(180deg, var(--workspace-header-bg) 0%, var(--workspace-header-bg-deep) 100%);
    border-bottom: 1px solid var(--workspace-header-border);
    color: var(--workspace-header-text);
    padding: 8px 28px 0;
    position: sticky;
    top: 0;
    z-index: 15;
}

.module-header__top {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    column-gap: 18px;
}

.module-header__identity {
    min-width: 0;
}

.workspace-toolbar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    justify-self: end;
    min-width: 0;
}

.workspace-toolbar .global-search {
    width: min(520px, 36vw);
}

.module-header .global-search,
.module-header .icon-button,
.module-header .profile-menu summary {
    background: rgba(255, 255, 255, 0.055);
    border-color: rgba(229, 231, 235, 0.16);
    color: var(--workspace-header-text);
}

.module-header .global-search input {
    color: var(--workspace-header-text);
}

.module-header .global-search input::placeholder,
.module-header .profile-menu__identity span:last-child {
    color: var(--workspace-header-muted);
}

.module-header .global-search kbd {
    background: rgba(0, 0, 0, 0.2);
    border-color: rgba(229, 231, 235, 0.18);
    color: var(--workspace-header-muted);
}

.module-header .global-search__glyph {
    border-color: var(--workspace-header-muted);
}

.module-header .global-search__glyph::after,
.module-header .notification-button__glyph::after {
    background: var(--workspace-header-muted);
}

.module-header .notification-button__glyph {
    border-color: var(--workspace-header-muted);
}

.module-header .notification-button__badge {
    border-color: var(--workspace-header-bg);
}

.breadcrumbs ol {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
    color: var(--workspace-header-subtle);
    font-size: 0.72rem;
}

.breadcrumbs li:not(:last-child)::after {
    content: "/";
    margin-left: 6px;
    color: color-mix(in srgb, var(--workspace-header-subtle) 70%, transparent);
}

.breadcrumbs a {
    color: var(--workspace-header-subtle);
}

.breadcrumbs span {
    color: var(--workspace-header-muted);
    font-weight: 600;
}

.module-header__title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    min-height: 34px;
    padding: 6px 0 8px;
}

.page-header__eyebrow,
.alert-card__label {
    color: var(--color-brand-strong);
    text-transform: uppercase;
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.module-header h1 {
    color: var(--workspace-header-text);
    font-size: clamp(1.42rem, 1.24rem + 0.42vw, 1.75rem);
    line-height: 1.2;
    letter-spacing: 0;
}

.module-tabs {
    display: flex;
    align-items: center;
    gap: 2px;
    padding-top: 2px;
    overflow-x: auto;
    scrollbar-width: thin;
}

.module-tabs__link {
    flex: 0 0 auto;
    color: var(--workspace-header-muted);
    padding: 8px 12px 9px;
    border-bottom: 2px solid transparent;
    font-weight: 700;
    font-size: 0.85rem;
}

.module-tabs__link:hover,
.module-tabs__link.active {
    color: var(--color-brand-strong);
    border-bottom-color: var(--color-brand);
}

.page-header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 20px;
}

.page-header h2 {
    font-size: clamp(1.45rem, 1.2rem + 0.7vw, 2rem);
    line-height: 1.15;
    letter-spacing: 0;
}

.page-header p:not(.page-header__eyebrow) {
    color: var(--color-muted);
    max-width: 72ch;
    margin-top: 6px;
}

.page-header__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.page-header__meta {
    margin-top: 10px;
}

.button {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: var(--radius-control);
    border: 1px solid var(--color-border);
    padding: 0 13px;
    background: var(--color-surface);
    color: var(--color-text);
    font-weight: 750;
    white-space: nowrap;
}

.button--primary {
    background: var(--color-brand);
    border-color: var(--color-brand);
    color: #fff;
}

.button--secondary {
    background: var(--color-surface-raised);
}

.button--wait-toggle.is-active {
    border-color: rgba(246, 183, 102, 0.72);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.11), rgba(255, 255, 255, 0) 44%),
        linear-gradient(115deg, #3b240b 0%, #9a5b12 52%, #17100a 100%);
    color: #fff;
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.08),
        0 8px 18px rgba(0, 0, 0, 0.14);
}

.button--wait-toggle.is-active:hover {
    border-color: rgba(255, 211, 139, 0.9);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0) 46%),
        linear-gradient(115deg, #4c2b0a 0%, #b66d16 52%, #211408 100%);
}

.stat-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}

.stat-grid--compact {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.stat-card,
.alert-card,
.ui-card,
.timeline,
.table-shell,
.empty-state,
.loading-state {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    box-shadow: 0 1px 0 rgba(15, 23, 42, 0.03);
}

.stat-card {
    min-height: 118px;
    padding: 16px;
    display: grid;
    align-content: space-between;
    border-top: 3px solid var(--color-border-strong);
}

.stat-card__topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    color: var(--color-muted);
    font-size: 0.8rem;
    font-weight: 700;
}

.stat-card__topline strong {
    color: var(--color-text);
    font-size: 0.78rem;
}

.stat-card__value {
    margin-top: 10px;
    font-size: 2rem;
    line-height: 1;
    font-weight: 850;
    letter-spacing: 0;
}

.stat-card p {
    margin-top: 8px;
    color: var(--color-muted);
}

.stat-card--info {
    border-top-color: var(--color-info);
}

.stat-card--success {
    border-top-color: var(--color-success);
}

.stat-card--warning {
    border-top-color: var(--color-warning);
}

.stat-card--critical {
    border-top-color: var(--color-critical);
}

.dashboard-grid,
.workspace-grid,
.two-column-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(320px, 0.8fr);
    gap: 18px;
    align-items: start;
    margin-bottom: 18px;
}

.workspace-grid,
.two-column-grid {
    grid-template-columns: minmax(0, 1fr) minmax(320px, 0.85fr);
}

.content-stack,
.state-showcase {
    display: grid;
    gap: 12px;
}

.state-showcase-panel {
    display: grid;
    gap: 12px;
}

.state-showcase-panel h2 {
    font-size: 1rem;
}

.state-showcase-panel p {
    color: var(--color-muted);
    margin-top: 3px;
}

.section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.section-heading h2 {
    font-size: 1rem;
}

.section-heading a {
    color: var(--color-brand-strong);
    font-weight: 800;
    font-size: 0.84rem;
}

.dashboard-overview-workspace {
    display: grid;
    gap: 14px;
}

.dashboard-overview-workspace .stat-grid {
    margin-bottom: 0;
}

.operations-dashboard-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(360px, 0.95fr);
    gap: 14px;
    align-items: start;
}

.dashboard-side-stack {
    display: grid;
    gap: 14px;
    min-width: 0;
}

.dashboard-module-panel,
.dashboard-chart-card,
.dashboard-list-panel {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    background: var(--color-surface);
}

.dashboard-module-panel {
    display: grid;
    gap: 12px;
    align-content: start;
    grid-auto-rows: max-content;
    padding: 12px;
}

.dashboard-module-panel--helpdesk {
    min-height: 0;
}

.dashboard-panel-header,
.dashboard-chart-card header,
.dashboard-list-panel header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 12px;
}

.dashboard-panel-header {
    padding-bottom: 8px;
    border-bottom: 1px solid var(--color-border);
}

.dashboard-panel-header div,
.dashboard-chart-card header,
.dashboard-list-panel header {
    min-width: 0;
}

.dashboard-panel-header h2,
.dashboard-chart-card h3,
.dashboard-list-panel h3 {
    font-size: 1rem;
    line-height: 1.2;
}

.dashboard-panel-header span,
.dashboard-chart-card header span,
.dashboard-risk-card span,
.dashboard-risk-card small,
.dashboard-list-panel header a,
.dashboard-ticket-list small,
.dashboard-ticket-list time,
.dashboard-asset-list small,
.dashboard-asset-list > a > span:last-child,
.dashboard-warning-row small,
.dashboard-knowledge-list small {
    color: var(--color-muted);
}

.dashboard-panel-header a,
.dashboard-list-panel header a {
    color: var(--color-brand-strong);
    font-size: 0.82rem;
    font-weight: 850;
    white-space: nowrap;
}

.dashboard-chart-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    align-items: start;
}

.dashboard-chart-card {
    display: grid;
    gap: 10px;
    align-content: start;
    padding: 11px;
}

.ring-chart-layout {
    display: grid;
    grid-template-columns: 132px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
}

.ring-chart-layout--compact {
    grid-template-columns: 112px minmax(0, 1fr);
}

.ring-chart {
    width: 132px;
    height: 132px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 1px;
    border-radius: 50%;
    position: relative;
}

.ring-chart::after {
    content: "";
    position: absolute;
    inset: 18px;
    border-radius: 50%;
    background: var(--color-surface);
    box-shadow: inset 0 0 0 1px var(--color-border);
}

.ring-chart span,
.ring-chart small {
    position: relative;
    z-index: 1;
}

.ring-chart span {
    font-size: 1.55rem;
    font-weight: 900;
    line-height: 1;
    transform: translateY(4px);
}

.ring-chart small {
    color: var(--color-muted);
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
    transform: translateY(4px);
}

.ring-chart--small {
    width: 112px;
    height: 112px;
}

.ring-chart--small::after {
    inset: 16px;
}

.ring-legend {
    display: grid;
    gap: 7px;
    min-width: 0;
}

.ring-legend span {
    display: grid;
    grid-template-columns: 10px minmax(0, 1fr) auto;
    gap: 7px;
    align-items: center;
}

.ring-legend i {
    width: 9px;
    height: 9px;
    border-radius: 50%;
}

.ring-legend strong,
.ring-legend small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ring-legend strong {
    font-size: 0.82rem;
}

.ring-legend small {
    color: var(--color-muted);
    font-size: 0.78rem;
    font-weight: 850;
}

.dashboard-risk-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.dashboard-risk-card {
    display: grid;
    gap: 2px;
    min-height: 72px;
    padding: 10px 12px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    background: var(--color-surface);
}

.dashboard-risk-card strong {
    font-size: 1.55rem;
    line-height: 1;
}

.dashboard-risk-card--critical {
    border-color: color-mix(in srgb, var(--color-critical) 46%, var(--color-border));
    background: linear-gradient(90deg, var(--color-critical-soft), var(--color-surface) 56%);
}

.dashboard-risk-card--warning {
    border-color: color-mix(in srgb, var(--color-warning) 46%, var(--color-border));
    background: linear-gradient(90deg, var(--color-warning-soft), var(--color-surface) 56%);
}

.dashboard-list-panel {
    overflow: hidden;
}

.dashboard-list-panel header {
    padding: 10px 12px;
    border-bottom: 1px solid var(--color-border);
}

.dashboard-ticket-list,
.dashboard-asset-list,
.dashboard-warning-list,
.dashboard-knowledge-list {
    display: grid;
}

.dashboard-ticket-list a,
.dashboard-asset-list a,
.dashboard-warning-row,
.dashboard-knowledge-list a {
    min-width: 0;
    display: grid;
    gap: 8px;
    align-items: center;
    padding: 9px 12px;
    border-bottom: 1px solid var(--color-border);
}

.dashboard-ticket-list a:last-child,
.dashboard-asset-list a:last-child,
.dashboard-warning-row:last-child,
.dashboard-knowledge-list a:last-child {
    border-bottom: 0;
}

.dashboard-ticket-list a:hover,
.dashboard-asset-list a:hover,
.dashboard-warning-row:hover,
.dashboard-knowledge-list a:hover {
    background: color-mix(in srgb, var(--color-brand-soft) 55%, transparent);
}

.dashboard-ticket-list a {
    grid-template-columns: minmax(0, 1fr) auto 44px;
}

.dashboard-ticket-list a > span:first-child,
.dashboard-asset-list a > span:first-child,
.dashboard-warning-row > span:first-child,
.dashboard-knowledge-list a > span:first-child {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.dashboard-ticket-list strong,
.dashboard-ticket-list small,
.dashboard-asset-list strong,
.dashboard-asset-list small,
.dashboard-warning-row strong,
.dashboard-warning-row small,
.dashboard-knowledge-list strong,
.dashboard-knowledge-list small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-ticket-list time {
    text-align: right;
    white-space: nowrap;
}

.dashboard-asset-list a,
.dashboard-warning-row,
.dashboard-knowledge-list a {
    grid-template-columns: minmax(0, 1fr) auto;
}

.dashboard-asset-list a > span:last-child,
.dashboard-warning-row > span:last-child {
    font-weight: 850;
    white-space: nowrap;
}

.dashboard-warning-row {
    border-left: 3px solid var(--color-warning);
}

.dashboard-warning-row--critical {
    border-left-color: var(--color-critical);
    background: linear-gradient(90deg, var(--color-critical-soft), transparent 54%);
}

.dashboard-warning-row--warning {
    border-left-color: var(--color-warning);
    background: linear-gradient(90deg, var(--color-warning-soft), transparent 54%);
}

.toolbar {
    min-height: 54px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    margin-bottom: 12px;
}

.toolbar__search {
    height: 38px;
    flex: 1 1 340px;
    max-width: 520px;
}

.toolbar__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.table-shell {
    overflow-x: auto;
}

.data-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 680px;
}

.data-table th,
.data-table td {
    padding: 12px 14px;
    text-align: left;
    border-bottom: 1px solid var(--color-border);
    vertical-align: middle;
}

.data-table th {
    background: var(--color-surface-raised);
    color: var(--color-muted);
    font-size: 0.76rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.data-table__sort-button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 0;
    padding: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-transform: inherit;
    letter-spacing: inherit;
    cursor: pointer;
}

.data-table__sort-button:hover,
.data-table__sort-button:focus-visible {
    color: var(--color-text);
}

.data-table__sort-button:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--color-brand) 72%, transparent);
    outline-offset: 4px;
    border-radius: 4px;
}

.data-table__sort-indicator {
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    opacity: 0.36;
}

.data-table__sort-indicator.is-ascending {
    border-bottom: 5px solid var(--color-brand-strong);
    opacity: 1;
}

.data-table__sort-indicator.is-descending {
    border-top: 5px solid var(--color-brand-strong);
    opacity: 1;
}

.data-table tbody tr:last-child td {
    border-bottom: 0;
}

.data-table tbody tr:hover {
    background: color-mix(in srgb, var(--color-brand-soft) 55%, transparent);
}

.data-table strong,
.table-muted {
    display: block;
}

.table-muted {
    color: var(--color-muted);
    margin-top: 2px;
    font-size: 0.82rem;
}

.data-table__cell--right {
    text-align: right;
}

.status-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 24px;
    border-radius: 999px;
    padding: 0 9px;
    font-weight: 800;
    font-size: 0.75rem;
    background: var(--color-info-soft);
    color: var(--color-info);
}

.status-pill--critical {
    background: var(--color-critical-soft);
    color: var(--color-critical);
}

.status-pill--warning {
    background: var(--color-warning-soft);
    color: var(--color-warning);
}

.status-pill--success {
    background: var(--color-success-soft);
    color: var(--color-success);
}

.status-pill--neutral {
    background: var(--color-surface-raised);
    color: var(--color-muted);
}

.alert-card {
    padding: 14px;
    display: flex;
    justify-content: space-between;
    gap: 14px;
    border-left: 4px solid var(--color-info);
}

.alert-card h3 {
    font-size: 0.96rem;
    line-height: 1.25;
    margin-top: 3px;
}

.alert-card p:not(.alert-card__label) {
    color: var(--color-muted);
    margin-top: 5px;
}

.alert-card > strong {
    align-self: start;
    white-space: nowrap;
    font-size: 0.8rem;
    color: var(--color-muted);
}

.alert-card--critical {
    border-left-color: var(--color-critical);
    background: linear-gradient(90deg, var(--color-critical-soft), var(--color-surface) 48%);
}

.alert-card--warning {
    border-left-color: var(--color-warning);
    background: linear-gradient(90deg, var(--color-warning-soft), var(--color-surface) 48%);
}

.alert-card--info {
    border-left-color: var(--color-info);
    background: linear-gradient(90deg, var(--color-info-soft), var(--color-surface) 48%);
}

.ui-card {
    overflow: hidden;
}

.ui-card--asset-context {
    overflow: visible;
    position: relative;
    z-index: 5;
}

.ui-card--asset-context:hover,
.ui-card--asset-context:focus-within {
    z-index: 80;
}

.ui-card--asset-context .ui-card__body {
    overflow: visible;
}

.ui-card__header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 12px;
    padding: 15px 16px;
    border-bottom: 1px solid var(--color-border);
}

.ui-card__header h3,
.timeline__header h3 {
    font-size: 1rem;
}

.ui-card__header p,
.timeline__header p {
    color: var(--color-muted);
    margin-top: 3px;
}

.ui-card__body {
    padding: 16px;
}

.empty-state,
.loading-state {
    min-height: 132px;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px;
}

.empty-state__mark,
.loading-state__pulse {
    width: 42px;
    height: 42px;
    border-radius: 8px;
    flex: 0 0 auto;
}

.empty-state__mark {
    background:
        linear-gradient(90deg, transparent 45%, var(--color-border-strong) 45% 55%, transparent 55%),
        linear-gradient(0deg, transparent 45%, var(--color-border-strong) 45% 55%, transparent 55%),
        var(--color-surface-raised);
    border: 1px solid var(--color-border);
}

.loading-state__pulse {
    background: linear-gradient(90deg, var(--color-border), var(--color-surface-raised), var(--color-border));
    background-size: 200% 100%;
    animation: loading-sweep 1.4s ease-in-out infinite;
}

@keyframes loading-sweep {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

.empty-state h3,
.loading-state h3 {
    font-size: 1rem;
}

.empty-state p,
.loading-state p {
    color: var(--color-muted);
    margin-top: 4px;
}

.timeline {
    padding: 0;
    overflow: hidden;
}

.timeline__header {
    padding: 15px 16px;
    border-bottom: 1px solid var(--color-border);
}

.timeline__list {
    list-style: none;
    margin: 0;
    padding: 10px 16px 16px;
}

.timeline__entry {
    display: grid;
    grid-template-columns: 14px minmax(0, 1fr);
    gap: 10px;
    position: relative;
    padding: 10px 0;
}

.timeline__entry:not(:last-child)::before {
    content: "";
    position: absolute;
    left: 6px;
    top: 25px;
    bottom: -9px;
    width: 2px;
    background: var(--color-border);
}

.timeline__pin {
    width: 14px;
    height: 14px;
    border: 3px solid var(--color-surface);
    border-radius: 50%;
    background: var(--color-info);
    box-shadow: 0 0 0 1px var(--color-info);
    margin-top: 3px;
    z-index: 1;
}

.timeline__entry--success .timeline__pin {
    background: var(--color-success);
    box-shadow: 0 0 0 1px var(--color-success);
}

.timeline__entry--warning .timeline__pin {
    background: var(--color-warning);
    box-shadow: 0 0 0 1px var(--color-warning);
}

.timeline__entry-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.timeline__entry-header time {
    color: var(--color-subtle);
    white-space: nowrap;
    font-size: 0.78rem;
}

.timeline__entry p {
    color: var(--color-muted);
    margin-top: 3px;
}

.definition-list {
    display: grid;
    gap: 12px;
}

.definition-list div {
    display: grid;
    gap: 4px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--color-border);
}

.definition-list div:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.definition-list span {
    color: var(--color-muted);
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 800;
}

.definition-list strong {
    font-size: 0.95rem;
}

.inventory-dashboard-grid,
.asset-detail-grid,
.asset-related-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.85fr);
    gap: 18px;
    align-items: start;
    margin-bottom: 18px;
}

.breakdown-list,
.status-stack {
    display: grid;
    gap: 10px;
}

.breakdown-row {
    display: grid;
    grid-template-columns: minmax(130px, 0.7fr) minmax(120px, 1fr) 3rem;
    gap: 10px;
    align-items: center;
}

.breakdown-row span:first-child {
    font-weight: 750;
}

.breakdown-row strong {
    text-align: right;
}

.breakdown-meter {
    height: 9px;
    background: var(--color-surface-raised);
    border: 1px solid var(--color-border);
    border-radius: 999px;
    overflow: hidden;
}

.breakdown-meter span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, var(--color-brand), var(--color-info));
}

.status-summary {
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border: 1px solid var(--color-border);
    border-left: 4px solid var(--color-info);
    border-radius: var(--radius-control);
    padding: 0 12px;
    background: var(--color-surface-raised);
    font-weight: 750;
}

.status-summary--success {
    border-left-color: var(--color-success);
}

.status-summary--warning {
    border-left-color: var(--color-warning);
}

.status-summary--critical {
    border-left-color: var(--color-critical);
}

.inventory-value-panel {
    display: grid;
    gap: 8px;
}

.inventory-value-panel span {
    color: var(--color-muted);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 800;
    font-size: 0.76rem;
}

.inventory-value-panel strong {
    font-size: 2rem;
    line-height: 1;
}

.inventory-value-panel p {
    color: var(--color-muted);
}

.inventory-assets-workspace {
    display: grid;
    gap: 10px;
}

.asset-page-bar {
    min-height: 40px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    padding: 3px 0 5px;
}

.asset-page-size {
    grid-column: 2;
    justify-self: center;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--color-muted);
    font-size: 0.78rem;
    font-weight: 750;
}

.asset-page-size select {
    min-height: 30px;
    min-width: 74px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-control);
    background: var(--color-surface-raised);
    color: var(--color-text);
    padding: 4px 28px 4px 9px;
    font: inherit;
}

.asset-page-actions {
    grid-column: 3;
    justify-self: end;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.inventory-assets-workspace .button {
    min-height: 34px;
    padding-inline: 14px;
}

.button--receive-asset,
.button--red-gradient {
    border-color: rgba(240, 90, 84, 0.72);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0) 44%),
        linear-gradient(115deg, #351012 0%, #8f2622 48%, #08090c 100%);
    color: #fff;
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.08),
        0 8px 18px rgba(0, 0, 0, 0.16);
}

.button--receive-asset:hover,
.button--red-gradient:hover {
    border-color: rgba(255, 128, 118, 0.9);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.13), rgba(255, 255, 255, 0) 46%),
        linear-gradient(115deg, #431316 0%, #a22d28 48%, #0b0c10 100%);
}

.filter-count {
    min-width: 18px;
    height: 18px;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    background: var(--color-brand-soft);
    color: var(--color-brand-strong);
    font-size: 0.72rem;
    font-weight: 850;
}

.inventory-filter-panel {
    display: grid;
    gap: 10px;
    padding: 10px;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
}

.inventory-assets-workspace .filter-grid {
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 8px;
}

.inventory-assets-workspace .field {
    gap: 3px;
}

.inventory-assets-workspace .field > span {
    font-size: 0.68rem;
}

.inventory-assets-workspace .field select {
    min-height: 32px;
    padding-block: 5px;
}

.inventory-assets-workspace .filter-actions {
    justify-content: flex-end;
}

.inventory-assets-workspace .filter-actions span {
    margin-right: auto;
}

.inventory-assets-workspace .table-shell {
    border-radius: 6px;
}

.inventory-assets-workspace .data-table {
    min-width: 900px;
}

.inventory-assets-workspace .data-table th,
.inventory-assets-workspace .data-table td {
    padding: 8px 12px;
}

.inventory-assets-workspace .table-muted {
    margin-top: 1px;
    font-size: 0.78rem;
}

.helpdesk-queue-workspace .data-table {
    min-width: 1080px;
}

.helpdesk-queue-workspace .table-shell {
    overflow: visible;
}

.ticket-subject-link {
    color: var(--color-text);
    font-weight: 850;
}

.ticket-subject-link:hover {
    color: var(--color-brand-strong);
}

.ticket-requester-hover {
    position: relative;
    z-index: 1;
    display: inline-grid;
    gap: 1px;
    max-width: 100%;
    outline: none;
}

.ticket-requester-hover:hover,
.ticket-requester-hover:focus,
.ticket-requester-hover:focus-within {
    z-index: 90;
}

.ticket-requester-hover:hover > strong,
.ticket-requester-hover:focus > strong,
.ticket-requester-hover:focus-within > strong {
    color: var(--color-brand-strong);
}

.ticket-requester-popover {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    z-index: 140;
    width: min(390px, 42vw);
    display: grid;
    gap: 12px;
    padding: 12px;
    border: 1px solid rgba(229, 231, 235, 0.16);
    border-radius: var(--radius-card);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0)),
        #121419;
    color: #f4f4f5;
    box-shadow: 0 22px 46px rgba(0, 0, 0, 0.42);
    opacity: 0;
    pointer-events: none;
    transform: translateY(-6px);
    transition: opacity 150ms ease, transform 150ms ease;
}

.ticket-requester-hover:hover .ticket-requester-popover,
.ticket-requester-hover:focus .ticket-requester-popover,
.ticket-requester-hover:focus-within .ticket-requester-popover {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

.ticket-requester-popover header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(229, 231, 235, 0.14);
}

.ticket-requester-popover header div,
.ticket-requester-popover section {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.ticket-requester-popover header span,
.ticket-requester-popover h4,
.ticket-requester-history small,
.ticket-requester-history time {
    color: #b7bec8;
}

.ticket-requester-popover header > span {
    flex: 0 0 auto;
    border: 1px solid rgba(45, 212, 191, 0.26);
    border-radius: 999px;
    padding: 2px 8px;
    background: rgba(45, 212, 191, 0.1);
    color: #5eead4;
    font-size: 0.72rem;
    font-weight: 850;
}

.ticket-requester-popover h4 {
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.ticket-requester-history {
    display: grid;
    gap: 7px;
}

.ticket-requester-history a {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 8px;
    align-items: center;
    min-width: 0;
    border: 1px solid rgba(229, 231, 235, 0.12);
    border-radius: var(--radius-control);
    background: rgba(255, 255, 255, 0.045);
    padding: 8px;
}

.ticket-requester-history a:hover {
    border-color: rgba(45, 212, 191, 0.44);
    background: rgba(45, 212, 191, 0.08);
}

.ticket-requester-history a > span:first-child {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.ticket-requester-history strong,
.ticket-requester-history small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ticket-requester-history strong {
    color: #f4f4f5;
    font-size: 0.82rem;
}

.ticket-requester-history small,
.ticket-requester-history time {
    font-size: 0.74rem;
}

.ticket-requester-history time {
    white-space: nowrap;
}

.ticket-field-select {
    width: 100%;
    min-height: 30px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-control);
    background: var(--color-surface-raised);
    color: var(--color-text);
    padding: 4px 28px 4px 9px;
    font: inherit;
    font-weight: 850;
}

.ticket-field-select:hover,
.ticket-field-select:focus {
    border-color: var(--color-brand);
    outline: none;
}

.ticket-field-select--critical {
    border-color: color-mix(in srgb, var(--color-critical) 54%, var(--color-border));
    background: linear-gradient(90deg, var(--color-critical-soft), var(--color-surface-raised) 68%);
    color: var(--color-critical);
}

.ticket-field-select--warning {
    border-color: color-mix(in srgb, var(--color-warning) 54%, var(--color-border));
    background: linear-gradient(90deg, var(--color-warning-soft), var(--color-surface-raised) 68%);
    color: var(--color-warning);
}

.ticket-field-select--success {
    border-color: color-mix(in srgb, var(--color-success) 54%, var(--color-border));
    background: linear-gradient(90deg, var(--color-success-soft), var(--color-surface-raised) 68%);
    color: var(--color-success);
}

.ticket-field-select--info {
    border-color: color-mix(in srgb, var(--color-info) 54%, var(--color-border));
    background: linear-gradient(90deg, var(--color-info-soft), var(--color-surface-raised) 68%);
    color: var(--color-info);
}

.ticket-assignee-select {
    width: 100%;
    min-height: 30px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-control);
    background: var(--color-surface-raised);
    color: var(--color-text);
    padding: 4px 28px 4px 9px;
    font: inherit;
    font-weight: 800;
}

.ticket-assignee-select:hover,
.ticket-assignee-select:focus {
    border-color: var(--color-brand);
    outline: none;
}

.ticket-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.ticket-header-person,
.ticket-header-assignee {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 36px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-control);
    background: var(--color-surface-raised);
}

.ticket-header-person {
    padding: 0 10px;
}

.ticket-header-assignee {
    padding: 0 6px 0 10px;
}

.ticket-header-person span,
.ticket-header-assignee > span {
    color: var(--color-muted);
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
}

.ticket-header-person strong {
    font-size: 0.84rem;
    white-space: nowrap;
}

.ticket-header-assignee .ticket-assignee-select {
    width: auto;
    min-width: 160px;
    min-height: 28px;
    border-color: transparent;
    background: var(--color-surface);
}

.ticket-header-buttons {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.inventory-warehouse-workspace {
    display: grid;
    gap: 16px;
}

.warehouse-site-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 10px;
}

.warehouse-site-card {
    container-type: size;
    min-width: 0;
    aspect-ratio: 4 / 3;
    display: grid;
    grid-template-rows: auto auto auto 1fr;
    gap: 4px;
    border: 1px solid var(--color-border);
    border-radius: 6px;
    padding: 10px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0)),
        var(--color-surface);
    color: var(--color-text);
    text-align: left;
    cursor: pointer;
}

.warehouse-site-card:hover,
.warehouse-site-card--active {
    border-color: rgba(240, 90, 84, 0.58);
    box-shadow: inset 0 0 0 1px rgba(240, 90, 84, 0.18);
}

.warehouse-site-card--active {
    background:
        linear-gradient(135deg, rgba(180, 35, 24, 0.2), rgba(8, 9, 12, 0.1)),
        var(--color-surface);
}

.warehouse-site-card > span {
    color: var(--color-text);
    font-size: 0.82rem;
    font-weight: 850;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.warehouse-site-card > strong {
    font-size: 1.72rem;
    line-height: 1;
}

.warehouse-site-card > small {
    color: var(--color-muted);
    font-weight: 750;
}

.warehouse-stock-bars {
    align-self: end;
    height: clamp(96px, calc(50cqh + 34px), 220px);
    min-height: 72px;
    display: grid;
    grid-template-columns: repeat(4, minmax(30px, 1fr)) minmax(58px, 1.6fr);
    align-items: stretch;
    column-gap: 5px;
    padding: 5px 1px 0;
}

.warehouse-bar-group {
    min-width: 0;
    height: 100%;
    display: grid;
    grid-template-rows: minmax(42px, 1fr) minmax(18px, auto) auto;
    justify-items: center;
    align-items: end;
    gap: 2px;
    text-align: center;
}

.warehouse-bar {
    width: 14px;
    height: 100%;
    display: flex;
    align-items: end;
    border: 1px solid var(--color-border);
    border-radius: 3px;
    background: var(--color-surface-raised);
    overflow: hidden;
}

.warehouse-bar span {
    width: 100%;
    min-height: 4px;
    border-radius: 2px 2px 0 0;
}

.warehouse-bar--low span {
    background: linear-gradient(180deg, #ff8f86, #b42318 58%, #64110d);
}

.warehouse-bar--medium span {
    background: linear-gradient(180deg, #ffd987, #b7791f 58%, #6c3e07);
}

.warehouse-bar--high span {
    background: linear-gradient(180deg, #65d889, #16803c 58%, #0b4f26);
}

.warehouse-bar-label {
    color: var(--color-muted);
    font-size: 0.6rem;
    font-weight: 800;
    line-height: 1.05;
    overflow-wrap: normal;
    word-break: normal;
}

.warehouse-bar-group strong {
    color: var(--color-text);
    font-size: 0.72rem;
    line-height: 1;
}

.warehouse-list-panel {
    display: grid;
    gap: 8px;
    padding-top: 4px;
}

.warehouse-location-tabs {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    align-items: center;
}

.warehouse-location-tab {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-control);
    padding: 0 10px;
    background: var(--color-surface-raised);
    color: var(--color-muted);
    font-weight: 800;
    cursor: pointer;
}

.warehouse-location-tab:hover,
.warehouse-location-tab--active {
    border-color: rgba(240, 90, 84, 0.62);
    background: linear-gradient(90deg, rgba(180, 35, 24, 0.16), var(--color-surface-raised));
    color: var(--color-text);
}

.warehouse-location-tab strong {
    min-width: 22px;
    min-height: 20px;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(180, 35, 24, 0.18);
    color: #ff9b92;
    font-size: 0.75rem;
}

.inventory-warehouse-workspace .table-shell {
    border-radius: 6px;
}

.inventory-warehouse-workspace .data-table {
    min-width: 820px;
}

.inventory-warehouse-workspace .data-table th,
.inventory-warehouse-workspace .data-table td {
    padding: 8px 12px;
}

.inventory-transfer-workspace {
    display: grid;
    gap: 12px;
}

.transfer-route-panel {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) minmax(180px, 1fr) minmax(280px, 1.25fr);
    gap: 10px;
    align-items: end;
    padding: 10px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    background: var(--color-surface);
}

.transfer-route-panel .field {
    gap: 3px;
}

.transfer-route-panel .field > span {
    font-size: 0.68rem;
}

.transfer-route-panel select {
    min-height: 34px;
}

.transfer-route-address {
    min-height: 58px;
    display: grid;
    align-content: center;
    gap: 2px;
    padding: 9px 11px;
    border: 1px solid rgba(240, 90, 84, 0.28);
    border-radius: var(--radius-control);
    background:
        linear-gradient(115deg, rgba(180, 35, 24, 0.13), transparent 46%),
        var(--color-surface-raised);
}

.transfer-route-address span,
.transfer-route-address small,
.transfer-panel-header span,
.transfer-shipper-card span,
.transfer-shipper-card small,
.transfer-result-panel span,
.transfer-result-panel small,
.transfer-empty-manifest span,
.transfer-selected-item small,
.transfer-equipment-row small {
    color: var(--color-muted);
}

.transfer-route-address span,
.transfer-shipper-card span,
.transfer-result-panel span {
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.transfer-route-address strong {
    color: var(--color-text);
}

.transfer-route-address small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.transfer-workbench {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(340px, 0.75fr);
    gap: 12px;
    align-items: start;
}

.transfer-picker-panel,
.transfer-manifest-panel {
    min-width: 0;
    display: grid;
    gap: 10px;
}

.transfer-picker-panel,
.transfer-dropzone,
.transfer-shipper-card,
.transfer-result-panel {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    background: var(--color-surface);
}

.transfer-picker-panel {
    overflow: hidden;
}

.transfer-panel-header {
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--color-border);
}

.transfer-panel-header div {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.transfer-panel-header h3 {
    font-size: 0.98rem;
    line-height: 1.2;
}

.transfer-panel-header > strong {
    color: var(--color-brand-strong);
    font-size: 0.78rem;
    text-align: right;
}

.transfer-equipment-list {
    display: grid;
    max-height: min(58vh, 680px);
    overflow: auto;
}

.transfer-equipment-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 130px 150px;
    gap: 12px;
    align-items: center;
    padding: 8px 12px;
    border-bottom: 1px solid var(--color-border);
    cursor: grab;
}

.transfer-equipment-row:last-child {
    border-bottom: 0;
}

.transfer-equipment-row:hover,
.transfer-equipment-row--selected {
    background: color-mix(in srgb, var(--color-brand-soft) 62%, transparent);
}

.transfer-equipment-row label {
    min-width: 0;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 9px;
    align-items: center;
}

.transfer-equipment-row input {
    width: 15px;
    height: 15px;
    accent-color: var(--color-brand);
}

.transfer-equipment-row label span,
.transfer-selected-item span {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.transfer-equipment-row strong,
.transfer-equipment-row small,
.transfer-selected-item strong,
.transfer-selected-item small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.transfer-equipment-row > span:nth-child(2) {
    color: var(--color-muted);
    font-size: 0.82rem;
    font-weight: 800;
}

.transfer-dropzone {
    min-height: 260px;
    overflow: hidden;
    outline: 1px dashed transparent;
    outline-offset: -7px;
}

.transfer-dropzone--active {
    border-color: color-mix(in srgb, var(--color-brand) 42%, var(--color-border));
}

.transfer-empty-manifest {
    min-height: 188px;
    display: grid;
    place-content: center;
    gap: 4px;
    padding: 22px;
    text-align: center;
}

.transfer-selected-list {
    display: grid;
    max-height: 328px;
    overflow: auto;
    padding: 8px;
    gap: 7px;
}

.transfer-selected-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 28px;
    gap: 10px;
    align-items: center;
    padding: 9px 10px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-control);
    background: var(--color-surface-raised);
}

.transfer-selected-item button {
    width: 26px;
    height: 26px;
    display: inline-grid;
    place-items: center;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-control);
    background: var(--color-surface);
    color: var(--color-muted);
    font-weight: 900;
}

.transfer-selected-item button:hover {
    border-color: rgba(240, 90, 84, 0.62);
    color: #ff9b92;
}

.transfer-shipper-card {
    display: grid;
    gap: 0;
}

.transfer-shipper-card div {
    display: grid;
    gap: 2px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--color-border);
}

.transfer-shipper-card div:last-child {
    border-bottom: 0;
}

.transfer-shipper-card small {
    line-height: 1.35;
}

.transfer-submit-button {
    min-height: 38px;
    justify-content: center;
}

.transfer-submit-button:disabled {
    cursor: not-allowed;
    opacity: 0.5;
}

.transfer-result-panel {
    display: grid;
    grid-template-columns: minmax(180px, 0.7fr) minmax(220px, 0.8fr) minmax(0, 1.5fr);
    gap: 0;
    overflow: hidden;
}

.transfer-result-panel div {
    min-width: 0;
    display: grid;
    gap: 2px;
    padding: 11px 12px;
    border-right: 1px solid var(--color-border);
}

.transfer-result-panel div:last-child {
    border-right: 0;
}

.transfer-result-panel strong,
.transfer-result-panel small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.inventory-label-workspace {
    display: grid;
    gap: 12px;
}

.label-filter-panel {
    display: grid;
    grid-template-columns: minmax(180px, 0.75fr) minmax(180px, 0.75fr) minmax(260px, 1.5fr);
    gap: 10px;
    align-items: end;
    padding: 10px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    background: var(--color-surface);
}

.label-filter-panel .field {
    gap: 3px;
}

.label-filter-panel .field > span {
    font-size: 0.68rem;
}

.label-filter-panel input,
.label-filter-panel select {
    min-height: 34px;
}

.label-workbench {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(340px, 0.75fr);
    gap: 12px;
    align-items: start;
}

.label-inventory-panel,
.label-preview-card,
.label-history-panel {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    background: var(--color-surface);
}

.label-inventory-panel {
    overflow: hidden;
}

.label-panel-header {
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--color-border);
}

.label-panel-header div,
.label-preview-card__meta,
.label-preview-details div {
    display: grid;
    gap: 1px;
    min-width: 0;
}

.label-panel-header h3 {
    font-size: 0.98rem;
    line-height: 1.2;
}

.label-panel-header span,
.label-preview-card__meta span,
.label-preview-details span,
.label-history-list small,
.label-history-list article > span:nth-child(2),
.label-inventory-row small {
    color: var(--color-muted);
}

.label-inventory-list {
    display: grid;
    max-height: min(58vh, 680px);
    overflow: auto;
}

.label-inventory-row {
    display: grid;
    grid-template-columns: minmax(130px, 0.85fr) minmax(180px, 1fr) minmax(150px, 0.85fr) 132px;
    gap: 12px;
    align-items: center;
    width: 100%;
    border: 0;
    border-bottom: 1px solid var(--color-border);
    background: transparent;
    color: var(--color-text);
    padding: 8px 12px;
    text-align: left;
}

.label-inventory-row:last-child {
    border-bottom: 0;
}

.label-inventory-row:hover,
.label-inventory-row--active {
    background: color-mix(in srgb, var(--color-brand-soft) 62%, transparent);
}

.label-inventory-row--active {
    box-shadow: inset 3px 0 0 var(--color-brand);
}

.label-inventory-row > span:not(.status-pill) {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.label-inventory-row strong,
.label-inventory-row small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.label-preview-panel {
    display: grid;
    gap: 10px;
    min-width: 0;
}

.label-preview-card {
    display: grid;
    gap: 12px;
    padding: 12px;
}

.label-preview-card--empty {
    min-height: 210px;
    place-content: center;
    text-align: center;
}

.asset-label-preview {
    width: min(100%, 2.35in);
    height: 0.9in;
    display: flex;
    align-items: center;
    gap: 0.12in;
    padding: 0.08in 0.11in;
    border: 1px solid #d4d4d8;
    border-radius: 4px;
    background: #fff;
    color: #09090b;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
}

.asset-label-preview > strong {
    overflow: hidden;
    font-size: 0.24in;
    line-height: 1;
    letter-spacing: 0;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.asset-label-qr {
    flex: 0 0 auto;
    width: 0.48in;
    height: 0.48in;
    display: grid;
    grid-template-columns: repeat(11, 1fr);
    grid-template-rows: repeat(11, 1fr);
    gap: 1px;
    background: #fff;
}

.asset-label-qr__cell {
    background: transparent;
}

.asset-label-qr__cell--filled {
    background: #09090b;
}

.label-preview-details {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    margin: 0;
}

.label-preview-details span {
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.label-preview-details strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.label-reprint-button {
    min-height: 38px;
    justify-content: center;
}

.label-reprint-button:disabled {
    cursor: not-allowed;
    opacity: 0.5;
}

.label-history-panel {
    overflow: hidden;
}

.label-history-list {
    display: grid;
    gap: 0;
}

.label-history-list article {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 4px 10px;
    padding: 9px 12px;
    border-bottom: 1px solid var(--color-border);
}

.label-history-list article:last-child {
    border-bottom: 0;
}

.label-history-list article > small {
    grid-column: 1 / -1;
}

.asset-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 42px;
    padding: 5px 0 0;
    color: var(--color-muted);
    font-size: 0.82rem;
    font-weight: 700;
}

.asset-pagination__controls {
    display: flex;
    align-items: center;
    gap: 7px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.asset-pagination__controls > span {
    color: var(--color-text);
    padding-inline: 5px;
}

.asset-pagination .button {
    min-height: 30px;
    padding-inline: 10px;
}

.asset-pagination .button:disabled {
    cursor: not-allowed;
    opacity: 0.48;
}

.filter-grid,
.form-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.field {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.field--wide {
    grid-column: 1 / -1;
}

.field > span {
    color: var(--color-muted);
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.field input,
.field select,
.field textarea,
.form-control {
    width: 100%;
    min-height: 38px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-control);
    background: var(--color-surface-raised);
    color: var(--color-text);
    padding: 8px 10px;
    outline: none;
}

.field textarea,
textarea.form-control {
    min-height: 88px;
    resize: vertical;
}

.field input:focus,
.field select:focus,
.field textarea:focus,
.form-control:focus {
    border-color: var(--color-brand);
    box-shadow: 0 0 0 3px var(--color-brand-soft);
}

.field input:disabled,
.form-control:disabled {
    color: var(--color-muted);
    background: color-mix(in srgb, var(--color-surface-raised) 72%, var(--color-border));
}

.filter-actions,
.form-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.filter-actions span {
    color: var(--color-muted);
    font-weight: 750;
}

.asset-link {
    color: var(--color-brand-strong);
    font-weight: 850;
}

.asset-link:hover {
    text-decoration: underline;
}

.asset-hero {
    display: grid;
    grid-template-columns: 128px minmax(0, 1fr) minmax(180px, max-content);
    gap: 18px;
    align-items: stretch;
    margin-bottom: 18px;
    padding: 16px;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
}

.asset-visual {
    min-height: 128px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--color-brand) 16%, transparent), transparent),
        var(--color-surface-raised);
    border: 1px solid var(--color-border);
}

.asset-visual span {
    width: 74px;
    height: 74px;
    display: grid;
    place-items: center;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--color-brand), var(--color-info));
    color: #fff;
    font-weight: 900;
    font-size: 1.25rem;
}

.asset-hero__summary {
    display: grid;
    gap: 14px;
}

.asset-chip-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.asset-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin: 0;
}

.asset-summary-grid div {
    padding: 12px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-control);
    background: var(--color-surface-raised);
}

.asset-summary-grid dt {
    color: var(--color-muted);
    font-size: 0.74rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 800;
}

.asset-summary-grid dd {
    margin: 4px 0 0;
    font-weight: 800;
}

.asset-quick-actions {
    display: grid;
    gap: 8px;
    align-content: start;
}

.asset-info-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.asset-notes {
    display: grid;
    gap: 10px;
}

.asset-notes article {
    display: grid;
    gap: 4px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--color-border);
}

.asset-notes article:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.asset-notes time {
    color: var(--color-muted);
    font-size: 0.78rem;
}

.attachment-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
}

.attachment-list span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--color-border);
    border-radius: 999px;
    padding: 5px 10px;
    background: var(--color-surface-raised);
    font-weight: 750;
}

.attachment-list small {
    color: var(--color-muted);
}

.receive-workflow {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 18px;
    align-items: start;
}

.workflow-steps {
    position: sticky;
    top: calc(var(--header-height) + 150px);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    padding: 16px;
}

.workflow-steps h2 {
    font-size: 1rem;
    margin-bottom: 12px;
}

.workflow-steps ol {
    display: grid;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.workflow-steps li {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 8px;
    align-items: center;
    color: var(--color-muted);
    font-weight: 750;
}

.workflow-steps li span {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--color-surface-raised);
    border: 1px solid var(--color-border);
    color: var(--color-muted);
}

.workflow-steps li.is-active {
    color: var(--color-text);
}

.workflow-steps li.is-active span {
    background: var(--color-brand);
    border-color: var(--color-brand);
    color: #fff;
}

.asset-form {
    display: grid;
    gap: 14px;
}

.form-section {
    display: grid;
    gap: 12px;
    margin-top: 18px;
}

.form-section h3 {
    font-size: 1rem;
    padding-top: 14px;
    border-top: 1px solid var(--color-border);
}

.validation-errors,
.validation-summary-errors {
    padding: 12px;
    border: 1px solid var(--color-critical);
    border-radius: var(--radius-card);
    background: var(--color-critical-soft);
    color: var(--color-critical);
}

.helpdesk-dashboard-grid,
.ticket-workspace-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.85fr);
    gap: 18px;
    align-items: start;
    margin-bottom: 18px;
}

.helpdesk-dashboard-grid .data-table {
    min-width: 0;
    table-layout: fixed;
}

.helpdesk-dashboard-grid .data-table th,
.helpdesk-dashboard-grid .data-table td {
    padding-inline: 12px;
}

.ticket-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(420px, 0.85fr);
    gap: 18px;
    align-items: stretch;
    margin-bottom: 18px;
    padding: 16px;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
}

.ticket-hero__main {
    display: grid;
    align-content: start;
    gap: 14px;
    min-width: 0;
}

.ticket-hero__main p {
    color: var(--color-muted);
    max-width: 76ch;
}

.ticket-summary-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
}

.ticket-summary-grid div {
    min-height: 78px;
    display: grid;
    align-content: center;
    gap: 5px;
    padding: 12px;
    background: var(--color-surface-raised);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-control);
}

.ticket-summary-grid dt {
    color: var(--color-muted);
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.ticket-summary-grid dd {
    margin: 0;
    font-weight: 850;
}

.ticket-request {
    display: grid;
    gap: 12px;
}

.ticket-request-contact {
    display: inline-flex;
    align-items: baseline;
    justify-content: flex-end;
    gap: 6px;
    max-width: 100%;
    color: var(--color-text);
}

.ticket-request-contact span {
    color: var(--color-muted);
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.ticket-request-contact strong {
    overflow: hidden;
    font-size: 0.82rem;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ticket-request-contact:hover {
    color: var(--color-brand-strong);
}

.ticket-request__topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px 18px;
    flex-wrap: wrap;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--color-border);
}

.ticket-request__meta {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 6px 14px;
    margin: 0;
    min-width: min(100%, 520px);
}

.ticket-request__meta div {
    display: inline-flex;
    align-items: baseline;
    gap: 5px;
    min-width: 0;
}

.ticket-request__meta dt {
    color: var(--color-muted);
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
}

.ticket-request__meta dd {
    margin: 0;
    max-width: 18rem;
    overflow: hidden;
    color: var(--color-text);
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ticket-request__description {
    color: var(--color-text);
    line-height: 1.55;
    max-width: 92ch;
}

.ticket-request__attachments {
    display: grid;
    gap: 8px;
}

.ticket-request__attachments h3 {
    color: var(--color-muted);
    font-size: 0.74rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.comment-composer {
    display: grid;
    grid-template-columns: minmax(150px, 0.25fr) minmax(0, 1fr) max-content;
    gap: 10px;
    align-items: end;
    margin-bottom: 12px;
}

.action-message {
    margin-bottom: 12px;
    padding: 10px 12px;
    border-radius: var(--radius-control);
    background: var(--color-success-soft);
    color: var(--color-success);
    font-weight: 750;
}

.ticket-comments {
    display: grid;
    gap: 10px;
}

.ticket-comment {
    display: grid;
    gap: 8px;
    padding: 12px;
    border: 1px solid var(--color-border);
    border-left: 4px solid var(--color-info);
    border-radius: var(--radius-control);
    background: var(--color-surface-raised);
}

.ticket-comment--internal {
    border-left-color: var(--color-warning);
}

.ticket-comment--public {
    border-left-color: var(--color-success);
}

.ticket-comment header {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.ticket-comment header span {
    border-radius: 999px;
    padding: 2px 8px;
    background: var(--color-info-soft);
    color: var(--color-info);
    font-size: 0.74rem;
    font-weight: 800;
}

.ticket-comment time {
    color: var(--color-muted);
    margin-left: auto;
    font-size: 0.78rem;
}

.ticket-comment p {
    color: var(--color-muted);
}

.asset-context-card {
    display: grid;
    gap: 8px;
    margin-bottom: 14px;
    padding: 12px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-control);
    background: var(--color-surface-raised);
}

.asset-context-card--interactive {
    position: relative;
    z-index: 1;
    outline: none;
}

.asset-context-card--interactive:hover,
.asset-context-card--interactive:focus,
.asset-context-card--interactive:focus-within {
    z-index: 90;
    border-color: var(--color-brand);
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--color-brand) 35%, transparent),
        0 14px 30px rgba(0, 0, 0, 0.18);
}

.asset-issue-popover {
    position: absolute;
    top: 0;
    right: calc(100% - 2px);
    z-index: 120;
    width: min(430px, 44vw);
    display: grid;
    gap: 12px;
    padding: 12px;
    border: 1px solid rgba(229, 231, 235, 0.16);
    border-radius: var(--radius-card);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0)),
        #121419;
    color: #f4f4f5;
    box-shadow: 0 22px 46px rgba(0, 0, 0, 0.42);
    opacity: 0;
    pointer-events: none;
    transform: translateX(8px) translateY(-4px);
    transition: opacity 150ms ease, transform 150ms ease;
}

.asset-context-card--interactive:hover .asset-issue-popover,
.asset-context-card--interactive:focus .asset-issue-popover,
.asset-context-card--interactive:focus-within .asset-issue-popover {
    opacity: 1;
    pointer-events: auto;
    transform: translateX(0) translateY(-4px);
}

.asset-issue-popover header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(229, 231, 235, 0.14);
}

.asset-issue-popover header div,
.asset-issue-popover__section {
    display: grid;
    gap: 4px;
}

.asset-issue-popover header strong {
    font-size: 0.95rem;
}

.asset-issue-popover header span,
.asset-issue-popover h4,
.asset-issue-empty,
.asset-issue-ticket small,
.asset-issue-signal small,
.asset-issue-ticket time,
.asset-issue-signal time {
    color: #b7bec8;
}

.asset-issue-popover header > span {
    flex: 0 0 auto;
    border: 1px solid rgba(246, 183, 102, 0.26);
    border-radius: 999px;
    padding: 2px 8px;
    background: rgba(180, 83, 9, 0.18);
    color: #f6b766;
    font-size: 0.72rem;
    font-weight: 850;
}

.asset-issue-popover h4 {
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.asset-issue-list {
    display: grid;
    gap: 7px;
}

.asset-issue-ticket,
.asset-issue-signal {
    display: grid;
    gap: 8px;
    align-items: center;
    min-width: 0;
    border: 1px solid rgba(229, 231, 235, 0.12);
    border-radius: var(--radius-control);
    background: rgba(255, 255, 255, 0.045);
    padding: 8px;
}

.asset-issue-ticket {
    grid-template-columns: minmax(0, 1fr) auto auto;
}

.asset-issue-ticket:hover {
    border-color: rgba(45, 212, 191, 0.44);
    background: rgba(45, 212, 191, 0.08);
}

.asset-issue-ticket span:first-child,
.asset-issue-signal div {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.asset-issue-ticket strong,
.asset-issue-signal strong {
    overflow: hidden;
    color: #f4f4f5;
    font-size: 0.82rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.asset-issue-ticket small,
.asset-issue-signal small {
    overflow: hidden;
    font-size: 0.76rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.asset-issue-ticket time,
.asset-issue-signal time {
    font-size: 0.72rem;
    white-space: nowrap;
}

.asset-issue-signal {
    grid-template-columns: 10px minmax(0, 1fr) auto;
}

.asset-issue-signal > span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--color-info);
}

.asset-issue-signal--warning > span {
    background: var(--color-warning);
}

.asset-issue-signal--critical > span {
    background: var(--color-critical);
}

.asset-issue-signal--success > span {
    background: var(--color-success);
}

.asset-issue-empty {
    border: 1px dashed rgba(229, 231, 235, 0.14);
    border-radius: var(--radius-control);
    background: rgba(255, 255, 255, 0.035);
    padding: 8px;
    font-size: 0.78rem;
    font-weight: 750;
}

.asset-context-card > strong {
    font-size: 1rem;
}

.asset-context-card > span {
    color: var(--color-muted);
}

.related-ticket-list {
    display: grid;
    gap: 8px;
}

.related-ticket-list a {
    display: grid;
    gap: 3px;
    padding: 10px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-control);
    background: var(--color-surface-raised);
}

.related-ticket-list a:hover {
    border-color: var(--color-brand);
    background: color-mix(in srgb, var(--color-brand-soft) 55%, var(--color-surface-raised));
}

.related-ticket-list span {
    color: var(--color-muted);
    font-size: 0.82rem;
}

.ui-card__body > .empty-state {
    min-height: 112px;
    background: var(--color-surface-raised);
    border-style: dashed;
    box-shadow: none;
}

.knowledge-dashboard-grid,
.knowledge-article-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.85fr);
    gap: 18px;
    align-items: start;
    margin-bottom: 18px;
}

.knowledge-article-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(420px, 0.85fr);
    gap: 18px;
    align-items: stretch;
    margin-bottom: 18px;
    padding: 16px;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
}

.knowledge-article-hero__main {
    display: grid;
    align-content: start;
    gap: 14px;
    min-width: 0;
}

.knowledge-article-hero__main p {
    color: var(--color-muted);
    max-width: 82ch;
}

.knowledge-tag-row {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.knowledge-tag-row span {
    border: 1px solid var(--color-border);
    border-radius: 999px;
    padding: 3px 9px;
    background: var(--color-surface-raised);
    color: var(--color-muted);
    font-size: 0.76rem;
    font-weight: 800;
}

.knowledge-content-block {
    display: grid;
    gap: 10px;
}

.knowledge-content-block h3,
.knowledge-suggestion-grid h3 {
    font-size: 0.82rem;
    color: var(--color-muted);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.knowledge-content-block p {
    color: var(--color-muted);
    max-width: 90ch;
}

.article-card-list,
.knowledge-relationship-list {
    display: grid;
    gap: 8px;
}

.article-mini-card,
.knowledge-relationship-list a,
.knowledge-relationship-list > span {
    display: grid;
    gap: 4px;
    padding: 10px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-control);
    background: var(--color-surface-raised);
}

.article-mini-card:hover,
.knowledge-relationship-list a:hover {
    border-color: var(--color-brand);
    background: color-mix(in srgb, var(--color-brand-soft) 55%, var(--color-surface-raised));
}

.article-mini-card span,
.knowledge-relationship-list span span {
    color: var(--color-muted);
    font-size: 0.82rem;
}

.knowledge-suggestion-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.knowledge-suggestion-grid section {
    display: grid;
    align-content: start;
    gap: 8px;
    min-width: 0;
}

.knowledge-empty-inline {
    padding: 12px;
    border: 1px dashed var(--color-border);
    border-radius: var(--radius-control);
    background: var(--color-surface-raised);
    color: var(--color-muted);
    font-weight: 750;
}

.faq-grid,
.category-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.faq-card,
.category-card,
.review-card {
    display: grid;
    gap: 12px;
    padding: 14px;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
}

.faq-card header,
.faq-card footer,
.category-card header,
.review-card footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.faq-card h2,
.category-card h2,
.review-card h3 {
    font-size: 1rem;
    line-height: 1.25;
}

.faq-card p,
.category-card p,
.review-card p {
    color: var(--color-muted);
}

.faq-card footer,
.review-card footer {
    color: var(--color-muted);
    font-size: 0.82rem;
    font-weight: 750;
}

.category-card__metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin: 0;
}

.category-card__metrics div {
    padding: 9px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-control);
    background: var(--color-surface-raised);
}

.category-card__metrics dt {
    color: var(--color-muted);
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 800;
}

.category-card__metrics dd {
    margin: 3px 0 0;
    font-weight: 850;
}

.review-board {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    align-items: start;
}

.review-column {
    display: grid;
    gap: 10px;
    min-width: 0;
}

.review-column > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 12px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    background: var(--color-surface);
}

.review-column h2 {
    font-size: 1rem;
}

.review-column > header span {
    min-width: 28px;
    min-height: 28px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: var(--color-brand-soft);
    color: var(--color-brand-strong);
    font-weight: 850;
}

.review-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.toolbar__meta {
    color: var(--color-muted);
    font-weight: 750;
}

.report-page {
    display: grid;
    gap: 12px;
}

.report-page__header {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 14px;
}

.report-page__header div {
    min-width: 0;
}

.report-page__header span {
    display: block;
    color: var(--color-brand-strong);
    font-size: 0.74rem;
    font-weight: 900;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.report-page__header h2 {
    margin-top: 3px;
    font-size: 1.35rem;
    line-height: 1.15;
}

.report-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.button:disabled {
    cursor: not-allowed;
    opacity: 0.52;
}

.report-stat-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    margin-bottom: 0;
}

.report-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.18fr) minmax(360px, 0.82fr);
    gap: 12px;
    align-items: start;
}

.report-layout--executive {
    grid-template-columns: minmax(0, 1.28fr) minmax(390px, 0.72fr);
}

.report-stack {
    display: grid;
    gap: 12px;
    min-width: 0;
}

.report-panel {
    display: grid;
    gap: 12px;
    min-width: 0;
    padding: 12px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    background: var(--color-surface);
}

.report-panel--signature {
    border-color: color-mix(in srgb, var(--color-brand) 48%, var(--color-border));
    box-shadow: inset 3px 0 0 var(--color-brand);
}

.report-panel--split {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.report-panel--split > div {
    min-width: 0;
    display: grid;
    gap: 10px;
}

.report-panel--split h3 {
    font-size: 0.95rem;
}

.report-panel__header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--color-border);
}

.report-panel__header div {
    min-width: 0;
}

.report-panel__header h3,
.report-trend-grid h4 {
    font-size: 0.98rem;
    line-height: 1.25;
}

.report-panel__header span,
.report-trend-grid h4 + .report-bar-list .report-bar-row__label small {
    color: var(--color-muted);
}

.report-panel__header a {
    color: var(--color-brand-strong);
    font-size: 0.82rem;
    font-weight: 850;
    white-space: nowrap;
}

.report-trend-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.report-trend-grid--three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.report-trend-grid article {
    min-width: 0;
    display: grid;
    gap: 8px;
    padding: 10px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    background: var(--color-surface-raised);
}

.report-ring-widget {
    display: grid;
    grid-template-columns: 132px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
}

.report-ring-widget--small {
    grid-template-columns: 112px minmax(0, 1fr);
}

.report-bar-list {
    display: grid;
    gap: 9px;
}

.report-bar-list--dense {
    gap: 7px;
}

.report-bar-row {
    display: grid;
    grid-template-columns: minmax(104px, 0.85fr) minmax(100px, 1fr) minmax(34px, auto);
    gap: 10px;
    align-items: center;
    min-width: 0;
}

.report-bar-row__label {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.report-bar-row__label strong,
.report-bar-row__label small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.report-bar-row__label strong {
    font-size: 0.82rem;
}

.report-bar-row__label small {
    color: var(--color-muted);
    font-size: 0.74rem;
}

.report-bar-row__track {
    height: 10px;
    overflow: hidden;
    border: 1px solid var(--color-border);
    border-radius: 999px;
    background: var(--color-surface);
}

.report-bar-row__fill {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--color-info);
}

.report-bar-row__fill--success {
    background: linear-gradient(90deg, var(--color-success), #5ee08a);
}

.report-bar-row__fill--warning {
    background: linear-gradient(90deg, var(--color-warning), #ffd166);
}

.report-bar-row__fill--critical {
    background: linear-gradient(90deg, var(--color-critical), #ff7a70);
}

.report-bar-row__fill--info {
    background: linear-gradient(90deg, var(--color-info), #4cc9f0);
}

.report-bar-row__fill--neutral {
    background: linear-gradient(90deg, var(--color-muted), var(--color-border));
}

.report-bar-row__value {
    text-align: right;
    white-space: nowrap;
}

.report-bar-empty {
    padding: 10px;
    border: 1px dashed var(--color-border);
    border-radius: var(--radius-control);
    color: var(--color-muted);
    font-weight: 750;
}

.report-insight-list,
.report-row-list {
    display: grid;
    gap: 8px;
}

.report-insight {
    display: grid;
    gap: 4px;
    padding: 10px 11px;
    border: 1px solid var(--color-border);
    border-left-width: 3px;
    border-radius: var(--radius-card);
    background: var(--color-surface-raised);
}

.report-insight span {
    width: fit-content;
    color: var(--color-muted);
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.report-insight strong {
    line-height: 1.25;
}

.report-insight small {
    color: var(--color-muted);
}

.report-insight em {
    color: var(--color-brand-strong);
    font-style: normal;
    font-weight: 850;
}

.report-insight--critical,
.report-row-list__item--critical {
    border-left-color: var(--color-critical);
    background: linear-gradient(90deg, var(--color-critical-soft), var(--color-surface-raised) 58%);
}

.report-insight--warning,
.report-row-list__item--warning {
    border-left-color: var(--color-warning);
    background: linear-gradient(90deg, var(--color-warning-soft), var(--color-surface-raised) 58%);
}

.report-insight--success,
.report-row-list__item--success {
    border-left-color: var(--color-success);
    background: linear-gradient(90deg, var(--color-success-soft), var(--color-surface-raised) 58%);
}

.report-insight--info,
.report-row-list__item--info {
    border-left-color: var(--color-info);
}

.report-row-list__item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 10px 11px;
    border: 1px solid var(--color-border);
    border-left-width: 3px;
    border-radius: var(--radius-card);
    background: var(--color-surface-raised);
}

.report-row-list__item span {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.report-row-list__item span:last-child {
    text-align: right;
}

.report-row-list__item strong,
.report-row-list__item small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.report-row-list__item small {
    color: var(--color-muted);
}

@media (max-width: 1180px) {
    .profile-menu__identity {
        display: none;
    }

    .stat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-grid,
    .operations-dashboard-grid,
    .workspace-grid,
    .two-column-grid,
    .inventory-dashboard-grid,
    .asset-detail-grid,
    .asset-related-grid,
    .transfer-workbench,
    .label-workbench,
    .helpdesk-dashboard-grid,
    .ticket-workspace-grid,
    .ticket-hero,
    .knowledge-dashboard-grid,
    .knowledge-article-layout,
    .knowledge-article-hero,
    .knowledge-suggestion-grid,
    .faq-grid,
    .category-grid,
    .review-board,
    .report-layout,
    .report-layout--executive,
    .receive-workflow {
        grid-template-columns: 1fr;
    }

    .report-stat-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .report-trend-grid,
    .report-trend-grid--three {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .workflow-steps {
        position: static;
    }

    .filter-grid,
    .form-grid,
    .asset-summary-grid,
    .comment-composer,
    .category-card__metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .inventory-assets-workspace .filter-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .dashboard-chart-grid,
    .dashboard-risk-grid {
        grid-template-columns: 1fr;
    }

    .transfer-route-panel {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .label-filter-panel {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .label-search-field {
        grid-column: 1 / -1;
    }

    .transfer-route-address {
        grid-column: 1 / -1;
    }

    .transfer-result-panel {
        grid-template-columns: 1fr;
    }

    .transfer-result-panel div {
        border-right: 0;
        border-bottom: 1px solid var(--color-border);
    }

    .transfer-result-panel div:last-child {
        border-bottom: 0;
    }

    .comment-composer .button {
        align-self: stretch;
    }

    .asset-issue-popover {
        top: calc(100% - 2px);
        right: auto;
        left: 0;
        width: min(430px, 100%);
        transform: translateY(-6px);
    }

    .asset-context-card--interactive:hover .asset-issue-popover,
    .asset-context-card--interactive:focus .asset-issue-popover,
    .asset-context-card--interactive:focus-within .asset-issue-popover {
        transform: translateY(0);
    }

    .asset-hero {
        grid-template-columns: 110px minmax(0, 1fr);
    }

    .asset-quick-actions {
        grid-column: 1 / -1;
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .ops-shell {
        grid-template-columns: 1fr;
    }

    .module-header__top {
        grid-template-columns: 1fr;
        row-gap: 8px;
    }

    .workspace-toolbar {
        align-items: stretch;
        flex-direction: column;
        justify-self: stretch;
    }

    .workspace-toolbar .global-search {
        width: 100%;
    }

    .workspace-toolbar__actions {
        justify-content: space-between;
    }

    .inventory-assets-workspace .filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ring-chart-layout,
    .ring-chart-layout--compact,
    .report-ring-widget,
    .report-ring-widget--small {
        grid-template-columns: 1fr;
        justify-items: center;
        text-align: center;
    }

    .ring-legend {
        width: 100%;
        text-align: left;
    }

    .asset-page-bar {
        grid-template-columns: 1fr;
    }

    .asset-page-size,
    .asset-page-actions {
        grid-column: 1;
    }

    .asset-page-actions {
        justify-self: stretch;
    }

    .transfer-route-panel {
        grid-template-columns: 1fr;
    }

    .label-filter-panel {
        grid-template-columns: 1fr;
    }

    .label-search-field {
        grid-column: auto;
    }

    .transfer-equipment-row {
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
    }

    .label-inventory-row {
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
    }

    .label-inventory-row .status-pill {
        justify-self: start;
    }

    .transfer-equipment-row .status-pill {
        justify-self: start;
    }

    .asset-pagination {
        align-items: stretch;
        flex-direction: column;
    }

    .asset-pagination__controls {
        justify-content: space-between;
    }

    .app-brand--sidebar {
        border-bottom: 0;
        margin-bottom: 0;
        padding-bottom: 0;
    }

    .left-nav {
        border-right: 0;
        border-bottom: 1px solid var(--sidebar-border);
        overflow: visible;
        position: static;
        height: auto;
    }

    .left-nav__primary {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .module-header {
        position: static;
        padding-inline: 18px;
    }

    .ops-content {
        padding: 18px;
    }
}

@media (max-width: 640px) {
    .left-nav__primary,
    .stat-grid,
    .stat-grid--compact,
    .filter-grid,
    .form-grid,
    .asset-summary-grid,
    .asset-info-grid,
    .asset-quick-actions,
    .asset-hero,
    .ticket-summary-grid,
    .comment-composer,
    .category-card__metrics {
        grid-template-columns: 1fr;
    }

    .inventory-assets-workspace .filter-grid {
        grid-template-columns: 1fr;
    }

    .page-header,
    .toolbar,
    .alert-card,
    .empty-state,
    .loading-state {
        align-items: stretch;
        flex-direction: column;
    }

    .page-header__actions,
    .toolbar__actions {
        justify-content: stretch;
    }

    .ticket-header-actions,
    .ticket-header-buttons,
    .ticket-header-person,
    .ticket-header-assignee {
        width: 100%;
    }

    .ticket-header-actions,
    .ticket-header-buttons,
    .ticket-request__topline,
    .ticket-request__meta {
        justify-content: stretch;
    }

    .ticket-header-assignee .ticket-assignee-select {
        flex: 1;
        min-width: 0;
    }

    .ticket-request__meta {
        display: grid;
        grid-template-columns: 1fr;
    }

    .ticket-request__meta div {
        justify-content: space-between;
    }

    .ticket-request__meta dd {
        max-width: 100%;
        text-align: right;
        white-space: normal;
    }

    .button {
        width: 100%;
    }

    .asset-page-size {
        justify-self: stretch;
        justify-content: center;
    }

    .asset-page-actions {
        justify-content: stretch;
    }

    .asset-page-actions .button {
        flex: 1 1 0;
        width: auto;
    }

    .asset-pagination__controls {
        justify-content: center;
    }

    .asset-pagination .button {
        width: auto;
    }

    .report-page__header,
    .report-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .report-actions {
        justify-content: stretch;
    }

    .report-actions .button {
        width: 100%;
    }

    .report-stat-grid,
    .report-trend-grid,
    .report-trend-grid--three,
    .report-panel--split {
        grid-template-columns: 1fr;
    }

    .report-bar-row,
    .report-row-list__item {
        grid-template-columns: 1fr;
    }

    .report-row-list__item span:last-child {
        text-align: left;
    }
}