/* An eclipse: an opaque disc and the ring of light around it. Night sky, warm corona. */
@font-face{font-family:Hanken;src:url(fonts/hanken-300.woff2) format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:Hanken;src:url(fonts/hanken-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Hanken;src:url(fonts/hanken-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Hanken;src:url(fonts/hanken-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(fonts/ibm-plex-mono-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(fonts/ibm-plex-mono-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
:root{--night:#070a12;--night-2:#0c111c;--panel:#111725;--panel-2:#161d2e;--ivory:#f6efe3;--text:#d9d6d0;--mute:#9a9ca6;--faint:#6f7380;
  --amber:#ffc98b;--ember:#ff9d5c;--edge:rgba(246,239,227,.1);--edge-2:rgba(246,239,227,.18);
  --sans:Hanken,"Helvetica Neue",Helvetica,Arial,sans-serif;--mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;color-scheme:dark}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:5rem;scroll-behavior:smooth}
body{margin:0;background:var(--night);color:var(--text);font:400 1.09rem/1.62 var(--sans);-webkit-font-smoothing:antialiased}
a{color:var(--amber);text-decoration:none;transition:color .15s}
a:hover{color:var(--ivory)}
p a,li a,td a{text-decoration:underline;text-decoration-color:rgba(255,201,139,.4);text-underline-offset:.2em}
:focus-visible{outline:2px solid var(--amber);outline-offset:3px;border-radius:6px}
h1,h2,h3,p,ul,ol,dl,dd{margin:0;padding:0}
ul,ol{list-style:none}
h1,h2,h3{color:var(--ivory);text-wrap:balance}
h1{font-weight:300;font-size:clamp(2.9rem,6.3vw,5.6rem);line-height:1.04;letter-spacing:-.032em}
h2{font-weight:300;font-size:clamp(2rem,4vw,3.2rem);line-height:1.1;letter-spacing:-.025em}
h3{font-weight:500;font-size:1.2rem;line-height:1.3;letter-spacing:-.008em}
b{font-weight:600;color:var(--ivory)}
code,pre,.m{font-family:var(--mono)}
code{font-size:.86em;color:var(--ivory)}
.w{max-width:74rem;margin:0 auto;padding-left:max(22px,env(safe-area-inset-left,0px));padding-right:max(22px,env(safe-area-inset-right,0px))}
.text{max-width:40rem;display:grid;gap:1rem}
.big{font-size:clamp(1.15rem,1.7vw,1.34rem);line-height:1.5;color:var(--text)}
.grey{color:var(--mute)}
.sm{font-size:.94rem}
.mt{margin-top:1.8rem}
.note{font-size:.8rem;padding:.42rem 1rem;background:var(--night-2);color:var(--mute);text-align:center;border-bottom:1px solid var(--edge)}
/* header */
.shell{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:rgba(7,10,18,.72);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--edge)}
.top{display:flex;flex-wrap:wrap;align-items:center;gap:.2rem 2rem;padding-block:.85rem}
.logo{display:flex;align-items:center;gap:.5rem;font-weight:500;font-size:1.2rem;letter-spacing:-.015em;color:var(--ivory)}
.logo svg{width:1.25rem;height:1.25rem;color:var(--amber)}
nav{display:flex;flex-wrap:wrap;gap:.2rem 1.6rem;margin-left:auto;font-size:.96rem}
nav a{color:var(--mute)}
nav a:hover,nav a[aria-current]{color:var(--ivory)}
#menu{display:none;margin-left:auto;background:none;color:var(--ivory);border:1px solid var(--edge-2);border-radius:99px;font:500 .92rem/1 var(--sans);padding:.55rem .95rem;cursor:pointer}
/* hero */
.sky{position:relative;overflow:hidden;background:radial-gradient(34rem 34rem at 73.5% 50%,#23160f 0,#110e13 44%,var(--night) 74%)}
#eclipse{position:absolute;inset:0;width:100%;height:100%;display:block}
.sky::after{content:"";position:absolute;inset:auto 0 0;height:4rem;background:linear-gradient(transparent,var(--night));pointer-events:none}
.hero{position:relative;z-index:1;min-height:min(46rem,calc(100vh - 6rem));display:flex;flex-direction:column;justify-content:center;padding-block:4rem 5rem}
.hero>*{max-width:37rem}
.hero h1{font-size:clamp(2.9rem,5.2vw,4.5rem);max-width:none;white-space:nowrap}
.hero .big{margin-top:1.4rem;max-width:32rem}
.cta{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:2rem}
.btn{display:inline-block;background:var(--ivory);color:#16120c;font:500 1rem/1 var(--sans);padding:.95rem 1.5rem;border-radius:99px;border:1px solid var(--ivory);cursor:pointer;transition:background .15s,box-shadow .2s,color .15s}
.btn:hover{color:#16120c;background:#fff;box-shadow:0 0 0 5px rgba(255,201,139,.16)}
.btn.line{background:none;color:var(--ivory);border-color:var(--edge-2)}
.btn.line:hover{background:rgba(246,239,227,.06);color:var(--ivory);box-shadow:none}
.count{margin-top:2.4rem}
.count-k{font-size:.98rem;color:var(--mute);margin-bottom:.7rem}
.units{display:none;width:max-content;max-width:100%;background:rgba(17,23,37,.62);border:1px solid var(--edge-2);border-radius:18px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.js .units{display:flex}
.u{display:grid;gap:.1rem;justify-items:center;padding:.8rem 1.35rem .75rem;border-left:1px solid var(--edge);min-width:5.4rem}
.u:first-child{border-left:0}
.u b{font:300 clamp(2rem,3.4vw,2.8rem)/1 var(--sans);letter-spacing:-.02em;color:var(--ivory);font-variant-numeric:tabular-nums}
.u.s b{color:var(--amber)}
.u i{font:400 .76rem/1.2 var(--sans);color:var(--mute)}
.when{margin-top:.8rem;font-size:.92rem;color:var(--mute)}
/* sections */
.block{padding-block:clamp(3.6rem,7.5vw,6.5rem)}
.block>.w>h2{margin-bottom:clamp(1.6rem,3vw,2.6rem);max-width:17em}
.black{background:var(--night)}
.soft{background:var(--night-2)}
.glow>.w{background:radial-gradient(60rem 22rem at 12% -10%,rgba(255,157,92,.2),transparent 70%),var(--panel);border:1px solid var(--edge);border-radius:28px;padding-block:clamp(2rem,5vw,3.6rem);padding-left:clamp(1.4rem,4.5vw,3.6rem);padding-right:clamp(1.4rem,4.5vw,3.6rem)}
.glow{padding-left:max(22px,env(safe-area-inset-left,0px));padding-right:max(22px,env(safe-area-inset-right,0px))}
.page-h{position:relative;padding-block:clamp(3rem,7vw,5.5rem) clamp(1.5rem,3vw,2.5rem)}
.head-glow{background:radial-gradient(50rem 26rem at 85% -30%,rgba(255,157,92,.2),transparent 68%)}
.page-h h1{max-width:13em}
.page-h .big{max-width:34rem;margin-top:1.2rem}
/* cards */
.cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.cols>*{display:grid;gap:.55rem;align-content:start;min-width:0}
.cols.two{grid-template-columns:repeat(2,minmax(0,1fr));gap:2rem 3.5rem}
.cols.lop{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:2.5rem 4rem;align-items:center}
.cards>*{background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--edge);border-radius:20px;padding:1.6rem 1.6rem 1.7rem;transition:border-color .2s}
.cards>*:hover{border-color:var(--edge-2)}
.cards p{color:var(--mute);font-size:1rem}
.glow .cols.two p{color:var(--text)}
/* the demo */
.demo{background:radial-gradient(46rem 20rem at 50% 120%,rgba(255,157,92,.16),transparent 70%),var(--panel);border:1px solid var(--edge);border-radius:28px;padding:clamp(1.8rem,5vw,4rem)}
.say{font-weight:300;letter-spacing:-.03em;line-height:1.28;font-size:clamp(2.1rem,5.8vw,4.6rem);color:var(--ivory);margin-bottom:1.6rem}
.x{display:inline-block;height:.74em;background:linear-gradient(100deg,#343b4e,#232a3b);border-radius:.16em;vertical-align:-.02em}
.say .hl{display:none;color:var(--amber);font-weight:400}
.say.open .hl{display:inline}
.say.open .gone{display:none}
.w1{width:3em}.w2{width:2.5em}.w3{width:1.7em}
.demo-note{min-height:3.2em;max-width:34rem;margin-top:1rem}
/* real transaction */
.tx{background:var(--panel);border:1px solid var(--edge);border-radius:20px;overflow:hidden}
.tx>div{display:grid;grid-template-columns:12rem minmax(0,1fr);gap:.15rem 1.5rem;padding:.9rem 1.4rem;border-bottom:1px solid var(--edge)}
.tx>div:last-child{border-bottom:0}
.tx dt{font-weight:500;color:var(--ivory);font-size:1rem}
.tx dd{min-width:0}
.tx .x{height:.82em;display:block;margin-top:.35em}
.tx .v{font:400 .85rem/1.55 var(--mono);overflow-wrap:anywhere;display:block;color:var(--amber)}
.tx .why{font-size:.95rem;display:block;margin-top:.2rem;color:var(--mute)}
.sh{display:none}
.code-link{font:400 .8rem/1.5 var(--mono);color:var(--faint);overflow-wrap:anywhere}
.code-link a{color:inherit}
table{border-collapse:collapse;width:100%}
.tw{overflow-x:auto}
th,td{text-align:left;padding:.8rem 1.4rem .8rem 0;border-bottom:1px solid var(--edge);vertical-align:top}
th{font-weight:500;color:var(--mute);font-size:.92rem}
td:first-child{color:var(--ivory)}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums}
td.n:last-child,th.n:last-child{padding-right:0}
.steps{display:grid;gap:1.7rem;counter-reset:s}
.steps>li{counter-increment:s;display:grid;grid-template-columns:3rem minmax(0,1fr);min-width:0}
.steps>li::before{content:counter(s);width:2rem;height:2rem;border-radius:50%;border:1px solid var(--edge-2);color:var(--amber);font-size:.95rem;display:grid;place-items:center}
.steps>li>div{display:grid;gap:.5rem;min-width:0}
pre{margin:0;background:#0a0e18;border:1px solid var(--edge);border-radius:12px;padding:.95rem 4.8rem .95rem 1.05rem;font-size:.83rem;line-height:1.6;overflow-x:auto;color:var(--text)}
.code{position:relative;min-width:0}
.copy{position:absolute;top:.45rem;right:.45rem;font:500 .78rem/1 var(--sans);padding:.42rem .6rem;background:var(--panel-2);color:var(--ivory);border:1px solid var(--edge-2);border-radius:8px;cursor:pointer}
.os{display:inline-flex;margin-bottom:1.8rem;padding:.25rem;border:1px solid var(--edge);border-radius:99px;background:var(--panel)}
.os button{font:500 .98rem/1 var(--sans);padding:.65rem 1.2rem;background:none;color:var(--mute);border:0;border-radius:99px;cursor:pointer}
.os button[aria-pressed=true]{background:var(--ivory);color:#16120c}
.js .off{display:none}
.shot{display:block;width:100%;height:auto;border-radius:16px;border:1px solid var(--edge-2);box-shadow:0 30px 80px -30px rgba(255,157,92,.3)}
details{border-bottom:1px solid var(--edge);padding-block:1rem}
summary{font-weight:500;color:var(--ivory);cursor:pointer}
details p{margin-top:.5rem;max-width:40rem}
.chart svg{width:100%;height:auto;display:block}
.chart text{font:400 14px var(--sans);fill:var(--mute)}
.chart .gr{stroke:var(--edge);stroke-width:1;fill:none}
.chart .ax{stroke:var(--edge-2);stroke-width:1;fill:none}
.chart .ln{stroke:var(--amber);stroke-width:2.5;fill:none}
.chart .ar{fill:rgba(255,157,92,.13)}
.chart .tl{stroke:var(--amber);stroke-width:2.5;stroke-dasharray:2 6;fill:none}
.chart .pt{fill:var(--ivory)}
.chart .c-n{display:none}
.ring svg{width:100%;max-width:19rem;height:auto;display:block}
.ring .d{fill:var(--amber)}
.ring .o{stroke:var(--edge-2);stroke-width:1.5;fill:none}
footer{border-top:1px solid var(--edge);margin-top:2rem;padding-block:2.6rem 3rem;font-size:.96rem;color:var(--mute)}
.foot{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,1fr) minmax(0,1fr);gap:1.5rem 3rem}
.foot a{color:var(--mute)}
.foot a:hover{color:var(--ivory)}
.foot ul{display:grid;gap:.2rem}
.foot p+p{margin-top:.6rem}
/* whitepaper */
.paper{max-width:43rem;padding-block:clamp(2.5rem,6vw,4.5rem) 3rem}
.paper h1{font-size:clamp(2.3rem,5.4vw,3.6rem)}
.paper .by{margin-top:.9rem;color:var(--mute)}
.paper .pdf{margin-top:1.2rem}
.paper h2{font-size:1.55rem;font-weight:400;letter-spacing:-.015em;margin:2.5rem 0 .6rem;line-height:1.2}
.paper h3{font-size:1.08rem;margin:1.4rem 0 .3rem}
.paper p{margin-bottom:.9rem}
.paper ul.li{list-style:disc;padding-left:1.3rem;margin-bottom:.9rem}
.paper ol.li{list-style:decimal;padding-left:1.4rem;margin-bottom:.9rem}
.paper .li li{margin-bottom:.3rem}
.paper .abs{background:var(--panel);border:1px solid var(--edge);border-radius:16px;padding:1.2rem 1.4rem;margin-top:1.8rem}
.paper .abs p{margin:0}
.paper pre{padding-right:1rem;margin-bottom:1rem}
.paper table{margin-bottom:1rem;font-size:.97rem}
.paper .code .copy{display:none}
@media (max-width:820px){
  body{font-size:1.04rem}
  .js #menu{display:block}
  .top{padding-block:.6rem}
  nav{margin-left:0;width:100%}
  .js nav{display:none}
  .js .open nav{display:grid;grid-template-columns:1fr;gap:0;padding-top:.45rem;font-size:1.12rem}
  .js .open nav a{padding:.6rem 0;border-top:1px solid var(--edge)}
  .sky{background:radial-gradient(30rem 24rem at 50% 8.5rem,#2a1a12 0,#120f14 46%,var(--night) 76%)}
  .hero{min-height:0;padding-block:17.5rem 3rem}
  .hero>*{max-width:none}
  .hero h1{white-space:normal;font-size:clamp(2.6rem,11.4vw,3.6rem)}
  .cols,.cols.two,.cols.lop,.foot{grid-template-columns:minmax(0,1fr)}
  .cols.two{gap:1.4rem}
  .cta .btn{flex:1 1 100%;text-align:center}
  .units{width:100%}
  .u{flex:1 1 0;min-width:0;padding:.75rem .2rem .7rem}
  .tx>div{grid-template-columns:minmax(0,1fr);padding:.8rem 1.05rem}
  .lg{display:none}
  .sh{display:inline}
  .steps>li{grid-template-columns:2.6rem minmax(0,1fr)}
  pre{white-space:pre-wrap;overflow-wrap:anywhere;padding:2.6rem .85rem .85rem;font-size:.79rem}
  .paper pre{padding-top:.85rem}
  .chart .c-w{display:none}
  .chart .c-n{display:block}
  table{font-size:.95rem}
  th,td{padding:.6rem .7rem .6rem 0}
  .glow>.w{border-radius:22px}
  .demo{border-radius:22px}
}
@media print{
  :root{--ivory:#111;--text:#111;--mute:#444;--edge:#ccc;--amber:#111;--panel:#fff;--night:#fff}
  .note,.shell,footer,.pdf{display:none!important}
  body{background:#fff;color:#111;font-size:10.5pt}
  .paper{max-width:none;padding:0}
  .paper h1{font-size:25pt}.paper h2{font-size:14pt;font-weight:600;break-after:avoid}
  pre{white-space:pre-wrap;background:#f4f4f4;color:#111}
  code{color:#111}
  p a,li a{text-decoration:none}
}