/* Notices page — extracted Phase 4 (notices.blade.php + run strip) */

            .np-shell { display: flex; flex-direction: column; gap: 16px; }
            .np-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
            .np-title { margin: 0; color: var(--lv-text-primary, #1f2937); font-size: 28px; line-height: 1.1; font-weight: 800; }
            .np-subtitle { margin: 6px 0 0; color: var(--lv-text-muted, #6b7280); font-size: 13px; }
            .np-new { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 38px; padding: 0 14px; border: 0; border-radius: 8px; background: var(--lv-primary, #245c3b); color: #fff; font-size: 13px; font-weight: 800; cursor: pointer; white-space: nowrap; }
            .np-new:hover { background: var(--lv-primary-dark, #17442b); }

            .np-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
            .np-metric { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: 10px; min-height: 86px; padding: 12px; border: 1px solid var(--lv-border-light, #e5e7eb); border-radius: 8px; background: var(--lv-bg-card, #fff); color: var(--lv-text-primary, #1f2937); text-align: left; box-shadow: 0 1px 2px rgba(15, 23, 42, .03); cursor: pointer; }
            .np-metric:hover { border-color: var(--lv-border, #d1d5db); box-shadow: 0 6px 18px rgba(15, 23, 42, .06); }
            .np-metric.is-active { border-color: var(--lv-primary, #245c3b); box-shadow: 0 0 0 3px rgba(36, 92, 59, .11); }
            .np-metric-icon { display: inline-flex; width: 38px; height: 38px; align-items: center; justify-content: center; border-radius: 8px; background: var(--lv-bg-muted, #f8fafc); }
            .np-metric-icon svg { width: 18px; height: 18px; }
            .np-metric-label { display: block; color: var(--lv-text-primary, #1f2937); font-size: 13px; line-height: 1.2; font-weight: 800; }
            .np-metric-helper { display: block; margin-top: 3px; color: var(--lv-text-muted, #6b7280); font-size: 11.5px; line-height: 1.25; }
            .np-metric-count { color: var(--lv-text-primary, #111827); font-size: 26px; line-height: 1; font-weight: 850; }
            .np-tone-amber .np-metric-icon { background: #fff7ed; color: #b45309; }
            .np-tone-blue .np-metric-icon { background: #eff6ff; color: #2563eb; }
            .np-tone-teal .np-metric-icon { background: #f0fdfa; color: #0f766e; }
            .np-tone-red .np-metric-icon { background: #fef2f2; color: #dc2626; }
            .np-tone-gray .np-metric-icon { background: #f3f4f6; color: #4b5563; }
            .np-print-work { display: grid; gap: 12px; padding: 14px; border: 1px solid var(--lv-border, #ded9cf); border-radius: 12px; background: #fff; box-shadow: var(--lv-shadow-card, 0 8px 24px rgba(36,32,24,.05)); }
            .np-print-work-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
            .np-print-work-title { margin: 0; color: var(--lv-text-primary, #111827); font-size: 15px; font-weight: 850; }
            .np-print-work-sub { margin: 4px 0 0; color: var(--lv-text-muted, #6b7280); font-size: 12px; line-height: 1.4; max-width: 560px; }
            .np-print-work-ctas { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
            /* Keep the print board from stretching the whole Notices page */
            .np-print-work-scroll {
                max-height: min(38vh, 360px);
                overflow-y: auto;
                overflow-x: hidden;
                padding-right: 4px;
                margin-right: -2px;
                scrollbar-gutter: stable;
            }
            .np-print-work-scroll::-webkit-scrollbar { width: 8px; }
            .np-print-work-scroll::-webkit-scrollbar-thumb { background: #d1d5db; border-radius: 999px; }
            .np-section-title { color: var(--lv-text-primary, #111827); font-size: 13px; font-weight: 850; }
            .np-section-label { margin: 0 0 8px; color: var(--lv-text-faint, #9ca3af); font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; position: sticky; top: 0; z-index: 1; background: #fff; padding: 2px 0 6px; }
            /* Print is the primary cockpit; serve sits below as a quieter phase */
            .np-print-lanes {
                display: grid;
                grid-template-columns: 1fr;
                gap: 14px;
                align-items: start;
            }
            .np-print-lane { min-width: 0; display: grid; gap: 8px; }
            .np-print-lane.is-serve-phase { gap: 6px; }
            .np-print-grid { display: grid; grid-template-columns: 1fr; gap: 8px; }
            @media (min-width: 900px) {
                .np-print-grid.is-multi {
                    grid-template-columns: repeat(2, minmax(0, 1fr));
                }
            }
            .np-print-card { display: grid; gap: 8px; padding: 10px 12px; border: 1px solid var(--lv-border-light, #e5e7eb); border-radius: 8px; background: #fff; box-shadow: 0 1px 2px rgba(15, 23, 42, .03); }
            /* Serve cards are quieter than print-ready â€” secondary phase, not panic */
            .np-print-card.is-serve {
                border-color: #e5e7eb;
                background: #fafafa;
                box-shadow: none;
            }
            /* Single-notice packets: denser, less empty slab */
            .np-print-card.is-compact { gap: 6px; padding: 8px 10px; }
            .np-print-card.is-compact .np-print-count { min-width: 38px; padding: 4px 6px; font-size: 14px; }
            .np-print-card.is-compact .np-print-preview { display: none; } /* tenant already in head meta for compact */
            .np-print-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
            .np-print-title { color: var(--lv-text-primary, #111827); font-size: 13px; font-weight: 850; line-height: 1.2; }
            .np-print-meta { margin-top: 2px; color: var(--lv-text-muted, #6b7280); font-size: 11px; line-height: 1.35; }
            .np-print-count { min-width: 42px; border-radius: 8px; background: #eef7f1; color: var(--lv-primary, #245c3b); padding: 5px 6px; text-align: center; font-size: 16px; line-height: 1; font-weight: 850; flex: 0 0 auto; }
            .np-print-count.is-serve { background: #f3f4f6; color: #4b5563; }
            .np-print-count span { display: block; margin-top: 2px; font-size: 9px; letter-spacing: .04em; text-transform: uppercase; }
            .np-print-preview { display: grid; gap: 3px; color: var(--lv-text-secondary, #374151); font-size: 11px; max-height: 4.5em; overflow: hidden; }
            .np-print-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
            .np-print-more { position: relative; margin-left: auto; }
            .np-print-more-btn {
                border: 0; background: transparent; color: var(--lv-text-muted, #6b7280);
                font-size: 11.5px; font-weight: 750; cursor: pointer; padding: 4px 2px;
                text-decoration: underline; text-underline-offset: 2px;
            }
            .np-print-more-btn:hover { color: var(--lv-text-primary, #111827); }
            .np-print-more-menu {
                position: absolute; right: 0; bottom: calc(100% + 4px); z-index: 20; min-width: 180px;
                padding: 4px; border: 1px solid var(--lv-border-light, #e5e7eb); border-radius: 8px;
                background: #fff; box-shadow: 0 10px 24px rgba(15, 23, 42, .12);
            }
            .np-print-more-menu button {
                display: block; width: 100%; border: 0; border-radius: 6px; background: transparent;
                padding: 8px 10px; color: var(--lv-text-secondary, #374151); text-align: left;
                font-size: 12px; font-weight: 650; cursor: pointer;
            }
            .np-print-more-menu button:hover { background: #f8fafc; }
            .np-print-status { display: inline-flex; align-items: center; min-height: 22px; border-radius: 999px; padding: 0 8px; background: #f3f4f6; color: #4b5563; font-size: 10.5px; font-weight: 850; text-transform: uppercase; }
            .np-print-status.is-ready { background: #dbeafe; color: #1d4ed8; }
            .np-print-status.is-printed { background: #e5e7eb; color: #4b5563; }
            .np-print-empty { padding: 18px; border: 1px dashed var(--lv-border, #d1d5db); border-radius: 8px; background: var(--lv-bg-muted, #f8fafc); text-align: center; color: var(--lv-text-muted, #6b7280); font-size: 12.5px; line-height: 1.45; }
            .np-print-empty strong { display: block; color: var(--lv-text-primary, #111827); font-size: 13px; margin-bottom: 4px; }
            /* Collapsed serve summary â€” later phase after print */
            .np-serve-summary {
                display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 14px;
                padding: 10px 12px; border: 1px solid #e5e7eb; border-radius: 8px; background: #f9fafb;
            }
            .np-serve-summary-main { display: grid; gap: 2px; min-width: 0; }
            .np-serve-summary-title { color: var(--lv-text-primary, #111827); font-size: 13px; font-weight: 800; line-height: 1.25; }
            .np-serve-summary-copy { color: var(--lv-text-muted, #6b7280); font-size: 11.5px; line-height: 1.4; max-width: 480px; }
            .np-serve-summary-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
            .np-serve-chip {
                display: inline-flex; align-items: center; gap: 6px; min-height: 26px;
                padding: 0 10px; border-radius: 999px; background: #eef2ff; color: #4338ca;
                font-size: 11.5px; font-weight: 750;
            }
            .np-button-quiet {
                border: 1px solid var(--lv-border, #d1d5db) !important;
                background: #fff !important;
                color: var(--lv-text-secondary, #374151) !important;
            }
            .np-button-quiet:hover { background: #f8fafc !important; }
            .np-service-list { display: grid; gap: 8px; }
            .np-service-group { display: grid; gap: 6px; }
            .np-service-group-label {
                margin: 4px 0 0; color: var(--lv-text-faint, #9ca3af); font-size: 10px; font-weight: 800;
                letter-spacing: .05em; text-transform: uppercase;
            }
            .np-service-row { display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 8px; padding: 9px; border: 1px solid var(--lv-border-light, #e5e7eb); border-radius: 8px; }
            .np-service-row-title { color: var(--lv-text-primary, #111827); font-size: 12.5px; font-weight: 850; }
            .np-service-row-meta { color: var(--lv-text-muted, #6b7280); font-size: 11px; }
            .np-service-row input[type="text"] { width: 100%; height: 32px; margin-top: 7px; border: 1px solid var(--lv-border, #d1d5db); border-radius: 7px; padding: 0 9px; font-size: 12px; }

            .np-controls { display: grid; gap: 10px; padding: 12px; border: 1px solid var(--lv-border-light, #e5e7eb); border-radius: 8px; background: var(--lv-bg-card, #fff); }
            .np-control-label { color: var(--lv-text-muted, #6b7280); font-size: 10.5px; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
            .np-filter-row { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 12px; align-items: center; }
            .np-type-filter { display: grid; gap: 7px; }
            .np-tabs { display: flex; flex-wrap: wrap; gap: 6px; }
            .np-tab { border: 1px solid transparent; border-radius: 999px; padding: 6px 10px; background: var(--lv-bg-muted, #f8fafc); color: var(--lv-text-muted, #6b7280); font-size: 12px; font-weight: 750; cursor: pointer; }
            .np-tab:hover { background: #eef2f0; color: var(--lv-text-secondary, #374151); }
            .np-tab.is-active { border-color: var(--lv-primary, #245c3b); background: var(--lv-info-light, #ecfdf5); color: var(--lv-primary, #245c3b); }
            .np-clear { border: 0; background: transparent; color: var(--lv-text-muted, #6b7280); font-size: 12px; font-weight: 750; cursor: pointer; }
            .np-search { position: relative; }
            .np-search input { width: 100%; height: 36px; border: 1px solid var(--lv-border, #d1d5db); border-radius: 8px; background: #fff; padding: 0 12px 0 34px; color: var(--lv-text-primary, #1f2937); font-size: 13px; outline: none; }
            .np-search input:focus { border-color: var(--lv-primary, #245c3b); box-shadow: 0 0 0 3px rgba(36, 92, 59, .12); }
            .np-search svg { position: absolute; left: 11px; top: 10px; width: 16px; height: 16px; color: var(--lv-text-faint, #9ca3af); }
            .np-bulk { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 10px; border-radius: 8px; background: #f8fafc; color: var(--lv-text-secondary, #374151); }
            .np-bulk-text { font-size: 12px; font-weight: 800; }
            .np-bulk-actions { display: flex; flex-wrap: wrap; gap: 8px; }
            .np-small-button { min-height: 30px; border: 1px solid var(--lv-border, #d1d5db); border-radius: 7px; background: #fff; padding: 0 10px; color: var(--lv-text-primary, #1f2937); font-size: 12px; font-weight: 800; cursor: pointer; }
            .np-small-button.primary { border-color: var(--lv-primary, #245c3b); background: var(--lv-primary, #245c3b); color: #fff; }

            .np-icon-button { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border: 1px solid var(--lv-border-light, #e5e7eb); border-radius: 7px; background: #fff; color: var(--lv-text-secondary, #374151); text-decoration: none; cursor: pointer; }
            .np-icon-button:hover { border-color: var(--lv-border, #d1d5db); background: #f8fafc; }
            .np-icon-button.is-disabled { opacity: .42; pointer-events: none; }
            /* Matches .lv-modal__panel: warm border, 24px radius, LV shadow. */
            .np-modal-backdrop { position: fixed; inset: 0; z-index: 50; display: grid; place-items: center; padding: 20px; background: rgba(28, 27, 24, .48); }
            .np-modal {
                width: min(640px, 100%); max-height: calc(100vh - 40px); overflow: auto;
                border: 1px solid var(--lv-border, #E2DED8);
                border-radius: var(--lv-radius-2xl, 16px);
                background: var(--lv-bg-card, #fff);
                box-shadow: 0 24px 64px rgba(28, 27, 24, .22);
                font-family: var(--lv-font-body, 'DM Sans', sans-serif);
            }
            .np-modal.is-wide { width: min(880px, 100%); }
            .np-modal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 18px 20px; border-bottom: 1px solid var(--lv-border-light, #F0EEEA); }
            .np-modal-title { margin: 0; color: var(--lv-text-primary, #1C1B18); font-size: 17px; font-weight: 800; font-family: var(--lv-font-display, 'DM Sans', sans-serif); letter-spacing: -.01em; }
            .np-modal-copy { margin: 4px 0 0; color: var(--lv-text-secondary, #635E54); font-size: 12.5px; line-height: 1.45; }
            .np-modal-body { padding: 18px 20px; }
            .np-modal-search { position: relative; margin-bottom: 14px; }
            .np-modal-search input { width: 100%; height: 36px; border: 1px solid var(--lv-border, #d1d5db); border-radius: 8px; background: #fff; padding: 0 10px 0 34px; color: var(--lv-text-primary, #1f2937); font-size: 13px; outline: none; }
            .np-modal-search input:focus { border-color: var(--lv-primary, #245c3b); box-shadow: 0 0 0 3px rgba(36, 92, 59, .12); }
            .np-modal-search svg { position: absolute; left: 11px; top: 10px; width: 16px; height: 16px; color: var(--lv-text-faint, #9ca3af); pointer-events: none; }
            .np-modal-search-clear { position: absolute; right: 10px; top: 8px; border: 0; background: transparent; color: var(--lv-text-muted, #6b7280); font-size: 17px; line-height: 1; cursor: pointer; padding: 0 2px; }
            .np-template-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 8px; }
            .np-template-row { display: flex; flex-direction: column; gap: 10px; justify-content: space-between; padding: 12px; border: 1px solid var(--lv-border-light, #e5e7eb); border-radius: 8px; background: #fff; }
            .np-template-row:hover { border-color: var(--lv-border, #d1d5db); box-shadow: 0 2px 8px rgba(15, 23, 42, .05); }
            .np-template-name { color: var(--lv-text-primary, #111827); font-size: 13px; font-weight: 850; line-height: 1.25; }
            .np-template-meta { margin-top: 3px; color: var(--lv-text-muted, #6b7280); font-size: 11.5px; line-height: 1.35; }
            .np-modal-form { display: grid; gap: 12px; }
            .np-field { display: grid; gap: 6px; }
            .np-field label { color: var(--lv-text-secondary, #374151); font-size: 11.5px; font-weight: 800; }
            .np-field select, .np-field input { height: 38px; border: 1px solid var(--lv-border, #d1d5db); border-radius: 8px; background: #fff; padding: 0 10px; color: var(--lv-text-primary, #1f2937); font-size: 13px; }
            .np-modal-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px; align-items: center; }
            .np-spinner {
                width: 22px; height: 22px; border-radius: 999px;
                border: 2.5px solid #e5e7eb; border-top-color: var(--lv-primary, #245c3b);
                animation: np-spin .7s linear infinite;
            }
            @keyframes np-spin { to { transform: rotate(360deg); } }
            .np-busy-row {
                display: flex; flex-direction: column; align-items: center; justify-content: center;
                gap: 10px; padding: 36px 16px; color: #6b7280; font-size: 13px;
            }
            .np-commit-overlay {
                position: absolute; inset: 0; z-index: 6;
                display: none;
                flex-direction: column; align-items: center; justify-content: center;
                gap: 10px; padding: 24px;
                background: rgba(255, 255, 255, .82);
                border-radius: 10px;
                color: #374151; font-size: 13px; font-weight: 650;
                text-align: center;
            }
            .np-commit-shell { position: relative; }
            .np-commit-shell.is-dimmed { opacity: .45; pointer-events: none; user-select: none; }
            button:disabled, .np-small-button:disabled, .np-icon-button:disabled, select:disabled {
                opacity: .55; cursor: not-allowed; pointer-events: none;
            }

            .np-table-wrap { overflow: hidden; border: 1px solid var(--lv-border-light, #e5e7eb); border-radius: 8px; background: var(--lv-bg-card, #fff); }
            .np-table-scroll { overflow-x: auto; }
            .np-table { width: 100%; border-collapse: collapse; font-size: 13px; }
            .np-table thead { background: #f8fafc; border-bottom: 1px solid var(--lv-border-light, #e5e7eb); }
            .np-table th { padding: 10px 12px; color: var(--lv-text-muted, #6b7280); font-size: 10.5px; font-weight: 850; letter-spacing: .04em; text-align: left; text-transform: uppercase; white-space: nowrap; }
            .np-table td { padding: 12px; border-top: 1px solid var(--lv-border-light, #eef2f7); vertical-align: top; }
            .np-table tbody tr:hover { background: #fbfdfb; }
            .np-table tbody tr.is-selected { background: rgba(36, 92, 59, .05); }
            .np-check { width: 32px; }
            .np-tenant { color: var(--lv-text-primary, #111827); font-weight: 850; line-height: 1.25; }
            .np-muted { color: var(--lv-text-muted, #6b7280); font-size: 11.5px; line-height: 1.35; }
            .np-title-cell { max-width: 340px; }
            .np-notice-title { overflow: hidden; color: var(--lv-text-primary, #111827); font-weight: 800; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
            .np-chip { display: inline-flex; align-items: center; gap: 5px; min-height: 24px; border-radius: 999px; padding: 0 8px; background: #f3f4f6; color: #4b5563; font-size: 11px; font-weight: 800; white-space: nowrap; }
            .np-status { border-radius: 999px; padding: 4px 8px; font-size: 11px; font-weight: 850; white-space: nowrap; }
            .np-deadline { color: var(--lv-text-primary, #1f2937); font-weight: 800; white-space: nowrap; }
            .np-next { display: block; margin-top: 3px; color: var(--lv-text-faint, #9ca3af); font-size: 10.5px; font-weight: 700; }
            .np-event { display: block; margin-top: 2px; color: var(--lv-text-muted, #6b7280); font-size: 11px; }
            .np-primary-cta {
                display: inline-flex; align-items: center; min-height: 28px; padding: 0 9px;
                border-radius: 7px; border: 1px solid transparent; font-size: 11px; font-weight: 800;
                text-decoration: none; white-space: nowrap; cursor: pointer;
            }
            .np-primary-cta.tone-blue { background: #eff6ff; color: #1d4ed8; border-color: #bfdbfe; }
            .np-primary-cta.tone-teal { background: #f0fdfa; color: #0f766e; border-color: #99f6e4; }
            .np-primary-cta.tone-purple { background: #f5f3ff; color: #6d28d9; border-color: #ddd6fe; }
            .np-primary-cta.tone-amber { background: #fff7ed; color: #b45309; border-color: #fed7aa; }
            .np-primary-cta.tone-red { background: #fef2f2; color: #b91c1c; border-color: #fecaca; }
            .np-row-actions { display: flex; align-items: center; justify-content: flex-end; gap: 6px; flex-wrap: wrap; }
            .np-more { position: relative; }
            .np-more-btn {
                width: 30px; height: 30px; border: 1px solid var(--lv-border-light, #e5e7eb); border-radius: 7px;
                background: #fff; color: var(--lv-text-muted, #6b7280); display: inline-flex; align-items: center;
                justify-content: center; cursor: pointer;
            }
            .np-more-btn:hover { background: #f8fafc; }
            /* Fixed so table overflow doesn't clip; position set by Alpine placeMenu(). */
            .np-more-menu {
                position: fixed; z-index: 80; min-width: 168px;
                padding: 4px; border: 1px solid var(--lv-border-light, #e5e7eb); border-radius: 8px;
                background: #fff; box-shadow: 0 12px 28px rgba(15, 23, 42, .14);
            }
            .np-more-menu a, .np-more-menu button {
                display: block; width: 100%; border: 0; border-radius: 6px; background: transparent;
                padding: 8px 10px; color: var(--lv-text-secondary, #374151); text-align: left;
                font-size: 12px; font-weight: 650; cursor: pointer; text-decoration: none;
            }
            .np-more-menu a:hover, .np-more-menu button:hover { background: #f8fafc; }
            .np-view-toggle { display: inline-flex; gap: 4px; padding: 3px; border: 1px solid var(--lv-border-light, #e5e7eb); border-radius: 10px; background: #f8fafc; }
            .np-view-toggle button {
                border: 0; border-radius: 7px; padding: 7px 12px; background: transparent;
                color: var(--lv-text-muted, #6b7280); font-size: 12px; font-weight: 750; cursor: pointer;
            }
            .np-view-toggle button.is-active {
                background: #fff; color: var(--lv-primary, #245c3b); box-shadow: 0 1px 2px rgba(15, 23, 42, .08);
            }
            .np-empty { display: grid; place-items: center; min-height: 260px; border: 1px dashed var(--lv-border, #d1d5db); border-radius: 8px; background: #fff; text-align: center; }
            .np-empty-inner { max-width: 420px; padding: 24px; }
            .np-empty-icon { display: inline-flex; width: 44px; height: 44px; align-items: center; justify-content: center; border-radius: 10px; background: #eef7f1; color: var(--lv-primary, #245c3b); }
            .np-empty-title { margin: 12px 0 4px; color: var(--lv-text-primary, #111827); font-size: 16px; font-weight: 850; }
            .np-empty-copy { margin: 0; color: var(--lv-text-muted, #6b7280); font-size: 13px; line-height: 1.45; }
            .np-pagination { padding-top: 4px; }

            @media (max-width: 1100px) {
                .np-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
                .np-filter-row { grid-template-columns: 1fr; }
            }

            @media (max-width: 640px) {
                .np-header { flex-direction: column; }
                .np-new { width: 100%; }
                .np-metrics { grid-template-columns: 1fr; }
                .np-bulk { align-items: flex-start; flex-direction: column; }
            }
        

/* ── Today's run ────────────────────────────────────────────────────────────
   A single dense bar, not a card. This is a page a manager opens every
   morning: the explanatory prose and the tall stepper card were onboarding
   copy paid for daily in vertical space. What's left is state + one button. */
                .np-run {
                    display: flex; align-items: center; justify-content: space-between;
                    flex-wrap: wrap; gap: 10px 18px;
                    padding: 10px 14px; border: 1px solid var(--lv-border, #ded9cf);
                    border-left: 3px solid var(--lv-primary, #245c3b);
                    border-radius: 10px; background: #fff;
                    box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
                }
                .np-run--print { border-left-color: #2563eb; }
                .np-run--serve { border-left-color: #4f46e5; }
                .np-run--idle  { border-left-color: #d1d5db; background: #fcfcfb; }
                .np-run-main { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px; min-width: 0; }
                .np-run-eyebrow {
                    font-size: 10px; font-weight: 850; letter-spacing: .06em;
                    text-transform: uppercase; color: #9ca3af; white-space: nowrap;
                }

                .np-run-steps { display: flex; align-items: center; gap: 0; flex-wrap: wrap; margin: 0; padding: 0; list-style: none; }
                .np-run-step { display: flex; align-items: center; gap: 6px; }
                /* Connector drawn as a pseudo-element so markup stays a clean <ol>. */
                .np-run-step + .np-run-step::before {
                    content: ""; width: 20px; height: 2px; background: #e5e7eb; margin: 0 8px;
                }
                .np-run-step.is-active ~ .np-run-step::before,
                .np-run-step.is-active::before { background: #e5e7eb; }
                .np-run-dot {
                    width: 19px; height: 19px; border-radius: 999px;
                    display: inline-flex; align-items: center; justify-content: center;
                    font-size: 10px; font-weight: 850;
                    border: 2px solid #d1d5db; color: #9ca3af; background: #fff;
                    flex: 0 0 auto;
                }
                .np-run-dot svg { width: 11px; height: 11px; }
                .np-run-step.is-active .np-run-dot { border-color: var(--lv-primary, #245c3b); background: var(--lv-primary, #245c3b); color: #fff; }
                .np-run-step.is-done .np-run-dot { border-color: #a7f3d0; background: #ecfdf5; color: #15803d; }
                .np-run-step.is-done + .np-run-step::before { background: #a7f3d0; }
                .np-run-step-label { font-size: 12px; font-weight: 750; color: #9ca3af; white-space: nowrap; }
                .np-run-step.is-active .np-run-step-label { color: #111827; font-weight: 850; }
                .np-run-step.is-done .np-run-step-label { color: #6b7280; }

/* Idle: no run in flight, so starting one is the primary job of the page.
   Given real weight instead of a small button on the right rail. */
                .np-run-start {
                    display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
                    padding: 18px 20px;
                    border: 1px solid var(--lv-border, #ded9cf);
                    border-radius: 12px;
                    background: linear-gradient(180deg, #fbfdfb 0%, #fff 100%);
                    box-shadow: var(--lv-shadow-card, 0 8px 24px rgba(36,32,24,.05));
                }
                .np-run-start-icon {
                    display: inline-flex; align-items: center; justify-content: center;
                    width: 44px; height: 44px; flex: 0 0 auto;
                    border-radius: 11px; background: #eef7f1; color: var(--lv-primary, #245c3b);
                }
                .np-run-start-icon svg { width: 22px; height: 22px; }
                .np-run-start-text { flex: 1 1 260px; min-width: 0; }
                .np-run-start-title { margin: 0; font-size: 16px; font-weight: 850; color: #111827; line-height: 1.25; }
                .np-run-start-sub { margin: 3px 0 0; font-size: 12.5px; color: #6b7280; line-height: 1.45; max-width: 60ch; }
                .np-cta-lg {
                    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
                    min-height: 44px; padding: 0 22px; flex: 0 0 auto;
                    border: 0; border-radius: 10px;
                    background: var(--lv-primary, #245c3b); color: #fff;
                    font-size: 14px; font-weight: 800; cursor: pointer; white-space: nowrap;
                    box-shadow: 0 1px 2px rgba(15, 23, 42, .12);
                }
                .np-cta-lg:hover { background: var(--lv-primary-dark, #17442b); }
                .np-cta-lg:disabled { opacity: .6; cursor: not-allowed; }

                @media (max-width: 640px) {
                    .np-run-start { align-items: flex-start; }
                    .np-cta-lg { width: 100%; }
                }

/* ── Print-run review (wizard) ─────────────────────────────────────────────
   Rebuilt on LV tokens. The wizard was styled with Tailwind cool greys
   (#d1d5db / #6b7280 / #111827) against LV's warm stone palette
   (#E2DED8 / #635E54 / #1C1B18) — same shapes, wrong colour temperature,
   which is what made it read as "not part of the app". */
                .np-rr-fields { display: grid; gap: 9px; }
                .np-rr-row { display: flex; flex-wrap: wrap; gap: 9px 12px; align-items: flex-end; }
                .np-rr-field { display: grid; gap: 4px; min-width: 0; }
                .np-rr-field--full { flex: 1 1 100%; }
                .np-rr-field > span {
                    display: inline-flex; align-items: center; gap: 8px;
                    font-size: 10.5px; font-weight: 800; letter-spacing: .04em;
                    text-transform: uppercase; color: var(--lv-text-muted, #9A9488);
                }
                /* Mirrors .lv-lgr-select, including the LV chevron in --lv-text-muted. */
                .np-rr-control {
                    width: 100%; height: 38px;
                    border: 1px solid var(--lv-border, #E2DED8);
                    border-radius: var(--lv-radius-lg, 10px);
                    background-color: var(--lv-bg-card, #fff);
                    padding: 0 12px;
                    color: var(--lv-text-primary, #1C1B18);
                    font-family: var(--lv-font-body, 'DM Sans', sans-serif);
                    font-size: 13.5px; font-weight: 600;
                }
                .np-rr-control:focus {
                    outline: none;
                    border-color: var(--lv-primary, #2B5A3B);
                    box-shadow: 0 0 0 3px rgba(43, 90, 59, .12);
                }
                .np-rr-control:disabled { background: var(--lv-bg-muted, #F0EEEA); color: var(--lv-text-muted, #9A9488); }
                select.np-rr-control {
                    appearance: none; -webkit-appearance: none; -moz-appearance: none;
                    padding-right: 34px;
                    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%239A9488' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
                    background-repeat: no-repeat;
                    background-position: right 13px center;
                }
                .np-rr-hint { margin: 0; font-size: 12px; line-height: 1.45; color: var(--lv-text-secondary, #635E54); }
                .np-rr-hint strong { color: var(--lv-text-primary, #1C1B18); font-weight: 700; }


                .np-sr-only {
                    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
                    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
                }
                .np-run-review-bar {
                    display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px;
                    padding: 9px 12px; margin-bottom: 8px;
                    border: 1px solid var(--lv-border-light, #F0EEEA);
                    border-radius: var(--lv-radius-lg, 10px);
                    background: var(--lv-bg-muted, #F0EEEA);
                }
                .np-run-review-count { font-size: 12.5px; color: var(--lv-text-secondary, #635E54); }
                .np-run-review-count strong { color: var(--lv-text-primary, #1C1B18); font-weight: 800; }
                .np-run-review-total {
                    margin-left: 8px; padding-left: 11px;
                    border-left: 1px solid var(--lv-border, #E2DED8);
                    font-variant-numeric: tabular-nums; font-weight: 800;
                    color: var(--lv-text-primary, #1C1B18);
                }
                .np-run-review-warn {
                    display: inline-flex; align-items: center; min-height: 22px;
                    padding: 0 10px; border-radius: var(--lv-radius-full, 999px);
                    background: var(--lv-warning-light, #FFF9EA);
                    border: 1px solid var(--lv-warning-border, #EDD99A);
                    color: var(--lv-warning, #A67B0A);
                    font-size: 11.5px; font-weight: 700; cursor: help;
                }
                .np-run-review-select { margin-left: auto; display: flex; align-items: center; gap: 6px; color: var(--lv-border, #E2DED8); }
                .np-run-review-select button {
                    border: 0; background: transparent; padding: 2px;
                    color: var(--lv-primary, #2B5A3B); font-size: 12px; font-weight: 800; cursor: pointer;
                }
                .np-run-review-select button:hover { text-decoration: underline; }
                .np-run-review-select button:disabled { opacity: .5; cursor: not-allowed; text-decoration: none; }
                /* Small balance: flagged, never blocked. */
                .np-run-low { color: var(--lv-warning, #A67B0A); cursor: help; border-bottom: 1px dotted var(--lv-warning-border, #EDD99A); }

                /* Review table: fixed column budget so Tenant stops hogging half
                   the modal while Status and Past due get squeezed at the edge. */
                .np-rr-scroll {
                    max-height: min(360px, 34vh); overflow: auto;
                    border: 1px solid var(--lv-border, #E2DED8);
                    border-radius: var(--lv-radius-lg, 10px);
                }
                .np-run-review-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 12.5px; }
                .np-run-review-table thead { position: sticky; top: 0; z-index: 1; background: var(--lv-bg-muted, #F0EEEA); }
                .np-run-review-table th {
                    padding: 8px 10px; text-align: left; font-size: 10px; font-weight: 800;
                    letter-spacing: .05em; text-transform: uppercase;
                    color: var(--lv-text-muted, #9A9488);
                    border-bottom: 1px solid var(--lv-border, #E2DED8); white-space: nowrap;
                }
                .np-run-review-table td { padding: 7px 10px; vertical-align: middle; border-top: 1px solid var(--lv-border-light, #F0EEEA); }
                .np-run-review-table tbody tr:hover { background: var(--lv-bg-page, #F6F5F2); }
                .np-run-review-table tbody tr.is-off { background: var(--lv-bg-page, #F6F5F2); }
                .np-run-review-table tbody tr.is-off td { opacity: .5; }
                .np-run-review-table tbody tr.is-off .np-rr-check { opacity: 1; }

                .np-rr-check { width: 36px; text-align: center; }
                .np-rr-check input { width: 15px; height: 15px; accent-color: var(--lv-primary, #2B5A3B); }
                .np-rr-prop { width: 32%; }
                .np-rr-notice { width: 160px; }
                /* Status keeps badge + aging bucket on ONE line: two stacked lines
                   pushed rows to 61px, which is a lot of scrolling at 29 rows. */
                .np-rr-status { width: 168px; white-space: nowrap; }
                .np-rr-bucket { margin-left: 6px; font-size: 10.5px; font-weight: 700; color: #9ca3af; }
                .np-rr-amt { width: 104px; text-align: right; }

                .np-rr-name, .np-rr-sub {
                    display: block; max-width: 100%;
                    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
                }
                .np-rr-name { font-weight: 700; color: var(--lv-text-primary, #1C1B18); }
                .np-rr-sub { color: var(--lv-text-secondary, #635E54); font-size: 11.5px; }
                .np-rr-detail { margin-top: 1px; font-size: 10.5px; color: var(--lv-text-muted, #9A9488); }
                .np-rr-money { font-variant-numeric: tabular-nums; font-weight: 800; color: var(--lv-text-primary, #1C1B18); white-space: nowrap; }
                .np-rr-frozen { font-weight: 600; color: var(--lv-text-muted, #9A9488); }

                /* Badges on the LV semantic palette, not Tailwind's — "Create" in
                   raw blue also read as a link you could click. */
                .np-rr-badge {
                    display: inline-block; max-width: 100%;
                    padding: 2px 9px; border-radius: var(--lv-radius-full, 999px);
                    border: 1px solid transparent;
                    font-size: 10.5px; font-weight: 700; white-space: nowrap;
                    overflow: hidden; text-overflow: ellipsis;
                }
                .np-rr-badge.is-new     { background: var(--lv-info-light, #EDF3FA); border-color: var(--lv-info-border, #B3CDE6); color: var(--lv-info, #34689A); }
                .np-rr-badge.is-ready   { background: var(--lv-success-light, #ECF5F0); border-color: var(--lv-success-border, #B3DAC2); color: var(--lv-success, #27724A); }
                .np-rr-badge.is-refresh { background: var(--lv-warning-light, #FFF9EA); border-color: var(--lv-warning-border, #EDD99A); color: var(--lv-warning, #A67B0A); }
                .np-rr-badge.is-paid    { background: var(--lv-danger-light, #FEF1ED); border-color: var(--lv-danger-border, #F3C1B4); color: var(--lv-danger, #BE3A1B); }
                .np-rr-badge.is-muted   { background: var(--lv-neutral-light, #F0EEEA); border-color: var(--lv-border, #E2DED8); color: var(--lv-text-secondary, #635E54); }
                .np-rr-bucket { color: var(--lv-text-muted, #9A9488); }

                .np-run-detail { font-size: 12px; color: #6b7280; min-width: 0; }
                .np-run-cta { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
                .np-button-serve { background: #4f46e5 !important; border-color: #4f46e5 !important; }

                /* Packets: a quiet popover off the bar, never a stack of cards. */
                .np-run-details { position: relative; }
                .np-run-details summary {
                    cursor: pointer; font-size: 12px; font-weight: 750; color: #6b7280;
                    list-style: none; padding: 6px 8px; border-radius: 7px; white-space: nowrap;
                }
                .np-run-details summary:hover { background: #f8fafc; color: #111827; }
                .np-run-details summary::-webkit-details-marker { display: none; }
                .np-run-details[open] summary { background: #f3f4f6; color: #111827; }
                .np-run-packet-list {
                    position: absolute; right: 0; top: calc(100% + 6px); z-index: 30;
                    display: grid; gap: 6px; min-width: 300px; max-height: 320px; overflow-y: auto;
                    padding: 8px; border: 1px solid #e5e7eb; border-radius: 10px; background: #fff;
                    box-shadow: 0 12px 28px rgba(15, 23, 42, .14);
                }
                .np-run-packet-row { display: flex; justify-content: space-between; gap: 10px; align-items: center; padding: 7px 9px; border-radius: 8px; background: #f9fafb; font-size: 12px; }

                @media (max-width: 860px) {
                    .np-run { align-items: stretch; }
                    .np-run-cta { width: 100%; }
                    .np-run-packet-list { right: auto; left: 0; }
                }
            

/* Phase 4: segmented stage filter + dense rows */
/* Chips + tools wrap when they must. Tools are NOT pushed right with
   margin-left:auto — on a wrapped second row that left a dead band across the
   card. Flowing them straight after the chips reads as one toolbar either way,
   and no stage is ever hidden behind a scrollbar. */
.np-stage-bar {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px;
  padding: 8px 10px; border: 1px solid var(--lv-border, #ded9cf); border-radius: 12px;
  background: #fff; box-shadow: var(--lv-shadow-card, 0 8px 24px rgba(36,32,24,.05));
}
.np-stage-seg {
  display: flex; flex-wrap: wrap; gap: 2px; padding: 3px;
  border: 1px solid #e5e7eb; border-radius: 10px; background: #f8fafc;
}
.np-stage-seg button {
  border: 0; border-radius: 7px; padding: 6px 9px; background: transparent;
  color: #6b7280; font-size: 12px; font-weight: 750; cursor: pointer; white-space: nowrap;
}
.np-stage-seg button:hover { color: #374151; background: rgba(255,255,255,.7); }
.np-stage-seg button.is-active {
  background: #fff; color: var(--lv-primary, #245c3b);
  box-shadow: 0 1px 2px rgba(15, 23, 42, .08);
}
.np-stage-count {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 18px; margin-left: 4px; padding: 0 5px; border-radius: 999px;
  background: #e5e7eb; color: #4b5563; font-size: 10.5px; font-weight: 800;
}
.np-stage-seg button.is-active .np-stage-count {
  background: #e8f3ec; color: var(--lv-primary, #245c3b);
}
/* Kept narrow so the filter tools sit on the same line as the stage segments
   at normal widths instead of wrapping to a second row of chrome. */
.np-stage-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; flex: 1 1 auto; }
.np-stage-tools .np-search { min-width: 168px; flex: 1 1 168px; max-width: 260px; }
.np-history-toggle {
  display: inline-flex; align-items: center; gap: 2px; height: 34px;
  padding: 0 10px; border: 1px solid transparent; border-radius: 8px;
  background: transparent; color: #6b7280;
  font-size: 12px; font-weight: 750; cursor: pointer; white-space: nowrap;
}
.np-history-toggle:hover { background: #f8fafc; color: #111827; }
.np-history-toggle.is-active {
  border-color: var(--lv-primary, #245c3b); background: #fff;
  color: var(--lv-primary, #245c3b);
}

@media (max-width: 860px) {
  .np-stage-tools { width: 100%; }
  .np-stage-tools .np-search { max-width: none; }
}
/* Reset the native control so the admin theme's chevron is the only one drawn.
   Without appearance:none the UA arrow stacks on the themed background arrow. */
.np-type-select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  height: 34px; border: 1px solid #d1d5db; border-radius: 8px;
  padding: 0 28px 0 9px; font-size: 12px; font-weight: 700; color: #374151; min-width: 118px;
  background-color: #fff;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%236b7280' stroke-width='2'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 9px center;
  background-size: 14px 14px;
}
.np-type-select::-ms-expand { display: none; }
/* Dense queue uses fixed layout: with table-layout:auto a max-width on a <td>
   is only a hint, so long notice titles widened the column and overran Stage
   and Due. Fixed columns + per-cell ellipsis keeps every row on one line. */
.np-table.is-dense { table-layout: fixed; width: 100%; }
.np-table.is-dense th { padding: 7px 10px; }
.np-table.is-dense td { padding: 7px 10px; vertical-align: middle; }
.np-table.is-dense tbody tr { height: 56px; }
.np-table.is-dense .np-tenant { font-size: 13px; }
.np-table.is-dense .np-muted, .np-table.is-dense .np-event { font-size: 11px; }
.np-table.is-dense .np-primary-cta { min-height: 26px; padding: 0 8px; font-size: 11px; }
.np-table.is-dense .np-status { padding: 2px 7px; font-size: 10.5px; }

/* Column budget: Tenant / Notice (flex) / Amount / Stage / Due / Actions */
.np-table.is-dense th:nth-child(1), .np-table.is-dense td:nth-child(1) { width: 21%; }
.np-table.is-dense th:nth-child(3), .np-table.is-dense td:nth-child(3) { width: 104px; }
.np-table.is-dense th:nth-child(4), .np-table.is-dense td:nth-child(4) { width: 148px; }
.np-table.is-dense th:nth-child(5), .np-table.is-dense td:nth-child(5) { width: 92px; }
.np-table.is-dense th:nth-child(6), .np-table.is-dense td:nth-child(6) { width: 116px; }

/* .np-notice-title is an <a> — inline boxes ignore overflow/text-overflow,
   so it must be block-level for the ellipsis to render. */
.np-table.is-dense .np-title-cell { max-width: none; }
.np-table.is-dense .np-notice-title,
.np-table.is-dense .np-tenant,
.np-table.is-dense .np-title-cell .np-muted,
.np-table.is-dense td:nth-child(1) .np-muted {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Amount — the number a landlord scans for. Tabular figures so decimals line up. */
.np-num { text-align: right; }
.np-amount {
  font-variant-numeric: tabular-nums;
  font-weight: 800; color: #111827; white-space: nowrap; font-size: 12.5px;
}

/* Due urgency: a passed statutory deadline must not read as muted grey. */
.np-deadline.is-past  { color: #b91c1c; }
.np-deadline.is-today { color: #b45309; }
.np-due-note { font-size: 11px; line-height: 1.35; color: var(--lv-text-muted, #6b7280); }
.np-due-note.is-past  { color: #b91c1c; font-weight: 800; }
.np-due-note.is-today { color: #b45309; font-weight: 800; }

/* Whole row opens the case; the action cell opts out via x-on:click.stop. */
.np-row-link { cursor: pointer; }
.np-row-link:focus-within { background: #f5faf7; }
/* Stage badge must not force its column wider than the budget. */
.np-table.is-dense .np-status {
  display: inline-block; max-width: 100%;
  overflow: hidden; text-overflow: ellipsis; vertical-align: middle;
}