/* Refinery atlas: animated overview, directory, EIA capacity charts and oil routes. */
.refineries{--ref-ocean:#0d2530;--ref-land:#1d3d48;--ref-land-line:#2c5562;--ref-dot:#f0b27a;--ref-dot-known:#ff8a3d;--ref-choke:#7fd1d8;--ref-corridor:#7fd1d8;--ref-bar:var(--copper);--ref-bar-track:var(--surface);
  --p-lpg:#7fb7c9;--p-gasoline:#e8b04a;--p-naphtha:#d3c06a;--p-jet:#9ec27a;--p-diesel:#c98a3d;--p-fuel:#8a5a3a;--p-asphalt:#3d3a36;
  padding-block:24px 48px;overflow-wrap:anywhere}
.refineries .visually-hidden{position:absolute!important;inline-size:1px;block-size:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.refineries h1{font-size:clamp(2.1rem,4.6vw,3.8rem);max-inline-size:20ch;margin-block:8px 12px}
.refineries h2{font-size:clamp(1.4rem,2.4vw,1.9rem);margin-block:0 12px}
.refineries a{text-underline-offset:3px}
.ref-muted{color:var(--muted);font-size:.9rem;line-height:1.6}
.ref-num{text-align:end;font-variant-numeric:tabular-nums;white-space:nowrap}
.ref-section{margin-block:44px;scroll-margin-block-start:24px}
.ref-section>p{max-inline-size:80ch;line-height:1.65}

/* Hero */
.ref-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:20px 32px;align-items:end}
.ref-hero-copy .listing-intro{max-inline-size:62ch}
.ref-jump{display:flex;flex-wrap:wrap;gap:8px;margin-block-start:16px}
.ref-jump a{display:inline-flex;align-items:center;min-block-size:44px;padding:8px 14px;border:1px solid var(--line);border-radius:24px;font-size:.9rem;text-decoration:none;color:var(--ink)}
.ref-jump a:hover{border-color:var(--copper)}
.ref-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0}
.ref-stats>div{padding:16px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--card);min-inline-size:0;animation:ref-rise .7s var(--ease,ease) both}
.ref-stats>div:nth-child(2){animation-delay:.08s}.ref-stats>div:nth-child(3){animation-delay:.16s}.ref-stats>div:nth-child(4){animation-delay:.24s}
.ref-stats dt{font-size:.8rem;color:var(--muted);line-height:1.4}
.ref-stats dd{margin:6px 0 0;font:700 clamp(1.5rem,3vw,2.2rem)/1.1 var(--sans);font-variant-numeric:tabular-nums;color:var(--ink)}
.ref-stats dd small{display:block;margin-block-start:6px;font:400 .75rem/1.4 var(--sans);color:var(--muted)}

/* Static world overview (motion graphic) */
.ref-atlas{grid-column:1/-1;margin:8px 0 0;padding:0;border-radius:var(--r-lg);overflow:hidden;background:radial-gradient(120% 90% at 50% 0,#14394a 0,var(--ref-ocean) 70%);color:#dce8e6}
.ref-world{display:block;inline-size:100%;block-size:auto;aspect-ratio:360/150}
.ref-world-focus{aspect-ratio:2/1;border-radius:var(--r-md);background:var(--ref-ocean)}
.ref-land{fill:var(--ref-land);stroke:var(--ref-land-line);stroke-width:.15}
.ref-dot{fill:var(--ref-dot);opacity:.75;transform-box:fill-box;transform-origin:center;animation:ref-pop .9s var(--ease,ease) both}
.ref-dot.d1{animation-delay:.15s}.ref-dot.d2{animation-delay:.3s}.ref-dot.d3{animation-delay:.45s}.ref-dot.d4{animation-delay:.6s}.ref-dot.d5{animation-delay:.75s}.ref-dot.d6{animation-delay:.9s}.ref-dot.d7{animation-delay:1.05s}
.ref-dot.known{animation:ref-pop .9s var(--ease,ease) both,ref-glow 3.6s ease-in-out 1.2s infinite alternate}
@keyframes ref-glow{to{opacity:.55}}
.ref-dot.known{fill:var(--ref-dot-known);opacity:.92}
.ref-corridor{fill:none;stroke:var(--ref-corridor);stroke-width:.45;stroke-linecap:round;stroke-dasharray:1.2 2.2;opacity:.75;animation:ref-flow 3.2s linear infinite}
.ref-choke-ring{fill:#7fd1d81f;stroke:var(--ref-choke);stroke-width:.35;transform-box:fill-box;transform-origin:center;animation:ref-pulse 2.8s ease-out infinite}
.ref-choke-core{fill:#e6fbfc}
.ref-choke text{font:600 3.2px var(--sans);fill:#e6fbfc;text-anchor:middle;paint-order:stroke;stroke:#0d2530;stroke-width:.8px}
.ref-focus circle:first-child{fill:#ff8a3d33;stroke:#ff8a3d;stroke-width:.4;transform-box:fill-box;transform-origin:center;animation:ref-pulse 2.4s ease-out infinite}
.ref-focus circle:last-child{fill:#ff8a3d}
.ref-atlas figcaption{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center;padding:12px 18px 16px;font-size:.82rem;line-height:1.5}
.ref-atlas figcaption>span{flex:1 1 320px;color:#b9cdca}
.ref-legend{display:flex;flex-wrap:wrap;gap:6px 16px;margin:0;padding:0;list-style:none}
.ref-legend li{display:inline-flex;align-items:center;gap:6px}
.ref-legend i{inline-size:9px;block-size:9px;border-radius:50%;background:var(--ref-dot)}
.ref-legend i.known{inline-size:12px;block-size:12px;background:var(--ref-dot-known)}
.ref-legend i.choke{background:transparent;border:1.5px solid var(--ref-choke);inline-size:12px;block-size:12px}
.ref-legend i.corridor{border-radius:0;block-size:0;inline-size:18px;border-top:2px dashed var(--ref-corridor)}

@keyframes ref-pop{from{opacity:0;transform:scale(0)}}
@keyframes ref-pulse{0%{transform:scale(.6);opacity:1}100%{transform:scale(1.6);opacity:0}}
@keyframes ref-flow{to{stroke-dashoffset:-6.8}}
@keyframes ref-rise{from{opacity:0;transform:translateY(8px)}}

/* Opt-in interactive map */
.ref-map-panel{grid-column:1/-1;border:1px solid var(--line);border-radius:var(--r-md);background:var(--card)}
.ref-map-panel>summary{display:flex;justify-content:space-between;gap:12px;align-items:center;min-block-size:52px;padding:12px 18px;font-weight:650;cursor:pointer}
.ref-map-panel>summary span{font-weight:400;font-size:.85rem;color:var(--muted)}
.ref-map-privacy,.ref-map-credit,.ref-map-status{margin:0;padding:0 18px 12px;font-size:.85rem;color:var(--muted)}
.ref-map-status:empty{display:none}
.ref-map{block-size:min(68vh,560px);margin:0 18px 12px;border-radius:var(--r-md);background:var(--ref-ocean)}
.ref-map:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.ref-map .leaflet-popup-content{font:14px/1.5 var(--sans)}
.ref-map .leaflet-popup-content a{display:inline-block;min-block-size:32px;padding-block:6px}
.ref-map .ref-leaflet-corridor{stroke-dasharray:6 10;animation:ref-flow-px 1.6s linear infinite}
@keyframes ref-flow-px{to{stroke-dashoffset:-32}}
.ref-map-layers{display:flex;flex-wrap:wrap;gap:8px 16px;padding:0 18px 12px}
.ref-map-layers label{display:inline-flex;align-items:center;gap:8px;min-block-size:44px;font-size:.9rem}
.ref-map-layers input{inline-size:20px;block-size:20px}

/* Directory */
.ref-section-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px 16px}
.ref-section-head p{margin:0;color:var(--muted)}
.ref-filters{display:grid;grid-template-columns:2fr repeat(4,minmax(0,1fr));gap:12px;align-items:end;margin-block:16px;padding:16px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface)}
.ref-filters label{display:grid;gap:6px;font-size:.85rem;font-weight:600;min-inline-size:0}
.ref-filters :is(input,select){box-sizing:border-box;inline-size:100%;min-block-size:48px;padding:10px 12px;font:16px var(--sans);color:var(--ink);background:var(--field,var(--card));border:1px solid var(--field-line,#6c7f78);border-radius:6px}
.ref-filter-actions{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.ref-filter-actions button{min-block-size:48px;padding:10px 18px;font:600 16px var(--sans);border-radius:6px}
.ref-filter-actions a{display:inline-flex;align-items:center;min-block-size:44px}
.ref-table{inline-size:100%;border-collapse:collapse;font-size:.95rem}
.ref-table :is(th,td){padding:12px 10px;border-block-end:1px solid var(--line);text-align:start;vertical-align:top}
.ref-table thead th{font-size:.8rem;color:var(--muted);font-weight:600}
.ref-table tbody th a{font-weight:650}
.ref-table tbody tr{transition:background-color .2s}
.ref-table tbody tr:hover{background:var(--surface)}
.ref-table .ref-num{text-align:end}
.ref-total th,.ref-total td{font-weight:700}
.ref-basis{display:block;font-size:.72rem;color:var(--muted);white-space:normal}
.ref-badge{display:inline-block;margin:2px 4px 2px 0;padding:2px 7px;border-radius:12px;font:600 .7rem/1.5 var(--mono);border:1px solid var(--line)}
.ref-badge-osm{color:#2c6e49;border-color:#7fb08f}.ref-badge-wikidata{color:#7a3e8e;border-color:#b893c7}.ref-badge-eia{color:#9e4029;border-color:#d39a86}
.ref-empty{padding:20px;border:1px dashed var(--line);border-radius:var(--r-md)}

/* Bar charts */
.ref-bars{margin:20px 0;min-inline-size:0}
.ref-bars figcaption{font-weight:650;margin-block-end:12px}
.ref-bars ol{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.ref-bars li{display:grid;grid-template-columns:minmax(0,15rem) minmax(0,1fr) auto;gap:12px;align-items:center;font-size:.9rem}
.ref-bar-label small{color:var(--muted)}
.ref-bar-track{display:block;inline-size:100%;block-size:12px}
.ref-track{fill:var(--ref-bar-track)}
.ref-fill{fill:var(--ref-bar);transform-box:fill-box;transform-origin:left center;animation:ref-scale .9s var(--ease,ease) both}
.ref-bars li:nth-child(2) .ref-fill{animation-delay:.04s}.ref-bars li:nth-child(3) .ref-fill{animation-delay:.08s}.ref-bars li:nth-child(4) .ref-fill{animation-delay:.12s}.ref-bars li:nth-child(n+5) .ref-fill{animation-delay:.16s}
[dir=rtl] .ref-bar-track,[dir=rtl] .ref-gauge-svg{transform:scaleX(-1)}
@keyframes ref-scale{from{transform:scaleX(0)}}
.ref-bar-value{font-variant-numeric:tabular-nums;white-space:nowrap}
.ref-grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.ref-grid-2 .ref-bars li{grid-template-columns:minmax(0,10rem) minmax(0,1fr) auto}

/* Utilisation gauge */
.ref-gauge{margin-block:16px}
.ref-gauge-svg{display:block;inline-size:100%;block-size:16px}
.ref-gauge-svg .ref-track{fill:var(--line)}.ref-gauge-svg .ref-fill{fill:var(--aquifer)}
.ref-gauge dl{display:flex;flex-wrap:wrap;gap:12px 32px;margin:12px 0 0}
.ref-gauge dt{font-size:.8rem;color:var(--muted)}
.ref-gauge dd{margin:2px 0 0;font-weight:650;font-variant-numeric:tabular-nums}

/* Process motion graphic */
.ref-process{margin:16px 0;padding:16px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--card)}
.ref-process svg{display:block;inline-size:100%;block-size:auto;max-block-size:420px}
.ref-process text{font:600 12px var(--sans);fill:var(--ink);text-anchor:middle}
.ref-p-out text{text-anchor:start}
[dir=rtl] .ref-process svg{direction:ltr}
.ref-p-crude rect{fill:#2b2420}.ref-p-furnace rect{fill:#5a2d1d}.ref-p-furnace path{fill:none;stroke:#ff9a4a;stroke-width:2;animation:ref-flicker 1.2s ease-in-out infinite alternate}
.ref-p-column rect{fill:#d9dfdc;stroke:#7b8b88;stroke-width:1.5}.ref-p-column path{stroke:#7b8b88;stroke-width:1}
.ref-p-conversion rect{fill:#e8d9c7;stroke:#a07850}
.ref-p-pipe{fill:none;stroke:#aab5b2;stroke-width:5;stroke-linecap:round}
.ref-p-flow{fill:none;stroke:var(--c,#c46a3d);stroke-width:3;stroke-linecap:round;stroke-dasharray:4 10;animation:ref-flow-px 1.4s linear infinite}
.ref-p-out circle{fill:var(--c)}
.ref-p-lpg{--c:var(--p-lpg)}.ref-p-gasoline{--c:var(--p-gasoline)}.ref-p-naphtha{--c:var(--p-naphtha)}.ref-p-jet-kerosene{--c:var(--p-jet)}.ref-p-diesel{--c:var(--p-diesel)}.ref-p-fuel-oil{--c:var(--p-fuel)}.ref-p-asphalt{--c:var(--p-asphalt)}
@keyframes ref-flicker{from{opacity:.55;transform:translateY(1px)}to{opacity:1;transform:translateY(-1px)}}
.ref-process figcaption{margin-block-start:8px;font-size:.85rem;color:var(--muted)}
.ref-glossary{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:12px;margin:16px 0}
.ref-glossary>div{padding:12px 14px;border-inline-start:3px solid var(--copper);background:var(--surface);border-radius:0 var(--r-md) var(--r-md) 0}
.ref-glossary dt{font-weight:650}.ref-glossary dd{margin:4px 0 0;font-size:.9rem;line-height:1.55;color:var(--muted)}
.ref-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.ref-chip{padding:6px 12px;border-radius:16px;border:1px solid var(--line);background:var(--card);font-size:.9rem}
.ref-chip::before{content:'';display:inline-block;inline-size:8px;block-size:8px;margin-inline-end:6px;border-radius:50%;background:var(--c,var(--copper))}

/* Routes */
.ref-spark-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:12px;margin:16px 0;padding:0;list-style:none}
.ref-spark-grid li{display:grid;gap:6px;padding:14px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--card)}
.ref-spark-name{font-weight:650}
.ref-spark{inline-size:100%;block-size:44px}
.ref-spark polyline{fill:none;stroke:var(--aquifer);stroke-width:2;stroke-linejoin:round;stroke-dasharray:400;stroke-dashoffset:400;animation:ref-draw 1.4s var(--ease,ease) forwards}
.ref-spark circle{fill:var(--copper)}
@keyframes ref-draw{to{stroke-dashoffset:0}}
.ref-spark-value{font:700 1.2rem var(--sans);font-variant-numeric:tabular-nums}
.ref-spark-value small{font-weight:400;font-size:.75rem;color:var(--muted)}
.ref-cta{display:inline-flex;align-items:center;min-block-size:48px;padding:10px 18px;border-radius:24px;background:var(--navy);color:var(--on-navy)!important;text-decoration:none;font-weight:650}
.ref-routes-teaser{padding:24px;border-radius:var(--r-lg);border:1px solid var(--line);background:var(--surface)}
.ref-flows td,.ref-flows th{white-space:nowrap}
.ref-flows tbody th{white-space:normal;min-inline-size:12rem}

/* Detail */
.ref-detail h1{max-inline-size:26ch}
.ref-detail-top{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:start}
.ref-card{margin-block:24px 0;padding:20px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--card)}
.ref-facts{display:grid;gap:10px;margin:0}
.ref-facts>div{display:grid;grid-template-columns:minmax(0,11rem) minmax(0,1fr);gap:12px;padding-block-end:10px;border-block-end:1px solid var(--line)}
.ref-facts dt{color:var(--muted);font-size:.88rem}.ref-facts dd{margin:0}
.ref-big{margin:4px 0;font:700 clamp(2rem,5vw,3rem)/1.1 var(--sans);font-variant-numeric:tabular-nums}
.ref-big small{font-size:.9rem;font-weight:400;color:var(--muted)}
.ref-warning{padding:10px 14px;border-inline-start:3px solid var(--accent);background:var(--surface);font-size:.9rem}
.ref-nearby{padding-inline-start:20px;line-height:1.9}
.ref-ids{padding-inline-start:20px;line-height:2}
.ref-location .ref-world{max-inline-size:720px}
.tool-back{display:flex;align-items:center;min-block-size:44px;margin-block:8px}

/* Sources */
.ref-semantics{padding-inline-start:20px;line-height:1.65;max-inline-size:90ch}
.ref-sources td,.ref-sources th{padding:10px;border-block-end:1px solid var(--line);text-align:start;vertical-align:top;font-size:.9rem}

@media(max-width:1000px){.ref-hero{grid-template-columns:minmax(0,1fr)}.ref-filters{grid-template-columns:repeat(2,minmax(0,1fr))}.ref-q{grid-column:1/-1}.ref-grid-2,.ref-detail-top{grid-template-columns:minmax(0,1fr)}}
@media(max-width:600px){.ref-stats{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.ref-stats>div{padding:12px}.ref-filters{grid-template-columns:minmax(0,1fr)}
  .ref-bars li,.ref-grid-2 .ref-bars li{grid-template-columns:minmax(0,1fr) auto;gap:4px 10px}.ref-bar-track{grid-column:1/-1;grid-row:2}
  .ref-facts>div{grid-template-columns:minmax(0,1fr);gap:2px}.ref-table{font-size:.88rem}.ref-table :is(th,td){padding:10px 6px}.ref-atlas figcaption{padding:10px 12px}}
@media(prefers-reduced-motion:reduce){.refineries *,.refineries *::before{animation:none!important;transition:none!important}.ref-spark polyline{stroke-dashoffset:0}}
@media(forced-colors:active){.ref-fill{fill:CanvasText}.ref-badge,.ref-chip{border-color:CanvasText}}
@media print{.ref-map-panel,.ref-filters,.ref-jump,.ref-cta{display:none!important}.ref-atlas{background:#fff;color:#111}.refineries *{animation:none!important}}
@media screen and (prefers-color-scheme:dark){:where(:root:not([data-theme=light])) .refineries{--ref-bar-track:#1d3038}:where(:root:not([data-theme=light])) .ref-badge-osm{color:#8fd1a7}:where(:root:not([data-theme=light])) .ref-badge-wikidata{color:#d4aee3}:where(:root:not([data-theme=light])) .ref-badge-eia{color:#f0b49e}:where(:root:not([data-theme=light])) .ref-p-column rect{fill:#3a4a4f}:where(:root:not([data-theme=light])) .ref-p-conversion rect{fill:#4a3a2c}}
@media screen{:where(:root[data-theme=dark]) .refineries{--ref-bar-track:#1d3038}:where(:root[data-theme=dark]) .ref-badge-osm{color:#8fd1a7}:where(:root[data-theme=dark]) .ref-badge-wikidata{color:#d4aee3}:where(:root[data-theme=dark]) .ref-badge-eia{color:#f0b49e}:where(:root[data-theme=dark]) .ref-p-column rect{fill:#3a4a4f}:where(:root[data-theme=dark]) .ref-p-conversion rect{fill:#4a3a2c}}