:root{color-scheme:dark;--ink:#181818;--paper:#f4f4f4;--green:#18f87c;--muted:#ababab;--line:#ffffff25;--surface:#202020;--fg:#f4f4f4;--bg:#181818;font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;font-synthesis:none}

*{box-sizing:border-box}
body{margin:0;background:#090909;color:var(--fg)}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit;cursor:pointer}
button,a{touch-action:manipulation}
button{color:inherit;border:0;background:none}
a{color:inherit;text-decoration:none}
button:focus-visible,a:focus-visible{outline:2px solid var(--green);outline-offset:4px}
button:disabled{opacity:.18;cursor:default}
img{max-width:100%;display:block}
button img{pointer-events:none}
[hidden]{display:none!important}
em{font-style:normal;color:var(--green)}
h1,h2,h3,p,figure,dl,dd{margin:0}
h1,h2{font-size:clamp(36px,10.8vw,49px);line-height:1.035;letter-spacing:-.048em;font-weight:400}
h2{font-size:clamp(36px,10.6vw,47px)}
h3{font-weight:400}
.presentation{position:relative;background:var(--bg);max-width:480px;height:100vh;height:100dvh;margin:0 auto;overflow:hidden;isolation:isolate;transition:background .2s,color .2s}
.presentation.is-light{--bg:#f4f4f4;--fg:#181818;--muted:#646464;--line:#18181826;--surface:#e7e7e4;color-scheme:light;color:var(--fg)}
.topbar{height:calc(76px + env(safe-area-inset-top));padding:env(safe-area-inset-top) 24px 0;display:flex;align-items:center;justify-content:space-between;gap:8px}
.logo{width:127px;height:auto}
.is-light .logo{filter:invert(1)}
.home{padding:12px 0}
.top-actions{display:flex;align-items:center;gap:2px}
.icon-button{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;font-size:23px;border-radius:50%;flex-shrink:0}
.info-icon{border:1px solid currentColor;width:19px;height:19px;border-radius:50%;font:12px/18px Georgia,serif;opacity:.65}
.menu-button{height:44px;display:flex;align-items:center;gap:9px;font-size:12px;letter-spacing:.01em;padding:0 0 0 8px}
.menu-icon{height:8px;width:18px;border-block:1px solid currentColor}
.chapter{position:absolute;inset:calc(76px + env(safe-area-inset-top)) 0 calc(73px + env(safe-area-inset-bottom));padding:10px 26px 5px;display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;scrollbar-width:none;animation:enter .35s ease both;touch-action:pan-y pinch-zoom}
.chapter::-webkit-scrollbar{display:none}
.eyebrow{font-family:ui-monospace,"SF Mono",Menlo,monospace;font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);line-height:1.5;margin-bottom:19px}
.lede{font-size:16px;line-height:1.45;color:var(--muted);letter-spacing:-.015em;margin-top:18px}
.cover h1{font-size:clamp(35px,10.4vw,48px)}
.cover .lede{font-size:15px}
.cover-material{position:relative;flex:1;min-height:180px;max-height:330px;margin:10px -26px 0;overflow:hidden}
.cover-material img{width:100%;height:100%;object-fit:cover;object-position:61% center;mix-blend-mode:screen}
.cover-material:after{content:"";position:absolute;inset:0;background:linear-gradient(#181818 0%,transparent 25%,transparent 65%,#181818 100%);pointer-events:none}
.material-label{position:absolute;left:26px;bottom:12px;z-index:1;color:#a5a5a5;font:9px ui-monospace,Menlo,monospace;letter-spacing:.03em}
.speaker{font-size:14px;line-height:1.5;margin-top:auto;padding-top:8px}
.speaker span{display:block;color:var(--muted);font-size:12px}
.metrics{display:grid;grid-template-columns:1fr 1fr;margin-top:25px;gap:0 18px}
.metrics>div{border-top:1px solid var(--line);padding:16px 0 18px;display:flex;flex-direction:column}
.metrics dt{font-size:12px;color:var(--muted);margin-bottom:7px}
.metrics dd{font-size:58px;line-height:1;letter-spacing:-.06em;font-variant-numeric:tabular-nums}
.metrics dd span{font-size:.5em;letter-spacing:-.03em}
.metrics dd .unit{font-size:.29em;margin-left:3px;letter-spacing:-.04em}
.locations{display:flex;gap:26px;font:11px ui-monospace,Menlo,monospace;color:var(--muted);padding:5px 0 18px;border-bottom:1px solid var(--line)}
.investors{margin-top:20px}
.investors .eyebrow{margin-bottom:12px}
.investor-grid{display:grid;grid-template-columns:repeat(3,1fr);align-items:center;gap:19px 18px}
.investor-grid img{width:100%;height:24px;object-fit:contain;filter:grayscale(1);mix-blend-mode:multiply}
.investor-grid img[alt="Union Tech Ventures"]{height:28px}
.text-button{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;font-size:13px;text-align:left;padding:9px 0;width:100%}
.text-button span{font-size:18px}
.investors .text-button{font-size:12px;margin-top:9px}
.footnote{font-size:10px;line-height:1.5;color:var(--muted);margin-top:12px}
.company>.footnote{margin-top:auto;padding-top:12px}
.product h2{font-size:clamp(33px,9.5vw,44px)}
.product .lede{margin-top:14px}
.product-visual{position:relative;min-height:155px;flex:1;max-height:260px;margin:12px -10px 5px}
.product-visual img{height:100%;width:100%;object-fit:contain}
.product-visual>span{position:absolute;left:10px;bottom:12px;color:#aaa;font:9px ui-monospace,Menlo,monospace}
.round-action{position:absolute;right:10px;bottom:10px;border:1px solid #ffffff45;border-radius:50%;width:44px;height:44px;font-size:26px;background:#181818bb}
.pillar-list{margin-top:auto}
.pillar-list button{display:flex;align-items:center;text-align:left;width:100%;gap:10px;padding:12px 0;border-top:1px solid var(--line);min-height:46px;font-size:13px}
.pillar-list button>span{font:10px ui-monospace,Menlo,monospace;color:var(--muted)}
.pillar-list b{margin-left:auto;font-size:18px;font-weight:400;color:var(--muted)}
.segmented{display:flex;background:#242424;border:1px solid #ffffff15;padding:4px;border-radius:8px;margin-top:21px}
.segmented button{flex:1;font-size:13px;min-height:40px;border-radius:5px}
.segmented button[aria-pressed=true]{background:var(--green);color:#181818}
.transport-visual{flex:1;min-height:200px;max-height:275px;display:flex;align-items:center;margin-top:10px}
.transport-visual svg{width:100%;height:auto;max-height:100%}
.through-pore,.pore-openings{transition:opacity .3s}
.conventional-mode .through-pore,.conventional-mode .pore-openings{opacity:0}
.inplane,.through-pore{animation:flow 2.4s linear infinite}
.transport-visual.still .inplane,.transport-visual.still .through-pore{animation-play-state:paused}
.transport-caption{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:5px}
.transport-caption p{font-size:13px;line-height:1.5;color:var(--muted)}
.transport-caption strong{font-weight:400;color:var(--fg)}
.transport .text-button{font-size:12px}
.transport .footnote{font-size:9px;margin-top:9px}
.anode-comparison{margin-top:28px;padding:24px 0 16px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.stack-labels{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin-bottom:20px;font-size:13px}
.stack-labels span:last-child{display:flex;align-items:center;gap:7px}
.stack-labels span:last-child:before{content:"";width:6px;height:6px;background:#159653;border-radius:50%}
.stacks{display:flex;gap:25px;align-items:flex-end}
.electrode-stack{position:relative;width:50%;font-size:12px;text-align:center}
.anode-layer{height:94px;background:#424242;color:#fff;display:flex;align-items:center;justify-content:center}
.separator-layer{height:8px;background:#f4f4f4;border-block:1px solid #aaa}
.cathode-layer{height:48px;background:#b7b7b3;display:flex;align-items:center;justify-content:center}
.porous .anode-layer{height:62px;background:#181818;border-top:3px solid #18f87c}
.excess-outline{height:32px;border:1px dashed #888;border-bottom:0}
.stack-caption{margin-top:18px;color:var(--muted);font-size:11px;display:flex;gap:8px;align-items:center}
.legend-line{width:15px;height:3px;background:#b7b7b3}
.takeaway{font-size:25px;line-height:1.2;letter-spacing:-.035em;margin-top:auto;padding-top:27px}
.efficiency .text-button{margin-top:12px}
.result{margin-top:16px}
.result-value{font-size:112px;line-height:1;letter-spacing:-.075em;font-weight:400}
.result-value span{font-size:.51em;letter-spacing:-.05em}
.result-value span:first-child{font-size:.35em;vertical-align:25%;margin-right:4px}
.result p{font-size:21px;line-height:1.25;margin-top:4px;letter-spacing:-.025em}
.result small{font-size:12px;letter-spacing:0;color:var(--muted)}
.conditions{font-size:12px;margin-top:19px;padding-top:15px;border-top:1px solid var(--line)}
.chart-button{padding:0;margin-top:18px;width:100%;background:#fff;flex-shrink:0}
.chart-button img{width:100%;height:auto}
.chart-button span{display:flex;justify-content:space-between;font-size:10px;padding:10px 10px;background:#e8e8e4;color:#444}
.chart-button b{font-weight:400;font-size:14px}
.evidence .footnote{margin-top:10px}
.evidence .text-button{font-size:12px}
.closing .eyebrow{margin-bottom:16px}
.ambition{font-size:85px;line-height:1;letter-spacing:-.06em;color:var(--green);margin-top:17px}
.ambition span{display:block;font-size:32px;letter-spacing:-.04em;margin-top:3px}
.closing-qualification{font-size:10px;line-height:1.45;color:#b4b4b4;margin-top:12px}
.fleet-image{position:relative;flex:1;min-height:155px;margin:10px -26px 0;overflow:hidden}
.fleet-image img{width:100%;height:100%;object-fit:cover;object-position:67% 60%}
.fleet-image:after{content:"";position:absolute;inset:0;background:linear-gradient(#181818,transparent 22%,transparent 65%,#181818)}
.fleet-image>span{position:absolute;bottom:10px;left:26px;z-index:1;font:8px ui-monospace,Menlo,monospace;color:#b1b1b1}
.integration-button{display:flex;justify-content:space-between;align-items:center;gap:8px;width:100%;text-align:left;min-height:60px;border-top:1px solid var(--line);font-size:13px;padding:12px 0 5px;line-height:1.5}
.integration-button small{display:block;color:var(--muted);font-size:10px}
.integration-button b{font-size:20px;font-weight:400}
.website{font-size:12px}
.navigation{position:absolute;bottom:0;left:0;right:0;height:calc(73px + env(safe-area-inset-bottom));padding:8px 26px calc(12px + env(safe-area-inset-bottom));background:var(--bg)}
.progress{position:absolute;right:0;top:50%;transform:translateY(-50%);z-index:4;display:flex;flex-direction:column;width:24px;align-items:center}
.progress button{width:24px;height:28px;flex:none;padding:0;display:flex;align-items:center;justify-content:center}
.progress button:after{content:"";display:block;width:3px;height:12px;border-radius:4px;background:var(--fg);opacity:.45;transition:height .2s,background .2s,opacity .2s}
.progress button[aria-current=true]:after{height:24px;background:var(--green);opacity:1}
.is-light .progress button[aria-current=true]:after{background:#181818}
.progress button:focus-visible{outline-offset:-2px;border-radius:4px}
.nav-row{display:flex;align-items:center;gap:15px;height:53px}
.nav-arrow{width:37px;height:44px;text-align:left;font-size:23px;flex-shrink:0}
.nav-caption{display:flex;flex-direction:column;gap:5px;min-width:0;flex:1}
#page-number{font:10px ui-monospace,Menlo,monospace;letter-spacing:.08em;color:var(--muted)}
#page-name{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.next-button{height:45px;min-width:85px;padding:0 16px;border-radius:99px;background:var(--green);color:#181818;display:flex;gap:15px;align-items:center;justify-content:center;font-size:12px}
.next-button>span:last-child{font-size:21px}
.is-light .next-button{background:#181818;color:#fff}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.sheet-open .inplane,.sheet-open .through-pore{animation-play-state:paused!important}

dialog{position:fixed;inset:auto 0 0;margin:0 auto;background:#f4f4f4;color:#181818;width:min(100%,480px);max-width:480px;max-height:90dvh;border:0;border-radius:19px 19px 0 0;padding:0;box-shadow:0 0 100px #0008;color-scheme:light}
dialog::backdrop{background:#000a;backdrop-filter:blur(5px)}
.sheet-top{display:flex;align-items:center;justify-content:space-between;padding:14px 20px 4px;position:sticky;top:0;background:#f4f4f4;z-index:2}
.sheet-top .eyebrow{margin:0;color:#666}
.sheet-body{padding:5px 26px 30px;overflow-wrap:anywhere}
.sheet-body h2{font-size:32px;line-height:1.08;margin:8px 0 18px}
.sheet-body h3{font-size:19px;line-height:1.2;margin:22px 0 8px;letter-spacing:-.025em}
.sheet-body p{font-size:14px;line-height:1.55;color:#555;margin:12px 0}
.sheet-body a{color:#181818;text-decoration:underline;text-underline-offset:3px}
.sheet-body .fine{font-size:11px;color:#666}
.sheet-image{margin:18px 0;width:100%;height:auto}
.sheet-image.dark{background:#181818;border-radius:4px;padding:8px}
.chapter-menu{display:flex;flex-direction:column;margin-top:16px}
.chapter-menu button{display:flex;gap:15px;align-items:center;min-height:54px;text-align:left;border-bottom:1px solid #ddd;font-size:15px;padding:10px 0}
.chapter-menu button span{color:#777;font:11px ui-monospace,Menlo,monospace}
.chapter-menu button[aria-current=true]{font-weight:500}
.chapter-menu button[aria-current=true]:after{content:"";width:6px;height:6px;background:#181818;border-radius:50%;margin-left:auto}
.sheet-body .utility{padding-top:17px;margin-top:12px;display:flex;gap:10px;border-top:1px solid #ccc}
.utility button{min-height:44px;padding:10px 12px;border:1px solid #bbb;border-radius:8px;font-size:12px}
.zoom-figure{overflow:auto;border:1px solid #ddd;padding:5px;background:#fff;margin:14px -16px 0;touch-action:pan-x pan-y pinch-zoom}
.zoom-figure img{width:100%;max-width:none}
.zoom-figure.zoomed img{width:900px}
.zoom-control{border:1px solid #bbb;padding:10px 15px;border-radius:6px;min-height:44px;font-size:12px}
.qr{width:190px;height:190px;margin:20px auto}
.mobile-url{display:block;text-align:center;font-size:12px;line-height:1.5}
.copy-status{font-size:12px;min-height:18px;color:#444}
.all-investors{display:grid;grid-template-columns:repeat(3,1fr);align-items:center;gap:24px 16px;margin:25px 0}
.all-investors img{width:100%;height:30px;object-fit:contain;filter:grayscale(1);mix-blend-mode:multiply}
.all-investors img[alt=JX]{height:45px}
.sheet-body .fact-list{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:20px 0}
.fact-list div{border-top:1px solid #ccc;padding-top:12px}
.fact-list dt{font-size:11px;color:#666}
.fact-list dd{font-size:24px;letter-spacing:-.04em;margin-top:7px}

.presentation{transition:none}
.chapter{animation:none}

@keyframes flow{to{stroke-dashoffset:-52}
}
@media(min-width:600px) and (min-height:740px){body{display:grid;place-items:center;min-height:100vh}
.presentation{height:min(900px,calc(100dvh - 32px));width:440px;border:1px solid #333;border-radius:18px;box-shadow:0 24px 100px #0008}
.chapter{padding-top:14px}
dialog{bottom:16px;border-radius:19px;max-height:calc(100dvh - 50px)}
}
@media(max-height:740px){.topbar{height:calc(65px + env(safe-area-inset-top))}
.chapter{top:calc(65px + env(safe-area-inset-top));padding-top:3px}
.eyebrow{margin-bottom:13px}
h1,h2{font-size:36px}
.cover h1{font-size:36px}
.lede{font-size:14px;margin-top:12px}
.cover .lede{font-size:14px}
.cover-material{min-height:130px}
.material-label{font-size:8px;bottom:7px}
.speaker{font-size:12px}
.speaker span{font-size:10px}
.metrics{margin-top:17px}
.metrics>div{padding:10px 0 13px}
.metrics dd{font-size:49px}
.metrics dt{font-size:11px}
.locations{padding-bottom:13px}
.investors{margin-top:14px}
.investor-grid{gap:15px}
.investor-grid img{height:20px}
.product h2{font-size:34px}
.product .lede{font-size:14px}
.product-visual{min-height:115px}
.pillar-list button{min-height:43px;padding:10px 0;font-size:12px}
.segmented{margin-top:15px}
.segmented button{min-height:35px}
.transport-visual{min-height:166px;margin-top:6px}
.transport-caption p{font-size:12px}
.transport .footnote{margin-top:5px}
.transport .text-button{min-height:37px}
.anode-comparison{margin-top:20px;padding-top:17px}
.anode-layer{height:74px}
.porous .anode-layer{height:48px}
.excess-outline{height:26px}
.takeaway{font-size:23px;padding-top:18px}
.result{margin-top:12px}
.result-value{font-size:86px}
.result p{font-size:18px}
.conditions{margin-top:12px;padding-top:10px}
.chart-button{margin-top:13px}
.ambition{font-size:66px;margin-top:12px}
.ambition span{font-size:27px}
.closing-qualification{font-size:9px;margin-top:8px}
.fleet-image{min-height:120px}
.integration-button{font-size:12px}
.integration-button small{font-size:9px}
}

@media(max-width:355px){.topbar{padding-inline:20px}
.chapter{padding-left:21px;padding-right:26px}
.navigation{padding-inline:21px}
.cover h1{font-size:32px}
.product h2{font-size:31px}
.metrics dd{font-size:45px}
.nav-row{gap:8px}
.next-button{padding-inline:12px;min-width:76px}
#page-name{font-size:10px}
.investor-grid{gap:13px}
}

@media(max-height:700px){
 .company .metrics>div{padding:8px 0 9px}
.company .investors{margin-top:8px}
.company .locations{padding-bottom:9px}
.company .eyebrow{margin-bottom:10px}
.company>.footnote{padding-top:8px}

 .efficiency .takeaway{display:none}
.efficiency .anode-comparison{margin-top:16px;padding-top:13px;padding-bottom:12px}
.efficiency .stack-labels{margin-bottom:16px}
.efficiency .stack-caption{margin-top:14px}
.efficiency .text-button{margin-top:8px}
.efficiency .footnote{margin-top:8px}

 .evidence .result-value{font-size:76px}
.evidence .result p{font-size:17px}
.evidence .conditions{margin-top:8px;padding-top:8px}
.evidence .chart-button{margin-top:9px}
.evidence .chart-button img{height:112px;object-fit:contain}
.evidence .chart-button span{padding:7px 10px}
.evidence .text-button{min-height:38px}
.evidence .footnote{margin-top:6px}

}

@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}
}


@media(min-height:741px){.efficiency .takeaway{padding-top:20px}}
/* Each reel uses the original slide composition inside one viewport. */
html,body{height:100%;overflow:hidden;overscroll-behavior-y:none}

.topbar{position:absolute;inset:0 0 auto;z-index:3;background:var(--bg)}

.navigation{z-index:3}

#chapters{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;scroll-snap-type:y mandatory;scrollbar-width:none;overscroll-behavior-y:contain;touch-action:pan-y pinch-zoom}

#chapters::-webkit-scrollbar{display:none}

#chapters:focus,.reel:focus{outline:none}

.reel{position:relative;height:100%;scroll-snap-align:start;scroll-snap-stop:always;--bg:#181818;--fg:#f4f4f4;--muted:#ababab;--line:#ffffff25;--surface:#202020;background:var(--bg);color:var(--fg);color-scheme:dark}

.reel.light{--bg:#f4f4f4;--fg:#181818;--muted:#646464;--line:#18181826;--surface:#e7e7e4;color-scheme:light}

.sheet-open #chapters{overflow:hidden}

dialog{overscroll-behavior:contain}

.sheet-body{padding-bottom:calc(30px + env(safe-area-inset-bottom))}

@media print{html,body{height:auto;overflow:visible}
#chapters{position:static;overflow:visible;scroll-snap-type:none}
.reel{height:auto}
body{background:white}
.presentation{height:auto;max-width:none;overflow:visible}
.chapter,.chapter[hidden]{position:relative;display:flex!important;inset:auto;min-height:95vh;padding:35px;page-break-after:always;color:#181818;background:#f4f4f4}
.topbar,.navigation,.progress,dialog,.text-button,.round-action{display:none}
.cover-material:after,.fleet-image:after{display:none}
.eyebrow,.lede,.footnote{color:#555}
.product,.transport,.closing,.cover{background:#181818;color:#fff}
.cover-material,.fleet-image{min-height:220px}
.transport-visual{min-height:230px}
.speaker{margin-top:15px}
}

