h1:focus {
    outline: none;
}

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

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

.validation-message {
    color: #e50000;
}

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

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

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

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}
:root {
    --pf-surface-elevated: color-mix(in srgb, var(--mud-palette-surface) 92%, transparent);
    --pf-border-soft: color-mix(in srgb, var(--mud-palette-text-primary) 10%, transparent);
    --pf-border-strong: color-mix(in srgb, var(--mud-palette-primary) 25%, transparent);
    --pf-accent-soft: color-mix(in srgb, var(--mud-palette-primary) 8%, transparent);
}

html,
body {
    background: var(--mud-palette-background);
}

.app-shell {
    min-height: 100vh;
}

.shell-appbar {
    backdrop-filter: blur(18px);
    border-bottom: 1px solid var(--pf-border-soft);
    box-shadow: 0 6px 18px color-mix(in srgb, var(--mud-palette-primary) 8%, transparent);
}

.shell-drawer {
    border-right: 1px solid var(--pf-border-soft);
    background: color-mix(in srgb, var(--mud-palette-drawer-background) 96%, var(--mud-palette-background));
}

.shell-content {
    min-height: calc(100vh - 64px);
    background:
        radial-gradient(circle at top right, color-mix(in srgb, var(--mud-palette-primary) 10%, transparent), transparent 32%),
        linear-gradient(180deg, color-mix(in srgb, var(--mud-palette-surface) 55%, var(--mud-palette-background)), var(--mud-palette-background));
}

.shell-content:has(.planning-calendar) {
    box-sizing: border-box;
    height: 100vh;
    height: 100dvh;
    min-height: 0;
    overflow: hidden;
}

.shell-content--public {
    max-width: 1180px;
    margin: 0 auto;
}

.shell-content--public:has(.profo-login) {
    max-width: none;
    min-height: 100vh;
    margin: 0;
    padding: 0 !important;
}

body:has(.profo-login) > blazor-focus-on-navigate {
    display: none;
}

body:has(.profo-login) {
    line-height: 0;
}

body:has(.profo-login) .profo-login {
    line-height: normal;
}

.feature-nav {
    padding: 0.75rem;
}

.feature-nav .mud-nav-link,
.feature-nav .mud-nav-group > .mud-nav-link {
    border-radius: 14px;
    margin-bottom: 0.2rem;
}

.feature-nav .mud-nav-link.active,
.feature-nav .mud-nav-group .mud-nav-link.active {
    background: var(--pf-accent-soft);
}

.feature-nav .mud-nav-group .mud-collapse-container {
    margin-left: 0.35rem;
    padding-left: 0.4rem;
    border-left: 1px solid var(--pf-border-soft);
}

.nav-section-label {
    padding: 0 0.8rem 0.5rem;
    opacity: 0.7;
}

.nav-logout-form {
    margin: 0;
}

.nav-logout-button {
    width: 100%;
    border: none;
    background: transparent;
    text-align: left;
    cursor: pointer;
}

.bau-doku-page {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0.5rem !important;
}

.contacts-page {
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
}

.bau-doku-form-page {
    max-width: none;
}

.page-hero {
    padding: 0.45rem 0.55rem;
    border-radius: 10px;
    border: 1px solid var(--pf-border-soft);
    background:
        linear-gradient(105deg, color-mix(in srgb, var(--mud-palette-primary) 6%, transparent), transparent 42%),
        var(--pf-surface-elevated);
    box-shadow: none;
    margin-bottom: 0.5rem;
}

.page-hero--compact {
    padding: 0.4rem 0.55rem;
}

.page-hero__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem;
    flex-wrap: wrap;
}

.page-hero__content {
    min-width: 220px;
    flex: 1 1 380px;
}

.page-hero__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    margin-bottom: 0.08rem;
    font-size: 0.62rem;
    font-weight: 750;
    text-transform: uppercase;
    letter-spacing: 0.055em;
    color: var(--mud-palette-text-secondary);
}

.page-hero__title {
    margin: 0;
    overflow: hidden;
    font-size: 1rem !important;
    font-weight: 750 !important;
    line-height: 1.15;
    text-overflow: ellipsis;
}

.bau-doku-breadcrumb {
    display: flex;
    align-items: center;
    gap: 0.28rem;
    min-width: 0;
    max-width: 100%;
    margin-bottom: 0.08rem;
    overflow-x: auto;
    color: var(--mud-palette-text-secondary);
    font-size: 0.64rem;
    font-weight: 650;
    line-height: 1.2;
    scrollbar-width: none;
    white-space: nowrap;
}

.bau-doku-breadcrumb::-webkit-scrollbar {
    display: none;
}

.bau-doku-breadcrumb__link,
.bau-doku-breadcrumb__current {
    display: inline-block;
    max-width: 190px;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: bottom;
}

.bau-doku-breadcrumb__link {
    color: var(--mud-palette-primary);
    text-decoration: none;
}

.bau-doku-breadcrumb__link:hover,
.bau-doku-breadcrumb__link:focus-visible {
    text-decoration: underline;
}

.bau-doku-breadcrumb__current {
    color: var(--mud-palette-text-primary);
    font-weight: 750;
}

.bau-doku-breadcrumb__separator {
    flex: 0 0 auto;
    color: color-mix(in srgb, var(--mud-palette-text-secondary) 58%, transparent);
}

.page-hero__subtitle {
    margin-top: 0.08rem;
    color: var(--mud-palette-text-secondary);
    font-size: 0.72rem !important;
    line-height: 1.25;
}

.page-hero__meta,
.info-chips {
    display: flex;
    gap: 0.22rem;
    flex-wrap: wrap;
    margin-top: 0.28rem;
}

.page-hero__actions,
.page-actions,
.stack-actions {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    flex-wrap: wrap;
}

.page-hero__meta .mud-chip-root,
.info-chips .mud-chip-root {
    height: 20px;
    font-size: 0.64rem;
}

.page-hero__actions .mud-button-root,
.page-hero__actions .mud-menu .mud-button-root,
.bau-doku-page .stack-actions .mud-button-root,
.bau-doku-page .page-actions .mud-button-root {
    min-height: 30px;
    padding: 2px 9px;
    font-size: 0.7rem;
    white-space: nowrap;
}

.stack-actions .mud-button-root,
.page-actions .mud-button-root {
    white-space: nowrap;
}

.stat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 0.55rem;
    margin-top: 0.75rem;
}

.stat-card {
    border: 1px solid var(--pf-border-soft);
    border-radius: 14px;
    padding: 0.55rem 0.75rem;
    background: color-mix(in srgb, var(--mud-palette-surface) 88%, transparent);
}

.stat-card__label {
    display: block;
    font-size: 0.7rem;
    color: var(--mud-palette-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.18rem;
}

.stat-card__value {
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.2;
}

.entity-card,
.detail-card,
.surface-card {
    border-radius: 10px !important;
    border: 1px solid var(--pf-border-soft);
    background: var(--pf-surface-elevated);
}

.entity-card {
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.bau-doku-page .entity-card {
    padding: 0.55rem !important;
}

.entity-card__title {
    margin: 0;
}

.entity-card__meta {
    color: var(--mud-palette-text-secondary);
    line-height: 1.35;
}

.entity-card__actions {
    margin-top: auto;
    display: flex;
    gap: 0.2rem;
    flex-wrap: wrap;
}

.entity-card__actions .mud-button-root {
    min-height: 27px;
    padding: 1px 6px;
    font-size: 0.68rem;
}

.bau-doku-action-search {
    width: clamp(220px, 28vw, 340px);
}

.bau-doku-action-search .mud-input-control {
    margin: 0;
}

.bau-doku-action-search .mud-input-outlined {
    background: color-mix(in srgb, var(--mud-palette-surface) 92%, transparent);
}

.plan-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(290px, 340px);
    gap: 0.6rem;
    height: calc(100dvh - 155px);
    min-height: 560px;
    max-height: 1000px;
    margin-top: 0.6rem;
    overflow: hidden;
}

.plan-workspace__canvas-column,
.plan-workspace__inspector {
    min-width: 0;
    min-height: 0;
}

.plan-workspace__canvas-card,
.plan-workspace__inspector-card {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.plan-workspace__canvas-card {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}

.plan-workspace__toolbar,
.plan-workspace__tools,
.plan-workspace__mode,
.plan-workspace__inspector-header,
.plan-workspace__selection,
.plan-workspace__filters {
    display: flex;
    align-items: center;
}

.plan-workspace__toolbar,
.plan-workspace__inspector-header,
.plan-workspace__selection {
    justify-content: space-between;
    gap: 0.55rem;
}

.plan-workspace__placement-form {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    padding: 0.65rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 46%, var(--pf-border-soft));
    border-radius: 9px;
    background: color-mix(in srgb, var(--mud-palette-primary) 7%, var(--mud-palette-surface));
}

.plan-workspace__mode,
.plan-workspace__tools,
.plan-workspace__filters {
    gap: 0.25rem;
}

.plan-workspace__tools {
    justify-content: flex-end;
    flex-wrap: wrap;
}

.plan-workspace__tools .mud-icon-button {
    width: 30px;
    height: 30px;
    padding: 5px;
}

.plan-workspace__tools .mud-button-root {
    min-height: 29px;
    padding: 2px 8px;
    font-size: 0.68rem;
}

.plan-workspace__tool-separator {
    width: 1px;
    height: 22px;
    margin-inline: 0.2rem;
    background: var(--pf-border-soft);
}

.plan-workspace__placement-banner {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 34px;
    margin-bottom: 0.4rem;
    padding: 0.25rem 0.35rem 0.25rem 0.55rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 48%, var(--pf-border-soft));
    border-radius: 8px;
    background: color-mix(in srgb, var(--mud-palette-primary) 10%, var(--mud-palette-surface));
    color: var(--mud-palette-text-primary);
    font-size: 0.72rem;
}

.plan-workspace__placement-banner--single {
    border-color: color-mix(in srgb, var(--mud-palette-warning) 55%, var(--pf-border-soft));
    background: color-mix(in srgb, var(--mud-palette-warning) 12%, var(--mud-palette-surface));
}

.plan-workspace__placement-banner > span {
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.plan-workspace__mode-badge {
    padding: 0.12rem 0.42rem;
    border: 1px solid var(--pf-border-soft);
    border-radius: 999px;
    background: color-mix(in srgb, var(--mud-palette-text-secondary) 9%, transparent);
    color: var(--mud-palette-text-secondary);
    font-size: 0.62rem;
    font-weight: 750;
    white-space: nowrap;
}

.plan-workspace__mode-badge--add {
    border-color: color-mix(in srgb, var(--mud-palette-primary) 45%, var(--pf-border-soft));
    background: color-mix(in srgb, var(--mud-palette-primary) 11%, transparent);
    color: var(--mud-palette-primary);
}

.plan-workspace__mode-badge--move {
    border-color: color-mix(in srgb, var(--mud-palette-warning) 48%, var(--pf-border-soft));
    background: color-mix(in srgb, var(--mud-palette-warning) 14%, transparent);
    color: var(--mud-palette-warning-darken);
}

.plan-workspace .plan-editor-stage-shell {
    height: auto;
    min-height: 0;
    flex: 1 1 auto;
    border-radius: 8px;
}

.plan-workspace__inspector-card {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.plan-workspace__filters {
    overflow-x: auto;
    scrollbar-width: thin;
}

.plan-workspace__filter {
    min-height: 25px;
    padding: 0.12rem 0.48rem;
    border: 1px solid var(--pf-border-soft);
    border-radius: 999px;
    background: transparent;
    color: var(--mud-palette-text-secondary);
    cursor: pointer;
    font: inherit;
    font-size: 0.65rem;
    font-weight: 700;
    white-space: nowrap;
}

.plan-workspace__filter:hover,
.plan-workspace__filter:focus-visible {
    border-color: var(--mud-palette-primary);
    color: var(--mud-palette-primary);
}

.plan-workspace__filter--active {
    border-color: var(--mud-palette-primary);
    background: var(--mud-palette-primary);
    color: var(--mud-palette-primary-text);
}

.plan-workspace__selection {
    padding: 0.4rem 0.45rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 42%, var(--pf-border-soft));
    border-radius: 8px;
    background: color-mix(in srgb, var(--mud-palette-primary) 8%, var(--mud-palette-surface));
}

.plan-workspace__selection-copy,
.plan-workspace__item-main,
.plan-workspace__list-copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.plan-workspace__selection-copy strong {
    font-size: 0.74rem;
}

.plan-workspace__selection-copy span {
    color: var(--mud-palette-text-secondary);
    font-size: 0.64rem;
}

.plan-workspace__list {
    display: flex;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 0.35rem;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-right: 0.2rem;
}

.plan-workspace__item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.15rem;
    flex: 0 0 auto;
    overflow: hidden;
    border: 1px solid var(--pf-border-soft);
    border-left: 3px solid var(--mud-palette-lines-default);
    border-radius: 8px;
    background: color-mix(in srgb, var(--mud-palette-surface) 97%, var(--mud-palette-background));
}

.plan-workspace__item--current {
    border-left-color: var(--mud-palette-primary);
}

.plan-workspace__item--selected {
    border-color: color-mix(in srgb, var(--mud-palette-primary) 65%, var(--pf-border-soft));
    background: color-mix(in srgb, var(--mud-palette-primary) 10%, var(--mud-palette-surface));
    box-shadow: inset 3px 0 0 var(--mud-palette-primary);
}

.plan-workspace__item--unplaced {
    border-color: color-mix(in srgb, var(--mud-palette-error) 48%, var(--pf-border-soft));
    border-left-color: var(--mud-palette-error);
}

.plan-workspace__item-actions {
    display: flex;
    align-items: center;
    padding-right: 0.15rem;
}

.plan-workspace__item-actions .mud-icon-button {
    width: 28px;
    height: 28px;
    padding: 4px;
}

.plan-workspace__placement-action--required {
    border-radius: 999px;
    background: color-mix(in srgb, var(--mud-palette-error) 14%, transparent);
}

.plan-workspace__item-select {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.35rem;
    min-width: 0;
    padding: 0.45rem 0.25rem 0.45rem 0.55rem;
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    text-align: left;
}

.plan-workspace__item-title {
    display: flex;
    min-width: 0;
    align-items: baseline;
    gap: 0.35rem;
}

.plan-workspace__item-title strong,
.plan-workspace__item-title span,
.plan-workspace__item-meta,
.plan-workspace__item-plan {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.plan-workspace__item-title strong {
    font-size: 0.74rem;
}

.plan-workspace__item-title span {
    color: var(--mud-palette-text-primary);
    font-size: 0.68rem;
}

.plan-workspace__item-meta,
.plan-workspace__item-plan {
    color: var(--mud-palette-text-secondary);
    font-size: 0.61rem;
    line-height: 1.3;
}

.plan-workspace__item-plan {
    color: var(--mud-palette-primary);
}

.plan-workspace__status {
    padding: 0.1rem 0.38rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--mud-palette-text-secondary) 10%, transparent);
    color: var(--mud-palette-text-secondary);
    font-size: 0.59rem;
    font-weight: 750;
    white-space: nowrap;
}

.plan-workspace__status--open {
    background: color-mix(in srgb, var(--mud-palette-warning) 15%, transparent);
    color: var(--mud-palette-warning-darken);
}

.plan-workspace__status--issue {
    background: color-mix(in srgb, var(--mud-palette-error) 12%, transparent);
    color: var(--mud-palette-error);
}

.plan-workspace__status--done {
    background: color-mix(in srgb, var(--mud-palette-success) 13%, transparent);
    color: var(--mud-palette-success);
}

.plan-workspace__status--progress {
    background: color-mix(in srgb, var(--mud-palette-info) 13%, transparent);
    color: var(--mud-palette-info);
}

.plan-workspace .plan-marker-node .plan-marker-dot {
    background: var(--mud-palette-warning);
    color: var(--mud-palette-warning-text);
}

.plan-workspace .plan-marker-node--issue .plan-marker-dot {
    background: var(--mud-palette-error);
    color: var(--mud-palette-error-text);
}

.plan-workspace .plan-marker-node--done .plan-marker-dot {
    background: var(--mud-palette-success);
    color: var(--mud-palette-success-text);
}

.plan-workspace .plan-marker-node--progress .plan-marker-dot {
    background: var(--mud-palette-info);
    color: var(--mud-palette-info-text);
}

.plan-workspace .plan-marker-node--selected {
    z-index: 5;
}

.plan-workspace .plan-marker-node--selected .plan-marker-dot {
    box-shadow:
        0 0 0 4px color-mix(in srgb, var(--mud-palette-primary) 38%, transparent),
        0 8px 20px rgba(0, 0, 0, 0.28);
    transform: translate(-50%, -50%) scale(1.12);
}

.plan-workspace .plan-marker-node--selected .plan-marker-label {
    border-color: var(--mud-palette-primary);
    font-weight: 800;
}

.site-overview-card {
    min-height: 0;
}

.site-buildings-overview {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 360px);
    gap: 0.5rem;
    align-items: stretch;
}

.site-buildings-overview--list-only {
    grid-template-columns: minmax(0, 1fr);
}

.site-overview-panel {
    position: sticky;
    top: 1rem;
    display: flex;
    min-width: 0;
    min-height: 0;
    flex-direction: column;
    gap: 0.45rem;
    overflow: hidden;
}

.site-overview-panel__heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem;
    min-width: 0;
}

.site-overview-panel__identity,
.site-overview-panel__actions {
    display: inline-flex;
    align-items: center;
    min-width: 0;
}

.site-overview-panel__identity {
    gap: 0.45rem;
}

.site-overview-panel__actions {
    flex: 0 0 auto;
    gap: 0.25rem;
}

.site-overview-panel__title {
    overflow: hidden;
    color: var(--mud-palette-text-primary);
    font-size: 0.85rem;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.site-overview-panel__count {
    flex: 0 0 auto;
    color: var(--mud-palette-text-secondary);
    font-size: 0.7rem;
    font-weight: 700;
}

.site-overview-panel__visual {
    position: relative;
    min-height: 280px;
    border: 1px solid var(--pf-border-soft);
    border-radius: 18px;
    overflow: hidden;
    background: color-mix(in srgb, var(--mud-palette-surface) 84%, var(--mud-palette-background));
    color: inherit;
    text-decoration: none;
}

.site-overview-panel__visual--plan {
    display: block;
    min-height: 0;
}

.site-overview-image {
    width: 100%;
    height: auto;
    display: block;
    background: var(--mud-palette-background);
}

.site-plan-preview {
    position: relative;
}

.site-plan-viewer {
    width: 100%;
    min-height: 320px;
    flex: 1 1 auto;
    isolation: isolate;
}

.site-plan-viewer .site-plan-viewer__marker {
    display: block;
    width: 0;
    height: 0;
    overflow: visible;
    transform: none;
}

.site-plan-viewer__marker-ui {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 0;
    height: 0;
    transform: scale(var(--plan-overview-marker-scale, 1));
    transform-origin: 0 0;
    will-change: transform;
}

.site-plan-viewer .site-plan-marker__dot {
    position: absolute;
    top: 0;
    left: 0;
    min-width: 34px;
    min-height: 34px;
    font-size: 0.76rem;
    transform: translate(-50%, -50%);
}

.site-plan-viewer .site-plan-marker__label {
    position: absolute;
    top: 0;
    left: 23px;
    max-width: 170px;
    font-size: 0.74rem;
    text-align: left;
    transform: translateY(-50%);
}

.site-plan-viewer .site-plan-marker:hover .site-plan-marker__dot,
.site-plan-viewer .site-plan-marker:focus-visible .site-plan-marker__dot {
    transform: translate(-50%, -50%) scale(1.08);
}

.site-plan-viewer .site-plan-marker--highlighted .site-plan-marker__dot {
    transform: translate(-50%, -50%) scale(1.16);
}

.site-plan-manager {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(270px, 340px);
    gap: 0.65rem;
    align-items: stretch;
    min-height: min(72vh, 820px);
}

.site-plan-manager__preview-card,
.site-plan-manager__rail {
    min-width: 0;
    overflow: hidden;
}

.site-plan-manager__preview-card {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

.site-plan-manager__preview-header,
.site-plan-manager__rail-header,
.site-plan-manager__preview-signals,
.site-plan-manager__preview-actions,
.site-plan-manager__item-actions {
    display: flex;
    align-items: center;
}

.site-plan-manager__preview-header,
.site-plan-manager__rail-header {
    justify-content: space-between;
    gap: 0.65rem;
}

.site-plan-manager__preview-identity {
    min-width: 0;
}

.site-plan-manager__preview-signals,
.site-plan-manager__preview-actions {
    flex-wrap: wrap;
    gap: 0.35rem;
}

.site-plan-manager__preview-button {
    display: grid;
    min-width: 0;
    min-height: 0;
    flex: 1 1 auto;
    place-items: center;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--pf-border-soft);
    border-radius: 12px;
    background:
        linear-gradient(45deg, color-mix(in srgb, var(--mud-palette-lines-default) 13%, transparent) 25%, transparent 25%, transparent 75%, color-mix(in srgb, var(--mud-palette-lines-default) 13%, transparent) 75%),
        linear-gradient(45deg, color-mix(in srgb, var(--mud-palette-lines-default) 13%, transparent) 25%, transparent 25%, transparent 75%, color-mix(in srgb, var(--mud-palette-lines-default) 13%, transparent) 75%),
        color-mix(in srgb, var(--mud-palette-background) 88%, var(--mud-palette-surface));
    background-position: 0 0, 8px 8px;
    background-size: 16px 16px;
    color: inherit;
    cursor: zoom-in;
}

.site-plan-manager__preview-button:hover,
.site-plan-manager__preview-button:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--mud-palette-primary) 58%, transparent);
    outline-offset: -2px;
}

.site-plan-manager__preview {
    width: 100%;
    min-height: 0;
    flex: 1 1 auto;
    overflow: hidden;
}

.site-plan-manager__preview > .site-plan-viewer {
    height: 100%;
    min-height: 0;
}

.site-plan-manager__preview-actions {
    justify-content: flex-end;
}

.site-plan-manager__rail {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.site-plan-manager__list {
    display: flex;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 0.4rem;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-right: 0.2rem;
}

.site-plan-manager__item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.25rem;
    padding: 0.3rem;
    border: 1px solid var(--pf-border-soft);
    border-radius: 9px;
    background: color-mix(in srgb, var(--mud-palette-surface) 96%, var(--mud-palette-background));
}

.site-plan-manager__item--active {
    border-color: color-mix(in srgb, var(--mud-palette-primary) 64%, var(--pf-border-soft));
    background: color-mix(in srgb, var(--mud-palette-primary) 9%, var(--mud-palette-surface));
    box-shadow: inset 3px 0 0 var(--mud-palette-primary);
}

.site-plan-manager__select {
    display: grid;
    grid-template-columns: 76px minmax(0, 1fr);
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    text-align: left;
}

.site-plan-manager__thumbnail {
    display: grid;
    width: 76px;
    height: 54px;
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--pf-border-soft);
    border-radius: 6px;
    background: var(--mud-palette-background);
}

.site-plan-manager__thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.site-plan-manager__list-copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 0.12rem;
}

.site-plan-manager__list-copy strong,
.site-plan-manager__list-copy > span:not(.site-plan-manager__coverage) {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.site-plan-manager__list-copy strong {
    font-size: 0.78rem;
}

.site-plan-manager__list-copy > span {
    color: var(--mud-palette-text-secondary);
    font-size: 0.66rem;
}

.site-plan-manager__coverage {
    width: fit-content;
    margin-top: 0.08rem;
    padding: 0.08rem 0.35rem;
    border-radius: 999px;
    font-size: 0.61rem !important;
    font-weight: 750;
}

.site-plan-manager__coverage--complete {
    background: color-mix(in srgb, var(--mud-palette-success) 14%, transparent);
    color: var(--mud-palette-success);
}

.site-plan-manager__coverage--open {
    background: color-mix(in srgb, var(--mud-palette-warning) 15%, transparent);
    color: var(--mud-palette-warning-darken);
}

.site-plan-manager__coverage--empty {
    background: color-mix(in srgb, var(--mud-palette-text-secondary) 12%, transparent);
    color: var(--mud-palette-text-secondary);
}

.site-plan-manager__item-actions {
    gap: 0.05rem;
}

.site-plan-marker {
    position: absolute;
    z-index: 2;
    --site-marker-bg: var(--mud-palette-primary);
    --site-marker-fg: var(--mud-palette-primary-text);
    --site-marker-ring: color-mix(in srgb, var(--mud-palette-primary) 38%, transparent);
    display: inline-flex;
    align-items: center;
    flex-direction: column;
    gap: 0.18rem;
    transform: translate(-50%, -50%);
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    padding: 0;
    text-align: center;
}

.site-plan-marker__dot {
    min-width: 24px;
    min-height: 24px;
    padding: 0 0.42rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--site-marker-bg);
    color: var(--site-marker-fg);
    border: 2px solid var(--mud-palette-surface);
    box-shadow: 0 8px 18px var(--site-marker-ring), 0 0 0 1px rgba(0, 0, 0, 0.22);
    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1;
}

.site-plan-marker--measurement-open {
    --site-marker-bg: var(--mud-palette-warning);
    --site-marker-fg: var(--mud-palette-warning-text);
    --site-marker-ring: color-mix(in srgb, var(--mud-palette-warning) 40%, transparent);
}

.site-plan-marker--issue-open {
    --site-marker-bg: var(--mud-palette-error);
    --site-marker-fg: var(--mud-palette-error-text);
    --site-marker-ring: color-mix(in srgb, var(--mud-palette-error) 40%, transparent);
}

.site-plan-marker--measured,
.site-plan-marker--accepted {
    --site-marker-bg: var(--mud-palette-success);
    --site-marker-fg: var(--mud-palette-success-text);
    --site-marker-ring: color-mix(in srgb, var(--mud-palette-success) 34%, transparent);
}

.site-plan-marker--progress {
    --site-marker-bg: var(--mud-palette-info);
    --site-marker-fg: var(--mud-palette-info-text);
    --site-marker-ring: color-mix(in srgb, var(--mud-palette-info) 34%, transparent);
}

.site-plan-marker--created,
.site-plan-marker--empty {
    --site-marker-bg: var(--mud-palette-text-secondary);
    --site-marker-fg: var(--mud-palette-surface);
    --site-marker-ring: color-mix(in srgb, var(--mud-palette-text-secondary) 26%, transparent);
}

.site-plan-marker__label {
    max-width: 150px;
    padding: 0.12rem 0.45rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--mud-palette-surface) 94%, transparent);
    border: 1px solid var(--pf-border-soft);
    color: var(--mud-palette-text-primary);
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.16);
    font-size: 0.72rem;
    line-height: 1.15;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.site-plan-marker:hover .site-plan-marker__dot,
.site-plan-marker:focus-visible .site-plan-marker__dot {
    transform: scale(1.08);
}

.site-plan-marker:focus-visible {
    outline: 2px solid var(--mud-palette-primary);
    outline-offset: 5px;
}

.site-plan-preview--highlighting .site-plan-marker:not(.site-plan-marker--highlighted) {
    opacity: 0.24;
}

.site-plan-marker--highlighted {
    z-index: 4;
}

.site-plan-marker--highlighted .site-plan-marker__dot {
    border-color: var(--mud-palette-surface);
    box-shadow:
        0 0 0 4px var(--site-marker-ring),
        0 14px 28px rgba(0, 0, 0, 0.24);
    transform: scale(1.16);
}

.site-plan-marker--highlighted .site-plan-marker__label {
    font-weight: 800;
    border-color: color-mix(in srgb, var(--site-marker-bg) 55%, var(--pf-border-soft));
}

.site-plan-marker--large .site-plan-marker__dot {
    min-width: 32px;
    min-height: 32px;
    font-size: 0.86rem;
}

.site-plan-marker--large .site-plan-marker__label {
    max-width: 220px;
    font-size: 0.82rem;
}

.site-plan-lightbox {
    position: fixed;
    inset: 0;
    z-index: 1400;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.25rem;
}

.site-plan-lightbox__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(8, 13, 24, 0.74);
    backdrop-filter: blur(4px);
}

.site-plan-lightbox__panel {
    position: relative;
    z-index: 1;
    width: min(1180px, 96vw);
    height: 94vh;
    max-height: 94vh;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    overflow: hidden;
}

.site-plan-lightbox__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.site-plan-lightbox__stage {
    min-height: 0;
    flex: 1 1 auto;
    overflow: hidden;
    text-align: center;
    border-radius: 18px;
    background: color-mix(in srgb, var(--mud-palette-background) 78%, #000);
}

.site-plan-lightbox__stage > .site-plan-viewer {
    height: 100%;
    min-height: 0;
    border: 0;
    border-radius: 0;
}

.site-plan-preview--large {
    display: inline-block;
    max-width: 100%;
    border-radius: 18px;
}

.site-plan-preview--large .site-overview-image {
    width: auto;
    max-width: 100%;
    max-height: calc(94vh - 170px);
}

.osm-fallback-map,
.site-overview-panel__empty {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 0.45rem;
    padding: 1.5rem;
    text-align: center;
}

.osm-fallback-map--interactive {
    align-items: stretch;
    justify-content: stretch;
    min-height: 280px;
    padding: 0;
}

.osm-fallback-map--interactive.osm-map-ready::before {
    display: none;
}

.osm-fallback-map--interactive iframe {
    position: relative;
    z-index: 1;
    width: 100%;
    min-height: 280px;
    border: 0;
    flex: 1 1 auto;
    background: var(--mud-palette-background);
}

.osm-static-map {
    position: relative;
    z-index: 1;
    width: 100%;
    min-height: 280px;
    overflow: hidden;
    background: color-mix(in srgb, var(--mud-palette-background) 86%, var(--mud-palette-primary));
}

.osm-tile-layer,
.osm-marker-layer {
    position: absolute;
    inset: 0;
}

.osm-tile-layer img {
    position: absolute;
    width: 256px;
    height: 256px;
    max-width: none;
    user-select: none;
}

.osm-marker-layer {
    z-index: 2;
}

.osm-map-marker {
    position: absolute;
    display: inline-flex;
    align-items: center;
    flex-direction: column;
    gap: 0.15rem;
    transform: translate(-50%, calc(-100% + 6px));
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    padding: 0;
    text-align: center;
    text-decoration: none;
}

.osm-map-marker__dot {
    min-width: 28px;
    min-height: 28px;
    padding: 0 0.48rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--mud-palette-primary);
    color: var(--mud-palette-primary-text);
    border: 2px solid var(--mud-palette-surface);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.24);
    font-size: 0.74rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    text-transform: uppercase;
    line-height: 1;
    transition: transform 160ms ease, box-shadow 160ms ease;
}

.osm-map-marker__label {
    max-width: 150px;
    padding: 0.12rem 0.45rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--mud-palette-surface) 95%, transparent);
    border: 1px solid var(--pf-border-soft);
    color: var(--mud-palette-text-primary);
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.18);
    font-size: 0.72rem;
    line-height: 1.15;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.osm-map-marker--building .osm-map-marker__dot {
    background: var(--mud-palette-info);
    color: var(--mud-palette-info-text);
}

.osm-map-marker:hover .osm-map-marker__dot,
.osm-map-marker:focus-visible .osm-map-marker__dot {
    transform: scale(1.08);
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.28);
}

.osm-map-marker:focus-visible {
    outline: 2px solid var(--mud-palette-primary);
    outline-offset: 6px;
}

.osm-map-marker__popover {
    position: absolute;
    left: 50%;
    bottom: calc(100% + 0.4rem);
    min-width: 170px;
    max-width: 240px;
    transform: translateX(-50%) translateY(4px);
    display: grid;
    gap: 0.18rem;
    padding: 0.48rem 0.6rem;
    border-radius: 12px;
    background: color-mix(in srgb, var(--mud-palette-surface) 96%, transparent);
    border: 1px solid var(--pf-border-soft);
    color: var(--mud-palette-text-primary);
    box-shadow: 0 16px 34px rgba(0, 0, 0, 0.22);
    font-size: 0.72rem;
    line-height: 1.25;
    text-align: left;
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
    transition: opacity 160ms ease, transform 160ms ease, visibility 160ms ease;
}

.osm-map-marker:hover .osm-map-marker__popover,
.osm-map-marker:focus-visible .osm-map-marker__popover {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
}

.osm-map-attribution {
    position: absolute;
    right: 0.5rem;
    bottom: 0.45rem;
    z-index: 3;
    padding: 0.16rem 0.38rem;
    border-radius: 7px;
    background: rgba(255, 255, 255, 0.82);
    color: #1f2937;
    font-size: 0.68rem;
    line-height: 1;
    text-decoration: none;
}

.osm-map-status {
    position: relative;
    z-index: 1;
    width: 100%;
    min-height: 280px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 0.4rem;
    padding: 1.5rem;
    text-align: center;
}

.osm-map-status__icon {
    width: 42px;
    height: 42px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--mud-palette-primary);
    color: var(--mud-palette-primary-text);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    box-shadow: 0 12px 26px color-mix(in srgb, var(--mud-palette-primary) 30%, transparent);
}

.osm-map-status span {
    color: var(--mud-palette-text-secondary);
    line-height: 1.35;
}

.osm-map-status a {
    color: var(--mud-palette-primary);
    font-weight: 600;
    text-decoration: none;
}

.osm-map-caption {
    position: absolute;
    left: 0.75rem;
    right: 0.75rem;
    bottom: 0.75rem;
    z-index: 2;
    padding: 0.38rem 0.65rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--mud-palette-surface) 92%, transparent);
    border: 1px solid var(--pf-border-soft);
    color: var(--mud-palette-text-secondary);
    font-size: 0.78rem;
    line-height: 1.2;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.osm-map-caption a {
    color: var(--mud-palette-primary);
    font-weight: 600;
    text-decoration: none;
}

.osm-fallback-map::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--mud-palette-primary) 16%, transparent) 1px, transparent 1px),
        linear-gradient(0deg, color-mix(in srgb, var(--mud-palette-primary) 16%, transparent) 1px, transparent 1px),
        radial-gradient(circle at 28% 34%, color-mix(in srgb, var(--mud-palette-primary) 28%, transparent), transparent 26%),
        radial-gradient(circle at 74% 66%, color-mix(in srgb, var(--mud-palette-secondary) 22%, transparent), transparent 24%);
    background-size: 32px 32px, 32px 32px, 100% 100%, 100% 100%;
    opacity: 0.55;
}

.osm-fallback-map > *,
.site-overview-panel__empty > * {
    position: relative;
    z-index: 1;
}

.site-building-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-height: 0;
    max-height: min(78vh, 920px);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 0.1rem 0.35rem 0.7rem 0.1rem;
    scroll-padding-block: 0.7rem;
}

.site-buildings-overview--list-only .site-building-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    max-height: none;
    overflow: visible;
    padding: 0;
}

.site-building-list > .mud-alert {
    grid-column: 1 / -1;
}

.site-building-card {
    --site-building-accent: var(--mud-palette-primary);
    --site-building-fg: var(--mud-palette-primary-text);
    --site-building-soft: color-mix(in srgb, var(--mud-palette-primary) 9%, transparent);
    min-height: 0;
    border-left: 4px solid var(--site-building-accent) !important;
    border-color: color-mix(in srgb, var(--site-building-accent) 32%, var(--pf-border-soft)) !important;
    background:
        linear-gradient(90deg, var(--site-building-soft), transparent 54%),
        color-mix(in srgb, var(--mud-palette-surface) 96%, var(--site-building-accent));
}

.site-building-card--measurement-open {
    --site-building-accent: var(--mud-palette-warning);
    --site-building-fg: var(--mud-palette-warning-text);
    --site-building-soft: color-mix(in srgb, var(--mud-palette-warning) 12%, transparent);
}

.site-building-card--issue-open {
    --site-building-accent: var(--mud-palette-error);
    --site-building-fg: var(--mud-palette-error-text);
    --site-building-soft: color-mix(in srgb, var(--mud-palette-error) 10%, transparent);
}

.site-building-card--measured,
.site-building-card--accepted {
    --site-building-accent: var(--mud-palette-success);
    --site-building-fg: var(--mud-palette-success-text);
    --site-building-soft: color-mix(in srgb, var(--mud-palette-success) 10%, transparent);
}

.site-building-card--progress {
    --site-building-accent: var(--mud-palette-info);
    --site-building-fg: var(--mud-palette-info-text);
    --site-building-soft: color-mix(in srgb, var(--mud-palette-info) 10%, transparent);
}

.site-building-card--created,
.site-building-card--empty {
    --site-building-accent: var(--mud-palette-text-secondary);
    --site-building-fg: var(--mud-palette-surface);
    --site-building-soft: color-mix(in srgb, var(--mud-palette-text-secondary) 8%, transparent);
}

.site-building-card--highlighted {
    border-color: color-mix(in srgb, var(--site-building-accent) 70%, var(--pf-border-soft)) !important;
    border-left-color: var(--site-building-accent) !important;
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--site-building-accent) 16%, transparent), transparent 58%),
        color-mix(in srgb, var(--mud-palette-surface) 92%, var(--site-building-accent));
    box-shadow: 0 10px 24px color-mix(in srgb, var(--site-building-accent) 18%, transparent);
    transform: translateX(-1px);
}

.site-building-card__content {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    min-height: 0;
}

.site-building-card__head {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    min-width: 0;
}

.site-building-card__status-dot {
    width: 1.8rem;
    height: 1.8rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    background: var(--site-building-accent);
    color: var(--site-building-fg);
    box-shadow: 0 8px 18px color-mix(in srgb, var(--site-building-accent) 28%, transparent);
}

.site-building-card__identity {
    min-width: 0;
    flex: 1 1 auto;
}

.site-building-card__title,
.site-building-card__address {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.site-building-card__status {
    align-self: flex-start;
    border-radius: 999px;
    background: var(--site-building-accent);
    color: var(--site-building-fg);
    flex: 0 0 auto;
    font-size: 0.68rem;
    font-weight: 800;
    line-height: 1;
    padding: 0.28rem 0.45rem;
    white-space: nowrap;
}

.site-building-card__signals {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.28rem;
}

.site-building-card__signal {
    display: inline-flex;
    align-items: center;
    gap: 0.22rem;
    border: 1px solid color-mix(in srgb, var(--site-building-accent) 32%, var(--pf-border-soft));
    border-radius: 999px;
    background: color-mix(in srgb, var(--mud-palette-surface) 90%, var(--site-building-accent));
    color: var(--mud-palette-text-secondary);
    font-size: 0.68rem;
    font-weight: 800;
    line-height: 1;
    padding: 0.22rem 0.4rem;
}

.site-building-card__signal .mud-icon-root {
    width: 0.82rem;
    height: 0.82rem;
    font-size: 0.82rem;
}

.site-building-card__signal--measurement-open,
.site-building-card__signal--issue {
    color: var(--site-building-accent);
}

.site-building-card__signal--measurement-done {
    color: var(--mud-palette-success);
}

.site-building-card__actions {
    margin-top: 0;
}

.building-workflow-list {
    display: grid;
    gap: 0.55rem;
}

.building-level-tabs {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    overflow-x: auto;
    padding: 0.18rem;
    margin-bottom: 0.35rem;
    border: 1px solid var(--pf-border-soft);
    border-radius: 999px;
    background: color-mix(in srgb, var(--mud-palette-surface) 94%, transparent);
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--mud-palette-white) 55%, transparent);
}

.building-level-tab {
    min-width: 0;
    border: 1px solid transparent;
    border-radius: 999px;
    background: transparent;
    color: var(--mud-palette-text-primary);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    gap: 0.35rem;
    padding: 0.28rem 0.58rem;
    text-align: left;
    white-space: nowrap;
    transition: background 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.building-level-tab:hover {
    background: color-mix(in srgb, var(--mud-palette-primary) 9%, transparent);
    border-color: color-mix(in srgb, var(--mud-palette-primary) 26%, transparent);
}

.building-level-tab--active {
    background: linear-gradient(135deg, var(--mud-palette-primary), color-mix(in srgb, var(--mud-palette-primary) 72%, var(--mud-palette-secondary)));
    border-color: color-mix(in srgb, var(--mud-palette-primary) 55%, transparent);
    color: var(--mud-palette-primary-text);
    box-shadow: 0 7px 18px color-mix(in srgb, var(--mud-palette-primary) 18%, transparent);
}

.building-level-tab__name {
    font-weight: 800;
    line-height: 1;
}

.building-level-tab__meta {
    border-radius: 999px;
    background: color-mix(in srgb, var(--mud-palette-primary) 12%, transparent);
    font-size: 0.66rem;
    font-weight: 700;
    line-height: 1;
    opacity: 0.82;
    padding: 0.12rem 0.32rem;
}

.building-level-tab--active .building-level-tab__meta {
    background: color-mix(in srgb, var(--mud-palette-primary-text) 18%, transparent);
    opacity: 0.9;
}

.building-level-workflow {
    gap: 0.5rem;
}

.building-level-workflow__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
    margin-bottom: 0.35rem;
}

.building-level-workflow__header--compact {
    justify-content: flex-end;
    gap: 0;
    margin-bottom: 0.2rem;
}

.building-level-workflow__chips,
.building-level-workflow__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.building-level-workflow__name {
    line-height: 1.1;
}

.building-level-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
    gap: 0.6rem;
    align-items: stretch;
    min-height: min(62vh, 620px);
    max-height: min(78vh, 920px);
    overflow: hidden;
}

.building-level-plan-area {
    min-height: 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 0.1rem 0.35rem 0.7rem 0.1rem;
    scroll-padding-block: 0.7rem;
}

.building-level-plan-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 0.55rem;
    align-content: start;
}

.building-level-plan-grid--stacked {
    grid-template-columns: 1fr;
}

.building-plan-card {
    min-height: 0;
}

.building-plan-card--compact {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}

.building-plan-card__topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem;
    min-width: 0;
}

.building-plan-card__identity {
    display: inline-flex;
    align-items: baseline;
    gap: 0.45rem;
    min-width: 0;
}

.building-plan-card__title {
    color: var(--mud-palette-text-primary);
    font-size: 0.85rem;
    font-weight: 800;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.building-plan-card__count {
    color: var(--mud-palette-text-secondary);
    flex: 0 0 auto;
    font-size: 0.7rem;
    font-weight: 700;
    white-space: nowrap;
}

.building-plan-card__quick-actions {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    flex: 0 0 auto;
}

.building-marker-legend-menu .mud-button-root {
    min-height: 24px;
    padding-inline: 0.45rem;
    font-size: 0.72rem;
}

.building-marker-legend-menu__item.mud-disabled {
    color: var(--mud-palette-text-primary) !important;
    opacity: 1 !important;
}

.building-marker-legend-menu__item .mud-list-item-text {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.78rem;
    font-weight: 700;
}

.building-marker-legend__swatch {
    width: 0.52rem;
    height: 0.52rem;
    display: inline-block;
    flex: 0 0 auto;
    border-radius: 999px;
    background: var(--mud-palette-primary);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--mud-palette-surface) 80%, transparent);
}

.building-marker-legend__swatch--created {
    background: var(--mud-palette-warning);
}

.building-marker-legend__swatch--measured,
.building-marker-legend__swatch--accepted {
    background: var(--mud-palette-success);
}

.building-marker-legend__swatch--issue {
    background: var(--mud-palette-error);
}

.building-marker-legend__swatch--progress {
    background: var(--mud-palette-info);
}

.building-plan-card__preview {
    width: 100%;
    position: relative;
    display: block;
    flex: 1 1 auto;
    min-height: 320px;
    margin: 0;
    padding: 0;
    border: 1px solid var(--pf-border-soft);
    border-radius: 16px;
    overflow: hidden;
    background: color-mix(in srgb, var(--mud-palette-background) 88%, var(--mud-palette-surface));
}

.building-plan-card__image-button {
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.building-plan-card__image-button img,
.building-plan-card__image-button svg {
    width: 100%;
    height: 100%;
    display: block;
}

.building-plan-card__image-button:focus-visible {
    outline: 2px solid var(--mud-palette-primary);
    outline-offset: 3px;
}

.building-plan-viewer {
    isolation: isolate;
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--mud-palette-primary) 4%, transparent) 1px, transparent 1px),
        linear-gradient(0deg, color-mix(in srgb, var(--mud-palette-primary) 4%, transparent) 1px, transparent 1px),
        color-mix(in srgb, var(--mud-palette-background) 90%, var(--mud-palette-surface));
    background-size: 24px 24px;
}

.building-plan-viewer__stage {
    position: absolute;
    inset: 0;
    overflow: hidden;
    cursor: grab;
    touch-action: none;
    user-select: none;
}

.building-plan-viewer__stage--dragging {
    cursor: grabbing;
}

.building-plan-viewer__world,
.building-plan-viewer__image-layer {
    position: absolute;
    top: 0;
    left: 0;
    transform-origin: top left;
}

.building-plan-viewer__image-layer {
    transform-origin: center;
    pointer-events: none;
}

.building-plan-viewer__image-layer img {
    display: block;
    max-width: none;
    pointer-events: none;
    user-select: none;
}

.building-plan-viewer .building-plan-viewer__marker {
    width: 0;
    height: 0;
    display: block;
    overflow: visible;
    transform: none;
}

.building-plan-viewer__marker-ui {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    display: block;
    transform: scale(var(--plan-overview-marker-scale, 1));
    transform-origin: 0 0;
    will-change: transform;
}

.building-plan-viewer .building-plan-marker__dot {
    position: absolute;
    top: 0;
    left: 0;
    min-width: 34px;
    min-height: 34px;
    font-size: 0.76rem;
    transform: translate(-50%, -50%);
}

.building-plan-viewer .building-plan-marker__label {
    position: absolute;
    top: 0;
    left: 23px;
    max-width: 150px;
    font-size: 0.74rem;
    text-align: left;
    transform: translateY(-50%);
}

.building-plan-viewer .building-plan-marker__badge {
    top: 7px;
    right: auto;
    left: 11px;
}

.building-plan-viewer .building-plan-marker:hover .building-plan-marker__dot,
.building-plan-viewer .building-plan-marker:focus-visible .building-plan-marker__dot {
    transform: translate(-50%, -50%) scale(1.08);
}

.building-plan-viewer .building-plan-marker--highlighted .building-plan-marker__dot {
    transform: translate(-50%, -50%) scale(1.16);
}

.building-plan-viewer__controls {
    position: absolute;
    top: 0.45rem;
    right: 0.45rem;
    z-index: 10;
    display: inline-flex;
    align-items: center;
    gap: 0.08rem;
    padding: 0.16rem;
    border: 1px solid var(--pf-border-soft);
    border-radius: 999px;
    background: color-mix(in srgb, var(--mud-palette-surface) 92%, transparent);
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.14);
    backdrop-filter: blur(10px);
}

.building-plan-viewer__controls .mud-icon-button {
    width: 28px;
    height: 28px;
    padding: 4px;
}

.building-plan-viewer__zoom {
    min-width: 2.8rem;
    color: var(--mud-palette-text-secondary);
    font-size: 0.68rem;
    font-weight: 800;
    line-height: 1;
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.plan-preview-dialog {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    height: calc(100dvh - 48px);
    min-height: 0;
}

.plan-preview-dialog__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex: 0 0 auto;
    padding: 0.35rem 0.45rem 0.55rem;
    border-bottom: 1px solid var(--pf-border-soft);
}

.plan-preview-dialog__title {
    min-width: 0;
}

.plan-preview-dialog__title .mud-typography {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.plan-preview-dialog__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.25rem;
    flex: 0 0 auto;
    flex-wrap: wrap;
}

.plan-preview-dialog__viewer {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.plan-preview-dialog__viewer > .building-plan-card__preview {
    width: 100%;
    height: 100%;
    min-height: 0;
    border-radius: 12px;
}

.building-plan-marker {
    position: absolute;
    z-index: 2;
    --marker-bg: var(--mud-palette-primary);
    --marker-fg: var(--mud-palette-primary-text);
    --marker-ring: color-mix(in srgb, var(--mud-palette-primary) 34%, transparent);
    display: inline-flex;
    align-items: center;
    flex-direction: column;
    gap: 0.16rem;
    transform: translate(-50%, -50%);
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    padding: 0;
    text-align: center;
}

.building-plan-marker__dot {
    position: relative;
    min-width: 28px;
    min-height: 28px;
    padding: 0 0.5rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--marker-bg);
    color: var(--marker-fg);
    border: 2px solid var(--mud-palette-surface);
    box-shadow: 0 8px 18px var(--marker-ring), 0 0 0 1px rgba(0, 0, 0, 0.24);
    font-size: 0.68rem;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
}

.building-plan-marker__status-icon {
    position: absolute;
    top: -8px;
    right: -8px;
    width: 17px !important;
    height: 17px !important;
    padding: 2px;
    border-radius: 999px;
    background: var(--mud-palette-surface);
    color: var(--marker-bg);
    border: 1px solid var(--marker-bg);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.22);
}

.building-plan-marker__badge {
    position: absolute;
    top: 11px;
    right: -10px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--mud-palette-error);
    color: var(--mud-palette-error-text);
    border: 1px solid var(--mud-palette-surface);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
    font-size: 0.58rem;
    font-weight: 900;
    line-height: 1;
}

.building-plan-marker__label {
    max-width: 120px;
    padding: 0.1rem 0.4rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--mud-palette-surface) 94%, transparent);
    border: 1px solid var(--pf-border-soft);
    color: var(--mud-palette-text-primary);
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.14);
    font-size: 0.68rem;
    line-height: 1.12;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.building-plan-marker--created {
    --marker-bg: var(--mud-palette-warning);
    --marker-fg: var(--mud-palette-warning-text);
    --marker-ring: color-mix(in srgb, var(--mud-palette-warning) 34%, transparent);
}

.building-plan-marker--measured {
    --marker-bg: var(--mud-palette-success);
    --marker-fg: var(--mud-palette-success-text);
    --marker-ring: color-mix(in srgb, var(--mud-palette-success) 30%, transparent);
}

.building-plan-marker--ordered {
    --marker-bg: var(--mud-palette-info);
    --marker-fg: var(--mud-palette-info-text);
    --marker-ring: color-mix(in srgb, var(--mud-palette-info) 30%, transparent);
}

.building-plan-marker--production,
.building-plan-marker--installed,
.building-plan-marker--acceptance {
    --marker-bg: var(--mud-palette-primary);
    --marker-fg: var(--mud-palette-primary-text);
    --marker-ring: color-mix(in srgb, var(--mud-palette-primary) 30%, transparent);
}

.building-plan-marker--issue {
    --marker-bg: var(--mud-palette-error);
    --marker-fg: var(--mud-palette-error-text);
    --marker-ring: color-mix(in srgb, var(--mud-palette-error) 38%, transparent);
}

.building-plan-marker--accepted {
    --marker-bg: var(--mud-palette-success);
    --marker-fg: var(--mud-palette-success-text);
    --marker-ring: color-mix(in srgb, var(--mud-palette-success) 38%, transparent);
}

.building-plan-marker:hover .building-plan-marker__dot,
.building-plan-marker:focus-visible .building-plan-marker__dot {
    transform: scale(1.08);
}

.building-plan-marker:focus-visible {
    outline: 2px solid var(--mud-palette-primary);
    outline-offset: 5px;
}

.building-plan-card__preview--highlighting .building-plan-marker:not(.building-plan-marker--highlighted) {
    opacity: 0.25;
}

.building-plan-marker--highlighted {
    z-index: 4;
}

.building-plan-marker--highlighted .building-plan-marker__dot {
    border-color: var(--mud-palette-surface);
    box-shadow:
        0 0 0 4px var(--marker-ring),
        0 14px 28px rgba(0, 0, 0, 0.24);
    transform: scale(1.16);
}

.building-plan-marker--highlighted .building-plan-marker__label {
    font-weight: 700;
    border-color: color-mix(in srgb, var(--marker-bg) 55%, var(--pf-border-soft));
}

.building-level-elements-panel {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    min-height: 0;
    height: 100%;
    max-height: none;
    overflow: hidden;
}

.building-level-elements-panel__header {
    flex: 0 0 auto;
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    align-items: flex-start;
}

.building-level-elements-panel__tools {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.building-level-element-search {
    flex: 0 0 auto;
    margin-top: 0;
}

.building-level-element-list {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    flex: 1 1 auto;
    min-height: 0;
    gap: 0.4rem;
    max-height: none;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    padding: 0.15rem 0.35rem 0.7rem 0.15rem;
    scroll-padding-block: 0.7rem;
}

.building-level-element-card {
    position: relative;
    flex: 0 0 auto;
    overflow: visible;
    --element-accent: var(--mud-palette-primary);
    --element-fg: var(--mud-palette-primary-text);
    --element-soft: color-mix(in srgb, var(--mud-palette-primary) 9%, transparent);
    border-radius: 10px;
    border-left: 4px solid var(--element-accent) !important;
    border-color: color-mix(in srgb, var(--element-accent) 32%, var(--pf-border-soft)) !important;
    border-left-color: var(--element-accent) !important;
    background:
        linear-gradient(90deg, var(--element-soft), transparent 54%),
        color-mix(in srgb, var(--mud-palette-surface) 96%, var(--element-accent));
    transition: border-color 140ms ease, background 140ms ease, box-shadow 140ms ease, transform 140ms ease;
}

.building-level-element-card::before {
    content: none;
}

.building-level-element-card--created {
    --element-accent: var(--mud-palette-warning);
    --element-fg: var(--mud-palette-warning-text);
    --element-soft: color-mix(in srgb, var(--mud-palette-warning) 11%, transparent);
}

.building-level-element-card--measured,
.building-level-element-card--accepted {
    --element-accent: var(--mud-palette-success);
    --element-fg: var(--mud-palette-success-text);
    --element-soft: color-mix(in srgb, var(--mud-palette-success) 10%, transparent);
}

.building-level-element-card--ordered {
    --element-accent: var(--mud-palette-info);
    --element-fg: var(--mud-palette-info-text);
    --element-soft: color-mix(in srgb, var(--mud-palette-info) 10%, transparent);
}

.building-level-element-card--production,
.building-level-element-card--installed,
.building-level-element-card--acceptance {
    --element-accent: var(--mud-palette-primary);
    --element-fg: var(--mud-palette-primary-text);
    --element-soft: color-mix(in srgb, var(--mud-palette-primary) 10%, transparent);
}

.building-level-element-card--issue {
    --element-accent: var(--mud-palette-error);
    --element-fg: var(--mud-palette-error-text);
    --element-soft: color-mix(in srgb, var(--mud-palette-error) 12%, transparent);
}

.building-level-element-card--highlighted {
    border-color: color-mix(in srgb, var(--element-accent) 70%, var(--pf-border-soft)) !important;
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--element-accent) 16%, transparent), transparent 58%),
        color-mix(in srgb, var(--mud-palette-surface) 92%, var(--element-accent));
    box-shadow: 0 10px 24px color-mix(in srgb, var(--element-accent) 18%, transparent);
    transform: translateX(-1px);
}

.building-level-element-card__title {
    min-width: 0;
}

.building-level-element-card__compact {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.55rem;
    align-items: start;
}

.building-level-element-card__main {
    min-width: 0;
}

.building-level-element-card__title-row {
    display: flex;
    align-items: baseline;
    gap: 0.4rem;
    min-width: 0;
}

.building-level-element-card__number {
    flex: 0 0 auto;
    font-weight: 800;
    letter-spacing: -0.01em;
}

.building-level-element-card__name,
.building-level-element-card__meta,
.building-level-element-card__note {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.building-level-element-card__note {
    color: var(--mud-palette-text-secondary);
}

.building-level-element-card__signals {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    margin-top: 0.35rem;
}

.building-level-element-card__signal {
    display: inline-flex;
    align-items: center;
    gap: 0.22rem;
    max-width: 100%;
    padding: 0.18rem 0.42rem;
    border-radius: 999px;
    border: 1px solid var(--pf-border-soft);
    background: color-mix(in srgb, var(--mud-palette-surface) 88%, transparent);
    color: var(--mud-palette-text-secondary);
    font-size: 0.66rem;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
}

.building-level-element-card__signal .mud-icon-root {
    width: 0.78rem;
    height: 0.78rem;
    font-size: 0.78rem;
}

.building-level-element-card__signal--missing {
    border-color: color-mix(in srgb, var(--mud-palette-warning) 54%, var(--pf-border-soft));
    background: color-mix(in srgb, var(--mud-palette-warning) 12%, var(--mud-palette-surface));
    color: var(--mud-palette-warning);
}

.building-level-element-card__signal--measured {
    border-color: color-mix(in srgb, var(--mud-palette-success) 45%, var(--pf-border-soft));
    background: color-mix(in srgb, var(--mud-palette-success) 10%, var(--mud-palette-surface));
    color: var(--mud-palette-success);
}

.building-level-element-card__signal--issue {
    border-color: color-mix(in srgb, var(--mud-palette-error) 52%, var(--pf-border-soft));
    background: color-mix(in srgb, var(--mud-palette-error) 11%, var(--mud-palette-surface));
    color: var(--mud-palette-error);
}

.building-level-element-card__signal--task {
    border-color: color-mix(in srgb, var(--mud-palette-info) 48%, var(--pf-border-soft));
    background: color-mix(in srgb, var(--mud-palette-info) 10%, var(--mud-palette-surface));
    color: var(--mud-palette-info);
}

.building-level-element-card__side {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.35rem;
}

.building-level-element-card__status {
    display: inline-flex;
    align-items: center;
    gap: 0.28rem;
    padding: 0.25rem 0.5rem;
    border-radius: 999px;
    background: var(--element-accent);
    color: var(--element-fg);
    box-shadow: 0 8px 16px color-mix(in srgb, var(--element-accent) 18%, transparent);
    font-size: 0.68rem;
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
}

.building-level-element-card__status .mud-icon-root {
    width: 0.82rem;
    height: 0.82rem;
    font-size: 0.82rem;
}

.building-level-element-card__actions {
    display: flex;
    gap: 0.25rem;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: nowrap;
}

.section-card {
    border-radius: 10px !important;
    border: 1px solid var(--pf-border-soft);
}

.responsive-tabs .mud-tabs-toolbar {
    overflow-x: auto;
    min-height: 34px;
    padding-bottom: 0.1rem;
}

.responsive-tabs .mud-tab {
    min-width: max-content;
    min-height: 34px;
    padding: 0.35rem 0.72rem;
    font-size: 0.72rem;
}

.bau-doku-page .responsive-tabs .mud-tab-panel {
    padding: 0.5rem !important;
}

.building-details-tabs .mud-tabs-toolbar {
    min-height: 34px;
    padding-bottom: 0.1rem;
}

.building-details-tabs .mud-tab {
    min-height: 34px;
    padding-inline: 0.72rem;
    font-size: 0.72rem;
}

.building-details-floor-shell {
    min-width: 0;
    background: var(--pf-surface-elevated);
}

.element-details-tabs .mud-tabs-toolbar {
    min-height: 32px;
}

.element-details-tabs .mud-tab {
    flex: 1 1 0;
    width: auto !important;
    min-width: 0;
    min-height: 32px;
    padding: 0.28rem 0.48rem;
    font-size: 0.66rem;
}

.bau-doku-page .element-details-tabs .element-details-compact-panel {
    padding: 0.5rem !important;
}

.element-details-compact-panel .mud-typography-h6 {
    font-size: 0.9rem;
    font-weight: 750;
    line-height: 1.2;
}

.element-details-compact-panel .mud-typography-subtitle1 {
    font-size: 0.8rem;
    line-height: 1.25;
}

.element-details-compact-panel .mud-typography-subtitle2,
.element-details-compact-panel .mud-typography-body2 {
    font-size: 0.72rem;
    line-height: 1.3;
}

.element-details-compact-panel .mud-typography-caption {
    font-size: 0.64rem;
    line-height: 1.25;
}

.element-details-compact-panel .mud-button-root {
    min-height: 28px;
    padding: 2px 8px;
    font-size: 0.66rem;
}

.element-details-compact-panel .mud-input > input,
.element-details-compact-panel .mud-input > textarea,
.element-details-compact-panel .mud-select-input,
.element-details-compact-panel .mud-input-label {
    font-size: 0.74rem;
}

.element-details-compact-panel .mud-chip-root {
    height: 20px;
    font-size: 0.62rem;
}

.element-details-compact-panel .surface-card {
    padding: 0.65rem !important;
}

.element-details-marker-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.element-details-marker-row__content {
    flex: 1 1 0;
    min-width: 0;
    max-width: calc(100% - 34px);
}

.element-details-marker-row > .mud-button-root {
    flex: 0 0 auto;
}

.element-details-marker-row__content .mud-typography {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.element-details-compact-panel .mud-expand-panel-header {
    min-height: 36px;
    padding: 0.4rem 0.65rem;
    font-size: 0.72rem;
}

.element-details-compact-panel .mud-expand-panel-content {
    padding: 0.55rem 0.65rem;
}

@media (max-width: 959.98px) {
    .element-details-tabs .mud-tab {
        flex: 0 0 auto;
        min-width: max-content;
    }
}

.bau-doku-record-grid {
    margin: -4px !important;
}

.bau-doku-record-card {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 0.5rem;
    min-height: 54px;
    padding: 0.45rem 0.5rem;
    border: 1px solid var(--pf-border-soft);
    border-left: 3px solid var(--mud-palette-primary);
    border-radius: 8px !important;
    background: var(--pf-surface-elevated);
    transition: border-color 120ms ease, background-color 120ms ease;
}

.bau-doku-record-card:hover {
    border-color: color-mix(in srgb, var(--mud-palette-primary) 42%, var(--pf-border-soft));
    background: color-mix(in srgb, var(--mud-palette-primary) 4%, var(--pf-surface-elevated));
}

.bau-doku-record-card--archived {
    border-left-color: var(--mud-palette-warning);
}

.bau-doku-record-card--unassigned {
    border-left-color: var(--mud-palette-info);
}

.bau-doku-record-card__icon {
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    border-radius: 7px;
    color: var(--mud-palette-primary);
    background: color-mix(in srgb, var(--mud-palette-primary) 11%, transparent);
}

.bau-doku-record-card--archived .bau-doku-record-card__icon {
    color: var(--mud-palette-warning);
    background: color-mix(in srgb, var(--mud-palette-warning) 11%, transparent);
}

.bau-doku-record-card--unassigned .bau-doku-record-card__icon {
    color: var(--mud-palette-info);
    background: color-mix(in srgb, var(--mud-palette-info) 11%, transparent);
}

.bau-doku-record-card__identity {
    min-width: 0;
}

.bau-doku-record-card__title,
.bau-doku-record-card__meta {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bau-doku-record-card__title {
    font-size: 0.78rem !important;
    font-weight: 750 !important;
    line-height: 1.2 !important;
}

.bau-doku-record-card__meta {
    margin-top: 0.08rem;
    color: var(--mud-palette-text-secondary);
    font-size: 0.66rem !important;
    line-height: 1.2 !important;
}

.bau-doku-record-card__status {
    height: 20px;
    font-size: 0.62rem;
}

.bau-doku-record-card__actions {
    display: flex;
    justify-content: flex-end;
}

.bau-doku-record-card__actions .mud-icon-button {
    width: 30px;
    height: 30px;
    padding: 5px;
}

.bau-doku-plan-stack {
    display: grid;
    gap: 0.55rem;
}

.bau-doku-plan-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 280px);
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--pf-border-soft);
    border-radius: 10px !important;
    background: var(--pf-surface-elevated);
}

.bau-doku-plan-row__preview {
    display: grid;
    min-width: 0;
    min-height: 300px;
    max-height: 58vh;
    padding: 0.35rem;
    place-items: center;
    overflow: hidden;
    border: 0;
    border-right: 1px solid var(--pf-border-soft);
    background:
        linear-gradient(45deg, color-mix(in srgb, var(--mud-palette-lines-default) 15%, transparent) 25%, transparent 25%, transparent 75%, color-mix(in srgb, var(--mud-palette-lines-default) 15%, transparent) 75%),
        linear-gradient(45deg, color-mix(in srgb, var(--mud-palette-lines-default) 15%, transparent) 25%, transparent 25%, transparent 75%, color-mix(in srgb, var(--mud-palette-lines-default) 15%, transparent) 75%),
        color-mix(in srgb, var(--mud-palette-background) 86%, var(--mud-palette-surface));
    background-position: 0 0, 8px 8px;
    background-size: 16px 16px;
    color: var(--mud-palette-text-secondary);
    cursor: pointer;
}

.bau-doku-plan-row__preview:hover,
.bau-doku-plan-row__preview:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--mud-palette-primary) 62%, transparent);
    outline-offset: -2px;
}

.bau-doku-plan-row__preview .mud-image,
.bau-doku-plan-row__preview svg {
    width: 100%;
    height: 100%;
    max-height: calc(58vh - 0.7rem);
    object-fit: contain;
}

.bau-doku-plan-row__placeholder {
    display: grid;
    gap: 0.4rem;
    place-items: center;
}

.bau-doku-plan-row__details {
    display: flex;
    min-width: 0;
    padding: 0.65rem;
    flex-direction: column;
    gap: 0.55rem;
}

.bau-doku-plan-row__heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.45rem;
}

.bau-doku-plan-row__identity {
    min-width: 0;
}

.bau-doku-plan-row__title {
    overflow: hidden;
    font-size: 0.86rem !important;
    font-weight: 750 !important;
    line-height: 1.25 !important;
    text-overflow: ellipsis;
    overflow-wrap: anywhere;
}

.bau-doku-plan-row__heading .mud-chip-root {
    height: 21px;
    flex: 0 0 auto;
    font-size: 0.62rem;
}

.bau-doku-plan-row__actions {
    display: flex;
    margin-top: auto;
    flex-direction: column;
    align-items: stretch;
    gap: 0.2rem;
}

.bau-doku-plan-row__actions .mud-button-root {
    min-height: 30px;
    justify-content: flex-start;
    padding: 2px 8px;
    font-size: 0.68rem;
}

@media (max-width: 959.98px) {
    .bau-doku-plan-row {
        grid-template-columns: minmax(0, 1fr);
    }

    .bau-doku-plan-row__preview {
        min-height: 220px;
        max-height: 52vh;
        border-right: 0;
        border-bottom: 1px solid var(--pf-border-soft);
    }

    .bau-doku-plan-row__preview .mud-image,
    .bau-doku-plan-row__preview svg {
        max-height: calc(52vh - 0.7rem);
    }

    .bau-doku-plan-row__actions {
        flex-direction: row;
        flex-wrap: wrap;
    }
}

@media (max-width: 599.98px) {
    .bau-doku-record-card {
        grid-template-columns: 30px minmax(0, 1fr) auto;
    }

    .bau-doku-record-card__status {
        display: none;
    }

    .bau-doku-action-search {
        width: 100%;
    }
}

.table-shell {
    overflow-x: auto;
    border-radius: 18px;
}

.table-shell table {
    min-width: 760px;
}

.contact-layout__list,
.contact-layout__detail {
    display: flex;
    flex-direction: column;
}

.detail-card--sticky {
    position: sticky;
    top: 5.5rem;
}

.mobile-only {
    display: none !important;
}

.desktop-only {
    display: block !important;
}

.mobile-card-list {
    display: grid;
    gap: 0.85rem;
}

.mobile-card {
    border-radius: 18px;
    border: 1px solid var(--pf-border-soft);
    background: var(--pf-surface-elevated);
    padding: 1rem;
}

.mobile-card__header {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    align-items: flex-start;
}

.mobile-card__meta {
    display: grid;
    gap: 0.35rem;
    margin-top: 0.75rem;
    color: var(--mud-palette-text-secondary);
}

.mobile-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 1rem;
}

.toolbar-card {
    position: sticky;
    top: 4.75rem;
    z-index: 4;
}

.file-input-inline input[type="file"] {
    width: 100%;
    padding: 0.85rem;
    border-radius: 14px;
    border: 1px dashed var(--pf-border-strong);
    background: color-mix(in srgb, var(--mud-palette-primary) 4%, transparent);
}

.context-note-card {
    border-radius: 18px !important;
}

.image-card-actions {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

@media (min-width: 960px) {
    .bau-doku-page,
    .contacts-page {
        padding-top: 0.25rem !important;
    }

    .page-hero {
        padding: 0.45rem 0.7rem !important;
        margin-bottom: 0.55rem;
        border-radius: 12px;
        box-shadow: none;
    }

    .page-hero--compact {
        padding: 0.38rem 0.6rem !important;
    }

    .page-hero__header {
        gap: 0.5rem;
        align-items: center;
        flex-wrap: nowrap;
    }

    .page-hero__content {
        flex: 1 1 auto;
        min-width: 0;
    }

    .page-hero__eyebrow,
    .page-hero__subtitle {
        display: none;
    }

    .page-hero__title {
        font-size: 1.12rem !important;
        line-height: 1.15;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .page-hero--compact .page-hero__title {
        font-size: 1rem !important;
    }

    .page-hero__meta,
    .info-chips {
        margin-top: 0.22rem;
        gap: 0.3rem;
    }

    .page-hero__meta .mud-chip-root,
    .info-chips .mud-chip-root {
        height: 22px;
        font-size: 0.72rem;
    }

    .page-hero__actions,
    .page-actions,
    .stack-actions {
        gap: 0.3rem;
        flex-wrap: nowrap;
        margin-left: auto;
    }

    .page-hero__actions .mud-button-root,
    .page-actions .mud-button-root,
    .stack-actions .mud-button-root {
        min-height: 28px;
        padding: 0.12rem 0.5rem;
        font-size: 0.76rem;
        white-space: nowrap;
    }

    .page-hero__actions .mud-menu,
    .page-actions .mud-menu,
    .stack-actions .mud-menu {
        margin: 0;
    }

    .stat-grid {
        display: flex;
        flex-wrap: wrap;
        gap: 0.28rem;
        margin-top: 0.3rem;
    }

    .stat-card {
        display: inline-flex;
        align-items: center;
        gap: 0.28rem;
        border-radius: 999px;
        padding: 0.2rem 0.45rem;
        min-height: 0;
        border-style: dashed;
    }

    .stat-card__label,
    .stat-card__value {
        display: inline;
        margin: 0;
        line-height: 1.1;
    }

    .stat-card__label {
        font-size: 0.66rem;
    }

    .stat-card__value {
        font-size: 0.82rem;
    }

    .shell-content:has(.building-details-page) {
        box-sizing: border-box;
        height: 100vh;
        height: 100dvh;
        min-height: 0;
        overflow: hidden;
    }

    .building-details-page {
        display: flex;
        flex-direction: column;
        height: 100%;
        min-height: 0;
        overflow: hidden;
    }

    .building-details-page .page-hero {
        flex: 0 0 auto;
        margin-bottom: 0.3rem;
        padding-block: 0.3rem !important;
    }

    .building-details-page .page-hero__meta {
        margin-top: 0.12rem;
    }

    .building-details-page .page-hero__meta .mud-chip-root {
        height: 20px;
        font-size: 0.68rem;
    }

    .shell-content:has(.site-details-page) {
        box-sizing: border-box;
        height: 100vh;
        height: 100dvh;
        min-height: 0;
        overflow: hidden;
    }

    .site-details-page {
        display: flex;
        flex-direction: column;
        height: 100%;
        min-height: 0;
        overflow: hidden;
    }

    .site-details-page .page-hero {
        flex: 0 0 auto;
        margin-bottom: 0.3rem;
        padding-block: 0.3rem !important;
    }

    .site-details-page .page-hero__meta {
        margin-top: 0.12rem;
    }

    .site-details-page .page-hero__meta .mud-chip-root {
        height: 20px;
        font-size: 0.68rem;
    }

    .site-details-tabs {
        display: flex;
        flex: 1 1 auto;
        flex-direction: column;
        min-height: 0;
        overflow: hidden;
    }

    .site-details-tabs > .mud-tabs-toolbar {
        flex: 0 0 auto;
    }

    .site-details-tabs > .mud-tabs-panels {
        display: flex;
        flex: 1 1 auto;
        flex-direction: column;
        min-height: 0;
        overflow: hidden;
    }

    .site-details-tabs > .mud-tabs-panels > .mud-tab-panel {
        flex: 1 1 auto;
        height: 100%;
        min-height: 0;
        overflow: auto;
    }

    .site-details-page .site-buildings-overview {
        height: 100%;
        min-height: 0;
        overflow: hidden;
    }

    .site-details-page .site-overview-panel {
        position: static;
        height: 100%;
    }

    .site-details-page .site-overview-panel > .site-plan-viewer {
        height: 100%;
        min-height: 0;
    }

    .site-details-page .site-building-list {
        height: 100%;
        max-height: none;
    }

    .site-details-page .site-plan-manager {
        height: 100%;
        min-height: 0;
    }

    .building-details-floor-shell {
        display: flex;
        flex: 1 1 auto;
        flex-direction: column;
        min-height: 0;
        overflow: hidden;
    }

    .building-details-floor-tab {
        display: flex;
        flex-direction: column;
        height: 100%;
        min-height: 0;
        overflow: hidden;
    }

    .building-details-floor-tab .building-level-tabs {
        flex: 0 0 auto;
    }

    .building-details-floor-tab .building-workflow-list {
        flex: 1 1 auto;
        min-height: 0;
        overflow: hidden;
    }

    .building-details-floor-tab .building-level-workflow {
        display: flex;
        flex-direction: column;
        height: 100%;
        min-height: 0;
    }

    .building-details-floor-tab .building-level-workspace {
        flex: 1 1 auto;
        min-height: 0;
        max-height: none;
    }

    .building-level-plan-grid:not(.building-level-plan-grid--stacked),
    .building-level-plan-grid:not(.building-level-plan-grid--stacked) .building-plan-card {
        height: 100%;
        min-height: 0;
    }

    .building-level-plan-grid:not(.building-level-plan-grid--stacked) {
        flex: 1 1 auto;
        grid-template-rows: minmax(0, 1fr);
        align-content: stretch;
    }

    .building-level-plan-grid--stacked .building-plan-card {
        min-height: min(64vh, 720px);
    }
}

@media (max-width: 959.98px) {
    .shell-content {
        padding: 1rem !important;
    }

    .page-hero,
    .section-card,
    .surface-card,
    .detail-card {
        border-radius: 18px !important;
    }

    .bau-doku-page .page-hero,
    .bau-doku-page .section-card,
    .bau-doku-page .surface-card,
    .bau-doku-page .detail-card {
        border-radius: 10px !important;
    }

    .plan-workspace {
        grid-template-columns: minmax(0, 1fr);
        height: auto;
        min-height: 0;
        max-height: none;
        overflow: visible;
    }

    .plan-workspace__canvas-card {
        height: min(72vh, 720px);
        min-height: 420px;
    }

    .plan-workspace__inspector-card {
        height: auto;
        max-height: 620px;
    }

    .plan-workspace__toolbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .plan-workspace__tools {
        justify-content: flex-start;
    }

    .site-buildings-overview {
        grid-template-columns: 1fr;
    }

    .site-plan-manager {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .site-plan-manager__rail {
        max-height: none;
    }

    .site-plan-manager__list {
        max-height: 360px;
    }

    .site-overview-panel {
        position: static;
    }

    .site-building-list {
        max-height: none;
        overflow: visible;
        padding: 0;
    }

    .building-level-workflow__header {
        flex-direction: column;
    }

    .building-level-workflow__chips,
    .building-level-workflow__actions {
        justify-content: flex-start;
    }

    .building-level-workspace {
        grid-template-columns: 1fr;
        min-height: 0;
        max-height: none;
        overflow: visible;
    }

    .building-level-plan-area {
        overflow: visible;
        padding: 0;
    }

    .building-level-elements-panel {
        height: auto;
        max-height: none;
        overflow: visible;
    }

    .building-level-elements-panel__header,
    .building-level-elements-panel__tools {
        align-items: stretch;
        flex-direction: column;
    }

    .building-level-element-list {
        max-height: none;
        overflow: visible;
        padding-right: 0;
    }

    .osm-fallback-map,
    .site-overview-panel__empty {
        min-height: 220px;
    }

    .osm-fallback-map--interactive,
    .osm-fallback-map--interactive iframe,
    .osm-map-status {
        min-height: 240px;
    }

    .site-plan-lightbox {
        padding: 0.5rem;
    }

    .site-plan-lightbox__panel {
        width: 100%;
        max-height: 96vh;
    }

    .site-plan-lightbox__header {
        flex-direction: column;
        align-items: stretch;
    }

    .site-plan-marker__label {
        max-width: 120px;
        font-size: 0.68rem;
    }

    .page-hero__header,
    .page-hero__actions,
    .page-actions,
    .stack-actions,
    .entity-card__actions,
    .mobile-card__actions,
    .image-card-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .page-hero__actions .mud-button-root,
    .bau-doku-action-search,
    .page-hero__actions .mud-menu,
    .page-actions .mud-button-root,
    .page-actions .mud-menu,
    .stack-actions .mud-button-root,
    .stack-actions .mud-menu,
    .entity-card__actions .mud-button-root,
    .mobile-card__actions .mud-button-root,
    .image-card-actions .mud-button-root {
        width: 100%;
        justify-content: flex-start;
        margin: 0;
    }

    .desktop-only {
        display: none !important;
    }

    .mobile-only {
        display: block !important;
    }

    .detail-card--sticky,
    .toolbar-card {
        position: static;
        top: auto;
    }

    .contact-layout__detail {
        order: -1;
    }

    .table-shell table {
        min-width: 620px;
    }
}

.address-picker {
    align-items: stretch;
}

.address-picker .mud-input-control {
    flex: 1 1 320px;
}

.address-reference-card {
    border-style: dashed;
}

.contact-assignment-toolbar .mud-input-control {
    flex: 1 1 320px;
}

.contact-assignment-list {
    display: grid;
    gap: 0.85rem;
}

.contact-assignment-card {
    display: grid;
    gap: 0.75rem;
    padding: 0.95rem 1rem;
    border: 1px solid var(--pf-border-soft);
    border-radius: 18px;
    background: var(--pf-surface-elevated);
}

.contact-assignment-card__main,
.contact-assignment-card__facts {
    display: grid;
    gap: 0.25rem;
}

.contact-summary {
    display: grid;
    gap: 0.25rem;
}

.contact-link-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.contact-link-list a {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    border: 1px solid var(--pf-border-soft);
    text-decoration: none;
    color: inherit;
    background: color-mix(in srgb, var(--mud-palette-surface) 92%, transparent);
}

.contact-detail-grid {
    display: grid;
    gap: 0.75rem;
}

@media (min-width: 960px) {
    .contact-detail-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


.contact-filter-grid {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.contact-overview-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.contact-table-shell table {
    min-width: 1080px;
}

.usage-list {
    display: grid;
    gap: 0.75rem;
}

.usage-card {
    border: 1px solid var(--pf-border-soft);
    border-radius: 16px;
    padding: 0.85rem 0.95rem;
    background: var(--pf-surface-elevated);
    display: grid;
    gap: 0.2rem;
}

.contact-detail-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

@media (max-width: 959.98px) {
    .contact-filter-grid {
        grid-template-columns: 1fr;
    }

    .contact-table-shell table {
        min-width: 820px;
    }
}

/* Compact master-data workspace shared by contacts, addresses, companies and people. */
.master-data-page {
    display: grid;
    gap: 8px;
    width: 100%;
    min-width: 0;
}

.master-data-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-width: 0;
    padding: 7px 9px;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 10px;
    background:
        linear-gradient(105deg, color-mix(in srgb, var(--mud-palette-primary) 6%, transparent), transparent 42%),
        var(--mud-palette-surface);
}

.master-data-heading {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
}

.master-data-heading__icon {
    display: grid;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    place-items: center;
    border-radius: 8px;
    color: var(--mud-palette-primary);
    background: color-mix(in srgb, var(--mud-palette-primary) 11%, transparent);
}

.master-data-heading__copy {
    min-width: 0;
}

.master-data-heading__copy .mud-typography-h6 {
    overflow: hidden;
    font-size: 1rem;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.master-data-heading__copy .mud-typography-caption {
    display: block;
    overflow: hidden;
    color: var(--mud-palette-text-secondary);
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.master-data-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
    flex-wrap: wrap;
}

.master-data-actions .mud-button-root {
    min-height: 30px;
    padding: 2px 9px;
    font-size: .72rem;
    white-space: nowrap;
}

.master-data-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(270px, 330px);
    align-items: start;
    gap: 8px;
    min-width: 0;
}

.master-data-list-panel,
.master-data-detail-panel {
    min-width: 0;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 10px;
    background: var(--mud-palette-surface);
}

.master-data-list-panel {
    overflow: hidden;
    padding: 6px;
}

.master-data-detail-panel {
    position: sticky;
    top: 4.25rem;
    max-height: calc(100dvh - 5.25rem);
    overflow: auto;
    padding: 10px;
}

.master-data-detail-panel .contact-detail-grid {
    grid-template-columns: 1fr;
    gap: 6px;
}

.master-data-detail-panel .context-note-card {
    padding: 8px !important;
    border-radius: 8px !important;
}

.master-data-toolbar {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) auto;
    align-items: center;
    gap: 5px;
    margin-bottom: 6px;
}

.master-data-toolbar--contacts {
    grid-template-columns: minmax(260px, 1fr) repeat(3, minmax(125px, 170px));
}

.master-data-toolbar .mud-input-control {
    margin: 0;
}

.master-data-table {
    overflow: hidden;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 8px;
}

.master-data-table .mud-table-container {
    max-height: calc(100dvh - 230px);
    overflow: auto;
}

.master-data-table .mud-table-head .mud-table-cell {
    position: sticky;
    top: 0;
    z-index: 2;
    height: 31px;
    padding: 4px 7px;
    color: var(--mud-palette-text-secondary);
    background: color-mix(in srgb, var(--mud-palette-primary) 6%, var(--mud-palette-surface));
    font-size: .65rem;
    font-weight: 800;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.master-data-table .mud-table-body .mud-table-cell {
    height: 44px;
    padding: 4px 7px;
    vertical-align: middle;
    border-bottom-color: var(--mud-palette-lines-default);
    font-size: .74rem;
}

.master-data-table .mud-table-body .mud-table-row {
    cursor: pointer;
}

.master-data-table .mud-table-body .mud-table-row:hover > .mud-table-cell {
    background: color-mix(in srgb, var(--mud-palette-primary) 5%, var(--mud-palette-surface));
}

.master-data-table .mud-table-body .master-data-row--selected > .mud-table-cell {
    background: color-mix(in srgb, var(--mud-palette-primary) 11%, var(--mud-palette-surface));
}

.master-data-table .mud-table-body .master-data-row--selected > .mud-table-cell:first-child {
    box-shadow: inset 3px 0 0 var(--mud-palette-primary);
}

.master-data-table__actions {
    width: 70px;
    padding-right: 2px !important;
    padding-left: 2px !important;
}

.master-data-row-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0;
}

.master-data-row-actions .mud-icon-button {
    width: 30px;
    height: 30px;
    padding: 5px;
}

.master-data-primary-cell,
.master-data-secondary-cell {
    display: grid;
    gap: 1px;
    min-width: 0;
}

.master-data-primary-cell strong,
.master-data-primary-cell span,
.master-data-primary-cell small,
.master-data-secondary-cell span,
.master-data-secondary-cell small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.master-data-primary-cell strong {
    color: var(--mud-palette-text-primary);
    font-size: .76rem;
}

.master-data-primary-cell small,
.master-data-secondary-cell small,
.master-data-muted {
    color: var(--mud-palette-text-secondary);
    font-size: .66rem;
}

.master-data-tags {
    display: flex;
    align-items: center;
    gap: 3px;
    min-width: 0;
    flex-wrap: wrap;
}

.master-data-tags .mud-chip-root {
    height: 19px;
    font-size: .62rem;
}

.master-data-detail-empty,
.master-data-empty {
    display: grid;
    place-items: center;
    gap: 5px;
    min-height: 190px;
    padding: 22px;
    color: var(--mud-palette-text-secondary);
    text-align: center;
}

.master-data-detail-empty .mud-icon-root,
.master-data-empty .mud-icon-root {
    opacity: .55;
}

.master-data-detail {
    display: grid;
    gap: 10px;
}

.master-data-detail__head {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--mud-palette-divider);
}

.master-data-detail__avatar {
    display: grid;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    place-items: center;
    border-radius: 8px;
    color: var(--mud-palette-primary);
    background: color-mix(in srgb, var(--mud-palette-primary) 10%, transparent);
}

.master-data-detail__title {
    min-width: 0;
}

.master-data-detail__title .mud-typography-subtitle1 {
    overflow-wrap: anywhere;
    font-weight: 750;
    line-height: 1.2;
}

.master-data-facts {
    display: grid;
    gap: 3px;
}

.master-data-fact {
    display: grid;
    grid-template-columns: 23px minmax(0, 1fr);
    align-items: start;
    gap: 5px;
    min-width: 0;
    padding: 5px 6px;
    border-radius: 6px;
}

.master-data-fact:hover {
    background: color-mix(in srgb, var(--mud-palette-primary) 5%, transparent);
}

.master-data-fact .mud-icon-root {
    margin-top: 1px;
    color: var(--mud-palette-text-secondary);
    font-size: 1rem;
}

.master-data-fact__copy {
    display: grid;
    min-width: 0;
}

.master-data-fact__copy small {
    color: var(--mud-palette-text-secondary);
    font-size: .62rem;
    font-weight: 700;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.master-data-fact__copy span,
.master-data-fact__copy a {
    overflow-wrap: anywhere;
    color: var(--mud-palette-text-primary);
    font-size: .75rem;
    text-decoration: none;
}

.master-data-fact__copy a:hover {
    color: var(--mud-palette-primary);
    text-decoration: underline;
}

.master-data-detail__footer {
    padding-top: 7px;
    border-top: 1px solid var(--mud-palette-divider);
    color: var(--mud-palette-text-secondary);
    font-size: .64rem;
}

.contact-full-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(280px, .85fr);
    gap: 8px;
    align-items: start;
}

.contact-full-panel {
    min-width: 0;
    padding: 10px;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 10px;
    background: var(--mud-palette-surface);
}

.contact-full-panel--sticky {
    position: sticky;
    top: 4.25rem;
    max-height: calc(100dvh - 5.25rem);
    overflow: auto;
}

.contact-usage-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 8px;
    padding-bottom: 7px;
    border-bottom: 1px solid var(--mud-palette-divider);
}

.contact-usage-list {
    gap: 5px;
}

.contact-usage-list .usage-card {
    gap: 1px;
    padding: 7px 8px;
    border-radius: 8px;
}

.contact-usage-list .mud-button-root {
    justify-self: start;
    min-height: 26px;
    margin-top: 2px;
    padding: 1px 5px;
    font-size: .68rem;
}

@media (max-width: 1100px) {
    .master-data-workspace {
        grid-template-columns: minmax(0, 1fr) 280px;
    }

    .master-data-toolbar--contacts {
        grid-template-columns: minmax(230px, 1fr) repeat(3, minmax(105px, 145px));
    }
}

@media (max-width: 959.98px) {
    .master-data-workspace,
    .contact-full-workspace {
        grid-template-columns: 1fr;
    }

    .master-data-detail-panel {
        position: static;
        max-height: none;
    }

    .contact-full-panel--sticky {
        position: static;
        max-height: none;
    }

    .master-data-table .mud-table-container {
        max-height: none;
    }

    .master-data-toolbar--contacts {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .master-data-toolbar--contacts > :first-child {
        grid-column: 1 / -1;
    }
}

@media (max-width: 600px) {
    .master-data-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .master-data-actions {
        width: 100%;
        justify-content: flex-start;
    }

    .master-data-toolbar,
    .master-data-toolbar--contacts {
        grid-template-columns: 1fr;
    }

    .master-data-toolbar--contacts > :first-child {
        grid-column: auto;
    }

    .master-data-heading__copy .mud-typography-caption {
        white-space: normal;
    }
}

/* MudBlazor renders dialogs in a portal outside the component CSS scope. */
.mud-dialog.material-section-details-dialog,
.mud-dialog.material-attachment-preview-dialog {
    width: 100vw;
    max-width: none;
    height: 100dvh;
    max-height: none;
    margin: 0;
    border-radius: 0;
}

.material-section-details-dialog .mud-dialog-content {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    padding: 0;
    overflow: hidden;
}

.material-section-details-dialog .material-section-details__tabs {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
}

.material-section-details-dialog .material-section-details__tabs > .mud-tabs-tabbar,
.material-section-details-dialog .material-section-details__tabs > .mud-tabs-tabbar .mud-tab {
    min-height: 38px;
}

.material-section-details-dialog .material-section-details__tabs--files-only > .mud-tabs-tabbar {
    display: none;
}

.material-section-details-dialog .material-section-details__tabs > .mud-tabs-tabbar .mud-tab {
    padding-block: 4px;
    font-size: .72rem;
}

.material-section-details-dialog .material-section-details__tabs > .mud-tabs-panels {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

.material-section-details-dialog .material-section-details__tab-panel {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    height: auto;
    min-height: 0;
    padding: 8px;
    overflow: hidden;
}

.material-section-details-dialog .material-section-details__tab-panel > .mud-tab-panel {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

.material-section-details-dialog .material-section-details__tab-panel > .mud-tab-panel > .material-section-details__layout,
.material-section-details-dialog .material-section-details__tab-panel > .mud-tab-panel > .material-section-details__attachments {
    flex: 1 1 auto;
    min-height: 0;
}

.material-section-details-dialog .mud-dialog-actions {
    min-height: 46px;
    padding: 5px 10px;
    border-top: 1px solid var(--mud-palette-lines-default);
}

.material-attachment-preview-dialog .mud-dialog-content {
    width: 100%;
    height: 100%;
    min-height: 0;
    padding: 0;
    overflow: hidden;
}

@media (max-width: 820px) {
    .material-section-details-dialog .material-section-details__tab-panel > .mud-tab-panel {
        display: block;
        overflow: auto;
    }

    .material-section-details-dialog .material-section-details__tab-panel > .mud-tab-panel > .material-section-details__layout,
    .material-section-details-dialog .material-section-details__tab-panel > .mud-tab-panel > .material-section-details__attachments {
        min-height: auto;
    }
}