*{box-sizing:border-box;margin:0;padding:0}body.landing{background:var(--ani-ground);color:var(--ani-text);font-family:var(--ani-font-display);-webkit-font-smoothing:antialiased;font-weight:400;line-height:1.7;overflow-x:hidden}.landing a{color:inherit;text-decoration:none}.wrap{max-width:1040px;margin-inline:auto;padding-inline:clamp(1.25rem,4vw,2.5rem)}.mono{font-family:var(--ani-font-mono)}.c-obi{color:var(--ani-obi)}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}html.js .prefade{opacity:0}html.js .hero-h1 .hch{opacity:0;transform:translateY(.55em)}.eyecatch-page{background:var(--ani-obi);transform-origin:0;z-index:100;pointer-events:none;position:fixed;inset:0;transform:scaleX(0)}.obi-progress{inset-block:0;z-index:50;pointer-events:none;width:4px;position:fixed;left:0}.obi-progress-thumb{background:var(--ani-obi);width:4px;height:56px;position:absolute;top:0;left:0}.l-nav{border-bottom:1px solid var(--ani-rule-faint);justify-content:space-between;align-items:baseline;padding-block:1.4rem;display:flex}.l-brand{letter-spacing:.02em;font-size:1.05rem;font-weight:500}.l-brand .obi-glyph{color:var(--ani-obi)}.l-nav-links{font-family:var(--ani-font-mono);color:var(--ani-dim);gap:2rem;font-size:.85rem;display:flex}.l-nav-links a:hover,.l-nav-links a:focus-visible{color:var(--ani-obi)}.hero{padding-block:clamp(3rem,8vh,5.5rem) clamp(3rem,8vh,5rem);position:relative}.hero-spine{writing-mode:vertical-rl;letter-spacing:.06em;color:var(--ani-text);opacity:.055;user-select:none;pointer-events:none;white-space:nowrap;z-index:0;font-size:clamp(4rem,11vw,9rem);font-weight:700;line-height:1;position:absolute;top:-4rem;right:clamp(0rem,1vw,1.5rem)}.hero-grid{z-index:1;grid-template-columns:1.15fr .85fr;align-items:center;gap:clamp(2rem,5vw,4.5rem);display:grid;position:relative}.hero-eyebrow{color:var(--ani-obi);margin-bottom:1.25rem;font-size:.85rem}.hero-h1{letter-spacing:.005em;white-space:nowrap;font-size:clamp(2rem,4.6vw,3.1rem);font-weight:700;line-height:1.18}.hero-h1 .hch.c-obi{margin-inline:-.14em}.hero-h1 .hword{white-space:nowrap;display:inline-block}.hero-h1 .hch{display:inline-block}.hero-sub{color:var(--ani-dim);max-width:42ch;margin-top:1.4rem;font-size:clamp(1rem,2vw,1.15rem)}.hero-ctas{font-family:var(--ani-font-mono);flex-wrap:wrap;gap:1rem;margin-top:2.2rem;font-size:.92rem;display:flex}.btn{border:1px solid var(--ani-rule);padding:.7rem 1.5rem;transition:border-color .14s,color .14s,background .14s;display:inline-block}.btn:hover,.btn:focus-visible{border-color:var(--ani-obi);color:var(--ani-obi)}.btn-solid{background:var(--ani-obi);border-color:var(--ani-obi);color:var(--ani-ground);font-weight:500}.btn-solid:hover,.btn-solid:focus-visible{color:var(--ani-obi);background:0 0}body.landing{position:relative}.ambient{pointer-events:none;z-index:0;position:absolute;inset:0;overflow:hidden}.wrap,.obi-band{z-index:1;position:relative}.amb{font-family:var(--ani-font-mono);color:var(--ani-text);user-select:none;will-change:transform;position:absolute}.cover-plate{justify-self:end;width:min(100%,340px)}.plate-frame{border:1px solid var(--ani-rule);background:#10131f;padding:8px;position:relative}.plate-frame:before{content:"";background:var(--ani-obi);width:4px;position:absolute;top:-1px;bottom:-1px;left:-1px}.cover-plate canvas{width:100%;height:auto;image-rendering:pixelated;display:block}.cover-plate figcaption{color:var(--ani-dim);margin-top:.7rem;font-size:.75rem}.term-holder{margin-top:clamp(3rem,7vh,4.5rem)}.term{--t-ground:#10131f;--t-text:#e4e0d6;--t-dim:#6a7090;--t-amber:#f2a64b;--t-water:#7fc7d9;--t-red:#e06b54;background:var(--t-ground);border:1px solid var(--ani-rule)}.term-chrome{border-bottom:1px solid #252831;align-items:center;gap:.45rem;padding:.6rem .9rem;display:flex}.term-dot{background:#363840;border-radius:50%;width:9px;height:9px}.term-title{font-family:var(--ani-font-mono);color:var(--t-dim);margin-left:.6rem;font-size:.7rem}.term-body{font-family:var(--ani-font-mono);height:calc(27em + 2.2rem);font-size:clamp(.34rem,1.12vw,1rem);line-height:1.5;position:relative;overflow:hidden}.term-body .screen{font-family:var(--ani-font-mono);font-size:inherit;line-height:inherit;color:var(--t-text);visibility:hidden;opacity:0;margin:0;position:absolute;inset:1.1rem 1.2rem}.term .c-a{color:var(--t-amber)}.term .c-d{color:var(--t-dim)}.term .c-w{color:var(--t-water)}.term .c-r{color:var(--t-red)}.term .c-k{color:var(--t-dim);animation:1.1s ease-in-out infinite skel-pulse}@keyframes skel-pulse{0%,to{opacity:.35}50%{opacity:.75}}.term .row{display:block}.term .oc{color:#0000}.term .row.on .oc{color:var(--t-amber)}.term .cursor{animation:1s step-end infinite blink}@keyframes blink{50%{opacity:0}}.term-cover{width:21ch;height:20.25em;image-rendering:pixelated;visibility:hidden;opacity:0;position:absolute;top:calc(1.1rem + 3.15em);left:calc(1.2rem + 58ch)}.eyecatch-term{background:var(--t-amber);transform-origin:0;pointer-events:none;position:absolute;inset:0;transform:scaleX(0)}.demo-key{font-family:var(--ani-font-mono);color:var(--t-amber);opacity:0;background:#272223;border:1px solid #765533;padding:.28em .7em;font-size:1.05em;position:absolute;bottom:.9rem;right:1rem}.obi-band{background:var(--ani-obi);color:var(--ani-ground);font-family:var(--ani-font-mono);margin-top:clamp(3.5rem,8vh,5.5rem);padding-block:.85rem;font-size:.9rem;font-weight:500;overflow:hidden}.obi-track{white-space:pre;will-change:transform;width:max-content;display:flex}.sect{padding-block:clamp(3.5rem,9vh,6rem) 0}.rule{background:var(--ani-rule);transform-origin:0;height:1px}.sect-head{padding-block:2.2rem .5rem}.eyebrow{font-family:var(--ani-font-mono);color:var(--ani-obi);white-space:pre;vertical-align:bottom;font-size:.82rem;display:inline-block;overflow:hidden}.sect h2{letter-spacing:.005em;margin-top:.5rem;font-size:clamp(1.5rem,3.4vw,2.1rem);font-weight:500}.sect-lede{color:var(--ani-dim);max-width:58ch;margin-top:.8rem}.feat{grid-template-columns:180px 1fr;gap:1rem 2.5rem;padding-block:2rem;display:grid}.feat h3{letter-spacing:.005em;margin-bottom:.45rem;font-size:1.12rem;font-weight:500}.feat>div:last-child>p:last-child{color:var(--ani-dim);max-width:62ch;font-size:.98rem}.plain-block{padding-block:1.9rem}.plain-block>p{color:var(--ani-dim);max-width:68ch}.plain-block p strong{color:var(--ani-text);font-weight:500}.code-block{border:1px solid var(--ani-rule-faint);background:var(--ani-raised);font-family:var(--ani-font-mono);white-space:pre;margin-top:1.6rem;padding:1.3rem 1.5rem;font-size:.86rem;line-height:1.9;overflow-x:auto}.code-block .c-d{color:var(--ani-dim)}.code-block .c-a{color:var(--ani-obi)}.tests-line{font-family:var(--ani-font-mono);color:var(--ani-dim);margin-top:2rem;font-size:.82rem}.mascot-row{align-items:flex-end;gap:1.6rem;margin-top:2.6rem;display:flex}.mascot-bust{width:102px;height:96px;image-rendering:pixelated;flex-shrink:0}.mascot-note{color:var(--ani-dim);font-size:.78rem;line-height:1.9}.l-footer{border-top:1px solid var(--ani-rule-faint);font-family:var(--ani-font-mono);color:var(--ani-dim);flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:1rem 2.5rem;margin-top:clamp(4rem,10vh,7rem);padding-block:2.2rem 3rem;font-size:.82rem;display:flex}.l-footer nav{gap:2rem;display:flex}.l-footer a:hover,.l-footer a:focus-visible{color:var(--ani-obi)}.landing :focus-visible{outline:2px solid var(--ani-obi);outline-offset:3px}@media (prefers-reduced-motion:reduce){.term .c-k,.term .cursor{animation:none}html.js .prefade,html.js .hero-h1 .hch{opacity:1;transform:none}}@media (width<=900px){.hero-spine{opacity:.04;font-size:5rem}.hero-grid{grid-template-columns:1fr}.cover-plate{justify-self:start;width:min(100%,300px)}.feat{grid-template-columns:1fr;gap:.9rem}.plate{width:64px;height:64px;font-size:1.6rem}.obi-progress{display:none}}
