/* Cargo stacks on glass: authoritative quantities, static unless receipted.
   The container sprites (modules and port containers) and the capacity ruler
   are kept; they sit on the glass field the README uses for the sector chart
   (rgba(255,255,255,.03) with a 1px #ffffff1f edge). The photographed rack,
   shed and gantry backplates and the steel, brass and paper labels are retired.
   Hairlines mark the decks and dashed outlines the free bays. Labels are glass
   chips (11px mono). Nothing animates: a receipt marks what changed with a
   static accent outline and a caption (README "Transitions"). */
.cargo-stack{position:relative;margin:0;min-width:0;color:var(--ink,#e8e4d6)}
.cargo-stage{display:block!important;position:relative;inset:auto;isolation:isolate;container-type:inline-size;aspect-ratio:var(--cargo-stage-ratio,5/3);width:100%;max-height:300px;overflow:hidden;margin:0;box-sizing:border-box;background:rgba(255,255,255,.03);border:1px solid var(--line,#ffffff1f);border-radius:0;opacity:1;transform:none;box-shadow:none}
.cargo-stage .cargo-raster{visibility:hidden}
.merchant-bridge .cargo-stage{display:block!important;opacity:1!important;position:relative;inset:auto;z-index:auto;pointer-events:auto;transition:none}
:root[data-kit="ready"] .cargo-stage[data-art-ready="true"] .cargo-raster{visibility:visible}
/* Deck hairlines at the authored slot baselines; the port floor at 96%. */
.cargo-decks{position:absolute;inset:0;pointer-events:none}
.cargo-deck{position:absolute;left:4%;right:4%;height:0;border-top:1px solid var(--line,#ffffff1f)}
.cargo-deck.cargo-shed-floor{top:96%}
.cargo-bay-grid{position:absolute;inset:0}
.cargo-bay{position:absolute;box-sizing:border-box;min-width:0;border:0;outline:1px dashed var(--line,#ffffff1f);outline-offset:-2px}
.cargo-container[data-cargo-metadata]{display:none}
.cargo-module{position:absolute;left:calc(var(--module-index,0)*100%/var(--module-count,1));width:calc(100%/var(--module-count,1));height:100%;bottom:0;box-sizing:border-box;min-height:0}
.cargo-occupied{position:absolute;inset:0 0 var(--cargo-label-height,0px);overflow:visible;container-type:size}.cargo-body{position:absolute;left:50%;bottom:0;width:min(96%,calc(100cqh * var(--object-ratio)));height:auto;aspect-ratio:var(--object-ratio);transform:translateX(-50%)}
.cargo-sprite-slot{position:absolute;inset:0;display:block;container-type:size;pointer-events:none}
.cargo-sprite{position:absolute;display:block;overflow:hidden!important;pointer-events:none;left:50%;bottom:0;width:min(100%,calc(100cqh * var(--sprite-ratio)));height:auto;aspect-ratio:var(--sprite-ratio);transform:translateX(-50%)}
.cargo-sprite-image{position:absolute;max-width:none!important;max-height:none!important}
/* The drawn fallback shapes while the container art loads, or if it fails. */
.cargo-fallback{position:absolute;inset:0;width:100%;height:100%;display:block;fill:#9ea59640;color:var(--ink-muted,#9ea596)}
:root[data-kit="ready"] .cargo-stage[data-art-ready="true"]:not([data-image-error="true"]) .cargo-fallback{display:none}
.cargo-stage[data-image-error="true"] .cargo-raster{visibility:hidden!important}
/* The good's thumbnail tags its first bay: a glass chip, upright. */
.cargo-tag{position:absolute;left:4%;top:0;bottom:auto;padding:1px;width:32px;height:32px;box-sizing:border-box;background:var(--glass,rgba(8,12,9,.78));border:1px solid var(--line,#ffffff1f);z-index:4}.cargo-tag[hidden]{display:none}
.cargo-tag .goods-thumb{border:0}
.cargo-restraint{left:38%;right:38%;height:100%;z-index:2}.cargo-location-storage .cargo-restraint{left:18%;right:18%}.cargo-lashing,.cargo-frost{z-index:3}.cargo-frost>.cargo-sprite{max-width:64px}
.cargo-livery{position:absolute;left:12%;right:12%;bottom:20%;height:7%;background:var(--cargo-paint,#67645a);opacity:.7}
.cargo-paint-mineral{--cargo-paint:#ad833e}.cargo-paint-renewable{--cargo-paint:#688985}.cargo-paint-organic{--cargo-paint:#89904e}
.cargo-supply-band{inset:auto 8% 13%;height:15%;z-index:2}
/* A part-filled bay: an accent level line and its tonnage. */
.cargo-level-mark{position:absolute;left:14%;right:14%;top:calc(80% - var(--cargo-object-level)*.65);height:1px;color:var(--accent,#9fd4a6);font-size:11px;pointer-events:none;z-index:4}
.cargo-level-mark:has(b:not([hidden])){height:auto}
.cargo-level-mark i{position:absolute;left:0;right:0;top:0;border-top:1px solid currentColor}
.cargo-level-mark b{position:relative;display:block;left:50%;margin-top:3px;transform:translateX(-50%);font:400 11px/1.3 var(--font-mono);white-space:nowrap;color:var(--ink,#e8e4d6);background:var(--glass,rgba(8,12,9,.78));padding:1px 4px;border:1px solid var(--line,#ffffff1f);min-width:8ch;width:max-content;text-align:center}.cargo-level-mark b[hidden]{display:none}
.cargo-pending-in .cargo-occupied{transform:translateY(-12px)}.cargo-pending-out .cargo-occupied{transform:translateY(-6px)}
.cargo-landing{position:absolute;inset:0;border:1px dashed var(--accent,#9fd4a6);pointer-events:none;z-index:1}
.cargo-pending-hook{height:45%;width:24%;left:38%;right:auto;top:-35%;bottom:auto}
.cargo-location-storage .cargo-pending-hook{height:max(18px,50%);width:90%;left:5%;top:-30px}
.cargo-location-storage .cargo-pending-in .cargo-occupied{transform:translateY(-18px)}
.cargo-state-marks{position:absolute;left:calc(-100%*var(--module-index));width:calc(100%*var(--module-count));bottom:0;display:flex;flex-wrap:wrap;gap:0;z-index:5;pointer-events:none}
.cargo-state-mark{display:block;min-width:8ch;color:var(--ink,#e8e4d6);background:var(--glass,rgba(8,12,9,.78));font:400 11px/1.3 var(--font-mono);padding:1px 4px;white-space:normal;max-width:100%;box-sizing:border-box;border:1px solid var(--line,#ffffff1f)}
.cargo-state-mark[data-state="pending-in"]{color:var(--accent,#9fd4a6);border-color:var(--accent-60)}
.cargo-state-mark[data-state="pending-out"]{color:var(--bad,#e0604a);border-color:var(--bad,#e0604a)}
.cargo-detached-states{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}.cargo-detached-states[hidden]{display:none}.cargo-detached-state{flex:1 1 120px;min-width:8ch;padding:4px 6px;border:1px solid var(--line,#ffffff1f);color:var(--ink,#e8e4d6)}.cargo-detached-state strong{display:block;font:400 13px/1.4 var(--font-ui);min-width:8ch}.cargo-detached-state .cargo-state-marks{position:static;width:auto;display:flex;gap:4px}.cargo-detached-state .cargo-state-mark{position:static;max-width:none;flex:1 0 8ch}
.cargo-placard .cargo-state-mark{background:none!important;border:0;color:var(--ink-muted,#9ea596);padding:1px 0;font-size:11px;clear:both}
.cargo-location-storage .cargo-stage-mark{left:6px;top:6px}
.cargo-parked-hook{display:none}
/* HULL n · SAMPLE / UNDERWAY: the stage's mono tag, top left. */
.cargo-stage-mark{position:absolute;left:8px;top:8px;background:var(--glass,rgba(8,12,9,.78));color:var(--ink-muted,#9ea596);font:400 11px/1.3 var(--font-mono);letter-spacing:.06em;padding:2px 6px;border:1px solid var(--line,#ffffff1f);min-width:8ch;max-width:90%;z-index:5}
.cargo-stack>.cargo-detached-cue{position:relative;left:auto;top:auto;width:max-content;max-width:100%;box-sizing:border-box;margin:4px 0}
.cargo-more-lots{position:absolute;right:8px;top:8px;font:400 11px/1.3 var(--font-mono);color:var(--ink,#e8e4d6);background:var(--glass,rgba(8,12,9,.78));border:1px solid var(--line,#ffffff1f);padding:2px 6px;min-width:8ch;z-index:5}
.cargo-more-lots[hidden],.cargo-lot[hidden]{display:none!important}
.cargo-error{position:absolute;left:8%;right:8%;top:35%;padding:10px 12px;z-index:6;font:400 13px/1.4 var(--font-ui);color:var(--ink,#e8e4d6);border:1px solid var(--bad,#e0604a);background:var(--bad-08,#e0604a14)}
.cargo-figcaption{display:flex;gap:4px 12px;justify-content:space-between;align-items:baseline;flex-wrap:wrap;margin:6px 0 0;box-sizing:border-box;font:400 12px/1.4 var(--font-mono);color:var(--ink-muted,#9ea596);max-width:100%;font-variant-numeric:tabular-nums}
.cargo-caption{min-width:min(100%,8ch);color:inherit}.cargo-scale{font-size:11px;min-width:8ch;white-space:normal}.cargo-sample{margin:4px 0 0;font:400 11px/1.4 var(--font-mono);color:var(--ink-muted,#9ea596)}
/* Capacity: identity, figures and the drawn ruler, without a plate. */
.capacity-plate{position:relative;display:flex;align-items:center;flex-wrap:wrap;gap:6px 16px;max-width:100%;box-sizing:border-box;margin-top:8px;color:var(--ink,#e8e4d6)}
.cargo-capacity-text{min-width:min(100%,200px);flex:1 1 220px}.cargo-capacity-text strong{display:block;font:500 11px/1 var(--font-ui);letter-spacing:.18em;text-transform:uppercase;color:var(--accent,#9fd4a6)}
.cargo-capacity-text span{display:block;margin-top:6px;font:400 13px/1.3 var(--font-mono);color:var(--ink,#e8e4d6);font-variant-numeric:tabular-nums}.cargo-capacity-text small{display:block;margin-top:2px;font:400 11px/1.3 var(--font-mono);color:var(--ink-muted,#9ea596)}
.capacity-punch{position:relative;flex:1 0 180px;min-width:160px;height:30px;background:none;isolation:isolate;color:var(--ink-muted,#9ea596);font-size:11px}
.cargo-stack .capacity-punch{flex-shrink:1;min-width:0;max-width:100%}
.capacity-track{position:absolute;display:block;inset:4px 1.8em 0;height:12px}
.capacity-track:before{content:'';position:absolute;left:0;right:0;top:5px;height:2px;background:var(--ring-track,#ffffff22)}
.capacity-fill{position:absolute;left:0;top:5px;height:2px;width:var(--cargo-level);background:var(--accent,#9fd4a6)}
.capacity-pointer{position:absolute;left:var(--cargo-level);top:0;height:12px;border-left:2px solid var(--accent,#9fd4a6);transform:translateX(-1px);z-index:2}
.capacity-tick{position:absolute;left:var(--tick);top:2px;height:8px;border-left:1px solid var(--line,#ffffff1f)}
.capacity-tick b{position:absolute;left:0;top:12px;transform:translateX(-50%);font:400 11px/1.2 var(--font-mono);color:var(--ink-muted,#9ea596);width:8ch;text-align:center}
.capacity-tick:first-of-type b{transform:none;text-align:left}.capacity-tick:last-child b{transform:translateX(-100%);text-align:right}
.cargo-capacity-text .cargo-full-word{display:inline;font:inherit;color:var(--bad,#e0604a)}
.cargo-overflow-lots{position:relative;display:flex;flex-wrap:wrap;align-items:end;gap:8px;margin-top:8px;padding:8px;border:1px solid var(--bad,#e0604a);background:var(--bad-08,#e0604a14);isolation:isolate}.cargo-overflow-tape{inset:auto 0 40px;height:24px}
.cargo-overflow-item{position:relative;flex:0 1 170px;min-width:8ch;font:400 12px/1.3 var(--font-ui);color:var(--ink,#e8e4d6)}
.cargo-excess-object{display:block;position:relative;height:65px;width:110px;margin:auto}
.cargo-overflow-item>.cargo-overflow-tag{position:relative;display:flex;align-items:center;gap:4px;padding:3px;border:1px solid var(--line,#ffffff1f);color:var(--ink,#e8e4d6);font:400 11px/1.3 var(--font-mono)}.cargo-overflow-tag>span:last-child{min-width:8ch}
.cargo-overflow-lots .cargo-raster{visibility:hidden}:root[data-kit="ready"] .cargo-overflow-lots[data-art-ready="true"] .cargo-raster{visibility:visible}
.cargo-over .cargo-stage{border-color:var(--bad,#e0604a)}
.cargo-lots{position:absolute;inset:15% 10% 4% 4%;display:grid;grid-template-columns:repeat(var(--cargo-lots),minmax(0,max(160px,10em)));grid-template-rows:minmax(0,1fr);align-items:end;gap:8px}
.cargo-lot{position:relative;min-width:0;min-height:0;height:100%;display:flex;flex-direction:column;justify-content:end}.cargo-lot-stack{position:relative;flex:1;min-height:0;margin-bottom:8px}
.cargo-yard-cell{position:absolute;box-sizing:border-box}.cargo-yard-cell .cargo-module{left:0;width:100%}.cargo-yard-cell .cargo-body{bottom:0}
/* A lot's placard: a glass label with the good, its tonnage and any state. */
.cargo-placard{position:relative;display:flex;align-items:center;gap:6px;min-height:36px;flex:none;padding:3px 6px;border:1px solid var(--line,#ffffff1f);box-sizing:border-box;color:var(--ink,#e8e4d6);background:var(--glass,rgba(8,12,9,.78))}
.cargo-placard>span:not(.goods-thumb){min-width:0;flex:1}.cargo-placard>.goods-thumb{flex:none;width:28px;height:28px}.cargo-placard strong{display:block;min-width:8ch;font:400 12px/1.3 var(--font-ui);color:var(--ink,#e8e4d6);word-break:normal;overflow-wrap:normal}.cargo-placard b{display:block;min-width:8ch;font:400 12px/1.3 var(--font-mono);font-weight:400;color:var(--ink,#e8e4d6);font-variant-numeric:tabular-nums}
.cargo-detached-labels{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}.cargo-detached-labels[hidden],.cargo-placard[hidden]{display:none!important}.cargo-detached-labels>.cargo-placard{flex:1 1 140px;min-width:min(100%,8ch);height:auto!important;max-width:100%;align-items:start;overflow:visible}.cargo-detached-labels>.cargo-placard>span:not(.goods-thumb){display:block;clear:both}.cargo-detached-labels>.cargo-placard .cargo-state-mark{line-height:1.3}
.cargo-detached-placards .cargo-lot{flex-direction:column!important}.cargo-detached-placards .cargo-lot-stack{width:100%;height:100%;margin-bottom:0;flex:1}
.cargo-detached-labels>.cargo-more-lots{position:static;align-self:start;margin:0;max-width:100%}
.cargo-placard-enlarged{display:block!important}.cargo-placard-enlarged>.goods-thumb{float:none!important;display:block}.cargo-placard-enlarged>span:not(.goods-thumb){display:block;clear:both;padding-top:3px}
.cargo-lot-more{font:400 12px/1.2 var(--font-mono);color:var(--ink-muted,#9ea596);min-width:8ch}
.cargo-open-floor{position:relative;min-width:40px;height:100%}.cargo-forklift{inset:auto 10% 15%;height:55%}.cargo-forklift>.cargo-sprite{max-width:114px}
.cargo-unconfirmed{position:absolute;inset:30% 28% 26%;z-index:5}.cargo-unconfirmed>.cargo-stage-mark{top:auto;bottom:0}
.cargo-unconfirmed .cargo-sprite{max-width:113px}.cargo-unconfirmed>.cargo-stage-mark{left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100cqw - 16px)}
.cargo-location-storage[data-state="unconfirmed"] .cargo-lot-stack,.cargo-location-storage[data-state="unconfirmed"] .cargo-lot-stack *{visibility:hidden!important}
.cargo-compact{max-width:none;margin:0}.cargo-compact .cargo-stage{height:clamp(130px,9em,200px);max-height:200px}.cargo-compact .cargo-tag{display:none}
.cargo-compact .capacity-plate{gap:5px}.cargo-compact .capacity-punch{display:none}
.cargo-compact .cargo-capacity-text span,.cargo-compact .cargo-figcaption{font-size:12px}
.cargo-compact .cargo-stage:has(>.cargo-stage-mark)>.cargo-more-lots{top:34px}
.cargo-compact .cargo-lots{inset:12% 8% 3% 4%}.cargo-compact .cargo-lot-stack{min-height:0;margin-bottom:6px}
.cargo-compact .cargo-placard{min-height:30px}.cargo-compact .cargo-placard .goods-thumb{display:none}.cargo-strip .cargo-stage{height:56px;aspect-ratio:auto}
.cargo-strip .cargo-bay{top:17%!important;height:66%!important}
.cargo-quantity{display:inline-flex;align-items:center;gap:7px;flex-wrap:wrap;max-width:100%;font:400 13px/1.4 var(--font-mono)}
.cargo-mass-bar{display:inline-block;flex:0 0 48px;width:48px;height:4px;position:relative;overflow:hidden;background:var(--ring-track,#ffffff22)}
.cargo-mass-filled,.cargo-mass-reserved{position:absolute;left:0;top:0;bottom:0;background:var(--accent,#9fd4a6)}.cargo-mass-reserved{border-top:2px dashed var(--ink-muted,#9ea596);background:none}.cargo-mass-count{white-space:nowrap;font-variant-numeric:tabular-nums}
.cargo-delta-caption{display:flex;gap:6px;align-items:center;flex-wrap:wrap;padding:6px 0 0;font:400 12px/1.4 var(--font-mono);color:var(--accent,#9fd4a6)}
/* A receipt outlines the changed containers; nothing moves. */
.cargo-changed,.cargo-changed-static{outline:2px solid var(--accent,#9fd4a6);outline-offset:-2px}
@media(max-width:1279px){.cargo-stage{max-height:260px}}
@media(max-width:760px){.cargo-stage{max-height:200px}.cargo-yard{height:200px}.cargo-lots{gap:5px;inset:12% 8% 4px 4%}.cargo-placard{display:block;min-height:52px;padding:3px 4px}.cargo-placard>.goods-thumb{float:left;margin-right:4px}.cargo-placard strong{font-size:12px}.capacity-plate{gap:6px}.capacity-punch{flex-basis:100%;min-width:0}.cargo-tag{width:30px;height:30px;padding:1px}.cargo-compact .cargo-yard{height:clamp(130px,9em,200px)}.cargo-compact .cargo-placard{min-height:44px}}
@media(max-width:375px){.cargo-placard>span:not(.goods-thumb){display:block;clear:both;padding-top:2px}}
@media(max-width:1279px) and (max-height:500px) and (pointer:coarse){.cargo-stage{height:56px;aspect-ratio:auto}.cargo-bay{top:17%!important;height:66%!important}.cargo-tag,.cargo-stage-mark{display:none}.cargo-lots{inset:5% 8% 5% 4%;grid-auto-rows:46px}.cargo-lot{flex-direction:row;gap:4px;align-items:end}.cargo-lot-stack{height:100%;min-height:0;flex:1}.cargo-placard{min-height:0;flex:1;font-size:11px}.cargo-placard .goods-thumb{display:none}.cargo-placard strong,.cargo-placard b{font-size:11px}.cargo-deck{display:none}}
@media(prefers-reduced-motion:reduce){.cargo-stack *{animation:none!important;transition:none!important}}
@media(max-width:1279px) and (max-height:500px) and (pointer:coarse){.cargo-yard-cell .cargo-body{bottom:0}}
@media(forced-colors:active){
.cargo-stage,.capacity-punch,.cargo-quantity,.cargo-placard,.cargo-detached-state,.cargo-state-mark,.cargo-more-lots,.cargo-stage-mark,.cargo-level-mark b,.cargo-tag,.cargo-overflow-lots,.cargo-error{forced-color-adjust:auto;background:Canvas!important;color:CanvasText!important;border-color:CanvasText!important}
.cargo-raster{display:none!important}.cargo-fallback{display:block!important;fill:CanvasText;color:CanvasText}.cargo-mass-filled,.capacity-fill,.capacity-track:before{forced-color-adjust:none;background:CanvasText}.capacity-pointer,.cargo-level-mark i{border-color:CanvasText}.cargo-bay{outline-color:GrayText}.cargo-deck{border-color:GrayText}.cargo-changed,.cargo-changed-static{outline-color:Highlight}}
