:root {
            color-scheme: light;
            --bg: #f7f8f6;
            --surface: #ffffff;
            --surface-2: #fbfbf8;
            --ink: #1e2724;
            --muted: #6a746f;
            --quiet: #9aa39d;
            --line: #dde3de;
            --line-soft: #edf0ed;
            --accent: #1f4d4d;
            --accent-hover: #173b3b;
            --accent-soft: #e8f1f0;
            --accent-ring: rgba(31,77,77,0.16);
            --z-modal-backdrop: 11000;
            --z-modal: 11010;
            --green: #5fd66b;
            --danger: #b42318;
            --ok: #16794c;
            --shadow: 0 16px 45px rgba(30, 39, 36, 0.06);
            --sidebar: 248px;
            --topbar: 76px;
            --table-page-padding: 18px 28px 24px;
            --table-page-gap: 12px;
            --record-page-gap: 12px;
            --checkbox-size: 14px;
            font-family: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
        }

        * { box-sizing: border-box; }
        html, body { height: 100%; }
        body {
            margin: 0;
            background: var(--bg);
            color: var(--ink);
            overflow: hidden;
            font-weight: 400;
        }

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

        input[type="checkbox"] {
            width: var(--checkbox-size);
            min-width: var(--checkbox-size);
            max-width: var(--checkbox-size);
            height: var(--checkbox-size);
            min-height: var(--checkbox-size);
            max-height: var(--checkbox-size);
            flex: 0 0 var(--checkbox-size);
            margin: 0;
            accent-color: var(--accent);
        }

        .auth-screen {
            min-height: 100vh;
            display: grid;
            grid-template-columns: minmax(420px, 43%) minmax(0, 57%);
            background: #ffffff;
        }

        .auth-screen[hidden] {
            display: none !important;
        }

        body.public-proposal-mode {
            overflow: auto;
            background: #f7f8f6;
        }

        .public-proposal {
            min-height: 100vh;
            background: #f7f8f6;
            padding: 28px;
        }

        .public-proposal[hidden] {
            display: none !important;
        }

        .public-proposal-shell {
            width: min(1180px, 100%);
            margin: 0 auto;
            display: grid;
            gap: 20px;
        }

        .public-proposal-hero {
            display: grid;
            grid-template-columns: minmax(0, 1fr);
            gap: 16px;
            align-items: stretch;
        }

        .public-proposal-panel {
            border: 1px solid #dce5e1;
            border-radius: 12px;
            background: #ffffff;
            box-shadow: 0 18px 48px rgba(30,39,36,0.06);
            padding: 24px;
        }

        .public-proposal-brand {
            display: grid;
            align-content: end;
            min-height: 0;
        }

        .public-proposal-brand-inner {
            display: grid;
            grid-template-columns: minmax(0, 0.9fr) minmax(320px, 1.1fr);
            gap: 18px;
            align-content: end;
            align-items: stretch;
        }

        .public-proposal-logo-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
            margin-bottom: auto;
        }

        .public-proposal-hero-copy {
            display: grid;
            gap: 18px;
            align-content: space-between;
            min-width: 0;
        }

        .public-proposal-hero-media {
            display: grid;
            grid-template-rows: minmax(170px, 0.75fr) minmax(230px, 1fr);
            gap: 12px;
            min-width: 0;
        }

        .public-proposal-status-pill {
            border: 1px solid #d8e3df;
            border-radius: 999px;
            background: #f7fbf9;
            color: var(--accent);
            padding: 7px 11px;
            font-size: 12px;
            font-weight: 500;
            white-space: nowrap;
        }

        .public-proposal-status-pill.accepted {
            border-color: #86efac;
            background: #dcfce7;
            color: #166534;
        }

        .public-proposal-status-pill.completed {
            border-color: #7dd3fc;
            background: #e0f2fe;
            color: #075985;
        }

        .public-proposal-status-pill.declined {
            border-color: #fca5a5;
            background: #fee2e2;
            color: #991b1b;
        }

        .public-proposal-brand img {
            width: 172px;
            height: auto;
            display: grid;
            gap: 3px;
            margin-bottom: 0;
        }

        .public-proposal-header-image {
            width: 100%;
            height: 100%;
            min-height: 170px;
            object-fit: cover;
            border-radius: 8px;
            display: block;
            background: linear-gradient(135deg, #edf3ef, #f8faf8);
        }

        .public-proposal-title {
            display: grid;
            gap: 8px;
        }

        .public-proposal-title span,
        .public-proposal-section h2,
        .public-proposal-agent span,
        .public-proposal-stat span {
            color: var(--muted);
            font-size: 11px;
            font-weight: 500;
            letter-spacing: 0.05em;
            text-transform: uppercase;
        }

        .public-proposal-title h1 {
            margin: 0;
            color: var(--ink);
            font-size: clamp(28px, 4vw, 46px);
            line-height: 1.04;
            letter-spacing: 0;
            font-weight: 500;
        }

        .public-proposal-title p {
            margin: 0;
            max-width: 680px;
            color: var(--muted);
            font-size: 15px;
            line-height: 1.65;
            font-weight: 300;
        }

        .public-proposal-map {
            min-height: 230px;
            border: 1px solid #dce5e1;
            border-radius: 12px;
            overflow: hidden;
            background: #edf0ed;
            box-shadow: 0 18px 48px rgba(30,39,36,0.05);
        }

        .public-proposal-grid {
            display: grid;
            grid-template-columns: minmax(0, 1fr);
            gap: 20px;
            align-items: start;
        }

        .public-proposal-main,
        .public-proposal-side {
            display: grid;
            gap: 18px;
        }

        .public-proposal-section {
            display: grid;
            gap: 14px;
        }

        .public-proposal-section h2 {
            margin: 0;
            color: var(--muted);
            font-size: 11px;
            font-weight: 500;
            letter-spacing: 0.05em;
            text-transform: uppercase;
        }

        .public-section-title {
            display: grid;
            gap: 5px;
        }

        .public-section-title strong {
            color: var(--ink);
            font-size: 20px;
            font-weight: 500;
            letter-spacing: 0;
        }

        .public-introduction-text {
            color: var(--ink);
            font-size: 17px;
            line-height: 1.72;
            font-weight: 300;
            margin: 0;
            white-space: pre-wrap;
        }

        .public-about-grid {
            display: grid;
            grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
            gap: 14px;
        }

        .public-about-card {
            border: 1px solid var(--line-soft);
            border-radius: 10px;
            background: #f7fbf9;
            padding: 16px;
            display: grid;
            gap: 10px;
            min-width: 0;
        }

        .public-about-card > span,
        .public-decision-state span {
            color: var(--muted);
            font-size: 11px;
            font-weight: 500;
            letter-spacing: 0.04em;
            text-transform: uppercase;
        }

        .public-about-card strong {
            color: var(--ink);
            font-size: 17px;
            font-weight: 500;
        }

        .public-about-card p {
            margin: 0;
            color: var(--muted);
            font-size: 13px;
            line-height: 1.55;
            font-weight: 300;
        }

        .public-fee-table {
            width: 100%;
            border-collapse: separate;
            border-spacing: 0;
            border: 1px solid var(--line);
            border-radius: 9px;
            overflow: hidden;
            background: #ffffff;
        }

        .public-fee-table th,
        .public-fee-table td {
            padding: 11px 12px;
            border-bottom: 1px solid var(--line-soft);
            text-align: left;
            font-size: 13px;
            font-weight: 300;
        }

        .public-fee-table th {
            color: var(--muted);
            font-weight: 500;
            background: #f7fbf9;
            font-size: 11px;
            letter-spacing: 0.04em;
            text-transform: uppercase;
        }

        .public-fee-table tr:last-child td {
            border-bottom: 0;
        }

        .public-proposal-stats {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 10px;
        }

        .public-proposal-stat {
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #f7fbf9;
            padding: 12px;
            display: grid;
            gap: 5px;
        }

        .public-proposal-stat strong {
            color: var(--accent);
            font-size: 20px;
            font-weight: 500;
        }

        .public-proposal-note {
            margin: 0;
            color: var(--ink);
            font-size: 15px;
            line-height: 1.7;
            font-weight: 300;
            white-space: pre-wrap;
        }

        .public-document {
            display: grid;
            gap: 10px;
        }

        .public-document-frame {
            height: 420px;
            border: 1px solid var(--line);
            border-radius: 9px;
            overflow: hidden;
            background: #f7f8f6;
            display: grid;
            place-items: center;
        }

        .public-document-frame iframe,
        .public-document-frame img {
            width: 100%;
            height: 100%;
            border: 0;
            object-fit: contain;
            background: #ffffff;
        }

        .public-open-link {
            justify-self: start;
            display: inline-flex;
            align-items: center;
            gap: 6px;
            border: 1px solid #9cc6e8;
            border-radius: 999px;
            background: #eff8ff;
            color: #155c98;
            padding: 7px 10px;
            font-size: 12px;
            font-weight: 400;
            text-decoration: none;
        }

        .public-open-link svg {
            width: 14px;
            height: 14px;
        }

        .public-comparison-list {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
            gap: 14px;
        }

        .public-comparison-card {
            border: 1px solid var(--line-soft);
            border-radius: 10px;
            padding: 12px;
            display: grid;
            gap: 10px;
            align-items: stretch;
            background: #ffffff;
            min-width: 0;
        }

        .public-comparison-card strong {
            color: var(--ink);
            font-size: 14px;
            font-weight: 500;
        }

        .public-comparison-card p {
            margin: 0;
            color: var(--muted);
            font-size: 13px;
            line-height: 1.55;
            font-weight: 300;
        }

        .public-comparison-card img {
            width: 100%;
            height: 160px;
            border-radius: 8px;
            object-fit: cover;
            border: 1px solid var(--line-soft);
        }

        .public-comparison-map {
            width: 100%;
            height: 150px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            overflow: hidden;
            background: #edf0ed;
        }

        .public-comparison-meta {
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            gap: 6px;
        }

        .public-comparison-pill {
            border: 1px solid #d8e3df;
            border-radius: 999px;
            background: #f7fbf9;
            color: var(--accent);
            padding: 5px 8px;
            font-size: 12px;
            font-weight: 500;
        }

        .public-comparison-link {
            justify-self: start;
            color: #155c98;
            font-size: 13px;
            font-weight: 400;
            text-decoration: none;
        }

        .public-comparison-link:hover,
        .public-comparison-link:focus {
            text-decoration: underline;
        }

        .public-comparison-copy {
            display: grid;
            align-content: center;
            gap: 7px;
            min-width: 0;
        }

        .public-proposal-agent {
            display: grid;
            gap: 12px;
        }

        .public-proposal-side {
            position: static;
        }

        .public-agent-row {
            display: grid;
            grid-template-columns: 46px minmax(0, 1fr);
            gap: 10px;
            align-items: center;
        }

        .public-agent-avatar {
            width: 46px;
            height: 46px;
            border-radius: 50%;
            border: 1px solid var(--line);
            background: var(--accent-soft);
            display: grid;
            place-items: center;
            color: var(--accent);
            overflow: hidden;
            font-weight: 500;
        }

        .public-agent-avatar img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .public-agent-row strong {
            display: block;
            color: var(--ink);
            font-size: 15px;
            font-weight: 500;
        }

        .public-agent-row a,
        .public-agent-row small {
            display: block;
            color: var(--muted);
            font-size: 13px;
            font-weight: 300;
            text-decoration: none;
        }

        .public-decision {
            display: grid;
            gap: 14px;
        }

        .public-decision-buttons {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 8px;
        }

        .public-decision textarea {
            width: 100%;
            min-height: 96px;
            border: 1px solid var(--line);
            border-radius: 8px;
            padding: 10px;
            color: var(--ink);
            font: inherit;
            font-size: 13px;
            font-weight: 300;
            resize: vertical;
        }

        .public-proposal-message {
            color: var(--muted);
            font-size: 13px;
            line-height: 1.5;
            font-weight: 300;
        }

        .public-proposal-message.ok { color: var(--ok); }
        .public-proposal-message.error { color: var(--danger); }

        .public-esign-document {
            display: grid;
            gap: 12px;
        }

        .public-esign-document .esign-document-frame {
            border-radius: 8px;
        }

        body.public-esign-mode .public-proposal {
            padding: 0;
            background: #f3f5f2;
            min-height: 100vh;
            overflow: hidden;
        }

        body.public-esign-mode {
            overflow: hidden;
        }

        body.public-esign-mode .public-proposal-shell {
            width: 100%;
            max-width: none;
            gap: 0;
        }

        .public-esign-page {
            height: 100vh;
            min-height: 620px;
            background: #eef2ef;
            color: var(--ink);
            overflow: hidden;
        }

        .public-esign-workspace {
            height: 100%;
            display: grid;
            grid-template-columns: minmax(0, 1fr) 408px;
            overflow: hidden;
        }

        .public-esign-document-pane {
            min-width: 0;
            min-height: 0;
            display: grid;
            grid-template-rows: minmax(0, 1fr);
            background:
                radial-gradient(circle at 50% 0, rgba(255,255,255,0.72), rgba(255,255,255,0) 34%),
                linear-gradient(90deg, rgba(255,255,255,0.58) 0, rgba(255,255,255,0) 48px),
                #edf1ee;
        }

        .public-esign-document-scroll {
            min-width: 0;
            min-height: 0;
            overflow: auto;
            scrollbar-gutter: stable both-edges;
            padding: 34px 44px 54px;
        }

        .public-esign-document-stage {
            width: min(960px, 100%);
            margin: 0 auto;
        }

        .public-esign-document-stage .public-esign-document {
            gap: 18px;
        }

        .public-esign-document-stage .esign-document-frame {
            border-radius: 4px;
        }

        .public-esign-document-stage .esign-pdf-document {
            gap: 20px;
        }

        .public-esign-sidepanel {
            height: 100vh;
            min-height: 0;
            border-left: 1px solid #dde6e1;
            background: #ffffff;
            box-shadow: -22px 0 54px rgba(30,39,36,0.09);
            overflow: auto;
            scrollbar-gutter: stable;
            padding: 22px;
            display: flex;
            flex-direction: column;
            gap: 18px;
        }

        .public-esign-brand {
            display: flex;
            align-items: center;
            gap: 13px;
            min-width: 0;
            padding-bottom: 16px;
            border-bottom: 1px solid #edf2ef;
        }

        .public-esign-brand img {
            max-width: 168px;
            max-height: 48px;
            object-fit: contain;
        }

        .public-esign-brand-mark {
            width: 42px;
            height: 42px;
            border-radius: 50%;
            display: grid;
            place-items: center;
            background: #eff5f2;
            color: var(--proposal-primary, var(--accent));
            font-size: 13px;
            font-weight: 600;
        }

        .public-esign-brand div,
        .public-esign-document-title {
            display: grid;
            gap: 2px;
            min-width: 0;
        }

        .public-esign-brand strong,
        .public-esign-document-title strong {
            min-width: 0;
            overflow: hidden;
            color: var(--ink);
            font-size: 13.5px;
            font-weight: 500;
            line-height: 1.25;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .public-esign-brand span,
        .public-esign-document-title span {
            color: var(--muted);
            font-size: 11px;
            font-weight: 400;
            line-height: 1.2;
            text-transform: uppercase;
            letter-spacing: 0.05em;
        }

        .public-esign-context {
            display: grid;
            gap: 12px;
            background: #ffffff;
        }

        .public-esign-context h1 {
            margin: 0;
            color: var(--ink);
            font-size: 25px;
            font-weight: 500;
            line-height: 1.15;
            letter-spacing: 0;
        }

        .public-esign-context p {
            margin: 0;
            color: var(--muted);
            font-size: 13px;
            font-weight: 300;
            line-height: 1.45;
        }

        .public-esign-facts {
            display: flex;
            flex-wrap: wrap;
            gap: 7px;
        }

        .public-esign-facts span {
            border: 1px solid #dce5e1;
            border-radius: 999px;
            background: #f8fbf9;
            color: var(--muted);
            padding: 6px 9px;
            font-size: 12px;
            font-weight: 400;
            white-space: nowrap;
        }

        .public-esign-facts span:first-child {
            border-color: color-mix(in srgb, var(--proposal-primary, var(--accent)) 22%, #dce5e1);
            background: color-mix(in srgb, var(--proposal-primary, var(--accent)) 9%, #ffffff);
            color: var(--proposal-primary, var(--accent));
        }

        .public-esign-panel-section {
            border: 1px solid #e6ece9;
            border-radius: 12px;
            background: #fbfcfb;
            padding: 14px;
            display: grid;
            gap: 10px;
        }

        .public-esign-panel-section.is-field-guide {
            min-height: 0;
            flex: 1 1 auto;
            align-content: start;
        }

        .public-esign-panel-section h2 {
            margin: 0;
            color: var(--ink);
            font-size: 13px;
            font-weight: 500;
            line-height: 1.25;
        }

        .public-esign-panel-section p,
        .public-esign-panel-message {
            margin: 0;
            color: var(--muted);
            font-size: 12px;
            font-weight: 300;
            line-height: 1.45;
        }

        .public-esign-field-stack {
            display: grid;
            gap: 8px;
        }

        .public-esign-field-step {
            width: 100%;
            min-width: 0;
            display: grid;
            grid-template-columns: 30px minmax(0, 1fr) auto;
            align-items: center;
            gap: 10px;
            border: 1px solid #e2e9e5;
            border-radius: 10px;
            background: #ffffff;
            padding: 10px;
            color: inherit;
            text-align: left;
            cursor: pointer;
            transition: border-color 140ms ease, box-shadow 140ms ease, background 140ms ease;
        }

        .public-esign-field-step:hover,
        .public-esign-field-step.is-current {
            border-color: rgba(245,158,11,0.72);
            background: #fffbeb;
            box-shadow: 0 8px 20px rgba(120,76,0,0.08);
        }

        .public-esign-field-step.is-complete {
            border-color: rgba(22,121,76,0.35);
            background: #f3fbf6;
        }

        .public-esign-field-step-marker {
            width: 30px;
            height: 30px;
            border-radius: 50%;
            display: grid;
            place-items: center;
            background: #f1f5f3;
            color: #66736d;
            font-size: 11px;
            font-weight: 600;
        }

        .public-esign-field-step.is-current .public-esign-field-step-marker {
            background: #fbbf24;
            color: #422006;
        }

        .public-esign-field-step.is-complete .public-esign-field-step-marker {
            background: #dcfce7;
            color: #166534;
        }

        .public-esign-field-step strong,
        .public-esign-field-step span {
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .public-esign-field-step strong {
            color: var(--ink);
            font-size: 12.5px;
            font-weight: 500;
        }

        .public-esign-field-step span {
            color: var(--muted);
            font-size: 11px;
            font-weight: 300;
        }

        .public-esign-field-step-status {
            border-radius: 999px;
            background: #f1f5f3;
            color: #66736d;
            font-size: 10.5px;
            font-weight: 500;
            padding: 4px 7px;
        }

        .public-esign-commandbar {
            display: grid;
            gap: 13px;
            border: 1px solid #d7e3de;
            border-radius: 14px;
            background: linear-gradient(180deg, #ffffff, #f8fbf9);
            box-shadow: 0 18px 38px rgba(30,39,36,0.11);
            padding: 14px;
            margin-top: auto;
        }

        .public-esign-commandbar > div:not(.public-esign-controls) {
            display: grid;
            gap: 2px;
            min-width: 0;
        }

        .public-esign-commandbar strong {
            color: var(--ink);
            font-size: 14.5px;
            font-weight: 500;
            line-height: 1.25;
        }

        .public-esign-commandbar span {
            color: var(--muted);
            font-size: 12px;
            font-weight: 300;
            line-height: 1.35;
        }

        .public-esign-progress {
            display: grid;
            gap: 7px;
            min-width: 0;
        }

        .public-esign-progress-meta {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            min-width: 0;
        }

        .public-esign-progress-track {
            height: 7px;
            border-radius: 999px;
            overflow: hidden;
            background: #e6ede9;
        }

        .public-esign-progress-track span {
            display: block;
            width: 0%;
            height: 100%;
            border-radius: inherit;
            background: var(--proposal-primary, var(--accent));
            transition: width 160ms ease;
        }

        .public-esign-controls {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 8px;
        }

        .public-esign-controls .button {
            width: 100%;
            min-width: 0;
            min-height: 39px;
            white-space: nowrap;
        }

        .public-esign-controls .button[type="submit"] {
            grid-column: 1 / -1;
            min-height: 44px;
        }

        .public-esign-inline-field {
            position: absolute;
            display: grid;
            align-items: stretch;
            min-width: 28px;
            min-height: 18px;
            border: 1px solid var(--esign-recipient-border, rgba(25, 86, 126, 0.58));
            border-radius: 4px;
            background: var(--esign-recipient-bg, rgba(219, 235, 255, 0.72));
            box-shadow: 0 2px 9px rgba(15, 57, 89, 0.16);
            overflow: hidden;
            pointer-events: auto;
        }

        .public-esign-inline-field.is-current {
            border-color: #f59e0b;
            background: rgba(255, 247, 214, 0.9);
            box-shadow: 0 0 0 3px rgba(245,158,11,0.2), 0 8px 20px rgba(120,76,0,0.18);
            z-index: 8;
        }

        .public-esign-inline-field.is-complete {
            border-color: rgba(22,121,76,0.55);
            background: rgba(220,252,231,0.68);
        }

        .public-esign-inline-field[data-field-type="checkbox"] {
            place-items: center;
            background: var(--esign-recipient-bg, rgba(255, 240, 184, 0.82));
            border-color: var(--esign-recipient-border, rgba(116, 86, 0, 0.46));
        }

        .public-esign-inline-field input {
            width: 100%;
            height: 100%;
            min-width: 0;
            border: 0;
            border-radius: 3px;
            background: rgba(255,255,255,0.58);
            color: var(--esign-recipient-text, #102a43);
            font: inherit;
            font-size: clamp(9px, 1.15vw, 15px);
            font-weight: 500;
            line-height: 1.15;
            padding: 3px 6px;
            outline: 0;
        }

        .public-esign-inline-field input::placeholder {
            color: rgba(16, 42, 67, 0.62);
        }

        .public-esign-inline-field input:focus {
            background: #ffffff;
            box-shadow: inset 0 0 0 2px rgba(25, 86, 126, 0.24);
        }

        .public-esign-inline-field input[type="checkbox"] {
            width: min(22px, 72%);
            height: min(22px, 72%);
            accent-color: #745600;
            place-self: center;
        }

        .public-esign-inline-field input[data-signing-date="1"] {
            cursor: default;
            user-select: none;
        }

        .public-esign-signature-trigger {
            width: 100%;
            height: 100%;
            min-width: 0;
            border: 0;
            border-radius: 3px;
            background: rgba(255,255,255,0.58);
            color: #102a43;
            display: flex;
            align-items: center;
            justify-content: flex-start;
            padding: 3px 6px;
            cursor: pointer;
            overflow: hidden;
            text-align: left;
        }

        .public-esign-signature-trigger:focus {
            outline: 0;
            background: #ffffff;
            box-shadow: inset 0 0 0 2px rgba(25, 86, 126, 0.24);
        }

        .public-esign-signature-trigger span {
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .public-esign-signature-trigger img,
        .public-esign-inline-value img {
            display: block;
            width: 100%;
            height: 100%;
            object-fit: contain;
        }

        .public-esign-inline-field[data-field-type="signature"] input,
        .public-esign-inline-field[data-field-type="initials"] input,
        .public-esign-signature-trigger,
        .public-esign-inline-value[data-field-type="signature"],
        .public-esign-inline-value[data-field-type="initials"] {
            font-family: "Brush Script MT", "Segoe Script", cursive;
            font-size: inherit;
            font-weight: 500;
        }

        .public-esign-inline-value {
            position: absolute;
            display: flex;
            align-items: center;
            min-width: 28px;
            min-height: 18px;
            color: #102a43;
            font-size: clamp(9px, 1.1vw, 15px);
            font-weight: 500;
            line-height: 1.15;
            padding: 2px 5px;
            overflow: hidden;
            pointer-events: none;
            white-space: nowrap;
        }

        .public-esign-inline-value[data-field-type="checkbox"] {
            justify-content: center;
            color: #146236;
            font-size: clamp(15px, 2vw, 24px);
            font-family: inherit;
        }

        .public-esign-inline-value.public-esign-signed-verification {
            display: grid;
            grid-template-rows: minmax(0, 1fr) auto;
            align-items: stretch;
            gap: 2px;
            padding: 3px 4px;
            border-left: 1px solid rgba(31,77,77,.35);
            background: rgba(255,255,255,.72);
            font-family: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
            white-space: normal;
        }

        .public-esign-signed-label,
        .public-esign-signed-ip {
            overflow: hidden;
            color: #5f6b65;
            font-family: inherit;
            font-size: 9px !important;
            font-weight: 400;
            line-height: 1.1;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .public-esign-signed-mark {
            display: flex;
            min-height: 0;
            align-items: center;
            overflow: hidden;
            color: #102a43;
            font-family: "Brush Script MT", "Segoe Script", "Snell Roundhand", cursive;
            font-size: 20px !important;
            font-weight: 500;
            line-height: 1;
        }

        .public-esign-signed-mark img {
            width: 100%;
            height: 100%;
            max-height: none;
            object-fit: contain;
            object-position: left center;
        }

        .public-esign-signature-audit {
            overflow: hidden;
            color: #5f6b65;
            font-family: "Inter", ui-sans-serif, system-ui, sans-serif;
            font-size: 8px;
            line-height: 1.1;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .public-esign-sticker {
            position: absolute;
            left: -10px;
            top: -30px;
            z-index: 9;
            display: none;
            border: 1px solid rgba(180,83,9,0.25);
            border-radius: 5px;
            background: #fbbf24;
            color: #422006;
            padding: 6px 9px;
            font-family: "Inter", ui-sans-serif, system-ui, sans-serif;
            font-size: 11px;
            font-weight: 700;
            line-height: 1;
            letter-spacing: 0.02em;
            text-transform: uppercase;
            box-shadow: 0 8px 18px rgba(120,76,0,0.2);
            pointer-events: none;
            white-space: nowrap;
        }

        .public-esign-sticker::after {
            content: "";
            position: absolute;
            left: 18px;
            bottom: -6px;
            width: 10px;
            height: 10px;
            background: #fbbf24;
            border-right: 1px solid rgba(180,83,9,0.25);
            border-bottom: 1px solid rgba(180,83,9,0.25);
            transform: rotate(45deg);
        }

        .public-esign-inline-field.is-current .public-esign-sticker {
            display: block;
        }

        .public-esign-signature-modal[hidden] {
            display: none !important;
        }

        .public-esign-signature-modal {
            position: fixed;
            inset: 0;
            z-index: 100;
            display: grid;
            place-items: center;
            padding: 20px;
            background: rgba(17,24,39,0.45);
        }

        .public-esign-signature-card {
            width: min(620px, 100%);
            border-radius: 14px;
            background: #ffffff;
            box-shadow: 0 28px 80px rgba(17,24,39,0.28);
            border: 1px solid #dce5e1;
            padding: 18px;
            display: grid;
            gap: 14px;
        }

        .public-esign-signature-head {
            display: flex;
            align-items: start;
            justify-content: space-between;
            gap: 16px;
        }

        .public-esign-signature-head h2 {
            margin: 0;
            color: var(--ink);
            font-size: 20px;
            font-weight: 500;
            line-height: 1.2;
        }

        .public-esign-signature-head p {
            margin: 4px 0 0;
            color: var(--muted);
            font-size: 13px;
            line-height: 1.45;
        }

        .public-esign-signature-tabs {
            display: inline-grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 4px;
            border: 1px solid #dce5e1;
            border-radius: 999px;
            background: #f3f6f4;
            padding: 4px;
            width: min(330px, 100%);
        }

        .public-esign-signature-tabs button {
            border: 0;
            border-radius: 999px;
            min-height: 34px;
            background: transparent;
            color: var(--muted);
            font-size: 13px;
            font-weight: 500;
            cursor: pointer;
        }

        .public-esign-signature-tabs button.active {
            background: #ffffff;
            color: var(--accent);
            box-shadow: 0 4px 12px rgba(30,39,36,0.1);
        }

        .public-esign-signature-pane {
            display: grid;
            gap: 10px;
        }

        .public-esign-signature-pane[hidden] {
            display: none !important;
        }

        .public-esign-signature-pane input {
            width: 100%;
            height: 56px;
            border: 1px solid #d8e3df;
            border-radius: 10px;
            color: #102a43;
            font-family: "Brush Script MT", "Segoe Script", cursive;
            font-size: 28px;
            padding: 0 14px;
            outline: 0;
        }

        .public-esign-signature-pane input:focus {
            border-color: var(--accent);
            box-shadow: 0 0 0 3px var(--accent-ring);
        }

        .public-esign-draw-surface {
            border: 1px dashed #b6c6c0;
            border-radius: 12px;
            background: #fbfdfc;
            padding: 10px;
        }

        .public-esign-draw-surface canvas {
            display: block;
            width: 100%;
            height: 190px;
            border-radius: 8px;
            background: #ffffff;
            touch-action: none;
        }

        .public-esign-signature-preview {
            min-height: 64px;
            border: 1px solid #edf1ef;
            border-radius: 10px;
            background: #fafcfb;
            display: grid;
            place-items: center;
            color: #102a43;
            font-family: "Brush Script MT", "Segoe Script", cursive;
            font-size: 30px;
            overflow: hidden;
            padding: 8px 12px;
        }

        .public-esign-signature-preview img {
            max-width: 100%;
            max-height: 76px;
            object-fit: contain;
        }

        .public-esign-signature-actions {
            display: flex;
            justify-content: space-between;
            gap: 10px;
            flex-wrap: wrap;
        }

        .public-esign-signature-actions > div {
            display: flex;
            gap: 8px;
            flex-wrap: wrap;
        }

        @media (max-width: 980px) {
            body.public-esign-mode {
                overflow: auto;
            }

            body.public-esign-mode .public-proposal {
                overflow: visible;
            }

            .public-esign-page {
                height: auto;
                min-height: 100vh;
                overflow: visible;
            }

            .public-esign-workspace {
                height: auto;
                min-height: 100vh;
                grid-template-columns: 1fr;
            }

            .public-esign-sidepanel {
                order: -1;
                height: auto;
                max-height: none;
                border-left: 0;
                border-bottom: 1px solid #d5ded9;
                box-shadow: 0 14px 36px rgba(30,39,36,0.08);
                overflow: visible;
            }

            .public-esign-document-pane,
            .public-esign-document-scroll {
                min-height: 0;
                overflow: visible;
            }

            .public-esign-document-scroll {
                padding: 18px 12px 30px;
            }

            .public-esign-signature-card {
                padding: 14px;
            }

            .public-esign-signature-head,
            .public-esign-signature-actions {
                align-items: stretch;
                flex-direction: column;
            }

            .public-esign-signature-actions > div,
            .public-esign-signature-actions .button {
                width: 100%;
            }
        }

        @media (max-width: 720px) {
            .public-esign-sidepanel {
                padding: 12px 12px 0;
                gap: 10px;
                box-shadow: none;
            }

            .public-esign-brand {
                padding-bottom: 10px;
            }

            .public-esign-brand img {
                max-width: 132px;
                max-height: 36px;
            }

            .public-esign-context h1 {
                font-size: 20px;
            }

            .public-esign-context p,
            .public-esign-panel-section,
            .public-esign-panel-section.is-field-guide {
                display: none;
            }

            .public-esign-document-scroll {
                padding: 12px 8px 190px;
            }

            .public-esign-commandbar {
                position: fixed;
                z-index: 40;
                right: 0;
                bottom: 0;
                left: 0;
                padding: 12px max(12px, env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
                border-top: 1px solid #d8e3df;
                background: rgba(255,255,255,.98);
                box-shadow: 0 -12px 30px rgba(30,39,36,.14);
            }

            .public-esign-progress-meta span[data-public-esign-step] {
                display: none;
            }

            .public-esign-inline-field input {
                font-size: clamp(8px, 2.7vw, 14px);
            }
        }

        .public-decision-state {
            border: 1px solid #d8e3df;
            border-radius: 10px;
            background: #f7fbf9;
            padding: 14px;
            display: grid;
            gap: 6px;
        }

        .public-decision-state strong {
            color: var(--accent);
            font-size: 18px;
            font-weight: 500;
        }

        .public-decision-state.accepted {
            border-color: #86efac;
            background: #f0fdf4;
        }

        .public-decision-state.accepted strong {
            color: #166534;
        }

        .public-decision-state.completed {
            border-color: #7dd3fc;
            background: #f0f9ff;
        }

        .public-decision-state.completed strong {
            color: #075985;
        }

        .public-decision-state.declined {
            border-color: #fca5a5;
            background: #fff1f2;
        }

        .public-decision-state.declined strong {
            color: #991b1b;
        }

        .proposal-decision-button.is-selected {
            box-shadow: inset 0 0 0 1px currentColor;
        }

        .proposal-decision-button.is-muted,
        .proposal-decision-button:disabled {
            border-color: #d9dfdc;
            background: #f2f4f2;
            color: #8a948e;
            cursor: not-allowed;
            opacity: 0.78;
        }

        body.public-proposal-mode {
            background: #ffffff;
        }

        .public-proposal {
            --proposal-container: 1120px;
            --proposal-gutter: 40px;
            padding: 0;
            background: #ffffff;
            color: #182420;
        }

        .public-proposal-shell {
            width: 100%;
            max-width: none;
            gap: 0;
        }

        .public-proposal-topbar {
            position: sticky;
            top: 0;
            z-index: 20;
            background: rgba(255,255,255,0.94);
            backdrop-filter: blur(14px);
            border-bottom: 1px solid #e4ebe7;
        }

        .public-proposal-topbar-inner {
            width: min(var(--proposal-container), calc(100% - var(--proposal-gutter)));
            margin: 0 auto;
            min-height: 72px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 18px;
        }

        .public-proposal-topbar img {
            max-width: 174px;
            max-height: 44px;
            object-fit: contain;
        }

        .public-proposal-topbar-actions {
            display: flex;
            align-items: center;
            gap: 10px;
        }

        .public-proposal-primary-link {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 38px;
            border-radius: 999px;
            border: 1px solid var(--proposal-primary, #1f4d4d);
            background: var(--proposal-primary, #1f4d4d);
            color: #ffffff;
            padding: 0 15px;
            font-size: 13px;
            font-weight: 500;
            text-decoration: none;
            white-space: nowrap;
        }

        .public-proposal-hero {
            background:
                linear-gradient(180deg, rgba(31,77,77,0.08), rgba(31,77,77,0)),
                #f6f8f6;
            border-bottom: 1px solid #e4ebe7;
        }

        .public-proposal-hero-layout {
            width: min(var(--proposal-container), calc(100% - var(--proposal-gutter)));
            margin: 0 auto;
            display: grid;
            grid-template-columns: minmax(0, 0.95fr) minmax(360px, 1.05fr);
            gap: 42px;
            align-items: center;
            padding: 54px 0 42px;
        }

        .public-proposal-hero-copy {
            display: grid;
            gap: 22px;
            min-width: 0;
        }

        .public-proposal-kicker {
            color: var(--proposal-primary, #1f4d4d);
            font-size: 12px;
            font-weight: 600;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }

        .public-proposal-title {
            display: grid;
            gap: 12px;
        }

        .public-proposal-title h1 {
            max-width: 720px;
            font-size: clamp(34px, 5vw, 64px);
            line-height: 0.98;
            font-weight: 500;
            letter-spacing: -0.01em;
        }

        .public-proposal-title p {
            max-width: 620px;
            color: #56645f;
            font-size: 17px;
            line-height: 1.7;
        }

        .public-proposal-hero-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            align-items: center;
        }

        .public-proposal-secondary-link {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 38px;
            border-radius: 999px;
            border: 1px solid #cfdad5;
            background: #ffffff;
            color: #24332e;
            padding: 0 15px;
            font-size: 13px;
            font-weight: 500;
            text-decoration: none;
        }

        .public-proposal-hero-media {
            position: relative;
            display: grid;
            min-height: 520px;
            border-radius: 18px;
            overflow: hidden;
            border: 1px solid #dfe8e3;
            background: #e9efeb;
            box-shadow: 0 24px 70px rgba(31,77,77,0.14);
        }

        .public-proposal-header-image {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            min-height: 0;
            border-radius: 0;
            object-fit: cover;
            background:
                radial-gradient(circle at 18% 18%, rgba(31,77,77,0.18), transparent 34%),
                linear-gradient(135deg, #eef3ef, #dfe8e3);
        }

        .public-proposal-header-image.fallback {
            display: block;
        }

        .public-proposal-media-overlay {
            position: absolute;
            inset: auto 18px 18px;
            display: grid;
            grid-template-columns: minmax(0, 1fr) 230px;
            gap: 12px;
            align-items: end;
        }

        .public-proposal-media-card {
            min-width: 0;
            border: 1px solid rgba(255,255,255,0.62);
            border-radius: 13px;
            background: rgba(255,255,255,0.92);
            backdrop-filter: blur(12px);
            box-shadow: 0 18px 44px rgba(30,39,36,0.16);
            padding: 16px;
        }

        .public-proposal-media-card span {
            display: block;
            color: #65716c;
            font-size: 11px;
            font-weight: 600;
            letter-spacing: 0.06em;
            text-transform: uppercase;
            margin-bottom: 5px;
        }

        .public-proposal-media-card strong {
            display: block;
            color: #182420;
            font-size: 17px;
            font-weight: 500;
            line-height: 1.28;
        }

        .public-proposal-map {
            min-height: 170px;
            height: 170px;
            border-radius: 13px;
            border: 1px solid rgba(255,255,255,0.72);
            box-shadow: 0 18px 44px rgba(30,39,36,0.16);
        }

        .public-proposal-nav {
            position: sticky;
            top: 72px;
            z-index: 19;
            border-bottom: 1px solid #e4ebe7;
            background: rgba(255,255,255,0.96);
            backdrop-filter: blur(14px);
        }

        .public-proposal-nav-inner {
            width: min(var(--proposal-container), calc(100% - var(--proposal-gutter)));
            margin: 0 auto;
            display: flex;
            gap: 26px;
            overflow-x: auto;
            padding: 16px 0;
        }

        .public-proposal-nav a {
            color: #4b5b55;
            font-size: 13px;
            font-weight: 500;
            text-decoration: none;
            white-space: nowrap;
        }

        .public-proposal-grid {
            width: min(var(--proposal-container), calc(100% - var(--proposal-gutter)));
            margin: 0 auto;
            padding: 38px 0 60px;
        }

        .public-proposal-main {
            display: grid;
            gap: 26px;
        }

        .public-proposal-panel {
            border: 0;
            border-radius: 0;
            box-shadow: none;
            padding: 0;
            background: transparent;
        }

        .public-proposal-section {
            display: grid;
            gap: 18px;
            padding: 34px 0;
            border-bottom: 1px solid #e4ebe7;
            scroll-margin-top: 148px;
        }

        .public-decision {
            scroll-margin-top: 148px;
        }

        .public-section-title {
            display: grid;
            gap: 8px;
        }

        .public-section-title h2 {
            color: var(--proposal-primary, #1f4d4d);
            font-size: 12px;
            font-weight: 600;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }

        .public-section-title strong {
            max-width: 780px;
            font-size: clamp(24px, 3vw, 36px);
            line-height: 1.13;
            font-weight: 500;
        }

        .public-introduction-text,
        .public-proposal-note {
            max-width: 860px;
            color: #27342f;
            font-size: 17px;
            line-height: 1.82;
        }

        .public-about-grid {
            grid-template-columns: minmax(0, 1fr);
            gap: 16px;
            max-width: 760px;
        }

        .public-about-card {
            border: 1px solid #dfe8e3;
            border-radius: 14px;
            background: #ffffff;
            padding: 20px;
        }

        .public-agent-profile-card {
            grid-template-columns: 86px minmax(0, 1fr);
            align-items: center;
            gap: 18px;
        }

        .public-agent-row {
            grid-template-columns: 64px minmax(0, 1fr);
            gap: 14px;
        }

        .public-agent-profile-card .public-agent-row {
            grid-template-columns: 86px minmax(0, 1fr);
        }

        .public-agent-avatar {
            width: 64px;
            height: 64px;
        }

        .public-agent-profile-card .public-agent-avatar {
            width: 86px;
            height: 86px;
        }

        .public-team-panel {
            display: grid;
            grid-template-columns: minmax(0, 0.82fr) minmax(280px, 0.55fr);
            gap: 18px;
            align-items: stretch;
            border: 1px solid #dfe8e3;
            border-radius: 16px;
            background: #ffffff;
            box-shadow: 0 18px 42px rgba(30,39,36,0.055);
            overflow: hidden;
        }

        .public-team-profile {
            display: grid;
            grid-template-columns: 96px minmax(0, 1fr);
            gap: 18px;
            align-items: center;
            padding: 24px;
            min-width: 0;
        }

        .public-team-profile .public-agent-avatar {
            width: 96px;
            height: 96px;
            border-width: 0;
            box-shadow: 0 12px 28px rgba(31,77,77,0.16);
        }

        .public-team-copy {
            display: grid;
            gap: 8px;
            min-width: 0;
        }

        .public-team-copy > span,
        .public-team-support > span {
            color: var(--proposal-primary, #1f4d4d);
            font-size: 11px;
            font-weight: 600;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }

        .public-team-copy strong {
            color: #182420;
            font-size: clamp(22px, 3vw, 32px);
            line-height: 1.1;
            font-weight: 500;
        }

        .public-team-copy a {
            color: #155c98;
            font-size: 14px;
            font-weight: 400;
            text-decoration: none;
        }

        .public-team-copy p,
        .public-team-support li {
            color: #56645f;
            font-size: 15px;
            line-height: 1.65;
            font-weight: 300;
        }

        .public-team-copy p {
            margin: 2px 0 0;
        }

        .public-team-support {
            display: grid;
            align-content: center;
            gap: 12px;
            padding: 24px;
            background: #f7faf8;
            border-left: 1px solid #dfe8e3;
        }

        .public-team-support ul {
            margin: 0;
            padding: 0;
            list-style: none;
            display: grid;
            gap: 10px;
        }

        .public-team-support li {
            position: relative;
            padding-left: 18px;
        }

        .public-team-support li::before {
            content: "";
            position: absolute;
            left: 0;
            top: 0.72em;
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: var(--proposal-primary, #1f4d4d);
        }

        .public-proposal-stats {
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 12px;
        }

        .public-proposal-stat {
            border: 1px solid #dfe8e3;
            border-radius: 14px;
            background: #f8fbf9;
            padding: 18px;
        }

        .public-proposal-stat strong {
            color: var(--proposal-primary, #1f4d4d);
            font-size: 26px;
        }

        .public-comparison-list {
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 16px;
        }

        .public-comparison-card {
            border: 1px solid #dfe8e3;
            border-radius: 14px;
            padding: 0;
            overflow: hidden;
            box-shadow: 0 16px 36px rgba(30,39,36,0.06);
            display: grid;
            grid-template-rows: 330px minmax(270px, auto);
            min-height: 600px;
        }

        .public-comparison-media {
            display: grid;
            grid-template-rows: 190px 140px;
            background: #eef3ef;
        }

        .public-comparison-photo,
        .public-comparison-map {
            border: 0;
            border-radius: 0;
            width: 100%;
            height: 100%;
            min-height: 0;
        }

        .public-comparison-photo {
            object-fit: cover;
            display: block;
        }

        .public-comparison-placeholder {
            display: grid;
            place-items: center;
            background:
                radial-gradient(circle at 20% 25%, rgba(31,77,77,0.12), transparent 34%),
                linear-gradient(135deg, #f2f6f3, #e6eee9);
            color: #6c7973;
            font-size: 12px;
            font-weight: 500;
            letter-spacing: 0.04em;
            text-transform: uppercase;
        }

        .public-comparison-copy {
            padding: 16px;
            align-content: start;
            grid-template-rows: auto 38px minmax(82px, 1fr) auto;
        }

        .public-comparison-meta {
            min-height: 32px;
            align-content: start;
        }

        .public-comparison-copy p {
            min-height: 68px;
        }

        .public-comparison-empty {
            color: #8a958f;
        }

        .public-comparison-link {
            align-self: end;
        }

        .public-document-frame {
            height: min(680px, 72vh);
            border-radius: 14px;
        }

        .public-decision {
            margin-top: 22px;
            border-radius: 18px;
            padding: 34px;
            background: #f6f8f6;
            border: 1px solid #dfe8e3;
        }

        .public-decision-buttons {
            max-width: 520px;
        }

        .public-work-order-response-fields {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 12px;
            max-width: 680px;
        }

        .public-work-order-response-fields[hidden] {
            display: none !important;
        }

        .public-work-order-response-fields label {
            display: grid;
            gap: 7px;
            color: #56645f;
            font-size: 12px;
            font-weight: 500;
        }

        .public-work-order-response-fields input {
            width: 100%;
            min-height: 42px;
            border: 1px solid #cfdad5;
            border-radius: 10px;
            background: #ffffff;
            color: #182420;
            padding: 9px 11px;
            font: inherit;
            font-size: 14px;
            font-weight: 300;
            outline: none;
        }

        .public-work-order-response-fields textarea {
            width: 100%;
            min-height: 120px;
            border: 1px solid #cfdad5;
            border-radius: 10px;
            background: #ffffff;
            color: #182420;
            padding: 9px 11px;
            font: inherit;
            font-size: 14px;
            font-weight: 300;
            outline: none;
            resize: vertical;
        }

        .public-work-order-response-fields .full {
            grid-column: 1 / -1;
        }

        .public-work-order-response-fields input:focus,
        .public-work-order-response-fields textarea:focus {
            border-color: var(--proposal-primary, #1f4d4d);
            box-shadow: 0 0 0 3px rgba(31,77,77,0.1);
        }

        .public-work-order-media-grid {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 14px;
        }

        .public-work-order-media-card {
            display: grid;
            gap: 10px;
            border: 1px solid #dfe8e3;
            border-radius: 8px;
            background: #ffffff;
            overflow: hidden;
        }

        .public-work-order-media-preview {
            display: grid;
            place-items: center;
            aspect-ratio: 4 / 3;
            background: #eef3f0;
            color: var(--proposal-primary, #1f4d4d);
            overflow: hidden;
        }

        .public-work-order-media-preview img,
        .public-work-order-media-preview video {
            display: block;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .public-work-order-file-badge {
            width: 74px;
            height: 74px;
            display: grid;
            place-items: center;
            border-radius: 14px;
            background: #ffffff;
            border: 1px solid #d7e2dd;
            font-size: 13px;
            font-weight: 600;
        }

        .public-work-order-media-meta {
            display: grid;
            gap: 4px;
            padding: 0 13px 13px;
        }

        .public-work-order-media-meta strong {
            color: #182420;
            font-size: 14px;
            font-weight: 500;
            line-height: 1.3;
            overflow-wrap: anywhere;
        }

        .public-work-order-media-meta span {
            color: #6b7772;
            font-size: 12px;
            font-weight: 300;
        }

        .public-work-order-media-meta a {
            color: var(--proposal-primary, #1f4d4d);
            font-size: 13px;
            font-weight: 500;
            text-decoration: none;
        }

        .public-work-order-completion-grid {
            display: grid;
            grid-template-columns: repeat(5, minmax(0, 1fr));
            gap: 10px;
        }

        .public-work-order-completion-photo {
            display: block;
            aspect-ratio: 1 / 1;
            border-radius: 8px;
            overflow: hidden;
            border: 1px solid #dfe8e3;
            background: #eef3f0;
        }

        .public-work-order-completion-photo img {
            display: block;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .public-work-order-empty,
        .public-work-order-tenant-card {
            border: 1px solid #dfe8e3;
            border-radius: 8px;
            background: #f8faf8;
            padding: 18px;
        }

        .public-work-order-empty {
            color: #5f6b66;
            font-size: 14px;
            line-height: 1.55;
        }

        .public-work-order-tenant-card {
            display: grid;
            gap: 14px;
        }

        .public-work-order-tenant-lock {
            display: grid;
            grid-template-columns: 42px minmax(0, 1fr);
            gap: 13px;
            align-items: start;
        }

        .public-work-order-tenant-lock-icon {
            width: 42px;
            height: 42px;
            border-radius: 50%;
            display: grid;
            place-items: center;
            color: var(--proposal-primary, #1f4d4d);
            background: #ffffff;
            border: 1px solid #dce7e2;
        }

        .public-work-order-tenant-lock-icon svg {
            width: 19px;
            height: 19px;
        }

        .public-work-order-tenant-card strong {
            color: #182420;
            font-size: 16px;
            font-weight: 500;
        }

        .public-work-order-tenant-card p,
        .public-work-order-tenant-card span {
            margin: 0;
            color: #5f6b66;
            font-size: 14px;
            line-height: 1.55;
            font-weight: 300;
        }

        .public-work-order-tenant-grid {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 12px;
        }

        .public-work-order-tenant-grid div {
            display: grid;
            gap: 5px;
            padding: 13px;
            border-radius: 8px;
            background: #ffffff;
            border: 1px solid #dfe8e3;
        }

        .public-work-order-tenant-grid span {
            color: #6b7772;
            font-size: 11px;
            font-weight: 600;
            letter-spacing: 0.05em;
            text-transform: uppercase;
        }

        .public-work-order-tenant-grid a,
        .public-work-order-tenant-grid strong {
            color: #182420;
            font-size: 14px;
            font-weight: 500;
            overflow-wrap: anywhere;
            text-decoration: none;
        }

        body.public-work-order-mode {
            overflow: auto;
            background: #ffffff;
        }

        .public-work-order-page {
            --proposal-container: 1120px;
            --proposal-gutter: 40px;
            color: #182420;
            background: #ffffff;
            max-width: 100vw;
            overflow-x: hidden;
        }

        .public-work-order-page .public-proposal-topbar {
            position: sticky;
            top: 0;
            z-index: 20;
            background: rgba(255,255,255,0.94);
            backdrop-filter: blur(14px);
            border-bottom: 1px solid #e4ebe7;
        }

        .public-work-order-page .public-proposal-topbar-inner,
        .public-work-order-page .public-proposal-hero-layout,
        .public-work-order-page .public-proposal-nav-inner,
        .public-work-order-page .public-proposal-grid {
            width: min(var(--proposal-container), calc(100% - var(--proposal-gutter)));
            margin: 0 auto;
        }

        .public-work-order-page .public-proposal-topbar-inner {
            min-height: 72px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 18px;
        }

        .public-work-order-page .public-proposal-topbar img {
            display: block;
            max-width: 174px;
            max-height: 44px;
            object-fit: contain;
        }

        .public-work-order-page .public-proposal-hero {
            background:
                linear-gradient(180deg, rgba(31,77,77,0.08), rgba(31,77,77,0)),
                #f6f8f6;
            border-bottom: 1px solid #e4ebe7;
        }

        .public-work-order-page .public-proposal-hero-layout {
            display: grid;
            grid-template-columns: minmax(0, 0.95fr) minmax(360px, 1.05fr);
            gap: 42px;
            align-items: center;
            padding: 54px 0 42px;
        }

        .public-work-order-page .public-proposal-hero-copy,
        .public-work-order-page .public-proposal-title,
        .public-work-order-page .public-proposal-stat {
            min-width: 0;
        }

        .public-work-order-page .public-proposal-title h1,
        .public-work-order-page .public-proposal-title p {
            overflow-wrap: anywhere;
        }

        .public-work-order-page .public-proposal-hero-media {
            min-height: 520px;
        }

        .public-work-order-page .public-proposal-nav {
            position: sticky;
            top: 72px;
            z-index: 19;
            border-bottom: 1px solid #e4ebe7;
            background: rgba(255,255,255,0.96);
            backdrop-filter: blur(14px);
        }

        .public-work-order-page .public-proposal-nav-inner {
            display: flex;
            gap: 26px;
            overflow-x: auto;
            padding: 16px 0;
        }

        .public-work-order-page .public-proposal-grid {
            padding: 38px 0 60px;
        }

        .proposal-decision-button {
            min-height: 46px;
            border-radius: 999px;
            font-size: 14px;
            font-weight: 500;
        }

        .auth-card {
            width: min(440px, calc(100% - 64px));
            align-self: center;
            justify-self: center;
            background: #ffffff;
            padding: 32px 0;
            display: grid;
            gap: 20px;
        }

        .auth-card img {
            width: 190px;
            height: auto;
            object-fit: contain;
            object-position: left center;
            margin-bottom: 24px;
        }

        .auth-card h1 {
            margin: 0;
            font-size: clamp(30px, 3vw, 38px);
            line-height: 1.12;
            letter-spacing: -0.035em;
            font-weight: 500;
        }

        .auth-card p {
            margin: 0;
            color: var(--muted);
            font-size: 14px;
            line-height: 1.6;
            font-weight: 400;
        }

        .auth-intro {
            display: grid;
            gap: 9px;
        }

        .auth-card .auth-legal {
            margin: -2px 0 0;
            color: var(--muted);
            font-size: 11px;
            line-height: 1.55;
            font-weight: 300;
        }

        .auth-card .auth-legal a {
            color: var(--accent);
            font-weight: 500;
            text-decoration-thickness: 1px;
            text-underline-offset: 3px;
        }

        @media (min-width: 681px) {
            .auth-card .auth-legal {
                width: max-content;
                max-width: none;
                justify-self: start;
                white-space: nowrap;
                font-size: 9px;
                letter-spacing: -0.01em;
            }
        }

        .auth-fields {
            display: grid;
            gap: 12px;
        }

        .auth-fields input {
            height: 48px;
            border: 1px solid var(--line);
            border-radius: 9px;
            padding: 0 14px;
            color: var(--ink);
            background: #ffffff;
            outline: none;
            font-size: 14px;
            font-weight: 400;
        }

        .auth-fields input:focus {
            border-color: var(--accent);
            box-shadow: 0 0 0 3px var(--accent-ring);
        }

        .auth-actions {
            display: grid;
            gap: 9px;
        }

        .auth-actions .button {
            min-height: 48px;
            font-size: 14px;
        }

        .auth-secondary {
            border: 0;
            background: transparent;
            color: var(--accent);
            cursor: pointer;
            font: inherit;
            font-size: 13px;
            font-weight: 400;
            padding: 2px 4px;
            justify-self: center;
        }

        .auth-secondary[hidden] {
            display: none;
        }

        .auth-visual {
            position: relative;
            min-width: 0;
            min-height: 100vh;
            overflow: hidden;
            background: #dfe6df;
        }

        .auth-visual img {
            width: 100%;
            height: 100%;
            display: block;
            object-fit: cover;
            object-position: 52% center;
        }

        .auth-visual::after {
            content: "";
            position: absolute;
            inset: 0;
            pointer-events: none;
            box-shadow: inset 18px 0 42px rgba(21, 43, 39, 0.08);
        }

        @media (max-width: 900px) {
            .auth-screen {
                grid-template-columns: minmax(360px, 54%) minmax(0, 46%);
            }

            .auth-card {
                width: min(420px, calc(100% - 48px));
            }

            .auth-visual img {
                object-position: 56% center;
            }
        }

        @media (max-width: 680px) {
            body {
                overflow: auto;
            }

            .auth-screen {
                min-height: 100dvh;
                grid-template-columns: 1fr;
                grid-template-rows: minmax(0, 1fr) 210px;
            }

            .auth-card {
                width: min(420px, calc(100% - 40px));
                padding: 40px 0 32px;
            }

            .auth-card img {
                width: 170px;
                margin-bottom: 14px;
            }

            .auth-card h1 {
                font-size: 30px;
            }

            .auth-visual {
                min-height: 210px;
            }

            .auth-visual img {
                object-position: center 43%;
            }

            .auth-visual::after {
                box-shadow: inset 0 16px 34px rgba(21, 43, 39, 0.08);
            }
        }

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

        .app-shell[hidden] {
            display: none !important;
        }

        .sidebar {
            background: #173f34;
            color: #ffffff;
            border-right: 1px solid #173f34;
            box-shadow: inset -7px 0 11px -9px rgba(4, 25, 19, 0.72);
            padding: 22px 16px;
            display: flex;
            flex-direction: column;
            gap: 14px;
            min-height: 0;
        }

        .brand {
            display: flex;
            align-items: center;
            width: 100%;
            padding: 0 8px 28px;
            margin-bottom: 16px;
            border: 0;
            border-radius: 8px;
            background: transparent;
            color: inherit;
            text-align: left;
            cursor: pointer;
        }

        .brand:hover {
            opacity: 0.86;
        }

        .brand:focus-visible {
            outline: 2px solid #63d46d;
            outline-offset: 3px;
        }

        .brand:disabled {
            cursor: default;
            opacity: 1;
        }

        .brand-mark {
            width: 206px;
            height: 56px;
            display: flex;
            align-items: center;
        }

        .brand-mark img {
            width: 206px;
            max-height: 52px;
            object-fit: contain;
            object-position: left center;
        }

        .brand-title {
            display: none;
        }

        .brand-title strong {
            display: block;
            font-size: 15px;
            line-height: 1.15;
            letter-spacing: 0;
        }

        .brand-title span {
            display: block;
            color: rgba(255,255,255,0.58);
            font-size: 12px;
            margin-top: 3px;
        }

        .nav-list {
            display: grid;
            gap: 2px;
            align-content: start;
            min-height: 0;
            overflow-y: auto;
        }

        .nav-button {
            width: 100%;
            border: 0;
            background: transparent;
            color: rgba(255, 255, 255, 0.76);
            display: grid;
            grid-template-columns: 18px 1fr auto;
            align-items: center;
            gap: 9px;
            text-align: left;
            border-radius: 7px;
            padding: 9px 10px;
            cursor: pointer;
            text-decoration: none;
        }

        .nav-button:hover {
            background: rgba(255, 255, 255, 0.09);
            color: #ffffff;
        }

        .nav-button.active {
            background: rgba(255, 255, 255, 0.14);
            color: #ffffff;
            box-shadow: none;
        }

        .nav-group {
            display: grid;
            gap: 2px;
        }

        .nav-submenu {
            display: none;
            gap: 2px;
        }

        .nav-group:hover > .nav-submenu,
        .nav-group:focus-within > .nav-submenu,
        .nav-group.open > .nav-submenu,
        .nav-group:has(.nav-submenu .nav-button.active) > .nav-submenu {
            display: grid;
        }

        .nav-group.open > .nav-button,
        .nav-group:has(.nav-submenu .nav-button.active) > .nav-button {
            background: rgba(255, 255, 255, 0.09);
            color: #ffffff;
        }

        .nav-submenu .nav-button {
            padding-left: 28px;
        }

        .nav-group-flat > .nav-button {
            display: none;
        }

        .nav-group-flat > .nav-submenu > .nav-button,
        .nav-group-flat > .nav-submenu > .nav-group > .nav-button {
            padding-left: 10px;
        }

        .nav-chevron {
            width: 14px;
            height: 14px;
            justify-self: end;
            transition: transform 0.16s ease;
        }

        .nav-group:hover > .nav-button .nav-chevron,
        .nav-group:focus-within > .nav-button .nav-chevron,
        .nav-group.open > .nav-button .nav-chevron,
        .nav-group:has(.nav-submenu .nav-button.active) > .nav-button .nav-chevron {
            transform: rotate(180deg);
        }

        .nav-icon {
            width: 16px;
            height: 16px;
            color: rgba(255, 255, 255, 0.72);
        }

        .nav-button span {
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
            font-weight: 400;
            font-size: 13px;
        }

        .nav-count {
            color: rgba(255, 255, 255, 0.54);
            font-size: 12px;
            font-variant-numeric: tabular-nums;
            font-style: normal;
        }

        .sidebar-account {
            margin-top: auto;
            padding: 10px 6px 0;
            display: grid;
            gap: 7px;
            flex: 0 0 auto;
        }

        .sidebar-knowledge-link {
            margin: 0 -6px;
            padding-left: 8px;
            padding-right: 8px;
        }

        .profile-chip {
            display: grid;
            grid-template-columns: 32px minmax(0, 1fr) 30px;
            align-items: center;
            gap: 6px;
            min-width: 0;
            padding-top: 10px;
            border-top: 1px solid rgba(255, 255, 255, 0.14);
        }

        .avatar,
        .avatar-button {
            width: 34px;
            height: 34px;
            border-radius: 50%;
            display: inline-grid;
            place-items: center;
            overflow: hidden;
            background: #e8f1f0;
            color: var(--accent);
            font-size: 12px;
            font-weight: 500;
            line-height: 1;
            flex: 0 0 auto;
        }

        .avatar img,
        .avatar-button img {
            width: 100%;
            height: 100%;
            display: block;
            object-fit: cover;
        }

        .avatar-button {
            width: 32px;
            height: 32px;
            border: 1px solid var(--line);
            cursor: pointer;
            padding: 0;
            background: #f7f8f6;
        }

        .avatar-button:hover {
            border-color: #b9ceca;
            box-shadow: 0 0 0 3px var(--accent-ring);
        }

        .profile-meta {
            min-width: 0;
            display: grid;
            gap: 1px;
        }

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

        .profile-meta strong {
            color: #ffffff;
            font-size: 11px;
            font-weight: 400;
        }

        .profile-meta span {
            color: rgba(255, 255, 255, 0.6);
            font-size: 10px;
            font-weight: 300;
            text-transform: capitalize;
        }

        .account-signout {
            width: 30px;
            height: 30px;
            border-radius: 6px;
            color: rgba(255, 255, 255, 0.7);
        }

        .account-signout:hover {
            color: var(--danger);
            border-color: #f0c7c2;
            background: #fff7f6;
        }

        .main {
            min-width: 0;
            min-height: 0;
            height: 100vh;
            display: grid;
            grid-template-rows: var(--topbar) minmax(0, 1fr);
        }

        .topbar {
            position: relative;
            background: #ffffff;
            border-bottom: 1px solid var(--line);
            display: grid;
            grid-template-columns: minmax(160px, 1fr) minmax(360px, 520px) auto;
            align-items: center;
            gap: 16px;
            padding: 0 28px;
        }

        .page-title {
            min-width: 0;
        }

        .page-title h1 {
            margin: 0;
            font-size: 24px;
            line-height: 1.15;
            letter-spacing: 0;
            font-weight: 400;
        }

        .page-title p {
            display: none;
        }

        .toolbar {
            display: flex;
            align-items: center;
            gap: 10px;
            min-width: 0;
        }

        .topbar-search-group {
            display: flex;
            align-items: center;
            gap: 10px;
            min-width: 0;
        }

        .topbar-search-group .impersonation-banner {
            flex: 0 1 auto;
        }

        .topbar-search-group .universal-search {
            flex: 1 1 320px;
        }

        @media (min-width: 1051px) {
            .topbar:has(.impersonation-banner:not([hidden])) {
                grid-template-columns: minmax(120px, 1fr) minmax(750px, 760px) auto;
                gap: 12px;
            }

            .topbar:has(.impersonation-banner:not([hidden])) .topbar-search-group .impersonation-banner {
                flex: 0 1 auto;
                width: fit-content;
            }

            .topbar:has(.impersonation-banner:not([hidden])) .topbar-search-group .universal-search {
                flex: 0 0 clamp(320px, 28vw, 380px);
                min-width: 320px;
            }
        }

        .universal-search {
            position: relative;
            width: 100%;
            min-width: 0;
        }

        .universal-search[hidden] {
            display: none !important;
        }

        .universal-search-field {
            position: relative;
            display: block;
        }

        .universal-search-field > svg {
            position: absolute;
            left: 13px;
            top: 50%;
            width: 16px;
            height: 16px;
            color: #79857f;
            transform: translateY(-50%);
            pointer-events: none;
        }

        .universal-search-field input {
            width: 100%;
            height: 38px;
            padding: 0 42px 0 38px;
            border: 1px solid var(--line);
            border-radius: 999px;
            background: #f7f9f8;
            color: var(--ink);
            font: inherit;
            font-size: 12px;
            outline: none;
        }

        .universal-search-field input:focus {
            border-color: #9ebbb0;
            background: #fff;
            box-shadow: 0 0 0 3px var(--accent-ring);
        }

        .universal-search-shortcut {
            position: absolute;
            right: 10px;
            top: 50%;
            min-width: 22px;
            padding: 2px 6px;
            border: 1px solid #d9dfdc;
            border-radius: 6px;
            background: #fff;
            color: #7a8580;
            font: inherit;
            font-size: 10px;
            text-align: center;
            transform: translateY(-50%);
        }

        .universal-search-panel {
            position: absolute;
            z-index: 10030;
            left: 0;
            right: 0;
            top: calc(100% + 8px);
            max-height: min(560px, calc(100vh - 104px));
            overflow-y: auto;
            padding: 7px;
            border: 1px solid var(--line);
            border-radius: 12px;
            background: #fff;
            box-shadow: 0 22px 58px rgba(25, 42, 34, .18);
        }

        .universal-search-panel[hidden] {
            display: none !important;
        }

        .universal-search-group + .universal-search-group {
            margin-top: 5px;
            padding-top: 5px;
            border-top: 1px solid var(--line-soft);
        }

        .universal-search-group-title {
            padding: 6px 9px 4px;
            color: #748079;
            font-size: 10px;
            font-weight: 600;
            letter-spacing: .04em;
            text-transform: uppercase;
        }

        .universal-search-result {
            display: grid;
            width: 100%;
            grid-template-columns: 32px minmax(0, 1fr) 16px;
            align-items: center;
            gap: 10px;
            padding: 8px 9px;
            border: 0;
            border-radius: 8px;
            background: transparent;
            color: var(--ink);
            text-align: left;
            cursor: pointer;
        }

        .universal-search-result:hover,
        .universal-search-result.is-active {
            background: #eef4f1;
        }

        .universal-search-result-icon {
            display: grid;
            width: 32px;
            height: 32px;
            place-items: center;
            border-radius: 9px;
            background: #e8f1ed;
            color: var(--accent);
        }

        .universal-search-result-icon svg,
        .universal-search-result-arrow {
            width: 15px;
            height: 15px;
        }

        .universal-search-result-copy {
            min-width: 0;
        }

        .universal-search-result-copy strong,
        .universal-search-result-copy span {
            display: block;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .universal-search-result-copy strong {
            font-size: 12px;
            font-weight: 600;
        }

        .universal-search-result-copy span {
            margin-top: 2px;
            color: var(--muted);
            font-size: 10.5px;
        }

        .universal-search-result-arrow {
            color: #98a29d;
        }

        .universal-search-empty {
            padding: 22px 16px;
            color: var(--muted);
            font-size: 12px;
            text-align: center;
        }

        @media (max-width: 1050px) {
            .topbar {
                grid-template-columns: minmax(130px, .7fr) minmax(320px, 1.3fr) auto;
                padding-inline: 18px;
                gap: 10px;
            }
            .topbar:has(.impersonation-banner:not([hidden])) {
                grid-template-columns: minmax(100px, .4fr) minmax(500px, 1.6fr) auto;
            }
            .topbar-search-group .impersonation-banner {
                max-width: 210px;
            }
            .topbar:has(.impersonation-banner:not([hidden])) .topbar-search-group .universal-search {
                flex: 0 0 280px;
                min-width: 280px;
            }
        }

        @media (max-width: 760px) {
            .topbar {
                grid-template-columns: minmax(0, 1fr) auto;
            }
            .topbar .page-title {
                display: none;
            }
            .topbar-search-group {
                grid-column: 1;
            }
            .topbar-search-group .impersonation-banner {
                max-width: 42%;
            }
            .topbar:has(.impersonation-banner:not([hidden])) .topbar-search-group .universal-search {
                flex: 1 1 240px;
                min-width: 0;
            }
        }

        .notification-wrap {
            position: relative;
        }

        .icon-badge-button {
            position: relative;
            width: 38px;
            height: 38px;
            border: 1px solid var(--line);
            border-radius: 7px;
            background: #ffffff;
            color: var(--ink);
            display: inline-grid;
            place-items: center;
            cursor: pointer;
        }

        .icon-badge-button:hover,
        .icon-badge-button.active {
            border-color: #b9ceca;
            background: #f7f8f6;
        }

        .icon-badge-button svg {
            width: 18px;
            height: 18px;
        }

        .notification-count {
            position: absolute;
            right: -5px;
            top: -6px;
            min-width: 18px;
            height: 18px;
            border-radius: 999px;
            padding: 0 5px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: var(--accent);
            color: #ffffff;
            border: 2px solid #ffffff;
            font-size: 10px;
            font-weight: 500;
            line-height: 1;
        }

        .notification-count[hidden] {
            display: none !important;
        }

        .notification-panel {
            position: absolute;
            top: calc(100% + 8px);
            right: 0;
            width: min(380px, calc(100vw - 32px));
            max-height: min(540px, calc(100vh - 108px));
            z-index: 24;
            border: 1px solid var(--line);
            border-radius: 9px;
            background: #ffffff;
            box-shadow: 0 20px 60px rgba(30,39,36,0.14);
            overflow: hidden;
            display: grid;
            grid-template-rows: auto minmax(0, 1fr);
        }

        .notification-panel[hidden] {
            display: none !important;
        }

        .notification-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            padding: 12px 12px;
            border-bottom: 1px solid var(--line-soft);
        }

        .notification-head strong {
            font-size: 14px;
            font-weight: 500;
        }

        .notification-head-actions {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            gap: 10px;
        }

        .notification-browser-toggle.is-enabled {
            color: var(--accent);
        }

        .notification-list {
            min-height: 120px;
            max-height: 470px;
            overflow: auto;
            padding: 6px;
            display: grid;
            align-content: start;
            gap: 4px;
        }

        .notification-item {
            width: 100%;
            border: 0;
            border-radius: 8px;
            background: transparent;
            display: grid;
            grid-template-columns: 34px minmax(0, 1fr);
            gap: 10px;
            text-align: left;
            padding: 9px;
            cursor: pointer;
            color: var(--ink);
        }

        .notification-item:hover {
            background: #f7f8f6;
        }

        .notification-item.unread {
            background: #eef6f5;
        }

        .notification-copy {
            min-width: 0;
            display: grid;
            gap: 3px;
        }

        .notification-copy strong,
        .notification-copy span {
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .notification-copy strong {
            font-size: 13px;
            font-weight: 500;
            white-space: nowrap;
        }

        .notification-copy span {
            color: var(--muted);
            font-size: 12px;
            line-height: 1.35;
            font-weight: 300;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
        }

        .notification-copy time {
            color: var(--quiet);
            font-size: 11px;
            font-weight: 300;
        }

        .impersonation-banner {
            position: static;
            z-index: 1;
            display: inline-flex;
            align-items: center;
            justify-content: flex-start;
            gap: 8px;
            max-width: 360px;
            min-height: 30px;
            padding: 4px 6px 4px 10px;
            border: 1px solid #f0b8b8;
            border-radius: 999px;
            background: #fff3f2;
            box-shadow: none;
            color: #9f1d1d;
            font-size: 11px;
            font-weight: 300;
            line-height: 1.25;
        }

        .impersonation-banner[hidden] {
            display: none !important;
        }

        .impersonation-banner strong {
            font-weight: 500;
        }

        .impersonation-banner span {
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .impersonation-banner .button {
            height: 22px;
            flex: 0 0 auto;
            padding: 0 8px;
            border-radius: 999px;
            font-size: 11px;
            font-weight: 400;
        }

        .user-chip {
            height: 38px;
            display: inline-flex;
            align-items: center;
            max-width: 240px;
            padding: 0 10px;
            border: 1px solid var(--line);
            border-radius: 7px;
            color: var(--muted);
            background: #ffffff;
            font-size: 12px;
            font-weight: 300;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .search {
            position: relative;
        }

        .search svg {
            position: absolute;
            left: 12px;
            top: 50%;
            transform: translateY(-50%);
            width: 16px;
            height: 16px;
            color: var(--quiet);
            pointer-events: none;
        }

        .search input {
            width: min(320px, 28vw);
            height: 38px;
            border: 1px solid var(--line);
            border-radius: 7px;
            padding: 0 12px 0 36px;
            color: var(--ink);
            background: var(--surface);
            outline: none;
            font-weight: 300;
        }

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

        .button {
            height: 38px;
            border: 1px solid var(--line);
            background: var(--surface);
            color: var(--ink);
            border-radius: 7px;
            padding: 0 13px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            cursor: pointer;
            font-size: 14px;
            font-weight: 500;
            white-space: nowrap;
        }

        .button:hover {
            border-color: #c8d0dc;
            background: #fbfcfd;
        }

        .button.primary {
            border-color: var(--accent);
            background: var(--accent);
            color: #ffffff;
        }

        .button.primary:hover {
            background: var(--accent-hover);
        }

        .button.subtle {
            background: transparent;
        }

        .impersonation-banner #stopImpersonationButton.button,
        .impersonation-banner #stopImpersonationButton.button.subtle {
            border-color: #8f1b13;
            background: #8f1b13;
            color: #ffffff;
        }

        .impersonation-banner #stopImpersonationButton.button:hover,
        .impersonation-banner #stopImpersonationButton.button:focus,
        .impersonation-banner #stopImpersonationButton.button.subtle:hover,
        .impersonation-banner #stopImpersonationButton.button.subtle:focus {
            border-color: #6f150f;
            background: #6f150f;
            color: #ffffff;
        }

        .button svg {
            width: 17px;
            height: 17px;
        }

        .content {
            min-width: 0;
            min-height: 0;
            height: calc(100vh - var(--topbar));
            padding: var(--table-page-padding);
            display: grid;
            grid-template-rows: auto auto minmax(0, 1fr);
            gap: var(--table-page-gap);
        }

        .status-row {
            display: none;
        }

        .record-tabs {
            display: flex;
            align-items: center;
            gap: 6px;
            min-width: 0;
            overflow-x: auto;
            padding: 6px;
            border: 1px solid var(--line-soft);
            border-radius: 9px;
            background: #ffffff;
            scrollbar-width: none;
        }

        .record-tabs::-webkit-scrollbar {
            display: none;
        }

        .record-tab {
            position: relative;
            height: 34px;
            border: 1px solid transparent;
            border-radius: 8px;
            background: transparent;
            color: var(--muted);
            padding: 0 10px;
            cursor: pointer;
            font-size: 12px;
            font-weight: 300;
            letter-spacing: 0;
            white-space: nowrap;
            display: inline-flex;
            align-items: center;
            gap: 7px;
        }

        .record-tab:hover {
            color: var(--ink);
            background: #f7f8f6;
        }

        .record-tab::after {
            display: none;
        }

        .record-tab.active {
            color: var(--ink);
            font-weight: 500;
            border-color: #b9ceca;
            background: var(--accent-soft);
            box-shadow: inset 0 0 0 1px rgba(31,77,77,0.08);
        }

        .tab-count {
            min-width: 22px;
            height: 20px;
            border-radius: 999px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 0 7px;
            background: #eef2ee;
            color: #56615b;
            font-size: 11px;
            font-weight: 500;
            font-variant-numeric: tabular-nums;
        }

        .record-tab.active .tab-count {
            background: #ffffff;
            color: var(--accent);
        }

        .record-tab-create {
            margin-left: auto;
            height: 34px;
            flex: 0 0 auto;
        }

        .record-tabs.metric-tabs {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(154px, 1fr));
            align-items: stretch;
            gap: 10px;
            margin-bottom: 8px;
            padding: 0;
            border: 0;
            border-radius: 0;
            background: transparent;
            overflow: visible;
        }

        .metric-tabs .record-tab {
            min-height: 86px;
            height: auto;
            align-items: stretch;
            align-content: space-between;
            justify-items: start;
            display: grid;
            gap: 10px;
            padding: 14px;
            border-color: #dfe6e1;
            border-radius: 8px;
            background: #ffffff;
            box-shadow: 0 12px 30px rgba(30, 39, 36, 0.06);
            color: var(--ink);
            overflow: hidden;
            text-align: left;
            white-space: normal;
            isolation: isolate;
        }

        .metric-tabs .record-tab:hover {
            border-color: #c2d1cc;
            background: #fbfcfa;
            box-shadow: 0 16px 34px rgba(30, 39, 36, 0.08);
        }

        .metric-tabs .record-tab:disabled {
            cursor: default;
        }

        .metric-tabs .record-tab.active {
            border-color: #9db9b4;
            background: linear-gradient(135deg, #ffffff 0%, #edf6f4 100%);
            box-shadow: inset 0 0 0 1px rgba(31,77,77,0.08), 0 16px 36px rgba(31, 77, 77, 0.12);
        }

        /* Shared summary strip for table-led pages. Keep portal and dashboard cards independent. */
        :is(#tableMetrics, #esignMetrics, #contactMetrics, #applicationMetrics, #tenancyTabs.metric-tabs) {
            grid-template-columns: repeat(auto-fit, minmax(142px, 1fr));
            gap: 0;
            overflow: hidden;
            border: 1px solid #dfe5e1;
            border-radius: 12px;
            background: #ffffff;
            box-shadow: 0 8px 24px rgba(25, 42, 33, .04);
        }

        :is(#tableMetrics, #esignMetrics, #contactMetrics, #applicationMetrics, #tenancyTabs.metric-tabs) .record-tab {
            min-width: 0;
            min-height: 88px;
            padding: 16px 18px;
            border: 0;
            border-right: 1px solid #e3e8e5;
            border-bottom: 1px solid #e3e8e5;
            border-radius: 0;
            background: #ffffff;
            box-shadow: none;
        }

        :is(#tableMetrics, #esignMetrics, #contactMetrics, #applicationMetrics, #tenancyTabs.metric-tabs) .record-tab:hover {
            border-color: #e3e8e5;
            background: #f8fbf9;
            box-shadow: none;
        }

        :is(#tableMetrics, #esignMetrics, #contactMetrics, #applicationMetrics, #tenancyTabs.metric-tabs) .record-tab.active {
            border-color: #e3e8e5;
            background: linear-gradient(135deg, #ffffff 0%, #f2f7f4 100%);
            box-shadow: none;
        }

        :is(#tableMetrics, #esignMetrics, #contactMetrics, #applicationMetrics, #tenancyTabs.metric-tabs) .record-tab:focus-visible {
            z-index: 2;
            outline: 2px solid #4d9173;
            outline-offset: -3px;
        }

        :is(#tableMetrics, #esignMetrics, #contactMetrics, #applicationMetrics, #tenancyTabs.metric-tabs) .tab-metric .tab-count {
            font-size: 24px;
            font-weight: 500;
        }

        :is(#tableMetrics, #esignMetrics, #contactMetrics, #applicationMetrics, #tenancyTabs.metric-tabs) .tab-count-label {
            font-size: 10px;
        }

        #opportunityMetrics.opportunity-dashboard-metrics {
            grid-template-columns: repeat(5, minmax(0, 1fr));
            width: 100%;
            gap: 0;
            overflow: hidden;
            margin-bottom: 8px;
            border: 1px solid #dfe5e1;
            border-radius: 12px;
            background: #fff;
            box-shadow: 0 8px 24px rgba(25, 42, 33, .04);
        }

        #opportunityMetrics .opportunity-dashboard-metric {
            position: relative;
            min-width: 0;
            min-height: 88px;
            display: grid;
            align-content: space-between;
            justify-items: start;
            gap: 5px;
            padding: 16px 18px;
            border: 0;
            border-radius: 0;
            background: #fff;
            box-shadow: none;
            color: #334039;
            font: inherit;
            text-align: left;
            cursor: pointer;
        }

        #opportunityMetrics .opportunity-dashboard-metric + .opportunity-dashboard-metric {
            border-left: 1px solid #e3e8e5;
        }

        #opportunityMetrics .opportunity-dashboard-metric:hover {
            background: #f8fbf9;
        }

        #opportunityMetrics .opportunity-dashboard-metric:focus-visible {
            z-index: 1;
            outline: 2px solid #4d9173;
            outline-offset: -3px;
        }

        #opportunityMetrics .opportunity-dashboard-metric.active {
            background: linear-gradient(135deg, #fff 0%, #f2f7f4 100%);
            box-shadow: none;
        }

        .opportunity-dashboard-label {
            color: inherit;
            font-size: 12px !important;
            font-weight: 600 !important;
            line-height: 1.25;
            letter-spacing: 0;
        }

        .opportunity-dashboard-value {
            display: flex;
            align-items: center;
            gap: 6px;
        }

        .opportunity-dashboard-value strong {
            font-size: 24px;
            font-weight: 500;
            line-height: 1;
            letter-spacing: -.03em;
        }

        .opportunity-dashboard-count-label {
            color: #7a857f;
            font-size: 10px;
            font-weight: 500;
        }

        .opportunity-dashboard-annual {
            display: block;
            color: #68736d;
            font-size: 10px;
            font-weight: 500;
            line-height: 1.2;
            white-space: nowrap;
        }

        .opportunity-dashboard-annual strong {
            color: #334039;
            font: inherit;
            font-weight: 700;
        }

        .opportunity-dashboard-metric.hot .opportunity-dashboard-value { color: #e2443b; }
        .opportunity-dashboard-metric.warm .opportunity-dashboard-value { color: #e59619; }
        .opportunity-dashboard-metric.cold .opportunity-dashboard-value { color: #4776a8; }
        .opportunity-dashboard-metric.secured .opportunity-dashboard-value { color: #258451; }
        .opportunity-dashboard-metric.all .opportunity-dashboard-value { color: #68736d; }

        .opportunity-dashboard-watermark {
            position: absolute;
            right: 7px;
            bottom: -9px;
            width: 58px;
            height: 58px;
            color: currentColor;
            opacity: .08;
            pointer-events: none;
        }

        .opportunity-dashboard-watermark .dashboard-temperature-icon,
        .opportunity-dashboard-watermark svg {
            display: block;
            width: 100%;
            height: 100%;
        }

        .opportunity-dashboard-all-icon {
            width: 38px;
            height: 38px;
            display: block;
        }

        .opportunity-dashboard-all-icon svg {
            width: 100%;
            height: 100%;
            display: block;
            stroke-width: 1.7;
        }

        .tab-label {
            position: relative;
            z-index: 1;
            max-width: 100%;
            color: var(--muted);
            font-size: 12px;
            font-weight: 500;
            line-height: 1.25;
        }

        .metric-tabs .record-tab.active .tab-label {
            color: var(--accent);
        }

        .tab-metric {
            position: relative;
            z-index: 1;
            display: inline-flex;
            align-items: baseline;
            gap: 6px;
            min-width: 0;
        }

        .tab-metric .tab-count {
            min-width: 0;
            height: auto;
            border-radius: 0;
            padding: 0;
            background: transparent;
            color: var(--ink);
            font-size: 26px;
            font-weight: 600;
            line-height: 1;
        }

        .tab-count-label {
            color: var(--quiet);
            font-size: 11px;
            font-weight: 500;
        }

        .tab-watermark {
            position: absolute;
            right: -8px;
            bottom: -10px;
            z-index: 0;
            width: 64px;
            height: 64px;
            color: rgba(31, 77, 77, 0.09);
            pointer-events: none;
        }

        .tab-watermark svg {
            width: 100%;
            height: 100%;
            display: block;
            stroke-width: 1.7;
        }

        .metric-tabs .record-tab-create {
            min-height: 86px;
            height: auto;
            margin-left: 0;
            align-self: stretch;
            justify-content: center;
            border-radius: 8px;
            box-shadow: 0 12px 30px rgba(31, 77, 77, 0.12);
        }

        .content.has-record-tabs {
            grid-template-rows: auto auto auto minmax(0, 1fr);
        }

        .content.has-record-tabs .table-frame {
            grid-row: 4;
        }

        .content.has-record-tabs .column-panel {
            top: 156px;
        }

        .table-toolbar {
            display: grid;
            grid-template-columns: minmax(320px, 1fr) auto;
            align-items: center;
            gap: 12px;
            min-height: 38px;
        }

        .table-actions,
        .bulk-tools {
            display: flex;
            align-items: center;
            gap: 8px;
            flex-wrap: wrap;
        }

        .table-actions {
            justify-content: flex-end;
            flex-wrap: nowrap;
        }

        .segmented {
            display: inline-grid;
            grid-template-columns: repeat(2, 92px);
            border: 1px solid var(--line);
            border-radius: 999px;
            background: #f3f5f1;
            overflow: hidden;
            padding: 3px;
            flex: 0 0 190px;
        }

        .segmented.three-option {
            grid-template-columns: repeat(3, 72px);
            flex: 0 0 222px;
        }

        .segmented.four-option {
            grid-template-columns: repeat(4, 66px);
            flex: 0 0 270px;
        }

        .segment {
            height: 30px;
            border: 0;
            background: transparent;
            color: var(--muted);
            padding: 0 13px;
            cursor: pointer;
            font-size: 13px;
            font-weight: 300;
            border-radius: 999px;
        }

        .segment.active {
            background: #ffffff;
            color: var(--ink);
            font-weight: 400;
            box-shadow: 0 1px 4px rgba(30,39,36,0.08);
        }

        .segment[data-status="open"].active {
            background: #d9f7df;
            color: #146236;
        }

        .segment[data-status="closed"].active {
            background: #ffdede;
            color: #883131;
        }

        .segmented.compliance-status-toggle .segment[data-status="open"] {
            color: #883131;
        }

        .segmented.compliance-status-toggle .segment[data-status="closed"] {
            color: #146236;
        }

        .segmented.compliance-status-toggle .segment[data-status="open"].active {
            background: #ffdede;
            color: #883131;
        }

        .segmented.compliance-status-toggle .segment[data-status="closed"].active {
            background: #d9f7df;
            color: #146236;
        }

        .segment[data-agency-status="open"].active {
            background: #d9f7df;
            color: #146236;
        }

        .segment[data-agency-status="closed"].active {
            background: #ffdede;
            color: #883131;
        }

        .contact-middle-pane {
            min-height: 0;
        }

        #contactRecordContent > .record-grid > .record-panel > .record-panel-head {
            height: 55px;
            min-height: 55px;
            max-height: 55px;
            flex-wrap: nowrap;
        }

        .contact-access-head {
            padding: 0 0 12px;
            border-bottom: 0;
        }

        .segment[data-opportunity-temperature="cold"].active {
            background: #d8ecff;
            color: #19567e;
        }

        .segment[data-opportunity-temperature="warm"].active {
            background: #ffe5c2;
            color: #9a4a00;
        }

        .segment[data-opportunity-temperature="hot"].active {
            background: #ffdede;
            color: #883131;
        }

        .segment[data-opportunity-temperature="secured"].active {
            background: #d9f7df;
            color: #146236;
        }

        .segment[data-opportunity-temperature="all"].active {
            background: #edf0ed;
            color: #4f5b55;
        }

        .table-search {
            width: 100%;
            max-width: 520px;
        }

        .table-search input {
            width: 100%;
            height: 36px;
            font-size: 13px;
        }

        .control-select {
            height: 36px;
            border: 1px solid var(--line);
            border-radius: 7px;
            background: var(--surface);
            color: var(--ink);
            padding: 0 10px;
            font-size: 13px;
            font-weight: 300;
            width: 220px;
            min-width: 220px;
            max-width: 220px;
        }

        #columnButton {
            width: 112px;
            flex: 0 0 112px;
            justify-content: center;
        }

        .column-panel {
            grid-row: 1;
            position: absolute;
            right: 18px;
            top: 118px;
            width: min(430px, calc(100vw - 28px));
            max-height: min(500px, calc(100vh - 136px));
            overflow: auto;
            background: var(--surface);
            border: 1px solid var(--line);
            border-radius: 8px;
            box-shadow: 0 18px 48px rgba(30,39,36,0.13);
            z-index: 12;
            padding: 10px;
        }

        .column-panel[hidden],
        [hidden] {
            display: none !important;
        }

        .column-panel-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
            padding: 1px 1px 8px;
            border-bottom: 1px solid var(--line-soft);
            margin-bottom: 6px;
        }

        .column-panel-head strong {
            font-size: 12px;
            font-weight: 400;
        }

        .column-panel-actions {
            display: flex;
            align-items: center;
            gap: 5px;
            flex-wrap: wrap;
            justify-content: flex-end;
        }

        .mini-button {
            height: 25px;
            border: 1px solid var(--line);
            background: #fff;
            border-radius: 6px;
            padding: 0 7px;
            color: var(--ink);
            cursor: pointer;
            font-size: 10.5px;
            font-weight: 400;
        }

        .mini-button:hover {
            background: #f7f8f6;
            border-color: #cdd5cf;
        }

        .column-list {
            display: grid;
            gap: 2px;
        }

        .column-item {
            display: grid;
            grid-template-columns: 14px var(--checkbox-size) minmax(0, 1fr) 106px auto;
            align-items: center;
            gap: 6px;
            min-height: 28px;
            padding: 4px 5px;
            border-radius: 6px;
        }

        .column-item input[type="checkbox"] {
            justify-self: center;
        }

        .column-item.dragging {
            opacity: 0.45;
        }

        .drag-handle {
            color: var(--quiet);
            cursor: grab;
            font-size: 11px;
            line-height: 1;
            user-select: none;
        }

        .column-item:hover {
            background: #f7f8f6;
        }

        .column-item label {
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
            font-size: 10.8px;
            font-weight: 300;
        }

        .pin-button {
            border: 0;
            background: transparent;
            color: var(--muted);
            cursor: pointer;
            font-size: 10px;
            padding: 3px 4px;
            border-radius: 5px;
        }

        .width-control {
            display: grid;
            grid-template-columns: minmax(0, 1fr) 36px;
            align-items: center;
            gap: 5px;
            color: var(--muted);
            font-size: 10px;
        }

        .width-control input[type="range"] {
            width: 100%;
            min-width: 0;
            height: 18px;
            accent-color: var(--accent);
        }

        .width-control input[type="range"]::-webkit-slider-thumb {
            width: 14px;
            height: 14px;
        }

        .width-control input[type="range"]::-moz-range-thumb {
            width: 14px;
            height: 14px;
        }

        .width-number {
            width: 36px;
            height: 23px;
            border: 1px solid var(--line);
            border-radius: 5px;
            background: #fff;
            color: var(--ink);
            font: inherit;
            font-size: 10.5px;
            font-weight: 400;
            text-align: center;
            padding: 0 3px;
        }

        .width-number:focus {
            outline: none;
            border-color: var(--accent);
            box-shadow: 0 0 0 3px var(--accent-ring);
        }

        .pin-button.active {
            background: var(--accent-soft);
            color: var(--accent);
        }

        .message {
            color: var(--muted);
            font-size: 13px;
            min-height: 0;
            display: none;
            grid-column: 1 / -1;
        }

        .message:not(:empty) {
            display: block;
        }

        .message.error { color: var(--danger); }
        .message.ok { color: var(--ok); }

        .table-frame {
            grid-row: 3;
            min-width: 0;
            min-height: 0;
            height: 100%;
            background: var(--surface);
            border: 1px solid var(--line);
            border-radius: 7px;
            box-shadow: var(--shadow);
            overflow: hidden;
            display: grid;
            grid-template-rows: minmax(0, 1fr);
        }

        .table-scroll {
            overflow: auto;
            min-width: 0;
            min-height: 0;
            height: 100%;
            position: relative;
        }

        .table-scroll.is-empty {
            overflow: hidden;
        }

        .table-scroll.is-loading {
            cursor: progress;
        }

        .opportunity-map-view,
        .table-map-view {
            position: relative;
            min-width: 0;
            min-height: 0;
            height: 100%;
            background: #eef2ef;
        }

        .opportunity-map-view[hidden],
        .table-map-view[hidden] { display: none; }

        .opportunity-map-canvas,
        .table-map-canvas {
            width: 100%;
            height: 100%;
            min-height: 420px;
        }

        .opportunity-map-summary,
        .table-map-summary {
            position: absolute;
            z-index: 500;
            top: 14px;
            left: 50px;
            display: flex;
            align-items: center;
            gap: 8px;
            max-width: calc(100% - 100px);
            padding: 9px 12px;
            border: 1px solid rgba(198, 208, 202, 0.9);
            border-radius: 8px;
            background: rgba(255, 255, 255, 0.94);
            box-shadow: 0 8px 24px rgba(23, 42, 34, 0.12);
            color: var(--ink);
            font-size: 12px;
            line-height: 1.35;
            backdrop-filter: blur(8px);
        }

        .opportunity-map-summary strong,
        .table-map-summary strong { font-size: 13px; }
        .opportunity-map-summary span,
        .table-map-summary span { color: var(--muted); }

        .opportunity-map-popup,
        .table-map-popup {
            min-width: 210px;
            display: grid;
            gap: 6px;
            color: var(--ink);
        }

        .opportunity-map-popup strong,
        .table-map-popup strong { font-size: 14px; }
        .opportunity-map-popup span,
        .table-map-popup span { color: var(--muted); font-size: 12px; }
        .opportunity-map-popup a,
        .table-map-popup a { color: var(--brand-dark); font-size: 12px; font-weight: 700; }

        .opportunity-map-pin,
        .table-map-pin {
            width: 24px;
            height: 24px;
            border: 3px solid #ffffff;
            border-radius: 50% 50% 50% 8px;
            box-shadow: 0 4px 12px rgba(20, 39, 31, 0.28);
            transform: rotate(-45deg);
            background: #52635c;
        }

        .opportunity-map-pin.hot { background: #c54b33; }
        .opportunity-map-pin.warm { background: #c49322; }
        .opportunity-map-pin.cold { background: #506da9; }
        .opportunity-map-pin.secured { background: #3f8157; }
        .table-map-pin { background: var(--brand-dark); }
        .table-map-pin.hot { background: #c54b33; }
        .table-map-pin.warm { background: #c49322; }
        .table-map-pin.cold { background: #506da9; }

        .loading-row td {
            pointer-events: none;
        }

        .table-loading-bar {
            display: block;
            width: 74%;
            height: 8px;
            border-radius: 999px;
            background: linear-gradient(90deg, #eef2ef 0%, #f8faf8 45%, #eef2ef 100%);
            background-size: 220% 100%;
            animation: tableLoadingPulse 1s ease-in-out infinite;
        }

        .loading-row:nth-child(2n) .table-loading-bar {
            width: 58%;
        }

        .loading-row:nth-child(3n) .table-loading-bar {
            width: 86%;
        }

        @keyframes tableLoadingPulse {
            0% { background-position: 100% 0; }
            100% { background-position: -100% 0; }
        }

        table {
            width: max-content;
            min-width: 100%;
            border-collapse: separate;
            border-spacing: 0;
            font-size: 13px;
            font-weight: 300;
        }

        thead th {
            position: sticky;
            top: 0;
            z-index: 3;
            background: #fbfbf8;
            color: #485569;
            text-align: left;
            font-size: 11px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.04em;
            border-bottom: 1px solid var(--line);
            white-space: nowrap;
            padding: 11px 12px;
        }

        .sort-header {
            width: 100%;
            border: 0;
            background: transparent;
            color: inherit;
            display: inline-flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
            padding: 0;
            font: inherit;
            text-transform: inherit;
            letter-spacing: inherit;
            cursor: pointer;
        }

        .sort-indicator {
            color: var(--quiet);
            font-size: 10px;
        }

        th.select-col,
        td.select-col {
            --select-col-bg: var(--surface);
            position: sticky;
            left: 0;
            width: 42px;
            min-width: 42px;
            max-width: 42px;
            text-align: center;
            padding-left: 0;
            padding-right: 0;
            background: var(--select-col-bg);
            overflow: visible;
            text-overflow: clip;
            box-shadow: 1px 0 0 var(--line-soft);
        }

        thead th.select-col {
            --select-col-bg: #fbfbf8;
            z-index: 8;
        }

        tbody td.select-col {
            z-index: 7;
        }

        tbody tr:hover td.select-col {
            --select-col-bg: #fffdf8;
        }

        tbody tr.selected td.select-col {
            --select-col-bg: #fbf7ed;
        }

        th.select-col input,
        td.select-col input {
            display: block;
            position: relative;
            z-index: 3;
            margin: 0 auto;
            background: #ffffff;
        }

        thead th.pinned,
        tbody td.pinned {
            position: sticky;
            z-index: 4;
            box-shadow: 1px 0 0 var(--line-soft);
        }

        thead th.pinned {
            z-index: 6;
        }

        tbody td {
            border-bottom: 1px solid var(--line-soft);
            color: #29332f;
            white-space: nowrap;
            max-width: 320px;
            overflow: hidden;
            text-overflow: ellipsis;
            padding: 10px 12px;
            height: 42px;
            background: var(--surface);
        }

        tbody tr:hover td {
            background: #fffdf8;
        }

        tbody tr.selected td {
            background: #fbf7ed;
        }

        #opportunityTable .opportunity-website-link {
            display: inline-block;
            max-width: 100%;
            overflow: hidden;
            color: #34443d;
            font-weight: 400;
            text-decoration: none;
            text-overflow: ellipsis;
            vertical-align: middle;
            border-radius: 5px;
            padding: 2px 5px;
            margin: -2px -5px;
            transition: color 0.15s ease, background 0.15s ease;
        }

        #opportunityTable .opportunity-website-link:hover {
            color: var(--brand-dark);
            background: #eef5f1;
            text-decoration: none;
        }

        #opportunityTable .opportunity-website-link:focus-visible {
            color: var(--brand-dark);
            background: #eef5f1;
            outline: 2px solid var(--accent-ring);
            outline-offset: 1px;
        }

        tbody tr[data-id] {
            cursor: pointer;
        }

        .table-inline-select-cell {
            position: relative;
            display: block;
            align-items: center;
            width: 100%;
            min-width: 0;
        }

        .table-inline-select {
            display: inline-flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
            width: 100%;
            min-width: 0;
            height: 30px;
            border: 1px solid rgba(73, 92, 82, 0.2);
            border-radius: 7px;
            padding: 0 0 0 10px;
            color: var(--ink);
            background-color: #f8faf9;
            font-size: 12px;
            font-weight: 500;
            outline: none;
            cursor: pointer;
            text-align: left;
            appearance: none;
            overflow: hidden;
            box-shadow: 0 1px 2px rgba(20, 35, 27, 0.05);
            font-weight: 550;
        }

        .table-inline-select-label {
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .table-inline-select-caret {
            display: inline-grid;
            place-items: center;
            align-self: stretch;
            flex: 0 0 29px;
            border-left: 1px solid rgba(73, 92, 82, 0.14);
            background: rgba(255, 255, 255, 0.42);
            color: #53635b;
        }

        .table-inline-select-caret svg {
            width: 11px;
            height: 7px;
        }

        .table-inline-select:hover {
            border-color: rgba(47, 106, 77, 0.48);
            box-shadow: 0 2px 5px rgba(20, 35, 27, 0.09);
        }

        .table-inline-select:focus {
            border-color: #4d8d6d;
            box-shadow: 0 0 0 3px rgba(77, 141, 109, 0.14);
        }

        .table-inline-select[aria-expanded="true"] {
            border-color: #4d8d6d;
            box-shadow: 0 0 0 3px rgba(77, 141, 109, 0.14);
        }

        .table-inline-select.saving {
            opacity: 0.68;
        }

        .table-inline-select.error {
            border-color: rgba(180, 35, 24, 0.42);
            box-shadow: 0 0 0 3px rgba(180, 35, 24, 0.1);
        }

        .table-inline-text-cell {
            position: relative;
            display: block;
            width: 100%;
            min-width: 0;
        }

        .table-inline-text {
            width: 100%;
            min-width: 0;
            height: 30px;
            border: 1px solid rgba(73, 92, 82, 0.2);
            border-radius: 7px;
            padding: 0 10px;
            background: #f8faf9;
            color: var(--ink);
            font-size: 11px !important;
            font-weight: inherit !important;
            outline: none;
            box-shadow: 0 1px 2px rgba(20, 35, 27, 0.05);
        }

        .table-inline-text:hover {
            border-color: rgba(47, 106, 77, 0.48);
            box-shadow: 0 2px 5px rgba(20, 35, 27, 0.09);
        }

        .table-inline-text::placeholder {
            color: #77817c;
            font-weight: inherit;
        }

        .table-inline-text:focus {
            border-color: #4d8d6d;
            box-shadow: 0 0 0 3px rgba(77, 141, 109, 0.14);
        }

        .table-inline-text.saving {
            opacity: 0.68;
        }

        .table-inline-text.error {
            border-color: rgba(180, 35, 24, 0.42);
            box-shadow: 0 0 0 3px rgba(180, 35, 24, 0.1);
        }

        #opportunityTable .opportunity-inline-edit-control {
            height: 30px;
            border: 1px solid rgba(73, 92, 82, 0.2) !important;
            border-radius: 7px;
            padding: 0 0 0 10px;
            overflow: hidden;
            box-shadow: 0 1px 2px rgba(20, 35, 27, 0.05);
            font-weight: 550;
        }

        #opportunityTable .opportunity-inline-edit-control:hover {
            border-color: rgba(47, 106, 77, 0.48) !important;
            box-shadow: 0 2px 5px rgba(20, 35, 27, 0.09);
        }

        #opportunityTable .opportunity-inline-edit-control:focus-visible,
        #opportunityTable .opportunity-inline-edit-control[aria-expanded="true"] {
            border-color: #4d8d6d !important;
            box-shadow: 0 0 0 3px rgba(77, 141, 109, 0.14);
        }

        .opportunity-inline-edit-caret {
            display: inline-grid;
            place-items: center;
            align-self: stretch;
            flex: 0 0 29px;
            border-left: 1px solid rgba(73, 92, 82, 0.14);
            background: rgba(255, 255, 255, 0.42);
            color: #53635b;
        }

        .opportunity-inline-edit-caret svg {
            width: 11px;
            height: 7px;
        }

        .table-fill-handle {
            position: absolute;
            right: -2px;
            bottom: -2px;
            z-index: 2;
            width: 7px;
            height: 7px;
            border: 1px solid #fff;
            border-radius: 2px;
            background: #39775a;
            box-shadow: 0 1px 2px rgba(20, 35, 27, 0.2);
            cursor: ns-resize;
            opacity: 0;
            transition: opacity 0.14s ease, transform 0.14s ease;
        }

        .table-inline-select-cell:hover .table-fill-handle,
        .table-inline-select-cell:focus-within .table-fill-handle,
        .table-inline-select-cell.fill-active .table-fill-handle {
            opacity: 1;
        }

        .table-fill-handle:hover {
            transform: scale(1.22);
        }

        .table-inline-select-cell.fill-active .table-inline-select {
            box-shadow: inset 0 0 0 1px var(--accent), 0 0 0 3px var(--accent-ring);
        }

        .table-inline-select-menu {
            position: fixed;
            z-index: 10020;
            display: grid;
            gap: 4px;
            min-width: 148px;
            max-width: 280px;
            max-height: 260px;
            overflow: auto;
            padding: 7px;
            border: 1px solid var(--line);
            border-radius: 10px;
            background: var(--surface);
            box-shadow: 0 18px 42px rgba(24, 32, 28, 0.18);
        }

        .table-inline-option {
            display: flex;
            width: 100%;
            min-height: 32px;
            align-items: center;
            justify-content: flex-start;
            border: 1px solid transparent;
            border-radius: 7px;
            padding: 7px 10px;
            background: transparent;
            color: var(--ink);
            font: inherit;
            font-size: 12px;
            text-align: left;
            cursor: pointer;
            transition: border-color 0.14s ease, box-shadow 0.14s ease, transform 0.14s ease;
        }

        .table-inline-option:hover,
        .table-inline-option.active {
            border-color: rgba(47, 106, 77, 0.24);
            box-shadow: 0 2px 5px rgba(20, 35, 27, 0.08);
            transform: translateY(-1px);
        }

        .table-inline-option.selected {
            font-weight: 700;
            border-color: rgba(47, 106, 77, 0.28);
            box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.38);
        }

        .group-row td {
            position: static;
            height: 48px;
            padding: 8px !important;
            background: var(--surface);
            color: var(--ink);
            border: 0;
            box-shadow: none;
            cursor: pointer;
        }

        .group-row + tr td {
            border-top-color: transparent;
        }

        .table-group-toggle {
            position: relative;
            z-index: 2;
            display: flex;
            width: calc(100vw - var(--sidebar) - 76px);
            max-width: calc(100vw - var(--sidebar) - 76px);
            transform: translateX(var(--table-group-scroll-left, 0px));
            min-height: 32px;
            align-items: center;
            gap: 8px;
            border: 1px solid #dce4df;
            border-radius: 8px;
            padding: 5px 9px;
            background: #f4f7f5;
            color: #34443d;
            font: inherit;
            text-align: left;
            cursor: pointer;
            box-shadow: 0 1px 2px rgba(20, 35, 27, 0.04);
            transition: border-color 0.14s ease, background 0.14s ease, box-shadow 0.14s ease;
        }

        .table-group-toggle:hover {
            border-color: #c5d3cb;
            background: #eef4f0;
            box-shadow: 0 2px 5px rgba(20, 35, 27, 0.07);
        }

        .table-group-toggle:focus-visible {
            outline: none;
            border-color: #4d8d6d;
            box-shadow: 0 0 0 3px rgba(77, 141, 109, 0.14);
        }

        .table-group-chevron {
            display: inline-grid;
            flex: 0 0 20px;
            width: 20px;
            height: 20px;
            place-items: center;
            border: 1px solid #d4dfd8;
            border-radius: 5px;
            background: #fff;
            color: #4b6256;
        }

        .table-group-chevron svg {
            width: 11px;
            height: 11px;
        }

        .table-group-label {
            min-width: 0;
            overflow: hidden;
            color: #293a32;
            font-size: 11px;
            font-weight: 650;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .table-group-field {
            flex: 0 0 auto;
            color: #66736d;
            font-size: 10px;
            font-weight: 650;
            letter-spacing: .035em;
            text-transform: uppercase;
        }

        .table-group-value {
            display: inline-flex;
            min-width: 0;
            max-width: min(320px, 45vw);
            align-items: center;
            overflow: hidden;
            border: 1px solid rgba(73, 92, 82, .14);
            border-radius: 6px;
            padding: 3px 8px;
            color: #34443d;
            background: #fff;
            font-size: 11px;
            font-weight: 600;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .table-group-count {
            flex: 0 0 auto;
            margin-left: auto;
            border: 1px solid #d8e2dc;
            border-radius: 999px;
            padding: 2px 7px;
            background: #fff;
            color: #607068;
            font-size: 10px;
            font-weight: 550;
            line-height: 1.35;
        }

        .badge {
            display: inline-flex;
            align-items: center;
            max-width: 100%;
            min-height: 24px;
            border-radius: 999px;
            padding: 3px 9px;
            background: #eef3ef;
            color: #34423c;
            font-size: 12px;
            font-weight: 400;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }

        .badge.tone-1 { background: #d9f7df; color: #146236; }
        .badge.tone-2 { background: #ffe8ad; color: #765000; }
        .badge.tone-3 { background: #d8ecff; color: #19567e; }
        .badge.tone-4 { background: #ffdede; color: #883131; }
        .badge.tone-5 { background: #eadfff; color: #593a8f; }
        .badge.badge-yes { background: #d9f7df; color: #146236; }
        .badge.badge-no { background: #ffdede; color: #883131; }
        .badge.badge-na { background: #edf0ed; color: #68736d; }
        .badge.badge-compliant { background: #d9f7df; color: #146236; }
        .badge.badge-attention { background: #ffdede; color: #883131; }
        .badge.badge-temp-cold { background: #d8ecff; color: #19567e; }
        .badge.badge-temp-warm { background: #ffe5c2; color: #9a4a00; }
        .badge.badge-temp-hot { background: #ffdede; color: #883131; }
        .badge.badge-temp-secured { background: #d9f7df; color: #146236; }

        .opportunity-table-inline-select {
            width: 100%;
            height: 34px;
            min-width: 0;
            border: 1px solid var(--line);
            border-radius: 8px;
            background: #fff;
            color: var(--ink);
            font: inherit;
            font-size: 12px;
            padding: 0 28px 0 9px;
            outline: none;
        }

        .opportunity-table-inline-select:focus {
            border-color: #78a78f;
            box-shadow: 0 0 0 3px rgba(55, 126, 91, .12);
        }

        .opportunity-state-tag {
            display: inline-flex;
            min-width: 36px;
            min-height: 24px;
            align-items: center;
            justify-content: center;
            border: 1px solid transparent;
            border-radius: 6px;
            padding: 3px 8px;
            font-size: 12px;
            font-weight: 400;
            line-height: 1;
        }
        .badge.badge-contact-primary { background: #d9f7df; color: #146236; }
        .badge.badge-contact-decision-maker { background: #ffe8ad; color: #765000; }
        .badge.badge-contact-associated { background: #edf0ed; color: #68736d; }
        .badge.badge-agreement-red { background: #ffd6d6; color: #8d2020; }
        .badge.badge-agreement-yellow { background: #fff0b8; color: #745600; }
        .badge.badge-agreement-blue { background: #d9ecff; color: #19567e; }
        .badge.badge-periodic { background: #ffd8ef; color: #8c2d68; }
        .badge.badge-status-approved { background: #d9ecff; color: #19567e; }
        .badge.badge-status-current { background: #d9f7df; color: #146236; }
        .badge.badge-status-vacating { background: #fff0b8; color: #745600; }
        .badge.badge-status-vacated { background: #ffdede; color: #883131; }
        .badge.badge-status-archived { background: #edf0ed; color: #68736d; }
        .badge.badge-property-incoming { background: #d9ecff; color: #19567e; }
        .badge.badge-property-current { background: #d9f7df; color: #146236; }
        .badge.badge-property-outgoing { background: #ffdede; color: #883131; }
        .badge.badge-property-archived { background: #edf0ed; color: #68736d; }
        .badge.badge-property-tenanted { background: #d9f7df; color: #146236; }
        .badge.badge-property-vacant { background: #d8ecff; color: #19567e; }
        .badge.badge-property-owner-occupied { background: #ffe8ad; color: #765000; }
        .badge.badge-enabled { background: #d9f7df; color: #146236; }
        .badge.badge-disabled { background: #ffdede; color: #883131; }
        .badge.badge-bond-full-refund { background: #d9f7df; color: #146236; }
        .badge.badge-bond-tenant-claimed { background: #d9ecff; color: #19567e; }
        .badge.badge-bond-part-claim { background: #fff0b8; color: #745600; }
        .badge.badge-bond-full-claim { background: #ffdede; color: #883131; }

        .star-rating {
            display: inline-flex;
            align-items: center;
            gap: 1px;
            color: #d4d9d6;
            font-size: 20px;
            line-height: 1;
            white-space: nowrap;
        }

        .star-rating .filled {
            color: #f6b51d;
        }

        .star-rating-input {
            display: inline-flex;
            align-items: center;
            gap: 2px;
            min-height: 44px;
        }

        .star-rating-button {
            appearance: none;
            border: 0;
            background: transparent;
            color: #d4d9d6;
            cursor: pointer;
            width: 38px;
            height: 42px;
            font-size: 34px;
            line-height: 1;
            padding: 2px;
        }

        .star-rating-button.filled,
        .star-rating-button:hover {
            color: #f6b51d;
        }

        .cell-link {
            color: var(--accent);
            font-weight: 500;
            text-decoration: none;
        }

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

        .uuid {
            font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
            font-size: 12px;
            color: #516070;
        }

        .empty-state {
            position: absolute;
            left: 0;
            right: 0;
            top: 42px;
            bottom: 0;
            min-height: calc(100% - 42px);
            display: grid;
            place-items: center;
            padding: 48px;
            text-align: center;
            color: var(--muted);
            background: var(--surface);
            z-index: 1;
        }

        .empty-state > div {
            display: grid;
            justify-items: center;
            gap: 8px;
            max-width: 360px;
        }

        .empty-state strong {
            display: block;
            color: var(--ink);
            font-size: 18px;
            font-weight: 500;
        }

        .empty-state span {
            font-size: 13px;
            font-weight: 300;
            line-height: 1.5;
        }

        .empty-state .button {
            margin-top: 8px;
        }

        .bulk-bar {
            display: none;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
            border: 1px solid var(--line);
            background: #ffffff;
            border-radius: 7px;
            padding: 10px 12px;
        }

        .bulk-bar.active {
            display: flex;
        }

        .bulk-summary {
            color: var(--ink);
            font-size: 13px;
            font-weight: 400;
        }

        .drawer-backdrop {
            position: fixed;
            inset: 0;
            background: rgba(30,39,36,0.26);
            opacity: 0;
            pointer-events: none;
            transition: opacity 160ms ease;
            z-index: 30;
        }

        .drawer-backdrop.open {
            opacity: 1;
            pointer-events: auto;
        }

        .drawer {
            position: fixed;
            top: 0;
            right: 0;
            width: min(720px, 100vw);
            height: 100vh;
            background: var(--surface);
            box-shadow: -24px 0 55px rgba(30,39,36,0.13);
            z-index: 31;
            transform: translateX(102%);
            transition: transform 180ms ease;
            display: grid;
            grid-template-rows: auto minmax(0, 1fr) auto;
        }

        .drawer.open {
            transform: translateX(0);
        }

        .drawer-head {
            padding: 20px 24px;
            border-bottom: 1px solid var(--line);
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 18px;
        }

        .drawer-head h2 {
            margin: 0;
            font-size: 18px;
            font-weight: 500;
            letter-spacing: 0;
        }

        .drawer-head p {
            margin: 5px 0 0;
            color: var(--muted);
            font-size: 13px;
            line-height: 1.45;
            font-weight: 300;
        }

        .icon-button {
            width: 36px;
            height: 36px;
            border-radius: 7px;
            border: 1px solid var(--line);
            background: var(--surface);
            display: grid;
            place-items: center;
            cursor: pointer;
            color: var(--muted);
        }

        .icon-button svg {
            width: 18px;
            height: 18px;
        }

        .view-as-icon-button {
            width: 36px;
            height: 36px;
            flex: 0 0 36px;
            border-radius: 50%;
            color: var(--accent);
            background: var(--surface);
        }

        .view-as-icon-button:hover,
        .view-as-icon-button:focus-visible {
            border-color: var(--accent);
            background: var(--accent-soft);
            color: var(--accent-hover);
            outline: none;
        }

        .drawer-body {
            min-height: 0;
            overflow: hidden;
            padding: 18px 24px;
            display: grid;
            grid-template-rows: auto minmax(0, 1fr);
            gap: 14px;
        }

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

        .field {
            display: grid;
            gap: 6px;
        }

        .field label {
            font-size: 11px;
            font-weight: 500;
            color: #465366;
            text-transform: uppercase;
            letter-spacing: 0.04em;
        }

        .field input,
        .field select {
            height: 36px;
            border: 1px solid var(--line);
            border-radius: 7px;
            padding: 0 10px;
            background: var(--surface);
            color: var(--ink);
            outline: none;
            min-width: 0;
            font: inherit;
            font-size: 13px;
            font-weight: 300;
        }

        .field input[type="file"] {
            padding: 4px;
            color: var(--muted);
            cursor: pointer;
            line-height: 1;
        }

        .field input[type="file"]::file-selector-button {
            height: 26px;
            margin: 0 10px 0 0;
            border: 1px solid var(--line);
            border-radius: 6px;
            padding: 0 10px;
            background: #f7f8f6;
            color: #313b35;
            font: inherit;
            font-size: 12px;
            font-weight: 400;
            cursor: pointer;
        }

        .field input[type="file"]::file-selector-button:hover {
            background: #ffffff;
            border-color: #d9ddd8;
        }

        .field input:focus,
        .field select:focus {
            border-color: var(--accent);
            box-shadow: 0 0 0 3px var(--accent-ring);
        }

        .mapping-panel {
            border: 1px solid var(--line);
            border-radius: 7px;
            overflow: hidden;
            min-height: 0;
            display: grid;
            grid-template-rows: auto minmax(0, 1fr);
        }

        .mapping-head {
            background: var(--surface-2);
            border-bottom: 1px solid var(--line);
            padding: 10px 12px;
            display: flex;
            justify-content: space-between;
            gap: 12px;
            align-items: center;
        }

        .mapping-head strong {
            font-size: 13px;
            font-weight: 500;
        }

        .mapping-head span {
            color: var(--muted);
            font-size: 12px;
            font-weight: 300;
        }

        .mapping-list {
            min-height: 0;
            overflow: auto;
            display: grid;
            align-content: start;
        }

        .mapping-row {
            display: grid;
            grid-template-columns: minmax(0, 1fr) 28px minmax(0, 1fr);
            gap: 10px;
            align-items: center;
            min-height: 42px;
            padding: 7px 12px;
            border-bottom: 1px solid var(--line-soft);
        }

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

        .mapping-row span {
            font-size: 12px;
            color: var(--muted);
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }

        .mapping-row select {
            height: 32px;
            min-width: 0;
            border: 1px solid var(--line);
            border-radius: 7px;
            padding: 0 8px;
            background: #fff;
            color: var(--ink);
            font: inherit;
            font-size: 13px;
            font-weight: 300;
        }

        .drawer-foot {
            border-top: 1px solid var(--line);
            padding: 14px 24px;
            display: flex;
            justify-content: space-between;
            gap: 12px;
            align-items: center;
        }

        .progress {
            color: var(--muted);
            font-size: 13px;
        }

        .import-progress-wrap {
            display: grid;
            gap: 6px;
            min-width: 0;
            flex: 1 1 auto;
        }

        .import-progress-track {
            position: relative;
            width: min(280px, 100%);
            height: 4px;
            overflow: hidden;
            border-radius: 999px;
            background: #e7ece9;
        }

        .import-progress-track span {
            position: absolute;
            inset: 0 auto 0 0;
            width: 42%;
            border-radius: inherit;
            background: var(--accent);
            animation: import-progress-slide 1.1s ease-in-out infinite;
        }

        @keyframes import-progress-slide {
            0% { transform: translateX(-110%); }
            100% { transform: translateX(340%); }
        }

        #runImport.is-loading {
            cursor: wait;
        }

        #runImport.is-loading::before {
            content: "";
            width: 13px;
            height: 13px;
            border: 2px solid rgba(255, 255, 255, 0.45);
            border-top-color: currentColor;
            border-radius: 50%;
            animation: import-button-spin 0.75s linear infinite;
        }

        @keyframes import-button-spin {
            to { transform: rotate(360deg); }
        }

        .record-content {
            grid-row: 2;
            min-width: 0;
            min-height: 0;
            height: calc(100vh - var(--topbar));
            padding: var(--table-page-padding);
            display: grid;
            grid-template-rows: auto minmax(0, 1fr);
            gap: var(--record-page-gap);
        }

        #contactPortalContent {
            overflow-y: auto;
            overflow-x: hidden;
            display: block;
        }

        .record-content[hidden] {
            display: none !important;
        }

        .record-page-head {
            display: grid;
            grid-template-columns: auto minmax(0, 1fr) auto;
            align-items: center;
            gap: 12px;
            min-width: 0;
        }

        .record-nav-actions {
            display: inline-flex;
            align-items: center;
            justify-content: flex-end;
            gap: 6px;
            min-width: 0;
        }

        .record-page-head > .button,
        .record-nav-actions .button {
            height: 32px;
            padding: 0 9px;
            gap: 5px;
            border-radius: 6px;
            font-size: 12px;
            line-height: 1;
            justify-self: start;
        }

        .record-nav-actions .button {
            justify-self: auto;
        }

        .record-page-head > .button svg,
        .record-nav-actions .button svg {
            width: 14px;
            height: 14px;
        }

        .record-nav-actions .button[disabled] {
            opacity: 0.45;
            cursor: not-allowed;
        }

        .opportunity-record-actions {
            display: inline-flex;
            align-items: center;
            justify-content: flex-end;
            gap: 8px;
            min-width: 0;
        }

        .opportunity-record-nav {
            display: inline-flex;
            align-items: center;
            gap: 6px;
        }

        .opportunity-record-nav .button {
            height: 32px;
            padding: 0 9px;
            gap: 5px;
            border-radius: 6px;
            font-size: 12px;
            line-height: 1;
        }

        .opportunity-record-nav .button svg {
            width: 14px;
            height: 14px;
        }

        .opportunity-record-nav .button[disabled] {
            opacity: 0.45;
            cursor: not-allowed;
        }

        .opportunity-record-duplicate-flag {
            display: inline-flex;
            align-items: center;
            min-height: 28px;
            padding: 4px 9px;
            border: 1px solid #e7c766;
            border-radius: 999px;
            background: #fff8dc;
            color: #725511;
            font-size: 11px;
            font-weight: 700;
            white-space: nowrap;
        }

        .opportunity-record-duplicate-flag[hidden] { display: none; }

        .record-identity {
            min-width: 0;
        }

        .record-kicker {
            display: block;
            color: var(--muted);
            font-size: 12px;
            font-weight: 300;
            margin-bottom: 2px;
        }

        .record-identity h2 {
            margin: 0;
            font-size: 22px;
            line-height: 1.2;
            font-weight: 400;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .record-uuid {
            color: var(--quiet);
            font-size: 12px;
            font-weight: 300;
            font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
        }

        .record-grid {
            min-height: 0;
            height: 100%;
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            grid-auto-rows: minmax(0, 1fr);
            gap: 14px;
        }

        .record-grid.tenancy-hub-grid {
            grid-template-columns: repeat(3, minmax(0, 1fr));
        }

        .record-panel {
            min-width: 0;
            min-height: 0;
            height: 100%;
            background: var(--surface);
            border: 1px solid var(--line);
            border-radius: 7px;
            box-shadow: var(--shadow);
            display: grid;
            grid-template-rows: auto minmax(0, 1fr);
            overflow: hidden;
        }

        .record-panel.gallery-active {
            grid-template-rows: auto auto minmax(0, 1fr);
        }

        .property-photo-gallery[hidden] {
            display: none !important;
        }

        .property-photo-gallery {
            padding: 14px 14px 12px;
            border-bottom: 1px solid var(--line-soft);
            display: grid;
            gap: 8px;
            background: #ffffff;
        }

        .property-photo-gallery.is-empty {
            padding: 10px 12px;
            gap: 0;
        }

        .property-photo-gallery.is-empty .property-photo-stage {
            height: 112px;
            min-height: 112px;
            aspect-ratio: auto;
            border-style: dashed;
            background: #fafbf9;
        }

        .property-photo-gallery.is-empty .property-photo-thumbs {
            display: none;
        }

        .property-photo-gallery.is-empty .property-photo-empty {
            padding: 18px;
            font-size: 12px;
            text-align: center;
        }

        .property-photo-stage-shell {
            position: relative;
            min-width: 0;
        }

        .property-photo-stage {
            position: relative;
            width: 100%;
            aspect-ratio: 16 / 10;
            border: 1px solid var(--line);
            border-radius: 8px;
            overflow: hidden;
            background: #f7f8f6;
            transition: border-color 0.16s ease, box-shadow 0.16s ease, background 0.16s ease;
        }

        .property-photo-stage.dragging {
            border-color: var(--accent);
            background: var(--accent-soft);
            box-shadow: 0 0 0 3px rgba(31,77,77,0.1);
        }

        .property-photo-stage button,
        .property-photo-empty {
            width: 100%;
            height: 100%;
            border: 0;
            padding: 0;
            background: transparent;
            display: block;
        }

        .property-photo-stage img,
        .property-photo-stage video {
            width: 100%;
            height: 100%;
            display: block;
            object-fit: cover;
        }

        .property-photo-file-preview {
            width: 100%;
            height: 100%;
            display: grid;
            place-items: center;
            align-content: center;
            gap: 8px;
            padding: 12px;
            color: var(--muted);
            background: #f7f8f6;
            text-align: center;
        }

        .property-photo-file-preview strong {
            display: grid;
            place-items: center;
            min-width: 48px;
            min-height: 34px;
            padding: 6px 10px;
            border-radius: 7px;
            background: var(--accent-soft);
            color: var(--accent);
            font-size: 12px;
            font-weight: 500;
        }

        .property-photo-file-preview span {
            max-width: 100%;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            font-size: 12px;
            font-weight: 300;
        }

        .property-photo-empty {
            display: grid;
            place-items: center;
            color: var(--muted);
            font-size: 13px;
            font-weight: 300;
        }

        .property-photo-drop-hint {
            position: absolute;
            inset: 10px;
            display: grid;
            place-items: center;
            border: 1px dashed rgba(31,77,77,0.45);
            border-radius: 8px;
            background: rgba(255,255,255,0.82);
            color: var(--accent);
            font-size: 13px;
            font-weight: 500;
            pointer-events: none;
            opacity: 0;
            transition: opacity 0.16s ease;
        }

        .property-photo-stage.dragging .property-photo-drop-hint {
            opacity: 1;
        }

        .record-upload-dropzone,
        .property-photo-upload {
            border: 1px dashed #b9c6c0;
            border-radius: 8px;
            background: #fbfcfa;
            min-height: 86px;
            padding: 12px;
            display: grid;
            place-items: center;
            gap: 6px;
            text-align: center;
            color: var(--muted);
            cursor: pointer;
            transition: border-color 0.16s ease, background 0.16s ease, color 0.16s ease;
        }

        .property-photo-upload {
            min-height: 0;
            width: auto;
            position: absolute;
            right: 10px;
            top: 10px;
            z-index: 3;
            grid-auto-flow: column;
            padding: 6px 9px;
            border-style: solid;
            border-color: rgba(31,77,77,0.18);
            background: rgba(255,255,255,0.94);
            box-shadow: 0 8px 18px rgba(31,77,77,0.12);
            gap: 6px;
            backdrop-filter: blur(8px);
        }

        .property-photo-delete {
            width: 30px;
            height: 30px;
            position: absolute;
            left: 10px;
            top: 10px;
            z-index: 3;
            display: grid;
            place-items: center;
            padding: 0;
            border: 1px solid rgba(153, 27, 27, 0.18);
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.94);
            color: #991b1b;
            box-shadow: 0 8px 18px rgba(31, 77, 77, 0.12);
            cursor: pointer;
            backdrop-filter: blur(8px);
        }

        .property-photo-delete:hover {
            border-color: rgba(153, 27, 27, 0.34);
            background: #fff5f5;
        }

        .property-photo-delete svg {
            width: 15px;
            height: 15px;
        }

        .property-photo-upload strong {
            font-size: 12px;
            font-weight: 500;
        }

        .property-photo-upload span {
            display: none;
        }

        .record-upload-dropzone.dragging,
        .property-photo-upload.dragging {
            border-color: var(--accent);
            background: var(--accent-soft);
            color: var(--accent);
        }

        .record-upload-dropzone strong,
        .property-photo-upload strong {
            color: var(--ink);
            font-size: 13px;
            font-weight: 400;
        }

        .record-upload-dropzone span,
        .property-photo-upload span {
            font-size: 12px;
            font-weight: 300;
        }

        .record-upload-dropzone input,
        .property-photo-upload input {
            display: none;
        }

        .marketing-grid {
            display: grid;
            grid-template-columns: minmax(280px, 0.9fr) minmax(360px, 1.1fr);
            gap: 16px;
            align-items: start;
        }

        .admin-content.marketing-workspace {
            grid-template-rows: repeat(5, auto);
            align-content: start;
            overflow-y: auto;
        }

        .marketing-command-head {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 18px;
            margin-bottom: 2px;
        }

        .marketing-command-title {
            display: grid;
            gap: 4px;
        }

        .marketing-command-title h2 {
            margin: 0;
            color: var(--ink);
            font-size: 21px;
            font-weight: 650;
            letter-spacing: -0.02em;
        }

        .marketing-command-title p {
            margin: 0;
            color: var(--muted);
            font-size: 12px;
        }

        .marketing-command-actions {
            display: flex;
            align-items: center;
            gap: 8px;
        }

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

        .marketing-summary-card {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            align-items: center;
            gap: 12px;
            min-height: 76px;
            padding: 13px 15px;
            border: 1px solid var(--line);
            border-radius: 8px;
            background: #fff;
            box-shadow: var(--shadow);
        }

        .marketing-summary-copy {
            display: grid;
            gap: 4px;
        }

        .marketing-summary-copy span {
            color: var(--muted);
            font-size: 11px;
        }

        .marketing-summary-copy strong {
            color: var(--ink);
            font-size: 22px;
            font-weight: 650;
            line-height: 1;
        }

        .marketing-summary-icon {
            display: grid;
            place-items: center;
            width: 34px;
            height: 34px;
            border-radius: 9px;
            background: var(--accent-soft);
            color: var(--accent);
        }

        .marketing-summary-icon.is-warning {
            background: #fff1ef;
            color: #b64c45;
        }

        .marketing-product-tabs {
            display: flex;
            align-items: center;
            gap: 22px;
            border-bottom: 1px solid var(--line);
        }

        .marketing-product-tab {
            position: relative;
            border: 0;
            background: transparent;
            color: var(--muted);
            cursor: pointer;
            padding: 11px 2px 10px;
            font: inherit;
            font-size: 12px;
            font-weight: 550;
        }

        .marketing-product-tab.active {
            color: var(--accent);
        }

        .marketing-product-tab.active::after {
            content: "";
            position: absolute;
            left: 0;
            right: 0;
            bottom: -1px;
            height: 2px;
            border-radius: 2px 2px 0 0;
            background: var(--accent);
        }

        .marketing-toolbar-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
            flex-wrap: wrap;
        }

        .marketing-toolbar-row .table-search {
            flex: 1 1 280px;
            max-width: 520px;
        }

        .marketing-composer-overlay {
            position: fixed;
            inset: 0;
            z-index: 1200;
            display: grid;
            place-items: center;
            padding: 28px;
            background: rgba(24, 34, 29, 0.38);
            backdrop-filter: blur(2px);
        }

        .marketing-composer-overlay[hidden] {
            display: none !important;
        }

        .marketing-composer-modal {
            width: min(1120px, calc(100vw - 40px));
            max-height: calc(100vh - 48px);
            overflow: auto;
            border: 1px solid var(--line);
            border-radius: 11px;
            background: #fff;
            box-shadow: 0 24px 70px rgba(25, 42, 34, 0.22);
        }

        .marketing-composer-modal-head {
            position: sticky;
            top: 0;
            z-index: 3;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
            padding: 14px 16px;
            border-bottom: 1px solid var(--line);
            background: rgba(255,255,255,0.97);
        }

        .marketing-composer-modal-head h3 {
            margin: 0;
            font-size: 16px;
            font-weight: 650;
        }

        .marketing-composer-modal-grid {
            display: grid;
            grid-template-columns: minmax(380px, 0.95fr) minmax(390px, 1.05fr);
            gap: 0;
        }

        .marketing-composer-modal-grid > .record-panel {
            border: 0;
            border-radius: 0;
            box-shadow: none;
            height: auto;
        }

        .marketing-composer-modal-grid > .record-panel + .record-panel {
            border-left: 1px solid var(--line);
        }

        .marketing-grid.is-accounts {
            grid-template-columns: 1fr;
        }

        .marketing-grid.is-accounts #marketingAccountsPanel {
            grid-row: 1;
        }

        .marketing-grid.is-accounts #marketingProvidersPanel {
            grid-row: 2;
        }

        .marketing-grid.is-accounts .marketing-provider-list {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        .marketing-grid.is-posts {
            grid-template-columns: minmax(360px, 0.95fr) minmax(420px, 1.05fr);
        }

        .marketing-grid.is-posts .record-panel {
            height: auto;
        }

        .marketing-grid.is-posts #marketingPostComposerPanel {
            grid-template-rows: auto auto;
        }

        .marketing-grid.is-posts #marketingPostComposerPanel .record-panel-body {
            max-height: none;
            overflow: visible;
        }

        .marketing-grid.is-posts .marketing-post-preview-panel {
            height: 650px;
        }

        .marketing-grid.is-posts .marketing-post-preview-panel .marketing-preview-media:not(.has-media) {
            min-height: 320px;
        }

        .marketing-grid .record-panel {
            min-width: 0;
        }

        .marketing-view-tabs {
            grid-template-columns: repeat(2, minmax(112px, 1fr));
            width: 270px;
            flex: 0 0 270px;
        }

        .marketing-posts-panel {
            grid-column: 1 / -1;
        }

        .marketing-grid.is-posts {
            grid-template-columns: minmax(360px, 0.92fr) minmax(360px, 1.08fr);
            grid-template-rows: minmax(650px, auto) auto;
        }

        .marketing-post-form {
            display: grid;
            gap: 16px;
        }

        .marketing-composer-label,
        .marketing-form-section-label {
            color: var(--ink);
            font-size: 12px;
            font-weight: 650;
        }

        .marketing-post-text-wrap {
            position: relative;
        }

        .marketing-post-text-wrap textarea {
            min-height: 150px;
            padding-bottom: 34px;
            resize: vertical;
        }

        .marketing-character-count {
            position: absolute;
            right: 12px;
            bottom: 10px;
            color: var(--muted);
            font-size: 11px;
            pointer-events: none;
        }

        .marketing-publish-section,
        .marketing-schedule-section {
            display: grid;
            gap: 8px;
        }

        .marketing-targets {
            gap: 8px;
        }

        .marketing-target-row {
            border: 1px solid var(--line);
            border-radius: 8px;
            background: #fff;
            padding: 9px 10px;
        }

        .marketing-target-platform-icon {
            width: 30px;
            height: 30px;
            border-radius: 8px;
            overflow: hidden;
        }

        .marketing-target-platform-icon svg {
            display: block;
            width: 100%;
            height: 100%;
        }

        .marketing-target-main .marketing-provider-icon {
            width: 30px;
            height: 30px;
            border-radius: 8px;
            box-shadow: none;
        }

        .marketing-target-main {
            grid-template-columns: 30px minmax(0, 1fr);
            align-items: center;
            column-gap: 9px;
        }

        .marketing-target-copy {
            display: grid;
            gap: 2px;
            min-width: 0;
        }

        .marketing-post-preview-panel .record-panel-body {
            min-height: 100%;
            background: #f7f9f7;
        }

        .marketing-preview-card {
            max-width: 510px;
            margin: 0 auto;
            border: 1px solid #dfe5e1;
            border-radius: 10px;
            background: #fff;
            overflow: hidden;
            box-shadow: 0 4px 14px rgba(29, 47, 40, 0.05);
        }

        .marketing-preview-head {
            display: grid;
            grid-template-columns: 38px minmax(0, 1fr) auto;
            gap: 10px;
            align-items: center;
            padding: 14px;
        }

        .marketing-preview-account-icon {
            width: 38px;
            height: 38px;
            border-radius: 9px;
            overflow: hidden;
        }

        .marketing-preview-account-icon svg { width: 100%; height: 100%; display: block; }
        .marketing-preview-account-icon .marketing-provider-icon {
            width: 38px;
            height: 38px;
            border-radius: 9px;
            box-shadow: none;
        }

        .marketing-preview-account {
            display: grid;
            gap: 2px;
            min-width: 0;
        }

        .marketing-preview-account strong { font-size: 13px; }
        .marketing-preview-account span,
        .marketing-preview-note { color: var(--muted); font-size: 11px; }

        .marketing-preview-copy {
            margin: 0;
            padding: 0 14px 14px;
            color: var(--ink);
            font-size: 13px;
            line-height: 1.55;
            white-space: pre-wrap;
            overflow-wrap: anywhere;
        }

        .marketing-preview-copy.is-placeholder { color: var(--muted); }

        .marketing-preview-media {
            display: grid;
            place-items: center;
            min-height: 190px;
            border-top: 1px solid var(--line);
            border-bottom: 1px solid var(--line);
            background: #eef2ef;
            color: var(--muted);
            font-size: 12px;
            text-align: center;
            padding: 20px;
        }

        .marketing-preview-media.has-media {
            position: relative;
            display: block;
            min-height: 0;
            padding: 0;
            background: #111;
            color: #fff;
            overflow: hidden;
        }

        .marketing-preview-media img,
        .marketing-preview-media video {
            display: block;
            width: 100%;
            max-height: 430px;
            object-fit: contain;
            background: #111;
        }

        .marketing-preview-media.is-instagram img,
        .marketing-preview-media.is-instagram video {
            aspect-ratio: 1 / 1;
            object-fit: cover;
        }

        .marketing-preview-media-count {
            position: absolute;
            top: 12px;
            right: 12px;
            z-index: 2;
            padding: 5px 8px;
            border-radius: 999px;
            background: rgba(19, 25, 22, 0.78);
            color: #fff;
            font-size: 11px;
            font-weight: 650;
            line-height: 1;
            box-shadow: 0 2px 8px rgba(0,0,0,0.18);
        }

        .marketing-preview-actions {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            padding: 10px 14px;
            color: var(--muted);
            font-size: 11px;
            text-align: center;
        }

        .marketing-preview-note {
            display: block;
            max-width: 510px;
            margin: 10px auto 0;
            line-height: 1.45;
        }

        .marketing-planner-head {
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 14px;
            flex-wrap: wrap;
        }

        .marketing-planner-controls,
        .marketing-planner-navigation {
            display: flex;
            align-items: center;
            gap: 8px;
            flex-wrap: wrap;
        }

        .marketing-planner-mode {
            display: grid;
            grid-template-columns: repeat(2, minmax(72px, 1fr));
            width: 164px;
        }

        .marketing-planner-period {
            min-width: 150px;
            color: var(--ink);
            font-size: 12px;
            font-weight: 650;
            text-align: center;
        }

        .marketing-calendar {
            display: grid;
            grid-template-columns: repeat(7, minmax(128px, 1fr));
            border: 1px solid var(--line);
            border-radius: 9px;
            overflow-x: auto;
            background: #fff;
        }

        .marketing-calendar-day {
            min-width: 128px;
            min-height: 235px;
            padding: 10px;
            border-right: 1px solid var(--line);
            background: #fff;
        }

        .marketing-calendar-day:last-child { border-right: 0; }
        .marketing-calendar-day.is-today { background: #f7fbf8; }

        .marketing-calendar-day-head {
            display: grid;
            gap: 2px;
            margin-bottom: 9px;
            color: var(--muted);
            font-size: 10px;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .marketing-calendar-day-head strong {
            color: var(--ink);
            font-size: 13px;
            font-weight: 650;
            text-transform: none;
            letter-spacing: 0;
        }

        .marketing-calendar-day.is-today .marketing-calendar-day-head strong { color: var(--accent); }

        .marketing-calendar-events { display: grid; gap: 7px; }

        .marketing-calendar-event {
            display: grid;
            gap: 6px;
            padding: 9px;
            border: 1px solid #dfe5e1;
            border-radius: 7px;
            background: #fff;
            text-align: left;
        }

        .marketing-calendar-event.is-cancelled,
        .marketing-calendar-event.is-failed { border-color: rgba(184, 84, 84, .35); opacity: .72; }
        .marketing-calendar-event.is-published { border-color: rgba(59, 138, 90, .28); }

        .marketing-calendar-event-top {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 6px;
            color: var(--muted);
            font-size: 10px;
        }

        .marketing-calendar-event p {
            margin: 0;
            color: var(--ink);
            font-size: 11px;
            line-height: 1.4;
            display: -webkit-box;
            -webkit-line-clamp: 3;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }

        .marketing-calendar-empty {
            display: grid;
            place-items: center;
            min-height: 145px;
            color: #9aa59f;
            font-size: 11px;
            text-align: center;
        }

        .marketing-planner-list[hidden],
        .marketing-calendar[hidden] { display: none !important; }

        .marketing-oauth-panel {
            margin-bottom: 16px;
        }

        .marketing-oauth-panel > summary {
            cursor: pointer;
            list-style: none;
        }

        .marketing-oauth-panel > summary::-webkit-details-marker {
            display: none;
        }

        .marketing-oauth-status {
            color: var(--muted);
            font-size: 12px;
            font-weight: 600;
        }

        .marketing-account-form,
        .marketing-oauth-form,
        .marketing-post-form {
            margin-bottom: 14px;
        }

        .marketing-account-list,
        .marketing-provider-list,
        .marketing-post-list,
        .marketing-targets,
        .marketing-media-list {
            display: grid;
            gap: 10px;
        }

        .marketing-provider-row,
        .marketing-account-row,
        .marketing-target-row,
        .marketing-media-row,
        .marketing-post-row {
            display: grid;
            gap: 8px;
            padding: 12px;
            border: 1px solid var(--line);
            border-radius: 8px;
            background: #fbfcfa;
        }

        .marketing-account-row {
            grid-template-columns: 42px minmax(0, 1fr) minmax(130px, auto) auto;
            align-items: center;
            padding: 14px;
            background: #fff;
        }

        .marketing-account-row .marketing-provider-icon {
            width: 42px;
            height: 42px;
        }

        .marketing-account-health {
            display: grid;
            gap: 3px;
            color: var(--muted);
            font-size: 11px;
        }

        .marketing-account-health strong {
            color: var(--ink);
            font-size: 11px;
            font-weight: 600;
        }

        .marketing-provider-row {
            grid-template-columns: 42px minmax(0, 1fr) auto;
            align-items: center;
            margin-bottom: 0;
        }

        .marketing-provider-icon {
            display: grid;
            place-items: center;
            width: 42px;
            height: 42px;
            border-radius: 10px;
            overflow: hidden;
            box-shadow: 0 1px 2px rgba(24, 39, 31, 0.08);
            flex: 0 0 42px;
        }

        .marketing-provider-icon svg {
            display: block;
            width: 100%;
            height: 100%;
        }

        .marketing-provider-row.is-unconfigured {
            background: #f8faf8;
            color: var(--muted);
        }

        .marketing-row-title,
        .marketing-target-main {
            display: grid;
            gap: 3px;
            min-width: 0;
        }

        .marketing-row-title strong,
        .marketing-target-main strong,
        .marketing-post-row strong {
            min-width: 0;
            overflow-wrap: anywhere;
        }

        .marketing-row-title span,
        .marketing-target-main span,
        .marketing-post-meta,
        .marketing-media-row span {
            color: var(--muted);
            font-size: 12px;
            line-height: 1.45;
        }

        .marketing-account-actions {
            display: flex;
            gap: 8px;
            align-items: center;
        }

        .marketing-target-row {
            grid-template-columns: auto minmax(0, 1fr);
            align-items: center;
        }

        .marketing-target-row input {
            width: 18px;
            height: 18px;
            margin: 0;
        }

        .marketing-target-row.is-muted {
            opacity: 0.68;
        }

        .marketing-media-row {
            grid-template-columns: 42px minmax(0, 1fr);
            align-items: center;
        }

        .marketing-media-icon {
            width: 42px;
            height: 42px;
            border-radius: 8px;
            display: grid;
            place-items: center;
            background: #eef6f2;
            color: var(--accent);
            font-weight: 700;
            font-size: 11px;
        }

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

        .marketing-post-copy {
            display: grid;
            gap: 8px;
            min-width: 0;
        }

        .marketing-post-copy p {
            margin: 0;
            color: var(--ink);
            line-height: 1.55;
            overflow-wrap: anywhere;
        }

        .marketing-target-pills {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
        }

        .marketing-target-pills .badge {
            max-width: 220px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .meter-reading-input {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            align-items: center;
            gap: 8px;
            border: 1px solid var(--line);
            border-radius: 8px;
            background: #fff;
            padding: 0 10px 0 0;
        }

        .meter-reading-input:focus-within {
            border-color: rgba(31,77,77,0.38);
            box-shadow: 0 0 0 3px rgba(31,77,77,0.08);
        }

        .meter-reading-input input {
            border: 0;
            box-shadow: none;
            background: transparent;
            min-width: 0;
        }

        .meter-reading-input span {
            color: var(--muted);
            font-size: 12px;
            font-weight: 500;
            line-height: 1;
            text-transform: uppercase;
        }

        .property-photo-thumbs {
            display: grid;
            grid-auto-flow: column;
            grid-auto-columns: 58px;
            gap: 8px;
            overflow-x: auto;
            padding-bottom: 2px;
        }

        .property-photo-thumb {
            width: 58px;
            height: 44px;
            border: 2px solid transparent;
            border-radius: 7px;
            padding: 0;
            background: #f7f8f6;
            overflow: hidden;
            cursor: pointer;
            display: block;
        }

        .property-photo-thumb[draggable="true"] {
            cursor: grab;
        }

        .property-photo-thumb.dragging {
            opacity: 0.45;
        }

        .property-photo-thumb.drop-before {
            box-shadow: -4px 0 0 var(--accent);
        }

        .property-photo-thumb.drop-after {
            box-shadow: 4px 0 0 var(--accent);
        }

        .property-photo-thumb.active {
            border-color: var(--accent);
        }

        .property-photo-thumb img,
        .property-photo-thumb video {
            width: 100%;
            height: 100%;
            display: block;
            object-fit: cover;
        }

        .property-photo-thumb .property-photo-file-preview {
            padding: 4px;
            gap: 2px;
        }

        .property-photo-thumb .property-photo-file-preview strong {
            min-width: 0;
            min-height: 0;
            padding: 3px 5px;
            font-size: 9px;
        }

        .property-photo-thumb .property-photo-file-preview span {
            display: none;
        }

        .record-panel-head {
            min-height: 67px;
            padding: 14px 16px;
            border-bottom: 1px solid var(--line-soft);
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
        }

        .record-panel-head h3 {
            margin: 0;
            font-size: 14px;
            font-weight: 500;
        }

        .record-panel-body {
            min-height: 0;
            max-height: 100%;
            overflow: auto;
            padding: 12px 16px 16px;
        }

        .record-fields {
            display: grid;
            gap: 10px;
        }

        .tenancy-hub {
            display: grid;
            gap: 14px;
        }

        .tenancy-hub-overview {
            display: grid;
            gap: 10px;
        }

        .tenancy-hub-tabs {
            display: flex;
            gap: 6px;
            min-width: 0;
            overflow-x: auto;
            padding: 6px;
            border: 1px solid var(--line-soft);
            border-radius: 9px;
            background: #ffffff;
            scrollbar-width: none;
        }

        .tenancy-hub-tabs::-webkit-scrollbar {
            display: none;
        }

        .tenancy-hub-tab {
            min-height: 36px;
            border: 1px solid transparent;
            border-radius: 7px;
            background: transparent;
            color: var(--muted);
            cursor: pointer;
            flex: 0 0 auto;
            padding: 7px 10px;
            font: inherit;
            font-size: 12px;
            font-weight: 500;
            white-space: nowrap;
        }

        .tenancy-hub-tab.active {
            border-color: rgba(31, 77, 77, 0.18);
            background: var(--accent-soft);
            color: var(--accent);
        }

        .property-workspace-tabs {
            display: grid;
            gap: 7px;
            min-width: 0;
            margin: 0 0 16px;
            padding: 12px;
            border: 1px solid #e0e5e2;
            border-radius: 10px;
            background: #f8faf9;
        }

        .property-workspace-tabs[hidden] { display: none; }

        .property-workspace-heading {
            display: flex;
            align-items: baseline;
            justify-content: space-between;
            gap: 12px;
            padding: 0 2px 5px;
        }

        .property-workspace-heading strong { color: #25312b; font-size: 12px; font-weight: 600; }
        .property-workspace-heading span { color: #7a857f; font-size: 10px; }

        .property-related-disclosure {
            overflow: hidden;
            border: 1px solid #e1e6e3;
            border-radius: 8px;
            background: #ffffff;
        }

        .property-related-disclosure[open] {
            border-color: #cbd8d1;
            box-shadow: 0 2px 7px rgba(24, 39, 39, .05);
        }

        .property-related-disclosure summary {
            display: grid;
            grid-template-columns: 28px minmax(0, 1fr) auto 16px;
            align-items: center;
            gap: 9px;
            min-height: 44px;
            padding: 7px 10px;
            color: #25312b;
            cursor: pointer;
            list-style: none;
        }

        .property-related-disclosure summary::-webkit-details-marker { display: none; }
        .property-related-disclosure summary:hover { background: #f7faf8; }
        .property-related-disclosure[open] summary { border-bottom: 1px solid #e5e9e7; background: #f5f9f7; }

        .property-related-section-icon {
            display: inline-grid;
            place-items: center;
            width: 28px;
            height: 28px;
            border-radius: 7px;
            background: #edf3f0;
            color: var(--accent);
            font-size: 12px;
            font-weight: 600;
        }

        .property-related-section-label { display: grid; gap: 1px; min-width: 0; }
        .property-related-section-label strong { font-size: 11.5px !important; font-weight: 600 !important; }
        .property-related-section-label small { color: #7a857f; font-size: 10px !important; font-weight: 400 !important; }

        .property-workspace-count {
            display: inline-grid;
            place-items: center;
            min-width: 26px;
            height: 26px;
            padding: 0 7px;
            border-radius: 7px;
            background: #f0f3f1;
            color: #53615a;
            font-size: 11px !important;
            font-weight: 600 !important;
            font-variant-numeric: tabular-nums;
        }

        .property-related-chevron { color: #7a857f; font-size: 14px; transition: transform .16s ease; }
        .property-related-disclosure[open] .property-related-chevron { transform: rotate(90deg); }
        .property-related-disclosure-body { padding: 9px; }

        .property-workflow-heading {
            display: flex;
            align-items: center;
            gap: 9px;
            margin: 0 0 9px;
            padding: 0 2px;
        }

        .property-workflow-heading span {
            display: inline-grid;
            place-items: center;
            width: 28px;
            height: 28px;
            border-radius: 7px;
            background: #e9f2ed;
            color: var(--accent);
        }

        .property-workflow-heading strong { color: #25312b; font-size: 12px !important; font-weight: 600 !important; }

        /* Property workspace uses a single, conventional top tab row. */
        .property-workspace-tabs {
            display: flex;
            align-items: stretch;
            gap: 0;
            min-width: 0;
            margin: -7px -10px 12px;
            padding: 0 10px;
            overflow-x: auto;
            border: 0;
            border-bottom: 1px solid #e1e6e3;
            border-radius: 0;
            background: #ffffff;
            scrollbar-width: none;
        }

        .property-workspace-tabs::-webkit-scrollbar { display: none; }

        .property-workspace-tab {
            position: relative;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 6px;
            min-width: max-content;
            min-height: 45px;
            padding: 8px 13px;
            border: 0;
            background: transparent;
            color: #6e7973;
            cursor: pointer;
            font: inherit;
            font-size: 11px !important;
            font-weight: 600 !important;
            white-space: nowrap;
        }

        .property-workspace-tab:hover { color: #26322c; background: transparent; }
        .property-workspace-tab.active { color: var(--accent); background: transparent; }

        .property-workspace-tab.active::after {
            content: '';
            position: absolute;
            left: 12px;
            right: 12px;
            bottom: -1px;
            height: 2px;
            border-radius: 2px 2px 0 0;
            background: var(--accent);
        }

        .property-workspace-tab .property-workspace-count {
            min-width: 20px;
            height: 20px;
            padding: 0 5px;
            border-radius: 999px;
            font-size: 10px !important;
        }

        .property-workspace-tab.active .property-workspace-count { background: #dfeee6; color: var(--accent); }

        .record-content #propertyWorkspaceTabs {
            position: sticky;
            top: -12px;
            z-index: 12;
            min-height: 55px;
            margin: -12px -14px 12px;
            padding: 0;
            background: #ffffff;
        }

        .record-content #propertyWorkspaceTabs .property-workspace-tab {
            min-height: 54px;
        }

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

        .tenancy-event-history {
            display: grid;
            gap: 12px;
            margin-top: 20px;
            padding-top: 18px;
            border-top: 1px solid #e3e8e5;
        }

        .tenancy-event-history-heading {
            margin: 0;
        }

        .record-content .tenancy-event-history-heading > div > strong {
            font-size: 12px !important;
            font-weight: 600 !important;
        }

        .tenancy-event-list { display: grid; gap: 8px; }

        .tenancy-history-card {
            position: relative;
            gap: 12px;
            padding: 15px 16px;
        }

        .tenancy-history-card-details {
            grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
        }

        .tenancy-event-open {
            justify-self: end;
            color: var(--accent);
            font-size: 10.5px;
            font-weight: 600;
            white-space: nowrap;
        }

        .tenancy-event-empty {
            min-height: 96px;
            display: grid;
            place-items: center;
            padding: 18px;
            border: 1px solid #e0e5e2;
            border-radius: 8px;
            background: #ffffff;
            color: #7b8680;
            font-size: 11px;
            text-align: center;
        }

        .dashboard-payment-plans .dashboard-section-head p { margin:3px 0 0; color:var(--muted); font-size:11px; }
        .dashboard-plan-counts { display:flex; align-items:center; gap:8px; font-size:11px; }
        .dashboard-plan-counts span { color:var(--muted); }
        .dashboard-plan-counts strong { padding:5px 8px; border-radius:999px; background:#fde8e5; color:#a13e35; }
        .dashboard-payment-plan-list { display:grid; gap:7px; }
        .dashboard-payment-plan-list > a { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:11px 12px; border:1px solid var(--line-soft); border-radius:9px; background:#fff; color:inherit; text-decoration:none; }
        .dashboard-payment-plan-list > a:hover { border-color:#b8cdc1; box-shadow:0 3px 10px rgba(35,64,48,.05); }
        .dashboard-payment-plan-list > a > span { display:grid; gap:3px; }
        .dashboard-payment-plan-list strong { color:var(--ink); font-size:11px; }
        .dashboard-payment-plan-list small { color:var(--muted); font-size:9px; }
        .dashboard-payment-plan-list > a > span:last-child { color:#35433b; font-size:11px; font-weight:650; text-align:right; }
        .dashboard-payment-plan-list > a > span:last-child.overdue { color:#a13e35; }

        .tenancy-payment-plans { display:grid; gap:11px; margin-top:18px; padding-top:18px; border-top:1px solid #e3e8e5; }
        .tenancy-payment-plans-title { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
        .tenancy-payment-plans-title h3 { margin:0; color:#25312b; font-size:14px; font-weight:650; }
        .tenancy-payment-plans-title p { margin:4px 0 0; color:#738079; font-size:10px; line-height:1.45; }
        .tenancy-payment-plan-builder { border:1px solid #dbe4df; border-radius:10px; background:#fbfcfb; overflow:hidden; }
        .tenancy-payment-plan-builder > summary { padding:12px 14px; color:var(--accent); font-size:11px; font-weight:650; cursor:pointer; }
        .tenancy-payment-plan-builder form { display:grid; gap:11px; padding:0 14px 14px; }
        .tenancy-payment-plan-builder label { display:grid; gap:5px; color:#66736c; font-size:10px; }
        .tenancy-payment-plan-builder input,.tenancy-payment-plan-builder select,.tenancy-payment-plan-builder textarea { width:100%; border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--ink); font:inherit; font-size:11px; padding:8px 9px; }
        .tenancy-payment-plan-create-action { display:flex; align-items:center; gap:10px; }
        .tenancy-payment-plan-create-action > span { color:#7a8680; font-size:10px; }
        .tenancy-payment-plan-modal { display:flex; flex-direction:column; width:min(620px,calc(100vw - 32px)); }
        .tenancy-payment-plan-modal .modal-head > div { display:grid; gap:3px; }
        .tenancy-payment-plan-modal .modal-head p { margin:0; color:var(--muted); font-size:11px; }
        .tenancy-payment-plan-modal form { display:grid; min-height:0; grid-template-rows:minmax(0,1fr) auto; overflow:hidden; }
        .tenancy-payment-plan-modal-body { display:grid; gap:14px; }
        .tenancy-payment-plan-modal-body > label { display:grid; gap:5px; color:#66736c; font-size:10px; }
        .tenancy-payment-plan-modal-body input,.tenancy-payment-plan-modal-body select,.tenancy-payment-plan-modal-body textarea { width:100%; border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--ink); padding:8px 9px; font-size:12px; font-weight:400; }
        .tenancy-plan-balance { display:flex; flex-wrap:wrap; gap:7px; }
        .tenancy-plan-balance span { padding:7px 9px; border-radius:7px; background:#eef3f0; color:#69766f; font-size:9px; }
        .tenancy-plan-balance strong { margin-left:4px; color:#29362f; }
        .tenancy-plan-reminder { grid-template-columns:16px minmax(0,1fr) !important; align-items:start; gap:8px !important; padding:9px; border:1px solid #dce7e1; border-radius:8px; background:#f5faf7; cursor:pointer; }
        .tenancy-plan-reminder input { width:15px; margin:1px 0 0; accent-color:var(--accent); }
        .tenancy-plan-reminder span { display:grid; gap:2px; }
        .tenancy-plan-reminder strong { color:#314039; font-size:10px; }
        .tenancy-plan-reminder small { color:#738079; font-size:9px; line-height:1.4; }
        .tenancy-payment-plan-card { display:grid; gap:11px; padding:13px; border:1px solid #dfe6e2; border-radius:10px; background:#fff; }
        .tenancy-payment-plan-card.is-overdue { border-color:#e5c4be; background:#fffafa; }
        .tenancy-payment-plan-head { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
        .tenancy-payment-plan-head > div { display:grid; gap:2px; }
        .tenancy-payment-plan-head strong { color:#26322c; font-size:12px; }
        .tenancy-payment-plan-head span { color:#7b8680; font-size:9px; }
        .tenancy-payment-plan-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; }
        .tenancy-payment-plan-summary > div { display:grid; gap:3px; padding:9px; border-radius:8px; background:#f5f7f6; }
        .tenancy-payment-plan-summary span { color:#7a8680; font-size:9px; }
        .tenancy-payment-plan-summary strong { color:#29362f; font-size:11px; }
        .tenancy-plan-change { padding:8px 9px; border-radius:7px; font-size:9px; }
        .tenancy-plan-change.warning { background:#fff1e6; color:#8b4c1c; }
        .tenancy-plan-change.positive { background:#edf8f1; color:#287048; }
        .tenancy-installment-list { display:grid; max-height:240px; overflow:auto; border:1px solid #e6eae8; border-radius:8px; }
        .tenancy-installment { display:grid; grid-template-columns:1fr 1fr .8fr .7fr; gap:7px; padding:8px 9px; border-bottom:1px solid #edf0ee; color:#69766f; font-size:9px; }
        .tenancy-installment:last-child { border-bottom:0; }
        .tenancy-installment strong { color:#2f3c35; }
        .tenancy-installment.paid { background:#f3faf5; }
        .tenancy-installment.overdue { background:#fff0ee; color:#9b4037; }
        .tenancy-payment-plan-actions { display:flex; align-items:center; justify-content:flex-end; gap:7px; }
        .tenancy-ntrb-section { display:grid; gap:11px; margin-top:18px; padding-top:18px; border-top:1px solid #e3e8e5; }
        .tenancy-ntrb-counts { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:14px; color:#748078; font-size:10px; }
        .tenancy-ntrb-counts span { white-space:nowrap; }
        .tenancy-ntrb-counts strong { color:#2c3933; font-size:12px; font-weight:600; }
        .tenancy-ntrb-list { display:grid; gap:9px; }
        .tenancy-ntrb-card { display:grid; gap:11px; padding:13px; border:1px solid #dfe6e2; border-radius:10px; background:#fff; }
        .tenancy-ntrb-card.overdue,.tenancy-ntrb-card.not_remedied { border-color:#e5c4be; background:#fffafa; }
        .tenancy-ntrb-card-head { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
        .tenancy-ntrb-card-head > div { display:grid; gap:2px; }
        .tenancy-ntrb-card-head strong { color:#26322c; font-size:12px; font-weight:600; }
        .tenancy-ntrb-card-head span { color:#7b8680; font-size:9px; }
        .tenancy-ntrb-card-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
        .tenancy-ntrb-card-grid > div { display:grid; gap:3px; padding:9px; border-radius:8px; background:#f5f7f6; }
        .tenancy-ntrb-card-grid > .wide { grid-column:1 / -1; }
        .tenancy-ntrb-card-grid span { color:#7a8680; font-size:9px; }
        .tenancy-ntrb-card-grid strong { color:#29362f; font-size:11px; font-weight:400; white-space:pre-wrap; }
        .tenancy-ntrb-outcome { display:grid; grid-template-columns:auto minmax(160px,220px); align-items:center; justify-content:end; gap:8px; color:#66736c; font-size:10px; }
        .tenancy-ntrb-outcome select { width:100%; border:1px solid var(--line); border-radius:8px; background:#fff; padding:7px 9px; font-size:11px; }
        .tenancy-renewal-arrears-insight { display:grid; gap:12px; margin-bottom:14px; padding:14px; border:1px solid #dfe6e2; border-radius:11px; background:#fff; box-shadow:0 1px 2px rgba(31,48,39,.04); }
        .tenancy-renewal-arrears-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
        .tenancy-renewal-arrears-head > div { display:grid; gap:2px; }
        .tenancy-renewal-arrears-head > div span { color:#77827c; font-size:9px; font-weight:500; letter-spacing:.05em; text-transform:uppercase; }
        .tenancy-renewal-arrears-head > div strong { color:#26322c; font-size:13px; font-weight:600; }
        .tenancy-renewal-arrears-status { display:inline-flex; align-items:center; gap:6px; padding:5px 8px; border-radius:999px; background:#eef6f1; color:#3f7254; font-size:9px; font-weight:600; }
        .tenancy-renewal-arrears-status i,.tenancy-renewal-arrears-plan i { width:6px; height:6px; border-radius:50%; background:#5b9a70; }
        .tenancy-renewal-arrears-insight.has-arrears .tenancy-renewal-arrears-status { background:#fff4e6; color:#9a641b; }
        .tenancy-renewal-arrears-insight.has-arrears .tenancy-renewal-arrears-status i { background:#cf8a2c; }
        .tenancy-renewal-arrears-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid #edf0ee; border-bottom:1px solid #edf0ee; }
        .tenancy-renewal-arrears-metrics > div { display:grid; gap:3px; padding:10px 12px; border-right:1px solid #edf0ee; }
        .tenancy-renewal-arrears-metrics > div:first-child { padding-left:0; }
        .tenancy-renewal-arrears-metrics > div:last-child { border-right:0; }
        .tenancy-renewal-arrears-metrics span { color:#7a857f; font-size:9px; font-weight:500; }
        .tenancy-renewal-arrears-metrics strong { color:#29362f; font-size:15px; font-weight:600; }
        .tenancy-renewal-arrears-insight.has-arrears .tenancy-renewal-arrears-metrics .current strong { color:#a4671a; }
        .tenancy-renewal-arrears-plan { display:flex; align-items:center; gap:6px; color:#66736c; font-size:9px; font-weight:500; }
        .tenancy-renewal-arrears-plan i { background:#6484a6; }
        @media (max-width:760px) { .tenancy-payment-plan-summary,.tenancy-ntrb-card-grid { grid-template-columns:1fr; } .tenancy-ntrb-card-grid > .wide { grid-column:auto; } .tenancy-ntrb-counts { justify-content:flex-start; } .tenancy-payment-plans-title { flex-direction:column; } .tenancy-renewal-arrears-metrics { grid-template-columns:1fr; } .tenancy-renewal-arrears-metrics > div,.tenancy-renewal-arrears-metrics > div:first-child { padding:9px 0; border-right:0; border-bottom:1px solid #edf0ee; } .tenancy-renewal-arrears-metrics > div:last-child { border-bottom:0; } }

        .property-related-card {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            align-items: center;
            gap: 12px;
            min-height: 64px;
            padding: 11px 12px;
            border: 1px solid var(--line-soft);
            border-radius: 9px;
            background: #fbfbf8;
            color: inherit;
            text-decoration: none;
            transition: border-color 0.16s ease, background 0.16s ease, transform 0.16s ease;
        }

        a.property-related-card:hover {
            border-color: rgba(31, 77, 77, 0.28);
            background: #ffffff;
            transform: translateY(-1px);
        }

        .property-related-copy {
            display: grid;
            gap: 4px;
            min-width: 0;
        }

        .property-related-copy strong {
            overflow: hidden;
            color: var(--ink);
            font-size: 13px;
            font-weight: 500;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .property-related-copy span,
        .property-related-value span {
            color: var(--muted);
            font-size: 11px;
            line-height: 1.35;
        }

        .property-related-value {
            display: grid;
            justify-items: end;
            gap: 4px;
            text-align: right;
        }

        .property-related-value strong {
            color: var(--accent);
            font-size: 13px;
            font-weight: 600;
            font-variant-numeric: tabular-nums;
        }

        .tenancy-hub-pane {
            display: grid;
            gap: 12px;
            min-width: 0;
        }

        .tenancy-hub-pane[hidden] {
            display: none !important;
        }

        .tenancy-agreement-dates-grid {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            flex-wrap: wrap;
            min-width: 0;
        }

        .tenancy-compact-text-field input {
            max-width: 280px;
        }

        .record-field .table-inline-select-cell {
            max-width: 220px;
        }

        .record-field .table-inline-select {
            width: auto;
            min-width: 120px;
            max-width: 220px;
        }

        .tenancy-agreement-dates-grid .badge {
            white-space: nowrap;
        }

        @media (max-width: 720px) {
            .tenancy-compact-text-field input,
            .record-field .table-inline-select-cell,
            .record-field .table-inline-select {
                max-width: 100%;
                width: 100%;
            }
        }

        .tenant-request-card-list {
            display: grid;
            gap: 10px;
        }

        .tenant-request-mini-card {
            display: grid;
            gap: 7px;
            padding: 12px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #fbfbf8;
            text-decoration: none;
            color: inherit;
        }

        .tenant-request-mini-card:hover {
            border-color: rgba(31, 77, 77, 0.25);
            background: #ffffff;
        }

        .tenant-request-mini-card strong {
            color: var(--ink);
            font-size: 13px;
            font-weight: 500;
        }

        .tenant-request-mini-card span {
            color: var(--muted);
            font-size: 12px;
            font-weight: 300;
            line-height: 1.4;
        }

        .tenant-request-mini-card .tenant-request-mini-meta {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
        }

        .property-tenancy-panel {
            display: grid;
            gap: 12px;
        }

        .property-tenancy-summary {
            display: grid;
            grid-template-columns: minmax(190px, 1.35fr) minmax(0, 2fr);
            gap: 10px;
            align-items: stretch;
        }

        .property-tenancy-primary {
            display: grid;
            gap: 8px;
            align-content: start;
            padding: 12px;
            border: 1px solid rgba(31, 77, 77, 0.18);
            border-radius: 8px;
            background: #f7fbf9;
            min-width: 0;
        }

        .property-tenancy-primary span {
            color: var(--muted);
            font-size: 10px;
            font-weight: 500;
            letter-spacing: 0.04em;
            line-height: 1.2;
            text-transform: uppercase;
        }

        .property-tenancy-primary strong {
            min-width: 0;
            color: var(--ink);
            font-size: 14px;
            font-weight: 600;
            line-height: 1.25;
            overflow-wrap: anywhere;
        }

        .property-tenancy-primary .property-tenancy-rent {
            color: var(--accent);
            font-size: 20px;
            font-weight: 600;
            letter-spacing: 0;
        }

        .property-tenancy-facts {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 8px;
        }

        .property-tenancy-fact {
            display: grid;
            gap: 4px;
            min-width: 0;
            padding: 10px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #ffffff;
        }

        .property-tenancy-fact span {
            color: var(--muted);
            font-size: 10px;
            font-weight: 500;
            letter-spacing: 0.04em;
            line-height: 1.2;
            text-transform: uppercase;
        }

        .property-tenancy-fact strong {
            min-width: 0;
            color: var(--ink);
            font-size: 12px;
            font-weight: 500;
            line-height: 1.3;
            overflow-wrap: anywhere;
        }

        .property-section-table-head,
        .property-tenancy-list-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            min-width: 0;
        }

        .property-tenancy-list-head > div {
            display: flex;
            align-items: baseline;
            gap: 8px;
            min-width: 0;
        }

        .property-tenancy-add {
            min-height: 34px;
            padding: 7px 11px;
            border-color: #1f4d4d !important;
            background: #1f4d4d !important;
            color: #ffffff !important;
            box-shadow: 0 1px 2px rgba(20, 54, 48, .14);
        }

        .property-tenancy-add:hover {
            border-color: #173f3f !important;
            background: #173f3f !important;
            color: #ffffff !important;
        }

        .property-section-table-head strong,
        .property-tenancy-list-head strong {
            color: var(--ink);
            font-size: 12px;
            font-weight: 600;
        }

        .record-content .property-tenancy-list-head > div > strong {
            font-size: 12px !important;
            font-weight: 600 !important;
        }

        .property-section-table-head span,
        .property-tenancy-list-head span {
            color: var(--muted);
            font-size: 11px;
            font-weight: 400;
            text-align: right;
        }

        .property-tenancy-list-head .property-tenancy-list-count {
            white-space: nowrap;
        }

        .property-tenancy-list {
            display: grid;
            grid-template-columns: minmax(0, 1fr);
            gap: 8px;
        }

        .property-linked-record-panel {
            display: grid;
            gap: 12px;
        }

        .property-linked-record-card {
            display: grid;
            gap: 14px;
            padding: 15px 16px;
            border: 1px solid #e0e5e2;
            border-radius: 8px;
            background: #ffffff;
            color: inherit;
            text-decoration: none;
            transition: border-color .16s ease, box-shadow .16s ease;
        }

        a.property-linked-record-card:hover {
            border-color: rgba(31, 77, 77, .3);
            box-shadow: 0 3px 10px rgba(31, 48, 43, .07);
        }

        .property-linked-record-head {
            display: flex;
            align-items: flex-start;
            gap: 10px;
            min-width: 0;
        }

        .property-linked-record-identity {
            display: grid;
            gap: 3px;
            flex: 1 1 auto;
            min-width: 0;
        }

        .property-linked-record-identity strong {
            overflow: hidden;
            color: var(--ink);
            font-size: 14px;
            font-weight: 500;
            line-height: 1.3;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .property-linked-record-identity small {
            overflow: hidden;
            color: var(--muted);
            font-size: 11px;
            font-weight: 300;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .property-linked-record-amount {
            flex: 0 0 auto;
            color: var(--ink);
            font-size: 14px;
            font-weight: 500;
            font-variant-numeric: tabular-nums;
        }

        .property-linked-record-details {
            display: grid;
            gap: 8px;
            padding-top: 12px;
            border-top: 1px solid #edf0ee;
        }

        .property-linked-record-details.two-column { grid-template-columns: repeat(2, minmax(0, 1fr)); }
        .property-linked-record-details.three-column { grid-template-columns: repeat(3, minmax(0, 1fr)); }

        .property-linked-record-field {
            display: grid;
            gap: 4px;
            min-width: 0;
        }

        .property-linked-record-field small {
            color: var(--muted);
            font-size: 10.5px;
            font-weight: 400;
        }

        .property-linked-record-field strong {
            min-width: 0;
            color: #39433e;
            font-size: 11px;
            font-weight: 300;
            line-height: 1.35;
            overflow-wrap: anywhere;
        }

        .property-tenancy-card {
            position: relative;
            display: block;
            gap: 12px;
            min-height: 0;
            border: 1px solid #e0e5e2;
            border-radius: 8px;
            background: #ffffff;
            color: inherit;
            text-decoration: none;
            transition: border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease;
        }

        .property-tenancy-card-link {
            display: grid;
            gap: 14px;
            min-height: 0;
            padding: 15px 16px;
            color: inherit;
            text-decoration: none;
        }

        .property-tenancy-card:hover {
            border-color: rgba(31, 77, 77, 0.3);
            background: #ffffff;
            box-shadow: 0 3px 10px rgba(31, 48, 43, 0.07);
        }

        .property-tenancy-card.current {
            border-color: rgba(31, 77, 77, 0.24);
            background: #fbfcfb;
        }

        .property-tenancy-card-head {
            display: flex;
            align-items: flex-start;
            gap: 10px;
            min-width: 0;
        }

        .property-tenancy-card-identity {
            display: grid;
            gap: 3px;
            flex: 1 1 auto;
            min-width: 0;
        }

        .property-tenancy-card-identity strong {
            min-width: 0;
            color: var(--ink);
            font-size: 14px;
            font-weight: 500;
            line-height: 1.3;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .property-tenancy-card-identity small {
            color: var(--muted);
            font-size: 11px;
            font-weight: 300;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .property-tenancy-card-status {
            flex: 0 0 auto;
            margin-top: 0;
            font-size: 10px;
            line-height: 1.2;
        }

        .property-tenancy-card-details {
            display: grid;
            grid-template-columns: minmax(0, 1.05fr) minmax(0, 1.35fr) minmax(0, 1fr) minmax(0, 1fr);
            gap: 8px;
            padding-top: 12px;
            border-top: 1px solid #edf0ee;
        }

        .property-tenancy-card-field {
            display: grid;
            gap: 4px;
            min-width: 0;
        }

        .property-tenancy-card-field small {
            color: var(--muted);
            font-size: 10.5px;
            font-weight: 400;
            letter-spacing: 0;
            text-transform: none;
        }

        .property-tenancy-card-field strong {
            min-width: 0;
            color: #39433e;
            font-size: 10.5px;
            font-weight: 300;
            line-height: 1.35;
            white-space: normal;
            overflow-wrap: anywhere;
        }

        .property-tenancy-card-agreement strong { overflow-wrap: normal; }

        .property-tenancy-unlink {
            position: absolute;
            top: -10px;
            right: -10px;
            display: grid;
            width: 28px;
            height: 28px;
            place-items: center;
            padding: 0;
            border: 0;
            border-radius: 999px;
            background: #626a70;
            color: #ffffff;
            font: 400 22px/1 Arial, sans-serif;
            cursor: pointer;
            opacity: 0;
            transform: scale(0.88);
            transition: opacity 0.14s ease, transform 0.14s ease, background 0.14s ease;
            z-index: 2;
        }

        .property-tenancy-card:hover .property-tenancy-unlink,
        .property-tenancy-unlink:focus-visible {
            opacity: 1;
            transform: scale(1);
        }

        .property-tenancy-unlink:hover { background: #3f474c; }

        .property-tenancy-create-modal .modal-head p {
            margin: 4px 0 0;
            color: var(--muted);
            font-size: 12px;
        }

        .property-tenancy-create-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
        .property-tenancy-create-wide { grid-column: 1 / -1; }
        .inspection-entry-notice { align-items: flex-start; background: #f7f9f8; border: 1px solid var(--line); border-radius: 8px; gap: 5px; padding: 12px 14px; }
        .inspection-entry-notice > span { align-items: center; display: flex; gap: 8px; }
        .inspection-entry-notice input { margin: 0; }
        .inspection-entry-notice small { color: var(--muted); font-size: 11px; font-weight: 400; }

        @media (max-width: 620px) {
            .property-tenancy-list-head { align-items: flex-start; }
            .property-tenancy-card-link,
            .property-tenancy-create-grid { grid-template-columns: minmax(0, 1fr); }
            .property-tenancy-card-details { grid-template-columns: minmax(0, 1fr); }
            .property-tenancy-create-wide { grid-column: auto; }
        }

        .property-tenancy-card-title > span {
            color: var(--muted);
            font-size: 10px;
            font-weight: 500;
            letter-spacing: 0.04em;
            line-height: 1.2;
            text-transform: uppercase;
        }

        .property-tenancy-card-rent {
            display: grid;
            gap: 2px;
            min-width: 0;
        }

        .property-tenancy-card-rent strong {
            color: var(--accent);
            font-size: 13px;
            font-variant-numeric: tabular-nums;
        }

        .property-tenancy-card-rent span {
            color: var(--muted);
            font-size: 10px;
            font-weight: 400;
        }

        .property-tenancy-meta span {
            color: var(--muted);
            font-size: 11px;
            font-weight: 400;
            line-height: 1.35;
        }

        .property-income-review-panel {
            display: grid;
            gap: 12px;
        }

        .property-income-head {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 12px;
            padding: 0 0 10px;
            border: 1px solid var(--line-soft);
            border-width: 0 0 1px;
            border-radius: 8px;
            background: transparent;
        }

        .property-income-title {
            display: grid;
            gap: 4px;
            min-width: 0;
        }

        .property-income-title strong {
            color: var(--ink);
            font-size: 13px;
            font-weight: 600;
        }

        .property-income-title span {
            color: var(--muted);
            font-size: 11px;
            font-weight: 300;
            line-height: 1.4;
        }

        .property-income-head .income-performance-badge {
            flex: 0 0 auto;
        }

        .property-fees-summary {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 0;
            overflow: hidden;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #fbfbf8;
        }

        .property-fees-summary .proposal-income-stat {
            border: 0;
            border-right: 1px solid var(--line-soft);
            border-radius: 0;
            background: transparent;
            padding: 10px 12px;
        }

        .property-fees-summary .proposal-income-stat:last-child {
            border-right: 0;
        }

        .property-fees-table-wrap {
            width: 100%;
            overflow-x: auto;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #ffffff;
        }

        .property-fees-table {
            width: 100%;
            min-width: 680px;
            border-collapse: collapse;
            table-layout: fixed;
        }

        .property-fees-table th,
        .property-fees-table td {
            padding: 8px 9px;
            border-bottom: 1px solid var(--line-soft);
            text-align: left;
            vertical-align: top;
        }

        .property-fees-table th {
            color: var(--muted);
            font-size: 9px;
            font-weight: 600;
            letter-spacing: 0.04em;
            text-transform: uppercase;
            background: #fbfbf8;
        }

        .property-fees-table td {
            color: var(--ink);
            font-size: 11px;
            font-weight: 300;
        }

        .property-fees-table td.numeric {
            text-align: right;
            font-variant-numeric: tabular-nums;
            white-space: nowrap;
        }

        .property-fees-table th.numeric {
            text-align: right;
        }

        .property-fees-table tr:last-child td {
            border-bottom: 0;
        }

        .property-fees-table tbody tr:hover td {
            background: #fbfcfa;
        }

        .property-fees-table th:nth-child(1),
        .property-fees-table td:nth-child(1) {
            width: 28%;
        }

        .property-fees-table th:nth-child(2),
        .property-fees-table td:nth-child(2) {
            width: 22%;
        }

        .property-fees-table a {
            color: var(--accent);
            font-weight: 500;
            text-decoration: none;
        }

        .property-fees-table a:hover {
            text-decoration: underline;
        }

        .property-fee-subtext {
            display: block;
            margin-top: 2px;
            color: var(--muted);
            font-size: 10px;
            line-height: 1.35;
        }

        .property-fee-type {
            display: inline-flex;
            align-items: center;
            width: fit-content;
            margin-top: 5px;
            border: 1px solid var(--line-soft);
            border-radius: 6px;
            padding: 3px 6px;
            background: #fbfbf8;
            color: var(--muted);
            font-size: 10px;
            font-weight: 500;
            line-height: 1.1;
            white-space: nowrap;
        }

        .property-fee-type.income {
            border-color: rgba(31, 77, 77, 0.18);
            background: #edf7f2;
            color: var(--accent);
        }

        .property-smoke-provider-field {
            position: relative;
        }

        .property-smoke-provider-field .tenant-request-relation-input-wrap {
            position: relative;
        }

        .property-smoke-provider-results {
            margin-top: 6px;
        }

        .property-smoke-cert-panel {
            display: grid;
            gap: 10px;
        }

        @media (max-width: 920px) {
            .property-tenancy-summary,
            .property-fees-summary {
                grid-template-columns: 1fr;
            }

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

            .property-tenancy-card {
                grid-template-columns: 1fr;
                gap: 7px;
            }

            .property-income-head {
                display: grid;
            }

            .property-income-head .income-performance-badge {
                justify-self: start;
            }
        }

        .tenant-portal {
            display: flex;
            flex-direction: column;
            gap: 14px;
            min-height: 0;
        }

        .tenant-portal-shell {
            display: block;
            align-items: start;
        }

        .tenant-portal-main {
            display: grid;
            gap: 16px;
            min-width: 0;
            max-width: 1540px;
        }

        .tenant-portal .badge {
            font-size: 10.5px;
            line-height: 1.25;
            padding: 4px 7px;
            white-space: nowrap;
        }

        .tenant-portal-command,
        .tenant-portal-panel,
        .tenant-portal-form,
        .tenant-portal-list {
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #fff;
            box-shadow: 0 14px 32px rgba(19, 30, 26, 0.045);
        }

        .tenant-portal-command {
            border: 0;
            border-radius: 0;
            background: transparent;
            box-shadow: none;
            padding: 0;
            display: grid;
            gap: 0;
        }

        .tenant-portal-command-head,
        .tenant-portal-panel-head,
        .tenant-portal-list-head {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            gap: 12px;
        }

        .tenant-portal-command-head > div {
            display: grid;
            gap: 2px;
        }

	        .tenant-portal-command-head strong,
	        .tenant-portal-panel-head strong,
	        .tenant-portal-list-head strong {
	            color: var(--ink);
	            font-size: 13px;
	            font-weight: 650 !important;
	            line-height: 1.3;
	        }

	        .tenant-portal-command-head strong {
	            font-size: 15px;
	        }

        .tenant-portal-command-head span,
        .tenant-portal-panel-head span,
        .tenant-portal-list-head span {
            color: var(--muted);
            font-size: 12px;
            line-height: 1.4;
        }

        .tenant-portal-actions {
            display: grid;
            width: 100%;
            grid-template-columns: repeat(5, minmax(0, 1fr));
            gap: 10px;
        }

        .tenant-portal-dashboard-tabs {
            display: grid;
            gap: 16px;
            padding-top: 2px;
        }

        .tenant-portal-tabbar {
            display: flex;
            align-items: center;
            gap: 26px;
            overflow-x: auto;
            border-bottom: 1px solid var(--line-soft);
            scrollbar-width: thin;
            padding: 0 2px;
        }

	        .tenant-portal-tab {
	            min-height: 48px;
            display: inline-flex;
            align-items: center;
            gap: 9px;
            flex: 0 0 auto;
            border: 0;
            border-bottom: 2px solid transparent;
            padding: 0 0 10px;
            background: transparent;
            color: #66716c;
	            font-size: 12.2px !important;
	            font-weight: 650;
            line-height: 1;
            cursor: pointer;
        }

	        .tenant-portal-tab svg {
	            width: 17px !important;
	            height: 17px !important;
	            stroke-width: 2;
	        }

	        .tenant-portal-tab span {
	            font-size: 12.2px !important;
	            font-weight: 650 !important;
	        }

        .tenant-portal-tab:hover,
        .tenant-portal-tab.active {
            color: var(--ink);
        }

        .tenant-portal-tab.active {
            border-bottom-color: var(--ink);
        }

	        .tenant-portal-tab-panel {
	            display: grid;
	            gap: 14px;
	            color: var(--ink);
	            font-size: 12px;
	            font-weight: 400;
	        }

	        .tenant-portal-tab-panel strong,
	        .tenant-portal-tab-panel b {
	            font-weight: 600;
	        }

        .tenant-portal-tab-title {
            display: grid;
            gap: 4px;
        }

	        .tenant-portal-tab-title h3 {
	            margin: 0;
	            color: var(--ink);
	            font-size: 18px;
	            line-height: 1.24;
	            font-weight: 600;
	        }

        .tenant-portal-tab-title p {
            max-width: 900px;
            margin: 0;
	            color: var(--muted);
	            font-size: 11.8px;
	            line-height: 1.45;
	        }

	        .tenant-portal-tab-toolbar {
	            display: flex;
	            align-items: flex-end;
	            justify-content: space-between;
	            gap: 14px;
	        }

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

	        .tenant-portal-inline-action {
	            min-height: 34px;
	            display: inline-flex;
	            align-items: center;
	            gap: 7px;
	            padding: 0 11px;
	            border: 1px solid var(--line);
	            border-radius: 8px;
	            background: #fff;
	            color: var(--accent);
	            font-size: 11.5px !important;
	            font-weight: 650;
	            line-height: 1;
	            cursor: pointer;
	        }

	        .tenant-portal-inline-action svg {
	            width: 15px !important;
	            height: 15px !important;
	        }

        .tenant-portal-tab-card-row {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 12px;
        }

        .tenant-portal-quick-card {
            min-height: 82px;
            display: grid;
            grid-template-columns: 46px minmax(0, 1fr);
            align-items: center;
            gap: 13px;
            padding: 12px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #fff;
            color: var(--ink);
            text-align: left;
            text-decoration: none;
            box-shadow: 0 10px 22px rgba(18,32,28,.035);
        }

        button.tenant-portal-quick-card {
            cursor: pointer;
        }

        .tenant-portal-quick-card:hover {
            border-color: rgba(31,77,77,.22);
        }

        .tenant-portal-quick-card > span:first-child {
            width: 46px;
            height: 46px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            color: #3f4945;
            background: #eef0ef;
        }

        .tenant-portal-quick-card svg {
            width: 21px !important;
            height: 21px !important;
            stroke-width: 1.8;
        }

	        .tenant-portal-quick-card strong {
            display: block;
            color: var(--ink);
	            font-size: 12.3px;
	            line-height: 1.25;
	            font-weight: 650;
	        }

        .tenant-portal-quick-card span span {
            display: block;
            margin-top: 3px;
            color: var(--muted);
            font-size: 11.5px;
            line-height: 1.35;
        }

        .tenant-portal-vacate-fields {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 12px 24px;
        }

        .tenant-portal-vacate-field {
            display: grid;
            gap: 4px;
            min-width: 0;
        }

	        .tenant-portal-vacate-field span {
	            color: var(--muted);
	            font-size: 11.5px;
	            font-weight: 400;
	            line-height: 1.25;
	        }

	        .tenant-portal-vacate-field strong {
	            color: #3f4945;
	            font-size: 12px;
	            font-weight: 500;
            line-height: 1.35;
            word-break: break-word;
        }

	        .tenant-portal-action {
	            min-height: 72px;
            display: grid;
            grid-template-columns: 42px minmax(0, 1fr) 14px;
            align-items: center;
            gap: 13px !important;
            column-gap: 13px !important;
            padding: 12px;
            text-align: left;
            white-space: normal;
	            border: 1px solid #cedbd4;
            border-radius: 8px;
            background: linear-gradient(180deg, #fff 0%, #fbfdfc 100%) !important;
            color: var(--ink);
	            box-shadow: 0 10px 22px rgba(18, 32, 28, 0.06);
        }

        .tenant-portal-action:hover,
        .tenant-portal-action.primary {
            border-color: rgba(31, 77, 77, 0.28);
            background: #ffffff;
            color: var(--accent);
            transform: translateY(-1px);
        }

	        .tenant-portal-action[data-tenant-action="pet"] {
	            border-color: #99d7b1;
	            background: linear-gradient(180deg, #fff 0%, #eaf8f0 100%) !important;
	        }

	        .tenant-portal-action[data-tenant-action="cot"] {
	            border-color: #9dc3ee;
	            background: linear-gradient(180deg, #fff 0%, #edf5ff 100%) !important;
	        }

	        .tenant-portal-action[data-tenant-action="fixture"] {
	            border-color: #e7be83;
	            background: linear-gradient(180deg, #fff 0%, #fff3e2 100%) !important;
	        }

        .tenant-portal-action-icon {
            width: 42px;
            height: 42px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            color: var(--accent);
            background: var(--accent-soft);
        }

        .tenant-portal-action[data-tenant-action="pet"] .tenant-portal-action-icon,
        .tenant-portal-icon.pet {
            color: #087a42;
            background: #dff4e8;
        }

        .tenant-portal-action[data-tenant-action="cot"] .tenant-portal-action-icon,
        .tenant-portal-icon.cot {
            color: #1d63b7;
            background: #e1efff;
        }

        .tenant-portal-action[data-tenant-action="fixture"] .tenant-portal-action-icon,
        .tenant-portal-icon.fixture {
            color: #bd6411;
            background: #fff0dc;
        }

        .tenant-portal-action[data-tenant-action="break_lease"] .tenant-portal-action-icon,
        .tenant-portal-icon.break_lease {
            color: #c72d2d;
            background: #ffe4e4;
        }

        .tenant-portal-action[data-tenant-action="maintenance"] .tenant-portal-action-icon,
        .tenant-portal-icon.maintenance {
            color: #6a35be;
            background: #efe3ff;
        }

        .tenant-portal-icon.inspection {
            color: #087a42;
            background: #e4f3e9;
        }

        .tenant-portal-action-copy {
            display: grid;
            gap: 4px;
            min-width: 0;
        }

        .tenant-portal-action-icon svg {
            width: 20px !important;
            height: 20px !important;
            stroke-width: 2;
        }

	        .tenant-portal-action strong {
	            color: inherit;
	            font-size: 11.8px !important;
	            font-weight: 650;
            line-height: 1.25;
        }

	        .tenant-portal-action-copy span {
	            font-size: 10.8px !important;
            line-height: 1.35;
            color: var(--muted);
            font-weight: 400;
        }

        .tenant-portal-action-chevron {
            color: var(--quiet);
        }

        .tenant-portal-status-strip {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 10px;
        }

        .owner-portal-metrics.record-tabs.metric-tabs {
            grid-template-columns: repeat(4, minmax(0, 1fr));
            margin: 0;
        }

        .owner-portal-metrics .record-tab {
            cursor: default;
        }

        .owner-portal-properties {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr));
            gap: 12px;
        }

        .owner-portal-properties.single {
            grid-template-columns: minmax(0, 760px);
        }

        .owner-portal-property-card {
            position: relative;
            display: grid;
            grid-template-columns: 150px minmax(0, 1fr);
            min-height: 132px;
            overflow: hidden;
            border: 1px solid var(--line-soft);
            border-radius: 10px;
            background: #fff;
            color: inherit;
            cursor: pointer;
            transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
        }

        .owner-portal-property-card:hover {
            transform: translateY(-1px);
            border-color: #bfd0c9;
            box-shadow: 0 14px 30px rgba(24, 45, 36, .08);
        }

        .owner-portal-property-card:focus-visible {
            outline: 2px solid rgba(31, 77, 77, .34);
            outline-offset: 2px;
        }

        .owner-portal-property-visual {
            position: relative;
            display: block;
            min-height: 132px;
            background-color: #e9efeb;
            background-position: center;
            background-size: cover;
            text-decoration: none;
        }

        .owner-portal-property-visual span {
            position: absolute;
            left: 10px;
            bottom: 10px;
            padding: 4px 7px;
            border-radius: 999px;
            color: #fff;
            background: rgba(20, 31, 25, .72);
            font-size: 9px;
            font-weight: 700;
            letter-spacing: .02em;
        }

        .owner-portal-property-visual iframe {
            width: 100%;
            height: 100%;
            min-height: 132px;
            border: 0;
            pointer-events: none;
        }

        .owner-portal-property-copy {
            display: grid;
            align-content: center;
            gap: 6px;
            min-width: 0;
            padding: 16px;
        }

        .owner-portal-property-title {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 10px;
        }

        .owner-portal-property-title strong {
            color: var(--ink);
            font-size: 13px;
            line-height: 1.35;
        }

        .owner-portal-property-copy p {
            margin: 0;
            color: var(--muted);
            font-size: 11px;
            line-height: 1.45;
        }

        .owner-portal-property-open {
            display: inline-flex;
            align-items: center;
            gap: 5px;
            margin-top: 3px;
            color: var(--accent);
            font-size: 10.5px;
            font-weight: 650;
        }

        .owner-portal-property-open svg {
            width: 13px !important;
            height: 13px !important;
        }

        .owner-portal-property-modal {
            width: min(880px, calc(100vw - 36px));
        }

        .owner-portal-property-detail {
            overflow: auto;
            padding: 18px;
        }

        .owner-portal-property-detail-hero {
            display: grid;
            grid-template-columns: minmax(240px, .82fr) minmax(0, 1.18fr);
            gap: 18px;
            margin-bottom: 18px;
        }

        .owner-portal-property-detail-hero .owner-portal-property-visual {
            min-height: 220px;
            border-radius: 9px;
            overflow: hidden;
        }

        .owner-portal-property-detail-hero .owner-portal-property-visual iframe {
            min-height: 220px;
        }

        .owner-portal-property-detail-copy {
            display: grid;
            align-content: center;
            gap: 12px;
        }

        .owner-portal-property-detail-copy h3 {
            margin: 0;
            color: var(--ink);
            font-size: 20px;
            line-height: 1.3;
        }

        .owner-portal-property-detail-grid {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 10px;
        }

        .owner-portal-property-detail-grid .tenant-portal-home-stat {
            min-width: 0;
        }

        .owner-portal-pulse {
            padding: 16px;
            border: 1px solid var(--line-soft);
            border-radius: 9px;
            background: #fff;
            box-shadow: 0 14px 30px rgba(19, 30, 26, .04);
        }

        .owner-portal-pulse-grid {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 10px;
            margin-top: 12px;
        }

        .owner-portal-pulse-card {
            min-width: 0;
            display: grid;
            grid-template-columns: 34px minmax(0, 1fr);
            align-items: start;
            gap: 10px;
            padding: 12px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #fbfcfb;
        }

        .owner-portal-pulse-card .tenant-portal-icon {
            width: 34px;
            height: 34px;
        }

        .owner-portal-pulse-card div {
            min-width: 0;
            display: grid;
            gap: 3px;
        }

        .owner-portal-pulse-card strong {
            overflow: hidden;
            color: var(--ink);
            font-size: 11.5px;
            line-height: 1.3;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .owner-portal-pulse-card span {
            color: var(--muted);
            font-size: 10.5px;
            line-height: 1.4;
        }

        .owner-portal-property-detail-sections {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 12px;
            margin-top: 14px;
        }

        .owner-portal-detail-section {
            min-width: 0;
            padding: 13px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #fff;
        }

        .owner-portal-detail-section > strong {
            display: block;
            margin-bottom: 9px;
            color: var(--ink);
            font-size: 12px;
        }

        .owner-portal-detail-row {
            display: grid;
            gap: 2px;
            padding: 8px 0;
            border-top: 1px solid #edf0ee;
        }

        .owner-portal-detail-row:first-of-type {
            padding-top: 0;
            border-top: 0;
        }

        .owner-portal-detail-row b {
            color: var(--ink);
            font-size: 11px;
            font-weight: 600;
        }

        .owner-portal-detail-row span,
        .owner-portal-detail-empty {
            color: var(--muted);
            font-size: 10.5px;
            line-height: 1.4;
        }

        .tenant-portal-stat {
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            padding: 12px;
            background: #fbfcfa;
            display: grid;
            gap: 3px;
        }

        .tenant-portal-stat span {
            color: var(--muted);
            font-size: 11px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .tenant-portal-stat strong {
            color: var(--ink);
            font-size: 20px;
            line-height: 1.15;
            font-weight: 600;
        }

        .tenant-portal-overview {
            display: grid;
            grid-template-columns: minmax(360px, 1.2fr) minmax(280px, .86fr) minmax(320px, 1fr);
            gap: 12px;
        }

        .tenant-portal-home-grid {
            display: grid;
            grid-template-columns: minmax(0, 1.58fr) minmax(315px, .62fr);
            gap: 12px;
            align-items: stretch;
        }

        .tenant-portal-panel.tenant-portal-property-feature {
            min-height: 196px;
            overflow: hidden;
            padding: 16px 18px;
            border-color: rgba(31,77,77,.18);
            background: #fff;
            box-shadow: 0 18px 36px rgba(19, 30, 26, 0.05);
        }

        .tenant-portal-home-left {
            display: grid;
            gap: 14px;
            min-width: 0;
            height: 100%;
        }

        .tenant-portal-hero-top {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            align-items: start;
            gap: 14px;
        }

	        .tenant-portal-hero-kicker {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            margin-bottom: 5px;
            color: #53635d;
            font-size: 10px;
	            font-weight: 650;
            letter-spacing: .03em;
            text-transform: uppercase;
        }

        .tenant-portal-hero-summary {
            display: grid;
            gap: 8px;
        }

        .tenant-portal-location-card {
            min-height: 82px;
            display: grid;
            grid-template-columns: 76px minmax(0, 1fr);
            gap: 12px;
            align-items: center;
            padding: 10px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #fbfdfb;
            color: var(--ink);
            text-decoration: none;
            transition: border-color .16s ease, transform .16s ease;
        }

        .tenant-portal-location-card.has-osm:hover {
            border-color: rgba(31,77,77,.28);
            transform: translateY(-1px);
        }

        .tenant-portal-location-thumb {
            position: relative;
            width: 76px;
            height: 58px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
            border-radius: 7px;
            color: var(--accent);
            background:
                linear-gradient(34deg, transparent 0 44%, rgba(31,77,77,.13) 44% 47%, transparent 47%),
                linear-gradient(135deg, transparent 0 52%, rgba(31,77,77,.12) 52% 55%, transparent 55%),
                #eef6f2;
            background-size: cover;
            background-position: center;
        }

        .tenant-portal-location-card.has-osm .tenant-portal-location-thumb::after {
            content: "";
            position: absolute;
            inset: 0;
            background: rgba(247,251,249,.22);
        }

        .tenant-portal-location-thumb svg {
            width: 20px !important;
            height: 20px !important;
        }

	        .tenant-portal-location-card strong {
            display: block;
            color: var(--ink);
	            font-size: 12px;
	            line-height: 1.25;
	            font-weight: 600;
	        }

        .tenant-portal-location-card span span {
            display: block;
            margin-top: 3px;
            color: var(--muted);
            font-size: 11px;
            line-height: 1.35;
        }

        .tenant-portal-support-stack {
            display: grid;
            gap: 10px;
            height: 100%;
        }

        .tenant-portal-hero-foot {
            display: grid;
            gap: 10px;
            align-items: stretch;
        }

        .tenant-portal-property-content {
            display: grid;
            gap: 14px;
            padding: 0;
            height: 100%;
        }

        .tenant-portal-property-title {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            gap: 12px;
        }

	        .tenant-portal-property-title h3 {
	            margin: 0;
	            color: var(--ink);
	            font-size: 17px;
	            line-height: 1.16;
	            font-weight: 600;
	        }

        .tenant-portal-property-title p {
            margin: 4px 0 0;
            color: var(--muted);
            font-size: 12px;
            line-height: 1.4;
        }

        .tenant-portal-home-stats {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 9px;
        }

        .tenant-portal-home-stat {
            display: grid;
            gap: 3px;
            min-height: 68px;
            padding: 10px 11px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #fbfcfb;
        }

	        .tenant-portal-home-stat span {
            color: var(--muted);
            font-size: 10.5px;
	            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .tenant-portal-home-stat strong {
            color: var(--ink);
            font-size: 13px;
            line-height: 1.25;
        }

        .tenant-portal-support-card {
            min-height: 0;
            align-content: start;
            gap: 10px;
            padding: 14px;
            box-shadow: 0 14px 28px rgba(19, 30, 26, 0.038);
            height: 100%;
        }

        .tenant-portal-agency-mark {
            min-height: 38px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
        }

        .tenant-portal-agency-mark img {
            max-width: 132px;
            max-height: 36px;
            object-fit: contain;
        }

	        .tenant-portal-support-title {
	            color: #596761;
	            font-size: 10px;
	            font-weight: 650;
            letter-spacing: .04em;
            text-transform: uppercase;
            white-space: nowrap;
        }

        .tenant-portal-manager {
            display: grid;
            grid-template-columns: 40px minmax(0, 1fr);
            gap: 11px;
            align-items: center;
            padding: 10px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #fbfcfb;
        }

	        .tenant-portal-manager-avatar {
            width: 40px;
            height: 40px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
            border-radius: 50%;
            color: var(--accent);
            background: var(--accent-soft);
            font-size: 13px;
	            font-weight: 650;
        }

        .tenant-portal-manager-avatar img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

	        .tenant-portal-manager strong {
            display: block;
	            color: var(--ink);
	            font-size: 12px;
	            line-height: 1.25;
	            font-weight: 600;
	        }

        .tenant-portal-manager span {
            display: block;
            margin-top: 2px;
            color: var(--muted);
            font-size: 10.8px;
            line-height: 1.35;
        }

	        .tenant-portal-manager-status {
            display: inline-flex !important;
            width: max-content;
            margin-top: 6px !important;
            padding: 3px 7px;
            border-radius: 999px;
            color: #50615a !important;
            background: #f1f5f2;
            font-size: 9.8px !important;
	            font-weight: 650;
            letter-spacing: .02em;
            text-transform: uppercase;
        }

        .tenant-portal-manager-contact {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            margin-top: 10px;
        }

	        .tenant-portal-manager-contact a,
	        .tenant-portal-manager-contact button {
            min-height: 32px;
            display: inline-flex;
            align-items: center;
            gap: 7px;
            padding: 0 10px;
            border: 1px solid var(--line);
            border-radius: 8px;
            background: #fff;
            color: var(--accent);
            font-size: 11px;
	            font-weight: 650;
            text-decoration: none;
            cursor: pointer;
        }

        .tenant-portal-next-action {
            display: grid;
            grid-template-columns: 36px minmax(0, 1fr) auto;
            gap: 10px;
            align-items: center;
            padding: 11px;
            border: 1px solid #cfe8d8;
            border-radius: 8px;
            background: #f5fbf7;
        }

        .tenant-portal-next-action.is-hero {
            height: 100%;
            min-height: 68px;
            border-color: rgba(31,77,77,.16);
            background: rgba(255,255,255,.8);
        }

        .tenant-portal-support-status {
            width: 100%;
            text-align: left;
            cursor: pointer;
        }

        .tenant-portal-support-status:hover {
            border-color: rgba(31,77,77,.22);
            background: #f0faf4;
        }

	        .tenant-portal-next-action strong {
	            display: block;
	            color: var(--ink);
	            font-size: 12px;
	            font-weight: 600;
	        }

        .tenant-portal-next-action span {
            display: block;
            margin-top: 2px;
            color: var(--muted);
            font-size: 11px;
        }

        .tenant-portal-next-action > .tenant-portal-list-foot {
            width: auto;
            min-height: 0;
            padding: 0;
            justify-content: center;
        }

        .tenant-portal-section-grid {
            display: grid;
            grid-template-columns: minmax(0, 1.1fr) minmax(340px, .9fr);
            gap: 12px;
        }

        .tenant-portal-side-stack {
            display: grid;
            gap: 16px;
        }

        .tenant-portal-panel {
            padding: 16px;
            display: grid;
            gap: 13px;
            align-content: start;
        }

	        .tenant-portal-panel-head strong {
            display: inline-flex;
            align-items: center;
            gap: 8px;
	            font-size: 13px !important;
	        }

        .tenant-portal-panel-head strong svg {
            width: 16px !important;
            height: 16px !important;
            flex: 0 0 auto;
            stroke-width: 1.9;
        }

        .tenant-portal-hero-panel {
            min-height: 278px;
        }

        .tenant-portal-address {
            display: flex;
            flex-direction: column;
            gap: 7px;
        }

	        .tenant-portal-address strong {
	            color: var(--ink);
	            font-size: 13px !important;
	            line-height: 1.18;
	            font-weight: 600;
	        }

        .tenant-portal-address span,
        .tenant-portal-panel p,
        .tenant-portal-list p,
        .tenant-portal-item span {
            color: var(--muted);
            font-size: 11.5px;
            line-height: 1.45;
            margin: 0;
        }

        .tenant-portal-field-grid {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 8px;
        }

        .tenant-portal-field {
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            padding: 9px;
            background: #fbfcfa;
            min-height: 58px;
            display: grid;
            gap: 3px;
            align-content: start;
        }

        .tenant-portal-field span {
            color: var(--muted);
            font-size: 11px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .tenant-portal-field strong {
            color: var(--ink);
            font-size: 12px;
            line-height: 1.35;
            font-weight: 600;
            overflow-wrap: anywhere;
        }

	        .tenant-portal-card-link {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
            width: 100%;
            margin-top: auto;
            padding-top: 14px;
            border: 0;
            border-top: 1px solid var(--line-soft);
            color: var(--accent);
            font-size: 12px !important;
	            font-weight: 650;
            text-decoration: none;
            background: transparent;
            cursor: pointer;
        }

        .tenant-portal-card-link:focus-visible,
        .tenant-portal-list-foot:focus-visible,
        .tenant-portal-attention-item:focus-visible {
            outline: 2px solid rgba(31, 77, 77, 0.28);
            outline-offset: 2px;
            border-radius: 8px;
        }

        .tenant-portal-tenancy-layout {
            display: grid;
            grid-template-columns: minmax(0, 1fr) 190px;
            gap: 20px;
            align-items: center;
        }

	        .tenant-portal-ledger {
	            display: grid;
	            gap: 0;
	            border: 1px solid var(--line-soft);
	            border-radius: 8px;
	            overflow: hidden;
	            background: #fff;
	        }

	        .tenant-portal-ledger-row,
	        .tenant-portal-property-row {
	            display: flex;
	            align-items: center;
	            justify-content: space-between;
	            gap: 12px;
	            color: var(--muted);
	            font-size: 11.7px;
	            line-height: 1.35;
	        }

	        .tenant-portal-ledger-row {
	            min-height: 36px;
	            padding: 8px 10px;
	            border-bottom: 1px solid var(--line-soft);
	        }

	        .tenant-portal-ledger-row:last-child {
	            border-bottom: 0;
	        }

	        .tenant-portal-ledger-row strong,
	        .tenant-portal-property-row strong {
	            color: var(--ink);
	            font-weight: 600;
	            text-align: right;
	        }

	        .tenant-portal-days-ring {
	            --ring: 76%;
	            width: 176px;
	            height: 176px;
            border-radius: 50%;
            display: grid;
            place-items: center;
            background: conic-gradient(var(--accent) var(--ring), #e7ece9 0);
            position: relative;
        }

        .tenant-portal-days-ring::before {
            content: "";
            position: absolute;
            inset: 13px;
            border-radius: 50%;
            background: #fff;
        }

        .tenant-portal-days-ring span {
            position: relative;
            display: grid;
            gap: 2px;
            text-align: center;
            color: var(--muted);
            font-size: 12px;
            line-height: 1.2;
        }

	        .tenant-portal-days-ring strong {
	            color: var(--ink);
	            font-size: 38px;
	            line-height: 1;
	            font-weight: 650;
	        }

        .tenant-portal-good-standing {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
            min-height: 50px;
            padding: 10px 12px;
            border-radius: 8px;
            background: linear-gradient(90deg, #edf8f1 0%, #f5fbf8 100%);
            color: var(--accent);
        }

	        .tenant-portal-good-standing strong {
            display: block;
            font-size: 12px;
	            font-weight: 650;
        }

        .tenant-portal-good-standing > div {
            display: grid;
            grid-template-columns: 22px minmax(0, 1fr);
            column-gap: 10px;
            align-items: center;
        }

        .tenant-portal-good-standing > div span {
            grid-column: 2;
        }

        .tenant-portal-good-standing span {
            display: block;
            margin-top: 2px;
            color: var(--muted);
            font-size: 11px;
        }

        .tenant-portal-property-hero {
            display: grid;
            grid-template-columns: 48px minmax(0, 1fr);
            gap: 12px;
            align-items: center;
        }

        .tenant-portal-property-icon,
        .tenant-portal-doc-icon,
        .tenant-portal-icon {
            width: 42px;
            height: 42px;
            border-radius: 8px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            flex: 0 0 auto;
        }

        .tenant-portal-property-icon {
            width: 48px;
            height: 48px;
            color: #0b5680;
            background: #dbeaf3;
        }

        .tenant-portal-property-icon svg,
        .tenant-portal-doc-icon svg,
        .tenant-portal-icon svg {
            width: 25px !important;
            height: 25px !important;
            stroke-width: 2;
        }

        .tenant-portal-property-facts {
            display: grid;
            gap: 10px;
            padding: 6px 0;
        }

        .tenant-portal-form {
            padding: 16px;
        }

        .tenant-portal-modal-backdrop {
            position: fixed;
            inset: 0;
            z-index: 70;
            display: grid;
            place-items: center;
            padding: 24px;
            background: rgba(22, 33, 29, 0.36);
        }

        .tenant-portal-modal {
            width: min(760px, calc(100vw - 36px));
            max-height: calc(100vh - 48px);
            display: grid;
            grid-template-rows: auto minmax(0, 1fr) auto;
            overflow: hidden;
            border: 1px solid var(--line);
            border-radius: 10px;
            background: #fff;
            box-shadow: 0 28px 86px rgba(18, 32, 28, 0.24);
        }

        .tenant-portal-modal .tenant-portal-form {
            border: 0;
            border-radius: 0;
            box-shadow: none;
            padding: 0;
            min-height: 0;
            display: grid;
            grid-template-rows: auto minmax(0, 1fr) auto;
        }

        .tenant-portal-modal .tenant-portal-form-head,
        .tenant-portal-modal .tenant-portal-submit-row {
            margin: 0;
            padding: 16px 18px;
            border-bottom: 1px solid var(--line-soft);
        }

        .tenant-portal-modal .tenant-portal-submit-row {
            border-top: 1px solid var(--line-soft);
            border-bottom: 0;
            background: #fbfcfa;
        }

	        .tenant-portal-modal .tenant-portal-form-grid {
	            overflow: auto;
	            padding: 18px 18px 24px;
	        }

	        .tenant-portal-inline-vacate-form {
	            border: 0;
	            border-radius: 0;
	            box-shadow: none;
	            padding: 0;
	            background: transparent;
	        }

	        .tenant-portal-form-head {
	            display: flex;
	            align-items: flex-start;
	            justify-content: space-between;
	            gap: 12px;
	            margin-bottom: 14px;
	        }

	        .tenant-portal-form-head strong {
	            display: block;
	            color: var(--ink);
	            font-size: 14px;
	            font-weight: 650;
	            line-height: 1.25;
	        }

	        .tenant-portal-form-head p {
	            margin: 3px 0 0;
	            color: var(--muted);
	            font-size: 11.5px;
	            font-weight: 400;
	            line-height: 1.4;
	        }

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

        .tenant-portal-form-grid .full {
            grid-column: 1 / -1;
        }

        .tenant-portal-cot-person[hidden] {
            display: none !important;
        }

        .tenant-portal-linked-context {
            display: grid;
            gap: 4px;
            padding: 11px 12px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #f7faf8;
        }

	        .tenant-portal-linked-context span {
	            color: var(--muted);
	            font-size: 10.5px;
	            font-weight: 650;
            letter-spacing: .04em;
            text-transform: uppercase;
        }

	        .tenant-portal-linked-context strong {
	            color: var(--ink);
	            font-size: 12.5px;
	            font-weight: 600;
	            line-height: 1.3;
	        }

        .tenant-portal-linked-context small {
            color: var(--muted);
            font-size: 11px;
            line-height: 1.35;
        }

        .tenant-portal-media-input,
        .tenant-portal-signature-box {
            display: grid;
            gap: 8px;
            padding: 12px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #fbfcfb;
        }

	        .tenant-portal-media-input strong,
	        .tenant-portal-signature-box strong {
	            color: var(--ink);
	            font-size: 12px;
	            font-weight: 600;
	            line-height: 1.3;
	        }

        .tenant-portal-media-input span,
        .tenant-portal-signature-box span {
            color: var(--muted);
            font-size: 11px;
            line-height: 1.35;
            font-weight: 500;
        }

        .tenant-portal-media-input input {
            width: 100%;
        }

        .tenant-portal-signature-toolbar {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
        }

        .tenant-portal-signature-toolbar > span {
            display: grid;
            gap: 2px;
        }

        .tenant-portal-signature-toolbar > span > strong,
        .tenant-portal-signature-toolbar > span > span {
            display: block;
        }

        .tenant-portal-signature-canvas {
            width: 100%;
            height: 150px;
            border: 1px solid #dfe8e3;
            border-radius: 8px;
            background:
                linear-gradient(#fff, #fff) padding-box,
                repeating-linear-gradient(0deg, transparent 0 31px, rgba(31,77,77,.08) 31px 32px);
            cursor: crosshair;
            touch-action: none;
        }

	        .tenant-portal-form label {
            display: flex;
            flex-direction: column;
	            gap: 6px;
	            font-size: 11.5px;
	            font-weight: 500;
	            color: var(--ink);
	        }

        .tenant-portal-form input,
        .tenant-portal-form select,
        .tenant-portal-form textarea {
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            min-height: 42px;
	            padding: 9px 10px;
	            font: inherit;
	            font-size: 12px;
	            background: #fff;
	        }

        .tenant-portal-form textarea {
            min-height: 92px;
            resize: vertical;
        }

        .tenant-portal-form .tenant-portal-single-line {
            min-height: 40px;
        }

        .tenant-portal-submit-row {
            display: flex;
            justify-content: flex-end;
            gap: 10px;
            margin-top: 14px;
        }

        .tenant-portal-list {
            padding: 16px;
            overflow: hidden;
            display: grid;
            gap: 10px;
            align-content: start;
        }

        .tenant-portal-list-head {
            background: transparent;
            padding: 0;
            border-bottom: 0;
        }

	        .tenant-portal-list-head a,
	        .tenant-portal-list-head button,
	        .tenant-portal-list-foot {
	            color: var(--accent);
	            font-size: 11.8px !important;
	            font-weight: 650;
            text-decoration: none;
            border: 0;
            background: transparent;
            padding: 0;
            cursor: pointer;
        }

        .tenant-portal-list-foot {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            width: 100%;
            min-height: 34px;
            padding: 2px 0 0;
            border: 0;
            background: transparent;
            font: inherit;
            cursor: pointer;
        }

        .tenant-portal-item {
            display: grid;
            grid-template-columns: 38px minmax(0, 1fr) auto;
            gap: 10px;
            align-items: center;
            padding: 10px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #fff;
        }

        .tenant-portal-maintenance-table {
            display: grid;
            gap: 8px;
        }

        .tenant-portal-maintenance-row {
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #fff;
            overflow: hidden;
        }

        .tenant-portal-maintenance-row summary {
            list-style: none;
            cursor: pointer;
        }

        .tenant-portal-maintenance-row summary::-webkit-details-marker {
            display: none;
        }

        .tenant-portal-maintenance-summary {
            display: grid;
            grid-template-columns: 38px minmax(180px, 1fr) minmax(130px, .48fr) minmax(130px, .48fr) auto auto;
            gap: 10px;
            align-items: center;
            padding: 11px 12px;
        }

	        .tenant-portal-maintenance-summary strong {
            display: block;
            color: var(--ink);
	            font-size: 12.2px;
	            line-height: 1.25;
	            font-weight: 600;
	        }

        .tenant-portal-maintenance-summary small,
        .tenant-portal-maintenance-cell span {
            display: block;
            margin-top: 3px;
            color: var(--muted);
            font-size: 10.8px;
            line-height: 1.35;
        }

        .tenant-portal-maintenance-cell {
            min-width: 0;
        }

	        .tenant-portal-maintenance-cell b {
            display: block;
	            color: var(--ink);
	            font-size: 11.8px;
	            line-height: 1.3;
	            font-weight: 500;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

	        .tenant-portal-maintenance-detail {
	            display: grid;
	            gap: 14px;
	            padding: 0 12px 14px 60px;
	            border-top: 1px solid var(--line-soft);
	            background: #fbfcfb;
	            font-size: 12px;
	            font-weight: 400;
	        }

	        .tenant-portal-maintenance-detail-grid {
	            display: grid;
	            grid-template-columns: repeat(2, minmax(0, 1fr));
	            gap: 0 22px;
	            padding-top: 12px;
	            border-top: 1px solid var(--line-soft);
	        }

	        .tenant-portal-maintenance-field {
	            min-height: 36px;
	            display: flex;
	            align-items: center;
	            justify-content: space-between;
	            gap: 16px;
	            padding: 8px 0;
	            border: 0;
	            border-bottom: 1px solid var(--line-soft);
	            background: transparent;
	        }

	        .tenant-portal-maintenance-field span {
	            color: var(--muted);
	            font-size: 11.5px;
	            font-weight: 400;
	            letter-spacing: 0;
	            text-transform: none;
	        }

	        .tenant-portal-maintenance-field strong {
	            color: var(--ink);
	            font-size: 12px;
	            line-height: 1.35;
	            font-weight: 500;
	            text-align: right;
	            overflow-wrap: anywhere;
	        }

	        .tenant-portal-maintenance-description {
	            margin: 0;
	            color: var(--muted);
	            font-size: 11.5px;
	            line-height: 1.45;
	        }

	        .tenant-portal-maintenance-media {
	            display: grid;
	            gap: 10px;
	        }

	        .tenant-portal-maintenance-subhead {
	            display: flex;
	            align-items: center;
	            justify-content: space-between;
	            gap: 12px;
	            color: var(--ink);
	            font-size: 12px;
	            font-weight: 600;
	        }

	        .tenant-portal-media-grid {
	            display: grid;
	            grid-template-columns: repeat(auto-fill, minmax(138px, 1fr));
	            gap: 8px;
	        }

	        .tenant-portal-media-card {
	            min-height: 96px;
	            display: grid;
	            grid-template-rows: 74px auto;
	            overflow: hidden;
	            border: 1px solid var(--line-soft);
	            border-radius: 8px;
	            background: #fff;
	            color: var(--ink);
	            text-decoration: none;
	        }

	        .tenant-portal-media-card img,
	        .tenant-portal-media-card video,
	        .tenant-portal-media-file {
	            width: 100%;
	            height: 74px;
	            display: grid;
	            place-items: center;
	            object-fit: cover;
	            background: #f1f4f2;
	            color: var(--accent);
	        }

	        .tenant-portal-media-card span:last-child {
	            min-width: 0;
	            padding: 7px 8px;
	            overflow: hidden;
	            color: var(--ink);
	            font-size: 11.2px;
	            font-weight: 500;
	            line-height: 1.25;
	            text-overflow: ellipsis;
	            white-space: nowrap;
	        }

	        .tenant-portal-maintenance-upload {
	            display: grid;
	            gap: 8px;
	        }

	        .tenant-portal-maintenance-upload .record-upload-dropzone {
	            min-height: 74px;
	        }

	        .tenant-portal-maintenance-open {
	            color: var(--accent);
	            font-size: 11px;
	            font-weight: 650;
            white-space: nowrap;
        }

        .tenant-portal-item:last-child {
            border-bottom: 1px solid var(--line-soft);
        }

        .tenant-portal-item-body {
            display: grid;
            gap: 3px;
            min-width: 0;
        }

	        .tenant-portal-item-body strong {
	            color: var(--ink);
	            font-size: 12.2px;
	            font-weight: 650;
	        }

        .tenant-portal-item-meta {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
            margin-top: 8px;
        }

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

        .tenant-portal-work-grid .wide {
            grid-column: 1 / -1;
        }

        .tenant-portal-docs {
            display: grid;
            gap: 0;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            overflow: hidden;
        }

	        .tenant-portal-docs a {
            border: 0;
            border-bottom: 1px solid var(--line-soft);
            border-radius: 0;
            padding: 11px 12px;
            color: var(--ink);
            text-decoration: none;
            font-size: 12px;
	            font-weight: 600;
            background: #fff;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
        }

	        .tenant-portal-docs > .tenant-portal-doc-empty {
            padding: 11px 12px;
            border-bottom: 1px solid var(--line-soft);
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            color: var(--muted);
            font-size: 12px;
	            font-weight: 600;
        }

        .tenant-portal-docs > .tenant-portal-doc-empty:last-child {
            border-bottom: 0;
        }

        .tenant-portal-docs a:last-child {
            border-bottom: 0;
        }

        .tenant-portal-doc-row {
            display: flex;
            align-items: center;
            gap: 10px;
            min-width: 0;
        }

        .tenant-portal-doc-row span {
            display: block;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .tenant-portal-doc-row small {
            display: block;
            margin-top: 2px;
            color: var(--muted);
            font-size: 10.5px;
            font-weight: 500;
        }

        .tenant-portal-doc-icon {
            width: 30px;
            height: 30px;
            color: #087a42;
            background: #e3f5ea;
            display: inline-flex !important;
            align-items: center !important;
            justify-content: center !important;
            line-height: 1;
        }

        .tenant-portal-doc-icon svg {
            width: 16px !important;
            height: 16px !important;
        }

        .tenant-portal-docs a:hover {
            border-color: rgba(31, 77, 77, 0.25);
            color: var(--accent);
            background: #f8fbfa;
        }

        .tenant-portal-form-card {
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: linear-gradient(90deg, #edf8f1 0%, #f7fbf8 100%);
            padding: 12px;
        }

        .tenant-portal-form-card.tenant-portal-card-link {
            margin-top: 0;
            padding: 12px;
            border: 1px solid var(--line-soft);
            background: linear-gradient(90deg, #edf8f1 0%, #f7fbf8 100%);
            color: var(--ink);
            text-align: left;
        }

        .tenant-portal-form-card.tenant-portal-card-link > span:first-child {
            display: grid;
            gap: 2px;
        }

	        .tenant-portal-form-card.tenant-portal-card-link strong {
	            color: var(--ink);
	            font-size: 12px;
	            font-weight: 600;
	        }

        .tenant-portal-form-card.tenant-portal-card-link span span {
            color: var(--muted);
            font-size: 11.5px;
            font-weight: 500;
        }

        .tenant-portal-intro {
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
            gap: 14px;
            padding: 4px 0 0;
        }

	        .tenant-portal-intro h3 {
	            margin: 0;
	            color: var(--ink);
	            font-size: 25px;
	            line-height: 1.18;
	            font-weight: 600;
	        }

        .tenant-portal-intro p {
            margin: 3px 0 0;
            color: var(--muted);
            font-size: 12.5px;
            line-height: 1.4;
        }

	        .tenant-portal-assurance {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            flex: 0 0 auto;
            border: 1px solid #cce8d5;
            border-radius: 8px;
            padding: 7px 10px;
            color: #087a42;
            background: #f4fbf6;
            font-size: 11px;
	            font-weight: 650;
        }

        .tenant-portal-attention {
            grid-column: 1 / -1;
        }

        .tenant-portal-attention-grid {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 10px;
        }

        .tenant-portal-attention-item {
            display: grid;
            grid-template-columns: 34px minmax(0, 1fr) auto;
            gap: 10px;
            align-items: center;
            min-height: 58px;
            padding: 10px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #fbfcfa;
            color: inherit;
            text-align: left;
            cursor: pointer;
        }

        .tenant-portal-attention-item > .tenant-portal-icon {
            width: 34px;
            height: 34px;
            display: inline-flex;
        }

	        .tenant-portal-attention-item strong {
            display: block;
	            color: var(--ink);
	            font-size: 12px;
	            font-weight: 600;
	            line-height: 1.25;
	        }

        .tenant-portal-attention-item span {
            display: block;
            margin-top: 2px;
            color: var(--muted);
            font-size: 11px;
            line-height: 1.35;
        }

        .tenant-portal-progress {
            display: grid;
            gap: 8px;
        }

        .tenant-portal-progress-row {
            display: grid;
            grid-template-columns: 22px minmax(0, 1fr) auto;
            gap: 9px;
            align-items: center;
            padding: 9px 0;
            border-bottom: 1px solid var(--line-soft);
        }

        .tenant-portal-progress-row:last-child {
            border-bottom: 0;
        }

        .tenant-portal-progress-dot {
            width: 22px;
            height: 22px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            color: #087a42;
            background: #e3f5ea;
        }

        .tenant-portal-progress-dot svg {
            width: 14px !important;
            height: 14px !important;
        }

        .tenant-portal-progress-copy {
            min-width: 0;
        }

	        .tenant-portal-progress-copy strong {
            display: block;
	            color: var(--ink);
	            font-size: 11.8px;
	            font-weight: 600;
            line-height: 1.25;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .tenant-portal-progress-copy span {
            display: block;
            margin-top: 2px;
            color: var(--muted);
            font-size: 10.5px;
            line-height: 1.35;
        }

        .tenant-portal-context-note {
            display: flex;
            align-items: center;
            gap: 8px;
            color: var(--muted);
            font-size: 11px;
            line-height: 1.35;
            margin: 0;
            padding: 8px 0 0;
            border-top: 1px solid var(--line-soft);
        }

        .tenant-portal-context-note svg {
            flex: 0 0 auto;
        }

	        .tenant-portal-form-card summary {
            list-style: none;
            cursor: pointer;
	            color: var(--ink);
	            font-size: 12.2px;
	            font-weight: 650;
	        }

        .tenant-portal-form-card summary::-webkit-details-marker {
            display: none;
        }

        .tenant-portal-form-card .tenant-portal-form-card-summary {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
        }

        .tenant-portal-form-card .tenant-portal-form-card-summary span {
            display: block;
            color: var(--muted);
            font-size: 12px;
            font-weight: 500;
            line-height: 1.35;
            margin-top: 2px;
        }

        .tenant-portal-panel-attention {
            outline: 2px solid rgba(31, 77, 77, 0.22);
            outline-offset: 3px;
        }

        /* Tenant portal premium landing experience */
        .tenant-portal-main {
            gap: 18px;
        }

        .tenant-portal-home-grid {
            grid-template-columns: minmax(0, 1.7fr) minmax(330px, .72fr);
            gap: 16px;
        }

        .tenant-portal-panel.tenant-portal-property-feature {
            position: relative;
            min-height: 320px;
            overflow: hidden;
            padding: 0;
            border: 0;
            border-radius: 14px;
            background: var(--tenant-brand, #1f4d4d);
            box-shadow: 0 24px 48px rgba(19, 30, 26, .14);
        }

        .tenant-portal-property-feature::before {
            content: "";
            position: absolute;
            inset: 0;
            background:
                linear-gradient(90deg, rgba(14, 31, 27, .9) 0%, rgba(14, 31, 27, .64) 48%, rgba(14, 31, 27, .14) 100%),
                linear-gradient(0deg, rgba(14, 31, 27, .34), transparent 62%),
                var(--tenant-property-image, linear-gradient(135deg, var(--tenant-brand, #1f4d4d), #71958a));
            background-size: cover;
            background-position: center;
            transform: scale(1.01);
        }

        .tenant-portal-property-feature::after {
            content: "";
            position: absolute;
            inset: 0;
            border-radius: inherit;
            box-shadow: inset 0 0 0 1px rgba(255,255,255,.16);
            pointer-events: none;
        }

        .tenant-portal-property-feature .tenant-portal-property-content {
            position: relative;
            z-index: 1;
            grid-template-rows: 1fr auto;
            gap: 20px;
            min-height: 320px;
            padding: 28px;
        }

        .tenant-portal-property-feature .tenant-portal-property-title h3 {
            max-width: 680px;
            color: #fff;
            font-size: clamp(24px, 2.3vw, 36px);
            line-height: 1.08;
            font-weight: 650;
            letter-spacing: -.025em;
        }

        .tenant-portal-property-feature .tenant-portal-property-title p {
            margin-top: 10px;
            color: rgba(255,255,255,.78);
            font-size: 13px;
        }

        .tenant-portal-property-feature .tenant-portal-hero-kicker {
            margin-bottom: 9px;
            color: rgba(255,255,255,.72);
            font-size: 10.5px;
        }

        .tenant-portal-property-feature .badge {
            color: #fff;
            border-color: rgba(255,255,255,.28);
            background: rgba(255,255,255,.18);
            backdrop-filter: blur(10px);
        }

        .tenant-portal-next-action.is-hero {
            min-height: 76px;
            border-color: rgba(255,255,255,.28);
            background: rgba(255,255,255,.94);
            box-shadow: 0 12px 28px rgba(10, 24, 20, .16);
            backdrop-filter: blur(14px);
        }

        .tenant-portal-panel.tenant-portal-support-card {
            gap: 18px;
            padding: 24px;
            border-radius: 14px;
            box-shadow: 0 20px 42px rgba(19, 30, 26, .075);
        }

        .tenant-portal-support-card .tenant-portal-manager {
            grid-template-columns: 68px minmax(0, 1fr);
            gap: 15px;
            padding: 18px 0;
            border: 0;
            border-top: 1px solid var(--line-soft);
            border-bottom: 1px solid var(--line-soft);
            border-radius: 0;
            background: transparent;
        }

        .tenant-portal-support-card .tenant-portal-manager-avatar {
            width: 68px;
            height: 68px;
            font-size: 19px;
        }

        .tenant-portal-support-card .tenant-portal-manager strong {
            font-size: 16px;
            font-weight: 650;
        }

        .tenant-portal-support-card .tenant-portal-manager span {
            margin-top: 4px;
            font-size: 12px;
        }

        .tenant-portal-support-card .tenant-portal-manager-contact {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 8px;
            margin-top: 0;
        }

        .tenant-portal-support-card .tenant-portal-manager-contact a {
            min-height: 38px;
            justify-content: center;
            border-radius: 9px;
            font-size: 12px;
        }

        .tenant-portal-support-card .tenant-portal-manager-contact a:only-child {
            grid-column: 1 / -1;
        }

        .tenant-portal-support-card .tenant-portal-manager-contact svg {
            width: 16px !important;
            height: 16px !important;
            flex: 0 0 auto;
        }

        .tenant-portal-intro {
            padding: 8px 2px 0;
        }

        .tenant-portal-intro h3 {
            font-size: 29px;
            letter-spacing: -.02em;
        }

        .tenant-portal-intro p {
            margin-top: 6px;
            font-size: 13px;
        }

        @media (max-width: 1100px) {
            .tenant-portal-shell,
            .tenant-portal-home-grid,
            .tenant-portal-hero-foot,
            .tenant-portal-section-grid {
                grid-template-columns: 1fr;
            }

            .tenant-portal-actions,
            .tenant-portal-tab-card-row,
            .tenant-portal-status-strip,
            .tenant-portal-overview,
            .tenant-portal-attention-grid,
            .tenant-portal-work-grid,
            .tenant-portal-maintenance-detail-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

            .tenant-portal-maintenance-summary {
                grid-template-columns: 38px minmax(0, 1fr) minmax(130px, .5fr) auto auto;
            }

            .tenant-portal-maintenance-summary .tenant-portal-maintenance-cell:nth-of-type(3) {
                display: none;
            }

            .tenant-portal-side-stack,
            .tenant-portal-work-grid .wide {
                grid-column: 1 / -1;
            }

            .tenant-portal-overview .tenant-portal-panel:first-child {
                grid-column: 1 / -1;
            }
        }

	        @media (max-width: 720px) {
	            .tenant-portal-tab-toolbar {
	                align-items: flex-start;
	                flex-direction: column;
	            }

	            .tenant-portal-inline-actions,
	            .tenant-portal-inline-action {
	                width: 100%;
	            }

	            .tenant-portal-inline-action {
	                justify-content: center;
	            }

	            .tenant-portal-property-visual,
	            .tenant-portal-home-stats,
	            .tenant-portal-vacate-fields {
	                grid-template-columns: 1fr;
            }

            .tenant-portal-actions,
            .tenant-portal-tab-card-row,
            .tenant-portal-status-strip,
            .tenant-portal-overview,
            .tenant-portal-attention-grid,
            .tenant-portal-work-grid,
            .tenant-portal-field-grid,
            .tenant-portal-form-grid,
            .tenant-portal-maintenance-detail-grid,
            .tenant-portal-maintenance-summary {
                grid-template-columns: 1fr;
            }

            .tenant-portal-item,
            .tenant-portal-maintenance-summary {
                grid-template-columns: 1fr;
            }

            .owner-portal-properties {
                grid-template-columns: 1fr;
            }

            .owner-portal-property-card {
                grid-template-columns: 112px minmax(0, 1fr);
            }

            .owner-portal-property-detail-hero,
            .owner-portal-property-detail-grid,
            .owner-portal-property-detail-sections {
                grid-template-columns: 1fr;
            }

            .owner-portal-pulse-grid {
                grid-template-columns: 1fr 1fr;
            }

            .tenant-portal-maintenance-detail {
                padding: 0 10px 10px;
            }

            .tenant-portal-tenancy-layout {
                grid-template-columns: 1fr;
            }

            .tenant-portal-days-ring {
                justify-self: center;
            }
        }

        .record-field {
            display: grid;
            grid-template-columns: 135px minmax(0, 1fr);
            gap: 12px;
            align-items: start;
            padding: 9px 0;
            border-bottom: 1px solid var(--line-soft);
        }

        .record-field:last-child {
            border-bottom: 0;
        }

        .record-field span:first-child {
            color: var(--muted);
            font-size: 12px;
            font-weight: 300;
        }

        .record-field span:last-child {
            min-width: 0;
            color: var(--ink);
            font-size: 13px;
            font-weight: 300;
            word-break: break-word;
        }

        .tenant-request-full-value-field span:last-child {
            white-space: pre-wrap;
            overflow-wrap: anywhere;
            line-height: 1.5;
        }

        .agency-overview-form {
            display: grid;
            gap: 11px;
        }

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

        #userOverviewForm > .span-2 {
            grid-column: 1 / -1;
        }

        .opportunity-overview-danger {
            display: flex;
            justify-content: flex-start;
            margin-top: 14px;
            padding-top: 14px;
            border-top: 1px solid var(--line);
        }

        .agency-billing-summary { display:grid; gap:14px; }
        .agency-billing-actions { display:flex; flex-wrap:wrap; gap:8px; }
        .agency-middle-panel-head .agency-billing-actions {
            flex: 0 1 auto;
            flex-wrap: nowrap;
            align-items: center;
            min-width: 0;
        }
        .agency-middle-panel-head .agency-middle-tabs {
            min-width: 0;
        }
        .agency-middle-panel-head #openAgencyUserModal {
            flex: 0 0 auto;
        }
        .billing-subscription-card { border:1px solid var(--line); border-radius:10px; padding:14px; background:#fbfcfb; }
        .billing-subscription-head { display:flex; justify-content:space-between; gap:12px; align-items:center; }
        .billing-subscription-head strong { font-size:14px; }
        .billing-meta { color:var(--muted); font-size:12px; margin-top:5px; }
        .billing-invoices { display:grid; gap:0; border:1px solid var(--line); border-radius:10px; overflow:hidden; }
        .billing-invoice-row { display:grid; grid-template-columns:minmax(0,1fr) auto auto; align-items:center; gap:12px; padding:11px 13px; border-top:1px solid var(--line); }
        .billing-invoice-row:first-child { border-top:0; }
        .billing-invoice-row a { color:var(--accent); font-weight:700; text-decoration:none; }
        .billing-empty { color:var(--muted); font-size:13px; padding:4px 0; }
        #agencyBillingPane > .agency-billing-summary { margin-top:14px; }

        .agency-record-setup-form {
            margin-top: 16px;
            padding-top: 14px;
            border-top: 1px solid var(--line-soft);
        }

        .agency-record-setup-form .agency-colour-grid {
            grid-template-columns: repeat(3, minmax(0, 1fr));
        }

        .agency-record-system-fields {
            margin-top: 14px;
            padding-top: 12px;
            border-top: 1px solid var(--line-soft);
        }

        .agency-overview-field {
            display: grid;
            gap: 5px;
            padding-bottom: 10px;
            border-bottom: 1px solid var(--line-soft);
        }

        .agency-overview-field label,
        .agency-overview-field > span:first-child {
            color: var(--muted);
            font-size: 11px;
            font-weight: 500;
            letter-spacing: 0.04em;
            text-transform: uppercase;
        }

        .agency-overview-field input,
        .agency-overview-field select,
        .agency-overview-field textarea {
            width: 100%;
            border: 1px solid var(--line);
            border-radius: 7px;
            background: #ffffff;
            color: var(--ink);
            font: inherit;
            font-size: 13px;
            font-weight: 300;
            outline: none;
            padding: 9px 10px;
        }

        .property-feature-input {
            position: relative;
            display: block;
            width: 100%;
            min-width: 0;
        }

        .property-feature-input svg {
            position: absolute;
            left: 10px;
            top: 50%;
            width: 16px;
            height: 16px;
            color: #60706a;
            pointer-events: none;
            transform: translateY(-50%);
        }

        .property-feature-input input {
            padding-left: 34px;
        }

        .property-overview-divider {
            height: 1px;
            background: var(--line);
            margin: 2px 0 5px;
        }

        .agency-status-select {
            border-color: var(--line);
            color: var(--ink);
            transition: background 0.16s ease, border-color 0.16s ease, color 0.16s ease;
        }

        .agency-status-select.status-active {
            background: #e5f8e9;
            border-color: #91d8a5;
            color: #146236;
        }

        .agency-status-select.status-inactive {
            background: #fbe8e8;
            border-color: #e7baba;
            color: #8a3434;
        }

        .agency-status-select.status-archived {
            background: #e5e8e7;
            border-color: #aab2ae;
            color: #303a36;
        }

        .contact-status-select {
            transition: background 0.16s ease, border-color 0.16s ease, color 0.16s ease;
        }

        .contact-status-select.status-active {
            background: #e5f8e9;
            border-color: #91d8a5;
            color: #146236;
        }

        .contact-status-select.status-inactive {
            background: #fbe8e8;
            border-color: #e7baba;
            color: #8a3434;
        }

        .property-status-select {
            transition: background 0.16s ease, border-color 0.16s ease, color 0.16s ease;
        }

        .property-status-select.status-incoming {
            background: #d9ecff;
            border-color: #a9d5ff;
            color: #19567e;
        }

        .property-status-select.status-current {
            background: #d9f7df;
            border-color: #a8e9b5;
            color: #146236;
        }

        .property-status-select.status-outgoing {
            background: #ffdede;
            border-color: #f3b7b7;
            color: #883131;
        }

        .property-status-select.status-archived {
            background: #edf0ed;
            border-color: #ccd4cf;
            color: #68736d;
        }

        .property-status-select.status-approved {
            background: #d9ecff;
            border-color: #a8d0f5;
            color: #19567e;
        }

        .property-status-select.status-vacating {
            background: #ffe8ad;
            border-color: #efcf7e;
            color: #765000;
        }

        .property-status-select.status-vacated {
            background: #ffdede;
            border-color: #f3b7b7;
            color: #883131;
        }

        .property-status-select.status-tenanted {
            background: #d9f7df;
            border-color: #a8e9b5;
            color: #146236;
        }

        .property-status-select.status-vacant {
            background: #d8ecff;
            border-color: #a8d0f5;
            color: #19567e;
        }

        .property-status-select.status-owner-occupied {
            background: #ffe8ad;
            border-color: #efcf7e;
            color: #765000;
        }

        .property-status-select.status-hot {
            background: #ffdede;
            border-color: #f3b7b7;
            color: #883131;
        }

        .property-status-select.status-warm {
            background: #ffe8ad;
            border-color: #efcf7e;
            color: #765000;
        }

        .property-status-select.status-cold {
            background: #d8ecff;
            border-color: #a8d0f5;
            color: #19567e;
        }

        .property-status-select.status-secured {
            background: #d9f7df;
            border-color: #a8e9b5;
            color: #146236;
        }

        .property-status-select.status-placeholder {
            background: #edf0ed;
            border-color: #ccd4cf;
            color: #68736d;
        }

        .empty-field-value {
            color: #68736d;
            font-weight: 300;
        }

        .opportunity-status-select,
        .opportunity-state-select {
            transition: background 0.16s ease, border-color 0.16s ease, color 0.16s ease;
        }

        .owner-info-group {
            display: grid;
            gap: 9px;
            padding: 12px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #fbfbf8;
        }

        details.owner-info-group {
            display: block;
        }

        .owner-info-summary {
            list-style: none;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            cursor: pointer;
            margin: -2px 0 0;
        }

        .owner-info-summary::-webkit-details-marker {
            display: none;
        }

        .owner-info-summary h3 {
            margin: 0;
        }

        .owner-info-chevron {
            width: 24px;
            height: 24px;
            border: 1px solid var(--line-soft);
            border-radius: 999px;
            background: #ffffff;
            color: var(--muted);
            display: grid;
            place-items: center;
            transition: transform 150ms ease, color 150ms ease, border-color 150ms ease;
            flex: 0 0 auto;
        }

        .owner-info-chevron svg {
            width: 14px;
            height: 14px;
        }

        details.owner-info-group[open] .owner-info-chevron {
            transform: rotate(90deg);
            color: var(--accent);
            border-color: rgba(31, 77, 77, 0.24);
        }

        .owner-info-body {
            display: grid;
            gap: 9px;
            padding-top: 10px;
        }

        .owner-info-group h3 {
            margin: 0;
            color: var(--ink);
            font-size: 13px;
            line-height: 1.2;
            font-weight: 400;
        }

        .owner-info-group > .agency-overview-field:last-child {
            border-bottom: 0;
            padding-bottom: 0;
        }

        .pipeline-subsection {
            display: grid;
            gap: 9px;
            padding-top: 2px;
        }

        .pipeline-subsection h3 {
            margin: 0;
            color: var(--ink);
            font-size: 13px;
            line-height: 1.2;
            font-weight: 400;
        }

        .pipeline-tag-select {
            display: flex;
            flex-wrap: wrap;
            gap: 7px;
        }

        .pipeline-tag-option {
            border: 1px solid var(--line);
            border-radius: 999px;
            background: #ffffff;
            color: var(--muted);
            cursor: pointer;
            font: inherit;
            font-size: 12px;
            font-weight: 400;
            padding: 7px 10px;
            transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
        }

        .pipeline-tag-option.selected {
            background: var(--accent-soft);
            border-color: rgba(31, 77, 77, 0.35);
            color: var(--accent);
        }

        .opportunity-source-select .pipeline-tag-option,
        .opportunity-region-select .pipeline-tag-option,
        .opportunity-crm-select .pipeline-tag-option,
        .opportunity-contact-type-select .pipeline-tag-option,
        .opportunity-role-select .pipeline-tag-option {
            border-radius: 7px;
        }

        .opportunity-contact-type-select .pipeline-tag-option[data-contact-type-option="primary"].selected {
            background: #d9f7df;
            border-color: rgba(20, 98, 54, 0.28);
            color: #146236;
        }

        .opportunity-contact-type-select .pipeline-tag-option[data-contact-type-option="decision_maker"].selected {
            background: #ffe8ad;
            border-color: rgba(118, 80, 0, 0.28);
            color: #765000;
        }

        .opportunity-contact-type-select .pipeline-tag-option[data-contact-type-option="associated"].selected {
            background: #edf0ed;
            border-color: rgba(104, 115, 109, 0.28);
            color: #68736d;
        }

        .opportunity-tag-create {
            display: flex;
            align-items: center;
            gap: 7px;
            flex: 1 1 220px;
            min-width: min(260px, 100%);
        }

        .opportunity-tag-create input {
            min-width: 0;
            height: 32px;
            padding: 6px 9px;
            font-size: 12px;
        }

        .opportunity-tag-create button {
            flex: 0 0 auto;
            border: 1px solid rgba(31, 77, 77, 0.25);
            border-radius: 7px;
            background: var(--accent-soft);
            color: var(--accent);
            cursor: pointer;
            font: inherit;
            font-size: 12px;
            font-weight: 500;
            padding: 7px 10px;
        }

        .tenant-request-tag-create {
            display: flex;
            align-items: center;
            gap: 7px;
            flex: 1 1 220px;
            min-width: min(260px, 100%);
        }

        .tenant-request-tag-create input {
            min-width: 0;
            height: 32px;
            padding: 6px 9px;
            font-size: 12px;
        }

        .tenant-request-tag-create button {
            flex: 0 0 auto;
            border: 1px solid rgba(31, 77, 77, 0.25);
            border-radius: 7px;
            background: var(--accent-soft);
            color: var(--accent);
            cursor: pointer;
            font: inherit;
            font-size: 12px;
            font-weight: 500;
            padding: 7px 10px;
        }

        .pipeline-field-row {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 10px;
            align-items: stretch;
        }

        .pipeline-field-row.three-col {
            grid-template-columns: repeat(3, minmax(0, 1fr));
        }

        .property-overview-features-manager-row {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 10px;
            align-items: stretch;
        }

        .property-overview-compact-features {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 7px;
            min-width: 0;
        }

        .property-overview-manager-field,
        .property-overview-manager-field > .agency-overview-field {
            min-width: 0;
            height: 100%;
        }

        .pipeline-field-row .agency-overview-field {
            height: 100%;
        }

        .pipeline-attachment-field {
            display: grid;
            gap: 8px;
            transition: border-color 0.15s ease, background 0.15s ease;
        }

        .pipeline-attachment-field:focus-within {
            border-color: var(--accent);
            box-shadow: 0 0 0 3px rgba(31, 77, 77, 0.10);
        }

        .pipeline-attachment-field.dragging {
            border-color: var(--accent);
            background: var(--accent-soft);
        }

        .pipeline-attachment-field.uploading {
            border-color: var(--accent);
            background: var(--accent-soft);
            pointer-events: none;
        }

        .pipeline-attachment-field.has-file {
            min-height: 0;
            place-items: start;
            text-align: left;
            padding: 10px;
        }

        .pipeline-attachment-field.empty .pipeline-upload-action {
            display: none;
        }

        .pipeline-attachment-field input[type="file"] {
            position: absolute;
            width: 1px;
            height: 1px;
            opacity: 0;
            pointer-events: none;
        }

        .pipeline-upload-action {
            justify-self: start;
            border: 1px solid #b8c9c4;
            border-radius: 7px;
            background: #f7fbf9;
            color: var(--accent);
            padding: 7px 10px;
            font-size: 12px;
            font-weight: 400;
            cursor: pointer;
        }

        .pipeline-upload-action:hover {
            background: var(--accent-soft);
            border-color: var(--accent);
        }

        .pipeline-attachment-preview {
            display: grid;
            grid-template-columns: minmax(0, 1fr);
            gap: 9px;
            align-items: start;
            min-height: 58px;
            position: relative;
        }

        .pipeline-attachment-preview.has-file {
            width: 74px;
            min-height: 74px;
        }

        .pipeline-attachment-thumb {
            width: 74px;
            height: 74px;
            border: 1px solid var(--line);
            border-radius: 8px;
            background: #ffffff;
            display: grid;
            place-items: center;
            overflow: hidden;
            color: var(--muted);
            font-size: 10px;
            font-weight: 500;
            text-transform: uppercase;
        }

        .pipeline-attachment-thumb img,
        .pipeline-attachment-thumb iframe,
        .pipeline-attachment-thumb video {
            width: 100%;
            height: 100%;
            border: 0;
            background: #ffffff;
            pointer-events: none;
        }

        .pipeline-attachment-thumb img,
        .pipeline-attachment-thumb video {
            object-fit: cover;
        }

        .pipeline-attachment-file-icon {
            width: 44px;
            height: 54px;
            border: 1px solid #cfdcd7;
            border-radius: 6px;
            background: linear-gradient(135deg, #ffffff 0 72%, #e8f1ee 72% 100%);
            color: var(--accent);
            display: grid;
            place-items: center;
            font-size: 10px;
            font-weight: 500;
        }

        .pipeline-attachment-preview > a,
        .pipeline-attachment-preview > .pipeline-attachment-thumb {
            min-width: 0;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
            color: var(--ink);
            font-size: 13px;
            font-weight: 300;
            text-decoration: none;
        }

        .pipeline-attachment-preview:hover .pipeline-attachment-hover-card,
        .pipeline-attachment-preview:focus-within .pipeline-attachment-hover-card {
            opacity: 1;
            pointer-events: auto;
            transform: translateY(0);
        }

        .pipeline-attachment-hover-card {
            position: absolute;
            left: 0;
            top: calc(100% + 8px);
            width: min(340px, calc(100vw - 48px));
            z-index: 60;
            border: 1px solid #d8e3df;
            border-radius: 9px;
            background: #ffffff;
            box-shadow: 0 18px 36px rgba(28, 43, 38, 0.18);
            padding: 10px;
            opacity: 0;
            pointer-events: none;
            transform: translateY(-3px);
            transition: opacity 140ms ease, transform 140ms ease;
        }

        .pipeline-attachment-hover-card::before {
            content: "";
            position: absolute;
            left: 16px;
            top: -6px;
            width: 10px;
            height: 10px;
            background: #ffffff;
            border-left: 1px solid #d8e3df;
            border-top: 1px solid #d8e3df;
            transform: rotate(45deg);
        }

        .pipeline-attachment-hover-media {
            width: 100%;
            height: 178px;
            border-radius: 7px;
            border: 1px solid var(--line);
            background: #f7f8f6;
            display: grid;
            place-items: center;
            overflow: hidden;
        }

        .pipeline-attachment-hover-media img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            background: #ffffff;
        }

        .pipeline-attachment-hover-media iframe,
        .pipeline-attachment-hover-media video {
            width: 100%;
            height: 100%;
            border: 0;
            background: #ffffff;
        }

        .pipeline-attachment-hover-file {
            width: 74px;
            height: 74px;
            border-radius: 10px;
            border: 1px solid #cfdcd7;
            background: #eef5f2;
            color: var(--accent);
            display: grid;
            place-items: center;
            font-size: 13px;
            font-weight: 500;
            text-transform: uppercase;
        }

        .pipeline-attachment-hover-actions {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            margin-top: 9px;
        }

        .pipeline-attachment-open {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            border: 1px solid #9cc6e8;
            border-radius: 999px;
            background: #eff8ff;
            color: #155c98;
            padding: 6px 9px;
            font-size: 12px;
            font-weight: 400;
            text-decoration: none;
        }

        .pipeline-attachment-open svg {
            width: 14px;
            height: 14px;
            color: #155c98;
        }

        .pipeline-attachment-preview.empty {
            grid-template-columns: minmax(0, 1fr);
            min-height: 0;
            align-items: center;
            justify-items: center;
        }

        .pipeline-attachment-preview.uploading {
            grid-template-columns: minmax(0, 1fr);
            min-height: 0;
            color: var(--accent);
        }

        .opportunity-region-create {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto auto;
            gap: 6px;
            align-items: center;
        }

        .opportunity-region-create[hidden] {
            display: none;
        }

        .opportunity-region-create button {
            min-height: 28px;
            padding: 4px 8px;
            border: 1px solid rgba(31, 77, 77, 0.25);
            border-radius: 7px;
            background: var(--accent-soft);
            color: var(--accent);
            font: inherit;
            cursor: pointer;
        }

        .opportunity-region-create button.subtle {
            background: #ffffff;
            color: var(--muted);
        }

        .pipeline-signature-placeholder {
            min-height: 64px;
            display: flex;
            align-items: center;
            justify-content: center;
            border: 1px dashed var(--line);
            border-radius: 8px;
            background: #ffffff;
            color: var(--muted);
            font-size: 13px;
            font-weight: 300;
            text-align: center;
            padding: 12px;
        }

        .pipeline-steps {
            display: grid;
            gap: 12px;
        }

        .pipeline-step {
            border: 1px solid var(--line-soft);
            border-radius: 9px;
            background: #fbfbf8;
            overflow: hidden;
        }

        .pipeline-step.locked {
            opacity: 0.7;
        }

        .pipeline-step.collapsed .pipeline-step-body {
            display: none;
        }

        .pipeline-step-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
            padding: 12px 13px;
            border-bottom: 1px solid var(--line-soft);
            background: #ffffff;
        }

        .pipeline-step-toggle {
            width: 100%;
            border: 0;
            background: transparent;
            color: inherit;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
            padding: 0;
            font: inherit;
            text-align: left;
            cursor: pointer;
        }

        .pipeline-step-header-main {
            min-width: 0;
            display: flex;
            align-items: center;
            gap: 10px;
        }

        .pipeline-step-chevron {
            width: 22px;
            height: 22px;
            border-radius: 999px;
            border: 1px solid var(--line);
            display: grid;
            place-items: center;
            color: var(--muted);
            background: #ffffff;
            transform: rotate(90deg);
            transition: transform 0.15s ease;
        }

        .pipeline-step.collapsed .pipeline-step-chevron {
            transform: rotate(0deg);
        }

        .pipeline-step-chevron svg {
            width: 13px;
            height: 13px;
        }

        .pipeline-step-title {
            min-width: 0;
            display: grid;
            gap: 2px;
        }

        .pipeline-step-title strong {
            color: var(--ink);
            font-size: 13px;
            font-weight: 500;
        }

        .pipeline-step-title span {
            color: var(--muted);
            font-size: 11px;
            font-weight: 300;
        }

        .pipeline-step-status {
            flex: 0 0 auto;
            border-radius: 999px;
            padding: 4px 9px;
            border: 1px solid var(--line);
            background: #ffffff;
            color: var(--muted);
            display: inline-flex;
            align-items: center;
            gap: 5px;
            font-size: 11px;
            font-weight: 500;
        }

        .pipeline-step-status.active {
            background: #dcfce7;
            border-color: #86efac;
            color: #166534;
        }

        .pipeline-step-status.complete {
            background: #dcfce7;
            border-color: #86efac;
            color: #166534;
        }

        .pipeline-step-status.complete::before {
            content: "\2713";
            display: inline-grid;
            place-items: center;
            width: 14px;
            height: 14px;
            border-radius: 999px;
            background: #16a34a;
            color: #ffffff;
            font-size: 9px;
            font-weight: 700;
            line-height: 1;
        }

        .pipeline-step-status.progress {
            background: #fff7ed;
            border-color: #fed7aa;
            color: #9a3412;
        }

        .pipeline-step-status.declined {
            background: #fee2e2;
            border-color: #fca5a5;
            color: #991b1b;
        }

        .pipeline-step-body {
            display: grid;
            gap: 11px;
            padding: 12px;
        }

        .record-workflow-divider {
            height: 1px;
            margin: 2px 0;
            background: var(--line-soft);
        }

        .record-workflow-substep { border:1px solid var(--line-soft); border-radius:8px; background:#fff; overflow:hidden; }
        .record-workflow-substep > summary { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:9px 10px; color:var(--ink); font-size:11px; font-weight:600; cursor:pointer; list-style:none; background:#fafbf9; }
        .record-workflow-substep > summary::-webkit-details-marker { display:none; }
        .record-workflow-substep-chevron { display:grid; place-items:center; width:18px; height:18px; color:var(--muted); transition:transform .16s ease; }
        .record-workflow-substep-chevron svg { width:14px; height:14px; }
        .record-workflow-substep[open] .record-workflow-substep-chevron { transform:rotate(90deg); }
        .record-workflow-substep-body { display:grid; gap:10px; padding:10px; border-top:1px solid var(--line-soft); }

        .proposal-fee-list {
            display: grid;
            gap: 8px;
        }

        .proposal-fee-row {
            display: grid;
            grid-template-columns: minmax(0, 1.2fr) 72px minmax(90px, 0.8fr) 32px;
            gap: 8px;
            align-items: center;
        }

        .proposal-fee-row input,
        .proposal-rent-input .proposal-fee-value input,
        .proposal-note-field textarea {
            width: 100%;
            border: 1px solid var(--line);
            border-radius: 7px;
            background: #ffffff;
            color: var(--ink);
            font: inherit;
            font-size: 13px;
            font-weight: 300;
            outline: none;
            padding: 9px 10px;
        }

        .proposal-fee-type {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 4px;
            padding: 3px;
            border: 1px solid var(--line);
            border-radius: 7px;
            background: #ffffff;
        }

        .proposal-fee-type button {
            height: 30px;
            border: 0;
            border-radius: 5px;
            background: transparent;
            color: var(--muted);
            font: inherit;
            font-size: 13px;
            font-weight: 500;
            cursor: pointer;
        }

        .proposal-fee-type button.active {
            background: var(--accent);
            color: #ffffff;
        }

        .proposal-fee-value {
            position: relative;
            display: block;
            width: 100%;
            min-width: 0;
        }

        .proposal-fee-value input {
            width: 100%;
            min-width: 0;
            box-sizing: border-box;
            padding-left: 30px;
            font-variant-numeric: tabular-nums;
        }

        .proposal-fee-value.amount input {
            padding-left: 30px;
            padding-right: 10px;
        }

        .proposal-fee-value.percent input {
            padding-left: 10px;
            padding-right: 30px;
        }

        .proposal-fee-symbol {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            color: var(--muted);
            font-size: 13px;
            font-weight: 500;
            pointer-events: none;
        }

        .proposal-fee-value.amount .proposal-fee-symbol {
            left: 11px;
        }

        .proposal-fee-value.percent .proposal-fee-symbol {
            right: 11px;
        }

        .proposal-fee-remove,
        .proposal-fee-add,
        .proposal-decision-button {
            border: 1px solid var(--line);
            border-radius: 7px;
            background: #ffffff;
            color: var(--ink);
            font: inherit;
            font-size: 12px;
            font-weight: 400;
            cursor: pointer;
        }

        .proposal-fee-remove {
            width: 32px;
            height: 32px;
            display: grid;
            place-items: center;
            color: #991b1b;
        }

        .proposal-fee-add {
            justify-self: start;
            padding: 7px 10px;
        }

        .proposal-income-panel {
            display: grid;
            gap: 12px;
            padding: 12px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #ffffff;
        }

        .proposal-income-top {
            display: grid;
            gap: 10px;
        }

        .proposal-rent-value {
            position: relative;
            display: grid;
            grid-template-columns: minmax(140px, 1fr) auto;
            gap: 8px;
            align-items: center;
            min-width: 0;
        }

        .proposal-rent-value input {
            grid-column: 1;
            width: 100%;
            min-width: 0;
            box-sizing: border-box;
            border: 1px solid var(--line);
            border-radius: 7px;
            background: #ffffff;
            color: var(--ink);
            font: inherit;
            font-size: 13px;
            font-weight: 300;
            outline: none;
            padding-left: 34px;
            padding-right: 10px;
            padding-top: 9px;
            padding-bottom: 9px;
            min-height: 38px;
            font-variant-numeric: tabular-nums;
        }

        .proposal-rent-value .proposal-fee-symbol {
            left: 13px;
            top: 19px;
        }

        .proposal-rent-value .income-performance-badge {
            grid-column: 2;
            position: static;
            transform: none;
            max-width: 160px;
            overflow: visible;
            text-overflow: clip;
        }

        .proposal-income-summary {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 8px;
        }

        .proposal-income-stat {
            display: grid;
            gap: 3px;
            border: 1px solid var(--line-soft);
            border-radius: 7px;
            background: #f7fbf9;
            padding: 8px;
        }

        .proposal-income-stat span {
            color: var(--muted);
            font-size: 11px;
            font-weight: 400;
        }

        .proposal-income-stat strong {
            color: var(--accent);
            font-size: 16px;
            font-weight: 500;
        }

        .income-performance-badge {
            border-radius: 999px;
            border: 1px solid var(--line);
            padding: 5px 9px;
            background: #edf0ed;
            color: #68736d;
            font-size: 11px;
            font-weight: 500;
            white-space: nowrap;
        }

        .income-performance-badge.unacceptable {
            border-color: #fca5a5;
            background: #fee2e2;
            color: #991b1b;
        }

        .income-performance-badge.acceptable {
            border-color: #86efac;
            background: #dcfce7;
            color: #166534;
        }

        .income-performance-badge.high-performing {
            border-color: #93c5fd;
            background: #dbeafe;
            color: #1d4ed8;
        }

        .proposal-comparison-card {
            display: grid;
            gap: 9px;
            padding: 10px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #ffffff;
        }

        details.proposal-comparison-card {
            display: block;
        }

        .proposal-comparison-card h4 {
            margin: 0;
            color: var(--ink);
            font-size: 12px;
            font-weight: 500;
        }

        .proposal-comparison-card .owner-info-body {
            padding-top: 9px;
        }

        .proposal-decision-row {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 8px;
        }

        .proposal-decision-button {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 7px;
            padding: 9px 10px;
        }

        .proposal-decision-button svg {
            width: 15px;
            height: 15px;
            flex: 0 0 auto;
            stroke-width: 2;
        }

        .proposal-decision-button.accept {
            border-color: #86efac;
            background: #dcfce7;
            color: #166534;
        }

        .proposal-decision-button.decline {
            border-color: #fca5a5;
            background: #fee2e2;
            color: #991b1b;
        }

        .proposal-share-panel {
            display: grid;
            gap: 8px;
            padding: 10px;
            border: 1px solid #d8e3df;
            border-radius: 8px;
            background: #f7fbf9;
        }

        .proposal-share-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            align-items: center;
        }

        .proposal-share-output {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto auto;
            gap: 8px;
            align-items: center;
        }

        .proposal-share-output[hidden] {
            display: none !important;
        }

        .proposal-share-output input {
            width: 100%;
            min-height: 36px;
            border: 1px solid var(--line);
            border-radius: 7px;
            background: #ffffff;
            color: var(--ink);
            font: inherit;
            font-size: 12px;
            font-weight: 300;
            padding: 8px 10px;
        }

        .proposal-share-output a {
            min-height: 36px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            text-decoration: none;
        }

        .proposal-share-note {
            color: var(--muted);
            font-size: 12px;
            font-weight: 300;
        }

        .pipeline-checklist {
            display: grid;
            gap: 7px;
        }

        .pipeline-checklist-row {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            gap: 10px;
            align-items: center;
            color: var(--ink);
            font-size: 12px;
            font-weight: 300;
        }

        .pipeline-check-badge {
            border-radius: 999px;
            padding: 3px 8px;
            border: 1px solid var(--line);
            background: #edf0ed;
            color: #596660;
            font-size: 11px;
            font-weight: 500;
        }

        .pipeline-check-badge.complete {
            background: #dcfce7;
            border-color: #86efac;
            color: #166534;
        }

        @media (max-width: 720px) {
            .pipeline-field-row,
            .pipeline-field-row.three-col {
                grid-template-columns: minmax(0, 1fr);
            }

            .property-overview-features-manager-row {
                grid-template-columns: minmax(0, 1fr);
            }

            .proposal-fee-row,
            .proposal-decision-row {
                grid-template-columns: minmax(0, 1fr);
            }

            .proposal-rent-value,
            .record-content .proposal-rent-value {
                grid-template-columns: minmax(0, 1fr);
            }

            .proposal-rent-value .income-performance-badge {
                grid-column: 1;
                justify-self: start;
            }

            .proposal-fee-remove {
                width: 100%;
            }
        }

        .agency-overview-field input,
        .agency-overview-field select {
            height: 38px;
        }

        .agency-overview-field textarea {
            min-height: 92px;
            resize: vertical;
        }

        .agency-overview-field textarea.tenant-request-autogrow {
            min-height: 62px;
            overflow: hidden;
            resize: none;
        }

        .opportunity-overview-row,
        .contact-overview-row {
            display: grid;
            grid-template-columns: repeat(var(--overview-row-columns, 2), minmax(0, 1fr));
            gap: 12px;
        }

        .contact-overview-placeholder {
            min-width: 0;
        }

        .contact-type-opportunity-name {
            color: var(--muted);
            font-size: 11px;
            margin-top: 2px;
        }

        .supplier-compliance-card {
            display: grid;
            gap: 12px;
            border: 1px solid var(--line);
            border-radius: 8px;
            background: #f8faf8;
            padding: 12px;
        }

        .supplier-compliance-card .record-panel-head {
            padding: 0;
            min-height: auto;
            border-bottom: 0;
        }

        .supplier-compliance-card .document-uploader {
            padding-bottom: 0;
            border-bottom: 0;
        }

        .supplier-compliance-document {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            min-height: 38px;
            border: 1px solid var(--line);
            border-radius: 7px;
            background: #ffffff;
            padding: 9px 10px;
            font-size: 13px;
            font-weight: 300;
        }

        .supplier-compliance-note {
            color: var(--muted);
            font-size: 12px;
            line-height: 1.5;
            margin: 0;
        }

        .opportunity-overview-readonly {
            min-height: 38px;
            display: flex;
            align-items: center;
            border: 1px solid var(--line);
            border-radius: 7px;
            background: #f8faf8;
            color: var(--ink);
            font-size: 13px;
            font-weight: 300;
            padding: 9px 10px;
        }

        .editable-with-action {
            position: relative;
            display: flex;
            align-items: center;
            width: 100%;
        }

        .editable-with-action input {
            padding-right: 44px;
        }

        .open-url-button {
            position: absolute;
            right: 7px;
            width: 26px;
            height: 26px;
            border-radius: 999px;
            border: 1px solid #1d4ed8;
            display: grid;
            place-items: center;
            background: #dbeafe;
            color: #1d4ed8;
            text-decoration: none;
            box-shadow: 0 5px 14px rgba(37,99,235,0.10);
            transition: transform 0.14s ease, background 0.14s ease, border-color 0.14s ease, box-shadow 0.14s ease;
        }

        .open-url-button:hover,
        .open-url-button:focus {
            background: #bfdbfe;
            border-color: #1e40af;
            color: #1e40af;
            box-shadow: 0 7px 18px rgba(37,99,235,0.16);
            outline: 0;
            transform: translateY(-1px);
        }

        .open-url-button[hidden] {
            display: none !important;
        }

        .open-url-button svg {
            width: 14px;
            height: 14px;
        }

        @media (max-width: 720px) {
            .opportunity-overview-row,
            .contact-overview-row {
                grid-template-columns: minmax(0, 1fr);
            }
        }

        .address-lookup,
        .abn-lookup {
            position: relative;
            display: grid;
            gap: 7px;
        }

        .address-input-shell,
        .abn-input-shell {
            position: relative;
            display: flex;
            align-items: center;
            width: 100%;
            min-width: 0;
        }

        .currency-input-shell {
            position: relative;
            display: flex;
            align-items: center;
            width: 100%;
            min-width: 0;
        }

        .currency-input-shell > span {
            position: absolute;
            left: 12px;
            z-index: 1;
            color: #667085;
            font-size: 13px;
            pointer-events: none;
        }

        .currency-input-shell > input {
            width: 100%;
            padding-left: 28px !important;
        }

        .address-input-shell svg,
        .abn-input-shell svg {
            position: absolute;
            left: 12px;
            width: 16px;
            height: 16px;
            color: var(--muted);
            pointer-events: none;
        }

        .address-lookup input,
        .abn-lookup input {
            width: 100%;
            min-width: 0;
            min-height: 38px;
            box-sizing: border-box;
            padding-left: 42px;
            background: #ffffff;
            border-color: var(--line);
            font-size: 13px;
            font-weight: 300;
        }

        .address-lookup .address-input-shell input,
        .abn-lookup .abn-input-shell input {
            padding-left: 42px;
        }

        .address-lookup .address-input-shell input {
            padding-right: 74px;
        }

        .address-clear-button {
            position: absolute;
            right: 38px;
            z-index: 2;
            display: inline-grid;
            place-items: center;
            width: 24px;
            height: 24px;
            padding: 0;
            color: #667085;
            border: 1px solid #d0d5dd;
            border-radius: 999px;
            background: #ffffff;
            cursor: pointer;
        }

        .address-clear-button:hover,
        .address-clear-button:focus-visible {
            color: #b42318;
            border-color: #f1b4ad;
            background: #fff5f4;
        }

        .address-clear-button svg {
            position: static;
            left: auto;
            width: 13px;
            height: 13px;
            color: currentColor;
            pointer-events: none;
        }

        .address-clear-button[hidden] {
            display: none !important;
        }

        .abn-lookup .abn-input-shell input {
            padding-right: 74px;
        }

        .abn-field-link {
            position: absolute;
            right: 38px;
            top: 50%;
            z-index: 2;
            display: inline-grid;
            place-items: center;
            width: 24px;
            height: 24px;
            transform: translateY(-50%);
            color: #1d4ed8;
            border: 1px solid #bfd0ec;
            border-radius: 50%;
            background: #f5f8ff;
            font-size: 13px;
            font-weight: 600;
            line-height: 1;
            text-decoration: none;
        }

        .abn-field-link:hover,
        .abn-field-link:focus {
            color: #1e40af;
            outline: 0;
            border-color: #1d4ed8;
            background: #eef4ff;
            text-decoration: none;
        }

        .abn-field-link[hidden],
        .abn-input-shell.abn-editing .abn-field-link {
            display: none !important;
        }

        .address-lookup input:focus,
        .abn-lookup input:focus {
            border-color: var(--accent);
            box-shadow: 0 0 0 3px rgba(31,77,77,0.11);
        }

        .address-results,
        .abn-results {
            position: absolute;
            left: 0;
            right: 0;
            top: calc(100% + 6px);
            z-index: 35;
            background: #ffffff;
            border: 1px solid var(--line);
            border-radius: 8px;
            box-shadow: 0 18px 60px rgba(30,39,36,0.14);
            overflow: hidden;
            max-height: 240px;
            overflow-y: auto;
        }

        .address-results[hidden],
        .abn-results[hidden] {
            display: none !important;
        }

        .address-option,
        .address-empty,
        .abn-option,
        .abn-empty {
            width: 100%;
            border: 0;
            background: #ffffff;
            color: var(--ink);
            text-align: left;
            padding: 10px 12px;
            font: inherit;
            font-size: 13px;
            font-weight: 300;
        }

        .address-option,
        .abn-option {
            display: grid;
            gap: 3px;
            cursor: pointer;
            border-bottom: 1px solid var(--line-soft);
        }

        .address-option:last-child,
        .abn-option:last-child {
            border-bottom: 0;
        }

        .address-option:hover,
        .address-option:focus,
        .abn-option:hover,
        .abn-option:focus {
            background: var(--accent-soft);
            outline: 0;
        }

        .address-option strong,
        .abn-option strong {
            font-size: 13px;
            font-weight: 400;
            color: var(--ink);
        }

        .address-option span,
        .address-empty,
        .abn-option span,
        .abn-empty {
            font-size: 12px;
            font-weight: 300;
            color: var(--muted);
        }

        .address-empty,
        .abn-empty {
            color: var(--muted);
        }

        .abn-empty a {
            color: #2563eb;
            font-weight: 400;
            text-decoration: none;
        }

        .abn-empty a:hover,
        .abn-empty a:focus {
            text-decoration: underline;
        }

        .verified-address,
        .verified-abn {
            display: flex;
            align-items: center;
            gap: 8px;
            min-width: 0;
            color: #146236;
            font-size: 12px;
            font-weight: 300;
        }

        .verified-abn {
            color: #1d4ed8;
        }

        .verified-address[hidden],
        .verified-abn[hidden] {
            display: none !important;
        }

        .verified-address svg,
        .verified-abn svg {
            width: 15px;
            height: 15px;
            flex: 0 0 auto;
        }

        .verified-address span,
        .verified-abn span {
            min-width: 0;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }

        .verified-abn a {
            color: #1d4ed8;
            font-weight: 400;
            text-decoration: none;
        }

        .verified-abn a:hover,
        .verified-abn a:focus {
            text-decoration: underline;
            text-underline-offset: 3px;
        }

        .address-status-icon {
            position: absolute;
            right: 8px;
            width: 26px;
            height: 26px;
            border-radius: 999px;
            display: grid;
            place-items: center;
            background: #d9f7df;
            color: #146236;
            pointer-events: none;
        }

        .address-status-icon.unverified {
            background: #fff4cc;
            color: #9a6a00;
        }

        .address-status-icon.abn-status-icon {
            background: #dbeafe;
            color: #1d4ed8;
            z-index: 3;
        }

        .address-status-icon[hidden] {
            display: none !important;
        }

        .address-input-shell .address-status-icon svg,
        .abn-input-shell .address-status-icon svg {
            position: static;
            left: auto;
            width: 15px;
            height: 15px;
            color: currentColor;
            pointer-events: none;
        }

        .address-map {
            position: relative;
            z-index: 0;
            isolation: isolate;
            width: 100%;
            height: 168px;
            border: 1px solid var(--line);
            border-radius: 8px;
            overflow: hidden;
            background: var(--surface-soft);
        }

        .address-map[hidden] {
            display: none !important;
        }

        .readonly-property-card {
            display: grid;
            gap: 8px;
        }

        .readonly-property-value {
            min-height: 42px;
            border: 1px solid var(--line);
            border-radius: 8px;
            background: #ffffff;
            color: var(--ink);
            display: flex;
            align-items: center;
            gap: 9px;
            padding: 10px 12px;
            font-size: 14px;
            font-weight: 400;
            line-height: 1.35;
        }

        a.readonly-property-value {
            text-decoration: none;
        }

        a.readonly-property-value:hover {
            border-color: rgba(31, 77, 77, 0.35);
            background: #fbfcfa;
        }

        .readonly-property-value svg {
            width: 17px;
            height: 17px;
            color: var(--accent);
            flex: 0 0 auto;
        }

        .readonly-property-empty {
            color: var(--muted);
            font-weight: 300;
        }

        .readonly-map-empty {
            min-height: 96px;
            border: 1px dashed var(--line);
            border-radius: 8px;
            display: grid;
            place-items: center;
            padding: 14px;
            background: #fbfcfa;
            color: var(--muted);
            font-size: 13px;
            font-weight: 300;
            text-align: center;
        }

        .linked-record-card {
            min-height: 42px;
            border: 1px solid var(--line);
            border-radius: 8px;
            background: #ffffff;
            color: var(--ink);
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            padding: 10px 12px;
            font-size: 13px;
            font-weight: 400;
            line-height: 1.35;
            text-decoration: none;
        }

        a.linked-record-card:hover {
            border-color: rgba(31, 77, 77, 0.35);
            background: #fbfcfa;
        }

        .linked-record-card svg {
            width: 16px;
            height: 16px;
            color: var(--accent);
            flex: 0 0 auto;
        }

        .linked-record-card.missing {
            color: var(--muted);
            font-weight: 300;
        }

        .record-inline-link {
            color: var(--accent);
            font-size: 13px;
            text-decoration: underline;
            text-underline-offset: 3px;
            text-decoration-thickness: 1px;
            font-weight: 500;
        }

        .record-inline-link:hover {
            color: var(--accent-hover);
        }

        .delegate-map-marker {
            width: 24px !important;
            height: 24px !important;
            margin-left: -12px !important;
            margin-top: -24px !important;
            border: 3px solid #ffffff;
            border-radius: 999px 999px 999px 4px;
            background: #1f4d4d;
            box-shadow: 0 8px 18px rgba(31, 77, 77, 0.28);
            transform: rotate(-45deg);
        }

        .delegate-map-marker::after {
            content: '';
            position: absolute;
            inset: 6px;
            border-radius: 999px;
            background: #ffffff;
        }

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

        .action-row {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            gap: 10px;
            align-items: center;
            padding: 10px;
            border: 1px solid var(--line-soft);
            border-radius: 7px;
            background: #fbfbf8;
        }

        .action-row strong {
            min-width: 0;
            font-size: 13px;
            font-weight: 400;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .maintenance-start-actions {
            display: grid;
            gap: 8px;
            padding: 10px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #ffffff;
        }

        .maintenance-start-actions h4 {
            margin: 0 0 2px;
            color: var(--muted);
            font-size: 11px;
            line-height: 1.2;
            font-weight: 500;
            text-transform: uppercase;
            letter-spacing: 0.04em;
        }

        .maintenance-start-action-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 8px;
        }

        .maintenance-start-action {
            min-height: 42px;
            width: 100%;
            border: 1px solid var(--line);
            border-radius: 8px;
            background: #fbfbf8;
            color: var(--ink);
            display: grid;
            grid-template-columns: 28px minmax(0, 1fr);
            gap: 10px;
            align-items: center;
            padding: 8px 10px 8px 8px;
            font: inherit;
            font-size: 13px;
            line-height: 1.25;
            text-align: left;
            cursor: pointer;
            transition: background 0.16s ease, border-color 0.16s ease, color 0.16s ease, box-shadow 0.16s ease;
        }

        .maintenance-start-action svg {
            width: 28px;
            height: 28px;
            border: 1px solid rgba(31, 77, 77, 0.14);
            border-radius: 7px;
            background: var(--accent-soft);
            color: var(--accent);
            padding: 6px;
        }

        .maintenance-start-action:hover,
        .maintenance-start-action[aria-pressed="true"] {
            border-color: rgba(31, 77, 77, 0.38);
            background: #f4faf8;
            color: var(--accent);
            box-shadow: 0 8px 22px rgba(30, 39, 36, 0.05);
        }

        .maintenance-start-actions.has-active .maintenance-start-action:not([aria-pressed="true"]) {
            filter: grayscale(1);
            opacity: 0.48;
            background: #f4f5f3;
            color: var(--muted);
            box-shadow: none;
        }

        .maintenance-start-actions.has-active .maintenance-start-action:not([aria-pressed="true"]) svg {
            border-color: var(--line-soft);
            background: #edf0ed;
            color: var(--muted);
        }

        .maintenance-start-action[aria-pressed="true"] svg {
            background: var(--accent);
            color: #ffffff;
        }

        .maintenance-work-order-panel,
        .maintenance-action-panel {
            display: grid;
            gap: 12px;
            padding: 12px;
            border: 1px solid rgba(31, 77, 77, 0.18);
            border-radius: 8px;
            background: #ffffff;
        }

        .maintenance-action-head {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 12px;
        }

        .maintenance-action-head > div {
            min-width: 0;
        }

        .maintenance-action-kicker {
            display: inline-flex;
            align-items: center;
            width: fit-content;
            min-height: 22px;
            border-radius: 999px;
            padding: 3px 8px;
            background: var(--accent-soft);
            color: var(--accent);
            font-size: 11px;
            font-weight: 700;
            margin-bottom: 6px;
        }

        .maintenance-work-order-panel h4,
        .maintenance-action-panel h4 {
            margin: 0;
            color: var(--ink);
            font-size: 14px;
            font-weight: 500;
        }

        .maintenance-work-order-panel p,
        .maintenance-action-panel p {
            margin: 0;
            color: var(--muted);
            font-size: 12px;
            line-height: 1.45;
        }

        .maintenance-action-placeholder {
            display: grid;
            gap: 8px;
            padding: 10px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #fbfbf8;
        }

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

        .maintenance-work-order-field {
            display: grid;
            gap: 6px;
            min-width: 0;
        }

        .maintenance-work-order-field.full {
            grid-column: 1 / -1;
        }

        .maintenance-work-order-field label,
        .maintenance-work-order-toggle {
            color: var(--muted);
            font-size: 12px;
            font-weight: 400;
        }

        .maintenance-work-order-field input,
        .maintenance-work-order-field select,
        .maintenance-work-order-field textarea {
            width: 100%;
            min-width: 0;
            border: 1px solid var(--line);
            border-radius: 8px;
            background: #ffffff;
            color: var(--ink);
            padding: 9px 10px;
            font: inherit;
            font-size: 13px;
            outline: none;
        }

        .maintenance-work-order-field textarea {
            min-height: 94px;
            resize: vertical;
        }

        .maintenance-input-with-suffix {
            position: relative;
            display: block;
        }

        .maintenance-input-with-suffix input {
            padding-right: 54px;
        }

        .maintenance-input-with-suffix input::-webkit-outer-spin-button,
        .maintenance-input-with-suffix input::-webkit-inner-spin-button {
            -webkit-appearance: none;
            margin: 0;
        }

        .maintenance-input-with-suffix input[type="number"] {
            appearance: textfield;
            -moz-appearance: textfield;
        }

        .maintenance-input-suffix {
            position: absolute;
            right: 10px;
            top: 50%;
            transform: translateY(-50%);
            color: var(--muted);
            font-size: 12px;
            font-weight: 400;
            pointer-events: none;
        }

        .maintenance-work-order-hint {
            margin: 0;
            color: var(--muted);
            font-size: 12px;
            line-height: 1.35;
        }

        .maintenance-work-order-toggle {
            grid-column: 1 / -1;
            display: flex;
            align-items: center;
            gap: 8px;
        }

        .maintenance-work-order-toggle input[type="checkbox"],
        .inline-check input[type="checkbox"] {
            flex: 0 0 var(--checkbox-size);
        }

        .maintenance-supplier-results {
            display: grid;
            gap: 6px;
        }

        .maintenance-supplier-option {
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #fbfbf8;
            display: grid;
            gap: 2px;
            padding: 9px 10px;
            text-align: left;
            cursor: pointer;
        }

        .maintenance-supplier-option.selected {
            border-color: rgba(31, 77, 77, 0.4);
            background: #eef7f5;
        }

        .maintenance-supplier-option strong {
            font-size: 13px;
            font-weight: 500;
        }

        .maintenance-supplier-option span {
            color: var(--muted);
            font-size: 12px;
        }

        .maintenance-work-order-actions,
        .maintenance-action-controls {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
            align-items: center;
        }

        .maintenance-work-order-actions .button,
        .maintenance-action-controls .button {
            height: 32px;
            padding: 0 10px;
            gap: 6px;
            font-size: 12px;
        }

        .maintenance-work-order-state {
            display: grid;
            gap: 10px;
            padding: 10px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #fbfbf8;
            font-size: 13px;
        }

        .maintenance-work-order-state strong {
            font-weight: 500;
        }

        .maintenance-work-order-status-line {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            align-items: center;
            justify-content: space-between;
        }

        .maintenance-work-order-status-pill {
            display: inline-flex;
            align-items: center;
            width: fit-content;
            min-height: 24px;
            border-radius: 999px;
            padding: 4px 9px;
            font-size: 12px;
            font-weight: 500;
            background: #fff3cd;
            color: #7a5a00;
        }

        .maintenance-work-order-status-pill.awaiting {
            background: #fff3cd;
            color: #7a5a00;
        }

        .maintenance-work-order-status-pill.accepted {
            background: #e4f6ea;
            color: #27633e;
        }

        .maintenance-work-order-status-pill.completed {
            background: #e0f2fe;
            color: #075985;
        }

        .maintenance-work-order-status-pill.declined {
            background: #f8e4e2;
            color: #9b3029;
        }

        .maintenance-work-order-tracking {
            display: grid;
            gap: 0;
            border-top: 1px solid var(--line-soft);
        }

        .maintenance-work-order-tracking div {
            display: flex;
            justify-content: space-between;
            gap: 14px;
            padding: 8px 0;
            border-bottom: 1px solid var(--line-soft);
            min-width: 0;
        }

        .maintenance-work-order-tracking span {
            color: var(--muted);
            font-size: 12px;
            line-height: 1.35;
        }

        .maintenance-work-order-tracking strong {
            color: var(--ink);
            font-size: 12px;
            line-height: 1.35;
            text-align: right;
            overflow-wrap: anywhere;
        }

        .maintenance-owner-action-summary strong {
            font-weight: 400;
        }

        .maintenance-work-order-response-value {
            font-weight: 600;
        }

        .maintenance-work-order-response-value.awaiting {
            color: #7a5a00;
        }

        .maintenance-work-order-response-value.accepted {
            color: #27633e;
        }

        .maintenance-work-order-response-value.completed {
            color: #075985;
        }

        .maintenance-work-order-response-value.declined {
            color: #9b3029;
        }

        .maintenance-quote-selected {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
        }

        .maintenance-quote-chip {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            min-height: 30px;
            border-radius: 999px;
            padding: 5px 8px 5px 10px;
            border: 1px solid rgba(31,77,77,0.22);
            background: #eef7f5;
            color: var(--ink);
            font-size: 12px;
            font-weight: 500;
        }

        .maintenance-quote-chip button {
            width: 18px;
            height: 18px;
            border: 0;
            border-radius: 50%;
            background: rgba(31,77,77,0.12);
            color: var(--accent);
            cursor: pointer;
            line-height: 1;
        }

        .maintenance-quote-list {
            display: grid;
            gap: 10px;
        }

        .maintenance-quote-list-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            flex-wrap: wrap;
        }

        .maintenance-quote-list-head strong {
            color: var(--ink);
            font-size: 13px;
            font-weight: 600;
        }

        .maintenance-quote-card {
            display: grid;
            gap: 8px;
            padding: 10px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #fbfbf8;
        }

        .maintenance-quote-card-head {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 10px;
        }

        .maintenance-quote-card-head strong {
            color: var(--ink);
            font-size: 13px;
            font-weight: 500;
        }

        .maintenance-quote-card-head div > span {
            display: block;
            color: var(--muted);
            font-size: 12px;
            margin-top: 2px;
        }

        .maintenance-quote-card-actions {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            gap: 8px;
            flex-wrap: wrap;
        }

        .maintenance-quote-row-toggle {
            border: 1px solid var(--line-soft);
            border-radius: 999px;
            background: #ffffff;
            color: #155c98;
            min-height: 30px;
            padding: 5px 10px;
            font: inherit;
            font-size: 12px;
            font-weight: 600;
            cursor: pointer;
        }

        .maintenance-quote-row-toggle:hover {
            background: #f4f8f7;
            border-color: #cbded6;
            color: var(--accent);
        }

        .maintenance-quote-approval-bar {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            flex-wrap: wrap;
            padding: 10px;
            border: 1px solid #d9e3df;
            border-radius: 8px;
            background: #ffffff;
        }

        .maintenance-quote-approval-top {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            flex-wrap: wrap;
        }

        .maintenance-quote-approval-top strong {
            color: var(--ink);
            font-size: 13px;
            font-weight: 600;
        }

        .maintenance-quote-approval-top span {
            color: var(--muted);
            font-size: 12px;
        }

        .maintenance-quote-approval-actions {
            display: flex;
            gap: 8px;
            flex-wrap: wrap;
        }

        .maintenance-quote-approval-actions .button:disabled {
            opacity: 0.45;
            cursor: not-allowed;
        }

        .maintenance-quote-card-buttons {
            display: flex;
            gap: 8px;
            flex-wrap: wrap;
        }

        .maintenance-quote-card-buttons .button {
            min-height: 34px;
        }

        .maintenance-quote-approval-status {
            display: inline-flex;
            align-items: center;
            width: fit-content;
            border-radius: 999px;
            padding: 4px 8px;
            background: #eef6ff;
            color: #155c98;
            font-size: 11px;
            font-weight: 700;
        }

        .maintenance-quote-approval-status.approved {
            background: #e7f6ed;
            color: #27633e;
        }

        .maintenance-quote-detail-toggle,
        .maintenance-quote-tracking-toggle,
        .maintenance-action-detail-toggle {
            border-top: 1px solid var(--line-soft);
            padding-top: 8px;
        }

        .maintenance-quote-detail-toggle summary,
        .maintenance-quote-tracking-toggle summary,
        .maintenance-action-detail-toggle summary {
            display: inline-flex;
            align-items: center;
            width: fit-content;
            min-height: 30px;
            border: 1px solid var(--line-soft);
            border-radius: 999px;
            padding: 5px 10px;
            background: #ffffff;
            cursor: pointer;
            color: #155c98;
            font-size: 12px;
            font-weight: 600;
            line-height: 1;
            list-style: none;
            transition: background 0.16s ease, border-color 0.16s ease, color 0.16s ease;
        }

        .maintenance-quote-detail-toggle summary::-webkit-details-marker,
        .maintenance-quote-tracking-toggle summary::-webkit-details-marker,
        .maintenance-action-detail-toggle summary::-webkit-details-marker {
            display: none;
        }

        .maintenance-quote-detail-toggle summary::marker,
        .maintenance-quote-tracking-toggle summary::marker,
        .maintenance-action-detail-toggle summary::marker {
            content: "";
        }

        .maintenance-quote-detail-toggle summary:hover,
        .maintenance-quote-tracking-toggle summary:hover,
        .maintenance-action-detail-toggle summary:hover,
        .maintenance-quote-detail-toggle[open] summary,
        .maintenance-quote-tracking-toggle[open] summary,
        .maintenance-action-detail-toggle[open] summary {
            background: #f4f8f7;
            border-color: #cbded6;
            color: var(--accent);
        }

        .maintenance-quote-action-message {
            min-height: 16px;
            color: var(--muted);
            font-size: 12px;
        }

        .maintenance-quote-meta {
            display: grid;
            gap: 0;
        }

        .maintenance-quote-meta div {
            display: flex;
            justify-content: space-between;
            gap: 14px;
            padding: 9px 0;
            border-bottom: 1px solid var(--line-soft);
            min-width: 0;
        }

        .maintenance-quote-meta span {
            color: var(--muted);
            font-size: 12px;
            line-height: 1.35;
        }

        .maintenance-quote-meta strong,
        .maintenance-quote-meta a {
            color: var(--ink);
            font-size: 12px;
            font-weight: 500;
            line-height: 1.35;
            text-align: right;
            text-decoration: none;
            overflow-wrap: anywhere;
        }

        .maintenance-quote-meta a {
            color: #155c98;
            font-weight: 600;
        }

        .maintenance-quote-summary {
            display: grid;
            gap: 10px;
            padding: 10px;
            border: 1px solid #dfe9e3;
            border-radius: 8px;
            background: #f7fbf9;
        }

        .maintenance-quote-summary-title {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
        }

        .maintenance-quote-summary-title span {
            color: var(--muted);
            font-size: 12px;
        }

        .maintenance-quote-summary-title strong {
            color: #27633e;
            font-size: 18px;
            font-weight: 600;
        }

        .maintenance-work-order-completion {
            display: grid;
            gap: 9px;
            padding-top: 8px;
            border-top: 1px solid var(--line-soft);
        }

        .maintenance-work-order-completion-links {
            display: flex;
            gap: 8px;
            flex-wrap: wrap;
        }

        .maintenance-work-order-completion-links a {
            display: inline-flex;
            align-items: center;
            min-height: 28px;
            border: 1px solid var(--line-soft);
            border-radius: 999px;
            padding: 4px 9px;
            color: #155c98;
            background: #ffffff;
            font-size: 12px;
            font-weight: 600;
            text-decoration: none;
        }

        .maintenance-quote-tracking-toggle .maintenance-work-order-tracking {
            margin-top: 8px;
        }

        .maintenance-work-order-link {
            width: 100%;
            border: 1px solid var(--line);
            border-radius: 8px;
            padding: 8px 10px;
            font: inherit;
            font-size: 12px;
            color: var(--muted);
            background: #ffffff;
        }

        @media (max-width: 980px) {
            .maintenance-start-action-grid {
                grid-template-columns: minmax(0, 1fr);
            }

            .maintenance-work-order-grid {
                grid-template-columns: minmax(0, 1fr);
            }

            .maintenance-work-order-tracking {
                grid-template-columns: minmax(0, 1fr);
            }

            .maintenance-quote-meta {
                grid-template-columns: minmax(0, 1fr);
            }
        }

        .maintenance-snooze-row {
            background: #ffffff;
        }

        .maintenance-snooze-control {
            display: flex;
            flex-wrap: wrap;
            justify-content: flex-end;
            gap: 6px;
            min-width: 260px;
        }

        .maintenance-snooze-control input {
            min-width: 148px;
            height: 34px;
            border: 1px solid var(--line);
            border-radius: 7px;
            padding: 7px 9px;
            background: #ffffff;
            color: var(--ink);
            font: inherit;
            font-size: 12px;
        }

        .maintenance-snooze-control button {
            height: 34px;
            border: 1px solid var(--line);
            border-radius: 7px;
            padding: 0 10px;
            background: #ffffff;
            color: var(--ink);
            font: inherit;
            font-size: 12px;
            cursor: pointer;
        }

        .maintenance-snooze-control button[data-maintenance-delay-save] {
            border-color: rgba(48, 98, 75, 0.28);
            background: var(--accent);
            color: #ffffff;
        }

        .side-tabs {
            display: inline-grid;
            grid-template-columns: repeat(4, minmax(68px, 1fr));
            border: 1px solid var(--line);
            border-radius: 999px;
            background: #f3f5f1;
            overflow: hidden;
            padding: 3px;
            flex: 1 1 340px;
            max-width: 360px;
        }

        .side-tab {
            height: 30px;
            border: 0;
            border-radius: 999px;
            background: transparent;
            color: var(--muted);
            padding: 0 10px;
            cursor: pointer;
            font-size: 12px;
            font-weight: 300;
        }

        .side-tab.active {
            background: #ffffff;
            color: var(--ink);
            box-shadow: 0 1px 4px rgba(30,39,36,0.08);
            font-weight: 400;
        }

        .side-pane {
            min-height: 0;
            overflow: auto;
            padding: 14px;
            display: grid;
            align-content: start;
            gap: 12px;
        }

        .side-pane[hidden] {
            display: none !important;
        }

        .alert-composer {
            display: grid;
            gap: 0;
            padding: 0;
            border: 1px solid var(--line-soft);
            border-radius: 12px;
            background: #fff;
            overflow: hidden;
        }

        .alert-composer-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:14px 15px; background:#f8faf8; border-bottom:1px solid var(--line-soft); }
        .alert-composer-head > div { display:grid; gap:2px; }
        .alert-composer-head strong { font-size:14px; color:var(--ink); }
        .alert-composer-head small, .alert-composer label > span, .alert-contexts legend { color:var(--muted); font-size:10px; }
        .alert-composer label { display:grid; gap:5px; }
        .alert-composer input, .alert-composer textarea, .alert-composer select { width:100%; min-height:36px; border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--ink); font:inherit; font-size:11px; padding:8px 10px; outline:none; }
        .alert-composer textarea { min-height:86px; resize:vertical; }
        .alert-composer input:focus, .alert-composer textarea:focus, .alert-composer select:focus { border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-ring); }
        .alert-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
        .alert-composer-section { display:grid; gap:11px; padding:14px 15px; border-bottom:1px solid var(--line-soft); }
        .alert-section-heading { display:flex; align-items:flex-start; gap:9px; }
        .alert-section-heading > span { display:grid; place-items:center; flex:0 0 22px; width:22px; height:22px; border-radius:50%; background:#e7f1eb; color:var(--accent); font-size:10px; font-weight:700; }
        .alert-section-heading > div { display:grid; gap:2px; min-width:0; }
        .alert-section-heading strong { color:var(--ink); font-size:11px; font-weight:650; }
        .alert-section-heading small { color:var(--muted); font-size:10px; line-height:1.4; }
        .alert-audience-modes { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
        .alert-audience-modes > label { position:relative; display:block; cursor:pointer; }
        .alert-audience-modes input { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
        .alert-audience-modes label > span { display:grid; gap:3px; min-height:68px; padding:10px; border:1px solid var(--line); border-radius:9px; background:#fff; }
        .alert-audience-modes label > span strong { color:var(--ink); font-size:10px; font-weight:650; }
        .alert-audience-modes label > span small { color:var(--muted); font-size:9px; line-height:1.4; }
        .alert-audience-modes input:checked + span { border-color:#7eaa91; background:#f1f7f3; box-shadow:inset 0 0 0 1px #7eaa91; }
        .alert-audience-modes input:focus-visible + span { outline:2px solid var(--accent); outline-offset:2px; }
        .alert-audience-picker { display:grid; gap:8px; padding:10px; border:1px solid #dfe6e2; border-radius:9px; background:#fafcfb; }
        .alert-audience-picker[hidden] { display:none !important; }
        .alert-team-shortcuts { display:flex; flex-wrap:wrap; align-items:center; gap:5px; }
        .alert-team-shortcuts > span { width:100%; color:var(--muted); font-size:9px; font-weight:600; text-transform:uppercase; letter-spacing:.04em; }
        .alert-team-shortcuts button { display:inline-flex; align-items:center; gap:5px; min-height:28px; padding:5px 8px; border:1px solid var(--line); border-radius:999px; background:#fff; color:#445149; font:inherit; font-size:9px; cursor:pointer; }
        .alert-team-shortcuts button > span { display:grid; place-items:center; min-width:16px; height:16px; padding:0 4px; border-radius:999px; background:#edf1ef; font-size:8px; font-weight:700; }
        .alert-team-shortcuts button:hover, .alert-team-shortcuts button.selected { border-color:#8bb19a; background:#edf6f0; color:var(--accent); }
        .alert-user-options { display:grid; gap:4px; max-height:190px; overflow:auto; }
        .alert-user-option { display:grid !important; grid-template-columns:18px 28px minmax(0,1fr); align-items:center; gap:8px !important; padding:6px 7px; border:1px solid transparent; border-radius:8px; background:#fff; cursor:pointer; }
        .alert-user-option:hover { border-color:var(--line); }
        .alert-user-option > input { width:16px; min-height:16px; height:16px; margin:0; accent-color:var(--accent); }
        .alert-user-avatar { display:grid; place-items:center; width:28px; height:28px; overflow:hidden; border-radius:50%; background:#e5eee9; color:#456154; font-size:9px; font-weight:700; }
        .alert-user-avatar img { width:100%; height:100%; object-fit:cover; }
        .alert-user-copy { display:grid; gap:1px; min-width:0; }
        .alert-user-copy strong { overflow:hidden; color:var(--ink); font-size:10px; font-weight:620; text-overflow:ellipsis; white-space:nowrap; }
        .alert-user-copy small { overflow:hidden; color:var(--muted); font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
        .alert-audience-summary { color:#526159; font-size:9px; line-height:1.4; }
        .alert-user-empty { padding:12px; color:var(--muted); font-size:10px; text-align:center; }
        .alert-contexts { border:0; padding:0; margin:0; display:grid; gap:7px; }
        .alert-contexts > div { display:flex; flex-wrap:wrap; gap:6px; }
        .alert-contexts label { display:inline-flex; align-items:center; gap:5px; border:1px solid var(--line); border-radius:999px; padding:5px 8px; background:#fff; cursor:pointer; font-size:9px; }
        .alert-contexts input { width:auto; min-height:0; margin:0; accent-color:var(--accent); }
        .alert-composer-actions { position:sticky; bottom:0; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px 15px; background:#fff; box-shadow:0 -5px 16px rgba(32,48,39,.06); }
        .alert-composer-actions > span { color:var(--muted); font-size:9px; line-height:1.35; }
        .alert-composer-actions .button { flex:0 0 auto; }
        .alert-list { display:grid; gap:9px; }
        .record-alert { display:grid; gap:7px; padding:12px; border:1px solid var(--line-soft); border-left:4px solid #4f7fba; border-radius:9px; background:#fff; }
        .record-alert.severity-warning { border-left-color:#c88518; background:#fffdf8; }
        .record-alert.severity-critical { border-left-color:#c5483d; background:#fffafa; }
        .record-alert-head { display:flex; gap:6px; align-items:center; }
        .record-alert-head span { border-radius:999px; padding:3px 7px; background:#eef3f8; color:#315b83; font-size:10px; font-weight:600; }
        .record-alert-head .record-alert-pending { background:#f0f1ef; color:var(--muted); font-weight:500; }
        .record-alert.severity-warning .record-alert-severity { background:#fff0d2; color:#85560c; }
        .record-alert.severity-critical .record-alert-severity { background:#fde4e1; color:#99352d; }
        .record-alert > strong { font-size:13px; color:var(--ink); }
        .record-alert p { margin:0; color:var(--ink); font-size:12px; line-height:1.5; white-space:pre-wrap; }
        .record-alert > small { color:var(--muted); font-size:10px; line-height:1.45; }
        @media (max-width: 560px) { .alert-form-grid, .alert-audience-modes { grid-template-columns:1fr; } }

        .comment-composer,
        .document-uploader {
            display: grid;
            gap: 8px;
            padding: 10px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #fbfcfa;
        }

        #commentsPane > .comment-composer {
            position: sticky;
            top: 0;
            z-index: 4;
            box-shadow: 0 8px 18px rgba(30, 39, 36, 0.06);
        }

        .comment-edit-card {
            position: static;
            box-shadow: none;
            padding: 0;
            border: 0;
            background: transparent;
        }

        .comment-composer-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
        }

        .comment-composer-head strong {
            color: var(--ink);
            font-size: 12px;
            font-weight: 600;
        }

        .comment-count {
            color: var(--muted);
            font-size: 11px;
            font-weight: 400;
        }

        .comment-composer-actions {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
            flex-wrap: wrap;
        }

        .comment-composer textarea,
        .comment-composer input,
        .comment-composer select,
        .document-uploader input {
            width: 100%;
            border: 1px solid var(--line);
            border-radius: 7px;
            background: #ffffff;
            color: var(--ink);
            font: inherit;
            font-size: 13px;
            font-weight: 300;
            padding: 9px 10px;
            outline: none;
        }

        .comment-composer textarea {
            min-height: 92px;
            resize: vertical;
        }

        .comment-composer input {
            min-height: 34px;
        }

        .comment-composer textarea:focus,
        .comment-composer input:focus,
        .comment-composer select:focus,
        .document-uploader input:focus {
            border-color: var(--accent);
            box-shadow: 0 0 0 3px var(--accent-ring);
        }

        .inline-check {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            color: var(--muted);
            font-size: 12px;
            font-weight: 300;
        }

        .esign-layout {
            display: grid;
            grid-template-columns: minmax(340px, 420px) minmax(0, 1fr);
            gap: 18px;
            min-height: 0;
        }

        .esign-workspace {
            overflow: hidden;
        }

        .esign-workspace .table-toolbar {
            grid-template-columns: minmax(320px, 1fr) auto;
        }

        .esign-workspace:has(.esign-bulk-bar.active) {
            grid-template-rows: auto auto auto minmax(0, 1fr);
        }

        .esign-workspace:has(.esign-bulk-bar.active) .table-frame {
            grid-row: 4;
        }

        .esign-create-panel {
            border: 0;
            border-radius: 0;
            padding: 0;
            background: transparent;
            display: grid;
            gap: 0;
            overflow: visible;
        }

        .esign-create-panel[hidden] {
            display: none !important;
        }

        .esign-create-content {
            overflow: auto;
        }

        .esign-create-shell {
            width: min(880px, 100%);
            margin: 0 auto;
            display: grid;
            gap: 16px;
        }

        .esign-create-panel-wrap {
            display: grid;
            grid-template-columns: minmax(0, 1fr);
            gap: 0;
            align-items: start;
        }

        .esign-create-main {
            display: grid;
            gap: 0;
            min-width: 0;
        }

        .esign-create-intro {
            display: none;
            gap: 5px;
            padding: 16px;
            border-bottom: 1px solid var(--line-soft);
            background: #fbfcfa;
        }

        .esign-create-main h3 {
            margin: 0;
            color: var(--ink);
            font-size: 16px;
            font-weight: 500;
        }

        .esign-create-intro strong {
            color: var(--ink);
            font-size: 14px;
            font-weight: 600;
        }

        .esign-create-main p,
        .esign-create-intro span {
            margin: 0;
            color: var(--muted);
            font-size: 13px;
            line-height: 1.45;
        }

        .esign-create-main > h3,
        .esign-create-main > p {
            display: none;
        }

        .esign-form-section {
            display: grid;
            gap: 12px;
            padding: 18px 0;
            border-bottom: 1px solid var(--line-soft);
        }

        .esign-form-section:first-of-type {
            padding-top: 0;
        }

        .esign-form-section:last-child {
            border-bottom: 0;
        }

        .esign-form-section-head {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 12px;
        }

        .esign-form-section-head h4 {
            margin: 0;
            color: var(--ink);
            font-size: 13px;
            font-weight: 600;
        }

        .esign-form-section-head span {
            display: none;
            color: var(--muted);
            font-size: 12px;
            line-height: 1.35;
            text-align: right;
        }

        .esign-create-panel .record-upload-dropzone {
            min-height: 104px;
        }

        .esign-selected-template-document {
            display: grid;
            gap: 10px;
            padding: 12px;
            border: 1px solid var(--line);
            border-radius: 9px;
            background: #f8faf8;
        }

        .esign-selected-template-document[hidden] {
            display: none !important;
        }

        .esign-selected-template-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 14px;
        }

        .esign-selected-template-head > div {
            min-width: 0;
            display: grid;
            gap: 2px;
        }

        .esign-selected-template-head strong {
            color: var(--ink);
            font-size: 13px;
            font-weight: 600;
        }

        .esign-selected-template-head span {
            color: var(--muted);
            font-size: 11px;
            line-height: 1.35;
        }

        .esign-selected-template-head .esign-selected-template-kicker {
            color: #356a55;
            font-size: 10px;
            font-weight: 600;
            letter-spacing: .04em;
            text-transform: uppercase;
        }

        .esign-selected-template-confirmation {
            padding: 9px 10px;
            border: 1px solid #cfe3d7;
            border-radius: 7px;
            background: #edf7f1;
            color: #27543f;
            font-size: 11px;
            line-height: 1.45;
        }

        .esign-selected-template-document iframe {
            width: 100%;
            height: 440px;
            border: 1px solid var(--line-soft);
            border-radius: 7px;
            background: #ffffff;
        }

        .esign-template-create-content {
            overflow: hidden;
        }

        .esign-template-workspace-form {
            height: 100%;
            min-height: 0;
            display: grid;
        }

        .esign-template-create-workspace {
            display: grid;
            grid-template-columns: minmax(0, 1fr) 380px;
            gap: 0;
            min-height: 0;
            height: 100%;
            border-top: 1px solid var(--line-soft);
        }

        .esign-template-builder-canvas {
            min-width: 0;
            min-height: 0;
            display: grid;
            grid-template-rows: auto minmax(0, 1fr);
            background: #f4f6f3;
            overflow: hidden;
        }

        .esign-template-builder-canvas-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
            min-height: 58px;
            padding: 12px 18px;
            border-bottom: 1px solid var(--line-soft);
            background: #ffffff;
        }

        .esign-template-builder-canvas-head h3 {
            margin: 0;
            color: var(--ink);
            font-size: 15px;
            font-weight: 600;
        }

        .esign-template-builder-canvas-head span {
            color: var(--muted);
            font-size: 12px;
        }

        .esign-template-builder-canvas-head .mini-button[hidden],
        .esign-template-create-sidebar-actions .button[hidden] {
            display: none !important;
        }

        .esign-template-create-sidebar {
            min-width: 0;
            min-height: 0;
            display: grid;
            grid-template-rows: minmax(0, 1fr) auto;
            border-left: 1px solid var(--line-soft);
            background: #ffffff;
            overflow: hidden;
        }

        .esign-template-create-sidebar-scroll {
            display: grid;
            gap: 0;
            align-content: start;
            min-height: 0;
            overflow: auto;
            padding: 12px 14px;
        }

        .esign-template-create-sidebar-scroll > .esign-stage-panel {
            padding: 14px 0;
        }

        .esign-template-create-sidebar-scroll > .esign-stage-panel:first-child {
            padding-top: 0;
        }

        .esign-template-create-sidebar-scroll .agency-overview-field textarea {
            min-height: 68px;
        }

        .esign-template-create-sidebar-actions {
            display: flex;
            justify-content: flex-end;
            gap: 8px;
            padding: 12px 14px;
            border-top: 1px solid var(--line-soft);
            background: #fbfcfa;
        }

        .esign-template-mode-switch {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 8px;
        }

        .esign-template-mode-button {
            display: grid;
            gap: 4px;
            min-height: 66px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #ffffff;
            color: inherit;
            cursor: pointer;
            padding: 10px;
            text-align: left;
        }

        .esign-template-mode-button.active,
        .esign-template-mode-button:hover {
            border-color: var(--accent);
            background: var(--accent-soft);
        }

        .esign-template-mode-button strong {
            color: var(--ink);
            font-size: 13px;
            font-weight: 600;
        }

        .esign-template-mode-button span {
            color: var(--muted);
            font-size: 12px;
            line-height: 1.35;
        }

        .esign-template-builder {
            display: grid;
            min-height: 0;
            height: 100%;
        }

        .esign-template-builder[hidden],
        .esign-template-upload-mode[hidden] {
            display: none !important;
        }

        .esign-template-builder-workbench {
            display: grid;
            min-height: 0;
            min-width: 0;
        }

        .esign-template-builder-tools {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 8px;
            align-items: center;
        }

        .esign-template-builder-tools select {
            min-height: 34px;
            min-width: 0;
            width: 100%;
            grid-column: 1 / -1;
            border: 1px solid var(--line);
            border-radius: 7px;
            background: #ffffff;
            color: var(--ink);
            font: inherit;
            font-size: 12px;
            padding: 0 9px;
        }

        .esign-template-builder-file {
            position: relative;
            overflow: hidden;
            display: grid;
            place-items: center;
            text-align: center;
        }

        .esign-template-builder-file input {
            position: absolute;
            inset: 0;
            opacity: 0;
            cursor: pointer;
        }

        .esign-template-a4-frame {
            display: grid;
            justify-content: center;
            justify-items: center;
            overflow: auto;
            align-items: start;
            min-height: 0;
            height: 100%;
            background: #eef1ee;
            padding: 28px;
        }

        .esign-template-a4-workspace {
            display: grid;
            gap: 10px;
            width: 620px;
            max-width: 100%;
        }

        .esign-template-page-toolbar {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            min-height: 36px;
            padding: 5px 6px 5px 12px;
            border: 1px solid #dce2dd;
            border-radius: 8px;
            background: rgba(255, 255, 255, 0.96);
            box-shadow: 0 8px 22px rgba(26, 37, 32, 0.08);
        }

        .esign-template-page-toolbar strong {
            font-size: 12px;
            font-weight: 600;
            color: var(--ink);
        }

        .esign-template-page-actions {
            display: flex;
            align-items: center;
            gap: 6px;
        }

        .esign-template-a4-page {
            position: relative;
            width: 100%;
            max-width: 100%;
            aspect-ratio: 210 / 297;
            background: #ffffff;
            border: 1px solid #dce2dd;
            box-shadow: 0 14px 34px rgba(26, 37, 32, 0.12);
            overflow: hidden;
        }

        .esign-template-page-stack {
            display: grid;
            gap: 28px;
            width: 100%;
            padding-bottom: 28px;
        }

        .esign-template-builder-page {
            position: relative;
            width: 100%;
            aspect-ratio: 210 / 297;
            flex: 0 0 auto;
            overflow: hidden;
            border: 1px solid #dce2dd;
            background: #ffffff;
            box-shadow: 0 14px 34px rgba(26, 37, 32, 0.12);
            scroll-margin-top: 12px;
        }

        .esign-template-builder-page.active-page {
            box-shadow: 0 0 0 2px var(--accent), 0 14px 34px rgba(26, 37, 32, 0.12);
        }

        .esign-template-builder-page-number {
            position: absolute;
            right: 8px;
            bottom: 6px;
            z-index: 0;
            color: #a2aaa6;
            font-size: 9px;
            pointer-events: none;
        }

        .esign-template-build-item {
            position: absolute;
            border: 1px solid transparent;
            border-radius: 4px;
            color: #17231f;
            cursor: move;
            min-width: 16px;
            min-height: 10px;
            user-select: none;
        }

        .esign-template-build-item.active {
            border-color: var(--accent);
            box-shadow: 0 0 0 3px var(--accent-ring);
        }

        .esign-template-build-item[data-builder-type="text"],
        .esign-template-build-item[data-builder-type="merge"] {
            display: flex;
            align-items: flex-start;
            line-height: 1.25;
            overflow: hidden;
            white-space: pre-wrap;
        }

        .esign-template-build-item[data-builder-type="merge"] {
            color: #155c98;
            font-weight: 600;
        }

        .esign-template-build-item[data-builder-type="image"] img,
        .esign-template-build-item[data-builder-type="agency_logo"] img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            display: block;
        }

        .esign-template-build-item[data-builder-type="line"] {
            height: 0 !important;
            min-height: 0;
            border: 0;
            border-top: var(--esign-line-thickness, 2px) var(--esign-line-style, solid) var(--esign-line-color, #17231f);
            border-radius: 0;
        }

        .esign-template-build-item[data-builder-type="table"] {
            overflow: hidden;
        }

        .esign-template-table-preview {
            display: grid;
            width: 100%;
            height: 100%;
            border-top: var(--esign-table-border, 1px) solid var(--esign-table-border-color, #17231f);
            border-left: var(--esign-table-border, 1px) solid var(--esign-table-border-color, #17231f);
        }

        .esign-template-table-preview > span {
            min-width: 0;
            padding: 3px 4px;
            overflow: hidden;
            border-right: var(--esign-table-border, 1px) solid var(--esign-table-border-color, #17231f);
            border-bottom: var(--esign-table-border, 1px) solid var(--esign-table-border-color, #17231f);
        }

        .esign-template-table-preview > input {
            width: 100%;
            min-width: 0;
            height: 100%;
            min-height: 0;
            padding: 3px 4px;
            overflow: hidden;
            border: 0;
            border-right: var(--esign-table-border, 1px) solid var(--esign-table-border-color, #17231f);
            border-bottom: var(--esign-table-border, 1px) solid var(--esign-table-border-color, #17231f);
            border-radius: 0;
            background: transparent;
            color: inherit;
            font: inherit;
            text-align: inherit;
            cursor: text;
        }

        .esign-template-table-preview > input:focus {
            position: relative;
            z-index: 2;
            outline: 2px solid var(--accent);
            outline-offset: -2px;
        }

        .esign-template-builder-side {
            display: grid;
            gap: 10px;
            min-width: 0;
        }

        .esign-template-builder-side .esign-stage-panel {
            gap: 10px;
        }

        .esign-template-builder-list {
            display: grid;
            gap: 6px;
            max-height: 190px;
            overflow: auto;
        }

        .esign-template-builder-row {
            width: 100%;
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            gap: 8px;
            align-items: center;
            border: 1px solid var(--line-soft);
            border-radius: 7px;
            background: #ffffff;
            color: inherit;
            cursor: pointer;
            padding: 8px;
            text-align: left;
        }

        .esign-template-builder-row.active,
        .esign-template-builder-row:hover {
            border-color: var(--accent);
            background: var(--accent-soft);
        }

        .esign-template-builder-row strong,
        .esign-template-builder-row span {
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .esign-template-builder-row strong {
            color: var(--ink);
            font-size: 12px;
            font-weight: 600;
        }

        .esign-template-builder-row span {
            color: var(--muted);
            font-size: 11px;
        }

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

        .esign-template-builder-grid .span-2 {
            grid-column: 1 / -1;
        }

        .esign-template-table-editor {
            display: grid;
            gap: 4px;
        }

        .esign-template-table-editor input {
            width: 100%;
            min-width: 0;
            min-height: 30px;
            padding: 5px 6px;
            border: 1px solid var(--line);
            border-radius: 5px;
            font: inherit;
            font-size: 11px;
        }

        .esign-template-table-editor input.active {
            border-color: var(--accent);
            box-shadow: 0 0 0 2px var(--accent-ring);
        }

        .esign-template-table-shading {
            display: grid;
            gap: 7px;
            padding: 9px;
            border: 1px solid var(--line-soft);
            border-radius: 7px;
            background: #f8faf9;
        }

        .esign-template-table-shading > div {
            display: flex;
            flex-wrap: wrap;
            gap: 5px;
        }

        .esign-template-format-buttons {
            display: flex;
            gap: 6px;
        }

        .esign-template-format-buttons .mini-button {
            min-width: 34px;
        }

        .esign-template-format-buttons .mini-button.active {
            border-color: var(--accent);
            background: var(--accent-soft);
            color: var(--accent);
        }

        .esign-template-upload-mode {
            display: grid;
            place-items: center;
            min-height: 0;
            height: 100%;
            padding: 28px;
            background: #f4f6f3;
        }

        .esign-template-upload-mode .record-upload-dropzone {
            width: min(560px, 100%);
            min-height: 180px;
            background: #ffffff;
        }

        .esign-template-create-content .record-page-head {
            min-height: 54px;
            padding: 8px 16px;
            background: #ffffff;
            border-bottom: 1px solid var(--line-soft);
        }

        .esign-template-create-content .esign-template-workspace-form {
            border: 0;
            border-radius: 0;
            background: #ffffff;
        }

        .esign-template-upload-mode {
            place-items: stretch;
            padding: 0;
            overflow: hidden;
        }

        .esign-template-upload-shell {
            display: grid;
            grid-template-rows: minmax(0, 1fr);
            min-height: 0;
            height: 100%;
        }

        .esign-template-upload-workbench {
            display: grid;
            grid-template-columns: minmax(0, 1fr);
            min-width: 0;
            min-height: 0;
            overflow: hidden;
        }

        .esign-template-upload-field-panel {
            display: grid;
            align-content: start;
            gap: 12px;
        }

        .esign-template-upload-field-panel[hidden] {
            display: none !important;
        }

        .esign-template-step-nav {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 5px;
            padding-bottom: 12px;
            border-bottom: 1px solid var(--line-soft);
        }

        .esign-template-step-button {
            min-height: 30px;
            border: 1px solid var(--line-soft);
            border-radius: 6px;
            background: #ffffff;
            color: var(--muted);
            cursor: pointer;
            font: inherit;
            font-size: 10px;
            font-weight: 600;
        }

        .esign-template-step-button.active {
            border-color: var(--accent);
            background: var(--accent-soft);
            color: var(--accent);
        }

        .esign-workflow-step-nav {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 6px;
            padding-bottom: 14px;
            border-bottom: 1px solid var(--line-soft);
        }

        .esign-workflow-step {
            min-height: 38px;
            display: inline-flex;
            align-items: center;
            justify-content: flex-start;
            gap: 7px;
            padding: 7px 9px;
            border: 1px solid var(--line-soft);
            border-radius: 7px;
            background: #fff;
            color: var(--muted);
            font: inherit;
            font-size: 11px;
            font-weight: 500;
            cursor: pointer;
            text-align: left;
            line-height: 1.25;
        }

        .esign-workflow-step span {
            display: inline-grid;
            place-items: center;
            width: 20px;
            height: 20px;
            border-radius: 50%;
            background: #f0f3f1;
            color: #53615b;
            font-size: 10px;
            font-weight: 700;
            flex: 0 0 auto;
        }

        .esign-workflow-step.active {
            border-color: var(--accent);
            background: var(--accent-soft);
            color: var(--accent);
        }

        .esign-workflow-step.active span {
            background: var(--accent);
            color: #fff;
        }

        [data-esign-create-panel][hidden],
        [data-esign-editor-step-panel][hidden] {
            display: none !important;
        }

        .esign-field-palette > .esign-workflow-step-nav {
            position: sticky;
            top: 0;
            z-index: 3;
            background: #fff;
            padding: 0 0 12px;
        }

        .esign-field-palette > .esign-workflow-step-nav.three-steps {
            grid-template-columns: repeat(3, minmax(0, 1fr));
        }

        [data-esign-template-step-panel][hidden] {
            display: none !important;
        }

        .esign-template-recipient-list {
            display: grid;
            gap: 7px;
        }

        .esign-template-recipient-row {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            gap: 8px;
            align-items: center;
            padding: 9px;
            border: 1px solid var(--line-soft);
            border-radius: 7px;
            background: #ffffff;
        }

        .esign-template-recipient-row > div {
            display: grid;
            gap: 2px;
            min-width: 0;
        }

        .esign-template-recipient-row strong {
            font-size: 12px;
            font-weight: 600;
        }

        .esign-template-recipient-row span {
            color: var(--muted);
            font-size: 10px;
        }

        .esign-template-recipient-add {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            gap: 7px;
        }

        .esign-template-upload-image-file {
            position: relative;
            overflow: hidden;
        }

        .esign-template-upload-image-file input {
            position: absolute;
            inset: 0;
            opacity: 0;
            cursor: pointer;
        }

        .esign-template-upload-field-intro {
            margin: 0;
            color: var(--muted);
            font-size: 11px;
            line-height: 1.4;
        }

        .esign-template-upload-field-panel .esign-field-tools {
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 6px;
        }

        .esign-template-upload-field-panel .esign-tool-button {
            min-height: 34px;
            padding: 6px 8px;
            font-size: 11px;
        }

        .esign-template-upload-field-panel .esign-tool-button svg {
            width: 15px;
            height: 15px;
        }

        .esign-template-upload-stage-wrap {
            min-width: 0;
            min-height: 0;
            overflow: auto;
            padding: 22px;
            background: #eef1ee;
        }

        .esign-template-upload-stage {
            display: grid;
            justify-items: center;
            gap: 18px;
            width: min(820px, 100%);
            margin: 0 auto;
        }

        .esign-template-upload-stage.placing .esign-placement-layer {
            cursor: crosshair;
        }

        .esign-template-upload-stage .esign-placement-field {
            min-height: 18px;
            padding: 2px 5px;
            border-radius: 4px;
            font-size: 10px;
            line-height: 1;
            box-shadow: 0 4px 10px rgba(30,39,36,0.1);
        }

        .esign-template-upload-stage .esign-placement-field[data-field-type="image"] {
            padding: 0;
            background: rgba(255,255,255,.96);
        }

        .esign-template-upload-stage .esign-placement-field[data-field-type="image"] img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            display: block;
        }

        .esign-template-upload-stage .esign-resize-handle {
            width: 10px;
            height: 10px;
            right: -4px;
            bottom: -4px;
        }

        .esign-template-upload-empty {
            display: grid;
            place-items: center;
            min-height: 100%;
            padding: 28px;
            background: #f4f6f3;
        }

        .esign-template-upload-empty[hidden],
        .esign-template-upload-shell[hidden] {
            display: none !important;
        }

        .esign-template-upload-empty .record-upload-dropzone {
            width: min(560px, 100%);
            min-height: 190px;
            background: #ffffff;
        }

        .esign-template-upload-status {
            display: grid;
            gap: 5px;
            padding: 10px;
            border: 1px solid #cfe3d7;
            border-radius: 7px;
            background: #edf7f1;
            color: #27543f;
            font-size: 11px;
            line-height: 1.4;
        }

        .esign-template-upload-status strong {
            font-size: 12px;
            font-weight: 600;
        }

        .esign-template-upload-inspector {
            display: grid;
            gap: 10px;
        }

        .esign-template-upload-inspector .agency-overview-field {
            min-width: 0;
        }

        .esign-template-upload-inspector .button {
            width: 100%;
            justify-content: center;
        }

        @media (max-width: 1180px) {
            .esign-template-create-workspace {
                grid-template-columns: minmax(0, 1fr) 340px;
            }

            .esign-template-a4-frame {
                padding: 18px;
            }
        }

        @media (max-width: 920px) {
            .esign-template-create-content {
                overflow: auto;
            }

            .esign-template-workspace-form {
                height: auto;
            }

            .esign-template-create-workspace {
                height: auto;
                grid-template-columns: 1fr;
            }

            .esign-template-builder-canvas {
                min-height: 620px;
            }

            .esign-template-create-sidebar {
                border-left: 0;
                border-top: 1px solid var(--line-soft);
            }
        }

        .table-filter-control {
            height: 36px;
            display: inline-flex;
            align-items: center;
            gap: 7px;
            border: 1px solid var(--line);
            border-radius: 7px;
            background: #ffffff;
            padding: 0 8px;
        }

        .table-filter-control span {
            color: var(--muted);
            font-size: 11px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.04em;
            white-space: nowrap;
        }

        .table-filter-control select {
            width: 180px;
            min-width: 0;
            border: 0;
            background: transparent;
            color: var(--ink);
            font: inherit;
            font-size: 13px;
            outline: none;
            padding: 0;
        }

        .esign-create-actions {
            display: flex;
            gap: 8px;
            align-items: center;
            flex-wrap: wrap;
            justify-content: flex-end;
            padding: 16px 0 0;
            border-top: 1px solid var(--line-soft);
            background: transparent;
        }

        .esign-create-actions .button {
            min-height: 36px;
        }

        .esign-template-library {
            display: grid;
            gap: 10px;
            margin: 0 0 14px;
        }

        .esign-template-library[hidden] {
            display: none !important;
        }

        .esign-template-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
        }

        .esign-template-head h3 {
            margin: 0;
            color: var(--ink);
            font-size: 14px;
            font-weight: 600;
        }

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

        .esign-template-card {
            display: grid;
            gap: 9px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #ffffff;
            padding: 12px;
            min-width: 0;
        }

        .esign-template-card strong,
        .esign-template-card span {
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .esign-template-card strong {
            color: var(--ink);
            font-size: 13px;
            font-weight: 600;
        }

        .esign-template-card span,
        .esign-template-meta {
            color: var(--muted);
            font-size: 12px;
        }

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

        .esign-prefill-panel,
        .tenancy-lease-generator {
            display: grid;
            gap: 10px;
        }

        .esign-prefill-summary,
        .tenancy-lease-generator-note {
            margin: 0;
            color: var(--muted);
            font-size: 12px;
            line-height: 1.4;
        }

        .esign-prefill-list {
            display: grid;
            gap: 8px;
            max-height: 260px;
            overflow: auto;
            padding-right: 2px;
        }

        .esign-prefill-row {
            display: grid;
            grid-template-columns: minmax(0, 1fr) minmax(150px, 0.9fr);
            gap: 8px;
            align-items: center;
        }

        .esign-prefill-row span {
            min-width: 0;
            color: var(--ink);
            font-size: 12px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .esign-prefill-row small {
            display: block;
            color: var(--muted);
            font-size: 11px;
        }

        .tenancy-lease-generator {
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #fbfcfa;
            padding: 12px;
        }

        .tenancy-lease-generator-head {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 10px;
        }

        .tenancy-lease-generator-head strong {
            color: var(--ink);
            font-size: 13px;
        }

        .tenancy-lease-generator-actions {
            display: flex;
            gap: 8px;
            flex-wrap: wrap;
            align-items: center;
        }

        tbody tr[data-esign-request],
        tbody tr[data-esign-template-row] {
            cursor: pointer;
        }

        tbody tr[data-esign-request].active td,
        tbody tr[data-esign-template-row].active td {
            background: #fbf7ed;
        }

        table .button[data-esign-open],
        table .button[data-esign-edit-template],
        table .button[data-esign-use-template] {
            height: 30px;
            font-size: 12px;
            padding: 0 10px;
        }

        .esign-list,
        .esign-editor,
        .esign-sign-panel {
            display: grid;
            gap: 14px;
            min-width: 0;
        }

        .esign-list .comment-composer,
        .esign-list .comment-composer > *,
        .esign-list .record-upload-dropzone,
        .esign-list .button {
            min-width: 0;
            width: 100%;
            max-width: 100%;
        }

        .esign-list .comment-composer select,
        .esign-list .comment-composer input,
        .esign-list .comment-composer textarea {
            width: 100%;
            min-width: 0;
        }

        .esign-list .record-upload-dropzone {
            overflow: hidden;
        }

        .esign-list .record-upload-dropzone strong,
        .esign-list .record-upload-dropzone span {
            max-width: 100%;
            overflow-wrap: anywhere;
            white-space: normal;
        }

        .esign-list .button {
            white-space: normal;
            line-height: 1.25;
        }

        .esign-recipient-picker {
            display: grid;
            gap: 10px;
            min-width: 0;
        }

        .esign-recipient-picker label {
            color: #465366;
            font-size: 11px;
            font-weight: 500;
            text-transform: uppercase;
            letter-spacing: 0.04em;
        }

        .esign-recipient-empty {
            margin: 0;
            color: var(--muted);
            font-size: 12px;
            line-height: 1.35;
        }

        .esign-recipient-picker .maintenance-supplier-option {
            width: 100%;
            min-width: 0;
        }

        .esign-recipient-picker .maintenance-supplier-option strong,
        .esign-recipient-picker .maintenance-supplier-option span {
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .esign-external-recipient {
            display: grid;
            gap: 8px;
            border-top: 1px solid var(--line-soft);
            padding-top: 10px;
        }

        .esign-external-recipient-toggle {
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            border: 1px solid var(--line-soft);
            border-radius: 7px;
            background: #fbfcfa;
            color: inherit;
            cursor: pointer;
            padding: 9px 10px;
            text-align: left;
        }

        .esign-external-recipient-toggle > span {
            display: grid;
            gap: 2px;
            min-width: 0;
        }

        .esign-external-recipient-toggle svg {
            width: 16px;
            height: 16px;
            flex: 0 0 auto;
            color: var(--muted);
            transition: transform 0.16s ease;
        }

        .esign-external-recipient-toggle[aria-expanded="true"] svg {
            transform: rotate(180deg);
        }

        .esign-external-recipient-toggle strong {
            color: var(--ink);
            font-size: 12px;
            font-weight: 600;
        }

        .esign-external-recipient-toggle span span {
            color: var(--muted);
            font-size: 11px;
        }

        .esign-external-recipient-grid {
            display: grid;
            grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
            gap: 8px;
        }

        .esign-external-recipient-grid .full {
            grid-column: 1 / -1;
        }

        .esign-request-item {
            width: 100%;
            display: grid;
            gap: 6px;
            text-align: left;
            border: 1px solid var(--line);
            border-radius: 8px;
            background: var(--surface);
            padding: 12px;
            color: inherit;
            cursor: pointer;
        }

        .esign-request-item.active,
        .esign-request-item:hover {
            border-color: var(--accent);
            background: var(--accent-soft);
        }

        .esign-request-item strong,
        .esign-request-meta {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .esign-request-meta,
        .esign-field-row small {
            color: var(--muted);
            font-size: 12px;
        }

        .esign-toolbar,
        .esign-field-actions,
        .esign-status-row {
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            gap: 8px;
        }

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

        .esign-form-grid .span-2 {
            grid-column: 1 / -1;
        }

        .esign-document-frame {
            min-height: 430px;
            border: 1px solid var(--line);
            border-radius: 8px;
            background: #f8faf8;
            overflow: hidden;
        }

        .esign-pdf-document {
            display: grid;
            gap: 18px;
            justify-items: center;
            border: 0;
            background: transparent;
            overflow: visible;
        }

        .esign-document-frame iframe,
        .esign-document-frame img {
            width: 100%;
            height: 100%;
            min-height: 430px;
            border: 0;
            display: block;
            object-fit: contain;
            background: #ffffff;
        }

        @media (max-width: 1120px) {
            .esign-layout {
                grid-template-columns: minmax(0, 1fr);
            }

            .esign-create-panel-wrap {
                grid-template-columns: minmax(0, 1fr);
            }
        }

        .esign-field-list {
            display: grid;
            gap: 0;
        }

        .esign-editor {
            min-height: 0;
            overflow: auto;
        }

        .esign-record-content .esign-editor {
            min-height: 0;
            overflow: auto;
        }

        .esign-editor-panel {
            display: grid;
            grid-template-rows: auto minmax(0, 1fr);
            min-height: 0;
            height: 100%;
            overflow: hidden;
        }

        .esign-editor-panel .record-panel-body {
            display: grid;
            grid-template-rows: auto minmax(0, 1fr);
            gap: 0;
            min-height: 0;
            padding: 0;
            overflow: hidden;
        }

        .esign-editor-commandbar {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            align-items: center;
            gap: 8px 12px;
            padding: 8px;
            border-bottom: 1px solid var(--line-soft);
            background: #ffffff;
        }

        .esign-editor-commandbar .button {
            min-height: 28px;
            padding: 4px 8px;
            font-size: 11px;
        }

        .esign-editor-title {
            display: grid;
            gap: 2px;
            min-width: 0;
        }

        .esign-editor-title h3 {
            margin: 0;
            color: var(--ink);
            font-size: 14px;
            font-weight: 500;
            line-height: 1.2;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .esign-editor-meta {
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            gap: 6px;
            min-width: 0;
            color: var(--muted);
            font-size: 11px;
            line-height: 1.25;
        }

        .esign-editor-meta span {
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .esign-editor-actions {
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            gap: 6px;
            justify-content: flex-end;
        }

        .esign-editor-status {
            color: var(--muted);
            font-size: 12px;
            font-weight: 300;
        }

        .esign-placement-shell {
            display: grid;
            grid-template-columns: minmax(0, 1fr) 380px;
            gap: 0;
            min-height: 0;
            overflow: hidden;
            background: #eef2ef;
        }

        .esign-document-stage {
            position: relative;
            width: min(1040px, calc(100% - 48px));
            min-height: calc(100vh - 238px);
            margin: 0 auto;
            border: 0;
            border-radius: 0;
            background: transparent;
            overflow: visible;
        }

        .esign-document-stage.placing .esign-placement-layer {
            cursor: crosshair;
        }

        .esign-document-stage .esign-document-frame {
            min-height: 620px;
            border: 0;
            border-radius: 0;
        }

        .esign-document-stage .esign-document-frame iframe,
        .esign-document-stage .esign-document-frame img {
            min-height: 620px;
        }

        .esign-document-workbench {
            min-width: 0;
            min-height: 0;
            overflow: auto;
            scrollbar-gutter: stable;
            padding: 22px 0 32px;
        }

        .esign-tool-rail {
            display: none;
            align-content: start;
            gap: 8px;
            padding: 14px 10px;
            border-right: 1px solid #d9e1dc;
            background: #ffffff;
            overflow: auto;
        }

        .esign-tool-rail-title {
            color: var(--muted);
            font-size: 10px;
            font-weight: 600;
            line-height: 1.1;
            text-align: center;
            text-transform: uppercase;
            letter-spacing: 0.06em;
        }

        .esign-field-tools {
            display: grid;
            grid-template-columns: minmax(0, 1fr);
            gap: 6px;
        }

        .esign-field-palette .esign-field-tools {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        .esign-placement-layer {
            position: absolute;
            inset: 0;
            z-index: 3;
            cursor: default;
            pointer-events: none;
        }

        .esign-document-stage.placing .esign-placement-layer,
        .esign-template-upload-stage.placing .esign-placement-layer {
            pointer-events: auto;
        }

        .esign-placement-layer .esign-placement-field {
            pointer-events: auto;
        }

        .esign-pdf-form-layer {
            position: absolute;
            inset: 0;
            z-index: 2;
            pointer-events: none;
        }

        .esign-pdf-form-control {
            position: absolute;
            box-sizing: border-box;
            min-width: 12px;
            min-height: 12px;
            padding: 2px 5px;
            border: 1px solid transparent;
            border-radius: 3px;
            outline: 0;
            background: rgba(255,255,255,0.02);
            color: #17231f;
            font-family: Inter, sans-serif;
            font-size: clamp(9px, 1.15vw, 13px);
            line-height: 1.15;
            pointer-events: auto;
            transition: border-color 120ms ease, box-shadow 120ms ease, background 120ms ease;
        }

        .esign-pdf-form-control:hover {
            border-color: rgba(31,77,77,0.34);
            background: rgba(255,255,255,0.72);
        }

        .esign-pdf-form-control:focus {
            border-color: #1f4d4d;
            background: #ffffff;
            box-shadow: 0 0 0 2px rgba(31,77,77,0.12);
        }

        .esign-pdf-form-control.is-checkbox {
            padding: 0;
            accent-color: #1f4d4d;
        }

        .esign-pdf-form-control.is-multiline {
            padding: 5px;
            line-height: 1.35;
            resize: none;
            overflow: auto;
            white-space: pre-wrap;
        }

        .esign-dynamic-agency-logo {
            position: absolute;
            z-index: 1;
            display: block;
            object-fit: contain;
            object-position: right center;
            pointer-events: none;
            min-height: 0 !important;
            max-width: none;
        }

        .esign-document-page {
            position: relative;
            width: 100%;
            border: 0;
            outline: 1px solid #d8ded9;
            border-radius: 4px;
            background: #ffffff;
            overflow: hidden;
            box-shadow: 0 14px 30px rgba(30,39,36,0.12);
        }

        .esign-document-page canvas,
        .esign-document-page img {
            display: block;
            width: 100%;
            height: auto;
            min-height: 0;
            background: #ffffff;
        }

        .esign-page-label {
            position: absolute;
            left: 10px;
            top: 10px;
            z-index: 4;
            border: 1px solid rgba(31,77,77,0.18);
            border-radius: 999px;
            padding: 4px 8px;
            background: rgba(255,255,255,0.88);
            color: var(--muted);
            font-size: 11px;
            font-weight: 600;
            pointer-events: none;
        }

        .esign-placement-field {
            position: absolute;
            border: 1px solid var(--esign-recipient-border, rgba(31, 77, 77, 0.5));
            border-radius: 7px;
            background: var(--esign-recipient-bg, rgba(232, 241, 240, 0.92));
            color: var(--esign-recipient-text, var(--accent));
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 4px 8px;
            font-size: 12px;
            font-weight: 500;
            line-height: 1.15;
            cursor: move;
            box-shadow: 0 8px 18px rgba(30,39,36,0.12);
            touch-action: none;
            user-select: none;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            transition: border-color 120ms ease, box-shadow 120ms ease, background 120ms ease;
        }

        .esign-placement-field[data-field-type="signature"],
        .esign-placement-field[data-field-type="initials"] {
            background: var(--esign-recipient-bg, rgba(219, 235, 255, 0.95));
            border-color: var(--esign-recipient-border, rgba(25, 86, 126, 0.48));
            color: var(--esign-recipient-text, #19567e);
        }

        .esign-placement-field[data-field-type="checkbox"] {
            background: var(--esign-recipient-bg, rgba(255, 240, 184, 0.95));
            border-color: var(--esign-recipient-border, rgba(116, 86, 0, 0.36));
            color: var(--esign-recipient-text, #745600);
        }

        .esign-placement-label {
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .esign-placement-field.active,
        .esign-placement-field.dragging {
            border-color: var(--esign-recipient-border, var(--accent));
            background: var(--esign-recipient-bg, rgba(232, 241, 240, 0.98));
            box-shadow: 0 0 0 3px var(--accent-ring), 0 12px 24px rgba(30,39,36,0.16);
            z-index: 5;
        }

        .esign-placement-field.dragging {
            cursor: grabbing;
        }

        .esign-resize-handle {
            position: absolute;
            right: -5px;
            bottom: -5px;
            width: 13px;
            height: 13px;
            border: 2px solid #ffffff;
            border-radius: 999px;
            background: var(--accent);
            box-shadow: 0 3px 8px rgba(30,39,36,0.22);
            cursor: nwse-resize;
            opacity: 0;
            transition: opacity 120ms ease;
        }

        .esign-placement-field.active .esign-resize-handle,
        .esign-placement-field:hover .esign-resize-handle {
            opacity: 1;
        }

        .esign-field-palette {
            display: grid;
            align-content: start;
            gap: 0;
            border-left: 1px solid #dfe6e2;
            padding: 18px;
            background: #ffffff;
            min-height: 0;
            overflow: auto;
            scrollbar-gutter: stable;
        }

        .esign-palette-section {
            display: grid;
            gap: 10px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            padding: 12px;
            background: #ffffff;
        }

        .esign-palette-section + .esign-inspector {
            border-top: 1px solid var(--line-soft);
            padding-top: 12px;
        }

        .esign-field-palette > .esign-inspector {
            border: 0;
            border-top: 1px solid var(--line-soft);
            border-radius: 0;
            padding: 12px 0 0;
            background: transparent;
        }

        .esign-field-palette h4 {
            margin: 0;
            font-size: 13px;
            font-weight: 600;
        }

        .esign-field-palette p {
            margin: 0;
            color: var(--muted);
            font-size: 12px;
            line-height: 1.4;
        }

        .esign-field-palette .esign-form-grid {
            gap: 10px;
        }

        .esign-field-palette .esign-toolbar {
            align-items: stretch;
            justify-content: flex-end;
        }

        .esign-field-palette .mini-button {
            min-width: 0;
            flex: 1 1 calc(50% - 4px);
        }

        .esign-tool-grid {
            display: grid;
            grid-template-columns: minmax(0, 1fr);
            gap: 8px;
        }

        .esign-tool-button {
            min-height: 38px;
            border: 1px solid var(--line);
            border-radius: 7px;
            background: #ffffff;
            color: var(--ink);
            cursor: pointer;
            font: inherit;
            font-size: 12px;
            font-weight: 400;
            display: inline-flex;
            flex-direction: row;
            align-items: center;
            justify-content: flex-start;
            gap: 8px;
            padding: 7px 10px;
            text-align: left;
        }

        .esign-tool-button.active {
            border-color: rgba(31, 77, 77, 0.44);
            background: var(--accent-soft);
            color: var(--accent);
            box-shadow: 0 0 0 3px var(--accent-ring);
        }

        .esign-tool-button svg {
            width: 17px;
            height: 17px;
            stroke-width: 2;
        }

        .esign-tool-rail .esign-tool-button {
            min-height: 54px;
        }

        .esign-field-tools .esign-tool-button {
            min-height: 40px;
        }

        .esign-recipient-stack {
            display: grid;
            gap: 8px;
        }

        .esign-stage-panel {
            display: grid;
            gap: 12px;
            border: 0;
            border-top: 1px solid var(--line-soft);
            border-radius: 0;
            padding: 18px 0;
            background: transparent;
        }

        .esign-stage-panel:first-child {
            border-top: 0;
            padding-top: 0;
        }

        .esign-step-footer {
            display: grid;
            gap: 9px;
            margin-top: 4px;
            padding-top: 14px;
            border-top: 1px solid var(--line-soft);
        }

        .esign-step-footer p {
            margin: 0;
            color: var(--muted);
            font-size: 11px;
            line-height: 1.35;
        }

        .esign-step-next {
            width: 100%;
            min-height: 40px;
            justify-content: center;
            gap: 8px;
        }

        .esign-step-next svg {
            width: 16px;
            height: 16px;
            flex: 0 0 auto;
        }

        .esign-stage-header {
            display: grid;
            grid-template-columns: minmax(0, 1fr);
            gap: 0;
            align-items: start;
        }

        .esign-stage-number {
            display: none;
            width: 30px;
            height: 30px;
            border-radius: 50%;
            align-items: center;
            justify-content: center;
            background: var(--accent-soft);
            color: var(--accent);
            font-size: 12px;
            font-weight: 700;
        }

        .esign-stage-header h4 {
            margin: 0;
            font-size: 12px;
            font-weight: 600;
            letter-spacing: 0.04em;
            text-transform: uppercase;
            color: #465366;
        }

        .esign-stage-header p {
            display: none;
            margin: 2px 0 0;
            color: var(--muted);
            font-size: 12px;
            line-height: 1.35;
        }

        .esign-editor-recipient-search {
            display: grid;
            gap: 8px;
        }

        .esign-editor-recipient-search input {
            width: 100%;
            height: 36px;
            border: 1px solid var(--line);
            border-radius: 7px;
            background: #ffffff;
            color: var(--ink);
            font: inherit;
            font-size: 13px;
            padding: 0 10px;
        }

        .esign-signatures-panel {
            display: grid;
            gap: 8px;
        }

        .esign-signatures-head {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            gap: 10px;
            align-items: center;
            border-bottom: 0;
            padding-bottom: 2px;
        }

        .esign-signatures-head strong {
            display: block;
            font-size: 13px;
            font-weight: 600;
        }

        .esign-signatures-head span {
            display: block;
            margin-top: 3px;
            color: var(--muted);
            font-size: 12px;
        }

        .esign-signatory-list {
            display: grid;
            gap: 0;
            border-top: 1px solid var(--line-soft);
        }

        .esign-signatory-card {
            display: grid;
            gap: 6px;
            border: 0;
            border-bottom: 1px solid var(--line-soft);
            border-radius: 0;
            padding: 11px 0;
            background: transparent;
        }

        .esign-signatory-top {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            gap: 10px;
            align-items: start;
        }

        .esign-signatory-top strong,
        .esign-signatory-top span {
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .esign-signatory-top strong {
            display: block;
            font-size: 14px;
            font-weight: 600;
        }

        .esign-signatory-top span,
        .esign-signatory-meta {
            color: var(--muted);
            font-size: 12px;
        }

        .esign-signatory-meta {
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            gap: 6px;
        }

        .esign-recipient-tracking {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 10px;
            align-items: center;
            margin-top: 7px;
            padding: 10px 8px 8px;
            border: 1px solid #e4e9e6;
            border-radius: 9px;
            background: #f6f8f7;
        }

        .esign-recipient-tracking-step {
            display: grid;
            justify-items: center;
            gap: 5px;
            min-width: 0;
            text-align: center;
            color: var(--muted);
            font-size: 10px;
            line-height: 1.2;
        }

        .esign-recipient-tracking-step strong {
            display: block;
            overflow: hidden;
            width: 100%;
            color: #65716d;
            font-size: 10px;
            font-weight: 500;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .esign-recipient-tracking-icon {
            display: inline-flex;
            width: 30px;
            height: 30px;
            align-items: center;
            justify-content: center;
            border: 1px solid #dce3df;
            border-radius: 50%;
            background: #f3f6f4;
            color: #8b9691;
        }

        .esign-recipient-tracking-icon svg {
            width: 15px;
            height: 15px;
        }

        .esign-recipient-tracking-step.complete .esign-recipient-tracking-icon {
            border-color: #bfe4cb;
            background: #dff4e6;
            color: #237a45;
        }

        .esign-recipient-bounced {
            display: flex;
            gap: 7px;
            align-items: center;
            margin-top: 7px;
            padding: 7px 9px;
            border: 1px solid #f1c7c7;
            border-radius: 7px;
            background: #fbe3e3;
            color: #a43c3c;
            font-size: 11px;
            font-weight: 600;
        }

        .esign-recipient-bounced svg {
            width: 14px;
            height: 14px;
            flex: 0 0 auto;
        }

        .esign-signatory-state {
            color: var(--muted);
            font-size: 12px;
            font-weight: 500;
            white-space: nowrap;
        }

        .esign-signatory-actions {
            display: flex;
            gap: 8px;
            justify-content: flex-end;
        }

        .esign-completed-sidebar {
            display: grid;
            align-content: start;
            gap: 18px;
        }

        .esign-completed-summary {
            display: grid;
            gap: 10px;
            border-bottom: 1px solid var(--line-soft);
            padding-bottom: 16px;
        }

        .esign-completed-summary strong {
            color: var(--ink);
            font-size: 15px;
            font-weight: 600;
        }

        .esign-completed-summary span,
        .esign-completed-note {
            color: var(--muted);
            font-size: 12px;
            font-weight: 300;
            line-height: 1.45;
        }

        .esign-completed-stat-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 8px;
        }

        .esign-completed-stat {
            display: grid;
            gap: 3px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #fbfcfa;
            padding: 10px;
        }

        .esign-completed-stat span {
            color: var(--muted);
            font-size: 11px;
            font-weight: 500;
            text-transform: uppercase;
            letter-spacing: 0.04em;
        }

        .esign-completed-stat strong {
            min-width: 0;
            overflow: hidden;
            color: var(--ink);
            font-size: 13px;
            font-weight: 500;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .esign-completed-checklist {
            display: grid;
            gap: 8px;
        }

        .esign-completed-check {
            display: grid;
            grid-template-columns: 28px minmax(0, 1fr);
            gap: 9px;
            align-items: center;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #ffffff;
            padding: 9px;
        }

        .esign-completed-check-mark {
            width: 28px;
            height: 28px;
            border-radius: 50%;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: #dcfce7;
            color: #166534;
            font-size: 12px;
            font-weight: 700;
            line-height: 1;
            text-align: center;
        }

        .esign-completed-check strong,
        .esign-completed-check span:not(.esign-completed-check-mark) {
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .esign-completed-check strong {
            display: block;
            color: var(--ink);
            font-size: 13px;
            font-weight: 500;
        }

        .esign-completed-check span:not(.esign-completed-check-mark) {
            display: block;
            margin-top: 2px;
            color: var(--muted);
            font-size: 12px;
            font-weight: 300;
        }

        .esign-recipient-chip {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            gap: 12px;
            align-items: center;
            border: 1px solid var(--line-soft);
            border-radius: 7px;
            padding: 9px;
            background: #fbfcfa;
        }

        .esign-recipient-chip > div:first-child {
            display: grid;
            gap: 2px;
            min-width: 0;
        }

        .esign-recipient-chip strong {
            display: flex;
            align-items: center;
            gap: 7px;
        }

        .esign-recipient-colour-dot {
            width: 9px;
            height: 9px;
            flex: 0 0 auto;
            border-radius: 50%;
            background: var(--esign-recipient-border, var(--accent));
        }

        .esign-recipient-chip-actions {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            gap: 7px;
            min-width: 0;
        }

        .esign-recipient-chip.is-readonly {
            grid-template-columns: minmax(0, 1fr) auto;
        }

        .esign-recipient-chip.is-readonly.has-action {
            grid-template-columns: minmax(0, 1fr) auto;
        }

        .esign-recipient-order {
            justify-self: end;
            border: 1px solid var(--line-soft);
            border-radius: 7px;
            padding: 5px 8px;
            background: #ffffff;
            color: var(--muted);
            font-size: 11px;
            font-weight: 600;
        }

        .esign-recipient-chip strong,
        .esign-recipient-chip span {
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .esign-recipient-chip span {
            color: var(--muted);
            font-size: 12px;
        }

        .esign-recipient-chip input {
            width: 40px;
            height: 32px;
            border: 1px solid var(--line);
            border-radius: 7px;
            background: #ffffff;
            color: var(--ink);
            font: inherit;
            font-size: 12px;
            padding: 0 8px;
            text-align: center;
            font-variant-numeric: tabular-nums;
            -moz-appearance: textfield;
        }

        .esign-recipient-chip input::-webkit-outer-spin-button,
        .esign-recipient-chip input::-webkit-inner-spin-button {
            margin: 0;
            -webkit-appearance: none;
        }

        .esign-recipient-remove {
            width: 30px;
            height: 30px;
            display: inline-grid;
            place-items: center;
            flex: 0 0 auto;
            padding: 0;
            border: 1px solid #efc7c4;
            border-radius: 50%;
            background: #fff7f6;
            color: #b53630;
            font: inherit;
            font-size: 18px;
            font-weight: 400;
            line-height: 1;
            cursor: pointer;
        }

        .esign-recipient-remove:hover {
            border-color: #d9827c;
            background: #fff0ef;
            color: #991b1b;
        }

        @media (max-width: 560px) {
            .esign-recipient-chip {
                grid-template-columns: 1fr;
                align-items: start;
            }

            .esign-recipient-chip-actions {
                justify-content: flex-start;
            }
        }

        .esign-placement-tip {
            margin: -2px 0 0;
            color: var(--muted);
            font-size: 12px;
            line-height: 1.4;
        }

        .esign-field-row {
            display: grid;
            grid-template-columns: 96px minmax(0, 1fr);
            gap: 8px;
            align-items: center;
            border: 0;
            border-top: 1px solid var(--line-soft);
            border-radius: 0;
            padding: 10px 0 0;
            background: transparent;
            cursor: pointer;
            transition: border-color 120ms ease, background 120ms ease, box-shadow 120ms ease;
        }

        .esign-field-row:first-child {
            border-top: 0;
            padding-top: 0;
        }

        .esign-field-row:hover {
            border-color: var(--line-soft);
            box-shadow: none;
        }

        .esign-field-row select,
        .esign-field-row input[data-esign-field-label] {
            width: 100%;
            min-width: 0;
        }

        .esign-field-row select,
        .esign-field-row input[data-esign-field-label] {
            height: 32px;
            border: 1px solid var(--line);
            border-radius: 7px;
            background: #ffffff;
            color: var(--ink);
            font: inherit;
            font-size: 12px;
            padding: 0 8px;
        }

        .esign-field-row select {
            grid-column: auto;
        }

        .esign-field-row input[data-esign-field-label] {
            grid-column: auto;
        }

        .esign-field-row select[data-esign-field-assignee] {
            grid-column: 1 / -1;
        }

        .esign-field-actions {
            grid-column: 1 / -1;
            justify-content: space-between;
            padding-top: 2px;
        }

        .esign-field-row small {
            grid-column: 1 / -1;
        }

        .esign-field-row.active {
            border-color: rgba(31, 77, 77, 0.25);
            background: transparent;
            box-shadow: none;
        }

        .esign-inspector {
            display: grid;
            gap: 10px;
            border-top: 1px solid var(--line-soft);
            padding-top: 12px;
        }

        .esign-inspector h4 {
            margin: 0;
            font-size: 13px;
            font-weight: 600;
        }

        .esign-inspector-empty {
            margin: 0;
            color: var(--muted);
            font-size: 12px;
            line-height: 1.4;
        }

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

        .esign-inspector-grid label {
            display: grid;
            gap: 4px;
            color: var(--muted);
            font-size: 11px;
            font-weight: 500;
            text-transform: uppercase;
            letter-spacing: 0.04em;
        }

        .esign-inspector-grid input {
            width: 100%;
            height: 34px;
            border: 1px solid var(--line);
            border-radius: 7px;
            background: #ffffff;
            color: var(--ink);
            font: inherit;
            font-size: 12px;
            padding: 0 8px;
        }

        .esign-sign-fields {
            display: grid;
            gap: 12px;
        }

        .esign-sign-field {
            display: grid;
            gap: 6px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            padding: 12px;
            background: var(--surface);
        }

        @media (max-width: 1180px) {
            .esign-placement-shell {
                grid-template-columns: minmax(0, 1fr);
                overflow: auto;
            }

            .esign-tool-rail {
                display: none;
            }

            .esign-tool-rail-title {
                grid-column: 1 / -1;
                text-align: left;
            }

            .esign-field-palette {
                border-left: 0;
                border-top: 1px solid #d9e1dc;
                overflow: visible;
            }

            .esign-document-stage {
                height: 68vh;
                min-height: 560px;
            }

            .esign-document-stage .esign-document-frame,
            .esign-document-stage .esign-document-frame iframe,
            .esign-document-stage .esign-document-frame img {
                height: 100%;
                min-height: 560px;
            }
        }

        @media (max-width: 760px) {
            .esign-editor-commandbar {
                grid-template-columns: minmax(0, 1fr);
                align-items: start;
            }

            .esign-editor-actions {
                justify-content: stretch;
            }

            .esign-editor-actions .button {
                flex: 1 1 calc(50% - 4px);
            }

            .esign-document-stage {
                width: min(720px, calc(100% - 24px));
                margin: 12px auto;
            }
        }

        .pin-toggle {
            justify-self: start;
            display: inline-flex;
            align-items: center;
            cursor: pointer;
            user-select: none;
        }

        .pin-toggle input {
            position: absolute;
            width: 1px;
            height: 1px;
            overflow: hidden;
            clip: rect(0 0 0 0);
            clip-path: inset(50%);
            white-space: nowrap;
        }

        .pin-toggle-ui {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            min-height: 32px;
            border: 1px solid var(--line);
            border-radius: 999px;
            background: #ffffff;
            color: #4c5a54;
            padding: 0 11px 0 9px;
            font-size: 12px;
            font-weight: 400;
            transition: background 0.16s ease, border-color 0.16s ease, color 0.16s ease, box-shadow 0.16s ease;
        }

        .pin-toggle-ui svg {
            width: 14px;
            height: 14px;
            stroke-width: 2;
        }

        .pin-toggle:hover .pin-toggle-ui {
            border-color: #cbd5d0;
            box-shadow: 0 1px 4px rgba(30, 39, 36, 0.06);
        }

        .pin-toggle input:focus-visible + .pin-toggle-ui {
            border-color: var(--accent);
            box-shadow: 0 0 0 3px var(--accent-ring);
        }

        .pin-toggle input:checked + .pin-toggle-ui {
            background: #e5f1ee;
            border-color: rgba(31, 77, 77, 0.38);
            color: var(--accent);
        }

        .comment-list,
        .activity-list,
        .document-list {
            display: grid;
            gap: 10px;
        }

        .comment-item,
        .activity-item,
        .document-item {
            border: 1px solid var(--line-soft);
            border-radius: 7px;
            background: #ffffff;
            padding: 10px;
        }

        .comment-item {
            display: grid;
            grid-template-columns: 34px minmax(0, 1fr);
            gap: 11px;
            scroll-margin-top: 92px;
            position: relative;
            transition: border-color 0.16s ease, box-shadow 0.16s ease, background 0.16s ease;
        }

        .comment-item.is-target {
            border-color: var(--accent);
            box-shadow: 0 0 0 3px var(--accent-ring);
        }

        .comment-item.pinned {
            border-color: rgba(31, 77, 77, 0.28);
            background: #f6fbf8;
        }

        .comment-content {
            min-width: 0;
            display: grid;
            gap: 7px;
        }

        .comment-author-line {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 10px;
        }

        .comment-author-actions {
            display: inline-flex;
            align-items: center;
            justify-content: flex-end;
            gap: 6px;
            flex: 0 0 auto;
        }

        .comment-menu {
            position: relative;
            z-index: 3;
            display: inline-flex;
        }

        .comment-menu-toggle {
            width: 24px;
            height: 24px;
            border: 1px solid var(--line);
            border-radius: 50%;
            background: #ffffff;
            color: var(--muted);
            cursor: pointer;
            display: grid;
            place-items: center;
            padding: 0;
        }

        .comment-menu-toggle:hover,
        .comment-menu-toggle[aria-expanded="true"] {
            background: #f1f3f0;
            color: var(--ink);
        }

        .comment-menu-toggle svg {
            width: 14px;
            height: 14px;
        }

        .comment-menu-popover {
            position: absolute;
            top: 30px;
            right: 0;
            min-width: 112px;
            padding: 5px;
            border: 1px solid var(--line);
            border-radius: 8px;
            background: #ffffff;
            box-shadow: 0 10px 28px rgba(28, 36, 32, 0.14);
            display: grid;
            gap: 2px;
        }

        .comment-menu-popover[hidden] {
            display: none;
        }

        .comment-menu-popover button {
            width: 100%;
            border: 0;
            border-radius: 6px;
            background: transparent;
            color: var(--ink);
            cursor: pointer;
            font: inherit;
            font-size: 12px;
            text-align: left;
            padding: 7px 9px;
        }

        .comment-menu-popover button:hover {
            background: #f4f6f3;
        }

        .comment-menu-popover button[data-delete-comment] {
            color: #a73333;
        }

        .side-search {
            width: 100%;
            min-height: 34px;
            border: 1px solid var(--line);
            border-radius: 7px;
            background: #ffffff;
            color: var(--ink);
            font: inherit;
            font-size: 12px;
            padding: 7px 10px;
            outline: none;
        }

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

        .side-search::placeholder {
            color: var(--quiet);
        }

        .activity-item.airtable-activity {
            display: grid;
            grid-template-columns: 28px minmax(0, 1fr);
            gap: 8px;
            border: 0;
            border-radius: 0;
            background: transparent;
            padding: 2px 0 8px;
        }

        .activity-item.airtable-activity + .activity-item.airtable-activity {
            border-top: 1px solid var(--line-soft);
            padding-top: 10px;
        }

        .activity-item.airtable-activity .avatar {
            width: 28px;
            height: 28px;
        }

        .activity-item.airtable-activity .activity-avatar-fallback {
            color: #7a8780;
            background: #edf2ef;
        }

        .activity-item.airtable-activity .activity-avatar-fallback svg {
            width: 15px;
            height: 15px;
        }

        .activity-event-content {
            min-width: 0;
            display: grid;
            gap: 5px;
        }

        .activity-event-head {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            gap: 8px;
            align-items: start;
            color: #59635e;
            font-family: inherit;
            font-size: 10px !important;
            font-weight: 400 !important;
            line-height: 1.35;
        }

        .activity-event-head strong {
            color: var(--ink);
            font-family: inherit;
            font-size: 10px !important;
            font-weight: 500 !important;
        }

        .activity-event-time {
            color: var(--muted);
            white-space: nowrap;
            font-family: inherit;
            font-size: 10px !important;
            font-weight: 300 !important;
        }

        .activity-change-card {
            overflow: hidden;
            border-radius: 6px;
            background: #f0f2f5;
            padding: 6px;
        }

        .record-content .activity-change-label {
            display: block;
            margin: 0 0 5px;
            color: #626b67;
            font-family: inherit;
            font-size: 10px !important;
            font-weight: 400 !important;
            letter-spacing: 0;
            text-transform: none;
        }

        .activity-change-value {
            display: block;
            min-height: 22px;
            padding: 4px 6px;
            color: #26312b;
            font-family: inherit;
            font-size: 10px !important;
            font-weight: 400 !important;
            line-height: 1.3;
            word-break: break-word;
        }

        .activity-change-value.old {
            background: #fde8ee;
            color: #a62e48;
            text-decoration: line-through;
        }

        .activity-change-value.new {
            background: #def7e8;
            color: #1d613b;
        }

        .activity-event-note {
            color: var(--muted);
            font-family: inherit;
            font-size: 10px !important;
            font-weight: 300 !important;
            line-height: 1.4;
        }

        .activity-access-meta {
            display: flex;
            flex-wrap: wrap;
            gap: 3px 10px;
            color: #55625c;
            font-family: inherit;
            font-size: 10px !important;
            font-weight: 400 !important;
            line-height: 1.4;
        }

        .activity-access-meta span {
            font: inherit !important;
        }

        .comment-author-name {
            color: var(--ink);
            font-size: 12px;
            font-weight: 600;
            line-height: 1.25;
        }

        .comment-time {
            color: var(--muted);
            font-size: 12px;
            font-weight: 300;
            line-height: 1.25;
            white-space: nowrap;
        }

        .item-meta {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            color: var(--muted);
            font-size: 11px;
            font-weight: 300;
            margin-bottom: 7px;
        }

        .comment-body,
        .activity-body {
            color: var(--ink);
            font-size: 13px;
            line-height: 1.45;
            font-weight: 300;
            white-space: pre-wrap;
            word-break: break-word;
        }

        .comment-body {
            line-height: 1.5;
        }

        .mention {
            color: var(--accent);
            font-weight: 500;
            background: rgba(31, 77, 77, 0.08);
            border-radius: 999px;
            padding: 0 4px;
        }

        .mention-composer-shell {
            position: relative;
        }

        .mention-composer-shell > textarea {
            width: 100%;
        }

        .mention-picker {
            position: absolute;
            z-index: 30;
            left: 0;
            right: 0;
            top: calc(100% + 6px);
            max-height: 248px;
            overflow-y: auto;
            padding: 6px;
            border: 1px solid #d8dfdc;
            border-radius: 12px;
            background: #fff;
            box-shadow: 0 12px 28px rgba(25, 47, 42, .16);
        }

        .mention-picker-option {
            display: flex;
            width: 100%;
            align-items: center;
            gap: 10px;
            padding: 9px 10px;
            border: 0;
            border-radius: 8px;
            background: transparent;
            color: #23332e;
            text-align: left;
            cursor: pointer;
        }

        .mention-picker-option:hover,
        .mention-picker-option.is-active {
            background: #eef5f1;
        }

        .mention-picker-avatar {
            display: grid;
            width: 32px;
            height: 32px;
            flex: 0 0 32px;
            place-items: center;
            overflow: hidden;
            border-radius: 50%;
            background: #dfece6;
            color: #1f5948;
            font-size: 11px;
            font-weight: 750;
        }

        .mention-picker-avatar img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .mention-picker-copy {
            min-width: 0;
        }

        .mention-picker-copy strong,
        .mention-picker-copy small {
            display: block;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .mention-picker-copy strong {
            font-size: 13px;
        }

        .mention-picker-copy small {
            margin-top: 2px;
            color: #6c7974;
            font-size: 11px;
        }

        .topic-row,
        .item-actions {
            display: flex;
            align-items: center;
            gap: 6px;
            flex-wrap: wrap;
            margin-top: 8px;
        }

        .topic-chip {
            display: inline-flex;
            align-items: center;
            border-radius: 999px;
            background: #eef2ee;
            color: #56615b;
            padding: 3px 8px;
            font-size: 11px;
            font-weight: 400;
        }

        .comment-pinned-badge {
            background: #e5f1ee;
            color: var(--accent);
            border: 1px solid rgba(31, 77, 77, 0.18);
        }

        .text-button {
            border: 0;
            background: transparent;
            color: var(--accent);
            cursor: pointer;
            padding: 2px 0;
            font: inherit;
            font-size: 12px;
            font-weight: 400;
        }

        .comment-item .item-actions {
            border-top: 1px solid var(--line-soft);
            padding-top: 7px;
            margin-top: 2px;
        }

        .activity-actions {
            display: flex;
            gap: 8px;
            justify-content: flex-end;
            margin-bottom: 8px;
        }

        .record-panel-body.user-activity-pane {
            display: grid;
            align-content: start;
            gap: 12px;
        }

        .record-panel-body.user-activity-pane .activity-actions {
            margin-bottom: 0;
        }

        .document-item {
            display: grid;
            grid-template-columns: 54px minmax(0, 1fr);
            gap: 10px;
            align-items: center;
            position: relative;
        }

        .document-thumb {
            width: 54px;
            height: 54px;
            border-radius: 7px;
            border: 1px solid var(--line);
            background: #f7f8f6;
            display: grid;
            place-items: center;
            overflow: hidden;
            color: var(--muted);
            font-size: 11px;
            font-weight: 500;
            text-transform: uppercase;
        }

        .document-thumb img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .document-info {
            min-width: 0;
        }

        .document-info a {
            display: block;
            color: var(--ink);
            font-size: 13px;
            font-weight: 400;
            text-decoration: none;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .document-info small {
            display: block;
            color: var(--muted);
            font-size: 11px;
            font-weight: 300;
            margin-top: 3px;
        }

        .document-preview {
            display: none;
            position: absolute;
            right: 10px;
            bottom: calc(100% + 8px);
            width: 280px;
            height: 220px;
            border: 1px solid var(--line);
            border-radius: 8px;
            background: #ffffff;
            box-shadow: 0 18px 60px rgba(30,39,36,0.16);
            overflow: hidden;
            z-index: 20;
        }

        .document-item:hover .document-preview {
            display: block;
        }

        .document-preview img,
        .document-preview iframe {
            width: 100%;
            height: 100%;
            border: 0;
            object-fit: contain;
            background: #ffffff;
        }

        .photo-lightbox {
            position: fixed;
            inset: 0;
            z-index: 30000;
            background: radial-gradient(circle at 50% 35%,rgba(48,61,55,.18),transparent 48%),rgba(8,12,10,.8);
            display: grid;
            grid-template-rows: auto minmax(0, 1fr) auto;
            gap: 14px;
            padding: 18px 20px 16px;
            backdrop-filter: blur(4px);
        }

        .photo-lightbox[hidden] {
            display: none !important;
        }

        .photo-lightbox-head {
            display: flex;
            align-items: center;
            gap: 10px;
            justify-content: flex-end;
            min-height:52px;
            padding:8px 10px 8px 14px;
            border:1px solid rgba(255,255,255,.12);
            border-radius:11px;
            background:rgba(255,255,255,.07);
            box-shadow:0 12px 34px rgba(0,0,0,.14);
        }

        .photo-lightbox-title { display:grid;gap:2px;margin-right:auto;color:#fff; }
        .photo-lightbox-title strong { font-size:15px;font-weight:650;letter-spacing:-.01em; }
        .photo-lightbox-title span { color:rgba(255,255,255,.68);font-size:11px; }
        .photo-lightbox-actions { display:flex;gap:7px; }
        .photo-lightbox-actions button { min-height:34px;padding:0 13px;border:1px solid rgba(255,255,255,.18);border-radius:7px;background:rgba(255,255,255,.1);color:#fff;font:600 10px Inter,Arial,sans-serif;cursor:pointer;transition:.16s ease; }
        .photo-lightbox-actions button:first-child { border-color:rgba(125,224,142,.34);background:rgba(62,151,82,.25); }
        .photo-lightbox-actions button:hover { transform:translateY(-1px);background:rgba(255,255,255,.18); }
        .photo-lightbox-actions button.danger { border-color:rgba(255,137,137,.22);color:#ffdada; }

        .photo-lightbox-body {
            min-height: 0;
            display: grid;
            grid-template-columns: minmax(0, 1fr) 218px;
            gap: 14px;
        }

        .photo-lightbox-canvas { min-width:0;min-height:0;display:grid;grid-template-columns:46px minmax(0,1fr) 46px;align-items:center;gap:14px; }
        .photo-lightbox-canvas.single-photo { grid-template-columns:minmax(0,1fr); }

        .photo-lightbox-frame {
            position:relative;
            height: 100%;
            min-height: 0;
            border:1px solid rgba(255,255,255,.1);
            border-radius: 12px;
            overflow: hidden;
            background:rgba(0,0,0,.28);
            box-shadow:0 22px 60px rgba(0,0,0,.28);
            display: grid;
            place-items: center;
        }

        .photo-lightbox-frame img,
        .photo-lightbox-frame video {
            position:absolute;
            inset:0;
            width: 100%;
            height: 100%;
            object-fit: contain;
        }

        .photo-lightbox-button {
            width: 42px;
            height: 42px;
            border: 1px solid rgba(255,255,255,0.2);
            border-radius: 50%;
            background: rgba(255,255,255,0.1);
            color: #fff;
            display: grid;
            place-items: center;
            cursor: pointer;
        }

        .photo-lightbox-button:hover {
            background: rgba(255,255,255,0.2);
        }

        .photo-lightbox-caption {
            justify-self:center;
            min-height:28px;
            padding:7px 13px;
            border:1px solid rgba(255,255,255,.1);
            border-radius:999px;
            background:rgba(255,255,255,.07);
            color: rgba(255,255,255,0.82);
            text-align: center;
            font-size: 13px;
            font-weight: 300;
        }

        .photo-lightbox-sidebar { min-height:0;padding:14px;border:1px solid rgba(255,255,255,.12);border-radius:11px;background:rgba(255,255,255,.055);overflow:hidden;box-shadow:0 18px 45px rgba(0,0,0,.16); }
        .photo-lightbox-sidebar>div:first-child { display:grid;gap:2px;margin-bottom:10px;color:#fff; }
        .photo-lightbox-sidebar>div:first-child strong { font-size:13px;font-weight:650; }
        .photo-lightbox-sidebar>div:first-child span { color:rgba(255,255,255,.58);font-size:9px; }
        .photo-lightbox-thumbs { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-height:100%;padding-bottom:40px;overflow:auto; }
        .photo-lightbox-thumb { position:relative;aspect-ratio:4/3;padding:0;border:2px solid transparent;border-radius:8px;background:rgba(255,255,255,.06);overflow:hidden;cursor:pointer;transition:border-color .16s ease,transform .16s ease,box-shadow .16s ease; }
        .photo-lightbox-thumb:hover { transform:translateY(-1px);border-color:rgba(255,255,255,.3); }
        .photo-lightbox-thumb img,.photo-lightbox-thumb video { width:100%;height:100%;object-fit:cover; }
        .photo-lightbox-thumb.active { border-color:#7de08e;box-shadow:0 0 0 2px rgba(125,224,142,.16); }
        .photo-lightbox-sidebar.single-photo .photo-lightbox-thumbs { grid-template-columns:1fr; }
        .photo-lightbox-thumb.dragging { opacity:.42; }
        .photo-lightbox-thumb.drop-before { box-shadow:0 -3px 0 #7de08e; }
        .photo-lightbox-thumb.drop-after { box-shadow:0 3px 0 #7de08e; }
        .photo-lightbox-thumb>span { position:absolute;right:4px;bottom:4px;display:grid;min-width:17px;height:17px;place-items:center;border-radius:5px;background:rgba(8,12,10,.72);color:#fff;font-size:8px; }

        @media(max-width:760px){.photo-lightbox{gap:9px;padding:10px}.photo-lightbox-head{min-height:46px;padding:6px}.photo-lightbox-title{display:none}.photo-lightbox-body{grid-template-columns:1fr;grid-template-rows:auto auto;align-content:center;gap:9px;overflow:hidden}.photo-lightbox-sidebar{padding:7px}.photo-lightbox-sidebar>div:first-child{display:none}.photo-lightbox-thumbs,.photo-lightbox-sidebar.single-photo .photo-lightbox-thumbs{display:flex;max-height:none;padding-bottom:0;overflow-x:auto}.photo-lightbox-thumb{flex:0 0 66px}.photo-lightbox-canvas{height:auto;grid-template-columns:36px minmax(0,1fr) 36px;gap:7px}.photo-lightbox-frame{height:auto;aspect-ratio:4/3}.photo-lightbox-frame img,.photo-lightbox-frame video{width:100%;height:100%;object-fit:contain}.photo-lightbox-button{width:34px;height:34px}.photo-lightbox-actions button{padding:0 9px}.photo-lightbox-caption{min-height:24px;padding:5px 10px;font-size:10px}}

        .map-panel {
            height: 240px;
            min-height: 240px;
            border: 1px solid var(--line);
            border-radius: 7px;
            overflow: hidden;
            background: #edf0ed;
        }

        .session-list {
            display: grid;
            gap: 10px;
            margin-top: 12px;
        }

        .session-item {
            border: 1px solid var(--line-soft);
            border-radius: 7px;
            background: #ffffff;
            padding: 10px;
            display: grid;
            gap: 4px;
        }

        .session-item strong {
            font-size: 13px;
            font-weight: 500;
        }

        .session-item span {
            color: var(--muted);
            font-size: 12px;
            font-weight: 300;
            line-height: 1.35;
        }

        .admin-content {
            grid-row: 2;
            min-width: 0;
            min-height: 0;
            height: calc(100vh - var(--topbar));
            padding: var(--table-page-padding);
            display: grid;
            grid-template-rows: auto minmax(0, 1fr);
            gap: var(--table-page-gap);
            overflow: hidden;
        }

        .admin-content .table-frame {
            grid-row: 2;
        }

        .admin-content.has-metric-cards {
            grid-template-rows: auto auto minmax(0, 1fr);
        }

        .admin-content.has-metric-cards .table-frame {
            grid-row: 3;
        }

        .admin-content.has-metric-cards .column-panel {
            top: 156px;
        }

        .settings-content {
            grid-row: 2;
            min-width: 0;
            min-height: 0;
            height: calc(100vh - var(--topbar));
            padding: 18px 28px 24px;
            display: grid;
            grid-template-columns: minmax(0, 1fr) 380px;
            grid-template-rows: auto minmax(0, 1fr);
            gap: 14px;
        }

        .agency-settings-content {
            grid-row: 2;
            min-width: 0;
            min-height: 0;
            height: calc(100vh - var(--topbar));
            padding: 18px 28px 24px;
            display: grid;
            grid-template-columns: minmax(0, 1fr) 380px;
            align-items: start;
            gap: 14px;
            overflow: auto;
        }

        .admin-content[hidden],
        .settings-content[hidden],
        .agency-settings-content[hidden] {
            display: none !important;
        }

        .admin-panel {
            min-width: 0;
            min-height: 0;
            background: #ffffff;
            border: 1px solid var(--line);
            border-radius: 7px;
            box-shadow: var(--shadow);
            display: grid;
            grid-template-rows: auto minmax(0, 1fr);
            overflow: hidden;
        }

        .admin-panel-head {
            padding: 15px 16px;
            border-bottom: 1px solid var(--line-soft);
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
        }

        .agency-settings-content .admin-panel-head {
            min-height: 69px;
            box-sizing: border-box;
        }

        .admin-panel-head h2,
        .admin-panel-head h3 {
            margin: 0;
            font-size: 15px;
            font-weight: 500;
        }

        .admin-panel-actions {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            gap: 10px;
            min-width: 0;
        }

        .admin-panel-body {
            min-height: 0;
            overflow: auto;
            padding: 14px 16px;
            display: grid;
            align-content: start;
            gap: 12px;
        }

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

        .agency-settings-overview {
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #f7f8f6;
            padding: 12px;
            display: grid;
            gap: 4px;
        }

        .agency-settings-overview span {
            color: var(--muted);
            font-size: 11px;
            font-weight: 500;
            letter-spacing: 0.04em;
            text-transform: uppercase;
        }

        .agency-settings-overview strong {
            color: var(--ink);
            font-size: 16px;
            font-weight: 500;
        }

        .agency-settings-overview small {
            color: var(--muted);
            font-size: 12px;
            font-weight: 300;
        }

        .agency-settings-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 12px;
        }

        .agency-settings-section {
            display: grid;
            gap: 12px;
            padding-top: 2px;
        }

        .agency-settings-toggle {
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #ffffff;
            padding: 0;
            overflow: hidden;
        }

        .agency-settings-toggle > summary {
            list-style: none;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            min-height: 48px;
            padding: 0 12px;
        }

        .agency-settings-toggle > summary::-webkit-details-marker {
            display: none;
        }

        .agency-settings-toggle > summary svg {
            width: 15px;
            height: 15px;
            color: var(--muted);
            transition: transform 0.16s ease;
            flex: 0 0 auto;
        }

        .agency-settings-toggle[open] > summary svg {
            transform: rotate(90deg);
        }

        .agency-settings-toggle > :not(summary) {
            margin: 0 12px 12px;
        }

        .agency-settings-section h3 {
            margin: 0;
            font-size: 14px;
            font-weight: 500;
            color: var(--ink);
        }

        .agency-upload-grid,
        .agency-colour-grid,
        .agency-timing-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 12px;
        }

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

        .field-with-suffix {
            display: grid;
            grid-template-columns: minmax(0, 140px) auto;
            align-items: center;
            gap: 10px;
        }

        .field-with-suffix > span {
            color: var(--muted);
            font-size: 13px;
        }

        .esign-reminder-field .field-with-suffix {
            grid-template-columns: 72px auto;
            justify-content: start;
            gap: 8px;
            width: 112px;
        }

        .esign-reminder-field .field-with-suffix input {
            width: 72px;
        }

        body .app-shell .record-content .esign-editor .esign-reminder-field small.esign-reminder-help {
            max-width: 290px;
            color: var(--muted);
            font-size: 10px !important;
            line-height: 1.35;
            font-weight: 300;
        }

        .agency-asset-field {
            border: 1px dashed var(--line);
            border-radius: 8px;
            padding: 10px;
            display: grid;
            gap: 9px;
            background: #ffffff;
        }

        .agency-asset-preview {
            height: 92px;
            border: 1px solid var(--line-soft);
            border-radius: 7px;
            background: #f7f8f6;
            display: grid;
            place-items: center;
            overflow: hidden;
            color: var(--muted);
            font-size: 12px;
            font-weight: 300;
        }

        .agency-asset-preview.logo {
            height: 74px;
        }

        .agency-record-logo-preview.logo {
            height: auto;
            min-height: 110px;
            padding: 14px;
        }

        .agency-record-logo-preview.logo img {
            width: 100%;
            height: auto;
            max-height: none;
        }

        .agency-asset-preview img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            background: #ffffff;
        }

        .agency-asset-preview.header img {
            object-fit: cover;
        }

        .agency-asset-field input[type="file"] {
            width: 100%;
            font-size: 12px;
            color: var(--muted);
        }

        .agency-colour-input {
            display: grid;
            grid-template-columns: 38px minmax(0, 1fr);
            gap: 8px;
            align-items: center;
        }

        .agency-colour-input input[type="color"] {
            width: 38px;
            height: 38px;
            padding: 2px;
        }

        .agency-menu-permissions {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 8px;
        }

        .agency-menu-permission {
            min-height: 36px;
            border: 1px solid var(--line-soft);
            border-radius: 7px;
            background: #ffffff;
            display: flex;
            align-items: center;
            gap: 8px;
            padding: 8px 9px;
            color: var(--ink);
            font-size: 12px;
            font-weight: 400;
            letter-spacing: 0;
            text-transform: none;
        }

        .agency-menu-permission input {
            width: 15px;
            height: 15px;
            accent-color: var(--accent);
        }

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

        .agency-office-card {
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #fbfbf8;
            overflow: hidden;
        }

        .agency-office-card[open] {
            background: #ffffff;
            box-shadow: 0 8px 24px rgba(31,77,77,0.05);
        }

        .agency-office-card > summary {
            list-style: none;
        }

        .agency-office-card > summary::-webkit-details-marker {
            display: none;
        }

        .agency-office-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            padding: 12px;
            cursor: pointer;
        }

        .agency-office-head strong {
            font-size: 13px;
            font-weight: 500;
        }

        .agency-office-title {
            display: flex;
            align-items: center;
            min-width: 0;
            gap: 8px;
        }

        .agency-office-title svg {
            width: 15px;
            height: 15px;
            color: var(--muted);
            transition: transform 0.16s ease;
            flex: 0 0 auto;
        }

        .agency-office-card[open] .agency-office-title svg {
            transform: rotate(90deg);
        }

        .agency-office-body {
            display: grid;
            gap: 12px;
            padding: 0 12px 12px;
        }

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

        .agency-office-grid .span-2,
        .agency-timing-grid .span-2 {
            grid-column: 1 / -1;
        }

        .agency-hours-list {
            display: grid;
            gap: 8px;
        }

        .agency-hours-row {
            display: grid;
            grid-template-columns: minmax(120px, 1fr) 104px minmax(92px, 0.8fr) minmax(92px, 0.8fr);
            gap: 8px;
            align-items: center;
        }

        .agency-hours-row.is-closed input[type="time"] {
            display: none;
        }

        .agency-hours-row select[data-office-hour-field="open"] {
            border-color: rgba(22, 101, 52, 0.3);
            background: #ecfdf3;
            color: #166534;
            font-weight: 500;
        }

        .agency-hours-row.is-closed select[data-office-hour-field="open"] {
            border-color: rgba(107, 114, 128, 0.28);
            background: #f3f4f6;
            color: #6b7280;
        }

        .agency-settings-user-list .admin-row {
            grid-template-columns: auto minmax(0, 1fr) auto;
        }

        .delegate-branding-content {
            display: grid;
            gap: 14px;
        }

        .delegate-branding-content .agency-upload-grid {
            margin: 0;
        }

        .delegate-branding-content .agency-asset-preview img {
            width: auto !important;
            height: 60px !important;
            max-width: calc(100% - 20px);
            object-fit: contain !important;
        }

        .delegate-branding-message {
            min-height: 18px;
            color: var(--muted);
            font-size: 12px;
        }

        .delegate-branding-message.error {
            color: var(--danger);
        }

        .agency-settings-user-list .avatar {
            width: 38px;
            height: 38px;
            display: inline-grid;
            place-items: center;
            margin-top: 0;
            border: 1px solid #dfe8e3;
            border-radius: 50%;
            background: #eef5f1;
            color: var(--accent);
        }

        .delegate-admin-user-row {
            cursor: pointer;
            transition: background-color 0.15s ease;
        }

        .delegate-admin-user-row:hover {
            background: #fafcfb;
        }

        .delegate-admin-user-row .admin-user-identity {
            min-width: 0;
        }

        .delegate-admin-user-row .admin-user-identity span {
            margin-top: 4px;
        }

        .delegate-admin-user-row .button {
            min-width: 64px;
        }

        .agency-user-actions {
            grid-column: 2 / -1;
            display: flex;
            flex-wrap: wrap;
            justify-content: flex-end;
            gap: 8px;
            min-width: 0;
        }

        .agency-user-actions .button {
            height: 34px;
            padding: 0 10px;
            font-size: 13px;
        }

        .agency-access-card {
            border-bottom: 1px solid var(--line-soft);
        }

        a.agency-access-card {
            color: inherit;
            text-decoration: none;
        }

        a.agency-access-card:hover {
            background: #f7f9f8;
        }

        .agency-access-card > summary {
            cursor: pointer;
            list-style: none;
        }

        .agency-access-card > summary::-webkit-details-marker {
            display: none;
        }

        .agency-access-expand {
            color: var(--muted);
            font-size: 12px;
        }

        .agency-access-body {
            display: grid;
            gap: 18px;
            padding: 4px 18px 20px 66px;
        }

        .agency-access-dates,
        .agency-access-menu,
        .agency-access-checks {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 10px 16px;
        }

        .agency-access-section {
            display: grid;
            gap: 10px;
        }

        .agency-user-record-access {
            display: grid;
            gap: 22px;
        }

        .agency-access-intro {
            display: grid;
            gap: 5px;
            padding: 16px;
            border: 1px solid #c9ddd7;
            border-radius: 12px;
            background: linear-gradient(135deg, #edf7f4 0%, #f7faf9 100%);
        }

        .agency-access-overview {
            grid-template-columns: minmax(0, 1fr) auto;
            align-items: center;
            gap: 16px;
        }

        .agency-access-overview > div {
            display: grid;
            gap: 4px;
        }

        .agency-access-eyebrow {
            color: #46736a;
            font-size: 9px;
            font-weight: 700;
            letter-spacing: .1em;
            text-transform: uppercase;
        }

        .agency-access-intro strong {
            color: #173f39;
            font-size: 14px;
        }

        .agency-access-intro p {
            max-width: 440px;
            margin: 0;
            color: #536861;
            font-size: 11px;
            line-height: 1.5;
        }

        .agency-access-count {
            display: inline-flex;
            align-items: center;
            min-height: 28px;
            padding: 5px 10px;
            border: 1px solid #b9d2cb;
            border-radius: 999px;
            background: rgba(255, 255, 255, .78);
            color: #285c53;
            font-size: 10px;
            font-weight: 700;
            white-space: nowrap;
        }

        .agency-access-section-heading {
            display: grid;
            gap: 3px;
        }

        .agency-access-section-heading > strong {
            font-size: 13px;
        }

        .agency-access-section-heading > span {
            color: var(--muted);
            font-size: 12px;
            line-height: 1.4;
        }

        .agency-user-record-access .agency-access-checks,
        .agency-access-menu-groups {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 9px;
        }

        .agency-user-record-access .agency-access-action-option {
            position: relative;
            min-height: 66px;
            align-items: flex-start;
            padding: 12px 36px 12px 12px;
            border: 1px solid var(--delegate-border);
            border-radius: 11px;
            background: #fff;
            cursor: pointer;
            transition: border-color .16s ease, background .16s ease, box-shadow .16s ease;
        }

        .agency-user-record-access .agency-access-action-option:hover {
            border-color: #a9c8c0;
            box-shadow: 0 5px 14px rgba(22, 68, 59, .06);
        }

        .agency-user-record-access .agency-access-action-option:has(input:checked) {
            border-color: #8ab8ac;
            background: #f0f8f6;
        }

        .agency-user-record-access .agency-access-action-option input {
            position: absolute;
            opacity: 0;
            pointer-events: none;
        }

        .agency-access-option-copy {
            display: grid;
            gap: 2px;
            min-width: 0;
        }

        .agency-access-option-copy strong {
            font-size: 12px;
            line-height: 1.25;
        }

        .agency-access-option-copy small {
            color: var(--muted);
            font-size: 10px;
            line-height: 1.3;
        }

        .agency-access-option-state {
            position: absolute;
            top: 12px;
            right: 12px;
            width: 18px;
            height: 18px;
            border: 1px solid #bcc8c4;
            border-radius: 50%;
            background: #fff;
        }

        .agency-access-action-option:has(input:checked) .agency-access-option-state {
            border-color: #2f675d;
            background: #2f675d;
        }

        .agency-access-action-option:has(input:checked) .agency-access-option-state::after {
            content: '';
            position: absolute;
            left: 5px;
            top: 3px;
            width: 5px;
            height: 8px;
            border: solid #fff;
            border-width: 0 2px 2px 0;
            transform: rotate(45deg);
        }

        .agency-user-record-access .agency-access-option-danger:has(input:checked) {
            border-color: #deb3ad;
            background: #fff6f4;
        }

        .agency-user-record-access .agency-access-option-danger:has(input:checked) .agency-access-option-state {
            border-color: #a44d43;
            background: #a44d43;
        }

        .agency-access-section-toolbar {
            display: flex;
            align-items: flex-end;
            justify-content: space-between;
            gap: 12px;
        }

        .agency-access-bulk-actions {
            display: flex;
            gap: 5px;
        }

        .agency-access-bulk-actions button {
            padding: 4px 8px;
            border: 0;
            background: transparent;
            color: #35685f;
            font: inherit;
            font-size: 10px;
            font-weight: 700;
            cursor: pointer;
        }

        .agency-access-bulk-actions button:hover {
            text-decoration: underline;
        }

        .agency-access-menu-group {
            min-width: 0;
            padding: 12px;
            border: 1px solid #dfe6e3;
            border-radius: 11px;
            background: #fafbfb;
        }

        .agency-access-menu-group-head {
            display: grid;
            gap: 2px;
            min-height: 39px;
            margin-bottom: 8px;
            padding-bottom: 8px;
            border-bottom: 1px solid #e5ebe8;
        }

        .agency-access-menu-group-head strong {
            font-size: 11px;
        }

        .agency-access-menu-group-head span {
            color: var(--muted);
            font-size: 9px;
            line-height: 1.3;
        }

        .agency-user-record-access .agency-access-menu {
            display: grid;
            grid-template-columns: 1fr;
            gap: 3px;
        }

        .agency-user-record-access .agency-access-menu-option {
            position: relative;
            display: grid;
            grid-template-columns: 16px minmax(0, 1fr) 8px;
            align-items: center;
            min-height: 29px;
            gap: 7px;
            padding: 4px 5px;
            border-radius: 6px;
            color: #44534f;
            cursor: pointer;
        }

        .agency-user-record-access .agency-access-menu-option:hover {
            background: #f0f5f3;
        }

        .agency-user-record-access .agency-access-menu-option span {
            font-size: 10px;
            font-weight: 600;
            line-height: 1.25;
            white-space: normal;
        }

        .agency-user-record-access .agency-access-menu-option i {
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: #d4dcda;
        }

        .agency-user-record-access .agency-access-menu-option:has(input:checked) i {
            background: #438276;
        }

        @media (max-width: 720px) {
            .agency-user-record-access .agency-access-checks,
            .agency-access-menu-groups {
                grid-template-columns: 1fr;
            }

            .agency-access-overview {
                grid-template-columns: 1fr;
            }
        }

        /* Agency user permissions: restrained settings-style presentation. */
        .agency-user-record-access {
            gap: 24px;
        }

        .agency-user-record-access .agency-access-intro {
            gap: 4px;
            padding: 0 0 18px;
            border: 0;
            border-bottom: 1px solid #e1e5e3;
            border-radius: 0;
            background: transparent;
        }

        .agency-user-record-access .agency-access-intro strong {
            color: #202523;
            font-size: 13px;
            font-weight: 600;
        }

        .agency-user-record-access .agency-access-intro p {
            max-width: 520px;
            color: #68726e;
            font-size: 11px;
            line-height: 1.45;
        }

        .agency-user-record-access .agency-access-section {
            gap: 12px;
        }

        .agency-user-record-access .agency-access-section-heading {
            gap: 2px;
        }

        .agency-user-record-access .agency-access-section-heading > strong {
            color: #282e2b;
            font-size: 12px;
            font-weight: 600;
        }

        .agency-user-record-access .agency-access-section-heading > span {
            color: #75807b;
            font-size: 10px;
        }

        .agency-user-record-access .agency-access-checks,
        .agency-user-record-access .agency-access-menu {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 8px;
        }

        .agency-user-record-access .agency-access-option,
        .agency-user-record-access .agency-access-action-option,
        .agency-user-record-access .agency-access-menu-option {
            position: static;
            display: flex;
            min-height: 44px;
            align-items: center;
            gap: 9px;
            padding: 9px 11px;
            border: 1px solid #dfe4e1;
            border-radius: 8px;
            background: #fff;
            color: #313936;
            cursor: pointer;
            box-shadow: none;
            transition: border-color .12s ease, background-color .12s ease;
        }

        .agency-user-record-access .agency-access-action-option {
            min-height: 58px;
        }

        .agency-user-record-access .agency-access-option:hover,
        .agency-user-record-access .agency-access-action-option:hover,
        .agency-user-record-access .agency-access-menu-option:hover {
            border-color: #bfc9c5;
            background: #fafbfb;
            box-shadow: none;
        }

        .agency-user-record-access .agency-access-option:has(input:checked),
        .agency-user-record-access .agency-access-action-option:has(input:checked),
        .agency-user-record-access .agency-access-menu-option:has(input:checked) {
            border-color: #a9beb8;
            background: #f7faf9;
        }

        .agency-user-record-access .agency-access-option input,
        .agency-user-record-access .agency-access-action-option input,
        .agency-user-record-access .agency-access-menu-option input {
            position: static;
            flex: 0 0 auto;
            width: 14px;
            height: 14px;
            margin: 0;
            opacity: 1;
            pointer-events: auto;
            accent-color: #315f58;
        }

        .agency-user-record-access .agency-access-option > span,
        .agency-user-record-access .agency-access-action-option > span,
        .agency-user-record-access .agency-access-menu-option > span {
            display: grid;
            min-width: 0;
            gap: 2px;
            overflow: visible;
            color: inherit;
            font-size: 11px;
            font-weight: 500;
            line-height: 1.3;
            white-space: normal;
        }

        .agency-user-record-access .agency-access-action-option strong {
            font-size: 11px;
            font-weight: 600;
        }

        .agency-user-record-access .agency-access-action-option small {
            color: #78817d;
            font-size: 8px !important;
            line-height: 1.25;
        }

        .agency-user-record-access .agency-access-section-toolbar {
            align-items: center;
        }

        .agency-user-record-access .agency-access-bulk-actions {
            align-items: center;
            gap: 6px;
            color: #a0a7a4;
        }

        .agency-user-record-access .agency-access-bulk-actions button {
            padding: 2px;
            color: #52635e;
            font-size: 10px;
            font-weight: 500;
        }

        @media (max-width: 720px) {
            .agency-user-record-access .agency-access-checks,
            .agency-user-record-access .agency-access-menu {
                grid-template-columns: 1fr;
            }
        }

        .user-record-side-tabs {
            display: inline-flex;
            align-items: center;
            gap: 18px;
            height: 100%;
        }

        .user-record-side-tabs button {
            position: relative;
            height: 100%;
            padding: 0;
            border: 0;
            background: transparent;
            color: #717a76;
            font: inherit;
            font-size: 12px;
            font-weight: 500;
            cursor: pointer;
        }

        .user-record-side-tabs button.active {
            color: #202623;
            font-weight: 600;
        }

        .user-record-side-tabs button.active::after {
            content: '';
            position: absolute;
            right: 0;
            bottom: -1px;
            left: 0;
            height: 2px;
            border-radius: 2px 2px 0 0;
            background: #315f58;
        }

        .user-documents-pane {
            display: grid;
            align-content: start;
            gap: 12px;
        }

        .user-documents-pane[hidden] {
            display: none;
        }

        .user-documents-pane .document-uploader {
            gap: 8px;
        }

        .user-documents-pane .document-dropzone {
            min-height: 82px;
        }

        .user-documents-readonly {
            margin: 0;
            padding: 9px 10px;
            border: 1px solid #e0e5e2;
            border-radius: 7px;
            background: #f8f9f8;
            color: #68726e;
            font-size: 10px;
            line-height: 1.4;
        }

        .agency-user-date-field .agency-user-date-control {
            display: grid;
            grid-template-columns: minmax(0, 1fr) minmax(118px, 1fr);
            align-items: center;
            gap: 12px;
        }

        .agency-user-date-field .agency-user-date-control input {
            width: 100%;
            min-width: 0;
        }

        .agency-user-date-field .agency-user-date-control span {
            color: #66716d;
            font-size: 10px;
            line-height: 1.35;
        }

        @media (max-width: 720px) {
            .agency-user-date-field .agency-user-date-control {
                grid-template-columns: 1fr;
                gap: 5px;
            }
        }

        .agency-access-section > strong {
            font-size: 13px;
        }

        .agency-access-dates label,
        .agency-access-menu label,
        .agency-access-checks label {
            display: flex;
            align-items: center;
            gap: 8px;
            color: var(--ink);
            font-size: 13px;
        }

        .agency-access-dates label {
            align-items: stretch;
            flex-direction: column;
        }

        .admin-row .agency-record-user-actions {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            gap: 8px;
            margin-top: 0;
            overflow: visible;
        }

        .agency-record-user-actions .agency-super-admin-button {
            width: auto;
            min-width: 0;
            height: 26px;
            min-height: 26px;
            padding: 0 8px;
            border-radius: 6px;
            font-size: 10.5px !important;
            line-height: 1;
        }

        .agency-settings-content {
            display: block;
            padding: 18px 28px 32px;
            overflow: auto;
        }

        .settings-content {
            display: block;
            padding: 18px 28px 32px;
            overflow: auto;
        }

        .delegate-settings-workspace {
            width: 100%;
            margin: 0 auto;
        }

        .agency-settings-workspace {
            width: 100%;
            margin: 0 auto;
        }

        .agency-settings-tabs {
            display: flex;
            align-items: flex-end;
            gap: 26px;
            min-height: 48px;
            border-bottom: 1px solid var(--line);
        }

        .agency-settings-tab {
            position: relative;
            min-height: 48px;
            padding: 0 2px;
            border: 0;
            background: transparent;
            color: var(--muted);
            font: inherit;
            font-size: 13px;
            font-weight: 500;
            cursor: pointer;
        }

        .agency-settings-tab::after {
            position: absolute;
            right: 0;
            bottom: -1px;
            left: 0;
            height: 2px;
            background: var(--accent);
            content: "";
            opacity: 0;
        }

        .agency-settings-tab:hover,
        .agency-settings-tab.is-active {
            color: var(--ink);
        }

        .agency-settings-tab.is-active::after {
            opacity: 1;
        }

        .agency-settings-tab:focus-visible {
            outline: 2px solid var(--accent);
            outline-offset: 3px;
            border-radius: 3px;
        }

        .agency-settings-pane {
            padding-top: 24px;
        }

        .agency-settings-pane[hidden] {
            display: none !important;
        }

        .agency-settings-intro {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 24px;
            margin-bottom: 18px;
        }

        .agency-settings-intro-copy {
            display: grid;
            gap: 5px;
        }

        .agency-settings-intro h2 {
            margin: 0;
            color: var(--ink);
            font-size: 22px;
            font-weight: 500;
            letter-spacing: -.02em;
        }

        .agency-settings-intro p {
            max-width: 680px;
            margin: 0;
            color: var(--muted);
            font-size: 12px;
            line-height: 1.5;
        }

        .agency-settings-save-state {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            min-height: 28px;
            color: var(--muted);
            font-size: 11px;
            white-space: nowrap;
        }

        .agency-settings-save-state[hidden] {
            display: none !important;
        }

        .agency-settings-save-state::before {
            width: 7px;
            height: 7px;
            border-radius: 50%;
            background: #66b66a;
            box-shadow: 0 0 0 3px rgba(102, 182, 106, .12);
            content: "";
        }

        .agency-settings-save-state.error {
            color: var(--danger);
        }

        .agency-settings-save-state.error::before {
            background: var(--danger);
            box-shadow: 0 0 0 3px rgba(180, 35, 24, .1);
        }

        .agency-settings-overview {
            display: flex;
            align-items: center;
            gap: 9px;
            margin-bottom: 28px;
            padding: 0;
            border: 0;
            background: transparent;
        }

        .agency-settings-overview span {
            display: none;
        }

        .agency-settings-overview strong {
            font-size: 16px;
            font-weight: 500;
        }

        .agency-settings-overview small {
            display: inline-flex;
            align-items: center;
            min-height: 23px;
            padding: 0 9px;
            border-radius: 999px;
            background: #e9f5e7;
            color: #39703b;
            font-size: 10.5px;
            font-weight: 500;
            text-transform: capitalize;
        }

        .agency-settings-group + .agency-settings-group {
            margin-top: 12px;
        }

        .agency-settings-group-title {
            display: flex;
            align-items: center;
            gap: 12px;
            margin: 0 0 10px;
            color: var(--ink);
            font-size: 13px;
            font-weight: 500;
        }

        .agency-settings-group-title::after {
            height: 1px;
            flex: 1;
            background: var(--line-soft);
            content: "";
        }

        .agency-settings-accordion {
            overflow: hidden;
            border: 1px solid var(--line);
            border-radius: 9px;
            background: #fff;
        }

        .agency-settings-accordion .agency-settings-toggle {
            display: block;
            gap: 0;
            padding-top: 0;
            border: 0;
            border-radius: 0;
        }

        .agency-settings-accordion .agency-settings-toggle + .agency-settings-toggle {
            border-top: 1px solid var(--line-soft);
        }

        .agency-settings-accordion .agency-settings-toggle > summary {
            min-height: 58px;
            box-sizing: border-box;
            padding: 0 14px;
            background: #fff;
        }

        .agency-settings-accordion .agency-settings-toggle > summary:hover {
            background: #fafbf9;
        }

        .agency-section-heading {
            display: grid;
            align-self: stretch;
            align-content: center;
            gap: 3px;
            min-width: 0;
        }

        .agency-section-heading small {
            color: var(--muted);
            font-size: 11px;
            font-weight: 300;
            line-height: 1.35;
        }

        .agency-settings-accordion .agency-settings-toggle[open] > summary {
            border-bottom: 1px solid var(--line-soft);
            background: #fafbf9;
        }

        .agency-settings-accordion .agency-settings-toggle > :not(summary) {
            margin: 16px;
        }

        .agency-settings-users-head {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 20px;
            margin-bottom: 18px;
        }

        .agency-settings-users-head h2 {
            margin: 0 0 5px;
            font-size: 22px;
            font-weight: 500;
            letter-spacing: -.02em;
        }

        .agency-settings-users-head p {
            margin: 0;
            color: var(--muted);
            font-size: 12px;
        }

        .agency-settings-user-list {
            overflow: hidden;
            border: 1px solid var(--line);
            border-radius: 9px;
            background: #fff;
        }

        .sales-team-create,
        .sales-team-add-member {
            display: flex;
            align-items: end;
            gap: 8px;
        }

        .sales-team-create input {
            min-width: 220px;
        }

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

        .sales-team-card {
            border: 1px solid var(--line);
            border-radius: 9px;
            background: #fff;
            overflow: hidden;
        }

        .sales-team-card-head,
        .sales-team-add-member {
            display: flex;
            align-items: end;
            justify-content: space-between;
            gap: 12px;
            padding: 14px 16px;
            background: var(--surface-subtle);
        }

        .sales-team-card-head label {
            flex: 1;
            max-width: 420px;
        }

        .sales-team-members {
            display: grid;
        }

        .sales-team-member {
            display: grid;
            grid-template-columns: auto minmax(180px, 1fr) minmax(180px, 240px) auto auto;
            align-items: center;
            gap: 10px;
            padding: 12px 16px;
            border-top: 1px solid var(--line);
        }

        .sales-team-member > div {
            display: grid;
            gap: 2px;
        }

        .sales-team-member > div span {
            color: var(--muted);
            font-size: 12px;
        }

        .sales-team-add-member {
            justify-content: flex-start;
            border-top: 1px solid var(--line);
            background: #fff;
        }

        .sales-team-add-member select:first-child {
            flex: 1;
        }

        @media (max-width: 760px) {
            .sales-team-create,
            .sales-team-card-head,
            .sales-team-add-member { align-items: stretch; flex-direction: column; }
            .sales-team-create input { min-width: 0; width: 100%; }
            .sales-team-member { grid-template-columns: auto 1fr; }
            .sales-team-member select,
            .sales-team-member button { grid-column: 1 / -1; width: 100%; }
        }

        .agency-settings-user-list .admin-row {
            min-height: 68px;
            padding: 12px 14px;
            border: 0;
            border-radius: 0;
            background: #fff;
            grid-template-columns: auto minmax(0, 1fr) auto auto;
            align-items: center;
        }

        .agency-settings-user-list .admin-row + .admin-row {
            border-top: 1px solid var(--line-soft);
        }

        .agency-settings-user-list .agency-user-actions {
            grid-column: auto;
            flex-wrap: nowrap;
        }

        .button.danger {
            color: var(--danger);
            border-color: rgba(180, 35, 24, 0.22);
        }

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

        .agency-user-search {
            display: block;
            width: 100%;
            margin-bottom: 16px;
        }

        .agency-user-search + #agencyRecordUsers {
            margin-top: 16px;
        }

        .agency-user-search input {
            width: 100%;
            font-size: 13px;
        }

        .agency-user-search input::placeholder {
            font-size: 13px;
        }

        .agency-user-group {
            display: grid;
            gap: 8px;
        }

        .agency-user-group.is-expanded {
            gap: 10px;
        }

        .agency-user-group + .agency-user-group {
            margin-top: 8px;
        }

        .agency-user-group-head {
            min-height: 34px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            padding: 7px 10px;
            border: 1px solid var(--line-soft);
            border-radius: 7px;
            background: #f8faf9;
            color: var(--ink);
            cursor: pointer;
            font: inherit;
            list-style: none;
            transition: border-color 0.15s ease, background 0.15s ease;
            width: 100%;
        }

        .agency-user-group-head::-webkit-details-marker {
            display: none;
        }

        .agency-user-group-head:hover {
            border-color: rgba(31, 77, 77, 0.18);
            background: #fbfcfb;
        }

        .agency-user-group-head strong {
            min-width: 0;
            font-size: 12px;
            font-weight: 600;
            color: var(--ink);
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .agency-user-group-head .nav-count {
            flex: 0 0 auto;
        }

        .agency-user-group-summary {
            min-width: 0;
            display: flex;
            align-items: center;
            gap: 8px;
        }

        .agency-user-group-chevron {
            width: 16px;
            height: 16px;
            flex: 0 0 16px;
            color: var(--muted);
            transition: transform 0.15s ease;
        }

        .agency-user-group.is-expanded .agency-user-group-chevron {
            transform: rotate(90deg);
        }

        .agency-user-group-body {
            display: grid;
            gap: 8px;
        }

        .agency-user-group-body[hidden] {
            display: none;
        }

        .agency-user-group.is-collapsed > .agency-user-group-body {
            display: none !important;
        }

        .agency-user-group.is-expanded > .agency-user-group-body {
            display: grid;
        }

        .admin-row {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto auto;
            gap: 10px;
            align-items: center;
            border: 1px solid var(--line-soft);
            border-radius: 7px;
            padding: 10px;
            background: #ffffff;
        }

        .admin-row strong {
            display: block;
            font-size: 13px;
            font-weight: 500;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .admin-row span {
            display: block;
            color: var(--muted);
            font-size: 12px;
            font-weight: 300;
            margin-top: 2px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        #opportunityContactList .opportunity-contact-row {
            grid-template-columns: 38px minmax(0, 1fr) auto auto;
            gap: 10px;
            padding: 10px 11px;
        }

        .opportunity-contact-avatar {
            width: 36px;
            height: 36px;
            display: grid !important;
            place-items: center;
            flex: 0 0 36px;
            overflow: hidden !important;
            border-radius: 50%;
            background: #e8f1ec;
            color: #315c48 !important;
            font-size: 12px !important;
            font-weight: 600 !important;
            margin: 0 !important;
        }

        .opportunity-contact-avatar img {
            width: 100%;
            height: 100%;
            display: block;
            object-fit: cover;
        }

        .opportunity-contact-copy {
            min-width: 0;
        }

        .opportunity-contact-unlink {
            width: 34px;
            height: 34px;
            display: grid;
            place-items: center;
            border: 1px solid var(--line);
            border-radius: 50%;
            background: #fff;
            color: #68736d;
            cursor: pointer;
            transition: background .16s ease, border-color .16s ease, color .16s ease;
        }

        .opportunity-contact-unlink:hover {
            border-color: #efb5b5;
            background: #fff1f1;
            color: #a43c3c;
        }

        .opportunity-contact-unlink svg {
            width: 16px;
            height: 16px;
        }

        .agency-record-user-row {
            grid-template-columns: 38px minmax(0, 1fr) auto;
        }

        .agency-record-user-row > .avatar {
            width: 38px;
            height: 38px;
            display: inline-grid;
            place-items: center;
            margin-top: 0;
        }

        .agency-metric-value {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            white-space: nowrap;
        }

        .agency-metric-value strong {
            font-size: 13px;
            font-weight: 500;
            color: var(--ink);
        }

        .contact-tenancy-status {
            width: 21px;
            height: 21px;
            border: 1px solid currentColor;
            border-radius: 50%;
            display: inline-grid;
            place-items: center;
            vertical-align: middle;
        }

        .contact-tenancy-status.associated {
            background: #e8f7ed;
            color: #23834a;
        }

        .contact-tenancy-status.missing {
            background: #fff7d8;
            color: #b78408;
        }

        .contact-tenancy-status svg {
            width: 14px;
            height: 14px;
        }

        #opportunityTable .contact-tenancy-status {
            border-color: transparent;
            box-shadow: inset 0 0 0 1px color-mix(in srgb, currentColor 18%, transparent);
        }

        #opportunityTable .contact-tenancy-status.associated {
            background: #079b24;
            color: #ffffff;
        }

        #opportunityTable .contact-tenancy-status.missing {
            background: #ffb800;
            color: #201a00;
        }

        .agency-metric-change {
            display: inline-flex;
            align-items: center;
            gap: 2px;
            font-size: 10px;
            font-weight: 500;
        }

        .agency-metric-change.up {
            color: #2f7a45;
        }

        .agency-metric-change.down {
            color: #b44343;
        }

        .user-record-photo-control {
            display: flex;
            align-items: center;
            gap: 12px;
        }

        .user-record-avatar {
            width: 68px;
            height: 68px;
            border-radius: 50%;
            display: inline-grid;
            place-items: center;
            overflow: hidden;
            flex: 0 0 auto;
            background: #e8f1f0;
            color: var(--accent);
            font-size: 17px;
            font-weight: 500;
        }

        .user-record-avatar img {
            width: 100%;
            height: 100%;
            display: block;
            object-fit: cover;
        }

        .pipeline-user-select-shell {
            position: relative;
        }

        .pipeline-user-select-shell select {
            width: 100%;
            padding-left: 42px !important;
        }

        [data-assignment-user-select] {
            background: #ffffff !important;
            border-color: var(--line) !important;
            color: var(--ink) !important;
            box-shadow: none;
        }

        .pipeline-user-select-avatar {
            position: absolute;
            z-index: 1;
            left: 8px;
            top: 50%;
            width: 26px;
            height: 26px;
            border-radius: 50%;
            transform: translateY(-50%);
            display: inline-grid;
            place-items: center;
            overflow: hidden;
            pointer-events: none;
            background: #e8f1f0;
            color: var(--accent);
            font-size: 9px;
            font-weight: 500;
        }

        .pipeline-user-select-avatar.empty {
            opacity: 0;
        }

        .pipeline-user-select-avatar img {
            width: 100%;
            height: 100%;
            display: block;
            object-fit: cover;
        }

        .opportunity-logo {
            width: 42px;
            height: 42px;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            background: #f8faf9;
            display: grid;
            place-items: center;
            overflow: hidden;
            color: var(--muted);
            font-size: 12px;
            font-weight: 500;
            flex: 0 0 auto;
        }

        .opportunity-logo img {
            width: 100%;
            height: 100%;
            object-fit: contain;
        }

        .opportunity-logo-field .document-uploader {
            align-items: start;
        }

        .opportunity-logo-field .opportunity-logo {
            width: 96px;
            height: 96px;
            font-size: 22px;
        }

        .opportunity-heading {
            display: flex;
            min-width: 0;
            align-items: center;
            gap: 10px;
        }

        .opportunity-heading > div {
            min-width: 0;
        }

        .admin-form-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 9px;
        }

        .admin-form-grid .span-2 {
            grid-column: 1 / -1;
        }

        .tenant-request-create-search {
            display: grid;
            gap: 6px;
        }

        .tenant-request-create-search input[type="search"] {
            width: 100%;
            min-width: 0;
        }

        .tenant-request-relation-input-wrap {
            position: relative;
            display: block;
        }

        .tenant-request-relation-input-wrap input[type="search"] {
            padding-right: 34px;
        }

        .inspection-reference-link {
            position: absolute;
            inset: 1px 34px 1px 1px;
            display: flex;
            align-items: center;
            padding: 0 11px;
            border-radius: 7px;
            background: #ffffff;
            color: var(--accent);
            font-size: 13px;
            font-weight: 500;
            line-height: 1.2;
            text-decoration: underline;
            text-decoration-thickness: 1px;
            text-underline-offset: 3px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            z-index: 1;
        }

        .inspection-reference-link:hover {
            color: var(--accent-hover);
        }

        .tenant-request-relation-input-wrap.is-editing .inspection-reference-link {
            display: none;
        }

        .tenant-request-relation-clear {
            position: absolute;
            right: 7px;
            top: 50%;
            width: 22px;
            height: 22px;
            border: 1px solid var(--line);
            border-radius: 999px;
            background: #f7f8f5;
            color: var(--muted);
            font-size: 14px;
            line-height: 1;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            transform: translateY(-50%);
            cursor: pointer;
        }

        .tenant-request-relation-clear:hover {
            background: #eef1ea;
            color: var(--ink);
        }

        .tenant-request-relation-clear[hidden] {
            display: none;
        }

        .tenant-request-create-results {
            margin-top: 2px;
        }

        .duplicate-list {
            display: grid;
            gap: 8px;
            margin-top: 8px;
        }

        .duplicate-option {
            display: grid;
            grid-template-columns: auto minmax(0, 1fr);
            gap: 9px;
            align-items: start;
            border: 1px solid var(--line-soft);
            border-radius: 8px;
            padding: 10px;
            background: #fff;
        }

        .duplicate-option input {
            margin-top: 3px;
        }

        .muted-copy {
            color: var(--muted);
            font-size: 13px;
            font-weight: 300;
            line-height: 1.45;
            margin: 0;
        }

        .admin-form {
            display: grid;
            gap: 9px;
        }

        .admin-form label {
            display: grid;
            gap: 5px;
            color: #465366;
            font-size: 11px;
            font-weight: 500;
            text-transform: uppercase;
            letter-spacing: 0.04em;
        }

        .opportunity-duplicate-warning {
            display: grid;
            gap: 3px;
            margin-top: 2px;
            padding: 10px 12px;
            border: 1px solid #e7c766;
            border-radius: 8px;
            background: #fff8dc;
            color: #725511;
            font-size: 12px;
            font-weight: 650;
            line-height: 1.45;
            letter-spacing: 0;
            text-transform: none;
        }

        .opportunity-duplicate-warning[hidden] { display: none; }

        .opportunity-agency-cell {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            min-width: 0;
        }

        .opportunity-duplicate-badge {
            display: inline-flex;
            align-items: center;
            min-height: 22px;
            padding: 3px 8px;
            border: 1px solid #fecaca;
            border-radius: 999px;
            background: #fee2e2;
            color: #991b1b;
            font-size: 11px;
            font-weight: 700;
            line-height: 1;
            white-space: nowrap;
        }

        #opportunityContactModal .modal-body {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 14px;
        }

        #opportunityContactModal .admin-form label {
            gap: 8px;
            min-width: 0;
        }

        #applicantCreateModal .modal-body {
            display: grid;
            gap: 14px;
        }

        #applicantCreateModal .admin-form label {
            gap: 8px;
            min-width: 0;
        }

        #opportunityContactModal .span-2 {
            grid-column: 1 / -1;
        }

        @media (max-width: 720px) {
            #opportunityContactModal .modal-body {
                grid-template-columns: 1fr;
            }

            #opportunityContactModal .span-2 {
                grid-column: auto;
            }
        }

        #pipelineRecordModal .modal-body {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            column-gap: 14px;
            row-gap: 16px;
        }

        #pipelineRecordModal .modal-body > label:first-child {
            grid-column: 1 / -1;
        }

        #pipelineRecordModal .admin-form label {
            gap: 8px;
            min-width: 0;
        }

        .admin-form input,
        .admin-form select,
        .admin-form textarea {
            width: 100%;
            border: 1px solid var(--line);
            border-radius: 7px;
            background: #ffffff;
            color: var(--ink);
            outline: none;
            font: inherit;
            font-size: 13px;
            font-weight: 300;
            padding: 9px 10px;
        }

        .admin-form input,
        .admin-form select {
            height: 38px;
        }

        .admin-form textarea {
            min-height: 74px;
            resize: vertical;
        }

        .admin-form input:focus,
        .admin-form select:focus,
        .admin-form textarea:focus {
            border-color: var(--accent);
            box-shadow: 0 0 0 3px var(--accent-ring);
        }

        .agency-name-cell {
            display: grid;
            gap: 3px;
            min-width: 0;
        }

        .agency-name-cell strong {
            color: var(--ink);
            font-size: 13px;
            font-weight: 500;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .agency-name-cell span {
            color: var(--muted);
            font-size: 12px;
            font-weight: 300;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .modal-backdrop {
            position: fixed;
            inset: 0;
            background: rgba(30,39,36,0.26);
            opacity: 0;
            pointer-events: none;
            transition: opacity 160ms ease;
            z-index: var(--z-modal-backdrop);
        }

        .modal-backdrop.open {
            opacity: 1;
            pointer-events: auto;
        }

        .modal {
            position: fixed;
            left: 50%;
            top: 50%;
            width: min(520px, calc(100vw - 32px));
            max-height: calc(100vh - 40px);
            transform: translate(-50%, -48%) scale(0.98);
            opacity: 0;
            pointer-events: none;
            background: #ffffff;
            border: 1px solid var(--line);
            border-radius: 9px;
            box-shadow: 0 24px 80px rgba(30,39,36,0.18);
            z-index: var(--z-modal);
            display: grid;
            grid-template-rows: auto minmax(0, 1fr) auto;
            overflow: hidden;
            transition: opacity 160ms ease, transform 160ms ease;
        }

        #tenantRequestRecordModal.sales-create-modal {
            width: min(640px, calc(100vw - 32px));
        }

        .sales-create-agency small {
            color: var(--muted);
            font-size: 12px;
            font-weight: 400;
            line-height: 1.4;
        }

        .modal.open {
            opacity: 1;
            pointer-events: auto;
            transform: translate(-50%, -50%) scale(1);
        }

        .modal-head,
        .modal-foot {
            padding: 16px 18px;
            border-bottom: 1px solid var(--line-soft);
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
        }

        .modal-foot {
            border-top: 1px solid var(--line-soft);
            border-bottom: 0;
            justify-content: flex-end;
        }

        .modal-head h2 {
            margin: 0;
            font-size: 17px;
            font-weight: 500;
        }

        .modal-body {
            min-height: 0;
            overflow: auto;
            padding: 16px 18px;
        }

        .modal .message:empty {
            display: none;
        }

        .agency-user-modal {
            width: min(560px, calc(100vw - 32px));
        }

        .agency-user-modal .modal-body {
            display: grid;
            gap: 14px;
            padding: 18px;
        }

        .agency-user-modal .admin-form-grid {
            gap: 12px;
        }

        .agency-user-modal .admin-form label {
            gap: 7px;
            min-width: 0;
        }

        .agency-user-modal-copy {
            margin: -2px 0 0;
        }

        .avatar-modal {
            width: min(680px, calc(100vw - 32px));
        }

        .avatar-crop-layout {
            display: grid;
            gap: 14px;
        }

        .avatar-crop-layout input[type="file"] {
            position: absolute;
            width: 1px;
            height: 1px;
            opacity: 0;
            pointer-events: none;
        }

        .avatar-dropzone {
            width: 100%;
            min-height: 148px;
            display: grid;
            place-items: center;
            gap: 6px;
            border: 1px dashed var(--line);
            border-radius: 8px;
            background: #fbfcfa;
            color: var(--muted);
            cursor: pointer;
            padding: 20px;
            text-align: center;
        }

        .avatar-dropzone.dragging,
        .avatar-dropzone:hover {
            border-color: var(--accent);
            background: var(--accent-soft);
        }

        .avatar-dropzone strong {
            color: var(--ink);
            font-size: 13px;
            font-weight: 600;
        }

        .avatar-dropzone span {
            color: var(--muted);
            font-size: 12px;
        }

        .avatar-cropper {
            display: grid;
            grid-template-columns: minmax(300px, 1fr) minmax(220px, .62fr);
            gap: 20px;
            align-items: start;
        }

        .avatar-cropper[hidden] {
            display: none !important;
        }

        .avatar-crop-frame {
            width: min(100%, 340px);
            aspect-ratio: 1;
            border-radius: 50%;
            overflow: hidden;
            background: #dfe4df;
            border: 1px solid var(--line);
            position: relative;
            cursor: grab;
            touch-action: none;
            box-shadow: inset 0 0 0 999px rgba(0, 0, 0, 0.02);
        }

        .avatar-crop-frame.dragging {
            cursor: grabbing;
        }

        .avatar-crop-frame::after {
            content: "";
            position: absolute;
            inset: 0;
            border-radius: inherit;
            box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .72), inset 0 0 0 999px rgba(255, 255, 255, 0);
            pointer-events: none;
        }

        .avatar-crop-frame img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transform-origin: center;
            will-change: transform;
            user-select: none;
            pointer-events: none;
        }

        .avatar-crop-main {
            display: grid;
            justify-items: center;
            gap: 10px;
            min-width: 0;
        }

        .avatar-crop-stage {
            width: min(100%, 400px);
            aspect-ratio: 1;
            position: relative;
            display: grid;
            place-items: center;
            overflow: hidden;
            border: 1px solid var(--line);
            border-radius: 12px;
            background: #dfe4df;
            cursor: grab;
            touch-action: none;
            overscroll-behavior: contain;
            -webkit-user-select: none;
            user-select: none;
        }

        .avatar-crop-stage.dragging {
            cursor: grabbing;
        }

        .avatar-source-preview {
            position: absolute;
            inset: 14px;
            width: calc(100% - 28px);
            height: calc(100% - 28px);
            object-fit: contain;
            opacity: .38;
            filter: saturate(.82);
            pointer-events: none;
            user-select: none;
        }

        .avatar-crop-stage .avatar-crop-frame {
            width: 78%;
            z-index: 1;
            box-shadow: 0 0 0 999px rgba(25, 34, 30, .34), 0 10px 28px rgba(14, 28, 21, .18);
        }

        .avatar-crop-help {
            margin: 0;
            color: var(--muted);
            font-size: 12px;
            text-align: center;
        }

        .user-record-avatar-edit {
            appearance: none;
            border: 0;
            padding: 0;
            background: transparent;
            border-radius: 50%;
            cursor: pointer;
        }

        .user-record-avatar-edit:focus-visible {
            outline: 2px solid var(--accent);
            outline-offset: 3px;
        }

        .avatar-controls {
            display: grid;
            gap: 14px;
            min-width: 0;
        }

        .avatar-controls input[type="range"] {
            width: 100%;
            min-height: 36px;
            accent-color: var(--accent);
            cursor: pointer;
        }

        .avatar-mini-preview {
            width: 84px;
            height: 84px;
            border-radius: 50%;
            overflow: hidden;
            background: #edf0ed;
            border: 1px solid var(--line);
            position: relative;
        }

        .avatar-mini-preview img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transform-origin: center;
            pointer-events: none;
            user-select: none;
        }

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

        .contact-photo-editor-trigger {
            width: 100%;
            min-height: 84px;
            display: flex;
            align-items: center;
            gap: 14px;
            padding: 12px;
            border: 1px solid var(--line);
            border-radius: 12px;
            background: #fff;
            color: var(--ink);
            text-align: left;
            cursor: pointer;
        }

        .form-label {
            display: block;
            margin-bottom: 6px;
            color: var(--muted);
            font-size: 12px;
            font-weight: 500;
        }

        .contact-photo-editor-trigger:hover {
            border-color: var(--accent);
            background: #f8faf8;
        }

        .contact-photo-editor-trigger:focus-visible {
            outline: 2px solid var(--accent);
            outline-offset: 2px;
        }

        .contact-photo-editor-preview {
            width: 58px;
            height: 58px;
            flex: 0 0 58px;
            display: grid;
            place-items: center;
            overflow: hidden;
            border-radius: 50%;
            background: #edf0ed;
            color: var(--muted);
            border: 1px solid var(--line);
        }

        .contact-photo-editor-preview img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .contact-photo-editor-copy {
            display: grid;
            gap: 3px;
        }

        .contact-photo-editor-copy strong {
            font-size: 13px;
            font-weight: 600;
        }

        .contact-photo-editor-copy span {
            color: var(--muted);
            font-size: 12px;
        }

        .range-row {
            display: grid;
            gap: 6px;
            color: var(--muted);
            font-size: 12px;
            font-weight: 300;
        }

        .range-row span {
            display: flex;
            justify-content: space-between;
            gap: 10px;
        }

        .range-row input {
            width: 100%;
            accent-color: var(--accent);
        }

        :root {
            --sidebar: 228px;
            --topbar: 64px;
            --table-page-padding: 12px 18px 18px;
            --table-page-gap: 9px;
            --record-page-gap: 9px;
        }

        body {
            font-size: 11px;
            font-weight: 300;
        }

        .sidebar {
            padding: 16px 12px;
            gap: 10px;
        }

        .brand {
            padding: 0 6px 8px;
            margin-bottom: 0;
        }

        .brand-mark,
        .brand-mark img {
            width: 184px;
        }

        .nav-button {
            padding: 6px 8px;
            gap: 7px;
        }

        .nav-button span {
            font-size: 13px;
            font-weight: 400;
        }

        .topbar {
            gap: 10px;
            padding: 0 20px;
        }

        .page-title h1 {
            font-size: 18.5px;
        }

        .toolbar {
            gap: 7px;
        }

        .button {
            height: 31px;
            padding: 0 8px;
            gap: 5px;
            font-size: 11px;
            font-weight: 300;
        }

        .button svg {
            width: 14px;
            height: 14px;
        }

        .icon-badge-button {
            width: 32px;
            height: 32px;
        }

        .icon-badge-button svg {
            width: 16px;
            height: 16px;
        }

        .table-toolbar {
            min-height: 32px;
            gap: 8px;
        }

        .table-actions,
        .bulk-tools {
            gap: 6px;
        }

        .table-search input,
        .control-select,
        .field input,
        .field select {
            height: 29px;
            font-size: 11px;
            font-weight: 300;
        }

        .segment {
            height: 25px;
            padding: 0 8px;
            font-size: 11px;
            font-weight: 300;
        }

        table {
            font-size: 11px;
            font-weight: 300;
        }

        thead th {
            padding: 6px 8px;
            font-size: 8.5px;
        }

        .sort-indicator {
            font-size: 8.5px;
        }

        th.select-col,
        td.select-col {
            width: 36px;
            min-width: 36px;
            max-width: 36px;
        }

        tbody td {
            height: 32px;
            padding: 6px 8px;
        }

        .table-inline-select {
            height: 23px;
            padding-left: 8px;
            padding-right: 18px;
            font-size: 10px;
        }

        .record-panel-head {
            min-height: 52px;
            padding: 9px 11px;
        }

        .record-panel-head h3 {
            font-size: 11.5px;
        }

        .record-content {
            font-size: 11px;
            font-weight: 300;
        }

        .record-kicker,
        .record-uuid {
            font-size: 11px;
            font-weight: 300;
        }

        .record-identity h2 {
            font-size: 18px;
        }

        .record-panel-body {
            padding: 8px 11px 11px;
        }

        .record-field {
            grid-template-columns: 112px minmax(0, 1fr);
            gap: 8px;
            padding: 5px 0;
        }

        .record-field span:first-child {
            font-size: 11px;
            font-weight: 300;
        }

        .record-field span:last-child {
            font-size: 11px;
            font-weight: 300;
        }

        .record-content .record-fields,
        .record-content .agency-overview-form {
            gap: 7px;
        }

        .record-content .agency-overview-field {
            gap: 3px;
            padding-bottom: 7px;
        }

        .agency-overview-field label,
        .agency-overview-field > span:first-child,
        .record-content .field-label,
        .record-content .field-title {
            font-size: 11px;
            font-weight: 300;
        }

        .agency-overview-field input,
        .agency-overview-field select {
            min-height: 28px;
            padding: 5px 7px;
            font-size: 11px;
            font-weight: 300;
        }

        .agency-overview-field textarea {
            padding: 5px 7px;
            font-size: 11px;
            font-weight: 300;
        }

        .record-content .muted-copy,
        .record-content [data-upload-hint],
        .record-content .record-upload-dropzone span,
        .record-content .property-photo-upload span,
        .record-content .property-photo-file-preview span,
        .record-content .maintenance-work-order-hint,
        .record-content .esign-placement-tip,
        .record-content .esign-inspector-empty,
        [role="tooltip"] {
            font-size: 11px;
            font-weight: 300;
        }

        .message,
        .muted-copy,
        .empty-state,
        .column-item label,
        .badge,
        .item-meta,
        .comment-body,
        .activity-body,
        .document-info small,
        .admin-row span,
        .notification-copy span,
        .notification-copy time {
            font-size: 11px;
            font-weight: 300;
        }

        .record-content .badge,
        .record-content .item-meta,
        .record-content .comment-body,
        .record-content .activity-body,
        .record-content .document-info small,
        .record-content .admin-row span {
            font-size: 11px;
            font-weight: 300;
        }

        .record-content #commentsPane .comment-author-name,
        .record-content #commentsPane .comment-body {
            font-size: 12px !important;
        }

        .record-content #commentsPane .comment-time,
        .record-content #commentsPane .comment-author-name {
            font-size: 12px !important;
        }

        .record-content #commentsPane .comment-count,
        .record-content #commentsPane .topic-chip {
            font-size: 10.5px !important;
        }

        .record-content #commentsPane .button,
        .record-content #commentsPane .text-button {
            font-size: 11px !important;
            font-weight: 500 !important;
        }

        .record-upload-dropzone strong,
        .property-photo-upload strong,
        .property-photo-empty,
        .tenant-request-mini-card strong,
        .tenant-request-mini-card span,
        .tenancy-hub-tab {
            font-size: 11px;
            font-weight: 300;
        }

        .app-shell :where(.content, .admin-content, .record-content, .settings-content, .agency-settings-content, .sidebar, .topbar, .modal, .drawer) :where(p, span, label, input, select, textarea, button, small, td, a) {
            font-size: 11px;
            font-weight: 300;
        }

        .profile-chip .avatar-button {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            line-height: 1;
        }

        .profile-chip .avatar-button #profileAvatar {
            width: 100%;
            height: 100%;
            display: block;
            line-height: 0;
        }

        .profile-chip .avatar-button .avatar {
            width: 100%;
            height: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0;
            padding: 0;
            border-radius: 50%;
            font-size: 12px;
            font-weight: 600;
            line-height: 1;
            text-align: center;
        }

        thead th,
        thead th .sort-header,
        thead th .sort-header span {
            font-size: 8.5px;
            font-weight: 600;
        }

        .record-tabs.metric-tabs .record-tab,
        .record-tabs.metric-tabs .record-tab-create {
            font-size: 12px;
            font-weight: 500;
        }

        .record-tabs.metric-tabs .tab-label {
            font-size: 12px;
            font-weight: 500;
        }

        .record-tabs.metric-tabs .tab-metric .tab-count {
            font-size: 26px;
            font-weight: 600;
        }

        .record-tabs.metric-tabs .tab-count-label {
            font-size: 11px;
            font-weight: 500;
        }

        .record-content :where(.record-panel-body, .record-fields, .record-field, .agency-overview-form, .agency-overview-field, .comment-list, .comment-content, .activity-list, .document-list, .admin-list, .esign-editor, .esign-stage-panel, .property-photo-gallery, .tenant-request-card-list, .tenant-request-mini-card, .tenancy-hub, .pipeline-step-body, .maintenance-action-panel, .maintenance-work-order-panel, .maintenance-quotes-panel, .owner-info-body, .proposal-comparison-card) :where(p, span, label, input, select, textarea, button, small, td, a, strong, em, time),
        .record-content :where(.record-panel-body, .record-fields, .record-field, .agency-overview-form, .agency-overview-field, .comment-list, .comment-content, .activity-list, .document-list, .admin-list, .esign-editor, .esign-stage-panel, .property-photo-gallery, .tenant-request-card-list, .tenant-request-mini-card, .tenancy-hub, .pipeline-step-body, .maintenance-action-panel, .maintenance-work-order-panel, .maintenance-quotes-panel, .owner-info-body, .proposal-comparison-card) :where(.badge, .button, .mini-button, .text-button, .table-inline-select, .empty-field-value, .topic-chip, .nav-count, .item-meta, .comment-body, .activity-body) {
            font-size: 11px !important;
            font-weight: 300 !important;
        }

        .record-content .star-rating {
            font-size: 21px !important;
            gap: 1px;
        }

        .record-content .star-rating-input {
            min-height: 46px;
            gap: 2px;
        }

        .record-content .star-rating-button {
            width: 40px;
            height: 44px;
            font-size: 38px !important;
            padding: 2px;
        }

        .record-content .agency-rating-field .star-rating-input {
            gap: 2px;
        }

        .record-content .agency-rating-field .star-rating-button {
            width: 37px;
            height: 48px;
            font-size: 44px !important;
            padding: 0;
        }

        .record-content .record-panel-body {
            padding: 7px 10px 10px;
        }

        .record-content .record-fields,
        .record-content .agency-overview-form {
            gap: 6px;
        }

        .record-content .record-field {
            grid-template-columns: 104px minmax(0, 1fr);
            gap: 6px;
            padding: 4px 0;
        }

        .record-content .agency-overview-field {
            gap: 2px;
            padding-bottom: 6px;
        }

        .record-content .agency-overview-field:has(input, select, textarea, .editable-with-action, .address-input-shell, .tag-selector) {
            border-bottom: 0;
        }

        .record-content .agency-overview-field input,
        .record-content .agency-overview-field select {
            min-height: 26px;
            padding: 4px 6px;
        }

        .record-content .property-feature-input svg {
            left: 8px;
            width: 14px;
            height: 14px;
        }

        .record-content .property-feature-input input {
            padding-left: 28px !important;
        }

        .record-content .property-overview-divider {
            margin: 1px 0 4px;
        }

        .record-content .address-lookup,
        .record-content .abn-lookup,
        .record-content .address-input-shell,
        .record-content .abn-input-shell {
            width: 100%;
            min-width: 0;
        }

        .record-content .address-lookup .address-input-shell input,
        .record-content .abn-lookup .abn-input-shell input {
            min-height: 28px;
            padding-left: 42px !important;
            padding-right: 74px !important;
            box-sizing: border-box;
            line-height: 1.35;
        }

        .record-content .proposal-fee-value,
        .record-content .proposal-fee-value input {
            width: 100%;
            min-width: 0;
            box-sizing: border-box;
        }

        .record-content .proposal-fee-value.amount input {
            min-height: 28px;
            padding-left: 30px !important;
            padding-right: 8px !important;
            line-height: 1.35;
        }

        .record-content .proposal-rent-value {
            grid-template-columns: minmax(120px, 1fr) auto;
            gap: 7px;
        }

        .record-content .proposal-rent-value input {
            min-height: 28px;
            padding-left: 30px !important;
            padding-right: 8px !important;
            line-height: 1.35;
        }

        .record-content .proposal-rent-value .proposal-fee-symbol {
            left: 11px;
            top: 19px;
        }

        .record-content .proposal-fee-value .proposal-fee-symbol {
            font-size: 12px;
            line-height: 1;
        }

        .record-content .agency-overview-field textarea {
            padding: 4px 6px;
        }

        .record-content .table-inline-select {
            height: 22px;
            padding-left: 7px;
            padding-right: 17px;
        }

        .record-content .tenancy-compact-text-field input,
        .record-content .tenancy-overview-select-field .table-inline-select-cell,
        .record-content .tenancy-overview-select-field .table-inline-select,
        .record-content .property-overview-select-field .table-inline-select-cell,
        .record-content .property-overview-select-field .table-inline-select {
            width: 100%;
            max-width: none;
            min-width: 0;
        }

        .tenancy-agreement-dates-grid {
            display: grid;
            gap: 12px;
        }

        .tenancy-agreement-countdown {
            display: flex;
            align-items: center;
            gap: 14px;
            min-height: 82px;
        }

        .tenancy-agreement-chart {
            --agreement-progress: 0deg;
            --agreement-colour: #3d786c;
            width: 78px;
            height: 78px;
            flex: 0 0 78px;
            border-radius: 50%;
            display: grid;
            place-items: center;
            background: conic-gradient(var(--agreement-colour) var(--agreement-progress), #e5ebe8 0);
            position: relative;
            box-shadow: 0 1px 2px rgba(31, 53, 46, .08);
        }

        .tenancy-agreement-chart::before {
            content: "";
            position: absolute;
            inset: 9px;
            border-radius: 50%;
            background: #fff;
            box-shadow: inset 0 0 0 1px rgba(49, 67, 61, .06);
        }

        .tenancy-agreement-chart.is-periodic {
            background: #ece8ef;
            box-shadow: inset 0 0 0 9px #80698d, 0 1px 2px rgba(31, 53, 46, .08);
        }

        .tenancy-agreement-chart.is-periodic::before {
            inset: 10px;
        }

        .tenancy-agreement-chart-value {
            position: relative;
            z-index: 1;
            display: grid;
            justify-items: center;
            gap: 3px;
        }

        .tenancy-agreement-chart strong {
            color: #263b34;
            font-size: 20px;
            font-weight: 650;
            line-height: 1;
            font-variant-numeric: tabular-nums;
        }

        .tenancy-agreement-chart small {
            color: #6d7873;
            font-size: 8px;
            font-weight: 650;
            letter-spacing: .08em;
            line-height: 1;
            text-transform: uppercase;
        }

        .tenancy-agreement-countdown-copy {
            display: grid;
            gap: 3px;
            min-width: 0;
        }

        .tenancy-agreement-countdown-copy strong {
            color: #31433d;
            font-size: 13px;
            font-weight: 600;
            line-height: 1.35;
        }

        .tenancy-agreement-countdown-copy span {
            color: var(--quiet);
            font-size: 11px;
        }

        .tenancy-agreement-status-label {
            color: #66736e !important;
            font-size: 9px !important;
            font-weight: 650;
            letter-spacing: .06em;
            line-height: 1.2;
            text-transform: uppercase;
        }

        .record-content .record-panel-head .side-tabs {
            grid-template-columns: repeat(3, 68px);
            flex: 0 1 210px;
            padding: 2px;
        }

        .record-content .record-panel-head .side-tab {
            height: 24px;
            padding: 0 6px;
            font-size: 10px !important;
            line-height: 1;
        }

        .record-content .record-panel-head .agency-middle-tabs {
            grid-template-columns: repeat(3, minmax(64px, 1fr));
            flex-basis: 210px;
        }

        .record-content .record-field > span:first-child,
        .record-content .agency-overview-field label,
        .record-content .agency-overview-field > span:first-child,
        .record-content .field-label,
        .record-content .field-title {
            font-size: 8.5px !important;
            font-weight: 300 !important;
        }

        .record-content .property-creatable-select-field {
            position: relative;
        }

        .record-content .property-creatable-select-field select {
            width: 100%;
            min-width: 0;
        }

        @media (max-width: 920px) {
            :root {
                --table-page-padding: 14px;
                --record-page-gap: 9px;
            }
            body { overflow: auto; }
            .app-shell {
                min-height: 100vh;
                height: auto;
                grid-template-columns: 1fr;
            }
            .sidebar {
                min-height: auto;
                padding: 14px;
            }
            .brand {
                padding-bottom: 8px;
                margin-bottom: 0;
            }
            .brand-mark,
            .brand-mark img {
                width: 166px;
            }
            .nav-list {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                overflow: visible;
            }
            .marketing-grid,
            .marketing-post-row {
                grid-template-columns: 1fr;
            }
            .marketing-summary,
            .marketing-composer-modal-grid {
                grid-template-columns: 1fr;
            }
            .marketing-command-head {
                align-items: stretch;
                flex-direction: column;
            }
            .marketing-command-actions {
                flex-wrap: wrap;
            }
            .marketing-composer-overlay {
                padding: 10px;
            }
            .marketing-composer-modal {
                width: calc(100vw - 20px);
                max-height: calc(100vh - 20px);
            }
            .marketing-composer-modal-grid > .record-panel + .record-panel {
                border-left: 0;
                border-top: 1px solid var(--line);
            }
            .marketing-account-row {
                grid-template-columns: 42px minmax(0, 1fr);
            }
            .marketing-account-health,
            .marketing-account-actions {
                grid-column: 2;
            }
            .sidebar-account {
                padding: 12px 0 0;
            }
            .main {
                height: auto;
                min-height: calc(100vh - 172px);
                grid-template-rows: auto minmax(0, 1fr);
            }
            .topbar {
                grid-template-columns: 1fr;
                align-items: stretch;
                padding: 16px;
            }
            .toolbar {
                flex-wrap: wrap;
            }
            .record-panel-head {
                flex-wrap: wrap;
            }
            .record-panel-head .side-tabs {
                flex-basis: 100%;
                grid-template-columns: repeat(3, minmax(0, 1fr));
            }
            .agency-middle-panel-head {
                flex-wrap: nowrap;
            }
            .agency-middle-panel-head .agency-middle-tabs {
                flex-basis: 210px;
                grid-template-columns: repeat(3, minmax(0, 1fr));
            }
            .notification-wrap {
                margin-left: auto;
            }
            .notification-panel {
                right: -2px;
            }
            .impersonation-banner {
                max-width: 100%;
            }
            .admin-form-grid {
                grid-template-columns: 1fr;
            }
            #pipelineRecordModal .modal-body {
                grid-template-columns: 1fr;
            }
            .search,
            .search input {
                width: 100%;
            }
            .content {
                height: auto;
                padding: var(--table-page-padding);
            }
            .record-tabs.metric-tabs {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 8px;
                margin-bottom: 6px;
            }

            #opportunityMetrics.opportunity-dashboard-metrics {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

            #opportunityMetrics .opportunity-dashboard-metric:nth-child(3) {
                border-left: 0;
            }

            #opportunityMetrics .opportunity-dashboard-metric:nth-child(n+3) {
                border-top: 1px solid #e3e8e5;
            }
            .metric-tabs .record-tab,
            .metric-tabs .record-tab-create {
                min-height: 78px;
                padding: 12px;
            }
            .tab-metric .tab-count {
                font-size: 22px;
            }
            .tab-watermark {
                width: 54px;
                height: 54px;
            }
            .table-toolbar {
                grid-template-columns: 1fr;
            }
            .bulk-bar {
                align-items: stretch;
                flex-direction: column;
            }
            .table-actions,
            .bulk-tools {
                width: 100%;
            }
            .table-actions {
                align-items: stretch;
                flex-direction: column;
            }
            .segmented,
            .control-select,
            .table-search,
            .table-search input,
            .table-actions .button,
            .bulk-tools .button {
                width: 100%;
                max-width: none;
                min-width: 0;
            }
            .segmented {
                flex-basis: auto;
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
            .segmented.three-option {
                grid-template-columns: repeat(3, minmax(0, 1fr));
            }
            .segmented.four-option {
                grid-template-columns: repeat(4, minmax(0, 1fr));
            }
            #columnButton {
                width: 100%;
                flex: 0 0 auto;
            }
            .column-panel {
                left: 14px;
                right: 14px;
                top: 242px;
                width: auto;
            }
            .field-grid {
                grid-template-columns: 1fr;
            }
            .record-content {
                height: auto;
                padding: var(--table-page-padding);
            }
            .record-page-head {
                grid-template-columns: 1fr;
            }
            .record-grid,
            .record-grid.tenancy-hub-grid {
                grid-template-columns: 1fr;
            }
            .public-proposal {
                padding: 14px;
            }
            .public-proposal-hero,
            .public-proposal-grid {
                grid-template-columns: 1fr;
            }
            .public-proposal-brand {
                min-height: auto;
            }
            .public-proposal-brand-inner,
            .public-proposal-hero-media {
                grid-template-columns: 1fr;
                grid-template-rows: auto;
            }
            .public-proposal-logo-row {
                align-items: flex-start;
                flex-wrap: wrap;
            }
            .public-about-grid,
            .public-comparison-card {
                grid-template-columns: 1fr;
            }
            .public-comparison-card img {
                height: 190px;
            }
            .public-proposal-side {
                position: static;
            }
            .public-proposal-map {
                min-height: 260px;
            }
            .public-proposal-stats,
            .public-decision-buttons,
            .public-work-order-response-fields,
            .public-work-order-media-grid,
            .public-work-order-completion-grid,
            .public-work-order-tenant-grid,
            .proposal-share-output {
                grid-template-columns: 1fr;
            }
            .public-proposal {
                padding: 0;
            }
            .public-proposal-topbar-inner,
            .public-proposal-hero-layout,
            .public-proposal-nav-inner,
            .public-proposal-grid {
                width: min(calc(100vw - 28px), var(--proposal-container));
                max-width: calc(100vw - 28px);
            }
            .public-work-order-page .public-proposal-topbar-inner,
            .public-work-order-page .public-proposal-hero-layout,
            .public-work-order-page .public-proposal-nav-inner,
            .public-work-order-page .public-proposal-grid {
                width: min(calc(100vw - 28px), var(--proposal-container));
                max-width: calc(100vw - 28px);
                min-width: 0;
            }
            .public-proposal-topbar-inner {
                min-height: 64px;
            }
            .public-work-order-page .public-proposal-topbar-inner {
                min-height: 64px;
            }
            .public-proposal-nav {
                top: 64px;
            }
            .public-work-order-page .public-proposal-nav {
                top: 64px;
            }
            .public-proposal-section,
            .public-decision {
                scroll-margin-top: 132px;
            }
            .public-proposal-topbar-actions {
                gap: 6px;
            }
            .public-proposal-topbar .public-proposal-status-pill {
                display: none;
            }
            .public-proposal-hero-layout {
                grid-template-columns: 1fr;
                gap: 24px;
                padding: 34px 0 30px;
            }
            .public-work-order-page .public-proposal-hero-layout {
                grid-template-columns: 1fr;
                gap: 24px;
                padding: 34px 0 30px;
            }
            .public-work-order-page .public-proposal-title h1 {
                max-width: 100%;
                font-size: 30px;
                line-height: 1.08;
            }
            .public-proposal-hero-media {
                min-height: 420px;
            }
            .public-work-order-page .public-proposal-hero-media {
                min-height: 420px;
            }
            .public-proposal-media-overlay {
                grid-template-columns: 1fr;
                inset: auto 12px 12px;
            }
            .public-proposal-map {
                height: 180px;
                min-height: 180px;
            }
            .public-about-grid,
            .public-comparison-list {
                grid-template-columns: 1fr;
            }
            .public-agent-profile-card .public-agent-row {
                grid-template-columns: 64px minmax(0, 1fr);
            }
            .public-agent-profile-card .public-agent-avatar {
                width: 64px;
                height: 64px;
            }
            .public-team-panel {
                grid-template-columns: 1fr;
            }
            .public-team-profile {
                grid-template-columns: 64px minmax(0, 1fr);
                padding: 18px;
            }
            .public-team-profile .public-agent-avatar {
                width: 64px;
                height: 64px;
            }
            .public-team-support {
                border-left: 0;
                border-top: 1px solid #dfe8e3;
                padding: 18px;
            }
            .public-comparison-card {
                grid-template-rows: 300px minmax(250px, auto);
                min-height: 550px;
            }
            .public-comparison-media {
                grid-template-rows: 170px 130px;
            }
            .public-decision {
                padding: 22px;
            }
            .record-field {
                grid-template-columns: 1fr;
                gap: 4px;
            }
            .avatar-cropper {
                grid-template-columns: 1fr;
                justify-items: center;
            }
            .admin-content,
            .settings-content,
            .agency-settings-content {
                height: auto;
                grid-template-columns: 1fr;
                padding: var(--table-page-padding);
            }
            .proposal-income-top,
            .agency-settings-grid,
            .agency-upload-grid,
            .agency-colour-grid,
            .agency-timing-grid,
            .agency-office-grid,
            .agency-hours-row {
                grid-template-columns: 1fr;
            }
            .agency-office-grid .span-2,
            .agency-timing-grid .span-2 {
                grid-column: auto;
            }
            .income-performance-badge {
                justify-self: start;
            }
        }
        .dashboard-content { padding:var(--table-page-padding); overflow:auto; background:#f7f9f8; }
        .dashboard-shell { width:100%; display:grid; gap:20px; }
        .dashboard-welcome { position:relative;z-index:2;padding:4px 8px 0; }
        .dashboard-welcome h2 { margin:0; font-size:32px; line-height:1.15; letter-spacing:-.035em; color:#18201c; }
        .dashboard-welcome-copy { display:grid;gap:5px; }
        .dashboard-welcome-copy p { margin:0;color:#65716c;font-size:12px;line-height:1.4; }
        .dashboard-hero.has-agency-image .dashboard-welcome-copy p { color:color-mix(in srgb,var(--dashboard-on-brand,#fff) 78%,transparent); }
        .dashboard-confetti { position:absolute;inset:0;z-index:8;overflow:hidden;pointer-events:none;border-radius:inherit; }
        .dashboard-confetti i { position:absolute;top:-18px;left:var(--confetti-left);width:7px;height:12px;border-radius:2px;background:var(--confetti-colour);opacity:0;animation:dashboard-confetti-fall var(--confetti-duration) cubic-bezier(.2,.7,.2,1) var(--confetti-delay) forwards; }
        @keyframes dashboard-confetti-fall { 0% { opacity:0;transform:translate3d(0,-16px,0) rotate(0deg); } 10% { opacity:1; } 100% { opacity:0;transform:translate3d(28px,520px,0) rotate(var(--confetti-rotation)); } }
        @media (prefers-reduced-motion:reduce) { .dashboard-confetti { display:none; } }
        .dashboard-hero { position:relative; min-height:148px; overflow:hidden; border:1px solid #dfe5e1; border-radius:12px; background:#fff; }
        .dashboard-hero.has-agency-image { min-height:438px; display:flex; align-items:flex-end; }
        .dashboard-agency-header { position:absolute; inset:0; }
        .dashboard-agency-header[hidden] { display:none !important; }
        .dashboard-agency-header img { width:100%; height:100%; display:block; object-fit:cover; }
        .dashboard-metrics { position:relative; z-index:1; width:100%; display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); background:#fff; }
        .dashboard-metrics.five { grid-template-columns:repeat(5,minmax(0,1fr)); }
        .dashboard-hero:not(.has-agency-image) .dashboard-metrics { border-radius:12px; box-shadow:0 8px 24px rgba(25,42,33,.04); }
        .dashboard-hero.has-agency-image .dashboard-metrics { color:var(--dashboard-on-brand,#fff); background:color-mix(in srgb,var(--dashboard-brand,#1f4d4d) 88%,transparent); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
        .dashboard-metric { position:relative; min-width:0; min-height:112px; padding:20px 48px 20px 28px; display:flex; flex-direction:column; justify-content:center; color:#334039; text-decoration:none; transition:background .16s ease; }
        .dashboard-metric + .dashboard-metric { border-left:1px solid #e3e8e5; }
        .dashboard-metric span { display:block; color:#65716b; font-size:12px; font-weight:700; }
        .dashboard-metric strong { display:block; margin-top:8px; color:#126a49; font-size:28px; letter-spacing:-.03em; }
        .dashboard-metric-chevron { position:absolute; top:50%; right:22px; width:18px; height:18px; transform:translateY(-50%); }
        .dashboard-metric-chevron svg { width:100%; height:100%; display:block; }
        .dashboard-metric.esigning { padding-top:18px; padding-bottom:18px; }
        .dashboard-esign-counts { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:9px; }
        .dashboard-esign-counts div + div { border-left:1px solid #e3e8e5; padding-left:14px; }
        .dashboard-esign-counts strong { margin:0; font-size:23px; line-height:1; }
        .dashboard-esign-counts small { display:block; margin-top:5px; color:#6d7872; font-size:10px; line-height:1.25; font-weight:600; }
        .dashboard-metric:hover { background:#f8fbf9; }
        .dashboard-hero.has-agency-image .dashboard-metric,
        .dashboard-hero.has-agency-image .dashboard-metric span,
        .dashboard-hero.has-agency-image .dashboard-metric strong,
        .dashboard-hero.has-agency-image .dashboard-esign-counts small { color:var(--dashboard-on-brand,#fff); }
        .dashboard-hero.has-agency-image .dashboard-metric + .dashboard-metric,
        .dashboard-hero.has-agency-image .dashboard-esign-counts div + div { border-color:color-mix(in srgb,var(--dashboard-on-brand,#fff) 25%,transparent); }
        .dashboard-hero.has-agency-image .dashboard-metric:hover { background:color-mix(in srgb,var(--dashboard-on-brand,#fff) 10%,transparent); }
        .dashboard-section { background:#fff; border:1px solid #dfe5e1; border-radius:12px; padding:24px; }
        .dashboard-section.temperature-section { background:#fff; }
        .dashboard-section-head { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:22px; }
        .dashboard-section-head.technology-actions { justify-content:flex-end; margin-bottom:14px; }
        .dashboard-section-head.technology-actions { align-items:center; }
        .dashboard-section-head.technology-actions h3 { margin-right:auto; }
        .dashboard-section-head h3 { margin:0; font-size:19px; color:#202824; }
        .dashboard-section-head p { margin:5px 0 0; color:#77817c; font-size:13px; }
        .dashboard-temperature-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid #e5e9e7; }
        .dashboard-temperature-grid.five { grid-template-columns:repeat(5,minmax(0,1fr)); }
        .dashboard-temperature { padding:22px 8px 4px; display:flex; align-items:center; gap:14px; }
        button.dashboard-temperature { width:100%; border:0; border-radius:7px; background:transparent; font:inherit; text-align:left; cursor:pointer; }
        button.dashboard-temperature:hover { background:#f7f9f8; }
        button.dashboard-temperature:focus-visible { outline:2px solid #4d9173; outline-offset:-2px; }
        .dashboard-temperature + .dashboard-temperature { border-left:1px solid #e5e9e7; padding-left:28px; }
        .dashboard-temperature-copy { min-width:0; display:flex; align-items:baseline; gap:9px; }
        .dashboard-temperature-label { display:block; font-size:34px; line-height:1; font-weight:400; letter-spacing:-.04em; }
        .dashboard-temperature-icon { width:40px; height:40px; flex:0 0 auto; }
        .dashboard-temperature-icon svg { width:100%; height:100%; display:block; }
        .dashboard-temperature strong { display:block; margin:0; font-size:34px; line-height:1; font-weight:400; letter-spacing:-.04em; }
        .dashboard-temperature.hot strong,.dashboard-temperature.hot .dashboard-temperature-label,.dashboard-temperature.hot .dashboard-temperature-icon { color:#e2443b; }.dashboard-temperature.warm strong,.dashboard-temperature.warm .dashboard-temperature-label,.dashboard-temperature.warm .dashboard-temperature-icon { color:#e59619; }.dashboard-temperature.cold strong,.dashboard-temperature.cold .dashboard-temperature-label,.dashboard-temperature.cold .dashboard-temperature-icon { color:#4776a8; }
        .dashboard-temperature.secured strong,.dashboard-temperature.secured .dashboard-temperature-label,.dashboard-temperature.secured .dashboard-temperature-icon { color:#258451; }.dashboard-temperature.missed strong,.dashboard-temperature.missed .dashboard-temperature-label,.dashboard-temperature.missed .dashboard-temperature-icon { color:#4b5150; }
        .dashboard-temperature-grid.five .dashboard-temperature { padding-left:18px; gap:10px; }
        .dashboard-temperature-grid.five .dashboard-temperature:first-child { padding-left:8px; }
        .dashboard-temperature-grid.five .dashboard-temperature-label,.dashboard-temperature-grid.five .dashboard-temperature strong { font-size:27px; }
        .dashboard-temperature-grid.five .dashboard-temperature-icon { width:32px; height:32px; }
        @media (max-width:1100px) and (min-width:721px) {
            .dashboard-temperature-grid.five { grid-template-columns:repeat(3,1fr); }
            .dashboard-temperature-grid.five .dashboard-temperature:nth-child(4) { border-left:0; }
            .dashboard-temperature-grid.five .dashboard-temperature:nth-child(n+4) { border-top:1px solid #e5e9e7; }
        }
        .technology-grid { display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:10px; }
        .technology-link { position:relative; display:flex; align-items:center; min-width:0; border:1px solid #dfe5e1; border-radius:10px; color:#1d2822; background:#fff; }
        .technology-link[draggable="true"] { cursor:grab; }
        .technology-link.is-dragging { opacity:.42; cursor:grabbing; }
        .technology-link.is-drop-target { border-color:#4d9173; box-shadow:0 0 0 3px rgba(77,145,115,.13); }
        .technology-link > a { display:flex; align-items:center; gap:10px; min-width:0; flex:1; padding:11px 34px 11px 11px; color:inherit; text-decoration:none; }
        .technology-link:hover { border-color:#76a48f; box-shadow:0 7px 18px rgba(28,62,45,.08); transform:translateY(-1px); }
        .technology-icon { width:34px; height:34px; border-radius:8px; border:1px solid #e1e7e3; background:#f8faf9; display:grid; place-items:center; overflow:hidden; flex:0 0 auto; color:#19714f; font-weight:800; }
        .technology-icon img { width:100%; height:100%; object-fit:contain; }
        .technology-copy { min-width:0; }.technology-copy strong,.technology-copy span { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.technology-copy span { margin-top:3px; color:#7a8580; font-size:12px; }
        .technology-delete { position:absolute; right:9px; top:50%; transform:translateY(-50%); width:28px; height:28px; border:0; background:transparent; color:#7d8782; border-radius:7px; font-size:18px; cursor:pointer; }.technology-delete:hover { background:#fff0ef; color:#b53630; }
        .technology-empty { grid-column:1/-1; padding:28px; border:1px dashed #bfcac4; border-radius:10px; text-align:center; color:#6f7a74; }
        .technology-icon-choice { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
        .technology-icon-choice label { display:flex; align-items:center; gap:8px; min-height:40px; border:1px solid #dce3df; padding:8px 10px; border-radius:7px; cursor:pointer; color:#3d4742; font-size:12px; font-weight:600; line-height:1.2; text-transform:none; letter-spacing:0; }
        .technology-icon-choice input[type="radio"] { width:15px; height:15px; min-width:15px; margin:0; padding:0; accent-color:#246f54; box-shadow:none; }
        .technology-icon-choice label:has(input:checked) { border-color:#69a189; background:#f3f8f6; }
        #dashboardWebsiteModal { width:min(560px, calc(100vw - 32px)); }
        #dashboardWebsiteModal .modal-head { padding:20px 26px; }
        #dashboardWebsiteModal .modal-body { display:grid; gap:18px; padding:24px 26px 26px; }
        #dashboardWebsiteModal .modal-body > label { gap:8px; }
        #dashboardWebsiteModal .technology-icon-choice { margin-top:2px; }
        #dashboardWebsiteModal .modal-foot { padding:18px 26px; gap:10px; }
        @media (max-width:1100px) { .dashboard-hero.has-agency-image { min-height:420px; }.dashboard-metrics,.dashboard-metrics.five { grid-template-columns:repeat(3,1fr); }.dashboard-metric:nth-child(4) { border-left:0; border-top:1px solid #e3e8e5; }.dashboard-metric:nth-child(n+4) { border-top:1px solid #e3e8e5; }.dashboard-hero.has-agency-image .dashboard-metric:nth-child(n+4) { border-top-color:color-mix(in srgb,var(--dashboard-on-brand,#fff) 25%,transparent); }.technology-grid { grid-template-columns:repeat(4,minmax(0,1fr)); } }
        @media (max-width:720px) { .dashboard-content { padding:var(--table-page-padding); }.dashboard-welcome { padding-left:2px; }.dashboard-welcome h2 { font-size:26px; }.dashboard-hero.has-agency-image { min-height:440px; padding-top:184px; }.dashboard-agency-header { bottom:auto; height:230px; }.dashboard-metrics,.dashboard-metrics.five,.technology-grid { grid-template-columns:1fr 1fr; }.dashboard-hero.has-agency-image .dashboard-metrics { margin-top:auto; backdrop-filter:none; -webkit-backdrop-filter:none; }.dashboard-metric { min-height:92px; padding:15px 38px 15px 18px; }.dashboard-metric strong { font-size:24px; }.dashboard-metric:nth-child(odd) { border-left:0; }.dashboard-metric:nth-child(n+3) { border-top:1px solid #e3e8e5; }.dashboard-hero.has-agency-image .dashboard-metric:nth-child(n+3) { border-top-color:color-mix(in srgb,var(--dashboard-on-brand,#fff) 25%,transparent); }.dashboard-temperature-grid { grid-template-columns:1fr; }.dashboard-temperature + .dashboard-temperature { border-left:0; border-top:1px solid #e5e9e7; padding-left:8px; }.technology-icon-choice { grid-template-columns:1fr; } #dashboardWebsiteModal .modal-head,#dashboardWebsiteModal .modal-foot { padding:17px 18px; } #dashboardWebsiteModal .modal-body { padding:20px 18px 22px; gap:16px; } }

        /* Site-wide editable control typography: increase the established sizes by 1pt. */
        input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
        select,
        textarea,
        [contenteditable="true"] {
            font-size: 14.333px !important;
        }

        :is(.table-inline-select, .control-select, [role="combobox"]) {
            font-size: 13.333px !important;
        }

        .record-content input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
        .record-content select,
        .record-content textarea,
        .record-content [contenteditable="true"],
        .record-content :is(.table-inline-select, .control-select, [role="combobox"]) {
            font-size: 12.333px !important;
        }

        /* Richer semantic dropdown colours across tables and record workspaces. */
        .app-shell :is(select.property-status-select, .table-inline-select, .control-select[style*="background"]) {
            filter: saturate(1.48) contrast(1.045);
            font-weight: 600 !important;
        }

        .app-shell :is(select.property-status-select, .table-inline-select):not(.status-placeholder) {
            box-shadow: inset 0 0 0 1px color-mix(in srgb, currentColor 18%, transparent);
        }

        /* Delegate Harmony: one shared, calm CRM language across every authenticated role. */
        :root {
            --delegate-control-height: 34px;
            --delegate-radius-sm: 6px;
            --delegate-radius-md: 9px;
            --delegate-radius-lg: 12px;
            --delegate-action-radius: 8px;
            --delegate-pill-radius: 999px;
            --delegate-border: #d8dfdb;
            --delegate-border-strong: #c5cfca;
            --delegate-canvas: #f6f7f5;
            --delegate-hover: #f7faf8;
            --delegate-shadow-panel: 0 2px 8px rgba(25, 42, 33, .045);
            --delegate-shadow-overlay: 0 20px 56px rgba(25, 42, 33, .16);
            --delegate-metric-value-size: 26px;
        }

        .app-shell {
            background: var(--delegate-canvas);
            font-size: 12px;
            font-weight: 400;
        }

        .app-shell .topbar {
            border-bottom-color: var(--delegate-border);
            background: rgba(255, 255, 255, .98);
        }

        .app-shell .page-title h1,
        .app-shell .record-identity h2 {
            color: #18211d;
            font-weight: 500;
            letter-spacing: -.018em;
        }

        .app-shell .nav-button {
            min-height: 34px;
            border-radius: var(--delegate-radius-sm);
        }

        .app-shell .nav-button:hover {
            background: #f2f5f3;
        }

        .app-shell .nav-button.active {
            background: #edf1ef;
            color: #173f36;
            font-weight: 500;
        }

        /* Dark Delegate sidebar interaction states. Keep these scoped so the
           shared light-surface navigation treatment does not reduce contrast. */
        .app-shell .sidebar .nav-button:hover,
        .app-shell .sidebar .nav-group.open > .nav-button,
        .app-shell .sidebar .nav-group:has(.nav-submenu .nav-button.active) > .nav-button {
            background: rgba(255, 255, 255, .10);
            color: #ffffff;
        }

        .app-shell .sidebar .nav-button:hover .nav-icon,
        .app-shell .sidebar .nav-group.open > .nav-button .nav-icon,
        .app-shell .sidebar .nav-group:has(.nav-submenu .nav-button.active) > .nav-button .nav-icon {
            color: rgba(255, 255, 255, .88);
        }

        .app-shell .sidebar .nav-button.active {
            background: #edf1ef;
            color: #173f34;
        }

        .app-shell .sidebar .nav-button.active .nav-icon {
            color: #276347;
        }

        .app-shell .sidebar :is(.brand, .nav-button, .avatar-button, .account-signout):focus-visible {
            outline: 2px solid #78d45b;
            outline-offset: -2px;
        }

        .app-shell .sidebar .account-signout {
            border-color: rgba(255, 255, 255, .38);
            background: rgba(255, 255, 255, .08);
            color: #ffffff;
        }

        .app-shell .sidebar .account-signout svg {
            width: 16px;
            height: 16px;
        }

        .app-shell .sidebar .account-signout:hover {
            border-color: #f0c7c2;
            background: #fff7f6;
            color: var(--danger);
        }

        .app-shell .button,
        .app-shell .mini-button,
        .app-shell .text-button {
            min-height: 32px;
            border-radius: var(--delegate-action-radius);
            font-size: 12px !important;
            font-weight: 500 !important;
            line-height: 1.1;
            transition: background-color 140ms ease, border-color 140ms ease, color 140ms ease, box-shadow 140ms ease;
        }

        .app-shell .button:hover,
        .app-shell .mini-button:hover {
            border-color: var(--delegate-border-strong);
            background: var(--delegate-hover);
        }

        .app-shell .button.primary:hover,
        .app-shell .button.primary:focus-visible {
            border-color: var(--accent-hover);
            background: var(--accent-hover);
            color: #ffffff;
        }

        .app-shell .button.primary:hover svg,
        .app-shell .button.primary:focus-visible svg {
            color: currentColor;
            stroke: currentColor;
        }

        .app-shell .button:focus-visible,
        .app-shell .mini-button:focus-visible,
        .app-shell .text-button:focus-visible {
            outline: 2px solid #4d9173;
            outline-offset: 2px;
        }

        .app-shell .impersonation-banner #stopImpersonationButton.button {
            min-height: 24px;
            height: 24px;
            padding: 0 10px;
            border-radius: 999px;
            font-size: 10.5px !important;
            line-height: 1;
        }

        .app-shell :is(.field, .admin-form label, .agency-overview-field) > :is(label, span:first-child),
        .app-shell :is(.field-label, .field-title),
        .app-shell .property-field-heading > label {
            color: #4d5953;
            font-size: 11px !important;
            font-weight: 600 !important;
            letter-spacing: .01em;
            text-transform: none;
        }

        .app-shell :is(.field, .admin-form, .agency-overview-field, .record-panel, .modal, .drawer, .settings-content, .agency-settings-content)
        :is(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]), select, textarea) {
            border-color: var(--delegate-border);
            border-radius: var(--delegate-radius-sm);
            background-color: #ffffff;
            color: #202a25;
            font-size: 12.333px !important;
            font-weight: 400 !important;
        }

        .app-shell :is(.field, .admin-form, .agency-overview-field, .record-panel, .modal, .drawer, .settings-content, .agency-settings-content)
        :is(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]), select) {
            min-height: var(--delegate-control-height);
        }

        .app-shell :is(input, select, textarea):focus,
        .app-shell [contenteditable="true"]:focus {
            border-color: #397765;
            box-shadow: 0 0 0 3px rgba(57, 119, 101, .14);
            outline: none;
        }

        /* Native uploads now match custom upload actions everywhere they remain visible. */
        .app-shell input[type="file"]:not([hidden]) {
            min-height: var(--delegate-control-height);
            padding: 3px;
            border: 1px solid var(--delegate-border);
            border-radius: var(--delegate-radius-sm);
            background: #ffffff;
            color: #64706a;
            font-size: 12px !important;
            font-weight: 400 !important;
            cursor: pointer;
        }

        .app-shell input[type="file"]:not([hidden])::file-selector-button {
            height: 26px;
            margin: 0 10px 0 0;
            padding: 0 10px;
            border: 1px solid var(--delegate-border);
            border-radius: 5px;
            background: #f7f9f8;
            color: #27332d;
            font: inherit;
            font-size: 12px;
            font-weight: 500;
            cursor: pointer;
        }

        .app-shell input[type="file"]:not([hidden])::file-selector-button:hover {
            border-color: var(--delegate-border-strong);
            background: #ffffff;
        }

        .app-shell :is(.record-panel, .admin-panel, .settings-panel, .agency-settings-panel) {
            border-color: var(--delegate-border);
            border-radius: var(--delegate-radius-md);
            box-shadow: var(--delegate-shadow-panel);
        }

        .app-shell .record-panel-head {
            min-height: 52px;
            padding: 11px 14px;
            border-bottom-color: #e5e9e7;
            background: #ffffff;
        }

        .app-shell .record-panel-head h3 {
            color: #202a25;
            font-size: 12.5px;
            font-weight: 600;
            letter-spacing: -.005em;
        }

        .app-shell .record-panel-head .maintenance-job-tabs-header {
            width: 100%;
            margin: 0;
            padding: 0;
            border: 0;
        }

        .app-shell .record-panel-head .maintenance-job-tabs-header .property-workspace-tab > span:first-child {
            font-size: 12px !important;
            font-weight: 500 !important;
            line-height: 1;
        }

        .app-shell .record-panel-head .maintenance-job-tabs-header .property-workspace-tab.active > span:first-child {
            font-weight: 600 !important;
        }

        .app-shell .record-panel-body {
            padding: 12px 14px 14px;
        }

        .app-shell .record-content :where(.record-panel-body, .record-fields, .record-field, .agency-overview-form, .agency-overview-field, .comment-list, .activity-list, .document-list, .admin-list)
        :where(p, span, label, input, select, textarea, button, small, td, a, em, time) {
            font-size: 12px !important;
            font-weight: 400 !important;
        }

        .app-shell .record-content .comment-list :is(.comment-author-name, .comment-time) {
            font-size: 12px !important;
            line-height: 1.25 !important;
        }

        .app-shell .record-content .activity-list :is(
            .activity-event-head,
            .activity-event-head > span,
            .activity-event-head strong,
            .activity-event-time,
            .activity-change-label,
            .activity-change-value,
            .activity-event-note,
            .activity-access-meta,
            .activity-access-meta span
        ) {
            font-family: inherit !important;
            font-size: 10px !important;
        }

        .app-shell .record-content .activity-list .activity-event-head strong {
            font-weight: 500 !important;
        }

        .app-shell .record-content .activity-list :is(.activity-event-time, .activity-event-note) {
            font-weight: 300 !important;
        }

        .app-shell .record-field {
            min-height: 32px;
            padding: 7px 0;
            border-bottom-color: #edf0ee;
        }

        .app-shell .modal {
            border-color: var(--delegate-border);
            border-radius: var(--delegate-radius-lg);
            box-shadow: var(--delegate-shadow-overlay);
        }

        .app-shell .modal-head,
        .app-shell .modal-foot {
            padding: 16px 20px;
            border-color: #e4e9e6;
        }

        .app-shell .modal-body {
            padding: 20px;
        }

        .app-shell .modal-head h2 {
            color: #19231e;
            font-size: 17px;
            font-weight: 600;
            letter-spacing: -.012em;
        }

        /* Modals are mounted beside the app shell, so they consume the same system explicitly. */
        .modal {
            border-color: var(--delegate-border) !important;
            border-radius: var(--delegate-radius-lg) !important;
            box-shadow: var(--delegate-shadow-overlay) !important;
        }

        .modal :is(.modal-head, .modal-foot) {
            padding: 16px 20px !important;
            border-color: #e4e9e6 !important;
        }

        .modal .modal-body {
            padding: 20px !important;
        }

        .modal .modal-head h2 {
            color: #19231e;
            font-size: 17px;
            font-weight: 600;
            letter-spacing: -.012em;
        }

        .modal :is(.button, .mini-button, .text-button) {
            min-height: 32px;
            border-radius: var(--delegate-action-radius);
            font-size: 12px !important;
            font-weight: 500 !important;
        }

        :is(.field, .admin-form, .agency-asset-field, .pipeline-attachment-field) input[type="file"]:not([hidden]) {
            min-height: var(--delegate-control-height);
            padding: 3px;
            border: 1px solid var(--delegate-border);
            border-radius: var(--delegate-radius-sm);
            background: #ffffff;
            color: #64706a;
            font-size: 12px !important;
            font-weight: 400 !important;
            cursor: pointer;
        }

        :is(.field, .admin-form, .agency-asset-field, .pipeline-attachment-field) input[type="file"]:not([hidden])::file-selector-button {
            height: 26px;
            margin: 0 10px 0 0;
            padding: 0 10px;
            border: 1px solid var(--delegate-border);
            border-radius: 5px;
            background: #f7f9f8;
            color: #27332d;
            font: inherit;
            font-size: 12px;
            font-weight: 500;
            cursor: pointer;
        }

        :is(.field, .admin-form, .agency-asset-field, .pipeline-attachment-field)
        input[type="file"]:not([hidden]):not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]) {
            font-size: 12px !important;
            font-weight: 400 !important;
        }

        .app-shell :is(.table-shell, .admin-table-shell, .mapping-panel) {
            border-color: var(--delegate-border);
            border-radius: var(--delegate-radius-md);
            box-shadow: var(--delegate-shadow-panel);
        }

        .app-shell table {
            font-size: 12px;
            font-weight: 400;
        }

        .app-shell thead th,
        .app-shell thead th .sort-header,
        .app-shell thead th .sort-header span {
            color: #59645f;
            font-size: 9.5px;
            font-weight: 600;
            letter-spacing: .045em;
        }

        .app-shell tbody td {
            height: 36px;
        }

        .app-shell tbody tr:hover td {
            background-color: #f7faf8;
        }

        .app-shell :is(.record-tabs:not(.metric-tabs), .segmented-control, .tenant-portal-tabbar) {
            border-color: var(--delegate-border);
            border-radius: var(--delegate-radius-sm);
            background: #f4f6f5;
        }

        @media (min-width: 1180px) {
            .app-shell .record-grid {
                grid-template-columns: minmax(280px, .92fr) minmax(380px, 1.24fr) minmax(300px, .94fr);
            }
        }

        /* Delegate Harmony controls: shared tab, step and metric-card families. */
        .app-shell :is(.side-tabs, .tenancy-hub-tabs, .marketing-product-tabs, .segmented-control, .tenant-portal-tabbar) {
            min-height: 36px;
            gap: 3px;
            padding: 3px;
            border: 1px solid var(--delegate-border);
            border-radius: 8px;
            background: #f3f5f4;
            box-shadow: none;
        }

        .app-shell .record-tabs:not(.metric-tabs) .record-tab {
            min-height: 30px;
            padding: 0 10px;
            border: 1px solid transparent;
            border-radius: var(--delegate-radius-sm);
            background: transparent;
            color: #66716b;
            font-size: 12px !important;
            font-weight: 500 !important;
            box-shadow: none;
        }

        .app-shell .record-tabs:not(.metric-tabs) .record-tab:hover {
            border-color: #d7dfdb;
            background: #ffffff;
            color: #29352f;
        }

        .app-shell .record-tabs:not(.metric-tabs) .record-tab.active {
            border-color: #cbd9d3;
            background: #ffffff;
            color: var(--accent);
            font-weight: 600 !important;
            box-shadow: 0 1px 3px rgba(25, 42, 33, .06);
        }

        .app-shell :is(.side-tab, .tenancy-hub-tab, .marketing-product-tab, .segment, .tenant-portal-tab) {
            min-height: 30px;
            padding: 0 10px;
            border: 1px solid transparent;
            border-radius: var(--delegate-radius-sm);
            background: transparent;
            color: #66716b;
            font-size: 12px !important;
            font-weight: 500 !important;
            line-height: 1;
            box-shadow: none;
        }

        .app-shell :is(.side-tab, .tenancy-hub-tab, .marketing-product-tab, .segment, .tenant-portal-tab):hover {
            border-color: #d7dfdb;
            background: #ffffff;
            color: #29352f;
        }

        .app-shell :is(.side-tab, .tenancy-hub-tab, .marketing-product-tab, .segment, .tenant-portal-tab).active,
        .app-shell :is(.side-tab, .tenancy-hub-tab, .marketing-product-tab, .segment, .tenant-portal-tab)[aria-selected="true"] {
            border-color: #cbd9d3;
            background: #ffffff;
            color: var(--accent);
            font-weight: 600 !important;
            box-shadow: 0 1px 3px rgba(25, 42, 33, .06);
        }

        .app-shell :is(.side-tab, .tenancy-hub-tab, .marketing-product-tab, .segment, .tenant-portal-tab):focus-visible {
            z-index: 2;
            outline: 2px solid #4d9173;
            outline-offset: 1px;
        }

        /* Side-panel navigation uses the pill-toggle language while flexing without clipping. */
        .app-shell .record-panel-head:has(.side-tabs) {
            min-width: 0;
            flex-wrap: wrap;
        }

        .app-shell .record-panel-head .side-tabs {
            width: auto;
            min-width: 240px;
            max-width: 270px;
            min-height: 32px;
            margin-left: auto;
            padding: 2px;
            grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 90px;
            flex: 1 1 240px;
            border-radius: var(--delegate-pill-radius);
            overflow: hidden;
            background: #f4f6f5;
        }

        .app-shell .record-panel-head .side-tab {
            min-width: 0;
            min-height: 26px;
            height: 26px;
            padding: 0 11px;
            border-radius: var(--delegate-pill-radius);
            font-size: 11px !important;
            font-weight: 500 !important;
            white-space: nowrap;
        }

        .app-shell .record-panel-head .side-tab[data-side-tab="documents"] {
            width: 90px;
            padding-left: 11px;
            padding-right: 11px;
            box-sizing: border-box;
        }

        .app-shell .record-panel-head .side-tab.active,
        .app-shell .record-panel-head .side-tab[aria-selected="true"] {
            border-color: #d1dad5;
            border-radius: var(--delegate-pill-radius);
            background: #ffffff;
            color: var(--accent);
            box-shadow: 0 1px 2px rgba(25, 42, 33, .06);
        }

        .app-shell .record-panel-head .agency-middle-tabs {
            min-width: 210px;
            max-width: 228px;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            flex: 0 1 218px;
        }

        .app-shell .record-panel-head .contact-middle-tabs {
            min-width: 190px;
            max-width: 210px;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            flex: 0 1 200px;
        }

        @media (min-width: 901px) {
            .app-shell .record-content .record-grid > .record-panel > .record-panel-head {
                height: 55px;
                min-height: 55px;
                max-height: 55px;
                box-sizing: border-box;
                flex-wrap: nowrap;
            }
        }

        /* Pill controls are the second button family: filters, binary states and compact choices. */
        .app-shell .segmented {
            min-height: 36px;
            padding: 3px;
            border: 1px solid var(--delegate-border);
            border-radius: var(--delegate-pill-radius);
            background: #f2f4f2;
            overflow: hidden;
            box-shadow: none;
        }

        .app-shell .segmented .segment {
            min-height: 28px;
            border: 0;
            border-radius: var(--delegate-pill-radius);
            background: transparent;
            color: #68736d;
            box-shadow: none;
        }

        .app-shell .segmented .segment:hover {
            border: 0;
            background: rgba(255, 255, 255, .72);
        }

        .app-shell .segmented .segment.active {
            border: 0;
            background: #ffffff;
            color: #29352f;
            box-shadow: 0 1px 4px rgba(25, 42, 33, .09);
        }

        .app-shell .segmented .segment[data-status="open"].active,
        .app-shell .segmented .segment[data-agency-status="open"].active {
            background: #dff4e5;
            color: #17643b;
        }

        .app-shell .segmented .segment[data-status="closed"].active,
        .app-shell .segmented .segment[data-agency-status="closed"].active {
            background: #f9dfdf;
            color: #8b3535;
        }

        .app-shell .segmented.compliance-status-toggle .segment[data-status="open"].active {
            background: #f9dfdf;
            color: #8b3535;
        }

        .app-shell .segmented.compliance-status-toggle .segment[data-status="closed"].active {
            background: #dff4e5;
            color: #17643b;
        }

        .app-shell .record-tabs.metric-tabs:not(.opportunity-dashboard-metrics) {
            grid-template-columns: repeat(auto-fit, minmax(142px, 1fr));
            gap: 0;
            overflow: hidden;
            border: 1px solid var(--delegate-border);
            border-radius: var(--delegate-radius-lg);
            background: #ffffff;
            box-shadow: var(--delegate-shadow-panel);
        }

        .app-shell .record-tabs.metric-tabs:not(.opportunity-dashboard-metrics) .record-tab {
            min-height: 88px;
            padding: 16px 18px;
            border: 0;
            border-right: 1px solid #e3e8e5;
            border-bottom: 1px solid #e3e8e5;
            border-radius: 0;
            background: #ffffff;
            box-shadow: none;
        }

        .app-shell .record-tabs.metric-tabs:not(.opportunity-dashboard-metrics) .record-tab:hover {
            background: var(--delegate-hover);
            box-shadow: none;
        }

        .app-shell .record-tabs.metric-tabs:not(.opportunity-dashboard-metrics) .record-tab.active {
            border-color: #e3e8e5;
            background: #f2f7f4;
            box-shadow: inset 0 0 0 1px rgba(31, 77, 77, .06);
        }

        .app-shell .record-tabs.metric-tabs .tab-metric .tab-count {
            font-size: var(--delegate-metric-value-size) !important;
            font-weight: 500;
        }

        .app-shell :is(.dashboard-metric > strong, .dashboard-temperature strong, .dashboard-temperature-label, .opportunity-dashboard-value strong) {
            font-size: var(--delegate-metric-value-size) !important;
            font-weight: 500 !important;
        }

        .app-shell .record-tabs.metric-tabs .tab-label {
            font-size: 12px;
            font-weight: 600;
        }

        .app-shell .record-tabs.metric-tabs .tab-count-label {
            font-size: 10px;
            font-weight: 500;
        }

        .app-shell .pipeline-steps {
            gap: 10px;
        }

        .app-shell .pipeline-step {
            border-color: var(--delegate-border);
            border-radius: var(--delegate-radius-md);
            background: #ffffff;
            box-shadow: var(--delegate-shadow-panel);
        }

        .app-shell .pipeline-step-header {
            min-height: 54px;
            padding: 10px 12px;
            border-bottom-color: #e5e9e7;
            background: #ffffff;
        }

        .app-shell .pipeline-step-toggle {
            border-radius: var(--delegate-radius-sm);
        }

        .app-shell .pipeline-step-toggle:hover {
            background: var(--delegate-hover);
        }

        .app-shell .pipeline-step-title strong {
            color: #202a25;
            font-size: 12px !important;
            font-weight: 600 !important;
        }

        .app-shell .pipeline-step-title span {
            color: #727d77;
            font-size: 11px !important;
            font-weight: 400 !important;
        }

        .app-shell .pipeline-step-body {
            padding: 12px;
        }

        .owner-portal-map-pending {
            display: grid;
            align-content: center;
            justify-items: center;
            gap: 10px;
            padding: 20px;
            background: #f4f7f5;
            color: #65716b;
            text-align: center;
        }

        .auth-applicant-toggle {
            border: 0;
            background: transparent;
            color: #245e55;
            font: inherit;
            font-size: 13px;
            font-weight: 700;
            cursor: pointer;
            padding: 2px 0;
            text-align: left;
        }

        .auth-applicant-fields {
            display: grid;
            gap: 10px;
        }

        .applicant-portal {
            display: grid;
            gap: 18px;
            max-width: 1180px;
            margin: 0 auto;
        }

        .applicant-hero {
            padding: 26px;
            border-radius: 20px;
            color: #fff;
            background: linear-gradient(135deg, #173f3b, #2c776a);
            display: flex;
            justify-content: space-between;
            gap: 24px;
            align-items: end;
        }

        .applicant-hero h2 { margin: 7px 0; font-size: 27px; }
        .applicant-hero p { margin: 0; max-width: 660px; color: rgba(255,255,255,.78); }
        .applicant-status { padding: 8px 12px; border-radius: 999px; background: rgba(255,255,255,.14); font-weight: 700; white-space: nowrap; }
        .applicant-sections { display: grid; gap: 12px; }
        .applicant-section { border: 1px solid #dfe6e2; border-radius: 16px; background: #fff; overflow: hidden; }
        .applicant-section summary { cursor: pointer; list-style: none; padding: 18px 20px; display: flex; align-items: center; justify-content: space-between; font-weight: 750; color: #263a35; }
        .applicant-section summary::-webkit-details-marker { display: none; }
        .applicant-section summary::after { content: '+'; color: #598077; font-size: 20px; }
        .applicant-section[open] summary::after { content: '−'; }
        .applicant-section-body { border-top: 1px solid #edf1ef; padding: 20px; }
        .applicant-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 16px; }
        .applicant-field { display: grid; gap: 7px; }
        .applicant-field.full { grid-column: 1 / -1; }
        .applicant-field label { font-size: 12px; font-weight: 700; color: #51625c; }
        .applicant-field input, .applicant-field select, .applicant-field textarea { width: 100%; border: 1px solid #ccd8d3; border-radius: 10px; padding: 11px 12px; background: #fff; color: #263530; font: inherit; }
        .applicant-field textarea { min-height: 88px; resize: vertical; }
        .applicant-repeat { padding: 16px; border-radius: 12px; background: #f6f8f7; }
        .applicant-repeat h4 { margin: 0 0 14px; }
        .applicant-upload-list { display: grid; gap: 10px; }
        .applicant-upload { display: grid; grid-template-columns: minmax(180px, .65fr) 1fr; align-items: center; gap: 12px; padding: 12px; border: 1px solid #e0e8e4; border-radius: 11px; }
        .applicant-upload strong { font-size: 13px; }
        .applicant-docs { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 7px; }
        .applicant-doc { display: inline-flex; gap: 8px; align-items: center; border-radius: 999px; padding: 6px 9px; background: #edf4f1; font-size: 12px; }
        .applicant-doc button { border: 0; background: transparent; color: #9b3b3b; cursor: pointer; }
        .applicant-actions { position: sticky; bottom: 14px; z-index: 3; display: flex; justify-content: flex-end; gap: 10px; padding: 12px; border: 1px solid #dce5e1; border-radius: 14px; background: rgba(255,255,255,.94); box-shadow: 0 10px 30px rgba(30,54,47,.12); backdrop-filter: blur(10px); }

        .application-results-frame { grid-row:3; min-width:0; min-height:0; height:100%; position:relative; overflow:hidden; border:1px solid var(--line); border-radius:7px; background:#fff; box-shadow:var(--shadow); }
        .application-table-scroll { height:100%; overflow:auto; }
        .application-table { width:max-content; min-width:100%; border-collapse:separate; border-spacing:0; color:var(--text); font-size:12px; font-weight:400; }
        .application-table th { position:sticky; top:0; z-index:3; height:27px; padding:6px 8px; border-bottom:1px solid var(--line); background:#fbfbf8; color:#59645f; font-size:9px; font-weight:500; letter-spacing:.045em; text-align:left; text-transform:uppercase; white-space:nowrap; }
        .application-table td { height:43px; padding:6px 8px; border-bottom:1px solid #edf0ee; background:#fff; font-size:12px; font-weight:400; vertical-align:middle; white-space:nowrap; }
        .application-table-row { cursor:pointer; outline:0; }
        .application-table-row:hover td,.application-table-row:focus-visible td { background:#f7faf8; }
        .application-table-row:last-child td { border-bottom:0; }
        .application-table-primary { display:grid; gap:1px; width:260px; max-width:260px; min-width:260px; }
        .application-table-primary strong { overflow:hidden; color:#263630; font-size:12px; font-weight:400; text-overflow:ellipsis; }
        .application-table-primary small { overflow:hidden; color:#77817c; font-size:11px; font-weight:400; text-overflow:ellipsis; }
        .application-table-progress { display:flex; align-items:center; gap:8px; min-width:116px; }
        .application-table-progress > span { width:66px; height:5px; overflow:hidden; border-radius:999px; background:#e5ebe8; }
        .application-table-progress i { display:block; height:100%; border-radius:inherit; background:#3b7468; }
        .application-table-progress small,.application-table-empty { color:#77817c; font-size:12px; font-weight:400; }
        .property-rent-period-suffix { color:var(--muted); font-size:10px; font-weight:600; text-transform:lowercase; }
        .application-table-open { min-height:30px; padding:5px 10px; }
        .application-status-select { width:158px; height:30px; border:1px solid transparent; border-radius:7px; padding:0 34px 0 10px; font-size:12px; font-weight:400; cursor:pointer; outline:none; }
        .application-status-select:focus { box-shadow:0 0 0 3px var(--accent-ring); }
        .application-status-select:disabled { cursor:progress; opacity:.68; }
        .application-table th.pinned,.application-table td.pinned { position:sticky; left:0; box-shadow:1px 0 0 var(--line-soft); }
        .application-table th.pinned { z-index:6; }
        .application-table td.pinned { z-index:4; }
        .application-results-frame > .empty-state { top:0; min-height:100%; border-radius:inherit; }
        #applicationRecordContent .record-page-head { width:100%; margin:0 0 12px; }
        .application-record-grid { display:grid; align-content:start; gap:18px; width:100%; min-height:0; margin:0; }
        .application-record-summary { border:0; border-radius:0; background:transparent; overflow:visible; }
        .application-record-summary-head { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; padding:2px 2px 16px; border-bottom:1px solid var(--line); }
        .application-record-summary-title { display:grid; gap:4px; min-width:0; }
        .application-record-summary-title > span { display:none; }
        .application-record-summary-title h2 { margin:0; color:var(--ink); font-size:22px; font-weight:500; line-height:1.25; letter-spacing:-.015em; }
        .application-record-summary-title p { margin:0; color:var(--muted); font-size:12px; font-weight:400; }
        .application-record-status { display:inline-flex; align-items:center; gap:7px; padding:5px 0; background:transparent; color:#52605a; font-size:11px; font-weight:500; white-space:nowrap; }
        .application-record-status::before { content:""; width:7px; height:7px; border-radius:50%; background:#8a9892; }
        .application-record-status.submitted { background:#e8f4ef; color:#276151; }
        .application-record-status.submitted::before { background:#3f8b74; }
        .application-record-status.partial { background:#fff4df; color:#805a1e; }
        .application-record-status.partial::before { background:#c59036; }
        .application-record-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; padding:16px 2px 18px; border-bottom:1px solid var(--line); }
        .application-record-metric { min-width:0; padding:0; border:0; }
        .application-record-metric span { display:block; margin-bottom:5px; color:#77817c; font-size:9px; font-weight:500; letter-spacing:.04em; text-transform:uppercase; }
        .application-record-metric strong { display:block; color:#2d3c36; font-size:12px; font-weight:400; overflow-wrap:anywhere; }
        .application-record-progress { display:flex; align-items:center; gap:10px; margin-top:8px; }
        .application-record-progress-track { height:5px; flex:1; border-radius:999px; background:#e7ece9; overflow:hidden; }
        .application-record-progress-track i { display:block; height:100%; border-radius:inherit; background:#3b7468; }
        .application-record-progress small { color:#60706a; font-size:10px; white-space:nowrap; }
        .application-record-applicant-panel { border:1px solid var(--line); border-radius:8px; background:#fff; overflow:hidden; }
        .application-record-applicant-panel-head { display:flex; justify-content:space-between; align-items:center; gap:18px; padding:14px 16px; border-bottom:1px solid #e8ecea; }
        .application-record-applicant-panel-head div { display:grid; gap:3px; }
        .application-record-applicant-panel-head h3 { margin:0; color:#2d3b36; font-size:14px; font-weight:500; }
        .application-record-applicant-panel-head p { margin:0; color:#75807a; font-size:11px; }
        .application-record-applicant-panel-head > span { color:#5e6c66; font-size:11px; font-weight:400; }
        .application-record-applicants { display:grid; background:#fff; }
        .application-answer-applicant { border:0; border-bottom:1px solid #e8ecea; background:#fff; overflow:hidden; }
        .application-answer-applicant:last-child { border-bottom:0; }
        .application-answer-applicant > summary { cursor:pointer; list-style:none; padding:14px 16px; display:flex; align-items:center; justify-content:space-between; gap:14px; }
        .application-answer-applicant > summary::-webkit-details-marker { display:none; }
        .application-answer-applicant > summary::after { content:"+"; color:#53675f; font-size:16px; }
        .application-answer-applicant[open] > summary::after { content:"−"; }
        .application-answer-person { display:flex; align-items:center; gap:11px; min-width:0; flex:1; }
        .application-answer-person img,.application-answer-person .avatar { width:36px; height:36px; border-radius:50%; object-fit:cover; background:#edf2f0; display:grid; place-items:center; font-size:11px; font-weight:500; color:#315f56; }
        .application-answer-person span { display:grid; gap:2px; min-width:0; }
        .application-answer-person strong { font-size:12px; font-weight:500; }
        .application-answer-person small { color:#6b7872; font-size:11px; font-weight:400; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
        .application-answer-summary-meta { display:flex; align-items:center; gap:8px; }
        .application-answer-completeness { color:#65736d; font-size:10px; white-space:nowrap; }
        .application-answer-body { border-top:1px solid #edf1ef; display:grid; grid-template-columns:1fr; background:#fff; }
        .application-answer-section { border:0; border-bottom:1px solid #e8ecea; overflow:hidden; background:#fff; }
        .application-answer-section:last-child { border-bottom:0; }
        .application-answer-section > summary { cursor:pointer; list-style:none; display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:48px; padding:11px 16px; }
        .application-answer-section > summary:hover { background:#fafbfa; }
        .application-answer-section > summary::-webkit-details-marker { display:none; }
        .application-answer-section > summary h4 { margin:0; color:#34463f; font-size:12px; font-weight:500; }
        .application-answer-section > summary span { margin-left:auto; color:#77837d; font-size:10px; font-weight:400; }
        .application-answer-section > summary::after { content:"+"; color:#60726a; font-size:15px; }
        .application-answer-section[open] > summary::after { content:"−"; }
        .application-answer-section[open] { grid-column:auto; border-right:0; }
        .application-answer-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); border-top:1px solid #edf1ef; }
        .application-answer-field { padding:10px 12px; border-bottom:1px solid #edf1ef; min-width:0; }
        .application-answer-field:nth-child(odd) { border-right:1px solid #edf1ef; }
        .application-answer-field:nth-last-child(-n+2) { border-bottom:0; }
        .application-answer-field span { display:block; color:#75807b; font-size:9px; font-weight:700; text-transform:uppercase; letter-spacing:.045em; }
        .application-answer-field strong { display:block; margin-top:4px; color:#2b3934; font-size:12px; font-weight:400; overflow-wrap:anywhere; }
        .application-answer-documents { display:flex; flex-wrap:wrap; gap:8px; }
        .application-answer-document { padding:6px 9px; border-radius:999px; background:#edf4f1; color:#285e54; font-size:11px; text-decoration:none; }
        .applicant-record-application { margin-bottom:12px; overflow:hidden; border:1px solid var(--line); border-radius:8px; background:#fff; }
        .applicant-record-application-head { display:flex; justify-content:space-between; gap:16px; padding:13px 14px; border-bottom:1px solid #e8ecea; }
        .applicant-record-application-head > div { display:grid; gap:3px; }
        .applicant-record-application-head span:first-child { color:#6e7873; font-size:10px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
        .applicant-record-application-head h4 { margin:0; color:#293a34; font-size:14px; }
        .applicant-record-application-head p { margin:0; color:#75807a; font-size:11px; }
        .applicant-group-panel { border:1px solid #dbe5e0; border-radius:16px; padding:18px; background:#fff; display:grid; gap:14px; }
        .applicant-group-panel-head { display:flex; justify-content:space-between; gap:16px; align-items:start; }
        .applicant-group-code { font-size:20px; letter-spacing:.14em; font-weight:800; color:#245e55; }
        .applicant-group-members { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:8px; }
        .applicant-group-member { padding:10px 12px; border-radius:10px; background:#f3f7f5; display:grid; gap:3px; }
        .applicant-group-member span { font-size:12px; color:#68746f; }
        .applicant-group-join { display:flex; gap:8px; }
        .applicant-group-join input { min-width:0; flex:1; border:1px solid #ccd8d3; border-radius:10px; padding:10px 12px; text-transform:uppercase; letter-spacing:.08em; }

        @media (max-width: 720px) {
            .applicant-form-grid { grid-template-columns: 1fr; }
            .applicant-field.full { grid-column: auto; }
            .applicant-upload { grid-template-columns: 1fr; }
            .applicant-hero { align-items: start; flex-direction: column; }
            .application-record-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
            .application-record-metric:nth-child(2) { border-right:0; }
            .application-record-metric:nth-child(-n+2) { border-bottom:1px solid #e8ecea; }
            .application-answer-body,.application-answer-grid { grid-template-columns:1fr; }
            .application-answer-section { border-right:0; }
            .application-answer-field:nth-child(odd) { border-right:0; }
            .application-answer-summary-meta { flex-wrap:wrap; justify-content:flex-end; }
        }

        .owner-portal-map-pending .tenant-portal-icon {
            width: 42px;
            height: 42px;
        }

        .app-shell .record-content #propertyWorkspaceTabs .property-workspace-tab.active {
            font-weight: 700 !important;
        }

        .app-shell .record-content #propertyWorkspaceTabs .property-workspace-tab.active > span:first-child {
            font-weight: 700 !important;
        }

        @media (max-width: 720px) {
            .app-shell .modal-head,
            .app-shell .modal-foot,
            .app-shell .modal-body {
                padding-left: 16px;
                padding-right: 16px;
            }
        }
        .airtable-agency-panel { display: grid; gap: 14px; }
        .airtable-panel-head, .airtable-inline-control { display: flex; align-items: center; gap: 10px; }
        .airtable-panel-head { justify-content: space-between; }
        .airtable-panel-head div { display: grid; gap: 3px; }
        .airtable-panel-actions { display: flex !important; flex: 0 0 auto; grid-auto-flow: column; gap: 7px !important; }
        .airtable-panel-head small, .airtable-agency-panel small { color: var(--muted); font-size: 12px; }
        .airtable-inline-control input { flex: 1; min-width: 0; }
        .airtable-sync-overview { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
        .airtable-sync-overview > div { display: grid; gap: 4px; min-width: 0; padding: 11px 12px; border: 1px solid var(--border); border-radius: 8px; background: #f8faf9; }
        .airtable-sync-overview span { color: var(--muted); font-size: 10px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; }
        .airtable-sync-overview strong { overflow: hidden; color: var(--text); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
        .airtable-sync-overview .warning { border-color: #ecd58b; background: #fff9e8; }
        .airtable-live-progress { display: grid; gap: 9px; padding: 12px; border: 1px solid rgba(31, 77, 77, .2); border-radius: 8px; background: var(--accent-soft); }
        .airtable-live-progress > div:first-child { display: flex; justify-content: space-between; gap: 12px; }
        .airtable-live-progress strong { color: var(--accent); font-size: 13px; }
        .airtable-live-progress span { color: var(--muted); font-size: 11px; }
        .airtable-progress-track { height: 6px; overflow: hidden; border-radius: 999px; background: rgba(31, 77, 77, .12); }
        .airtable-progress-track span { display: block; width: 4%; height: 100%; border-radius: inherit; background: var(--accent); transition: width .35s ease; }
        #airtableSync.is-loading::before { content: ""; width: 12px; height: 12px; border: 2px solid rgba(255,255,255,.45); border-top-color: currentColor; border-radius: 50%; animation: import-button-spin .75s linear infinite; }
        .airtable-section-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 8px; }
        .airtable-section-head > div { display: grid; gap: 2px; }
        .airtable-base-input { position: relative; flex: 1; min-width: 0; }
        .airtable-base-input input { width: 100%; padding-right: 36px !important; }
        .airtable-connection-status { position: absolute; top: 50%; right: 11px; width: 18px; height: 18px; transform: translateY(-50%); display: grid; place-items: center; }
        .airtable-connection-status svg { width: 18px; height: 18px; }
        .airtable-connection-status.connected { color: #27834d; }
        .airtable-connection-status.warning { color: #c38a16; }
        .airtable-mapping-list { display: grid; gap: 8px; margin: 14px 0; }
        .airtable-mapping-card { display: flex; justify-content: space-between; gap: 12px; padding: 11px 12px; border: 1px solid var(--border); border-radius: 8px; background: #f8faf9; }
        .airtable-mapping-card span { display: grid; gap: 2px; font-size: 12px; color: var(--muted); }
        .airtable-mapping-card strong { color: var(--text); font-size: 13px; }
        .airtable-mapping-builder { display: grid; gap: 12px; padding: 14px; border: 1px solid var(--border); border-radius: 9px; background: #fff; }
        .airtable-mapping-builder-head, .airtable-mapping-card-actions { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
        .airtable-mapping-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
        .airtable-mapping-grid label, .airtable-field-map label { display: grid; gap: 5px; font-size: 12px; font-weight: 600; }
        .airtable-mapping-grid select, .airtable-field-map select { width: 100%; }
        .airtable-field-map { display: grid; gap: 7px; max-height: 320px; overflow: auto; padding-right: 4px; }
        .airtable-field-row { display: grid !important; grid-template-columns: minmax(0, 1fr) 18px minmax(0, 1fr); align-items: center; gap: 8px !important; font-weight: 400 !important; }
        .airtable-run-section { display: grid; gap: 10px; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--border); }
        .airtable-run-history { display: grid; gap: 7px; }
        .airtable-run-row { display: grid; grid-template-columns: 130px minmax(0, 1fr) 150px; gap: 12px; align-items: center; padding: 10px 11px; border: 1px solid var(--border); border-radius: 8px; background: #fff; }
        .airtable-run-row > span:not(.airtable-run-status) { display: grid; gap: 2px; min-width: 0; }
        .airtable-run-row strong { overflow: hidden; color: var(--text); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
        .airtable-run-row small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
        .airtable-run-status { width: fit-content; padding: 4px 7px; border-radius: 999px; background: #edf2ef; color: var(--muted); font-size: 10px; font-weight: 700; }
        .airtable-run-status.success { background: #e8f5ed; color: #267344; }
        .airtable-run-status.error { background: #fff0ed; color: #a84132; }
        .airtable-run-status.running { background: var(--accent-soft); color: var(--accent); }
        @media (max-width: 760px) {
            .airtable-mapping-grid { grid-template-columns: 1fr; }
            .airtable-panel-head { align-items: flex-start; }
            .airtable-sync-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
            .airtable-run-row { grid-template-columns: 1fr; }
        }
button.is-saving,
.button.is-saving {
    cursor: wait;
    opacity: 0.78;
}

/* Agency training and licensing workspace */
/* Shared agency inbox */
.communications-content { min-height: 0; height: calc(100vh - var(--topbar-height, 64px)); padding: 18px 24px 24px; background: #f6f8f7; overflow: hidden; }
.communications-shell { height: 100%; min-height: 0; max-width: 1680px; margin: 0 auto; border: 1px solid #dfe4e1; border-radius: 14px; background: #fff; display: grid; grid-template-rows: auto auto auto minmax(0,1fr); overflow: hidden; box-shadow: 0 10px 28px rgba(26,42,36,.05); }
.communications-header { padding: 22px 24px 16px; display: flex; justify-content: space-between; align-items: center; gap: 18px; }
.communications-header h2 { margin: 0; color: #1d2723; font-size: 21px; font-weight: 600; }.communications-header p { margin: 5px 0 0; color: #707a76; font-size: 12px; display: flex; align-items: center; gap: 8px; }.communications-header p strong { color: #3b4641; font-weight: 500; }.communications-header p button { border: 0; background: transparent; color: #176b60; padding: 0; font: 600 10px Inter,sans-serif; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.communications-header-actions { display: flex; gap: 9px; }.communications-tabs { display: flex; align-items: flex-end; gap: 26px; min-height: 43px; padding: 0 24px; border-bottom: 1px solid #e6eae8; }
.communications-tab { align-self: stretch; border: 0; border-bottom: 2px solid transparent; background: transparent; padding: 0 2px; color: #69736f; font: 500 12px/1 Inter,sans-serif; cursor: pointer; }.communications-tab.is-active { color: #185d54; border-bottom-color: #24776b; }.communications-tab span { display: inline-grid; place-items: center; min-width: 18px; height: 18px; margin-left: 5px; border-radius: 999px; background: #edf1ef; color: #65706b; font-size: 10px; }.communications-tab span:empty { display: none; }.communications-tab span.has-unread { background: #dcefe8; color: #17675c; }
.communications-message { min-height: 0; padding: 0 24px; color: #52605b; font-size: 12px; }.communications-message:not(:empty) { padding-top: 10px; padding-bottom: 10px; border-bottom: 1px solid #e8ebe9; }.communications-message.error { color: #a23932; background: #fff7f6; }.communications-message.ok { color: #17675c; background: #f4faf7; }
.communications-workspace { min-height: 0; display: grid; grid-template-columns: 390px minmax(0,1fr); }.communications-list-panel { min-width: 0; min-height: 0; border-right: 1px solid #e2e6e4; display: grid; grid-template-rows: auto minmax(0,1fr); }.communications-search { margin: 14px; height: 39px; border: 1px solid #dfe4e1; border-radius: 9px; background: #f9faf9; display: flex; align-items: center; gap: 8px; padding: 0 11px; }.communications-search svg { width: 16px; color: #7b8580; }.communications-search input { min-width: 0; flex: 1; border: 0; outline: 0; background: transparent; font: 400 12px Inter,sans-serif; color: #27312d; }
.communications-thread-list { min-height: 0; overflow-y: auto; }.communications-thread { width: 100%; border: 0; border-top: 1px solid #edf0ee; background: #fff; display: grid; grid-template-columns: 38px minmax(0,1fr); gap: 11px; padding: 15px 14px; text-align: left; font: inherit; cursor: pointer; position: relative; }.communications-thread:hover { background: #f9fbfa; }.communications-thread.is-active { background: #eef6f2; }.communications-thread.is-unread::before { content: ''; position: absolute; left: 4px; top: 22px; width: 5px; height: 5px; border-radius: 50%; background: #23796d; }.communications-avatar { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: #e7efeb; color: #285e55; font-size: 12px; font-weight: 600; }.communications-thread-copy { min-width: 0; display: flex; flex-direction: column; gap: 3px; }.communications-thread-copy > span { display: flex; justify-content: space-between; gap: 10px; }.communications-thread-copy strong,.communications-thread-copy b { color: #2a3430; font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.communications-thread-copy b { font-weight: 500; }.communications-thread.is-unread .communications-thread-copy strong,.communications-thread.is-unread .communications-thread-copy b { font-weight: 700; color: #18231f; }.communications-thread-copy time { flex: 0 0 auto; color: #8a938f; font-size: 10px; }.communications-thread-copy small { color: #747e79; font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.communications-thread-copy em { color: #8a928f; font-size: 9px; font-style: normal; }
.communications-list-empty,.communications-empty { min-height: 240px; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 6px; color: #7d8782; text-align: center; padding: 24px; }.communications-empty { height: 100%; }.communications-empty svg { width: 42px; height: 42px; margin-bottom: 8px; color: #a0aaa5; }.communications-list-empty strong,.communications-empty strong { color: #44504b; font-size: 13px; }.communications-list-empty span,.communications-empty span { font-size: 11px; }
.communications-reader { min-width: 0; min-height: 0; display: grid; grid-template-rows: auto minmax(0,1fr) auto; background: #fbfcfb; }.communications-reader-head { padding: 20px 24px; border-bottom: 1px solid #e3e7e5; background: #fff; display: flex; justify-content: space-between; gap: 20px; align-items: center; }.communications-reader-head > div:first-child { min-width: 0; }.communications-reader-head span,.communications-reader-head small { color: #79837e; font-size: 11px; }.communications-reader-head h3 { margin: 3px 0; color: #1f2925; font-size: 17px; font-weight: 600; }.communications-reader-actions { display: flex; align-items: end; gap: 7px; }.communications-reader-actions label { display: flex; flex-direction: column; gap: 4px; }.communications-reader-actions label span { font-size: 9px; text-transform: uppercase; letter-spacing: .04em; }.communications-reader-actions select { min-width: 165px; height: 34px; border: 1px solid #dbe0dd; border-radius: 8px; padding: 0 32px 0 9px; background: #fff; font: 400 11px Inter,sans-serif; }
.communications-conversation { min-height: 0; overflow-y: auto; padding: 22px 7%; }.communications-email { max-width: 860px; margin: 0 auto 14px; border: 1px solid #e0e5e2; border-radius: 11px; background: #fff; overflow: hidden; }.communications-email.is-outbound { border-color: #d6e6df; }.communications-email header { padding: 14px 16px; display: grid; grid-template-columns: 36px minmax(0,1fr) auto; align-items: center; gap: 10px; border-bottom: 1px solid #edf0ee; }.communications-email header > div { display: flex; flex-direction: column; }.communications-email header strong { color: #2b3531; font-size: 12px; }.communications-email header span,.communications-email header time { color: #7a847f; font-size: 10px; }.communications-email-body { padding: 18px 20px; color: #313b37; font-size: 13px; line-height: 1.65; }.communications-email footer { padding: 10px 16px; background: #fafbfa; border-top: 1px solid #edf0ee; color: #7c8581; font-size: 10px; text-align: right; }.communications-delivery.is-opened,.communications-delivery.is-delivered { color: #267166; }.communications-delivery.is-failed { color: #ae4139; }.communications-attachments { padding: 0 20px 14px; display: flex; flex-wrap: wrap; gap: 7px; }.communications-attachments span { border: 1px solid #dde3e0; border-radius: 8px; background: #f8faf9; padding: 7px 9px; color: #63706a; font-size: 10px; }
.communications-reply { padding: 14px 18px 16px; border-top: 1px solid #dfe4e1; background: #fff; }.communications-reply textarea { width: 100%; resize: vertical; min-height: 76px; border: 1px solid #dbe1de; border-radius: 9px; padding: 11px; font: 400 12px/1.5 Inter,sans-serif; }.communications-reply > div { display: flex; justify-content: flex-end; gap: 8px; margin-top: 9px; }
.nav-count { margin-left: auto; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: #dff0e9; color: #155e54; font-size: 9px; display: grid; place-items: center; }
.communication-compose-card { width: min(980px,calc(100vw - 32px)); max-height: calc(100vh - 30px); overflow: hidden; display: grid; grid-template-rows: auto minmax(0,1fr); }.communication-compose-card > form { min-height: 0; display: grid; grid-template-columns: minmax(0,1fr) 235px; grid-template-rows: minmax(0,1fr) auto; overflow: hidden; }.communication-compose-fields { min-height: 0; overflow-y: auto; padding: 22px; display: grid; grid-template-columns: 1fr 1fr; align-content: start; gap: 15px; }.communication-compose-fields label { display: flex; flex-direction: column; gap: 6px; }.communication-compose-fields label > span { color: #4f5a55; font-size: 11px; font-weight: 600; }.communication-compose-fields .span-2 { grid-column: 1/-1; }.communication-compose-fields input,.communication-compose-fields select,.communication-compose-fields textarea { width: 100%; border: 1px solid #dbe1de; border-radius: 8px; padding: 10px 11px; font: 400 12px Inter,sans-serif; background: #fff; }.communication-compose-fields textarea { line-height: 1.55; resize: vertical; }.communication-merge-panel { border-left: 1px solid #e2e6e4; background: #f8faf9; padding: 20px 16px; overflow-y: auto; }.communication-merge-panel > strong { display: block; color: #29342f; font-size: 13px; }.communication-merge-panel > span { display: block; color: #78827d; font-size: 10px; margin: 4px 0 14px; }.communication-merge-panel details { border-bottom: 1px solid #e4e8e6; }.communication-merge-panel summary,.communication-template-merges summary { padding: 10px 0; cursor: pointer; color: #4e5a55; font-size: 11px; font-weight: 600; }.communication-merge-panel details div,.communication-template-merges details div { display: flex; flex-wrap: wrap; gap: 5px; padding-bottom: 10px; }.communication-merge-panel button,.communication-template-merges button { border: 1px solid #d7e3de; border-radius: 999px; background: #fff; color: #28675d; padding: 5px 8px; font: 500 9px Inter,sans-serif; cursor: pointer; }.communication-compose-card .modal-actions { grid-column: 1/-1; }.communication-related-field { position: relative; }.communication-related-results { position: absolute; z-index: 10; top: 64px; left: 0; right: 0; border: 1px solid #dce2df; border-radius: 9px; background: #fff; box-shadow: 0 12px 28px rgba(25,38,33,.12); overflow: hidden; }.communication-related-results button { width: 100%; border: 0; border-bottom: 1px solid #edf0ee; background: #fff; padding: 10px 12px; display: flex; justify-content: space-between; text-align: left; font: 400 11px Inter,sans-serif; }.communication-related-results button span { color: #7c8681; font-size: 9px; }
.communication-template-card { width: min(980px,calc(100vw - 32px)); height: min(760px,calc(100vh - 32px)); display: grid; grid-template-rows: auto minmax(0,1fr); overflow: hidden; }.communication-template-layout { min-height: 0; display: grid; grid-template-columns: 270px minmax(0,1fr); }.communication-template-layout > aside { border-right: 1px solid #e2e6e4; padding: 16px; overflow-y: auto; }.communication-template-layout > aside > .button { width: 100%; margin-bottom: 12px; }.communication-template-layout [data-template-list] { display: grid; gap: 5px; }.communication-template-layout [data-template-list] button { border: 1px solid #e1e6e3; border-radius: 8px; background: #fff; padding: 10px; display: flex; flex-direction: column; text-align: left; gap: 3px; font: inherit; cursor: pointer; }.communication-template-layout [data-template-list] strong { color: #35403b; font-size: 11px; }.communication-template-layout [data-template-list] span { color: #7a847f; font-size: 9px; }.communication-template-layout form { min-height: 0; overflow-y: auto; padding: 22px; }.communication-template-layout form .field { margin-bottom: 14px; }.communication-template-empty { height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 5px; color: #78827d; }.communication-template-empty strong { color: #45504b; }.communication-template-merges { margin: 6px 0 16px; }
.system-email-template-list { display: grid; gap: 10px; padding: 22px 0; }.system-email-template-card { border: 1px solid #e0e5e2; border-radius: 10px; background: #fff; padding: 15px 16px; display: flex; justify-content: space-between; align-items: center; gap: 16px; }.system-email-template-card > div { min-width: 0; display: flex; flex-direction: column; gap: 3px; }.system-email-template-card span { color: #72807a; font-size: 9px; text-transform: uppercase; letter-spacing: .05em; }.system-email-template-card strong { color: #29332f; font-size: 13px; }.system-email-template-card small { color: #717b76; font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media(max-width:900px){.communications-content{padding:0;height:calc(100vh - 60px)}.communications-shell{border-radius:0;border-left:0;border-right:0}.communications-workspace{grid-template-columns:330px minmax(0,1fr)}.communication-compose-card>form{grid-template-columns:1fr}.communication-merge-panel{display:none}.communication-compose-card .modal-actions{grid-column:auto}.communications-conversation{padding:16px}}
@media(max-width:680px){.communications-header{padding:16px}.communications-header p strong,.communications-header p .badge{display:none}.communications-header-actions .subtle{display:none}.communications-workspace{display:block}.communications-list-panel{height:100%;border-right:0}.communications-reader{position:absolute;inset:0;z-index:5}.communications-reader:has(.communications-empty){display:none}.communication-template-layout{grid-template-columns:1fr}.communication-template-layout>aside{display:none}.communication-compose-fields{grid-template-columns:1fr}.communication-compose-fields .span-2{grid-column:auto}}

.training-workspace { padding-bottom: 32px; }
.training-workspace-head { align-items: center; gap: 20px; }
.training-head-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.training-head-actions select { min-width: 210px; min-height: 42px; border: 1px solid #d9dedc; border-radius: 9px; background: #fff; padding: 0 38px 0 12px; font: inherit; }
.training-summary { display: grid; grid-template-columns: 1.35fr 1fr 1fr; gap: 14px; margin: 20px 0; }
.training-summary > article { min-height: 112px; border: 1px solid #e0e4e2; border-radius: 12px; background: #fff; padding: 20px; display: flex; flex-direction: column; justify-content: center; gap: 5px; }
.training-summary article > span, .training-progress-card > div:last-child > span { color: #6b7470; font-size: 12px; font-weight: 600; }
.training-summary article > strong, .training-progress-card > div:last-child > strong { color: #18201d; font-size: 16px; font-weight: 600; }
.training-summary article > small, .training-progress-card > div:last-child > small { color: #727b77; font-size: 12px; font-weight: 400; }
.training-progress-card { flex-direction: row !important; align-items: center; justify-content: flex-start !important; gap: 16px !important; }
.training-progress-card > div:last-child { display: flex; flex-direction: column; gap: 5px; }
.training-progress-ring { --training-progress: 0deg; width: 68px; height: 68px; flex: 0 0 68px; border-radius: 50%; display: grid; place-items: center; background: conic-gradient(#1f756a var(--training-progress), #e7ecea 0); position: relative; }
.training-progress-ring::after { content: ''; position: absolute; inset: 9px; border-radius: 50%; background: #fff; }
.training-progress-ring span { position: relative; z-index: 1; color: #26312d; font-size: 13px; font-weight: 600; }
.training-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 20px; align-items: start; }
.training-main { min-width: 0; display: grid; gap: 14px; }
.training-main .agency-settings-section { margin: 0; overflow: hidden; }
.training-form { padding: 22px !important; }
.training-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.training-form-grid .span-2 { grid-column: 1 / -1; }
.training-guidance { margin-top: 18px; border: 1px solid #dce8e4; border-radius: 10px; background: #f6faf8; padding: 15px 16px; display: flex; justify-content: space-between; gap: 18px; align-items: center; }
.training-guidance strong { font-size: 13px; color: #25332e; }
.training-guidance p { margin: 4px 0 0; color: #66716d; font-size: 12px; line-height: 1.5; }
.training-guidance a, .training-record-copy a { color: #176f64; font-size: 12px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.training-form-actions { display: flex; justify-content: flex-end; margin-top: 18px; }
.training-section-toolbar { padding: 16px 22px; border-bottom: 1px solid #e7eae8; display: flex; justify-content: space-between; align-items: center; gap: 14px; color: #737c78; font-size: 12px; }
.training-record-list { padding: 0 22px 10px; }
.training-record-card { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto auto; gap: 14px; align-items: center; padding: 17px 0; border-bottom: 1px solid #edf0ee; }
.training-record-card:last-child { border-bottom: 0; }
.training-record-date { width: 44px; height: 48px; border-radius: 9px; background: #f0f4f2; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.training-record-date strong { font-size: 16px; line-height: 1; color: #26322e; }
.training-record-date span { font-size: 10px; margin-top: 3px; text-transform: uppercase; color: #737c78; }
.training-record-copy { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.training-record-copy strong { color: #242d2a; font-size: 13px; font-weight: 600; }
.training-record-copy span, .training-record-copy small { color: #747d79; font-size: 12px; font-weight: 400; }
.training-points { border-radius: 999px; background: #e8f4ef; color: #1c675d; padding: 6px 10px; font-size: 11px; font-weight: 600; white-space: nowrap; }
.training-record-actions { display: flex; gap: 4px; }
.training-record-actions .icon-button { width: 32px; height: 32px; display: grid; place-items: center; cursor: pointer; }
.training-record-actions .icon-button svg { width: 16px; height: 16px; }
.training-licence-icon { width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; background: #edf5f1; color: #287367; font-weight: 700; }
.training-empty { min-height: 120px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; color: #717a76; text-align: center; }
.training-empty strong { color: #414a46; font-size: 13px; }.training-empty span { font-size: 12px; }
.training-agency-panel { border: 1px solid #e0e4e2; border-radius: 12px; background: #fff; overflow: hidden; position: sticky; top: 20px; }
.training-agency-heading { padding: 19px 18px; border-bottom: 1px solid #e7eae8; display: flex; flex-direction: column; gap: 4px; }
.training-agency-heading span { color: #707a75; font-size: 12px; }.training-agency-heading strong { color: #222c28; font-size: 15px; }
.training-agency-list { max-height: 620px; overflow: auto; }
.training-agency-user { display: grid; grid-template-columns: 32px minmax(0,1fr); align-items: center; border-bottom: 1px solid #edf0ee; }.training-agency-user > input { margin: 0 0 0 16px; width: 15px; height: 15px; accent-color: #1f756a; }
.training-agency-list button { width: 100%; border: 0; background: #fff; padding: 14px 16px 14px 8px; display: flex; justify-content: space-between; align-items: center; gap: 10px; text-align: left; font: inherit; cursor: pointer; }
.training-agency-list button:hover { background: #f8faf9; }.training-agency-list button > span:first-child { display: flex; flex-direction: column; gap: 3px; min-width: 0; }.training-agency-list strong { font-size: 12px; color: #2e3834; }.training-agency-list small { font-size: 10px; color: #78817d; }
.training-agency-actions { padding: 14px 16px; border-top: 1px solid #e7eae8; }.training-agency-actions .button { width: 100%; }
.training-editor-modal .modal-card { width: min(680px, calc(100vw - 32px)); }.training-editor-modal .modal-head > div > span { color: #6f7874; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }.training-editor-modal .modal-head h2 { margin: 3px 0 0; }
@media (max-width: 1050px) { .training-layout { grid-template-columns: 1fr; }.training-agency-panel { position: static; }.training-summary { grid-template-columns: 1fr 1fr; }.training-progress-card { grid-column: 1 / -1; } }
@media (max-width: 700px) { .training-summary, .training-form-grid { grid-template-columns: 1fr; }.training-form-grid .span-2 { grid-column: auto; }.training-record-card { grid-template-columns: 44px minmax(0,1fr) auto; }.training-record-actions { grid-column: 2 / -1; justify-content: flex-end; }.training-summary > article { min-height: 96px; }.training-guidance { align-items: flex-start; flex-direction: column; }.training-head-actions { width: 100%; }.training-head-actions select { flex: 1 1 100%; } }

/* Admin Development workspace */
.development-content { min-width: 0; padding: var(--table-page-padding); font-family: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-weight: 400; }
.development-content[hidden] { display: none !important; }
.development-workspace { width: 100%; min-width: 0; }
.development-pane { padding-top: 24px; }
.development-pane[hidden] { display: none !important; }
.development-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.development-head h2 { margin: 0; color: #202b26; font-size: 23px; font-weight: 650; letter-spacing: -.02em; }
.development-head p { margin: 6px 0 0; color: #6d7973; font-size: 13px; font-weight: 400; }
.development-message { min-height: 0; margin-bottom: 12px; color: #677170; font-size: 12px; font-weight: 400; }
.development-message:empty { display: none; }
.development-message.error { color: #a23c38; }
.roadmap-board { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; align-items: start; }
.roadmap-column { min-width: 0; min-height: 320px; padding: 14px; border: 1px solid #dfe5e3; border-radius: 14px; background: #f6f8f7; }
.roadmap-column > header { display: flex; align-items: center; justify-content: space-between; padding: 2px 2px 12px; }
.roadmap-column > header h3 { margin: 0; color: #24302e; font-size: 15px; font-weight: 650; }
.roadmap-column > header span { display: grid; place-items: center; min-width: 26px; height: 24px; padding: 0 8px; border-radius: 999px; background: #e5ebe9; color: #53605e; font-size: 12px; font-weight: 700; }
.roadmap-column-items { display: grid; align-content: start; grid-auto-rows: max-content; gap: 10px; min-height: 250px; }
.roadmap-card { padding: 15px; border: 1px solid #d9dfdd; border-radius: 11px; background: #fff; box-shadow: 0 2px 8px rgba(30, 49, 45, .04); cursor: grab; }
.roadmap-card:active { cursor: grabbing; }
.roadmap-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.roadmap-card h3, .idea-card h3 { margin: 0; color: #192321; font-size: 15px; font-weight: 650; }
.roadmap-card p, .idea-card p { margin: 8px 0 0; color: #5c6866; font-size: 13px; font-weight: 400; line-height: 1.55; white-space: pre-wrap; }
.roadmap-card .button { flex: 0 0 auto; }
.roadmap-date { display: inline-flex; margin-top: 13px; padding: 5px 8px; border-radius: 7px; background: #edf3f1; color: #435552; font-size: 11px; font-weight: 650; }
.development-card-meta { display: grid; gap: 4px; margin-top: 13px; padding-top: 11px; border-top: 1px solid #e7ebe9; color: #6a7572; font-size: 11px; line-height: 1.4; }
.development-card-meta strong { color: #34403d; font-weight: 650; }
.development-notes-preview { display: grid; gap: 4px; margin-top: 12px; padding: 10px; border-radius: 8px; background: #f4f6f5; color: #5c6866; font-size: 12px; line-height: 1.45; }
.development-notes-preview strong { color: #2d3936; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.development-notes-preview span { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 4; white-space: pre-wrap; }
.development-kanban .roadmap-column { min-height: 360px; }

/* Development Kanban lane colours */
.roadmap-column[data-development-column] > header { margin: -6px -6px 12px; padding: 10px 10px; border-radius: 9px; }
.roadmap-column[data-development-type="roadmap"][data-development-column="done"],
.roadmap-column[data-development-type="idea"][data-development-column="internal"] { border-color: #b9d9c2; background: #f1f8f3; }
.roadmap-column[data-development-type="roadmap"][data-development-column="done"] > header,
.roadmap-column[data-development-type="idea"][data-development-column="internal"] > header { background: #2f7a48; }
.roadmap-column[data-development-type="roadmap"][data-development-column="done"] > header h3,
.roadmap-column[data-development-type="idea"][data-development-column="internal"] > header h3 { color: #fff; }
.roadmap-column[data-development-type="roadmap"][data-development-column="done"] > header span,
.roadmap-column[data-development-type="idea"][data-development-column="internal"] > header span { background: rgba(255,255,255,.2); color: #fff; }

.roadmap-column[data-development-type="roadmap"][data-development-column="working_on"],
.roadmap-column[data-development-type="issue"][data-development-column="assigned"] { border-color: #e5cf7d; background: #fff9e5; }
.roadmap-column[data-development-type="roadmap"][data-development-column="working_on"] > header,
.roadmap-column[data-development-type="issue"][data-development-column="assigned"] > header { background: #d5a900; }
.roadmap-column[data-development-type="roadmap"][data-development-column="working_on"] > header h3,
.roadmap-column[data-development-type="issue"][data-development-column="assigned"] > header h3 { color: #fff; }
.roadmap-column[data-development-type="roadmap"][data-development-column="working_on"] > header span,
.roadmap-column[data-development-type="issue"][data-development-column="assigned"] > header span { background: rgba(87,65,0,.18); color: #493700; }

.roadmap-column[data-development-type="roadmap"][data-development-column="coming_up"] { border-color: #b9d3ea; background: #f1f7fc; }
.roadmap-column[data-development-type="roadmap"][data-development-column="coming_up"] > header { background: #347db7; }
.roadmap-column[data-development-type="roadmap"][data-development-column="coming_up"] > header h3 { color: #fff; }
.roadmap-column[data-development-type="roadmap"][data-development-column="coming_up"] > header span { background: rgba(255,255,255,.2); color: #fff; }

.roadmap-column[data-development-type="idea"][data-development-column="property_management"] { border-color: #e8bfd2; background: #fdf3f8; }
.roadmap-column[data-development-type="idea"][data-development-column="property_management"] > header { background: #b75984; }
.roadmap-column[data-development-type="idea"][data-development-column="property_management"] > header h3 { color: #fff; }
.roadmap-column[data-development-type="idea"][data-development-column="property_management"] > header span { background: rgba(255,255,255,.2); color: #fff; }

.roadmap-column[data-development-type="idea"][data-development-column="sales"] { border-color: #e9c398; background: #fff6ec; }
.roadmap-column[data-development-type="idea"][data-development-column="sales"] > header { background: #c66b21; }
.roadmap-column[data-development-type="idea"][data-development-column="sales"] > header h3 { color: #fff; }
.roadmap-column[data-development-type="idea"][data-development-column="sales"] > header span { background: rgba(255,255,255,.2); color: #fff; }

.roadmap-column[data-development-type="issue"][data-development-column="unassigned"] { border-color: #e2b4b4; background: #fdf2f2; }
.roadmap-column[data-development-type="issue"][data-development-column="unassigned"] > header { background: #b84343; }
.roadmap-column[data-development-type="issue"][data-development-column="unassigned"] > header h3 { color: #fff; }
.roadmap-column[data-development-type="issue"][data-development-column="unassigned"] > header span { background: rgba(255,255,255,.2); color: #fff; }

.roadmap-column[data-development-type="issue"][data-development-column="closed"] { border-color: #303634; background: #eef0ef; }
.roadmap-column[data-development-type="issue"][data-development-column="closed"] > header { background: #202523; }
.roadmap-column[data-development-type="issue"][data-development-column="closed"] > header h3 { color: #fff; }
.roadmap-column[data-development-type="issue"][data-development-column="closed"] > header span { background: #4b5350; color: #fff; }
.roadmap-empty { display: grid; place-items: center; min-height: 90px; border: 1px dashed #cad3d0; border-radius: 10px; color: #8a9592; font-size: 12px; font-weight: 400; }
.ideas-list { display: grid; gap: 12px; }
.idea-card { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; padding: 18px 20px; border: 1px solid #dfe5e3; border-radius: 12px; background: #fff; }
.idea-card-copy { min-width: 0; }
.development-attachments { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 13px; }
.development-attachment { display: inline-flex; align-items: center; gap: 4px; padding: 5px 7px 5px 9px; border-radius: 7px; background: #eef3f1; font-size: 12px; font-weight: 400; }
.development-attachment a { color: #315b55; text-decoration: none; }
.development-attachment button { border: 0; background: transparent; color: #7c8986; cursor: pointer; font-size: 17px; line-height: 1; }
.development-page-url { display: inline-block; max-width: 100%; margin-top: 7px; overflow: hidden; color: #315b55; font-size: 12px; font-weight: 400; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
.development-page-url:hover { text-decoration: underline; }
.development-empty { display: grid; justify-items: center; gap: 5px; padding: 70px 24px; border: 1px dashed #d6dddb; border-radius: 12px; color: #7a8683; font-size: 12px; font-weight: 400; }
.development-empty strong { color: #24302e; font-size: 15px; font-weight: 650; }
.development-editor-modal { width: min(680px, calc(100vw - 32px)); }
.development-editor-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.development-editor-wide { grid-column: 1 / -1; }
.development-editor-fields textarea { resize: vertical; min-height: 130px; }
.development-editor-fields small { color: #77827d; font-size: 11px; font-weight: 400; line-height: 1.45; }
.development-existing-attachments > strong { display: block; margin-bottom: 7px; color: #37433f; font-size: 13px; }
.modal-foot-spacer { flex: 1; }

@media (max-width: 900px) {
    .roadmap-board { grid-template-columns: 1fr; }
    .roadmap-column { min-height: 180px; }
    .roadmap-column-items { min-height: 110px; }
}

@media (max-width: 600px) {
    .development-head { align-items: stretch; flex-direction: column; }
    .development-head .button { width: 100%; }
    .idea-card { flex-direction: column; }
    .idea-card > .button { width: 100%; }
    .development-editor-modal { width: calc(100vw - 12px); max-height: calc(100dvh - 12px); }
    .development-editor-fields { grid-template-columns: 1fr; }
    .development-editor-wide { grid-column: auto; }
    .development-editor-modal :is(.modal-head, .modal-body, .modal-foot) { padding-right: 14px !important; padding-left: 14px !important; }
    .development-editor-modal .modal-foot { flex-wrap: wrap; }
    .development-editor-modal .modal-foot .button { min-height: 44px; }
}

/* External portals: shared transparency and collaboration summary. */

button.is-saving::after,
.button.is-saving::after {
    content: "";
    display: inline-block;
    width: 0.75em;
    height: 0.75em;
    margin-left: 0.5em;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    vertical-align: -0.08em;
    animation: delegate-button-saving-spin 0.65s linear infinite;
}

@keyframes delegate-button-saving-spin {
    to {
        transform: rotate(360deg);
    }
}

/* Shared linked-record title treatment: clear, near-black and slightly heavier. */
.property-related-copy > strong,
.tenant-request-mini-card > strong,
.property-linked-record-identity > strong,
.property-tenancy-card-identity > strong,
.owner-portal-property-title > strong,
.linked-record-card:not(.missing),
a.readonly-property-value:not(.readonly-property-empty),
.record-inline-link {
    color: #111714 !important;
    font-weight: 600 !important;
}

.record-inline-link:hover {
    color: #111714 !important;
}

/* One consistent underline tab language across Delegate workspaces. Metric cards remain cards. */
.app-shell :is(
    .record-tabs:not(.metric-tabs),
    .side-tabs,
    .tenancy-hub-tabs,
    .property-workspace-tabs,
    .marketing-product-tabs,
    .segmented-control,
    .tenant-portal-tabbar,
    .agency-settings-tabs,
    .user-record-side-tabs
) {
    display: flex;
    align-items: stretch;
    width: auto;
    min-width: 0;
    max-width: none;
    min-height: 44px;
    gap: 18px;
    margin: 0;
    padding: 0;
    overflow-x: auto;
    overflow-y: hidden;
    border: 0;
    border-bottom: 1px solid #e1e6e3;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    scrollbar-width: none;
}

.app-shell .record-panel-head :is(.side-tabs, .user-record-side-tabs) {
    min-height: 100%;
    border-bottom: 0;
    flex: 0 1 auto;
}

.app-shell :is(
    .record-tabs:not(.metric-tabs) .record-tab,
    .side-tab,
    .tenancy-hub-tab,
    .property-workspace-tab,
    .marketing-product-tab,
    .segment,
    .tenant-portal-tab,
    .agency-settings-tab,
    .user-record-side-tabs button
) {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: auto;
    min-width: max-content;
    min-height: 44px;
    height: auto;
    padding: 0 2px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #717a76;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 1;
    box-shadow: none;
    white-space: nowrap;
}

.app-shell :is(
    .record-tabs:not(.metric-tabs) .record-tab,
    .side-tab,
    .tenancy-hub-tab,
    .property-workspace-tab,
    .marketing-product-tab,
    .segment,
    .tenant-portal-tab,
    .agency-settings-tab,
    .user-record-side-tabs button
):hover {
    border: 0;
    background: transparent;
    color: #202623;
    box-shadow: none;
}

.app-shell :is(
    .record-tabs:not(.metric-tabs) .record-tab.active,
    .side-tab.active,
    .side-tab[aria-selected="true"],
    .tenancy-hub-tab.active,
    .property-workspace-tab.active,
    .marketing-product-tab.active,
    .segment.active,
    .segment[aria-selected="true"],
    .tenant-portal-tab.active,
    .tenant-portal-tab[aria-selected="true"],
    .agency-settings-tab.is-active,
    .user-record-side-tabs button.active
) {
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #202623;
    font-weight: 600 !important;
    box-shadow: none;
}

.app-shell :is(
    .record-tabs:not(.metric-tabs) .record-tab.active,
    .side-tab.active,
    .side-tab[aria-selected="true"],
    .tenancy-hub-tab.active,
    .property-workspace-tab.active,
    .marketing-product-tab.active,
    .segment.active,
    .segment[aria-selected="true"],
    .tenant-portal-tab.active,
    .tenant-portal-tab[aria-selected="true"],
    .agency-settings-tab.is-active,
    .user-record-side-tabs button.active
)::after {
    content: '';
    position: absolute;
    right: 0;
    bottom: -1px;
    left: 0;
    width: auto;
    height: 2px;
    border-radius: 2px 2px 0 0;
    background: #315f58;
    opacity: 1;
}

@media (max-width: 720px) {
    .app-shell :is(.record-tabs:not(.metric-tabs), .side-tabs, .tenancy-hub-tabs, .property-workspace-tabs, .marketing-product-tabs, .segmented-control, .tenant-portal-tabbar, .agency-settings-tabs) {
        gap: 14px;
    }
}

/* Record-state filters use a dedicated coloured segmented-toggle treatment. */
.app-shell .segmented.status-view-filter {
    display: inline-grid;
    grid-template-columns: repeat(2, minmax(82px, 1fr));
    align-items: center;
    height: 32px;
    min-height: 32px;
    box-sizing: border-box;
    gap: 2px;
    padding: 2px;
    border: 1px solid #cbd4cf;
    border-radius: 10px;
    background: #e9eeeb;
    overflow: hidden;
    box-shadow: none;
    flex: 0 0 auto;
}

.app-shell .segmented.status-view-filter .segment {
    display: flex;
    align-items: center;
    justify-content: center;
    width: auto;
    min-width: 82px;
    min-height: 26px;
    height: 26px;
    box-sizing: border-box;
    padding: 0 14px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: #53615b;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    box-shadow: none;
}

.app-shell .segmented.status-view-filter .segment::after {
    content: none !important;
}

.app-shell .segmented.status-view-filter .segment:hover {
    border: 0;
    border-radius: 7px;
    background: rgba(255, 255, 255, .88);
    color: #1f2c26;
    box-shadow: none;
}

.app-shell .segmented.status-view-filter .segment:is([data-status="open"], [data-agency-status="open"]).active {
    border: 0;
    border-radius: 7px;
    background: #079b24;
    color: #ffffff;
    font-weight: 700 !important;
    box-shadow: 0 2px 5px rgba(7, 117, 31, .24);
}

.app-shell .segmented.status-view-filter .segment:is([data-status="closed"], [data-agency-status="closed"]).active {
    border: 0;
    border-radius: 7px;
    background: #3f4945;
    color: #ffffff;
    font-weight: 700 !important;
    box-shadow: 0 2px 5px rgba(35, 44, 40, .22);
}

/* Compliance reverses the generic open/closed meaning: open needs attention; closed is compliant. */
.app-shell .segmented.status-view-filter.compliance-status-toggle .segment[data-status="open"].active {
    background: #d93d42;
    color: #ffffff;
    box-shadow: 0 2px 5px rgba(177, 38, 44, .24);
}

.app-shell .segmented.status-view-filter.compliance-status-toggle .segment[data-status="closed"].active {
    background: #079b24;
    color: #ffffff;
    box-shadow: 0 2px 5px rgba(7, 117, 31, .24);
}

/* Tabs are the panel title: middle-column tabs inset left, right-column tabs align right. */
.app-shell .record-grid > .record-panel > .record-panel-head:has(.side-tabs) > h3 {
    display: none;
}

.app-shell .record-grid > .record-panel:nth-child(2) > .record-panel-head:has(.side-tabs) {
    justify-content: flex-start;
}

.app-shell .record-grid > .record-panel:nth-child(2) > .record-panel-head > .side-tabs,
.app-shell .record-grid > .record-panel:nth-child(2) > .record-panel-head .agency-middle-tabs {
    margin-right: auto;
    margin-left: 0;
    padding-left: 0;
}

.app-shell .agency-middle-panel-head .agency-billing-actions {
    width: 100%;
}

.app-shell .agency-middle-panel-head .agency-middle-tabs {
    order: -1;
}

.app-shell .record-grid > .record-panel:nth-child(3) > .record-panel-head:has(:is(.side-tabs, .user-record-side-tabs)) {
    justify-content: flex-start;
    padding-left: 12px;
}

.app-shell .record-grid > .record-panel:nth-child(3) > .record-panel-head > :is(.side-tabs, .user-record-side-tabs) {
    margin-right: auto;
    margin-left: 0;
    padding-left: 0;
}

.app-shell .record-content #propertyWorkspaceTabs {
    padding-left: 12px !important;
}

.app-shell :is(
    .record-tabs:not(.metric-tabs) .record-tab.active,
    .side-tab.active,
    .side-tab[aria-selected="true"],
    .tenancy-hub-tab.active,
    .property-workspace-tab.active,
    .marketing-product-tab.active,
    .segment.active,
    .segment[aria-selected="true"],
    .tenant-portal-tab.active,
    .tenant-portal-tab[aria-selected="true"],
    .agency-settings-tab.is-active,
    .user-record-side-tabs button.active
)::after {
    height: 3px !important;
}

/* Properties workspace: selection is communicated by colour and underline only. */
.app-shell .record-content #propertyWorkspaceTabs .property-workspace-tab,
.app-shell .record-content #propertyWorkspaceTabs .property-workspace-tab.active,
.app-shell .record-content #propertyWorkspaceTabs .property-workspace-tab > span:first-child,
.app-shell .record-content #propertyWorkspaceTabs .property-workspace-tab.active > span:first-child {
    font-weight: 500 !important;
}

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

.property-field-heading > label {
    margin: 0;
}

.property-view-map {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #315f58;
    font: inherit;
    font-size: 11px !important;
    font-weight: 500 !important;
    cursor: pointer;
}

.property-view-map svg {
    width: 14px;
    height: 14px;
}

.property-view-map:hover {
    color: #173f3f;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.property-view-map:disabled {
    color: #9aa39f;
    cursor: default;
    text-decoration: none;
}

.property-map-modal {
    width: min(780px, calc(100vw - 32px));
}

.property-map-modal .modal-head p {
    margin: 3px 0 0;
    color: var(--muted);
    font-size: 11px;
}

.property-map-modal .modal-body {
    display: grid;
    gap: 14px;
}

.property-map-modal .property-map-modal-canvas {
    height: min(480px, 58vh);
    min-height: 340px;
    border-radius: 10px;
}

.property-map-modal-empty {
    position: static;
    min-height: 260px;
}

.property-map-modal-address {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    color: #36463f;
    font-size: 12px;
    line-height: 1.45;
}

.property-map-modal-address svg {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    color: #315f58;
}

@media (max-width: 720px) {
    .property-map-modal .property-map-modal-canvas {
        height: 52vh;
        min-height: 280px;
    }
}
/* Knowledge Hub */
.knowledge-hub-workspace{padding:24px 28px 48px;overflow:auto;background:#fff}
.knowledge-hub-header{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;padding:2px 0 20px;border-bottom:1px solid #e4e9e6}.knowledge-hub-header h2{margin:0 0 5px;color:#202b26;font-size:23px;font-weight:650;letter-spacing:-.02em}.knowledge-hub-header p{margin:0;color:#6d7973;font-size:13px}.knowledge-hub-header .button{flex:0 0 auto}
.knowledge-hub-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:30px 32px;border-radius:18px;background:linear-gradient(135deg,#143f35,#1e5a49);color:#fff;box-shadow:0 14px 34px rgba(18,57,47,.14)}
.knowledge-hub-hero h2{margin:5px 0 8px;font-size:32px;letter-spacing:-.03em}.knowledge-hub-hero p{margin:0;color:rgba(255,255,255,.75);font-size:15px}
.knowledge-hub-eyebrow{display:block;color:#60d278;font-size:11px;font-weight:750;letter-spacing:.11em;text-transform:uppercase}
.knowledge-hub-toolbar{display:flex;align-items:center;gap:16px;margin:24px 0 20px}.knowledge-hub-toolbar .search{width:min(360px,100%)}
.knowledge-hub-categories{display:flex;gap:7px;overflow:auto;padding:3px}.knowledge-hub-categories button{white-space:nowrap;border:1px solid #d9e0dc;background:#fff;color:#45554e;border-radius:999px;padding:8px 13px;font:inherit;font-size:12px;cursor:pointer}.knowledge-hub-categories button.active{background:#193f35;color:#fff;border-color:#193f35}
.knowledge-hub-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(295px,1fr));gap:18px}.knowledge-card{overflow:hidden;border:1px solid #dfe5e1;border-radius:15px;background:#fff;box-shadow:0 3px 12px rgba(26,47,39,.05);transition:transform .18s,box-shadow .18s}.knowledge-card:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(26,47,39,.1)}
.knowledge-card-thumb{position:relative;display:block;width:100%;aspect-ratio:16/9;border:0;padding:0;background:#e9efeb;overflow:hidden;cursor:pointer}.knowledge-card-thumb img{width:100%;height:100%;object-fit:cover}.knowledge-card-play{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.94);color:#17473a;box-shadow:0 5px 18px rgba(0,0,0,.2)}.knowledge-card-play svg{width:20px;height:20px;margin-left:3px}
.knowledge-card-body{padding:17px 18px 18px}.knowledge-card-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px}.knowledge-card-category{color:#347c58;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}.knowledge-card-status{font-size:10px;padding:3px 7px;border-radius:999px;background:#fff4d8;color:#855d00}.knowledge-card h3{margin:0 0 8px;font-size:17px;line-height:1.3;color:#1f2c27}.knowledge-card p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin:0;color:#68756f;font-size:13px;line-height:1.55}.knowledge-card-actions{display:flex;align-items:center;gap:8px;margin-top:15px}.knowledge-card-actions .button{min-height:34px;padding:7px 11px}
.modal-overlay{position:fixed;inset:0;z-index:5000;background:rgba(30,39,36,.28);backdrop-filter:blur(2px)}.modal-overlay:not([hidden])>.modal{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1)}
.knowledge-hub-empty{position:static;min-height:260px}.knowledge-hub-modal{width:min(820px,calc(100vw - 32px));max-height:calc(100vh - 34px);overflow:auto}.knowledge-hub-form-grid{grid-template-columns:1fr 1fr}.knowledge-hub-form-grid textarea{resize:vertical}.knowledge-audience-fieldset{margin:22px 0 0;padding:0;border:0}.knowledge-audience-fieldset legend{font-size:14px;font-weight:700;color:#22332c}.knowledge-audience-fieldset>p{margin:4px 0 12px;color:#718078;font-size:12px}.knowledge-audience-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.knowledge-audience-grid label{display:flex;align-items:flex-start;gap:9px;padding:12px;border:1px solid #dfe5e1;border-radius:10px;cursor:pointer;background:#fff}.knowledge-audience-grid label:has(input:checked){border-color:#5acb72;background:#f2fbf4}.knowledge-audience-grid input{margin-top:2px;accent-color:#2a9d55}.knowledge-audience-grid span{display:flex;flex-direction:column;gap:2px}.knowledge-audience-grid strong{font-size:12px}.knowledge-audience-grid small{font-size:10px;color:#79857f}.knowledge-agency-target{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px;padding:14px;border-radius:10px;background:#f4f7f5}.knowledge-status-field{width:150px}.modal-action-spacer{flex:1}
.knowledge-hub-modal{display:flex;flex-direction:column;width:min(780px,calc(100vw - 32px));max-height:min(860px,calc(100vh - 34px));overflow:hidden;border-radius:14px;background:#fff;box-shadow:0 24px 70px rgba(25,42,35,.22)}
.knowledge-hub-modal>.modal-head{flex:0 0 auto;padding:21px 24px 18px;border-bottom:1px solid #e4e9e6;background:#fff}.knowledge-hub-modal>.modal-head>div{display:grid;gap:3px}.knowledge-hub-modal>.modal-head h2{margin:0;color:#202b26;font-size:20px;font-weight:650;letter-spacing:-.02em}.knowledge-hub-modal>.modal-head p{margin:2px 0 0;color:#748078;font-size:12px;line-height:1.4}.knowledge-hub-modal>.modal-head .icon-button{align-self:flex-start}
.knowledge-hub-modal form{display:flex;min-height:0;flex:1 1 auto;flex-direction:column;overflow:hidden}.knowledge-hub-modal-body{min-height:0;padding:22px 24px 24px;overflow:auto;overscroll-behavior:contain}.knowledge-hub-form-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px 18px}.knowledge-hub-form-grid .field,.knowledge-agency-target .field{display:grid;gap:7px;min-width:0}.knowledge-hub-form-grid .field.full{grid-column:1/-1}.knowledge-hub-form-grid .field>span,.knowledge-agency-target .field>span{color:#4d5953;font-size:11px;font-weight:600}.knowledge-hub-form-grid input,.knowledge-hub-form-grid select,.knowledge-hub-form-grid textarea,.knowledge-agency-target select{width:100%}.knowledge-hub-form-grid textarea{resize:vertical;line-height:1.5}.knowledge-hub-form-grid .field>small{margin-top:-1px;color:#79857f;font-size:10px;line-height:1.4}
.knowledge-audience-fieldset{margin:24px 0 0;padding-top:20px;border-top:1px solid #edf0ee}.knowledge-audience-fieldset legend{padding:0;font-size:13px;font-weight:650;color:#26352f}.knowledge-audience-fieldset>p{margin:5px 0 13px;color:#718078;font-size:11px}.knowledge-audience-grid{gap:10px}.knowledge-audience-grid label{min-height:64px;padding:12px 13px;border-radius:9px;transition:border-color .15s,background .15s,box-shadow .15s}.knowledge-audience-grid label:has(input:checked){border-color:#83c995;background:#f2faf4;box-shadow:0 0 0 1px rgba(74,170,96,.08)}.knowledge-audience-grid strong{color:#2d3934;font-size:11.5px}.knowledge-audience-grid small{font-size:10px;line-height:1.35}
.knowledge-agency-target{margin-top:14px;padding:15px;border:1px solid #e2e8e4;border-radius:9px;background:#f7f9f8}.knowledge-hub-modal-message{margin:14px 0 0}.knowledge-hub-modal-message:empty{display:none}.knowledge-hub-modal-actions{display:flex;align-items:flex-end;flex:0 0 auto;min-height:76px;margin:0;padding:14px 24px;border-top:1px solid #e4e9e6;background:#fbfcfb;gap:10px}.knowledge-hub-modal-actions .knowledge-status-field{display:grid;width:150px;gap:6px}.knowledge-hub-modal-actions .knowledge-status-field>span{color:#4d5953;font-size:11px;font-weight:600}.knowledge-hub-modal-actions .knowledge-status-field select{width:100%}.knowledge-hub-modal-actions .button{min-height:38px}.knowledge-hub-modal-actions .danger{margin-left:2px}
.knowledge-viewer-modal{width:min(900px,calc(100vw - 32px));max-height:calc(100vh - 32px);overflow:auto}.knowledge-viewer-video{position:relative;width:100%;aspect-ratio:16/9;background:#101713;border-radius:12px;overflow:hidden}.knowledge-viewer-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.knowledge-viewer-summary{white-space:pre-line;color:#53635c;font-size:14px;line-height:1.65;margin:18px 2px 4px}
.knowledge-record{width:min(980px,100%);margin:0 auto}.knowledge-record-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}.knowledge-record-toolbar a.button,.knowledge-record-summary a.button{text-decoration:none}.knowledge-record-header{margin-bottom:18px}.knowledge-record-header h2{margin:7px 0 8px;color:#1f2c27;font-size:26px;line-height:1.25;letter-spacing:-.025em}.knowledge-record-header p{margin:0;color:#748079;font-size:11px}.knowledge-record-video{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:12px;background:#101713;box-shadow:0 8px 26px rgba(20,40,33,.12)}.knowledge-record-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.knowledge-record-summary{margin-top:18px;padding:20px 22px;border:1px solid #dfe5e1;border-radius:12px;background:#fff}.knowledge-record-summary h3{margin:0 0 9px;color:#24332d;font-size:15px}.knowledge-record-summary p{margin:0 0 16px;white-space:pre-line;color:#596861;font-size:13px;line-height:1.65}
@media(max-width:760px){.knowledge-hub-workspace{padding:18px 14px 36px}.knowledge-hub-header{align-items:flex-start;flex-direction:column}.knowledge-hub-toolbar{align-items:stretch;flex-direction:column}.knowledge-audience-grid{grid-template-columns:1fr 1fr}.knowledge-agency-target,.knowledge-hub-form-grid{grid-template-columns:1fr}.knowledge-hub-modal,.knowledge-viewer-modal{width:calc(100vw - 18px)}.knowledge-record-header h2{font-size:22px}.knowledge-record-summary{padding:17px}}
@media(max-width:480px){.knowledge-audience-grid{grid-template-columns:1fr}.knowledge-hub-grid{grid-template-columns:1fr}}
@media(max-width:760px){.knowledge-hub-modal>.modal-head{padding:18px 18px 16px}.knowledge-hub-modal-body{padding:18px}.knowledge-hub-form-grid{grid-template-columns:1fr}.knowledge-hub-modal-actions{min-height:auto;padding:13px 18px;flex-wrap:wrap}.knowledge-hub-modal-actions .knowledge-status-field{width:100%}.knowledge-hub-modal-actions .modal-action-spacer{display:none}.knowledge-hub-modal-actions .button{flex:1 1 auto}.knowledge-hub-modal-actions .danger{order:2;width:100%}}
.nav-button.nav-subitem{padding-left:31px;font-size:12.5px}.nav-button.nav-subitem .nav-icon{width:16px;height:16px}
.body-corporate-create-modal{display:flex;flex-direction:column;width:min(620px,calc(100vw - 28px));max-height:calc(100vh - 34px);overflow:hidden;border-radius:14px;background:#fff;box-shadow:0 24px 70px rgba(25,42,35,.22)}.body-corporate-create-modal>.modal-head{flex:0 0 auto;padding:21px 24px 18px;border-bottom:1px solid #e4e9e6;background:#fff}.body-corporate-create-modal>.modal-head>div{display:grid;gap:3px}.body-corporate-create-modal>.modal-head h2{margin:0;color:#202b26;font-size:20px;font-weight:650;letter-spacing:-.02em}.body-corporate-create-modal>.modal-head p{margin:2px 0 0;color:#748078;font-size:12px;line-height:1.4}.body-corporate-create-modal>.modal-head .icon-button{align-self:flex-start}.body-corporate-create-modal form{display:flex;min-height:0;flex:1 1 auto;flex-direction:column;overflow:hidden}.body-corporate-create-body{padding:22px 24px 24px;overflow:auto}.body-corporate-create-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px 18px}.body-corporate-create-grid .field{display:grid;gap:7px;min-width:0}.body-corporate-create-grid .field.full{grid-column:1/-1}.body-corporate-create-grid input,.body-corporate-create-grid select{width:100%}.body-corporate-create-body>.message{margin-top:14px}.body-corporate-create-body>.message:empty{display:none}.body-corporate-create-actions{display:flex;align-items:center;flex:0 0 auto;min-height:68px;margin:0;padding:14px 24px;border-top:1px solid #e4e9e6;background:#fbfcfb;gap:10px}.body-corporate-create-actions .button{min-height:38px}.body-corporate-panel,.body-message-composer,.body-message-history{padding:18px}.body-property-search{width:100%;margin:16px 0 10px}.body-property-picker{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-height:440px;overflow:auto}.body-property-picker label{display:flex;gap:10px;align-items:flex-start;padding:12px;border:1px solid #dfe6e2;border-radius:10px;background:#fff;cursor:pointer}.body-property-picker label:has(input:checked){border-color:#58c976;background:#f2fbf4}.body-property-picker input{margin-top:3px;accent-color:#2e9b53}.body-property-picker span{display:flex;min-width:0;flex-direction:column;gap:3px}.body-property-picker strong{font-size:12px}.body-property-picker small{font-size:10px;color:#76837d}.body-corporate-messages{display:grid;gap:16px}.body-message-composer,.body-message-history{border:1px solid #e0e6e2;border-radius:13px;background:#fff}.body-message-composer>.field{display:flex;flex-direction:column;gap:6px;margin-top:13px}.body-message-composer input,.body-message-composer textarea{width:100%}.body-message-actions{display:flex;align-items:center;gap:12px;margin-top:16px}.body-message-history-card{padding:15px 0;border-top:1px solid #edf1ee}.body-message-history-card:first-of-type{border-top:0}.body-message-history-card>div{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.body-message-history-card>div span{color:#77847e;font-size:11px}.body-message-history-card p{white-space:pre-line;color:#56655e;font-size:13px;line-height:1.55}.record-static-value{display:flex;flex-direction:column;gap:3px;padding:10px 11px;border:1px solid #e0e5e2;border-radius:8px;background:#f7f9f8}.record-static-value small{color:#78847e;font-size:10px}
@media(max-width:760px){.body-corporate-create-modal>.modal-head{padding:18px 18px 16px}.body-corporate-create-body{padding:18px}.body-corporate-create-grid{grid-template-columns:1fr}.body-corporate-create-actions{padding:13px 18px}.body-corporate-create-actions .button{flex:1 1 auto}.body-property-picker{grid-template-columns:1fr}.body-message-history-card>div{flex-direction:column;gap:4px}}

/* Create Guide and Create Building use the Create Opportunity modal shell. */
#knowledgeHubModal,#bodyCorporateCreateModal{background:rgba(30,39,36,.26);backdrop-filter:none;-webkit-backdrop-filter:none}
.knowledge-hub-modal,.body-corporate-create-modal{display:grid;width:min(520px,calc(100vw - 32px));max-height:calc(100vh - 40px);grid-template-rows:auto minmax(0,1fr);overflow:hidden;border:1px solid var(--delegate-border);border-radius:var(--delegate-radius-lg);background:#fff;box-shadow:var(--delegate-shadow-overlay)}
.knowledge-hub-modal>.modal-head,.body-corporate-create-modal>.modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;border-bottom:1px solid #e4e9e6;background:#fff}
.knowledge-hub-modal>.modal-head h2,.body-corporate-create-modal>.modal-head h2{margin:0;color:#19231e;font-size:17px;font-weight:600;letter-spacing:-.012em}
.knowledge-hub-modal>.modal-head .icon-button,.body-corporate-create-modal>.modal-head .icon-button{align-self:auto}
.knowledge-hub-modal form,.body-corporate-create-modal form{display:grid;min-height:0;grid-template-rows:minmax(0,1fr) auto;overflow:hidden}
.knowledge-hub-modal-body,.body-corporate-create-body{min-height:0;padding:20px;overflow:auto}
.knowledge-hub-form-grid,.body-corporate-create-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.knowledge-audience-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.knowledge-publishing-row{display:flex;margin-top:14px;padding-top:14px;border-top:1px solid #edf0ee}.knowledge-publishing-row .knowledge-status-field{display:grid;width:150px;gap:7px}.knowledge-publishing-row .knowledge-status-field>span{color:#4d5953;font-size:11px;font-weight:600}.knowledge-publishing-row select{width:100%}
.knowledge-hub-modal-actions,.body-corporate-create-actions{display:flex;align-items:center;justify-content:flex-end;min-height:65px;margin:0;padding:16px 20px;border-top:1px solid #e4e9e6;background:#fff;gap:10px}
.knowledge-hub-modal-actions .button,.body-corporate-create-actions .button{min-height:32px}
.knowledge-guide-section+.knowledge-guide-section{margin-top:20px;padding-top:20px;border-top:1px solid #edf0ee}.knowledge-guide-audience-section .knowledge-audience-fieldset{margin:0;padding:0;border:0}.knowledge-guide-audience-section .knowledge-audience-fieldset legend{margin:0;padding:0;color:#4d5953;font-size:11px;font-weight:600;line-height:1.35}.knowledge-guide-audience-section .knowledge-audience-grid{margin-top:7px}.knowledge-hub-form-grid textarea{width:100%;min-width:0;padding:9px 10px;border:1px solid var(--line);border-radius:7px;background:var(--surface);color:var(--ink);outline:none;resize:vertical;line-height:1.5}.knowledge-hub-form-grid textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-ring)}.knowledge-audience-grid label{align-items:center;min-height:44px}.knowledge-audience-grid strong{font-size:11.5px}
.esign-workspace #esignTable{width:100%;min-width:100%}.esign-workspace #esignTable :is(th.select-col,td.select-col){width:36px;min-width:36px;max-width:36px}
@media(max-width:560px){.knowledge-hub-modal-body,.body-corporate-create-body{padding:20px}.knowledge-hub-form-grid,.body-corporate-create-grid,.knowledge-audience-grid{grid-template-columns:1fr}.knowledge-hub-modal-actions,.body-corporate-create-actions{padding:16px 20px}.knowledge-hub-modal-actions .button,.body-corporate-create-actions .button{flex:0 0 auto}.knowledge-hub-modal-actions .danger{width:auto;order:0}}

/* Sales Open Homes, buyer check-in and property offers */
.sales-engagement-workspace{display:grid;gap:18px;margin-top:22px;padding:20px;border:1px solid #dfe5e1;border-radius:12px;background:#fff}.sales-engagement-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.sales-engagement-head h3,.sales-engagement-workspace h4{margin:0;color:#202824}.sales-engagement-head p{margin:5px 0 0;color:#6c7872;font-size:12px}.sales-link-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.sales-link-actions>div{padding:15px;border:1px solid #e1e6e3;border-radius:9px;background:#fafbfa}.sales-link-actions span,.sales-link-actions strong{display:block}.sales-link-actions span{color:#77827c;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.04em}.sales-link-actions strong{margin:4px 0 12px;font-size:13px}.sales-link-actions>div>div{display:flex;flex-wrap:wrap;gap:8px}.sales-open-home-list,.sales-attendee-list,.sales-offer-list{display:grid;gap:10px}.sales-open-home-list>article{display:grid;grid-template-columns:minmax(180px,1fr) minmax(260px,1.4fr) auto;align-items:center;gap:16px;padding:13px 14px;border:1px solid #e2e7e4;border-radius:8px}.sales-open-home-list article>div:first-child{display:grid;gap:3px}.sales-open-home-list article span{color:#718078;font-size:11px}.sales-open-home-counts{display:flex;gap:16px}.sales-open-home-counts span{display:grid;gap:2px}.sales-open-home-counts b{color:#202824;font-size:15px}.sales-engagement-empty{margin:0;padding:22px;border:1px dashed #d9e0dc;border-radius:8px;color:#77827c;text-align:center}.sales-attendee-list table{width:100%;border-collapse:collapse}.sales-attendee-list th,.sales-attendee-list td{padding:10px 9px;border-bottom:1px solid #e7ebe8;text-align:left;font-size:11px}.sales-attendee-list th{color:#65716b;font-weight:600;background:#fafbfa}.sales-offer-list>article{display:grid;grid-template-columns:minmax(180px,1fr) auto minmax(220px,1fr);align-items:center;gap:14px;padding:12px 14px;border:1px solid #e2e7e4;border-radius:8px}.sales-offer-list article>div{display:grid}.sales-offer-list article span{color:#6f7b75;font-size:11px}.sales-offer-list article>b{font-size:15px}.sales-qr-dialog,.sales-open-home-dialog{width:min(460px,calc(100vw - 28px));padding:24px;border:0;border-radius:13px;box-shadow:0 24px 70px rgba(24,39,33,.24)}.sales-qr-dialog::backdrop,.sales-open-home-dialog::backdrop{background:rgba(26,34,30,.4)}.sales-qr-dialog>button,.sales-open-home-dialog form>button{position:absolute;top:14px;right:14px;border:0;background:transparent;font-size:24px;cursor:pointer}.sales-qr-dialog{text-align:center}.sales-qr-dialog h3{margin:8px 0 4px}.sales-qr-dialog p{margin:0;color:#6f7a74}.sales-qr-dialog img{display:block;width:240px;max-width:80%;margin:20px auto;border:1px solid #e1e6e3}.sales-open-home-dialog form{display:grid;gap:14px}.sales-open-home-dialog h3{margin:0 0 5px}.sales-open-home-dialog label{display:grid;gap:6px;color:#46524c;font-size:11px;font-weight:600}.sales-open-home-dialog input,.sales-open-home-dialog textarea{width:100%}.sales-open-home-dialog form>div:last-child{display:flex;justify-content:flex-end;gap:8px}.sales-public-mode{background:#f3f5f4}.sales-public-mode .public-proposal{min-height:100vh;background:#f3f5f4}.sales-public-page{min-height:100vh;padding:34px 18px;font-family:Inter,Arial,sans-serif;color:#202824}.sales-public-card{width:min(620px,100%);margin:0 auto;padding:30px;border:1px solid #dfe4e1;border-radius:14px;background:#fff;box-shadow:0 14px 42px rgba(31,46,39,.08)}.sales-public-brand{display:flex;min-height:54px;align-items:flex-start;margin-bottom:24px}.sales-public-brand img{display:block;max-width:190px;max-height:70px;object-fit:contain;object-position:left top}.sales-public-brand strong{font-size:17px}.sales-public-property{padding-bottom:22px;border-bottom:1px solid #e0e5e2}.sales-public-property h1{margin:0;color:#161d1a;font-size:25px;line-height:1.22;letter-spacing:-.025em}.sales-public-property p{margin:8px 0 0;color:#4d5953}.sales-public-property>div{display:flex;flex-wrap:wrap;gap:8px 14px;margin-top:12px;color:#69756f;font-size:11px}.sales-public-form{display:grid;gap:18px;padding-top:24px}.sales-public-intro h1,.sales-public-intro h2{margin:0 0 7px;color:#161d1a;font-size:20px}.sales-public-intro p{margin:0;color:#66736c;font-size:13px;line-height:1.55}.sales-public-form h3{margin:5px 0 -4px;font-size:13px}.sales-public-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.sales-public-grid .full{grid-column:1/-1}.sales-public-form label{display:grid;gap:6px;color:#3f4a45;font-size:11px;font-weight:600}.sales-public-form input,.sales-public-form textarea{width:100%;min-height:42px;border:1px solid #cfd7d2;border-radius:6px;background:#fff;font:400 13px Inter,Arial,sans-serif}.sales-public-form textarea{padding:11px;resize:vertical}.sales-public-form fieldset{margin:0;padding:0;border:0}.sales-public-form legend{margin-bottom:9px;color:#3f4a45;font-size:11px;font-weight:600}.sales-public-choice{display:grid;grid-template-columns:1fr 1fr}.sales-public-choice label{position:relative}.sales-public-choice input{position:absolute;opacity:0}.sales-public-choice span{display:grid;min-height:48px;place-items:center;padding:8px;border:1px solid #ccd5d0;background:#fff;font-size:12px}.sales-public-choice label:first-child span{border-radius:7px 0 0 7px}.sales-public-choice label:last-child span{border-left:0;border-radius:0 7px 7px 0}.sales-public-choice input:checked+span{border-color:var(--sales-public-primary);background:#edf4f1;color:var(--sales-public-primary)}.sales-public-consent,.sales-public-conditions label{display:flex!important;grid-template-columns:none!important;align-items:flex-start;gap:9px!important;font-weight:400!important;line-height:1.45}.sales-public-consent input,.sales-public-conditions input{width:16px;min-height:16px;margin-top:1px;accent-color:var(--sales-public-primary)}.sales-public-conditions{display:grid;gap:10px}.sales-public-form>.button{width:100%;min-height:44px;background:var(--sales-public-primary);border-color:var(--sales-public-primary)}.sales-public-success{padding:12px 0 4px}.sales-public-success h2{margin:0 0 8px}.sales-public-card footer{margin-top:26px;padding-top:16px;border-top:1px solid #edf0ee;color:#7a857f;font-size:10px;text-align:left}.sales-public-card footer a{color:inherit}.sales-public-form .currency-input-shell>span{top:50%;transform:translateY(-50%)}
.sales-performance-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid #e1e6e3;border-radius:9px;overflow:hidden}.sales-performance-grid>div{display:grid;gap:4px;padding:14px;border-right:1px solid #e1e6e3}.sales-performance-grid>div:last-child{border-right:0}.sales-performance-grid span{color:#718078;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.035em}.sales-performance-grid strong{font-size:20px;font-weight:650}.sales-alert-strip{display:flex;align-items:center;gap:12px;padding:11px 13px;border:1px solid #ead8aa;border-radius:8px;background:#fff9ea;color:#6f5414;font-size:11px}.sales-alert-strip.clear{border-color:#cfe3d6;background:#f2faf5;color:#315f43}.sales-buyer-register,.sales-offer-register{display:grid;gap:10px}.sales-buyer-register>article,.sales-offer-register>article{display:grid;grid-template-columns:minmax(180px,1.1fr) minmax(115px,.65fr) minmax(130px,.75fr) minmax(200px,1.3fr) auto;align-items:end;gap:10px;padding:13px;border:1px solid #e2e7e4;border-radius:8px;background:#fff}.sales-offer-register>article{grid-template-columns:minmax(170px,1.1fr) auto minmax(120px,.7fr) minmax(120px,.7fr) minmax(180px,1.1fr) auto}.sales-register-person{display:grid;align-self:center;gap:3px}.sales-register-person span{color:#718078;font-size:10px}.sales-buyer-register label,.sales-offer-register label{display:grid;gap:5px;color:#65716b;font-size:10px;font-weight:600}.sales-buyer-register input,.sales-buyer-register select,.sales-offer-register input,.sales-offer-register select{width:100%;min-height:36px;font-size:11px}.sales-register-actions{display:flex;gap:7px}.sales-milestone-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:14px}.sales-milestone-list>div{display:grid;gap:4px;padding:12px;border:1px solid #e0e5e2;border-radius:8px}.sales-milestone-list>div.overdue{border-color:#e6c4bd;background:#fff7f5}.sales-milestone-list span,.sales-milestone-list small{color:#718078;font-size:10px}.sales-milestone-list strong{font-size:12px}
@media(max-width:760px){.sales-engagement-head{align-items:stretch;flex-direction:column}.sales-link-actions,.sales-performance-grid,.sales-milestone-list{grid-template-columns:1fr}.sales-performance-grid>div{border-right:0;border-bottom:1px solid #e1e6e3}.sales-performance-grid>div:last-child{border-bottom:0}.sales-open-home-list>article,.sales-offer-list>article,.sales-buyer-register>article,.sales-offer-register>article{grid-template-columns:1fr}.sales-register-actions{flex-wrap:wrap}.sales-alert-strip{align-items:flex-start;flex-direction:column}.sales-open-home-counts{flex-wrap:wrap}.sales-public-page{padding:0}.sales-public-card{min-height:100vh;padding:24px 18px;border:0;border-radius:0;box-shadow:none}.sales-public-grid{grid-template-columns:1fr}.sales-public-grid .full{grid-column:auto}.sales-public-property h1{font-size:22px}}
.sales-relationship-field{position:relative}.sales-relationship-input{display:flex;align-items:center;gap:7px}.sales-relationship-input input{min-width:0;flex:1}.sales-relationship-input>a{display:grid;min-height:38px;place-items:center;padding:0 11px;border:1px solid #d6ddd9;border-radius:7px;color:#315b4d;font-size:11px;font-weight:600;text-decoration:none;background:#fff}.sales-relationship-results{position:absolute;z-index:30;top:calc(100% + 5px);left:0;right:0;max-height:260px;padding:5px;border:1px solid #d8dfdb;border-radius:9px;background:#fff;box-shadow:0 14px 35px rgba(28,43,36,.15);overflow:auto}.sales-relationship-results button{display:grid;width:100%;gap:3px;padding:10px;border:0;border-radius:6px;background:#fff;text-align:left;cursor:pointer}.sales-relationship-results button:hover,.sales-relationship-results button:focus{background:#f1f6f3}.sales-relationship-results strong{font-size:12px}.sales-relationship-results span,.sales-relationship-results p{margin:0;color:#748078;font-size:10px}.sales-secured-action,.sales-linked-create{margin-bottom:18px}.sales-secured-action .button{margin-top:8px}.sales-linked-create .record-action-buttons{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.sales-agreement-countdown{margin-bottom:18px}.sales-agreement-summary{display:flex;align-items:center;justify-content:space-between;gap:18px}.sales-agreement-summary>div:first-child{display:grid;gap:4px}.sales-agreement-summary span{color:#718078;font-size:10px;font-weight:650;text-transform:uppercase;letter-spacing:.045em}.sales-agreement-summary strong{font-size:21px;font-weight:650;letter-spacing:-.02em}.sales-agreement-summary small{color:#718078;font-size:11px}.sales-agreement-ring{display:grid;width:66px;height:66px;flex:0 0 66px;place-content:center;border-radius:50%;background:radial-gradient(circle at center,#fff 57%,transparent 59%),conic-gradient(#15803d var(--agreement-progress),#e5ebe7 0);text-align:center}.sales-agreement-ring b{font-size:18px;line-height:1}.sales-agreement-ring span{font-size:8px}.sales-agreement-countdown.attention .sales-agreement-ring{background:radial-gradient(circle at center,#fff 57%,transparent 59%),conic-gradient(#d99b08 var(--agreement-progress),#f2ead2 0)}.sales-agreement-countdown.urgent .sales-agreement-ring,.sales-agreement-countdown.expired .sales-agreement-ring{background:radial-gradient(circle at center,#fff 57%,transparent 59%),conic-gradient(#dc2626 var(--agreement-progress),#f4dede 0)}.sales-agreement-countdown.expired .sales-agreement-summary strong,.sales-agreement-countdown.urgent .sales-agreement-summary strong{color:#b91c1c}.sales-agreement-progress{height:6px;margin:16px 0;background:#e7ece9;border-radius:999px;overflow:hidden}.sales-agreement-progress i{display:block;height:100%;border-radius:inherit;background:#15803d}.sales-agreement-countdown.attention .sales-agreement-progress i{background:#d99b08}.sales-agreement-countdown.urgent .sales-agreement-progress i,.sales-agreement-countdown.expired .sales-agreement-progress i{background:#dc2626}.sales-agreement-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.sales-agreement-countdown>.record-field-help{margin:10px 0 0}
@media(max-width:760px){.sales-agreement-fields{grid-template-columns:1fr}.sales-agreement-summary strong{font-size:18px}}
.sales-linked-create{padding:0;overflow:hidden}.sales-create-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:16px 18px;border-bottom:1px solid #e2e7e4;background:#fafbf9}.sales-create-heading>div{display:grid;gap:3px}.sales-create-heading span{color:#65736c;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.065em}.sales-create-heading h3{margin:0;font-size:15px}.sales-create-heading p{max-width:360px;margin:0;color:#748078;font-size:10px;line-height:1.45;text-align:right}.sales-create-action-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}.sales-create-action-grid>button{display:grid;grid-template-columns:34px minmax(0,1fr) 18px;align-items:center;gap:10px;min-width:0;padding:15px 14px;border:0;border-right:1px solid #e2e7e4;background:#fff;color:#26332d;text-align:left;cursor:pointer}.sales-create-action-grid>button:last-child{border-right:0}.sales-create-action-grid>button:hover,.sales-create-action-grid>button:focus-visible{background:#f4f8f5}.sales-create-action-icon{display:grid;width:34px;height:34px;place-items:center;border:1px solid #d9e2dd;border-radius:8px;background:#f4f7f5;color:#315b4d}.sales-create-action-icon svg{width:18px;height:18px}.sales-create-action-grid>button>span:nth-child(2){display:grid;gap:3px}.sales-create-action-grid strong{font-size:11px;font-weight:650}.sales-create-action-grid small{color:#748078;font-size:9px;line-height:1.4}.sales-create-action-arrow{display:grid;color:#8a9690}.sales-create-action-arrow svg{width:14px;height:14px}
.sales-create-action-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
@media(max-width:900px){.sales-create-action-grid{grid-template-columns:1fr}.sales-create-action-grid>button{border-right:0;border-bottom:1px solid #e2e7e4}.sales-create-action-grid>button:last-child{border-bottom:0}}@media(max-width:600px){.sales-create-heading{align-items:flex-start;flex-direction:column;gap:6px}.sales-create-heading p{text-align:left}}
.asset-register{padding:16px}.asset-list{display:grid;gap:12px;margin-top:14px}.asset-card{display:grid;grid-template-columns:116px 1fr;border:1px solid #dfe5e1;border-radius:14px;overflow:hidden;background:#fff}.asset-card-photo{width:116px;height:100%;min-height:150px;object-fit:cover;background:#f2f6f3}.asset-card-photo.empty{display:grid;place-items:center;color:#729087}.asset-card-photo.empty svg{width:40px}.asset-card-main{padding:15px;min-width:0}.asset-card-head,.asset-card-foot,.asset-editor-heading,.asset-editor-actions,.maintenance-asset-title{display:flex;align-items:center;justify-content:space-between;gap:14px}.asset-card-head>div,.asset-editor-heading>div{display:grid;gap:3px}.asset-card-head span,.asset-card-foot>span,.asset-editor-heading span{font-size:12px;color:#68756f}.asset-card-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:14px 0}.asset-card-metrics span,.maintenance-asset-facts span{display:grid;gap:2px;padding:9px 10px;border-radius:9px;background:#f5f8f6}.asset-card-metrics small,.maintenance-asset-facts small{font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:#78837e}.asset-card-metrics strong,.maintenance-asset-facts strong{font-size:13px}.asset-editor{margin:14px 0 18px;padding:18px;border:1px solid #d9e2dd;border-radius:14px;background:#fbfcfb;display:grid;gap:14px}.asset-check{display:flex;gap:10px;padding:12px;border:1px solid #dfe5e1;border-radius:10px;background:#fff}.asset-check span{display:grid;gap:2px}.asset-check small,.asset-tax-note span{font-size:12px;color:#66736d}.asset-upload-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.asset-tax-note{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:12px;border-radius:10px;background:#eef5f0;color:#244a3f}.maintenance-asset-intelligence{padding:14px;border:1px solid #d6e2dc;border-radius:13px;background:linear-gradient(145deg,#f7faf8,#fff);display:grid;gap:12px}.maintenance-asset-title>div{display:flex;gap:10px;align-items:center}.maintenance-asset-title svg{width:24px;color:#315f51}.maintenance-asset-title span{display:grid}.maintenance-asset-title small{font-size:11px;color:#6c7872}.maintenance-asset-list{display:grid;gap:9px}.maintenance-asset-list article{padding:12px;border-radius:10px;background:#fff;border:1px solid #e3e9e5}.maintenance-asset-list article>div:first-child{display:grid;gap:2px}.maintenance-asset-list article>div:first-child span{font-size:12px;color:#6d7873}.maintenance-asset-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:9px}.maintenance-asset-advice{margin:9px 0 0;padding:9px 10px;border-radius:8px;background:#fff7e6;color:#755317;font-size:12px;line-height:1.45}
.asset-register{padding:0}.asset-list{gap:8px;margin-top:0}.asset-card-simple{gap:10px;padding:13px 14px}.asset-card-simple:hover{border-color:rgba(31,77,77,.3);box-shadow:0 3px 10px rgba(31,48,43,.07)}.asset-card-simple-identity{display:flex;align-items:center;gap:10px;min-width:0;flex:1 1 auto}.asset-card-simple-identity>img,.asset-card-simple-icon{width:38px;height:38px;flex:0 0 38px;border-radius:8px;background:#f2f6f3;object-fit:cover}.asset-card-simple-icon{display:grid;place-items:center;color:#55756b}.asset-card-simple-icon svg{width:21px}.asset-card-simple-actions{display:flex;justify-content:flex-end}.asset-card-simple-actions .button{min-height:30px;padding:5px 9px;font-size:11px}.asset-editor{margin:0 0 12px;padding:16px;border-radius:8px;background:#fff;gap:12px}.asset-editor-heading,.asset-editor-actions,.maintenance-asset-title{display:flex;align-items:center;justify-content:space-between;gap:14px}.asset-editor-heading>div{display:grid;gap:3px}.asset-editor-heading span{font-size:12px;color:#68756f}.asset-check{display:flex;gap:10px;padding:11px;border:1px solid #dfe5e1;border-radius:8px;background:#fff}.asset-check span{display:grid;gap:2px}.asset-check small,.asset-tax-note span{font-size:12px;color:#66736d}.asset-upload-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.asset-advanced{border:1px solid #dfe5e1;border-radius:8px;background:#fafbfa}.asset-advanced>summary{padding:12px 14px;cursor:pointer;color:#33463f;font-size:12px;font-weight:600}.asset-advanced-body{display:grid;gap:12px;padding:2px 14px 14px}.asset-tax-note{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:11px 12px;border-radius:8px;background:#eef5f0;color:#244a3f}
@media(max-width:760px){.asset-card{grid-template-columns:1fr}.asset-card-photo{width:100%;height:170px}.asset-card-metrics,.maintenance-asset-facts{grid-template-columns:1fr}.asset-upload-row{grid-template-columns:1fr}.asset-tax-note{grid-template-columns:1fr}}

/* Keep selected dropdown colours rich and legible after all shared control overrides. */
body .app-shell :is(select.property-status-select, .table-inline-select, .control-select[style*="background"]):not(.status-placeholder) {
    filter: none;
    font-weight: 650 !important;
    border-color: transparent;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, currentColor 16%, transparent);
}

body .app-shell .table-inline-select:not(.status-placeholder) .table-inline-select-caret {
    border-left-color: color-mix(in srgb, currentColor 24%, transparent);
    background: transparent;
    color: inherit;
}

/* Airtable-strength solid colours for dropdown values wherever they render as pills. */
body .app-shell .badge.tone-1,
body .app-shell .badge.badge-yes,
body .app-shell .badge.badge-compliant,
body .app-shell .badge.badge-temp-secured,
body .app-shell .badge.badge-contact-primary,
body .app-shell .badge.badge-status-current,
body .app-shell .badge.badge-property-current,
body .app-shell .badge.badge-property-tenanted,
body .app-shell .badge.badge-enabled,
body .app-shell .badge.badge-bond-full-refund { background:#079b24; color:#fff; }

body .app-shell .badge.tone-2,
body .app-shell .badge.badge-temp-warm,
body .app-shell .badge.badge-contact-decision-maker,
body .app-shell .badge.badge-agreement-yellow,
body .app-shell .badge.badge-status-vacating,
body .app-shell .badge.badge-property-incoming,
body .app-shell .badge.badge-property-vacant,
body .app-shell .badge.badge-bond-part-claim { background:#ffb800; color:#201a00; }

body .app-shell .badge.tone-3,
body .app-shell .badge.badge-temp-cold,
body .app-shell .badge.badge-agreement-blue,
body .app-shell .badge.badge-status-approved,
body .app-shell .badge.badge-property-owner-occupied,
body .app-shell .badge.badge-bond-tenant-claimed { background:#2878d0; color:#fff; }

body .app-shell .badge.tone-4,
body .app-shell .badge.badge-no,
body .app-shell .badge.badge-attention,
body .app-shell .badge.badge-temp-hot,
body .app-shell .badge.badge-agreement-red,
body .app-shell .badge.badge-status-vacated,
body .app-shell .badge.badge-property-outgoing,
body .app-shell .badge.badge-disabled,
body .app-shell .badge.badge-bond-full-claim { background:#d93d42; color:#fff; }

body .app-shell .badge.tone-5,
body .app-shell .badge.badge-periodic { background:#7c5ce0; color:#fff; }

body .app-shell .badge.badge-na,
body .app-shell .badge.badge-contact-associated,
body .app-shell .badge.badge-status-archived,
body .app-shell .badge.badge-property-archived { background:#d7dcda; color:#35403c; }

/* Use the roomier Opportunities row rhythm for every primary record table. */
.app-shell .table-frame > .table-scroll > table > tbody > tr:not(.group-row) > td {
    height: 43px;
    padding-top: 6px;
    padding-bottom: 6px;
    font-family: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 12px;
    font-weight: 400;
}

/* Use one typography system for table content, names, controls and headings. */
.app-shell .table-frame > .table-scroll > table > tbody > tr:not(.group-row) > td,
.app-shell .table-frame > .table-scroll > table > tbody > tr:not(.group-row) > td :is(strong, a, button, input, select, textarea) {
    font-family: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    font-size: 12px !important;
    font-weight: 400 !important;
}

.app-shell .table-frame > .table-scroll > table > thead th,
.app-shell .table-frame > .table-scroll > table > thead th .sort-header,
.app-shell .table-frame > .table-scroll > table > thead th .sort-header span {
    font-size: 9px !important;
    font-weight: 500 !important;
}

.app-shell .table-frame > .table-scroll > table input.table-inline-text[data-field="bond_reference"] {
    font-family: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    font-size: 12px !important;
    font-weight: 400 !important;
}

.app-shell .table-frame > .table-scroll > table .table-inline-select {
    height: 30px;
}

body .app-shell :is(select.property-status-select, .table-inline-select, .control-select[style*="background"]):not(.status-placeholder):focus {
    box-shadow:
        inset 0 0 0 1px color-mix(in srgb, currentColor 24%, transparent),
        0 0 0 3px var(--accent-ring);
}

/* Keyboard-friendly dates retain the native calendar without forcing its use. */
.typed-date-control {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 38px;
    align-items: center;
    gap: 6px;
    width: 100%;
}
.typed-date-control::after {
    content: "";
    position: absolute;
    z-index: 2;
    top: 50%;
    right: 11px;
    width: 16px;
    height: 16px;
    transform: translateY(-50%);
    background: center / 16px 16px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Crect x='2' y='3.5' width='12' height='10.5' rx='2' fill='none' stroke='%234f5d56' stroke-width='1.4'/%3E%3Cpath d='M5 2v3M11 2v3M2 6.5h12' fill='none' stroke='%234f5d56' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");
    pointer-events: none;
}
.typed-date-control > .typed-date-entry {
    order: 1;
    width: 100%;
    min-width: 0;
}
.typed-date-control > input[type="date"] {
    order: 2;
    width: 38px !important;
    min-width: 38px;
    height: 38px;
    padding: 0 !important;
    color: transparent !important;
    cursor: pointer;
}
.typed-date-control > input[type="date"]::-webkit-datetime-edit {
    display: none;
}
.typed-date-control > input[type="date"]::-webkit-calendar-picker-indicator {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 9px;
    cursor: pointer;
    opacity: 0;
}
.typed-date-control > .typed-date-entry.is-invalid {
    border-color: #c84d4d !important;
    box-shadow: 0 0 0 3px rgba(200, 77, 77, .1) !important;
}

/* Give dropdown arrows comfortable breathing room from the right edge. */
.app-shell select:not([multiple]) {
    -webkit-appearance: none;
    appearance: none;
    padding-left: 13px !important;
    padding-right: 36px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1.5 1.5 6 6l4.5-4.5' fill='none' stroke='%234f5d56' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 13px center !important;
    background-size: 12px 8px !important;
}

/* Match the native select chevron to solid dropdowns that use white text. */
.app-shell select:not([multiple])[style*="color:#ffffff"],
.app-shell select:not([multiple])[style*="color: #ffffff"],
.app-shell select:not([multiple])[style*="color:#fff;"],
.app-shell select:not([multiple])[style*="color: #fff;"] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1.5 1.5 6 6l4.5-4.5' fill='none' stroke='%23ffffff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
}

.app-shell .table-inline-select {
    padding-left: 13px;
    padding-right: 0;
}

.app-shell .table-inline-select-caret {
    margin-right: 0;
}

/* Sales Property record — approved three-column workspace */
.record-grid.sales-property-record-grid{grid-template-columns:minmax(300px,30%) minmax(500px,1fr) minmax(300px,29%);align-items:start;gap:10px}
.sales-property-record-grid .record-panel{border-color:#dfe5e1;border-radius:9px;box-shadow:0 2px 9px rgba(29,48,39,.035);overflow:hidden}
.sales-property-record-grid .record-panel-head{min-height:46px;padding:0 14px;border-bottom:1px solid #e5e9e6}
.sales-property-record-grid .record-panel-head h2{font-size:12px;font-weight:650}
.sales-property-record-grid #recordOverview{padding:12px}
.sales-property-identity{padding:0 0 14px;border-bottom:1px solid #e4e9e6}
.sales-property-photo-shell,.sales-property-photo-empty{position:relative;width:100%;aspect-ratio:16/10;border-radius:12px;overflow:hidden;background:#f1f4f2;color:#738078}.sales-property-photo-shell>img{display:block;width:100%;height:100%;object-fit:cover}.sales-property-photo-shell>button{position:absolute;right:10px;bottom:10px;padding:6px 9px;border:1px solid rgba(255,255,255,.75);border-radius:6px;background:rgba(20,30,25,.76);color:#fff;font:600 9px Inter,Arial,sans-serif;cursor:pointer}.sales-property-photo-shell>input,.sales-property-photo-empty>input{display:none}
.sales-property-photo-empty{display:grid;place-content:center;place-items:center;gap:5px;border:1px dashed #bbc8c1;font-size:11px}.sales-property-photo-empty strong{color:#314139}.sales-property-photo-empty span{font-size:9px}.sales-property-photo-empty button{margin-top:6px;padding:6px 9px;border:1px solid #cbd5d0;border-radius:6px;background:#fff;color:#23473b;font:600 9px Inter,Arial,sans-serif;cursor:pointer}
.sales-property-record-grid #propertyPhotoGallery{margin:26px 26px 0;padding:0 0 12px;border-bottom:1px solid #e4e9e6;background:#fff}
.sales-property-record-grid #propertyPhotoGallery.is-empty{margin:26px 26px 0;padding:0 0 12px}
.sales-property-record-grid .property-photo-stage{border:0;border-radius:12px}
.sales-property-record-grid #propertyPhotoGallery.is-empty .property-photo-stage{border:1px dashed #bbc8c1;border-radius:12px}
.sales-property-record-grid .property-photo-stage:after{content:'View larger';position:absolute;right:10px;bottom:10px;padding:6px 9px;border:1px solid rgba(255,255,255,.72);border-radius:6px;background:rgba(20,30,25,.76);color:#fff;font:600 9px Inter,Arial,sans-serif;pointer-events:none}
.sales-property-record-grid .property-photo-count{position:absolute;left:10px;bottom:10px;z-index:2;display:inline-flex;align-items:center;gap:5px;min-height:28px;padding:5px 8px;border:1px solid rgba(255,255,255,.72);border-radius:7px;background:rgba(20,30,25,.76);color:#fff;font:650 10px Inter,Arial,sans-serif;pointer-events:none;backdrop-filter:blur(6px)}
.sales-property-record-grid .property-photo-count svg{width:15px;height:15px}
.sales-property-record-grid #propertyPhotoGallery.is-empty .property-photo-stage:after{display:none}
.sales-property-record-grid .property-photo-upload{border-radius:8px;background:#f7faf8}
.sales-property-record-grid #propertyPhotoThumbs{display:none}
.sales-property-record-grid .property-photo-thumb{flex:0 0 62px;width:62px;height:47px;border-radius:7px}
.sales-property-address{padding:16px 0 11px}.sales-property-address h2{margin:0;color:#141a17;font-size:19px;font-weight:650;letter-spacing:-.02em}.sales-property-address p{margin:4px 0 0;color:#303a35;font-size:14px}
.sales-property-features{display:flex;align-items:center;gap:0;color:#36433d;font-size:11px}.sales-property-features span{display:inline-flex;align-items:center;gap:6px;padding:0 13px;border-right:1px solid #e1e6e3}.sales-property-features span:first-child{padding-left:0}.sales-property-features span:last-child{border-right:0}.sales-property-features svg{width:17px;height:17px;color:#52635b}.sales-property-features b{font-weight:650}.sales-property-features .sales-property-type{gap:0}
.sales-property-record-grid #recordOverviewPanel>.record-panel-body{padding-top:0}
.sales-property-record-grid #recordOverview{padding-top:0}
@media(min-width:801px){.sales-property-record-grid #recordOverviewPanel{display:block;overflow-x:hidden;overflow-y:auto;scrollbar-width:thin}.sales-property-record-grid #recordOverviewPanel>.record-panel-body{height:auto;min-height:0;overflow:visible}}
.sales-property-record-grid #recordOverview>.owner-info-group{margin:0;padding:13px 0;border:0;border-bottom:1px solid #e4e9e6;border-radius:0;background:#fff}.sales-property-record-grid #recordOverview>.owner-info-group>h3:empty{display:none}.sales-property-record-grid #recordOverview>.owner-info-group>h3{margin:0 0 10px;font-size:11px}
.sales-property-record-grid #recordOverview .agency-overview-grid{gap:10px}.sales-property-record-grid #recordOverview .agency-overview-field label{font-size:9px}.sales-property-record-grid #recordOverview :is(input,select){min-height:34px;font-size:11px}
.sales-agreement-compact{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:13px 0;padding:13px 10px;border:1px solid #e1e7e3;border-radius:8px;background:#fbfcfb}.sales-agreement-compact>div:first-child{display:grid;gap:3px}.sales-agreement-compact span{color:#617068;font-size:9px;text-transform:uppercase;letter-spacing:.045em}.sales-agreement-compact strong{font-size:12px}.sales-agreement-compact small{color:#65736c;font-size:9px}.sales-agreement-compact .sales-agreement-ring{width:49px;height:49px}
.sales-overview-disclosure{border-bottom:1px solid #e4e9e6}.sales-overview-disclosure>summary{position:relative;padding:14px 3px;list-style:none;color:#1f2924;font-size:11px;font-weight:650;cursor:pointer}.sales-overview-disclosure>summary::-webkit-details-marker{display:none}.sales-overview-disclosure>summary:after{content:'›';position:absolute;right:4px;top:12px;color:#607068;font-size:18px;transform:rotate(0)}.sales-overview-disclosure[open]>summary:after{transform:rotate(90deg)}.sales-overview-disclosure>div{padding:0 2px 13px}.sales-overview-disclosure .owner-info-group{margin:0;padding:0;border:0;background:transparent}.sales-overview-disclosure .owner-info-group>h3{display:none}
.sales-property-record-grid #recordOverview>.property-overview-divider{margin:12px 0 7px}.sales-property-record-grid #recordOverview>.record-field-row{font-size:9px}
.sales-property-workspace-tabs{display:flex;align-items:center;gap:0;min-height:46px;padding:0 12px;border-bottom:1px solid #e4e8e5;overflow-x:auto}.sales-property-workspace-tabs button{position:relative;align-self:stretch;padding:0 12px;border:0;background:transparent;color:#59665f;font:500 10px Inter,Arial,sans-serif;white-space:nowrap;cursor:pointer}.sales-property-workspace-tabs button:hover{color:#173f35;background:#f8faf8}.sales-property-workspace-tabs button.active{color:#17201c;font-weight:650}.sales-property-workspace-tabs button.active:after{content:'';position:absolute;left:10px;right:10px;bottom:0;height:2px;background:#174f3f;border-radius:2px}
.sales-property-workspace-pane{display:grid;gap:9px;padding:10px;background:#fbfcfb}.sales-workspace-section{margin:0;padding:14px;border:1px solid #dfe5e1;border-radius:8px;background:#fff}.sales-workspace-section h3{margin:0;font-size:11px}.sales-workspace-section p{font-size:11px}
.sales-next-best>span{display:block;margin-bottom:12px;color:#212a26;font-size:10px;font-weight:650}.sales-next-best>div{display:grid;grid-template-columns:42px 1fr;gap:12px;align-items:start}.sales-next-best i{display:grid;width:42px;height:42px;place-items:center;border-radius:50%;background:#ebf6ed;color:#178039;font-size:18px;font-style:normal}.sales-next-best h3{margin:1px 0 4px;font-size:15px;font-weight:600}.sales-next-best p{margin:0;color:#647169}.sales-next-best .record-action-buttons{margin-top:11px}
.sales-performance-strip>h3{margin-bottom:13px}.sales-performance-strip>div,.sales-inspection-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}.sales-performance-strip span,.sales-inspection-summary>span{display:grid;gap:5px;padding:2px 13px;border-right:1px solid #e3e7e5;color:#65726c;font-size:9px;text-align:center}.sales-performance-strip span:last-child,.sales-inspection-summary>span:last-child{border-right:0}.sales-performance-strip strong,.sales-inspection-summary strong{color:#121815;font-size:17px;font-weight:600}.sales-inspection-summary strong{font-size:12px}
.sales-section-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:11px}.sales-section-heading>span{color:#77827d;font-size:9px}.sales-success-text{color:#16803c!important}.sales-activity-rows{display:grid}.sales-activity-rows article{display:grid;grid-template-columns:70px 1fr;gap:10px;padding:9px 0;border-top:1px solid #edf0ee}.sales-activity-rows time{color:#77827d;font-size:9px}.sales-activity-rows article>div{display:grid;gap:3px}.sales-activity-rows strong{font-size:10px}.sales-activity-rows span{color:#69766f;font-size:9px}
.sales-publishing-strip>div:last-child{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.sales-publishing-strip>div:last-child>span{display:grid;gap:4px;padding:3px 12px;border-right:1px solid #e4e8e6}.sales-publishing-strip>div:last-child>span:first-child{padding-left:0}.sales-publishing-strip>div:last-child>span:last-child{border-right:0}.sales-publishing-strip strong{font-size:10px}.sales-publishing-strip small{color:#16803c;font-size:9px}
.sales-inspection-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:5px 4px}.sales-inspection-heading h2{margin:0 0 3px;font-size:16px}.sales-inspection-heading p{margin:0;color:#65726c;font-size:10px}
.sales-upcoming-list article{display:grid;grid-template-columns:minmax(190px,1.6fr) auto 60px minmax(95px,1fr) auto;align-items:center;gap:10px;padding:10px 0;border-top:1px solid #e7ebe8;font-size:9px}.sales-upcoming-list article>div{display:grid;gap:3px}.sales-upcoming-list article span{color:#65726c}.sales-status-badge{padding:4px 7px;border-radius:5px;font-size:8px}.sales-status-badge.complete{background:#e7f6eb;color:#16743a}
.sales-followup-table>.head,.sales-followup-table>article{display:grid;grid-template-columns:minmax(130px,1.2fr) 78px minmax(120px,1fr) 110px auto auto;align-items:center;gap:7px}.sales-followup-table>.head{padding:0 4px 7px;color:#69756f;font-size:8px}.sales-followup-table>article{padding:8px 0;border-top:1px solid #e7ebe8}.sales-followup-table article>div{display:grid;gap:2px}.sales-followup-table b{font-size:9px}.sales-followup-table small{max-width:150px;overflow:hidden;color:#76827c;font-size:8px;text-overflow:ellipsis;white-space:nowrap}.sales-followup-table :is(input,select){min-width:0;min-height:31px;padding:5px 8px!important;font-size:9px!important}.sales-followup-table .button{min-height:29px;padding:4px 7px;font-size:8px}.sales-interest.hot{border-color:#f0c1c1;background:#fff0f0;color:#a52222}.sales-interest.warm{border-color:#ecd7a2;background:#fff8e8;color:#8a5c00}
.sales-inspection-bottom{display:grid;grid-template-columns:1fr 1fr;gap:9px}.sales-inspection-bottom h3{margin-bottom:10px}.sales-inspection-bottom dl{display:grid;gap:8px;margin:0}.sales-inspection-bottom dl>div{display:flex;justify-content:space-between;gap:10px}.sales-inspection-bottom dt{color:#68756e;font-size:9px}.sales-inspection-bottom dd{margin:0;color:#176f39;font-size:9px;font-weight:650}.sales-inspection-bottom ul{display:grid;gap:9px;margin:0;padding:0;list-style:none}.sales-inspection-bottom li{color:#4e5d55;font-size:9px}.sales-inspection-bottom li:before{content:'✓';display:inline-grid;width:15px;height:15px;margin-right:7px;place-items:center;border-radius:50%;background:#16803c;color:#fff;font-size:8px}
@media(max-width:1250px){.record-grid.sales-property-record-grid{grid-template-columns:minmax(280px,34%) minmax(480px,1fr)}.sales-property-record-grid>.record-panel:last-child{grid-column:1/-1}.sales-property-record-grid .side-panel{min-height:420px}.sales-property-workspace-tabs button{padding:0 9px}.sales-followup-table>.head{display:none}.sales-followup-table>article{grid-template-columns:1fr 1fr}.sales-upcoming-list article{grid-template-columns:1fr auto auto}}
@media(max-width:800px){.record-grid.sales-property-record-grid{grid-template-columns:1fr}.sales-property-record-grid>.record-panel:last-child{grid-column:auto}.sales-performance-strip>div,.sales-inspection-summary{grid-template-columns:repeat(2,1fr);row-gap:12px}.sales-inspection-bottom{grid-template-columns:1fr}}
.sales-property-workspace-tabs button{padding-left:8px;padding-right:8px;font-size:9px}.sales-property-workspace-tabs button.active:after{left:7px;right:7px}

/* Sales Property spacing, typography and agreement indicator refinement */
.sales-property-record-grid,
.sales-property-record-grid :is(button,input,select,textarea,summary,label,span,strong,small,h1,h2,h3,h4,p,a,li,dt,dd,time){font-family:"Inter",ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important}
.sales-property-record-grid #recordActions{padding:12px}
.sales-property-record-grid .sales-property-workspace-tabs{border:1px solid #e3e8e5;border-radius:8px 8px 0 0;background:#fff}
.sales-property-record-grid .sales-property-workspace-pane{padding:10px 0 0}
.sales-property-record-grid #recordSidePanel>.record-panel-head{width:auto;margin:12px 12px 0;border:1px solid #e3e8e5;border-radius:8px 8px 0 0}
.sales-property-record-grid #recordSidePanel>.side-pane{width:auto;margin:0 12px 12px;padding:14px 0 0}
.sales-property-record-grid #recordSidePanel>.side-pane>.comment-composer,
.sales-property-record-grid #recordSidePanel>.side-pane>.side-search,
.sales-property-record-grid #recordSidePanel>.side-pane>:is(.comment-list,.activity-list,.document-list,.alert-list,.activity-actions,.document-actions,.alert-composer){margin-right:0;margin-left:0}
.sales-property-record-grid .sales-agreement-compact .sales-agreement-ring{width:58px;height:58px;aspect-ratio:1/1;flex:0 0 58px;box-sizing:border-box;border:1px solid #dfe7e2;background:radial-gradient(circle at center,#fff 44%,transparent 47%),conic-gradient(#17833d var(--agreement-progress),#dfe7e2 0);box-shadow:0 1px 4px rgba(20,55,39,.08)}
.sales-property-record-grid .sales-agreement-compact .sales-agreement-ring b{font-size:15px;font-weight:650;line-height:.95}
.sales-property-record-grid .sales-agreement-compact .sales-agreement-ring span{font-size:7px;font-weight:600;letter-spacing:.04em}

/* Sales Property polish: equal collaboration inset, segmented tabs, readable countdown */
.sales-property-record-grid #recordSidePanel>.record-panel-head{margin:26px 26px 0;padding:0 5px;border:0;border-radius:9px;background:#f3f6f4}
.sales-property-record-grid #recordSidePanel>.side-pane{margin:0 26px 26px;padding-top:12px}
.sales-property-record-grid .sales-property-workspace-tabs{min-height:46px;padding:6px;gap:2px;border:1px solid #e1e7e3;border-radius:9px;background:#f3f6f4;box-shadow:inset 0 1px 1px rgba(29,48,39,.025)}
.sales-property-record-grid .sales-property-workspace-tabs button{min-height:32px;padding:0 8px;border:1px solid transparent;border-radius:6px;color:#56635d;font-size:9px;font-weight:550;transition:background-color .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease}
.sales-property-record-grid .sales-property-workspace-tabs button:hover{border-color:#dce4df;background:rgba(255,255,255,.72);color:#24483d}
.sales-property-record-grid .sales-property-workspace-tabs button.active{border-color:#d7e1dc;background:#fff;color:#173f35;font-weight:650;box-shadow:0 1px 3px rgba(25,54,42,.09)}
.sales-property-record-grid .sales-property-workspace-tabs button.active:after{display:none}
.sales-property-record-grid .sales-agreement-compact .sales-agreement-ring{display:flex;width:64px;height:64px;aspect-ratio:1/1;flex:0 0 64px;align-items:center;justify-content:center;flex-direction:column;gap:1px;background:radial-gradient(circle at center,#fff 54%,transparent 57%),conic-gradient(#17833d var(--agreement-progress),#dfe7e2 0)}
.sales-property-record-grid .sales-agreement-compact .sales-agreement-ring b{display:block;margin:0;color:#17231e;font-size:17px;font-weight:700;line-height:1}
.sales-property-record-grid .sales-agreement-compact .sales-agreement-ring span{display:block;margin:0;color:#53625b;font-size:7px;font-weight:650;line-height:1;text-transform:uppercase;letter-spacing:0}

/* Sales Property collaboration tabs: match the polished workspace tab language. */
.sales-property-record-grid #recordSidePanel>.record-panel-head:has(.side-tabs){min-height:46px;margin:26px 26px 0;padding:6px;border:1px solid #e1e7e3;border-radius:9px;background:#f3f6f4;box-shadow:inset 0 1px 1px rgba(29,48,39,.025)}
.sales-property-record-grid #recordSidePanel>.record-panel-head>.side-tabs{display:grid;width:100%;max-width:none;min-height:32px;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px;margin:0;padding:0;border:0;background:transparent;overflow:visible}
.sales-property-record-grid #recordSidePanel>.record-panel-head>.side-tabs>.side-tab{display:flex;width:100%;min-width:0;min-height:32px;height:32px;padding:0 6px;border:1px solid transparent;border-radius:6px;background:transparent;color:#56635d;font-size:9px!important;font-weight:550!important;transition:background-color .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease}
.sales-property-record-grid #recordSidePanel>.record-panel-head>.side-tabs>.side-tab:hover{border-color:#dce4df;background:rgba(255,255,255,.72);color:#24483d}
.sales-property-record-grid #recordSidePanel>.record-panel-head>.side-tabs>.side-tab.active{border-color:#d7e1dc;background:#fff;color:#173f35;font-weight:650!important;box-shadow:0 1px 3px rgba(25,54,42,.09)}
.sales-property-record-grid #recordSidePanel>.record-panel-head>.side-tabs>.side-tab:after{display:none!important}

/* Creation and edit modals use the same field typography as Properties records. */
body .modal form label:has(input:not([type="checkbox"]):not([type="radio"]), select, textarea),
body .modal :is(.field, .form-field, .agency-overview-field) > :is(label:first-child, span:first-child),
body .modal :is(.field-label, .field-title) {
    color: #4d5953 !important;
    font-family: "Inter", ui-sans-serif, system-ui, -apple-system, "system-ui", "Segoe UI", sans-serif !important;
    font-size: 11px !important;
    font-style: normal !important;
    font-weight: 600 !important;
    line-height: normal !important;
    letter-spacing: .01em !important;
    text-transform: none !important;
}

body .modal .proposal-fee-value.amount input {
    padding-left: 30px !important;
}

body .modal :is(
    input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]),
    select,
    textarea,
    [contenteditable="true"]
) {
    font-family: "Inter", ui-sans-serif, system-ui, -apple-system, "system-ui", "Segoe UI", sans-serif !important;
    font-size: 12.333px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: normal !important;
    letter-spacing: normal !important;
    text-transform: none !important;
}

/* Avatar selects need additional clearance beyond the shared dropdown inset. */
body .app-shell .pipeline-user-select-shell select {
    padding-left: 46px !important;
}

/* Keep search text consistent across the universal search and page/table toolbars. */
.app-shell :is(.universal-search-field, .table-search) input[type="search"] {
    font-size: 12px !important;
}

/* Applications use the same calm, content-led record treatment as the rest of Delegate. */
#applicationRecordContent .record-page-head {
    width: 100%;
    margin-inline: 0;
}

.application-record-grid {
    width: 100%;
    margin-inline: 0;
    gap: 18px;
}

.application-record-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 380px;
    align-items: start;
    gap: 18px;
    width: 100%;
}

.application-record-side-panel {
    position: sticky;
    top: 16px;
    min-width: 0;
    height: min(720px, calc(100vh - 150px));
}

.application-record-side-panel .side-pane {
    min-height: 0;
    overflow-y: auto;
}

@media (max-width: 1180px) {
    .application-record-workspace { grid-template-columns: minmax(0, 1fr) 340px; }
}

@media (max-width: 960px) {
    .application-record-workspace { grid-template-columns: 1fr; }
    .application-record-side-panel { position: static; height: auto; min-height: 480px; }
}

.application-record-summary {
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.application-record-summary-head {
    padding: 4px 2px 16px;
    border-bottom: 1px solid var(--line);
}

.application-record-summary-title {
    gap: 4px;
}

.application-record-summary-title > span {
    display: none;
}

.application-record-summary-title h2 {
    color: var(--ink);
    font-size: 21px;
    font-weight: 500;
    letter-spacing: -.01em;
}

.application-record-summary-title p {
    color: var(--muted);
    font-size: 12px;
    font-weight: 400;
}

.application-record-status,
.application-record-status.submitted,
.application-record-status.partial {
    padding: 4px 2px;
    border-radius: 0;
    background: transparent;
    font-weight: 500;
}

.application-record-metrics {
    gap: 28px;
    padding: 14px 2px 0;
}

.application-record-metric,
.application-record-metric:last-child {
    padding: 0;
    border: 0;
}

.application-record-metric span {
    margin-bottom: 5px;
    color: var(--muted);
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .01em;
    text-transform: none;
}

.application-record-metric strong {
    color: var(--ink);
    font-size: 12px;
    font-weight: 400;
}

.application-record-applicant-panel-head h3,
.application-answer-person strong,
.application-answer-section > summary h4 {
    color: var(--ink);
    font-weight: 500;
}

.application-answer-person img,
.application-answer-person .avatar {
    width: 36px;
    height: 36px;
    font-size: 11px;
    font-weight: 500;
}

.application-answer-person strong {
    font-size: 12px;
}

.application-answer-body {
    grid-template-columns: 1fr;
    background: #fff;
}

.application-answer-section,
.application-answer-section:nth-child(even) {
    border-right: 0;
    border-bottom: 1px solid #e8ecea;
}

.application-answer-section:last-child {
    border-bottom: 0;
}

.application-answer-section[open] {
    background: #fafbfa;
}

.application-answer-field span {
    font-weight: 500;
    letter-spacing: .01em;
    text-transform: none;
}

.application-answer-field strong {
    font-weight: 400;
}

/* Record Alerts must scroll inside the fixed-height side panel on shorter screens. */
.app-shell #recordSidePanel > #alertsPane {
    display: block;
    height: 100%;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}

.app-shell #recordSidePanel > #alertsPane[hidden] {
    display: none !important;
}

.app-shell #recordSidePanel > #alertsPane .alert-list {
    margin-top: 12px;
}

.app-shell #recordSidePanel .alert-composer-head > div {
    min-width: 0;
}

.app-shell #recordSidePanel .alert-composer-head .comment-count {
    flex: 0 0 auto;
    min-width: max-content;
    white-space: nowrap;
}

/* Keep calculated bond claim outcomes slightly stronger than editable record values. */
#recordActions .tenancy-derived-field input[data-tenancy-derived-field="total_amount_to_claim"],
#recordActions .tenancy-derived-field input[data-tenancy-derived-field="refund_to_tenant"],
#recordActions .tenancy-derived-field input[data-tenancy-derived-field="refund_to_agency"] {
    font-weight: 500 !important;
}

/* Phone navigation and layout. The tablet and desktop breakpoints above remain unchanged. */
.mobile-nav-toggle,
.mobile-nav-close,
.mobile-nav-backdrop {
    display: none;
}

.mobile-topbar-brand,
.mobile-universal-search-toggle {
    display: none;
}

.mobile-tab-bar,
.mobile-pull-refresh {
    display: none;
}

@media (max-width: 600px) {
    :root {
        --table-page-padding: 10px;
        --record-page-gap: 8px;
    }

    html,
    body {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
        overscroll-behavior-y: none;
        -webkit-tap-highlight-color: transparent;
    }

    body.mobile-nav-open {
        overflow: hidden;
    }

    .app-shell {
        display: block;
        width: 100%;
        min-width: 0;
    }

    .app-shell .sidebar {
        position: fixed;
        inset: 0 auto 0 0;
        z-index: 5200;
        display: flex;
        width: min(326px, calc(100vw - 44px));
        height: 100dvh;
        min-height: 0;
        padding: 14px 12px max(14px, env(safe-area-inset-bottom));
        overflow-x: hidden;
        overflow-y: auto;
        transform: translateX(-105%);
        transition: transform 180ms ease;
        box-shadow: 18px 0 45px rgba(24, 39, 33, .2);
    }

    body.mobile-nav-open .app-shell .sidebar {
        transform: translateX(0);
    }

    .mobile-nav-backdrop:not([hidden]) {
        position: fixed;
        inset: 0;
        z-index: 5190;
        display: block;
        width: 100%;
        height: 100%;
        padding: 0;
        border: 0;
        background: rgba(28, 39, 34, .42);
    }

    .mobile-nav-toggle,
    .mobile-nav-close {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 44px;
        min-height: 44px;
        border: 1px solid var(--line);
        border-radius: 8px;
        background: #fff;
        color: var(--ink);
        font: inherit;
        font-size: 12px;
        font-weight: 500;
        cursor: pointer;
    }

    .mobile-nav-toggle {
        width: 44px;
        min-width: 44px;
        padding: 0;
        border-color: #d7e1dc;
        border-radius: 12px;
        background: #f2f7f4;
        color: #276347;
        box-shadow: 0 3px 10px rgba(31, 67, 50, .06);
    }

    .mobile-nav-toggle:active {
        background: #e7f1eb;
        transform: scale(.96);
    }

    .mobile-nav-toggle-icon,
    .mobile-nav-toggle-icon svg {
        width: 20px;
        height: 20px;
    }

    .mobile-nav-toggle-icon {
        display: grid;
        place-items: center;
    }

    .mobile-nav-toggle-label {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }

    .mobile-nav-close {
        position: absolute;
        top: 12px;
        right: 12px;
        z-index: 1;
        min-width: 52px;
    }

    .app-shell .sidebar .brand {
        min-height: 46px;
        padding-right: 62px;
    }

    .app-shell .sidebar .nav-list {
        grid-template-columns: 1fr;
        gap: 3px;
        overflow: visible;
    }

    .app-shell .sidebar .nav-button {
        min-height: 44px;
        padding: 9px 10px;
    }

    .app-shell .main {
        width: 100%;
        min-width: 0;
        min-height: 100dvh;
        padding-bottom: calc(64px + env(safe-area-inset-bottom));
    }

    .app-shell .topbar,
    .app-shell .topbar:has(.impersonation-banner:not([hidden])) {
        position: sticky;
        top: 0;
        z-index: 110;
        grid-template-columns: auto minmax(0, 1fr) auto;
        align-items: center;
        gap: 8px;
        padding: max(8px, env(safe-area-inset-top)) max(10px, env(safe-area-inset-right)) 8px max(10px, env(safe-area-inset-left));
        background: rgba(255, 255, 255, .98);
    }

    .app-shell .topbar .page-title {
        min-width: 0;
        visibility: hidden;
    }

    .app-shell .mobile-topbar-brand {
        position: absolute;
        top: max(8px, env(safe-area-inset-top));
        left: 50%;
        z-index: 1;
        display: flex;
        width: 108px;
        height: 44px;
        align-items: center;
        justify-content: center;
        transform: translateX(-50%);
        pointer-events: none;
    }

    .app-shell .mobile-topbar-brand img {
        display: block;
        width: 100%;
        max-height: 30px;
        object-fit: contain;
    }

    .app-shell .topbar .page-title h1 {
        overflow: hidden;
        font-size: 18px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .app-shell .topbar-search-group {
        grid-column: 1 / -1;
        grid-row: 2;
        width: 100%;
    }

    body:not(.mobile-universal-search-open) .app-shell .topbar-search-group .universal-search:not([hidden]) {
        display: none;
    }

    body.mobile-universal-search-open .app-shell .topbar-search-group .universal-search:not([hidden]) {
        display: block;
    }

    body:not(.mobile-universal-search-open) .app-shell .topbar-search-group:has(.universal-search:not([hidden])):has(.impersonation-banner[hidden]) {
        display: none;
    }

    .app-shell .topbar-search-group:has(.universal-search[hidden]):has(.impersonation-banner[hidden]) {
        display: none;
    }

    .app-shell .topbar-search-group .universal-search,
    .app-shell .topbar-search-group .universal-search-field {
        width: 100%;
        min-width: 0;
    }

    .app-shell .toolbar {
        justify-content: flex-end;
        flex-wrap: nowrap;
        gap: 6px;
    }

    .app-shell .toolbar .mobile-universal-search-toggle:not([hidden]) {
        display: inline-grid;
        place-items: center;
    }

    .app-shell .mobile-universal-search-toggle[aria-expanded="true"] {
        border-color: #b9d0c5;
        background: #eaf3ee;
        color: #24674e;
    }

    .app-shell .toolbar .button {
        min-width: 44px;
        min-height: 44px;
    }

    .app-shell .toolbar #refreshButton,
    .app-shell .toolbar #importButton {
        display: none !important;
    }

    .app-shell .toolbar #refreshButton svg,
    .app-shell .toolbar #importButton svg {
        color: var(--ink);
    }

    .app-shell .toolbar #importButton svg {
        color: #fff;
    }

    .app-shell .icon-badge-button {
        width: 44px;
        height: 44px;
    }

    .app-shell .notification-panel,
    .app-shell .universal-search-panel {
        position: fixed;
        top: 64px;
        right: 8px;
        left: 8px;
        width: auto;
        max-width: none;
        max-height: calc(100dvh - 76px);
        overflow: auto;
    }

    body.mobile-universal-search-open .app-shell .universal-search-panel {
        top: 118px;
    }

    .app-shell :is(.content, .record-content, .admin-content, .settings-content, .agency-settings-content, .dashboard-content, .knowledge-hub-workspace) {
        width: 100%;
        min-width: 0;
        padding: 10px;
    }

    .app-shell :is(.record-tabs, .side-tabs, .agency-middle-tabs, .property-workspace-tabs, .settings-tabs, .admin-tabs) {
        display: flex;
        width: 100%;
        max-width: 100%;
        flex-wrap: nowrap;
        justify-content: flex-start;
        overflow-x: auto;
        overflow-y: hidden;
        overscroll-behavior-x: contain;
        scrollbar-width: thin;
    }

    .app-shell :is(.record-tab, .side-tab, .property-workspace-tab, .settings-tab, .admin-tab) {
        flex: 0 0 auto;
        min-height: 44px;
        white-space: nowrap;
    }

    .app-shell .record-tabs.metric-tabs {
        display: grid;
        grid-template-columns: 1fr;
    }

    .app-shell #tenancyTabs.metric-tabs[data-table="maintenance"] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        grid-template-rows: 74px;
        grid-auto-rows: 82px;
        gap: 0;
        align-self: start;
        border-color: #d9e1dd;
        border-radius: 14px;
        box-shadow: 0 6px 20px rgba(29, 53, 42, .055);
    }

    .app-shell #tenancyTabs.metric-tabs[data-table="maintenance"] .record-tab {
        min-width: 0;
        width: 100%;
        height: 82px;
        min-height: 82px;
        max-height: 82px;
        padding: 11px 12px;
        gap: 7px;
        align-content: space-between;
        border-right-color: #e5eae7;
        border-bottom-color: #e5eae7;
    }

    .app-shell #tenancyTabs.metric-tabs[data-table="maintenance"] .record-tab:first-child {
        grid-column: 1 / -1;
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-rows: 1fr;
        align-items: center;
        align-content: center;
        height: 74px;
        min-height: 74px;
        max-height: 74px;
        padding: 13px 16px;
        background: linear-gradient(135deg, #f5faf7 0%, #ffffff 72%);
    }

    .app-shell #tenancyTabs.metric-tabs[data-table="maintenance"] .record-tab:first-child .tab-label {
        font-size: 11px;
        color: #356653;
    }

    .app-shell #tenancyTabs.metric-tabs[data-table="maintenance"] .record-tab:first-child .tab-metric {
        padding-right: 54px;
    }

    .app-shell #tenancyTabs.metric-tabs[data-table="maintenance"] .record-tab:first-child .tab-count {
        font-size: 27px !important;
        color: #245b4a;
    }

    .app-shell #tenancyTabs.metric-tabs[data-table="maintenance"] .record-tab:first-child .tab-watermark {
        right: 13px;
        bottom: 8px;
        width: 54px;
        height: 54px;
    }

    .app-shell #tenancyTabs.metric-tabs[data-table="maintenance"] .tab-label {
        overflow: hidden;
        font-size: 9.5px;
        line-height: 1.2;
        text-overflow: ellipsis;
        white-space: normal;
    }

    .app-shell #tenancyTabs.metric-tabs[data-table="maintenance"] .tab-metric .tab-count {
        font-size: 22px;
    }

    .app-shell #tenancyTabs.metric-tabs[data-table="maintenance"] .tab-count-label {
        font-size: 8px;
    }

    .app-shell #tenancyTabs.metric-tabs[data-table="maintenance"] .tab-watermark {
        width: 36px;
        height: 36px;
        right: 4px;
        bottom: 2px;
        color: rgba(31, 77, 77, .065);
    }

    .app-shell .table-toolbar,
    .app-shell .table-actions,
    .app-shell .bulk-tools {
        width: 100%;
        min-width: 0;
    }

    .app-shell .table-toolbar {
        position: relative;
        display: block;
        min-height: 0;
        margin-top: 2px;
    }

    .app-shell .table-toolbar > .table-search {
        width: 100%;
        height: 48px;
        min-height: 48px;
        border-radius: 12px;
        background: #fff;
    }

    .app-shell .table-toolbar:has(#contextCreateButton:not([hidden])) > .table-search {
        width: auto !important;
        margin-right: 90px;
    }

    .app-shell .table-actions {
        display: grid;
        grid-template-columns: minmax(0, .95fr) minmax(0, .78fr) minmax(0, 1.12fr);
        margin-top: 10px;
        padding: 0;
        align-items: center;
        gap: 7px;
        overflow: visible;
    }

    .app-shell .table-actions::-webkit-scrollbar {
        display: none;
    }

    .app-shell .table-actions :is(.button, .control-select, .table-search, .segmented) {
        height: 44px;
        max-height: 44px;
        min-height: 44px;
        border-radius: 11px;
    }

    .app-shell .table-actions .control-select {
        width: 100%;
        min-width: 0;
        padding-left: 12px;
        padding-right: 30px;
        background-color: #fff;
    }

    .app-shell .table-actions #columnButton {
        width: 100%;
        min-width: 0;
        padding: 0 8px;
        justify-content: center;
        background: #fff;
    }

    .app-shell .table-actions #tableViewToggle {
        flex: 0 0 82px;
        width: 82px;
    }

    .app-shell .table-actions .segmented {
        width: 100%;
        min-width: 0;
        padding: 3px;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .app-shell .table-actions .segmented .segment {
        min-width: 0;
        height: 36px;
        min-height: 36px;
        padding: 0 8px;
    }

    .app-shell .table-actions #contextCreateButton {
        position: absolute;
        top: 0;
        right: 0;
        z-index: 1;
        display: inline-flex;
        width: 82px;
        min-width: 82px;
        height: 48px;
        max-height: 48px;
        min-height: 48px;
        padding: 0 10px;
        align-items: center;
        justify-content: center;
        gap: 5px;
        overflow: hidden;
        font-size: 12px;
        font-weight: 600;
        line-height: 1;
        color: #fff;
        border-radius: 12px;
        box-shadow: 0 4px 12px rgba(31, 77, 77, .16);
    }

    .app-shell .table-actions #contextCreateButton[hidden] {
        display: none !important;
    }

    .app-shell .table-actions #contextCreateButton svg {
        width: 18px;
        height: 18px;
        color: #fff;
    }

    .app-shell .table-scroll,
    .app-shell :is(.record-panel, .table-frame, .admin-table-wrap) {
        min-width: 0;
        max-width: 100%;
    }

    .app-shell .table-scroll {
        overflow-x: auto;
        overscroll-behavior-x: contain;
        -webkit-overflow-scrolling: touch;
    }

    .app-shell .content.has-record-tabs .table-frame {
        margin-top: 6px;
        border-color: #dbe2de;
        border-radius: 12px;
        box-shadow: 0 4px 16px rgba(29, 53, 42, .045);
    }

    .app-shell .table-scroll table {
        min-width: 720px;
    }

    .app-shell .record-grid,
    .app-shell .record-grid.tenancy-hub-grid,
    .app-shell :is(.admin-form-grid, .agency-overview-form, .knowledge-hub-form-grid, .body-corporate-create-grid) {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .app-shell .record-content > .record-page-head {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr) auto;
        align-items: center;
        gap: 8px;
        width: 100%;
        min-height: 44px;
    }

    .app-shell .record-content > .record-page-head > .button,
    .app-shell .record-content > .record-page-head :is(.record-nav-actions, .opportunity-record-nav) .button {
        width: auto;
        min-width: 0;
        height: 40px;
        min-height: 40px;
        max-height: 40px;
        padding: 0 11px;
        white-space: nowrap;
    }

    .app-shell .record-content > .record-page-head :is(.record-nav-actions, .opportunity-record-actions, .opportunity-record-nav) {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        flex-direction: row;
        gap: 6px;
        min-width: 0;
    }

    .app-shell .record-content > .record-page-head > .message:not(:empty) {
        grid-column: 1 / -1;
        grid-row: 2;
        width: 100%;
    }

    .app-shell :is(.record-panel-head, .record-header, .record-toolbar, .knowledge-hub-header, .knowledge-hub-toolbar) {
        align-items: stretch;
        flex-direction: column;
    }

    .app-shell :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]), select, textarea, button, [role="button"]) {
        max-width: 100%;
    }

    .app-shell :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]), select) {
        min-height: 44px;
        font-size: 16px;
    }

    .app-shell textarea {
        font-size: 16px;
    }

    .app-shell .modal-backdrop,
    .app-shell .modal-overlay {
        padding: 6px;
    }

    .app-shell .modal,
    .app-shell .knowledge-hub-modal,
    .app-shell .body-corporate-create-modal,
    .app-shell .marketing-composer-modal {
        width: calc(100vw - 12px) !important;
        max-width: none !important;
        max-height: calc(100dvh - 12px) !important;
    }

    .app-shell .modal :is(.modal-head, .modal-body, .modal-foot) {
        padding-right: 14px;
        padding-left: 14px;
    }

    .app-shell .modal-foot {
        flex-wrap: wrap;
    }

    .app-shell .modal-foot .button {
        min-height: 44px;
    }

    .dashboard-metrics,
    .dashboard-metrics.five,
    .technology-grid,
    #opportunityMetrics.opportunity-dashboard-metrics {
        grid-template-columns: 1fr !important;
    }

    .dashboard-metric,
    .dashboard-metric:nth-child(n) {
        border-left: 0;
        border-top: 1px solid #e3e8e5;
    }

    .dashboard-metric:first-child {
        border-top: 0;
    }

    .mobile-tab-bar {
        position: fixed;
        inset: auto 0 0;
        z-index: 5100;
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        min-height: calc(58px + env(safe-area-inset-bottom));
        padding: 5px max(4px, env(safe-area-inset-right)) max(5px, env(safe-area-inset-bottom)) max(4px, env(safe-area-inset-left));
        border-top: 1px solid rgba(209, 218, 214, .9);
        background: rgba(255, 255, 255, .96);
        box-shadow: 0 -8px 24px rgba(28, 43, 36, .07);
        backdrop-filter: blur(18px) saturate(150%);
        -webkit-backdrop-filter: blur(18px) saturate(150%);
    }

    .mobile-tab-item {
        position: relative;
        display: flex;
        min-width: 0;
        min-height: 50px;
        padding: 4px 2px 3px;
        border: 0;
        border-radius: 9px;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        gap: 2px;
        background: transparent;
        color: #78847e;
        font: inherit;
        font-size: 9px;
        font-weight: 500;
        line-height: 1.1;
        cursor: pointer;
        touch-action: manipulation;
    }

    .mobile-tab-item:active {
        background: #f1f5f2;
        transform: scale(.96);
    }

    .mobile-tab-item.active {
        color: #278b4b;
    }

    .mobile-tab-icon {
        display: flex;
        width: 22px;
        height: 22px;
        align-items: center;
        justify-content: center;
    }

    .mobile-tab-icon svg {
        width: 21px;
        height: 21px;
    }

    .mobile-pull-refresh {
        position: fixed;
        top: max(8px, env(safe-area-inset-top));
        left: 50%;
        z-index: 5050;
        display: flex;
        min-height: 34px;
        padding: 7px 12px;
        border: 1px solid rgba(213, 222, 217, .95);
        border-radius: 999px;
        align-items: center;
        gap: 8px;
        background: rgba(255, 255, 255, .97);
        box-shadow: 0 8px 24px rgba(24, 40, 33, .14);
        color: #35453e;
        opacity: 0;
        pointer-events: none;
        transform: translate(-50%, calc(-54px + min(var(--mobile-pull-distance, 0px), 54px)));
        transition: opacity 140ms ease, transform 140ms ease;
    }

    body.mobile-pulling .mobile-pull-refresh {
        opacity: 1;
        transition: none;
    }

    body.mobile-refreshing .mobile-pull-refresh,
    body.mobile-refresh-complete .mobile-pull-refresh,
    body.mobile-refresh-error .mobile-pull-refresh {
        opacity: 1;
        transform: translate(-50%, 0);
        transition: opacity 160ms ease, transform 180ms ease;
    }

    .mobile-pull-refresh strong {
        font-size: 11px;
        font-weight: 500;
        white-space: nowrap;
    }

    .mobile-pull-refresh-spinner {
        width: 14px;
        height: 14px;
        transform: rotate(calc(min(var(--mobile-pull-distance, 0px), 80px) * 4));
    }

    .mobile-pull-refresh-spinner svg {
        width: 14px;
        height: 14px;
        color: #35a85b;
    }

    body.mobile-refreshing .mobile-pull-refresh-spinner {
        animation: mobile-refresh-spin 720ms linear infinite;
    }

    body.mobile-refresh-complete .mobile-pull-refresh-spinner svg {
        color: #278b4b;
    }

    body.mobile-refresh-error .mobile-pull-refresh-spinner svg {
        color: #c24f42;
    }

    @keyframes mobile-refresh-spin {
        to { transform: rotate(360deg); }
    }

    .app-shell :is(button, a, [role="button"]) {
        touch-action: manipulation;
    }
}

@media (max-width: 600px) and (prefers-reduced-motion: reduce) {
    .app-shell .sidebar {
        transition: none;
    }

    .mobile-tab-item:active {
        transform: none;
    }

    .mobile-pull-refresh,
    body.mobile-refreshing .mobile-pull-refresh-spinner {
        transition: none;
        animation: none;
    }
}

/* External portals v4 — a public-facing extension of Delegate. */
body.external-portal-active { background:#fff; }
body.external-portal-active .app-shell { display:block; min-height:100vh; background:#fff; }
body.external-portal-active .app-shell > .sidebar,
body.external-portal-active .mobile-nav-backdrop,
body.external-portal-active .mobile-tab-bar,
body.external-portal-active .mobile-pull-refresh { display:none !important; }
body.external-portal-active .app-shell > .main { width:100%; min-width:0; margin:0; padding:0; }
body.external-portal-active .app-shell > .main > .topbar { display:none; }
body.external-portal-active .app-shell > .main > .topbar:has(.impersonation-banner:not([hidden])) { position:fixed; z-index:7000; top:10px; right:12px; display:flex; min-height:0; width:auto; padding:0; border:0; background:transparent; box-shadow:none; }
body.external-portal-active .app-shell > .main > .topbar:has(.impersonation-banner:not([hidden])) > :not(.topbar-search-group) { display:none; }
body.external-portal-active .app-shell > .main > .topbar:has(.impersonation-banner:not([hidden])) .topbar-search-group { display:block; width:auto; }
body.external-portal-active .app-shell > .main > .topbar:has(.impersonation-banner:not([hidden])) .impersonation-banner { border:1px solid rgba(255,255,255,.24); background:#173f34; color:#fff; box-shadow:0 8px 24px rgba(12,35,28,.2); }
.portal-v4 { --portal-agency:#173f34; --portal-accent:#78d45b; background:#fff; color:#17211e; }
.portal-v4 .tenant-portal-main.portal-v4-main { max-width:1540px; padding:28px 32px 44px; }
.portal-product-bar { min-height:72px; padding:0 32px; display:flex; align-items:center; justify-content:space-between; gap:24px; color:#fff; background:color-mix(in srgb,var(--portal-agency) 82%,#071d17); }
.portal-product-brand,.portal-product-context,.portal-manager-mini { display:flex; align-items:center; gap:16px; }
.portal-product-brand img { width:154px; max-height:42px; object-fit:contain; filter:brightness(0) invert(1); }
.portal-product-brand span { padding-left:18px; border-left:1px solid rgba(255,255,255,.3); font-size:16px; font-weight:600; }
.portal-product-context { font-size:13px; }
.portal-manager-mini { padding-left:18px; border-left:1px solid rgba(255,255,255,.22); }
.portal-manager-mini > span,.portal-manager-mini > img { width:38px; height:38px; display:grid; place-items:center; overflow:hidden; border-radius:50%; background:#e8efeb; color:#173f34; }
.portal-manager-mini img { width:100%; height:100%; object-fit:cover; }
.portal-welcome { margin:0 0 18px; }
.portal-welcome h2 { margin:0; color:#17211e; font-size:30px; line-height:1.18; letter-spacing:-.035em; }
.portal-welcome p { margin:6px 0 0; color:#68736f; font-size:14px; }
.portal-v4-grid { display:grid; grid-template-columns:minmax(0,2.2fr) minmax(300px,.95fr); gap:26px; align-items:start; }
.portal-v4-primary,.portal-v4-rail { display:grid; gap:14px; min-width:0; }
.portal-priority { position:relative; min-height:292px; overflow:hidden; border-radius:10px; background:var(--portal-agency); background-image:linear-gradient(90deg,color-mix(in srgb,var(--portal-agency) 93%,#071d17) 0%,color-mix(in srgb,var(--portal-agency) 78%,transparent) 38%,rgba(8,32,25,.08) 72%),var(--portal-banner); background-size:cover; background-position:center; color:#fff; }
.portal-priority-content { width:min(540px,62%); padding:38px 36px; position:relative; z-index:1; }
.portal-priority-content > span { color:var(--portal-accent); font-size:11px; font-weight:700; letter-spacing:.055em; text-transform:uppercase; }
.portal-priority h3 { margin:12px 0 9px; font-size:30px; line-height:1.15; letter-spacing:-.025em; }
.portal-priority p { margin:0; max-width:450px; color:rgba(255,255,255,.82); font-size:14px; line-height:1.55; }
.portal-primary-action { min-width:198px; min-height:46px; margin-top:28px; padding:0 20px; display:inline-flex; align-items:center; justify-content:space-between; gap:24px; border:0; border-radius:5px; background:var(--portal-accent); color:#10261f; font:600 14px/1 Inter,sans-serif; cursor:pointer; }
.portal-primary-action svg { width:18px; }
.portal-clean-section { border:1px solid #e1e6e3; border-radius:10px; background:#fff; overflow:hidden; }
.portal-section-heading { min-height:54px; padding:14px 18px; display:flex; align-items:center; justify-content:space-between; gap:14px; border-bottom:1px solid #e8ece9; }
.portal-section-heading.is-stacked { display:block; }
.portal-section-heading h3 { margin:0; color:#17211e; font-size:16px; letter-spacing:-.01em; }
.portal-section-heading p { margin:3px 0 0; color:#6a7571; font-size:12px; }
.portal-section-heading button { border:0; background:transparent; color:#27634f; font:600 12px/1 Inter,sans-serif; cursor:pointer; }
.portal-command-v4 .portal-action-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; padding:14px; }
.portal-command-v4 .tenant-portal-action { min-width:0; min-height:168px; padding:18px 14px; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; gap:12px; border:1px solid #dfe5e1; border-radius:8px; background:#fff; color:#1c2b26; text-align:center; box-shadow:none; }
.portal-command-v4 .tenant-portal-action:hover { border-color:#92b4a7; background:#fbfdfc; transform:none; }
.portal-command-v4 .tenant-portal-action-icon { width:46px; height:46px; display:grid; place-items:center; border-radius:50%; background:#e8f3e5; color:#236047; }
.portal-command-v4 .tenant-portal-action-icon svg { width:23px; height:23px; }
.portal-command-v4 .tenant-portal-action-copy { display:flex; flex-direction:column; align-items:center; gap:5px; }
.portal-command-v4 .tenant-portal-action-copy strong { font-size:13px; font-weight:600; }
.portal-command-v4 .tenant-portal-action-copy span { color:#66716d; font-size:11px; line-height:1.4; }
.portal-command-v4 .tenant-portal-action-chevron { width:17px; height:17px; margin-top:auto; color:#2f765b; }
.portal-row-list { display:grid; }
.portal-activity-row,.portal-document-row { min-height:62px; padding:10px 16px; display:grid; grid-template-columns:36px minmax(0,1fr) auto 18px; gap:11px; align-items:center; border-bottom:1px solid #edf0ee; color:inherit; text-decoration:none; }
.portal-activity-row:last-child,.portal-document-row:last-child { border-bottom:0; }
.portal-row-icon { width:34px; height:34px; display:grid; place-items:center; border-radius:50%; background:#e9f3ec; color:#26724e; }
.portal-row-icon svg { width:16px; height:16px; }
.portal-activity-row > span:nth-child(2),.portal-document-row > span:nth-child(2) { display:grid; gap:2px; }
.portal-activity-row strong,.portal-document-row strong { font-size:12px; font-weight:600; }
.portal-activity-row small,.portal-document-row small,.portal-activity-row time { color:#747e7a; font-size:11px; }
.portal-activity-row > svg,.portal-document-row > svg { width:15px; }
.portal-empty-row { padding:22px 18px; color:#75807b; font-size:12px; }
.portal-agency-lockup { margin-left:auto; display:flex; align-items:center; gap:8px; }
.portal-agency-lockup > span { color:#7a8580; font-size:10px; white-space:nowrap; }
.portal-agency-lockup img { max-width:106px; max-height:34px; object-fit:contain; }
.portal-agency-lockup strong { font-size:12px; }
.portal-detail-list { padding:2px 18px 8px; }
.portal-detail-list .tenant-portal-ledger-row { min-height:43px; padding:9px 0; border-bottom:1px solid #e9edea; }
.portal-detail-list .tenant-portal-ledger-row:last-child { border-bottom:0; }
.portal-manager-profile { padding:16px 18px; display:flex; align-items:center; gap:12px; }
.portal-manager-avatar { width:52px; height:52px; display:grid; place-items:center; overflow:hidden; border-radius:8px; background:#e8efeb; }
.portal-manager-avatar img { width:100%; height:100%; object-fit:cover; }
.portal-manager-profile > span:last-child { display:grid; gap:4px; }
.portal-manager-profile strong { font-size:13px; }
.portal-manager-profile small { color:#69746f; font-size:11px; }
.portal-manager-links { padding:0 18px 12px; display:grid; gap:8px; }
.portal-manager-links a { color:#33423d; font-size:11px; text-decoration:none; overflow-wrap:anywhere; }
.portal-outline-action { min-height:40px; margin:0 18px 16px; display:flex; align-items:center; justify-content:center; border:1px solid #82a998; border-radius:6px; color:#235b46; font-size:12px; font-weight:600; text-decoration:none; }
.owner-v4-properties { padding:12px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.owner-v4-properties > button { min-width:0; padding:8px; display:grid; grid-template-columns:66px minmax(0,1fr) 18px; gap:10px; align-items:center; border:1px solid #e1e6e3; border-radius:7px; background:#fff; text-align:left; cursor:pointer; }
.owner-v4-properties .owner-portal-property-visual { width:66px; height:54px; min-height:54px; border-radius:5px; }
.owner-v4-properties .owner-portal-property-visual iframe { display:none; }
.owner-v4-properties > button > span { display:grid; gap:4px; }
.owner-v4-properties strong { font-size:12px; }
.owner-v4-properties small { color:#707a76; font-size:10px; }
.owner-v4-workspace .tenant-portal-tabbar { margin:0; padding:0 12px; border-bottom:1px solid #e4e9e6; overflow-x:auto; }
.owner-v4-workspace .tenant-portal-tab-panel { padding:12px; }
.owner-v4 .owner-portal-pulse { margin:0; border:1px solid #e1e6e3; border-radius:10px; background:#fff; box-shadow:none; }
.owner-v4 .owner-portal-pulse-grid { grid-template-columns:1fr; }
.owner-v4 .owner-portal-pulse-card { min-height:62px; border:0; border-top:1px solid #edf0ee; border-radius:0; background:#fff; }
.supplier-v4-layout { display:grid; grid-template-columns:minmax(250px,.78fr) minmax(460px,1.8fr) minmax(270px,.92fr); gap:14px; align-items:start; }
.supplier-v4-queue,.supplier-v4-job-detail { border:1px solid #e0e5e2; border-radius:9px; background:#fff; overflow:hidden; }
.supplier-v4-queue-head { min-height:56px; padding:0 16px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #e6ebe8; }
.supplier-v4-queue-head h3 { margin:0; font-size:15px; }
.supplier-v4-queue-head span { color:#6c7772; font-size:11px; }
.supplier-v4-job { width:100%; min-height:128px; padding:16px; display:grid; gap:5px; border:0; border-bottom:1px solid #e8ecea; background:#fff; color:#1d2925; text-align:left; cursor:pointer; }
.supplier-v4-job.active { background:#f4f8f6; box-shadow:inset 3px 0 #2f7d5a; }
.supplier-v4-job-status { color:#2e7958; font-size:10px; font-weight:700; text-transform:uppercase; }
.supplier-v4-job strong { font-size:13px; }
.supplier-v4-job b { font-size:11px; font-weight:600; }
.supplier-v4-job small,.supplier-v4-job > span:last-child { color:#6f7975; font-size:10px; }
.supplier-v4-job-detail > header { padding:18px 20px; display:flex; align-items:flex-start; justify-content:space-between; gap:20px; border-bottom:1px solid #e5eae7; }
.supplier-v4-job-detail header span,.supplier-v4-property span { color:#6f7975; font-size:10px; }
.supplier-v4-job-detail h2 { margin:5px 0; font-size:24px; }
.supplier-v4-job-detail header p { margin:0; color:#6f7975; font-size:11px; }
.supplier-v4-agency { display:grid; justify-items:end; gap:6px; }
.supplier-v4-agency img { max-width:130px; max-height:44px; object-fit:contain; }
.supplier-v4-property { padding:20px; border-bottom:1px solid #e5eae7; }
.supplier-v4-property h3 { margin:5px 0; font-size:16px; }
.supplier-v4-property p { margin:0; color:#65706b; font-size:12px; }
.supplier-v4-facts { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); padding:16px 20px; border-bottom:1px solid #e5eae7; }
.supplier-v4-facts > div { padding:0 14px; border-right:1px solid #e5eae7; }
.supplier-v4-facts > div:first-child { padding-left:0; }
.supplier-v4-facts > div:last-child { border-right:0; }
.supplier-v4-activity { padding:18px 20px; border-bottom:1px solid #e5eae7; }
.supplier-v4-activity h3,.supplier-v4-inline-forms h3 { margin:0 0 10px; font-size:14px; }
.supplier-v4-activity p { margin:0; color:#5f6b66; font-size:12px; line-height:1.55; }
.supplier-v4-inline-forms { padding:18px 20px; display:grid; gap:18px; }
.supplier-v4-inline-forms form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.supplier-v4-inline-forms h3,.supplier-v4-inline-forms .supplier-v4-form-actions,.supplier-v4-inline-forms .supplier-v4-decline,.supplier-v4-inline-forms button[type=submit] { grid-column:1/-1; }
.supplier-v4-inline-forms label { display:grid; gap:6px; color:#46524d; font-size:11px; font-weight:600; }
.supplier-v4-inline-forms input,.supplier-v4-inline-forms textarea { width:100%; border:1px solid #d9e0dc; border-radius:6px; padding:10px 11px; font:400 12px/1.4 Inter,sans-serif; }
.supplier-v4-form-actions { display:flex; gap:8px; }
.supplier-v4-decline { display:grid; gap:10px; padding:12px; background:#fff7f5; border:1px solid #efd8d1; border-radius:7px; }
.supplier-v4-rail { display:grid; gap:14px; }
.supplier-v4-rail .supplier-compliance-card { border:0; box-shadow:none; }
.supplier-v4-rail .agency-overview-field { padding:16px; }
.supplier-v4-rail textarea { min-height:96px; }
.supplier-licence-list { display:grid; }
.supplier-licence-row { min-height:62px; padding:11px 14px; display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:8px; align-items:center; border-bottom:1px solid #e8ecea; }
.supplier-licence-row > span:first-child { display:grid; gap:3px; }
.supplier-licence-row strong { font-size:11px; }
.supplier-licence-row small { color:#6d7773; font-size:9px; line-height:1.4; }
.supplier-licence-row a { color:#27634f; font-size:10px; font-weight:600; text-decoration:none; }
.supplier-licence-form { padding:14px; display:grid; grid-template-columns:1fr 1fr; gap:10px; border-top:1px solid #e4e9e6; }
.supplier-licence-form[hidden] { display:none; }
.supplier-licence-form label { display:grid; gap:5px; color:#4d5954; font-size:10px; font-weight:600; }
.supplier-licence-form input,.supplier-licence-form select { width:100%; min-height:38px; padding:8px 9px; border:1px solid #d9e0dc; border-radius:6px; background:#fff; font:400 11px/1.3 Inter,sans-serif; }
.supplier-licence-form .full { grid-column:1/-1; }
@media (max-width:1180px) { .portal-command-v4 .portal-action-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } .supplier-v4-layout { grid-template-columns:260px minmax(0,1fr); } .supplier-v4-rail { grid-column:1/-1; grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:860px) { .portal-product-bar { padding:0 18px; } .portal-product-context > span:first-child { display:none; } .portal-v4 .tenant-portal-main.portal-v4-main { padding:22px 18px 90px; } .portal-v4-grid { grid-template-columns:1fr; } .portal-v4-rail { grid-template-columns:repeat(2,minmax(0,1fr)); } .portal-documents { grid-column:1/-1; } .supplier-v4-layout { grid-template-columns:1fr; } .supplier-v4-queue { max-height:360px; overflow:auto; } .supplier-v4-rail { grid-column:auto; grid-template-columns:1fr 1fr; } }
@media (max-width:600px) { .portal-product-bar { min-height:58px; padding:0 14px; } .portal-product-brand img { width:108px; } .portal-product-brand span { padding-left:12px; font-size:13px; } .portal-manager-mini { display:none; } .portal-welcome h2 { font-size:25px; } .portal-priority { min-height:300px; background-image:linear-gradient(90deg,rgba(8,32,25,.94),rgba(8,32,25,.55)),var(--portal-banner); background-position:center; } .portal-priority-content { width:100%; padding:28px 24px; } .portal-priority h3 { font-size:27px; } .portal-command-v4 .portal-action-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; padding:10px; } .portal-command-v4 .tenant-portal-action { min-height:154px; padding:15px 10px; } .portal-v4-rail { grid-template-columns:1fr; } .portal-activity-row,.portal-document-row { grid-template-columns:34px minmax(0,1fr) 16px; } .portal-activity-row time { display:none; } .owner-v4-properties { grid-template-columns:1fr; } .owner-v4-workspace .tenant-portal-tabbar { display:flex; } .supplier-v4-rail { grid-template-columns:1fr; } .supplier-v4-facts { grid-template-columns:1fr 1fr; gap:14px; } .supplier-v4-facts > div { padding:0; border:0; } .supplier-v4-job-detail > header { display:grid; } .supplier-v4-agency { justify-items:start; } .supplier-v4-inline-forms form { grid-template-columns:1fr; } }
.portal-contract-table{width:100%;border-collapse:collapse;min-width:1050px;font-size:12px}.portal-contract-table th,.portal-contract-table td{padding:12px 14px;border-bottom:1px solid var(--border,#e5e7eb);text-align:left;vertical-align:top}.portal-contract-table th{color:#5f6765;font-size:10px;letter-spacing:.04em;text-transform:uppercase;background:#fafbfa}.portal-contract-table tbody tr:hover{background:#fafcfb}.sales-document-actions{margin-top:18px}.sales-document-actions .record-field-help{margin:0 0 14px;color:#66706d;font-size:13px;line-height:1.5}.record-action-buttons{display:flex;flex-wrap:wrap;gap:10px}
.sales-qr-dialog [data-sales-signin-poster-dialog]{margin-left:8px}.sales-link-actions [data-sales-signin-poster]{white-space:nowrap}

/* Site-wide record workspace rhythm: match the spacious Sales Property columns. */
@media (min-width: 921px) {
    .app-shell .record-content .record-grid > .record-panel > .record-panel-head:not(:has(:is(.side-tabs, .agency-middle-tabs, .contact-middle-tabs, .property-workspace-tabs))) {
        padding-right: 26px;
        padding-left: 26px;
    }

    .app-shell .record-content .record-grid > .record-panel > .record-panel-body {
        padding: 26px;
    }

    .app-shell .record-content .record-grid > .record-panel > .record-panel-head:has(:is(.side-tabs, .agency-middle-tabs, .contact-middle-tabs, .property-workspace-tabs)) {
        width: auto;
        height: auto;
        min-height: 46px;
        max-height: none;
        margin: 26px 26px 0;
        padding: 6px;
        border: 1px solid #e1e7e3;
        border-radius: 9px;
        background: #f3f6f4;
        box-shadow: inset 0 1px 1px rgba(29, 48, 39, .025);
    }

    .app-shell .record-content .record-grid > .record-panel > .record-panel-head:has(:is(.side-tabs, .agency-middle-tabs, .contact-middle-tabs, .property-workspace-tabs)) + .record-panel-body,
    .app-shell .record-content .record-grid > .record-panel > .record-panel-head:has(:is(.side-tabs, .agency-middle-tabs, .contact-middle-tabs, .property-workspace-tabs)) + .side-pane {
        padding-top: 14px;
    }

    /* Sales Property already has exact gallery and full-column scroll behaviour. */
    .app-shell .sales-property-record-grid #recordOverviewPanel > .record-panel-body {
        padding: 0 26px 26px;
    }

    .app-shell .sales-property-record-grid #recordActionsPanel > .record-panel-body {
        padding: 26px;
    }

    .app-shell .sales-property-record-grid #recordActionsPanel #recordActions {
        padding: 0;
    }
}

/* One collaboration column on every record page, matching the middle workspace tabs. */
.app-shell .record-content #recordSidePanel > .record-panel-head:has(.side-tabs) {
    width: auto;
    min-height: 46px;
    margin: 26px 26px 18px;
    padding: 6px;
    border: 1px solid #e1e7e3;
    border-radius: 9px;
    background: #f3f6f4;
    box-shadow: inset 0 1px 1px rgba(29, 48, 39, .025);
}

.app-shell .record-content #recordSidePanel > .record-panel-head > .side-tabs {
    display: flex;
    width: 100%;
    max-width: none;
    min-height: 32px;
    grid-template-columns: none;
    flex: 1 1 auto;
    align-items: center;
    justify-content: flex-start;
    gap: 2px;
    margin: 0;
    padding: 0;
    overflow-x: auto;
    overflow-y: hidden;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.app-shell .record-content #recordSidePanel > .record-panel-head > .side-tabs > .side-tab {
    display: inline-flex;
    width: auto;
    min-width: max-content;
    min-height: 32px;
    height: 32px;
    flex: 0 0 auto;
    padding: 0 10px;
    border: 1px solid transparent;
    border-radius: 6px;
    background: transparent;
    color: #56635d;
    font-family: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    font-size: 11px !important;
    font-weight: 550 !important;
    line-height: 1;
    box-shadow: none;
}

.app-shell .record-content #recordSidePanel > .record-panel-head > .side-tabs > .side-tab:hover {
    border-color: #dce4df;
    background: rgba(255, 255, 255, .72);
    color: #24483d;
}

.app-shell .record-content #recordSidePanel > .record-panel-head > .side-tabs > .side-tab.active,
.app-shell .record-content #recordSidePanel > .record-panel-head > .side-tabs > .side-tab[aria-selected="true"] {
    border-color: #d7e1dc;
    background: #fff;
    color: #173f35;
    font-weight: 650 !important;
    box-shadow: 0 1px 3px rgba(25, 54, 42, .09);
}

.app-shell .record-content #recordSidePanel > .record-panel-head > .side-tabs > .side-tab::after {
    display: none !important;
}

.app-shell .record-content #recordSidePanel > .side-pane {
    width: auto;
    margin: 0 26px 26px;
    padding: 0 !important;
}

@media (max-width: 920px) {
    .app-shell .record-content #recordSidePanel > .record-panel-head:has(.side-tabs) {
        margin: 14px 14px 12px;
        padding: 5px;
    }

    .app-shell .record-content #recordSidePanel > .side-pane {
        margin: 0 14px 14px;
    }
}

/* One polished segmented-tab language across Delegate. Metric cards remain distinct. */
.app-shell :is(
    .record-tabs:not(.metric-tabs),
    .side-tabs,
    .agency-middle-tabs,
    .contact-middle-tabs,
    .property-workspace-tabs,
    .sales-property-workspace-tabs,
    .settings-tabs,
    .admin-tabs,
    .marketing-product-tabs,
    .tenancy-hub-tabs,
    .tenant-portal-tabbar
) {
    min-height: 46px;
    padding: 6px;
    gap: 2px;
    border: 1px solid #e1e7e3;
    border-radius: 9px;
    background: #f3f6f4;
    box-shadow: inset 0 1px 1px rgba(29, 48, 39, .025);
}

.app-shell :is(
    .record-tabs:not(.metric-tabs) .record-tab,
    .side-tab,
    .agency-middle-tab,
    .contact-middle-tab,
    .property-workspace-tab,
    .sales-property-workspace-tabs > button,
    .settings-tab,
    .admin-tab,
    .marketing-product-tab,
    .tenancy-hub-tab,
    .tenant-portal-tab
) {
    min-height: 32px;
    height: 32px;
    padding: 0 10px;
    border: 1px solid transparent;
    border-radius: 6px;
    background: transparent;
    color: #56635d;
    font-size: 11px !important;
    font-weight: 550 !important;
    line-height: 1;
    box-shadow: none;
    transition: background-color .16s ease, border-color .16s ease, color .16s ease, box-shadow .16s ease;
}

.app-shell :is(
    .record-tabs:not(.metric-tabs) .record-tab,
    .side-tab,
    .agency-middle-tab,
    .contact-middle-tab,
    .property-workspace-tab,
    .sales-property-workspace-tabs > button,
    .settings-tab,
    .admin-tab,
    .marketing-product-tab,
    .tenancy-hub-tab,
    .tenant-portal-tab
):hover {
    border-color: #dce4df;
    background: rgba(255, 255, 255, .72);
    color: #24483d;
}

.app-shell :is(
    .record-tabs:not(.metric-tabs) .record-tab,
    .side-tab,
    .agency-middle-tab,
    .contact-middle-tab,
    .property-workspace-tab,
    .sales-property-workspace-tabs > button,
    .settings-tab,
    .admin-tab,
    .marketing-product-tab,
    .tenancy-hub-tab,
    .tenant-portal-tab
).active,
.app-shell :is(
    .record-tabs:not(.metric-tabs) .record-tab,
    .side-tab,
    .agency-middle-tab,
    .contact-middle-tab,
    .property-workspace-tab,
    .sales-property-workspace-tabs > button,
    .settings-tab,
    .admin-tab,
    .marketing-product-tab,
    .tenancy-hub-tab,
    .tenant-portal-tab
)[aria-selected="true"] {
    border-color: #d7e1dc;
    background: #fff;
    color: #173f35;
    font-weight: 650 !important;
    box-shadow: 0 1px 3px rgba(25, 54, 42, .09);
}

.app-shell :is(.sales-property-workspace-tabs > button, .property-workspace-tab, .side-tab).active::after {
    display: none !important;
}

@media (max-width: 920px) {
    .app-shell :is(
        .record-tabs:not(.metric-tabs),
        .side-tabs,
        .agency-middle-tabs,
        .contact-middle-tabs,
        .property-workspace-tabs,
        .sales-property-workspace-tabs,
        .settings-tabs,
        .admin-tabs
    ) {
        min-height: 44px;
        padding: 5px;
        overflow-x: auto;
    }
}

/* Property workspace was the remaining ID-scoped legacy tab variant. */
.app-shell .record-content #propertyWorkspaceTabs {
    position: static;
    top: auto;
    z-index: auto;
    width: 100%;
    min-height: 46px;
    margin: 0;
    padding: 6px !important;
    gap: 2px;
    border: 1px solid #e1e7e3;
    border-radius: 9px;
    background: #f3f6f4;
    box-shadow: inset 0 1px 1px rgba(29, 48, 39, .025);
}

.app-shell .record-content #propertyWorkspaceTabs .property-workspace-tab,
.app-shell .record-content #propertyWorkspaceTabs .property-workspace-tab.active {
    min-height: 32px;
    height: 32px;
    padding: 0 10px;
    border: 1px solid transparent;
    border-radius: 6px;
    background: transparent;
    color: #56635d;
    font-size: 11px !important;
    font-weight: 550 !important;
    box-shadow: none;
}

.app-shell .record-content #propertyWorkspaceTabs .property-workspace-tab:hover {
    border-color: #dce4df;
    background: rgba(255, 255, 255, .72);
    color: #24483d;
}

.app-shell .record-content #propertyWorkspaceTabs .property-workspace-tab.active,
.app-shell .record-content #propertyWorkspaceTabs .property-workspace-tab[aria-selected="true"] {
    border-color: #d7e1dc;
    background: #fff;
    color: #173f35;
    font-weight: 650 !important;
    box-shadow: 0 1px 3px rgba(25, 54, 42, .09);
}

.app-shell .record-content #propertyWorkspaceTabs .property-workspace-tab::after {
    display: none !important;
}

/* Record-column tab rhythm: the middle and collaboration columns share one explicit content gap. */
@media (min-width: 921px) {
    .app-shell .record-content #recordSidePanel > .record-panel-head:has(.side-tabs) {
        margin: 26px 26px 18px;
    }

    .app-shell .record-content #recordSidePanel > .side-pane {
        margin: 0 26px 26px;
        padding-top: 0;
    }

    /* Property Management tabs and content are siblings in the panel body. */
    .app-shell .record-content #recordActionsPanel > .record-panel-body > #propertyWorkspaceTabs:not([hidden]) + #recordActions {
        margin-top: 18px;
    }

    /* Sales supplies the same gap through its workspace pane padding. */
    .app-shell .record-content #recordActions > .sales-property-workspace-tabs + .sales-property-workspace-pane {
        margin-top: 0;
        padding-top: 10px;
    }
}

/* Clean tab surfaces: no inherited pale fill or hidden-tab spacing on Sales. */
.app-shell .sales-property-record-grid #recordActionsPanel #recordActions {
    margin-top: 0;
}

.app-shell :is(
    .record-tabs:not(.metric-tabs),
    #propertyWorkspaceTabs,
    .property-workspace-tabs,
    .sales-property-workspace-tabs,
    .settings-tabs,
    .admin-tabs,
    .marketing-product-tabs,
    .tenancy-hub-tabs,
    .tenant-portal-tabbar,
    .agency-settings-tabs,
    .user-record-side-tabs
),
.app-shell .record-content #recordSidePanel > .record-panel-head:has(.side-tabs) {
    background: transparent;
    box-shadow: none;
}

.app-shell .sales-property-record-grid .sales-property-workspace-pane {
    background: transparent;
}

/* Property and tenancy use the same transparent tab surface as Sales. */
.app-shell .record-content #propertyWorkspaceTabs {
    background: transparent !important;
    box-shadow: none !important;
}

/* Shared desktop three-column record geometry, based on the approved Property record. */
@media (min-width: 1251px) {
    .app-shell .record-content #recordGrid.record-grid {
        grid-template-columns: minmax(300px, 30%) minmax(500px, 1fr) minmax(300px, 29%);
        gap: 10px;
        align-items: start;
    }
}

/* Sales agreement typography follows the Property Details disclosure hierarchy. */
.app-shell .sales-property-record-grid .sales-agreement-compact > div:first-child > span {
    color: #1f2924;
    font-size: 11px !important;
    font-weight: 650 !important;
    line-height: 1.35;
    letter-spacing: normal;
    text-transform: none;
}

.app-shell .sales-property-record-grid .sales-agreement-compact > div:first-child > :is(strong, small) {
    font-size: 11px !important;
    font-weight: 400 !important;
    line-height: 1.4;
}

.app-shell .sales-property-record-grid .sales-agreement-compact {
    padding-left: 14px;
}

.app-shell .property-management-record-grid #recordOverview .property-manager-field {
    width: calc(50% - 5px);
    max-width: calc(50% - 5px);
}

/* Tenancy agreement progress uses the approved Sales agreement ring. */
.app-shell .tenancy-agreement-chart {
    display: grid;
    width: 64px;
    height: 64px;
    flex: 0 0 64px;
    place-items: center;
    border: 1px solid #dfe7e2;
    background: radial-gradient(circle at center, #fff 54%, transparent 57%), conic-gradient(var(--agreement-colour) var(--agreement-progress), #dfe7e2 0);
    box-shadow: 0 1px 4px rgba(20, 55, 39, .08);
}

.app-shell .tenancy-agreement-chart::before {
    display: none;
}

.app-shell .tenancy-agreement-chart strong {
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1;
}

.app-shell .tenancy-agreement-chart small {
    font-size: 7px !important;
    font-weight: 650 !important;
    line-height: 1;
    letter-spacing: 0;
}

.app-shell .tenancy-agreement-countdown {
    min-height: 68px;
}

@media (max-width: 800px) {
    .app-shell .property-management-record-grid #recordOverview .property-manager-field {
        width: 100%;
        max-width: none;
    }
}

/* Final shared property alignment and tab system. This intentionally wins over legacy tab variants. */
.app-shell .sales-property-record-grid #recordOverview {
    padding-right: 0;
    padding-left: 0;
}

.app-shell :is(
    .record-tabs:not(.metric-tabs),
    .property-workspace-tabs,
    .sales-property-workspace-tabs,
    .settings-tabs,
    .admin-tabs,
    .marketing-product-tabs,
    .tenancy-hub-tabs,
    .tenant-portal-tabbar,
    .agency-settings-tabs,
    .user-record-side-tabs
) {
    display: flex;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    min-height: 46px;
    align-items: center;
    gap: 2px;
    margin: 0;
    padding: 6px;
    box-sizing: border-box;
    overflow-x: auto;
    overflow-y: hidden;
    border: 1px solid #e1e7e3;
    border-radius: 9px;
    background: #f3f6f4;
    box-shadow: inset 0 1px 1px rgba(29, 48, 39, .025);
    scrollbar-width: thin;
}

.app-shell .record-panel-head > :is(.side-tabs, .agency-middle-tabs, .contact-middle-tabs, .property-workspace-tabs) {
    display: flex;
    width: 100%;
    max-width: none;
    min-height: 32px;
    flex: 1 1 auto;
    align-items: center;
    gap: 2px;
    margin: 0;
    padding: 0;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.app-shell :is(
    .record-tabs:not(.metric-tabs) .record-tab,
    .side-tab,
    .agency-middle-tab,
    .contact-middle-tab,
    .property-workspace-tab,
    .sales-property-workspace-tabs > button,
    .settings-tab,
    .admin-tab,
    .marketing-product-tab,
    .tenancy-hub-tab,
    .tenant-portal-tab,
    .agency-settings-tab,
    .user-record-side-tabs > button
) {
    position: relative;
    display: inline-flex;
    width: auto;
    min-width: max-content;
    min-height: 32px;
    height: 32px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 0 10px;
    border: 1px solid transparent;
    border-radius: 6px;
    background: transparent;
    color: #56635d;
    font-size: 11px !important;
    font-weight: 550 !important;
    line-height: 1;
    box-shadow: none;
    white-space: nowrap;
}

.app-shell :is(
    .record-tabs:not(.metric-tabs) .record-tab,
    .side-tab,
    .agency-middle-tab,
    .contact-middle-tab,
    .property-workspace-tab,
    .sales-property-workspace-tabs > button,
    .settings-tab,
    .admin-tab,
    .marketing-product-tab,
    .tenancy-hub-tab,
    .tenant-portal-tab,
    .agency-settings-tab,
    .user-record-side-tabs > button
):hover {
    border-color: #dce4df;
    background: rgba(255, 255, 255, .72);
    color: #24483d;
    box-shadow: none;
}

.app-shell :is(
    .record-tabs:not(.metric-tabs) .record-tab.active,
    .record-tabs:not(.metric-tabs) .record-tab[aria-selected="true"],
    .side-tab.active,
    .side-tab[aria-selected="true"],
    .agency-middle-tab.active,
    .agency-middle-tab[aria-selected="true"],
    .contact-middle-tab.active,
    .contact-middle-tab[aria-selected="true"],
    .property-workspace-tab.active,
    .property-workspace-tab[aria-selected="true"],
    .sales-property-workspace-tabs > button.active,
    .sales-property-workspace-tabs > button[aria-selected="true"],
    .settings-tab.active,
    .admin-tab.active,
    .marketing-product-tab.active,
    .tenancy-hub-tab.active,
    .tenant-portal-tab.active,
    .tenant-portal-tab[aria-selected="true"],
    .agency-settings-tab.active,
    .agency-settings-tab.is-active,
    .user-record-side-tabs > button.active
) {
    border: 1px solid #d7e1dc;
    border-radius: 6px;
    background: #fff;
    color: #173f35;
    font-weight: 650 !important;
    box-shadow: 0 1px 3px rgba(25, 54, 42, .09);
}

.app-shell :is(
    .record-tabs:not(.metric-tabs) .record-tab,
    .side-tab,
    .agency-middle-tab,
    .contact-middle-tab,
    .property-workspace-tab,
    .sales-property-workspace-tabs > button,
    .settings-tab,
    .admin-tab,
    .marketing-product-tab,
    .tenancy-hub-tab,
    .tenant-portal-tab,
    .agency-settings-tab,
    .user-record-side-tabs > button
)::after {
    display: none !important;
}

@media (max-width: 920px) {
    .app-shell :is(
        .record-tabs:not(.metric-tabs),
        .property-workspace-tabs,
        .sales-property-workspace-tabs,
        .settings-tabs,
        .admin-tabs,
        .marketing-product-tabs,
        .tenancy-hub-tabs,
        .tenant-portal-tabbar,
        .agency-settings-tabs,
        .user-record-side-tabs
    ) {
        min-height: 44px;
        padding: 5px;
    }
}
.property-address-editor{display:grid;gap:14px}.property-address-editor-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px}.property-address-editor-heading strong{font-size:13px;font-weight:600;color:var(--ink)}.property-address-editor-heading span{font-size:11px;line-height:1.45;color:var(--quiet);text-align:right}.property-location-editor{display:grid;gap:9px;margin-top:4px;padding-top:15px;border-top:1px solid var(--line)}.property-location-editor .address-lookup{display:block;width:100%}.property-location-editor .address-input-shell{width:100%}.property-location-editor .address-map{margin-top:10px;border-radius:10px;overflow:hidden}@media(max-width:760px){.property-address-editor-heading{align-items:flex-start;flex-direction:column;gap:3px}.property-address-editor-heading span{text-align:left}}
.property-features-editor{display:grid;gap:18px}.property-feature-selector{position:relative;display:grid;gap:8px}.property-feature-selector>label,.property-feature-other>h4{margin:0;color:#425048;font-size:10px;font-weight:650;letter-spacing:.01em}.property-feature-selected{display:flex;flex-wrap:wrap;gap:6px;min-height:24px;align-items:center}.property-feature-tag{display:inline-flex;align-items:center;gap:5px;min-height:26px;padding:4px 8px;border:1px solid #d7e0db;border-radius:999px;background:#f4f7f5;color:#26342d;font:inherit;font-size:10px;line-height:1;cursor:pointer}.property-feature-tag:hover{border-color:#aebdb5;background:#edf2ef}.property-feature-tag span{font-size:14px;line-height:.8;color:#66766e}.property-feature-empty{color:var(--quiet);font-size:10px}.property-feature-search-shell{display:flex;align-items:center;gap:7px;min-height:34px;padding:0 10px;border:1px solid #dfe5e2;border-radius:8px;background:#fff}.property-feature-search-shell:focus-within{border-color:#899b92;box-shadow:0 0 0 2px rgba(50,74,62,.08)}.property-feature-search-shell svg{width:14px;height:14px;color:#718078;flex:0 0 auto}.property-feature-search-shell input{width:100%;min-width:0!important;min-height:30px!important;padding:0!important;border:0!important;outline:0!important;box-shadow:none!important;background:transparent!important;font-size:11px!important}.property-feature-options{max-height:190px;overflow:auto;margin-top:-3px;padding:5px;border:1px solid #dfe5e2;border-radius:9px;background:#fff;box-shadow:0 10px 25px rgba(23,37,30,.1)}.property-feature-options button{display:flex;width:100%;align-items:center;justify-content:space-between;gap:10px;padding:8px;border:0;border-radius:6px;background:transparent;color:#26342d;font:inherit;font-size:10px;text-align:left;cursor:pointer}.property-feature-options button:hover{background:#f3f6f4}.property-feature-options button i{display:none;color:#2f6d4d;font-style:normal;font-weight:700}.property-feature-options button.selected{background:#edf5f0}.property-feature-options button.selected i{display:block}.property-feature-options p{margin:8px;color:var(--quiet);font-size:10px;text-align:center}.property-feature-other{display:grid;gap:8px;padding-top:15px;border-top:1px solid var(--line)}.property-feature-other .owner-info-group{display:grid;gap:9px}
.sales-contact-picker{display:grid;gap:6px;max-height:190px;overflow:auto;margin:0;padding:10px;border:1px solid var(--line);border-radius:9px}.sales-contact-picker legend{padding:0 5px;font-size:10px;font-weight:650;color:var(--quiet)}.sales-contact-picker>label{display:flex!important;align-items:flex-start;gap:8px;padding:7px;border-radius:7px;cursor:pointer}.sales-contact-picker>label:hover{background:#f5f7f6}.sales-contact-picker input{width:15px!important;min-height:15px!important;margin-top:2px}.sales-contact-picker span{display:grid;gap:2px}.sales-contact-picker strong{font-size:11px;font-weight:600}.sales-contact-picker small{font-size:9px;color:var(--quiet)}.sales-feedback-list{display:grid;gap:10px}.sales-feedback-list>article{display:grid;grid-template-columns:minmax(130px,.8fr) minmax(110px,.55fr) minmax(220px,1.5fr) minmax(125px,.65fr) auto;align-items:end;gap:10px;padding:12px;border:1px solid var(--line);border-radius:10px;background:#fff}.sales-feedback-list>article>div{display:grid;gap:3px;align-self:center}.sales-feedback-list>article>div strong{font-size:11px}.sales-feedback-list>article>div span{font-size:9px;color:var(--quiet)}.sales-feedback-list label{display:grid;gap:5px;font-size:9px;font-weight:600;color:var(--quiet)}.sales-feedback-list :is(select,textarea){width:100%;border:1px solid var(--line);border-radius:7px;background:#fff;font:inherit;font-size:10px;padding:7px}.sales-enquiry-table article{grid-template-columns:minmax(170px,1.2fr) 90px 115px 135px minmax(180px,1fr) auto!important}@media(max-width:900px){.sales-feedback-list>article,.sales-enquiry-table article{grid-template-columns:1fr!important}.sales-contact-picker{max-height:150px}}
.sales-offer-condition-grid{display:grid;grid-template-columns:auto 1fr auto 1fr;align-items:center;gap:8px}.sales-offer-condition-grid label{display:flex!important;align-items:center;gap:6px;white-space:nowrap}.sales-offer-condition-grid label input{width:15px!important;min-height:15px!important}.sales-offer-condition-grid>input{width:100%;min-width:0}@media(max-width:700px){.sales-offer-condition-grid{grid-template-columns:1fr}.sales-offer-condition-grid label{white-space:normal}}
.sales-journey{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;margin:0 0 18px;padding:16px 18px;border:1px solid #e1e6e4;border-radius:14px;background:#fff}.sales-journey>div{display:flex;align-items:center;gap:10px;position:relative;min-width:0}.sales-journey>div:not(:last-child)::after{content:"";height:2px;background:#e1e6e4;position:absolute;left:calc(100% - 12px);right:12px;top:16px}.sales-journey>div>span{display:grid;place-items:center;width:32px;height:32px;flex:0 0 32px;border-radius:50%;background:#eef1f0;color:#65706c;font-size:12px;font-weight:700;z-index:1}.sales-journey>div.complete>span{background:#dff3e5;color:#247044}.sales-journey>div.active>span{background:#173f3b;color:#fff}.sales-journey div div{display:grid;min-width:0}.sales-journey strong{font-size:13px;color:#1c2926}.sales-journey small{font-size:11px;color:#74807c;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sales-package-summary,.sales-floorplan-summary{display:grid;gap:4px;margin-top:12px;padding:14px 16px;border:1px solid #e1e6e4;border-radius:12px;background:#f8faf9}.sales-package-summary span,.sales-floorplan-summary span{font-size:12px;color:#66736f}.sales-package-summary p{margin:4px 0 0;white-space:pre-line;font-size:13px;color:#34413d}.property-floorplan-upload{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:10px 0 0;padding:11px 14px;border:1px dashed #cdd7d3;border-radius:10px;background:#f8faf9;cursor:pointer}.property-floorplan-upload input{display:none}.property-floorplan-upload strong{font-size:13px}.property-floorplan-upload span{font-size:11px;color:#6b7773}.agency-sales-settings-grid{display:grid;gap:18px}.agency-sales-setting-section{padding:20px}.agency-sales-setting-section>.sales-section-heading{margin-bottom:16px}.agency-sales-setting-section>div:last-child{display:grid;gap:14px}.agency-sales-setting-card{padding:18px}.agency-sales-setting-card .admin-panel-actions{justify-content:flex-end;margin-top:14px}@media(max-width:900px){.sales-journey{grid-template-columns:1fr;gap:10px}.sales-journey>div:not(:last-child)::after{display:none}}
/* Tribunal & Disputes workspace */
.dispute-workspace-tabs{display:flex;gap:4px;overflow-x:auto;margin:-2px 0 20px;padding:0 0 10px;border-bottom:1px solid #e6e8e7;scrollbar-width:none}.dispute-workspace-tabs::-webkit-scrollbar{display:none}.dispute-workspace-tabs button{appearance:none;border:0;background:transparent;color:#626b67;font:600 13px/1 Inter,sans-serif;padding:10px 12px;border-radius:8px;white-space:nowrap;cursor:pointer}.dispute-workspace-tabs button:hover{background:#f5f7f6;color:#171b19}.dispute-workspace-tabs button.active{background:#edf3ff;color:#0b4eb8}.dispute-builder{padding-bottom:20px}.dispute-path{display:grid;grid-template-columns:repeat(6,minmax(86px,1fr));gap:0;margin:22px 0 18px;counter-reset:step}.dispute-path span{position:relative;padding:31px 8px 0;text-align:center;color:#717975;font:500 11px/1.3 Inter,sans-serif}.dispute-path span:before{counter-increment:step;content:counter(step);position:absolute;z-index:2;top:0;left:50%;display:grid;place-items:center;width:24px;height:24px;transform:translateX(-50%);border:2px solid #d9dddb;border-radius:50%;background:#fff;color:#68706d;font-weight:700}.dispute-path span:after{content:"";position:absolute;top:12px;left:-50%;width:100%;height:2px;background:#e1e4e2}.dispute-path span:first-child:after{display:none}.dispute-path span.done:before{content:"✓";border-color:#16855b;background:#16855b;color:#fff}.dispute-path span.done:after{background:#16855b}.dispute-path span.current:before{border-color:#1459c7;color:#1459c7;box-shadow:0 0 0 4px #e7effc}.dispute-pathway{display:grid;gap:5px;padding:14px 16px;border:1px solid #b8cdf0;border-radius:9px;background:#f6f9ff;color:#243957}.dispute-pathway strong{font:650 13px/1.3 Inter,sans-serif}.dispute-pathway span{font:400 12px/1.5 Inter,sans-serif}.dispute-pathway.complete{border-color:#b9decf;background:#f4fbf8;color:#245343}.dispute-pathway.attention{border-color:#f0d199;background:#fffaf1;color:#654912}.dispute-bundle-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:16px;overflow:hidden;border:1px solid #e1e4e2;border-radius:9px;background:#e1e4e2}.dispute-bundle-summary div{display:grid;gap:3px;padding:14px;background:#fff}.dispute-bundle-summary strong{font:650 13px/1.25 Inter,sans-serif;color:#1b211e}.dispute-bundle-summary span{font:400 11px/1.4 Inter,sans-serif;color:#68716d}.dispute-knowledge{display:grid;gap:18px;margin-top:18px;padding:18px;border:1px solid #e0e3e1;border-radius:10px;background:#fff}.dispute-knowledge>div{display:grid;gap:6px}.dispute-knowledge strong{font:650 13px/1.3 Inter,sans-serif;color:#1b211e}.dispute-knowledge span,.dispute-knowledge li,.dispute-knowledge blockquote{font:400 12px/1.5 Inter,sans-serif;color:#59625e}.dispute-knowledge ul{display:grid;gap:8px;margin:4px 0 0;padding:0;list-style:none}.dispute-knowledge li{display:grid;gap:2px;padding-top:8px;border-top:1px solid #edf0ee}.dispute-knowledge li strong{font-size:12px}.dispute-knowledge blockquote{margin:4px 0 0;padding:10px 12px;border:1px solid #e5e8e6;border-radius:8px;background:#f8f9f8}.dispute-knowledge small{color:#7b837f;font:400 11px/1.5 Inter,sans-serif}
@media(max-width:900px){.dispute-path{grid-template-columns:repeat(3,1fr);row-gap:18px}.dispute-path span:nth-child(4):after{display:none}.dispute-bundle-summary{grid-template-columns:1fr}.dispute-workspace-tabs{margin-top:0}}
.tenancy-dispute-action{display:flex;align-items:center;justify-content:space-between;gap:20px}.tenancy-dispute-action h3{margin:0 0 5px}.tenancy-dispute-action p{margin:0;color:#68716d;font:400 12px/1.5 Inter,sans-serif}.tenancy-dispute-action .button{flex:0 0 auto}@media(max-width:640px){.tenancy-dispute-action{align-items:stretch;flex-direction:column}}