/* PEM vs SOFC aviation page and API docs. Sits on base.css + fuelcell.css. */
:root{--pem:#7AC143;--sofc:#ff9f4a;--sofc2:#ffcf8a}
.av{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}
.av-hero{padding:clamp(56px,8vw,110px) 0 clamp(28px,4vw,48px)}
.av-hero h1{font-size:clamp(40px,5.4vw,76px);line-height:1.02;letter-spacing:-.02em;margin:10px 0 18px}
.av-hero h1 span{display:block;color:var(--brand)}
.av-sec{padding:clamp(40px,6vw,80px) 0;border-top:1px solid var(--line)}
.av-sec h2{font-size:clamp(28px,3.2vw,42px);line-height:1.1;margin-bottom:14px}
.av-sec h3{margin-top:30px}
.switch{display:inline-flex;margin-top:26px;padding:4px;border-radius:999px;border:1px solid var(--line);background:var(--bg2);gap:4px}
.switch button{font:600 15px var(--f);color:var(--mute);background:none;border:0;border-radius:999px;padding:10px 20px;cursor:pointer}
.switch button[aria-pressed="true"]{background:var(--brand);color:var(--brand-ink)}
.switch button[data-show="sofc"][aria-pressed="true"]{background:var(--sofc);color:#1a0f02}
.switch button:focus-visible{outline:2px solid var(--brand-hi);outline-offset:2px}
body[data-show="pem"] .c-sofc,body[data-show="sofc"] .c-pem{display:none}
body[data-show="pem"] .stephead{column-span:1}
th.c-pem,td.c-pem{border-left:3px solid color-mix(in srgb,var(--pem) 70%,transparent)}
th.c-sofc,td.c-sofc{border-left:3px solid color-mix(in srgb,var(--sofc) 70%,transparent)}
.tbl th.c-pem{color:var(--pem)}.tbl th.c-sofc{color:var(--sofc)}
.tbl.wide table{min-width:860px}
.tbl th[scope="row"]{text-transform:none;letter-spacing:0;font-size:14.5px;color:var(--ink);background:transparent;border-bottom:1px solid var(--line);vertical-align:top;min-width:160px}
.tbl td{vertical-align:top}
.stephead b{display:block;color:var(--ink);letter-spacing:.08em}.stephead span{display:block;text-transform:none;letter-spacing:0;font-weight:500;color:var(--mute);margin-top:4px}
.srcs{white-space:nowrap}.src{color:var(--brand-hi);font-size:11px;margin-right:2px}
.ladder{list-style:none;margin:26px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:14px;align-items:end}
.ladder li{padding:20px 22px;border-radius:16px;border:1px solid var(--line);background:linear-gradient(180deg,var(--panel),var(--bg2));display:flex;flex-direction:column;gap:6px}
.ladder li:nth-child(1){min-height:150px}.ladder li:nth-child(2){min-height:190px}.ladder li:nth-child(3){min-height:230px}
.ladder .lbl{font:600 12px var(--f);letter-spacing:.14em;text-transform:uppercase;color:var(--brand)}
.ladder b{font-size:20px}.ladder span:last-child{margin-top:auto;font:600 26px var(--f);color:var(--ink)}
@media(max-width:760px){.ladder{grid-template-columns:1fr}.ladder li{min-height:0!important}}
.chart{margin:26px 0 0;padding:18px;border:1px solid var(--line);border-radius:16px;background:var(--bg2)}
.chart svg{width:100%;height:auto;display:block}
.chart .gl{stroke:var(--line);stroke-width:1}.chart .tk{fill:var(--dim);font:12px var(--f)}.chart .ax{fill:var(--mute);font:13px var(--f)}
.chart figcaption{font-size:13px;color:var(--dim);margin-top:10px}
.leg{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:6px;color:var(--mute)}.leg span{display:inline-flex;align-items:center;gap:6px}.leg i{width:18px;height:3px;border-radius:2px}
.calc-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:20px}
.calc-grid label{display:flex;flex-direction:column;gap:6px;font-size:13.5px;color:var(--mute)}
.calc-grid input,.calc-grid select{font:500 17px var(--f);color:var(--ink);background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.calc-grid input:focus,.calc-grid select:focus{outline:2px solid var(--brand);outline-offset:1px}
@media(max-width:800px){.calc-grid{grid-template-columns:1fr 1fr}}
.warn{color:var(--gap)}
.limits{color:var(--mute);padding-left:20px}.limits li{margin-bottom:8px}.limits a{color:var(--brand-hi)}
.sources{color:var(--mute);font-size:14px;padding-left:20px}.sources li{margin-bottom:6px}.sources a{color:var(--brand-hi)}
.code{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:16px 18px;overflow-x:auto;font:13.5px/1.6 var(--mono);color:var(--ink);margin-top:18px}
.chem-filter{display:inline-flex;gap:4px;padding:4px;border:1px solid var(--line);border-radius:999px;background:var(--bg2);margin-top:18px}
.chem-filter button{font:600 14px var(--f);background:none;border:0;color:var(--mute);padding:8px 16px;border-radius:999px;cursor:pointer}
.chem-filter button[aria-pressed="true"]{background:var(--brand);color:var(--brand-ink)}
.chem-cta{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:18px}
.chart .ln{fill:none;stroke-width:2.4}.chart .ln.dash{stroke-width:1.6;stroke-dasharray:5 4}
.chart .ln.pem{stroke:var(--pem)}.chart .ln.sofc{stroke:var(--sofc)}.chart .ln.sofc2{stroke:var(--sofc2)}
.leg i.pem{background:var(--pem)}.leg i.sofc{background:var(--sofc)}.leg i.sofc2{background:var(--sofc2)}
/* Benefits and assumptions, filtered by the PEM | SOFC | both switch */
.briefs{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:22px}
body[data-show="pem"] .briefs,body[data-show="sofc"] .briefs{grid-template-columns:1fr}
.brief{padding:20px 22px;border-radius:16px;border:1px solid var(--line);background:linear-gradient(180deg,var(--panel),var(--bg2));border-top:3px solid var(--pem)}
.brief.c-sofc{border-top-color:var(--sofc)}
.brief h3{font-size:18px;margin:0 0 12px}.brief.c-pem h3{color:var(--pem)}.brief.c-sofc h3{color:var(--sofc)}
.brief h4{font:600 12px var(--f);letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin:0 0 8px}
.brief-cols{display:grid;grid-template-columns:1fr;gap:14px}
body[data-show="pem"] .brief-cols,body[data-show="sofc"] .brief-cols{grid-template-columns:1fr 1fr}
.brief ul{margin:0;padding-left:18px;color:var(--mute);font-size:14.5px}.brief li{margin-bottom:6px}
.brief .ben li::marker{color:var(--brand)}.brief .ass li::marker{color:var(--dim)}
.brief a.src{color:var(--brand-hi);font-size:11px;text-decoration:none}
@media(max-width:800px){.briefs,body[data-show] .brief-cols{grid-template-columns:1fr}}
/* PEM calibration switch: Mirai-class (default) or lab cell */
.cal-switch{margin-left:10px}
body[data-cal="lab"] .cal-mirai,body:not([data-cal="lab"]) .cal-lab{display:none}
.chart .ln.lab{stroke:#a5b2a8}.leg i.lab{background:#a5b2a8}
@media(max-width:700px){.cal-switch{margin:10px 0 0}}
.chart .mk{fill:#fff;stroke:var(--pem);stroke-width:2}.chart .mkt{fill:var(--ink)}

/* Fuel-cell explorer (battery-explorer layout; controls and key metrics first) */
.s3{border-top:1px solid var(--line)}
.av .s3{padding-left:0;padding-right:0}
.s3 .chips{margin:12px 0 0}
.s3 .chips button[aria-pressed="true"]{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
.small-lede{font-size:16px;margin-bottom:6px}
.s3-slider{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:6px 12px;margin-top:16px;font-size:14px;color:var(--mute)}
.s3-slider output{justify-self:end;color:var(--ink);font-weight:600}
.s3-slider input{grid-column:1/-1;width:100%;accent-color:var(--brand)}
.s3-info{margin-top:16px;display:grid;gap:12px}
.s3-kpi{padding:14px 14px 10px;border-radius:12px;background:var(--bg2);border:1px solid var(--line);border-top:3px solid var(--pem)}
.s3-kpi.c-sofc{border-top-color:var(--sofc)}
.s3-kpi h3{font-size:15px;margin:0 0 8px}.s3-kpi.c-pem h3{color:var(--pem)}.s3-kpi.c-sofc h3{color:var(--sofc)}
.s3-kpi ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px}
.s3-kpi li b{display:block;font-size:17px;color:var(--ink);font-weight:600}.s3-kpi li b small{font-size:12px;color:var(--mute);font-weight:500}
.s3-kpi li span{display:block;font-size:12px;color:var(--dim)}
.s3-kpi li.key b{color:var(--brand-hi)}
.s3-kpi details{margin-top:8px;font-size:12.5px;color:var(--mute)}.s3-kpi summary{cursor:pointer;color:var(--ink)}
.s3-kpi dl{display:grid;grid-template-columns:auto 1fr;gap:3px 10px;margin:8px 0 0}.s3-kpi dt{color:var(--dim)}.s3-kpi dd{margin:0}
.s3-viewer{position:sticky;top:76px;background:radial-gradient(ellipse at 50% 30%,#13261a,var(--bg2) 70%)}
.s3-labels{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.s3-tag{position:absolute;left:0;top:0;font-size:12px;line-height:1.35;color:var(--ink);background:color-mix(in srgb,var(--bg) 82%,transparent);border:1px solid var(--line);border-left:3px solid var(--pem);border-radius:8px;padding:5px 8px;white-space:nowrap}
.s3-tag.c-sofc{border-left-color:var(--sofc)}.s3-tag.c-xr{border-left-color:#a5b2a8;padding:2px 6px;color:var(--mute)}
.s3-tag b{font-weight:600}
.s3-legend{position:absolute;left:12px;bottom:10px;margin:0;padding:6px 10px;list-style:none;display:flex;flex-wrap:wrap;gap:4px 12px;font-size:12px;color:var(--mute);background:color-mix(in srgb,var(--bg) 80%,transparent);border:1px solid var(--line);border-radius:10px}
.s3-legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.s3-legend i.pem{background:var(--pem)}.s3-legend i.sofc{background:var(--sofc)}.s3-legend i.xr{border:1px solid #a5b2a8;background:rgba(165,178,168,.12)}
.s3-notes{grid-column:1/-1}
@media (max-width:900px){.s3 .s3-viewer{order:0;position:relative;top:0;aspect-ratio:1/1}.s3-kpi ul{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:520px){.s3-kpi ul{grid-template-columns:repeat(2,minmax(0,1fr))}.s3-tag{font-size:10.5px;padding:3px 6px}}
.s3-table{width:100%;border-collapse:collapse;font-size:13.5px;background:var(--bg2);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.s3-table th,.s3-table td{padding:6px 10px;border-bottom:1px solid var(--line);text-align:right;font-variant-numeric:tabular-nums}
.s3-table th[scope="row"],.s3-table thead th:first-child{text-align:left;color:var(--mute);font-weight:500}
.s3-table thead th{font-size:12px;color:var(--dim);font-weight:600}.s3-table thead th.c-pem{color:var(--pem)}.s3-table thead th.c-sofc{color:var(--sofc)}
.s3-table tr.key td{color:var(--brand-hi);font-weight:600}.s3-table td{color:var(--ink)}
.s3-table tr:last-child th,.s3-table tr:last-child td{border-bottom:0}
.s3-det{margin-top:8px;font-size:12.5px;color:var(--mute)}.s3-det summary{cursor:pointer;color:var(--ink)}.s3-det dl{margin:6px 0 0}.s3-det dt{color:var(--ink);margin-top:6px}.s3-det dd{margin:0}
.s3 .chips{gap:6px}.s3 .chips button{padding:6px 12px;font-size:13px}
.cal-note{font-size:13.5px;color:var(--mute);margin:10px 0 0;max-width:70ch}
.loading.failed{padding:24px;text-align:center;max-width:44ch;margin:auto}
body[data-sofc="rig"] .sofc-sota,body:not([data-sofc="rig"]) .sofc-rig{display:none}
.chart .ln.sofc3{stroke:#d9823a}.leg i.sofc3{background:#d9823a}

/* Live SOFC calculator */
.sl-grid{display:grid;grid-template-columns:minmax(260px,380px) minmax(0,1fr);gap:24px;align-items:start;margin-top:16px}
.sl-out{list-style:none;margin:14px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.sl-out li{padding:10px 12px;border-radius:10px;background:var(--bg2);border:1px solid var(--line);border-top:3px solid var(--sofc)}
.sl-out b{display:block;font-size:20px;color:var(--ink)}.sl-out b small{font-size:12px;color:var(--mute);font-weight:500}.sl-out span{font-size:12px;color:var(--dim)}
.sl-out li.err{grid-column:1/-1;color:var(--gap)}
.sl-chart{margin:0}.sl-chart svg{width:100%;height:auto}
.sofc-live .chips button[aria-pressed="true"]{background:var(--sofc);border-color:var(--sofc);color:#1a0f02}
@media(max-width:800px){.sl-grid{grid-template-columns:1fr}}
:not(.av) > .sofc-live{max-width:calc(var(--max) + 2*var(--pad));margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.s3-slider input{width:100%;min-width:0;margin:0;box-sizing:border-box}.sl-grid>div{min-width:0}

/* Chemistry and model switches with DesignCraft icons; model rows follow the chemistry switch */
.switch.ic button{display:inline-flex;align-items:center;gap:8px}
.switch .ci,.chips .ci{flex:none}
.model-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:12px}
.model-lbl{font:600 12px var(--f);letter-spacing:.14em;text-transform:uppercase;color:var(--dim);min-width:98px}
.model-row .cal-switch{margin-left:0}
body[data-show="pem"] .only-sofc,body[data-show="sofc"] .only-pem{display:none}
.switch.sofc-sw button[aria-pressed="true"]{background:var(--sofc);color:#1a0f02}
.chips.ic button{display:inline-flex;align-items:center;gap:6px}
@media(max-width:560px){.model-lbl{min-width:0;width:100%}.switch.ic button{padding:9px 14px}}

/* First-time guide */
.guide .g-loop{list-style:none;counter-reset:g;margin:20px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.guide .g-loop li{counter-increment:g;padding:18px;border-radius:14px;background:var(--bg2);border:1px solid var(--line)}
.guide .g-loop li::before{content:counter(g);display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--brand);color:var(--brand-ink);font-weight:700;margin-bottom:10px}
.guide .g-loop b{display:block;margin-bottom:6px}.guide .g-loop span{color:var(--mute);font-size:14.5px}
.guide .g-tour{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px}
.guide .g-tour a{display:flex;flex-direction:column;gap:6px;height:100%;padding:18px;border-radius:14px;border:1px solid var(--line);background:linear-gradient(180deg,var(--panel),var(--bg2));text-decoration:none;color:var(--ink)}
.guide .g-tour a:hover{border-color:var(--brand)}
.guide .g-tour b{font-size:17px}.guide .g-tour span{color:var(--mute);font-size:14.5px}
.guide .g-ic{color:var(--brand)}.guide .g-ic .ci,.guide .g-ic .ti{width:26px;height:26px}
.guide .g-tags{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:10px}
.guide .g-tags li{display:grid;grid-template-columns:200px 1fr;gap:14px;align-items:start;color:var(--mute)}
.guide .g-models{list-style:none;padding:0;color:var(--mute)}.guide .g-models li{margin-bottom:10px}.guide .g-models .ci{vertical-align:-4px;margin-right:6px;color:var(--brand)}
.guide .g-models b{color:var(--ink)}
.guide .brief h3 .ci{vertical-align:-3px;margin-right:6px}
.guide .g-steps{color:var(--mute);padding-left:22px}.guide .g-steps li{margin-bottom:10px}.guide .g-steps a{color:var(--brand-hi)}.guide .g-steps b{color:var(--ink)}
.guide .g-gloss{display:grid;grid-template-columns:minmax(160px,240px) 1fr;gap:10px 22px;margin:18px 0 0}
.guide .g-gloss dt{color:var(--ink);font-weight:600}.guide .g-gloss dd{margin:0;color:var(--mute)}
.guide .g-faq details{border-bottom:1px solid var(--line);padding:14px 0}.guide .g-faq summary{cursor:pointer;color:var(--ink);font-weight:600}
.guide .g-faq p{color:var(--mute);margin:10px 0 0}
@media(max-width:800px){.guide .g-loop{grid-template-columns:1fr 1fr}.guide .g-tags li,.guide .g-gloss{grid-template-columns:1fr}}