.ueg-ig { --ig-navy: var(--navy, #192f47); --ig-deep: var(--navy-deep, #101c2b); --ig-blue: var(--blue, #285b7c); --ig-blue2: var(--blue-hover, #377197); --ig-light: var(--light, #eef2f6); --ig-ink: var(--ink, #1c2330); --ig-muted: var(--muted, #5d6675); --ig-line: var(--line, #dee4ec); --ig-white: #ffffff; --ig-sky: #9fd0ee; --ig-steel: #4f7ea0; --ig-rust: #8a4a2f; --ig-copper: #b8672b; --ig-red: #b23b3b; --ig-red-soft: #fbeeee; --ig-green: #2f7a52; --ig-green-soft: #e6f2ea; --ig-ease: cubic-bezier(.2, .7, .2, 1); --ig-radius: var(--radius, 12px); --ig-pad: 24px; --ig-pad-sm: 16px; --ig-gap: 24px; --ig-gap-sm: 12px; color: var(--ig-ink); font-family: inherit; margin: 0; }
.ueg-ig *, .ueg-ig *::before, .ueg-ig *::after { box-sizing: border-box; }
.ueg-ig h3, .ueg-ig h4 { margin: 0 0 8px; line-height: 1.2; letter-spacing: -0.01em; }
.ueg-ig h3 { font-size: 22px; font-weight: 700; color: var(--ig-navy); }
.ueg-ig h4 { font-size: 17px; font-weight: 600; color: var(--ig-navy); }
.ueg-ig p { margin: 0 0 12px; }
.ueg-ig ul, .ueg-ig ol { margin: 0; padding: 0; list-style: none; }
.ueg-ig small { font-weight: 400; color: var(--ig-muted); }
.ig-tag { display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: 4px 10px; border-radius: 999px; background: var(--ig-green-soft); color: var(--ig-green); }
.ig-tag-cost { background: var(--ig-red-soft); color: var(--ig-red); }
@media (prefers-reduced-motion: reduce) { .ueg-ig, .ueg-ig *, .ueg-ig *::before, .ueg-ig *::after { animation: none !important; transition: none !important; } html.ig-js .ueg-ig:not(.is-in) * { opacity: 1 !important; transform: none !important; } }
.ig-facility { max-width: 1140px; margin: 0 auto; }
.ig-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--ig-pad-sm); margin-bottom: var(--ig-gap); }
.ig-stat { border: 1px solid; border: 1px solid var(--ig-line); border-radius: 10px; padding: var(--ig-pad-sm) var(--ig-pad); background: #fff; transition: transform .7s , opacity .7s; transition: transform .7s var(--ig-ease), opacity .7s var(--ig-ease); }
.ig-stat-v { display: block; font-size: 34px; font-weight: 700; letter-spacing: -0.02em; color: var(--ig-navy); line-height: 1.1; }
.ig-stat-v small { font-size: 15px; font-weight: 600; color: var(--ig-blue2); margin-left: 4px; }
.ig-stat-k { display: block; font-size: 13.5px; color: var(--ig-muted); margin-top: 6px; line-height: 1.35; }
.ig-stat:nth-child(2) { transition-delay: .08s; }
.ig-stat:nth-child(3) { transition-delay: .16s; }
.ig-stat:nth-child(4) { transition-delay: .24s; }
html.ig-js .ig-facility:not(.is-in) .ig-stat { opacity: 0; transform: translateY(14px); }
.igf-ground { fill: #f3f6f9; }
.igf-grid { stroke: rgba(25,47,71,.06); stroke-width: 1; }
.igf-area { fill: #ffffff; stroke: var(--ig-line); stroke-width: 1.5; }
.igf-contain { fill: none; stroke: var(--ig-blue); stroke-width: 1.5; stroke-dasharray: 6 5; }
.igf-tank { fill: #dfe7ef; stroke: var(--ig-navy); stroke-width: 1.5; }
.igf-tank-in { fill: none; stroke: rgba(25,47,71,.35); stroke-width: 1; }
.igf-unit { fill: #e9eef3; stroke: var(--ig-navy); stroke-width: 1.5; }
.igf-unit-hot { fill: #f3e6da; stroke: var(--ig-copper); }
.igf-road { fill: #e2e8ef; }
.igf-lbl { font-size: 11.5px; font-weight: 600; fill: var(--ig-muted); letter-spacing: .04em; text-transform: uppercase; }
.igf-hs { cursor: default; }
.igf-hs .igf-ring { fill: none; stroke: var(--ig-blue); stroke-width: 2; opacity: .5; transform-box: fill-box; transform-origin: center; animation: igf-pulse 2.4s ease-out infinite; }
.igf-hs .igf-dot { fill: var(--ig-blue); stroke: #fff; stroke-width: 2; transition: fill .2s, r .2s; }
.igf-hs text { font-size: 11px; font-weight: 700; fill: #fff; text-anchor: middle; pointer-events: none; }
.igf-hs:nth-of-type(2) .igf-ring { animation-delay: .3s; }
.igf-hs:nth-of-type(3) .igf-ring { animation-delay: .6s; }
.igf-hs:nth-of-type(4) .igf-ring { animation-delay: .9s; }
.igf-hs:nth-of-type(5) .igf-ring { animation-delay: 1.2s; }
.igf-hs:nth-of-type(6) .igf-ring { animation-delay: 1.5s; }
.igf-hs:nth-of-type(7) .igf-ring { animation-delay: 1.8s; }
.igf-hs:nth-of-type(8) .igf-ring { animation-delay: 2.1s; }
.igf-legend { display: grid; gap: 4px; counter-reset: hs; }
.igf-legend li { display: grid; grid-template-columns: 30px 1fr; gap: var(--ig-gap-sm); align-items: start; padding: 0; border: none; transition: background-color .2s, border-color .2s, opacity .3s; cursor: default; }
.igf-legend li::before { content: attr(data-hs); grid-row: 1 / span 2; width: 26px; height: 26px; border-radius: 50%; background: var(--ig-blue); color: #fff; font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center; margin-top: 1px; }
.igf-legend b, .igf-legend span { grid-column: 2; }
.igf-legend b { display: block; color: var(--ig-navy); font-size: 15px; line-height: 1.3; }
.igf-legend span { display: block; font-size: 13.5px; color: var(--ig-muted); line-height: 1.4; margin-top: 2px; }
.igf-legend li:hover, .igf-legend li:focus-visible { background: var(--ig-light); border-color: var(--ig-line); outline: none; }
.ig-facility:has([data-hs="1"]:hover) [data-hs]:not([data-hs="1"]), .ig-facility:has([data-hs="2"]:hover) [data-hs]:not([data-hs="2"]),
.ig-facility:has([data-hs="3"]:hover) [data-hs]:not([data-hs="3"]), .ig-facility:has([data-hs="4"]:hover) [data-hs]:not([data-hs="4"]),
.ig-facility:has([data-hs="5"]:hover) [data-hs]:not([data-hs="5"]), .ig-facility:has([data-hs="6"]:hover) [data-hs]:not([data-hs="6"]),
.ig-facility:has([data-hs="7"]:hover) [data-hs]:not([data-hs="7"]), .ig-facility:has([data-hs="8"]:hover) [data-hs]:not([data-hs="8"]) { opacity: .35; }
.ig-facility:has([data-hs="1"]:hover) .igf-hs[data-hs="1"] .igf-dot, .ig-facility:has([data-hs="2"]:hover) .igf-hs[data-hs="2"] .igf-dot,
.ig-facility:has([data-hs="3"]:hover) .igf-hs[data-hs="3"] .igf-dot, .ig-facility:has([data-hs="4"]:hover) .igf-hs[data-hs="4"] .igf-dot,
.ig-facility:has([data-hs="5"]:hover) .igf-hs[data-hs="5"] .igf-dot, .ig-facility:has([data-hs="6"]:hover) .igf-hs[data-hs="6"] .igf-dot,
.ig-facility:has([data-hs="7"]:hover) .igf-hs[data-hs="7"] .igf-dot, .ig-facility:has([data-hs="8"]:hover) .igf-hs[data-hs="8"] .igf-dot { fill: var(--ig-copper); }
.ig-facility:has([data-hs="1"]:hover) .igf-legend li[data-hs="1"], .ig-facility:has([data-hs="2"]:hover) .igf-legend li[data-hs="2"],
.ig-facility:has([data-hs="3"]:hover) .igf-legend li[data-hs="3"], .ig-facility:has([data-hs="4"]:hover) .igf-legend li[data-hs="4"],
.ig-facility:has([data-hs="5"]:hover) .igf-legend li[data-hs="5"], .ig-facility:has([data-hs="6"]:hover) .igf-legend li[data-hs="6"],
.ig-facility:has([data-hs="7"]:hover) .igf-legend li[data-hs="7"], .ig-facility:has([data-hs="8"]:hover) .igf-legend li[data-hs="8"] { background: var(--ig-light); border-color: var(--ig-line); }
@media (max-width: 860px) { .ig-stats { grid-template-columns: 1fr 1fr; } .igf-lbl { font-size: 13px; } }
@media (max-width: 480px) { .ig-stats { grid-template-columns: 1fr 1fr; gap: 10px; } .ig-stat { padding: var(--ig-pad-sm); } .ig-stat-v { font-size: 26px; } }
.dgx-legend { display: none; list-style: none; margin: 16px 0 0; margin: var(--ig-pad-sm, 16px) 0 0; padding: 0; }
.dgx-legend li { display: grid; grid-template-columns: 14px 1fr; gap: 12px; gap: var(--ig-gap-sm, 12px); align-items: start; font-size: 14px; line-height: 1.5; color: #5d6675; color: var(--ig-muted, #5d6675); margin-bottom: 12px; margin-bottom: var(--ig-gap-sm, 12px); }
.dgx-legend li i { width: 14px; height: 14px; border-radius: 4px; margin-top: 3px; }
.dgx-legend li b { color: #1c2330; color: var(--ig-ink, #1c2330); }
@media (max-width: 760px) { .dgx .svg-text, .eng .svg-text { display: none; } .dgx-legend { display: block; } }
.ueg-ig { --eng-line: #192f47; --eng-paper: #f8fafc; --eng-grid: rgba(25,47,71,.07); --eng-oil: #b8862b; --eng-water: #285b7c; --eng-solid: #6b7684; --eng-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; }
.eng-tag { font-family: var(--eng-mono); font-size: 10.5px; letter-spacing: .08em; fill: var(--eng-line); }
.eng-tagbox { fill: #fff; stroke: var(--eng-line); stroke-width: 1; }
.eng-note { font-family: var(--eng-mono); font-size: 10px; letter-spacing: .06em; fill: var(--ig-muted); }
.eng-title { font-family: var(--eng-mono); font-size: 10px; letter-spacing: .1em; fill: var(--eng-line); }
.eng-paper { fill: var(--eng-paper); stroke: var(--ig-line); stroke-width: 1; }
.eng-line { fill: none; stroke: var(--eng-line); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.eng-thin { fill: none; stroke: var(--eng-line); stroke-width: 1; }
.eng-heavy { fill: none; stroke: var(--eng-line); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.eng-dash { fill: none; stroke: var(--eng-line); stroke-width: 1.2; stroke-dasharray: 6 4; }
.eng-shell { fill: #fff; stroke: var(--eng-line); stroke-width: 1.5; }
.eng-flow { fill: none; stroke: #fff; stroke-width: 2.5; stroke-linecap: round; stroke-dasharray: 3 11; opacity: .95; animation: igp-move 1.3s linear infinite; }
.eng-leader { fill: none; stroke: var(--eng-line); stroke-width: 1; }
.eng-lbl { font-size: 12.5px; font-weight: 600; fill: var(--ig-ink); }
.eng-sub { font-size: 11.5px; fill: var(--ig-muted); }
.eng-balloon circle { fill: #fff; stroke: var(--eng-line); stroke-width: 1.5; }
.eng-balloon text { font-family: var(--eng-mono); font-size: 11px; font-weight: 700; fill: var(--eng-line); text-anchor: middle; }
.igf-ground { fill: var(--eng-paper); }
.igf-grid { stroke: var(--eng-grid); }
.igf-area { fill: #fff; stroke: var(--eng-line); stroke-width: 1; }
.igf-contain { stroke: var(--eng-line); stroke-dasharray: 8 4; }
.igf-tank { fill: #fff; stroke: var(--eng-line); stroke-width: 1.5; }
.igf-tank-in { stroke: rgba(25,47,71,.5); stroke-dasharray: 3 3; }
.igf-unit { fill: #fff; stroke: var(--eng-line); stroke-width: 1.2; }
.igf-unit-hot { fill: #fff; stroke: var(--eng-oil); }
.igf-road { fill: #eef2f6; }
.igf-lbl { font-family: var(--eng-mono); font-size: 10px; letter-spacing: .08em; fill: var(--eng-line); }
.igf-hs .igf-ring { display: none; }
.igf-hs .igf-dot { fill: #fff; stroke: var(--eng-line); stroke-width: 1.5; }
.igf-hs text { fill: var(--eng-line); font-family: var(--eng-mono); }
.ig-facility:has([data-hs="1"]:hover) .igf-hs[data-hs="1"] .igf-dot, .ig-facility:has([data-hs="2"]:hover) .igf-hs[data-hs="2"] .igf-dot,
.ig-facility:has([data-hs="3"]:hover) .igf-hs[data-hs="3"] .igf-dot, .ig-facility:has([data-hs="4"]:hover) .igf-hs[data-hs="4"] .igf-dot,
.ig-facility:has([data-hs="5"]:hover) .igf-hs[data-hs="5"] .igf-dot, .ig-facility:has([data-hs="6"]:hover) .igf-hs[data-hs="6"] .igf-dot,
.ig-facility:has([data-hs="7"]:hover) .igf-hs[data-hs="7"] .igf-dot, .ig-facility:has([data-hs="8"]:hover) .igf-hs[data-hs="8"] .igf-dot { fill: var(--eng-line); }
.ig-facility:has([data-hs="1"]:hover) .igf-hs[data-hs="1"] text, .ig-facility:has([data-hs="2"]:hover) .igf-hs[data-hs="2"] text,
.ig-facility:has([data-hs="3"]:hover) .igf-hs[data-hs="3"] text, .ig-facility:has([data-hs="4"]:hover) .igf-hs[data-hs="4"] text,
.ig-facility:has([data-hs="5"]:hover) .igf-hs[data-hs="5"] text, .ig-facility:has([data-hs="6"]:hover) .igf-hs[data-hs="6"] text,
.ig-facility:has([data-hs="7"]:hover) .igf-hs[data-hs="7"] text, .ig-facility:has([data-hs="8"]:hover) .igf-hs[data-hs="8"] text { fill: #fff; }
.igf-legend li::before { background: #fff; color: var(--eng-line); border: 1.5px solid; border: 1.5px solid var(--eng-line); font-family: var(--eng-mono); }
.eng .truck { transition: transform 1.6s cubic-bezier(.2,.7,.2,1); }
html.ig-js .eng-scene:not(.is-in) .truck { transform: translateX(-190px); }
.eng .fill { transform-box: fill-box; transform-origin: bottom; transition: transform 1.4s cubic-bezier(.2,.7,.2,1) .9s; }
html.ig-js .eng-scene:not(.is-in) .fill { transform: scaleY(0); }
@media (prefers-reduced-motion: reduce) { .eng .truck, .eng .fill { transform: none !important; } }
.ig-plain .eng-tagg, .ig-plain .eng-title, .ig-plain .eng-stream { display: none; }
.ig-plain .eng-tag { font-family: inherit; font-size: 12.5px; letter-spacing: .1em; font-weight: 700; }
.ig-plain .eng-lbl { font-size: 14.5px; }
.ig-plain .eng-sub { font-size: 13px; }
.ig-plain .igp-label { font-size: 16px; }
.ig-plain .igp-sub { font-size: 14px; }
.ig-plain .igp-zone-label { font-size: 13.5px; }
.ig-plain .igp-stream { font-size: 16px; }
.ig-plain .igm-l { font-size: 14px; }
.ig-plain .igm-st { font-size: 14.5px; }
.ig-plain .igm-sub { font-size: 12px; }
.ig-plain .igf-lbl { font-family: inherit; font-size: 11.5px; letter-spacing: .06em; }
.ig-plain .ig-checks li, .ig-plain .ig-list li, .ig-plain .ig-tank-note, .ig-plain .dgx-legend li, .ig-plain .dgx-step, .ig-plain .igf-legend span, .ig-plain .ig-stat-k, .ig-plain .dgx-card li, .ig-plain .ig-opt li { font-size: 16px; }
.ig-plain .ig-lbl-t, .ig-plain .igf-legend b, .ig-plain .dgx-step b { font-size: 17px; }
@media (max-width: 760px) { .ig-pan { overflow-x: auto; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; padding-bottom: 6px; position: relative; } .ig-pan > svg { min-width: 760px; } .ig-pan-hint { display: block; font-size: 13px; color: var(--ig-muted); margin: 6px 0 0; } .eng .svg-text, .ig-facility .svg-text { display: initial; } .eng .dgx-legend { display: block; margin: 16px 0 0 0; } .igf-hs { transform-box: fill-box; transform-origin: center; transform: scale(1.6); } }
@media (min-width: 761px) { .ig-pan-hint { display: none; } }
@keyframes igp-move { to { stroke-dashoffset: -16; } }
@keyframes igf-pulse { 0% { transform: scale(.6); opacity: .6; } 100% { transform: scale(2.1); opacity: 0; } }

.ueg-ig { --ig-light: var(--tint); --ig-line: var(--line); --ig-blue2: var(--blue-bright); --ig-radius: 10px; }

.diagram-wrap > .eyebrow { margin-bottom: 18px; }
.eng figcaption { font-size: 14px; color: var(--muted); margin-top: 16px; line-height: 1.5; }
.ig-plan-note, .ig-pan-hint { color: var(--muted); }

.ig-plan { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; align-items: start; }
.ig-plan-svg { width: 100%; height: auto; display: block; border-radius: 10px; }
.ig-plan-note { font-size: 13px; margin: 10px 0 0; }
.ig-plan .igf-legend { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--ig-pad-sm); margin: 0; padding: 0; }

.ig-plan .igf-legend li { row-gap: 0; column-gap: 12px; grid-template-columns: 22px 1fr; align-content: start; padding: 0; }
.ig-plan .igf-legend li::before { width: 22px; height: 22px; font-size: 11px; margin-top: 0; }
.ig-plan .igf-legend b { font-size: 14px; line-height: 1.45; color: var(--navy); }
.ig-plan .igf-legend span { font-size: 13.5px; line-height: 1.45; color: var(--muted); margin-top: 4px; }

@media (min-width: 1101px) { .ig-plan .ig-plan-svg { height: 508.5px; } }
@media (max-width: 1100px) { .ig-plan .igf-legend { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 860px) { .ig-plan .igf-legend { grid-template-columns: minmax(0, 1fr); gap: 4px; } }

.eng-m { display: none; }
@media (max-width: 760px) {
  .eng-scene .ig-pan, .eng-scene .ig-pan-hint { display: none; }
  .eng-scene .eng-m { display: block; width: 100%; max-width: 440px; height: auto; margin: 0 auto; }
}

.igf-thumb { display: none; }
@media (max-width: 760px) {
  .ig-plan .ig-plan-svg { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .ig-plan .ig-pan-hint { display: none; }
  .ig-plan .ig-plan-note { margin-top: 0; }
  .ig-plan .igf-legend { gap: 14px; }
  .ig-plan .igf-legend li { grid-template-columns: 112px minmax(0, 1fr); column-gap: 14px; align-items: center; align-content: center; }
  .ig-plan .igf-legend li::before { display: none; }
  .ig-plan .igf-thumb { display: block; grid-column: 1; grid-row: 1 / span 2; width: 112px; height: 72px; border: 1px solid; border: 1px solid var(--ig-line); border-radius: 8px; background: var(--eng-paper); }
  .ig-plan .igf-legend b { align-self: end; }
  .ig-plan .igf-legend span { align-self: start; }
}

@media (hover: none), (max-width: 760px) {
  .ig-facility [data-hs] { opacity: 1 !important; }
  .ig-plan .igf-legend li { background: none !important; }
}

.igf-lbl { visibility: visible; visibility: var(--igf-lbl-vis, visible); }
.igf-thumb use { --igf-lbl-vis: hidden; }