:root {
    --pulse-blue: #0064d2;
    --pulse-blue-dark: #0d1437;
    --pulse-gold: #f5af02;
    --pulse-teal: #008996;
    --pulse-orange: #ed8b00;
    --pulse-bg: #f4f6fb;
    --pulse-card: #ffffff;
    --pulse-text: #21243d;
    --pulse-muted: #757575;
    --pulse-border: #dde3ef;
    --pulse-shadow: 10px 0 24px rgba(0, 0, 0, 0.08);
    /* Narrower rail keeps more horizontal room for the workspace; the flex
       workspace column expands to fill whatever space the sidebar frees. */
    --pulse-sidebar: 200px;
}

/* ==========================================================================
   Pulse Operations · Courier package-owner detail

   A page-scoped, read-only record layout: one identity surface, one compliance
   surface, and the warehouse history. These selectors intentionally avoid the
   shared setup detail primitives so other customer and courier pages retain
   their existing layouts.
   ========================================================================== */
@media screen {
    .pulse-operations .package-owner-heading__context {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 7px;
        margin-top: 7px;
        color: var(--ifc-muted);
    }

    .pulse-operations .package-owner-heading__courier,
    .pulse-operations .package-owner-summary__courier {
        color: var(--ifc-green);
        font-weight: 760;
        text-decoration: none;
    }

    .pulse-operations .package-owner-heading__courier:hover,
    .pulse-operations .package-owner-summary__courier:hover {
        color: var(--ifc-green-dark);
        text-decoration: underline;
        text-underline-offset: 3px;
    }

    .pulse-operations .package-owner-heading__separator {
        color: #a08f76;
    }

    .pulse-operations .package-owner-detail {
        gap: 20px;
    }

    .pulse-operations .package-owner-detail__top {
        display: grid;
        grid-template-columns: minmax(0, 3fr) minmax(240px, 1fr);
        gap: 20px;
        align-items: start;
    }

    .pulse-operations .package-owner-summary,
    .pulse-operations .package-owner-compliance__card,
    .pulse-operations .package-owner-history {
        border: 1px solid var(--ifc-sand);
        border-radius: 16px;
        background: var(--ifc-paper);
        box-shadow: 0 9px 24px rgba(73, 61, 43, 0.065);
    }

    .pulse-operations .package-owner-summary {
        min-width: 0;
        padding: 26px 28px 0;
    }

    .pulse-operations .package-owner-summary__header {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 20px;
        margin-bottom: 17px;
    }

    .pulse-operations .package-owner-summary__header .eyebrow,
    .pulse-operations .package-owner-compliance__card > .eyebrow,
    .pulse-operations .package-owner-history__header .eyebrow,
    .pulse-operations .package-owner-summary__notes .eyebrow {
        margin: 0 0 6px;
        color: var(--ifc-green);
        font-size: 11px;
        font-weight: 850;
        letter-spacing: 0.11em;
        text-transform: uppercase;
    }

    .pulse-operations .package-owner-summary__header h2,
    .pulse-operations .package-owner-compliance__card h2,
    .pulse-operations .package-owner-history__header h2 {
        margin: 0;
        color: var(--ifc-charcoal);
        font-size: 20px;
        font-weight: 820;
        letter-spacing: -0.015em;
        line-height: 1.2;
    }

    .pulse-operations .package-owner-summary__initials {
        display: grid;
        place-items: center;
        width: 44px;
        height: 44px;
        flex: 0 0 44px;
        border: 1px solid rgba(193, 138, 43, 0.2);
        border-radius: 12px;
        background: var(--ifc-gold-soft);
        color: var(--ifc-gold-dark);
        font-size: 15px;
        font-weight: 850;
        letter-spacing: 0.03em;
    }

    .pulse-operations .package-owner-summary__details {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 36px;
        margin: 0;
    }

    .pulse-operations .package-owner-summary__item {
        display: grid;
        grid-template-columns: minmax(112px, 0.72fr) minmax(0, 1.28fr);
        align-items: start;
        gap: 15px;
        min-width: 0;
        padding: 14px 0;
        border-bottom: 1px solid #e8dfd1;
    }

    .pulse-operations .package-owner-summary__item:nth-last-child(-n + 2) {
        border-bottom: 0;
    }

    .pulse-operations .package-owner-summary__item dt {
        color: var(--ifc-muted);
        font-size: 11px;
        font-weight: 780;
        letter-spacing: 0.055em;
        line-height: 1.45;
        text-transform: uppercase;
    }

    .pulse-operations .package-owner-summary__item dd {
        min-width: 0;
        margin: 0;
        color: var(--ifc-charcoal);
        font-size: 14px;
        font-weight: 710;
        line-height: 1.5;
    }

    .pulse-operations .package-owner-summary__break {
        overflow-wrap: anywhere;
    }

    .pulse-operations .package-owner-summary__notes {
        margin-top: 2px;
        padding: 17px 0 19px;
        border-top: 1px solid var(--ifc-sand);
    }

    .pulse-operations .package-owner-summary__notes .eyebrow {
        margin-bottom: 4px;
    }

    .pulse-operations .package-owner-summary__notes p:last-child {
        margin: 0;
        color: var(--ifc-charcoal-soft);
        font-size: 13.5px;
        line-height: 1.55;
    }

    .pulse-operations .package-owner-compliance {
        min-width: 0;
    }

    .pulse-operations .package-owner-compliance__card {
        padding: 25px 24px 27px;
    }

    .pulse-operations .package-owner-compliance__status {
        margin-top: 19px;
    }

    .pulse-operations .package-owner-compliance__status .id-badge {
        gap: 7px;
        padding: 7px 11px;
        border-color: rgba(31, 90, 59, 0.25);
        background: var(--ifc-green-soft);
        color: var(--ifc-green-dark);
        font-size: 12.5px;
        font-weight: 760;
    }

    .pulse-operations .package-owner-compliance__status .id-badge__ico {
        width: 15px;
        height: 15px;
    }

    .pulse-operations .package-owner-history {
        min-width: 0;
        padding: 0;
        overflow: hidden;
    }

    .pulse-operations .package-owner-history__header {
        margin: 0;
        padding: 22px 27px 16px;
    }

    .pulse-operations .package-owner-history__table-wrap {
        border-top: 1px solid #e2d7c6;
    }

    .pulse-operations .package-owner-history__table {
        min-width: 720px;
        border: 0;
        background: transparent;
    }

    .pulse-operations .package-owner-history__tracking { width: 29%; }
    .pulse-operations .package-owner-history__status { width: 16%; }
    .pulse-operations .package-owner-history__source { width: 21%; }
    .pulse-operations .package-owner-history__date { width: 17%; }

    .pulse-operations .package-owner-history__table thead th {
        padding: 11px 27px;
        border-bottom: 1px solid var(--ifc-sand);
        background: var(--ifc-sand-soft);
        color: #554f46;
        font-size: 10.5px;
        font-weight: 790;
        letter-spacing: 0.07em;
    }

    .pulse-operations .package-owner-history__table tbody td {
        padding: 15px 27px;
        border-bottom: 1px solid #ebe3d7;
    }

    .pulse-operations .package-owner-history__table tbody tr:last-child td {
        border-bottom: 0;
    }

    .pulse-operations .package-owner-history__table .pkg-lrow {
        cursor: default;
    }

    .pulse-operations .package-owner-history__table .pkg-lrow:hover td {
        background: #faf7f0;
    }

    .pulse-operations .package-owner-history__table .pkg-track__num {
        color: var(--ifc-green);
        font-size: 14px;
        font-weight: 780;
    }

    .pulse-operations .package-owner-history__table .pkg-carrier__name,
    .pulse-operations .package-owner-history__table .pkg-datestack__date {
        color: var(--ifc-charcoal);
        font-weight: 680;
    }

    .pulse-operations .package-owner-history__table .pkg-datestack__time {
        color: var(--ifc-muted);
    }

    @media (max-width: 980px) {
        .pulse-operations .package-owner-detail__top {
            grid-template-columns: 1fr;
        }

        .pulse-operations .package-owner-compliance__card {
            max-width: none;
        }
    }

    @media (max-width: 680px) {
        .pulse-operations .package-owner-summary {
            padding: 22px 20px 0;
        }

        .pulse-operations .package-owner-summary__details {
            grid-template-columns: 1fr;
        }

        .pulse-operations .package-owner-summary__item:nth-last-child(-n + 2) {
            border-bottom: 1px solid #e8dfd1;
        }

        .pulse-operations .package-owner-summary__item:last-child {
            border-bottom: 0;
        }

        .pulse-operations .package-owner-history__header {
            padding-right: 20px;
            padding-left: 20px;
        }
    }

    @media (max-width: 440px) {
        .pulse-operations .package-owner-summary__item {
            grid-template-columns: 1fr;
            gap: 5px;
        }
    }
}

/* Create Courier -----------------------------------------------------------
   One calm onboarding workspace: the desktop form uses a divided 2 x 2 grid,
   then collapses into a single ordered flow without changing its controls. */
@media screen {
    .pulse-operations .courier-create-heading {
        margin-bottom: 28px;
    }

    .pulse-operations .courier-create-heading h1 {
        color: var(--ifc-charcoal);
        font-size: clamp(30px, 2.4vw, 36px);
        font-weight: 900;
        letter-spacing: -0.025em;
    }

    .pulse-operations .courier-create-heading .page-heading__support {
        max-width: 54ch;
        margin-top: 9px;
        color: var(--ifc-muted);
        font-size: 15px;
    }

    .pulse-operations .courier-create-panel {
        width: 100%;
        max-width: 1360px;
        margin-inline: auto;
        overflow: hidden;
        border: 1px solid var(--ifc-sand);
        border-radius: 18px;
        background: var(--ifc-paper);
        box-shadow: 0 10px 28px rgba(73, 61, 43, 0.045);
        padding: 0;
    }

    .pulse-operations .courier-create-form .customer-form__grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .pulse-operations .courier-create-form .customer-form__section,
    .pulse-operations .courier-create-form .customer-form__section:nth-child(odd),
    .pulse-operations .courier-create-form .customer-form__section:nth-child(even),
    .pulse-operations .courier-create-form .customer-form__section:nth-child(-n + 2),
    .pulse-operations .courier-create-form .customer-form__section:nth-child(n + 3) {
        min-width: 0;
        gap: 24px;
        align-content: start;
        border: 0;
        background: transparent;
        padding: 34px 38px 36px;
    }

    .pulse-operations .courier-create-form .customer-form__section:nth-child(odd) {
        border-right: 1px solid rgba(216, 201, 178, 0.72);
    }

    .pulse-operations .courier-create-form .customer-form__section:nth-child(-n + 2) {
        border-bottom: 1px solid rgba(216, 201, 178, 0.72);
    }

    .pulse-operations .courier-create-form .customer-form__section-head {
        gap: 15px;
    }

    .pulse-operations .courier-create-form .customer-form__section-icon {
        width: 46px;
        height: 46px;
        flex-basis: 46px;
        border: 1px solid rgba(31, 90, 59, 0.08);
        border-radius: 11px;
        background: var(--ifc-green-soft);
        color: var(--ifc-green);
    }

    .pulse-operations .courier-create-form .customer-form__section-icon :is(i, svg) {
        width: 21px;
        height: 21px;
    }

    .pulse-operations .courier-create-form .customer-form__section-title {
        color: var(--ifc-green);
        font-size: 14px;
        font-weight: 900;
        letter-spacing: 0.035em;
        line-height: 1.2;
    }

    .pulse-operations .courier-create-form .customer-form__section-desc {
        max-width: 50ch;
        margin-top: 6px;
        color: var(--ifc-muted);
        font-size: 13px;
        font-weight: 600;
        line-height: 1.45;
    }

    .pulse-operations .courier-create-form .customer-form__fields {
        gap: 20px;
    }

    .pulse-operations .courier-create-form .customer-form__fields--contact {
        column-gap: 22px;
        row-gap: 19px;
    }

    .pulse-operations .courier-create-form .pkg-field {
        gap: 8px;
        color: var(--ifc-charcoal);
        font-size: 13px;
        font-weight: 800;
    }

    .pulse-operations .courier-create-form .customer-form__optional {
        margin-left: 6px;
        color: var(--ifc-muted-light);
        font-size: 12px;
        font-weight: 600;
    }

    .pulse-operations .courier-create-form .pkg-field .req {
        margin-left: 3px;
        color: #a74732;
    }

    .pulse-operations .courier-create-form .pkg-field :is(input, textarea) {
        border: 1px solid #c9baa2;
        border-radius: 10px;
        background: var(--ifc-paper);
        color: var(--ifc-charcoal);
        box-shadow: inset 0 1px 1px rgba(73, 61, 43, 0.025);
    }

    .pulse-operations .courier-create-form .pkg-field input {
        min-height: 48px;
        padding-inline: 15px;
    }

    .pulse-operations .courier-create-form .pkg-field textarea {
        min-height: 126px;
        padding: 14px 15px;
        resize: vertical;
    }

    .pulse-operations .courier-create-form .pkg-field :is(input, textarea):hover {
        border-color: #ae9c7f;
    }

    .pulse-operations .courier-create-form .pkg-field :is(input, textarea):focus {
        border-color: var(--ifc-green);
        box-shadow: 0 0 0 3px rgba(31, 90, 59, 0.13);
        outline: 0;
    }

    .pulse-operations .courier-create-form .customer-id-upload__empty {
        align-items: center;
        gap: 10px 16px;
    }

    .pulse-operations .courier-create-form .customer-id-upload__button {
        min-height: 46px;
        border-color: #c9baa2;
        border-radius: 10px;
        background: transparent;
        color: var(--ifc-charcoal);
        font-weight: 800;
        padding-inline: 16px;
    }

    .pulse-operations .courier-create-form .customer-id-upload__button:hover {
        border-color: var(--ifc-green);
        background: var(--ifc-green-soft);
        color: var(--ifc-green-dark);
    }

    .pulse-operations .courier-create-form .customer-id-upload__support {
        color: var(--ifc-muted);
        font-size: 12px;
        font-weight: 650;
    }

    .pulse-operations .courier-create-form .customer-id-upload__file {
        border-color: #c9baa2;
        border-radius: 10px;
        background: #fcfaf5;
        box-shadow: none;
    }

    .pulse-operations .courier-create-form .customer-id-upload__thumb {
        border-color: rgba(31, 90, 59, 0.18);
        background: var(--ifc-green-soft);
        color: var(--ifc-green);
    }

    .pulse-operations .courier-create-form .customer-id-upload__meta em {
        color: var(--ifc-green);
    }

    .pulse-operations .courier-create-form .customer-id-secure-note {
        min-height: 34px;
        gap: 9px;
        margin: 10px 0 0;
        border-radius: 8px;
        background: var(--ifc-green-soft);
        color: var(--ifc-green-dark);
        font-size: 12px;
        font-weight: 650;
        line-height: 1.35;
        padding: 8px 11px;
    }

    .pulse-operations .courier-create-form .customer-id-secure-note :is(i, svg) {
        color: var(--ifc-green);
    }

    .pulse-operations .courier-create-documents {
        display: grid;
        min-width: 0;
        gap: 20px;
    }

    .pulse-operations .courier-create-document {
        min-width: 0;
    }

    .pulse-operations .courier-create-document + .courier-create-document {
        border-top: 1px solid rgba(216, 201, 178, 0.72);
        padding-top: 20px;
    }

    .pulse-operations .courier-create-form__actions {
        min-height: 86px;
        gap: 12px;
        margin: 0;
        border-top: 1px solid rgba(216, 201, 178, 0.72);
        background: #faf7f0;
        padding: 20px 30px;
    }

    .pulse-operations .courier-create-form__actions .button {
        min-height: 46px;
        border-radius: 10px;
        padding-inline: 21px;
    }

    .pulse-operations .courier-create-form__actions .button--ghost {
        border-color: #c9baa2;
        background: transparent;
    }

    .pulse-operations .courier-create-form__actions .button--primary {
        border-color: var(--ifc-gold);
        background: var(--ifc-gold);
        color: var(--ifc-charcoal);
        box-shadow: 0 7px 16px rgba(139, 98, 29, 0.16);
    }
}

@media screen and (max-width: 1080px) {
    .pulse-operations .courier-create-form .customer-form__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .pulse-operations .courier-create-form .customer-form__section,
    .pulse-operations .courier-create-form .customer-form__section:nth-child(odd),
    .pulse-operations .courier-create-form .customer-form__section:nth-child(even),
    .pulse-operations .courier-create-form .customer-form__section:nth-child(-n + 2),
    .pulse-operations .courier-create-form .customer-form__section:nth-child(n + 3) {
        border-right: 0;
        border-bottom: 1px solid rgba(216, 201, 178, 0.72);
        padding: 30px 32px;
    }

    .pulse-operations .courier-create-form .customer-form__section:last-child {
        border-bottom: 0;
    }

    .pulse-operations .courier-create-form .pkg-field textarea {
        min-height: 126px;
    }
}

@media screen and (max-width: 640px) {
    .pulse-operations .courier-create-panel {
        border-radius: 14px;
    }

    .pulse-operations .courier-create-form .customer-form__section,
    .pulse-operations .courier-create-form .customer-form__section:nth-child(odd),
    .pulse-operations .courier-create-form .customer-form__section:nth-child(even),
    .pulse-operations .courier-create-form .customer-form__section:nth-child(-n + 2),
    .pulse-operations .courier-create-form .customer-form__section:nth-child(n + 3) {
        gap: 21px;
        padding: 25px 20px 27px;
    }

    .pulse-operations .courier-create-form .customer-form__fields--contact {
        grid-template-columns: minmax(0, 1fr);
    }

    .pulse-operations .courier-create-form .customer-id-upload__empty {
        align-items: flex-start;
        flex-direction: column;
    }

    .pulse-operations .courier-create-form__actions {
        min-height: 0;
        padding: 18px 20px 20px;
    }

    .pulse-operations .courier-create-form__actions .button {
        width: 100%;
        justify-content: center;
    }
}

* {
    box-sizing: border-box;
}

html {
    min-height: 100%;
}

body {
    margin: 0;
    min-height: 100vh;
    overflow-x: hidden;
    overflow-y: auto;
    background: var(--pulse-bg);
    color: var(--pulse-text);
    font-family: Inter, Roboto, Arial, sans-serif;
    font-size: 14px;
}

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

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

.sidebar {
    position: sticky;
    top: 0;
    display: flex;
    flex-direction: column;
    align-self: flex-start;
    width: var(--pulse-sidebar);
    height: 100vh;
    flex: 0 0 var(--pulse-sidebar);
    overflow-y: auto;
    background: var(--pulse-blue-dark);
    color: white;
    padding: 24px 18px;
    transition: transform 180ms ease;
}

.sidebar-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 34px;
}

.sidebar-backdrop {
    display: none;
    position: fixed;
    z-index: 20;
    inset: 0;
    border: 0;
    background: rgba(13, 20, 55, 0.38);
}

.sidebar-brand-logo {
    display: block;
    width: 100%;
    max-width: 164px;
    height: auto;
    flex: 1 1 100%;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 10px;
    background: #f5f1e8;
    padding: 6px 7px;
    object-fit: contain;
}

/* Left-edge hot zone. Inert and invisible until desktop auto mode turns it on,
   even then it only shows a hairline rule on hover — the reveal is the payoff,
   not the affordance. */
.sidebar-edge {
    display: none;
    position: fixed;
    z-index: 24;
    inset: 0 auto 0 0;
    width: 14px;
}

.sidebar-edge::after {
    content: "";
    position: absolute;
    inset: 14px auto 14px 0;
    width: 2px;
    border-radius: 0 2px 2px 0;
    background: var(--pulse-blue);
    opacity: 0;
    transition: opacity 140ms ease;
}

.sidebar-edge:hover::after {
    opacity: 0.4;
}

/* Desktop mouse navigation is governed by the left-edge reveal. Hidden means the
   sidebar consumes no layout width; revealed means it returns to the flex row
   and every page naturally narrows around it. Wide touch devices use the menu
   button to trigger this same reveal state; narrow screens use the drawer. */
@media (min-width: 981px) {
    html[data-sidebar="auto"] .sidebar {
        width: 0;
        flex-basis: 0;
        overflow: hidden;
        visibility: hidden;
        padding-right: 0;
        padding-left: 0;
        box-shadow: none;
        transition: width 140ms ease, flex-basis 140ms ease, padding 140ms ease;
    }

    html[data-sidebar="auto"][data-sidebar-reveal="true"] .sidebar {
        width: var(--pulse-sidebar);
        flex-basis: var(--pulse-sidebar);
        overflow-y: auto;
        visibility: visible;
        padding: 24px 18px;
    }
}

/* Hover reveal is a pointer convenience only; touch devices keep the drawer. */
@media (min-width: 981px) and (hover: hover) and (pointer: fine) {
    html[data-sidebar="auto"] .sidebar-edge {
        display: block;
    }
}

@media (min-width: 981px) {
    html[data-sidebar-touch="true"][data-sidebar="auto"] .menu-button {
        display: inline-block;
    }

    html[data-sidebar-touch="true"][data-sidebar="auto"][data-sidebar-reveal="true"] .menu-button--topbar {
        visibility: hidden;
        pointer-events: none;
    }

    html[data-sidebar-touch="true"][data-sidebar="auto"][data-sidebar-reveal="true"] .menu-button--sidebar {
        display: inline-block;
    }

    html[data-sidebar-touch="true"][data-sidebar="auto"] .sidebar-edge {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .sidebar,
    .sidebar-edge::after {
        transition: none;
    }
}

.brand-mark {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--pulse-blue), var(--pulse-gold));
    font-weight: 800;
}

.side-nav {
    display: grid;
    gap: 8px;
}

.side-nav__item {
    display: flex;
    align-items: center;
    gap: 13px;
    border-radius: 14px;
    color: rgba(255, 255, 255, 0.76);
    padding: 13px 14px;
}

.side-nav__item:hover,
.side-nav__item--active {
    background: rgba(255, 255, 255, 0.1);
    color: white;
}

/* Settings is bottom-anchored and divider-separated: it reads as an
   admin/settings extension of the shell, not another operational surface. */
.side-nav--footer {
    margin-top: auto;
    padding-top: 14px;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.side-nav__item--settings {
    gap: 13px;
}

.side-nav__icon {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    stroke-width: 1.9;
}

.settings-popover {
    width: 100%;
}

.settings-popover__trigger {
    width: 100%;
    border: 0;
    background: transparent;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.settings-popover__trigger-label {
    min-width: 0;
    flex: 1 1 auto;
}

.settings-popover__chevron {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
    opacity: 0.72;
}

.settings-popover__trigger:focus-visible {
    outline: 2px solid rgba(151, 201, 255, 0.92);
    outline-offset: 2px;
}

.settings-popover__panel {
    position: fixed;
    z-index: 40;
    display: grid;
    width: min(264px, calc(100vw - 24px));
    gap: 2px;
    border: 1px solid #d7dfeb;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 16px 36px rgba(13, 20, 55, 0.18);
    padding: 8px;
    color: #17203f;
}

.settings-popover__panel[hidden] {
    display: none;
}

.settings-popover__heading {
    margin: 3px 8px 6px;
    color: #6d7890;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.06em;
    line-height: 1.3;
    text-transform: uppercase;
}

.settings-popover__item {
    display: grid;
    min-height: 48px;
    grid-template-columns: 34px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    border-radius: 6px;
    padding: 7px 9px;
    color: #34405a;
    font-size: 13.5px;
    font-weight: 700;
    line-height: 1.25;
}

.settings-popover__item:hover {
    background: #f4f7fb;
    color: #111a3d;
}

.settings-popover__item--active {
    background: #edf5ff;
    color: #005fc8;
    box-shadow: inset 2px 0 #0064d2;
}

.settings-popover__item-icon {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 6px;
    background: #eef5fd;
    color: #2369b8;
}

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

.settings-popover__item:focus-visible {
    outline: 2px solid rgba(0, 100, 210, 0.42);
    outline-offset: -2px;
}

.workspace {
    display: flex;
    min-width: 0;
    flex: 1;
    flex-direction: column;
}

/* Staff shell controls float over the page canvas so the account menu and
   responsive navigation toggle remain available without a visible topbar. */
.staff-floating-controls {
    position: sticky;
    z-index: 18;
    top: 18px;
    display: flex;
    height: 0;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 0 30px;
    pointer-events: none;
}

.staff-floating-controls > * {
    pointer-events: auto;
}

.staff-user-menu {
    position: relative;
    order: 99;
    margin-left: auto;
    color: var(--pulse-text);
}

.staff-user-menu summary {
    display: flex;
    width: clamp(190px, 22vw, 250px);
    max-width: calc(100vw - 100px);
    align-items: center;
    gap: 10px;
    border: 1px solid var(--pulse-border);
    border-radius: 10px;
    background: white;
    cursor: pointer;
    list-style: none;
    padding: 7px 10px 7px 7px;
    transition: border-color 140ms ease, background-color 140ms ease;
}

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

.staff-user-menu summary:hover,
.staff-user-menu[open] summary {
    border-color: #b7c5d3;
    background: #f8fafc;
}

.staff-user-menu summary:focus-visible {
    outline: 3px solid rgba(32, 117, 217, 0.2);
    outline-offset: 2px;
}

.staff-user-menu__avatar {
    display: grid;
    width: 34px;
    height: 34px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 999px;
    background: #eef6ff;
    color: var(--pulse-blue);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: -0.02em;
}

.staff-user-menu__identity {
    display: grid;
    min-width: 0;
    flex: 1;
    gap: 1px;
    line-height: 1.25;
}

.staff-user-menu__name,
.staff-user-menu__role {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.staff-user-menu__name {
    color: var(--pulse-text);
    font-size: 13px;
    font-weight: 800;
}

.staff-user-menu__role {
    color: var(--pulse-muted);
    font-size: 11px;
    font-weight: 650;
}

.staff-user-menu__chevron {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
    color: var(--pulse-muted);
    stroke-width: 2;
    transition: transform 140ms ease;
}

.staff-user-menu[open] .staff-user-menu__chevron {
    transform: rotate(180deg);
}

.staff-user-menu__panel {
    position: absolute;
    z-index: 30;
    top: calc(100% + 8px);
    right: 0;
    display: grid;
    min-width: 250px;
    gap: 12px;
    border: 1px solid var(--pulse-border);
    border-radius: 12px;
    background: white;
    padding: 14px;
    box-shadow: var(--pulse-shadow);
}

.staff-user-menu__account {
    display: grid;
    gap: 3px;
    min-width: 0;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--pulse-border);
}

.staff-user-menu__account strong {
    color: var(--pulse-text);
    font-size: 13px;
}

.staff-user-menu__account-email {
    overflow-wrap: anywhere;
    color: var(--pulse-muted);
    font-size: 12px;
}

.staff-user-menu__account-role {
    color: var(--pulse-muted);
    font-size: 11px;
    font-weight: 700;
}

.staff-user-menu__panel a {
    color: var(--pulse-blue);
    font-size: 13px;
    font-weight: 800;
}

.auth-page {
    display: grid;
    min-height: 100vh;
    place-items: center;
    background:
        radial-gradient(circle at top left, rgba(32, 117, 217, 0.14), transparent 34rem),
        #f5f7fb;
    padding: 24px;
}

.auth-card {
    width: min(100%, 440px);
    border: 1px solid var(--pulse-border);
    border-radius: 20px;
    background: white;
    padding: clamp(24px, 5vw, 42px);
    box-shadow: var(--pulse-shadow);
}

.auth-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 32px;
}

.auth-brand > div {
    display: grid;
    gap: 2px;
}

.auth-brand strong {
    color: var(--pulse-navy);
    font-size: 18px;
}

.auth-brand span:not(.brand-mark),
.auth-support,
.auth-note {
    color: var(--pulse-muted);
}

.auth-card h1 {
    margin: 0;
    color: var(--pulse-navy);
    font-size: clamp(28px, 6vw, 38px);
}

.auth-support {
    margin: 10px 0 24px;
    line-height: 1.6;
}

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

.auth-form label {
    font-size: 13px;
    font-weight: 800;
}

.auth-form input {
    min-height: 46px;
    border: 1px solid var(--pulse-border);
    border-radius: 10px;
    padding: 10px 12px;
    font: inherit;
}

.auth-form .button,
.auth-helper-link {
    display: inline-flex;
    min-height: 46px;
    align-items: center;
    justify-content: center;
}

.auth-error {
    margin-bottom: 18px;
}

.auth-note {
    margin: 16px 0 0;
    font-size: 12px;
}

.auth-helper-link {
    width: 100%;
}

.topbar h1,
.page-heading h2,
.panel h3 {
    margin: 0;
}

.eyebrow {
    margin: 0 0 4px;
    color: var(--pulse-muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.menu-button {
    display: none;
    width: 48px;
    height: 48px;
    flex: none;
    border: 1px solid var(--pulse-border);
    border-radius: 12px;
    background: white;
    box-shadow: 0 6px 16px rgba(13, 20, 55, 0.06);
    cursor: pointer;
    padding: 8px;
}

.menu-button span {
    display: block;
    width: 22px;
    height: 2px;
    margin: 4px 0;
    background: var(--pulse-text);
}

.menu-button--sidebar {
    display: none;
    border-color: rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.08);
    box-shadow: none;
}

.menu-button--sidebar span {
    background: white;
}

.topbar-status {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--pulse-border);
    border-radius: 999px;
    background: #f8fafc;
    color: var(--pulse-muted);
    padding: 8px 12px;
    white-space: nowrap;
}

.status-dot {
    width: 9px;
    height: 9px;
    border-radius: 999px;
    background: #18a058;
    box-shadow: 0 0 0 4px rgba(24, 160, 88, 0.12);
}

.content {
    flex: 1;
    overflow: visible;
    padding: 92px 30px 30px;
}

.intake-topbar {
    flex-wrap: wrap;
    align-items: flex-start;
    box-shadow: 0 1px 0 rgba(221, 227, 239, 0.9);
}

/* The title block may shrink so the topbar's action meta can wrap below it
   instead of forcing the header (and page body) wider than the viewport. */
.intake-topbar > div:not(.intake-heading__meta) {
    min-width: 0;
}

.intake-topbar h1 {
    margin: 0;
    color: #111a3d;
    font-size: 30px;
    line-height: 1.1;
}

/* ---------------------------------------------------------------------------
   Page heading + breadcrumbs (Phase 15 app-wide standardization)

   One shared content header that sits directly below the topbar, inside the
   page-width content container. `.breadcrumbs` renders the shared component from
   `components/breadcrumbs.html`; `.page-heading` frames the title, record-type
   eyebrow, metadata, and page actions that used to live inside per-page
   topbars. The same classes are reused by the staff shell and the Ideal Freight
   portal so the pattern reads as one system.
   --------------------------------------------------------------------------- */
.breadcrumbs {
    margin: 0 0 12px;
}

.breadcrumbs__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 3px 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.breadcrumbs__item {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    font-size: 13px;
    line-height: 1.35;
}

/* Parent crumbs are the backtrack affordance, so they read as links: brand
   blue, distinct from the dark current page and the muted grouping labels. */
.breadcrumbs__link {
    color: var(--pulse-blue);
    font-weight: 600;
    border-radius: 4px;
    transition: color 120ms ease;
}

.breadcrumbs__link:hover {
    color: var(--pulse-blue-dark);
    text-decoration: underline;
}

.breadcrumbs__link:focus-visible {
    outline: 2px solid var(--pulse-blue);
    outline-offset: 2px;
    text-decoration: underline;
}

/* Non-navigable grouping label (meaningful hierarchy with no standalone route). */
.breadcrumbs__item--parent > span {
    color: var(--pulse-muted);
    font-weight: 600;
}

.breadcrumbs__separator {
    display: inline-flex;
    align-items: center;
    color: #c2c9d8;
}

.breadcrumbs__chevron {
    width: 14px;
    height: 14px;
}

/* Current page: stronger, non-blue, non-clickable. Truncates only when a single
   record name would otherwise overflow; the full text stays in the title. */
.breadcrumbs__current {
    display: inline-block;
    max-width: min(52ch, 100%);
    overflow: hidden;
    color: var(--pulse-text);
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: bottom;
}

.page-heading {
    margin: 0 0 22px;
}

.page-heading__main {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px 18px;
}

.page-heading__main--status-only {
    justify-content: flex-end;
}

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

.page-heading__eyebrow {
    margin: 0 0 4px;
    color: var(--pulse-muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.page-heading h1 {
    margin: 0;
    color: #111a3d;
    font-size: 30px;
    line-height: 1.1;
    overflow-wrap: anywhere;
}

.page-heading__support {
    margin: 8px 0 0;
    color: var(--pulse-muted);
    font-size: 14px;
    line-height: 1.45;
}

/* Record metadata under the title. The existing `.setup-detail-meta` component
   fills this role on detail pages; `.page-heading__meta` is the equivalent for
   pages that assemble their own inline meta row. */
.page-heading .setup-detail-meta {
    margin-top: 10px;
    margin-bottom: 0;
}

.page-heading__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 10px;
    margin-top: 10px;
    color: var(--pulse-muted);
    font-size: 13px;
}

.page-heading__meta-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.page-heading__meta-item svg {
    width: 15px;
    height: 15px;
    flex: none;
}

.page-heading__meta-divider {
    color: #c2c9d8;
}

.page-heading__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

@media (max-width: 640px) {
    .page-heading h1 {
        font-size: 25px;
    }

    .page-heading__actions {
        width: 100%;
    }
}

.pill-link {
    border-radius: 999px;
    background: var(--pulse-blue);
    color: white;
    font-weight: 700;
    padding: 10px 16px;
}

.panel {
    border: 0;
    border-radius: 18px;
    background: var(--pulse-card);
    box-shadow: var(--pulse-shadow);
    padding: 22px;
}

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

.stat-card {
    position: relative;
    min-height: 142px;
    overflow: hidden;
    border-radius: 18px;
    color: white;
    padding: 24px;
}

.stat-card::before {
    content: "";
    position: absolute;
    right: -34px;
    bottom: -44px;
    width: 128px;
    height: 128px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.14);
}

.stat-card p,
.stat-card strong,
.stat-card span {
    position: relative;
}

.stat-card p {
    margin: 0 0 12px;
    font-weight: 800;
}

.stat-card strong {
    display: block;
    font-size: 34px;
    line-height: 1;
}

.stat-card span {
    display: block;
    margin-top: 14px;
    opacity: 0.78;
}

.stat-card--blue {
    background: linear-gradient(135deg, #0f6edb, #0d1437);
}

.stat-card--gold {
    background: linear-gradient(135deg, #f5af02, #e87900);
}

.stat-card--teal {
    background: linear-gradient(135deg, #0096a7, #006a74);
}

.stat-card--orange {
    background: linear-gradient(135deg, #ed8b00, #d43d00);
}

.two-column {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 20px;
    margin-top: 22px;
}

.panel-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
}

.reference-list {
    display: grid;
    gap: 12px;
    margin: 0;
}

.reference-list div,
.application-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    border: 1px solid var(--pulse-border);
    border-radius: 14px;
    padding: 14px;
}

.reference-list dt {
    color: var(--pulse-muted);
    font-weight: 700;
}

.reference-list dd {
    margin: 0;
    font-size: 22px;
    font-weight: 900;
}

.application-row {
    justify-content: flex-start;
    margin-top: 12px;
}

.application-row p {
    margin: 4px 0 0;
    color: var(--pulse-muted);
}

.application-icon {
    display: grid;
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    place-items: center;
    border-radius: 14px;
    background: rgba(0, 100, 210, 0.1);
    color: var(--pulse-blue);
    font-weight: 900;
}

/* ==========================================================================
   Staff Dashboard - operational command center mockup
   Scoped to .ops-dashboard so the shell, sidebar, topbar, and shared layout
   components keep their existing behavior.
   ========================================================================== */
.ops-icon-sprite {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
}

.ops-dashboard {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 22px;
    min-width: 0;
    color: #111a3d;
}

.ops-dashboard .panel {
    border: 1px solid #e0e6f0;
    border-radius: 14px;
    box-shadow: 0 10px 24px rgba(17, 26, 61, 0.06);
    padding: 22px;
}

.ops-intro,
.ops-kpi-strip,
.ops-dashboard-grid,
.ops-activity-card {
    grid-column: 1 / -1;
    min-width: 0;
}

.ops-intro {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    border: 1px solid #e0e6f0;
    border-radius: 14px;
    background: #ffffff;
    padding: 16px 20px;
    box-shadow: 0 10px 24px rgba(17, 26, 61, 0.05);
}

.ops-intro__copy {
    min-width: 0;
}

.ops-intro h2 {
    margin: 0;
    color: #0d1437;
    font-size: 26px;
    line-height: 1.15;
}

.ops-intro p:not(.eyebrow) {
    max-width: 650px;
    margin: 7px 0 0;
    color: #536078;
    font-size: 14px;
    line-height: 1.45;
}

.ops-intro__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
    min-width: 0;
}

.ops-intro__actions .button {
    min-height: 38px;
    border-radius: 9px;
    padding: 8px 12px;
    white-space: nowrap;
}

.ops-button--tertiary {
    color: #47536a;
}

.ops-kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.ops-kpi {
    display: flex;
    min-width: 0;
    gap: 12px;
    align-items: flex-start;
    border: 1px solid #e0e6f0;
    border-radius: 14px;
    background: #ffffff;
    padding: 16px;
    box-shadow: 0 10px 24px rgba(17, 26, 61, 0.05);
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.ops-kpi:hover,
.ops-kpi:focus-visible {
    border-color: rgba(0, 100, 210, 0.36);
    box-shadow: 0 14px 28px rgba(17, 26, 61, 0.09);
    transform: translateY(-1px);
    outline: 0;
}

.ops-kpi__icon {
    display: inline-flex;
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
}

.ops-kpi__icon svg,
.ops-activity-icon svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
}

.ops-kpi--blue .ops-kpi__icon {
    background: #eaf4ff;
    color: #0757ad;
}

.ops-kpi--amber .ops-kpi__icon {
    background: #fff4df;
    color: #9a5700;
}

.ops-kpi--green .ops-kpi__icon {
    background: #eaf8f0;
    color: #11683b;
}

.ops-kpi--red .ops-kpi__icon {
    background: #fff0f0;
    color: #a53030;
}

.ops-kpi__body {
    min-width: 0;
}

.ops-kpi__label {
    display: block;
    color: #536078;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.04em;
    line-height: 1.25;
    text-transform: uppercase;
}

.ops-kpi strong {
    display: block;
    margin-top: 6px;
    color: #0d1437;
    font-size: 30px;
    line-height: 1;
}

.ops-kpi__summary,
.ops-kpi__detail {
    display: block;
    overflow-wrap: anywhere;
}

.ops-kpi__summary {
    margin-top: 8px;
    color: #536078;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.35;
}

.ops-kpi__detail {
    margin-top: 6px;
    color: #7b8497;
    font-size: 12px;
    line-height: 1.35;
}

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

.ops-span-4 {
    grid-column: span 4;
}

.ops-span-5 {
    grid-column: span 5;
}

.ops-span-7 {
    grid-column: span 7;
}

.ops-span-8 {
    grid-column: span 8;
}

.ops-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}

.ops-card-head > div {
    min-width: 0;
}

.ops-card-head h3 {
    margin: 0;
    color: #0d1437;
    font-size: 18px;
    line-height: 1.2;
}

.ops-card-head p:not(.eyebrow) {
    max-width: 560px;
    margin: 5px 0 0;
    color: #536078;
    font-size: 13px;
    line-height: 1.4;
}

.ops-card-link {
    flex: 0 0 auto;
    color: var(--pulse-blue);
    font-size: 13px;
    font-weight: 800;
}

.ops-card-link:hover {
    color: #0757ad;
}

.ops-card-link:focus-visible,
.ops-row-link:focus-visible {
    border-radius: 6px;
    outline: 3px solid rgba(0, 100, 210, 0.22);
    outline-offset: 3px;
}

.ops-work-list,
.ops-shipment-list,
.ops-bol-list,
.ops-manifest-list,
.ops-activity-feed {
    display: grid;
    gap: 0;
    min-width: 0;
}

.ops-work-row {
    display: grid;
    grid-template-columns: minmax(150px, 0.34fr) minmax(0, 1fr) minmax(132px, 0.34fr) auto;
    gap: 14px;
    align-items: center;
    min-width: 0;
    border: 1px solid #e6ebf4;
    border-radius: 12px;
    background: #fbfcff;
    padding: 13px 14px;
    transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.ops-work-row + .ops-work-row {
    margin-top: 10px;
}

.ops-work-row:hover,
.ops-work-row:focus-within {
    border-color: rgba(0, 100, 210, 0.28);
    background: #ffffff;
    box-shadow: 0 8px 18px rgba(17, 26, 61, 0.05);
}

.ops-work-row__priority span {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
    padding: 7px 10px;
    white-space: nowrap;
}

.ops-work-row--urgent .ops-work-row__priority span {
    background: #fff0f0;
    color: #a53030;
}

.ops-work-row--review .ops-work-row__priority span {
    background: #fff4df;
    color: #9a5700;
}

.ops-work-row--waiting .ops-work-row__priority span {
    background: #f1eaff;
    color: #5b21b6;
}

.ops-work-row__main,
.ops-shipment-row__main,
.ops-activity-row__main,
.ops-bol-row > div,
.ops-manifest-row > span:first-child {
    min-width: 0;
}

.ops-work-row strong,
.ops-shipment-row strong,
.ops-bol-row strong,
.ops-manifest-row strong,
.ops-activity-row strong {
    display: block;
    color: #111a3d;
    overflow-wrap: anywhere;
}

.ops-work-row code,
.ops-shipment-row code,
.ops-activity-row code {
    color: #47536a;
    font: 800 12px/1.3 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    overflow-wrap: anywhere;
}

.ops-work-row__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}

.ops-work-row__meta span {
    color: #536078;
    font-weight: 800;
}

.ops-work-row p,
.ops-shipment-row p,
.ops-bol-row p,
.ops-activity-row p {
    margin: 6px 0 0;
    color: #536078;
    font-size: 13px;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.ops-work-row__state {
    display: grid;
    gap: 7px;
    justify-items: start;
    min-width: 0;
}

.ops-work-row__state > span:first-child {
    color: #7b8497;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.3;
}

.ops-work-row .button {
    white-space: nowrap;
}

.status-chip--blocked {
    border-color: rgba(191, 45, 45, 0.2);
    background: #fff0f0;
    color: #a53030;
}

.status-chip--owner_needed {
    border-color: rgba(191, 45, 45, 0.2);
    background: #fff0f0;
    color: #a53030;
}

.status-chip--review {
    border-color: rgba(237, 139, 0, 0.28);
    background: #fff4df;
    color: #9a5700;
}

.status-chip--waiting {
    border-color: rgba(109, 91, 208, 0.24);
    background: #f1eefb;
    color: #5b21b6;
}

.status-chip--ready {
    border-color: rgba(24, 160, 88, 0.22);
    background: #eaf8f0;
    color: #11683b;
}

.status-chip--paperwork {
    border-color: rgba(124, 58, 237, 0.22);
    background: #f1eaff;
    color: #5b21b6;
}

.status-chip--pre_manifest {
    border-color: rgba(124, 58, 237, 0.22);
    background: #f1eaff;
    color: #5b21b6;
}

.status-chip--manifest_complete {
    border-color: rgba(24, 160, 88, 0.22);
    background: #eaf8f0;
    color: #11683b;
}

.ops-flow-list {
    display: grid;
    gap: 14px;
}

.ops-flow-stage {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 7px 12px;
    min-width: 0;
}

.ops-flow-stage div {
    min-width: 0;
}

.ops-flow-stage strong {
    display: block;
    color: #111a3d;
    overflow-wrap: anywhere;
}

.ops-flow-stage span:not(.ops-flow-bar) {
    display: block;
    margin-top: 3px;
    color: #7b8497;
    font-size: 12px;
    line-height: 1.35;
}

.ops-flow-stage b {
    color: #0d1437;
    font-size: 24px;
    line-height: 1;
}

.ops-flow-bar,
.ops-progress {
    display: block;
    overflow: hidden;
    border-radius: 999px;
    background: #edf1f7;
}

.ops-flow-bar {
    grid-column: 1 / -1;
    height: 5px;
}

.ops-flow-bar span,
.ops-progress span {
    display: block;
    width: var(--activity, var(--progress, 0%));
    height: 100%;
    border-radius: inherit;
    background: var(--pulse-blue);
}

.ops-flow-summary {
    margin: 18px 0 0;
    border-top: 1px solid #e6ebf4;
    color: #536078;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.45;
    padding-top: 14px;
}

.ops-shipment-row,
.ops-bol-row,
.ops-manifest-row,
.ops-activity-row {
    border-bottom: 1px solid #e6ebf4;
}

.ops-shipment-row:last-child,
.ops-bol-row:last-child,
.ops-manifest-row:last-child,
.ops-activity-row:last-child {
    border-bottom: 0;
}

.ops-shipment-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(178px, 0.7fr) auto auto;
    gap: 12px;
    align-items: center;
    min-width: 0;
    padding: 13px 0;
}

.ops-shipment-row__facts {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.ops-shipment-row__facts span {
    color: #536078;
    font-size: 12px;
    font-weight: 800;
    overflow-wrap: anywhere;
}

.ops-row-link {
    color: var(--pulse-blue);
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
}

.ops-paperwork-section + .ops-paperwork-section {
    margin-top: 20px;
    border-top: 1px solid #e6ebf4;
    padding-top: 18px;
}

.ops-paperwork-section__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.ops-paperwork-section h4 {
    margin: 0;
    color: #536078;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.ops-bol-counts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 12px;
}

.ops-bol-counts div {
    border: 1px solid #e6ebf4;
    border-radius: 10px;
    background: #fbfcff;
    padding: 10px;
}

.ops-bol-counts strong,
.ops-bol-counts span {
    display: block;
}

.ops-bol-counts strong {
    color: #0d1437;
    font-size: 24px;
    line-height: 1;
}

.ops-bol-counts span {
    margin-top: 5px;
    color: #536078;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.35;
}

.ops-bol-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    min-width: 0;
    padding: 11px 0;
}

.ops-bol-row .ops-row-link {
    grid-column: 2 / 3;
    justify-self: end;
}

.ops-manifest-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(78px, 0.28fr) auto;
    gap: 10px;
    align-items: center;
    min-width: 0;
    padding: 12px 0;
    transition: color 160ms ease;
}

.ops-manifest-row:hover strong,
.ops-manifest-row:focus-visible strong {
    color: var(--pulse-blue);
}

.ops-manifest-row:focus-visible {
    outline: 3px solid rgba(0, 100, 210, 0.22);
    outline-offset: 3px;
}

.ops-manifest-row small {
    display: block;
    margin-top: 4px;
    color: #536078;
    font-size: 12px;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.ops-progress {
    height: 7px;
    min-width: 68px;
}

.ops-activity-row {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) minmax(170px, auto);
    gap: 12px;
    align-items: center;
    min-width: 0;
    padding: 13px 0;
}

.ops-activity-icon {
    display: inline-flex;
    width: 36px;
    height: 36px;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
}

.ops-activity-row--blue .ops-activity-icon {
    background: #eaf4ff;
    color: #0757ad;
}

.ops-activity-row--red .ops-activity-icon {
    background: #fff0f0;
    color: #a53030;
}

.ops-activity-row--green .ops-activity-icon {
    background: #eaf8f0;
    color: #11683b;
}

.ops-activity-row--amber .ops-activity-icon {
    background: #fff4df;
    color: #9a5700;
}

.ops-activity-row--purple .ops-activity-icon {
    background: #f1eaff;
    color: #5b21b6;
}

.ops-activity-row__meta {
    display: grid;
    gap: 4px;
    justify-items: end;
    min-width: 0;
}

.ops-activity-row__meta span,
.ops-activity-row__meta time {
    color: #536078;
    font-size: 12px;
    font-weight: 800;
    text-align: right;
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .ops-kpi-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ops-span-4,
    .ops-span-5,
    .ops-span-7,
    .ops-span-8 {
        grid-column: 1 / -1;
    }

    .ops-work-row {
        grid-template-columns: minmax(150px, 0.34fr) minmax(0, 1fr) auto;
    }

    .ops-work-row .button {
        grid-column: 2 / -1;
        justify-self: start;
    }
}

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

    .ops-intro__actions {
        justify-content: flex-start;
    }

    .ops-shipment-row {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .ops-shipment-row__facts,
    .ops-shipment-row .status-chip,
    .ops-shipment-row .ops-row-link {
        grid-column: 1 / -1;
        justify-self: start;
    }
}

@media (max-width: 700px) {
    .ops-dashboard {
        gap: 16px;
    }

    .ops-dashboard .panel,
    .ops-intro {
        padding: 18px;
    }

    .ops-intro h2 {
        font-size: 24px;
    }

    .ops-intro__actions,
    .ops-intro__actions .button,
    .ops-card-link {
        width: 100%;
    }

    .ops-kpi-strip {
        grid-template-columns: minmax(0, 1fr);
    }

    .ops-work-row,
    .ops-bol-row,
    .ops-manifest-row,
    .ops-activity-row {
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
    }

    .ops-work-row .button,
    .ops-bol-row .ops-row-link,
    .ops-manifest-row .ops-progress,
    .ops-manifest-row .status-chip,
    .ops-activity-row__meta {
        grid-column: 1 / -1;
        justify-self: start;
    }

    .ops-card-head {
        align-items: stretch;
        flex-direction: column;
    }

    .ops-paperwork-section__head {
        align-items: stretch;
        flex-direction: column;
    }

    .ops-bol-counts {
        grid-template-columns: minmax(0, 1fr);
    }

    .ops-activity-row {
        grid-template-columns: 38px minmax(0, 1fr);
    }

    .ops-activity-row__meta {
        grid-column: 2 / -1;
        justify-items: start;
    }

    .ops-activity-row__meta span,
    .ops-activity-row__meta time {
        text-align: left;
    }

    .ops-flow-stage b {
        font-size: 22px;
    }
}

/* Staff dashboard reference layout: greeting, five KPIs, status/incoming row,
   and three recent-operation cards. This later scoped block owns the current
   dashboard markup and intentionally leaves the shared shell untouched. */
.ops-dashboard {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
    min-width: 0;
    color: #111a3d;
}

.ops-dashboard .panel {
    min-width: 0;
    border: 1px solid #dfe6f1;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 8px 18px rgba(17, 26, 61, 0.045);
    padding: 18px;
}

.ops-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 18px;
    align-items: center;
    min-width: 0;
}

.ops-hero__copy {
    min-width: 0;
}

.ops-hero h2 {
    margin: 0;
    color: #0d1437;
    font-size: 30px;
    line-height: 1.12;
}

.ops-hero h2 span {
    font-size: 0.86em;
}

.ops-hero p {
    margin: 7px 0 0;
    color: #47536a;
    font-size: 15px;
    line-height: 1.4;
}

.ops-hero__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 14px;
    min-width: 0;
}

.ops-action-button {
    min-height: 44px;
    border-radius: 7px;
    gap: 10px;
    padding: 10px 18px;
    white-space: nowrap;
}

.ops-action-button svg {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.9;
}

.ops-kpi-strip {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 18px;
    min-width: 0;
}

.ops-kpi {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);
    gap: 14px;
    align-items: center;
    min-height: 138px;
    min-width: 0;
    border: 1px solid #dfe6f1;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 8px 18px rgba(17, 26, 61, 0.045);
    padding: 18px;
}

.ops-kpi__icon {
    display: inline-flex;
    width: 50px;
    height: 50px;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
}

.ops-kpi__icon svg,
.ops-activity-item__icon svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
}

.ops-kpi__icon--blue,
.ops-activity-item__icon--blue {
    background: #eaf4ff;
    color: #0757ad;
}

.ops-kpi__icon--green,
.ops-activity-item__icon--green {
    background: #eaf8f0;
    color: #11683b;
}

.ops-kpi__icon--amber {
    background: #fff4df;
    color: #9a5700;
}

.ops-kpi__icon--purple,
.ops-activity-item__icon--purple {
    background: #f1eaff;
    color: #5b21b6;
}

.ops-kpi__icon--orange,
.ops-activity-item__icon--orange {
    background: #fff1e7;
    color: #c65f12;
}

.ops-kpi__icon--cyan {
    background: #e8f7fa;
    color: #0a7480;
}

.ops-kpi__body,
.ops-kpi__label,
.ops-kpi__context,
.ops-kpi__support {
    display: block;
    min-width: 0;
    overflow-wrap: anywhere;
}

.ops-kpi__label {
    color: #47536a;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.25;
}

.ops-kpi strong {
    display: block;
    margin-top: 6px;
    color: #0d1437;
    font-size: 31px;
    line-height: 1;
}

.ops-kpi__context {
    margin-top: 9px;
    color: #47536a;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.3;
}

.ops-kpi__context--green,
.ops-kpi__context--blue {
    color: #0b8f50;
}

.ops-kpi__context--amber {
    color: #9a5700;
}

.ops-kpi__context--cyan,
.ops-kpi__context--orange,
.ops-kpi__context--purple {
    color: #0d1437;
}

.ops-kpi__support {
    margin-top: 7px;
    color: #536078;
    font-size: 13px;
    line-height: 1.35;
}

.ops-status-row {
    display: grid;
    grid-template-columns: minmax(0, 0.46fr) minmax(0, 0.54fr);
    gap: 18px;
    align-items: stretch;
    min-width: 0;
}

.ops-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 14px;
}

.ops-card-head h3 {
    margin: 0;
    color: #0d1437;
    font-size: 16px;
    line-height: 1.2;
}

.ops-card-link {
    flex: 0 0 auto;
    color: var(--pulse-blue);
    font-size: 13px;
    font-weight: 800;
    white-space: nowrap;
}

.ops-card-link:hover,
.ops-card-link:focus-visible {
    color: #0757ad;
}

.ops-card-link:focus-visible,
.ops-action-button:focus-visible {
    outline: 3px solid rgba(0, 100, 210, 0.24);
    outline-offset: 3px;
}

.ops-status-card,
.ops-incoming-card {
    display: flex;
    flex-direction: column;
}

.ops-status-card {
    overflow: hidden;
    border-color: #d7dfeb;
    border-radius: 12px;
    box-shadow: 0 8px 18px rgba(17, 26, 61, 0.045);
    padding: 0;
}

.ops-status-card__header {
    padding: 20px 22px 0;
}

.ops-status-card__header h3 {
    margin: 0;
    color: #0d1437;
    font-size: 18px;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1.2;
}

.ops-status-card__header p {
    margin: 7px 0 0;
    color: #536078;
    font-size: 13px;
    line-height: 1.45;
}

.ops-status-card__body {
    display: grid;
    grid-template-columns: minmax(190px, 0.85fr) minmax(0, 1fr);
    gap: 22px;
    align-items: center;
    min-width: 0;
    flex: 1;
    padding: 18px 22px 22px;
}

.ops-donut {
    position: relative;
    display: grid;
    width: min(100%, 260px);
    aspect-ratio: 1;
    place-items: center;
    justify-self: center;
    margin: 0;
    min-width: 0;
}

.ops-donut > svg {
    width: 100%;
    height: 100%;
    transform: rotate(-90deg);
}

.ops-donut__segment {
    fill: none;
    stroke-width: 7;
}

.ops-donut__segment {
    stroke-linecap: butt;
}

.ops-donut__segment--warehouse {
    stroke: #2f7cf0;
}

.ops-donut__segment--expected {
    stroke: #17b978;
}

.ops-donut__segment--water {
    stroke: #7047e8;
}

.ops-donut__segment--jamaica {
    stroke: #ff7a1a;
}

.ops-donut__segment--delivered {
    stroke: #6bc64a;
}

.ops-donut__center {
    position: absolute;
    display: grid;
    gap: 6px;
    justify-items: center;
    color: #677188;
}

.ops-donut__center-icon {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.55;
}

.ops-donut__center strong {
    color: #0d1437;
    font-size: 28px;
    font-variant-numeric: tabular-nums;
    font-weight: 900;
    line-height: 1;
}

.ops-donut__center span {
    color: #536078;
    font-size: 13px;
    font-weight: 800;
}

.ops-status-legend {
    display: grid;
    min-width: 0;
}

.ops-status-legend__head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(70px, auto);
    gap: 12px;
    align-items: center;
    border-bottom: 1px solid #dfe6f1;
    padding: 0 0 10px;
    color: #647089;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.07em;
    line-height: 1;
    text-transform: uppercase;
}

.ops-status-legend__head span:last-child {
    text-align: right;
}

.ops-status-legend__row {
    display: grid;
    grid-template-columns: 14px minmax(0, 1fr) minmax(70px, auto);
    gap: 10px;
    align-items: center;
    min-width: 0;
    min-height: 42px;
    border-bottom: 1px solid #dfe6f1;
}

.ops-status-dot {
    width: 14px;
    height: 14px;
    border-radius: 999px;
}

.ops-status-dot--warehouse {
    background: #2f7cf0;
}

.ops-status-dot--expected {
    background: #17b978;
}

.ops-status-dot--water {
    background: #7047e8;
}

.ops-status-dot--jamaica {
    background: #ff7a1a;
}

.ops-status-dot--delivered {
    background: #6bc64a;
}

.ops-status-legend__row span:nth-child(2) {
    color: #0d1437;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.25;
    overflow-wrap: normal;
}

.ops-status-legend__row strong {
    color: #0d1437;
    font-size: 14px;
    font-variant-numeric: tabular-nums;
    font-weight: 900;
    text-align: right;
    white-space: nowrap;
}

.ops-status-card__footer {
    display: flex;
    justify-content: flex-end;
    border-top: 1px solid #dfe6f1;
    padding: 14px 22px;
}

.ops-card-link--footer {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 0;
    color: var(--pulse-blue);
    font-size: 13px;
    font-weight: 850;
}

.ops-card-link--footer span {
    display: inline-block;
    font-size: 18px;
    line-height: 0.8;
    transition: transform 160ms ease;
}

.ops-card-link--footer:hover,
.ops-card-link--footer:focus-visible {
    color: #0757ad;
    text-decoration: underline;
    text-underline-offset: 4px;
}

.ops-card-link--footer:hover span,
.ops-card-link--footer:focus-visible span {
    transform: translateX(4px);
}

.ops-table-wrap {
    overflow-x: auto;
    min-width: 0;
}

.ops-incoming-table {
    width: 100%;
    min-width: 560px;
    border-collapse: collapse;
    color: #0d1437;
    font-size: 13px;
}

.ops-incoming-table th,
.ops-incoming-table td {
    border-bottom: 1px solid #dfe6f1;
    padding: 11px 18px;
    text-align: left;
    white-space: nowrap;
}

.ops-incoming-table thead th {
    background: #f3f6fb;
    color: #47536a;
    font-weight: 800;
}

.ops-incoming-table th:last-child,
.ops-incoming-table td:last-child {
    text-align: right;
}

.ops-incoming-table tfoot th,
.ops-incoming-table tfoot td {
    border-bottom: 0;
    font-weight: 900;
}

.ops-recent-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 0.96fr);
    gap: 16px;
    align-items: stretch;
    min-width: 0;
}

.ops-recent-card {
    min-width: 0;
}

.dashboard-list-card {
    display: flex;
    min-height: 100%;
    flex-direction: column;
    overflow: hidden;
    padding: 0;
}

.dashboard-list-card__header {
    padding: 19px 20px 13px;
}

.dashboard-list-card__header h3 {
    margin: 0;
    color: #0d1437;
    font-size: 18px;
    font-weight: 850;
    line-height: 1.2;
}

.dashboard-list-card__body {
    flex: 1;
    padding: 0 20px;
}

.dashboard-list-card__footer {
    display: flex;
    justify-content: center;
    border-top: 1px solid #dfe6f1;
    margin-top: auto;
    padding: 14px 20px;
}

.dashboard-list-card__link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--pulse-blue);
    font-size: 14px;
    font-weight: 800;
    line-height: 1.2;
    white-space: nowrap;
}

.dashboard-list-card__link span {
    display: inline-block;
    font-size: 18px;
    line-height: 0.8;
    transition: transform 160ms ease;
}

.dashboard-list-card__link:hover,
.dashboard-list-card__link:focus-visible {
    color: #0757ad;
    text-decoration: underline;
    text-underline-offset: 4px;
}

.dashboard-list-card__link:hover span,
.dashboard-list-card__link:focus-visible span {
    transform: translateX(4px);
}

.dashboard-list-card__link:focus-visible {
    outline: 3px solid rgba(0, 100, 210, 0.24);
    outline-offset: 3px;
    border-radius: 6px;
}

.ops-activity-list,
.ops-summary-list {
    display: grid;
    min-width: 0;
    align-content: start;
}

.ops-activity-item {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    min-width: 0;
    padding: 0;
}

.ops-summary-row:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.ops-activity-item__icon {
    display: inline-flex;
    width: 31px;
    height: 31px;
    align-items: center;
    justify-content: center;
    border: 1px solid #dbe3ef;
    border-radius: 9px;
    margin-top: 14px;
    background: #f5f7fb;
    color: #536078;
}

.ops-activity-item__icon svg {
    width: 16px;
    height: 16px;
}

.dashboard-list-card .ops-activity-item__icon--blue {
    border-color: #cfe0f7;
    background: #f2f7ff;
    color: #0b63ce;
}

.dashboard-list-card .ops-activity-item__icon--green {
    border-color: #cfe9dc;
    background: #f3faf6;
    color: #147a49;
}

.dashboard-list-card .ops-activity-item__icon--purple {
    border-color: #dcd4f6;
    background: #f7f4ff;
    color: #6044ca;
}

.dashboard-list-card .ops-activity-item__icon--orange {
    border-color: #f3d8bd;
    background: #fff7ef;
    color: #c65f12;
}

.ops-activity-item__content {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(70px, auto);
    gap: 12px;
    align-items: center;
    min-width: 0;
    border-bottom: 1px solid #dfe6f1;
    padding: 14px 0;
}

.ops-activity-item:last-child .ops-activity-item__content {
    border-bottom: 0;
}

.ops-activity-item strong,
.ops-summary-row strong {
    display: block;
    min-width: 0;
    color: #0d1437;
    font-size: 14px;
    font-weight: 850;
    line-height: 1.28;
    overflow-wrap: anywhere;
    font-variant-numeric: tabular-nums;
}

.ops-activity-item p {
    margin: 5px 0 0;
    color: #536078;
    font-size: 13px;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.ops-activity-item time {
    color: #47536a;
    font-size: 12px;
    font-weight: 800;
    justify-self: end;
    text-align: right;
    white-space: nowrap;
}

.ops-summary-row {
    min-width: 0;
    border-bottom: 1px solid #dfe6f1;
    padding: 16px 0;
}

.ops-summary-row__top,
.ops-summary-row__bottom {
    display: grid;
    grid-template-columns: minmax(0, auto) auto minmax(54px, 1fr);
    gap: 8px;
    align-items: center;
    min-width: 0;
}

.ops-summary-row--manifest .ops-summary-row__top {
    grid-template-columns: minmax(0, 1fr) auto;
}

.ops-summary-row__top em,
.ops-summary-row__bottom time {
    color: #47536a;
    font-size: 13px;
    font-style: normal;
    font-weight: 800;
    justify-self: end;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.ops-consignee-badge {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    justify-content: center;
    border: 1px solid #d7dfeb;
    border-radius: 999px;
    background: #f8fafc;
    color: #47536a;
    font-size: 12px;
    font-weight: 850;
    line-height: 1.1;
    padding: 5px 11px;
    white-space: nowrap;
}

.ops-consignee-badge--verified {
    border-color: rgba(24, 160, 88, 0.22);
    background: #f1faf5;
    color: #0e6f3e;
}

.ops-consignee-badge--pending {
    border-color: rgba(237, 139, 0, 0.24);
    background: #fff7e8;
    color: #9a5700;
}

.ops-consignee-badge--required {
    border-color: rgba(203, 64, 64, 0.2);
    background: #fff5f5;
    color: #b42323;
}

.ops-summary-row__bottom {
    grid-template-columns: minmax(0, 1fr) auto;
    margin-top: 8px;
}

.ops-summary-row--manifest .ops-summary-row__bottom {
    grid-template-columns: minmax(0, 1fr) minmax(92px, auto);
}

.ops-summary-row__bottom span {
    color: #536078;
    font-size: 13px;
    line-height: 1.35;
    overflow-wrap: anywhere;
    font-variant-numeric: tabular-nums;
}

.status-chip--pending_close {
    border-color: rgba(237, 139, 0, 0.28);
    background: #fff4df;
    color: #9a5700;
}

.status-chip--needs_clearing,
.status-chip--ready_for_bol {
    border-color: rgba(124, 58, 237, 0.22);
    background: #f1eaff;
    color: #5b21b6;
}

.status-chip--ready_for_bol {
    border-color: rgba(0, 100, 210, 0.18);
    background: #eaf4ff;
    color: #0757ad;
}

.status-chip--draft {
    border-color: rgba(83, 96, 120, 0.16);
    background: #eef1f6;
    color: #536078;
}

.status-chip--on_water {
    border-color: rgba(24, 160, 88, 0.22);
    background: #eaf8f0;
    color: #11683b;
}

.status-chip--arrived {
    border-color: rgba(237, 139, 0, 0.28);
    background: #fff1e7;
    color: #c65f12;
}

@media (max-width: 1260px) {
    .ops-kpi-strip {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

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

    .dashboard-operations-grid > :first-child {
        grid-column: 1 / -1;
    }
}

@media (max-width: 980px) {
    .ops-hero,
    .ops-status-row {
        grid-template-columns: minmax(0, 1fr);
    }

    .ops-hero__actions {
        justify-content: flex-start;
    }

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

    .ops-status-card__body {
        grid-template-columns: minmax(0, 1fr);
        gap: 18px;
        padding: 18px 22px 22px;
    }

    .ops-status-card__header {
        padding: 20px 22px 0;
    }

    .ops-status-card__footer {
        padding: 14px 22px;
    }

    .ops-donut {
        width: min(100%, 260px);
    }

    .ops-recent-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .dashboard-operations-grid > :first-child,
    .ops-recent-card:last-child {
        grid-column: auto;
    }
}

@media (max-width: 620px) {
    .ops-dashboard {
        gap: 14px;
    }

    .ops-hero h2 {
        font-size: 26px;
    }

    .ops-hero__actions {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
    }

    .ops-action-button {
        width: 100%;
    }

    .ops-kpi-strip {
        grid-template-columns: minmax(0, 1fr);
    }

    .ops-kpi {
        min-height: 0;
    }

    .ops-dashboard .panel {
        padding: 16px;
    }

    .dashboard-list-card {
        padding: 0;
    }

    .dashboard-list-card__header {
        padding: 18px 18px 12px;
    }

    .dashboard-list-card__body {
        padding: 0 18px;
    }

    .dashboard-list-card__footer {
        padding: 14px 18px;
    }

    .ops-status-card {
        padding: 0;
    }

    .ops-status-card__header {
        padding: 20px 20px 0;
    }

    .ops-status-card__header h3 {
        font-size: 20px;
    }

    .ops-status-card__header p {
        font-size: 13px;
    }

    .ops-status-card__body {
        padding: 18px 20px 22px;
    }

    .ops-donut {
        width: clamp(220px, 70vw, 240px);
    }

    .ops-donut__center {
        gap: 6px;
    }

    .ops-donut__center-icon {
        width: 22px;
        height: 22px;
    }

    .ops-donut__center strong {
        font-size: 30px;
    }

    .ops-donut__center span {
        font-size: 13px;
    }

    .ops-card-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .ops-card-head h3 {
        text-align: left;
    }

    .ops-card-link {
        width: auto;
    }

    .ops-status-legend__head {
        grid-template-columns: minmax(0, 1fr) minmax(76px, auto);
        font-size: 11px;
    }

    .ops-status-legend__row {
        grid-template-columns: 14px minmax(0, 1fr) minmax(76px, auto);
        gap: 10px;
        min-height: 48px;
    }

    .ops-status-dot {
        width: 14px;
        height: 14px;
    }

    .ops-status-legend__row span:nth-child(2) {
        font-size: 13px;
    }

    .ops-status-legend__row strong {
        font-size: 14px;
    }

    .ops-status-card__footer {
        padding: 14px 20px;
    }

    .ops-card-link--footer {
        font-size: 13px;
    }

    .ops-activity-item {
        grid-template-columns: 32px minmax(0, 1fr);
    }

    .ops-activity-item time {
        grid-column: auto;
        justify-self: end;
    }

    .ops-summary-row__top {
        grid-template-columns: minmax(0, auto) auto minmax(54px, 1fr);
    }

    .ops-summary-row__bottom {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .ops-summary-row--manifest .ops-summary-row__top,
    .ops-summary-row--manifest .ops-summary-row__bottom {
        grid-template-columns: minmax(0, 1fr) minmax(88px, auto);
    }

    .ops-summary-row__top em,
    .ops-summary-row__bottom time {
        justify-self: end;
    }
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    clip-path: inset(50%);
}

.page-subtitle {
    max-width: 720px;
    margin: 6px 0 0;
    color: var(--pulse-muted);
    font-size: 15px;
    line-height: 1.5;
}

.pill-link--secondary {
    border: 1px solid rgba(0, 100, 210, 0.18);
    background: #eef6ff;
    color: var(--pulse-blue);
}

.button {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: 10px;
    cursor: pointer;
    font: inherit;
    font-weight: 800;
    padding: 10px 16px;
    transition: background 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.button:hover {
    transform: translateY(-1px);
}

.button--primary {
    background: var(--pulse-blue);
    color: white;
}

.button--row {
    min-height: 36px;
    background: #13233f;
    color: white;
    padding: 8px 13px;
}

.button--log {
    width: 100%;
    min-width: 92px;
    min-height: 40px;
    background: var(--pulse-blue);
    color: white;
    padding: 9px 16px;
    box-shadow: 0 4px 10px rgba(0, 100, 210, 0.22);
}

.button--log:hover {
    background: #0757ad;
}

.button--ghost {
    min-height: 36px;
    border-color: var(--pulse-border);
    background: white;
    color: var(--pulse-text);
    padding: 8px 12px;
}

.button.is-confirmed {
    border-color: rgba(24, 160, 88, 0.24);
    background: #eaf8f0;
    color: #11683b;
}

.intake-layout {
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(240px, 0.8fr);
    gap: 20px;
    align-items: stretch;
    width: 100%;
}

.intake-main {
    display: grid;
    gap: 20px;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr);
}

.intake-kpis {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    min-height: 96px;
    overflow: hidden;
    border: 1px solid rgba(13, 20, 55, 0.1);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 8px 20px rgba(13, 20, 55, 0.04);
    padding: 0;
}

.intake-kpi {
    --kpi-accent: var(--pulse-blue);
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
    padding: 18px 22px;
}

.intake-kpi + .intake-kpi {
    border-left: 1px solid rgba(13, 20, 55, 0.1);
}

.intake-kpi__icon {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    place-items: center;
    border: 1px solid color-mix(in srgb, var(--kpi-accent) 14%, transparent);
    border-radius: 8px;
    background: color-mix(in srgb, var(--kpi-accent) 7%, #ffffff);
    color: var(--kpi-accent);
}

.intake-kpi__icon svg {
    width: 20px;
    height: 20px;
    stroke-width: 2;
}

.intake-kpi__copy {
    min-width: 0;
}

.intake-kpi__label,
.intake-kpi__value {
    margin: 0;
}

.intake-kpi__label {
    color: var(--pulse-muted);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0;
    text-transform: uppercase;
}

.intake-kpi__value {
    display: block;
    margin-top: 4px;
    color: var(--pulse-text);
    font-size: 36px;
    font-weight: 950;
    line-height: 1;
}

.intake-kpi--pending {
    --kpi-accent: #1268d4;
}

.intake-kpi--logged {
    --kpi-accent: #15834c;
}

.intake-kpi--unknown {
    --kpi-accent: #c97805;
}

.intake-kpi--pending .intake-kpi__value,
.intake-kpi--logged .intake-kpi__value,
.intake-kpi--unknown .intake-kpi__value {
    color: var(--kpi-accent);
}

.intake-activity-card {
    display: grid;
    align-self: stretch;
    align-content: start;
    gap: 16px;
    height: 100%;
    min-height: 240px;
    border: 1px solid rgba(13, 20, 55, 0.1);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 8px 20px rgba(13, 20, 55, 0.04);
    padding: 16px 18px;
}

.intake-activity-card__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    border-bottom: 1px solid rgba(13, 20, 55, 0.08);
    padding-bottom: 14px;
}

.intake-activity-card__head h3 {
    margin: 0;
    color: #1d2748;
    font-size: 13px;
    font-weight: 900;
    line-height: 1.2;
}

.intake-activity-card__head p {
    margin: 4px 0 0;
    color: var(--pulse-muted);
    font-size: 11px;
    font-weight: 800;
    line-height: 1.3;
}

.intake-activity-card__link {
    flex: 0 0 auto;
    font-size: 12px;
    white-space: nowrap;
}

.intake-activity-list {
    display: grid;
    margin: 0;
    padding: 0;
    list-style: none;
}

.intake-activity-item {
    --activity-accent: var(--pulse-blue);
    --activity-surface: #eef6ff;
    position: relative;
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 12px;
    align-items: flex-start;
    min-width: 0;
    padding-bottom: 16px;
}

.intake-activity-item::before {
    content: "";
    position: absolute;
    top: 34px;
    bottom: 0;
    left: 15px;
    width: 1px;
    background: rgba(13, 20, 55, 0.1);
}

.intake-activity-item:last-child {
    padding-bottom: 0;
}

.intake-activity-item:last-child::before {
    display: none;
}

.intake-activity-item--logged {
    --activity-accent: #15834c;
    --activity-surface: #eaf8f0;
}

.intake-activity-item--pending {
    --activity-accent: #1268d4;
    --activity-surface: #eef6ff;
}

.intake-activity-item--exception {
    --activity-accent: #c2410c;
    --activity-surface: #fff1e8;
}

.intake-activity-node {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: 1px solid color-mix(in srgb, var(--activity-accent) 16%, transparent);
    border-radius: 999px;
    background: var(--activity-surface);
    color: var(--activity-accent);
    line-height: 0;
}

.intake-activity-node i,
.intake-activity-node svg {
    display: block;
    width: 17px;
    height: 17px;
    flex: 0 0 17px;
    stroke-width: 2;
}

.intake-activity-copy {
    min-width: 0;
    padding-top: 1px;
}

.intake-activity-list strong,
.intake-activity-list time,
.intake-activity-copy span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.intake-activity-list strong {
    color: var(--pulse-text);
    font-size: 13px;
    font-weight: 900;
    line-height: 1.25;
}

.intake-activity-list time {
    margin-top: 3px;
    color: var(--pulse-muted);
    font-size: 11px;
    font-weight: 800;
}

.intake-activity-copy span {
    margin-top: 4px;
    color: #4a5878;
    font-size: 12px;
    font-weight: 800;
}

.intake-activity-empty {
    border: 1px dashed rgba(13, 20, 55, 0.14);
    border-radius: 8px;
    color: var(--pulse-muted);
    font-size: 13px;
    font-weight: 800;
    padding: 14px;
}

.intake-heading__meta {
    display: grid;
    gap: 12px;
    justify-items: end;
    white-space: nowrap;
}

.intake-heading__row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
}

.user-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--pulse-border);
    border-radius: 999px;
    background: white;
    padding: 5px 12px 5px 5px;
}

.user-chip__avatar {
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    border-radius: 999px;
    background: #eef6ff;
    color: var(--pulse-blue);
    font-size: 12px;
    font-weight: 900;
}

.user-chip__caret {
    color: var(--pulse-muted);
    font-size: 12px;
}

.text-action {
    border: 0;
    background: transparent;
    color: var(--pulse-blue);
    cursor: pointer;
    font: inherit;
    font-weight: 800;
    padding: 0;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 1.5px;
}

.text-action:hover {
    color: #0757ad;
}

.text-action--button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
}

.icon-box-small,
.icon-pin {
    display: inline-grid;
    place-items: center;
}

.icon-box-small {
    width: 18px;
    height: 18px;
    border: 2px solid currentColor;
    border-radius: 4px;
}

.icon-box-small::before {
    content: "";
    width: 6px;
    height: 4px;
    border: 2px solid currentColor;
    border-bottom: 0;
    border-radius: 4px 4px 0 0;
    transform: translateY(-5px);
}

.icon-pin {
    width: 16px;
    height: 16px;
    border: 2px solid currentColor;
    border-radius: 999px 999px 999px 0;
    transform: rotate(-45deg);
}

.icon-pin::before {
    content: "";
    width: 4px;
    height: 4px;
    border-radius: 999px;
    background: currentColor;
}

.intake-search-panel {
    border: 1px solid rgba(0, 100, 210, 0.14);
    box-shadow: 0 18px 40px rgba(13, 20, 55, 0.1);
}

.intake-search-panel__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}

.intake-search-panel__head h3 {
    margin: 0;
    font-size: 20px;
    line-height: 1.2;
}

.intake-clock,
.results-count {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    background: #f8fafc;
    color: var(--pulse-muted);
    font-size: 12px;
    font-weight: 800;
    padding: 8px 11px;
    white-space: nowrap;
}

.intake-clock {
    border: 1px solid var(--pulse-border);
    gap: 8px;
}

.ready-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid rgba(24, 160, 88, 0.22);
    border-radius: 999px;
    background: #f0fbf5;
    color: #11683b;
    font-size: 12px;
    font-weight: 900;
    padding: 8px 12px;
    white-space: nowrap;
}

.intake-search {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
}

.intake-search__field {
    position: relative;
    display: flex;
    align-items: center;
}

.intake-search__icon {
    position: absolute;
    left: 16px;
    width: 24px;
    height: 24px;
    color: #8aa0bd;
    pointer-events: none;
}

.intake-search input {
    width: 100%;
    min-height: 76px;
    border: 2px solid #c8d7eb;
    border-radius: 12px;
    background: #fbfdff;
    color: var(--pulse-text);
    font-size: 24px;
    font-weight: 800;
    letter-spacing: 0;
    padding: 12px 18px 12px 72px;
}

.intake-search input:focus,
.unknown-form input:focus,
.unknown-form select:focus,
.unknown-form textarea:focus {
    border-color: var(--pulse-blue);
    box-shadow: 0 0 0 4px rgba(0, 100, 210, 0.12);
    outline: 0;
}

.intake-search__field:focus-within .intake-search__icon {
    color: var(--pulse-blue);
}

.intake-search .button {
    min-height: 76px;
    min-width: 150px;
    font-size: 16px;
}

.intake-search-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    margin-top: 12px;
}

.intake-search-actions .button {
    min-height: 48px;
}

.intake-search__icon {
    left: 26px;
    width: 30px;
    height: 30px;
    color: var(--pulse-blue);
}

.intake-search__submit {
    gap: 8px;
}

.intake-results-panel {
    min-width: 0;
    overflow: hidden;
    padding: 0;
    box-shadow: 0 12px 28px rgba(13, 20, 55, 0.08);
}

.results-toolbar {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    border-bottom: 1px solid var(--pulse-border);
    background: #fbfdff;
    padding: 18px 20px;
}

.results-toolbar--stacked {
    flex-direction: column;
}

.results-toolbar--stacked .setup-toolbar {
    width: 100%;
}

.setup-results-toolbar__row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
}

.results-toolbar h3,
.result-summary {
    margin: 0;
}

.result-summary {
    max-width: 720px;
    margin-top: 6px;
    color: var(--pulse-muted);
    line-height: 1.45;
}

.results-query {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    font-size: 0.92em;
    color: var(--pulse-blue);
    word-break: break-all;
}

.results-count--exact {
    border: 1px solid rgba(24, 160, 88, 0.24);
    background: #eaf8f0;
    color: #11683b;
}

.results-count--partial {
    border: 1px solid rgba(0, 100, 210, 0.22);
    background: #eaf4ff;
    color: #0757ad;
}

.results-count--none {
    border: 1px solid rgba(237, 139, 0, 0.28);
    background: #fff4df;
    color: #9a5700;
}

.how-it-works-panel {
    border: 1px solid var(--pulse-border);
    box-shadow: 0 8px 20px rgba(13, 20, 55, 0.05);
}

.intake-steps {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
    gap: 16px;
    align-items: center;
    border-bottom: 1px solid var(--pulse-border);
    padding-bottom: 26px;
}

.intake-step {
    position: relative;
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 14px;
    align-items: center;
}

.intake-step strong,
.intake-step p {
    margin: 0;
}

.intake-step p {
    margin-top: 6px;
    color: #4f5e74;
    line-height: 1.45;
}

.step-icon {
    display: grid;
    width: 66px;
    height: 66px;
    place-items: center;
    border: 1px solid #c8d7eb;
    border-radius: 14px;
    background: #eef6ff;
    color: #13233f;
}

.step-icon--barcode::before {
    content: "";
    width: 30px;
    height: 34px;
    background: repeating-linear-gradient(90deg, currentColor 0 3px, transparent 3px 7px);
}

.step-icon--search::before {
    content: "";
    width: 28px;
    height: 28px;
    border: 3px solid currentColor;
    border-radius: 999px;
    box-shadow: 14px 14px 0 -11px currentColor;
}

.step-icon--box::before {
    content: "";
    width: 30px;
    height: 28px;
    border: 3px solid currentColor;
    border-radius: 4px;
    box-shadow: inset 0 8px 0 -5px currentColor;
}

.step-number {
    position: absolute;
    top: 0;
    left: 54px;
    display: grid;
    width: 18px;
    height: 18px;
    place-items: center;
    border-radius: 999px;
    background: var(--pulse-blue);
    color: white;
    font-size: 11px;
    font-weight: 900;
}

.step-arrow {
    color: var(--pulse-blue);
    font-size: 24px;
    font-weight: 900;
}

.button--with-icon {
    gap: 8px;
    color: var(--pulse-blue);
}

/* SVGs inside labelled buttons are decorative marks, not block art — pin them
   to a small, consistent size so they never inflate the button. */
.button--with-icon svg {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
}

/* Primary buttons keep white text/icon even with the icon modifier. */
.button--primary.button--with-icon {
    color: white;
}

.intake-tip-panel {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 14px;
    align-items: center;
    border: 1px solid var(--pulse-border);
    box-shadow: 0 8px 20px rgba(13, 20, 55, 0.05);
}

.intake-tip-panel__body {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 16px;
}

.intake-tip-panel__lead {
    flex: 1 1 260px;
}

.intake-tip-panel strong {
    display: block;
}

.intake-tip-panel p {
    margin: 4px 0 0;
    color: #4f5e74;
}

.tip-icon {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border: 1px solid rgba(0, 100, 210, 0.16);
    border-radius: 12px;
    background: #eef6ff;
    color: var(--pulse-blue);
    font-size: 20px;
    font-weight: 900;
}

.tip-examples summary {
    color: var(--pulse-blue);
    cursor: pointer;
    font-weight: 800;
    list-style: none;
    user-select: none;
}

.tip-examples summary::-webkit-details-marker {
    display: none;
}

.tip-examples summary::after {
    content: " \25BE";
}

.tip-examples[open] summary::after {
    content: " \25B4";
}

.tip-examples__list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.tip-examples__list a {
    border: 1px solid var(--pulse-border);
    border-radius: 999px;
    background: white;
    color: var(--pulse-blue);
    font-size: 12px;
    font-weight: 800;
    padding: 8px 12px;
    transition: border-color 140ms ease, background 140ms ease;
}

.tip-examples__list a:hover {
    border-color: rgba(0, 100, 210, 0.4);
    background: #eef6ff;
}

.exact-match-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(240px, 300px);
    gap: 22px;
    margin: 20px;
    border: 1px solid rgba(0, 100, 210, 0.18);
    border-radius: 12px;
    background: #f8fbff;
    padding: 20px;
}

.exact-match-card__main,
.exact-match-card__meta {
    min-width: 0;
}

.exact-match-card__main p {
    margin: 12px 0 0;
    color: #4c5870;
    line-height: 1.5;
}

.exact-match-card__main .tracking-code {
    margin-top: 10px;
    font-size: 20px;
}

.exact-match-card__meta {
    display: grid;
    gap: 12px;
    align-content: start;
    border-left: 1px solid rgba(0, 100, 210, 0.14);
    padding-left: 20px;
}

.exact-match-card__meta strong {
    display: block;
    margin-top: 2px;
}

.exact-match-card.intake-row--logged {
    border-color: rgba(24, 160, 88, 0.28);
    background: #f3faf5;
}

.intake-log-form {
    display: grid;
    gap: 10px;
    min-width: 0;
}

.receipt-photo-field {
    display: grid;
    gap: 6px;
    min-width: 0;
    color: #4c5870;
    font-size: 12px;
    font-weight: 800;
    text-align: left;
}

.receipt-photo-field span {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.receipt-photo-field small {
    color: var(--pulse-muted);
    font-size: 11px;
    font-weight: 700;
    line-height: 1.4;
}

.receipt-photo-field input[type="file"] {
    width: 100%;
    min-height: 48px;
    overflow: hidden;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: white;
    color: #4c5870;
    font: inherit;
    font-size: 12px;
    padding: 6px;
    text-overflow: ellipsis;
}

.receipt-photo-field input[type="file"]::file-selector-button {
    min-height: 34px;
    margin-right: 8px;
    border: 0;
    border-radius: 8px;
    background: #eaf4ff;
    color: #0757ad;
    cursor: pointer;
    font: inherit;
    font-weight: 900;
    padding: 7px 10px;
}

.evidence-link {
    color: var(--pulse-blue);
    font-size: 13px;
    font-weight: 900;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.table-wrap {
    max-width: 100%;
    overflow-x: auto;
}

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

.intake-table {
    min-width: 940px;
}

.intake-table th {
    white-space: nowrap;
}

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

.data-table th {
    color: #68758a;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.data-table tbody tr {
    background: white;
}

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

.data-table tbody tr:hover {
    background: #f8fbff;
}

.intake-table .col-log {
    width: 250px;
    text-align: right;
}

.intake-table .cell-description {
    min-width: 220px;
}

.intake-table td strong {
    font-size: 14px;
}

.intake-row--best td {
    background: #f4f9ff;
}

.intake-row--best td:first-child {
    box-shadow: inset 3px 0 0 var(--pulse-blue);
}

.intake-row--best:hover td {
    background: #eef6ff;
}

.intake-row--logged td {
    background: #f3faf5;
}

.intake-row--logged td:first-child {
    box-shadow: inset 3px 0 0 #18a058;
}

.match-flag {
    display: inline-flex;
    align-items: center;
    margin-top: 5px;
    border-radius: 999px;
    background: #eaf8f0;
    color: #11683b;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.02em;
    padding: 2px 8px;
    text-transform: uppercase;
}

.tracking-code,
.muted-text {
    display: block;
}

.tracking-code {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    font-size: 13px;
    word-break: break-all;
}

.muted-text {
    margin-top: 4px;
    color: var(--pulse-muted);
    font-size: 12px;
    line-height: 1.4;
}

.row-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.status-chip {
    display: inline-flex;
    min-height: 26px;
    align-items: center;
    gap: 5px;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
    padding: 4px 10px 4px 8px;
    white-space: nowrap;
}

.status-chip__ico {
    width: 13px;
    height: 13px;
    flex: 0 0 auto;
}

.status-chip--pending_arrival {
    border-color: rgba(0, 100, 210, 0.22);
    background: #eaf4ff;
    color: #0757ad;
}

.status-chip--logged {
    border-color: rgba(24, 160, 88, 0.22);
    background: #eaf8f0;
    color: #11683b;
}

.status-chip--unknown {
    border-color: rgba(237, 139, 0, 0.28);
    background: #fff4df;
    color: #9a5700;
}

.status-chip--unknown_attributed {
    border-color: rgba(124, 58, 237, 0.22);
    background: #f1eaff;
    color: #5b21b6;
}

.status-chip--on_hold {
    border-color: rgba(191, 45, 45, 0.2);
    background: #fff0f0;
    color: #a53030;
}

.status-chip--shipped {
    border-color: rgba(0, 137, 150, 0.26);
    background: #e6f5f7;
    color: #0a6d77;
}

.status-chip--delivered {
    border-color: rgba(11, 122, 62, 0.3);
    background: #dff3e6;
    color: #0b7a3e;
}

.status-chip--cancelled {
    border-color: rgba(109, 91, 208, 0.24);
    background: #f1eefb;
    color: #6d5bd0;
}

.empty-state {
    display: grid;
    justify-items: start;
    border: 1px dashed #c7d3e5;
    border-radius: 12px;
    background: #fbfdff;
    padding: 28px;
}

.empty-state--intake {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    margin: 18px 20px 20px;
}

.empty-state h3,
.empty-state p {
    margin: 0;
}

.empty-state p:not(.eyebrow) {
    max-width: 680px;
    margin: 8px 0 18px;
    color: var(--pulse-muted);
    line-height: 1.55;
}

.unknown-lead {
    max-width: 720px;
    margin: 0 0 18px;
    color: var(--pulse-muted);
    line-height: 1.5;
}

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

.unknown-panel {
    border: 1px solid var(--pulse-border);
    box-shadow: 0 12px 28px rgba(13, 20, 55, 0.08);
}

.unknown-panel--active {
    border-color: rgba(237, 139, 0, 0.34);
    box-shadow: 0 14px 32px rgba(237, 139, 0, 0.12);
}

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

.unknown-form label {
    display: grid;
    gap: 7px;
    color: #4c5870;
    font-weight: 800;
}

.unknown-form input,
.unknown-form select,
.unknown-form textarea {
    width: 100%;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: white;
    color: var(--pulse-text);
    font: inherit;
    font-weight: 600;
    padding: 11px 12px;
}

.unknown-form textarea {
    resize: vertical;
}

.full-width-field {
    grid-column: 1 / -1;
}

.form-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
}

.status-panel,
.activity-panel {
    border-radius: 12px;
    box-shadow: 0 8px 20px rgba(13, 20, 55, 0.06);
    padding: 18px;
}

.status-grid {
    display: grid;
    gap: 10px;
}

.status-grid div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border: 1px solid var(--pulse-border);
    border-radius: 10px;
    padding: 11px 12px;
}

.panel-link {
    color: var(--pulse-blue);
    font-size: 12px;
    font-weight: 900;
}

.status-row span:not(.status-icon) {
    flex: 1;
    color: #1d2748;
    font-weight: 800;
}

.status-icon,
.activity-icon {
    display: grid;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    place-items: center;
    border-radius: 12px;
    font-weight: 900;
}

.status-icon--pending_arrival,
.status-icon--pending {
    background: #eaf4ff;
    color: var(--pulse-blue);
}

.status-icon--pending_arrival::before,
.status-icon--pending::before {
    content: "";
    width: 20px;
    height: 15px;
    border: 2px solid currentColor;
    border-radius: 3px;
    box-shadow: 15px 7px 0 -11px currentColor;
}

.status-icon--logged {
    background: #eaf8f0;
    color: #18a058;
}

.status-icon--logged::before {
    content: "";
    width: 18px;
    height: 18px;
    border: 2px solid currentColor;
    border-radius: 999px;
    box-shadow: inset 0 0 0 4px #eaf8f0;
}

.status-icon--unknown {
    background: #fff4df;
    color: #ed8b00;
}

.status-icon--unknown_attributed {
    background: #f1eaff;
    color: #7c3aed;
}

.status-icon--unknown_attributed::before {
    content: "";
    width: 18px;
    height: 18px;
    border: 2px solid currentColor;
    border-radius: 999px;
    box-shadow: 10px 0 0 -6px currentColor;
}

.status-icon--on_hold {
    background: #fff0f0;
    color: #d92d20;
}

.status-icon--on_hold::before {
    content: "";
    width: 18px;
    height: 18px;
    border: 2px solid currentColor;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent 0 7px, currentColor 7px 11px, transparent 11px);
}

.status-grid strong {
    font-size: 24px;
    line-height: 1;
}

.activity-list {
    display: grid;
    gap: 14px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.activity-list li {
    display: grid;
    grid-template-columns: 42px 68px minmax(0, 1fr);
    gap: 10px;
    border-bottom: 1px solid var(--pulse-border);
    padding-bottom: 14px;
}

.activity-list li:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.activity-list time {
    color: var(--pulse-muted);
    font-size: 12px;
    font-weight: 900;
}

.activity-list strong,
.activity-list p {
    margin: 0;
}

.activity-list p {
    margin: 4px 0 8px;
    color: var(--pulse-muted);
    font-size: 13px;
    line-height: 1.45;
}

.action-toast {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 20;
    max-width: min(420px, calc(100vw - 48px));
    border: 1px solid rgba(0, 100, 210, 0.18);
    border-radius: 14px;
    background: #13233f;
    color: white;
    box-shadow: 0 20px 48px rgba(13, 20, 55, 0.24);
    font-weight: 800;
    line-height: 1.45;
    padding: 14px 16px;
}

.expected-layout {
    display: grid;
    gap: 20px;
}

.expected-layout--narrow {
    max-width: 1120px;
}

.expected-context-banner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 420px);
    gap: 20px;
    align-items: center;
    border: 1px solid rgba(0, 100, 210, 0.16);
    border-radius: 14px;
    background: #fbfdff;
    box-shadow: 0 10px 24px rgba(13, 20, 55, 0.06);
    padding: 20px;
}

.expected-context-banner h2,
.expected-context-banner p {
    margin: 0;
}

.expected-context-banner p:not(.eyebrow) {
    max-width: 720px;
    margin-top: 6px;
    color: #4f5e74;
    line-height: 1.5;
}

.context-facts,
.readonly-list,
.detail-list {
    display: grid;
    gap: 10px;
    margin: 0;
}

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

.context-facts div,
.readonly-list div,
.detail-list div {
    min-width: 0;
    border: 1px solid var(--pulse-border);
    border-radius: 10px;
    background: white;
    padding: 12px;
}

.context-facts dt,
.readonly-list dt,
.detail-list dt {
    color: var(--pulse-muted);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.context-facts dd,
.readonly-list dd,
.detail-list dd {
    margin: 5px 0 0;
    color: #17203a;
    font-weight: 850;
    overflow-wrap: anywhere;
}

.expected-grid,
.expected-create-grid,
.expected-detail-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
    gap: 22px;
    align-items: start;
}

.expected-main,
.expected-sidebar {
    display: grid;
    gap: 20px;
    min-width: 0;
}

.expected-filter-panel {
    border: 1px solid var(--pulse-border);
    box-shadow: 0 8px 20px rgba(13, 20, 55, 0.05);
}

.expected-filter-form {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) minmax(180px, 240px) auto;
    gap: 12px;
    align-items: end;
}

.expected-filter-form label,
.expected-form-fields label {
    display: grid;
    gap: 7px;
    color: #4c5870;
    font-weight: 850;
}

.expected-filter-form input,
.expected-filter-form select,
.expected-form-fields input,
.expected-form-fields select,
.expected-form-fields textarea {
    width: 100%;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: white;
    color: var(--pulse-text);
    font: inherit;
    font-weight: 650;
    padding: 11px 12px;
}

.expected-filter-form input:focus,
.expected-filter-form select:focus,
.expected-form-fields input:focus,
.expected-form-fields select:focus,
.expected-form-fields textarea:focus {
    border-color: var(--pulse-blue);
    box-shadow: 0 0 0 4px rgba(0, 100, 210, 0.12);
    outline: 0;
}

.expected-list-panel {
    min-width: 0;
    overflow: hidden;
    padding: 0;
}

.expected-results-toolbar {
    margin: 0;
}

.expected-table {
    min-width: 1120px;
}

.expected-table .cell-description {
    min-width: 220px;
    color: #4f5e74;
    line-height: 1.45;
}

.expected-tracking-link {
    color: var(--pulse-blue);
    font-weight: 900;
}

.expected-empty-state {
    margin: 20px;
}

.success-banner,
.error-banner {
    display: grid;
    gap: 4px;
    border-radius: 12px;
    font-weight: 800;
    line-height: 1.45;
    padding: 14px 16px;
}

.success-banner {
    border: 1px solid rgba(24, 160, 88, 0.22);
    background: #eaf8f0;
    color: #11683b;
}

.success-banner span {
    font-weight: 650;
}

.error-banner {
    border: 1px solid rgba(191, 45, 45, 0.2);
    background: #fff0f0;
    color: #a53030;
}

.expected-create-form,
.readonly-context-card,
.summary-card,
.timeline-card {
    border: 1px solid var(--pulse-border);
    box-shadow: 0 10px 24px rgba(13, 20, 55, 0.06);
}

.expected-form-fields {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(220px, 0.8fr);
    gap: 14px;
    margin-bottom: 16px;
}

.expected-form-fields textarea {
    resize: vertical;
}

.expected-form-fields small {
    color: var(--pulse-muted);
    font-weight: 800;
}

.readonly-list div,
.detail-list div {
    display: grid;
    gap: 2px;
}

.detail-header-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    border-bottom: 1px solid var(--pulse-border);
    padding-bottom: 4px;
}

.detail-header-row h2,
.detail-header-row p {
    margin: 0;
}

.detail-header-row p:not(.eyebrow) {
    margin-top: 6px;
    color: var(--pulse-muted);
}

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

.detail-list div:nth-child(3) {
    grid-column: 1 / -1;
}

.expected-timeline {
    display: grid;
    gap: 16px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.expected-timeline li {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 12px;
    align-items: start;
}

.expected-timeline strong,
.expected-timeline time {
    display: block;
}

.expected-timeline time {
    margin-top: 4px;
    color: var(--pulse-muted);
    font-size: 12px;
    font-weight: 850;
}

.timeline-dot {
    width: 15px;
    height: 15px;
    margin-top: 2px;
    border: 3px solid white;
    border-radius: 999px;
    background: var(--pulse-blue);
    box-shadow: 0 0 0 2px rgba(0, 100, 210, 0.24);
}

.timeline-dot--logged {
    background: #18a058;
    box-shadow: 0 0 0 2px rgba(24, 160, 88, 0.24);
}

.timeline-dot--unknown_attributed {
    background: #7c3aed;
    box-shadow: 0 0 0 2px rgba(124, 58, 237, 0.24);
}

.timeline-dot--on_hold {
    background: #d92d20;
    box-shadow: 0 0 0 2px rgba(217, 45, 32, 0.2);
}

.timeline-dot--pending_arrival {
    background: var(--pulse-blue);
    box-shadow: 0 0 0 2px rgba(0, 100, 210, 0.24);
}

.timeline-dot--shipped {
    background: #0a8996;
    box-shadow: 0 0 0 2px rgba(0, 137, 150, 0.22);
}

.timeline-dot--delivered {
    background: #0b7a3e;
    box-shadow: 0 0 0 2px rgba(11, 122, 62, 0.24);
}

.timeline-dot--cancelled {
    background: #94a0b8;
    box-shadow: 0 0 0 2px rgba(148, 160, 184, 0.28);
}

.timeline-dot--step {
    background: #c3cee0;
    box-shadow: 0 0 0 2px rgba(195, 206, 224, 0.4);
}

.modal-open {
    overflow: hidden;
}

.modal-backdrop {
    position: fixed;
    z-index: 30;
    inset: 0;
    display: grid;
    justify-items: end;
    background: rgba(13, 20, 55, 0.36);
}

.modal-backdrop[hidden] {
    display: none;
}

.unknown-modal {
    width: min(620px, 100vw);
    min-height: 100vh;
    min-height: 100dvh;
    overflow-y: auto;
    background: white;
    box-shadow: -18px 0 42px rgba(13, 20, 55, 0.22);
    padding: 24px;
}

/* --- Add bulk cargo (Phase 16) -------------------------------------------
   A full-height operational drawer. Warm paper surfaces and restrained brand
   accents preserve the Ideal Freight system while the five numbered cards
   keep a long intake form quick to scan on desktop or tablet. */
.bulk-cargo-backdrop {
    overflow: hidden;
    background: rgba(37, 37, 37, 0.58);
    backdrop-filter: blur(2px);
}

.bulk-cargo-modal {
    display: flex;
    width: min(800px, calc(100vw - 32px));
    height: 100vh;
    height: 100dvh;
    flex-direction: column;
    overflow: hidden;
    border-left: 1px solid var(--ifc-sand, #d8c9b2);
    border-radius: 22px 0 0 22px;
    background: var(--ifc-off-white, #f5f1e8);
    color: var(--ifc-charcoal, #252525);
    box-shadow: -22px 0 58px rgba(37, 37, 37, 0.28);
    animation: bulk-cargo-drawer-in 180ms ease-out;
}

@keyframes bulk-cargo-drawer-in {
    from {
        transform: translateX(32px);
        opacity: 0.72;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

.bulk-cargo-modal__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    flex: none;
    border-bottom: 1px solid rgba(216, 201, 178, 0.68);
    background: var(--ifc-paper, #fffdf9);
    padding: 24px 30px 20px;
}

.bulk-cargo-modal__eyebrow {
    margin: 0 0 6px;
    color: var(--ifc-green, #1f5a3b);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.bulk-cargo-modal__header h3 {
    margin: 0;
    color: var(--ifc-charcoal, #252525);
    font-size: clamp(22px, 2.4vw, 28px);
    letter-spacing: -0.025em;
    line-height: 1.15;
}

.bulk-cargo-modal__lede {
    margin: 7px 0 0;
    max-width: 58ch;
    color: var(--ifc-muted, #625e56);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.5;
}

.bulk-cargo-modal .bulk-cargo-modal__close {
    width: 42px;
    height: 42px;
    flex: none;
    border-color: var(--ifc-sand, #d8c9b2);
    border-radius: 11px;
    background: var(--ifc-paper, #fffdf9);
}

.bulk-cargo-modal__close svg {
    width: 20px;
    height: 20px;
}

.bulk-cargo-form {
    display: grid;
    min-height: 0;
    flex: 1;
    gap: 14px;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 18px 20px 30px;
    scrollbar-color: var(--ifc-sand, #d8c9b2) transparent;
}

.bulk-cargo-form__errors p {
    margin: 0;
}

.bulk-cargo-form__errors p + p {
    margin-top: 6px;
}

.bulk-cargo-form__notice {
    margin: 0;
    border: 1px solid #fcd34d;
    border-radius: 12px;
    background: #fffbeb;
    color: #92400e;
    font-size: 13px;
    font-weight: 700;
    padding: 11px 13px;
}

.bulk-cargo-section {
    display: grid;
    gap: 13px;
    border: 1px solid #e2d7c6;
    border-radius: 15px;
    background: var(--ifc-paper, #fffdf9);
    box-shadow: 0 3px 12px rgba(73, 61, 43, 0.045);
    padding: 17px 18px;
}

.bulk-cargo-section--review {
    background: var(--ifc-paper, #fffdf9);
}

.bulk-cargo-section__title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    color: var(--ifc-charcoal, #252525);
    font-size: 15px;
    font-weight: 800;
}

.bulk-cargo-section__step {
    display: inline-grid;
    width: 26px;
    height: 26px;
    flex: none;
    place-items: center;
    border-radius: 999px;
    background: var(--ifc-green, #1f5a3b);
    color: var(--ifc-off-white, #f5f1e8);
    box-shadow: 0 3px 8px rgba(31, 90, 59, 0.2);
    font-size: 12px;
    font-weight: 800;
}

.bulk-cargo-grid {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
}

.bulk-cargo-hint {
    margin: 0;
    color: var(--ifc-muted, #625e56);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.45;
}

.bulk-cargo-hint:empty {
    display: none;
}

.bulk-cargo-hint--warn {
    color: #b45309;
}

.bulk-cargo-driver-photo[hidden] {
    display: none;
}

.bulk-cargo-conditional[hidden] {
    display: none;
}

.bulk-cargo-conditional {
    display: grid;
    gap: 10px;
}

.bulk-cargo-combobox,
.bulk-cargo-fixed-select {
    position: relative;
    min-width: 0;
}

.bulk-cargo-combobox.is-open,
.bulk-cargo-fixed-select.is-open {
    z-index: 80;
}

.bulk-cargo-combobox__control {
    position: relative;
}

.bulk-cargo-combobox__search,
.bulk-cargo-combobox__control > svg[data-lucide="search"] {
    position: absolute;
    z-index: 1;
    top: 50%;
    width: 18px;
    height: 18px;
    left: 14px;
    color: #766e63;
    pointer-events: none;
    transform: translateY(-50%);
}

.bulk-cargo-modal .bulk-cargo-combobox__control > input {
    width: 100%;
    height: 48px;
    min-height: 48px;
    border: 1px solid #c7b89f;
    border-radius: 9px;
    background: var(--ifc-paper, #fffdf9);
    color: var(--ifc-charcoal, #252525);
    font: inherit;
    font-weight: 650;
    padding: 10px 44px 10px 42px;
    box-shadow: none;
}

.bulk-cargo-combobox__toggle {
    position: absolute;
    top: 50%;
    right: 14px;
    display: inline-grid;
    width: 26px;
    height: 32px;
    place-items: center;
    border: 0;
    background: transparent;
    color: var(--ifc-charcoal, #252525);
    cursor: pointer;
    padding: 0;
    transform: translateY(-50%);
}

.bulk-cargo-combobox__toggle svg {
    width: 17px;
    height: 17px;
    transition: transform 140ms ease;
}

.bulk-cargo-combobox.is-open .bulk-cargo-combobox__toggle svg,
.bulk-cargo-fixed-select.is-open .bulk-cargo-fixed-select__trigger > svg {
    transform: rotate(180deg);
}

.bulk-cargo-combobox.is-open .bulk-cargo-combobox__control > input,
.bulk-cargo-combobox__control > input:focus {
    border-color: var(--ifc-green, #1f5a3b);
    outline: none;
    box-shadow: 0 0 0 3px rgba(31, 90, 59, 0.13);
}

.bulk-cargo-combobox__menu,
.bulk-cargo-fixed-select__menu {
    position: absolute;
    z-index: 90;
    top: calc(100% + 7px);
    right: 0;
    left: 0;
    max-height: 280px;
    overflow-y: auto;
    overscroll-behavior: contain;
    border: 1px solid #d7cbb8;
    border-radius: 11px;
    background: var(--ifc-paper, #fffdf9);
    box-shadow: 0 14px 30px rgba(73, 61, 43, 0.16);
    padding: 6px;
    scrollbar-color: var(--ifc-sand, #d8c9b2) transparent;
}

.bulk-cargo-combobox.opens-up .bulk-cargo-combobox__menu,
.bulk-cargo-fixed-select.opens-up .bulk-cargo-fixed-select__menu {
    top: auto;
    bottom: calc(100% + 7px);
}

.bulk-cargo-combobox__menu[hidden],
.bulk-cargo-fixed-select__menu[hidden],
.bulk-cargo-combobox__listbox[hidden],
.bulk-cargo-combobox__group[hidden],
.bulk-cargo-combobox__option[hidden],
.bulk-cargo-combobox__message[hidden] {
    display: none;
}

.bulk-cargo-combobox__group + .bulk-cargo-combobox__group {
    margin-top: 4px;
}

.bulk-cargo-combobox__group-label {
    margin: 0;
    color: #766e63;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 0.065em;
    padding: 7px 10px 5px;
    text-transform: uppercase;
}

.bulk-cargo-combobox__option {
    position: relative;
    display: grid;
    width: 100%;
    min-height: 50px;
    align-items: center;
    gap: 10px;
    grid-template-columns: 34px minmax(0, 1fr) 20px;
    border: 0;
    border-left: 3px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: var(--ifc-charcoal, #252525);
    cursor: pointer;
    font: inherit;
    padding: 8px 10px 8px 8px;
    text-align: left;
}

.bulk-cargo-combobox__option:hover {
    background: #f6f1e8;
}

.bulk-cargo-combobox__option.is-keyboard-active {
    background: var(--ifc-gold-soft, #f3e7d2);
    box-shadow: 0 0 0 1px rgba(193, 138, 43, 0.3) inset;
}

.bulk-cargo-combobox__option.is-selected {
    border-left-color: var(--ifc-green, #1f5a3b);
    background: var(--ifc-green-soft, #e6efe9);
}

.bulk-cargo-combobox__option.is-selected.is-keyboard-active {
    background: linear-gradient(
        90deg,
        var(--ifc-green-soft, #e6efe9),
        #f4eddf
    );
    box-shadow: 0 0 0 1px rgba(193, 138, 43, 0.44) inset;
}

.bulk-cargo-combobox__marker,
.bulk-cargo-combobox__message-icon {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border-radius: 9px;
    background: var(--ifc-sand-soft, #eee6d9);
    color: var(--ifc-charcoal, #252525);
}

.bulk-cargo-combobox__option.is-selected .bulk-cargo-combobox__marker {
    background: #d8e8dd;
    color: var(--ifc-green, #1f5a3b);
}

.bulk-cargo-combobox__marker svg,
.bulk-cargo-combobox__message-icon svg {
    width: 16px;
    height: 16px;
}

.bulk-cargo-combobox__option-copy {
    display: grid;
    min-width: 0;
    gap: 2px;
}

.bulk-cargo-combobox__option-copy strong {
    overflow: hidden;
    color: var(--ifc-charcoal, #252525);
    font-size: 13px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bulk-cargo-combobox__option-copy small {
    overflow: hidden;
    color: var(--ifc-muted, #625e56);
    font-size: 11px;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bulk-cargo-combobox__check {
    display: inline-grid;
    place-items: center;
    color: var(--ifc-green, #1f5a3b);
    opacity: 0;
}

.bulk-cargo-combobox__option.is-selected .bulk-cargo-combobox__check {
    opacity: 1;
}

.bulk-cargo-combobox__check svg {
    width: 17px;
    height: 17px;
    stroke-width: 2.5;
}

.bulk-cargo-combobox__message {
    display: grid;
    min-height: 58px;
    align-items: center;
    gap: 10px;
    grid-template-columns: 32px minmax(0, 1fr);
    border-radius: 8px;
    background: #faf7f0;
    padding: 9px 10px;
}

.bulk-cargo-combobox__message > span:last-child {
    display: grid;
    gap: 2px;
}

.bulk-cargo-combobox__message strong {
    color: var(--ifc-charcoal, #252525);
    font-size: 12.5px;
}

.bulk-cargo-combobox__message small {
    color: var(--ifc-muted, #625e56);
    font-size: 11px;
    font-weight: 650;
    line-height: 1.35;
}

.bulk-cargo-fixed-select::after {
    position: absolute;
    top: 18px;
    right: 16px;
    width: 7px;
    height: 7px;
    border-right: 1.5px solid var(--ifc-charcoal, #252525);
    border-bottom: 1.5px solid var(--ifc-charcoal, #252525);
    content: "";
    pointer-events: none;
    transform: rotate(45deg);
}

.bulk-cargo-fixed-select > select,
.bulk-cargo-fixed-select__trigger {
    width: 100%;
    height: 48px;
    min-height: 48px;
    border: 1px solid #c7b89f;
    border-radius: 9px;
    background: var(--ifc-paper, #fffdf9);
    color: var(--ifc-charcoal, #252525);
    font: inherit;
    font-weight: 650;
}

.bulk-cargo-fixed-select > select {
    appearance: none;
    padding: 10px 42px 10px 12px;
}

.bulk-cargo-fixed-select.is-enhanced::after {
    display: none;
}

.bulk-cargo-fixed-select.is-enhanced > select {
    position: absolute;
    width: 1px;
    height: 1px;
    min-height: 0;
    overflow: hidden;
    clip-path: inset(50%);
    opacity: 0;
    pointer-events: none;
}

.bulk-cargo-fixed-select__trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    cursor: pointer;
    padding: 10px 13px;
    text-align: left;
}

.bulk-cargo-fixed-select__trigger:not(.has-value) {
    color: #8b8276;
}

.bulk-cargo-fixed-select__trigger > svg {
    width: 17px;
    height: 17px;
    flex: none;
    color: var(--ifc-charcoal, #252525);
    transition: transform 140ms ease;
}

.bulk-cargo-fixed-select.is-open .bulk-cargo-fixed-select__trigger,
.bulk-cargo-fixed-select__trigger:focus-visible {
    border-color: var(--ifc-green, #1f5a3b);
    outline: none;
    box-shadow: 0 0 0 3px rgba(31, 90, 59, 0.13);
}

.bulk-cargo-fixed-select__trigger[aria-invalid="true"] {
    border-color: var(--ifc-danger, #9b3030);
}

.bulk-cargo-fixed-select__option {
    min-height: 48px;
}

.bulk-cargo-choices {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    margin: 0;
    border: 0;
    padding: 0;
}

.bulk-cargo-choice {
    display: grid;
    align-items: center;
    gap: 11px;
    grid-template-columns: 20px 40px minmax(0, 1fr);
    min-height: 86px;
    border: 1px solid #d7cbb8;
    border-radius: 12px;
    background: var(--ifc-paper, #fffdf9);
    cursor: pointer;
    padding: 13px 14px;
    transition: border-color 140ms ease, background 140ms ease, box-shadow 140ms ease;
}

.bulk-cargo-choice:has(input:checked) {
    border-color: var(--ifc-green, #1f5a3b);
    background: #f3f8f4;
    box-shadow: 0 0 0 1px rgba(31, 90, 59, 0.14) inset;
}

.bulk-cargo-choice input {
    width: 20px;
    height: 20px;
    flex: none;
    margin: 0;
    accent-color: var(--ifc-green, #1f5a3b);
}

.bulk-cargo-choice__icon {
    display: inline-grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 999px;
    background: var(--ifc-sand-soft, #eee6d9);
    color: var(--ifc-charcoal, #252525);
}

.bulk-cargo-choice:has(input:checked) .bulk-cargo-choice__icon {
    background: var(--ifc-green-soft, #e6efe9);
    color: var(--ifc-green, #1f5a3b);
}

.bulk-cargo-choice__icon svg {
    width: 20px;
    height: 20px;
}

.bulk-cargo-choice strong {
    display: block;
    font-size: 14px;
}

.bulk-cargo-choice small {
    display: block;
    margin-top: 2px;
    color: var(--ifc-muted, #625e56);
    font-size: 12px;
    font-weight: 700;
}

.bulk-cargo-pieces {
    display: grid;
    gap: 10px;
}

.bulk-cargo-pieces__labels,
.bulk-cargo-pieces__row {
    display: grid;
    align-items: end;
    gap: 10px;
    grid-template-columns: minmax(90px, 0.5fr) minmax(160px, 1.5fr) 44px;
}

.bulk-cargo-pieces__labels {
    color: var(--pulse-muted);
    font-size: 12px;
    font-weight: 800;
}

.bulk-cargo-pieces__rows {
    display: grid;
    gap: 10px;
}

.bulk-cargo-pieces__field-label {
    display: none;
}

.bulk-cargo-pieces__remove {
    display: inline-grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border: 1px solid #d7cbb8;
    border-radius: 10px;
    background: var(--ifc-paper, #fffdf9);
    color: var(--ifc-danger, #9b3030);
    cursor: pointer;
}

.bulk-cargo-pieces__remove[disabled] {
    color: var(--pulse-muted);
    cursor: not-allowed;
    opacity: 0.55;
}

.bulk-cargo-pieces__add {
    justify-self: start;
    border-color: var(--ifc-green, #1f5a3b);
    color: var(--ifc-green, #1f5a3b);
}

.bulk-cargo-pieces__add svg {
    width: 17px;
    height: 17px;
}

.bulk-cargo-upload-field {
    display: grid;
    gap: 7px;
}

.bulk-cargo-upload-field__label {
    margin: 0;
    color: var(--ifc-charcoal, #252525);
    font-size: 13px;
    font-weight: 800;
}

.bulk-cargo-upload-field__label small {
    margin-left: 4px;
    color: var(--ifc-muted, #625e56);
    font-weight: 600;
}

.bulk-cargo-upload {
    display: flex;
    min-height: 88px;
    align-items: center;
    justify-content: center;
    gap: 13px;
    border: 1px dashed #bca98c;
    border-radius: 12px;
    background: #fcfaf5;
    cursor: pointer;
    padding: 18px;
    text-align: left;
    transition: border-color 140ms ease, background 140ms ease, box-shadow 140ms ease;
}

.bulk-cargo-upload:hover,
.bulk-cargo-upload.is-dragging {
    border-color: var(--ifc-green, #1f5a3b);
    background: var(--ifc-green-soft, #e6efe9);
    box-shadow: 0 0 0 3px rgba(31, 90, 59, 0.08);
}

.bulk-cargo-upload:focus-within {
    outline: 2px solid rgba(31, 90, 59, 0.5);
    outline-offset: 2px;
}

.bulk-cargo-upload__icon {
    display: inline-grid;
    width: 42px;
    height: 42px;
    flex: none;
    place-items: center;
    border-radius: 999px;
    background: var(--ifc-green-soft, #e6efe9);
    color: var(--ifc-green, #1f5a3b);
}

.bulk-cargo-upload__icon svg {
    width: 22px;
    height: 22px;
}

.bulk-cargo-upload__copy {
    display: grid;
    gap: 3px;
}

.bulk-cargo-upload__copy strong {
    color: var(--ifc-charcoal, #252525);
    font-size: 13px;
}

.bulk-cargo-upload__copy strong span {
    font-weight: 600;
}

.bulk-cargo-upload__copy small {
    color: var(--ifc-muted, #625e56);
    font-size: 12px;
    font-weight: 600;
}

.bulk-cargo-photo-count:not(:empty) {
    color: var(--ifc-green, #1f5a3b);
}

.bulk-cargo-review {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 0;
    border: 1px solid #e2d7c6;
    border-radius: 11px;
    background: #faf7f0;
    padding: 14px 16px;
}

.bulk-cargo-review dt {
    color: var(--pulse-muted);
    font-size: 12px;
    font-weight: 800;
}

.bulk-cargo-review dd {
    margin: 3px 0 0;
    color: var(--ifc-charcoal, #252525);
    font-weight: 750;
    line-height: 1.35;
}

.bulk-cargo-modal .pkg-field input,
.bulk-cargo-modal .pkg-field select,
.bulk-cargo-modal .pkg-field textarea {
    min-height: 46px;
}

.bulk-cargo-modal [aria-invalid="true"] {
    border-color: #dc2626;
}

.bulk-cargo-section--review .form-actions {
    justify-content: flex-start;
    margin-top: 1px;
}

.bulk-cargo-section--review .button--primary svg {
    width: 17px;
    height: 17px;
}

@media (max-width: 720px) {
    .bulk-cargo-modal {
        width: 100vw;
        border-left: 0;
        border-radius: 0;
    }

    .bulk-cargo-modal__header {
        padding: 20px 18px 17px;
    }

    .bulk-cargo-form {
        padding: 14px 12px 24px;
    }

    .bulk-cargo-section {
        padding: 15px;
    }

    .bulk-cargo-choices,
    .bulk-cargo-grid {
        grid-template-columns: 1fr;
    }

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

    .bulk-cargo-pieces__labels {
        display: none;
    }

    .bulk-cargo-pieces__row {
        grid-template-columns: minmax(0, 1fr) 44px;
        grid-template-areas:
            "quantity remove"
            "type type";
    }

    .bulk-cargo-pieces__row .pkg-field:first-child {
        grid-area: quantity;
    }

    .bulk-cargo-pieces__row .pkg-field:nth-child(2) {
        grid-area: type;
    }

    .bulk-cargo-pieces__remove {
        grid-area: remove;
    }

    .bulk-cargo-pieces__field-label {
        display: block;
    }
}

@media (prefers-reduced-motion: reduce) {
    .bulk-cargo-modal {
        animation: none;
    }

    .bulk-cargo-choice,
    .bulk-cargo-upload {
        transition: none;
    }
}

.unknown-modal__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

.unknown-modal__header h3 {
    margin: 0;
}

.modal-close {
    display: inline-grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border: 1px solid var(--pulse-border);
    border-radius: 10px;
    background: #f8fafc;
    color: var(--pulse-text);
    cursor: pointer;
    font-size: 24px;
    line-height: 1;
}

@media (max-width: 1180px) {
    .expected-grid,
    .expected-create-grid,
    .expected-detail-grid {
        grid-template-columns: 1fr;
    }

    .intake-table {
        display: block;
        min-width: 0;
        border-collapse: separate;
    }

    .intake-table thead {
        display: none;
    }

    .intake-table tbody {
        display: grid;
        gap: 16px;
        padding: 18px;
    }

    .intake-table tr {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        overflow: hidden;
        border: 1px solid var(--pulse-border);
        border-radius: 14px;
        background: white;
        box-shadow: 0 8px 20px rgba(13, 20, 55, 0.06);
    }

    .intake-table td {
        display: grid;
        align-content: start;
        gap: 4px;
        border: 0;
        padding: 14px 16px;
        text-align: left;
    }

    .intake-table td::before {
        content: attr(data-label);
        color: var(--pulse-muted);
        font-size: 11px;
        font-weight: 900;
        letter-spacing: 0.04em;
        text-transform: uppercase;
        white-space: nowrap;
    }

    .intake-table .col-log {
        width: auto;
        grid-column: 1 / -1;
        border-top: 1px solid var(--pulse-border);
        background: #f8fbff;
    }

    .intake-table .intake-log-form {
        grid-template-columns: minmax(0, 1fr) minmax(180px, 0.55fr);
        align-items: end;
    }

    .warehouse-intake-page .button,
    .warehouse-intake-page .modal-close {
        min-height: 48px;
    }

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

@media (max-width: 980px) {
    .sidebar {
        position: fixed;
        z-index: 25;
        inset: 0 auto 0 0;
        transform: translateX(-100%);
    }

    body.sidebar-open .sidebar {
        transform: translateX(0);
    }

    body.sidebar-open .sidebar-backdrop {
        display: block;
    }

    .menu-button {
        display: inline-block;
    }

    .menu-button--sidebar {
        display: inline-block;
    }

    .stat-grid,
    .two-column,
    .intake-layout,
    .form-grid,
    .expected-sidebar,
    .expected-context-banner,
    .context-facts,
    .expected-filter-form {
        grid-template-columns: 1fr;
    }

    .intake-activity-card {
        height: auto;
        min-height: 0;
    }

    .intake-search {
        grid-template-columns: 1fr;
    }

    .intake-search .button {
        width: 100%;
    }

    .intake-search-actions {
        justify-content: stretch;
    }

    .intake-search-actions .button {
        width: 100%;
        justify-content: center;
    }

    .results-toolbar,
    .empty-state--intake {
        align-items: flex-start;
        flex-direction: column;
    }

    .empty-state--intake {
        grid-template-columns: 1fr;
    }

    .exact-match-card {
        grid-template-columns: 1fr;
    }

    .exact-match-card__meta {
        border-left: 0;
        border-top: 1px solid rgba(0, 100, 210, 0.14);
        padding-top: 16px;
        padding-left: 0;
    }

    .expected-filter-form .button {
        width: 100%;
    }

    .detail-header-row {
        flex-direction: column;
    }
}

@media (min-width: 720px) and (max-width: 980px) {
    html[data-sidebar-touch="true"][data-sidebar="auto"] .sidebar {
        position: sticky;
        z-index: auto;
        width: 0;
        flex-basis: 0;
        overflow: hidden;
        visibility: hidden;
        padding-right: 0;
        padding-left: 0;
        box-shadow: none;
        transform: none;
        transition: width 140ms ease, flex-basis 140ms ease, padding 140ms ease;
    }

    html[data-sidebar-touch="true"][data-sidebar="auto"][data-sidebar-reveal="true"] .sidebar {
        width: var(--pulse-sidebar);
        flex-basis: var(--pulse-sidebar);
        overflow-y: auto;
        visibility: visible;
        padding: 24px 18px;
    }

    html[data-sidebar-touch="true"][data-sidebar="auto"][data-sidebar-reveal="true"] .menu-button--topbar {
        visibility: hidden;
        pointer-events: none;
    }

    html[data-sidebar-touch="true"][data-sidebar="auto"][data-sidebar-reveal="true"] .menu-button--sidebar {
        display: inline-block;
    }

    html[data-sidebar-touch="true"] body.sidebar-open .sidebar-backdrop {
        display: none;
    }
}

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

    .staff-floating-controls {
        top: 14px;
        padding-right: 18px;
        padding-left: 18px;
    }

    .content {
        padding: 82px 18px 30px;
    }

    .page-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .intake-heading__meta {
        justify-items: start;
        width: 100%;
    }

    .intake-heading__row {
        justify-content: flex-start;
    }

    .intake-kpis {
        grid-template-columns: 1fr;
    }

    .intake-kpi {
        min-height: 82px;
        padding: 16px 18px;
    }

    .intake-kpi + .intake-kpi {
        border-top: 1px solid rgba(13, 20, 55, 0.1);
        border-left: 0;
    }

    .intake-kpi__value {
        font-size: 34px;
    }

    .intake-search input {
        min-height: 58px;
        font-size: 18px;
    }

    .intake-table tr,
    .intake-table .intake-log-form {
        grid-template-columns: 1fr;
    }

    .panel {
        padding: 18px;
    }

    .expected-form-fields,
    .detail-list {
        grid-template-columns: 1fr;
    }

    .expected-empty-state {
        margin: 16px;
    }

    .unknown-modal {
        width: 100vw;
    }
}

/* ==========================================================================
   Phase 4 Expected Packages — actor-scoped package UI
   ========================================================================== */

.pkg-layout {
    display: grid;
    /* A single minmax(0, 1fr) column so wide children (metric row, table) can
       never stretch the layout past the available content width. */
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
    min-width: 0;
}

.pkg-layout > * {
    min-width: 0;
    max-width: 100%;
}

/* --- Summary metrics (segmented quick filters) --------------------------- */
/* Flex-wrap fills the row evenly whether there are five (workspace) or six
   (history) cards, and reflows to multiple rows on narrow screens. */
.pkg-metrics {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

/* Divider is only meaningful in the single-row layout; hidden so the grid
   reflows cleanly without a stray empty cell. */
.pkg-metrics__divider {
    display: none;
}

.pkg-metric {
    display: flex;
    flex: 1 1 150px;
    min-width: 0;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border: 1px solid transparent;
    border-radius: 14px;
    background: #fbfcfe;
    padding: 14px 16px;
    transition: background 140ms ease, border-color 140ms ease, box-shadow 140ms ease;
}

.pkg-metric:hover {
    background: white;
    border-color: var(--pulse-border);
    box-shadow: 0 6px 16px rgba(13, 20, 55, 0.06);
}

.pkg-metric--lead {
    background: white;
    border-color: var(--pulse-border);
}

.pkg-metric--active {
    background: white;
    border-color: rgba(0, 100, 210, 0.4);
    box-shadow: 0 0 0 1px rgba(0, 100, 210, 0.4), 0 6px 16px rgba(13, 20, 55, 0.06);
}

.pkg-metric__text {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.pkg-metric__label {
    color: var(--pulse-muted);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.25;
    /* Wrap rather than truncate so the full label is never lost when six
       cards share a constrained row. */
    overflow-wrap: anywhere;
}

.pkg-metric__value {
    font-size: 22px;
    font-weight: 800;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    color: #17203a;
}

.pkg-metric__value--all { color: #17203a; }
.pkg-metric__value--pending_arrival { color: var(--pulse-blue); }
.pkg-metric__value--logged { color: #0f7a43; }
.pkg-metric__value--shipped { color: #0a6d77; }
.pkg-metric__value--delivered { color: #0b7a3e; }
.pkg-metric__value--cancelled { color: #6d5bd0; }

.pkg-metric__icon {
    display: grid;
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    place-items: center;
    border-radius: 999px;
}

.pkg-metric__icon .pkg-ico {
    width: 18px;
    height: 18px;
}

.pkg-metric__icon--all { background: #eef1f8; color: #3b4667; }
.pkg-metric__icon--pending_arrival { background: #eaf2ff; color: var(--pulse-blue); }
.pkg-metric__icon--logged { background: #e7f7ee; color: #0f7a43; }
.pkg-metric__icon--shipped { background: #e3f4f6; color: #0a6d77; }
.pkg-metric__icon--delivered { background: #e2f3e8; color: #0b7a3e; }
.pkg-metric__icon--cancelled { background: #f1eefb; color: #6d5bd0; }

/* --- Filter toolbar ------------------------------------------------------- */
.pkg-toolbar-panel {
    border: 1px solid var(--pulse-border);
    box-shadow: 0 8px 20px rgba(13, 20, 55, 0.05);
}

.pkg-toolbar-panel--embedded {
    border-width: 1px 0 0;
    box-shadow: none;
    padding: 18px 24px;
}

.pkg-toolbar {
    display: grid;
    grid-template-columns:
        minmax(0, 1.35fr)
        minmax(0, 0.8fr)
        minmax(0, 0.72fr)
        minmax(0, 0.78fr)
        minmax(0, 0.66fr)
        max-content;
    gap: 10px;
    align-items: end;
}

.pkg-toolbar--history {
    grid-template-columns:
        minmax(0, 1.45fr)
        minmax(0, 0.85fr)
        minmax(0, 0.75fr)
        minmax(0, 0.75fr)
        max-content;
}

/* Staff Warehouse Items toolbar: search, received-date, scope, courier,
   source, status, actions. */
.pkg-toolbar--items {
    grid-template-columns:
        minmax(0, 1.4fr)
        minmax(0, 0.9fr)
        minmax(0, 0.72fr)
        minmax(0, 0.85fr)
        minmax(0, 0.9fr)
        minmax(0, 0.7fr)
        max-content;
}

.pkg-field {
    display: grid;
    gap: 7px;
    min-width: 0;
    color: #4c5870;
    font-weight: 800;
}

.pkg-field--full {
    grid-column: 1 / -1;
}

.pkg-field input,
.pkg-field select,
.pkg-field textarea {
    width: 100%;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: white;
    color: var(--pulse-text);
    font: inherit;
    font-weight: 650;
    padding: 11px 12px;
}

.pkg-toolbar .pkg-field input,
.pkg-toolbar .pkg-field select,
.pkg-toolbar .pkg-date-picker__trigger {
    min-height: 42px;
    padding: 9px 11px;
}

.pkg-field textarea {
    resize: vertical;
}

.pkg-field small {
    color: var(--pulse-muted);
    font-size: 11px;
    font-weight: 700;
}

.pkg-date-filter {
    min-width: 0;
    position: relative;
}

.pkg-date-picker {
    position: relative;
}

.pkg-date-picker__trigger {
    align-items: center;
    background: white;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    color: var(--pulse-text);
    cursor: pointer;
    display: flex;
    font: inherit;
    font-weight: 750;
    gap: 10px;
    height: 42px;
    justify-content: space-between;
    list-style: none;
    padding: 11px 12px;
}

.pkg-date-picker__trigger::-webkit-details-marker {
    display: none;
}

.pkg-date-picker[open] .pkg-date-picker__trigger {
    border-color: var(--pulse-blue);
    box-shadow: 0 0 0 4px rgba(0, 100, 210, 0.12);
}

.pkg-date-picker__trigger:focus-visible {
    border-color: var(--pulse-blue);
    box-shadow: 0 0 0 4px rgba(0, 100, 210, 0.12);
    outline: 0;
}

.pkg-date-picker__value {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pkg-date-picker__icon {
    color: var(--pulse-muted);
    flex: 0 0 auto;
    font-size: 12px;
}

.pkg-date-picker__panel {
    background: #fff;
    border: 1px solid #cbd5e1;
    border-radius: 16px;
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.18);
    display: grid;
    gap: 14px;
    left: 0;
    padding: 16px;
    position: absolute;
    top: calc(100% + 8px);
    width: min(520px, calc(100vw - 40px));
    z-index: 40;
}

.pkg-date-picker__header {
    display: grid;
    gap: 2px;
}

.pkg-date-picker__header strong {
    color: var(--pulse-text);
    font-size: 14px;
}

.pkg-date-range {
    display: grid;
    grid-template-columns: repeat(2, minmax(112px, 1fr));
    gap: 8px;
}

.pkg-date-range label {
    display: grid;
    gap: 4px;
}

.pkg-date-range label span {
    color: var(--pulse-muted);
    font-size: 11px;
    font-weight: 800;
}

.pkg-date-range input {
    min-width: 0;
}

.pkg-date-picker__actions {
    align-items: center;
    display: flex;
    gap: 10px;
    justify-content: flex-end;
}

.pkg-field input:focus,
.pkg-field select:focus,
.pkg-field textarea:focus {
    border-color: var(--pulse-blue);
    box-shadow: 0 0 0 4px rgba(0, 100, 210, 0.12);
    outline: 0;
}

.pkg-toolbar__actions {
    display: flex;
    gap: 8px;
    min-width: 0;
    white-space: nowrap;
}

.pkg-toolbar__actions .button {
    min-height: 42px;
    padding: 9px 10px;
}

.pkg-reset-button {
    display: inline-grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid var(--pulse-border);
    border-radius: 999px;
    background: #fff;
    color: var(--pulse-muted);
    text-decoration: none;
    transition: background 140ms ease, border-color 140ms ease, color 140ms ease;
}

.pkg-reset-button:hover {
    border-color: #c9d5e4;
    background: #f7f9fd;
    color: var(--pulse-blue);
}

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

.pkg-table-controls {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

/* ==========================================================================
   Premium package ledger — the hero table
   ========================================================================== */
.pkg-list-panel {
    min-width: 0;
    /* Contain the table (and its header/footer) inside the rounded card. Any
       horizontal scrolling happens on the inner wrapper, never the page. */
    overflow: hidden;
    padding: 0;
}

.shipment-index-panel {
    overflow: hidden;
}

.shipment-index-toolbar {
    border-bottom: 1px solid var(--pulse-border);
}

.shipment-index-filters {
    grid-template-columns: minmax(0, 1.5fr) minmax(180px, 0.75fr) minmax(170px, 0.7fr) max-content;
    border-bottom: 1px solid var(--pulse-border);
    padding: 14px 18px;
}

/* Shipment Summaries uses a dedicated operational KPI strip. The package and
   portal metric rows retain their compact shared treatment. */
.shipment-kpis {
    display: grid;
    grid-template-columns: minmax(200px, 1.25fr) repeat(4, minmax(160px, 1fr));
    gap: 14px;
    min-width: 0;
}

.shipment-kpi {
    --shipment-kpi-accent: #64748b;
    --shipment-kpi-tint: #f1f5f9;
    position: relative;
    display: grid;
    grid-template-rows: auto 1fr auto;
    min-width: 0;
    min-height: 168px;
    overflow: hidden;
    border: 1px solid #dce3ec;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.055);
    color: #17203a;
    padding: 18px 20px 19px;
    text-decoration: none;
    transition: border-color 140ms ease, box-shadow 140ms ease;
}

.shipment-kpi::before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 3px;
    background: var(--shipment-kpi-accent);
    content: "";
}

.shipment-kpi:hover {
    border-color: #c8d2df;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.09);
}

.shipment-kpi:focus-visible {
    border-color: var(--shipment-kpi-accent);
    box-shadow: 0 0 0 4px rgba(0, 100, 210, 0.14), 0 12px 28px rgba(15, 23, 42, 0.09);
    outline: 0;
}

.shipment-kpi--active {
    border-color: var(--shipment-kpi-accent);
    box-shadow: 0 0 0 1px var(--shipment-kpi-accent), 0 10px 26px rgba(15, 23, 42, 0.08);
}

.shipment-kpi--all {
    --shipment-kpi-accent: #0b6ee8;
    --shipment-kpi-tint: #eaf3ff;
}

.shipment-kpi--open {
    --shipment-kpi-accent: #16a45b;
    --shipment-kpi-tint: #eaf8f0;
}

.shipment-kpi--closing_review {
    --shipment-kpi-accent: #e58b00;
    --shipment-kpi-tint: #fff5df;
}

.shipment-kpi--closed {
    --shipment-kpi-accent: #64748b;
    --shipment-kpi-tint: #f1f5f9;
}

.shipment-kpi--shipped {
    --shipment-kpi-accent: #07868c;
    --shipment-kpi-tint: #e5f6f6;
}

.shipment-kpi__topline,
.shipment-kpi__heading {
    display: flex;
    align-items: center;
}

.shipment-kpi__topline {
    justify-content: space-between;
    gap: 12px;
}

.shipment-kpi__heading {
    min-width: 0;
    gap: 9px;
}

.shipment-kpi__primary-icon,
.shipment-kpi__status-icon {
    display: grid;
    place-items: center;
    color: var(--shipment-kpi-accent);
}

.shipment-kpi__primary-icon {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    border-radius: 10px;
    background: var(--shipment-kpi-accent);
    color: #ffffff;
}

.shipment-kpi__primary-icon svg {
    width: 22px;
    height: 22px;
    stroke-width: 2;
}

.shipment-kpi__status-icon {
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    border-radius: 8px;
    background: var(--shipment-kpi-tint);
}

.shipment-kpi__status-icon svg {
    width: 22px;
    height: 22px;
    stroke-width: 2;
}

.shipment-kpi__dot {
    width: 9px;
    height: 9px;
    flex: 0 0 9px;
    border-radius: 999px;
    background: var(--shipment-kpi-accent);
}

.shipment-kpi__label {
    min-width: 0;
    color: #334155;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.25;
}

.shipment-kpi--all .shipment-kpi__label {
    color: var(--shipment-kpi-accent);
}

.shipment-kpi__value {
    align-self: end;
    margin-top: 18px;
    color: #101b3b;
    font-size: 40px;
    font-weight: 850;
    font-variant-numeric: tabular-nums;
    line-height: 1;
}

.shipment-kpi--all .shipment-kpi__value {
    font-size: 46px;
}

.shipment-kpi--shipped .shipment-kpi__value {
    color: var(--shipment-kpi-accent);
}

.shipment-kpi__support {
    margin-top: 13px;
    color: #718096;
    font-size: 12px;
    font-weight: 650;
    line-height: 1.35;
}

@media (max-width: 1100px) {
    .shipment-kpis {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .shipment-kpis {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .shipment-kpi--all {
        grid-column: 1 / -1;
    }
}

@media (max-width: 440px) {
    .shipment-kpis {
        grid-template-columns: minmax(0, 1fr);
    }

    .shipment-kpi--all {
        grid-column: auto;
    }
}

.pkg-table-scroll {
    min-width: 0;
    max-width: 100%;
    /* Safety valve: only scrolls when the fixed table hits its min-width at
       genuinely narrow widths. At desktop the table fits with no scroll. */
    overflow-x: auto;
}

.pkg-ledger {
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    background: white;
}

.pkg-ledger--history {
    min-width: 990px;
}

.pkg-ledger--workspace {
    min-width: 1120px;
}

/* Intentional column sizing. Description takes the flexible remainder; the
   operational columns get stable widths so nothing overflows the card.
   Actions is compact because row actions live behind a kebab menu. */
.c-track { width: 220px; }
.c-carrier { width: 140px; }
.c-desc { width: auto; }
.c-status { width: 118px; }
.c-date { width: 122px; }
.c-actions { width: 64px; }

.pkg-ledger--workspace .c-track { width: 230px; }
.pkg-ledger--workspace .c-owner { width: 170px; }
.pkg-ledger--workspace .c-carrier { width: 140px; }
.pkg-ledger--workspace .c-status { width: 112px; }
.pkg-ledger--workspace .c-date { width: 122px; }
.pkg-ledger--workspace .c-actions { width: 64px; }

/* Staff Warehouse Items ledger: deliberate proportional widths so extra
   desktop space does not become a dead zone between Owner and Source. */
.pkg-ledger--items { min-width: 0; }
.pkg-ledger--items .c-track { width: 22%; }
.pkg-ledger--items .c-owner { width: 27%; }
.pkg-ledger--items .c-carrier { width: 18%; }
.pkg-ledger--items .c-status { width: 13%; }
.pkg-ledger--items .c-date { width: 14%; }
.pkg-ledger--items .c-actions { width: 6%; }

.pkg-ledger--items .pkg-td,
.pkg-ledger--items .pkg-th {
    white-space: nowrap;
}

.pkg-ledger--items .pkg-td--track,
.pkg-ledger--items .pkg-td--track .pkg-track,
.pkg-ledger--items .pkg-track__num {
    min-width: 0;
}

.pkg-ledger--items .pkg-track__num {
    flex-wrap: wrap;
    max-width: 100%;
    overflow-wrap: anywhere;
    white-space: normal;
    word-break: normal;
}

.pkg-ledger--items .pkg-owner-name,
.pkg-ledger--items .pkg-owner-unknown {
    display: block;
    max-width: 24ch;
    white-space: normal;
}

.pkg-ledger--items .pkg-carrier,
.pkg-ledger--items .pkg-carrier__name,
.pkg-ledger--items .pkg-datestack__date,
.pkg-ledger--items .pkg-datestack__time {
    letter-spacing: 0;
    overflow: visible;
    overflow-wrap: normal;
    text-overflow: clip;
    white-space: nowrap;
    word-break: normal;
}

.pkg-ledger--items .pkg-td--carrier {
    overflow: visible;
}

.pkg-ledger--items .pkg-carrier {
    gap: 8px;
    white-space: nowrap;
}

.pkg-ledger--items .pkg-track__tag {
    flex: 0 0 auto;
    font-size: 10px;
    white-space: nowrap;
}

.pkg-ledger--items .pkg-fit-id--normal { font-size: 15px; }
.pkg-ledger--items .pkg-fit-id--medium { font-size: 14px; }
.pkg-ledger--items .pkg-fit-id--small { font-size: 13px; }
.pkg-ledger--items .pkg-fit-id--tiny { font-size: 12px; }
.pkg-ledger--items .pkg-fit-owner--normal { font-size: 15px; }
.pkg-ledger--items .pkg-fit-owner--medium { font-size: 14px; }
.pkg-ledger--items .pkg-fit-owner--small { font-size: 13px; }
.pkg-ledger--items .pkg-fit-owner--tiny { font-size: 12px; }
.pkg-ledger--items .pkg-fit-source--normal { font-size: 14px; }
.pkg-ledger--items .pkg-fit-source--medium { font-size: 13px; }
.pkg-ledger--items .pkg-fit-source--small { font-size: 12px; }
.pkg-ledger--items .pkg-fit-source--tiny { font-size: 11px; }

/* Dense-table pill: slightly smaller than the standalone chip so the Status
   column stays compact without clipping the longest label. */
.pkg-ledger .status-chip {
    font-size: 11px;
    padding: 3px 8px 3px 7px;
}

.pkg-ledger .status-chip__ico {
    width: 12px;
    height: 12px;
}

/* Header ------------------------------------------------------------------- */
.pkg-ledger thead th {
    background: #fcfcfd;
    border-bottom: 1px solid var(--pulse-border);
    padding: 12px 14px;
    text-align: left;
    vertical-align: middle;
    color: #6b7488;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    /* Labels wrap to two lines rather than truncate when a column is narrow. */
    white-space: normal;
}

.pkg-th--actions {
    text-align: center;
}

.pkg-sort {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: inherit;
    cursor: pointer;
}

.pkg-sort:hover {
    color: var(--pulse-text);
}

.pkg-sort__caret {
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    opacity: 0.55;
}

.pkg-sort__caret--idle {
    border-top: 4px solid currentColor;
    opacity: 0.28;
}

.pkg-sort__caret--desc {
    border-top: 4px solid var(--pulse-blue);
    opacity: 1;
}

.pkg-sort__caret--asc {
    border-bottom: 4px solid var(--pulse-blue);
    opacity: 1;
}

/* Rows --------------------------------------------------------------------- */
.pkg-lrow {
    cursor: pointer;
    transition: background 120ms ease;
}

.pkg-ledger tbody td {
    border-bottom: 1px solid #eef0f4;
    padding: 16px 14px;
    vertical-align: middle;
    background: transparent;
}

/* Only the text-heavy columns truncate; pills, dates and actions are never
   clipped, they get enough column width instead. */
.pkg-td--desc,
.pkg-td--carrier {
    overflow: hidden;
}

.pkg-ledger tbody tr:last-child td {
    border-bottom: 0;
}

.pkg-lrow:hover td {
    background: #f8fafc;
}

.pkg-lrow--muted td {
    background: #fcfcfe;
}

.pkg-lrow--muted:hover td {
    background: #f7f8fc;
}

.pkg-lrow--muted .pkg-track__num,
.pkg-lrow--muted .pkg-carrier__name,
.pkg-lrow--muted .pkg-desc-clamp {
    color: #98a1b3;
}

/* Tracking number (the row anchor) ---------------------------------------- */
.pkg-track {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.pkg-track__num {
    font-size: 15px;
    font-weight: 600;
    line-height: 1.25;
    color: #1d4ed8;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.01em;
    overflow-wrap: anywhere;
    word-break: normal;
}

.pkg-track__num:hover {
    text-decoration: underline;
    text-underline-offset: 2px;
}

.pkg-track__meta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.pkg-track__ref {
    display: block;
    color: var(--pulse-muted);
    font-size: 12px;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
}

.pkg-copy {
    display: inline-grid;
    width: 22px;
    height: 22px;
    place-items: center;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #9aa3b2;
    cursor: pointer;
    opacity: 0;
    transition: opacity 120ms ease, background 120ms ease, color 120ms ease;
}

.pkg-copy svg {
    width: 14px;
    height: 14px;
}

.pkg-lrow:hover .pkg-copy,
.pkg-copy:focus-visible {
    opacity: 1;
}

.pkg-copy:hover {
    background: #eef1f6;
    color: var(--pulse-text);
}

.pkg-copy.is-copied {
    opacity: 1;
    color: #0f7a43;
}

.pkg-owner-link {
    color: #1d4ed8;
    font-weight: 600;
}

.pkg-owner-link:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.pkg-owner-name {
    font-weight: 600;
    color: var(--pulse-text);
}

/* Carrier ------------------------------------------------------------------ */
.pkg-carrier {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    max-width: 100%;
}

.pkg-carrier__name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.carrier-logo {
    display: inline-grid;
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    place-items: center;
}

.carrier-logo svg {
    width: 28px;
    height: 28px;
    border-radius: 8px;
}

.pkg-carrier__name {
    font-size: 14px;
    font-weight: 600;
    color: var(--pulse-text);
}

/* Description — the flexible column, clamps to two lines --------------------- */
.pkg-desc-clamp {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-clamp: 2;
    overflow: hidden;
    color: #3f4a5c;
    font-size: 13.5px;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

/* Date columns ------------------------------------------------------------- */
.pkg-td--date {
    white-space: nowrap;
}

.pkg-datestack__date {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #29323f;
    font-variant-numeric: tabular-nums;
}

.pkg-datestack__time {
    display: block;
    margin-top: 2px;
    color: var(--pulse-muted);
    font-size: 12px;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
}

.pkg-dash {
    color: #c2c9d6;
    font-weight: 600;
}

/* Actions menu ------------------------------------------------------------- */
.pkg-actions-cell {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.pkg-td--actions {
    overflow: visible;
    text-align: center;
}

.pkg-menu-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid var(--pulse-border);
    border-radius: 10px;
    background: white;
    color: #667085;
    cursor: pointer;
    font: inherit;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: 0.02em;
    line-height: 1;
    transition: background 120ms ease, border-color 120ms ease, box-shadow 120ms ease, color 120ms ease;
}

.pkg-menu-trigger:hover,
.pkg-menu-trigger[aria-expanded="true"] {
    background: #f7f9fc;
    border-color: #cdd5e2;
    color: #1f2937;
}

.pkg-menu-trigger:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(49, 122, 255, 0.14);
}

.pkg-action-menu {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 30;
    min-width: 178px;
    border: 1px solid var(--pulse-border);
    border-radius: 12px;
    background: white;
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.16);
    padding: 6px;
    text-align: left;
}

.pkg-action-menu__item {
    display: flex;
    align-items: center;
    gap: 9px;
    width: 100%;
    min-height: 36px;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: #344054;
    cursor: pointer;
    font: inherit;
    font-size: 13px;
    font-weight: 650;
    line-height: 1.2;
    padding: 8px 10px;
    text-align: left;
    text-decoration: none;
}

.pkg-action-menu__item:hover,
.pkg-action-menu__item:focus-visible {
    background: #f7f9fc;
    outline: none;
}

.pkg-action-menu__item svg {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
}

.pkg-action-menu__form {
    margin: 0;
}

.pkg-action-menu__item--danger {
    color: #b42318;
}

.pkg-action-menu__item--danger:hover,
.pkg-action-menu__item--danger:focus-visible {
    background: #fef3f2;
}

/* Footer + pager ----------------------------------------------------------- */
.pkg-ledger-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-top: 1px solid var(--pulse-border);
    padding: 14px 22px;
}

.pkg-ledger-foot__count {
    color: var(--pulse-muted);
    font-size: 13px;
    font-weight: 600;
}

.pkg-pager {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.pkg-pager__btn {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid var(--pulse-border);
    border-radius: 8px;
    background: white;
    color: #37414f;
    cursor: pointer;
}

.pkg-pager__btn svg {
    width: 16px;
    height: 16px;
}

.pkg-pager__btn:disabled {
    color: #c2c9d6;
    cursor: default;
}

.pkg-pager__page {
    display: inline-grid;
    min-width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid var(--pulse-blue);
    border-radius: 8px;
    color: var(--pulse-blue);
    font-size: 13px;
    font-weight: 700;
    padding: 0 8px;
}

/* Operational empty state -------------------------------------------------- */
.pkg-empty-state {
    display: grid;
    justify-items: center;
    gap: 6px;
    padding: 56px 28px 60px;
    text-align: center;
}

.pkg-empty-state__icon {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    background: #f3f5f9;
    color: #97a1b4;
    margin-bottom: 8px;
}

.pkg-empty-state__icon svg {
    width: 28px;
    height: 28px;
}

.pkg-empty-state h3 {
    margin: 0;
    font-size: 16px;
}

.pkg-empty-state p {
    max-width: 380px;
    margin: 0 0 18px;
    color: var(--pulse-muted);
    line-height: 1.5;
}

/* Skeleton loading --------------------------------------------------------- */
.pkg-ledger--skeleton tbody td {
    padding-top: 18px;
    padding-bottom: 18px;
}

.sk {
    display: block;
    height: 12px;
    border-radius: 6px;
    background: linear-gradient(90deg, #eef1f5 25%, #e3e7ee 37%, #eef1f5 63%);
    background-size: 400% 100%;
    animation: pkg-shimmer 1.4s ease infinite;
}

.sk + .sk {
    margin-top: 8px;
}

.sk--lg { width: 68%; height: 14px; }
.sk--md { width: 60%; }
.sk--sm { width: 40%; height: 10px; }
.sk--line { width: 100%; }
.sk--line-short { width: 60%; }
.sk--carrier { width: 76%; height: 24px; border-radius: 8px; }
.sk--pill { width: 84px; height: 24px; border-radius: 999px; }
.sk--btn { width: 72px; height: 30px; border-radius: 8px; }

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

@media (prefers-reduced-motion: reduce) {
    .sk { animation: none; }
}

/* --- Inline history filter ------------------------------------------------ */
.pkg-inline-filter {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}

.pkg-inline-filter input,
.pkg-inline-filter select {
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: white;
    color: var(--pulse-text);
    font: inherit;
    font-weight: 650;
    padding: 9px 12px;
}

.pkg-inline-search {
    min-width: 200px;
}

/* --- Courier customer summary band --------------------------------------- */
.pkg-customer-summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, 1fr);
    align-items: center;
    gap: 28px;
    border: 1px solid var(--pulse-border);
    border-radius: 18px;
    background: var(--pulse-card);
    box-shadow: 0 10px 24px rgba(13, 20, 55, 0.05);
    padding: 28px 32px;
}

.pkg-customer-summary__identity {
    display: flex;
    align-items: center;
    gap: 22px;
    min-width: 0;
}

.pkg-customer-summary__avatar {
    display: grid;
    width: 86px;
    height: 86px;
    flex: 0 0 86px;
    place-items: center;
    border: 1px solid #d6e3f8;
    border-radius: 22px;
    background: linear-gradient(145deg, #eef6ff, #e9f1ff);
    color: var(--pulse-blue);
    font-size: 32px;
    font-weight: 900;
    letter-spacing: -0.04em;
}

.pkg-customer-summary__copy {
    min-width: 0;
}

.pkg-customer-summary__type,
.pkg-customer-summary__courier {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0;
}

.pkg-customer-summary__type {
    color: #55617a;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.pkg-customer-summary__type .pkg-ico,
.pkg-customer-summary__courier .pkg-ico {
    width: 18px;
    height: 18px;
    color: var(--pulse-blue);
}

.pkg-customer-summary__name-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    margin-top: 12px;
}

.pkg-customer-summary__name-row h2 {
    margin: 0;
    color: #111a3d;
    font-size: 30px;
    line-height: 1.1;
    letter-spacing: -0.035em;
}

.pkg-customer-summary__courier {
    margin-top: 18px;
    color: #1c2440;
    font-size: 15px;
    font-weight: 850;
}

.pkg-status-pill {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 850;
    padding: 7px 11px;
}

.pkg-status-pill--active {
    border-color: #bdeccc;
    background: #ecfbf1;
    color: #13783d;
}

.pkg-status-pill .status-dot {
    width: 8px;
    height: 8px;
    box-shadow: none;
}

.pkg-customer-summary__kpis {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    border-left: 1px solid var(--pulse-border);
    padding-left: 28px;
}

.pkg-customer-kpi {
    display: grid;
    justify-items: center;
    gap: 8px;
    min-width: 0;
    text-align: center;
}

.pkg-customer-kpi__icon {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 999px;
}

.pkg-customer-kpi__icon .pkg-ico {
    width: 20px;
    height: 20px;
}

.pkg-customer-kpi__label {
    color: #5d667e;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.08em;
    line-height: 1.2;
    text-transform: uppercase;
}

.pkg-customer-kpi__value {
    color: #111a3d;
    font-size: 24px;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.pkg-history-panel .results-toolbar {
    align-items: center;
    padding: 22px 24px;
}

.pkg-history-panel .pkg-table-controls {
    align-items: center;
    justify-content: flex-end;
}

/* --- Minimal owner header ------------------------------------------------- */
.pkg-owner-header {
    display: flex;
    align-items: center;
    gap: 18px;
    border: 1px solid var(--pulse-border);
    border-radius: 14px;
    background: var(--pulse-card);
    box-shadow: 0 8px 20px rgba(13, 20, 55, 0.05);
    padding: 20px 22px;
}

.pkg-owner-avatar {
    display: grid;
    width: 56px;
    height: 56px;
    flex: 0 0 56px;
    place-items: center;
    border-radius: 16px;
    background: #eef6ff;
    color: var(--pulse-blue);
    font-size: 20px;
    font-weight: 900;
}

.pkg-owner-header__id h2 {
    margin: 2px 0 0;
    font-size: 22px;
}

.pkg-owner-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 26px;
    margin: 12px 0 0;
}

.pkg-owner-meta div {
    display: grid;
    gap: 2px;
}

.pkg-owner-meta dt {
    color: var(--pulse-muted);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.pkg-owner-meta dd {
    margin: 0;
    font-weight: 850;
}

.pkg-crumb {
    color: var(--pulse-blue);
    font-weight: 800;
}

.pkg-crumb:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* --- Detail page ---------------------------------------------------------- */
.pkg-detail-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 380px);
    gap: 22px;
    align-items: start;
}

.pkg-detail-main {
    display: grid;
    gap: 20px;
    min-width: 0;
}

.pkg-detail-list dd .muted-text {
    display: inline;
    margin-left: 6px;
}

.pkg-description-panel {
    margin-top: 18px;
    border-top: 1px solid var(--pulse-border);
    padding-top: 16px;
}

.pkg-description-panel p:not(.eyebrow) {
    margin: 0;
    color: #3f4a63;
    line-height: 1.55;
}

.pkg-actions-panel {
    border: 1px solid var(--pulse-border);
    box-shadow: 0 10px 24px rgba(13, 20, 55, 0.06);
}

.pkg-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.pkg-actions__note {
    margin: 14px 0 0;
    color: var(--pulse-muted);
    font-size: 13px;
    line-height: 1.5;
}

.pkg-mock-note {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 8px;
    border: 1px dashed rgba(124, 58, 237, 0.32);
    border-radius: 12px;
    background: #f7f3ff;
    color: #5b21b6;
    line-height: 1.5;
    padding: 12px 16px;
}

.pkg-mock-note code {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.92em;
}

/* --- Vertical timeline ---------------------------------------------------- */
.pkg-timeline-card {
    border: 1px solid var(--pulse-border);
    box-shadow: 0 10px 24px rgba(13, 20, 55, 0.06);
}

.pkg-timeline {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.pkg-timeline__item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 14px;
    padding-bottom: 22px;
}

.pkg-timeline__item:last-child {
    padding-bottom: 0;
}

.pkg-timeline__dot {
    position: relative;
    margin-top: 2px;
}

.pkg-timeline__item:not(:last-child) .pkg-timeline__dot::after {
    content: "";
    position: absolute;
    top: 18px;
    left: 50%;
    width: 2px;
    height: calc(100% + 20px);
    transform: translateX(-50%);
    background: var(--pulse-border);
}

.pkg-timeline__body strong {
    display: block;
}

.pkg-timeline__body time {
    display: block;
    margin-top: 3px;
    color: var(--pulse-muted);
    font-size: 12px;
    font-weight: 850;
}

.pkg-timeline__body p {
    margin: 8px 0 0;
    color: #4f5e74;
    font-size: 13px;
    line-height: 1.5;
}

.pkg-timeline__item--current .pkg-timeline__body strong {
    color: var(--pulse-blue-dark);
}

/* --- Add drawer ----------------------------------------------------------- */
.pkg-drawer {
    width: min(520px, 100vw);
    min-height: 100vh;
    overflow-y: auto;
    background: white;
    box-shadow: -18px 0 42px rgba(13, 20, 55, 0.22);
    padding: 24px;
}

.pkg-drawer__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

.pkg-drawer__header h3 {
    margin: 0;
}

.pkg-drawer__lead {
    max-width: 640px;
    margin: 0 0 18px;
    color: var(--pulse-muted);
    line-height: 1.5;
}

.pkg-owner-lock {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    margin-bottom: 18px;
    border: 1px solid rgba(0, 100, 210, 0.18);
    border-radius: 12px;
    background: #eef6ff;
    padding: 14px 16px;
}

.pkg-owner-lock strong {
    display: block;
}

.pkg-owner-lock span {
    display: block;
    margin-top: 3px;
    color: #4f5e74;
    font-size: 13px;
}

.pkg-owner-lock__icon {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 10px;
    background: white;
    color: var(--pulse-blue);
}

.pkg-owner-lock__icon::before {
    content: "";
    width: 14px;
    height: 11px;
    border: 2px solid currentColor;
    border-radius: 3px 3px 4px 4px;
    box-shadow: 0 -6px 0 -2px currentColor;
}

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

/* --- Cancel confirmation dialog ------------------------------------------- */
.pkg-confirm-backdrop {
    justify-items: center;
    align-content: center;
    padding: 20px;
}

.pkg-confirm {
    width: min(480px, 100%);
    border-radius: 18px;
    background: white;
    box-shadow: 0 30px 70px rgba(13, 20, 55, 0.32);
    padding: 24px;
}

.pkg-confirm__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.pkg-confirm__header h3 {
    margin: 0;
    font-size: 20px;
}

.pkg-confirm__lead {
    margin: 12px 0 0;
    color: #3f4a63;
    line-height: 1.5;
}

.pkg-confirm__points {
    display: grid;
    gap: 8px;
    margin: 16px 0 18px;
    padding-left: 18px;
    color: #4f5e74;
    line-height: 1.5;
}

.pkg-confirm .pkg-form {
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
}

.button--cancel-action {
    border-color: rgba(165, 48, 48, 0.28);
    background: #fff4f4;
    color: #a53030;
}

.button--cancel-action:hover {
    background: #ffe9e9;
}

.form-actions--split {
    justify-content: space-between;
}

/* --- Responsive ----------------------------------------------------------- */
@media (max-width: 1180px) {
    .pkg-detail-grid {
        grid-template-columns: 1fr;
    }

    .pkg-customer-summary {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .pkg-customer-summary__kpis {
        border-left: 0;
        border-top: 1px solid var(--pulse-border);
        padding-left: 0;
        padding-top: 22px;
    }

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

    .pkg-toolbar .pkg-field--grow {
        grid-column: 1 / -1;
    }

    .pkg-toolbar__actions {
        grid-column: 1 / -1;
    }
}

/* Below the ledger min-width the table scrolls horizontally; Tracking stays
   pinned so package identity is never lost, and the structure never stacks. */
@media (max-width: 1120px) {
    .pkg-table-scroll {
        overflow-x: auto;
    }

    .pkg-ledger thead th:first-child,
    .pkg-ledger tbody td:first-child {
        position: sticky;
        left: 0;
        z-index: 2;
        background: white;
        box-shadow: 6px 0 12px -8px rgba(13, 20, 55, 0.18);
    }

    .pkg-ledger thead th:first-child {
        z-index: 4;
        background: #fcfcfd;
    }

    .pkg-lrow:hover td:first-child {
        background: #f8fafc;
    }
}

@media (max-width: 780px) {
    .pkg-toolbar,
    .pkg-form {
        grid-template-columns: 1fr;
    }

    .pkg-customer-summary {
        padding: 22px;
    }

    .pkg-customer-summary__identity {
        align-items: flex-start;
    }

    .pkg-customer-summary__avatar {
        width: 68px;
        height: 68px;
        flex-basis: 68px;
        border-radius: 18px;
        font-size: 25px;
    }

    .pkg-customer-summary__name-row h2 {
        font-size: 24px;
    }

    .pkg-customer-summary__kpis {
        grid-template-columns: 1fr;
        justify-items: stretch;
    }

    .pkg-customer-kpi {
        grid-template-columns: 42px 1fr auto;
        align-items: center;
        justify-items: start;
        text-align: left;
    }

    .pkg-owner-header {
        align-items: flex-start;
        flex-direction: column;
        gap: 14px;
    }

    .results-toolbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .pkg-table-controls {
        justify-content: flex-start;
        width: 100%;
    }

    .pkg-drawer {
        width: 100vw;
    }

    .form-actions--split {
        flex-direction: column-reverse;
        align-items: stretch;
    }
}

/* ==========================================================================
   Staff Warehouse Items ledger + detail overlay (Phase 4 Group 3)
   ========================================================================== */

/* Identity cell: primary tracking/internal code as a modal trigger, with
   item type/source context beneath. */
.pkg-track__num--btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 0;
    background: transparent;
    padding: 0;
    text-align: left;
    cursor: pointer;
    font: inherit;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.25;
    color: #1d4ed8;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.01em;
    overflow-wrap: anywhere;
}

.pkg-track__num--btn:hover {
    text-decoration: underline;
    text-underline-offset: 2px;
}

.pkg-track__num--btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(49, 122, 255, 0.16);
    border-radius: 5px;
}

.pkg-track__tag {
    flex: 0 0 auto;
    border: 1px solid var(--pulse-border);
    border-radius: 999px;
    background: #f3f5f9;
    color: #6b7488;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    padding: 2px 7px;
}

.pkg-track__context {
    color: var(--pulse-muted);
    font-size: 12px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    overflow-wrap: anywhere;
}

.pkg-owner-sub {
    display: block;
    margin-top: 2px;
    color: var(--pulse-muted);
    font-size: 12px;
    font-weight: 600;
}

.pkg-owner-unknown {
    display: inline-flex;
    align-items: center;
    border: 1px solid rgba(237, 139, 0, 0.28);
    border-radius: 999px;
    background: #fff4df;
    color: #9a5700;
    font-size: 12px;
    font-weight: 800;
    padding: 2px 9px;
}

.pkg-lrow--unknown td {
    background: #fffdf7;
}

.pkg-lrow--unknown:hover td {
    background: #fff8ea;
}

/* Row-level open-detail affordance (eye). */
.pkg-view-btn {
    display: inline-grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border: 1px solid var(--pulse-border);
    border-radius: 10px;
    background: white;
    color: #667085;
    cursor: pointer;
    transition: background 120ms ease, border-color 120ms ease, color 120ms ease, box-shadow 120ms ease;
}

.pkg-view-btn svg {
    width: 17px;
    height: 17px;
}

.pkg-view-btn:hover {
    background: #f7f9fc;
    border-color: #cdd5e2;
    color: #1f2937;
}

.pkg-view-btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(49, 122, 255, 0.14);
}

/* Pager page-number links (functional pagination). */
.pkg-pager__num {
    display: inline-grid;
    min-width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid var(--pulse-border);
    border-radius: 8px;
    background: white;
    color: #37414f;
    font-size: 13px;
    font-weight: 700;
    padding: 0 8px;
}

.pkg-pager__num:hover {
    border-color: #cdd5e2;
    background: #f7f9fc;
}

.pkg-pager__gap {
    display: inline-grid;
    min-width: 20px;
    height: 32px;
    place-items: center;
    color: var(--pulse-muted);
    font-weight: 700;
}

/* Warehouse item detail modal. */
.pkg-modal-backdrop--center {
    align-items: center;
    justify-items: center;
    overflow-y: auto;
    background: rgba(7, 13, 32, 0.58);
    backdrop-filter: blur(3px);
    padding: 32px;
}

.pkg-drawer--detail.pkg-item-modal {
    width: min(90vw, 936px);
    max-height: calc(100vh - 64px);
    min-height: auto;
    overflow-y: auto;
    border: 1px solid rgba(217, 224, 236, 0.86);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 28px 90px rgba(10, 18, 38, 0.32);
    padding: 28px 32px 30px;
}

.consignee-profile-modal {
    width: min(calc(100vw - 64px), 1152px);
    max-height: calc(100vh - 64px);
    min-height: auto;
    overflow-y: auto;
    border: 1px solid rgba(214, 223, 238, 0.92);
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 30px 90px rgba(9, 18, 39, 0.28);
    padding: 38px 40px 34px;
}

.consignee-profile-modal__header {
    display: grid;
    grid-template-columns: 76px minmax(0, 1fr) 48px;
    align-items: start;
    gap: 20px 26px;
    border-bottom: 1px solid var(--pulse-border);
    padding-bottom: 28px;
}

.consignee-profile-modal__icon {
    display: grid;
    width: 76px;
    height: 76px;
    place-items: center;
    border: 1px solid #cddbf0;
    border-radius: 18px;
    background: linear-gradient(180deg, #f8fbff 0%, #f1f6ff 100%);
    color: var(--pulse-blue);
}

.consignee-profile-modal__icon svg {
    width: 38px;
    height: 38px;
}

.consignee-profile-modal__identity {
    min-width: 0;
}

.consignee-profile-modal__eyebrow {
    margin: 2px 0 8px;
    color: var(--pulse-blue);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1.2;
    text-transform: uppercase;
}

.consignee-profile-modal__identity h3 {
    margin: 0;
    color: var(--pulse-navy);
    font-size: clamp(38px, 4.4vw, 56px);
    font-weight: 850;
    letter-spacing: 0;
    line-height: 1.02;
    overflow-wrap: anywhere;
}

.consignee-profile-modal__badge {
    display: flex;
    margin-top: 14px;
}

.consignee-profile-modal__close {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border: 1px solid #ccd6e6;
    border-radius: 13px;
    background: #fff;
    color: var(--pulse-navy);
    cursor: pointer;
    transition: background 140ms ease, border-color 140ms ease, box-shadow 140ms ease;
}

.consignee-profile-modal__close:hover {
    border-color: #b9c8dc;
    background: #f8fafc;
}

.consignee-profile-modal__close:focus-visible {
    outline: none;
    box-shadow: 0 0 0 4px rgba(0, 100, 210, 0.14);
}

.consignee-profile-modal__close svg {
    width: 24px;
    height: 24px;
}

.consignee-profile-modal__body {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
    gap: 0 30px;
    padding: 28px 0 24px;
}

.consignee-profile-modal__profile {
    min-width: 0;
    padding-right: 30px;
}

.consignee-profile-modal__profile h4,
.consignee-profile-modal__compliance h4 {
    margin: 0;
    color: var(--pulse-navy);
    font-size: 18px;
    line-height: 1.25;
}

.consignee-profile-modal__profile h4 {
    margin-bottom: 18px;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: 0;
    text-transform: uppercase;
}

.consignee-profile-rows {
    display: grid;
    margin: 0;
}

.consignee-profile-row {
    display: grid;
    grid-template-columns: 28px minmax(128px, 0.44fr) minmax(0, 1fr);
    align-items: start;
    gap: 18px 22px;
    border-bottom: 1px solid var(--pulse-border);
    padding: 14px 0;
}

.consignee-profile-row:first-child {
    padding-top: 0;
}

.consignee-profile-row:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.consignee-profile-row__icon {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    color: #53627a;
}

.consignee-profile-row__icon svg {
    width: 22px;
    height: 22px;
}

.consignee-profile-row dt {
    color: #47556d;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.45;
}

.consignee-profile-row dd {
    margin: 0;
    color: var(--pulse-navy);
    font-size: 16px;
    font-weight: 750;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.consignee-profile-modal__compliance {
    position: relative;
    min-width: 0;
    border: 1px solid #d9e3f0;
    border-radius: 16px;
    background: #f9fbff;
    padding: 26px 26px 22px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.86);
}

.consignee-profile-modal__compliance::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: -31px;
    width: 1px;
    background: var(--pulse-border);
}

.consignee-profile-modal__status-badge {
    display: flex;
    margin: 14px 0;
}

.consignee-profile-modal__rule {
    height: 1px;
    margin: 14px 0 22px;
    background: var(--pulse-border);
}

.consignee-profile-modal__support {
    margin: 0;
    color: #263551;
    font-size: 16px;
    line-height: 1.65;
}

.consignee-verify-summary {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-top: 24px;
    color: #164f2c;
}

.consignee-verify-summary__icon {
    display: grid;
    width: 26px;
    height: 26px;
    flex: 0 0 26px;
    place-items: center;
    color: #10913f;
}

.consignee-verify-summary__icon svg {
    width: 24px;
    height: 24px;
}

.consignee-verify-summary strong,
.consignee-verify-summary small {
    display: block;
}

.consignee-verify-summary strong {
    color: var(--pulse-navy);
    font-size: 16px;
    line-height: 1.25;
}

.consignee-verify-summary small {
    margin-top: 4px;
    color: #53627a;
    font-size: 14px;
    line-height: 1.45;
}

.consignee-verify-summary--pending {
    color: #8a5b00;
}

.consignee-verify-summary--pending .consignee-verify-summary__icon {
    color: #c47a00;
}

.consignee-verify-summary--blocked {
    color: #9f3434;
}

.consignee-verify-summary--blocked .consignee-verify-summary__icon {
    color: #b42318;
}

.consignee-profile-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 30px;
}

.consignee-profile-actions .button {
    justify-content: center;
    min-height: 46px;
}

.consignee-profile-actions .button svg {
    width: 18px;
    height: 18px;
}

.consignee-profile-modal__footer {
    display: flex;
    align-items: center;
    gap: 12px;
    border-top: 1px solid var(--pulse-border);
    padding-top: 22px;
    color: #35445c;
    font-size: 15px;
    line-height: 1.45;
}

.consignee-profile-modal__footer-icon {
    display: grid;
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    place-items: center;
    color: #53627a;
}

.consignee-profile-modal__footer-icon svg {
    width: 22px;
    height: 22px;
}

.pkg-item-modal__header {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr) 44px;
    align-items: start;
    gap: 18px;
    border-bottom: 1px solid var(--pulse-border);
    padding-bottom: 22px;
}

.pkg-item-modal__icon {
    display: grid;
    width: 72px;
    height: 72px;
    place-items: center;
    border: 1px solid #d8e3f2;
    border-radius: 20px;
    background: linear-gradient(180deg, #f8fbff 0%, #eff5ff 100%);
    color: var(--pulse-blue);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.pkg-item-modal__icon svg {
    width: 34px;
    height: 34px;
}

.pkg-item-modal__title {
    min-width: 0;
}

.pkg-item-modal__title .eyebrow {
    margin: 0 0 6px;
    color: #69738a;
    font-size: 11px;
    letter-spacing: 0.11em;
}

.pkg-item-modal__title h3 {
    margin: 0;
    color: var(--pulse-navy);
    font-size: clamp(28px, 3.4vw, 42px);
    line-height: 1.04;
    letter-spacing: -0.035em;
    overflow-wrap: anywhere;
}

.pkg-item-modal__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 9px 12px;
    margin-top: 14px;
}

.pkg-item-modal__close {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border: 1px solid #d9e1ee;
    border-radius: 14px;
    background: #fff;
    color: var(--pulse-navy);
    font-size: 34px;
    line-height: 1;
    box-shadow: 0 8px 18px rgba(20, 30, 55, 0.06);
}

.pkg-item-modal__close:hover {
    border-color: #c6d1e2;
    background: #f8fafc;
}

.pkg-copy--inline {
    opacity: 1;
    width: 28px;
    height: 28px;
    border: 1px solid #d7dfec;
    background: #fff;
}

.pkg-item-note {
    display: grid;
    gap: 3px;
    margin: 18px 0 0;
    border: 1px solid rgba(237, 139, 0, 0.3);
    border-radius: 14px;
    background: #fff8ee;
    color: #8a5200;
    line-height: 1.5;
    padding: 12px 16px;
}

.pkg-item-note strong {
    color: #7a4700;
}

.pkg-item-modal__body {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 0;
}

.pkg-item-modal__column {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.pkg-item-modal__column--facts {
    padding: 26px 30px 0 0;
}

.pkg-item-modal__column--status {
    border-left: 1px solid var(--pulse-border);
    padding: 26px 0 0 30px;
}

.pkg-detail-section {
    border-bottom: 1px solid #edf1f6;
    padding: 0 0 22px;
    margin-bottom: 22px;
}

.pkg-detail-section:last-child {
    border-bottom: 0;
    margin-bottom: 0;
    padding-bottom: 0;
}

.pkg-detail-section > .eyebrow {
    margin: 0 0 14px;
    color: #6f788b;
    font-size: 11px;
    letter-spacing: 0.11em;
}

.pkg-detail-list {
    display: grid;
    gap: 12px;
    margin: 0;
}

.pkg-detail-list div {
    display: grid;
    grid-template-columns: minmax(124px, 0.44fr) minmax(0, 1fr);
    align-items: baseline;
    gap: 16px;
}

.pkg-detail-list dt {
    color: #7a8293;
    font-size: 12px;
    font-weight: 850;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.pkg-detail-list dd {
    min-width: 0;
    margin: 0;
    color: var(--pulse-navy);
    font-size: 15px;
    font-weight: 800;
    line-height: 1.35;
}

.pkg-detail-list dd .tracking-code {
    overflow-wrap: anywhere;
}

/* Bulk Cargo detail (Phase 16, Workstream 4): the piece groups of one
   delivered order, and its cargo/receipt evidence. */
.pkg-bulk-cargo-pieces {
    display: grid;
    gap: 3px;
    margin: 0;
    list-style: none;
    padding: 0;
}

.pkg-bulk-cargo-gallery {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
    margin: 0;
    list-style: none;
    padding: 0;
}

.pkg-bulk-cargo-gallery img {
    display: block;
    width: 100%;
    height: 96px;
    border: 1px solid var(--pulse-border);
    border-radius: 10px;
    object-fit: cover;
}

.pkg-detail-list--compact {
    gap: 10px;
}

.pkg-detail-list--compact div {
    grid-template-columns: minmax(112px, 0.58fr) minmax(0, 1fr);
}

.pkg-detail-list--compact dd {
    font-size: 14px;
}

.pkg-item-dl__tag {
    display: inline-block;
    margin-left: 8px;
    border: 1px solid #d9e1ec;
    border-radius: 999px;
    background: #f5f7fb;
    color: #6a7487;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding: 2px 8px;
    vertical-align: middle;
}

.pkg-detail-section__note,
.pkg-detail-section__description,
.pkg-item-modal__footer {
    color: #636d7f;
    font-size: 14px;
    line-height: 1.55;
}

.pkg-detail-section__note {
    margin: 14px 0 0;
}

.pkg-detail-section__description {
    margin: 0;
    color: #354056;
}

.pkg-item-modal__footer {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: auto;
    border-top: 1px solid #edf1f6;
    padding-top: 18px;
    color: #7a8294;
    font-size: 13px;
}

.pkg-detail-section--timeline {
    padding-bottom: 24px;
}

.pkg-detail-timeline {
    display: grid;
    gap: 22px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.pkg-detail-timeline__item {
    position: relative;
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 14px;
}

.pkg-detail-timeline__item:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 32px;
    bottom: -24px;
    left: 14px;
    width: 2px;
    border-radius: 999px;
    background: #e2e8f2;
}

.pkg-detail-timeline__marker {
    position: relative;
    z-index: 1;
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    border: 1px solid #bfdbfe;
    border-radius: 999px;
    background: #eff6ff;
    color: var(--pulse-blue);
}

.pkg-detail-timeline__item--logged .pkg-detail-timeline__marker,
.pkg-detail-timeline__item--delivered .pkg-detail-timeline__marker {
    border-color: #bbf7d0;
    background: #ecfdf3;
    color: #15803d;
}

.pkg-detail-timeline__item--step .pkg-detail-timeline__marker,
.pkg-detail-timeline__item--shipped .pkg-detail-timeline__marker,
.pkg-detail-timeline__item--arrived .pkg-detail-timeline__marker {
    border-color: #c7d2fe;
    background: #f1f5ff;
    color: #3154d4;
}

.pkg-detail-timeline__marker svg {
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.pkg-detail-timeline__body {
    min-width: 0;
    padding-bottom: 1px;
}

.pkg-detail-timeline__body strong {
    display: block;
    color: var(--pulse-navy);
    font-size: 15.5px;
    line-height: 1.25;
}

.pkg-detail-timeline__body time {
    display: block;
    margin-top: 4px;
    color: #7b8496;
    font-size: 12.5px;
    font-weight: 750;
}

.pkg-detail-timeline__body p {
    margin: 8px 0 0;
    color: #535f73;
    font-size: 13.5px;
    line-height: 1.55;
}

.pkg-item-modal__history-btn {
    margin-top: 20px;
}

.pkg-detail-section--important {
    border-bottom: 0;
    border-radius: 16px;
    background: #f8fafc;
    padding: 18px;
}

.pkg-detail-section--important .eyebrow {
    margin-bottom: 12px;
}

@media (max-width: 900px) {
    .pkg-modal-backdrop--center {
        align-items: start;
        padding: 18px;
    }

    .consignee-profile-modal {
        width: min(100%, 760px);
        max-height: none;
        padding: 26px;
    }

    .consignee-profile-modal__header {
        grid-template-columns: 60px minmax(0, 1fr) 42px;
        gap: 16px;
        padding-bottom: 22px;
    }

    .consignee-profile-modal__icon {
        width: 60px;
        height: 60px;
        border-radius: 16px;
    }

    .consignee-profile-modal__icon svg {
        width: 30px;
        height: 30px;
    }

    .consignee-profile-modal__identity h3 {
        font-size: clamp(32px, 8vw, 44px);
    }

    .consignee-profile-modal__body {
        grid-template-columns: 1fr;
        gap: 24px;
        padding-top: 24px;
    }

    .consignee-profile-modal__profile {
        padding-right: 0;
    }

    .consignee-profile-modal__compliance {
        border-left: 1px solid #d9e3f0;
    }

    .consignee-profile-modal__compliance::before {
        content: none;
    }

    .pkg-drawer--detail.pkg-item-modal {
        width: min(100%, 720px);
        max-height: none;
        padding: 22px;
    }

    .pkg-item-modal__header {
        grid-template-columns: 56px minmax(0, 1fr) 40px;
        gap: 14px;
    }

    .pkg-item-modal__icon {
        width: 56px;
        height: 56px;
        border-radius: 16px;
    }

    .pkg-item-modal__icon svg {
        width: 28px;
        height: 28px;
    }

    .pkg-item-modal__body {
        grid-template-columns: 1fr;
    }

    .pkg-item-modal__column--facts,
    .pkg-item-modal__column--status {
        border-left: 0;
        padding: 24px 0 0;
    }

    .pkg-item-modal__column--status {
        border-top: 1px solid var(--pulse-border);
        margin-top: 24px;
    }
}

@media (max-width: 620px) {
    .consignee-profile-modal {
        width: calc(100vw - 24px);
        padding: 20px;
        border-radius: 20px;
    }

    .consignee-profile-modal__header {
        grid-template-columns: 52px minmax(0, 1fr) 40px;
        gap: 12px;
    }

    .consignee-profile-modal__icon {
        width: 52px;
        height: 52px;
        border-radius: 14px;
    }

    .consignee-profile-modal__identity h3 {
        font-size: 32px;
    }

    .consignee-profile-row {
        grid-template-columns: 24px minmax(96px, 0.45fr) minmax(0, 1fr);
        gap: 12px;
    }

    .consignee-profile-row dt,
    .consignee-profile-row dd {
        font-size: 14px;
    }

    .consignee-profile-actions {
        grid-template-columns: 1fr;
    }

    .pkg-drawer--detail.pkg-item-modal {
        width: calc(100vw - 24px);
        padding: 18px;
    }

    .pkg-item-modal__header {
        grid-template-columns: 1fr 40px;
    }

    .pkg-item-modal__icon {
        display: none;
    }

    .pkg-detail-list div,
    .pkg-detail-list--compact div {
        grid-template-columns: 1fr;
        gap: 4px;
    }
}

/* =========================================================================
   Phase 4 Group 4 — Customer / Courier / Courier-customer setup surfaces
   ========================================================================= */

/* --- Setup toolbar (search + add) ---------------------------------------- */
.setup-toolbar {
    align-items: end;
    flex-wrap: wrap;
}

.setup-toolbar--wide-search {
    grid-template-columns: minmax(360px, 1fr) max-content;
}

.setup-toolbar__add {
    margin-left: auto;
    white-space: nowrap;
}

/* --- Setup tables --------------------------------------------------------- */
.setup-table td {
    vertical-align: middle;
}

.setup-list-title {
    font-size: 20px;
    line-height: 1.25;
}

.setup-table__actions {
    text-align: right;
    width: 1%;
    white-space: nowrap;
}

.setup-row {
    cursor: pointer;
}

.setup-email {
    color: var(--pulse-text);
    word-break: break-word;
}

.setup-identity {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
}

.setup-identity__copy {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.setup-identity__name {
    font-weight: 600;
    color: var(--pulse-text);
    text-decoration: none;
}

.setup-identity__name--button {
    border: 0;
    background: transparent;
    padding: 0;
    text-align: left;
    cursor: pointer;
    font: inherit;
}

.setup-identity__name:hover {
    color: var(--pulse-blue);
    text-decoration: underline;
}

.setup-identity__avatar {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    border-radius: 10px;
    background: #eef2fb;
    color: var(--pulse-blue);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.setup-identity__avatar--courier {
    background: #e6f6f7;
    color: var(--pulse-teal);
}

.setup-identity__avatar--lg {
    width: 48px;
    height: 48px;
    border-radius: 13px;
    font-size: 15px;
}

.setup-count-pill {
    display: inline-grid;
    place-items: center;
    min-width: 26px;
    height: 24px;
    padding: 0 8px;
    border-radius: 999px;
    background: #eef2fb;
    color: var(--pulse-blue);
    font-weight: 700;
    font-size: 12px;
}

/* --- ID / compliance badge (display only) -------------------------------- */
.id-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
    border: 1px solid transparent;
    white-space: nowrap;
}

.id-badge__ico {
    width: 14px;
    height: 14px;
}

.id-badge--verified {
    background: #eaf8f0;
    color: #11683b;
    border-color: rgba(24, 160, 88, 0.24);
}

.id-badge--pending {
    background: #fff6e6;
    color: #92600a;
    border-color: rgba(245, 175, 2, 0.3);
}

.id-badge--required {
    background: #fdeee9;
    color: #a53f22;
    border-color: rgba(216, 92, 46, 0.26);
}

/* --- Consignee list cells -------------------------------------------------- */
.setup-linked__name {
    display: block;
    font-weight: 600;
}

.setup-linked__more {
    display: block;
    margin-top: 2px;
    font-size: 12px;
    color: var(--pulse-muted);
}

/* --- Detail side column --------------------------------------------------- */
.pkg-detail-side {
    display: grid;
    gap: 18px;
    align-content: start;
    min-width: 0;
}

.setup-side-card {
    padding: 18px 20px;
}

.setup-side-card__badge {
    margin: 4px 0 10px;
}

.setup-side-card__note {
    margin: 8px 0 0;
    color: var(--pulse-muted);
    font-size: 12.5px;
    line-height: 1.5;
}

.setup-side-card__actions {
    display: grid;
    gap: 9px;
    margin-top: 4px;
}

.setup-side-card__actions .button {
    justify-content: center;
}

.setup-side-card .button {
    width: 100%;
    justify-content: center;
}

.setup-metric-line {
    margin: 4px 0 12px;
    color: var(--pulse-text);
    font-size: 14px;
}

.setup-metric-line strong {
    font-size: 18px;
}

.setup-portal-status {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
}

.setup-portal-status::before {
    content: "";
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: currentColor;
}

.setup-portal-status--enabled { color: #11683b; }
.setup-portal-status--invited { color: #92600a; }
.setup-portal-status--none { color: var(--pulse-muted); }

/* --- Courier context banner ---------------------------------------------- */
.courier-context-banner {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 18px;
    border: 1px solid var(--pulse-border);
    border-left: 4px solid var(--pulse-teal);
    border-radius: 12px;
    background: #f3fbfb;
}

.courier-context-banner strong {
    display: block;
    color: var(--pulse-text);
    font-size: 14px;
}

.courier-context-banner span {
    display: block;
    color: var(--pulse-muted);
    font-size: 12.5px;
    margin-top: 2px;
}

.courier-context-banner__avatar {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    flex-shrink: 0;
    border-radius: 10px;
    background: #e6f6f7;
    color: var(--pulse-teal);
    font-size: 13px;
    font-weight: 700;
}

.courier-context-banner__back {
    margin-left: auto;
    white-space: nowrap;
}

/* --- Setup forms ---------------------------------------------------------- */
.setup-form-panel {
    padding: 26px 28px 28px;
}

.setup-form__section {
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid var(--pulse-border);
}

.setup-form__section:last-of-type {
    border-bottom: none;
    padding-bottom: 6px;
    margin-bottom: 6px;
}

.form-section-header {
    margin: 0 0 14px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--pulse-muted);
}

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

.setup-form__grid .pkg-field--full {
    grid-column: 1 / -1;
}

.setup-form__hint {
    margin: 12px 0 0;
    color: var(--pulse-muted);
    font-size: 12.5px;
}

.pkg-field .req {
    color: #c0492b;
    font-style: normal;
    margin-left: 2px;
}

.pkg-field--error input,
.pkg-field--error select,
.pkg-field--error textarea {
    border-color: #d05a3a;
    background: #fdf7f5;
}

.pkg-field__error {
    color: #c0492b !important;
    font-weight: 600;
}

/* Sentence-length helper text under a field, unlike the terse "Optional" tag
   that .pkg-field small styles by default. */
.pkg-field__hint {
    margin-top: 6px;
    font-weight: 500 !important;
    line-height: 1.5;
}

/* --- Direct customer add/edit form --------------------------------------- */
.customer-form-panel {
    width: 100%;
    max-width: 1280px;
    margin-inline: auto;
    padding: 30px;
    border-color: #dfe6f1;
    border-radius: 18px;
    background: white;
    box-shadow: 0 22px 58px rgba(15, 23, 42, 0.08);
}

.customer-form {
    display: grid;
    gap: 0;
}

.customer-form__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    min-width: 0;
}

.customer-form__section:nth-child(odd) {
    border-right: 1px solid #e3e9f2;
    padding-right: 30px;
}

.customer-form__section:nth-child(even) {
    padding-left: 30px;
}

.customer-form__section:nth-child(-n + 2) {
    border-bottom: 1px solid #e3e9f2;
    padding-bottom: 30px;
}

.customer-form__section:nth-child(n + 3) {
    padding-top: 30px;
}

.customer-form__section {
    min-width: 0;
    display: grid;
    gap: 20px;
    align-content: start;
}

.customer-form__section-head {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.customer-form__section-icon {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    border-radius: 11px;
    background: #eaf1fd;
    color: var(--pulse-blue);
}

.customer-form__section-icon i,
.customer-form__section-icon svg {
    display: block;
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.customer-form__section-title {
    margin: 0;
    color: #101a37;
    font-size: 15px;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1.15;
    text-transform: uppercase;
}

.customer-form__section-desc {
    margin: 6px 0 0;
    color: #5f6c84;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
}

.customer-form__fields {
    display: grid;
    gap: 18px;
}

.customer-form__fields--identity,
.customer-form__fields--contact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.customer-form__section--identity .customer-form__fields--identity {
    align-content: start;
}

.customer-form__field--address textarea {
    min-height: 154px;
    resize: vertical;
}

.customer-form .pkg-field input,
.customer-form .pkg-field select {
    min-height: 50px;
}

.customer-form .pkg-field textarea {
    line-height: 1.45;
    padding-block: 14px;
}

.customer-form__optional {
    color: var(--pulse-muted);
    font-size: 11px;
    font-weight: 750;
}

.customer-id-field {
    align-self: start;
}

.customer-id-upload {
    min-width: 0;
}

.customer-id-upload__input {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.customer-id-upload__empty {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 16px;
    min-width: 0;
}

.customer-id-upload__button {
    min-height: 44px;
    padding-inline: 16px;
}

.customer-id-upload__button i,
.customer-form__actions i {
    display: block;
    width: 18px;
    height: 18px;
}

.customer-id-upload__support {
    color: #56657c;
    font-size: 12px;
    font-weight: 750;
    line-height: 1.35;
}

.customer-id-upload__file {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr) auto 32px;
    gap: 12px;
    align-items: center;
    min-height: 68px;
    min-width: 0;
    border: 1px solid #d5deeb;
    border-radius: 12px;
    background: #fbfdff;
    padding: 8px 10px 8px 8px;
}

.customer-id-upload__file[hidden] {
    display: none;
}

.customer-id-upload__thumb {
    display: grid;
    width: 52px;
    height: 52px;
    place-items: center;
    overflow: hidden;
    border: 1px solid #dbe5f3;
    border-radius: 10px;
    background: #edf4ff;
    color: var(--pulse-blue);
}

.customer-id-upload__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.customer-id-upload__thumb i,
.customer-id-upload__thumb svg,
.customer-id-upload__remove i,
.customer-id-upload__remove svg,
.customer-id-secure-note i,
.customer-id-secure-note svg {
    display: block;
    width: 18px;
    height: 18px;
}

.customer-id-upload__meta {
    display: grid;
    min-width: 0;
    gap: 3px;
}

.customer-id-upload__meta strong,
.customer-id-upload__meta small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-id-upload__meta strong {
    color: var(--pulse-text);
    font-size: 13px;
    font-weight: 900;
}

.customer-id-upload__meta small {
    color: var(--pulse-muted);
    font-size: 11px;
    font-weight: 750;
}

.customer-id-upload__meta em {
    color: #34527c;
    font-style: normal;
    font-weight: 850;
}

.customer-id-upload__replace {
    align-self: center;
    cursor: pointer;
    font-size: 12px;
    white-space: nowrap;
}

.customer-id-upload__remove {
    display: grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid #dbe3ef;
    border-radius: 9px;
    background: white;
    color: #647089;
    cursor: pointer;
}

.customer-id-upload__remove:hover,
.customer-id-upload__remove:focus-visible {
    border-color: #c8d4e6;
    color: #19243d;
}

.customer-id-secure-note {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 4px 0 0;
    color: #5f6c84;
    font-size: 12px;
    font-weight: 750;
    line-height: 1.35;
}

.customer-id-secure-note i,
.customer-id-secure-note svg {
    flex: 0 0 15px;
    width: 15px;
    height: 15px;
    color: #7a879b;
}

.customer-form__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 30px;
    padding-top: 24px;
    border-top: 1px solid #e3e9f2;
}

.customer-form__actions .button--primary {
    min-height: 46px;
    padding-inline: 19px;
    box-shadow: 0 10px 20px rgba(0, 100, 210, 0.16);
}

.customer-form__actions .button--ghost {
    min-height: 46px;
    padding-inline: 18px;
    background: #fbfcfe;
}

/* --- Setup confirm / summary / danger ------------------------------------ */
.setup-confirm {
    display: grid;
    gap: 16px;
}

.setup-summary-list {
    margin: 0;
}

.setup-danger {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 18px;
}

.setup-danger h3 {
    margin: 0 0 6px;
    font-size: 17px;
}

.setup-danger p {
    margin: 0;
    color: var(--pulse-muted);
    line-height: 1.55;
}

.setup-danger__icon {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    flex-shrink: 0;
    border-radius: 12px;
    background: #fdeeea;
    color: #c0492b;
}

.setup-danger__icon svg {
    width: 22px;
    height: 22px;
}

.pkg-empty-state--compact {
    padding: 34px 24px 38px;
}

@media (max-width: 960px) {
    .customer-form-panel {
        padding: 26px;
    }

    .customer-form__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .customer-form__section,
    .customer-form__section:nth-child(odd),
    .customer-form__section:nth-child(even),
    .customer-form__section:nth-child(-n + 2),
    .customer-form__section:nth-child(n + 3) {
        border-right: 0;
        border-bottom: 1px solid #e3e9f2;
        padding: 0 0 26px;
    }

    .customer-form__section + .customer-form__section {
        padding-top: 26px;
    }

    .customer-form__section:last-child {
        border-bottom: 0;
        padding-bottom: 0;
    }
}

/* Mobile: everything single-column. */
@media (max-width: 640px) {
    .customer-form-panel {
        padding: 22px;
        border-radius: 16px;
    }

    .customer-form__fields--identity,
    .customer-form__fields--contact {
        grid-template-columns: minmax(0, 1fr);
    }

    .customer-form__field--address textarea {
        min-height: 132px;
    }

    .customer-id-upload__empty {
        align-items: flex-start;
        flex-direction: column;
    }

    .customer-id-upload__file {
        grid-template-columns: 44px minmax(0, 1fr) auto 32px;
        min-height: 64px;
    }

    .customer-id-upload__thumb {
        width: 44px;
        height: 44px;
    }

    .customer-form__actions {
        justify-content: stretch;
    }

    .customer-form__actions .button {
        justify-content: center;
        width: 100%;
    }
}

/* Phase 15: party editing keeps profile changes and private ID management in
   two coordinated, independently submitted surfaces. */
.topbar__support {
    margin: 6px 0 0;
    color: var(--pulse-muted);
    font-size: 14px;
    line-height: 1.45;
}

.customer-edit-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1.62fr) minmax(360px, 1fr);
    align-items: stretch;
    gap: 26px;
}

.customer-edit-form,
.customer-id-card {
    border: 1px solid #dce4ef;
    border-radius: 17px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(17, 35, 62, 0.06);
    box-sizing: border-box;
    height: 100%;
}

.customer-edit-form {
    padding: 30px;
}

.customer-edit-section {
    padding-bottom: 30px;
    border-bottom: 1px solid #e3e9f2;
}

.customer-edit-section + .customer-edit-section {
    padding-top: 30px;
}

.customer-edit-section:last-of-type {
    padding-bottom: 0;
    border-bottom: 0;
}

.customer-edit-form .customer-form__fields {
    margin-top: 20px;
}

.customer-edit-form .pkg-field input {
    min-height: 50px;
}

.customer-edit-form .pkg-field textarea {
    min-height: 104px;
    resize: vertical;
}

.customer-edit-form__footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    margin: 30px -30px -30px;
    padding: 20px 30px;
    border-top: 1px solid #e3e9f2;
}

.customer-edit-form__footer .button svg {
    width: 17px;
    height: 17px;
}

.customer-id-card {
    position: relative;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 30px;
}

.customer-id-card__header {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    padding-bottom: 24px;
    border-bottom: 1px solid #e3e9f2;
}

.customer-id-card__header h2 {
    margin: 1px 0 4px;
    color: var(--pulse-ink);
    font-size: 21px;
    line-height: 1.2;
}

.customer-id-card__header p {
    margin: 0;
    color: var(--pulse-muted);
    font-size: 14px;
    line-height: 1.5;
}

.customer-id-card__preview {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    padding: 26px 0 20px;
}

.customer-id-card__visual {
    display: grid;
    flex: 1;
    place-items: center;
    min-height: 220px;
    overflow: hidden;
    border: 1px solid #dce4ef;
    border-radius: 8px;
    background: #f7f9fc;
}

.customer-id-card__visual img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 220px;
    max-height: 320px;
    object-fit: contain;
    background: #fff;
}

.customer-id-card__file-icon,
.customer-id-card__empty-icon {
    display: grid;
    place-items: center;
    width: 56px;
    height: 56px;
    border-radius: 8px;
    color: var(--pulse-blue);
    background: #edf5ff;
}

.customer-id-card__file-icon svg,
.customer-id-card__empty-icon svg {
    width: 26px;
    height: 26px;
    stroke-width: 1.9;
}

.customer-id-card__status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: fit-content;
    margin-bottom: 0;
    color: #167044;
    font-size: 13px;
    font-weight: 800;
}

.customer-id-card__status svg {
    width: 17px;
    height: 17px;
}

.customer-id-card__metadata dl,
.customer-id-card__metadata dl div {
    margin: 0;
}

.customer-id-card__metadata {
    padding-top: 18px;
}

.customer-id-card__metadata-head {
    margin-bottom: 14px;
}

.customer-id-card__metadata dl {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.customer-id-card__metadata dt {
    color: #40516d;
    font-size: 12px;
    font-weight: 800;
}

.customer-id-card__metadata dd {
    min-width: 0;
    overflow: hidden;
    margin: 2px 0 0;
    color: var(--pulse-muted);
    font-size: 13.5px;
    line-height: 1.4;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-id-card__actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    padding-top: 18px;
    border-top: 1px solid #e3e9f2;
}

.customer-id-card__actions--single {
    grid-template-columns: minmax(0, 1fr);
}

.customer-id-card__actions .button {
    justify-content: center;
    min-width: 0;
    min-height: 48px;
    padding-inline: 12px;
}

.customer-id-card__actions svg {
    width: 18px;
    height: 18px;
}

.customer-id-card__action--danger {
    border-color: #efc8cc;
    color: #b4232c;
    background: #fff;
}

.customer-id-card__action--danger:hover,
.customer-id-card__action--danger:focus-visible {
    border-color: #db959c;
    color: #8f1720;
    background: #fff7f7;
}

.customer-id-card__guidance {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0 0 20px;
    padding: 14px 15px;
    border: 1px solid #d8e7fb;
    border-radius: 8px;
    color: #40516d;
    background: #f5f9ff;
    font-size: 12.5px;
    line-height: 1.5;
}

.customer-id-card__guidance svg {
    flex: 0 0 auto;
    width: 17px;
    height: 17px;
    margin-top: 1px;
    color: var(--pulse-blue);
}

.customer-id-card__empty {
    display: flex;
    flex-direction: column;
    flex: 1;
    align-items: flex-start;
    justify-content: center;
    min-height: 320px;
    padding: 34px 0;
}

.customer-id-card__empty h3 {
    margin: 18px 0 7px;
    color: var(--pulse-ink);
    font-size: 18px;
}

.customer-id-card__empty p {
    margin: 0 0 21px;
    color: var(--pulse-muted);
    font-size: 14px;
    line-height: 1.5;
}

.customer-id-card__empty small {
    margin-top: 11px;
    color: var(--pulse-muted);
    font-size: 12.5px;
}

.customer-id-card__security {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: auto -30px -30px;
    padding: 22px 30px;
    border-top: 1px solid #e3e9f2;
    color: var(--pulse-muted);
    background: #fafbfd;
    font-size: 12.5px;
    line-height: 1.5;
}

.customer-id-card__security svg {
    flex: 0 0 auto;
    width: 17px;
    height: 17px;
    margin-top: 1px;
    color: var(--pulse-blue);
}

.customer-id-card__error {
    margin: 16px 0 0;
    color: #a61b25;
    font-size: 12.5px;
    font-weight: 700;
    line-height: 1.45;
}

.customer-id-card__upload-form {
    display: flex;
    flex: 1;
    flex-direction: column;
    margin: 0;
}

.customer-id-card__inline-upload .customer-id-upload__file {
    margin-top: 16px;
}

.customer-id-card__upload-confirm {
    display: flex;
    justify-content: flex-end;
    margin-top: 12px;
}

.customer-id-card__upload-confirm[hidden] {
    display: none;
}

.customer-id-card__upload-confirm .button {
    justify-content: center;
}

.customer-id-delete-modal .modal-close svg {
    width: 18px;
    height: 18px;
}

.customer-id-delete-modal {
    width: min(440px, calc(100vw - 32px));
}

.customer-id-delete-modal header {
    align-items: flex-start;
}

.customer-id-delete-modal > p {
    color: var(--pulse-muted);
    line-height: 1.6;
}

.customer-id-delete-modal form {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 22px;
}

@media (max-width: 980px) {
    .customer-edit-workspace {
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
    }

    .customer-edit-form,
    .customer-id-card {
        height: auto;
        position: static;
    }

    .customer-id-card__empty {
        min-height: 260px;
    }
}

@media (max-width: 640px) {
    .customer-edit-form {
        padding: 22px;
        border-radius: 16px;
    }

    .customer-edit-form .customer-form__fields--identity,
    .customer-edit-form .customer-form__fields--contact {
        grid-template-columns: minmax(0, 1fr);
    }

    .customer-edit-form__footer {
        align-items: stretch;
        flex-direction: column-reverse;
        margin: 26px -22px -22px;
        padding: 18px 22px 22px;
    }

    .customer-edit-form__footer .button {
        justify-content: center;
        width: 100%;
    }

    .customer-id-card {
        padding: 22px;
        border-radius: 16px;
    }

    .customer-id-card__preview {
        padding: 24px 0;
    }

    .customer-id-card__visual {
        min-height: 126px;
    }

    .customer-id-card__visual img {
        height: 126px;
        min-height: 126px;
    }

    .customer-id-card__metadata dl,
    .customer-id-card__actions {
        grid-template-columns: minmax(0, 1fr);
    }

    .customer-id-card__metadata dl {
        gap: 10px;
    }

    .customer-id-card__empty {
        min-height: 220px;
    }

    .customer-id-card__security {
        margin: auto -22px -22px;
        padding: 18px 22px;
    }

    .customer-id-delete-modal form {
        align-items: stretch;
        flex-direction: column-reverse;
    }

    .customer-id-delete-modal form .button,
    .customer-id-card__upload-confirm .button {
        justify-content: center;
        width: 100%;
    }
}

@media (max-width: 720px) {
    .setup-form__grid {
        grid-template-columns: 1fr;
    }

    .setup-toolbar--wide-search {
        grid-template-columns: 1fr;
    }

    .setup-toolbar__add {
        margin-left: 0;
        width: 100%;
    }

    .courier-context-banner__back {
        display: none;
    }
}

/* =========================================================================
   Phase 4 — Direct customer detail redesign
   Reuses the shared .panel, .summary-card, .setup-side-card, .id-badge,
   .status-chip and .pkg-ledger primitives; only the profile-specific
   composition classes live here.
   ========================================================================= */

/* --- Balanced two-column height ------------------------------------------- */
/* Let the summary column fill the full height of the right-hand card stack so
   no dead space is left beneath the summary card. Scoped modifier keeps the
   shared .pkg-detail-grid used by package/courier-customer detail unchanged. */
.pkg-detail-grid--fill {
    align-items: stretch;
}

.pkg-detail-grid--fill .pkg-detail-main {
    grid-template-rows: 1fr;
}

.pkg-detail-grid--fill .pkg-detail-main .summary-card {
    height: 100%;
    display: flex;
    flex-direction: column;
}

/* Let the information grid absorb the reclaimed height: it grows to fill the
   card and its rows stretch equally, so the tiles share the extra space
   instead of leaving a gap above the staff notes. */
.pkg-detail-grid--fill .setup-info-grid {
    flex: 1 1 auto;
    grid-auto-rows: minmax(72px, 1fr);
}

.pkg-detail-grid--fill .setup-info {
    align-items: center;
}

/* --- Header metadata line ------------------------------------------------- */
.setup-detail-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 10px;
    margin: 10px 0 0;
    color: var(--pulse-muted);
    font-size: 13.5px;
    font-weight: 600;
}

.setup-detail-meta__item {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
}

.setup-detail-meta__ico {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
    color: #94a0b5;
}

.setup-detail-meta__dot {
    color: #c2cad8;
}

/* --- Customer Summary card ------------------------------------------------ */
.setup-summary__head {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 22px;
}

.setup-summary__avatar {
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    flex: 0 0 54px;
    border-radius: 999px;
    background: #eaf1fd;
    color: var(--pulse-blue);
    font-size: 17px;
    font-weight: 800;
    letter-spacing: 0.02em;
}

.setup-summary__copy {
    min-width: 0;
    flex: 1 1 auto;
}

.setup-summary__copy h3 {
    margin: 0;
    color: #101a37;
    font-size: 19px;
    line-height: 1.2;
}

.setup-summary__copy p {
    margin: 4px 0 0;
    color: var(--pulse-muted);
    font-size: 13.5px;
    line-height: 1.4;
}

.setup-summary__actions {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
}

.setup-side-card--access {
    border-color: #dce7f7;
    background: #f8fbff;
}

.setup-access-link-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
    min-width: 0;
}

.setup-access-link-card__top .eyebrow {
    margin-bottom: 4px;
}

.setup-access-link-card__url {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border: 1px solid var(--pulse-border);
    border-radius: 8px;
    background: #ffffff;
    color: var(--pulse-blue-dark);
    padding: 7px 9px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 12px;
}

.setup-access-link-card__actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    margin-top: 12px;
}

.setup-access-link-card__actions .button {
    justify-content: center;
}

.setup-overflow-btn {
    display: inline-grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid var(--pulse-border);
    border-radius: 10px;
    background: white;
    color: #667085;
    cursor: pointer;
}

.setup-overflow-btn svg {
    width: 20px;
    height: 20px;
}

.setup-overflow-btn:hover,
.setup-overflow-btn[aria-expanded="true"] {
    background: #f7f9fc;
    border-color: #cdd5e2;
    color: #1f2937;
}

.setup-overflow-btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(49, 122, 255, 0.14);
}

/* --- Information grid ----------------------------------------------------- */
.setup-info-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin: 0;
}

.setup-info {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    min-width: 0;
    border: 1px solid var(--pulse-border);
    border-radius: 12px;
    background: #fdfdff;
    padding: 14px 16px;
}

.setup-info--wide {
    grid-column: 1 / -1;
}

.setup-info__icon {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border-radius: 9px;
    background: #eef2fb;
    color: var(--pulse-blue);
}

.setup-info__icon svg {
    width: 18px;
    height: 18px;
}

.setup-info__body {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.setup-info__label {
    color: #7a8293;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.setup-info__value {
    margin: 0;
    color: #17203a;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.35;
}

.setup-info__value--break {
    overflow-wrap: anywhere;
}

/* --- Staff notes ---------------------------------------------------------- */
.setup-notes {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid var(--pulse-border);
}

.setup-notes__icon {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    border-radius: 9px;
    background: #f2f4f8;
    color: #667085;
}

.setup-notes__icon svg {
    width: 17px;
    height: 17px;
}

.setup-notes__body {
    min-width: 0;
}

.setup-notes__text {
    margin: 4px 0 0;
    color: #3f4a63;
    font-size: 14px;
    line-height: 1.55;
}

/* --- Side cards: titles + activity --------------------------------------- */
.setup-side-card__title {
    margin: 2px 0 0;
    color: #101a37;
    font-size: 17px;
    line-height: 1.2;
}

.setup-side-card__eyebrow {
    margin: 2px 0 12px;
    color: var(--pulse-muted);
    font-size: 12.5px;
    font-weight: 600;
}

.setup-side-card__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.setup-side-card__header > div {
    min-width: 0;
}

.setup-side-card__header .setup-side-card__eyebrow {
    margin-bottom: 0;
}

.setup-side-card__header .button {
    width: auto;
    min-height: 32px;
    flex: 0 0 auto;
    padding: 6px 10px;
    border-radius: 8px;
    font-size: 12px;
    line-height: 1;
    white-space: nowrap;
}

.setup-side-card__note--lead {
    margin-top: 4px;
    margin-bottom: 14px;
}

.setup-activity {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.setup-activity__row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 0;
    border-bottom: 1px solid var(--pulse-border);
}

.setup-activity__row:first-child {
    padding-top: 2px;
}

.setup-activity__row:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.setup-activity__icon {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border-radius: 9px;
}

.setup-activity__icon svg {
    width: 18px;
    height: 18px;
}

.setup-activity__icon--total { background: #eef2fb; color: var(--pulse-blue); }
.setup-activity__icon--pending { background: #eaf2ff; color: var(--pulse-blue); }
.setup-activity__icon--logged { background: #e7f7ee; color: #0f7a43; }

.setup-activity__label {
    flex: 1 1 auto;
    min-width: 0;
    color: #354056;
    font-size: 14px;
    font-weight: 600;
}

.setup-activity__value {
    flex: 0 0 auto;
    color: #101a37;
    font-size: 20px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.setup-side-table {
    min-width: 0;
}

.setup-side-table th,
.setup-side-table td {
    padding-inline: 0;
}

.setup-relationship-list {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.setup-relationship-list li {
    border-bottom: 1px solid var(--pulse-border);
}

.setup-relationship-list li:last-child {
    border-bottom: 0;
}

.setup-relationship {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    padding: 12px 0;
    color: inherit;
    text-decoration: none;
}

.setup-relationship:hover .setup-relationship__name {
    color: var(--pulse-blue);
}

.setup-relationship__avatar {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    place-items: center;
    border-radius: 11px;
    background: #eef2fb;
    color: var(--pulse-blue);
    font-size: 12px;
    font-weight: 850;
    letter-spacing: 0.02em;
}

.setup-relationship__body {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-width: 0;
    flex: 1 1 auto;
    gap: 10px;
}

.setup-relationship__name {
    min-width: 0;
    overflow: hidden;
    color: #101a37;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.setup-role-badge {
    flex: 0 0 auto;
    width: fit-content;
    border: 1px solid transparent;
    border-radius: 999px;
    padding: 2px 8px;
    font-size: 10px;
    font-weight: 850;
    line-height: 1.2;
}

.setup-role-badge--courier {
    border-color: rgba(24, 160, 88, 0.2);
    background: #eaf8f0;
    color: #11683b;
}

.setup-role-badge--customer {
    border-color: rgba(31, 78, 168, 0.18);
    background: #eef2fb;
    color: var(--pulse-blue);
}

.setup-relationship-list--modal {
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 0 22px;
}

/* --- Linked relationships overview modal --------------------------------- */
.relationship-modal-backdrop {
    background: rgba(7, 13, 32, 0.58);
    backdrop-filter: blur(4px);
}

.relationship-modal {
    width: min(92vw, 980px);
    max-height: calc(100vh - 64px);
    overflow-y: auto;
    border: 1px solid rgba(217, 224, 236, 0.9);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 30px 100px rgba(10, 18, 38, 0.34);
    padding: 28px 30px 22px;
}

.relationship-modal__header {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr) 48px;
    align-items: start;
    gap: 18px;
}

.relationship-modal__icon {
    display: grid;
    width: 72px;
    height: 72px;
    place-items: center;
    border: 1px solid #d8e3f2;
    border-radius: 20px;
    background: linear-gradient(180deg, #f8fbff 0%, #eff5ff 100%);
    color: var(--pulse-blue);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.relationship-modal__icon svg {
    width: 34px;
    height: 34px;
}

.relationship-modal__title {
    min-width: 0;
}

.relationship-modal__title .eyebrow {
    margin: 0 0 8px;
    color: #6e7b96;
    font-size: 11px;
    letter-spacing: 0.12em;
}

.relationship-modal__title h3 {
    margin: 0;
    color: var(--pulse-navy);
    font-size: clamp(30px, 4vw, 44px);
    line-height: 1.02;
}

.relationship-modal__title p {
    margin: 14px 0 0;
    color: #5f6b7f;
    font-size: 15px;
    font-weight: 650;
}

.relationship-modal__close {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border: 1px solid #d9e1ee;
    border-radius: 14px;
    background: #fff;
    color: var(--pulse-navy);
    box-shadow: 0 8px 18px rgba(20, 30, 55, 0.06);
    cursor: pointer;
}

.relationship-modal__close svg {
    width: 22px;
    height: 22px;
}

.relationship-modal__close:hover {
    border-color: #c7d2e2;
    background: #f8fafc;
}

.relationship-modal__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 24px 0 22px 72px;
}

.relationship-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid transparent;
    border-radius: 999px;
    padding: 8px 14px;
    font-size: 14px;
    font-weight: 850;
}

.relationship-chip svg {
    width: 17px;
    height: 17px;
}

.relationship-chip--courier {
    border-color: rgba(31, 110, 210, 0.16);
    background: #eef6ff;
    color: var(--pulse-blue);
}

.relationship-chip--customer {
    border-color: rgba(24, 160, 88, 0.18);
    background: #eaf8f0;
    color: #11683b;
}

.relationship-modal__content {
    border-top: 1px solid var(--pulse-border);
    padding-top: 20px;
}

.relationship-modal__tools {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 12px;
}

.relationship-search {
    display: flex;
    align-items: center;
    gap: 10px;
    width: min(100%, 390px);
    min-height: 44px;
    border: 1px solid #d8e1ee;
    border-radius: 999px;
    background: #fff;
    padding: 0 16px;
    color: #718099;
}

.relationship-search svg {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
}

.relationship-search input {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--pulse-navy);
    font: inherit;
    font-size: 14px;
    font-weight: 650;
}

.relationship-search input::placeholder {
    color: #7b879a;
}

.relationship-sort {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    border: 1px solid #d8e1ee;
    border-radius: 14px;
    background: #fff;
    color: var(--pulse-navy);
    padding: 0 14px;
    font: inherit;
    font-size: 14px;
    font-weight: 850;
    cursor: pointer;
}

.relationship-sort svg {
    width: 17px;
    height: 17px;
    color: #5f6c81;
}

.relationship-sort:hover,
.relationship-search:focus-within {
    border-color: #c4d1e2;
    box-shadow: 0 8px 20px rgba(20, 30, 55, 0.06);
}

.relationship-modal__list {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.relationship-modal__list li + li {
    margin-top: 8px;
}

.relationship-row {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) auto 22px;
    align-items: center;
    gap: 14px;
    min-width: 0;
    border: 1px solid #dfe6f0;
    border-radius: 12px;
    background: #fff;
    padding: 12px 14px;
    color: inherit;
    text-decoration: none;
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.relationship-row:hover {
    border-color: #c6d5e8;
    box-shadow: 0 12px 28px rgba(20, 30, 55, 0.08);
    transform: translateY(-1px);
}

.relationship-row__avatar {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 14px;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: 0.02em;
}

.relationship-row__avatar--courier {
    background: #eef6ff;
    color: var(--pulse-blue);
}

.relationship-row__avatar--customer {
    background: #eaf8f0;
    color: #11683b;
}

.relationship-row__body {
    display: grid;
    min-width: 0;
    gap: 4px;
}

.relationship-row__body strong {
    overflow: hidden;
    color: var(--pulse-navy);
    font-size: 15px;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.relationship-row__body span {
    overflow: hidden;
    color: #667386;
    font-size: 13px;
    font-weight: 650;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.relationship-row .setup-role-badge {
    padding: 6px 12px;
    font-size: 12px;
}

.relationship-row__chevron {
    display: grid;
    place-items: center;
    color: var(--pulse-navy);
}

.relationship-row__chevron svg {
    width: 20px;
    height: 20px;
}

.relationship-modal__footer {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 16px;
    color: #657287;
    font-size: 13.5px;
    font-weight: 650;
    line-height: 1.4;
    text-align: center;
}

.relationship-modal__footer svg {
    width: 17px;
    height: 17px;
    flex: 0 0 auto;
    color: var(--pulse-blue);
}

/* --- Manifest usage inspection modal ------------------------------------- */
.manifest-modal-backdrop {
    background: rgba(7, 13, 32, 0.58);
    backdrop-filter: blur(4px);
}

.manifest-modal {
    display: flex;
    width: min(calc(100vw - 48px), 1120px);
    max-height: calc(100vh - 64px);
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(217, 224, 236, 0.9);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 30px 88px rgba(10, 18, 38, 0.3);
    padding: 32px 38px;
}

.manifest-modal__header {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr) 48px;
    align-items: start;
    gap: 18px;
    border-bottom: 1px solid var(--pulse-border);
    padding-bottom: 26px;
}

.manifest-modal__icon {
    display: grid;
    width: 72px;
    height: 72px;
    place-items: center;
    border: 1px solid #d8e3f2;
    border-radius: 20px;
    background: linear-gradient(180deg, #f8fbff 0%, #eff5ff 100%);
    color: var(--pulse-blue);
}

.manifest-modal__icon svg {
    width: 34px;
    height: 34px;
}

.manifest-modal__title {
    min-width: 0;
}

.manifest-modal__title .eyebrow {
    margin: 0 0 8px;
    color: #6e7b96;
    font-size: 11px;
    letter-spacing: 0.12em;
}

.manifest-modal__title h3 {
    margin: 0;
    color: var(--pulse-navy);
    font-size: clamp(30px, 4vw, 42px);
    line-height: 1.04;
}

.manifest-modal__title p {
    margin: 16px 0 0;
    color: #59677d;
    font-size: 15px;
    font-weight: 650;
}

.manifest-modal__close {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border: 1px solid #d9e1ee;
    border-radius: 14px;
    background: #fff;
    color: var(--pulse-navy);
    box-shadow: 0 8px 18px rgba(20, 30, 55, 0.06);
    cursor: pointer;
}

.manifest-modal__close svg {
    width: 22px;
    height: 22px;
}

.manifest-modal__close:hover {
    border-color: #c7d2e2;
    background: #f8fafc;
}

.manifest-modal__content {
    display: flex;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    padding-top: 24px;
}

.manifest-modal__toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.manifest-search {
    display: flex;
    align-items: center;
    gap: 10px;
    width: min(100%, 300px);
    min-height: 42px;
    border: 1px solid #d8e1ee;
    border-radius: 8px;
    background: #fff;
    padding: 0 14px;
    color: #718099;
}

.manifest-search svg {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
}

.manifest-search input {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--pulse-navy);
    font: inherit;
    font-size: 14px;
    font-weight: 650;
}

.manifest-search input::placeholder {
    color: #7b879a;
}

.manifest-search:focus-within {
    border-color: #b9c8dc;
    box-shadow: 0 8px 20px rgba(20, 30, 55, 0.06);
}

.manifest-table-shell {
    display: flex;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid #dfe6f0;
    border-radius: 12px;
    background: #fff;
}

.manifest-table-scroll {
    min-height: 0;
    overflow: auto;
}

.manifest-table {
    width: 100%;
    min-width: 840px;
    border-collapse: collapse;
    color: var(--pulse-navy);
}

.manifest-table th {
    border-bottom: 1px solid #dfe6f0;
    background: #f8fafc;
    color: #536179;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.055em;
    padding: 14px 18px;
    text-align: left;
    text-transform: uppercase;
}

.manifest-table td {
    border-bottom: 1px solid #e8edf4;
    color: #111a31;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
    padding: 15px 18px;
    vertical-align: middle;
}

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

.manifest-table__link {
    color: var(--pulse-blue);
    font-weight: 900;
}

.manifest-table__date,
.manifest-table__relative {
    display: block;
}

.manifest-table__date {
    color: var(--pulse-navy);
}

.manifest-table__relative {
    margin-top: 2px;
    color: #657287;
    font-size: 12px;
    font-weight: 650;
}

.manifest-table__empty {
    border-top: 1px solid #e8edf4;
    color: #657287;
    font-size: 14px;
    font-weight: 700;
    padding: 24px;
    text-align: center;
}

.manifest-table__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-top: 1px solid #e8edf4;
    color: #526078;
    font-size: 13.5px;
    font-weight: 700;
    padding: 14px 18px;
}

.manifest-pagination {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.manifest-pagination button {
    display: grid;
    min-width: 34px;
    height: 34px;
    place-items: center;
    border: 1px solid #d8e1ee;
    border-radius: 8px;
    background: #fff;
    color: #536179;
    font: inherit;
    font-size: 13px;
    font-weight: 850;
}

.manifest-pagination button svg {
    width: 16px;
    height: 16px;
}

.manifest-pagination button.is-active {
    border-color: var(--pulse-blue);
    background: var(--pulse-blue);
    color: #fff;
}

.manifest-pagination button:disabled {
    opacity: 0.48;
}

/* --- Courier detail scale adjustments ------------------------------------ */
.setup-courier-detail {
    align-items: stretch;
}

.setup-courier-detail .pkg-detail-main {
    grid-template-rows: 1fr;
}

.setup-courier-detail .setup-summary {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 22px;
}

.setup-courier-detail .setup-summary__head {
    gap: 14px;
    margin-bottom: 18px;
}

.setup-courier-detail .setup-summary__avatar {
    width: 48px;
    height: 48px;
    flex-basis: 48px;
    font-size: 15px;
}

.setup-courier-detail .setup-summary__copy h3 {
    font-size: 18px;
}

.setup-courier-detail .setup-summary__copy p {
    font-size: 13px;
}

.setup-courier-detail .setup-summary__actions .button {
    min-height: 40px;
    padding: 8px 13px;
}

.setup-courier-detail .setup-overflow-btn {
    width: 40px;
    height: 40px;
}

.setup-courier-detail .setup-info-grid {
    flex: 1 1 auto;
    gap: 12px;
    grid-auto-rows: minmax(76px, 1fr);
}

.setup-courier-detail .setup-info {
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border-radius: 10px;
}

.setup-courier-detail .setup-info__icon,
.setup-courier-detail .setup-activity__icon {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
    border-radius: 8px;
}

.setup-courier-detail .setup-info__icon svg,
.setup-courier-detail .setup-activity__icon svg {
    width: 16px;
    height: 16px;
}

.setup-courier-detail .setup-info__label {
    font-size: 10.5px;
}

.setup-courier-detail .setup-info__value {
    font-size: 14px;
}

.setup-courier-detail .setup-notes {
    flex: 0 0 auto;
    margin-top: 16px;
}

.setup-courier-detail .setup-side-card {
    padding: 16px 18px;
}

.setup-courier-detail .setup-side-card__title {
    font-size: 16px;
}

.setup-courier-detail .setup-side-card__eyebrow {
    margin-bottom: 9px;
}

.setup-courier-detail .setup-activity__row {
    gap: 10px;
    padding: 11px 0;
}

.setup-courier-detail .setup-activity__label {
    font-size: 13px;
}

.setup-courier-detail .setup-activity__value {
    font-size: 18px;
}

.setup-courier-detail .setup-activity + .button {
    margin-top: 14px;
}

.setup-courier-customers {
    min-width: 0;
    padding: 22px;
}

/* --- Recent Packages card ------------------------------------------------- */
.setup-recent {
    min-width: 0;
    padding: 22px 22px 8px;
}

.setup-recent__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 6px;
}

.setup-recent__copy {
    min-width: 0;
}

.setup-recent__copy h3 {
    margin: 0;
    color: #101a37;
    font-size: 18px;
    line-height: 1.2;
}

.setup-recent__copy p {
    margin: 4px 0 0;
    color: var(--pulse-muted);
    font-size: 13.5px;
    line-height: 1.4;
}

.setup-see-all {
    flex: 0 0 auto;
}

.setup-list-modal {
    width: min(92vw, 920px);
}

.setup-list-modal--wide {
    width: min(94vw, 1080px);
}

.setup-list-modal .pkg-item-modal__title h3 {
    font-size: clamp(24px, 2.7vw, 34px);
}

.setup-list-modal__body {
    padding-top: 22px;
}

.setup-list-modal__body .pkg-table-scroll {
    max-height: min(58vh, 560px);
    overflow: auto;
}

/* Recent table shares the .pkg-ledger primitives; only the proportional
   column widths and a modest min-width (so it scrolls only when genuinely
   cramped) are specific here. */
.pkg-ledger--recent { min-width: 720px; }
.pkg-ledger--recent .c-track { width: 24%; }
.pkg-ledger--recent .c-status { width: 15%; }
.pkg-ledger--recent .c-carrier { width: 21%; }
.pkg-ledger--recent .c-date { width: 16%; }
.pkg-ledger--recent .c-actions { width: 8%; }

.setup-recent .pkg-empty-state {
    padding: 40px 24px 44px;
}

/* --- Responsive ----------------------------------------------------------- */
@media (max-width: 640px) {
    .setup-info-grid {
        grid-template-columns: 1fr;
    }

    .setup-summary__head {
        flex-wrap: wrap;
    }

    .setup-summary__actions {
        width: 100%;
    }

    .setup-summary__actions .button {
        flex: 1 1 auto;
    }

    .setup-recent__head {
        flex-direction: column;
        align-items: stretch;
    }

    .setup-recent__head .button {
        justify-content: center;
    }

    .relationship-modal {
        width: min(94vw, 560px);
        padding: 22px 18px 18px;
    }

    .relationship-modal__header {
        grid-template-columns: 54px minmax(0, 1fr) 42px;
        gap: 12px;
    }

    .relationship-modal__icon {
        width: 54px;
        height: 54px;
        border-radius: 16px;
    }

    .relationship-modal__icon svg {
        width: 27px;
        height: 27px;
    }

    .relationship-modal__title h3 {
        font-size: 28px;
    }

    .relationship-modal__close {
        width: 42px;
        height: 42px;
    }

    .relationship-modal__chips {
        margin-left: 0;
    }

    .relationship-modal__tools {
        align-items: stretch;
        flex-direction: column;
    }

    .relationship-search {
        width: 100%;
    }

    .relationship-sort {
        justify-content: center;
    }

    .courier-consignee-add-grid {
        grid-template-columns: 1fr;
    }

    .courier-consignee-add-footer {
        align-items: stretch;
        flex-direction: column;
    }

    .courier-consignee-add-footer__actions {
        justify-content: stretch;
    }

    .courier-consignee-add-footer__actions .button {
        flex: 1 1 150px;
    }

    .relationship-row {
        grid-template-columns: 40px minmax(0, 1fr) auto;
        gap: 10px;
    }

    .relationship-row__chevron {
        display: none;
    }

    .relationship-row .setup-role-badge {
        padding-inline: 9px;
    }

    .manifest-modal {
        width: min(94vw, 560px);
        padding: 22px 18px 18px;
    }

    .manifest-modal__header {
        grid-template-columns: 54px minmax(0, 1fr) 42px;
        gap: 12px;
        padding-bottom: 20px;
    }

    .manifest-modal__icon {
        width: 54px;
        height: 54px;
        border-radius: 16px;
    }

    .manifest-modal__icon svg {
        width: 27px;
        height: 27px;
    }

    .manifest-modal__title h3 {
        font-size: 28px;
    }

    .manifest-modal__close {
        width: 42px;
        height: 42px;
    }

    .manifest-modal__toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .manifest-search {
        width: 100%;
    }

    .manifest-table__footer {
        align-items: stretch;
        flex-direction: column;
    }

    .manifest-pagination {
        justify-content: flex-end;
    }
}

/* =========================================================================
   Phase 5 — Shipment Summaries (index, detail, rollover)
   Builds on the Phase 4 .panel / .data-table / .status-chip / .setup-* and
   .pkg-* primitives; only shipment-specific structure lives here.
   ========================================================================= */

/* --- Batch lifecycle pills ------------------------------------------------ */
/* The shipping cycle has its own states, so these extend the shared
   .status-chip treatment rather than reusing the package status colors. */
.status-chip--open {
    border-color: rgba(0, 100, 210, 0.22);
    background: #eaf4ff;
    color: #0757ad;
}

.status-chip--closing_review {
    border-color: rgba(237, 139, 0, 0.28);
    background: #fff4df;
    color: #9a5700;
}

.status-chip--closed {
    border-color: rgba(24, 160, 88, 0.22);
    background: #eaf8f0;
    color: #11683b;
}

.status-chip--bol_draft {
    border-color: rgba(124, 58, 237, 0.22);
    background: #f1eaff;
    color: #5b21b6;
}

.status-chip--manifested {
    border-color: rgba(13, 20, 55, 0.18);
    background: #eef1f8;
    color: #2c3757;
}

.status-chip--in_jamaica {
    border-color: rgba(13, 20, 55, 0.18);
    background: #eef1f8;
    color: #2c3757;
}

/* --- Small / large button sizes ------------------------------------------- */
.button--small {
    min-height: 34px;
    font-size: 13px;
    padding: 7px 12px;
}

/* Staff review cargo on tablet-sized screens, so primary workflow actions need
   a touch-sized hit area. */
.button--large {
    min-height: 52px;
    font-size: 16px;
    padding: 14px 24px;
}

/* --- Blocked / warning callout ------------------------------------------- */
.ship-alert {
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid rgba(191, 45, 45, 0.2);
    border-radius: 12px;
    background: #fff0f0;
    padding: 12px 16px;
}

.ship-alert--warn {
    border-color: rgba(237, 139, 0, 0.28);
    background: #fff4df;
}

.ship-alert__icon {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border-radius: 9px;
    background: white;
    color: #a53030;
}

.ship-alert--warn .ship-alert__icon {
    color: #9a5700;
}

.ship-alert__icon svg {
    width: 18px;
    height: 18px;
}

.ship-alert__body {
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-size: 13px;
}

.ship-alert__body strong {
    color: var(--pulse-text);
}

.ship-alert__body span {
    color: #56607a;
}

/* --- Index table ---------------------------------------------------------- */
.ship-bulk-bar,
.ship-cargo-bulk-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    border-top: 1px solid #dbe4f0;
    border-bottom: 1px solid #dbe4f0;
    background: #f7faff;
    padding: 13px 28px 13px 28px;
}

.ship-bulk-bar__selection,
.ship-select-all,
.ship-bulk-bar__controls,
.ship-bulk-status {
    display: flex;
    align-items: center;
}

.ship-bulk-bar__selection {
    gap: 12px;
    min-width: 0;
}

.ship-select-all {
    gap: 10px;
    color: #344054;
    font-size: 13px;
    font-weight: 750;
    white-space: nowrap;
}

.ship-select-all input,
.ship-row-check {
    width: 16px;
    height: 16px;
    accent-color: var(--pulse-blue);
}

.ship-bulk-bar__controls {
    gap: 10px;
    flex-wrap: wrap;
    justify-content: flex-end;
    min-width: 0;
}

.ship-bulk-bar__count {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    border: 1px solid #d5deeb;
    border-radius: 7px;
    background: #fbfdff;
    color: var(--pulse-muted);
    font-size: 12px;
    font-weight: 700;
    padding: 4px 10px;
    white-space: nowrap;
}

.ship-bulk-bar__label {
    color: #667085;
    font-size: 13px;
    font-weight: 750;
    white-space: nowrap;
}

.ship-bulk-status select {
    min-width: 190px;
    min-height: 38px;
    border: 1px solid var(--pulse-border);
    border-radius: 9px;
    background: white;
    color: #344054;
    font: inherit;
    font-size: 13px;
    font-weight: 700;
    padding: 6px 32px 6px 10px;
}

.ship-bulk-status select:disabled,
.ship-bulk-bar .button:disabled,
.ship-cargo-bulk-bar .button:disabled {
    cursor: not-allowed;
    opacity: 0.52;
}

.ship-select-col {
    width: 44px;
    min-width: 44px;
    text-align: center;
}

.ship-identity {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.ship-identity__owner {
    color: var(--pulse-text);
    font-weight: 800;
    text-decoration: none;
}

.ship-identity__owner:hover {
    color: var(--pulse-blue);
    text-decoration: underline;
}

.ship-identity__context {
    color: var(--pulse-muted);
    font-size: 12px;
    font-weight: 600;
}

.ship-scope {
    color: #354056;
    font-size: 13px;
    font-weight: 500;
    white-space: nowrap;
}

.ship-count {
    color: var(--pulse-text);
    font-size: 15px;
    font-weight: 500;
}

.ship-cycle-value {
    color: #354056;
    font-size: 13px;
    font-weight: 800;
    white-space: nowrap;
}

.ship-flags {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 3px;
}

.ship-flag {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    padding: 2px 8px;
    white-space: nowrap;
}

.ship-flag--hold {
    background: #fff0f0;
    color: #a53030;
}

.ship-flag--rollover {
    background: #f1eaff;
    color: #5b21b6;
}

.ship-clearing-cell {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
}

.ship-clearing-cell__name {
    color: var(--pulse-muted);
    font-size: 12px;
    font-weight: 600;
}

.ship-consignee-name {
    color: #354056;
    font-size: 13px;
    font-weight: 500;
}

.ship-action-cell {
    text-align: right;
    white-space: nowrap;
}

.ship-action-cell .pkg-actions-cell {
    justify-content: flex-end;
}

.ship-action-cell .pkg-action-menu__item:disabled {
    background: transparent;
    color: #98a2b3;
    cursor: not-allowed;
}

.ship-items-wide {
    margin-top: 0;
}

.ship-items-head {
    align-items: center;
    margin-bottom: 18px;
}

.ship-items-head__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    flex: 0 0 auto;
}

.ship-cargo-selection-count {
    color: #344054;
    font-size: 13px;
    font-weight: 750;
    white-space: nowrap;
}

.ship-rollover-button {
    min-height: 44px;
    border: 1px solid #d45a5a;
    background: #fffafa;
    color: #a53030;
}

.ship-rollover-button:hover:not(:disabled) {
    border-color: #b93838;
    background: #fff1f1;
    color: #8f2525;
}

.ship-rollover-button:disabled {
    border-color: #e0e4eb;
    background: #f8fafc;
    color: #98a2b3;
    cursor: not-allowed;
}

.ship-rollover-button svg,
.ship-rollover-button [data-lucide] {
    width: 17px;
    height: 17px;
}

/* --- Detail: item table --------------------------------------------------- */
.ship-items-table {
    min-width: 900px;
}

.ship-items-table tbody tr.is-selected > td {
    background: #f2f7ff;
}

.ship-items-table tbody tr.is-selected > td:first-child {
    box-shadow: inset 3px 0 0 #2f78d0;
}

.ship-items-table .ship-row-check:focus-visible {
    outline: 3px solid rgba(26, 103, 191, 0.24);
    outline-offset: 3px;
}

.ship-item-identity {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
    max-width: 420px;
}

.ship-item-identity__id {
    color: var(--pulse-text);
    font-weight: 800;
    text-decoration: none;
}

.ship-item-identity__id:hover {
    color: var(--pulse-blue);
    text-decoration: underline;
}

.ship-item-identity__hint,
.ship-item-identity__desc,
.ship-item-identity__note {
    color: var(--pulse-muted);
    font-size: 12px;
}

.ship-item-identity__note {
    color: #9a5700;
    font-weight: 600;
}

.ship-item-identity .ship-flag {
    align-self: flex-start;
}

/* --- Detail: clearing party side card ------------------------------------ */
.ship-clearing {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
}

.ship-clearing__head {
    display: flex;
    align-items: center;
    gap: 10px;
}

.ship-clearing__name {
    display: block;
    color: var(--pulse-text);
    font-weight: 800;
    text-decoration: none;
}

.ship-clearing__name:hover {
    color: var(--pulse-blue);
    text-decoration: underline;
}

.ship-clearing__address {
    display: block;
    color: var(--pulse-muted);
    font-size: 12px;
}

.ship-clearing__blocker {
    color: #a53030;
    font-size: 12px;
    font-weight: 600;
}

.ship-consignee-note {
    border-top: 1px solid var(--pulse-border);
    margin-top: 2px;
    padding-top: 10px;
}

.ship-consignee-note .ship-clearing__blocker {
    margin: 0;
}

.ship-next {
    color: #354056;
    font-size: 13px;
    line-height: 1.55;
}

.ship-rollover-info {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 14px -22px -8px;
    border-top: 1px solid #dbe8f7;
    background: #f4f8fd;
    color: #37516f;
    font-size: 12.5px;
    line-height: 1.45;
    padding: 13px 22px;
}

.ship-rollover-info svg,
.ship-rollover-info [data-lucide] {
    width: 17px;
    height: 17px;
    flex: 0 0 17px;
    color: #1a67bf;
}

.ship-selection-warning {
    margin: 0 0 16px;
    border: 1px solid #efc1c1;
    border-radius: 8px;
    background: #fff7f7;
    color: #9f2e2e;
    font-size: 12.5px;
    font-weight: 700;
    padding: 10px 12px;
}

.setup-activity__icon--hold { background: #fff0f0; color: #a53030; }
.setup-activity__icon--rollover { background: #f1eaff; color: #5b21b6; }

.ship-demo-note {
    color: var(--pulse-muted);
    font-size: 12px;
}

/* --- Rollover: cycle-to-cycle flow ---------------------------------------- */
.ship-rollover-flow {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    border: 1px solid var(--pulse-border);
    border-radius: 12px;
    background: #f8fafd;
    margin: 16px 0;
    padding: 14px 16px;
}

.ship-rollover-flow__step {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1 1 180px;
    min-width: 0;
}

.ship-rollover-flow__step strong {
    color: var(--pulse-text);
    font-size: 15px;
}

.ship-rollover-flow__step span {
    color: var(--pulse-muted);
    font-size: 12px;
}

.ship-rollover-flow__step--next strong {
    color: #0757ad;
}

.ship-rollover-flow__arrow {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    border-radius: 999px;
    background: white;
    color: var(--pulse-blue);
}

.ship-rollover-flow__arrow svg {
    width: 17px;
    height: 17px;
}

/* --- Detail: bulk rollover confirmation ---------------------------------- */
.shipment-rollover-modal {
    width: min(94vw, 840px);
    max-height: 86vh;
    overflow: hidden;
    padding: 0;
}

.shipment-rollover-modal form {
    display: flex;
    min-height: 0;
    max-height: 86vh;
    flex-direction: column;
}

.shipment-rollover-modal__header {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) 42px;
    align-items: start;
    gap: 18px;
    border-bottom: 1px solid var(--pulse-border);
    padding: 24px 30px 21px;
}

.shipment-rollover-modal__icon {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border-radius: 8px;
    background: #edf5ff;
    color: #1a67bf;
}

.shipment-rollover-modal__icon svg,
.shipment-rollover-modal__icon [data-lucide] {
    width: 20px;
    height: 20px;
}

.shipment-rollover-modal__header .eyebrow {
    margin: 0 0 4px;
}

.shipment-rollover-modal__header h3 {
    margin: 0;
    color: #101a37;
    font-size: 25px;
    line-height: 1.25;
}

.shipment-rollover-modal__header p:last-child {
    margin: 6px 0 0;
    color: var(--pulse-muted);
    font-size: 13.5px;
    line-height: 1.45;
}

.shipment-rollover-modal__body {
    min-height: 0;
    overflow-y: auto;
    padding: 22px 30px 24px;
}

.shipment-rollover-modal__error {
    margin: 16px 0 0;
}

.shipment-rollover-movement {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 32px minmax(0, 1fr);
    align-items: center;
    gap: 16px;
    border: 1px solid #dbe4f0;
    border-radius: 8px;
    background: #f8fafd;
    padding: 16px 22px;
}

.shipment-rollover-movement > div {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 3px;
}

.shipment-rollover-movement span,
.shipment-rollover-scope__label {
    color: var(--pulse-muted);
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
}

.shipment-rollover-movement strong {
    color: #101a37;
    font-size: 16px;
}

.shipment-rollover-movement > svg,
.shipment-rollover-movement > [data-lucide] {
    width: 19px;
    height: 19px;
    justify-self: center;
    color: #1a67bf;
}

.shipment-rollover-scope {
    display: flex;
    align-items: stretch;
    margin: 0;
    border-bottom: 1px solid #e5eaf1;
    padding: 18px 0;
}

.shipment-rollover-scope__group {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
    padding-right: 28px;
}

.shipment-rollover-scope__group + .shipment-rollover-scope__group {
    margin-left: 28px;
    border-left: 1px solid #dfe5ed;
    padding-left: 28px;
}

.shipment-rollover-scope__icon {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    border-radius: 999px;
    background: #f1f6fc;
    color: #344054;
}

.shipment-rollover-scope__icon svg,
.shipment-rollover-scope__icon [data-lucide] {
    width: 18px;
    height: 18px;
}

.shipment-rollover-scope__group > div {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 2px;
}

.shipment-rollover-scope strong {
    overflow-wrap: anywhere;
    color: #101a37;
    font-size: 13px;
    font-weight: 800;
}

.shipment-rollover-review {
    margin-top: 18px;
}

.shipment-rollover-review h4 {
    margin: 0 0 10px;
    color: #101a37;
    font-size: 14px;
}

.shipment-rollover-review__list {
    max-height: 310px;
    overflow-y: auto;
    border: 1px solid #dbe4f0;
    border-radius: 8px;
}

.shipment-rollover-review__item {
    display: grid;
    grid-template-columns: 36px minmax(190px, 1.05fr) minmax(210px, 1fr);
    align-items: center;
    gap: 14px;
    min-height: 68px;
    padding: 11px 14px;
}

.shipment-rollover-review__item + .shipment-rollover-review__item {
    border-top: 1px solid #e7ebf1;
}

.shipment-rollover-review__icon {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 7px;
    background: #f1f6fc;
    color: #344054;
}

.shipment-rollover-review__icon svg,
.shipment-rollover-review__icon [data-lucide] {
    width: 17px;
    height: 17px;
}

.shipment-rollover-review__details {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 3px;
}

.shipment-rollover-review__item strong {
    overflow-wrap: anywhere;
    color: #101a37;
    font-size: 13.5px;
}

.shipment-rollover-review__details span,
.shipment-rollover-review__item small {
    color: var(--pulse-muted);
    font-size: 12px;
    line-height: 1.4;
}

.shipment-rollover-review__item small {
    text-align: right;
}

.shipment-rollover-review__more {
    margin: 0;
    border-top: 1px solid #e7ebf1;
    background: #f8fafc;
    color: #1a67bf;
    font-size: 12px;
    font-weight: 750;
    padding: 9px 14px;
}

.shipment-rollover-fields {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    gap: 18px;
    margin-top: 20px;
    border-top: 1px solid #e5eaf1;
    padding-top: 20px;
}

.shipment-rollover-fields .pkg-field small {
    color: var(--pulse-muted);
    font-size: 11px;
    font-style: normal;
    font-weight: 600;
}

.shipment-rollover-fields textarea {
    min-height: 104px;
    resize: vertical;
}

.shipment-rollover-modal__footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    border-top: 1px solid var(--pulse-border);
    background: #fbfcfe;
    padding: 18px 30px;
}

.shipment-rollover-modal__footer .button {
    min-height: 44px;
}

.shipment-rollover-modal form[data-submitting="true"] {
    cursor: progress;
}

.shipment-rollover-submit__spinner {
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
    border: 2px solid rgba(255, 255, 255, 0.52);
    border-top-color: white;
    border-radius: 999px;
    animation: shipment-rollover-spin 0.7s linear infinite;
}

@keyframes shipment-rollover-spin {
    to { transform: rotate(360deg); }
}

/* --- Responsive: shipment summaries --------------------------------------- */
@media (max-width: 900px) {
    .ship-bulk-bar,
    .ship-cargo-bulk-bar {
        align-items: flex-start;
        flex-direction: column;
        padding: 13px 18px;
    }

    .ship-bulk-bar__controls {
        justify-content: flex-start;
        width: 100%;
    }

    .ship-bulk-status,
    .ship-bulk-status select {
        min-width: 0;
        max-width: 100%;
    }

}

@media (max-width: 720px) {
    .shipment-rollover-modal {
        width: min(96vw, 620px);
    }

    .shipment-rollover-modal__header {
        grid-template-columns: 40px minmax(0, 1fr) 38px;
        padding: 17px 16px 15px;
    }

    .shipment-rollover-modal__icon {
        width: 40px;
        height: 40px;
    }

    .shipment-rollover-modal__header h3 {
        font-size: 19px;
    }

    .shipment-rollover-modal__body {
        padding: 16px;
    }

    .shipment-rollover-movement {
        grid-template-columns: 1fr;
    }

    .shipment-rollover-movement > svg,
    .shipment-rollover-movement > [data-lucide] {
        justify-self: start;
        transform: rotate(90deg);
    }

    .shipment-rollover-scope {
        align-items: stretch;
        flex-direction: column;
        gap: 14px;
        padding: 16px 0;
    }

    .shipment-rollover-scope__group {
        padding-right: 0;
    }

    .shipment-rollover-scope__group + .shipment-rollover-scope__group {
        margin-left: 0;
        border-top: 1px solid #e5eaf1;
        border-left: 0;
        padding-top: 14px;
        padding-left: 0;
    }

    .shipment-rollover-fields {
        grid-template-columns: 1fr;
    }

    .shipment-rollover-review__item {
        grid-template-columns: 36px minmax(0, 1fr);
        gap: 8px 12px;
    }

    .shipment-rollover-review__item small {
        grid-column: 2;
        text-align: left;
    }

    .shipment-rollover-modal__footer {
        align-items: stretch;
        flex-direction: column-reverse;
        padding: 14px 16px;
    }

    .shipment-rollover-modal__footer .button {
        justify-content: center;
        width: 100%;
    }
}

@media (max-width: 640px) {
    .ship-items-head {
        align-items: stretch;
    }

    .ship-items-head__actions {
        align-items: flex-start;
        flex-direction: column;
    }

    .ship-rollover-button {
        justify-content: center;
        width: 100%;
    }
}

/* --- Clearing / consignee selection (Phase 5 Workstream 3) ---------------- */
.ship-consignee-actions {
    display: flex;
    flex: 0 0 auto;
    gap: 6px;
}

.customer-form__section-hint {
    margin: 5px 0 0;
    color: var(--pulse-muted);
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
}

.clearing-options {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    margin-top: 14px;
}

.clearing-options--modal {
    grid-template-columns: 1fr;
    margin-top: 10px;
}

.clearing-modal {
    max-width: 760px;
}

.shipment-consignee-modal {
    display: flex;
    width: min(96vw, 1140px);
    max-width: 1140px;
    max-height: 88vh;
    overflow: hidden;
    border-color: #d8e1ee;
    border-radius: 20px;
    box-shadow: 0 28px 90px rgba(7, 13, 32, 0.28);
    padding: 0;
}

.shipment-consignee-form {
    display: flex;
    width: 100%;
    max-height: 88vh;
    min-height: 0;
    flex-direction: column;
}

.shipment-consignee-modal__header {
    display: grid;
    align-items: center;
    grid-template-columns: 48px minmax(0, 1fr) 44px;
    gap: 16px;
    border-bottom: 1px solid #dde5f0;
    padding: 22px 28px 18px;
}

.shipment-consignee-modal__icon {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border: 1px solid #d9e6fb;
    border-radius: 14px;
    background: #eef5ff;
    color: var(--pulse-blue);
}

.shipment-consignee-modal__icon svg,
.shipment-consignee-modal__icon [data-lucide] {
    width: 22px;
    height: 22px;
}

.shipment-consignee-modal__title {
    min-width: 0;
}

.shipment-consignee-modal__eyebrow {
    margin: 0 0 6px;
    color: var(--pulse-blue);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.15em;
    text-transform: uppercase;
}

.shipment-consignee-modal__title h3 {
    margin: 0;
    color: var(--pulse-blue-dark);
    font-size: 32px;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1.05;
}

.shipment-consignee-modal__title p {
    margin: 8px 0 0;
    color: #5f6b7f;
    font-size: 14px;
    font-weight: 700;
}

.shipment-consignee-modal__close {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    box-shadow: none;
}

.shipment-consignee-modal__body {
    min-height: 0;
    overflow-y: auto;
    padding: 0;
}

.shipment-consignee-modal__errors {
    margin: 18px 28px 0;
}

.shipment-consignee-picker {
    display: grid;
    min-height: 360px;
    grid-template-columns: minmax(0, 43%) minmax(0, 57%);
    border-bottom: 1px solid #dde5f0;
}

.shipment-consignee-picker__list {
    min-width: 0;
    border-right: 1px solid #dde5f0;
    padding: 22px 24px 24px 28px;
}

.shipment-consignee-section-head h4 {
    margin: 0;
    color: var(--pulse-blue-dark);
    font-size: 17px;
    font-weight: 900;
    letter-spacing: 0;
}

.shipment-consignee-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.shipment-consignee-section-head p {
    margin: 6px 0 0;
    color: #5f6b7f;
    font-size: 13px;
    font-weight: 700;
}

.shipment-consignee-mode-action {
    flex: 0 0 auto;
    min-height: 40px;
    gap: 8px;
    border-color: rgba(0, 100, 210, 0.55);
    color: var(--pulse-blue);
    font-size: 13px;
    padding: 8px 12px;
}

.shipment-consignee-mode-action svg,
.shipment-consignee-mode-action [data-lucide] {
    width: 17px;
    height: 17px;
}

.shipment-consignee-create-helper {
    display: none;
    align-items: center;
    gap: 8px;
    margin: 18px 0 0;
    color: #0b58bd;
    font-size: 13px;
    font-weight: 750;
    line-height: 1.4;
}

.shipment-consignee-form[data-mode="choose"] .shipment-consignee-mode-action--choose,
.shipment-consignee-form[data-mode="create"] .shipment-consignee-mode-action--new {
    display: none;
}

.shipment-consignee-form[data-mode="create"] .shipment-consignee-create-helper {
    display: flex;
}

.shipment-consignee-form[data-mode="create"] .shipment-consignee-options {
    opacity: 0.72;
}

.shipment-consignee-options {
    display: grid;
    gap: 12px;
    margin-top: 20px;
}

.shipment-consignee-option {
    position: relative;
    display: grid;
    min-height: 92px;
    align-items: center;
    grid-template-columns: 48px minmax(0, 1fr) 24px;
    gap: 14px;
    border: 1px solid #dce4ef;
    border-radius: 14px;
    background: #fff;
    cursor: pointer;
    padding: 14px 16px;
    transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.shipment-consignee-option:hover {
    border-color: #bfd0e7;
    background: #fbfdff;
}

.shipment-consignee-option:has(.shipment-consignee-option__input:checked) {
    border-color: var(--pulse-blue);
    background: #f5f9ff;
    box-shadow: 0 0 0 1px rgba(0, 100, 210, 0.14) inset;
}

.shipment-consignee-option:has(.shipment-consignee-option__input:focus-visible) {
    outline: 2px solid var(--pulse-blue);
    outline-offset: 2px;
}

.shipment-consignee-option__input {
    position: absolute;
    top: 50%;
    right: 16px;
    width: 22px;
    height: 22px;
    margin: 0;
    opacity: 0;
    transform: translateY(-50%);
}

.shipment-consignee-option__avatar {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border: 1px solid #d8e5f7;
    border-radius: 50%;
    background: #edf5ff;
    color: var(--pulse-blue);
    font-size: 15px;
    font-weight: 900;
    letter-spacing: 0.02em;
}

.shipment-consignee-option__body {
    display: grid;
    min-width: 0;
    gap: 7px;
}

.shipment-consignee-option__head {
    display: flex;
    min-width: 0;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.shipment-consignee-status {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 1px solid #d7e1ee;
    border-radius: 999px;
    background: #f8fafc;
    color: #4f5f73;
    padding: 3px 8px;
    font-size: 11.5px;
    font-weight: 850;
    line-height: 1.1;
    white-space: nowrap;
}

.shipment-consignee-status svg,
.shipment-consignee-status [data-lucide] {
    width: 13px;
    height: 13px;
}

.shipment-consignee-status--verified {
    border-color: #b8dec9;
    background: #edf8f2;
    color: #137044;
}

.shipment-consignee-status--pending {
    border-color: #c8daf5;
    background: #f0f6ff;
    color: #0b58bd;
}

.shipment-consignee-status--required {
    border-color: #f5d3a6;
    background: #fff8ed;
    color: #9a5800;
}

.shipment-consignee-option__name {
    overflow: hidden;
    color: var(--pulse-blue-dark);
    font-size: 15px;
    font-weight: 850;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.shipment-consignee-option:has(.shipment-consignee-option__input:checked) .shipment-consignee-option__name {
    font-weight: 900;
}

.shipment-consignee-option__meta {
    overflow: hidden;
    color: #647287;
    font-size: 13px;
    font-weight: 650;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.shipment-consignee-option__radio {
    display: grid;
    width: 22px;
    height: 22px;
    place-items: center;
    border: 1.8px solid #9aa8bc;
    border-radius: 50%;
    background: #fff;
}

.shipment-consignee-option__radio::after {
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--pulse-blue);
    opacity: 0;
    transform: scale(0.7);
    transition: opacity 120ms ease, transform 120ms ease;
}

.shipment-consignee-option:has(.shipment-consignee-option__input:checked) .shipment-consignee-option__radio {
    border-color: var(--pulse-blue);
}

.shipment-consignee-option:has(.shipment-consignee-option__input:checked) .shipment-consignee-option__radio::after {
    opacity: 1;
    transform: scale(1);
}

.shipment-consignee-option--fallback {
    border-style: dashed;
}

.shipment-consignee-detail {
    min-width: 0;
    padding: 28px 28px 24px 34px;
}

.shipment-consignee-form[data-mode="create"] .shipment-consignee-detail,
.shipment-consignee-form[data-mode="choose"] .shipment-consignee-create {
    display: none;
}

.shipment-consignee-detail__empty {
    display: grid;
    min-height: 100%;
    align-content: center;
    justify-items: center;
    gap: 10px;
    color: #657287;
    text-align: center;
}

.shipment-consignee-detail__empty[hidden] {
    display: none;
}

.shipment-consignee-detail__empty-icon {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border: 1px solid #d9e6fb;
    border-radius: 14px;
    background: #f1f6ff;
    color: var(--pulse-blue);
}

.shipment-consignee-detail__empty h4 {
    margin: 6px 0 0;
    color: var(--pulse-blue-dark);
    font-size: 18px;
    font-weight: 900;
}

.shipment-consignee-detail__empty p {
    max-width: 330px;
    margin: 0;
    font-size: 13.5px;
    font-weight: 650;
    line-height: 1.5;
}

.shipment-consignee-detail__panel {
    display: grid;
    gap: 20px;
}

.shipment-consignee-detail__panel[hidden] {
    display: none;
}

.shipment-consignee-detail__heading {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.shipment-consignee-detail__heading h4 {
    margin: 0;
    color: var(--pulse-blue-dark);
    font-size: 24px;
    font-weight: 900;
    line-height: 1.15;
}

.shipment-consignee-detail__rows {
    display: grid;
    margin: 0;
}

.shipment-consignee-detail-row {
    display: grid;
    grid-template-columns: 152px minmax(0, 1fr);
    gap: 18px;
    border-top: 1px solid #e1e7f0;
    padding: 18px 0;
}

.shipment-consignee-detail-row:last-child {
    border-bottom: 1px solid #e1e7f0;
}

.shipment-consignee-detail-row dt {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    color: var(--pulse-blue-dark);
    font-size: 14px;
    font-weight: 850;
}

.shipment-consignee-detail-row__icon {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    place-items: center;
    border-radius: 12px;
    background: #f0f5fd;
    color: var(--pulse-blue-dark);
}

.shipment-consignee-detail-row__icon svg,
.shipment-consignee-detail-row__icon [data-lucide] {
    width: 19px;
    height: 19px;
}

.shipment-consignee-detail-row dd {
    display: grid;
    gap: 5px;
    margin: 0;
    color: #344054;
    font-size: 15px;
    font-weight: 650;
    line-height: 1.35;
}

.shipment-consignee-confirmation {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 12px;
    margin: 0;
    border: 1px solid #cfe0fb;
    border-radius: 12px;
    background: #f3f8ff;
    color: #0b58bd;
    padding: 13px 15px;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.45;
}

.shipment-consignee-confirmation span {
    display: grid;
    width: 24px;
    height: 24px;
    place-items: center;
    color: var(--pulse-blue);
}

.shipment-consignee-confirmation svg,
.shipment-consignee-confirmation [data-lucide] {
    width: 18px;
    height: 18px;
}

.shipment-consignee-confirmation--create {
    margin-top: 22px;
}

.shipment-consignee-create {
    min-width: 0;
    padding: 28px 28px 24px 34px;
}

.shipment-consignee-create__head h4 {
    margin: 0;
    color: var(--pulse-blue-dark);
    font-size: 22px;
    font-weight: 900;
    letter-spacing: 0;
}

.shipment-consignee-create__head p {
    margin: 7px 0 0;
    color: #5f6b7f;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
}

.shipment-consignee-create__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-top: 22px;
}

.shipment-consignee-create__field-note {
    margin: -2px 0 10px;
    color: #647287;
    font-size: 12.5px;
    font-weight: 650;
    line-height: 1.4;
}

.shipment-consignee-id-upload {
    max-width: 100%;
}

.shipment-consignee-fallback {
    border-bottom: 1px solid #dde5f0;
    padding: 0 28px;
}

.shipment-consignee-form[data-mode="create"] .shipment-consignee-fallback {
    display: none;
}

.shipment-consignee-fallback__summary {
    display: grid;
    align-items: center;
    grid-template-columns: 34px minmax(0, 1fr) 22px;
    gap: 12px;
    cursor: pointer;
    list-style: none;
    padding: 18px 0;
}

.shipment-consignee-fallback__summary::-webkit-details-marker {
    display: none;
}

.shipment-consignee-fallback__icon {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 11px;
    color: #506176;
}

.shipment-consignee-fallback__icon svg,
.shipment-consignee-fallback__icon [data-lucide],
.shipment-consignee-fallback__chevron svg,
.shipment-consignee-fallback__chevron [data-lucide] {
    width: 20px;
    height: 20px;
}

.shipment-consignee-fallback__copy {
    display: grid;
    min-width: 0;
    gap: 4px;
}

.shipment-consignee-fallback__copy strong {
    color: var(--pulse-blue-dark);
    font-size: 15px;
    font-weight: 900;
}

.shipment-consignee-fallback__copy small {
    color: #647287;
    font-size: 13px;
    font-weight: 650;
    line-height: 1.35;
}

.shipment-consignee-fallback__chevron {
    display: grid;
    place-items: center;
    color: #506176;
    transition: transform 160ms ease;
}

.shipment-consignee-fallback[open] .shipment-consignee-fallback__chevron {
    transform: rotate(180deg);
}

.shipment-consignee-fallback__content {
    display: grid;
    gap: 16px;
    padding: 0 0 22px;
}

.shipment-consignee-options--historical {
    margin-top: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.shipment-consignee-fallback__fields {
    display: grid;
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
    gap: 16px;
}

.shipment-consignee-modal__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-top: auto;
    border-top: 1px solid #dde5f0;
    padding: 16px 28px 18px;
}

.shipment-consignee-modal__assurance {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    color: #4f5f73;
    font-size: 13.5px;
    font-weight: 700;
    line-height: 1.4;
}

.shipment-consignee-modal__assurance > span:first-child {
    display: grid;
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    place-items: center;
    color: var(--pulse-blue-dark);
}

.shipment-consignee-modal__assurance-copy {
    display: inline;
}

.shipment-consignee-form[data-mode="choose"] .shipment-consignee-modal__assurance-copy--create,
.shipment-consignee-form[data-mode="create"] .shipment-consignee-modal__assurance-copy--choose,
.shipment-consignee-form[data-mode="choose"] .shipment-consignee-submit--create,
.shipment-consignee-form[data-mode="create"] .shipment-consignee-submit--choose {
    display: none;
}

.shipment-consignee-modal__assurance svg,
.shipment-consignee-modal__assurance [data-lucide] {
    width: 19px;
    height: 19px;
}

.shipment-consignee-modal__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
}

.shipment-consignee-modal__actions .button {
    min-height: 44px;
    border-radius: 11px;
}

.shipment-consignee-modal__actions .button:disabled {
    cursor: not-allowed;
    opacity: 0.5;
    transform: none;
}

@media (max-width: 850px) {
    .shipment-consignee-modal {
        width: min(96vw, 680px);
        max-height: 88vh;
    }

    .shipment-consignee-modal__header {
        grid-template-columns: 42px minmax(0, 1fr) 40px;
        gap: 12px;
        padding: 18px 20px 16px;
    }

    .shipment-consignee-modal__icon {
        width: 42px;
        height: 42px;
        border-radius: 13px;
    }

    .shipment-consignee-modal__title h3 {
        font-size: 27px;
    }

    .shipment-consignee-picker {
        grid-template-columns: 1fr;
    }

    .shipment-consignee-picker__list {
        border-right: 0;
        border-bottom: 1px solid #dde5f0;
        padding: 20px;
    }

    .shipment-consignee-detail,
    .shipment-consignee-create {
        padding: 22px 20px;
    }

    .shipment-consignee-options--historical,
    .shipment-consignee-fallback__fields,
    .shipment-consignee-create__grid {
        grid-template-columns: 1fr;
    }

    .shipment-consignee-fallback {
        padding: 0 20px;
    }

    .shipment-consignee-modal__footer {
        align-items: flex-start;
        flex-direction: column;
        padding: 16px 20px 18px;
    }

    .shipment-consignee-modal__actions {
        width: 100%;
    }
}

@media (max-width: 640px) {
    .shipment-consignee-modal {
        width: 96vw;
        border-radius: 16px;
    }

    .shipment-consignee-modal__header {
        grid-template-columns: minmax(0, 1fr) 40px;
    }

    .shipment-consignee-modal__icon {
        display: none;
    }

    .shipment-consignee-modal__title h3 {
        font-size: 24px;
    }

    .shipment-consignee-option {
        min-height: 88px;
        grid-template-columns: 42px minmax(0, 1fr) 22px;
        gap: 12px;
        padding: 13px 14px;
    }

    .shipment-consignee-option__avatar {
        width: 42px;
        height: 42px;
    }

    .shipment-consignee-section-head {
        align-items: stretch;
        flex-direction: column;
    }

    .shipment-consignee-mode-action {
        justify-content: center;
        width: 100%;
    }

    .shipment-consignee-detail-row {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .shipment-consignee-modal__actions {
        align-items: stretch;
        flex-direction: column-reverse;
    }

    .shipment-consignee-modal__actions .button {
        width: 100%;
    }
}

.clearing-modal--compact {
    max-width: 620px;
}

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

.clearing-modal__section + .clearing-modal__section {
    margin-top: 18px;
}

.clearing-modal__section-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}

.clearing-modal__section-head h4 {
    margin: 0;
    color: var(--pulse-text);
    font-size: 14px;
    font-weight: 800;
}

.clearing-modal__section-head span {
    color: var(--pulse-muted);
    font-size: 12px;
    font-weight: 700;
}

.clearing-modal__footer {
    justify-content: space-between;
    gap: 14px;
}

.courier-consignee-add-modal {
    max-width: 720px;
}

.courier-consignee-add-form {
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
}

.courier-consignee-add-section {
    display: grid;
    gap: 12px;
    min-width: 0;
}

.courier-consignee-add-section + .courier-consignee-add-section {
    border-top: 1px solid #edf2f8;
    padding-top: 18px;
}

.courier-consignee-add-section__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}

.courier-consignee-add-section__head h4 {
    margin: 0;
    color: var(--pulse-text);
    font-size: 14px;
    font-weight: 850;
}

.courier-consignee-add-section__head span {
    color: var(--pulse-muted);
    font-size: 11.5px;
    font-weight: 750;
}

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

.courier-consignee-upload {
    display: grid;
    align-items: center;
    gap: 14px;
    grid-template-columns: 46px minmax(0, 1fr);
    border: 1px dashed rgba(0, 100, 210, 0.34);
    border-radius: 14px;
    background: #f8fbff;
    cursor: pointer;
    padding: 16px;
    transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.courier-consignee-upload:focus-within,
.courier-consignee-upload:hover {
    border-color: var(--pulse-blue);
    background: #f1f6ff;
    box-shadow: 0 0 0 4px rgba(0, 100, 210, 0.08);
}

.courier-consignee-upload input {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
}

.courier-consignee-upload__icon {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    background: #eef4ff;
    color: var(--pulse-blue);
}

.courier-consignee-upload__icon svg {
    width: 22px;
    height: 22px;
}

.courier-consignee-upload__copy {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.courier-consignee-upload__copy strong {
    color: var(--pulse-ink);
    font-size: 13.5px;
    font-weight: 850;
}

.courier-consignee-upload__copy small {
    color: var(--pulse-muted);
    font-size: 12px;
    line-height: 1.4;
}

.courier-consignee-add-footer__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.clearing-option {
    position: relative;
    display: block;
    padding: 14px 16px;
    border: 1px solid var(--pulse-border);
    border-radius: 12px;
    background: #fff;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.clearing-option:hover {
    border-color: #bcd2f5;
    background: #fbfcff;
}

.clearing-option__input {
    position: absolute;
    top: 14px;
    right: 14px;
    accent-color: var(--pulse-blue);
}

.clearing-option:has(.clearing-option__input:checked) {
    border-color: var(--pulse-blue);
    background: #f6f9ff;
    box-shadow: 0 0 0 1px var(--pulse-blue) inset;
}

.clearing-option:has(.clearing-option__input:focus-visible) {
    outline: 2px solid var(--pulse-blue);
    outline-offset: 2px;
}

.clearing-option__body {
    display: grid;
    gap: 6px;
    padding-right: 22px;
}

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

.clearing-option__avatar {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    border-radius: 50%;
    background: #eaf1fd;
    color: var(--pulse-blue);
    font-size: 11.5px;
    font-weight: 900;
}

.clearing-option__name {
    color: var(--pulse-text);
    font-size: 14px;
    font-weight: 800;
}

.clearing-option__address,
.clearing-option__links {
    color: var(--pulse-muted);
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.45;
}

.clearing-option__links {
    color: #7d8aa5;
    font-size: 12px;
}

.clearing-option--fallback {
    border-style: dashed;
}

.clearing-empty {
    margin: 14px 0 0;
    color: var(--pulse-muted);
    font-size: 13px;
    font-weight: 600;
}

.clearing-fallback-fields {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px dashed var(--pulse-border);
}

.clearing-inline-add {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
}

.clearing-inline-add__hint {
    color: var(--pulse-muted);
    font-size: 12.5px;
    font-weight: 600;
}

/* ============================================================================
   Phase 5 · BOL workspace, physical pieces, and printable labels
   ========================================================================= */

.setup-info__sub {
    margin: 2px 0 0;
    color: var(--pulse-muted);
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.45;
}

.bol-seq {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 26px;
    height: 26px;
    padding: 0 7px;
    border-radius: 8px;
    background: #eef1f8;
    color: #3b4667;
    font-size: 12.5px;
    font-weight: 800;
}

.bol-gap {
    color: #b23c17;
    font-size: 12.5px;
    font-weight: 700;
}

.bol-flag {
    display: inline-flex;
    align-items: center;
    margin-left: 6px;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.bol-flag--amended {
    background: #fff4e0;
    color: #8a5200;
}

.bol-flag--fallback {
    background: #f1eaff;
    color: #5b21b6;
}

.bol-ready-tag {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
}

.bol-ready-tag--ready {
    background: #e7f7ee;
    color: #0f7a43;
}

.bol-ready-tag--gap {
    background: #fdeee8;
    color: #b23c17;
}

/* --- Description of goods / instructions ---------------------------------- */
.bol-goods {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid var(--pulse-border);
}

.bol-goods__text {
    margin: 6px 0 0;
    color: var(--pulse-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.55;
}

.bol-goods__gap {
    margin: 6px 0 0;
    color: #b23c17;
    font-size: 13.5px;
    font-weight: 700;
}

.bol-consignee-address {
    margin: 10px 0 0;
    color: var(--pulse-muted);
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.5;
}

.bol-fallback {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px dashed var(--pulse-border);
}

.bol-fallback__reason {
    margin: 8px 0 0;
    color: var(--pulse-text);
    font-size: 12.5px;
    font-weight: 700;
}

/* --- Readiness gate ------------------------------------------------------- */
.bol-readiness__head {
    display: flex;
    align-items: center;
    gap: 12px;
}

.bol-readiness__mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    flex: none;
    border-radius: 10px;
}

.bol-readiness__mark svg {
    width: 19px;
    height: 19px;
}

.bol-readiness--ready .bol-readiness__mark {
    background: #e7f7ee;
    color: #0f7a43;
}

.bol-readiness--blocked .bol-readiness__mark {
    background: #fdeee8;
    color: #b23c17;
}

.bol-readiness__copy {
    flex: 1;
    min-width: 0;
}

.bol-readiness__copy h3 {
    margin: 2px 0 0;
    font-size: 15px;
    font-weight: 800;
    color: var(--pulse-text);
}

.bol-readiness__score {
    flex: none;
    color: var(--pulse-muted);
    font-size: 12.5px;
    font-weight: 800;
}

.bol-check {
    list-style: none;
    margin: 14px 0 0;
    padding: 0;
    display: grid;
    gap: 2px;
}

.bol-check__row {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    align-items: baseline;
    gap: 10px;
    padding: 7px 8px;
    border-radius: 8px;
}

.bol-check__body {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.bol-check__row--gap {
    background: #fdf3ef;
}

.bol-check__mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.bol-check__mark svg {
    width: 13px;
    height: 13px;
}

.bol-check__row--ok .bol-check__mark {
    color: #0f7a43;
}

.bol-check__row--gap .bol-check__mark {
    color: #b23c17;
}

.bol-check__label {
    color: var(--pulse-text);
    font-size: 12.5px;
    font-weight: 700;
    min-width: 0;
}

/* Only gap rows carry a detail, and it must stay fully readable — a truncated
   "Not confir…" tells staff nothing they can act on. */
.bol-check__detail {
    color: #b23c17;
    font-size: 11.5px;
    font-weight: 600;
    line-height: 1.4;
}

/* --- Piece type reference / create form ----------------------------------- */
.bol-type-list {
    list-style: none;
    margin: 12px 0 0;
    padding: 0;
    display: grid;
    gap: 1px;
}

.bol-type-list__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 6px 0;
    border-bottom: 1px solid var(--pulse-border);
}

.bol-type-list__row:last-child {
    border-bottom: 0;
}

.bol-type-list__name {
    color: var(--pulse-text);
    font-size: 12.5px;
    font-weight: 700;
}

.bol-type-list__value {
    color: var(--pulse-muted);
    font-size: 11.5px;
    font-weight: 600;
    text-align: right;
}

.bol-generated {
    margin: 0;
    padding: 10px 14px;
    border: 1px dashed var(--pulse-border);
    border-radius: 10px;
    background: #f7f9fd;
    color: var(--pulse-blue-dark);
    font-size: 16px;
    font-weight: 800;
    letter-spacing: 0.02em;
}

.bol-new-modal {
    width: min(calc(100vw - 56px), 1180px);
    max-width: 1180px;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 0;
    border-radius: 18px;
    color-scheme: light;
}

.bol-new-modal__header {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr) 44px;
    align-items: center;
    gap: 16px;
    padding: 20px 24px;
    border-bottom: 1px solid var(--pulse-border);
}

.bol-new-modal__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border: 0;
    border-radius: 12px;
    background: var(--pulse-gold);
    color: #ffffff;
    box-shadow: 0 8px 18px rgba(139, 98, 29, 0.18);
}

.bol-new-modal__icon svg {
    width: 25px;
    height: 25px;
}

.bol-new-modal__title h3 {
    margin: 0;
    color: var(--pulse-text);
    font-size: 27px;
    font-weight: 850;
    letter-spacing: -0.025em;
    line-height: 1.12;
}

.bol-new-modal__title p {
    margin: 5px 0 0;
    color: var(--pulse-muted);
    font-size: 13.5px;
    font-weight: 620;
    line-height: 1.4;
}

.bol-new-modal__header .relationship-modal__close {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    box-shadow: none;
}

.bol-new-modal__body {
    flex: 1;
    min-height: 0;
    overflow: auto;
}

.bol-new-modal__columns {
    display: grid;
    grid-template-columns: minmax(0, 1.9fr) minmax(320px, 1fr);
    min-height: 0;
}

.bol-new-modal__form {
    min-width: 0;
    padding: 26px 28px 30px;
    border-right: 1px solid var(--pulse-border);
}

.bol-new-modal__fields {
    display: grid;
    gap: 21px;
}

.bol-new-modal .pkg-field {
    display: grid;
    gap: 7px;
    min-width: 0;
}

.bol-new-modal .pkg-field > span,
.bol-new-modal .pkg-field__label {
    color: var(--pulse-text);
    font-size: 12.5px;
    font-weight: 800;
}

.bol-new-modal .pkg-field input,
.bol-new-modal .pkg-field select {
    min-height: 48px;
    padding-right: 14px;
    padding-left: 14px;
    border-radius: 9px;
    border-color: var(--pulse-border);
    background-color: #ffffff;
    color: var(--pulse-text);
    font-size: 13.5px;
    font-weight: 650;
}

.bol-new-modal .pkg-field select {
    appearance: none;
    padding-right: 42px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23252525' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 17px;
    accent-color: var(--pulse-blue);
}

.bol-new-modal .pkg-field input:focus,
.bol-new-modal .pkg-field select:focus {
    outline: 0;
    border-color: var(--pulse-blue);
    box-shadow: 0 0 0 3px rgba(31, 90, 59, 0.13);
}

.bol-new-modal .pkg-field--readonly input[readonly],
.bol-new-modal .bol-consignee-prompt select:disabled,
.bol-new-modal .pkg-field--locked select:disabled {
    border-color: #ded4c5;
    background-color: #f7f3eb;
    color: #625e56;
    cursor: default;
    opacity: 1;
}

.bol-new-modal .pkg-field--locked select:disabled {
    padding-right: 14px;
    background-image: none;
}

.bol-new-modal .pkg-field--readonly input[readonly]:focus {
    border-color: #ded4c5;
    box-shadow: none;
}

.bol-new-modal .pkg-field__hint {
    color: #68748b;
    font-size: 12.5px;
    font-weight: 650;
    line-height: 1.45;
}

.bol-new-modal .bol-consignee-field {
    display: grid;
    gap: 10px;
}

.bol-piece-breakdown {
    grid-column: 1 / -1;
    display: grid;
    gap: 13px;
    padding-top: 21px;
    border-top: 1px solid var(--pulse-border);
}

.bol-piece-breakdown__title,
.bol-piece-breakdown__head {
    display: flex;
    align-items: center;
    gap: 11px;
}

.bol-piece-breakdown__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 8px;
    background: #e6efe9;
    color: var(--pulse-blue);
}

.bol-piece-breakdown__icon svg {
    width: 18px;
    height: 18px;
}

.bol-piece-breakdown__title h4,
.bol-piece-breakdown__head strong {
    margin: 0;
    color: var(--pulse-text);
    font-size: 15.5px;
    font-weight: 850;
}

.bol-piece-breakdown__title p {
    margin: 3px 0 0;
    color: var(--pulse-muted);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.45;
}

.bol-piece-breakdown__labels {
    display: grid;
    grid-template-columns: minmax(180px, 1.7fr) minmax(82px, 0.72fr) minmax(96px, 0.86fr) minmax(96px, 0.86fr) 42px;
    gap: 10px;
    padding: 0 0 0 0;
    color: var(--pulse-text);
    font-size: 11.5px;
    font-weight: 760;
}

.bol-piece-breakdown__rows {
    display: grid;
    gap: 9px;
}

.bol-piece-breakdown__row {
    display: grid;
    grid-template-columns: minmax(180px, 1.7fr) minmax(82px, 0.72fr) minmax(96px, 0.86fr) minmax(96px, 0.86fr) 42px;
    gap: 10px;
    align-items: center;
}

.bol-piece-breakdown__row .pkg-field {
    min-width: 0;
}

.bol-piece-breakdown__measurement {
    background-color: #faf7f0 !important;
}

.bol-piece-breakdown__measurement:focus {
    background-color: #ffffff !important;
}

.bol-piece-breakdown__remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border: 1px solid #ddc6bc;
    border-radius: 9px;
    background: #fffdfb;
    color: #9b3030;
    cursor: pointer;
    transition: background 140ms ease, border-color 140ms ease, color 140ms ease;
}

.bol-piece-breakdown__remove svg {
    width: 17px;
    height: 17px;
}

.bol-piece-breakdown__remove:not(:disabled):hover {
    border-color: #c89586;
    background: #f8e8e5;
    color: #7e2525;
}

.bol-piece-breakdown__remove:disabled {
    opacity: 0.42;
    cursor: not-allowed;
}

.bol-piece-breakdown__actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 11px;
}

.bol-piece-breakdown__actions .button {
    width: fit-content;
    min-height: 38px;
    padding: 8px 13px;
    border-color: var(--pulse-blue);
    border-radius: 9px;
    background: transparent;
    color: var(--pulse-blue);
    font-size: 12.5px;
    font-weight: 760;
    line-height: 1;
}

.bol-piece-breakdown__actions .button:hover {
    background: #e6efe9;
}

.bol-piece-breakdown__actions .button svg {
    width: 15px;
    height: 15px;
}

.pkg-field__label {
    display: block;
    margin-bottom: 6px;
    color: var(--pulse-text);
    font-size: 12.5px;
    font-weight: 700;
}

.bol-consignee-field {
    grid-column: 1 / -1;
    min-width: 0;
}

.bol-consignee-group {
    display: grid;
    gap: 14px;
}

.bol-consignee-prompt {
    margin: 0;
    color: var(--pulse-muted);
    font-size: 12.5px;
    font-weight: 600;
}

.bol-sticker-window {
    margin: 0;
    min-height: 100vh;
    background: #ffffff;
}

.bol-sticker-window__content {
    width: 100%;
    margin: 0;
    padding: 0;
}

.bol-sticker-window__empty {
    width: min(680px, calc(100vw - 48px));
    margin: 80px auto;
    padding: 28px;
    border: 1px solid var(--pulse-border);
    border-radius: 14px;
    text-align: center;
}

.bol-sticker-window__empty h1 {
    margin: 0 0 8px;
    color: var(--pulse-text);
    font-size: 28px;
}

.bol-sticker-window__empty p {
    margin: 0;
    color: var(--pulse-muted);
    font-weight: 600;
}

.bol-label-sheet {
    display: grid;
    gap: 20px;
}

.bol-sticker-window .bol-label-sheet {
    display: block;
    gap: 0;
}

.bol-sticker-window .bol-label {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: min(1480px, calc(100vw - 72px));
    min-height: 100vh;
    margin: 0 auto;
    padding: clamp(28px, 4vw, 60px) 0;
    border: 0;
    border-radius: 0;
}

.bol-sticker-window .bol-label__head {
    margin-bottom: clamp(28px, 5vh, 60px);
}

.bol-sticker-window .bol-label__sequence {
    font-size: clamp(72px, 7vw, 112px);
}

.bol-sticker-window .bol-label__mark {
    width: clamp(46px, 4vw, 64px);
    height: clamp(46px, 4vw, 64px);
}

.bol-sticker-window .bol-label__brand {
    gap: 18px;
}

.bol-sticker-window .bol-label__brand-name {
    font-size: clamp(34px, 3vw, 48px);
}

.bol-sticker-window .bol-label__body {
    min-height: clamp(390px, 48vh, 560px);
    border-width: 5px;
    padding: clamp(28px, 3vw, 48px);
}

.bol-sticker-window .bol-label__bol {
    margin-bottom: clamp(28px, 4vh, 48px);
}

.bol-sticker-window .bol-label__bol-key,
.bol-sticker-window .bol-label__bol-value {
    font-size: clamp(36px, 3.8vw, 58px);
}

.bol-sticker-window .bol-label__party {
    padding: clamp(10px, 1.5vh, 18px) 0;
}

.bol-sticker-window .bol-label__party-key {
    font-size: clamp(24px, 2vw, 34px);
}

.bol-sticker-window .bol-label__party-name {
    font-size: clamp(30px, 2.8vw, 44px);
}

.bol-sticker-window .bol-label__party-address {
    margin-top: 8px;
    font-size: clamp(24px, 2vw, 34px);
}

.bol-sticker-window .bol-label__rule {
    border-top-width: 5px;
    margin: clamp(24px, 4vh, 48px) 0;
}

.bol-sticker-window .bol-label__foot {
    margin-top: clamp(24px, 3vh, 40px);
}

.bol-sticker-window .bol-label__piece,
.bol-sticker-window .bol-label__manifest {
    font-size: clamp(20px, 1.7vw, 28px);
}

/* Legacy sticker layout: big sequence + brand, then a heavy-bordered
   shipper/consignee block split by a rule. */
.bol-label {
    background: #ffffff;
    border-radius: 14px;
    border: 1px solid var(--pulse-border);
    padding: 22px 24px;
}

.bol-label__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
}

.bol-label__sequence {
    color: #000000;
    font-size: 44px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: -0.02em;
}

.bol-label__brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.bol-label__mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    color: var(--pulse-blue-dark);
}

.bol-label__mark svg {
    width: 100%;
    height: 100%;
}

.bol-label__brand-name {
    color: var(--pulse-blue-dark);
    font-size: 22px;
    font-weight: 800;
}

.bol-label__body {
    border: 3px solid #000000;
    padding: 16px 18px;
}

.bol-label__bol {
    margin: 0 0 14px;
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 10px;
}

.bol-label__bol-key,
.bol-label__bol-value {
    color: #000000;
    font-size: 24px;
    font-weight: 900;
}

.bol-label__party {
    padding: 4px 0;
}

.bol-label__party-key {
    margin: 0 0 4px;
    color: #000000;
    font-size: 15px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.bol-label__party-name {
    margin: 0;
    color: #000000;
    font-size: 19px;
    font-weight: 800;
}

.bol-label__party-address {
    margin: 2px 0 0;
    color: #000000;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.4;
}

.bol-label__rule {
    border: 0;
    border-top: 3px solid #000000;
    margin: 12px 0;
}

.bol-label__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 14px;
}

.bol-label__piece,
.bol-label__manifest {
    color: var(--pulse-muted);
    font-size: 12.5px;
    font-weight: 700;
}

@media (max-width: 720px) {
    .bol-label__sequence {
        font-size: 34px;
    }

    .bol-label__bol-key,
    .bol-label__bol-value {
        font-size: 19px;
    }

}

/* Print: the label sheet is the page. Legacy printed landscape stickers, one
   per page, with no app chrome around them. */
@media print {
    @page {
        size: landscape;
        margin: 0.4in;
    }

    /* Scoped to the sticker window so printing any other screen is untouched. */
    body:has(.bol-labels-page) {
        background: #ffffff;
    }

    .bol-label-sheet {
        gap: 0;
    }

    .bol-label {
        border: 0;
        border-radius: 0;
        padding: 0;
        break-after: page;
        page-break-after: always;
    }

    .bol-label:last-child {
        break-after: auto;
        page-break-after: auto;
    }
}

/* --- Pre-manifest row editor ---------------------------------------------- */
/* The BOL index is the operational row staff already know, so it is a wide
   table first. Editable cells are staff-owned; derived cells are plain text. */
.bol-rows-wrap {
    overflow-x: auto;
}

.bol-rows {
    min-width: 1280px;
    border-collapse: separate;
    border-spacing: 0;
}

.bol-rows th {
    border-bottom: 1px solid var(--pulse-border);
    white-space: nowrap;
}

.bol-rows td {
    border-bottom: 1px solid var(--pulse-border);
    vertical-align: top;
    padding: 14px 12px;
}

.bol-rows tbody tr:last-child td {
    border-bottom: 0;
}

.bol-rows .bol-scroll-gutter {
    width: 24px;
    min-width: 24px;
    padding: 0;
    pointer-events: none;
}

.bol-row--gap {
    background: #fffaf7;
}

.bol-row__bol {
    min-width: 92px;
}

.bol-row__number {
    appearance: none;
    padding: 0;
    border: 0;
    background: none;
    color: var(--pulse-blue-dark);
    font-size: 15px;
    font-weight: 900;
    letter-spacing: 0.02em;
    text-decoration: none;
}

.bol-row__number:hover {
    color: var(--pulse-blue);
    cursor: pointer;
}

.bol-link-button {
    appearance: none;
    padding: 0;
    border: 0;
    background: none;
    color: var(--pulse-blue-dark);
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}

.bol-link-button:hover {
    color: var(--pulse-blue);
}

.bol-row__manifest {
    display: block;
    margin-top: 4px;
    color: var(--pulse-muted);
    font-size: 11.5px;
    font-weight: 700;
}

.bol-row__fixed {
    color: var(--pulse-text);
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.45;
}

.bol-search-panel {
    border: 1px solid #dbe4f0;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(13, 20, 55, 0.06);
}

.bol-search-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 20px;
    padding: 10px 16px;
}

.bol-search-card__group {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) 40px;
    align-items: center;
    gap: 12px;
    min-width: 0;
    width: 100%;
}

.bol-search-card__label {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--pulse-text);
    font-size: 14px;
    font-weight: 900;
    white-space: nowrap;
}

.bol-search-card__label svg {
    width: 18px;
    height: 18px;
}

.bol-search-card__group input {
    width: 100%;
    height: 40px;
    border: 1px solid #ccd6e4;
    border-radius: 10px;
    background: #fff;
    color: var(--pulse-text);
    font: inherit;
    font-size: 14px;
    font-weight: 700;
    padding: 0 14px;
}

.bol-search-card__group input:focus {
    outline: 0;
    border-color: var(--pulse-blue);
    box-shadow: 0 0 0 3px rgba(0, 100, 210, 0.12);
}

.bol-new-button {
    min-width: 142px;
    gap: 8px;
}

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

.bol-table-panel__head {
    padding: 20px 22px 4px;
}

.bol-summary-copy .eyebrow {
    margin: 0 0 6px;
    color: var(--pulse-blue);
}

.bol-summary-copy h3 {
    margin: 0;
    color: var(--pulse-text);
    font-size: 20px;
    font-weight: 900;
}

.bol-summary-copy p {
    margin: 8px 0 0;
    color: var(--pulse-muted);
    font-size: 13.5px;
    font-weight: 650;
    line-height: 1.45;
}

.bol-table-panel {
    padding: 0;
    overflow: hidden;
}

.bol-created-banner {
    margin: 0 22px 16px;
}

/* New BOL modal: live piece preview of the autocreation step. */
.bol-new-preview {
    grid-column: 1 / -1;
    width: 100%;
    margin: 0;
    display: inline-flex;
    align-items: flex-start;
    gap: 10px;
    padding: 11px 13px;
    border: 1px solid #c6d7ca;
    border-radius: 9px;
    background: #f3f7f3;
    color: var(--pulse-text);
    font-size: 12px;
    font-weight: 620;
    line-height: 1.45;
}

.bol-new-preview svg {
    width: 17px;
    height: 17px;
    flex: none;
    margin-top: 1px;
    color: var(--pulse-blue);
}

.bol-new-preview--gap {
    border-color: #d6b0a4;
    background: #f8e8e5;
    color: #7e2525;
}

.bol-preview-card {
    align-self: start;
    position: sticky;
    top: 24px;
    margin: 26px;
    padding: 21px;
    border: 1px solid #ced8ca;
    border-radius: 12px;
    background: #f7f8f3;
    box-shadow: none;
}

.bol-preview-card__head {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    margin-bottom: 17px;
}

.bol-preview-card__eye {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid #c9d8cc;
    border-radius: 50%;
    background: #e6efe9;
    color: var(--pulse-blue);
}

.bol-preview-card__eye svg {
    width: 18px;
    height: 18px;
}

.bol-preview-card__head h4 {
    margin: 0;
    color: var(--pulse-text);
    font-size: 15px;
    font-weight: 850;
}

.bol-preview-card__head p {
    margin: 4px 0 0;
    color: var(--pulse-muted);
    font-size: 11.75px;
    font-weight: 580;
    line-height: 1.45;
}

.bol-preview-list {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0 0 13px;
    border-bottom: 1px solid #d8dfd3;
}

.bol-preview-item {
    display: grid;
    grid-template-columns: 32px minmax(92px, 0.72fr) minmax(100px, 1fr);
    align-items: center;
    gap: 10px;
    padding: 9px 0;
}

.bol-preview-item__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border: 1px solid #d7ddd1;
    border-radius: 50%;
    background: #ffffff;
    color: var(--pulse-blue);
}

.bol-preview-item__icon svg {
    width: 17px;
    height: 17px;
}

.bol-preview-item dt {
    color: var(--pulse-text);
    font-size: 11.75px;
    font-weight: 760;
}

.bol-preview-item dd {
    margin: 0;
    color: var(--pulse-text);
    font-size: 11.75px;
    font-weight: 650;
    line-height: 1.35;
    text-align: right;
    overflow-wrap: anywhere;
}

.bol-preview-pieces {
    display: grid;
    gap: 10px;
    padding-top: 14px;
}

.bol-preview-pieces__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.bol-preview-pieces__head h5 {
    margin: 0;
    color: var(--pulse-text);
    font-size: 12.5px;
    font-weight: 850;
}

.bol-preview-pieces__head span {
    color: var(--pulse-blue);
    font-size: 11.5px;
    font-weight: 800;
}

.bol-preview-pieces table {
    width: 100%;
    border-collapse: collapse;
}

.bol-preview-pieces th,
.bol-preview-pieces td {
    padding: 8px 0;
    border-bottom: 1px solid #d8dfd3;
    color: var(--pulse-text);
    font-size: 11.75px;
    font-weight: 700;
    text-align: left;
}

.bol-preview-pieces th:last-child,
.bol-preview-pieces td:last-child {
    width: 72px;
    text-align: right;
}

.bol-preview-pieces tbody tr:last-child td {
    border-bottom: 0;
}

.bol-preview-card__note {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 18px 0 0;
    padding: 13px;
    border: 1px solid #cbdfff;
    border-radius: 10px;
    background: #eef6ff;
    color: #1c3a6e;
    font-size: 12px;
    font-weight: 650;
    line-height: 1.45;
}

.bol-piece-modal {
    width: min(94vw, 940px);
    max-height: 88vh;
    overflow: hidden;
}

.bol-piece-editor__form {
    display: flex;
    max-height: 88vh;
    flex-direction: column;
    min-height: 0;
}

.bol-piece-modal__header {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) 42px;
    align-items: start;
    gap: 16px;
    padding: 22px 26px;
    border-bottom: 1px solid #dbe4f1;
}

.bol-piece-editor__header-icon {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border: 1px solid #d6e4f7;
    border-radius: 12px;
    background: #eff6ff;
    color: var(--pulse-blue);
}

.bol-piece-editor__header-icon svg {
    width: 22px;
    height: 22px;
}

.bol-piece-editor__heading {
    min-width: 0;
}

.bol-piece-editor__heading .eyebrow {
    margin: 0 0 4px;
}

.bol-piece-modal__header h3 {
    margin: 0;
    color: var(--pulse-text);
    font-size: 24px;
    font-weight: 900;
}

.bol-piece-modal__header p:not(.eyebrow) {
    margin: 6px 0 0;
    color: var(--pulse-muted);
    font-size: 13px;
    font-weight: 650;
    line-height: 1.4;
}

.bol-piece-editor__scroll {
    display: grid;
    gap: 24px;
    min-height: 0;
    padding: 20px 26px 26px;
    overflow: auto;
}

.bol-piece-editor__form-error {
    margin: 0;
}

.bol-piece-modal__summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 12px 14px;
    border: 1px solid #cfe0f7;
    border-radius: 12px;
    background: #f6faff;
}

.bol-piece-editor__owner {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 11px;
}

.bol-piece-editor__owner strong {
    overflow: hidden;
    color: var(--pulse-text);
    font-size: 13.5px;
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bol-piece-editor__avatar {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    place-items: center;
    border-radius: 999px;
    background: #dfedff;
    color: #195da9;
    font-size: 12px;
    font-weight: 900;
}

.bol-piece-modal__summary > strong {
    color: var(--pulse-text);
    font-size: 13px;
    font-weight: 900;
    text-align: right;
}

.bol-piece-editor__section {
    display: grid;
    gap: 14px;
    min-width: 0;
}

.bol-piece-editor__section-heading {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.bol-piece-editor__section-heading > svg {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    margin-top: 1px;
    color: var(--pulse-blue);
}

.bol-piece-editor__section-heading h4 {
    margin: 0;
    color: var(--pulse-text);
    font-size: 17px;
    font-weight: 900;
}

.bol-piece-editor__section-heading p {
    margin: 5px 0 0;
    color: var(--pulse-muted);
    font-size: 12.5px;
    font-weight: 650;
    line-height: 1.45;
}

.bol-piece-editor__section-error {
    margin: 0;
    color: #b42318;
    font-size: 12.5px;
    font-weight: 750;
}

.bol-piece-editor__labels,
.bol-piece-editor__row {
    display: grid;
    grid-template-columns: minmax(180px, 1.25fr) minmax(100px, 0.72fr) minmax(130px, 0.92fr) minmax(130px, 0.92fr) 48px;
    gap: 12px;
}

.bol-piece-editor__labels {
    align-items: end;
    color: #334155;
    font-size: 12px;
    font-weight: 850;
}

.bol-piece-editor__rows {
    display: grid;
    gap: 12px;
}

.bol-piece-editor__row {
    align-items: start;
}

.bol-piece-editor__row--error {
    padding-left: 8px;
    border-left: 2px solid #d92d20;
}

.bol-piece-editor__row .pkg-field {
    position: relative;
    min-width: 0;
    gap: 6px;
}

.bol-piece-editor__field-label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.bol-piece-editor__row input,
.bol-piece-editor__row select,
.bol-piece-editor__charge-fields input {
    min-height: 48px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 700;
}

.bol-piece-editor__row .bol-piece-breakdown__remove {
    width: 44px;
    height: 48px;
}

.bol-piece-editor__row .bol-piece-breakdown__remove svg {
    width: 19px;
    height: 19px;
}

.bol-piece-editor__add {
    justify-self: start;
    min-height: 40px;
    gap: 7px;
    border-color: #b8d3f6;
    color: #145ca8;
}

.bol-piece-editor__add svg {
    width: 17px;
    height: 17px;
}

.bol-piece-editor__preview {
    margin: 0;
    min-height: 48px;
    align-items: center;
}

.bol-piece-editor__charges {
    padding-top: 22px;
    border-top: 1px solid #dbe4f1;
}

.bol-piece-editor__charge-fields {
    display: grid;
    gap: 13px;
}

.bol-piece-editor__charge-fields .pkg-field {
    gap: 7px;
}

.bol-piece-editor__currency {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    min-width: 0;
    overflow: hidden;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: #ffffff;
}

.bol-piece-editor__currency:focus-within {
    border-color: var(--pulse-blue);
    box-shadow: 0 0 0 4px rgba(0, 100, 210, 0.12);
}

.bol-piece-editor__currency > span {
    display: grid;
    place-items: center;
    border-right: 1px solid #e2e8f0;
    background: #f8fafc;
    color: #64748b;
    font-size: 14px;
    font-weight: 850;
}

.bol-piece-editor__currency input {
    width: 100%;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.bol-piece-editor__currency input:focus {
    border: 0;
    box-shadow: none;
    outline: 0;
}

.bol-piece-modal__footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    padding: 16px 26px;
    border-top: 1px solid #dbe4f1;
    background: #fbfdff;
}

.bol-piece-modal__footer .button {
    min-height: 44px;
    padding-right: 17px;
    padding-left: 17px;
}

.bol-piece-modal__footer .button--primary {
    min-width: 142px;
    gap: 8px;
}

.bol-piece-modal__footer .button svg {
    width: 18px;
    height: 18px;
}

.bol-piece-modal__footer [data-loading="true"]::before {
    width: 15px;
    height: 15px;
    border: 2px solid rgba(255, 255, 255, 0.45);
    border-top-color: #ffffff;
    border-radius: 999px;
    content: "";
    animation: bol-piece-editor-spin 700ms linear infinite;
}

.bol-piece-modal__footer [data-loading="true"] > svg {
    display: none;
}

@keyframes bol-piece-editor-spin {
    to { transform: rotate(360deg); }
}

.bol-preview-card__note span {
    display: inline-flex;
    flex: none;
    color: var(--pulse-blue);
}

.bol-preview-card__note svg {
    width: 18px;
    height: 18px;
}

.bol-new-modal__footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 11px;
    padding: 15px 24px;
    border-top: 1px solid var(--pulse-border);
    background: #faf7f0;
}

.bol-new-modal__footer > span {
    margin-right: auto;
    color: #6b768e;
    font-size: 12px;
    font-weight: 650;
    line-height: 1.4;
}

.bol-new-modal__footer .button {
    min-height: 44px;
    padding: 10px 18px;
    border-radius: 9px;
    font-size: 13px;
    font-weight: 780;
}

.bol-new-modal__footer .button--ghost {
    min-width: 104px;
}

.bol-new-modal__footer [data-bol-submit] {
    min-width: 166px;
    white-space: nowrap;
    gap: 8px;
    border-color: var(--pulse-gold);
    background: var(--pulse-gold);
    color: #ffffff;
    box-shadow: 0 7px 16px rgba(139, 98, 29, 0.18);
}

.bol-new-modal__footer [data-bol-submit]:not(:disabled):hover {
    filter: brightness(0.91);
}

.bol-new-modal__footer [data-bol-submit] svg {
    width: 18px;
    height: 18px;
}

.bol-reset-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: 1px solid var(--pulse-border);
    border-radius: 12px;
    background: #fff;
    color: var(--pulse-muted);
    text-decoration: none;
    transition: background 140ms ease, border-color 140ms ease, color 140ms ease;
}

.bol-reset-button:hover {
    border-color: #c9d5e4;
    background: #f7f9fd;
    color: var(--pulse-blue);
}

.bol-reset-button--idle,
.bol-reset-button--idle:hover {
    border-color: #e3e9f2;
    background: #f8fafc;
    color: #aeb8c8;
    cursor: default;
}

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

.bol-row__address {
    min-width: 178px;
    color: var(--pulse-muted);
}

.bol-row__num {
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* Editable cells read as text until touched, so the row stays scannable. */
.bol-cell {
    width: 100%;
    min-width: 112px;
    padding: 7px 9px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--pulse-text);
    font: inherit;
    font-size: 12.5px;
    font-weight: 600;
    resize: none;
}

.bol-cell:hover {
    background: #fbfcfe;
    box-shadow: inset 0 0 0 1px var(--pulse-border);
}

.bol-cell:focus {
    outline: none;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(0, 100, 210, 0.12);
}

.bol-cell--address,
.bol-cell--goods {
    min-width: 184px;
    line-height: 1.45;
}

.bol-cell--money {
    min-width: 92px;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.bol-cell--gap {
    background: #fdf3ef;
    box-shadow: inset 0 0 0 1px rgba(178, 60, 23, 0.35);
}

.bol-rows-note {
    margin: 14px 24px 0;
}

/* --- Pre-manifest charges on detail --------------------------------------- */
.bol-charges {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px;
    margin: 8px 0 0;
}

.bol-charges__cell {
    padding: 10px 12px;
    border: 1px solid var(--pulse-border);
    border-radius: 10px;
    background: #f7f9fd;
}

.bol-charges__cell dt {
    color: var(--pulse-muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.bol-charges__cell dd {
    margin: 4px 0 0;
    color: var(--pulse-text);
    font-size: 14px;
    font-weight: 800;
}

.bol-charges__link {
    display: inline-block;
    margin-top: 10px;
    color: var(--pulse-blue);
    font-size: 12.5px;
    font-weight: 700;
}

/* The shipper name must not truncate: "Ideal Freight Consolidators" is the
   default on most rows, and a clipped shipper is unreadable paperwork. */
.bol-cell--name {
    min-width: 196px;
}

@media (max-width: 760px) {
    .bol-piece-modal {
        width: min(96vw, 940px);
        max-height: 92vh;
    }

    .bol-piece-editor__form {
        max-height: 92vh;
    }

    .bol-piece-modal__header {
        grid-template-columns: 42px minmax(0, 1fr) 40px;
        gap: 12px;
        padding: 18px;
    }

    .bol-piece-editor__header-icon {
        width: 42px;
        height: 42px;
    }

    .bol-piece-modal__header h3 {
        font-size: 21px;
    }

    .bol-piece-editor__scroll {
        gap: 20px;
        padding: 18px;
    }

    .bol-piece-modal__summary {
        align-items: flex-start;
        flex-direction: column;
        gap: 10px;
    }

    .bol-piece-modal__summary > strong {
        padding-left: 49px;
        text-align: left;
    }

    .bol-piece-editor__labels {
        display: none;
    }

    .bol-piece-editor__row {
        position: relative;
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
        padding: 16px 52px 16px 0;
        border-top: 1px solid #e2e8f0;
    }

    .bol-piece-editor__row--error {
        padding-left: 10px;
        border-left: 2px solid #d92d20;
    }

    .bol-piece-editor__field-label {
        position: static;
        width: auto;
        height: auto;
        overflow: visible;
        clip: auto;
        clip-path: none;
        color: #334155;
        font-size: 12px;
        font-weight: 850;
        white-space: normal;
    }

    .bol-piece-editor__row .bol-piece-breakdown__remove {
        position: absolute;
        top: 16px;
        right: 0;
        width: 44px;
        height: 44px;
    }

    .bol-piece-modal__footer {
        padding: 14px 18px;
    }

    .bol-piece-modal__footer .button {
        flex: 1 1 0;
        justify-content: center;
    }

    .bol-search-card {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .bol-search-card__group {
        grid-template-columns: 1fr 40px;
    }

    .bol-search-card__label {
        grid-column: 1 / -1;
    }

    .bol-new-button {
        justify-content: center;
        width: 100%;
    }

    .bol-new-modal {
        width: min(96vw, 1220px);
        max-height: 92vh;
    }

    .bol-new-modal__header {
        grid-template-columns: 46px minmax(0, 1fr) 40px;
        gap: 12px;
        padding: 18px;
    }

    .bol-new-modal__icon {
        width: 46px;
        height: 46px;
    }

    .bol-new-modal__title h3 {
        font-size: 22px;
    }

    .bol-new-modal__columns {
        grid-template-columns: 1fr;
    }

    .bol-new-modal__form {
        border-right: 0;
        padding: 18px;
    }

    .bol-preview-card {
        position: static;
        margin: 0 18px 18px;
    }

    .bol-piece-breakdown__labels {
        display: none;
    }

    .bol-piece-breakdown__row {
        grid-template-columns: repeat(3, minmax(0, 1fr)) 42px;
        gap: 9px;
        padding-top: 14px;
        border-top: 1px solid var(--pulse-border);
    }

    .bol-piece-breakdown__row .pkg-field:first-child {
        grid-column: 1 / -1;
    }

    .bol-piece-breakdown__field-label {
        position: static;
        width: auto;
        height: auto;
        overflow: visible;
        clip: auto;
        clip-path: none;
        color: var(--pulse-muted);
        font-size: 10.5px;
        font-weight: 760;
        letter-spacing: 0.045em;
        white-space: normal;
        text-transform: uppercase;
    }

    .bol-piece-breakdown__remove {
        align-self: end;
        width: 42px;
        margin-bottom: 3px;
    }

    .bol-piece-breakdown__actions {
        grid-template-columns: 1fr;
    }

    .bol-preview-item {
        grid-template-columns: 34px minmax(0, 1fr);
    }

    .bol-preview-item dd {
        grid-column: 2;
        text-align: left;
    }

    .bol-new-modal__footer {
        align-items: stretch;
        flex-wrap: wrap;
        padding: 16px 18px;
    }

    .bol-new-modal__footer > span {
        flex-basis: 100%;
        margin-right: 0;
    }
}

/* =========================================================================
   Phase 5 · Manifest worksheet (index, worksheet, assignment)
   The worksheet is the operational spreadsheet staff already know, so it is a
   wide table first. Read-only cells resolve from the BOL; editable cells are the
   final-manifest fields staff own.
   ========================================================================= */
.manifest-created-banner {
    margin: 0 0 6px;
}

/* --- Index table ---------------------------------------------------------- */
.manifest-index-panel {
    overflow: hidden;
}

.manifest-index-toolbar {
    align-items: flex-start;
    border-bottom: 1px solid var(--pulse-border);
}

.manifest-index-filters {
    border-bottom: 1px solid var(--pulse-border);
    border-radius: 0;
    box-shadow: none;
    padding: 14px 18px;
}

.manifest-index-table {
    min-width: 0;
    table-layout: fixed;
}

.manifest-index-col-booking {
    width: 20%;
}

.manifest-index-col-vessel {
    width: 16%;
}

.manifest-index-col-container {
    width: 15%;
}

.manifest-index-col-date {
    width: 14%;
}

.manifest-index-col-cargo {
    width: 13%;
}

.manifest-index-col-status {
    width: 15%;
}

.manifest-index-col-actions {
    width: 7%;
}

.manifest-index__new {
    display: inline-flex;
    width: 38px;
    height: 38px;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    border: 1px solid #b9d4fb;
    border-radius: 10px;
    background: #eff6ff;
    color: var(--pulse-blue);
    padding: 0;
    cursor: pointer;
    transition: background-color 140ms ease, border-color 140ms ease, color 140ms ease;
}

.manifest-index__new svg {
    width: 18px;
    height: 18px;
}

.manifest-index__new:hover {
    border-color: var(--pulse-blue);
    background: var(--pulse-blue);
    color: #ffffff;
}

.manifest-index__new:focus-visible {
    outline: 2px solid rgba(0, 100, 210, 0.32);
    outline-offset: 2px;
}

.manifest-identity {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.manifest-identity__id {
    color: var(--pulse-blue-dark);
    font-size: 14.5px;
    font-weight: 900;
    letter-spacing: 0.01em;
    text-decoration: none;
}

.manifest-identity__id:hover {
    color: var(--pulse-blue);
}

.manifest-identity__sub,
.manifest-vessel__container {
    color: var(--pulse-muted);
    font-size: 12px;
    font-weight: 700;
}

.manifest-vessel {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.manifest-vessel__name {
    color: var(--pulse-text);
    font-size: 13px;
    font-weight: 800;
}

.manifest-date,
.manifest-count {
    color: var(--pulse-text);
    font-size: 12.5px;
    font-weight: 700;
}

/* --- Detail: header + worksheet layout ------------------------------------ */
.manifest-detail {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.manifest-feedback {
    margin: 0;
}

/* The booking record is authoritative context for the worksheet. It reads as
   a secondary page header, with no input-like styling or edit affordance. */
.booking-summary {
    overflow: hidden;
    border: 1px solid #8ebdf8;
    border-top: 3px solid var(--pulse-blue);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 14px 34px rgba(29, 61, 108, 0.13);
}

.booking-summary__header {
    position: relative;
    display: flex;
    min-height: 78px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-bottom: 1px solid #d8e5f6;
    background: #f2f7ff;
    padding: 20px 32px;
}

.booking-summary__header::after {
    position: absolute;
    right: -6%;
    bottom: -24px;
    left: -6%;
    height: 42px;
    border-radius: 50% 50% 0 0;
    background: rgba(208, 226, 252, 0.58);
    content: "";
}

.booking-summary__header h2 {
    position: relative;
    z-index: 1;
    margin: 0;
    color: var(--pulse-navy);
    font-size: 27px;
    font-weight: 850;
    line-height: 1.2;
    text-align: center;
    overflow-wrap: anywhere;
}

.booking-summary__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding: 0 32px;
}

.booking-summary__item {
    min-width: 0;
    padding: 24px 30px 25px;
}

.booking-summary__item--vessel-number,
.booking-summary__item--container,
.booking-summary__item--seal-two,
.booking-summary__item--shipping-date {
    border-left: 1px solid #dbe4f0;
}

.booking-summary__item--seal-one,
.booking-summary__item--seal-two,
.booking-summary__item--shipping-date {
    border-top: 1px solid #dbe4f0;
}

.booking-summary__label {
    display: block;
    margin-bottom: 8px;
    color: #59677d;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.055em;
    line-height: 1.3;
    text-transform: uppercase;
}

.booking-summary__value {
    display: block;
    min-width: 0;
    color: var(--pulse-navy);
    font-size: 17px;
    font-weight: 800;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.booking-summary__value--date {
    display: flex;
    align-items: center;
    gap: 9px;
}

.booking-summary__value--date svg {
    width: 19px;
    height: 19px;
    flex: 0 0 auto;
    color: var(--pulse-blue-dark);
}

/* --- Worksheet toolbar ---------------------------------------------------- */
.manifest-worksheet-panel {
    position: relative;
    padding: 0;
    overflow: visible;
}

.manifest-worksheet__toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px 20px;
    padding: 16px 22px;
}

.manifest-worksheet__copy h3 {
    margin: 0;
    color: var(--pulse-text);
    font-size: 16px;
    font-weight: 900;
}

.manifest-worksheet__copy p {
    margin: 4px 0 0;
    color: var(--pulse-muted);
    font-size: 12.5px;
    font-weight: 650;
}

/* Row/piece counts read as inline worksheet facts, not dashboard metrics. */
.manifest-worksheet__counts {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.manifest-worksheet__header-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 10px 14px;
}

.manifest-worksheet__status-action {
    display: inline-flex;
    margin: 0;
}

.manifest-count-chip {
    display: inline-flex;
    align-items: baseline;
    gap: 5px;
    padding: 5px 10px;
    border: 1px solid var(--pulse-border);
    border-radius: 999px;
    background: #f8fafd;
    color: var(--pulse-muted);
    font-size: 11.5px;
    font-weight: 750;
}

.manifest-count-chip strong {
    color: var(--pulse-text);
    font-size: 13px;
    font-weight: 900;
}

/* A data-grid style toolbar band sitting directly on top of the sheet. */
.manifest-worksheet__actionbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 16px;
    padding: 10px 22px;
    border-top: 1px solid var(--pulse-border);
    border-bottom: 1px solid var(--pulse-border);
    background: #f8fafd;
}

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

.manifest-worksheet__actions--end {
    justify-content: flex-end;
}

.manifest-worksheet__edit-actions {
    min-height: 40px;
}

.manifest-worksheet__save-status {
    min-width: 0;
    color: #64748b;
    font-size: 11.5px;
    font-weight: 700;
    white-space: nowrap;
}

.manifest-worksheet__save-status[data-tone="error"] {
    color: #b42318;
}

.manifest-worksheet__save-status[data-tone="saved"] {
    color: #067647;
}

.manifest-worksheet__actions form {
    display: inline-flex;
    gap: 8px;
    margin: 0;
}

.worksheet-bulk-remove-form {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin: 0;
}

.worksheet-selection-status {
    color: #5c687a;
    font-size: 12px;
    font-weight: 750;
    white-space: nowrap;
}

.worksheet-selection-status[hidden] {
    display: none;
}

.worksheet-bulk-remove {
    display: inline-flex;
    width: 38px;
    min-width: 38px;
    height: 38px;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid #edcaca;
    border-radius: 8px;
    background: #fff;
    color: #b42318;
}

.worksheet-bulk-remove:hover:not(:disabled) {
    border-color: #dc8c87;
    background: #fff6f5;
    color: #912018;
}

.worksheet-bulk-remove:disabled {
    border-color: #d9e1eb;
    background: #f8fafc;
    color: #98a2b3;
    cursor: not-allowed;
}

.worksheet-bulk-remove:focus-visible {
    outline: 2px solid #175cd3;
    outline-offset: 2px;
}

.worksheet-bulk-remove svg {
    width: 17px;
    height: 17px;
}

.worksheet-row-checkbox {
    display: block;
    width: 16px;
    height: 16px;
    margin: 0;
    accent-color: var(--pulse-blue);
    cursor: pointer;
}

.worksheet-row-checkbox:focus-visible {
    outline: 2px solid #175cd3;
    outline-offset: 2px;
}

.worksheet-selection-cell {
    position: relative;
    width: 42px;
    min-width: 40px;
    max-width: 44px;
    padding: 0 !important;
    border-right: 1px solid #e1e8f1 !important;
    text-align: center;
    vertical-align: middle !important;
}

.worksheet-selection-target {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color 140ms ease;
}

.worksheet-selection-target:hover {
    background: rgba(226, 237, 251, 0.58);
}

.worksheet-selection-target:focus-within {
    box-shadow: inset 0 0 0 2px rgba(23, 92, 211, 0.24);
}

.manifest-export {
    display: inline-flex;
    gap: 8px;
}

.manifest-export .manifest-export__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    min-width: 40px;
    height: 40px;
    padding: 0;
    border: 1px solid #cfd9e8;
    border-radius: 8px;
    background: #fff;
    color: #344054;
}

.manifest-export .manifest-export__btn:hover {
    border-color: #aebdd0;
    background: #f5f8fc;
}

.manifest-export .manifest-export__btn:focus-visible {
    outline: 2px solid #175cd3;
    outline-offset: 2px;
}

.manifest-export__icon {
    width: 26px;
    height: 26px;
    overflow: visible;
    shape-rendering: geometricPrecision;
}

.manifest-export__document {
    fill: #fff;
    stroke: #475467;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.manifest-export__document-fold {
    fill: none;
    stroke: #475467;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.manifest-export__label {
    fill: #475467;
    stroke: none;
}

.manifest-export__label-text {
    fill: #fff;
    font-family: Arial, sans-serif;
    font-weight: 900;
    letter-spacing: 0;
    text-anchor: middle;
}

.manifest-export__label-text--pdf {
    font-size: 7px;
}

.manifest-export__label-text--excel {
    font-size: 5.8px;
}

.manifest-export__download {
    fill: none;
    stroke-width: 2.2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.manifest-export__btn--pdf .manifest-export__label {
    fill: #d92d20;
}

.manifest-export__btn--pdf .manifest-export__download {
    stroke: #d92d20;
}

.manifest-export__btn--excel .manifest-export__label {
    fill: #079455;
}

.manifest-export__btn--excel .manifest-export__download {
    stroke: #079455;
}

/* --- Worksheet table ------------------------------------------------------ */
.manifest-worksheet-wrap {
    overflow-x: auto;
}

.manifest-worksheet {
    width: 100%;
    min-width: 1380px;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
}

.manifest-worksheet th {
    border-bottom: 1px solid var(--pulse-border);
    white-space: normal;
    color: #59677d;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.025em;
    line-height: 1.2;
    text-transform: uppercase;
}

.manifest-worksheet td {
    border-bottom: 1px solid var(--pulse-border);
    vertical-align: top;
    padding: 10px 8px;
}

/* Spreadsheet cues: a banded column-header row and hairline column rules, so
   the sheet reads as a worksheet grid rather than a generic list table. */
.manifest-worksheet thead th {
    background: #f4f7fb;
    padding: 10px 8px;
}

.manifest-worksheet th:not(.manifest-scroll-gutter) + th:not(.manifest-scroll-gutter),
.manifest-worksheet .manifest-cell + .manifest-cell {
    border-left: 1px solid #eef2f8;
}

.manifest-worksheet tbody tr:hover .manifest-cell--fixed {
    background: #fbfcfe;
}

.manifest-row--source .manifest-cell--fixed {
    background: #f8fbff;
}

.manifest-row--source-rac .manifest-cell--fixed {
    background: #edf4ff;
}

.manifest-row--source-quikship .manifest-cell--fixed {
    background: #f4faf6;
}

.manifest-worksheet tbody tr.manifest-row--source-rac:hover .manifest-cell--fixed {
    background: #e4effd;
}

.manifest-worksheet tbody tr.manifest-row--source-quikship:hover .manifest-cell--fixed {
    background: #ecf7f1;
}

.manifest-cell__source-number {
    display: block;
    color: #17365d;
    font-weight: 800;
}

.manifest-source-edit {
    white-space: nowrap;
}

.manifest-worksheet .manifest-scroll-gutter {
    width: 20px;
    min-width: 20px;
    padding: 0;
    pointer-events: none;
}

.manifest-col-gutter {
    width: 20px;
}

.manifest-col-select {
    width: 42px;
}

.manifest-col-bol_number {
    width: 5.5%;
}

.manifest-col-shipper_name {
    width: 8%;
}

.manifest-col-shipper_address {
    width: 12%;
}

.manifest-col-consignee_name {
    width: 9%;
}

.manifest-col-consignee_address {
    width: 13%;
}

.manifest-col-pieces {
    width: 5%;
}

.manifest-col-package_type {
    width: 8%;
}

.manifest-col-description {
    width: 12%;
}

.manifest-col-volume,
.manifest-col-weight {
    width: 5.5%;
}

.manifest-col-agency_fee {
    width: 6.5%;
}

.manifest-col-ocean_freight {
    width: 6%;
}

.manifest-col-total {
    width: 5.5%;
}

.manifest-col-actions {
    width: 74px;
}

/* The embedded Ideal worksheet uses the full card width. Its historical
   percentage columns previously totaled 100% before the action and gutter
   columns were added, which guaranteed horizontal overflow. */
.manifest-worksheet-panel .manifest-worksheet-wrap {
    overflow: visible;
}

.manifest-worksheet-panel .manifest-worksheet {
    min-width: 0;
}

.manifest-worksheet-panel .manifest-col-gutter,
.manifest-worksheet-panel .manifest-scroll-gutter {
    width: 0;
    min-width: 0;
}

.manifest-worksheet-panel .manifest-col-select { width: 42px; }
.manifest-worksheet-panel .manifest-col-bol_number { width: 4.5%; }
.manifest-worksheet-panel .manifest-col-shipper_name { width: 7%; }
.manifest-worksheet-panel .manifest-col-shipper_address { width: 9.5%; }
.manifest-worksheet-panel .manifest-col-consignee_name { width: 9%; }
.manifest-worksheet-panel .manifest-col-consignee_address { width: 9.5%; }
.manifest-worksheet-panel .manifest-col-pieces { width: 4.5%; }
.manifest-worksheet-panel .manifest-col-package_type { width: 7%; }
.manifest-worksheet-panel .manifest-col-description { width: 10%; }
.manifest-worksheet-panel .manifest-col-volume,
.manifest-worksheet-panel .manifest-col-weight { width: 5.5%; }
.manifest-worksheet-panel .manifest-col-agency_fee { width: 7%; }
.manifest-worksheet-panel .manifest-col-ocean_freight { width: 6%; }
.manifest-worksheet-panel .manifest-col-total { width: 6%; }
.manifest-worksheet-panel .manifest-col-actions { width: 5%; }

.manifest-column--select,
.manifest-cell--select {
    padding-right: 0 !important;
    padding-left: 0 !important;
    text-align: center;
    vertical-align: middle !important;
}

.manifest-worksheet thead .manifest-column--bol_number,
.manifest-worksheet tbody .manifest-cell--bol_number,
.partner-worksheet-table thead .partner-column--partner_bol_number,
.partner-worksheet-table tbody .partner-column--partner_bol_number {
    padding-right: 4px;
    padding-left: 4px;
    text-align: center !important;
    vertical-align: middle !important;
}

.manifest-cell--bol_number .manifest-cell__bol,
.manifest-cell--bol_number .manifest-cell__source-number,
.partner-column--partner_bol_number .partner-cell-value {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-weight: 750;
}

.manifest-worksheet-panel .manifest-worksheet thead th {
    padding-right: 8px;
    padding-left: 8px;
    font-size: 10.5px;
}

.manifest-worksheet-panel .manifest-worksheet td {
    padding: 9px 7px;
    vertical-align: middle;
}

.manifest-worksheet-panel .manifest-cell--fixed span,
.manifest-worksheet-panel .manifest-cell-display,
.manifest-worksheet-panel .manifest-cell__bol {
    font-size: 11.5px;
    overflow-wrap: anywhere;
}

.manifest-worksheet-panel .manifest-input {
    min-height: 34px;
    padding: 6px 5px;
    font-size: 11.5px;
}

.manifest-worksheet-panel textarea.manifest-input {
    min-height: 48px;
}

.manifest-worksheet-panel .manifest-cell--actions {
    padding-right: 5px;
    padding-left: 5px;
    overflow: visible;
    text-align: center;
}

.manifest-worksheet-panel .manifest-action-menu .pkg-menu-trigger {
    width: 32px;
    height: 32px;
    border-radius: 8px;
}

.manifest-worksheet-panel .manifest-action-menu .pkg-menu-trigger svg {
    width: 17px;
    height: 17px;
}

.manifest-worksheet-panel .manifest-action-menu .pkg-action-menu {
    right: 0;
}

@media (max-width: 900px) {
    .manifest-worksheet-panel .manifest-worksheet-wrap {
        overflow-x: auto;
    }

    .manifest-worksheet-panel .manifest-worksheet {
        min-width: 1380px;
    }

    .manifest-worksheet-panel .manifest-col-gutter,
    .manifest-worksheet-panel .manifest-scroll-gutter {
        width: 10px;
        min-width: 10px;
    }
}

.manifest-row--gap {
    background: #fffaf7;
}

.manifest-cell--fixed span,
.manifest-cell__bol {
    color: var(--pulse-text);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.35;
}

.manifest-cell__bol {
    color: var(--pulse-blue-dark);
    font-weight: 900;
    text-decoration: none;
}

.manifest-cell__bol:hover {
    color: var(--pulse-blue);
}

.manifest-cell--editable {
    cursor: text;
}

.manifest-cell-display {
    display: block;
    width: 100%;
    min-height: 34px;
    margin: -4px -5px;
    padding: 4px 5px;
    appearance: none;
    border: 1px solid transparent;
    border-radius: 5px;
    background: transparent;
    color: var(--pulse-text);
    cursor: text;
    font: inherit;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.35;
    text-align: inherit;
    white-space: normal;
    overflow-wrap: anywhere;
    transition: background-color 140ms ease, border-color 140ms ease;
}

.manifest-cell-display[hidden] {
    display: none;
}

.manifest-cell-display:hover {
    border-color: #dce5f1;
    background: rgba(241, 246, 252, 0.8);
}

.manifest-cell-display:focus-visible {
    outline: 2px solid rgba(0, 100, 210, 0.28);
    outline-offset: 1px;
}

.manifest-worksheet-panel .manifest-row.is-modified td {
    background: #f5f8fc;
}

.manifest-worksheet-panel .manifest-row.is-modified:hover td {
    background: #f1f6fc;
}

.manifest-worksheet-panel .manifest-row.is-modified .manifest-cell--actions {
    background: #f5f8fc;
}

.manifest-worksheet-panel .manifest-row.is-selected td {
    background: #eef5ff;
}

.manifest-worksheet-panel .manifest-row.is-selected:hover td {
    background: #e8f1fd;
}

.manifest-cell.is-modified {
    box-shadow: inset 3px 0 0 #8aa9cc;
}

.manifest-cell.is-editing {
    background: #f7faff !important;
    box-shadow: inset 0 0 0 2px rgba(60, 111, 168, 0.38);
}

.manifest-input {
    width: 100%;
    min-width: 0;
    min-height: 38px;
    border: 1px solid #ccd6e4;
    border-radius: 7px;
    background: #fff;
    color: var(--pulse-text);
    font: inherit;
    font-size: 12px;
    line-height: 1.25;
    font-weight: 650;
    padding: 7px 8px;
    resize: vertical;
}

textarea.manifest-input {
    min-height: 54px;
}

.manifest-input:focus {
    outline: 0;
    border-color: var(--pulse-blue);
    box-shadow: 0 0 0 3px rgba(0, 100, 210, 0.12);
}

.manifest-input--active,
textarea.manifest-input--active {
    width: 100%;
    min-height: 34px;
    margin: 0;
    padding: 3px 2px;
    border: 1px solid transparent;
    border-radius: 2px;
    background: transparent;
    color: var(--pulse-text);
    font-size: 11.5px;
    font-weight: 600;
    line-height: 1.35;
    box-shadow: none;
    resize: none;
    overflow: hidden;
}

.manifest-input--active:focus {
    outline: 0;
    border-color: rgba(111, 145, 184, 0.3);
    box-shadow: none;
}

.manifest-cell--volume,
.manifest-cell--weight,
.manifest-cell--agency_fee,
.manifest-cell--ocean_freight,
.manifest-cell--total {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.manifest-cell--volume .manifest-input,
.manifest-cell--weight .manifest-input,
.manifest-cell--agency_fee .manifest-input,
.manifest-cell--total .manifest-input {
    min-width: 0;
    text-align: right;
}

.manifest-cell--actions {
    text-align: right;
}

@media (prefers-reduced-motion: reduce) {
    .manifest-cell-display {
        transition: none;
    }
}

.manifest-remove {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    appearance: none;
    border: 1px solid #f2c2b3;
    border-radius: 8px;
    background: #fff;
    color: #b23c17;
    font-size: 11.5px;
    font-weight: 800;
    padding: 6px 9px;
    cursor: pointer;
}

.manifest-remove svg {
    width: 13px;
    height: 13px;
}

.manifest-remove:hover {
    background: #fdf3ef;
}

.manifest-totals td {
    border-top: 2px solid var(--pulse-border);
    border-bottom: 0;
    padding: 11px 4px;
    font-weight: 900;
    color: var(--pulse-text);
    white-space: nowrap;
}

.manifest-totals__label {
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 11.5px;
    color: var(--pulse-muted);
}

.manifest-totals__num,
.manifest-totals__pieces {
    font-size: 12.5px;
}

.manifest-worksheet__note {
    margin: 0;
    padding: 14px 22px 20px;
    color: var(--pulse-muted);
    font-size: 12px;
    font-weight: 650;
}

.manifest-empty {
    margin: 8px 22px 28px;
}

.manifest-fullscreen-backdrop {
    padding: 2vh 1vw;
    background: rgba(7, 14, 32, 0.64);
    backdrop-filter: blur(7px);
}

.manifest-fullscreen {
    width: min(1880px, 98vw);
    max-height: 94vh;
    height: 94vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(203, 214, 229, 0.9);
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 28px 80px rgba(12, 20, 43, 0.3);
}

.manifest-fullscreen__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 18px 24px;
    border-bottom: 1px solid var(--pulse-border);
    background: #ffffff;
}

.manifest-fullscreen__titlebar {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.manifest-fullscreen__icon {
    width: 46px;
    height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    border: 1px solid #c7dcfb;
    border-radius: 12px;
    background: #eff6ff;
    color: var(--pulse-blue);
}

.manifest-fullscreen__icon svg {
    width: 24px;
    height: 24px;
}

.manifest-fullscreen__header .eyebrow {
    margin: 0 0 5px;
    color: var(--pulse-blue);
}

.manifest-fullscreen__header h2 {
    margin: 0;
    color: var(--pulse-text);
    font-size: 24px;
    font-weight: 900;
}

.manifest-fullscreen__header p {
    margin: 5px 0 0;
    color: var(--pulse-muted);
    font-size: 13px;
    font-weight: 700;
}

.manifest-fullscreen__close {
    flex: 0 0 auto;
}

.manifest-fullscreen__body {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    background: #f8fbff;
}

.manifest-fullscreen .manifest-worksheet-wrap {
    flex: 0 0 auto;
    min-height: 0;
    max-height: none;
    border-radius: 0;
    background: #ffffff;
    overflow-x: auto;
}

.manifest-fullscreen .manifest-worksheet {
    width: 100%;
    min-width: 1380px;
    table-layout: fixed;
}

.manifest-fullscreen .manifest-worksheet th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #fdfefe;
    padding: 10px 8px;
    white-space: normal;
    color: #59677d;
    font-size: 10.5px;
    font-weight: 900;
    letter-spacing: 0.025em;
    line-height: 1.22;
    text-transform: uppercase;
}

.manifest-fullscreen .manifest-worksheet td {
    padding: 10px 8px;
    border-right: 1px solid #edf2f8;
}

.manifest-fullscreen .manifest-col-gutter {
    width: 10px;
}

.manifest-fullscreen .manifest-col-bol_number {
    width: 5.5%;
}

.manifest-fullscreen .manifest-col-shipper_name {
    width: 8%;
}

.manifest-fullscreen .manifest-col-shipper_address {
    width: 12%;
}

.manifest-fullscreen .manifest-col-consignee_name {
    width: 9%;
}

.manifest-fullscreen .manifest-col-consignee_address {
    width: 13%;
}

.manifest-fullscreen .manifest-col-pieces {
    width: 5%;
}

.manifest-fullscreen .manifest-col-package_type {
    width: 8%;
}

.manifest-fullscreen .manifest-col-description {
    width: 12%;
}

.manifest-fullscreen .manifest-col-volume,
.manifest-fullscreen .manifest-col-weight {
    width: 5.5%;
}

.manifest-fullscreen .manifest-col-agency_fee {
    width: 6.5%;
}

.manifest-fullscreen .manifest-col-ocean_freight {
    width: 6%;
}

.manifest-fullscreen .manifest-col-total {
    width: 5.5%;
}

.manifest-fullscreen .manifest-col-actions {
    width: 5%;
}

.manifest-fullscreen .manifest-cell--fixed span,
.manifest-fullscreen .manifest-cell__bol {
    font-size: 12px;
    line-height: 1.35;
}

.manifest-fullscreen .manifest-input {
    min-width: 0;
    min-height: 38px;
    border-radius: 7px;
    font-size: 12px;
    line-height: 1.25;
    padding: 7px 8px;
}

.manifest-fullscreen textarea.manifest-input {
    min-height: 54px;
}

.manifest-fullscreen .manifest-cell--volume .manifest-input,
.manifest-fullscreen .manifest-cell--weight .manifest-input,
.manifest-fullscreen .manifest-cell--agency_fee .manifest-input,
.manifest-fullscreen .manifest-cell--total .manifest-input {
    min-width: 0;
}

.manifest-fullscreen .manifest-remove {
    gap: 0;
    width: 30px;
    height: 30px;
    justify-content: center;
    padding: 0;
    font-size: 0;
}

.manifest-fullscreen .manifest-remove svg {
    width: 14px;
    height: 14px;
}

.manifest-fullscreen .manifest-totals td {
    border-top: 2px solid #bfd5f4;
    border-right: 1px solid #dce9f8;
    background: #eff6ff;
    color: #17345f;
    padding: 12px 8px;
    font-size: 12px;
}

.manifest-fullscreen .manifest-totals__label {
    color: #244b83;
    font-size: 11.5px;
}

.manifest-fullscreen .manifest-totals__num,
.manifest-fullscreen .manifest-totals__pieces {
    color: var(--pulse-blue-dark);
    font-size: 12.5px;
    font-weight: 950;
}

.manifest-worksheet-info {
    display: flex;
    gap: 10px;
    margin: auto 24px 18px;
    padding: 12px 14px;
    border: 1px solid #c7dcfb;
    border-radius: 12px;
    background: #eff6ff;
    color: #17345f;
}

.manifest-worksheet-info__icon {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    border-radius: 8px;
    background: #ffffff;
    color: var(--pulse-blue);
}

.manifest-worksheet-info__icon svg {
    width: 16px;
    height: 16px;
}

.manifest-worksheet-info p {
    margin: 0;
    font-size: 12.5px;
    font-weight: 750;
    line-height: 1.45;
}

.manifest-fullscreen .manifest-worksheet__note {
    flex: 0 0 auto;
    border-top: 1px solid var(--pulse-border);
    background: #ffffff;
}

.manifest-fullscreen__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 12px 24px;
    border-top: 1px solid var(--pulse-border);
    background: #ffffff;
    color: var(--pulse-muted);
    font-size: 12px;
    font-weight: 700;
}

.manifest-fullscreen__export {
    flex: 0 0 auto;
}

/* --- New / assign modals -------------------------------------------------- */
.manifest-new-modal,
.manifest-assign-modal {
    width: min(640px, 94vw);
    max-height: 90vh;
    display: flex;
    flex-direction: column;
}

.manifest-new-modal__header,
.manifest-assign-modal__header {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 22px 24px 12px;
}

.manifest-new-modal__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: #eef4ff;
    color: var(--pulse-blue);
    flex: none;
}

.manifest-new-modal__icon svg {
    width: 22px;
    height: 22px;
}

.manifest-new-modal__title h3,
.manifest-assign-modal__header h3 {
    margin: 0;
    font-size: 18px;
    font-weight: 900;
    color: var(--pulse-text);
}

.manifest-new-modal__title p,
.manifest-assign-modal__header p {
    margin: 4px 0 0;
    font-size: 12.5px;
    font-weight: 650;
    color: var(--pulse-muted);
}

.manifest-new-modal__header .relationship-modal__close,
.manifest-assign-modal__header .relationship-modal__close {
    margin-left: auto;
}

.manifest-new-modal__body,
.manifest-assign-modal__body {
    padding: 8px 24px 16px;
    overflow-y: auto;
}

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

.manifest-new-modal .pkg-field--full,
.manifest-new-modal__grid .pkg-field--full {
    grid-column: 1 / -1;
}

.manifest-new-modal .pkg-field > span {
    display: block;
    margin-bottom: 6px;
    font-size: 12.5px;
    font-weight: 800;
    color: var(--pulse-text);
}

.manifest-new-modal .pkg-field input {
    width: 100%;
    height: 40px;
    border: 1px solid #ccd6e4;
    border-radius: 10px;
    background: #fff;
    color: var(--pulse-text);
    font: inherit;
    font-size: 14px;
    font-weight: 650;
    padding: 0 12px;
}

.manifest-new-modal .pkg-field input:focus {
    outline: 0;
    border-color: var(--pulse-blue);
    box-shadow: 0 0 0 3px rgba(0, 100, 210, 0.12);
}

.manifest-modal-error {
    margin-bottom: 14px;
}

.manifest-new-modal__footer,
.manifest-assign-modal__footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    padding: 14px 24px 20px;
    border-top: 1px solid var(--pulse-border);
}

.manifest-new-modal__footer > span,
.manifest-assign-modal__footer > span {
    margin-right: auto;
    color: var(--pulse-muted);
    font-size: 11.5px;
    font-weight: 650;
}

/* --- Assign modal list ---------------------------------------------------- */
.manifest-assign-modal__group-label {
    margin: 6px 0 8px;
    font-size: 11.5px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--pulse-blue-dark);
}

.manifest-assign-modal__group-label--blocked {
    color: var(--pulse-muted);
    margin-top: 18px;
}

.manifest-assign-modal__empty {
    margin: 8px 0;
    color: var(--pulse-muted);
    font-size: 13px;
    font-weight: 650;
}

.manifest-assign-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.manifest-assign-option > label {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 13px;
    border: 1px solid #dbe4f0;
    border-radius: 12px;
    background: #fff;
    cursor: pointer;
}

.manifest-assign-option > label:hover {
    border-color: var(--pulse-blue);
}

.manifest-assign-option--blocked > label {
    background: #f7f8fb;
    cursor: not-allowed;
    opacity: 0.75;
}

.manifest-assign-option__body {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-right: auto;
}

.manifest-assign-option__bol {
    font-size: 14px;
    font-weight: 900;
    color: var(--pulse-text);
}

.manifest-assign-option__meta,
.manifest-assign-option__consignee {
    font-size: 12px;
    font-weight: 650;
    color: var(--pulse-muted);
}

/* --- Responsive: manifests ------------------------------------------------ */
@media (max-width: 900px) {
    .booking-summary__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        padding: 0 24px;
    }

    .booking-summary__item {
        border-top: 0;
        border-left: 0;
        padding: 22px 24px;
    }

    .booking-summary__item--vessel-name {
        order: 1;
    }

    .booking-summary__item--vessel-number {
        order: 2;
        border-left: 1px solid #dbe4f0;
    }

    .booking-summary__item--container {
        order: 3;
        border-top: 1px solid #dbe4f0;
    }

    .booking-summary__item--shipping-date {
        order: 4;
        border-top: 1px solid #dbe4f0;
        border-left: 1px solid #dbe4f0;
    }

    .booking-summary__item--seal-one {
        order: 5;
        border-top: 1px solid #dbe4f0;
    }

    .booking-summary__item--seal-two {
        order: 6;
        border-top: 1px solid #dbe4f0;
        border-left: 1px solid #dbe4f0;
    }

    .manifest-new-modal__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .manifest-worksheet__toolbar {
        flex-direction: column;
        align-items: flex-start;
    }

    .manifest-worksheet__header-actions {
        width: 100%;
        justify-content: space-between;
    }

    .manifest-worksheet__actionbar {
        flex-direction: column;
        align-items: stretch;
    }

    .manifest-worksheet__actions--end {
        justify-content: flex-end;
    }

    .manifest-fullscreen-backdrop {
        padding: 8px;
    }

    .manifest-fullscreen {
        width: calc(100vw - 16px);
        height: calc(100vh - 16px);
        border-radius: 12px;
    }

    .manifest-fullscreen__header {
        padding: 14px 16px;
    }

    .manifest-fullscreen__header h2 {
        font-size: 20px;
    }
}

@media (max-width: 640px) {
    .booking-summary {
        border-radius: 16px;
    }

    .booking-summary__header {
        min-height: 72px;
        padding: 18px 20px;
    }

    .booking-summary__header h2 {
        font-size: 24px;
    }

    .booking-summary__grid {
        grid-template-columns: minmax(0, 1fr);
        padding: 0 20px;
    }

    .booking-summary__item,
    .booking-summary__item--vessel-number,
    .booking-summary__item--container,
    .booking-summary__item--shipping-date,
    .booking-summary__item--seal-one,
    .booking-summary__item--seal-two {
        border-top: 1px solid #dbe4f0;
        border-left: 0;
        padding: 18px 4px;
    }

    .booking-summary__item--vessel-name {
        border-top: 0;
    }
}

/* --- /workspace/ Add to manifest modal ------------------------------------ */
.bol-add-manifest__count {
    margin: 0 0 12px;
    color: var(--pulse-muted);
    font-size: 13px;
    font-weight: 650;
}

.bol-add-manifest__new {
    margin-top: 14px;
}

/* =========================================================================
   COURIER / CUSTOMER PORTAL SHELL (Phase 6 Workstream 1)

   A separate visual universe from the staff app. Staff get a dense workspace
   with an auto-revealing sidebar; the portal is horizontal, centred, and
   quieter, with more air and less chrome. It reuses the design tokens and the
   existing table/panel components, but nothing about its shell is shared.
   ========================================================================= */

.portal-body {
    background: var(--pulse-portal-bg);
}

:root {
    --pulse-portal-bg: #fbfcfe;
    --pulse-portal-header: #ffffff;
    --pulse-portal-max: 1240px;
}

.portal-shell {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
}

.portal-container {
    width: 100%;
    max-width: var(--pulse-portal-max);
    margin: 0 auto;
    padding: 0 28px;
}

/* --- Header + horizontal navigation --------------------------------------- */

.portal-header {
    position: sticky;
    z-index: 20;
    top: 0;
    border-bottom: 1px solid var(--pulse-border);
    background: var(--pulse-portal-header);
}

.portal-header__bar {
    position: relative;
    display: flex;
    width: 100%;
    max-width: var(--pulse-portal-max);
    align-items: center;
    justify-content: space-between;
    gap: clamp(12px, 1.5vw, 20px);
    margin: 0 auto;
    padding: 9px 28px;
}

.portal-brand-logo {
    display: block;
    width: clamp(136px, 14vw, 164px);
    height: auto;
    flex: 0 0 auto;
    border: 1px solid var(--pulse-border);
    border-radius: 8px;
    background: #f5f1e8;
    padding: 4px 6px;
    object-fit: contain;
}

/* Account identity. Present on every portal page so the scope a user is acting
   inside is never in question. */
.portal-account {
    position: relative;
    color: var(--pulse-text);
}

.portal-account summary {
    display: inline-flex;
    width: clamp(210px, 22vw, 252px);
    max-width: calc(100vw - 100px);
    align-items: center;
    gap: 10px;
    border: 1px solid var(--pulse-border);
    border-radius: 10px;
    background: #fff;
    cursor: pointer;
    list-style: none;
    padding: 7px 10px 7px 7px;
    transition: border-color 140ms ease, background-color 140ms ease;
}

.portal-account summary::-webkit-details-marker {
    display: none;
}

.portal-account summary:hover,
.portal-account[open] summary {
    border-color: #b7c5d3;
    background: #f8fafc;
}

.portal-account summary:focus-visible {
    outline: 3px solid rgba(193, 138, 43, 0.28);
    outline-offset: 2px;
}

.portal-account__avatar {
    display: grid;
    width: 34px;
    height: 34px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 999px;
    background: #eef4ff;
    color: var(--pulse-blue);
    font-size: 12px;
    font-weight: 900;
}

.portal-account__copy {
    display: flex;
    min-width: 0;
    flex: 1;
    flex-direction: column;
    line-height: 1.3;
}

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

.portal-account__copy strong {
    font-size: 13px;
    font-weight: 800;
}

.portal-account__copy small {
    color: var(--pulse-muted);
    font-size: 11px;
    font-weight: 650;
}

.portal-account__chevron {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
    color: var(--pulse-muted);
    transition: transform 140ms ease;
}

.portal-account[open] .portal-account__chevron {
    transform: rotate(180deg);
}

.portal-account__panel {
    position: absolute;
    z-index: 30;
    top: calc(100% + 8px);
    right: 0;
    display: grid;
    min-width: min(280px, calc(100vw - 36px));
    gap: 12px;
    border: 1px solid var(--pulse-border);
    border-radius: 12px;
    background: #fff;
    color: var(--pulse-text);
    padding: 14px;
    box-shadow: var(--pulse-shadow);
}

.portal-account__details {
    display: grid;
    min-width: 0;
    gap: 3px;
    border-bottom: 1px solid var(--pulse-border);
    padding-bottom: 12px;
}

.portal-account__details strong {
    font-size: 13px;
}

.portal-account__email {
    overflow-wrap: anywhere;
    color: var(--pulse-muted);
    font-size: 12px;
}

.portal-account__scope {
    color: var(--pulse-muted);
    font-size: 11px;
    font-weight: 700;
}

.portal-account__panel a {
    border-radius: 8px;
    color: var(--pulse-blue);
    font-size: 13px;
    font-weight: 800;
    padding: 8px 10px;
}

.portal-account__panel a:hover {
    background: #f8fafc;
}

.portal-nav {
    display: flex;
    min-width: 0;
    flex: 1;
    align-items: center;
    justify-content: center;
    gap: 2px;
    margin: 0;
    padding: 0;
}

.portal-nav__item {
    position: relative;
    border-bottom: 2px solid transparent;
    color: var(--pulse-muted);
    padding: 10px clamp(7px, 0.9vw, 12px);
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
    transition: color 120ms ease, border-color 120ms ease, background-color 120ms ease;
}

.portal-nav__item:hover {
    color: var(--pulse-text);
}

.portal-nav__item--active {
    border-bottom-color: var(--pulse-blue);
    color: var(--pulse-blue);
}

.portal-nav-toggle {
    display: none;
    border: 1px solid var(--pulse-border);
    border-radius: 10px;
    background: white;
    cursor: pointer;
    padding: 9px 10px;
}

.portal-nav-toggle span {
    display: block;
    width: 18px;
    height: 2px;
    border-radius: 2px;
    margin: 3px 0;
    background: var(--pulse-text);
}

/* --- Page head ------------------------------------------------------------ */

.portal-main {
    flex: 1;
    padding: 34px 0 56px;
}

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

.portal-page-head h1 {
    margin: 0;
    font-size: 27px;
    font-weight: 800;
    letter-spacing: -0.015em;
}

.portal-eyebrow {
    margin: 0 0 6px;
    color: var(--pulse-muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.portal-crumb {
    color: var(--pulse-blue);
}

.portal-crumb:hover {
    text-decoration: underline;
}

.portal-lede {
    max-width: 62ch;
    margin: 8px 0 0;
    color: var(--pulse-muted);
    font-size: 14px;
    line-height: 1.55;
}

.portal-page-head__meta {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding-top: 6px;
}

/* --- Cards, stats, and lists ---------------------------------------------- */

.portal-card {
    border: 1px solid var(--pulse-border);
    border-radius: 14px;
    background: var(--pulse-card);
    padding: 22px 24px;
    box-shadow: 0 1px 2px rgba(33, 36, 61, 0.04);
}

.portal-card + .portal-card {
    margin-top: 18px;
}

.portal-card__title {
    margin: 0 0 14px;
    font-size: 15px;
    font-weight: 700;
}

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

.portal-stats {
    display: grid;
    gap: 14px;
    margin-bottom: 20px;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.portal-stat {
    display: flex;
    flex-direction: column;
    gap: 4px;
    border: 1px solid var(--pulse-border);
    border-radius: 14px;
    background: var(--pulse-card);
    padding: 18px 20px;
    transition: border-color 120ms ease, transform 120ms ease;
}

.portal-stat:hover {
    border-color: var(--pulse-blue);
    transform: translateY(-1px);
}

.portal-stat__value {
    font-size: 26px;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.portal-stat__label {
    color: var(--pulse-muted);
    font-size: 13px;
    font-weight: 600;
}

.portal-actions,
.portal-owner-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.portal-actions li + li,
.portal-owner-list li + li {
    border-top: 1px solid var(--pulse-border);
}

.portal-actions a {
    display: flex;
    flex-direction: column;
    gap: 3px;
    border-radius: 10px;
    padding: 13px 12px;
    margin: 0 -12px;
}

.portal-actions a:hover {
    background: #f6f9ff;
}

.portal-actions strong {
    font-size: 14px;
    font-weight: 700;
}

.portal-actions span {
    color: var(--pulse-muted);
    font-size: 13px;
}

.portal-owner-list a {
    display: flex;
    align-items: center;
    gap: 12px;
    border-radius: 10px;
    padding: 12px;
    margin: 0 -12px;
}

.portal-owner-list a:hover {
    background: #f6f9ff;
}

.portal-owner-list--roomy a {
    padding: 16px 12px;
}

.portal-owner__avatar {
    display: grid;
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    place-items: center;
    border-radius: 999px;
    background: #eef4ff;
    color: var(--pulse-blue);
    font-size: 12px;
    font-weight: 900;
}

.portal-owner__copy {
    display: flex;
    min-width: 0;
    flex: 1;
    flex-direction: column;
    line-height: 1.35;
}

.portal-owner__copy strong {
    font-size: 14px;
    font-weight: 700;
}

.portal-owner__copy small {
    color: var(--pulse-muted);
    font-size: 12px;
}

.portal-owner__count {
    color: var(--pulse-muted);
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

/* --- Courier portal dashboard ---------------------------------------------- */

.courier-dashboard-head {
    align-items: flex-end;
}

.courier-dashboard-actions {
    flex-wrap: wrap;
    justify-content: flex-end;
}

.courier-dashboard-actions .portal-button {
    min-height: 40px;
}

.courier-dashboard-actions svg {
    width: 16px;
    height: 16px;
    margin-right: 7px;
}

.courier-dashboard {
    display: grid;
    gap: 22px;
}

.courier-dashboard-ops {
    display: grid;
    overflow: hidden;
    border: 1px solid #d9e2ef;
    border-radius: 16px;
    background: var(--pulse-card);
    box-shadow: 0 1px 2px rgba(33, 36, 61, 0.04);
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.courier-dashboard-metric {
    position: relative;
    display: grid;
    min-height: 112px;
    align-items: flex-start;
    gap: 14px;
    grid-template-columns: 38px minmax(0, 1fr);
    padding: 18px 20px;
    transition: background 120ms ease;
}

.courier-dashboard-metric + .courier-dashboard-metric {
    border-left: 1px solid #e1e8f2;
}

.courier-dashboard-metric:hover {
    background: #f8fbff;
}

.courier-dashboard-metric--alert {
    background: #fffaf2;
    box-shadow: inset 3px 0 0 #f59e0b;
}

.courier-dashboard-metric--alert:hover {
    background: #fff6e7;
}

.courier-dashboard-metric__icon {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    place-items: center;
    border-radius: 10px;
    background: #eef4ff;
    color: var(--pulse-blue);
}

.courier-dashboard-metric--alert .courier-dashboard-metric__icon {
    background: #fff7e8;
    color: #a85f00;
}

.courier-dashboard-metric__icon svg {
    width: 19px;
    height: 19px;
}

.courier-dashboard-metric__copy {
    display: grid;
    min-width: 0;
    gap: 3px;
}

.courier-dashboard-metric__copy strong {
    color: var(--pulse-ink);
    font-size: 26px;
    font-weight: 850;
    line-height: 1;
}

.courier-dashboard-metric__copy span {
    color: var(--pulse-ink);
    font-size: 13px;
    font-weight: 800;
}

.courier-dashboard-metric__copy small {
    color: var(--pulse-muted);
    font-size: 12px;
    line-height: 1.45;
}

.courier-dashboard-grid {
    display: grid;
    align-items: start;
    gap: 22px;
    grid-template-columns: minmax(0, 1.55fr) minmax(310px, 0.72fr);
}

.courier-dashboard-main,
.courier-dashboard-side {
    display: grid;
    gap: 20px;
}

.courier-dashboard-card {
    padding: 22px;
}

.courier-dashboard-card__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}

.courier-dashboard-card__head .portal-card__title {
    margin-bottom: 0;
}

.courier-dashboard-kicker {
    margin: 0 0 4px;
    color: var(--pulse-muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.courier-dashboard-card__link {
    color: var(--pulse-blue);
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
}

.courier-dashboard-card__link:hover {
    text-decoration: underline;
}

/* --- Upcoming shipment lifecycle card ------------------------------------- */
.courier-lifecycle__head {
    display: grid;
    align-items: start;
    gap: 8px 14px;
    grid-template-columns: 40px minmax(0, 1fr) auto;
    margin-bottom: 26px;
}

.courier-lifecycle__icon {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 11px;
    background: #eef4ff;
    color: var(--pulse-blue);
}

.courier-lifecycle__icon svg {
    width: 21px;
    height: 21px;
}

.courier-lifecycle__head-copy {
    min-width: 0;
}

.courier-lifecycle__head-copy .portal-card__title {
    margin-bottom: 2px;
}

.courier-lifecycle__subtitle {
    margin: 0;
    color: var(--pulse-muted);
    font-size: 13px;
    line-height: 1.45;
}

.courier-lifecycle__head-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    grid-column: 3;
    grid-row: 1 / span 2;
}

.courier-lifecycle__view {
    min-height: 36px;
    white-space: nowrap;
}

.courier-lifecycle__track {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
    margin: 0 0 24px;
    padding: 0;
    list-style: none;
}

.courier-lifecycle__step {
    position: relative;
    display: grid;
    justify-items: center;
    gap: 9px;
    padding-top: 3px;
    text-align: center;
}

.courier-lifecycle__node {
    position: relative;
    z-index: 1;
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border: 1.5px solid var(--pulse-border);
    border-radius: 50%;
    background: #fff;
    color: var(--pulse-muted);
}

.courier-lifecycle__node svg {
    width: 17px;
    height: 17px;
}

/* Connector line between step nodes; hidden after the last step. */
.courier-lifecycle__step::after {
    content: "";
    position: absolute;
    top: 20px;
    left: calc(50% + 17px);
    right: calc(-50% + 17px);
    height: 1.5px;
    background: var(--pulse-border);
}

.courier-lifecycle__step:last-child::after {
    display: none;
}

.courier-lifecycle__step-copy {
    display: grid;
    gap: 2px;
    min-width: 0;
    width: 100%;
}

.courier-lifecycle__step-copy strong {
    color: var(--pulse-text);
    font-size: 13px;
    font-weight: 800;
    line-height: 1.3;
}

.courier-lifecycle__step-copy small {
    color: var(--pulse-muted);
    font-size: 12px;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.courier-lifecycle__tag {
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--pulse-muted);
}

/* Step states: green = done, blue = current, amber = needs info, muted = waiting. */
.courier-lifecycle__step--complete .courier-lifecycle__node {
    border-color: rgba(24, 160, 88, 0.28);
    background: #eaf8f0;
    color: #11683b;
}

.courier-lifecycle__step--complete::after {
    background: rgba(24, 160, 88, 0.32);
}

.courier-lifecycle__step--complete .courier-lifecycle__tag {
    color: #11683b;
}

.courier-lifecycle__step--current .courier-lifecycle__node {
    border-color: var(--pulse-blue);
    background: #eef4ff;
    color: var(--pulse-blue);
    box-shadow: 0 0 0 3px rgba(0, 100, 210, 0.12);
}

.courier-lifecycle__step--current .courier-lifecycle__tag {
    color: var(--pulse-blue);
}

.courier-lifecycle__step--attention .courier-lifecycle__node {
    border-color: rgba(237, 139, 0, 0.5);
    background: #fff7e8;
    color: #a85f00;
}

.courier-lifecycle__step--attention .courier-lifecycle__tag {
    color: #a85f00;
}

.courier-lifecycle__step--waiting .courier-lifecycle__node {
    border-style: dashed;
    color: #9aa6ba;
}

.courier-lifecycle__facts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px 22px;
    margin: 0;
    padding-top: 22px;
    border-top: 1px solid var(--pulse-border);
}

.courier-lifecycle__facts dt {
    margin-bottom: 4px;
    color: var(--pulse-muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.courier-lifecycle__facts dd {
    margin: 0;
    color: var(--pulse-text);
    font-size: 13.5px;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.courier-lifecycle--empty .courier-lifecycle__head {
    margin-bottom: 16px;
}

@media (max-width: 760px) {
    .courier-lifecycle__head {
        grid-template-columns: 40px minmax(0, 1fr);
    }

    .courier-lifecycle__head-meta {
        grid-column: 1 / -1;
        grid-row: auto;
        flex-wrap: wrap;
    }

    .courier-lifecycle__track {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .courier-lifecycle__step {
        grid-template-columns: 34px minmax(0, 1fr);
        justify-items: start;
        align-items: center;
        column-gap: 14px;
        padding: 10px 0;
        text-align: left;
    }

    .courier-lifecycle__step-copy {
        grid-column: 2;
        justify-self: stretch;
    }

    .courier-lifecycle__tag {
        grid-column: 2;
        justify-self: start;
    }

    /* Vertical connector runs down through the node centers. */
    .courier-lifecycle__step::after {
        top: 37px;
        bottom: -3px;
        left: 19px;
        right: auto;
        width: 1.5px;
        height: auto;
    }

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

.courier-dashboard-empty {
    display: grid;
    gap: 3px;
    border: 1px dashed #c7d3e5;
    border-radius: 12px;
    color: var(--pulse-muted);
    font-size: 13px;
    padding: 16px;
}

.courier-dashboard-empty strong {
    color: var(--pulse-ink);
}

.courier-dashboard-table-wrap {
    overflow-x: auto;
}

.courier-dashboard-table {
    width: 100%;
    min-width: 640px;
    border-collapse: collapse;
}

.courier-dashboard-table th {
    border-bottom: 1px solid var(--pulse-border);
    color: var(--pulse-muted);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.06em;
    padding: 0 10px 10px;
    text-align: left;
    text-transform: uppercase;
}

.courier-dashboard-table td {
    border-bottom: 1px solid #edf2f8;
    color: var(--pulse-ink);
    font-size: 13px;
    padding: 14px 10px;
    vertical-align: middle;
}

.courier-dashboard-table tr:last-child td {
    border-bottom: 0;
}

.courier-dashboard-table td small {
    display: block;
    margin-top: 3px;
    color: var(--pulse-muted);
    font-size: 12px;
}

.courier-dashboard-strong-link {
    color: var(--pulse-blue);
    font-weight: 850;
}

.courier-dashboard-list,
.courier-dashboard-owner-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.courier-dashboard-list li + li,
.courier-dashboard-owner-list li + li {
    border-top: 1px solid #edf2f8;
}

.courier-dashboard-list a,
.courier-dashboard-owner-list a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-radius: 10px;
    margin: 0 -10px;
    padding: 12px 10px;
}

.courier-dashboard-list a:hover,
.courier-dashboard-owner-list a:hover {
    background: #f6f9ff;
}

.courier-dashboard-list span:first-child,
.courier-dashboard-owner-list__copy {
    display: grid;
    min-width: 0;
    gap: 2px;
}

.courier-dashboard-list strong,
.courier-dashboard-owner-list strong {
    overflow: hidden;
    color: var(--pulse-ink);
    font-size: 13px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.courier-dashboard-list small,
.courier-dashboard-owner-list small {
    overflow: hidden;
    color: var(--pulse-muted);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.courier-dashboard-list .status-chip,
.courier-dashboard-list .id-badge {
    flex: 0 0 auto;
}

.courier-dashboard-footer-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 12px;
    color: var(--pulse-blue);
    font-size: 12px;
    font-weight: 850;
}

.courier-dashboard-footer-link:hover {
    text-decoration: underline;
}

.courier-dashboard-footer-link svg,
.courier-dashboard-owner-list__chevron {
    width: 15px;
    height: 15px;
}

.courier-dashboard-owner-list__chevron {
    flex: 0 0 auto;
    color: #6f7f96;
}

.account-dashboard-account__summary {
    display: flex;
    align-items: center;
    gap: 12px;
    border-radius: 10px;
    margin: 0 -10px 12px;
    padding: 12px 10px;
}

.account-dashboard-account__summary:hover {
    background: #f6f9ff;
}

.account-dashboard-account__details {
    display: grid;
    gap: 10px;
    margin: 0;
    padding-top: 14px;
    border-top: 1px solid #edf2f8;
}

.account-dashboard-account__details div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.account-dashboard-account__details dt {
    color: var(--pulse-muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.account-dashboard-account__details dd {
    margin: 0;
    color: var(--pulse-ink);
    font-size: 13px;
    font-weight: 750;
    text-align: right;
}

/* --- Portal account overview --------------------------------------------- */

.portal-account-overview {
    display: grid;
    align-items: stretch;
    gap: 24px;
    grid-template-columns: minmax(0, 1.65fr) minmax(320px, 0.9fr);
}

.portal-account-links-card {
    grid-column: 1 / -1;
}

.portal-account-summary-card,
.portal-account-scope-card,
.portal-account-links-card {
    padding: 26px;
}

.portal-account-section-head {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
}

.portal-account-section-head .courier-dashboard-kicker {
    margin: 0;
    color: var(--pulse-blue);
    font-size: 11.5px;
}

.portal-account-section-head__icon {
    display: grid;
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    place-items: center;
    border-radius: 9px;
    background: #eef4ff;
    color: var(--pulse-blue);
}

.portal-account-section-head__icon svg {
    width: 18px;
    height: 18px;
}

.portal-account-summary-card__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.portal-account-summary-card__head .portal-account-section-head {
    margin-bottom: 0;
}

.portal-account-contact-button {
    min-height: 36px;
    flex: 0 0 auto;
    padding: 0 12px;
}

.portal-account-contact-button svg {
    width: 15px;
    height: 15px;
}

.portal-account-summary-card__identity {
    display: grid;
    align-items: center;
    gap: 18px;
    grid-template-columns: 58px minmax(0, 1fr) auto;
    margin-bottom: 0;
    padding-bottom: 22px;
    border-bottom: 1px solid #dfe7f2;
}

.portal-account-summary-card__identity p {
    margin: 3px 0 0;
    color: var(--pulse-muted);
    font-size: 13px;
}

.portal-account-summary-card__identity .portal-card__title {
    font-size: 21px;
    line-height: 1.2;
}

.portal-account-scope-card > .portal-card__title {
    font-size: 21px;
    line-height: 1.2;
}

.portal-account-summary-card__avatar {
    width: 58px;
    height: 58px;
    flex-basis: 58px;
    font-size: 16px;
}

.portal-account-detail-grid {
    display: grid;
    gap: 0;
    margin: 0;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.portal-account-detail-grid div {
    display: grid;
    gap: 4px 14px;
    min-width: 0;
    grid-template-columns: 26px minmax(0, 1fr);
    padding: 22px 18px 18px 0;
    border-bottom: 1px solid #edf2f8;
}

.portal-account-detail-grid div:not(:nth-child(3n + 1)) {
    border-left: 1px solid #e3ebf5;
    padding-left: 18px;
}

.portal-account-detail-grid__icon {
    display: grid;
    width: 22px;
    height: 22px;
    grid-row: 1 / span 2;
    place-items: center;
    color: var(--pulse-blue);
}

.portal-account-detail-grid__icon svg {
    width: 20px;
    height: 20px;
}

.portal-account-detail-grid dt {
    align-self: end;
    color: var(--pulse-muted);
    font-size: 10.5px;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.portal-account-detail-grid dd {
    grid-column: 2;
    margin: 0;
    color: var(--pulse-ink);
    font-size: 13.5px;
    font-weight: 750;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.portal-account-scope-card {
    display: flex;
    min-height: 100%;
    flex-direction: column;
    border-color: #d8e5f6;
    background: #f8fbff;
}

.portal-account-scope-list {
    display: grid;
    flex: 1;
    align-content: center;
    gap: 24px;
    list-style: none;
    margin: 24px 0 0;
    padding: 0;
}

.portal-account-scope-list li {
    display: grid;
    align-items: start;
    gap: 14px;
    grid-template-columns: 24px minmax(0, 1fr);
    color: #46556d;
    font-size: 13.5px;
    line-height: 1.55;
}

.portal-account-scope-list__check {
    display: grid;
    width: 22px;
    height: 22px;
    place-items: center;
    border-radius: 999px;
    background: #14844f;
    color: white;
}

.portal-account-scope-list__check svg {
    width: 14px;
    height: 14px;
}

.portal-account-card-subtitle {
    margin: 5px 0 0;
    max-width: 720px;
    color: var(--pulse-muted);
    font-size: 13px;
    line-height: 1.45;
}

.portal-account-links-card {
    padding: 36px;
}

.portal-account-card-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.portal-account-link-actions svg,
.portal-account-card-link svg {
    width: 15px;
    height: 15px;
}

/* --- Courier access-link ledger ------------------------------------------ */

.portal-account-link-ledger {
    display: grid;
    gap: 0;
    margin-top: 28px;
    min-width: 0;
}

.portal-account-link-ledger__head,
.portal-account-link-row {
    display: grid;
    align-items: center;
    column-gap: 28px;
    grid-template-columns: 1.25fr 1.7fr 0.8fr 0.75fr;
}

.portal-account-link-ledger__head {
    border-bottom: 1px solid #dce5f1;
    color: #4a556d;
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.06em;
    padding: 0 18px 12px;
    text-transform: uppercase;
}

.portal-account-link-ledger__rows {
    display: grid;
}

.portal-account-link-row {
    min-width: 0;
    border-bottom: 1px solid #edf2f8;
    padding: 12px 12px 12px 8px;
}

.portal-account-link-row:last-child {
    border-bottom: 0;
}

.portal-account-link-row__access-group {
    display: grid;
    align-items: center;
    grid-column: 1 / span 2;
    grid-template-columns: 1.25fr 1.7fr;
    column-gap: 22px;
    min-width: 0;
    border: 1px solid #dce6f3;
    border-radius: 10px;
    background: #ffffff;
    padding: 12px 14px;
}

.portal-account-link-owner {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.portal-account-link-owner .portal-owner__avatar {
    width: 44px;
    height: 44px;
    flex-basis: 44px;
    background: #edf4ff;
    color: var(--pulse-blue);
    font-size: 14px;
}

.portal-account-link-owner__copy {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.portal-account-link-owner__copy strong,
.portal-account-link-owner__copy a {
    color: #0b1438;
    font-size: 14.5px;
    font-weight: 850;
    line-height: 1.2;
}

.portal-account-link-owner__copy small {
    color: var(--pulse-muted);
    font-size: 12.5px;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.portal-account-link-field-cell {
    min-width: 0;
}

.portal-account-link-field {
    display: grid;
    align-items: center;
    grid-template-columns: minmax(0, 1fr) auto;
    min-width: 0;
    border: 1px solid #cfdbec;
    border-radius: 10px;
    background: #f8fbff;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.8);
}

.portal-account-link-field code {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #0b1438;
    padding: 10px 12px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 12.5px;
}

.portal-account-link-copy__btn {
    align-self: stretch;
    min-height: 0;
    border-width: 0 0 0 1px;
    border-color: #d7e1ef;
    border-radius: 0 9px 9px 0;
    background: #ffffff;
    color: #0b1438;
    padding: 0 12px;
    font-size: 12.5px;
}

.portal-account-link-copy__btn:hover {
    background: #f4f8ff;
}

.portal-account-link-copied {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 4px;
    color: #14844f;
    font-size: 12px;
    font-weight: 800;
}

.portal-account-link-copied[hidden] {
    display: none;
}

.portal-account-link-copied svg {
    width: 14px;
    height: 14px;
}

.portal-account-link-off {
    display: inline-flex;
    min-height: 38px;
    align-items: center;
    border: 1px dashed #cbd5e4;
    border-radius: 9px;
    background: #fbfcfe;
    color: #5b6474;
    padding: 0 12px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 13px;
    white-space: nowrap;
}

.portal-account-link-status {
    display: grid;
    align-content: center;
    justify-items: start;
    gap: 4px;
    min-width: 0;
}

.portal-account-active-pill,
.portal-account-revoked-pill {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border-radius: 999px;
    padding: 5px 11px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
}

.portal-account-active-pill {
    border: 1px solid rgba(20, 132, 79, 0.18);
    background: #eaf8f0;
    color: #11683b;
}

.portal-account-active-pill span,
.portal-account-revoked-pill span {
    width: 7px;
    height: 7px;
    border-radius: 999px;
}

.portal-account-active-pill span {
    background: #14844f;
}

.portal-account-revoked-pill {
    border: 1px solid var(--pulse-border);
    background: #f5f7fa;
    color: #5b6474;
}

.portal-account-revoked-pill span {
    background: #7d8798;
}

.portal-account-link-status__label {
    margin-top: 1px;
    color: #5b6474;
    font-size: 12px;
    font-weight: 750;
}

.portal-account-link-status__value {
    color: #4a5468;
    font-size: 12.5px;
    font-weight: 650;
    line-height: 1.35;
}

.portal-account-link-actions {
    display: grid;
    align-content: center;
    justify-items: stretch;
    gap: 8px;
    min-width: 0;
}

.portal-account-link-actions .portal-button {
    justify-content: center;
    min-height: 36px;
    width: 100%;
    border-color: #cbd8ea;
    border-radius: 8px;
    padding: 0 12px;
    color: #0b1438;
    font-weight: 800;
}

.portal-account-link-actions .portal-button--primary {
    color: #ffffff;
}

.portal-account-link-ledger__empty {
    margin: 18px 0 0;
    border: 1px dashed #cbd5e4;
    border-radius: 10px;
    color: var(--pulse-muted);
    padding: 22px;
    text-align: center;
}

.portal-link-confirm {
    max-width: 440px;
}

@media (max-width: 1120px) {
    .portal-account-link-ledger__head,
    .portal-account-link-row {
        column-gap: 18px;
        grid-template-columns: 1.2fr 1.45fr 0.72fr 0.72fr;
    }

    .portal-account-link-row__access-group {
        grid-template-columns: 1.2fr 1.45fr;
        column-gap: 18px;
        padding: 12px;
    }

    .portal-account-link-field code {
        font-size: 12px;
        padding-inline: 12px;
    }

    .portal-account-link-copy__btn {
        padding-inline: 12px;
    }
}

@media (max-width: 820px) {
    .portal-account-links-card {
        padding: 28px;
    }

    .portal-account-link-ledger__head {
        display: none;
    }

    .portal-account-link-row {
        align-items: stretch;
        grid-template-columns: 1fr;
        gap: 14px;
        padding: 14px 0;
    }

    .portal-account-link-row__access-group {
        grid-column: auto;
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .portal-account-link-status {
        align-content: start;
        padding-inline: 2px;
    }

    .portal-account-link-actions {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .portal-account-links-card {
        padding: 22px;
    }

    .portal-account-link-field {
        grid-template-columns: minmax(0, 1fr);
    }

    .portal-account-link-field code {
        white-space: normal;
        overflow-wrap: anywhere;
    }

    .portal-account-link-copy__btn {
        justify-content: center;
        min-height: 42px;
        border-width: 1px 0 0;
        border-radius: 0 0 9px 9px;
    }

    .portal-account-link-off {
        width: 100%;
        white-space: normal;
    }
}

/* --- Courier-customer access-link page (token-scoped) --------------------- */

.access-header__bar {
    padding-top: 18px;
    padding-bottom: 18px;
}

.access-link-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid #c8d8ef;
    border-radius: 999px;
    background: #eef4ff;
    color: var(--pulse-blue);
    padding: 7px 14px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.01em;
    white-space: nowrap;
}

.access-link-badge svg {
    width: 15px;
    height: 15px;
}

.access-layout {
    display: flex;
    flex-direction: column;
    gap: 22px;
    padding: 30px 0 44px;
}

.access-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 28px;
    border: 1px solid #c8d8ef;
    border-radius: 16px;
    background:
        linear-gradient(112deg, rgba(255, 255, 255, 0.95), rgba(238, 245, 255, 0.9)),
        #eef5ff;
    box-shadow: 0 14px 34px rgba(13, 20, 55, 0.07);
    padding: 26px 32px;
}

.access-hero__identity {
    display: flex;
    align-items: center;
    gap: 20px;
    min-width: 0;
}

.access-hero__avatar {
    display: grid;
    flex: none;
    width: 74px;
    height: 74px;
    place-items: center;
    border: 4px solid rgba(255, 255, 255, 0.9);
    border-radius: 50%;
    background: linear-gradient(145deg, #f9fbff, #e6efff);
    color: var(--pulse-blue);
    box-shadow: 0 12px 26px rgba(0, 100, 210, 0.16);
    font-size: 24px;
    font-weight: 900;
}

.access-hero__copy {
    min-width: 0;
}

.access-hero__eyebrow {
    margin: 0 0 6px;
    color: var(--pulse-blue);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.access-hero__copy h1 {
    margin: 0;
    color: #0b1438;
    font-size: 27px;
    font-weight: 850;
    line-height: 1.15;
}

.access-hero__scope {
    margin: 10px 0 0;
    max-width: 52ch;
    color: #4a5468;
    font-size: 13.5px;
    line-height: 1.5;
}

.access-hero__meta {
    display: flex;
    flex-direction: column;
    gap: 11px;
    margin: 0;
    padding: 14px 16px;
    list-style: none;
    border: 1px solid rgba(200, 216, 239, 0.75);
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.7);
    width: min(360px, 34vw);
    min-width: 280px;
}

.access-hero__meta li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.access-meta__icon {
    display: grid;
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    place-items: center;
    border-radius: 9px;
    background: #eef4ff;
    color: var(--pulse-blue);
}

.access-meta__icon svg {
    width: 16px;
    height: 16px;
}

.access-meta__copy {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.access-meta__label {
    color: #17213c;
    font-size: 12.5px;
    font-weight: 850;
    letter-spacing: 0;
    text-transform: none;
}

.access-meta__value {
    color: var(--pulse-muted);
    font-size: 12px;
    font-weight: 650;
    line-height: 1.35;
}

.access-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 12px;
    max-width: 480px;
    margin: 64px auto;
    padding: 40px 32px;
    border: 1px solid var(--pulse-border);
    border-radius: 16px;
    background: var(--pulse-card);
    box-shadow: 0 14px 34px rgba(13, 20, 55, 0.06);
}

.access-empty__icon {
    display: grid;
    width: 58px;
    height: 58px;
    place-items: center;
    border-radius: 16px;
}

.access-empty__icon svg {
    width: 28px;
    height: 28px;
}

.access-empty__icon--alert {
    background: #fff4e6;
    color: var(--pulse-orange);
}

.access-empty__icon--muted {
    background: #f2f4f8;
    color: #5b6474;
}

.access-empty h1 {
    margin: 4px 0 0;
    color: #0b1438;
    font-size: 22px;
    font-weight: 850;
}

.access-empty__lead {
    margin: 0;
    color: #4a5468;
    font-size: 14px;
    line-height: 1.55;
}

.access-empty__note {
    margin: 4px 0 0;
    color: var(--pulse-muted);
    font-size: 12.5px;
}

@media (max-width: 820px) {
    .access-hero {
        grid-template-columns: minmax(0, 1fr);
    }

    .access-hero__meta {
        width: 100%;
        min-width: 0;
    }
}

@media (max-width: 640px) {
    .access-header__bar {
        flex-wrap: wrap;
        gap: 12px;
    }

    .access-hero__identity {
        flex-direction: column;
        align-items: flex-start;
        gap: 14px;
    }

    .portal-account-link-copy {
        flex-wrap: wrap;
    }
}

.portal-account-contact-backdrop {
    background: rgba(13, 20, 55, 0.42);
    backdrop-filter: blur(5px);
}

.portal-account-contact-drawer {
    width: min(600px, 100vw);
    border-radius: 24px 0 0 24px;
    box-shadow: -24px 0 70px rgba(13, 20, 55, 0.26);
    padding: 32px;
}

.portal-account-contact-drawer__header {
    display: grid;
    align-items: start;
    gap: 18px;
    grid-template-columns: 56px minmax(0, 1fr) auto;
    margin-bottom: 28px;
}

.portal-account-contact-drawer__icon {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 999px;
    background: #eef4ff;
    color: var(--pulse-blue);
}

.portal-account-contact-drawer__icon svg {
    width: 25px;
    height: 25px;
}

.portal-account-contact-drawer__title {
    min-width: 0;
}

.portal-account-contact-drawer__title .eyebrow {
    margin-bottom: 5px;
}

.portal-account-contact-drawer__title h3 {
    margin: 0;
    color: var(--pulse-ink);
    font-size: 22px;
    line-height: 1.2;
}

.portal-account-contact-drawer__title p {
    max-width: 430px;
    margin: 18px 0 0;
    color: #46556d;
    font-size: 14px;
    line-height: 1.55;
}

.portal-account-contact-drawer .modal-close {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    font-size: 26px;
}

.portal-account-current-contact {
    display: grid;
    gap: 0;
    margin: 0 0 28px;
    border: 1px solid #d8e5f6;
    border-radius: 16px;
    background: #f8fbff;
    padding: 0 22px;
}

.portal-account-current-contact__row {
    display: grid;
    align-items: center;
    gap: 18px;
    grid-template-columns: 26px minmax(0, 1fr);
    min-width: 0;
    padding: 22px 0;
}

.portal-account-current-contact__row + .portal-account-current-contact__row {
    border-top: 1px solid #dce6f2;
}

.portal-account-current-contact__icon {
    display: grid;
    width: 26px;
    height: 26px;
    place-items: center;
    color: var(--pulse-blue);
}

.portal-account-current-contact__icon svg {
    width: 22px;
    height: 22px;
}

.portal-account-current-contact__row div {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.portal-account-current-contact span:not(.portal-account-current-contact__icon) {
    color: var(--pulse-muted);
    font-size: 10.5px;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.portal-account-current-contact strong {
    color: var(--pulse-ink);
    font-size: 13.5px;
    font-weight: 800;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.portal-account-contact-form {
    display: grid;
    grid-template-columns: 1fr;
    gap: 22px;
}

.portal-account-contact-feedback {
    border: 1px solid #dfe7f2;
    border-radius: 12px;
    padding: 12px 14px;
    color: #46556d;
    font-size: 13px;
    font-weight: 750;
    line-height: 1.45;
}

.portal-account-contact-feedback--success {
    border-color: rgba(20, 132, 79, 0.22);
    background: #eaf8f0;
    color: #11683b;
}

.portal-account-contact-feedback--error {
    border-color: rgba(196, 112, 28, 0.24);
    background: #fff6e9;
    color: #8a4d0f;
}

.portal-account-contact-segment {
    display: grid;
    gap: 14px;
    min-width: 0;
    margin: 0;
    border: 0;
    padding: 0;
}

.portal-account-contact-segment legend,
.portal-account-contact-value-field > span {
    margin: 0;
    color: #324059;
    font-size: 13px;
    font-weight: 850;
}

.portal-account-contact-segment__options {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.portal-account-contact-choice {
    position: relative;
    display: inline-flex;
    min-height: 50px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 1px solid #cfd9e8;
    border-radius: 11px;
    background: white;
    color: #4f5e74;
    cursor: pointer;
    font-size: 13.5px;
    font-weight: 850;
    padding: 12px 16px;
    transition: border-color 160ms ease, background 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

.portal-account-contact-choice input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.portal-account-contact-choice svg {
    width: 18px;
    height: 18px;
}

.portal-account-contact-choice:hover,
.portal-account-contact-choice:focus-within {
    border-color: var(--pulse-blue);
    box-shadow: 0 0 0 4px rgba(0, 100, 210, 0.1);
}

.portal-account-contact-choice.is-selected,
.portal-account-contact-choice:has(input:checked) {
    border-color: var(--pulse-blue);
    background: #eef4ff;
    color: var(--pulse-blue);
}

.portal-account-contact-value-field {
    gap: 9px;
}

.portal-account-contact-value-field input {
    min-height: 54px;
    border-radius: 10px;
    font-size: 14px;
}

.portal-account-contact-value-field input:invalid:not(:placeholder-shown) {
    border-color: #c4701c;
    box-shadow: 0 0 0 4px rgba(196, 112, 28, 0.12);
}

.portal-account-contact-actions {
    display: grid;
    align-items: center;
    gap: 14px;
    grid-template-columns: minmax(120px, 0.55fr) minmax(0, 1.45fr);
    margin-top: 4px;
}

.portal-account-contact-actions .button {
    min-height: 50px;
    border-radius: 10px;
}

.portal-account-contact-actions .button--primary {
    gap: 10px;
}

.portal-account-contact-actions .button--primary svg {
    width: 18px;
    height: 18px;
}

.portal-account-contact-actions .button--primary:disabled {
    cursor: not-allowed;
    opacity: 0.48;
    transform: none;
}

.portal-account-contact-note {
    display: grid;
    align-items: center;
    gap: 14px;
    grid-template-columns: 40px minmax(0, 1fr);
    margin-top: 20px;
    border-radius: 14px;
    background: #f7fafc;
    padding: 18px;
}

.portal-account-contact-note__icon {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 999px;
    background: #ddf6e8;
    color: #14844f;
}

.portal-account-contact-note__icon svg {
    width: 21px;
    height: 21px;
}

.portal-account-contact-note p {
    margin: 0;
    color: #46556d;
    font-size: 13px;
    line-height: 1.5;
}

/* Direct customer account: personal profile surface. */
.portal-body--account-overview-customer {
    --pulse-portal-bg: #f7f9fc;
}

.portal-body--account-overview-customer .portal-main {
    padding: 28px 0 28px;
}

.portal-customer-profile {
    display: grid;
    gap: 24px;
}

.portal-customer-hero {
    position: relative;
    display: grid;
    align-items: center;
    gap: 28px;
    overflow: hidden;
    min-height: 184px;
    border: 1px solid #c8d8ef;
    border-radius: 16px;
    background:
        linear-gradient(110deg, rgba(255, 255, 255, 0.92), rgba(237, 245, 255, 0.92)),
        #edf5ff;
    box-shadow: 0 14px 36px rgba(13, 20, 55, 0.08);
    grid-template-columns: auto minmax(0, 1fr);
    padding: 32px 46px;
}

.portal-customer-hero::after {
    content: "";
    position: absolute;
    inset: -42px -34px auto auto;
    width: min(58%, 620px);
    height: 250px;
    opacity: 0.44;
    background:
        repeating-radial-gradient(ellipse at 78% 42%, rgba(0, 100, 210, 0.16) 0 1px, transparent 2px 15px),
        repeating-linear-gradient(142deg, transparent 0 24px, rgba(255, 255, 255, 0.72) 25px 26px);
    transform: rotate(-4deg);
}

.portal-customer-hero__avatar {
    position: relative;
    z-index: 1;
    display: grid;
    width: 116px;
    height: 116px;
    place-items: center;
    border: 5px solid rgba(255, 255, 255, 0.88);
    border-radius: 50%;
    background: linear-gradient(145deg, #f9fbff, #e6efff);
    color: var(--pulse-blue);
    box-shadow: 0 14px 32px rgba(0, 100, 210, 0.16);
    font-size: 32px;
    font-weight: 900;
}

.portal-customer-hero__copy {
    position: relative;
    z-index: 1;
    min-width: 0;
}

.portal-customer-hero__eyebrow {
    margin: 0 0 16px;
    color: var(--pulse-blue);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.portal-customer-hero h1 {
    margin: 0;
    color: #0b1438;
    font-size: 32px;
    font-weight: 850;
    line-height: 1.14;
}

.portal-customer-hero__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px 16px;
    margin-top: 20px;
    color: #4f5e74;
    font-size: 14px;
    line-height: 1.4;
}

.portal-customer-hero__meta > span:not(:first-child)::before {
    content: "";
    display: inline-block;
    width: 1px;
    height: 20px;
    margin-right: 16px;
    background: #cdd8e8;
    vertical-align: middle;
}

.portal-customer-verified-pill {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border: 1px solid rgba(20, 132, 79, 0.22);
    border-radius: 999px;
    background: #eaf8f0;
    color: #11683b;
    padding: 4px 10px;
    font-size: 12px;
    font-weight: 850;
    white-space: nowrap;
}

.portal-customer-verified-pill svg {
    width: 14px;
    height: 14px;
}

.portal-profile-card {
    border-color: #d8e1ed;
    border-radius: 14px;
    box-shadow: 0 10px 30px rgba(13, 20, 55, 0.05);
    padding: 24px 28px 26px;
}

.portal-profile-card__header {
    display: grid;
    align-items: center;
    gap: 14px;
    grid-template-columns: auto minmax(0, 1fr);
    margin-bottom: 18px;
}

.portal-profile-card__header--with-action {
    grid-template-columns: auto minmax(0, 1fr) auto;
}

.portal-profile-card__icon {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 10px;
    background: #eef4ff;
    color: var(--pulse-blue);
}

.portal-profile-card__icon svg {
    width: 22px;
    height: 22px;
}

.portal-profile-card h2 {
    margin: 0;
    color: #0b1438;
    font-size: 20px;
    font-weight: 850;
    line-height: 1.25;
}

.portal-profile-contact-card__button {
    justify-self: end;
    border-color: rgba(0, 100, 210, 0.58);
    border-radius: 8px;
    color: var(--pulse-blue);
    font-weight: 850;
}

.portal-profile-contact-card__button:focus-visible {
    outline: 3px solid rgba(0, 100, 210, 0.22);
    outline-offset: 2px;
}

.portal-profile-fields {
    display: grid;
    gap: 0 28px;
    margin: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.portal-profile-fields div {
    min-width: 0;
    padding: 14px 0 15px;
    border-bottom: 1px solid #dfe7f2;
}

.portal-profile-fields__full {
    grid-column: 1 / -1;
}

.portal-profile-fields dt {
    margin: 0 0 7px;
    color: #5d6b82;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.3;
}

.portal-profile-fields dd {
    margin: 0;
    color: #0b1438;
    font-size: 16px;
    font-weight: 650;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.portal-account-contact-backdrop.pkg-modal-backdrop--center {
    z-index: 40;
    background: rgba(13, 20, 55, 0.42);
    backdrop-filter: blur(5px);
}

.portal-account-contact-modal {
    width: min(100%, 480px);
    max-height: calc(100vh - 64px);
    min-height: auto;
    overflow-y: auto;
    border: 1px solid #d8e1ed;
    border-radius: 16px;
    box-shadow: 0 28px 90px rgba(10, 18, 38, 0.28);
    padding: 24px;
}

.portal-account-contact-modal__header {
    margin-bottom: 20px;
}

.portal-account-contact-modal__header .pkg-drawer__lead {
    margin: 8px 0 0;
}

.portal-account-field-error {
    color: #b42318;
    font-weight: 750;
}

.pkg-field input[aria-invalid="true"] {
    border-color: #d92d20;
    box-shadow: 0 0 0 3px rgba(217, 45, 32, 0.12);
}

/* --- Callouts, buttons, empty/placeholder states -------------------------- */

.portal-callout {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border: 1px solid var(--pulse-border);
    border-radius: 14px;
    background: var(--pulse-card);
    padding: 16px 20px;
    margin-bottom: 20px;
}

.portal-callout strong {
    display: block;
    font-size: 14px;
}

.portal-callout span {
    color: var(--pulse-muted);
    font-size: 13px;
}

.portal-callout--warning {
    border-color: rgba(237, 139, 0, 0.4);
    background: #fffaf1;
}

.portal-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--pulse-border);
    border-radius: 10px;
    background: white;
    cursor: pointer;
    padding: 9px 16px;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
}

.portal-button--primary {
    border-color: var(--pulse-blue);
    background: var(--pulse-blue);
    color: white;
}

.portal-button--quiet:hover {
    border-color: var(--pulse-blue);
    color: var(--pulse-blue);
}

.portal-empty,
.portal-placeholder {
    color: var(--pulse-muted);
    font-size: 14px;
    line-height: 1.6;
}

.portal-placeholder p {
    max-width: 60ch;
    margin: 0 0 10px;
}

.portal-placeholder__list {
    margin: 14px 0 0;
    padding-left: 20px;
}

.portal-placeholder__list li {
    margin-bottom: 6px;
}

.portal-placeholder__action {
    margin-top: 18px;
}

/* --- Courier shipment detail -------------------------------------------- */

.portal-body--shipment-detail {
    --pulse-portal-bg: #f5f7fb;
}

.portal-body--shipment-detail .portal-main {
    padding-top: 24px;
}

.courier-shipment-page-head {
    align-items: flex-end;
    margin-bottom: 20px;
}

.courier-shipment-page-head h1 {
    color: #07143b;
    font-size: 30px;
    line-height: 1.15;
    letter-spacing: 0;
}

.courier-shipment-page-head .portal-lede {
    margin: 8px 0 0;
    color: #49546d;
    font-size: 14px;
    line-height: 1.55;
}

.courier-shipment-crumb {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 8px;
    color: #596377;
    font-size: 12px;
    letter-spacing: 0.06em;
}

.courier-shipment-crumb .portal-crumb {
    color: #0b63f6;
}

.courier-shipment-eyebrow {
    margin-top: 8px;
}

.courier-shipment-page-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
    padding-top: 0;
}

.courier-shipment-detail {
    gap: 18px;
}

.courier-shipment-summary,
.courier-shipment-packages {
    border: 1px solid #dfe5ef;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.05);
}

.courier-shipment-summary {
    padding: 24px;
}

.courier-shipment-summary__head {
    align-items: center;
    gap: 18px;
    margin-bottom: 22px;
}

.courier-shipment-summary__avatar {
    width: 44px;
    height: 44px;
    flex-basis: 44px;
    border: 1px solid #c8dcff;
    border-radius: 11px;
    background: #eaf3ff;
    color: #0b63f6;
}

.courier-shipment-summary__avatar svg {
    width: 24px;
    height: 24px;
}

.courier-shipment-summary .setup-summary__copy h3,
.courier-shipment-packages .setup-recent__copy h3 {
    color: #07143b;
    font-size: 19px;
    line-height: 1.2;
    letter-spacing: 0;
}

.courier-shipment-summary .setup-summary__copy p,
.courier-shipment-packages .setup-recent__copy p {
    color: #49546d;
    font-size: 13.5px;
}

.courier-shipment-summary__actions {
    margin-left: auto;
}

.courier-shipment-action {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 1px solid #cbd6e7;
    border-radius: 9px;
    background: white;
    color: #0b63f6;
    cursor: pointer;
    padding: 0 16px;
    font-size: 13px;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
}

.courier-shipment-action svg {
    width: 17px;
    height: 17px;
}

.courier-shipment-action--secondary:hover {
    border-color: #9db9ee;
    background: #f7fbff;
}

.courier-shipment-action--primary {
    border-color: #0b63f6;
    background: #0b63f6;
    color: white;
    box-shadow: 0 8px 18px rgba(11, 99, 246, 0.16);
}

.courier-shipment-action--primary:hover {
    background: #0957dc;
}

.courier-shipment-info-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px 20px;
}

.courier-shipment-info {
    min-height: 78px;
    align-items: center;
    border-color: #dfe5ef;
    border-radius: 11px;
    background: #fff;
    padding: 16px 18px;
}

.courier-shipment-info .setup-info__icon {
    width: 36px;
    height: 36px;
    flex-basis: 36px;
    border-radius: 9px;
    background: #eff6ff;
    color: #0b63f6;
}

.courier-shipment-info .setup-info__icon svg {
    width: 18px;
    height: 18px;
}

.courier-shipment-info .setup-info__label {
    color: #667085;
    font-size: 11px;
    letter-spacing: 0.055em;
}

.courier-shipment-info .setup-info__value {
    color: #07143b;
    font-size: 15px;
    font-weight: 800;
}

.courier-shipment-inline-action {
    display: inline-flex;
    min-height: 30px;
    align-items: center;
    border: 1px solid #b9c9e6;
    border-radius: 7px;
    background: #fff;
    color: #0b63f6;
    cursor: pointer;
    padding: 0 10px;
    font-size: 12px;
    font-weight: 800;
}

.courier-shipment-inline-action:hover {
    border-color: #0b63f6;
    background: #f7fbff;
}

.courier-shipment-consignee-form {
    padding: 0 24px 24px;
}

.courier-shipment-consignee-form .clearing-options {
    margin-top: 0;
}

.courier-shipment-secondary-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(320px, 0.92fr);
    gap: 16px;
    margin-top: 18px;
}

.courier-shipment-detail-panel,
.courier-shipment-readiness-panel {
    border: 1px solid #dfe5ef;
    border-radius: 12px;
    padding: 16px;
}

.courier-shipment-detail-panel h4,
.courier-shipment-readiness-panel h4 {
    margin: 0;
    color: #07143b;
    font-size: 14px;
    font-weight: 800;
}

.courier-shipment-detail-row {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 0;
}

.courier-shipment-detail-row + .courier-shipment-detail-row {
    border-top: 1px solid #e8edf5;
}

.courier-shipment-detail-row__icon,
.courier-shipment-readiness-panel__icon {
    display: grid;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    place-items: center;
    border-radius: 9px;
    background: #eff6ff;
    color: #0b63f6;
}

.courier-shipment-detail-row__icon svg,
.courier-shipment-readiness-panel__icon svg {
    width: 18px;
    height: 18px;
}

.courier-shipment-detail-row p {
    margin: 0 0 3px;
    color: #667085;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.courier-shipment-detail-row strong {
    display: block;
    color: #07143b;
    font-size: 15px;
    line-height: 1.35;
}

.courier-shipment-detail-row span:not(.courier-shipment-detail-row__icon) {
    display: block;
    margin-top: 3px;
    color: #667085;
    font-size: 12.5px;
    line-height: 1.45;
}

.courier-shipment-readiness-panel {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    align-items: start;
    gap: 16px;
    border-color: #abdcbc;
    background: #f3fbf6;
    padding: 18px;
}

.courier-shipment-readiness-panel__icon {
    width: 52px;
    height: 52px;
    border: 1px solid #d6efdf;
    border-radius: 13px;
    background: #e6f6eb;
    color: #12864d;
}

.courier-shipment-readiness-panel__icon svg {
    width: 27px;
    height: 27px;
}

.courier-shipment-readiness-panel__body {
    display: grid;
    grid-template-columns: 1fr;
    min-width: 0;
}

.courier-shipment-readiness-panel__main {
    display: grid;
    gap: 12px;
}

.courier-shipment-readiness-panel h4 {
    color: #07143b;
    font-size: 17px;
    font-weight: 850;
    letter-spacing: 0;
    line-height: 1.2;
}

.courier-shipment-readiness-panel .status-chip {
    display: inline-flex;
    width: fit-content;
    min-height: 28px;
    margin-top: 9px;
    padding: 5px 10px 5px 8px;
    border: 1px solid #bfe8cc;
    background: #f5fff8;
    color: #148348;
    font-size: 12px;
}

.courier-shipment-readiness-panel .status-chip__ico {
    width: 13px;
    height: 13px;
}

.courier-shipment-readiness-panel p {
    margin: 12px 0 0;
    max-width: none;
    color: #48566f;
    font-size: 13.5px;
    font-weight: 500;
    line-height: 1.45;
}

.courier-shipment-readiness-panel .courier-shipment-inline-action {
    width: fit-content;
    min-height: 44px;
    border-color: #a9bfeb;
    border-radius: 9px;
    padding: 0 14px;
    color: #0b63f6;
    font-size: 13px;
    white-space: nowrap;
}

.courier-shipment-inline-action:focus-visible {
    outline: 2px solid rgba(11, 99, 246, 0.38);
    outline-offset: 2px;
}

.courier-shipment-readiness-panel .courier-shipment-inline-action svg {
    width: 16px;
    height: 16px;
}

.courier-shipment-inline-action__arrow {
    margin-left: 2px;
}

.portal-consignee-modal-backdrop {
    padding: 24px;
}

.portal-consignee-modal {
    width: min(100%, 720px);
    max-height: min(86vh, 760px);
    overflow: hidden;
    border: 1px solid #d8e1ee;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 26px 76px rgba(7, 18, 44, 0.28);
}

.portal-consignee-modal form {
    display: flex;
    max-height: min(86vh, 760px);
    flex-direction: column;
}

.portal-consignee-modal__header {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) 40px;
    align-items: center;
    gap: 14px;
    border-bottom: 1px solid #e3e9f2;
    padding: 20px 22px;
}

.portal-consignee-modal__icon {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border: 1px solid #d6e4f7;
    border-radius: 10px;
    background: #eef5ff;
    color: #0b63f6;
}

.portal-consignee-modal__icon svg {
    width: 21px;
    height: 21px;
}

.portal-consignee-modal__title {
    min-width: 0;
}

.portal-consignee-modal__title p,
.portal-consignee-modal__title h2,
.portal-consignee-modal__title span {
    margin: 0;
    letter-spacing: 0;
}

.portal-consignee-modal__title p {
    color: #66758c;
    font-size: 10.5px;
    font-weight: 850;
    letter-spacing: 0.08em;
    line-height: 1.2;
    text-transform: uppercase;
}

.portal-consignee-modal__title h2 {
    margin-top: 3px;
    color: #07143b;
    font-size: 21px;
    font-weight: 850;
    line-height: 1.2;
}

.portal-consignee-modal__title span {
    display: block;
    margin-top: 4px;
    overflow: hidden;
    color: #657287;
    font-size: 13px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.portal-consignee-modal__close {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 1px solid #dce4ef;
    border-radius: 9px;
    background: #fff;
    color: #34435b;
    cursor: pointer;
}

.portal-consignee-modal__close:hover {
    border-color: #c4d0df;
    background: #f7f9fc;
}

.portal-consignee-modal__close:focus-visible,
.portal-consignee-option:has(.shipment-consignee-option__input:focus-visible) {
    outline: 2px solid rgba(11, 99, 246, 0.42);
    outline-offset: 2px;
}

.portal-consignee-modal__close svg {
    width: 18px;
    height: 18px;
}

.portal-consignee-modal__body {
    min-height: 0;
    overflow-y: auto;
    padding: 22px;
}

.portal-consignee-modal__intro h3,
.portal-consignee-modal__intro p {
    margin: 0;
}

.portal-consignee-modal__intro h3 {
    color: #07143b;
    font-size: 15px;
    font-weight: 850;
}

.portal-consignee-modal__intro p {
    margin-top: 4px;
    color: #66758c;
    font-size: 13px;
    line-height: 1.4;
}

.portal-consignee-modal__error {
    margin-top: 14px;
    border-left: 3px solid #c94444;
    background: #fff5f5;
    color: #9b2f2f;
    padding: 10px 12px;
    font-size: 13px;
    font-weight: 700;
}

.portal-consignee-modal__options {
    display: grid;
    gap: 10px;
    margin-top: 16px;
}

.portal-consignee-option {
    min-height: 78px;
    grid-template-columns: 44px minmax(0, 1fr) 22px;
    gap: 12px;
    border-radius: 10px;
    padding: 12px 14px;
}

.portal-consignee-option .shipment-consignee-option__avatar {
    width: 44px;
    height: 44px;
    font-size: 13px;
}

.portal-consignee-option .shipment-consignee-option__body {
    gap: 5px;
}

.portal-consignee-option .shipment-consignee-option__meta {
    white-space: normal;
}

.portal-consignee-modal__empty {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    border: 1px dashed #cad6e6;
    border-radius: 10px;
    background: #fafcff;
    padding: 16px;
}

.portal-consignee-modal__empty > span {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 9px;
    background: #edf4ff;
    color: #0b63f6;
}

.portal-consignee-modal__empty svg {
    width: 20px;
    height: 20px;
}

.portal-consignee-modal__empty h3,
.portal-consignee-modal__empty p {
    margin: 0;
}

.portal-consignee-modal__empty h3 {
    color: #07143b;
    font-size: 14px;
}

.portal-consignee-modal__empty p {
    margin-top: 3px;
    color: #66758c;
    font-size: 12.5px;
}

.portal-consignee-modal__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    border-top: 1px solid #e3e9f2;
    padding: 16px 22px;
}

.portal-consignee-modal__footer p {
    display: flex;
    max-width: 330px;
    align-items: center;
    gap: 8px;
    margin: 0;
    color: #66758c;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.35;
}

.portal-consignee-modal__footer p svg {
    width: 17px;
    height: 17px;
    flex: 0 0 auto;
    color: #0b63f6;
}

.portal-consignee-modal__footer > div {
    display: flex;
    flex: 0 0 auto;
    gap: 8px;
}

.portal-consignee-modal__footer .button {
    min-height: 42px;
}

@media (max-width: 640px) {
    .portal-consignee-modal-backdrop {
        padding: 16px;
    }

    .portal-consignee-modal {
        max-height: calc(100dvh - 32px);
    }

    .portal-consignee-modal form {
        max-height: calc(100dvh - 32px);
    }

    .portal-consignee-modal__header,
    .portal-consignee-modal__body,
    .portal-consignee-modal__footer {
        padding-right: 16px;
        padding-left: 16px;
    }

    .portal-consignee-modal__empty {
        grid-template-columns: 40px minmax(0, 1fr);
    }

    .portal-consignee-modal__empty .button {
        grid-column: 1 / -1;
        justify-content: center;
    }

    .portal-consignee-modal__footer {
        align-items: stretch;
        flex-direction: column;
    }

    .portal-consignee-modal__footer p {
        max-width: none;
    }

    .portal-consignee-modal__footer > div {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .portal-consignee-modal__footer .button {
        justify-content: center;
    }
}

.courier-shipment-readiness-panel__proofs {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    padding-top: 16px;
    border-top: 1px solid #c4e6d1;
}

.courier-shipment-readiness-proof {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    padding: 0 10px;
}

.courier-shipment-readiness-proof:first-child {
    padding-left: 0;
}

.courier-shipment-readiness-proof + .courier-shipment-readiness-proof {
    border-left: 1px solid #c4e6d1;
}

.courier-shipment-readiness-proof__icon {
    display: grid;
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    place-items: center;
    border-radius: 50%;
    background: #e4f4e9;
    color: #148348;
}

.courier-shipment-readiness-proof__icon svg {
    width: 16px;
    height: 16px;
}

.courier-shipment-readiness-proof strong,
.courier-shipment-readiness-proof > div > span {
    display: block;
}

.courier-shipment-readiness-proof strong {
    color: #07143b;
    font-size: 12px;
    font-weight: 850;
    line-height: 1.3;
}

.courier-shipment-readiness-proof span {
    margin-top: 3px;
    color: #556276;
    font-size: 11.5px;
    line-height: 1.35;
}

.courier-shipment-packages {
    overflow: hidden;
    padding: 0;
}

.courier-shipment-packages .setup-recent__head {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    padding: 18px 24px 10px;
}

.courier-shipment-packages__icon {
    display: grid;
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    place-items: center;
    border-radius: 9px;
    background: #eff6ff;
    color: #0b63f6;
}

.courier-shipment-packages__icon svg {
    width: 19px;
    height: 19px;
}

.courier-shipment-packages .pkg-table-scroll {
    padding: 0 24px 20px;
}

.pkg-ledger--shipment-detail {
    min-width: 1060px;
    overflow: visible;
    border: 1px solid #dfe5ef;
    border-radius: 10px;
}

.pkg-ledger--shipment-detail .c-track { width: 210px; }
.pkg-ledger--shipment-detail .c-customer { width: 126px; }
.pkg-ledger--shipment-detail .c-type { width: 126px; }
.pkg-ledger--shipment-detail .c-desc { width: auto; }
.pkg-ledger--shipment-detail .c-carrier { width: 132px; }
.pkg-ledger--shipment-detail .c-date { width: 124px; }
.pkg-ledger--shipment-detail .c-status { width: 136px; }

.pkg-ledger--shipment-detail thead th {
    background: #f8fafc;
    color: #5c667d;
    font-size: 11px;
    letter-spacing: 0.055em;
    padding: 12px 13px;
}

.pkg-ledger--shipment-detail tbody td {
    padding: 13px;
}

.pkg-ledger--shipment-detail .pkg-td--desc {
    color: #111b3d;
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.35;
    overflow: visible;
    overflow-wrap: anywhere;
}

.shipment-cargo-link {
    display: block;
    border: 0;
    background: transparent;
    color: #0b63f6;
    cursor: pointer;
    font: inherit;
    font-size: 15px;
    font-weight: 800;
    line-height: 1.25;
    padding: 0;
    text-align: left;
}

.shipment-cargo-link:hover {
    text-decoration: underline;
    text-underline-offset: 2px;
}

.shipment-cargo-link:focus-visible {
    outline: 2px solid rgba(11, 99, 246, 0.35);
    outline-offset: 2px;
}

.pkg-ledger--shipment-detail .pkg-carrier__name,
.pkg-ledger--shipment-detail .pkg-datestack__date {
    color: #111b3d;
    font-size: 13.5px;
    font-weight: 700;
}

.pkg-ledger--shipment-detail .pkg-datestack__time {
    color: #667085;
    font-size: 12px;
}

.pkg-ledger--shipment-detail .status-chip {
    font-size: 12px;
    padding: 4px 10px 4px 8px;
}

.pkg-ledger--shipment-detail tbody td:last-child {
    overflow: visible;
    padding-right: 16px;
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .courier-shipment-info-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .courier-shipment-secondary-grid {
        grid-template-columns: 1fr;
    }

}

@media (max-width: 760px) {
    .courier-shipment-page-head h1 {
        font-size: 24px;
    }

    .courier-shipment-page-head .portal-lede {
        font-size: 13.5px;
    }

    .courier-shipment-page-actions {
        width: 100%;
        justify-content: flex-start;
    }

    .courier-shipment-summary {
        padding: 18px;
    }

    .courier-shipment-summary__actions {
        width: 100%;
        margin-left: 0;
    }

    .courier-shipment-action {
        flex: 1 1 100%;
        min-height: 44px;
        padding: 0 14px;
        font-size: 13px;
    }

    .courier-shipment-info-grid {
        grid-template-columns: 1fr;
    }

    .courier-shipment-readiness-panel {
        grid-template-columns: 1fr;
        gap: 16px;
        padding: 20px;
    }

    .courier-shipment-readiness-panel__icon {
        width: 56px;
        height: 56px;
    }

    .courier-shipment-readiness-panel__icon svg {
        width: 29px;
        height: 29px;
    }

    .courier-shipment-readiness-panel__main {
        min-height: 0;
    }

    .courier-shipment-readiness-panel .courier-shipment-inline-action {
        width: 100%;
        justify-content: center;
    }

    .courier-shipment-readiness-panel h4 {
        font-size: 19px;
    }

    .courier-shipment-readiness-panel p {
        font-size: 14px;
    }

    .courier-shipment-readiness-panel__proofs {
        grid-template-columns: 1fr;
    }

    .courier-shipment-readiness-proof {
        padding: 14px 0;
    }

    .courier-shipment-readiness-proof:first-child {
        padding-top: 0;
    }

    .courier-shipment-readiness-proof + .courier-shipment-readiness-proof {
        border-top: 1px solid #c4e6d1;
        border-left: 0;
    }

    .courier-shipment-packages .setup-recent__head,
    .courier-shipment-packages .pkg-table-scroll {
        padding-right: 18px;
        padding-left: 18px;
    }
}

/* --- Footer --------------------------------------------------------------- */

.portal-footer {
    border-top: 1px solid var(--pulse-border);
    color: var(--pulse-muted);
    padding: 20px 0 28px;
    font-size: 12px;
}

.portal-footer p {
    margin: 0;
}

.portal-footer__note {
    margin-top: 4px;
    opacity: 0.8;
}

/* --- Responsive: portal navigation collapses behind the menu button ------- */

@media (max-width: 980px) {
    .portal-header__bar {
        gap: 10px;
        padding: 9px 18px;
    }

    .portal-nav-toggle {
        display: block;
        order: 3;
    }

    .portal-account {
        order: 2;
        margin-left: auto;
    }

    .portal-account summary {
        width: clamp(190px, 32vw, 240px);
    }

    /* Collapsed by default; the toggle opens a compact menu below the row. */
    .portal-nav {
        position: absolute;
        z-index: 25;
        top: 100%;
        right: 0;
        left: 0;
        display: none;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        border-top: 1px solid var(--pulse-border);
        border-bottom: 1px solid var(--pulse-border);
        background: var(--pulse-portal-header);
        padding: 8px 18px 12px;
        box-shadow: 0 14px 28px rgba(37, 37, 37, 0.18);
    }

    .portal-nav[data-open="true"] {
        display: flex;
    }

    .portal-nav__item {
        border-bottom: 0;
        border-left: 2px solid transparent;
        padding: 12px;
    }

    .portal-nav__item--active {
        border-bottom-color: transparent;
        border-left-color: var(--pulse-blue);
        background: #f6f9ff;
    }
}

@media (max-width: 860px) {

    .portal-container {
        padding: 0 18px;
    }

    .portal-columns {
        grid-template-columns: 1fr;
    }

    .courier-dashboard-head {
        align-items: flex-start;
    }

    .courier-dashboard-actions {
        justify-content: flex-start;
    }

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

    .courier-dashboard-metric + .courier-dashboard-metric {
        border-left: 0;
    }

    .courier-dashboard-metric:nth-child(even) {
        border-left: 1px solid #e1e8f2;
    }

    .courier-dashboard-metric:nth-child(n + 3) {
        border-top: 1px solid #e1e8f2;
    }

    .courier-dashboard-grid {
        grid-template-columns: 1fr;
    }

    .portal-account-overview {
        grid-template-columns: 1fr;
    }

    .portal-account-scope-card {
        min-height: 0;
    }

    .portal-account-scope-list {
        align-content: start;
    }

    .portal-account-links-card {
        grid-column: auto;
    }

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

    .portal-account-detail-grid div:not(:nth-child(3n + 1)) {
        border-left: 0;
        padding-left: 0;
    }

    .portal-account-detail-grid div:nth-child(even) {
        border-left: 1px solid #e3ebf5;
        padding-left: 18px;
    }

    .portal-account-summary-card__head {
        align-items: stretch;
        flex-direction: column;
    }

    .portal-account-contact-button {
        width: 100%;
    }

    .portal-account-contact-drawer {
        width: 100vw;
        border-radius: 0;
        padding: 28px 22px;
    }

    .portal-customer-hero {
        align-items: start;
        grid-template-columns: 1fr;
        padding: 28px;
    }

    .portal-customer-hero__avatar {
        width: 96px;
        height: 96px;
        font-size: 28px;
    }

    .portal-profile-card__header--with-action {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .portal-profile-contact-card__button {
        grid-column: 1 / -1;
        justify-self: start;
        width: auto;
    }

    .portal-page-head {
        flex-direction: column;
    }
}

@media (max-width: 560px) {
    .portal-header__bar {
        padding: 8px 12px;
    }

    .portal-brand-logo {
        width: 126px;
    }

    .portal-account summary {
        width: min(190px, 43vw);
    }

    .portal-page-head h1 {
        font-size: 22px;
    }

    .portal-callout {
        align-items: flex-start;
        flex-direction: column;
    }

    .portal-card {
        padding: 18px;
    }

    .courier-dashboard-ops {
        grid-template-columns: 1fr;
    }

    .courier-dashboard-metric {
        min-height: 0;
    }

    .courier-dashboard-metric:nth-child(even) {
        border-left: 0;
    }

    .courier-dashboard-metric + .courier-dashboard-metric {
        border-top: 1px solid #e1e8f2;
    }

    .portal-account-summary-card__identity {
        align-items: flex-start;
        grid-template-columns: 44px minmax(0, 1fr);
    }

    .portal-account-summary-card__identity .id-badge {
        grid-column: 1 / -1;
        justify-self: start;
    }

    .portal-account-detail-grid {
        grid-template-columns: 1fr;
    }

    .portal-account-detail-grid div:nth-child(even) {
        border-left: 0;
        padding-left: 0;
    }

    .portal-account-contact-drawer__header {
        grid-template-columns: 48px minmax(0, 1fr) auto;
        gap: 14px;
    }

    .portal-account-contact-drawer__icon {
        width: 48px;
        height: 48px;
    }

    .portal-account-contact-drawer__title h3 {
        font-size: 20px;
    }

    .portal-account-contact-segment__options,
    .portal-account-contact-actions {
        grid-template-columns: 1fr;
    }

    .portal-account-contact-note {
        grid-template-columns: 1fr;
    }

    .portal-customer-profile {
        gap: 20px;
    }

    .portal-customer-hero {
        min-height: 0;
        padding: 24px;
    }

    .portal-customer-hero h1 {
        font-size: 27px;
    }

    .portal-customer-hero__meta {
        gap: 9px 12px;
    }

    .portal-customer-hero__meta > span::before {
        display: none !important;
    }

    .portal-profile-card {
        padding: 22px;
    }

    .portal-profile-fields {
        grid-template-columns: 1fr;
    }

    .portal-profile-fields__full {
        grid-column: auto;
    }

    .portal-account-contact-backdrop.pkg-modal-backdrop--center {
        padding: 18px;
    }

    .portal-account-contact-modal {
        max-height: calc(100vh - 36px);
        padding: 20px;
    }

}

@media (max-width: 420px) {
    .portal-brand-logo {
        width: 116px;
    }

    .portal-account summary {
        width: auto;
    }

    .portal-account__copy {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .portal-stat,
    .portal-nav__item {
        transition: none;
    }
}

/* ==========================================================================
   Phase 7 · Analytics workspace
   Staff-only business-intelligence surface. Light BI cards + inline SVG chart,
   not a marketing landing page: no hero, no stock imagery, no decorative blobs.
   ========================================================================== */
.analytics {
    align-content: start;
}

/* --- Section tabs -------------------------------------------------------- */
.analytics-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    border-bottom: 1px solid var(--pulse-border);
    padding-bottom: 0;
}

.analytics-tab {
    position: relative;
    border: 0;
    border-radius: 10px 10px 0 0;
    background: transparent;
    color: #68758a;
    cursor: pointer;
    font-family: inherit;
    font-size: 13px;
    font-weight: 800;
    padding: 10px 16px;
    transition: color 140ms ease, background 140ms ease;
}

.analytics-tab:hover {
    color: var(--pulse-text);
    background: #f4f6fb;
}

.analytics-tab--active {
    color: var(--pulse-blue);
}

.analytics-tab--active::after {
    content: "";
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: -1px;
    height: 3px;
    border-radius: 3px 3px 0 0;
    background: var(--pulse-blue);
}

.analytics-panel {
    display: grid;
    gap: 20px;
}

.analytics-panel.is-hidden {
    display: none;
}

/* --- KPI cards ----------------------------------------------------------- */
.pulse-kpi-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(178px, 1fr));
    gap: 14px;
}

.pulse-kpi-grid--tight {
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}

.pulse-kpi {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 7px;
    overflow: hidden;
    border: 1px solid var(--pulse-border);
    border-radius: 14px;
    background: var(--pulse-card);
    box-shadow: 0 6px 16px rgba(13, 20, 55, 0.04);
    padding: 15px 16px 14px 18px;
    transition: box-shadow 140ms ease, transform 140ms ease, border-color 140ms ease;
}

.pulse-kpi:hover {
    border-color: #cdd6e8;
    box-shadow: 0 12px 26px rgba(13, 20, 55, 0.09);
    transform: translateY(-1px);
}

.pulse-kpi__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.pulse-kpi__delta {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    padding: 2px 7px;
    white-space: nowrap;
}

.pulse-kpi__delta-arrow {
    font-size: 10px;
    line-height: 1;
}

.pulse-kpi__delta--up { background: #e4f6ec; color: #0f7a43; }
.pulse-kpi__delta--down { background: #fdeceb; color: #c0392b; }
.pulse-kpi__delta--flat { background: #eef1f8; color: #68758a; }

.pulse-kpi__foot {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 10px;
    margin-top: 2px;
}

.pulse-kpi__spark {
    flex: 0 0 auto;
    width: 74px;
    height: 26px;
    overflow: visible;
}

.pulse-kpi__spark-line {
    fill: none;
    stroke: #b8c2d8;
    stroke-width: 1.6px;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
}

.pulse-kpi__spark-dot {
    fill: #b8c2d8;
    stroke: var(--pulse-card);
    stroke-width: 1px;
}

.pulse-kpi__spark--up .pulse-kpi__spark-line { stroke: #12a05a; }
.pulse-kpi__spark--up .pulse-kpi__spark-dot { fill: #12a05a; }
.pulse-kpi__spark--down .pulse-kpi__spark-line { stroke: #d1685a; }
.pulse-kpi__spark--down .pulse-kpi__spark-dot { fill: #d1685a; }

.pulse-kpi::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--pulse-blue);
}

.pulse-kpi--blue::before { background: var(--pulse-blue); }
.pulse-kpi--gold::before { background: var(--pulse-gold); }
.pulse-kpi--teal::before { background: var(--pulse-teal); }
.pulse-kpi--orange::before { background: var(--pulse-orange); }

.pulse-kpi__label {
    margin: 0;
    color: #68758a;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.pulse-kpi__value {
    color: #17203a;
    font-size: 27px;
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: -0.01em;
    font-variant-numeric: tabular-nums;
}

.pulse-kpi__note {
    color: var(--pulse-muted);
    font-size: 12px;
    line-height: 1.3;
}

/* --- Section heads ------------------------------------------------------- */
.analytics-section-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}

.analytics-section-head h3 {
    margin: 2px 0 4px;
}

/* --- Trend chart --------------------------------------------------------- */
.analytics-overview-trend {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(280px, 0.8fr);
    gap: 18px;
    align-items: start;
}

.analytics-chart {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.analytics-chart__legend {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 6px;
}

.analytics-chart__legend-key {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #68758a;
    font-size: 12px;
    font-weight: 700;
}

.analytics-chart__legend-swatch {
    width: 18px;
    height: 3px;
    border-radius: 3px;
    background: var(--pulse-blue);
}

.analytics-chart__svg {
    display: block;
    width: 100%;
    height: auto;
    max-height: 260px;
}

.analytics-chart__grid {
    stroke: #e6ebf5;
    stroke-width: 1px;
    stroke-dasharray: 2 3;
    vector-effect: non-scaling-stroke;
}

.analytics-chart__grid-label {
    fill: #9aa4bd;
    font-size: 5px;
    font-weight: 700;
}

.analytics-chart__area {
    fill: rgba(0, 100, 210, 0.09);
    stroke: none;
}

.analytics-chart__line {
    fill: none;
    stroke: var(--pulse-blue);
    stroke-width: 2px;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
}

.analytics-chart__dot {
    fill: #ffffff;
    stroke: var(--pulse-blue);
    stroke-width: 1.4px;
    vector-effect: non-scaling-stroke;
    transition: r 120ms ease;
}

.analytics-chart__dot.is-active {
    r: 3;
    fill: var(--pulse-blue);
}

.analytics-chart__hit {
    fill: transparent;
    cursor: pointer;
}

.analytics-chart__x-label {
    fill: #68758a;
    font-size: 5.5px;
    font-weight: 700;
}

.analytics-chart__tip {
    position: absolute;
    z-index: 5;
    transform: translate(-50%, -120%);
    display: flex;
    flex-direction: column;
    gap: 1px;
    border-radius: 9px;
    background: #13233f;
    color: #ffffff;
    box-shadow: 0 12px 28px rgba(13, 20, 55, 0.28);
    padding: 7px 11px;
    pointer-events: none;
    white-space: nowrap;
}

.analytics-chart__tip[hidden] {
    display: none;
}

.analytics-chart__tip-month {
    color: #aebbd6;
    font-size: 11px;
    font-weight: 700;
}

.analytics-chart__tip-value {
    font-size: 13px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.analytics-month-card {
    border: 1px solid #edf1f8;
    border-radius: 12px;
    background: #fbfcff;
    padding: 12px;
}

.analytics-month-card__title {
    margin: 0 0 8px;
    color: #3b4667;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.analytics-table--compact th,
.analytics-table--compact td {
    padding: 8px 9px;
    font-size: 12px;
}

/* --- Ranked bars (high/low, cargo mix) ----------------------------------- */
.analytics-highlow {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 28px;
}

.analytics-highlow__cap {
    margin: 0 0 8px;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.analytics-highlow__cap--high { color: #0f7a43; }
.analytics-highlow__cap--low { color: #b4690e; }

.analytics-bar-row {
    display: grid;
    grid-template-columns: minmax(120px, 32%) 1fr auto;
    align-items: center;
    gap: 14px;
    padding: 8px 0;
    border-top: 1px solid #f0f2f8;
}

.analytics-bar-row:first-of-type {
    border-top: 0;
}

.analytics-bar-row__meta {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.analytics-bar-row__name {
    color: #17203a;
    font-weight: 800;
}

.analytics-bar-row__sub {
    color: var(--pulse-muted);
    font-size: 11px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.analytics-bar {
    height: 10px;
    border-radius: 999px;
    background: #eef1f8;
    overflow: hidden;
}

.analytics-bar__fill {
    display: block;
    height: 100%;
    border-radius: 999px;
    min-width: 2px;
}

.analytics-bar__fill--high { background: linear-gradient(90deg, #12a05a, #0f7a43); }
.analytics-bar__fill--low { background: linear-gradient(90deg, #f5af02, #ed8b00); }
.analytics-bar__fill--mix { background: linear-gradient(90deg, #0f6edb, #0a6d77); }

.analytics-bar-row__value {
    color: #17203a;
    font-size: 13px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* --- Drilldown / ranked tables ------------------------------------------- */
.analytics-table {
    min-width: 760px;
}

.analytics-table th,
.analytics-table td {
    padding: 12px 12px;
}

.analytics-table__num {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.analytics-table__total {
    font-weight: 800;
    color: #17203a;
}

.analytics-rank-name {
    font-weight: 800;
    color: #17203a;
}

.analytics-pill {
    display: inline-block;
    border: 1px solid var(--pulse-border);
    border-radius: 999px;
    background: #f4f6fb;
    color: #3b4667;
    font-size: 11px;
    font-weight: 700;
    padding: 3px 10px;
    white-space: nowrap;
}

/* In-cell value bar (ranked-account "Est. total" column) */
.analytics-cell-bar {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    width: 100%;
}

.analytics-cell-bar__track {
    flex: 1 1 auto;
    min-width: 48px;
    max-width: 130px;
    height: 8px;
    border-radius: 999px;
    background: #eef1f8;
    overflow: hidden;
}

.analytics-cell-bar__fill {
    display: block;
    height: 100%;
    border-radius: 999px;
    min-width: 2px;
    background: linear-gradient(90deg, #0f6edb, #0a6d77);
}

.analytics-cell-bar__value {
    flex: 0 0 auto;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    color: #17203a;
}

/* --- Responsive ---------------------------------------------------------- */
@media (max-width: 900px) {
    .analytics-highlow {
        grid-template-columns: 1fr;
        gap: 18px;
    }
}

@media (max-width: 620px) {
    .analytics-bar-row {
        grid-template-columns: 1fr auto;
        column-gap: 12px;
    }

    .analytics-bar-row .analytics-bar {
        grid-column: 1 / -1;
        order: 3;
    }

    .analytics-cell-bar__track {
        display: none;
    }
}

/* --- Analytics overview redesign ---------------------------------------- */
.analytics-page {
    background: #f6f8fc;
    color: #0f172a;
}

.analytics-page .workspace {
    background: #f6f8fc;
}

.analytics-toolbar {
    display: block;
    align-items: center;
    border: 1px solid #dfe5ef;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 8px 22px rgba(16, 24, 40, 0.04);
    padding: 8px;
}

.analytics-tabs--page {
    flex-wrap: nowrap;
    gap: 6px;
    min-width: 0;
    overflow-x: auto;
    border-bottom: 0;
    padding: 0;
}

.analytics-tabs--page .analytics-tab {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    flex: 0 0 auto;
    border-radius: 8px;
    color: #475467;
    font-size: 13px;
    letter-spacing: 0;
    padding: 0 13px;
}

.analytics-tabs--page .analytics-tab:hover {
    background: #f4f8ff;
    color: #0b1438;
}

.analytics-tabs--page .analytics-tab--active {
    background: #eaf2ff;
    color: var(--pulse-blue);
}

.analytics-tabs--page .analytics-tab--active::after {
    display: none;
}

.analytics-range-control {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    min-height: 38px;
    border-radius: 12px;
    background: #111827;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
    padding: 3px;
}

.analytics-range-option {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    min-height: 32px;
    border-radius: 9px;
    color: #c7cbd4;
    font-size: 12.5px;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1;
    padding: 0 11px;
    text-decoration: none;
    transition: background 0.16s ease, color 0.16s ease;
}

.analytics-range-option:hover,
.analytics-range-option:focus-visible {
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
    outline: none;
}

.analytics-range-option--active {
    background: var(--pulse-blue);
    color: #ffffff;
    box-shadow: 0 6px 14px rgba(15, 110, 219, 0.28);
}

.analytics-shell {
    display: grid;
    gap: 18px;
    width: 100%;
    max-width: 1840px;
    margin: 0 auto;
    padding: 0;
}

.analytics-page .analytics-panel {
    gap: 18px;
}

.analytics-overview-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
}

.analytics-overview-header h1 {
    margin: 0;
    color: #0b1438;
    font-size: 30px;
    line-height: 1.05;
}

.analytics-overview-header .page-subtitle {
    margin-top: 6px;
    max-width: 680px;
    color: #59677c;
    font-size: 13.5px;
}

.analytics-page .panel,
.analytics-page .pulse-kpi {
    border: 1px solid #dfe5ef;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 8px 22px rgba(16, 24, 40, 0.045);
}

.analytics-page .pulse-kpi-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.analytics-page .pulse-kpi {
    min-height: 142px;
    gap: 12px;
    padding: 18px 20px 15px;
}

.analytics-page .pulse-kpi::before {
    display: none;
}

.pulse-kpi__head {
    display: grid;
    align-items: start;
    grid-template-columns: 46px minmax(0, 1fr) auto;
    gap: 12px;
}

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

.analytics-page .pulse-kpi__label {
    color: #111a3d;
    font-size: 13px;
    letter-spacing: 0;
    text-transform: none;
}

.analytics-page .pulse-kpi__note {
    color: #59677c;
    font-size: 12px;
}

.analytics-page .pulse-kpi__value {
    color: #0b1438;
    font-size: 26px;
}

.pulse-kpi__icon {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 999px;
}

.pulse-kpi__icon svg {
    width: 22px;
    height: 22px;
}

.pulse-kpi__icon--blue { background: #eaf2ff; color: var(--pulse-blue); }
.pulse-kpi__icon--teal { background: #eaf8f0; color: #12864f; }
.pulse-kpi__icon--gold { background: #fff4d6; color: #b4690e; }
.pulse-kpi__icon--orange { background: #f4e9ff; color: #9341c9; }

.analytics-page .pulse-kpi__delta {
    align-self: start;
    padding: 4px 9px;
}

.analytics-page .pulse-kpi__spark {
    width: 100%;
    height: 30px;
    margin-top: auto;
}

.analytics-performance-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.04fr) minmax(420px, 1fr);
    gap: 18px;
    align-items: stretch;
}

.analytics-page .analytics-chart-panel,
.analytics-insights-card,
.analytics-rank-card,
.analytics-table-card {
    padding: 18px 20px;
}

.analytics-section-head--tight {
    align-items: center;
    margin-bottom: 8px;
}

.analytics-page .analytics-section-head h3,
.analytics-rank-card__head h3,
.analytics-table-card__head h3 {
    color: #0b1438;
    font-size: 18px;
    font-weight: 900;
    line-height: 1.25;
}

.analytics-page .result-summary {
    margin: 3px 0 0;
    color: #59677c;
    font-size: 12.5px;
    line-height: 1.4;
}

.analytics-section-intro {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
}

.analytics-section-tools {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
}

.analytics-section-intro h2 {
    margin: 0;
    color: #0b1438;
    font-size: 24px;
    font-weight: 900;
    line-height: 1.1;
}

.analytics-manifest-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.analytics-summary-card {
    display: grid;
    gap: 5px;
    border: 1px solid #dfe5ef;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 8px 22px rgba(16, 24, 40, 0.04);
    padding: 15px 16px;
}

.analytics-summary-card__label {
    color: #52637a;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.analytics-summary-card strong {
    color: #0b1438;
    font-size: 22px;
    font-weight: 900;
    line-height: 1.1;
}

.analytics-summary-card span:not(.analytics-summary-card__label) {
    color: #24314a;
    font-size: 12.5px;
    font-weight: 850;
}

.analytics-summary-card small {
    color: #667085;
    font-size: 12px;
    line-height: 1.35;
}

.analytics-summary-card--teal { border-top: 3px solid #17a36b; }
.analytics-summary-card--blue { border-top: 3px solid var(--pulse-blue); }
.analytics-summary-card--gold { border-top: 3px solid #f0a000; }
.analytics-summary-card--orange { border-top: 3px solid #9341c9; }

.analytics-manifest-workbench {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(360px, 0.75fr);
    gap: 18px;
    align-items: start;
}

.analytics-page .analytics-manifest-table-card,
.analytics-manifest-detail-card {
    padding: 18px 20px;
}

.analytics-page .analytics-table--manifest {
    min-width: 0;
    table-layout: fixed;
}

.analytics-page .analytics-table--manifest th,
.analytics-page .analytics-table--manifest td {
    padding-right: 10px;
    padding-left: 10px;
}

.analytics-page .analytics-table--manifest th:nth-child(1),
.analytics-page .analytics-table--manifest td:nth-child(1) {
    width: 44px;
}

.analytics-page .analytics-table--manifest th:nth-child(2),
.analytics-page .analytics-table--manifest td:nth-child(2) {
    width: 150px;
}

.analytics-page .analytics-table--manifest th:nth-child(3),
.analytics-page .analytics-table--manifest td:nth-child(3) {
    width: 150px;
}

.analytics-page .analytics-table--manifest th:nth-child(4),
.analytics-page .analytics-table--manifest td:nth-child(4),
.analytics-page .analytics-table--manifest th:nth-child(5),
.analytics-page .analytics-table--manifest td:nth-child(5) {
    width: 74px;
}

.analytics-page .analytics-table--manifest th:nth-child(6),
.analytics-page .analytics-table--manifest td:nth-child(6),
.analytics-page .analytics-table--manifest th:nth-child(7),
.analytics-page .analytics-table--manifest td:nth-child(7) {
    width: 54px;
}

.analytics-page .analytics-table--manifest th:nth-child(8),
.analytics-page .analytics-table--manifest td:nth-child(8) {
    width: 96px;
}

.analytics-page .analytics-table--manifest th:nth-child(9),
.analytics-page .analytics-table--manifest td:nth-child(9) {
    white-space: normal;
    overflow-wrap: anywhere;
}

.analytics-stack-cell {
    display: grid;
    gap: 5px;
}

.analytics-stack-cell small {
    color: #667085;
    font-size: 11px;
    line-height: 1.25;
}

.analytics-manifest-row {
    cursor: pointer;
}

.analytics-manifest-row:hover td {
    background: #f8fbff;
}

.analytics-manifest-row:focus {
    outline: none;
}

.analytics-manifest-row:focus-visible td {
    background: #eef5ff;
    box-shadow: inset 0 1px 0 #9bc2ff, inset 0 -1px 0 #9bc2ff;
}

.analytics-manifest-row.is-selected td {
    background: #f4f8ff;
}

.analytics-manifest-row.is-selected td:first-child {
    box-shadow: inset 3px 0 0 var(--pulse-blue);
}

.analytics-manifest-detail-card {
    position: sticky;
    top: 16px;
    max-height: calc(100vh - 40px);
    overflow: auto;
}

.analytics-manifest-detail {
    display: grid;
    gap: 14px;
}

.analytics-manifest-detail.is-hidden {
    display: none;
}

.analytics-detail-card-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px 12px;
}

.analytics-detail-card-header__main {
    display: grid;
    gap: 4px;
}

.analytics-detail-card-header h3 {
    margin: 0;
    color: #0b1438;
    font-size: 18px;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1.16;
}

.analytics-detail-card-header p:not(.eyebrow) {
    margin: 0;
    color: #33415f;
    font-size: 12.5px;
    font-weight: 800;
}

.analytics-detail-card-header .status-chip {
    align-self: center;
}

.analytics-focus-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    border: 1px solid #bdd5ff;
    border-radius: 14px;
    background: linear-gradient(135deg, #eef5ff, #f9fbff);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
    padding: 14px 15px;
}

.analytics-focus-total div {
    display: grid;
    gap: 5px;
}

.analytics-focus-total div span {
    color: #52637a;
    font-size: 13px;
    font-weight: 900;
}

.analytics-focus-total strong {
    color: #0b1438;
    font-size: 27px;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1;
}

.analytics-focus-total__icon {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 44px;
    height: 44px;
    border: 1px solid #c7d9f8;
    border-radius: 14px;
    background: #e5efff;
    color: #27446d;
}

.analytics-focus-total__icon svg {
    width: 29px;
    height: 29px;
}

.analytics-focus-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.analytics-focus-stats span {
    display: grid;
    gap: 4px;
    border: 1px solid #e1e7f0;
    border-radius: 12px;
    background: #ffffff;
    color: #667085;
    padding: 10px 11px;
}

.analytics-focus-stats strong {
    color: #0b1438;
    font-size: 16px;
    font-weight: 900;
    line-height: 1;
}

.analytics-focus-stats small {
    color: #33415f;
    font-size: 12px;
    font-weight: 850;
}

.analytics-detail-section {
    display: grid;
    gap: 9px;
}

.analytics-detail-section h4 {
    margin: 0;
    color: #0b1438;
    font-size: 12px;
    font-weight: 950;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.analytics-focus-meta {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    overflow: hidden;
    border: 1px solid #e1e7f0;
    border-radius: 12px;
    background: #ffffff;
}

.analytics-focus-meta p {
    display: grid;
    gap: 5px;
    margin: 0;
    border-bottom: 1px solid #e1e7f0;
    color: #667085;
    padding: 11px 13px;
}

.analytics-focus-meta p:last-child {
    border-bottom: 0;
}

.analytics-focus-meta strong {
    color: #52637a;
    font-size: 12px;
    font-weight: 850;
}

.analytics-focus-meta span {
    color: #0b1438;
    font-size: 13px;
    font-weight: 900;
}

.analytics-focus-cargo {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.analytics-cargo-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid #d4e3ff;
    border-radius: 999px;
    background: #eef5ff;
    color: #1260c5;
    font-size: 11.5px;
    font-weight: 900;
    padding: 6px 10px;
}

.analytics-cargo-chip strong {
    display: inline-grid;
    place-items: center;
    min-width: 20px;
    height: 20px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.72);
    color: #0b1438;
    font-size: 11px;
}

.analytics-cargo-chip--2 {
    border-color: #cfe8d8;
    background: #edf8f0;
    color: #147947;
}

.analytics-cargo-chip--3 {
    border-color: #dfd4fb;
    background: #f4f0ff;
    color: #6d43b3;
}

.analytics-cargo-chip--4 {
    border-color: #f6d7bd;
    background: #fff3ea;
    color: #b35b12;
}

.analytics-focus-bols {
    display: grid;
    gap: 10px;
    padding-top: 4px;
}

.analytics-focus-bol-table {
    overflow: hidden;
    border-top: 1px solid #dfe6f2;
    border-bottom: 1px solid #dfe6f2;
    background: #ffffff;
}

.analytics-focus-bol-head,
.analytics-focus-bol {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr) 44px 76px 68px;
    align-items: center;
    gap: 8px;
}

.analytics-focus-bol-head {
    color: #52637a;
    font-size: 9.5px;
    font-weight: 900;
    padding: 9px 8px;
}

.analytics-focus-bol {
    min-height: 64px;
    border-top: 1px solid #e8edf5;
    padding: 10px 8px;
    color: #24314a;
    font-size: 11.5px;
}

.analytics-focus-bol__rank {
    color: #0b1438;
    font-weight: 900;
}

.analytics-focus-bol__main,
.analytics-focus-bol__identity {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.analytics-focus-bol__identity strong {
    color: #0b1438;
    font-size: 12px;
    font-weight: 900;
}

.analytics-focus-bol__identity span,
.analytics-focus-bol__cargo {
    color: #52637a;
    font-size: 11px;
    font-weight: 750;
    line-height: 1.25;
    white-space: normal;
}

.analytics-focus-bol__pieces {
    color: #0b1438;
    font-weight: 900;
    text-align: center;
}

.analytics-focus-bol__contribution {
    display: grid;
    grid-template-columns: 1fr;
    align-items: center;
    gap: 6px;
    color: #24314a;
    font-weight: 850;
}

.analytics-focus-bol__contribution i {
    display: block;
    height: 5px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2fa;
}

.analytics-focus-bol__contribution b {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: #2c7be5;
}

.analytics-focus-bol__charge {
    color: #0b1438;
    font-size: 12px;
    font-weight: 950;
    text-align: right;
    white-space: nowrap;
}

.analytics-focus-bol--total {
    min-height: 44px;
    border-top: 1px solid #d5deeb;
    background: #fbfcff;
    font-weight: 900;
}

.analytics-detail-note {
    margin: 0;
    border-top: 1px solid #e8edf5;
    color: #7a879b;
    font-size: 12px;
    font-weight: 750;
    padding-top: 12px;
}

.analytics-selected-manifest-card {
    margin-top: 18px;
    padding: 22px 26px 24px;
}

.analytics-selected-manifest {
    display: grid;
    gap: 18px;
}

.analytics-selected-manifest.is-hidden {
    display: none;
}

.analytics-selected-manifest__header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 14px;
    align-items: start;
}

.analytics-selected-manifest__header h3 {
    margin: 4px 0 0;
    color: #0b1438;
    font-size: 26px;
    font-weight: 950;
    letter-spacing: 0;
    line-height: 1.12;
}

.analytics-selected-manifest__copy {
    margin: 10px 0 0;
    color: #52637a;
    font-size: 14px;
    font-weight: 750;
}

.analytics-full-controls {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(150px, auto) minmax(190px, auto) auto minmax(120px, 1fr);
    gap: 12px;
    align-items: center;
}

.analytics-full-search,
.analytics-full-select {
    position: relative;
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    border: 1px solid #d5deeb;
    border-radius: 8px;
    background: #ffffff;
    color: #17203a;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.03);
}

.analytics-full-search {
    width: min(100%, 330px);
}

.analytics-full-search__icon,
.analytics-full-select__icon {
    display: inline-flex;
    flex: 0 0 auto;
    width: 17px;
    height: 17px;
    margin-left: 13px;
    color: #24314a;
}

.analytics-full-search__icon svg,
.analytics-full-select__icon svg {
    width: 100%;
    height: 100%;
}

.analytics-full-search input,
.analytics-full-select select {
    width: 100%;
    min-height: 38px;
    border: 0;
    background: transparent;
    color: #17203a;
    font-family: inherit;
    font-size: 13px;
    font-weight: 800;
    outline: 0;
}

.analytics-full-search input {
    padding: 0 13px;
}

.analytics-full-search input::placeholder {
    color: #7a879b;
    font-weight: 750;
}

.analytics-full-select select {
    min-width: 126px;
    appearance: none;
    cursor: pointer;
    padding: 0 36px 0 10px;
}

.analytics-full-select--sort select {
    min-width: 170px;
}

.analytics-full-select::after {
    position: absolute;
    right: 13px;
    width: 7px;
    height: 7px;
    border-right: 2px solid #24314a;
    border-bottom: 2px solid #24314a;
    content: "";
    pointer-events: none;
    transform: translateY(-2px) rotate(45deg);
}

.analytics-full-columns .analytics-table-control {
    min-height: 40px;
    border-radius: 8px;
    font-size: 13px;
    padding-right: 13px;
    padding-left: 13px;
}

.analytics-full-row-count {
    justify-self: end;
    color: #52637a;
    font-size: 13px;
    font-weight: 800;
    white-space: nowrap;
}

.analytics-piece-mix-strip {
    display: flex;
    align-items: center;
    gap: 18px;
    min-height: 62px;
    border: 1px solid #dfe6f2;
    border-radius: 10px;
    background: #fbfcff;
    padding: 11px 16px;
}

.analytics-piece-mix-strip h4 {
    flex: 0 0 auto;
    margin: 0;
    color: #0b1438;
    font-size: 13px;
    font-weight: 900;
}

.analytics-piece-mix-strip__chips,
.analytics-cargo-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
}

.analytics-cargo-type-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 32px;
    border: 1px solid #d4e3ff;
    border-radius: 8px;
    background: #f2f7ff;
    color: #14213d;
    font-size: 12px;
    font-weight: 850;
    line-height: 1;
    padding: 5px 9px;
    white-space: nowrap;
}

.analytics-cargo-type-chip strong {
    color: var(--pulse-blue);
    font-size: 12.5px;
    font-weight: 950;
}

.analytics-cargo-type-chip__icon {
    position: relative;
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
    width: 15px;
    height: 15px;
    border: 1.8px solid currentColor;
    border-radius: 3px;
    opacity: 0.92;
}

.analytics-cargo-type-chip__icon::after {
    width: 5px;
    height: 5px;
    border-top: 1.8px solid currentColor;
    border-left: 1.8px solid currentColor;
    content: "";
    transform: rotate(45deg);
}

.analytics-cargo-type-chip--d-box,
.analytics-cargo-type-chip--e-box,
.analytics-cargo-type-chip--eh-box {
    border-color: #d9cdfb;
    background: #f6f2ff;
    color: #5d3ca7;
}

.analytics-cargo-type-chip--barrel {
    border-color: #f5d9a8;
    background: #fff7e9;
    color: #9a5b00;
}

.analytics-cargo-type-chip--barrel .analytics-cargo-type-chip__icon {
    border-radius: 999px;
}

.analytics-cargo-type-chip--pallet,
.analytics-cargo-type-chip--half-pallet {
    border-color: #d8cdf8;
    background: #f8f4ff;
    color: #5940a5;
}

.analytics-cargo-type-chip--pallet .analytics-cargo-type-chip__icon,
.analytics-cargo-type-chip--half-pallet .analytics-cargo-type-chip__icon {
    border-radius: 2px;
}

.analytics-cargo-type-chip--d-box {
    border-color: #bfebd0;
    background: #effaf3;
    color: #147947;
}

.analytics-cargo-type-chip--d-box .analytics-cargo-type-chip__icon::after {
    width: 8px;
    height: 0;
    border-top: 1.8px solid currentColor;
    border-left: 0;
    transform: none;
}

.analytics-cargo-type-chip--box-36 {
    border-color: #cce3fb;
    background: #f1f8ff;
    color: #1565b4;
}

.analytics-cargo-type-chip--appliance-furniture,
.analytics-cargo-type-chip--crate,
.analytics-cargo-type-chip--loose,
.analytics-cargo-type-chip--other {
    border-color: #dfe6f2;
    background: #f8fafc;
    color: #475467;
}

.analytics-page .analytics-table--selected-bols {
    min-width: 980px;
}

.analytics-page .analytics-table--selected-bols th {
    padding-top: 12px;
    padding-bottom: 12px;
    font-size: 12px;
}

.analytics-page .analytics-table--selected-bols td {
    padding-top: 13px;
    padding-bottom: 13px;
}

.analytics-page .analytics-table--selected-bols tbody tr:hover td {
    background: #f8fbff;
}

.analytics-bol-link {
    color: var(--pulse-blue);
    font-size: 15px;
    font-weight: 950;
    text-decoration: none;
}

.analytics-bol-link:hover,
.analytics-bol-link:focus-visible {
    text-decoration: underline;
}

.analytics-page .analytics-table--selected-bols tfoot td {
    border-top: 1px solid #d5deeb;
    border-bottom: 0;
    background: #f7faff;
    color: #0b1438;
    font-weight: 900;
    padding-top: 14px;
    padding-bottom: 14px;
}

.analytics-contribution-cell {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    min-width: 122px;
}

.analytics-contribution-cell strong {
    color: #0b1438;
    font-size: 12px;
    font-weight: 900;
}

.analytics-contribution-cell i {
    display: block;
    width: 72px;
    height: 5px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2fa;
}

.analytics-contribution-cell b {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: #2c7be5;
}

.analytics-selected-manifest__note {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    color: #52637a;
    font-size: 12.5px;
    font-weight: 750;
}

.analytics-selected-manifest__note span {
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
    width: 18px;
    height: 18px;
    border: 1px solid #9aa9bd;
    border-radius: 999px;
    color: #52637a;
    font-size: 12px;
    font-weight: 950;
    font-family: Georgia, serif;
}

.analytics-chart-actions {
    display: inline-flex;
    gap: 2px;
    border: 1px solid #dce4ef;
    border-radius: 9px;
    background: #f7f9fd;
    padding: 3px;
}

.analytics-segment {
    min-height: 28px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: #52637a;
    cursor: pointer;
    font-family: inherit;
    font-size: 11.5px;
    font-weight: 850;
    padding: 0 12px;
}

.analytics-segment--active {
    background: #ffffff;
    color: var(--pulse-blue);
    box-shadow: 0 1px 3px rgba(16, 24, 40, 0.08);
}

.analytics-peak-badge {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    margin: 7px 0 10px;
    border: 1px solid #f8df9f;
    border-radius: 7px;
    background: #fff8e7;
    color: #7a4d00;
    font-size: 12px;
    font-weight: 850;
    padding: 7px 11px;
}

.analytics-chart--large {
    min-height: 300px;
}

.analytics-page .analytics-chart__svg {
    max-height: none;
    min-height: 286px;
}

.analytics-page .analytics-chart__grid {
    stroke: #dde5f0;
}

.analytics-page .analytics-chart__grid-label {
    fill: #52637a;
    font-size: 9px;
}

.analytics-page .analytics-chart__line {
    stroke-width: 2.6px;
}

.analytics-page .analytics-chart__area {
    fill: rgba(0, 100, 210, 0.12);
}

.analytics-page .analytics-chart__x-label {
    fill: #42526a;
    font-size: 9px;
}

.analytics-insight-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 18px;
}

.analytics-insight-tile {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 3px 10px;
    border: 1px solid #e1e7f0;
    border-radius: 10px;
    background: #fbfcff;
    padding: 13px;
}

.analytics-insight-tile__icon {
    display: grid;
    width: 34px;
    height: 34px;
    grid-row: 1 / span 3;
    place-items: center;
    border-radius: 999px;
}

.analytics-insight-tile__icon svg {
    width: 18px;
    height: 18px;
}

.analytics-insight-tile__icon--blue { background: #eaf2ff; color: var(--pulse-blue); }
.analytics-insight-tile__icon--green { background: #eaf8f0; color: #12864f; }
.analytics-insight-tile__icon--purple { background: #f4e9ff; color: #9341c9; }

.analytics-insight-tile small {
    color: #59677c;
    font-size: 11px;
    font-weight: 800;
}

.analytics-insight-tile strong {
    color: #0b1438;
    font-size: 14px;
    font-weight: 900;
}

.analytics-insight-tile span:not(.analytics-insight-tile__icon) {
    color: #17203a;
    font-size: 12px;
    font-weight: 800;
}

.analytics-page .analytics-month-card__title {
    margin: 0 0 8px;
    color: #0b1438;
    font-size: 14px;
    letter-spacing: 0;
    text-transform: none;
}

.analytics-monthly-table tr.analytics-row--current td {
    background: #eefaf3;
}

.analytics-page .analytics-monthly-table {
    min-width: 0;
}

.analytics-page .analytics-monthly-table th,
.analytics-page .analytics-monthly-table td {
    padding-right: 10px;
    padding-left: 10px;
}

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

.analytics-rank-card__head,
.analytics-table-card__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 14px;
}

.analytics-rank-card__head p {
    margin: 4px 0 0;
    color: #59677c;
    font-size: 12.5px;
}

.analytics-card-link {
    border: 0;
    background: transparent;
    color: var(--pulse-blue);
    cursor: pointer;
    font-family: inherit;
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
}

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

.analytics-bar-row--ranked {
    grid-template-columns: 24px minmax(220px, 0.55fr) minmax(180px, 1fr) auto;
    gap: 12px;
    min-height: 40px;
}

.analytics-rank-badge {
    display: grid;
    width: 22px;
    height: 22px;
    place-items: center;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 900;
}

.analytics-rank-badge--high {
    background: #e7f7ee;
    color: #137647;
}

.analytics-rank-badge--low {
    background: #fff2df;
    color: #b45309;
}

.analytics-table-card {
    padding-bottom: 10px;
}

.analytics-table-controls {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.analytics-table-control {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    border: 1px solid #d8e0ec;
    border-radius: 8px;
    background: #ffffff;
    color: #17203a;
    cursor: pointer;
    font-family: inherit;
    font-size: 12px;
    font-weight: 850;
    padding: 0 12px;
}

.analytics-table-select {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.analytics-table-select select {
    min-height: 34px;
    appearance: none;
    border: 1px solid #d8e0ec;
    border-radius: 8px;
    background: #ffffff;
    color: #17203a;
    cursor: pointer;
    font-family: inherit;
    font-size: 12px;
    font-weight: 850;
    line-height: 1;
    padding: 0 34px 0 12px;
}

.analytics-table-caret {
    position: absolute;
    right: 11px;
    top: 50%;
    width: 15px;
    height: 15px;
    color: #667085;
    pointer-events: none;
    transform: translateY(-50%);
}

.analytics-table-caret--inline {
    position: static;
    width: 15px;
    height: 15px;
    transform: none;
}

.analytics-table-control svg {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
}

.analytics-column-menu {
    position: relative;
}

.analytics-column-menu summary {
    list-style: none;
}

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

.analytics-column-menu__panel {
    position: absolute;
    z-index: 12;
    top: calc(100% + 8px);
    right: 0;
    display: grid;
    min-width: 190px;
    gap: 2px;
    border: 1px solid #d8e0ec;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.14);
    padding: 8px;
}

.analytics-column-menu__panel label {
    display: flex;
    align-items: center;
    gap: 9px;
    border-radius: 7px;
    color: #26344d;
    cursor: pointer;
    font-size: 12px;
    font-weight: 800;
    padding: 8px;
}

.analytics-column-menu__panel label:hover {
    background: #f3f7fc;
}

.analytics-column-menu__panel input {
    width: 14px;
    height: 14px;
    accent-color: var(--pulse-blue);
}

.analytics-page .analytics-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
}

.analytics-page .analytics-table th {
    border-bottom: 1px solid #d8e0ec;
    color: #52637a;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0;
    padding: 10px 14px;
    text-transform: none;
}

.analytics-page .analytics-table td {
    border-bottom: 1px solid #e8edf5;
    color: #26344d;
    font-size: 13px;
    padding: 11px 14px;
    vertical-align: middle;
}

.analytics-page .analytics-table.analytics-monthly-table {
    min-width: 0;
    table-layout: fixed;
}

.analytics-page .analytics-monthly-table th,
.analytics-page .analytics-monthly-table td {
    padding-right: 8px;
    padding-left: 8px;
}

.analytics-page .analytics-monthly-table th:first-child,
.analytics-page .analytics-monthly-table td:first-child {
    width: 28%;
}

.analytics-page .analytics-table tbody tr:hover td {
    background: #f8fbff;
}

.analytics-page .analytics-table tbody tr[hidden] {
    display: none;
}

.analytics-empty-row {
    color: #667085;
    font-weight: 800;
    text-align: center;
}

.analytics-page .analytics-table__total {
    color: #0b1438;
    font-weight: 900;
}

.analytics-page .manifest-identity__id {
    color: #0b1438;
    font-weight: 900;
}

.analytics-page .manifest-identity__sub {
    color: #667085;
}

.analytics-page .analytics-pill {
    border: 1px solid #dce4ef;
    background: #f2f5fa;
    color: #344054;
    font-size: 11px;
    font-weight: 850;
    padding: 3px 10px;
}

.analytics-page .analytics-pill--good {
    border-color: #bfe7d1;
    background: #e9f8ef;
    color: #137647;
}

.analytics-page .analytics-pill--warning {
    border-color: #fed7aa;
    background: #fff7ed;
    color: #b45309;
}

.analytics-sort {
    color: var(--pulse-blue);
    font-weight: 900;
}

.analytics-table-card__foot {
    margin: 10px 0 0;
    color: #667085;
    font-size: 12px;
    text-align: center;
}

@media (max-width: 1260px) {
    .analytics-toolbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .analytics-tabs--page {
        width: 100%;
        justify-content: flex-start;
    }

    .analytics-performance-grid,
    .analytics-manifest-comparison,
    .analytics-manifest-workbench {
        grid-template-columns: 1fr;
    }

    .analytics-page .pulse-kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

@media (max-width: 760px) {
    .analytics-shell {
        padding: 0;
    }

    .analytics-overview-header,
    .analytics-rank-card__head,
    .analytics-table-card__head {
        flex-direction: column;
        align-items: stretch;
    }

    .analytics-page .pulse-kpi-grid,
    .analytics-insight-grid,
    .analytics-manifest-summary {
        grid-template-columns: 1fr;
    }

    .analytics-bar-row--ranked {
        grid-template-columns: 24px 1fr auto;
    }

    .analytics-bar-row--ranked .analytics-bar {
        grid-column: 2 / -1;
    }
}

/* ==========================================================================
   Phase 7 · Analytics — Workstreams 4–6 (cargo mix, accounts, operations)
   ========================================================================== */

/* Two-up panel layout for chart + supporting panel */
.analytics-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.analytics-split--wide-first {
    grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
}

.analytics-split > .panel {
    margin: 0;
    min-width: 0;
}

/* --- Cargo Mix hero cards ------------------------------------------------ */
.cargo-overview-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.96fr) minmax(0, 1.04fr);
    gap: 22px;
    align-items: stretch;
}

.cargo-card {
    display: flex;
    flex-direction: column;
    border-color: #d9e2ef;
    border-radius: 17px;
    box-shadow: 0 16px 36px rgba(15, 23, 42, 0.07);
    padding: 24px;
}

.cargo-card__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
}

.cargo-card__header h3 {
    margin: 2px 0 5px;
    color: #0b1438;
    font-size: clamp(22px, 2vw, 28px);
    line-height: 1.08;
}

.cargo-card__period {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 86px;
    border: 1px solid #d6deeb;
    border-radius: 15px;
    background: #f6f8fc;
    color: #0b1438;
    font-size: 12px;
    line-height: 1.25;
    padding: 9px 12px;
    text-align: center;
}

.cargo-card__period strong {
    font-size: 15px;
    font-weight: 900;
}

.cargo-summary-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin: 18px 0 20px;
}

.cargo-summary-tile {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-areas:
        "icon value"
        "icon label";
    column-gap: 12px;
    align-items: center;
    min-width: 0;
    border: 1px solid #e0e7f1;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(248, 251, 255, 0.96), rgba(255, 255, 255, 0.96));
    padding: 12px 14px;
}

.cargo-summary-tile__icon,
.cargo-rank-row__icon,
.cargo-insight__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--cargo-color, #5d7494);
}

.cargo-summary-tile__icon {
    grid-area: icon;
    width: 34px;
    height: 34px;
    border: 1px solid color-mix(in srgb, var(--cargo-color, #5d7494) 22%, white);
    border-radius: 10px;
    background: color-mix(in srgb, var(--cargo-color, #5d7494) 10%, white);
}

.cargo-summary-tile svg,
.cargo-rank-row__icon svg,
.cargo-insight__icon svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.cargo-summary-tile__value {
    grid-area: value;
    overflow: hidden;
    color: #0b1438;
    font-size: 15px;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cargo-summary-tile__label {
    grid-area: label;
    color: #52637a;
    font-size: 12px;
    font-weight: 750;
}

.cargo-rank-header,
.cargo-rank-row {
    display: grid;
    grid-template-columns: 28px 42px minmax(100px, 1.08fr) minmax(96px, 1.65fr) 70px 64px;
    align-items: center;
    gap: 10px;
}

.cargo-rank-header {
    padding: 0 6px 8px;
    color: #52637a;
    font-size: 12px;
    font-weight: 850;
}

.cargo-rank-header span:first-child {
    grid-column: 1 / 5;
}

.cargo-rank-header span:nth-child(2),
.cargo-rank-header span:nth-child(3) {
    text-align: right;
}

.cargo-rank-list {
    overflow: hidden;
    border: 1px solid #e0e7f1;
    border-radius: 13px;
    background: #ffffff;
}

.cargo-rank-row {
    min-height: 47px;
    border-bottom: 1px solid #e8edf5;
    padding: 7px 10px;
}

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

.cargo-rank-row--top {
    background: linear-gradient(90deg, color-mix(in srgb, var(--cargo-color, #166fdc) 8%, white), #ffffff 68%);
}

.cargo-rank-row__rank {
    color: #52637a;
    font-size: 13px;
    font-weight: 850;
    font-variant-numeric: tabular-nums;
}

.cargo-rank-row__icon {
    width: 30px;
    height: 30px;
    border-radius: 9px;
    background: var(--cargo-color, #5d7494);
    color: #ffffff;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.22);
}

.cargo-rank-row__icon svg {
    width: 17px;
    height: 17px;
}

.cargo-rank-row__name {
    overflow: hidden;
    color: #0b1438;
    font-size: 14px;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cargo-rank-row__bar {
    position: relative;
    height: 10px;
    overflow: hidden;
    border-radius: 999px;
    background: #eef2f8;
}

.cargo-rank-row__fill {
    display: block;
    min-width: 2px;
    height: 100%;
    border-radius: inherit;
    background: var(--cargo-color, #166fdc);
}

.cargo-rank-row__pieces {
    color: #0b1438;
    font-size: 13px;
    font-weight: 900;
    font-variant-numeric: tabular-nums;
    text-align: right;
    white-space: nowrap;
}

.cargo-rank-row__share {
    justify-self: end;
    min-width: 48px;
    border: 1px solid color-mix(in srgb, var(--cargo-color, #166fdc) 20%, #d9e2ef);
    border-radius: 999px;
    background: color-mix(in srgb, var(--cargo-color, #166fdc) 7%, white);
    color: #0b1438;
    font-size: 12px;
    font-weight: 900;
    font-variant-numeric: tabular-nums;
    padding: 4px 8px;
    text-align: center;
}

.cargo-trend-chart {
    display: flex;
    flex: 1;
    flex-direction: column;
    border: 1px solid #e0e7f1;
    border-radius: 15px;
    background: #fbfcff;
    padding: 14px 16px 12px;
}

.cargo-trend-chart .analytics-stack {
    display: flex;
    flex: 1;
    flex-direction: column;
}

.cargo-trend-chart .analytics-stack__legend {
    flex: 0 0 auto;
    margin: 0 0 14px;
}

.analytics-stack--cargo .analytics-stack__legend-key {
    color: #52637a;
    font-size: 12px;
    font-weight: 850;
}

.analytics-stack--cargo .analytics-stack__swatch {
    width: 11px;
    height: 11px;
    border-radius: 4px;
}

.analytics-stack__axis-title {
    fill: #52637a;
    font-size: 6px;
    font-weight: 850;
}

.analytics-stack--cargo .analytics-stack__svg {
    flex: 1;
    min-height: 360px;
    max-height: none;
}

.analytics-stack--cargo .analytics-stack__grid {
    stroke: #dfe6f1;
    stroke-dasharray: 2 4;
}

.analytics-stack--cargo .analytics-stack__grid-label,
.analytics-stack--cargo .analytics-stack__x-label {
    fill: #667085;
    font-weight: 850;
}

.analytics-stack--cargo .analytics-stack__seg {
    stroke: rgba(255, 255, 255, 0.78);
    stroke-width: 0.7px;
}

.analytics-stack--cargo .analytics-stack__seg:focus {
    outline: none;
    filter: brightness(0.94);
}

.analytics-stack__total {
    fill: #0b1438;
    font-size: 6px;
    font-weight: 950;
    font-variant-numeric: tabular-nums;
}

.cargo-insight-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    margin-top: 16px;
    border: 1px solid #e0e7f1;
    border-radius: 14px;
    background: #ffffff;
}

.cargo-insight {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 10px;
    align-items: center;
    min-width: 0;
    border-right: 1px solid #e6ebf4;
    padding: 13px 16px;
    color: #40516b;
    font-size: 13px;
    line-height: 1.3;
}

.cargo-insight:last-child {
    border-right: 0;
}

.cargo-insight__icon {
    width: 34px;
    height: 34px;
    border-radius: 999px;
    background: var(--cargo-color, #166fdc);
    color: #ffffff;
}

.cargo-insight strong {
    display: block;
    color: #0b1438;
    font-weight: 900;
}

.cargo-type--36-box {
    --cargo-color: #166fdc;
}

.cargo-type--barrel {
    --cargo-color: #0b8f9a;
}

.cargo-type--d-box {
    --cargo-color: #f2b705;
}

.cargo-type--eh-box {
    --cargo-color: #f28c00;
}

.cargo-type--e-box {
    --cargo-color: #6d5bd0;
}

.cargo-type--pallet {
    --cargo-color: #1f9d6b;
}

.cargo-type--half-pallet {
    --cargo-color: #4f7dd6;
}

.cargo-type--d-box {
    --cargo-color: #5d7494;
}

.cargo-type--appliance-furniture,
.cargo-type--crate,
.cargo-type--loose {
    --cargo-color: #7f8797;
}

.cargo-type--other {
    --cargo-color: #8996ab;
}

/* --- Cargo Mix piece-type drilldown ------------------------------------- */
.cargo-drilldown-card {
    border-color: #d9e2ef;
    border-radius: 17px;
    box-shadow: 0 16px 36px rgba(15, 23, 42, 0.06);
    padding: 24px;
}

.cargo-drilldown-card__head {
    margin-bottom: 10px;
}

.cargo-drill-helper,
.cargo-drill-footer {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #2f5591;
    font-size: 13px;
    font-weight: 750;
    line-height: 1.45;
}

.cargo-drill-helper {
    border: 1px solid #cfe0fb;
    border-radius: 8px;
    background: #f6f9ff;
    margin: 0 0 20px;
    padding: 10px 12px;
}

.cargo-drill-helper span,
.cargo-drill-footer span {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 999px;
    background: #e8f1ff;
    color: #1b63b7;
}

.cargo-drill-helper svg,
.cargo-drill-footer svg {
    width: 15px;
    height: 15px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.analytics-page .cargo-drill-table {
    min-width: 900px;
    border-collapse: collapse;
}

.analytics-page .cargo-drill-table th {
    border-bottom: 1px solid #dce4ef;
    padding-top: 13px;
    padding-bottom: 13px;
    vertical-align: bottom;
}

.analytics-page .cargo-drill-table th:nth-child(1),
.analytics-page .cargo-drill-table td:nth-child(1) {
    width: 25%;
}

.analytics-page .cargo-drill-table th:nth-child(2),
.analytics-page .cargo-drill-table td:nth-child(2) {
    width: 29%;
    text-align: left;
}

.analytics-page .cargo-drill-table th:nth-child(3),
.analytics-page .cargo-drill-table td:nth-child(3),
.analytics-page .cargo-drill-table th:nth-child(4),
.analytics-page .cargo-drill-table td:nth-child(4),
.analytics-page .cargo-drill-table th:nth-child(5),
.analytics-page .cargo-drill-table td:nth-child(5) {
    width: 15.33%;
}

.analytics-page .cargo-drill-table td {
    border-bottom: 1px solid #e1e8f2;
    padding-top: 10px;
    padding-bottom: 10px;
}

.analytics-page .cargo-drill-table tbody tr:nth-child(-n + 3) td {
    background: linear-gradient(90deg, color-mix(in srgb, var(--cargo-color, #166fdc) 5%, white), #ffffff 56%);
}

.analytics-page .cargo-drill-table tbody tr:hover td {
    background: #f7fbff;
}

.cargo-sort-label {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    border: 0;
    background: transparent;
    color: #0b1438;
    cursor: pointer;
    font-size: 12px;
    font-weight: 900;
    font: inherit;
    margin: 0;
    padding: 0;
    white-space: nowrap;
}

.cargo-sort-label:hover,
.cargo-sort-label:focus-visible {
    color: #166fdc;
}

.cargo-sort-label svg {
    width: 13px;
    height: 13px;
    fill: none;
    stroke: #61728a;
    stroke-width: 2.2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.cargo-column-note {
    display: block;
    margin-top: 4px;
    color: #52637a;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}

.cargo-piece-cell {
    display: inline-grid;
    grid-template-columns: 20px 34px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.cargo-piece-cell__rank {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    color: #f3a819;
}

.cargo-piece-cell__rank svg {
    width: 15px;
    height: 15px;
    fill: currentColor;
}

.cargo-piece-cell__rank--empty {
    color: transparent;
}

.cargo-piece-cell__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 999px;
    background: var(--cargo-color, #5d7494);
    color: #ffffff;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.24);
}

.cargo-piece-cell__icon svg {
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.cargo-piece-cell__name {
    overflow: hidden;
    color: #0b1438;
    font-size: 14px;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cargo-piece-total {
    display: grid;
    grid-template-columns: 48px minmax(120px, 190px);
    justify-content: start;
    align-items: center;
    gap: 12px;
}

.cargo-piece-total strong {
    color: #0b1438;
    font-size: 16px;
    font-weight: 900;
}

.cargo-piece-total__bar {
    overflow: hidden;
    height: 7px;
    border-radius: 999px;
    background: #e8eef7;
}

.cargo-piece-total__bar span {
    display: block;
    min-width: 2px;
    height: 100%;
    border-radius: inherit;
    background: var(--cargo-color, #166fdc);
}

.cargo-drill-number {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
    min-width: 54px;
}

.cargo-drill-number strong {
    color: #0b1438;
    font-size: 16px;
    font-weight: 900;
}

.cargo-drill-number small {
    color: #52637a;
    font-size: 11px;
    font-weight: 700;
}

.cargo-drill-number--avg strong {
    font-size: 18px;
}

.cargo-drill-footer {
    margin: 15px 0 0;
    color: #40516b;
}

/* --- Ranked bar list wrapper --------------------------------------------- */
.analytics-rank--compact .analytics-bar-row {
    padding: 5px 0;
    grid-template-columns: minmax(70px, 34%) 1fr auto;
    gap: 10px;
}

/* --- Stacked column chart ------------------------------------------------ */
.analytics-stack {
    width: 100%;
}

.analytics-stack__legend {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 14px;
    margin-bottom: 8px;
}

.analytics-stack__legend-key {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #68758a;
    font-size: 11px;
    font-weight: 700;
}

.analytics-stack__swatch {
    width: 10px;
    height: 10px;
    border-radius: 3px;
}

.analytics-stack__svg {
    display: block;
    width: 100%;
    height: auto;
    max-height: 260px;
}

.analytics-stack__grid {
    stroke: #e6ebf5;
    stroke-width: 1px;
    stroke-dasharray: 2 3;
    vector-effect: non-scaling-stroke;
}

.analytics-stack__grid-label {
    fill: #9aa4bd;
    font-size: 5px;
    font-weight: 700;
}

.analytics-stack__seg {
    transition: opacity 120ms ease;
}

.analytics-stack__seg:hover {
    opacity: 0.82;
}

.analytics-stack__x-label {
    fill: #68758a;
    font-size: 5.5px;
    font-weight: 700;
}

/* --- BOL drilldown table extras ------------------------------------------ */
.analytics-table--wide {
    min-width: 940px;
}

.analytics-owner {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.analytics-owner__name {
    font-weight: 700;
    color: #17203a;
}

.analytics-owner__under {
    display: block;
    color: var(--pulse-muted);
    font-size: 11px;
}

.analytics-pill--muted {
    align-self: flex-start;
    background: #f4f6fb;
    color: #68758a;
    font-size: 10px;
    padding: 2px 8px;
}

.analytics-cargo {
    color: #3b4667;
    font-size: 12px;
}

.analytics-rank-num {
    color: #9aa4bd;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

/* --- Direct vs courier channel mix --------------------------------------- */
.analytics-channels {
    display: grid;
    gap: 14px;
    margin-bottom: 18px;
}

.analytics-channel__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 6px;
}

.analytics-channel__key {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #17203a;
    font-weight: 800;
    font-size: 13px;
}

.analytics-channel__swatch {
    width: 12px;
    height: 12px;
    border-radius: 4px;
}

.analytics-channel__pct {
    color: #17203a;
    font-weight: 900;
    font-variant-numeric: tabular-nums;
}

.analytics-channel__bar {
    height: 12px;
    border-radius: 999px;
    background: #eef1f8;
    overflow: hidden;
}

.analytics-channel__fill {
    display: block;
    height: 100%;
    border-radius: 999px;
    min-width: 2px;
}

.analytics-channel__meta {
    margin: 6px 0 0;
    color: var(--pulse-muted);
    font-size: 12px;
}

/* --- Customers & Couriers dashboard ------------------------------------- */
.accounts-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 18px;
}

.accounts-hero h2 {
    margin: 0;
    color: #070f35;
    font-size: 30px;
    line-height: 1.08;
}

.accounts-hero .page-subtitle {
    max-width: 720px;
    margin-top: 6px;
}

.accounts-hero__controls {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    flex: 0 0 auto;
}

.accounts-date-picker {
    position: relative;
}

.accounts-date-picker summary,
.accounts-filter-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 44px;
    border: 1px solid #d9e2ef;
    border-radius: 10px;
    background: #ffffff;
    color: #0b1438;
    font-size: 13px;
    font-weight: 850;
    line-height: 1;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.04);
    cursor: pointer;
}

.accounts-date-picker summary {
    min-width: 178px;
    padding: 0 14px;
    list-style: none;
}

.accounts-date-picker summary::-webkit-details-marker {
    display: none;
}

.accounts-date-picker summary > span,
.accounts-filter-button svg {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #405779;
}

.accounts-date-picker summary svg,
.accounts-filter-button svg {
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.accounts-date-picker__chev {
    margin-left: auto;
    width: 15px;
    height: 15px;
}

.accounts-date-picker__menu {
    position: absolute;
    right: 0;
    top: calc(100% + 8px);
    z-index: 20;
    min-width: 284px;
    border: 1px solid #d9e2ef;
    border-radius: 14px;
    background: #ffffff;
    padding: 10px;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.12);
}

.accounts-date-picker__menu .analytics-range-control {
    justify-content: stretch;
}

.accounts-filter-button {
    padding: 0 16px;
}

.accounts-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 18px;
}

.accounts-mix-card,
.accounts-rank-card {
    border: 1px solid #dbe4f0;
    border-radius: 17px;
    background: #ffffff;
    box-shadow: 0 16px 36px rgba(15, 23, 42, 0.055);
}

.accounts-mix-card {
    display: flex;
    min-width: 0;
    min-height: 354px;
    flex-direction: column;
    gap: 20px;
    padding: 24px;
}

.accounts-card-head h3 {
    margin: 0;
    color: #1d2b53;
    font-size: 14px;
    font-weight: 950;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.accounts-card-head p {
    margin: 6px 0 0;
    color: #405173;
    font-size: 13px;
    font-weight: 650;
}

.accounts-mix-card__body {
    display: grid;
    grid-template-columns: minmax(154px, 0.82fr) minmax(0, 1.18fr);
    align-items: center;
    gap: 22px;
    flex: 1 1 auto;
    min-width: 0;
}

.accounts-donut {
    width: min(100%, 202px);
    aspect-ratio: 1;
    border-radius: 50%;
    display: grid;
    place-items: center;
}

.accounts-donut--split {
    background: conic-gradient(var(--primary) calc(var(--pct) * 1%), var(--secondary) 0);
}

.accounts-donut--reliance {
    background: conic-gradient(#0f6edb calc(var(--pct) * 1%), #ecf0f6 0);
}

.accounts-donut__hole {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 68%;
    height: 68%;
    border-radius: 50%;
    background: #ffffff;
    color: #0b1438;
    text-align: center;
    box-shadow: inset 0 0 0 1px #edf1f7;
}

.accounts-donut__hole span,
.accounts-donut__hole small {
    color: #405173;
    font-size: 12px;
    font-weight: 750;
    line-height: 1.25;
}

.accounts-donut__hole strong {
    margin-top: 7px;
    color: #07123b;
    font-size: 21px;
    font-weight: 950;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.accounts-mix-card--reliance .accounts-donut__hole strong {
    margin: 0 0 7px;
    font-size: 32px;
}

.accounts-mix-list,
.accounts-conc-list {
    display: grid;
    gap: 0;
    min-width: 0;
}

.accounts-mix-row,
.accounts-conc-list li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    border-bottom: 1px solid #e2e8f2;
    padding: 14px 0;
}

.accounts-mix-row:first-child,
.accounts-conc-list li:first-child {
    padding-top: 0;
}

.accounts-mix-row:last-child,
.accounts-conc-list li:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.accounts-mix-row > div {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    column-gap: 10px;
    min-width: 0;
}

.accounts-mix-row strong {
    color: #0b1438;
    font-size: 14px;
    font-weight: 950;
}

.accounts-mix-row small {
    grid-column: 2;
    color: #50627f;
    font-size: 12.5px;
    font-weight: 650;
    line-height: 1.35;
}

.accounts-mix-row b,
.accounts-conc-list strong {
    color: #07123b;
    font-size: 15px;
    font-weight: 950;
    font-variant-numeric: tabular-nums;
}

.accounts-swatch {
    width: 13px;
    height: 13px;
    border-radius: 4px;
}

.accounts-insight,
.accounts-reliance-footer,
.accounts-rank-foot {
    margin: auto 0 0;
    border: 1px solid #cfe0fb;
    border-radius: 8px;
    background: #f5f9ff;
    color: #0f5fb8;
    font-size: 12px;
    font-weight: 750;
    line-height: 1.45;
}

.accounts-insight {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
}

.accounts-insight span {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    width: 17px;
    height: 17px;
    border-radius: 50%;
    background: #0f6edb;
    color: #ffffff;
    font-size: 11px;
    font-weight: 900;
}

.accounts-conc-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.accounts-conc-list li span {
    display: flex;
    flex-direction: column;
    gap: 3px;
    color: #0b1438;
    font-size: 13px;
    font-weight: 850;
}

.accounts-conc-list li small {
    color: #50627f;
    font-size: 11px;
    font-weight: 650;
}

.accounts-reliance-footer {
    padding: 10px 12px;
    color: #405173;
}

.accounts-rank-card {
    padding: 24px;
}

.accounts-rank-card__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 14px;
}

.accounts-rank-card__head h3 {
    margin: 0;
    color: #07123b;
    font-size: 22px;
    line-height: 1.15;
}

.accounts-rank-by {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
    color: #344054;
    font-size: 12px;
    font-weight: 750;
}

.accounts-rank-by select {
    min-width: 142px;
    min-height: 40px;
    border: 1px solid #d9e2ef;
    border-radius: 9px;
    background: #ffffff;
    color: #0b1438;
    font-size: 13px;
    font-weight: 800;
    padding: 0 34px 0 12px;
}

.accounts-rank-wrap {
    border: 1px solid #dfe7f2;
    border-radius: 10px;
    overflow: auto;
}

.analytics-page .accounts-rank-table {
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
}

.analytics-page .accounts-rank-table th {
    border-bottom: 1px solid #dfe7f2;
    color: #405173;
    font-size: 11px;
    letter-spacing: 0.04em;
}

.analytics-page .accounts-rank-table td {
    border-bottom: 1px solid #e4ebf4;
    padding-top: 10px;
    padding-bottom: 10px;
    vertical-align: middle;
}

.analytics-page .accounts-rank-table tbody tr:last-child td {
    border-bottom: 0;
}

.analytics-page .accounts-rank-table tbody tr:hover td,
.analytics-page .accounts-rank-table tbody tr.is-selected td {
    background: #f7fbff;
}

.accounts-rank-table__rank {
    width: 66px;
    text-align: center;
}

.accounts-rank-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 26px;
    height: 26px;
    border: 1px solid #dbe3ef;
    border-radius: 999px;
    background: #f2f5fa;
    color: #293858;
    font-size: 12px;
    font-weight: 900;
    font-variant-numeric: tabular-nums;
}

.accounts-rank-badge--gold {
    border-color: #f5d487;
    background: #fff2ce;
    color: #8a5a00;
}

.accounts-rank-badge--silver {
    border-color: #d7dee9;
    background: #eef2f7;
    color: #435067;
}

.accounts-rank-badge--bronze {
    border-color: #f2c7af;
    background: #fff0e8;
    color: #98512f;
}

.accounts-name {
    display: block;
    color: #07123b;
    font-size: 14px;
    font-weight: 950;
    line-height: 1.15;
}

.accounts-type-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #cfe0fb;
    border-radius: 999px;
    background: #f3f8ff;
    color: #0f5fb8;
    font-size: 11px;
    font-weight: 850;
    padding: 4px 10px;
    white-space: nowrap;
}

.accounts-type-pill--courier_company {
    border-color: #bfe8ee;
    background: #eefbfc;
    color: #067784;
}

.accounts-type-pill--courier_customer {
    border-color: #c7ece7;
    background: #effdfa;
    color: #08796f;
}

.accounts-type-pill--direct_customer {
    border-color: #d8cffb;
    background: #f5f2ff;
    color: #5842c3;
}

.accounts-rank-table__charge {
    width: 270px;
    text-align: right;
}

.accounts-charge-cell {
    display: grid;
    grid-template-columns: minmax(110px, 1fr) 78px;
    align-items: center;
    justify-content: end;
    gap: 14px;
}

.accounts-charge-cell__track {
    height: 8px;
    border-radius: 999px;
    background: #edf1f7;
    overflow: hidden;
}

.accounts-charge-cell__fill {
    display: block;
    height: 100%;
    min-width: 3px;
    border-radius: 999px;
    background: linear-gradient(90deg, #0f6edb, #0a8a99);
}

.accounts-charge-cell strong {
    color: #07123b;
    font-size: 13px;
    font-weight: 950;
    font-variant-numeric: tabular-nums;
}

.accounts-sort {
    color: #6b7b94;
    font-size: 11px;
    margin-left: 4px;
}

.accounts-rank-foot {
    border-color: transparent;
    background: transparent;
    color: #405173;
    padding: 12px 0 0;
    text-align: center;
}

/* --- Concentration indicator (donut) ------------------------------------- */
.analytics-concentration {
    display: flex;
    flex-direction: column;
}

.analytics-donut {
    --size: 132px;
    width: var(--size);
    height: var(--size);
    margin: 2px auto 16px;
    border-radius: 50%;
    background: conic-gradient(var(--pulse-blue) calc(var(--pct) * 1%), #eaeef6 0);
    display: grid;
    place-items: center;
}

.analytics-donut__hole {
    width: 72%;
    height: 72%;
    border-radius: 50%;
    background: var(--pulse-card);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.analytics-donut__hole strong {
    font-size: 26px;
    font-weight: 900;
    color: #17203a;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.analytics-donut__hole small {
    color: var(--pulse-muted);
    font-size: 11px;
}

.analytics-conc-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 8px;
}

.analytics-conc-list li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-top: 1px solid #f0f2f8;
    padding-top: 8px;
    font-size: 13px;
    color: #3b4667;
}

.analytics-conc-list li:first-child {
    border-top: 0;
    padding-top: 0;
}

.analytics-conc-list strong {
    color: #17203a;
    font-variant-numeric: tabular-nums;
}

.analytics-fineprint {
    margin: 12px 0 0;
    color: var(--pulse-muted);
    font-size: 11px;
}

/* --- Account drilldown accordion ----------------------------------------- */
.analytics-acct-list {
    display: grid;
    gap: 10px;
}

.analytics-acct {
    border: 1px solid var(--pulse-border);
    border-radius: 12px;
    overflow: hidden;
    background: var(--pulse-card);
    transition: border-color 140ms ease, box-shadow 140ms ease;
}

.analytics-acct.is-open {
    border-color: #cdd6e8;
    box-shadow: 0 8px 20px rgba(13, 20, 55, 0.06);
}

.analytics-acct__head {
    display: flex;
    align-items: center;
    gap: 14px;
    width: 100%;
    border: 0;
    background: transparent;
    cursor: pointer;
    font-family: inherit;
    text-align: left;
    padding: 14px 16px;
}

.analytics-acct__head:hover {
    background: #f8fafd;
}

.analytics-acct__id {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1 1 auto;
    min-width: 0;
}

.analytics-acct__name {
    color: #17203a;
    font-weight: 800;
    font-size: 14px;
}

.analytics-acct__scope {
    color: var(--pulse-muted);
    font-size: 11px;
}

.analytics-acct__contrib {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    flex: 0 0 auto;
}

.analytics-acct__contrib strong {
    color: var(--pulse-blue);
    font-size: 17px;
    font-weight: 900;
    font-variant-numeric: tabular-nums;
    line-height: 1;
}

.analytics-acct__contrib small {
    color: var(--pulse-muted);
    font-size: 10px;
}

.analytics-acct__chev {
    flex: 0 0 auto;
    color: #9aa4bd;
    display: inline-flex;
    transition: transform 160ms ease;
}

.analytics-acct__chev svg {
    width: 18px;
    height: 18px;
}

.analytics-acct.is-open .analytics-acct__chev {
    transform: rotate(180deg);
}

.analytics-acct__body {
    display: none;
    border-top: 1px solid var(--pulse-border);
    padding: 16px;
}

.analytics-acct.is-open .analytics-acct__body {
    display: block;
}

.analytics-acct__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.analytics-acct__block-title {
    margin: 0 0 10px;
    color: #68758a;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.analytics-acct__spark {
    width: 100%;
    height: 42px;
    overflow: visible;
}

.analytics-acct__spark-line {
    fill: none;
    stroke: #b8c2d8;
    stroke-width: 1.8px;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
}

.analytics-acct__spark-dot { fill: #b8c2d8; }
.analytics-acct__spark--up .analytics-acct__spark-line { stroke: #12a05a; }
.analytics-acct__spark--up .analytics-acct__spark-dot { fill: #12a05a; }
.analytics-acct__spark--down .analytics-acct__spark-line { stroke: #d1685a; }
.analytics-acct__spark--down .analytics-acct__spark-dot { fill: #d1685a; }

.analytics-acct__stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 12px;
    margin-top: 12px;
}

.analytics-acct__stats div {
    display: flex;
    flex-direction: column;
}

.analytics-acct__stats span {
    color: #17203a;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.analytics-acct__stats small {
    color: var(--pulse-muted);
    font-size: 11px;
}

.analytics-acct__muted {
    color: var(--pulse-muted);
    font-size: 12px;
}

.analytics-acct__recent {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 7px;
}

.analytics-acct__recent li {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: baseline;
    gap: 10px;
    font-size: 12px;
}

.analytics-acct__recent-id {
    font-weight: 800;
    color: #17203a;
}

.analytics-acct__recent-meta {
    color: var(--pulse-muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.analytics-acct__recent-total {
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    color: #17203a;
}

/* --- Account detail drawer ---------------------------------------------- */
.analytics-account-row {
    cursor: pointer;
}

.analytics-page .analytics-account-row:hover td,
.analytics-page .analytics-account-row.is-selected td {
    background: #f3f8ff;
}

.analytics-account-row:focus-visible {
    outline: 2px solid rgba(15, 110, 219, 0.34);
    outline-offset: -2px;
}

.analytics-overlay-open {
    overflow: hidden;
}

.analytics-account-overlay {
    position: fixed;
    inset: 0;
    z-index: 90;
    display: grid;
    justify-items: end;
}

.analytics-account-overlay[hidden] {
    display: none;
}

.analytics-account-overlay__backdrop {
    position: absolute;
    inset: 0;
    border: 0;
    background: rgba(15, 23, 42, 0.34);
    backdrop-filter: blur(5px);
    cursor: pointer;
}

.analytics-account-drawer {
    position: relative;
    z-index: 1;
    width: min(560px, calc(100vw - 36px));
    height: 100%;
    overflow-y: auto;
    border-left: 1px solid #d8e2ee;
    border-radius: 22px 0 0 22px;
    background: #ffffff;
    box-shadow: -28px 0 70px rgba(15, 23, 42, 0.2);
    padding: 24px;
}

.analytics-account-drawer__close {
    position: absolute;
    top: 24px;
    right: 24px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: 1px solid #dbe3ef;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.96);
    color: #52637a;
    cursor: pointer;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.09);
}

.analytics-account-drawer__close:hover,
.analytics-account-drawer__close:focus-visible {
    color: #0b1438;
    border-color: #b9c8db;
}

.analytics-account-drawer__close svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.2;
    stroke-linecap: round;
}

.analytics-account-detail {
    display: grid;
    gap: 14px;
}

.analytics-account-detail[hidden] {
    display: none;
}

.account-detail-panel__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding-right: 48px;
}

.account-detail-panel__head h3 {
    margin: 4px 0 5px;
    color: #07123b;
    font-size: 22px;
    font-weight: 950;
    line-height: 1.1;
}

.account-detail-panel__scope {
    margin: 0;
    color: #405173;
    font-size: 13px;
    font-weight: 800;
}

.account-detail-panel__share {
    display: inline-flex;
    flex: 0 0 auto;
    flex-direction: column;
    align-items: center;
    border: 1px solid #cfe0fb;
    border-radius: 13px;
    background: #f5f9ff;
    color: #2f5591;
    padding: 8px 12px;
    box-shadow: 0 10px 22px rgba(15, 110, 219, 0.08);
}

.account-detail-panel__share strong {
    color: #0f6edb;
    font-size: 18px;
    font-weight: 950;
    line-height: 1;
}

.account-detail-panel__share small {
    margin-top: 3px;
    color: #52637a;
    font-size: 10px;
    font-weight: 800;
}

.account-detail-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    border: 1px solid #cfe0fb;
    border-radius: 16px;
    background: linear-gradient(135deg, #f2f7ff, #ffffff);
    padding: 18px 20px;
    box-shadow: 0 14px 30px rgba(15, 110, 219, 0.06);
}

.account-detail-total > div > span {
    display: block;
    color: #52637a;
    font-size: 12px;
    font-weight: 850;
}

.account-detail-total strong {
    display: block;
    margin-top: 6px;
    color: #07123b;
    font-size: 32px;
    font-weight: 950;
    line-height: 1;
    letter-spacing: 0;
    font-variant-numeric: tabular-nums;
}

.account-detail-total__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: #c7edf0;
    color: #087f8c;
}

.account-detail-total__icon svg {
    width: 28px;
    height: 28px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

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

.account-detail-kpi,
.account-detail-card {
    border: 1px solid #e0e7f1;
    border-radius: 14px;
    background: #fbfcff;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.035);
}

.account-detail-kpi {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    column-gap: 12px;
    padding: 13px;
}

.account-detail-kpi__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    grid-row: span 2;
    width: 38px;
    height: 38px;
    border-radius: 50%;
}

.account-detail-kpi__icon svg,
.account-detail-recent__icon svg {
    width: 19px;
    height: 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.account-detail-kpi__icon--teal {
    background: #e5f8f7;
    color: #0b8f88;
}

.account-detail-kpi__icon--blue {
    background: #e8f1ff;
    color: #0f6edb;
}

.account-detail-kpi__icon--violet {
    background: #f2efff;
    color: #6d5bd0;
}

.account-detail-kpi strong {
    color: #07123b;
    font-size: 20px;
    font-weight: 950;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.account-detail-kpi small {
    margin-top: 4px;
    color: #50627f;
    font-size: 12px;
    font-weight: 700;
}

.account-detail-card {
    padding: 14px 16px;
}

.account-detail-card h4 {
    margin: 0 0 12px;
    color: #405173;
    font-size: 12px;
    font-weight: 950;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.account-detail-trend {
    min-height: 78px;
    border-radius: 12px;
    background:
        linear-gradient(to bottom, rgba(10, 143, 131, 0.12), rgba(10, 143, 131, 0.01)),
        repeating-linear-gradient(to bottom, transparent 0, transparent 29px, #d8e1ef 30px);
    padding: 10px 0 4px;
}

.account-detail-spark {
    width: 100%;
    height: 62px;
    overflow: visible;
}

.account-detail-spark__line {
    fill: none;
    stroke: #0aa086;
    stroke-width: 2px;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
}

.account-detail-spark__dot {
    fill: #0aa086;
}

.account-detail-muted {
    margin: 0;
    color: #667085;
    font-size: 13px;
}

.account-detail-mix {
    display: grid;
    gap: 10px;
}

.account-detail-mix__row {
    display: grid;
    grid-template-columns: 76px minmax(0, 1fr) 84px;
    align-items: center;
    gap: 10px;
}

.account-detail-mix__label {
    color: #07123b;
    font-size: 13px;
    font-weight: 900;
}

.account-detail-mix__bar {
    height: 9px;
    border-radius: 999px;
    background: #edf1f7;
    overflow: hidden;
}

.account-detail-mix__bar span {
    display: block;
    height: 100%;
    min-width: 3px;
    border-radius: 999px;
    background: linear-gradient(90deg, #0f6edb, #0a8a99);
}

.account-detail-mix__value {
    color: #07123b;
    font-size: 12px;
    font-weight: 900;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.account-detail-recent {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.account-detail-recent li {
    display: grid;
    grid-template-columns: 20px minmax(104px, 0.86fr) minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid #e4ebf4;
    padding: 8px 0;
}

.account-detail-recent li:first-child {
    padding-top: 0;
}

.account-detail-recent li:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.account-detail-recent__icon {
    display: inline-flex;
    color: #0f6edb;
}

.account-detail-recent__id {
    color: #07123b;
    font-size: 11.5px;
    font-weight: 950;
}

.account-detail-recent__meta {
    color: #667085;
    font-size: 11.5px;
    font-weight: 700;
}

.account-detail-recent__total {
    color: #07123b;
    font-size: 11.5px;
    font-weight: 950;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

@media (max-width: 700px) {
    .analytics-account-drawer {
        width: min(100vw, 100%);
        border-radius: 18px 0 0 18px;
        padding: 22px;
    }

    .account-detail-kpis {
        grid-template-columns: 1fr;
    }

    .account-detail-mix__row,
    .account-detail-recent li {
        grid-template-columns: 1fr;
    }

    .account-detail-mix__value,
    .account-detail-recent__total {
        text-align: left;
    }
}

/* --- Operations throughput dashboard ------------------------------------- */
.operations-throughput-card {
    border-radius: 18px;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.055);
    padding: 24px;
}

.operations-section-head {
    align-items: flex-start;
    margin-bottom: 20px;
}

.operations-section-head h3 {
    color: #0b1438;
    font-size: clamp(22px, 2vw, 28px);
    line-height: 1.08;
}

.analytics-through-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.analytics-through {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 292px;
    overflow: hidden;
    border: 1px solid #dce4f0;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82);
    padding: 18px 18px 16px;
}

.analytics-through__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.analytics-through__label {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #1d2a4d;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: 0;
    text-transform: none;
}

.analytics-through__icon {
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    border: 1px solid #dbe6f5;
    border-radius: 9px;
    background: #f7faff;
    color: var(--pulse-blue);
}

.analytics-through__icon svg {
    width: 16px;
    height: 16px;
}

.analytics-through__value {
    margin-top: 18px;
    color: #0b1438;
    font-size: clamp(34px, 3.5vw, 44px);
    font-weight: 900;
    font-variant-numeric: tabular-nums;
    line-height: 0.98;
}

.analytics-through__spark {
    width: 100%;
    height: 146px;
    margin-top: auto;
    overflow: visible;
}

.analytics-through__spark-area {
    fill: rgba(15, 110, 219, 0.045);
}

.analytics-through__spark-line {
    fill: none;
    stroke: var(--pulse-blue);
    stroke-width: 2.1px;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
}

.analytics-through__spark-dot {
    fill: var(--pulse-blue);
    stroke: #ffffff;
    stroke-width: 1.8px;
}

.analytics-through--green .analytics-through__icon {
    border-color: #d5eadf;
    background: #f5fbf7;
    color: #12864f;
}

.analytics-through--green .analytics-through__spark-line {
    stroke: #12a05a;
}

.analytics-through--green .analytics-through__spark-area {
    fill: rgba(18, 160, 90, 0.05);
}

.analytics-through--green .analytics-through__spark-dot {
    fill: #12a05a;
}

.analytics-through--red .analytics-through__icon {
    border-color: #efd9d5;
    background: #fff8f7;
    color: #d1685a;
}

.analytics-through--red .analytics-through__spark-line {
    stroke: #d1685a;
}

.analytics-through--red .analytics-through__spark-area {
    fill: rgba(209, 104, 90, 0.055);
}

.analytics-through--red .analytics-through__spark-dot {
    fill: #d1685a;
}

.operations-density-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.operations-density-card {
    position: relative;
    display: grid;
    min-height: 138px;
    overflow: hidden;
    border: 1px solid #dfe5ef;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 10px 26px rgba(16, 24, 40, 0.045);
    padding: 18px 18px 16px;
}

.operations-density-card__icon {
    position: absolute;
    display: grid;
    top: 18px;
    right: 18px;
    width: 34px;
    height: 34px;
    place-items: center;
    border: 1px solid #d8e4f6;
    border-radius: 999px;
    background: #eaf2ff;
    color: var(--pulse-blue);
}

.operations-density-card__icon svg {
    width: 17px;
    height: 17px;
}

.operations-density-card--green .operations-density-card__icon {
    border-color: #d5eadf;
    background: #e7f7ef;
    color: #12864f;
}

.operations-density-card--teal .operations-density-card__icon {
    border-color: #cde9eb;
    background: #e4f7f8;
    color: #159aa0;
}

.operations-density-card--orange .operations-density-card__icon {
    border-color: #f0dfbf;
    background: #fff4df;
    color: #b4690e;
}

.operations-density-card__label {
    max-width: calc(100% - 48px);
    margin: 0;
    color: #516079;
    font-size: 12px;
    font-weight: 850;
}

.operations-density-card__value {
    margin-top: 14px;
    color: #0b1438;
    font-size: 29px;
    font-weight: 950;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.operations-density-card__note {
    margin-top: 8px;
    color: #667085;
    font-size: 12.5px;
    font-weight: 700;
    line-height: 1.35;
}

/* --- Operational context note -------------------------------------------- */
.analytics-context-note {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    border: 1px solid #cfe0ff;
    border-radius: 16px;
    background: #f7faff;
    color: #516079;
    font-size: 13px;
    line-height: 1.5;
    padding: 16px 18px;
}

.analytics-context-note__icon {
    display: grid;
    width: 24px;
    height: 24px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 999px;
    background: #e0ebff;
    color: var(--pulse-blue);
    font-size: 13px;
    font-weight: 900;
    font-family: ui-serif, Georgia, serif;
}

.analytics-context-note p {
    margin: 0;
}

.analytics-context-note strong {
    color: #0b1438;
}

/* --- Responsive ---------------------------------------------------------- */
@media (max-width: 900px) {
    .analytics-overview-trend,
    .analytics-split,
    .analytics-split--wide-first {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .analytics-acct__grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .accounts-hero,
    .accounts-rank-card__head {
        flex-direction: column;
    }

    .accounts-hero__controls {
        width: 100%;
        justify-content: flex-start;
        flex-wrap: wrap;
    }

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

    .accounts-mix-card {
        min-height: 0;
    }

    .accounts-mix-card__body {
        grid-template-columns: minmax(130px, 180px) minmax(0, 1fr);
    }
}

@media (max-width: 1100px) {
    .accounts-summary-grid {
        grid-template-columns: 1fr;
    }

    .accounts-mix-card {
        min-height: 0;
    }

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

    .cargo-card {
        padding: 20px;
    }

    .analytics-through-grid {
        grid-template-columns: 1fr;
    }

    .analytics-through {
        min-height: 260px;
    }

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

@media (max-width: 760px) {
    .accounts-mix-card__body {
        grid-template-columns: 1fr;
        justify-items: center;
    }

    .accounts-mix-list,
    .accounts-conc-list {
        width: 100%;
    }

    .accounts-date-picker summary,
    .accounts-filter-button,
    .accounts-rank-by {
        width: 100%;
    }

    .accounts-date-picker,
    .accounts-date-picker__menu {
        width: 100%;
    }

    .cargo-card__header,
    .cargo-summary-strip,
    .cargo-insight-strip {
        grid-template-columns: 1fr;
    }

    .cargo-card__header {
        display: grid;
    }

    .cargo-card__period {
        align-items: flex-start;
        min-width: 0;
        justify-self: start;
        text-align: left;
    }

    .cargo-rank-header {
        display: none;
    }

    .cargo-rank-row {
        grid-template-columns: 24px 34px minmax(90px, 1fr) auto;
    }

    .cargo-rank-row__bar {
        grid-column: 3 / -1;
    }

    .cargo-rank-row__pieces {
        grid-column: 3 / 4;
        text-align: left;
    }

    .cargo-rank-row__share {
        grid-column: 4 / 5;
    }

    .cargo-insight {
        border-right: 0;
        border-bottom: 1px solid #e6ebf4;
    }

    .cargo-insight:last-child {
        border-bottom: 0;
    }

    .analytics-section-intro {
        align-items: stretch;
        flex-direction: column;
    }

    .analytics-section-tools {
        justify-content: flex-start;
    }

    .operations-throughput-card {
        padding: 18px;
    }

    .operations-density-grid {
        grid-template-columns: 1fr;
    }
}

/* ===========================================================================
   Settings → Users & Roles (Phase 8, staff admin surface)
   Calm, structured admin extension of the staff shell. Reuses the shared
   .data-table, .setup-identity, .pkg-field, and modal primitives; only the
   settings-specific chrome lives here.
   =========================================================================== */
.settings-topbar {
    justify-content: flex-start;
    gap: 18px;
}

.settings-topbar > div:not(.intake-heading__meta) {
    flex: 1 1 auto;
}

.settings-page-eyebrow {
    color: #5d687d;
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: 0.075em;
}

.settings-topbar h1 {
    font-size: clamp(30px, 3vw, 34px);
    font-weight: 900;
    letter-spacing: 0;
}

.settings-layout {
    max-width: 1180px;
    margin: 0 auto;
    color: #111a3d;
}

.settings-users-panel .button:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 3px rgba(0, 100, 210, 0.14);
}

.settings-feedback {
    margin: 0;
}

/* --- Users index panel ----------------------------------------------------- */
.settings-users-panel {
    overflow: hidden;
    border: 1px solid #d7dfeb;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(17, 26, 61, 0.04);
}

.settings-users-toolbar {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    border-bottom: 1px solid #d7dfeb;
    background: #fff;
    padding: 22px 24px;
}

.settings-users-toolbar h2 {
    margin: 0;
    color: #111a3d;
    font-size: 20px;
    font-weight: 900;
    line-height: 1.2;
}

.settings-users-count {
    margin: 5px 0 0;
    color: #111a3d;
    font-size: 17px;
    font-weight: 850;
    line-height: 1.3;
}

.settings-users-toolbar .result-summary {
    margin-top: 9px;
    color: #4f5b70;
    font-size: 13.5px;
    font-weight: 600;
}

.settings-users__add {
    gap: 8px;
    min-height: 42px;
    border-radius: 8px;
    padding: 9px 16px;
    white-space: nowrap;
    box-shadow: 0 6px 14px rgba(0, 100, 210, 0.14);
}

.settings-users__add svg {
    width: 17px;
    height: 17px;
}

.settings-users-panel .button:hover {
    transform: none;
}

.settings-users-filters {
    grid-template-columns:
        minmax(260px, 1.6fr)
        minmax(160px, 0.85fr)
        minmax(160px, 0.85fr)
        max-content;
    gap: 14px 16px;
    align-items: end;
    margin-top: 0;
    border-bottom: 1px solid #d7dfeb;
    background: #fff;
    padding: 20px 24px 22px;
}

.settings-users-filters .pkg-field {
    gap: 8px;
    color: #4f5b70;
    font-size: 13px;
    font-weight: 750;
}

.settings-users-filters .pkg-field input,
.settings-users-filters .pkg-field select {
    min-height: 42px;
    border-color: #cbd5e1;
    border-radius: 8px;
    color: #111a3d;
    font-size: 14px;
    font-weight: 650;
    box-shadow: none;
}

.settings-users-filters .pkg-field input:focus,
.settings-users-filters .pkg-field select:focus {
    border-color: var(--pulse-blue);
    box-shadow: 0 0 0 3px rgba(0, 100, 210, 0.12);
}

.settings-search-control {
    position: relative;
    display: block;
    min-width: 0;
}

.settings-search-control svg {
    position: absolute;
    top: 50%;
    left: 14px;
    width: 18px;
    height: 18px;
    color: #8a96aa;
    transform: translateY(-50%);
    pointer-events: none;
}

.settings-search-control input {
    padding-left: 42px;
}

.settings-users-filters .pkg-toolbar__actions {
    display: flex;
    align-items: flex-end;
    gap: 10px;
}

.settings-users-filters .button {
    min-height: 42px;
    border-radius: 8px;
    padding: 9px 17px;
}

.settings-users-filters .button--ghost {
    border-color: #d8dee8;
    color: #111a3d;
    box-shadow: none;
}

/* --- Users table ----------------------------------------------------------- */
.settings-users-panel .table-wrap {
    overflow-x: visible;
}

.settings-users-table {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
}

.settings-users-table__col-user {
    width: 29%;
}

.settings-users-table__col-role {
    width: 31%;
}

.settings-users-table__col-status {
    width: 16%;
}

.settings-users-table__col-activity {
    width: 17%;
}

.settings-users-table__col-actions {
    width: 7%;
}

.settings-users-table th,
.settings-users-table td {
    min-width: 0;
    border-bottom-color: #dfe5ee;
    padding: 12px 20px;
}

.settings-users-table th {
    background: #fff;
    color: #536075;
    font-size: 11.5px;
    font-weight: 850;
    letter-spacing: 0.055em;
}

.settings-users-table tbody tr {
    background: #fff;
}

.settings-users-table tbody tr:hover {
    background: #fbfcfe;
}

.settings-users-table tbody td {
    height: 68px;
}

.settings-users-table .setup-identity {
    gap: 13px;
    min-width: 0;
}

.settings-users-table .setup-identity__avatar {
    width: 36px;
    height: 36px;
    border: 1px solid #d9e3f3;
    border-radius: 999px;
    background: #eef3fb;
    color: #0757ad;
    font-size: 12px;
    font-weight: 850;
    box-shadow: none;
}

.settings-user__name {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
    color: #111a3d;
    font-size: 14.5px;
    font-weight: 800;
    line-height: 1.25;
}

.settings-you-marker {
    color: #667085;
    font-size: 13px;
    font-weight: 650;
}

.settings-user__email {
    color: #566278;
    font-size: 12.5px;
    font-weight: 500;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.settings-user__seen {
    margin-top: 0;
    color: #566278;
    font-size: 13px;
    font-variant-numeric: tabular-nums;
    font-weight: 500;
    white-space: nowrap;
}

.settings-user-row--muted {
    background: #fbfcfe;
}

.settings-user-row--muted .setup-identity__avatar {
    border-color: #dde2eb;
    background: #eef1f5;
    color: #697488;
}

.settings-user-row--muted .settings-user__name,
.settings-user-row--muted .settings-role__label {
    color: #465267;
}

/* --- Role/access and status treatments ------------------------------------- */
.settings-role {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.settings-role__label {
    color: #111a3d;
    font-size: 13.5px;
    font-weight: 800;
    line-height: 1.25;
}

.settings-role__access {
    color: #5c687c;
    font-size: 12.5px;
    font-weight: 500;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.settings-status {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #435066;
    font-size: 13.5px;
    font-weight: 650;
    line-height: 1.2;
}

.settings-status__dot {
    width: 8px;
    height: 8px;
    flex: 0 0 8px;
    border-radius: 999px;
    background: #9aa4b6;
}

.settings-status--active .settings-status__dot {
    background: #7cc580;
}

.settings-status--pending .settings-status__dot {
    background: #4b7fe6;
}

.settings-status--disabled .settings-status__dot {
    background: #a8b2c3;
}

.settings-users-table .pkg-action-menu form {
    margin: 0;
}

.settings-users-table__actions-col,
.settings-users-table__actions {
    text-align: right;
    width: 1%;
    white-space: nowrap;
}

.settings-users-table__actions .pkg-actions-cell {
    justify-content: flex-end;
}

.settings-users-table .pkg-menu-trigger {
    width: 34px;
    height: 34px;
    border-color: #dbe2ec;
    border-radius: 7px;
    background: #fff;
    color: #475467;
    letter-spacing: 0.04em;
    box-shadow: none;
}

.settings-users-table .pkg-menu-trigger:hover,
.settings-users-table .pkg-menu-trigger[aria-expanded="true"] {
    border-color: #c8d2e1;
    background: #f8fafc;
    color: #111a3d;
    transform: none;
}

.settings-users-table .pkg-menu-trigger:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 3px rgba(0, 100, 210, 0.14);
}

.settings-users-table__no-action {
    color: #a8b2c3;
    font-size: 16px;
    font-weight: 600;
}

.settings-empty-state {
    padding: 38px 24px;
}

/* --- Add-user modal (mirrors the manifest create modal) -------------------- */
.add-user-modal {
    width: min(560px, 94vw);
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    padding: 0;
}

.add-user-modal__header {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 22px 24px 12px;
}

.add-user-modal__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: #eef4ff;
    color: var(--pulse-blue);
    flex: none;
}

.add-user-modal__icon svg {
    width: 22px;
    height: 22px;
}

.add-user-modal__title h3 {
    margin: 0;
    font-size: 18px;
    font-weight: 900;
    color: var(--pulse-text);
}

.add-user-modal__title p {
    margin: 4px 0 0;
    font-size: 12.5px;
    font-weight: 650;
    color: var(--pulse-muted);
}

.add-user-modal__header .relationship-modal__close {
    margin-left: auto;
}

.add-user-modal__body {
    padding: 8px 24px 16px;
    overflow-y: auto;
}

.add-user-modal__error {
    margin-bottom: 14px;
}

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

.add-user-modal .pkg-field > span {
    display: block;
    margin-bottom: 6px;
    font-size: 12.5px;
    font-weight: 800;
    color: var(--pulse-text);
}

.add-user-modal .pkg-field input,
.add-user-modal .pkg-field select {
    width: 100%;
    height: 42px;
    border: 1px solid #ccd6e4;
    border-radius: 10px;
    background: #fff;
    color: var(--pulse-text);
    font: inherit;
    font-size: 14px;
    font-weight: 650;
    padding: 0 12px;
}

.add-user-modal .pkg-field input:focus,
.add-user-modal .pkg-field select:focus {
    outline: 0;
    border-color: var(--pulse-blue);
    box-shadow: 0 0 0 3px rgba(0, 100, 210, 0.12);
}

.add-user-modal__footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    padding: 14px 24px 20px;
    border-top: 1px solid var(--pulse-border);
}

.add-user-modal__footer > span {
    flex: 1 1 220px;
    min-width: 0;
    margin-right: auto;
    color: var(--pulse-muted);
    font-size: 11.5px;
    font-weight: 650;
}

.add-user-modal__footer .button {
    flex: 0 0 auto;
    white-space: nowrap;
}

.add-user-modal__footer .button svg {
    width: 16px;
    height: 16px;
    margin-right: 6px;
}

/* --- Deactivate / reactivate confirmation --------------------------------- */
.settings-confirm-modal {
    width: min(460px, 94vw);
    display: flex;
    flex-direction: column;
    padding: 0;
}

.settings-confirm-modal__header {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 22px 24px 8px;
}

.settings-confirm-modal__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: #eef1f6;
    color: #64708a;
    flex: none;
}

.settings-confirm-modal__icon svg {
    width: 22px;
    height: 22px;
}

.settings-confirm-modal__icon--warn {
    background: #fff0f0;
    color: #a53030;
}

.settings-confirm-modal__title h3 {
    margin: 0;
    font-size: 18px;
    font-weight: 900;
    color: var(--pulse-text);
}

.settings-confirm-modal__title p {
    margin: 4px 0 0;
    font-size: 12.5px;
    font-weight: 650;
    line-height: 1.5;
    color: var(--pulse-muted);
}

.settings-confirm-modal__header .relationship-modal__close {
    margin-left: auto;
}

.settings-confirm-modal__body {
    padding: 6px 24px 16px;
}

.settings-confirm-user {
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid var(--pulse-border);
    border-radius: 12px;
    background: #f8fafd;
    padding: 12px 14px;
}

.settings-confirm-user__copy {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.settings-confirm-user__copy strong {
    font-size: 14px;
    color: var(--pulse-text);
}

.settings-confirm-user__copy span {
    color: var(--pulse-muted);
    font-size: 12.5px;
    font-weight: 650;
}

.settings-confirm-modal__footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    padding: 14px 24px 20px;
    border-top: 1px solid var(--pulse-border);
}

.settings-confirm-modal__footer > span {
    margin-right: auto;
    color: var(--pulse-muted);
    font-size: 11.5px;
    font-weight: 650;
}

.settings-confirm-modal__footer form {
    margin: 0;
}

/* --- Shared danger button (destructive confirm) --------------------------- */
.button--danger {
    border-color: transparent;
    background: #bf3535;
    color: #fff;
}

.button--danger:hover {
    background: #a12c2c;
}

@media (max-width: 1040px) {
    .settings-users-filters {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(0, 1fr)
            max-content;
    }

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

@media (max-width: 900px) {
    .settings-topbar {
        gap: 12px;
    }

    .settings-topbar h1 {
        font-size: 24px;
    }

    .settings-topbar .page-subtitle {
        font-size: 14px;
    }

    .settings-users-toolbar {
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
        padding: 18px 20px;
    }

    .settings-users__add {
        align-self: flex-start;
    }

    .settings-users-filters {
        grid-template-columns: minmax(0, 1fr);
        padding: 18px 20px 20px;
    }

    .settings-users-filters .pkg-toolbar__actions {
        justify-content: flex-start;
    }

    .settings-users-panel .table-wrap {
        overflow-x: visible;
    }

    .settings-users-table,
    .settings-users-table colgroup,
    .settings-users-table tbody,
    .settings-users-table tr,
    .settings-users-table td {
        display: block;
        min-width: 0;
        width: 100%;
    }

    .settings-users-table {
        border-collapse: separate;
        border-spacing: 0;
    }

    .settings-users-table thead {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        clip-path: inset(50%);
    }

    .settings-users-table tbody tr {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 10px 14px;
        border-bottom: 1px solid #dfe5ee;
        padding: 15px 20px;
    }

    .settings-users-table tbody tr:last-child {
        border-bottom: 0;
    }

    .settings-users-table th,
    .settings-users-table td,
    .settings-users-table tbody td {
        height: auto;
        border-bottom: 0;
        padding: 0;
    }

    .settings-users-table__user-cell,
    .settings-users-table__role-cell {
        grid-column: 1 / -1;
    }

    .settings-users-table__status-cell,
    .settings-users-table__activity-cell {
        display: grid;
        gap: 4px;
        align-content: start;
    }

    .settings-users-table__status-cell {
        grid-column: 1;
        grid-row: 3;
    }

    .settings-users-table__activity-cell {
        grid-column: 1;
        grid-row: 4;
    }

    .settings-users-table__status-cell::before,
    .settings-users-table__activity-cell::before {
        content: attr(data-label);
        color: #7a8498;
        font-size: 10.5px;
        font-weight: 850;
        letter-spacing: 0.055em;
        text-transform: uppercase;
    }

    .settings-users-table__actions {
        grid-column: 2;
        grid-row: 3 / 5;
        align-self: center;
        justify-self: end;
        width: auto;
    }

    .settings-users-table__actions .pkg-actions-cell {
        justify-content: flex-end;
    }
}

@media (max-width: 480px) {
    .settings-users-toolbar,
    .settings-users-filters {
        padding-right: 18px;
        padding-left: 18px;
    }

    .settings-users-table tbody tr {
        padding-right: 18px;
        padding-left: 18px;
    }

    .settings-users__add {
        width: 100%;
    }

    .settings-users-filters .pkg-toolbar__actions {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, auto);
        width: 100%;
    }

    .add-user-modal__grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 1100px) {
    .bol-new-modal .button,
    .bol-new-modal input,
    .bol-new-modal select {
        min-height: 48px;
    }
}

@media (max-width: 900px) {
    .bol-new-modal {
        width: min(96vw, 860px);
        max-height: 94vh;
    }

    .bol-new-modal__columns {
        grid-template-columns: minmax(0, 1fr);
    }

    .bol-new-modal__form {
        border-right: 0;
    }

    .bol-preview-card {
        position: static;
        margin-top: 0;
    }
}

/* ===========================================================================
   Phase 15 — RAC / QuikShip source-aware worksheets on the Manifest page.
   The partner grids reuse the manifest worksheet primitives while adding their
   own read-first cells, sticky columns, global save state, piece editor, and
   removed-row treatment.
   =========================================================================== */
.worksheet-tabs {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-end;
    gap: 0;
    min-height: 58px;
    margin: 0;
    padding: 9px 18px 0;
    border-radius: 17px 17px 0 0;
    background: #f8fafc;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-color: #cbd5e1 transparent;
    scrollbar-width: thin;
    box-shadow: inset 0 -1px 0 #dce3ed;
}

.worksheet-tabs::-webkit-scrollbar {
    height: 5px;
}

.worksheet-tabs::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: #cbd5e1;
}

.worksheet-workbook {
    position: relative;
    border: 1px solid #dce3ed;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(20, 39, 74, 0.06);
}

.worksheet-workbook > .worksheet-panel {
    margin: 0;
    border: 0;
    border-radius: 0 0 18px 18px;
    box-shadow: none;
}

.worksheet-tab {
    position: relative;
    appearance: none;
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px;
    height: 44px;
    margin: 0 3px 1px;
    padding: 0 19px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #68758a;
    font-size: 13.5px;
    font-weight: 800;
    white-space: nowrap;
    cursor: pointer;
    transition: color 140ms ease;
}

.worksheet-tab:not(.is-active)::after {
    position: absolute;
    top: 8px;
    right: -3px;
    width: 1px;
    height: 28px;
    background: linear-gradient(
        to bottom,
        transparent,
        #d8e0eb 22%,
        #d8e0eb 78%,
        transparent
    );
    content: "";
    pointer-events: none;
}

.worksheet-tab:not(.is-active):has(+ .worksheet-tab.is-active)::after {
    display: none;
}

.worksheet-tab:not(.is-active):has(+ .worksheet-tab-add)::after {
    display: none;
}

.worksheet-tab:hover {
    color: #233854;
}

.worksheet-tab--rac,
.worksheet-tab--quikship {
    --worksheet-source-accent: #4f76ad;
    --worksheet-source-surface: #edf4ff;
    --worksheet-source-border: #bfd1e9;
}

.worksheet-tab--quikship {
    --worksheet-source-accent: #3f8768;
    --worksheet-source-surface: #f4faf6;
    --worksheet-source-border: #c7dfd2;
}

.worksheet-tab--rac::before,
.worksheet-tab--quikship::before {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--worksheet-source-accent);
    content: "";
}

.worksheet-tab--rac .worksheet-tab__count,
.worksheet-tab--quikship .worksheet-tab__count {
    background: var(--worksheet-source-surface);
    color: var(--worksheet-source-accent);
}

.worksheet-tab.is-active {
    z-index: 2;
    height: 49px;
    margin: 0 4px -1px;
    border: 1px solid #d1dbe8;
    border-bottom: 0;
    border-radius: 14px 14px 0 0;
    background: #fbfdff;
    color: #0867c9;
    box-shadow: 0 -3px 10px rgba(34, 67, 110, 0.035);
}

.worksheet-tab--rac.is-active,
.worksheet-tab--quikship.is-active {
    border-color: var(--worksheet-source-border);
    border-bottom: 0;
    background: var(--worksheet-source-surface);
    color: var(--worksheet-source-accent);
}

.worksheet-tab:focus-visible {
    outline: 2px solid var(--pulse-blue);
    outline-offset: 2px;
}

.worksheet-tab-add {
    position: relative;
    appearance: none;
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    align-self: flex-end;
    margin: 0 4px 4px 7px;
    padding: 0 13px 0 25px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #6b778b;
    font-size: 13px;
    font-weight: 750;
    white-space: nowrap;
    cursor: pointer;
    transition: color 140ms ease;
}

.worksheet-tab-add::before {
    position: absolute;
    top: 5px;
    left: 0;
    width: 1px;
    height: 28px;
    background: linear-gradient(
        to bottom,
        transparent,
        #d8e0eb 22%,
        #d8e0eb 78%,
        transparent
    );
    content: "";
}

.worksheet-tab.is-active + .worksheet-tab-add::before {
    display: none;
}

.worksheet-tab-add:hover {
    color: var(--pulse-blue);
}

.worksheet-tab-add:focus-visible {
    outline: 2px solid var(--pulse-blue);
    outline-offset: 2px;
}

.worksheet-tab-add__icon {
    display: inline-grid;
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    place-items: center;
    border: 1px solid #cbd5e1;
    border-radius: 50%;
    background: #fff;
}

.worksheet-tab-add__icon svg {
    width: 14px;
    height: 14px;
}

.worksheet-tab__count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 18px;
    padding: 0 6px;
    border-radius: 999px;
    background: #eef2fb;
    color: var(--pulse-text);
    font-size: 11px;
    font-weight: 900;
}

.worksheet-tab.is-active .worksheet-tab__count {
    background: var(--pulse-blue);
    color: #fff;
}

.worksheet-tab--rac.is-active .worksheet-tab__count,
.worksheet-tab--quikship.is-active .worksheet-tab__count {
    background: var(--worksheet-source-accent);
    color: #fff;
}

/* --- Partner worksheet shell ------------------------------------------- */
.partner-worksheet-panel {
    padding: 0;
    overflow: visible;
    border: 0;
    background: #fff;
    box-shadow: none;
}

.partner-worksheet__toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px 20px;
    padding: 16px 22px 12px;
    border-bottom: 1px solid #e3e8f0;
    background: rgba(255, 255, 255, 0.98);
}

.partner-worksheet__copy h3 {
    margin: 0;
    color: var(--pulse-text);
    font-size: 16px;
    font-weight: 900;
}

.partner-worksheet__sub {
    margin: 4px 0 0;
    color: var(--pulse-muted);
    font-size: 12.5px;
    font-weight: 650;
}

.partner-worksheet__counts {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.partner-worksheet__toolbar-end {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
}

.partner-worksheet__toolbar-end {
    flex-wrap: wrap;
}

.partner-worksheet__save-status {
    min-width: 108px;
    color: #66758a;
    font-size: 12px;
    font-weight: 750;
    text-align: right;
}

.partner-worksheet__save-status[data-tone="saved"] {
    color: #167647;
}

.partner-worksheet__save-status[data-tone="error"] {
    color: #a12c2c;
}

.partner-worksheet__actionbar {
    position: sticky;
    z-index: 8;
    top: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 18px;
    padding: 10px 22px;
    border-bottom: 1px solid var(--pulse-border);
    background: rgba(248, 250, 253, 0.98);
    box-shadow: 0 4px 10px rgba(20, 39, 74, 0.025);
    transition: background-color 140ms ease, border-color 140ms ease;
}

.partner-worksheet__actionbar.is-selection-mode {
    border-bottom-color: #cbdcf3;
    background: rgba(241, 247, 255, 0.98);
}

.partner-worksheet__action-group {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.partner-worksheet__action-group--right {
    justify-content: flex-end;
    margin-left: auto;
}

.partner-worksheet__action-group[hidden],
.partner-worksheet__actionbar [hidden] {
    display: none;
}

.partner-worksheet__selection-actions {
    min-height: 38px;
    gap: 10px;
}

.partner-worksheet__selection-indicator {
    display: inline-flex;
    width: 22px;
    height: 22px;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    background: var(--pulse-blue);
    color: #fff;
}

.partner-worksheet__selection-indicator svg {
    width: 14px;
    height: 14px;
    stroke-width: 2.4;
}

.partner-worksheet__selection-count {
    color: #173861;
    font-size: 13px;
    font-weight: 850;
    white-space: nowrap;
}

.partner-worksheet__clear-selection {
    padding: 4px 2px;
    border: 0;
    background: transparent;
    color: #175cd3;
    font: inherit;
    font-size: 12.5px;
    font-weight: 750;
    cursor: pointer;
}

.partner-worksheet__clear-selection:hover {
    color: #124aab;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.partner-worksheet__clear-selection:focus-visible {
    border-radius: 4px;
    outline: 2px solid #175cd3;
    outline-offset: 2px;
}

.partner-worksheet__delete-selected {
    min-height: 38px;
    height: 38px;
    padding: 0 12px;
    border-color: #e7a9a6;
    border-radius: 7px;
    background: #fff;
    color: #b42318;
    font-size: 12.5px;
    font-weight: 800;
}

.partner-worksheet__delete-selected:hover {
    border-color: #d66d68;
    background: #fff6f5;
    color: #912018;
}

.partner-worksheet__delete-selected:focus-visible {
    outline: 2px solid #175cd3;
    outline-offset: 2px;
}

.partner-worksheet__delete-selected svg {
    width: 16px;
    height: 16px;
}

.partner-toolbar-action {
    min-height: 38px;
    height: 38px;
    padding: 0 13px;
    gap: 7px;
    border-radius: 7px;
    font-size: 13px;
    line-height: 1;
}

.partner-add-line-trigger {
    border-color: #9cb5d7;
    background: #f8fbff;
    color: #174f9b;
    font-weight: 850;
}

.partner-add-line-trigger:hover {
    border-color: #6f96c9;
    background: #edf5ff;
    color: #123f7d;
}

.partner-import-trigger {
    border-color: #d5dee9;
    background: #fff;
    color: #52647a;
    font-weight: 750;
}

.partner-import-trigger:hover {
    border-color: #b8c5d5;
    background: #f7f9fc;
    color: #344054;
}

.partner-toolbar-action--icon {
    width: 38px;
    min-width: 38px;
    padding: 0;
    justify-content: center;
}

.partner-direct-import {
    display: inline-flex;
    margin: 0;
}

.partner-worksheet__download-form {
    display: inline-flex;
    margin: 0;
}

.partner-delete-workspace-trigger {
    margin-left: 10px;
    border-color: #efcaca;
    color: #a12c2c;
}

.partner-delete-workspace-trigger:hover {
    border-color: #cf6666;
    background: #fff7f7;
    color: #8d2020;
}

.partner-save-changes {
    min-width: 126px;
}

.partner-save-changes:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.partner-delete-workspace-modal__warning {
    color: #a12c2c;
    font-weight: 750;
}

.partner-bulk-delete-modal__actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 22px;
}

.partner-bulk-delete-modal {
    border: 1px solid #d8e1ec;
}

.partner-bulk-delete-modal > header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    padding-bottom: 16px;
    border-bottom: 1px solid #e4eaf1;
}

.partner-bulk-delete-modal > header h2 {
    margin: 3px 0 0;
    color: var(--pulse-text);
    font-size: 21px;
}

.partner-bulk-delete-modal > p {
    margin: 18px 0 0;
    color: #4f5e74;
    line-height: 1.55;
}

.partner-worksheet__feedback {
    margin: 0;
    padding: 10px 22px;
    background: #fdecec;
    color: #a12020;
    font-size: 12.5px;
    font-weight: 750;
    border-bottom: 1px solid #f4caca;
}

.partner-worksheet-wrap {
    position: relative;
    max-height: none;
    overflow: visible;
}

.partner-worksheet-table {
    width: 100%;
    min-width: 0;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
}

.partner-col--select { width: 42px; }
.partner-col--partner_bol_number { width: 4.5%; }
.partner-col--shipper { width: 7%; }
.partner-col--shipper_address { width: 9.5%; }
.partner-col--consignee_name { width: 9%; }
.partner-col--consignee_address { width: 9.5%; }
.partner-col--piece_count { width: 4.5%; }
.partner-col--package_type { width: 7%; }
.partner-col--description { width: 10%; }
.partner-col--volume_ft3 { width: 5.5%; }
.partner-col--weight_lb { width: 5.5%; }
.partner-col--agency_fee { width: 7%; }
.partner-col--ocean_freight { width: 6%; }
.partner-col--total { width: 6%; }
.partner-col--actions { width: 5%; }

.partner-worksheet-table thead th {
    position: sticky;
    z-index: 4;
    top: 0;
    height: 52px;
    padding: 10px 8px;
    border-bottom: 1px solid #d9e1ec;
    background: #f1f5fa;
    color: #46566d;
    font-size: 11.5px;
    font-weight: 650;
    letter-spacing: 0;
    line-height: 1.25;
    text-transform: none;
    vertical-align: middle;
}

.partner-worksheet-table tbody td {
    min-height: 72px;
    padding: 12px 8px;
    border-bottom: 1px solid #e7ebf1;
    background: #fff;
    color: #17233d;
    font-size: 12.5px;
    font-weight: 500;
    line-height: 1.4;
    vertical-align: middle;
    transition: background-color 140ms ease, box-shadow 140ms ease;
}

.partner-worksheet-table tbody tr {
    height: 72px;
}

.partner-worksheet-table th + th,
.partner-worksheet-table tbody td + td {
    border-left-color: #f1f3f7;
}

.partner-worksheet-table tbody tr:hover td {
    background: #f8faff;
}

.partner-worksheet-table tbody tr.partner-row--supplemental td {
    background: #f1f6fd;
}

.partner-worksheet-table tbody tr.partner-row--supplemental:hover td {
    background: #edf4fc;
}

.partner-worksheet-table tbody tr.is-modified td {
    background: #f5f8fc;
}

.partner-worksheet-table tbody tr.is-modified:hover td {
    background: #f1f6fc;
}

.partner-worksheet-table tbody tr.is-selected td {
    background: #eef5ff;
}

.partner-worksheet-table tbody tr.is-selected:hover td {
    background: #e8f1fd;
}

.partner-worksheet-table thead th:first-child,
.partner-worksheet-table tbody td:first-child {
    position: sticky;
    z-index: 3;
    left: 0;
    box-shadow: 1px 0 0 #dfe5ed;
}

.partner-worksheet-table tbody tr.partner-row--supplemental td:first-child {
    box-shadow: inset 3px 0 0 #86a9d4, 1px 0 0 #dfe5ed;
}

.partner-worksheet-table tbody tr.partner-row--supplemental .partner-column--partner_bol_number {
    background: #f1f6fd;
}

.partner-worksheet-table tbody tr.partner-row--supplemental:hover .partner-column--partner_bol_number {
    background: #edf4fc;
}

.partner-worksheet-table thead th:first-child {
    z-index: 6;
    background: #f1f5fa;
}

.partner-column--select {
    padding-right: 0 !important;
    padding-left: 0 !important;
    text-align: center;
}

.partner-worksheet-table--selectable .partner-column--partner_bol_number {
    position: sticky;
    z-index: 3;
    left: 42px;
    background: #fff;
    box-shadow: 1px 0 0 #dfe5ed;
}

.partner-worksheet-table--selectable thead .partner-column--partner_bol_number {
    z-index: 6;
    background: #f1f5fa;
}

.partner-worksheet-table .partner-column--actions {
    position: sticky;
    z-index: 3;
    right: 0;
    border-left: 1px solid #dfe5ed;
    background: #fff;
    box-shadow: -5px 0 12px rgba(28, 45, 75, 0.04);
}

.partner-worksheet-table thead .partner-column--actions {
    z-index: 6;
    background: #f1f5fa;
}

.partner-worksheet-table tbody tr:hover .partner-column--actions,
.partner-worksheet-table tbody tr:hover td:first-child,
.partner-worksheet-table tbody tr:hover .partner-column--partner_bol_number {
    background: #f8faff;
}

.partner-worksheet-table tbody tr.is-modified .partner-column--actions,
.partner-worksheet-table tbody tr.is-modified td:first-child,
.partner-worksheet-table tbody tr.is-modified .partner-column--partner_bol_number {
    background: #f5f8fc;
}

.partner-worksheet-table tbody tr.is-selected .partner-column--actions,
.partner-worksheet-table tbody tr.is-selected td:first-child,
.partner-worksheet-table tbody tr.is-selected .partner-column--partner_bol_number {
    background: #eef5ff;
}

.partner-worksheet[data-partner-type="rac"] .partner-worksheet-table tbody tr:not(.is-selected):not(.is-modified) td {
    background: #f0f5fd;
}

.partner-worksheet[data-partner-type="rac"] .partner-worksheet-table tbody tr:not(.is-selected):not(.is-modified):hover td {
    background: #e7f0fb;
}

.partner-worksheet[data-partner-type="quikship"] .partner-worksheet-table tbody tr:not(.is-selected):not(.is-modified) td {
    background: #f6faf7;
}

.partner-worksheet[data-partner-type="quikship"] .partner-worksheet-table tbody tr:not(.is-selected):not(.is-modified):hover td {
    background: #eef7f2;
}

.partner-worksheet[data-partner-type="rac"] .partner-worksheet-table tbody tr.partner-row--supplemental:not(.is-selected):not(.is-modified) td:first-child {
    box-shadow: inset 3px 0 0 #7e9bc4, 1px 0 0 #dfe5ed;
}

.partner-worksheet[data-partner-type="rac"] .partner-worksheet-table tbody tr.partner-row--supplemental:not(.is-selected):not(.is-modified) td {
    background: #e8f1fc;
}

.partner-worksheet[data-partner-type="quikship"] .partner-worksheet-table tbody tr.partner-row--supplemental:not(.is-selected):not(.is-modified) td:first-child {
    box-shadow: inset 3px 0 0 #70a98d, 1px 0 0 #dfe5ed;
}

.partner-worksheet[data-partner-type="quikship"] .partner-worksheet-table tbody tr.partner-row--supplemental:not(.is-selected):not(.is-modified) td {
    background: #eef7f2;
}

.partner-worksheet-table .partner-cell-value,
.partner-worksheet-table .partner-cell-display {
    display: block;
    width: 100%;
    overflow-wrap: anywhere;
    color: inherit;
    font: inherit;
    line-height: inherit;
    text-align: inherit;
    white-space: normal;
}

.partner-worksheet-table .partner-cell-display[hidden] {
    display: none;
}

.partner-worksheet-table .partner-cell-display {
    appearance: none;
    min-height: 30px;
    margin: -5px -7px;
    padding: 5px 7px;
    border: 1px solid transparent;
    border-radius: 6px;
    background: transparent;
    cursor: text;
    transition: background-color 140ms ease, border-color 140ms ease;
}

.partner-worksheet-table .partner-cell-display:hover {
    border-color: #dce5f1;
    background: rgba(241, 246, 252, 0.85);
}

.partner-worksheet-table .partner-cell-display:focus-visible {
    outline: 2px solid rgba(0, 100, 210, 0.28);
    outline-offset: 1px;
}

.partner-cell.is-modified {
    box-shadow: inset 3px 0 0 #8aa9cc;
}

.partner-cell.is-editing {
    padding-top: 11px;
    padding-bottom: 11px;
    background: #f7faff !important;
    box-shadow: inset 0 0 0 2px rgba(60, 111, 168, 0.38);
}

.partner-input--active,
textarea.partner-input--active {
    width: 100%;
    min-height: 40px;
    margin: 0;
    padding: 4px 2px;
    border: 1px solid transparent;
    border-radius: 2px;
    background: transparent;
    color: #17233d;
    font-size: 12.5px;
    font-weight: 500;
    line-height: 1.35;
    box-shadow: none;
    resize: none;
    overflow: hidden;
}

.partner-input--active:focus {
    outline: 0;
    border-color: rgba(111, 145, 184, 0.3);
    box-shadow: none;
}

.partner-column--piece_count,
.partner-column--volume_ft3,
.partner-column--weight_lb,
.partner-column--agency_fee,
.partner-column--ocean_freight,
.partner-column--total {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.partner-column--partner_bol_number,
.partner-column--total {
    font-weight: 750;
}

.partner-row__actions {
    white-space: nowrap;
    overflow: visible;
    text-align: center;
}

.partner-action-menu .pkg-menu-trigger {
    width: 32px;
    height: 32px;
    border-radius: 8px;
}

.partner-action-menu .pkg-menu-trigger svg {
    width: 17px;
    height: 17px;
}

.partner-action-menu .pkg-action-menu {
    right: 0;
}

.partner-action-menu .pkg-action-menu__item {
    white-space: normal;
}

.partner-worksheet-table tfoot td {
    background: #f8fafc;
    font-variant-numeric: tabular-nums;
}

.partner-empty {
    margin: 22px;
}

/* --- Partner worksheet modals ------------------------------------------ */
.partner-import-modal {
    display: flex;
    width: min(740px, calc(100vw - 32px));
    max-width: 740px;
    max-height: 88vh;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid #d3dce8;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 28px 80px rgba(10, 18, 38, 0.28);
    padding: 0;
}

.partner-import-modal__header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 42px;
    align-items: start;
    gap: 24px;
    padding: 28px 32px 22px;
}

.partner-import-modal__heading {
    min-width: 0;
}

.partner-import-modal__heading .eyebrow {
    margin: 0 0 7px;
    color: #5a6679;
    font-size: 11.5px;
    font-weight: 850;
    line-height: 1.2;
    letter-spacing: 0.075em;
    text-transform: uppercase;
}

.partner-import-modal__heading h3 {
    margin: 0;
    color: var(--pulse-navy);
    font-size: 25px;
    font-weight: 900;
    line-height: 1.15;
}

.partner-import-modal__heading > p:last-child {
    margin: 8px 0 0;
    color: #5f6b7d;
    font-size: 13.5px;
    font-weight: 625;
    line-height: 1.45;
}

.partner-import-modal__close {
    display: inline-grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border: 1px solid #d2dce8;
    border-radius: 9px;
    background: #fff;
    color: var(--pulse-navy);
    cursor: pointer;
    transition: border-color 140ms ease, background-color 140ms ease;
}

.partner-import-modal__close:hover {
    border-color: #b7c5d7;
    background: #f7f9fc;
}

.partner-import-modal__close:focus-visible {
    outline: 3px solid rgba(0, 100, 210, 0.18);
    outline-offset: 2px;
}

.partner-import-modal__close svg {
    width: 20px;
    height: 20px;
}

.partner-import-modal__body {
    display: flex;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 22px;
    padding: 18px 32px 30px;
    overflow-y: auto;
}

.partner-import-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
    border: 0;
    padding: 0;
    margin: 0;
}

.partner-import-field__label {
    font-size: 13px;
    font-weight: 800;
    color: var(--pulse-text);
}

.partner-import-field select {
    width: 100%;
    height: 48px;
    border: 1px solid #c8d4e3;
    border-radius: 8px;
    background: #fff;
    color: var(--pulse-text);
    font: inherit;
    font-size: 14px;
    font-weight: 700;
    padding: 0 13px;
}

.partner-import-field select:focus {
    outline: 0;
    border-color: #6697d5;
    box-shadow: 0 0 0 3px rgba(0, 100, 210, 0.12);
}

.partner-import-dropzone {
    min-height: 104px;
    padding: 20px 22px;
    border: 1px dashed #adc1dc;
    border-radius: 10px;
    background: #fbfdff;
    transition: border-color 140ms ease, background-color 140ms ease;
}

.partner-import-dropzone.is-dragover {
    border-color: #4f86cc;
    background: #f2f7fe;
}

.partner-import-dropzone__empty {
    display: flex;
    align-items: center;
    gap: 16px;
    min-height: 62px;
}

.partner-import-dropzone__empty[hidden],
.partner-import-file[hidden] {
    display: none;
}

.partner-import-dropzone__icon,
.partner-import-file__icon {
    display: inline-grid;
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 9px;
    background: #edf5ff;
    color: #397dcc;
}

.partner-import-dropzone__icon svg,
.partner-import-file__icon svg {
    width: 20px;
    height: 20px;
}

.partner-import-dropzone__empty p {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin: 0;
    color: #475569;
    font-size: 14px;
    font-weight: 650;
}

.partner-import-dropzone__empty button {
    appearance: none;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--pulse-blue);
    font: inherit;
    font-weight: 850;
    cursor: pointer;
}

.partner-import-dropzone__empty button:hover {
    text-decoration: underline;
}

.partner-import-dropzone__empty button:focus-visible {
    border-radius: 3px;
    outline: 2px solid rgba(0, 100, 210, 0.3);
    outline-offset: 3px;
}

.partner-import-dropzone__empty small {
    display: block;
    margin-top: 6px;
    color: #69768a;
    font-size: 12px;
    font-weight: 650;
}

.partner-import-file {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto 36px;
    align-items: center;
    gap: 12px;
    min-height: 62px;
}

.partner-import-file__copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 4px;
}

.partner-import-file__copy strong {
    overflow: hidden;
    color: var(--pulse-text);
    font-size: 13.5px;
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.partner-import-file__copy span {
    color: #69768a;
    font-size: 12px;
    font-weight: 650;
}

.partner-import-file__replace {
    appearance: none;
    padding: 6px 8px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--pulse-blue);
    font: inherit;
    font-size: 12.5px;
    font-weight: 800;
    cursor: pointer;
}

.partner-import-file__replace:hover {
    background: #edf5ff;
}

.partner-import-file__remove {
    display: inline-grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border: 1px solid #d4dde8;
    border-radius: 8px;
    background: #fff;
    color: #64748b;
    cursor: pointer;
}

.partner-import-file__remove:hover {
    border-color: #e2b9b9;
    background: #fff6f6;
    color: #a72c2c;
}

.partner-import-file__replace:focus-visible,
.partner-import-file__remove:focus-visible {
    outline: 3px solid rgba(0, 100, 210, 0.18);
    outline-offset: 2px;
}

.partner-import-file__remove svg {
    width: 17px;
    height: 17px;
}

.partner-import-modal__error,
.partner-piece-modal__error {
    margin: 0;
    color: #a12020;
    font-size: 12.5px;
    font-weight: 750;
}

.partner-import-modal__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 18px 32px 22px;
    border-top: 1px solid #dce3ed;
}

.partner-import-modal__footer p {
    max-width: 330px;
    margin: 0;
    color: #667286;
    font-size: 12.5px;
    font-weight: 650;
    line-height: 1.45;
}

.partner-import-modal__actions {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 10px;
}

.partner-import-modal__actions .button {
    min-height: 44px;
    padding-inline: 18px;
}

.partner-import-modal__actions .button--primary {
    min-width: 142px;
}

/* --- Piece editor ------------------------------------------------------ */
.partner-piece-modal {
    width: min(880px, calc(100vw - 64px));
    max-width: 880px;
    max-height: calc(100vh - 64px);
    padding: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid #d7dfeb;
    border-radius: 16px;
    box-shadow: 0 28px 80px rgba(10, 18, 38, 0.3);
}

.partner-piece-modal__header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 42px;
    align-items: start;
    gap: 24px;
    padding: 28px 30px 22px;
    border-bottom: 1px solid #e0e6ef;
}

.partner-piece-modal__heading {
    min-width: 0;
}

.partner-piece-modal__heading .eyebrow {
    margin: 0 0 7px;
    color: #58657a;
    font-size: 11.5px;
    font-weight: 850;
    line-height: 1.2;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.partner-piece-modal__heading h3 {
    margin: 0;
    color: var(--pulse-navy);
    font-size: 25px;
    font-weight: 900;
    line-height: 1.14;
}

.partner-piece-modal__heading > p:last-child {
    max-width: 690px;
    margin: 10px 0 0;
    color: #5f6b7d;
    font-size: 13.5px;
    font-weight: 625;
    line-height: 1.5;
}

.partner-piece-modal__close {
    display: inline-grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border: 1px solid #d3dce8;
    border-radius: 9px;
    background: #fff;
    color: var(--pulse-navy);
    cursor: pointer;
    transition: border-color 140ms ease, background-color 140ms ease, color 140ms ease;
}

.partner-piece-modal__close:hover {
    border-color: #b9c6d8;
    background: #f7f9fc;
}

.partner-piece-modal__close:focus-visible,
.partner-piece-modal__add:focus-visible,
.partner-piece-row__remove:focus-visible {
    outline: 3px solid rgba(0, 100, 210, 0.18);
    outline-offset: 2px;
}

.partner-piece-modal__close svg {
    width: 20px;
    height: 20px;
}

.partner-piece-modal__body {
    min-height: 0;
    padding: 24px 30px;
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 18px;
    overflow-y: auto;
}

.partner-piece-rows {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.partner-piece-row {
    display: grid;
    grid-template-columns: minmax(220px, 250px) 105px minmax(0, 1fr) 40px;
    gap: 14px;
    align-items: center;
    min-height: 72px;
    padding: 13px 14px;
    border: 1px solid #dbe2ec;
    border-radius: 10px;
    background: #fbfcfe;
}

.partner-piece-row select,
.partner-piece-row input {
    width: 100%;
    height: 44px;
    border: 1px solid #cbd5e2;
    border-radius: 8px;
    background: #fff;
    color: var(--pulse-text);
    font: inherit;
    font-size: 14px;
    font-weight: 650;
    padding: 0 12px;
}

.partner-piece-row select:focus,
.partner-piece-row input:focus {
    outline: 0;
    border-color: #6697d5;
    box-shadow: 0 0 0 3px rgba(0, 100, 210, 0.12);
}

.partner-piece-row__calc {
    color: #657186;
    font-size: 12.5px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    line-height: 1.5;
}

.partner-piece-row__remove {
    appearance: none;
    border: 1px solid #d3dce8;
    background: #fff;
    border-radius: 8px;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #68758a;
    transition: border-color 140ms ease, background-color 140ms ease, color 140ms ease;
}

.partner-piece-row__remove:hover {
    color: #a72c2c;
    border-color: #e5bcbc;
    background: #fff6f6;
}

.partner-piece-row__remove:disabled {
    cursor: not-allowed;
    opacity: 0.46;
}

.partner-piece-modal__add {
    display: inline-flex;
    width: 100%;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    gap: 9px;
    border: 1px dashed #8fb1df;
    border-radius: 8px;
    background: #fbfdff;
    color: #075ebd;
    font: inherit;
    font-size: 14px;
    font-weight: 800;
    cursor: pointer;
    transition: border-color 140ms ease, background-color 140ms ease;
}

.partner-piece-modal__add:hover {
    border-color: #4f86cc;
    background: #f3f8ff;
}

.partner-piece-modal__add svg,
.partner-piece-row__remove svg {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
}

.partner-piece-summary {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin: 0;
    padding: 14px 8px;
    border: 1px solid #d9e2ee;
    border-radius: 10px;
    background: #f5f8fc;
}

.partner-piece-summary div {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 0;
    padding: 0 12px;
    text-align: center;
}

.partner-piece-summary div + div {
    border-left: 1px solid #d3dce8;
}

.partner-piece-summary dt {
    color: #667287;
    font-size: 10.5px;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.partner-piece-summary dd {
    margin: 5px 0 0;
    color: var(--pulse-navy);
    font-size: 15px;
    font-weight: 900;
    font-variant-numeric: tabular-nums;
    line-height: 1.25;
}

.partner-piece-modal__note {
    margin: 0;
    padding: 12px 14px;
    display: flex;
    align-items: flex-start;
    gap: 11px;
    border-left: 3px solid #d99612;
    border-radius: 7px;
    background: #fff8e9;
    color: #664d1c;
    font-size: 12.5px;
    font-weight: 675;
    line-height: 1.45;
}

.partner-piece-modal__note[hidden] {
    display: none;
}

.partner-piece-modal__note svg {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    color: #bd7900;
}

.partner-piece-modal__error {
    padding: 10px 12px;
    border-left: 3px solid #c23d3d;
    border-radius: 7px;
    background: #fff3f3;
}

.partner-piece-modal__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 17px 30px 20px;
    border-top: 1px solid #e0e6ef;
    background: #fff;
}

.partner-piece-modal__footer-note {
    color: #657186;
    font-size: 12.5px;
    font-weight: 650;
    line-height: 1.4;
}

.partner-piece-modal__footer-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
}

.partner-piece-modal__footer .button {
    min-height: 44px;
    padding-inline: 20px;
}

.partner-piece-modal__footer .button--primary {
    min-width: 132px;
}

.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;
}

@media (max-width: 900px) {
    .partner-worksheet-wrap {
        overflow-x: auto;
        overflow-y: visible;
    }

    .partner-worksheet-table {
        min-width: 1380px;
    }
}

@media (max-width: 720px) {
    .partner-import-modal {
        width: calc(100vw - 32px);
        max-height: calc(100vh - 32px);
    }
    .partner-import-modal__header {
        gap: 16px;
        padding: 22px 20px 18px;
    }
    .partner-import-modal__heading h3 {
        font-size: 22px;
    }
    .partner-import-modal__body {
        padding: 16px 20px 24px;
    }
    .partner-import-file {
        grid-template-columns: 38px minmax(0, 1fr) 36px;
    }
    .partner-import-file__replace {
        grid-column: 2;
        justify-self: start;
        padding-left: 0;
    }
    .partner-import-file__remove {
        grid-column: 3;
        grid-row: 1;
    }
    .partner-import-modal__footer {
        align-items: stretch;
        flex-direction: column;
        gap: 16px;
        padding: 16px 20px 20px;
    }
    .partner-import-modal__footer p {
        max-width: none;
    }
    .partner-import-modal__actions {
        justify-content: flex-end;
    }
    .pkg-modal-backdrop--center:has(.partner-piece-modal) {
        padding: 16px;
    }
    .partner-piece-modal {
        width: calc(100vw - 32px);
        max-height: calc(100vh - 32px);
    }
    .partner-piece-modal__header {
        gap: 16px;
        padding: 22px 20px 18px;
    }
    .partner-piece-modal__heading h3 {
        font-size: 22px;
    }
    .partner-piece-modal__body {
        padding: 20px;
    }
    .partner-piece-row {
        grid-template-columns: minmax(0, 1fr) 88px 40px;
        gap: 10px;
        padding: 12px;
    }
    .partner-piece-row__calc {
        grid-column: 1 / 3;
        grid-row: 2;
    }
    .partner-piece-row__remove {
        grid-column: 3;
        grid-row: 1;
    }
    .partner-piece-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        padding: 4px 10px;
    }
    .partner-piece-summary div,
    .partner-piece-summary div + div {
        min-height: 66px;
        justify-content: center;
        padding: 10px;
        border-left: 0;
        border-bottom: 1px solid #d3dce8;
    }
    .partner-piece-summary div:nth-child(even) {
        border-left: 1px solid #d3dce8;
    }
    .partner-piece-summary div:last-child {
        grid-column: 1 / -1;
        border-bottom: 0;
    }
    .partner-piece-modal__footer {
        align-items: stretch;
        flex-direction: column;
        gap: 14px;
        padding: 16px 20px 20px;
    }
    .partner-piece-modal__footer-actions {
        width: 100%;
    }
    .partner-piece-modal__footer-actions .button {
        flex: 1 1 0;
    }
    .partner-worksheet__toolbar,
    .partner-worksheet__actionbar {
        padding-left: 16px;
        padding-right: 16px;
    }
    .partner-worksheet__toolbar-end,
    .partner-worksheet__action-group {
        width: 100%;
    }
    .partner-worksheet__toolbar-end {
        justify-content: space-between;
    }
    .partner-worksheet__action-group--right {
        justify-content: flex-end;
    }
    .partner-worksheet__save-status {
        margin-right: auto;
        text-align: left;
    }
}

html[data-sidebar-touch="true"] .partner-worksheet__actionbar {
    top: 68px;
}

@media (prefers-reduced-motion: reduce) {
    .partner-worksheet__actionbar,
    .partner-worksheet-table tbody td,
    .partner-cell-display,
    .worksheet-selection-target {
        transition: none;
    }
}

/* Inline icons in the partner worksheet + its modals need explicit sizing;
   the app sizes button icons per-context rather than with one global rule. */
.partner-worksheet__actionbar .button svg,
.partner-import-modal .button svg {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
}

/* ==========================================================================
   Pulse Operations · Ideal Freight color system

   Staff pages opt into this final cascade through the `pulse-operations` body
   class. The portal keeps its independent shell. Color is deliberately
   neutral-first: charcoal and warm paper carry the interface, ochre gold is
   the primary action/accent, and Jamaican green is the quieter supporting
   action/success color. Red remains reserved for destructive and error states.
   ========================================================================== */
@media screen {
    body.pulse-operations {
        --ifc-charcoal: #252525;
        --ifc-charcoal-soft: #3b3935;
        --ifc-gold: #c18a2b;
        --ifc-gold-dark: #8b621d;
        --ifc-gold-soft: #f3e7d2;
        --ifc-green: #1f5a3b;
        --ifc-green-dark: #17442d;
        --ifc-green-soft: #e6efe9;
        --ifc-off-white: #f5f1e8;
        --ifc-paper: #fffdf9;
        --ifc-sand: #d8c9b2;
        --ifc-sand-soft: #eee6d9;
        --ifc-muted: #625e56;
        --ifc-muted-light: #7a7368;
        --ifc-danger: #9b3030;
        --ifc-danger-dark: #7e2525;
        --ifc-danger-soft: #f8e8e5;

        /* Existing component aliases become staff-scoped semantic tokens. */
        --pulse-blue: var(--ifc-green);
        --pulse-blue-dark: var(--ifc-charcoal);
        --pulse-gold: var(--ifc-gold);
        --pulse-teal: var(--ifc-green);
        --pulse-orange: var(--ifc-gold-dark);
        --pulse-bg: var(--ifc-off-white);
        --pulse-card: var(--ifc-paper);
        --pulse-text: var(--ifc-charcoal);
        --pulse-muted: var(--ifc-muted);
        --pulse-border: var(--ifc-sand);
        --pulse-shadow: 10px 0 28px rgba(37, 37, 37, 0.08);

        background: var(--ifc-off-white);
        color: var(--ifc-charcoal);
        accent-color: var(--ifc-green);
    }

    /* Shell and global navigation ----------------------------------------- */
    .pulse-operations .sidebar {
        border-right: 1px solid rgba(193, 138, 43, 0.32);
        background: var(--ifc-charcoal);
        color: var(--ifc-off-white);
        box-shadow: 12px 0 30px rgba(37, 37, 37, 0.12);
    }

    .pulse-operations .sidebar::before {
        content: "";
        position: absolute;
        inset: 0 0 auto;
        height: 4px;
        background: linear-gradient(
            90deg,
            var(--ifc-gold) 0 72%,
            var(--ifc-green) 72% 100%
        );
    }

    .pulse-operations .brand-mark {
        border: 1px solid rgba(245, 241, 232, 0.18);
        background: var(--ifc-gold);
        color: var(--ifc-charcoal);
        box-shadow: inset 0 -4px 0 rgba(31, 90, 59, 0.72);
    }

    .pulse-operations .sidebar-brand-logo {
        border-color: rgba(216, 201, 178, 0.5);
        background: var(--ifc-off-white);
        box-shadow: 0 8px 18px rgba(0, 0, 0, 0.18);
    }

    .pulse-operations .side-nav__item {
        color: rgba(245, 241, 232, 0.76);
    }

    .pulse-operations .side-nav__item:hover {
        background: rgba(245, 241, 232, 0.09);
        color: var(--ifc-off-white);
    }

    .pulse-operations .side-nav__item--active {
        background: var(--ifc-gold);
        color: var(--ifc-charcoal);
        box-shadow: 0 8px 18px rgba(0, 0, 0, 0.16);
    }

    .pulse-operations .side-nav--footer {
        border-top-color: rgba(216, 201, 178, 0.2);
    }

    .pulse-operations .menu-button--sidebar {
        border-color: rgba(216, 201, 178, 0.34);
        background: rgba(245, 241, 232, 0.08);
    }

    .pulse-operations .menu-button--sidebar span {
        background: var(--ifc-off-white);
    }

    .pulse-operations .sidebar-backdrop {
        background: rgba(37, 37, 37, 0.5);
    }

    .pulse-operations .sidebar-edge::after {
        background: var(--ifc-gold);
        box-shadow: 0 0 0 1px rgba(37, 37, 37, 0.16);
    }

    .pulse-operations .menu-button--topbar {
        border-color: var(--ifc-sand);
        background: var(--ifc-paper);
    }

    .pulse-operations .menu-button--topbar span {
        background: var(--ifc-charcoal);
    }

    .pulse-operations .staff-user-menu summary,
    .pulse-operations .staff-user-menu__panel,
    .pulse-operations .settings-popover__panel {
        border-color: var(--ifc-sand);
        background: var(--ifc-paper);
        color: var(--ifc-charcoal);
        box-shadow: 0 18px 42px rgba(73, 61, 43, 0.16);
    }

    .pulse-operations .staff-user-menu summary:hover,
    .pulse-operations .staff-user-menu[open] summary,
    .pulse-operations .staff-user-menu__panel a:hover,
    .pulse-operations .settings-popover__item:hover {
        border-color: #b9a78b;
        background: var(--ifc-off-white);
        color: var(--ifc-charcoal);
    }

    .pulse-operations .staff-user-menu__avatar,
    .pulse-operations .settings-popover__item-icon {
        background: var(--ifc-green-soft);
        color: var(--ifc-green);
    }

    .pulse-operations .staff-user-menu__role,
    .pulse-operations .staff-user-menu__account-email,
    .pulse-operations .settings-popover__heading {
        color: var(--ifc-muted);
    }

    .pulse-operations .settings-popover__item--active {
        background: var(--ifc-gold-soft);
        color: var(--ifc-charcoal);
        box-shadow: inset 3px 0 var(--ifc-gold);
    }

    /* Page canvas and hierarchy ------------------------------------------- */
    .pulse-operations .content {
        background:
            linear-gradient(180deg, rgba(255, 253, 249, 0.76), transparent 250px),
            var(--ifc-off-white);
    }

    .pulse-operations :is(
        h1,
        h2,
        h3,
        h4,
        h5,
        h6,
        .page-heading h1,
        .panel-heading,
        .setup-detail-meta,
        .settings-layout
    ) {
        color: var(--ifc-charcoal);
    }

    .pulse-operations :is(
        .page-heading__eyebrow,
        .eyebrow,
        .settings-page-eyebrow,
        .setup-side-card__eyebrow,
        .pkg-item-modal__title .eyebrow,
        .manifest-modal__title .eyebrow
    ) {
        color: var(--ifc-green);
    }

    .pulse-operations :is(
        .page-heading__support,
        .page-heading__meta,
        .page-subtitle,
        .muted-text,
        .result-summary,
        .setup-form__hint,
        .pkg-field small,
        .topbar__support
    ) {
        color: var(--ifc-muted);
    }

    .pulse-operations .page-heading__meta-divider,
    .pulse-operations .breadcrumbs__separator {
        color: #a08f76;
    }

    .pulse-operations .breadcrumbs__link,
    .pulse-operations :is(
        .text-action,
        .panel-link,
        .ops-card-link,
        .dashboard-list-card__link,
        .analytics-card-link,
        .manifest-table__link,
        .expected-tracking-link,
        .evidence-link
    ) {
        color: var(--ifc-green);
    }

    .pulse-operations :is(
        .breadcrumbs__link,
        .text-action,
        .panel-link,
        .ops-card-link,
        .dashboard-list-card__link,
        .analytics-card-link,
        .manifest-table__link,
        .expected-tracking-link,
        .evidence-link
    ):hover {
        color: var(--ifc-green-dark);
    }

    .pulse-operations .breadcrumbs__current {
        color: var(--ifc-charcoal);
    }

    /* Cards, forms, and content surfaces ---------------------------------- */
    .pulse-operations :is(
        .panel,
        .auth-card,
        .stat-card,
        .ops-kpi,
        .intake-activity-card,
        .intake-search-panel,
        .intake-results-panel,
        .how-it-works-panel,
        .intake-tip-panel,
        .exact-match-card,
        .unknown-panel,
        .status-panel,
        .activity-panel,
        .expected-create-form,
        .readonly-context-card,
        .summary-card,
        .timeline-card,
        .pkg-metric,
        .pkg-toolbar-panel,
        .pkg-ledger,
        .pkg-customer-summary,
        .pkg-owner-header,
        .pkg-description-panel,
        .pkg-actions-panel,
        .pkg-timeline-card,
        .setup-toolbar-panel,
        .setup-form-panel,
        .setup-side-card,
        .setup-form__section,
        .customer-form-panel,
        .customer-edit-form,
        .customer-id-card,
        .shipment-kpi,
        .shipment-index-panel,
        .bol-search-panel,
        .bol-table-panel,
        .manifest-index-panel,
        .manifest-worksheet-panel,
        .analytics-summary-card,
        .analytics-chart-panel,
        .analytics-table-card,
        .analytics-rank-card,
        .analytics-insights-card,
        .cargo-card,
        .cargo-drilldown-card,
        .operations-throughput-card,
        .operations-density-card,
        .settings-users-panel,
        .worksheet-panel,
        .partner-worksheet-panel
    ) {
        border-color: var(--ifc-sand);
        background: var(--ifc-paper);
        color: var(--ifc-charcoal);
        box-shadow: 0 9px 24px rgba(73, 61, 43, 0.065);
    }

    .pulse-operations :is(
        .intake-activity-card__head,
        .pkg-ledger-foot,
        .customer-form__actions,
        .customer-id-card__header,
        .setup-side-card__header,
        .manifest-table__footer,
        .settings-users-toolbar,
        .settings-users-filters,
        .partner-worksheet__toolbar,
        .partner-worksheet__actionbar
    ) {
        border-color: var(--ifc-sand);
        background: #faf7f0;
    }

    .pulse-operations :where(
        [class*="-card"],
        [class*="__card"],
        [class*="-panel"],
        [class*="__panel"],
        [class*="-modal"],
        [class*="__modal"],
        [class*="-drawer"],
        [class*="__drawer"]
    ) {
        border-color: var(--ifc-sand);
    }

    .pulse-operations :is(
        input,
        select,
        textarea,
        .pkg-date-picker__trigger,
        .relationship-search,
        .manifest-search
    ) {
        border-color: #c7b89f;
        background-color: var(--ifc-paper);
        color: var(--ifc-charcoal);
    }

    .pulse-operations :is(input, textarea)::placeholder {
        color: #8b8276;
    }

    .pulse-operations :is(
        input,
        select,
        textarea,
        button,
        a,
        summary
    ):focus-visible {
        outline-color: rgba(31, 90, 59, 0.56);
    }

    .pulse-operations :is(
        .pkg-field,
        .unknown-form,
        .expected-filter-form,
        .expected-form-fields,
        .relationship-search,
        .manifest-search,
        .add-user-modal
    ) :is(input, select, textarea):focus {
        border-color: var(--ifc-green);
        box-shadow: 0 0 0 3px rgba(31, 90, 59, 0.14);
    }

    /* Actions -------------------------------------------------------------- */
    .pulse-operations .button {
        border-color: var(--ifc-sand);
        background: var(--ifc-paper);
        color: var(--ifc-charcoal);
        box-shadow: none;
    }

    .pulse-operations .button:hover {
        border-color: #b9a78b;
        background: var(--ifc-off-white);
        color: var(--ifc-charcoal);
    }

    .pulse-operations :is(
        .button--primary,
        [class*="button--primary"],
        .settings-users__add
    ) {
        border-color: var(--ifc-gold);
        background: var(--ifc-gold);
        color: var(--ifc-charcoal);
        box-shadow: 0 7px 16px rgba(139, 98, 29, 0.18);
    }

    .pulse-operations :is(
        .button--primary,
        [class*="button--primary"],
        .settings-users__add
    ):hover {
        border-color: var(--ifc-gold-dark);
        background: var(--ifc-gold-dark);
        color: var(--ifc-paper);
    }

    .pulse-operations :is(.button--log, .button--row, .pill-link--secondary) {
        border-color: var(--ifc-green);
        background: var(--ifc-green);
        color: var(--ifc-off-white);
    }

    .pulse-operations :is(.button--log, .button--row, .pill-link--secondary):hover {
        border-color: var(--ifc-green-dark);
        background: var(--ifc-green-dark);
        color: var(--ifc-off-white);
    }

    .pulse-operations :is(.button--ghost, .ops-button--tertiary, .pkg-reset-button) {
        border-color: var(--ifc-sand);
        background: transparent;
        color: var(--ifc-charcoal);
    }

    .pulse-operations :is(.button--danger, .button--cancel-action) {
        border-color: var(--ifc-danger);
        background: var(--ifc-danger);
        color: #fff;
    }

    .pulse-operations :is(.button--danger, .button--cancel-action):hover {
        border-color: var(--ifc-danger-dark);
        background: var(--ifc-danger-dark);
        color: #fff;
    }

    /* Tables and ledgers --------------------------------------------------- */
    .pulse-operations .content table {
        color: var(--ifc-charcoal);
    }

    .pulse-operations .content :is(th, td) {
        border-color: #e2d7c6;
    }

    .pulse-operations .content :is(
        .data-table,
        .pkg-ledger,
        .manifest-table,
        .settings-users-table,
        .ops-incoming-table,
        .analytics-table,
        .cargo-drill-table,
        .partner-worksheet-table
    ) thead th {
        border-color: var(--ifc-sand);
        background: var(--ifc-sand-soft);
        color: #4e493f;
    }

    .pulse-operations .content :is(
        .data-table,
        .pkg-ledger,
        .manifest-table,
        .settings-users-table,
        .ops-incoming-table,
        .analytics-table,
        .cargo-drill-table,
        .partner-worksheet-table
    ) tbody tr:hover {
        background: #faf5ec;
    }

    .pulse-operations :is(
        .pkg-sort,
        .pkg-track__num,
        .pkg-owner-link,
        .pkg-copy,
        .pkg-view-btn,
        .pkg-pager__num,
        .analytics-tab--active
    ) {
        color: var(--ifc-green);
    }

    .pulse-operations :is(
        .pkg-menu-trigger,
        .pkg-action-menu,
        .pkg-date-picker__panel,
        .analytics-column-menu__panel
    ) {
        border-color: var(--ifc-sand);
        background: var(--ifc-paper);
        color: var(--ifc-charcoal);
        box-shadow: 0 14px 32px rgba(73, 61, 43, 0.14);
    }

    .pulse-operations :is(
        .pkg-menu-trigger:hover,
        .pkg-menu-trigger[aria-expanded="true"],
        .pkg-action-menu__item:hover,
        .pkg-action-menu__item:focus-visible
    ) {
        border-color: #b9a78b;
        background: var(--ifc-off-white);
        color: var(--ifc-charcoal);
    }

    /* Semantic status system ---------------------------------------------- */
    .pulse-operations :is(
        .status-chip,
        .pkg-status-pill,
        .setup-role-badge,
        .id-badge,
        .match-flag,
        .ready-pill,
        .setup-count-pill
    ) {
        border-color: var(--ifc-sand);
        background: var(--ifc-sand-soft);
        color: #514b42;
    }

    .pulse-operations :is(
        .status-chip--logged,
        .status-chip--delivered,
        .status-chip--ready,
        .status-chip--manifest_complete,
        .status-chip--closed,
        .status-chip--manifested,
        .status-chip--on_water,
        .id-badge--verified,
        .ops-consignee-badge--verified,
        .success-banner
    ) {
        border-color: rgba(31, 90, 59, 0.28);
        background: var(--ifc-green-soft);
        color: var(--ifc-green-dark);
    }

    .pulse-operations :is(
        .status-chip--pending_arrival,
        .status-chip--waiting,
        .status-chip--review,
        .status-chip--paperwork,
        .status-chip--pre_manifest,
        .status-chip--pending_close,
        .status-chip--ready_for_bol,
        .status-chip--arrived,
        .id-badge--pending,
        .ops-consignee-badge--pending,
        .shipment-kpi--active
    ) {
        border-color: rgba(193, 138, 43, 0.34);
        background: var(--ifc-gold-soft);
        color: #71501b;
    }

    .pulse-operations :is(
        .status-chip--unknown,
        .status-chip--unknown_attributed,
        .status-chip--draft,
        .status-chip--open,
        .status-chip--in_jamaica,
        .id-badge--required
    ) {
        border-color: var(--ifc-sand);
        background: var(--ifc-sand-soft);
        color: var(--ifc-charcoal-soft);
    }

    .pulse-operations :is(
        .status-chip--blocked,
        .status-chip--on_hold,
        .status-chip--cancelled,
        .ops-consignee-badge--required,
        .error-banner,
        .pkg-action-menu__item--danger
    ) {
        border-color: rgba(155, 48, 48, 0.28);
        background: var(--ifc-danger-soft);
        color: var(--ifc-danger-dark);
    }

    .pulse-operations .status-dot,
    .pulse-operations .settings-status__dot {
        background: var(--ifc-sand);
    }

    .pulse-operations .settings-status--active .settings-status__dot {
        background: var(--ifc-green);
    }

    .pulse-operations .settings-status--pending .settings-status__dot {
        background: var(--ifc-gold);
    }

    .pulse-operations .setup-portal-status--enabled {
        color: var(--ifc-green-dark);
    }

    .pulse-operations .setup-portal-status--enabled::before {
        background: var(--ifc-green);
    }

    .pulse-operations .setup-portal-status--invited {
        color: var(--ifc-gold-dark);
    }

    .pulse-operations .setup-portal-status--invited::before {
        background: var(--ifc-gold);
    }

    .pulse-operations .setup-portal-status--none {
        color: var(--ifc-muted);
    }

    .pulse-operations .setup-portal-status--none::before {
        background: var(--ifc-sand);
    }

    /* Dashboard and operational summaries -------------------------------- */
    .pulse-operations .ops-dashboard {
        color: var(--ifc-charcoal);
    }

    .pulse-operations .ops-dashboard .panel,
    .pulse-operations .ops-kpi {
        border-color: var(--ifc-sand);
        background: var(--ifc-paper);
        box-shadow: 0 8px 20px rgba(73, 61, 43, 0.07);
    }

    .pulse-operations :is(
        .ops-hero h2,
        .ops-kpi strong,
        .ops-card-head h3,
        .ops-status-card__header h3,
        .dashboard-list-card__header h3,
        .ops-activity-item strong,
        .ops-summary-row strong
    ) {
        color: var(--ifc-charcoal);
    }

    .pulse-operations :is(
        .ops-hero p,
        .ops-kpi__label,
        .ops-kpi__support,
        .ops-status-card__header p,
        .ops-activity-item p,
        .ops-activity-item time,
        .ops-summary-row__bottom span
    ) {
        color: var(--ifc-muted);
    }

    .pulse-operations :is(
        .ops-kpi__icon--blue,
        .ops-kpi__icon--amber,
        .ops-activity-item__icon--blue,
        .ops-activity-item__icon--orange
    ) {
        border-color: rgba(193, 138, 43, 0.3);
        background: var(--ifc-gold-soft);
        color: var(--ifc-gold-dark);
    }

    .pulse-operations :is(
        .ops-kpi__icon--green,
        .ops-kpi__icon--cyan,
        .ops-activity-item__icon--green
    ) {
        border-color: rgba(31, 90, 59, 0.28);
        background: var(--ifc-green-soft);
        color: var(--ifc-green);
    }

    .pulse-operations :is(
        .ops-kpi__icon--purple,
        .ops-kpi__icon--orange,
        .ops-activity-item__icon--purple
    ) {
        border-color: var(--ifc-sand);
        background: var(--ifc-sand-soft);
        color: var(--ifc-charcoal-soft);
    }

    .pulse-operations .ops-donut__segment--warehouse,
    .pulse-operations .ops-status-dot--warehouse {
        stroke: var(--ifc-gold);
        background: var(--ifc-gold);
    }

    .pulse-operations .ops-donut__segment--expected,
    .pulse-operations .ops-status-dot--expected {
        stroke: var(--ifc-green);
        background: var(--ifc-green);
    }

    .pulse-operations .ops-donut__segment--water,
    .pulse-operations .ops-status-dot--water {
        stroke: #4f4b43;
        background: #4f4b43;
    }

    .pulse-operations .ops-donut__segment--jamaica,
    .pulse-operations .ops-status-dot--jamaica {
        stroke: #8f7a5d;
        background: #8f7a5d;
    }

    .pulse-operations .ops-donut__segment--delivered,
    .pulse-operations .ops-status-dot--delivered {
        stroke: #6f927c;
        background: #6f927c;
    }

    .pulse-operations :is(
        .ops-status-legend__head,
        .ops-status-legend__row,
        .ops-status-card__footer,
        .dashboard-list-card__footer,
        .ops-activity-item__content,
        .ops-summary-row
    ) {
        border-color: #e2d7c6;
    }

    /* Intake, setup, shipment, and paperwork accents ---------------------- */
    .pulse-operations :is(
        .intake-kpi__icon,
        .step-icon,
        .tip-icon,
        .pkg-customer-summary__avatar,
        .pkg-owner-avatar,
        .setup-identity__avatar,
        .setup-activity__icon,
        .setup-info__icon,
        .bol-new-modal__icon,
        .manifest-new-modal__icon,
        .manifest-modal__icon,
        .add-user-modal__icon
    ) {
        border-color: rgba(193, 138, 43, 0.3);
        background: var(--ifc-gold-soft);
        color: var(--ifc-gold-dark);
    }

    .pulse-operations :is(
        .intake-search__icon,
        .pkg-customer-kpi__icon,
        .setup-detail-meta__ico,
        .relationship-modal__icon,
        .consignee-profile-modal__icon,
        .pkg-item-modal__icon,
        .shipment-rollover-modal__icon
    ) {
        border-color: rgba(31, 90, 59, 0.28);
        background: var(--ifc-green-soft);
        color: var(--ifc-green);
    }

    .pulse-operations :is(
        .expected-context-banner,
        .courier-context-banner,
        .customer-id-secure-note,
        .customer-id-card__security,
        .shipment-consignee-modal__assurance,
        .partner-piece-modal__note
    ) {
        border-color: rgba(31, 90, 59, 0.28);
        background: var(--ifc-green-soft);
        color: var(--ifc-green-dark);
    }

    .pulse-operations :is(
        .intake-tip-panel,
        .setup-notes,
        .shipment-blocked-callout,
        .bol-readiness,
        .manifest-helper,
        .cargo-drill-helper,
        .partner-delete-workspace-modal__warning
    ) {
        border-color: rgba(193, 138, 43, 0.34);
        background: var(--ifc-gold-soft);
        color: #654918;
    }

    .pulse-operations .timeline-dot,
    .pulse-operations .pkg-detail-timeline__marker,
    .pulse-operations .pkg-timeline__dot {
        border-color: var(--ifc-paper);
        background: var(--ifc-sand);
        box-shadow: 0 0 0 2px var(--ifc-sand);
    }

    .pulse-operations :is(
        .timeline-dot--logged,
        .timeline-dot--delivered,
        .pkg-detail-timeline__item--logged .pkg-detail-timeline__marker,
        .pkg-detail-timeline__item--delivered .pkg-detail-timeline__marker
    ) {
        background: var(--ifc-green);
        box-shadow: 0 0 0 2px var(--ifc-green);
    }

    .pulse-operations :is(
        .timeline-dot--pending_arrival,
        .timeline-dot--step,
        .pkg-detail-timeline__item--step .pkg-detail-timeline__marker,
        .pkg-detail-timeline__item--arrived .pkg-detail-timeline__marker
    ) {
        background: var(--ifc-gold);
        box-shadow: 0 0 0 2px var(--ifc-gold);
    }

    /* Analytics ------------------------------------------------------------ */
    .pulse-operations .analytics-tabs {
        border-bottom-color: var(--ifc-sand);
    }

    .pulse-operations .analytics-tab {
        color: var(--ifc-muted);
    }

    .pulse-operations .analytics-tab:hover {
        background: var(--ifc-sand-soft);
        color: var(--ifc-charcoal);
    }

    .pulse-operations .analytics-tab--active {
        color: var(--ifc-charcoal);
    }

    .pulse-operations .analytics-tab--active::after,
    .pulse-operations .pulse-kpi::before {
        background: var(--ifc-gold);
    }

    .pulse-operations :is(
        .analytics-chart,
        .analytics-rank-list,
        .analytics-drilldown-panel,
        .cargo-rank-list,
        .cargo-trend-chart,
        .cargo-insight-strip,
        .analytics-selected-manifest-card,
        .analytics-manifest-detail-card,
        .account-detail-card,
        .accounts-mix-card,
        .accounts-rank-card
    ) {
        border-color: var(--ifc-sand);
        background: var(--ifc-paper);
        color: var(--ifc-charcoal);
    }

    .pulse-operations :is(
        .analytics-stack__grid,
        .analytics-line-chart__grid,
        .analytics-bar-chart__grid
    ) {
        stroke: #ddd0bd;
    }

    .pulse-operations :is(
        .analytics-stack__grid-label,
        .analytics-stack__x-label,
        .analytics-stack__axis-title
    ) {
        fill: var(--ifc-muted);
    }

    .pulse-operations .cargo-type--36-box {
        --cargo-color: #c18a2b;
    }

    .pulse-operations .cargo-type--barrel {
        --cargo-color: #1f5a3b;
    }

    .pulse-operations .cargo-type--d-box {
        --cargo-color: #d2ad6e;
    }

    .pulse-operations .cargo-type--eh-box {
        --cargo-color: #ad7b28;
    }

    .pulse-operations .cargo-type--e-box {
        --cargo-color: #4f4b43;
    }

    .pulse-operations .cargo-type--pallet {
        --cargo-color: #47765c;
    }

    .pulse-operations .cargo-type--half-pallet {
        --cargo-color: #8f6725;
    }

    .pulse-operations .cargo-type--d-box {
        --cargo-color: #8f7a5d;
    }

    .pulse-operations :is(.cargo-type--appliance-furniture, .cargo-type--crate) {
        --cargo-color: #716b61;
    }

    .pulse-operations :is(.cargo-type--loose, .cargo-type--other) {
        --cargo-color: #988d7d;
    }

    /* Settings and worksheet surfaces ------------------------------------- */
    .pulse-operations .settings-users-panel,
    .pulse-operations .settings-users-toolbar,
    .pulse-operations .settings-users-filters,
    .pulse-operations .settings-users-table tbody tr {
        border-color: var(--ifc-sand);
        background: var(--ifc-paper);
    }

    .pulse-operations .settings-users-table th {
        background: var(--ifc-sand-soft);
        color: #514b42;
    }

    .pulse-operations .settings-users-table tbody tr:hover {
        background: #faf5ec;
    }

    .pulse-operations .settings-users-table .setup-identity__avatar {
        border-color: rgba(31, 90, 59, 0.24);
        background: var(--ifc-green-soft);
        color: var(--ifc-green);
    }

    .pulse-operations :is(
        .partner-worksheet__header,
        .partner-worksheet__toolbar,
        .partner-worksheet__actionbar,
        .partner-worksheet-table thead th,
        .partner-piece-summary
    ) {
        border-color: var(--ifc-sand);
        background: var(--ifc-sand-soft);
        color: var(--ifc-charcoal);
    }

    .pulse-operations .partner-worksheet-table tbody td {
        border-color: #e2d7c6;
        background: var(--ifc-paper);
    }

    .pulse-operations .partner-worksheet-table tbody tr:hover td {
        background: #faf5ec;
    }

    .pulse-operations .worksheet-selection-target {
        outline-color: rgba(31, 90, 59, 0.48);
        background: #f6faf7;
    }

    /* Overlays ------------------------------------------------------------- */
    .pulse-operations :is(
        .modal-backdrop,
        .pkg-modal-backdrop,
        .relationship-modal-backdrop,
        .manifest-modal-backdrop
    ) {
        background: rgba(37, 37, 37, 0.54);
    }

    .pulse-operations :is(
        .unknown-modal,
        .pkg-drawer,
        .pkg-item-modal,
        .consignee-profile-modal,
        .relationship-modal,
        .manifest-modal,
        .bol-new-modal,
        .bol-piece-modal,
        .manifest-new-modal,
        .manifest-assign-modal,
        .shipment-consignee-modal,
        .shipment-rollover-modal,
        .add-user-modal,
        .settings-confirm-modal,
        .partner-import-modal,
        .partner-piece-modal,
        .partner-bulk-delete-modal,
        .partner-delete-workspace-modal
    ) {
        border-color: var(--ifc-sand);
        background: var(--ifc-paper);
        color: var(--ifc-charcoal);
        box-shadow: 0 28px 80px rgba(37, 37, 37, 0.3);
    }

    .pulse-operations :is(
        .unknown-modal__header,
        .pkg-drawer__header,
        .pkg-item-modal__header,
        .consignee-profile-modal__header,
        .relationship-modal__header,
        .manifest-modal__header,
        .bol-new-modal__header,
        .bol-piece-modal__header,
        .manifest-new-modal__header,
        .manifest-assign-modal__header,
        .shipment-consignee-modal__header,
        .shipment-rollover-modal__header,
        .add-user-modal__header,
        .settings-confirm-modal__header,
        .partner-import-modal__header,
        .partner-piece-modal__header
    ) {
        border-color: #e2d7c6;
        background: #faf7f0;
    }

    .pulse-operations :is(
        .modal-close,
        .pkg-item-modal__close,
        .consignee-profile-modal__close,
        .relationship-modal__close,
        .manifest-modal__close,
        .partner-import-modal__close,
        .partner-piece-modal__close
    ) {
        border-color: var(--ifc-sand);
        background: var(--ifc-paper);
        color: var(--ifc-charcoal);
    }

    /* Staff sign-in -------------------------------------------------------- */
    .pulse-operations.auth-page {
        background:
            radial-gradient(circle at 12% 10%, rgba(193, 138, 43, 0.14), transparent 34rem),
            radial-gradient(circle at 88% 88%, rgba(31, 90, 59, 0.1), transparent 32rem),
            var(--ifc-off-white);
    }

    .pulse-operations .auth-card {
        position: relative;
        overflow: hidden;
        border-color: var(--ifc-sand);
        background: var(--ifc-paper);
        box-shadow: 0 24px 70px rgba(73, 61, 43, 0.16);
    }

    .pulse-operations .auth-card::before {
        content: "";
        position: absolute;
        inset: 0 0 auto;
        height: 5px;
        background: linear-gradient(
            90deg,
            var(--ifc-gold) 0 76%,
            var(--ifc-green) 76% 100%
        );
    }

    .pulse-operations .auth-brand .brand-mark {
        color: var(--ifc-charcoal);
    }

    .pulse-operations .auth-brand strong,
    .pulse-operations .auth-card h1 {
        color: var(--ifc-charcoal);
    }

    .pulse-operations :is(.auth-brand span:not(.brand-mark), .auth-support, .auth-note) {
        color: var(--ifc-muted);
    }

    /* Keep the onboarding workspace deliberately quieter than general staff
       cards, whose default elevation is useful on dashboards and ledgers. */
    .pulse-operations .courier-create-panel.courier-create-panel {
        box-shadow: 0 10px 28px rgba(73, 61, 43, 0.045);
    }
}

/* ==========================================================================
   Pulse Portal · Ideal Freight color system

   Every authenticated courier/customer page and every token-scoped access
   page carries `portal-body`, so this final cascade recolors the complete
   customer-facing surface without leaking into Pulse Operations. The palette
   is neutral-first: charcoal and warm paper establish the interface, ochre
   gold carries primary actions and selected emphasis, and Jamaican green is
   reserved for links, success, and supporting heritage detail. Red remains
   reserved for destructive and error states.
   ========================================================================== */
@media screen {
    body.portal-body {
        --ifc-charcoal: #252525;
        --ifc-charcoal-soft: #3b3935;
        --ifc-gold: #c18a2b;
        --ifc-gold-dark: #8b621d;
        --ifc-gold-soft: #f3e7d2;
        --ifc-green: #1f5a3b;
        --ifc-green-dark: #17442d;
        --ifc-green-soft: #e6efe9;
        --ifc-off-white: #f5f1e8;
        --ifc-paper: #fffdf9;
        --ifc-sand: #d8c9b2;
        --ifc-sand-soft: #eee6d9;
        --ifc-muted: #625e56;
        --ifc-muted-light: #7a7368;
        --ifc-danger: #9b3030;
        --ifc-danger-dark: #7e2525;
        --ifc-danger-soft: #f8e8e5;

        /* Existing shared components inherit a portal-safe semantic palette. */
        --pulse-blue: var(--ifc-green);
        --pulse-blue-dark: var(--ifc-charcoal);
        --pulse-gold: var(--ifc-gold);
        --pulse-teal: var(--ifc-green);
        --pulse-orange: var(--ifc-gold-dark);
        --pulse-bg: var(--ifc-off-white);
        --pulse-card: var(--ifc-paper);
        --pulse-text: var(--ifc-charcoal);
        --pulse-ink: var(--ifc-charcoal);
        --pulse-muted: var(--ifc-muted);
        --pulse-border: var(--ifc-sand);
        --pulse-shadow: 0 12px 32px rgba(73, 61, 43, 0.1);
        --pulse-portal-bg: var(--ifc-off-white);
        --pulse-portal-header: var(--ifc-charcoal);

        background: var(--ifc-off-white);
        color: var(--ifc-charcoal);
        accent-color: var(--ifc-green);
    }

    .portal-body .portal-main {
        background:
            radial-gradient(circle at 100% 0, rgba(193, 138, 43, 0.08), transparent 34rem),
            radial-gradient(circle at 0 100%, rgba(31, 90, 59, 0.055), transparent 30rem),
            var(--ifc-off-white);
    }

    /* Portal shell -------------------------------------------------------- */
    .portal-body .portal-header {
        border-bottom-color: rgba(193, 138, 43, 0.34);
        background: var(--ifc-charcoal);
        color: var(--ifc-off-white);
        box-shadow: 0 6px 18px rgba(37, 37, 37, 0.14);
    }

    .portal-body .portal-header::after {
        content: "";
        position: absolute;
        inset: auto 0 -1px;
        height: 1px;
        background: linear-gradient(
            90deg,
            var(--ifc-gold) 0 78%,
            var(--ifc-green) 78% 100%
        );
    }

    .portal-body .portal-brand-logo {
        border-color: rgba(216, 201, 178, 0.5);
        background: var(--ifc-off-white);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.14);
    }

    .portal-body .portal-account summary {
        border-color: rgba(216, 201, 178, 0.34);
        background: rgba(245, 241, 232, 0.07);
    }

    .portal-body .portal-account summary:hover,
    .portal-body .portal-account[open] summary {
        border-color: rgba(216, 201, 178, 0.58);
        background: rgba(245, 241, 232, 0.13);
    }

    .portal-body .portal-account__avatar {
        border: 1px solid rgba(216, 201, 178, 0.38);
        background: var(--ifc-off-white);
        color: var(--ifc-green);
    }

    .portal-body .portal-account__copy strong {
        color: var(--ifc-off-white);
    }

    .portal-body .portal-account__copy small {
        color: var(--ifc-sand);
    }

    .portal-body .portal-account__chevron {
        color: var(--ifc-sand);
    }

    .portal-body .portal-account__panel {
        border-color: var(--ifc-sand);
        background: var(--ifc-paper);
        color: var(--ifc-charcoal);
        box-shadow: 0 18px 42px rgba(37, 37, 37, 0.24);
    }

    .portal-body .portal-account__details {
        border-bottom-color: var(--ifc-sand);
    }

    .portal-body .portal-account__email,
    .portal-body .portal-account__scope {
        color: var(--ifc-muted);
    }

    .portal-body .portal-account__panel a {
        color: var(--ifc-green);
    }

    .portal-body .portal-account__panel a:hover {
        background: var(--ifc-off-white);
        color: var(--ifc-charcoal);
    }

    .portal-body .portal-nav__item {
        color: var(--ifc-sand);
    }

    .portal-body .portal-nav__item:hover {
        color: var(--ifc-off-white);
        background: rgba(245, 241, 232, 0.06);
    }

    .portal-body .portal-nav__item--active {
        border-bottom-color: var(--ifc-gold);
        color: var(--ifc-gold);
        background: rgba(193, 138, 43, 0.08);
    }

    .portal-body .portal-nav-toggle {
        border-color: rgba(216, 201, 178, 0.42);
        background: rgba(245, 241, 232, 0.08);
    }

    .portal-body .portal-nav-toggle span {
        background: var(--ifc-off-white);
    }

    .portal-body .portal-footer {
        border-top-color: var(--ifc-sand);
        background: var(--ifc-charcoal);
        color: var(--ifc-sand);
    }

    .portal-body .portal-footer p:first-child {
        color: var(--ifc-off-white);
        font-weight: 750;
    }

    /* Type, links, and focus --------------------------------------------- */
    .portal-body :is(
        .portal-page-head h1,
        .portal-card__title,
        .results-toolbar h2,
        .results-toolbar h3,
        .setup-list-title,
        .pkg-empty-state h3,
        .pkg-drawer__header h3,
        .customer-form__section-title
    ) {
        color: var(--ifc-charcoal);
    }

    .portal-body :is(.portal-eyebrow, .eyebrow, .courier-dashboard-kicker) {
        color: var(--ifc-gold-dark);
    }

    .portal-body :is(
        .portal-lede,
        .result-summary,
        .muted-text,
        .pkg-field small,
        .pkg-drawer__lead,
        .customer-form__section-desc
    ) {
        color: var(--ifc-muted);
    }

    .portal-body :is(
        .portal-crumb,
        .courier-dashboard-card__link,
        .courier-dashboard-strong-link,
        .courier-dashboard-footer-link,
        .pkg-track__num,
        .pkg-track__num--btn,
        .pkg-owner-link,
        .pkg-crumb,
        .panel-link,
        .shipment-cargo-link
    ) {
        color: var(--ifc-green);
    }

    .portal-body :is(
        a,
        button,
        input,
        select,
        textarea,
        summary
    ):focus-visible {
        outline-color: rgba(193, 138, 43, 0.72);
    }

    /* Buttons and interactive controls ---------------------------------- */
    .portal-body :is(
        .button,
        .portal-button,
        .courier-shipment-action,
        .courier-shipment-inline-action,
        .pkg-reset-button,
        .pkg-menu-trigger,
        .pkg-pager__btn,
        .pkg-pager__num,
        .pkg-view-btn,
        .modal-close,
        .relationship-modal__close,
        .consignee-profile-modal__close,
        .portal-consignee-modal__close
    ) {
        border-color: var(--ifc-sand);
        background: var(--ifc-paper);
        color: var(--ifc-charcoal);
    }

    .portal-body :is(
        .button--ghost,
        .portal-button--quiet,
        .courier-shipment-action--secondary,
        .courier-shipment-inline-action,
        .pkg-view-btn
    ):hover {
        border-color: var(--ifc-gold);
        background: var(--ifc-gold-soft);
        color: var(--ifc-charcoal);
    }

    .portal-body :is(
        .button--primary,
        .button--log,
        .portal-button--primary,
        .courier-shipment-action--primary,
        .customer-form__actions .button--primary,
        .portal-account-link-actions .portal-button--primary
    ) {
        border-color: var(--ifc-gold);
        background: var(--ifc-gold);
        color: var(--ifc-charcoal);
        box-shadow: 0 7px 18px rgba(139, 98, 29, 0.2);
    }

    .portal-body :is(
        .button--primary,
        .button--log,
        .portal-button--primary,
        .courier-shipment-action--primary,
        .customer-form__actions .button--primary,
        .portal-account-link-actions .portal-button--primary
    ):hover {
        border-color: var(--ifc-gold-dark);
        background: var(--ifc-gold-dark);
        color: var(--ifc-off-white);
    }

    .portal-body .button.is-confirmed {
        border-color: rgba(31, 90, 59, 0.3);
        background: var(--ifc-green-soft);
        color: var(--ifc-green-dark);
        box-shadow: none;
    }

    .portal-body :is(.button--cancel-action, .pkg-action-menu__item--danger) {
        color: var(--ifc-danger);
    }

    .portal-body :is(.button--cancel-action, .pkg-action-menu__item--danger):hover {
        border-color: rgba(155, 48, 48, 0.28);
        background: var(--ifc-danger-soft);
        color: var(--ifc-danger-dark);
    }

    /* Cards, forms, and shared package surfaces -------------------------- */
    .portal-body :is(
        .portal-card,
        .portal-stat,
        .panel,
        .pkg-metric,
        .pkg-date-picker__panel,
        .pkg-action-menu,
        .clearing-option,
        .shipment-consignee-option
    ) {
        border-color: var(--ifc-sand);
        background: var(--ifc-paper);
        color: var(--ifc-charcoal);
        box-shadow: 0 10px 28px rgba(73, 61, 43, 0.085);
    }

    .portal-body :is(.portal-stat, .pkg-metric):hover {
        border-color: var(--ifc-gold);
        background: #faf5ec;
        box-shadow: 0 12px 30px rgba(73, 61, 43, 0.12);
    }

    .portal-body .pkg-metric--active {
        border-color: var(--ifc-gold);
        background: var(--ifc-gold-soft);
        box-shadow: inset 0 0 0 1px var(--ifc-gold);
    }

    .portal-body .pkg-metric__value,
    .portal-body .pkg-metric__value--all {
        color: var(--ifc-charcoal);
    }

    .portal-body :is(
        .pkg-metric__value--pending_arrival,
        .pkg-metric__value--unknown,
        .pkg-metric__value--on_hold
    ) {
        color: var(--ifc-gold-dark);
    }

    .portal-body :is(
        .pkg-metric__value--logged,
        .pkg-metric__value--shipped,
        .pkg-metric__value--delivered
    ) {
        color: var(--ifc-green);
    }

    .portal-body .pkg-metric__value--cancelled {
        color: var(--ifc-danger);
    }

    .portal-body .pkg-metric__icon--all {
        background: var(--ifc-sand-soft);
        color: var(--ifc-charcoal);
    }

    .portal-body :is(
        .pkg-metric__icon--pending_arrival,
        .pkg-metric__icon--unknown,
        .pkg-metric__icon--on_hold
    ) {
        background: var(--ifc-gold-soft);
        color: var(--ifc-gold-dark);
    }

    .portal-body :is(
        .pkg-metric__icon--logged,
        .pkg-metric__icon--shipped,
        .pkg-metric__icon--delivered
    ) {
        background: var(--ifc-green-soft);
        color: var(--ifc-green);
    }

    .portal-body .pkg-metric__icon--cancelled {
        background: var(--ifc-danger-soft);
        color: var(--ifc-danger);
    }

    .portal-body :is(
        .pkg-field,
        .portal-account-contact-segment legend,
        .portal-account-contact-value-field > span
    ) {
        color: var(--ifc-charcoal-soft);
    }

    .portal-body :is(
        .pkg-field input,
        .pkg-field select,
        .pkg-field textarea,
        .pkg-date-picker__trigger,
        .portal-account-contact-choice,
        .portal-account-contact-value-field input
    ) {
        border-color: var(--ifc-sand);
        background: var(--ifc-paper);
        color: var(--ifc-charcoal);
    }

    .portal-body :is(
        .pkg-field input,
        .pkg-field select,
        .pkg-field textarea,
        .pkg-date-picker__trigger,
        .portal-account-contact-choice
    ):hover {
        border-color: var(--ifc-gold);
    }

    .portal-body :is(
        .pkg-field input,
        .pkg-field select,
        .pkg-field textarea,
        .pkg-date-picker__trigger,
        .portal-account-contact-choice
    ):focus,
    .portal-body .pkg-date-picker[open] .pkg-date-picker__trigger,
    .portal-body .portal-account-contact-choice:focus-within {
        border-color: var(--ifc-green);
        box-shadow: 0 0 0 4px rgba(31, 90, 59, 0.12);
        outline: 0;
    }

    .portal-body .portal-account-contact-choice.is-selected,
    .portal-body .portal-account-contact-choice:has(input:checked) {
        border-color: var(--ifc-gold);
        background: var(--ifc-gold-soft);
        color: var(--ifc-charcoal);
    }

    .portal-body :is(.customer-form__section, .pkg-toolbar-panel--embedded) {
        border-color: var(--ifc-sand);
    }

    .portal-body .customer-form__section-icon {
        background: var(--ifc-gold-soft);
        color: var(--ifc-gold-dark);
    }

    .portal-body :is(
        .customer-id-upload__empty,
        .courier-consignee-upload,
        .pkg-owner-lock,
        .pkg-mock-note
    ) {
        border-color: rgba(193, 138, 43, 0.44);
        background: #faf5ec;
        color: var(--ifc-charcoal-soft);
    }

    .portal-body :is(
        .customer-id-upload__icon,
        .courier-consignee-upload__icon,
        .pkg-owner-lock__icon
    ) {
        background: var(--ifc-gold-soft);
        color: var(--ifc-gold-dark);
    }

    /* Tables and ledgers -------------------------------------------------- */
    .portal-body :is(.pkg-ledger, .data-table, .setup-table) {
        background: var(--ifc-paper);
        color: var(--ifc-charcoal);
    }

    .portal-body :is(.pkg-ledger thead th, .data-table thead th, .setup-table thead th) {
        border-color: var(--ifc-sand);
        background: var(--ifc-sand-soft);
        color: #514b42;
    }

    .portal-body :is(.pkg-ledger tbody td, .data-table tbody td, .setup-table tbody td) {
        border-color: #e2d7c6;
        color: var(--ifc-charcoal-soft);
    }

    .portal-body :is(.pkg-lrow, .setup-row):hover td,
    .portal-body .data-table tbody tr:hover td {
        background: #faf5ec;
    }

    .portal-body .pkg-lrow--muted td {
        background: #f8f4ec;
    }

    .portal-body .pkg-lrow--muted:hover td {
        background: var(--ifc-sand-soft);
    }

    .portal-body :is(.pkg-sort__caret--asc, .pkg-sort__caret--desc) {
        color: var(--ifc-gold-dark);
        border-top-color: var(--ifc-gold-dark);
        border-bottom-color: var(--ifc-gold-dark);
    }

    .portal-body :is(.pkg-menu-trigger, .pkg-pager__btn, .pkg-pager__num) {
        border-color: var(--ifc-sand);
        background: var(--ifc-paper);
        color: var(--ifc-charcoal-soft);
    }

    .portal-body :is(.pkg-menu-trigger, .pkg-pager__btn, .pkg-pager__num):hover {
        border-color: var(--ifc-gold);
        background: var(--ifc-gold-soft);
        color: var(--ifc-charcoal);
    }

    .portal-body .pkg-pager__page {
        border-color: var(--ifc-gold);
        background: var(--ifc-gold-soft);
        color: var(--ifc-charcoal);
    }

    .portal-body :is(.pkg-ledger-foot, .results-toolbar, .shipment-index-toolbar) {
        border-color: var(--ifc-sand);
    }

    .portal-body .pkg-empty-state__icon {
        background: var(--ifc-sand-soft);
        color: var(--ifc-muted);
    }

    /* Semantic status colors -------------------------------------------- */
    .portal-body :is(
        .success-banner,
        .status-chip--logged,
        .status-chip--shipped,
        .status-chip--delivered,
        .status-chip--arrived,
        .status-chip--ready,
        .status-chip--ready_for_bol,
        .status-chip--manifest_complete,
        .id-badge--verified,
        .shipment-consignee-status--verified,
        .portal-account-active-pill,
        .portal-customer-verified-pill
    ) {
        border-color: rgba(31, 90, 59, 0.28);
        background: var(--ifc-green-soft);
        color: var(--ifc-green-dark);
    }

    .portal-body :is(
        .status-chip--pending_arrival,
        .status-chip--review,
        .status-chip--waiting,
        .status-chip--paperwork,
        .status-chip--pre_manifest,
        .status-chip--pending_close,
        .status-chip--needs_clearing,
        .status-chip--draft,
        .status-chip--on_water,
        .status-chip--unknown,
        .status-chip--unknown_attributed,
        .status-chip--on_hold,
        .id-badge--pending,
        .shipment-consignee-status--pending
    ) {
        border-color: rgba(193, 138, 43, 0.34);
        background: var(--ifc-gold-soft);
        color: var(--ifc-gold-dark);
    }

    .portal-body :is(
        .error-banner,
        .status-chip--blocked,
        .status-chip--cancelled,
        .id-badge--required,
        .shipment-consignee-status--required
    ) {
        border-color: rgba(155, 48, 48, 0.26);
        background: var(--ifc-danger-soft);
        color: var(--ifc-danger-dark);
    }

    .portal-body :is(.status-icon--logged, .status-icon--delivered) {
        background: var(--ifc-green-soft);
        color: var(--ifc-green);
    }

    .portal-body :is(
        .status-icon--pending_arrival,
        .status-icon--pending,
        .status-icon--unknown,
        .status-icon--unknown_attributed
    ) {
        background: var(--ifc-gold-soft);
        color: var(--ifc-gold-dark);
    }

    .portal-body .status-icon--on_hold {
        background: var(--ifc-danger-soft);
        color: var(--ifc-danger);
    }

    .portal-body .topbar-status .status-dot,
    .portal-body .pkg-status-pill .status-dot {
        background: var(--ifc-green);
    }

    /* Dashboard ---------------------------------------------------------- */
    .portal-body .courier-dashboard-ops {
        border-color: var(--ifc-sand);
        background: var(--ifc-paper);
        box-shadow: 0 10px 28px rgba(73, 61, 43, 0.085);
    }

    .portal-body .courier-dashboard-metric + .courier-dashboard-metric {
        border-color: #e2d7c6;
    }

    .portal-body .courier-dashboard-metric:hover,
    .portal-body :is(.courier-dashboard-list, .courier-dashboard-owner-list) a:hover,
    .portal-body .account-dashboard-account__summary:hover,
    .portal-body .portal-actions a:hover,
    .portal-body .portal-owner-list a:hover {
        background: #faf5ec;
    }

    .portal-body .courier-dashboard-metric--alert {
        background: #faf5ec;
        box-shadow: inset 3px 0 0 var(--ifc-gold);
    }

    .portal-body :is(
        .courier-dashboard-metric__icon,
        .courier-lifecycle__icon,
        .portal-account-section-head__icon,
        .portal-profile-card__icon
    ) {
        background: var(--ifc-gold-soft);
        color: var(--ifc-gold-dark);
    }

    .portal-body .courier-dashboard-metric--alert .courier-dashboard-metric__icon {
        background: var(--ifc-gold);
        color: var(--ifc-charcoal);
    }

    .portal-body :is(
        .courier-dashboard-table th,
        .courier-dashboard-table td,
        .courier-dashboard-list li + li,
        .courier-dashboard-owner-list li + li,
        .account-dashboard-account__details,
        .courier-dashboard-empty
    ) {
        border-color: #e2d7c6;
    }

    .portal-body .courier-lifecycle__node {
        border-color: var(--ifc-sand);
        background: var(--ifc-paper);
        color: var(--ifc-muted);
    }

    .portal-body .courier-lifecycle__step::after {
        background: var(--ifc-sand);
    }

    .portal-body .courier-lifecycle__step--complete .courier-lifecycle__node {
        border-color: rgba(31, 90, 59, 0.34);
        background: var(--ifc-green-soft);
        color: var(--ifc-green);
    }

    .portal-body .courier-lifecycle__step--complete::after {
        background: rgba(31, 90, 59, 0.42);
    }

    .portal-body .courier-lifecycle__step--complete .courier-lifecycle__tag {
        color: var(--ifc-green);
    }

    .portal-body .courier-lifecycle__step--current .courier-lifecycle__node {
        border-color: var(--ifc-gold);
        background: var(--ifc-gold-soft);
        color: var(--ifc-gold-dark);
        box-shadow: 0 0 0 3px rgba(193, 138, 43, 0.18);
    }

    .portal-body .courier-lifecycle__step--current .courier-lifecycle__tag,
    .portal-body .courier-lifecycle__step--attention .courier-lifecycle__tag {
        color: var(--ifc-gold-dark);
    }

    .portal-body .courier-lifecycle__step--attention .courier-lifecycle__node {
        border-color: var(--ifc-gold);
        background: var(--ifc-gold-soft);
        color: var(--ifc-gold-dark);
    }

    /* Account and customer profile -------------------------------------- */
    .portal-body--account-overview-customer,
    .portal-body--shipment-detail {
        --pulse-portal-bg: var(--ifc-off-white);
    }

    .portal-body .portal-account-summary-card__identity,
    .portal-body .portal-account-detail-grid div,
    .portal-body .portal-profile-fields div,
    .portal-body .portal-account-link-ledger__head,
    .portal-body .portal-account-link-row,
    .portal-body .portal-account-current-contact__row + .portal-account-current-contact__row {
        border-color: #e2d7c6;
    }

    .portal-body .portal-account-summary-card__avatar,
    .portal-body .portal-owner__avatar,
    .portal-body .portal-account-link-owner .portal-owner__avatar {
        border: 1px solid rgba(193, 138, 43, 0.34);
        background: var(--ifc-gold-soft);
        color: var(--ifc-gold-dark);
    }

    .portal-body .portal-account-detail-grid__icon {
        color: var(--ifc-green);
    }

    .portal-body .portal-account-scope-card {
        border-color: var(--ifc-sand);
        background: #faf5ec;
    }

    .portal-body .portal-account-scope-list li {
        color: var(--ifc-charcoal-soft);
    }

    .portal-body .portal-account-scope-list__check {
        background: var(--ifc-green);
        color: var(--ifc-off-white);
    }

    .portal-body .portal-account-link-row__access-group,
    .portal-body .portal-account-link-field,
    .portal-body .portal-account-current-contact {
        border-color: var(--ifc-sand);
        background: #faf7f0;
    }

    .portal-body .portal-account-link-field code,
    .portal-body .portal-account-link-owner__copy :is(strong, a) {
        color: var(--ifc-charcoal);
    }

    .portal-body .portal-account-link-copy__btn {
        border-color: var(--ifc-sand);
        background: var(--ifc-paper);
        color: var(--ifc-charcoal);
    }

    .portal-body .portal-account-link-copy__btn:hover {
        background: var(--ifc-gold-soft);
    }

    .portal-body .portal-account-link-copied {
        color: var(--ifc-green);
    }

    .portal-body .portal-account-link-off,
    .portal-body .portal-account-revoked-pill {
        border-color: var(--ifc-sand);
        background: var(--ifc-sand-soft);
        color: var(--ifc-muted);
    }

    .portal-body .portal-customer-hero,
    .portal-body .access-hero {
        border-color: var(--ifc-sand);
        background:
            linear-gradient(112deg, rgba(255, 253, 249, 0.98), rgba(238, 230, 217, 0.94)),
            var(--ifc-off-white);
        box-shadow: 0 16px 38px rgba(73, 61, 43, 0.12);
    }

    .portal-body .portal-customer-hero::after {
        background:
            repeating-radial-gradient(ellipse at 78% 42%, rgba(193, 138, 43, 0.16) 0 1px, transparent 2px 15px),
            repeating-linear-gradient(142deg, transparent 0 24px, rgba(255, 253, 249, 0.72) 25px 26px);
    }

    .portal-body .portal-customer-hero__avatar,
    .portal-body .access-hero__avatar {
        border-color: rgba(255, 253, 249, 0.9);
        background: var(--ifc-gold-soft);
        color: var(--ifc-charcoal);
        box-shadow: 0 12px 28px rgba(139, 98, 29, 0.18);
    }

    .portal-body :is(.portal-customer-hero__eyebrow, .access-hero__eyebrow) {
        color: var(--ifc-green);
    }

    .portal-body :is(.portal-customer-hero h1, .access-hero__copy h1, .portal-profile-card h2) {
        color: var(--ifc-charcoal);
    }

    .portal-body .portal-customer-hero__meta > span:not(:first-child)::before {
        background: var(--ifc-sand);
    }

    .portal-body .portal-profile-card {
        border-color: var(--ifc-sand);
        background: var(--ifc-paper);
        box-shadow: 0 10px 30px rgba(73, 61, 43, 0.09);
    }

    .portal-body .portal-profile-contact-card__button {
        border-color: var(--ifc-green);
        color: var(--ifc-green);
    }

    .portal-body .portal-account-contact-backdrop,
    .portal-body .pkg-modal-backdrop,
    .portal-body .modal-backdrop {
        background: rgba(37, 37, 37, 0.55);
    }

    .portal-body .portal-account-contact-note {
        background: var(--ifc-sand-soft);
    }

    .portal-body .portal-account-contact-note__icon {
        background: var(--ifc-green-soft);
        color: var(--ifc-green);
    }

    /* Shipment, consignee, and modal surfaces ---------------------------- */
    .portal-body :is(
        .courier-shipment-summary,
        .courier-shipment-packages,
        .courier-shipment-info,
        .courier-shipment-detail-panel,
        .portal-consignee-modal,
        .shipment-consignee-modal,
        .clearing-modal,
        .relationship-modal,
        .pkg-drawer,
        .pkg-item-modal,
        .consignee-profile-modal,
        .portal-account-contact-drawer,
        .portal-account-contact-modal
    ) {
        border-color: var(--ifc-sand);
        background: var(--ifc-paper);
        color: var(--ifc-charcoal);
        box-shadow: 0 24px 68px rgba(37, 37, 37, 0.22);
    }

    .portal-body :is(
        .portal-consignee-modal__header,
        .shipment-consignee-modal__header,
        .relationship-modal__header,
        .pkg-drawer__header,
        .pkg-item-modal__header,
        .consignee-profile-modal__header
    ) {
        border-color: var(--ifc-sand);
        background: #faf7f0;
    }

    .portal-body :is(
        .courier-shipment-summary__avatar,
        .courier-shipment-info .setup-info__icon,
        .courier-shipment-detail-row__icon,
        .courier-shipment-packages__icon,
        .portal-consignee-modal__icon,
        .shipment-consignee-modal__icon,
        .relationship-modal__icon,
        .pkg-item-modal__icon,
        .consignee-profile-modal__icon,
        .portal-account-contact-drawer__icon
    ) {
        border-color: rgba(193, 138, 43, 0.34);
        background: var(--ifc-gold-soft);
        color: var(--ifc-gold-dark);
    }

    .portal-body :is(
        .courier-shipment-page-head h1,
        .courier-shipment-summary .setup-summary__copy h3,
        .courier-shipment-packages .setup-recent__copy h3,
        .courier-shipment-info .setup-info__value,
        .courier-shipment-detail-panel h4,
        .portal-consignee-modal__title h2,
        .portal-consignee-modal__intro h3,
        .shipment-consignee-modal__title h3,
        .shipment-consignee-option__name,
        .shipment-consignee-detail__heading h4,
        .shipment-consignee-create__head h4,
        .consignee-profile-modal__identity h3
    ) {
        color: var(--ifc-charcoal);
    }

    .portal-body .courier-shipment-readiness-panel {
        border-color: rgba(31, 90, 59, 0.38);
        background: #f3f8f4;
    }

    .portal-body .courier-shipment-readiness-panel__icon,
    .portal-body .courier-shipment-readiness-proof__icon {
        border-color: rgba(31, 90, 59, 0.24);
        background: var(--ifc-green-soft);
        color: var(--ifc-green);
    }

    .portal-body .courier-shipment-readiness-panel__proofs,
    .portal-body .courier-shipment-readiness-proof + .courier-shipment-readiness-proof {
        border-color: rgba(31, 90, 59, 0.24);
    }

    .portal-body .pkg-ledger--shipment-detail,
    .portal-body .courier-shipment-detail-row + .courier-shipment-detail-row {
        border-color: var(--ifc-sand);
    }

    .portal-body .pkg-ledger--shipment-detail thead th {
        background: var(--ifc-sand-soft);
        color: #514b42;
    }

    .portal-body .shipment-consignee-option:hover,
    .portal-body .clearing-option:hover {
        border-color: var(--ifc-gold);
        background: #faf5ec;
    }

    .portal-body .shipment-consignee-option:has(.shipment-consignee-option__input:checked),
    .portal-body .clearing-option:has(.clearing-option__input:checked) {
        border-color: var(--ifc-gold);
        background: var(--ifc-gold-soft);
        box-shadow: inset 0 0 0 1px var(--ifc-gold);
    }

    .portal-body .shipment-consignee-option__radio {
        border-color: var(--ifc-sand);
        background: var(--ifc-paper);
    }

    .portal-body .shipment-consignee-option__radio::after {
        background: var(--ifc-gold);
    }

    .portal-body .shipment-consignee-option:has(.shipment-consignee-option__input:checked) .shipment-consignee-option__radio {
        border-color: var(--ifc-gold);
    }

    .portal-body :is(
        .clearing-option__avatar,
        .shipment-consignee-option__avatar,
        .shipment-consignee-detail__empty-icon,
        .shipment-consignee-detail-row__icon,
        .portal-consignee-modal__empty > span
    ) {
        border-color: rgba(193, 138, 43, 0.3);
        background: var(--ifc-gold-soft);
        color: var(--ifc-gold-dark);
    }

    .portal-body :is(
        .shipment-consignee-confirmation,
        .portal-callout--warning,
        .portal-consignee-modal__empty
    ) {
        border-color: rgba(193, 138, 43, 0.34);
        background: #faf5ec;
        color: var(--ifc-charcoal-soft);
    }

    .portal-body :is(
        .shipment-consignee-fallback,
        .shipment-consignee-modal__footer,
        .portal-consignee-modal__footer,
        .consignee-profile-row,
        .consignee-profile-modal__rule
    ) {
        border-color: #e2d7c6;
    }

    .portal-body .consignee-profile-modal__compliance {
        background: #faf7f0;
    }

    /* Token-scoped courier-customer access ------------------------------- */
    .portal-body .access-link-badge {
        border-color: rgba(193, 138, 43, 0.62);
        background: rgba(193, 138, 43, 0.14);
        color: var(--ifc-gold);
    }

    .portal-body .access-hero {
        border-left: 5px solid var(--ifc-gold);
    }

    .portal-body .access-hero__meta {
        border-color: rgba(216, 201, 178, 0.86);
        background: rgba(255, 253, 249, 0.74);
    }

    .portal-body .access-meta__icon {
        background: var(--ifc-green-soft);
        color: var(--ifc-green);
    }

    .portal-body .access-meta__label {
        color: var(--ifc-charcoal);
    }

    .portal-body .access-empty {
        border-color: var(--ifc-sand);
        background: var(--ifc-paper);
        box-shadow: 0 14px 34px rgba(73, 61, 43, 0.11);
    }

    .portal-body .access-empty h1 {
        color: var(--ifc-charcoal);
    }

    .portal-body .access-empty__icon--alert {
        background: var(--ifc-gold-soft);
        color: var(--ifc-gold-dark);
    }

    .portal-body .access-empty__icon--muted {
        background: var(--ifc-sand-soft);
        color: var(--ifc-muted);
    }

    /* Mobile portal navigation keeps the same charcoal shell. */
    @media (max-width: 980px) {
        .portal-body .portal-nav {
            border-top-color: rgba(216, 201, 178, 0.24);
            border-bottom-color: rgba(216, 201, 178, 0.24);
            background: var(--ifc-charcoal);
        }

        .portal-body .portal-nav__item--active {
            border-bottom-color: transparent;
            border-left-color: var(--ifc-gold);
            background: rgba(193, 138, 43, 0.12);
        }

        .portal-body .courier-dashboard-metric:nth-child(even),
        .portal-body .courier-dashboard-metric:nth-child(n + 3),
        .portal-body .courier-dashboard-metric + .courier-dashboard-metric,
        .portal-body .portal-account-detail-grid div:nth-child(even) {
            border-color: #e2d7c6;
        }
    }
}