.port-categories{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}.port-categories button{border:1px solid #d5e3ea;background:white;color:#4a6375;border-radius:8px;padding:10px 13px;font:inherit;font-size:13px;cursor:pointer;display:flex;gap:9px;align-items:center}.port-categories button span{font-size:11px;border-radius:5px;background:#eef3f6;padding:2px 6px}.port-categories button.active{background:#087e91;color:white;border-color:#087e91}.port-categories button.active span{background:#ffffff24}.port-layout{grid-template-columns:minmax(0,1fr) 345px}.port-info{padding:0;overflow:hidden;display:block;position:static}.port-photo{display:block;width:100%;height:195px;background:#eaf5f8;overflow:hidden}.port-card-photo{position:relative}.port-card-photo>span{position:absolute;bottom:12px;left:16px;color:white;background:#0e344e;border:2px solid white;border-radius:7px;padding:7px 10px;font-weight:bold;box-shadow:0 2px 8px #0b314d30}.port-card-body{padding:20px}.port-info h2{font-size:24px;margin:0 0 10px}.port-object-status{font-size:11px;display:inline-block;color:#067363;background:#e7f6f0;padding:5px 9px;border-radius:5px}.port-info .port-specs{margin:12px 0 20px;padding:0;border:0}.port-specs>div{display:flex;justify-content:space-between;align-items:baseline;gap:12px;border-bottom:1px solid #edf1f4;padding:10px 0}.port-info .port-specs dt{margin:0;font-size:12px}.port-info .port-specs dd{margin:0;font-size:13px;text-align:right;color:#16364e;font-variant-numeric:tabular-nums}.port-card-body h3{margin:18px 0 0;font-size:14px}.warehouse-load{background:#edf7f7;border:1px solid #cae4e6;border-radius:8px;padding:14px;margin:16px 0}.warehouse-load>div:first-child{display:flex;justify-content:space-between;align-items:center;font-size:12px}.warehouse-load>div:first-child b{font-size:25px;color:#00859b}.load-track{height:9px;background:#d5e6e9;border-radius:8px;overflow:hidden;margin:12px 0}.load-track>span{display:block;height:100%;background:linear-gradient(90deg,#0ca6a9,#0087a3);border-radius:8px}.load-details{display:flex;justify-content:space-between;gap:8px;font-size:10px;color:#567081}.load-details b{display:block;font-size:13px;color:#1b4257;margin-top:4px}.port-hotspot{width:37px;height:37px;font-size:11px}.kind-cranes{background:#4967ab}.kind-warehouses{background:#3e8c69}.kind-cargo{background:#98642d}.kind-terminal{background:#8460a7}.port-legend button span{width:29px;height:26px;border-radius:6px;font-size:10px}.effect-storage .port-hotspot.selected,.effect-passenger .port-hotspot.selected{animation:object-glow 1.8s ease-in-out infinite}.effect-storage .moving-container{display:block;left:var(--target-x);top:var(--target-y);background:#ffd462;animation:storage-arrival 3s ease infinite}.effect-lift .moving-container{animation:detail-lift 4.5s ease-in-out infinite}@keyframes detail-lift{0%,10%{left:calc(var(--target-x) + 2%);top:calc(var(--target-y) + 10%)}45%{left:var(--target-x);top:calc(var(--target-y) - 5%)}85%,100%{left:calc(var(--target-x) - 5%);top:var(--target-y)}}@keyframes storage-arrival{0%{transform:translate(50px,50px);opacity:0}40%{opacity:1}90%,100%{transform:translate(0,0);opacity:1}}@keyframes object-glow{50%{box-shadow:0 0 0 15px #ffaa3222}}.port-paused .port-hotspot{animation-play-state:paused}
@media(max-width:1250px){.port-layout{grid-template-columns:minmax(0,1fr) 300px}.port-card-body{padding:16px}.port-info h2{font-size:21px}.port-photo{height:170px}}
@media(max-width:1050px){.port-layout{grid-template-columns:minmax(0,1fr)}.port-info{display:grid;grid-template-columns:1fr 1.2fr}.port-card-photo{min-height:260px}.port-photo{height:100%;min-height:260px}.port-card-body{padding:20px}.port-card-photo>span{top:16px;bottom:auto}}
@media(max-width:600px){.port-categories{gap:6px}.port-categories button{font-size:11px;padding:8px 9px}.port-info{display:block}.port-card-photo{min-height:0}.port-photo{height:205px;min-height:0}.port-hotspot{width:30px;height:30px;font-size:10px}.port-legend{grid-template-columns:1fr 1fr}.port-card-body{padding:18px}.port-legend button{font-size:11px}.port-categories button span{font-size:10px}}
@media(prefers-reduced-motion:reduce){.port-hotspot.selected,.effect-storage .moving-container{animation:none!important}}
@media(max-width:600px){.port-hotspot[data-port-object="cargo-1"]{margin-left:-9px;margin-top:-7px}.port-hotspot[data-port-object="cargo-2"]{margin-left:9px;margin-top:7px}}

.port-photo{object-fit:cover}.port-photo-credit{margin:0 0 14px;font-size:10px;color:#657d8c;line-height:1.5}.port-photo-credit summary{cursor:pointer;width:fit-content}.port-photo-credit div{padding-top:8px;overflow-wrap:anywhere}.port-photo-credit a{color:#177b8d;text-decoration:underline}.port-photo-credit summary:focus-visible{outline:2px solid #087e91;outline-offset:3px}

.port-photo-tall{object-fit:contain;background:#eaf0f3}

.kind-yards{background:#98642d}.listing-type{display:inline-block;margin:2px 0 9px;padding:4px 8px;font-size:12px;color:#08788b;background:#e7f5f7;border-radius:5px}.tabs .count{font-size:12px;padding:3px 6px;margin-left:2px}.analytics-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:20px}.analytics-categories{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-bottom:20px}.analytics-category{min-width:0;padding:20px}.analytics-category-title{display:flex;gap:10px;align-items:center}.analytics-category-title h2{font-size:20px;margin:0;flex:1}.analytics-category-title>.icon{color:#078b9b}.analytics-total{margin:22px 0 16px}.analytics-total strong{display:block;font-size:36px;color:#087e91;line-height:1.2}.analytics-total span{font-size:12px;color:#58728b}.analytics-mini{display:flex;justify-content:space-between;font-size:12px;margin-bottom:18px;gap:8px}.analytics-category th,.analytics-category td{font-size:12px;padding:10px 6px}.analytics-category th{white-space:normal}.analytics-lower{margin-bottom:20px;align-items:start}.analytics-gauge{margin:20px 0 24px}.analytics-gauge>div:first-child{display:flex;justify-content:space-between;gap:10px}.analytics-gauge p{font-size:12px;color:#58728b}.analytics-distribution{display:grid;grid-template-columns:145px 1fr 40px;gap:10px;align-items:center;font-size:12px}.analytics-distribution .load-track{margin:9px 0}.analytics-distribution b{text-align:right}@media(max-width:1150px){.analytics-categories{grid-template-columns:1fr}.analytics-category table{width:100%}}@media(max-width:600px){.analytics-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.tabs[role=tablist]{flex-wrap:wrap}.analytics-distribution{grid-template-columns:110px 1fr 34px}.analytics-stats .stat strong{font-size:28px}.analytics-category{padding:16px}}