:root{--bg:#121110;--bg2:#171615;--panel:#1b1a18;--panel2:#22201e;--line:#272523;--line2:#353230;--ink:#ece6da;--dim:#aaa397;--faint:#6f6a62;--acc:#d9cfbb;--acc2:#f3eee3;--bad:#ee9a8b;--head:"IBM Plex Sans Condensed",system-ui,sans-serif;--sans:"IBM Plex Sans",system-ui,sans-serif;--mono:"IBM Plex Mono",ui-monospace,monospace}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);color-scheme:dark;overflow-x:hidden}
body{background:var(--bg);color:var(--ink);font:16px/1.6 var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}
code{font:.88em var(--mono);background:var(--panel2);padding:1px 6px;border-radius:3px}
.wrap{max-width:1200px;margin:0 auto;padding:0 32px}
.top .wrap{display:flex;align-items:center;gap:36px;height:72px;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;font:700 21px var(--head);letter-spacing:-.01em}.brand img{height:26px;width:26px;object-fit:contain}.brand span{transform:translateY(-1px)}
.nav{display:flex;gap:26px;color:var(--dim);font-size:14.5px}.nav a:hover,.nav a.on{color:var(--ink)}
.act{margin-left:auto;display:flex;gap:10px;align-items:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:42px;padding:0 18px;border-radius:3px;border:1px solid var(--line2);background:var(--panel);font-weight:600;font-size:14.5px;white-space:nowrap;transition:.15s}
.btn:hover{border-color:#4d4945}.btn.pri{background:var(--acc);border-color:var(--acc);color:#1a1205}.btn.pri:hover{background:var(--acc2)}
.btn.big{height:54px;padding:0 26px;font-size:16px}.btn.sm{height:32px;padding:0 12px;font-size:13px}.btn:disabled{opacity:.4;cursor:default}.btn.on{font-family:var(--mono);font-size:13px;font-weight:500}
h1{font:700 clamp(50px,7.4vw,112px)/.92 var(--head);letter-spacing:-.03em;text-transform:none}
h2{font:700 clamp(34px,4.2vw,58px)/1 var(--head);letter-spacing:-.02em}
h3{font:700 22px/1.2 var(--head)}
.acc{color:var(--acc)}.dim{color:var(--dim)}

.hero{padding-top:84px}
.hero .row{display:grid;grid-template-columns:1fr 380px;gap:56px;align-items:end;margin-top:30px}
.hero .lead{font-size:19px;color:var(--dim);max-width:560px}
.hero .ctas{display:flex;gap:10px;flex-wrap:wrap}
.cabox{margin-top:26px;max-width:560px}
.ca{display:flex;justify-content:space-between;align-items:center;width:100%;padding:13px 16px;border-radius:3px;border:1px solid var(--line2);background:var(--panel);font:13px var(--mono);color:var(--dim);gap:16px}
.ca b{color:var(--acc);font-weight:500;white-space:nowrap}.ca span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ca.soon{border-style:dashed}

/* posters */
.wall{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:64px}
.poster{position:relative;border:1px solid var(--line2);background:var(--bg2);padding:20px 20px 18px;border-radius:3px;animation:bob 6s ease-in-out infinite}
.poster:nth-child(2){animation-delay:-1.5s}.poster:nth-child(3){animation-delay:-3s}.poster:nth-child(4){animation-delay:-4.5s}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.poster .rw{font:700 40px/1 var(--head);letter-spacing:-.02em;color:var(--acc2)}.poster .rw small{font-size:16px;color:var(--dim);font-weight:600}
.poster h4{font:600 16px/1.35 var(--sans);margin-top:14px;min-height:44px}
.poster .meta{display:flex;justify-content:space-between;margin-top:16px;padding-top:12px;border-top:1px dashed var(--line2);font:12px var(--mono);color:var(--faint)}
.poster .meta b{color:var(--ink);font-weight:500}
.poster .eg{position:absolute;right:14px;top:14px;font:11px var(--mono);color:var(--faint)}
.poster.done .rw{color:var(--faint);text-decoration:line-through}
.poster .stamp{position:absolute;right:16px;bottom:56px;font:700 15px var(--head);letter-spacing:.06em;color:var(--acc);border:2px solid var(--acc);padding:2px 8px;transform:rotate(-8deg);opacity:0;transition:opacity .4s}
.poster.done .stamp{opacity:1}

.s{padding-top:130px}
.sh{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:end;margin-bottom:44px}.sh p{color:var(--dim);font-size:17.5px}
/* lifecycle */
.life{position:relative;display:grid;grid-template-columns:repeat(4,1fr);border-top:2px solid var(--line2)}
.life .prog{position:absolute;left:0;top:-2px;height:2px;background:var(--acc);width:0;transition:width .9s cubic-bezier(.3,.7,.2,1)}
.life>div{padding:26px 26px 0 0;position:relative}
.life>div::before{content:"";position:absolute;left:0;top:-7px;width:12px;height:12px;border-radius:50%;background:var(--bg);border:2px solid var(--line2);transition:.4s}
.life>div.on::before{background:var(--acc);border-color:var(--acc)}
.life h3{margin-top:12px}.life p{color:var(--dim);font-size:15.5px;margin-top:8px}
.life .who{font:12.5px var(--mono);color:var(--faint);display:block;margin-top:14px}
.fork{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:56px;border:1px solid var(--line2)}
.fork>div{padding:26px}.fork>div+div{border-left:1px solid var(--line2)}
.fork p{color:var(--dim);margin-top:8px}.fork b.big{font:700 30px var(--head);display:block;margin-top:14px;color:var(--acc2)}
.board{border-top:1px solid var(--line2)}
.bt{display:grid;grid-template-columns:140px 1fr 150px 120px;gap:20px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line)}
.bt .r{font:700 24px var(--head);color:var(--acc2)}.bt b{font-weight:600}.bt span{font:13px var(--mono);color:var(--faint)}
.empty{padding:56px 0;text-align:center;color:var(--faint);border-bottom:1px solid var(--line)}
table.t{width:100%;border-collapse:collapse;font-size:15.5px}
table.t th{text-align:left;font:500 12.5px var(--mono);color:var(--faint);padding:0 16px 12px 0;border-bottom:1px solid var(--line2)}
table.t td{padding:18px 16px 18px 0;border-bottom:1px solid var(--line);color:var(--dim)}table.t td:first-child{color:var(--ink);font-weight:600;width:30%}
.faq{display:grid;grid-template-columns:1fr 1fr;gap:0 56px;border-top:1px solid var(--line2)}
.faq div{padding:24px 0;border-bottom:1px solid var(--line)}.faq b{font:700 19px var(--head)}.faq p{color:var(--dim);margin-top:8px;font-size:15.5px}
.end{padding-top:140px}.end .ctas{margin-top:28px;display:flex;gap:10px}

footer.foot{background:#000;margin-top:130px;padding:64px 0 56px}
footer.foot .wrap{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px}
footer.foot h4{font:500 12.5px var(--mono);color:var(--faint);margin-bottom:14px}
footer.foot a,footer.foot span{display:block;color:var(--dim);font-size:14.5px;margin-bottom:9px}footer.foot a:hover{color:var(--ink)}
footer.foot p{color:var(--faint);font-size:13.5px;max-width:300px;margin-top:12px}
.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,20px);opacity:0;background:var(--ink);color:#111;padding:12px 18px;border-radius:3px;font-weight:600;font-size:14px;transition:.25s;z-index:60;max-width:90vw}
.toast.show{opacity:1;transform:translate(-50%,0)}.toast.bad{background:var(--bad)}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.75);display:none;place-items:center;z-index:50;padding:20px}.modal.open{display:grid}
.modal .box{position:relative;width:min(400px,100%);background:var(--panel);border:1px solid var(--line2);border-radius:4px;padding:22px}
.modal h3{margin-bottom:14px}.mclose{position:absolute;right:14px;top:12px;background:none;border:0;font-size:24px;color:var(--faint)}
.wbtn{display:flex;align-items:center;gap:12px;width:100%;height:50px;padding:0 14px;border-radius:3px;border:1px solid var(--line2);background:var(--panel2);margin-bottom:8px;font-weight:600}.wbtn img{width:24px;height:24px}
.hint{color:var(--faint);font-size:14px}
.docs{display:grid;grid-template-columns:220px 1fr;gap:56px;padding-top:56px}
.docs aside a{display:block;color:var(--dim);font-size:14.5px;padding:6px 0}.docs aside a:hover{color:var(--ink)}
.docs article{max-width:780px}.docs h1{font-size:60px}.docs h2{font-size:34px;margin-top:64px}.docs h3{margin-top:26px}
.docs p,.docs li{color:var(--dim);margin-top:14px;font-size:16.5px}.docs ul,.docs ol{padding-left:22px}
.docs pre{margin-top:16px;font:13px/1.7 var(--mono);background:var(--panel);border:1px solid var(--line);border-radius:3px;padding:16px;overflow-x:auto;color:var(--dim)}
.docs table{margin-top:16px}
@media (max-width:900px){.hero .row,.sh,.fork,.faq{grid-template-columns:1fr;gap:28px}.fork>div+div{border-left:0;border-top:1px solid var(--line2)}.wall{grid-template-columns:1fr 1fr}.life{grid-template-columns:1fr 1fr;row-gap:30px}.nav{display:none}.bt{grid-template-columns:1fr auto}.bt>span:nth-child(3){display:none}footer.foot .wrap{grid-template-columns:1fr 1fr}.docs{grid-template-columns:1fr}.docs aside{display:none}.wrap{padding-left:18px;padding-right:18px}}
/* mobile safety: long code and tables scroll inside their box, app tabs drop to their own row */
.docs article{min-width:0}.docs pre{max-width:100%}
@media (max-width:900px){.docs table{display:block;overflow-x:auto}.docs pre{white-space:pre}
  .top .wrap{flex-wrap:wrap;height:auto;min-height:64px;padding-top:12px;padding-bottom:12px;row-gap:8px}
  .top .nav.tabs{display:flex;order:3;width:100%;gap:20px;margin-left:0;justify-self:start;grid-column:1/-1}}
[hidden]{display:none!important}