boxline-container-passport,
boxline-fleet-map,
boxline-market-deal,
boxline-rental-finance,
boxline-document-control,
boxline-international-roadmap {
    display: block;
    min-width: 0;
    --bxl-teal: var(--bxl-teal-accessible);
    --bxl-coral: var(--bxl-coral-accessible);
    --bxl-muted: var(--bxl-muted-accessible);
    color: var(--bxl-ink);
    font-family: var(--bxl-font);
    letter-spacing: 0;
}

.bxl-scene {
    overflow: hidden;
    border: 1px solid var(--bxl-line);
    border-radius: var(--bxl-radius-panel);
    background: var(--bxl-surface);
    box-shadow: var(--bxl-shadow-panel);
}

.bxl-scene button {
    font: inherit;
    letter-spacing: 0;
}

.bxl-scene button:focus-visible {
    outline: 2px solid var(--bxl-amber);
    outline-offset: 2px;
}

.bxl-scene__bar {
    display: flex;
    min-height: 48px;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 10px 16px;
    border-bottom: 1px solid var(--bxl-line);
    background: var(--bxl-paper);
}

.bxl-scene__bar span,
.bxl-scene__eyebrow {
    color: var(--bxl-teal);
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
}

.bxl-status {
    display: inline-flex;
    min-height: 26px;
    align-items: center;
    gap: 7px;
    padding: 5px 8px;
    border: 1px solid #b7d7ce;
    border-radius: var(--bxl-radius-small);
    background: #e6f3ef;
    color: #165f4b;
    font-size: 11px;
    font-weight: 800;
}

.bxl-status::before {
    width: 7px;
    height: 7px;
    background: var(--bxl-success);
    content: "";
}

.bxl-status--blocked {
    border-color: #e4b6ad;
    background: #fbebe8;
    color: #873d34;
}

.bxl-status--blocked::before {
    background: var(--bxl-coral);
}

.bxl-route {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0;
}

.bxl-route::before {
    position: absolute;
    right: 14px;
    left: 14px;
    height: 2px;
    background: var(--bxl-line);
    content: "";
}

.bxl-route__node {
    position: relative;
    z-index: 1;
    display: grid;
    width: 24px;
    height: 24px;
    place-items: center;
    border: 2px solid var(--bxl-line);
    border-radius: 50%;
    background: var(--bxl-surface);
    color: var(--bxl-muted);
    font-size: 10px;
    font-weight: 800;
}

.bxl-route__node.is-complete {
    border-color: var(--bxl-teal);
    background: var(--bxl-teal);
    color: white;
}

.bxl-passport__summary {
    display: grid;
    grid-template-columns: minmax(220px, .8fr) minmax(0, 1.4fr);
    gap: 24px;
    padding: 24px;
}

.bxl-container-card {
    position: relative;
    min-height: 210px;
    padding: 24px;
    background: var(--bxl-ink);
    color: var(--bxl-paper);
}

.bxl-container-card::after {
    position: absolute;
    right: 20px;
    bottom: 20px;
    width: 34px;
    height: 10px;
    border-right: 8px solid var(--bxl-coral);
    border-bottom: 5px solid var(--bxl-teal-bright);
    content: "";
}

.bxl-container-card small,
.bxl-container-card span,
.bxl-container-card strong {
    display: block;
}

.bxl-container-card small {
    color: #a9bfba;
    font-size: 11px;
    text-transform: uppercase;
}

.bxl-container-card strong {
    margin-top: 28px;
    font-size: 25px;
}

.bxl-container-card span {
    margin-top: 9px;
    color: #c6d6d2;
    font-size: 13px;
}

.bxl-passport__facts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    align-self: stretch;
    background: var(--bxl-line);
    border: 1px solid var(--bxl-line);
}

.bxl-passport__facts div {
    min-height: 84px;
    padding: 16px;
    background: var(--bxl-surface);
}

.bxl-passport__facts span,
.bxl-passport__facts strong {
    display: block;
}

.bxl-passport__facts span {
    color: var(--bxl-muted);
    font-size: 11px;
}

.bxl-passport__facts strong {
    margin-top: 9px;
    font-size: 15px;
}

.bxl-timeline {
    display: flex;
    overflow-x: auto;
    padding: 0 18px 18px;
    scrollbar-color: var(--bxl-line) transparent;
}

.bxl-timeline button {
    position: relative;
    flex: 0 0 118px;
    min-height: 74px;
    padding: 28px 10px 8px;
    border: 0;
    border-bottom: 2px solid var(--bxl-line);
    background: transparent;
    color: var(--bxl-muted);
    cursor: pointer;
    font-size: 11px;
    text-align: left;
}

.bxl-timeline button::before {
    position: absolute;
    top: 14px;
    left: 10px;
    width: 10px;
    height: 10px;
    border: 2px solid var(--bxl-line);
    border-radius: 50%;
    background: var(--bxl-surface);
    content: "";
}

.bxl-timeline button.is-selected {
    border-bottom-color: var(--bxl-coral);
    color: var(--bxl-ink);
    font-weight: 800;
}

.bxl-timeline button.is-selected::before {
    border-color: var(--bxl-coral);
    background: var(--bxl-coral);
}

.bxl-passport__event {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(200px, .7fr);
    gap: 24px;
    min-height: 170px;
    padding: 24px;
    border-top: 1px solid var(--bxl-line);
}

.bxl-passport__event h3 {
    margin: 7px 0 8px;
    font-size: 23px;
}

.bxl-passport__event p {
    margin: 0;
    color: var(--bxl-muted);
    line-height: 1.55;
}

.bxl-document-stack {
    display: grid;
    align-content: start;
    gap: 8px;
}

.bxl-document-stack span {
    padding: 10px 12px;
    border: 1px solid var(--bxl-line);
    border-left: 4px solid var(--bxl-teal);
    background: var(--bxl-paper);
    font-size: 12px;
    font-weight: 700;
}

.bxl-map__body {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(250px, .65fr);
    min-height: 430px;
}

.bxl-map__plot {
    position: relative;
    min-height: 430px;
    overflow: hidden;
    background: #e5ebe8;
}

.bxl-map__coast {
    position: absolute;
    inset: 12% 8% 10% 8%;
    border: 2px solid #b8c8c3;
    background: #d7e1dd;
    clip-path: polygon(4% 20%, 31% 4%, 56% 16%, 76% 7%, 95% 27%, 83% 48%, 92% 73%, 63% 92%, 38% 82%, 14% 94%, 2% 66%, 18% 43%);
}

.bxl-map__node {
    position: absolute;
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border: 3px solid var(--bxl-surface);
    border-radius: 50%;
    background: var(--bxl-teal);
    box-shadow: 0 4px 12px rgba(19, 42, 49, .18);
    color: white;
    cursor: pointer;
    font-size: 10px;
    font-weight: 800;
}

.bxl-map__node.is-selected {
    background: var(--bxl-coral);
    transform: scale(1.1);
}

.bxl-map__node:nth-of-type(1) {left: 75%; top: 67%;}
.bxl-map__node:nth-of-type(2) {left: 38%; top: 46%;}
.bxl-map__node:nth-of-type(3) {left: 27%; top: 29%;}
.bxl-map__node:nth-of-type(4) {left: 55%; top: 43%;}

.bxl-map__panel {
    padding: 24px;
    background: var(--bxl-ink);
    color: var(--bxl-paper);
}

.bxl-map__panel .bxl-scene__eyebrow {
    color: var(--bxl-teal-bright);
}

.bxl-map__panel h3 {
    margin: 9px 0 24px;
    font-size: 25px;
}

.bxl-map__stats {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1px;
    background: #34535a;
}

.bxl-map__stats div {
    min-height: 76px;
    padding: 12px;
    background: #1b363e;
}

.bxl-map__stats span,
.bxl-map__stats strong {
    display: block;
}

.bxl-map__stats span {color: #a9bfba; font-size: 10px;}
.bxl-map__stats strong {margin-top: 8px; font-size: 20px;}
.bxl-map__note {margin-top: 20px; color: #a9bfba; font-size: 11px; line-height: 1.5;}

.bxl-flow__body,
.bxl-finance__body,
.bxl-docs__body,
.bxl-international__body {
    padding: 24px;
}

.bxl-flow__nodes {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 7px;
}

.bxl-flow__node {
    position: relative;
    min-height: 118px;
    padding: 14px;
    border: 1px solid var(--bxl-line);
    background: var(--bxl-paper);
}

.bxl-flow__node::after {
    position: absolute;
    top: 50%;
    right: -8px;
    z-index: 2;
    width: 8px;
    height: 2px;
    background: var(--bxl-teal);
    content: "";
}

.bxl-flow__node:last-child::after {display: none;}
.bxl-flow__node.is-current {border-color: var(--bxl-coral); background: #fff7f5;}
.bxl-flow__node.is-complete {border-color: #9ec6bb; background: #eef7f4;}
.bxl-flow__node span,.bxl-flow__node strong,.bxl-flow__node small {display: block;}
.bxl-flow__node span {color: var(--bxl-teal); font-size: 10px; font-weight: 800;}
.bxl-flow__node strong {margin-top: 15px; font-size: 14px;}
.bxl-flow__node small {margin-top: 8px; color: var(--bxl-muted); line-height: 1.35;}
.bxl-flow__controls {display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 18px;}
.bxl-flow__controls p {margin: 0; color: var(--bxl-muted); font-size: 13px;}
.bxl-flow__controls button {min-height: 40px; border: 0; border-radius: var(--bxl-radius-control); padding: 9px 14px; background: var(--bxl-teal); color: white; cursor: pointer; font-weight: 750;}

.bxl-finance__periods,
.bxl-docs__versions {
    display: flex;
    gap: 8px;
    overflow-x: auto;
}

.bxl-finance__periods button,
.bxl-docs__versions button {
    flex: 0 0 auto;
    min-height: 40px;
    border: 1px solid var(--bxl-line);
    border-radius: var(--bxl-radius-control);
    padding: 8px 12px;
    background: var(--bxl-surface);
    color: var(--bxl-muted);
    cursor: pointer;
}

.bxl-finance__periods button.is-selected,
.bxl-docs__versions button.is-selected {
    border-color: var(--bxl-teal);
    background: #edf6f3;
    color: var(--bxl-ink);
    font-weight: 800;
}

.bxl-finance__ledger {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1px;
    margin-top: 18px;
    background: var(--bxl-line);
    border: 1px solid var(--bxl-line);
}

.bxl-finance__ledger div {
    min-height: 110px;
    padding: 16px;
    background: var(--bxl-surface);
}

.bxl-finance__ledger span,.bxl-finance__ledger strong,.bxl-finance__ledger small {display: block;}
.bxl-finance__ledger span {color: var(--bxl-muted); font-size: 11px;}
.bxl-finance__ledger strong {margin-top: 17px; font-size: 21px;}
.bxl-finance__ledger small {margin-top: 7px; color: var(--bxl-muted);}

.bxl-docs__panel {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(220px, .8fr);
    gap: 24px;
    margin-top: 20px;
}

.bxl-docs__paper {
    min-height: 260px;
    padding: 26px;
    border: 1px solid var(--bxl-line);
    border-top: 5px solid var(--bxl-ink);
    background: var(--bxl-surface);
    box-shadow: 8px 8px 0 var(--bxl-surface-muted);
}

.bxl-docs__paper h3 {margin: 20px 0 8px; font-size: 20px;}
.bxl-docs__paper p {color: var(--bxl-muted); line-height: 1.5;}
.bxl-docs__checks {display: grid; align-content: start; gap: 9px;}
.bxl-docs__checks span {padding: 11px 12px; border-left: 4px solid var(--bxl-success); background: #eef7f4; font-size: 12px;}

.bxl-international__body {background: var(--bxl-ink); color: var(--bxl-paper);}
.bxl-international__label {display: inline-flex; padding: 7px 9px; border: 1px solid #7a938d; border-radius: var(--bxl-radius-small); color: var(--bxl-teal-bright); font-size: 11px; font-weight: 800; text-transform: uppercase;}
.bxl-international__body h3 {max-width: 700px; margin: 18px 0 10px; font-size: 28px;}
.bxl-international__body > p {max-width: 760px; color: #b9ccc8; line-height: 1.55;}
.bxl-international__route {display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 8px; margin-top: 26px;}
.bxl-international__route div {min-height: 90px; padding: 13px; border: 1px solid #36535a; background: #1b363e;}
.bxl-international__route span,.bxl-international__route strong {display:block;}
.bxl-international__route span {color:#8fb2ac;font-size:10px;}
.bxl-international__route strong {margin-top:12px;font-size:13px;}
.bxl-international__limit {margin-top:18px;padding-left:12px;border-left:4px solid var(--bxl-coral);color:#ffd7d0;font-size:12px;font-weight:750;}

.bxl-scene-fallback {
    padding: 18px;
    border: 1px solid var(--bxl-line);
    background: var(--bxl-paper);
    color: var(--bxl-muted);
    line-height: 1.55;
}

@media (max-width: 900px) {
    .bxl-passport__summary,
    .bxl-passport__event,
    .bxl-map__body,
    .bxl-docs__panel {grid-template-columns: 1fr;}
    .bxl-map__plot {min-height: 330px;}
    .bxl-flow__nodes {grid-template-columns: repeat(3, minmax(0, 1fr));}
    .bxl-flow__node:nth-child(3)::after {display:none;}
    .bxl-finance__ledger {grid-template-columns: repeat(2, minmax(0, 1fr));}
    .bxl-international__route {grid-template-columns: repeat(3,minmax(0,1fr));}
}

@media (max-width: 600px) {
    .bxl-scene__bar {align-items:flex-start; flex-direction:column;}
    .bxl-passport__summary,.bxl-passport__event,.bxl-flow__body,.bxl-finance__body,.bxl-docs__body,.bxl-international__body {padding:16px;}
    .bxl-passport__facts {grid-template-columns: 1fr;}
    .bxl-container-card {min-height:180px;}
    .bxl-flow__nodes {grid-template-columns: 1fr 1fr;}
    .bxl-flow__node:nth-child(2n)::after {display:none;}
    .bxl-flow__controls {align-items:stretch; flex-direction:column;}
    .bxl-finance__ledger {grid-template-columns: 1fr;}
    .bxl-international__route {grid-template-columns: 1fr 1fr;}
}

@media (prefers-reduced-motion: reduce) {
    .bxl-map__node {transform:none!important; transition:none!important;}
}