/* LA/Long Beach Port Facts and Figures (pages_portfacts.py). Palette #003DA5 / #FF6720 on white or #EEF3FA. */
.pf-section .pf-copy{max-width:820px}
.pf-section .pf-copy p,.pf-section .pf-bullets li{font-size:17px;line-height:1.7;color:var(--body-ink)}
.pf-h3{font:600 24px/1.25 Oswald,sans-serif;color:var(--navy);margin:40px 0 12px}
.pf-updated{font-size:15px;color:var(--muted);margin:0 0 20px}
.pf-tiles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.pf-tiles-3{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:24px}
.pf-tile{background:#EEF3FA;border-top:4px solid #003DA5;padding:20px 20px 18px;display:flex;flex-direction:column;gap:6px;min-width:0}
.alt .pf-tile,.pf-section:not(.white) .pf-tile{background:#fff}
.pf-tile:nth-child(even){border-top-color:#FF6720}
.pf-tile-label{font:600 12.5px Oswald,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#003DA5}
.pf-tile-value{font:700 36px/1.1 Oswald,sans-serif;color:var(--navy);overflow-wrap:anywhere}
.pf-tile-unit{font:500 16px Inter,Arial,sans-serif;color:var(--muted)}
.pf-tile-sub{font-size:14px;line-height:1.5;color:var(--muted)}
.pf-toc ul{list-style:none;display:flex;flex-wrap:wrap;gap:8px 20px;margin:24px 0 0;padding:0}
.pf-toc a{font-weight:600;color:#003DA5}
.pf-figure{margin:32px 0 0;background:#fff;border:1px solid #D3DCE9;padding:24px}
.white .pf-figure{background:#fff}
.pf-figcap{font:600 20px/1.3 Oswald,sans-serif;color:var(--navy);margin-bottom:10px}
.pf-legend{list-style:none;display:flex;flex-wrap:wrap;gap:6px 22px;margin:0 0 12px;padding:0;font-size:14px;color:var(--body-ink)}
.pf-legend li{display:flex;align-items:center;gap:8px}
.pf-key{display:inline-block;width:22px;height:4px;background:#003DA5;flex:none}
.pf-key-orange{background:#FF6720}
.pf-key-dash{height:0;background:none;border-top:2px dashed #47566E}
.pf-key-hollow{width:12px;height:12px;border-radius:50%;background:#fff;border:2px solid #003DA5}
.pf-key-hatch{width:14px;height:14px;background:repeating-linear-gradient(45deg,#FF6720 0 2px,#FFD9C6 2px 5px);border:1px solid #FF6720}
.pf-chart{width:100%}
.pf-svg{display:block;width:100%;height:auto}
.pf-sm{display:none}
.pf-credit{font-size:13.5px;line-height:1.6;color:var(--muted);margin:12px 0 0}
.pf-credit a,.pf-note a{color:#003DA5}
.pf-note{font-size:14px;line-height:1.6;color:var(--body-ink);margin:10px 0 0}
.pf-confirm{font-weight:600;color:#A43A00;white-space:nowrap}
.pf-data{margin-top:14px}
.pf-data summary{cursor:pointer;font-weight:600;color:#003DA5;font-size:15px}
.pf-data .table-scroll{margin-top:12px;max-height:420px;overflow:auto}
.pf-table caption{text-align:left;font-size:13.5px;color:var(--muted);padding-bottom:8px}
.pf-table td{font-variant-numeric:tabular-nums}
.pf-two{display:grid;grid-template-columns:3fr 2fr;gap:40px}
.pf-related .pf-h3{margin-top:0}
.pf-bullets{padding-left:20px;margin:0}
.pf-bullets li{margin-bottom:10px}
.pf-sources{padding-left:20px}
.pf-sources li{margin-bottom:8px;line-height:1.6}
.pf-activity{border-top:1px solid #D3DCE9}
.pf-more{margin:20px 0 0;font-weight:600}
.pf-more a{color:#003DA5}
@media (max-width:1024px){.pf-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.pf-two{grid-template-columns:1fr}}
@media (max-width:640px){
 .pf-lg{display:none}.pf-sm{display:block}
 .pf-figure{padding:16px 12px;margin-left:-8px;margin-right:-8px}
 .pf-tiles,.pf-tiles-3{grid-template-columns:1fr}
 .pf-tile-value{font-size:30px}
 .pf-h3{font-size:21px}
}
@media print{.pf-data{display:block}.pf-data .table-scroll{max-height:none}}
