*{box-sizing:border-box;margin:0;padding:0}body.landing{--pad:16px;--gutter:max(var(--pad), calc((100% - 1200px) / 2));background:var(--ani-ground);color:var(--ani-text);font-family:var(--ani-font-ui);-webkit-font-smoothing:antialiased;font-size:16px;line-height:1.5;position:relative;overflow-x:clip}@media (width>=600px){body.landing{--pad:clamp(32px, 8.333vw, 120px)}}.landing a{color:inherit;text-decoration:none}.landing>:not(.ambient){z-index:1;position:relative}.wrap{padding-inline:var(--gutter)}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.caption{color:var(--ani-dim);font-size:14px;line-height:20px}.actions{flex-wrap:wrap;gap:10px;display:flex}.btn{border:1px solid var(--ani-rule-faint);background:var(--ani-raised);height:40px;color:var(--ani-text);white-space:nowrap;transition:background-color var(--ani-quick) var(--ani-spring);border-radius:20px;justify-content:center;align-items:center;padding:0 18px;font-size:15px;font-weight:600;display:inline-flex}.btn:hover{background:var(--ani-raised-selected)}.landing .btn-primary{background:var(--ani-obi-fill);color:var(--ani-on-obi);border-color:#0000;padding:0 20px}.landing .btn-primary:hover{background:var(--ani-obi-fill-hover)}@media (width<=899px){.btn{border-radius:22px;height:44px;font-size:16px}}.landing{--nav-h:0px}.l-nav{height:64px;padding-inline:var(--gutter);background:var(--ani-ground);box-shadow:inset 0 -1px 0 var(--ani-rule-faint);justify-content:space-between;align-items:center;display:flex}html.js .landing:has(.l-nav-over){--nav-h:64px}html.js .l-nav-over{z-index:20;color:#e4e0d6;transition:color var(--ani-standard) var(--ani-spring), background-color var(--ani-standard) var(--ani-spring), box-shadow var(--ani-standard) var(--ani-spring), transform var(--ani-standard) var(--ani-spring);background-color:#0000;position:fixed;inset:0 0 auto;box-shadow:inset 0 -1px #0000}html.js .l-nav-over.is-hidden{transform:translateY(-100%)}html.js .l-nav-over:before{content:"";z-index:-1;pointer-events:none;transition:opacity var(--ani-standard) var(--ani-spring);background:linear-gradient(#161a2ed9,#161a2e00);position:absolute;inset:0 0 -16px}html.js .l-nav-over.is-solid{color:var(--ani-text);background-color:var(--ani-ground);box-shadow:inset 0 -1px 0 var(--ani-rule-faint)}html.js .l-nav-over.is-solid:before{opacity:0}.l-brand{height:44px;font-family:var(--ani-font-display);letter-spacing:.02em;align-items:center;gap:10px;font-size:20px;font-weight:500;display:flex}.l-brand img{width:32px;height:32px;display:block}.l-nav-links{gap:28px;display:flex}.l-nav-links a,.l-footer nav a{text-underline-offset:3px;height:44px;transition:text-decoration-color var(--ani-quick) var(--ani-spring);align-items:center;font-size:15px;font-weight:500;text-decoration:underline 1px #0000;display:flex}.l-nav-links a:hover,.l-footer nav a:hover{text-decoration-color:var(--ani-rule)}.l-nav-links a[aria-current=page]{color:var(--ani-obi)}@media (width<=599px){.l-nav{height:56px}html.js .landing:has(.l-nav-over){--nav-h:56px}.l-brand{gap:8px;font-size:18px}.l-nav-links{gap:14px}.l-nav-links a{padding:0 3px}.l-nav-links .l-nav-releases,.l-nav-links .l-nav-github{display:none}}.landing{--cell:clamp(5px, round(down, 50vh / 70, 1px), 8px)}.hero{--ani-ground:#161a2e;--ani-text:#e4e0d6;--ani-dim:#9298b5;--ani-obi:#f2a64b;--ani-rule:#434653;--ani-rule-faint:#2f3242;--ani-raised:#222638;--ani-raised-selected:#343a57;--ani-obi-fill:#f2a64b;--ani-obi-fill-hover:#f5b467;--ani-on-obi:#161a2e;background:var(--ani-ground);color:var(--ani-text)}.scene{height:calc(560px + var(--nav-h));height:calc(70 * var(--cell) + var(--nav-h));background:#161a2e;position:relative;overflow:hidden}html:not(.js) .scene{display:none}.scene canvas{image-rendering:pixelated;opacity:0;transition:opacity var(--ani-fade-in);display:block;position:absolute;top:0;left:0}.scene.is-drawn canvas{opacity:1}.hero-copy{flex-direction:column;padding-top:40px;padding-bottom:72px;display:flex;position:relative}.hero-text{flex-direction:column;align-items:flex-start;display:flex}@media (width>=900px){html.js .hero-copy{margin-top:calc(var(--cell) * -14 + 16px);padding-top:0}}.hero-copy h1{max-width:min(800px, calc(69vw - max(var(--pad), (100vw - 1200px) / 2) - 64px));font-family:var(--ani-font-display);letter-spacing:.005em;font-size:52px;font-weight:700;line-height:60px}.hero-claim{color:var(--ani-obi)}.hero-side{flex-direction:column;max-width:560px;margin-top:20px;display:flex}.hero-sub{font-size:17px;line-height:26px}.hero-side .actions{margin-top:24px}.hero-note{color:var(--ani-dim);margin-top:14px;font-size:13px;line-height:18px}@media (width<=899px){.landing{--cell:6px}.hero-copy{padding-top:24px;padding-bottom:48px}.hero-copy h1{letter-spacing:0;max-width:none;font-size:34px;line-height:40px}.hero-side{margin-top:16px}.hero-side .actions{margin-top:20px}}.hero-run-hint{display:none}@media (hover:hover) and (pointer:fine){html.js .hero-run-hint{right:var(--gutter);color:#9298b58c;pointer-events:none;font-size:12px;line-height:16px;display:block;position:absolute;bottom:18px}}.hero.is-playing .scene{touch-action:pan-y;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.hero-run-hud{top:calc(var(--nav-h) + 14px);right:var(--gutter);text-align:right;opacity:0;pointer-events:none;max-width:min(340px,64vw);transition:opacity var(--ani-fade-in);flex-direction:column;align-items:flex-end;gap:6px;display:flex;position:absolute}.hero-run-hud.is-on{opacity:1}.hero-run-score{font-variant-numeric:tabular-nums;align-items:baseline;gap:16px;font-size:15px;line-height:20px;display:flex}.hero-run-best{color:var(--ani-dim)}.hero-run-best:empty{display:none}.hero-run-leave{font:inherit;color:var(--ani-dim);text-underline-offset:3px;cursor:pointer;transition:color var(--ani-quick) var(--ani-spring), text-decoration-color var(--ani-quick) var(--ani-spring);background:0 0;border:0;padding:0;font-size:13px;text-decoration:underline #0000}.hero-run-hud.is-on .hero-run-leave{pointer-events:auto}.hero-run-leave:hover{color:var(--ani-text);text-decoration-color:currentColor}.hero-run-leave:focus-visible{outline:2px solid var(--ani-obi);outline-offset:3px;border-radius:2px}@media (pointer:coarse){.hero-run-leave{margin:-12px;padding:12px}}.hero-run-msg{color:var(--ani-dim);opacity:0;transition:opacity var(--ani-fade-in);font-size:14px;line-height:20px}.hero-run-msg.is-on{opacity:1}.hero-apps{flex-direction:column;gap:16px;max-width:760px;margin-top:56px;display:flex}.hero-devices{padding-bottom:10%;position:relative}.hero-mac{margin-left:9%;display:block}.hero-phone{width:25%;position:absolute;bottom:0;left:0}@media (width>=960px){.hero-copy{grid-template-rows:auto 1fr;grid-template-columns:minmax(0,1fr) min(640px,46vw);column-gap:40px;padding-bottom:56px;display:grid}.hero-copy h1{text-wrap:balance;max-width:none;font-size:clamp(34px,3.2vw,48px);line-height:1.16}.hero-text{grid-area:1/1/span 2}.hero-apps{display:contents}.hero-devices{grid-area:1/2;align-self:start}html.js .hero-devices{margin-top:-16px}.hero-apps>.caption{grid-area:2/2;align-self:start;margin:calc(14px - 10%) 0 0 28%}}@media (width>=960px) and (width<=1199px){.hero-copy{column-gap:32px}.hero-devices{margin-right:calc(16px - var(--gutter))}.hero-apps>.caption{margin:calc(14px - 10% - .1 * (var(--gutter) - 16px)) calc(16px - var(--gutter)) 0 calc(28% + .28 * (var(--gutter) - 16px))}}@media (width<=899px){.hero-apps{margin-top:40px}.hero-mac{margin-left:0;margin-right:14%}.hero-phone{width:27%;left:auto;right:0}.hero-devices{padding-bottom:16%}}.shot{display:block;container-type:inline-size}.shot-frame{display:block}.shot img{width:100%;height:auto;display:block}.shot-window :is(img,.fv-box){box-shadow:0 0 0 1px var(--ani-rule-faint);border-radius:1.6cqi}.hero .shot-window :is(img,.fv-box){box-shadow:0 0 0 1px #2f3242}.shot-phone .shot-frame,.shot-tablet .shot-frame{padding:var(--bezel,max(3px, 1.6cqi));background:#0b0d17;border-radius:14cqi;box-shadow:0 0 0 1px #2f3242}.shot-phone :is(img,.fv-box){border-radius:12.4cqi}.shot-tablet .shot-frame{padding:var(--bezel,max(3px, 1.1cqi));border-radius:5.4cqi}.shot-tablet :is(img,.fv-box){border-radius:4.4cqi}.shot-phone.shot-landscape .shot-frame{padding:var(--bezel,max(3px, .75cqi));border-radius:6.5cqi}.shot-phone.shot-landscape :is(img,.fv-box){border-radius:5.7cqi}.shot-android.shot-phone:not(.shot-landscape) .shot-frame{border-radius:9cqi}.shot-android.shot-phone:not(.shot-landscape) :is(img,.fv-box){border-radius:7.4cqi}.shot-tablet.shot-landscape .shot-frame{padding:var(--bezel,max(3px, .7cqi));border-radius:3.4cqi}.shot-tablet.shot-landscape :is(img,.fv-box){border-radius:2.8cqi}.shot-screen .shot-frame{padding:var(--bezel,max(3px, .6cqi));background:#0b0d17;border-radius:1.4cqi;box-shadow:0 0 0 1px #2f3242}.shot-screen :is(img,.fv-box){border-radius:.8cqi}.ratio-row{--bezel:4px;align-items:flex-start;gap:24px;display:flex}.ratio-row>*{flex:var(--ratio,1) 1 calc(2 * var(--bezel));min-width:0}.ratio-row>.shot-window{--bezel:0px}.term{--t-ground:#10131f;--t-edge:#2f3242;--t-text:#e4e0d6;--t-dim:#9298b5;--t-amber:#f2a64b;--t-water:#7fc7d9;--t-red:#e06b54;--tpad:12px;border:1px solid var(--t-edge);border-radius:var(--ani-r-box);background:var(--t-ground);position:relative;overflow:hidden;container-type:inline-size}.term-chrome{border-bottom:1px solid var(--t-edge);height:34px;font-family:var(--ani-font-mono);color:var(--t-dim);align-items:center;padding:0 16px;font-size:12px;display:flex}.term-body{overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:var(--t-edge) transparent;font-family:var(--ani-font-mono);font-size:clamp(12px, calc((100cqw - 2 * var(--tpad)) / 49.6), 16px);line-height:1.5;overflow-x:auto}@container (width>=700px){.term-body{--tpad:22px}}.term-canvas{width:calc(82ch + 2 * var(--tpad));min-width:100%;height:calc(18 * 1.5em + 2 * var(--tpad));position:relative}.term .screen{inset:var(--tpad);font:inherit;color:var(--t-text);white-space:pre;visibility:hidden;opacity:0;position:absolute}.term [data-screen=home]{visibility:visible;opacity:1}.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{top:calc(var(--tpad) + 2.1 * 1.5em);left:calc(var(--tpad) + 58ch);width:21ch;height:20.25em;image-rendering:pixelated;visibility:hidden;opacity:0;position:absolute}.eyecatch-term{background:var(--t-amber);transform-origin:0;pointer-events:none;position:absolute;inset:0;transform:scaleX(0)}.demo-key{border:1px solid var(--ani-over-art-edge);background:var(--ani-over-art);height:26px;color:var(--t-text);font-family:var(--ani-font-mono);opacity:0;pointer-events:none;border-radius:13px;align-items:center;padding:0 11px;font-size:13px;display:flex;position:absolute;bottom:14px;right:16px}.sect{padding-top:120px}.sect:first-child{padding-top:112px}.sect h2{font-family:var(--ani-font-display);font-size:36px;font-weight:700;line-height:44px}.lede{max-width:792px;margin-top:12px;font-size:17px;line-height:28px}@media (width<=899px){.sect,.sect:first-child{padding-top:72px}.sect h2{font-size:26px;line-height:32px}.lede{margin-top:10px;font-size:16px;line-height:26px}}.glance{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:24px;margin-top:40px;display:grid}.glance figure{grid-row:span 2;grid-template-rows:subgrid;row-gap:20px;display:grid}.glance-media{justify-content:center;align-items:flex-end;display:flex}.glance-media .shot{width:min(232px,64%)}.glance-media .shot-android{width:min(227px,62.6%)}.glance h3{font-size:17px;font-weight:600;line-height:24px}.glance figcaption p{color:var(--ani-dim);margin-top:4px;font-size:15px;line-height:24px}@media (width<=899px){.glance{grid-template-columns:minmax(0,1fr);row-gap:24px;margin-top:24px}.glance figure{grid-row:auto;grid-template-rows:none;grid-template-columns:132px minmax(0,1fr);align-items:center;column-gap:16px}.glance-media{flex:0 0 132px}.glance-media .shot{width:132px}.glance h3{font-size:16px;line-height:22px}.glance figcaption p{line-height:22px}}.player-block{margin-top:32px}.player-shots{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:24px;margin-top:40px;display:grid}.player-shots figure{flex-direction:column;gap:10px;display:flex}.player-shots a{border-radius:var(--ani-r-row);display:block;overflow:hidden}.player-shots img{width:100%;height:auto;display:block}.player-shots figcaption{color:var(--ani-dim);font-size:14px;line-height:20px}.player-credit{color:var(--ani-dim);margin-top:28px;font-size:13px;line-height:18px}.player-credit a{text-decoration:underline 1px;text-decoration-color:var(--ani-rule);text-underline-offset:3px}@media (width>=1200px){.player-block{grid-template-columns:minmax(0,1fr) 296px;column-gap:32px;display:grid}.player-block>.compare{grid-column:1}.player-shots{grid-area:1/2;grid-template-columns:minmax(0,1fr);align-content:start;row-gap:20px;margin-top:0}.player-credit{grid-column:1/-1}}@media (width<=899px){.player-block{margin-top:24px}.player-shots{grid-template-columns:minmax(0,1fr);row-gap:20px;margin-top:28px}.player-shots figure{gap:8px}.player-credit{margin-top:20px}}.term-block{grid-template-columns:minmax(0,720fr) minmax(0,456fr);align-items:start;column-gap:24px;margin-top:32px;display:grid}.term-demo{flex-direction:column;gap:12px;min-width:0;display:flex}.term-rows{border-bottom:1px solid var(--ani-rule-faint)}.term-row{border-top:1px solid var(--ani-rule-faint);padding:14px 0}.term-row dt{font-size:17px;font-weight:600;line-height:24px}.term-row dd{margin-top:4px;font-size:15px;line-height:24px}.term-block+.code-block{margin-top:40px}@media (width<=1199px){.term-block{grid-template-columns:minmax(0,1fr);row-gap:28px}.term-demo{max-width:840px}}@media (width<=899px){.term-block{margin-top:24px}.term-row dt{font-size:16px;line-height:22px}.term-row dd{line-height:22px}.term-block+.code-block{margin-top:28px}}.rows.toolkits{max-width:792px}.rows.toolkits .row{grid-template-columns:minmax(0,280fr) minmax(0,512fr)}.app-strip{margin-top:32px}@media (width<=899px){.app-strip{--strip-h:300px;--bezel:3px;margin:24px calc(-1 * var(--gutter)) 0;padding:0 var(--gutter) 4px;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter);scrollbar-width:none;gap:16px;overflow-x:auto}.app-strip::-webkit-scrollbar{display:none}.app-strip>*{width:calc(var(--strip-h) * var(--ratio) + 2 * var(--bezel));scroll-snap-align:start;flex:none}}.legal-lead{max-width:792px;margin-top:16px;font-size:20px;font-weight:600;line-height:30px}.rows{border-bottom:1px solid var(--ani-rule-faint);margin-top:28px}.rows .row{border-top:1px solid var(--ani-rule-faint);grid-template-columns:minmax(0,200fr) minmax(0,976fr);column-gap:24px;padding:16px 0;display:grid}.rows dt{font-size:17px;font-weight:600;line-height:24px}.rows dd{max-width:760px;font-size:15px;line-height:24px}.rows+.lede{margin-top:24px}@media (width<=899px){.legal-lead{margin-top:12px;font-size:17px;line-height:26px}.rows{margin-top:20px}.rows .row{flex-direction:column;gap:4px;padding:14px 0;display:flex}.rows dt{font-size:16px;line-height:22px}.rows dd{line-height:22px}.rows+.lede{margin-top:20px}}.get-apps{margin-top:28px}.dl-sg{opacity:0;transition:opacity var(--ani-standard) ease-out;margin-top:28px}.dl-sg:not([data-pending]):empty{display:none}.dl-sg[data-pending]{min-height:76px}.dl-sg.is-ready{opacity:1}.dl-sg-note{margin-bottom:16px;font-size:16px;line-height:24px}.dl-sg-row{flex-wrap:wrap;align-items:center;gap:8px 16px;display:flex}.dl-sg-meta,.dl-sg-first{color:var(--ani-dim);font-size:15px;line-height:24px}.dl-sg-first{margin-top:12px}.dl-sg-step{color:var(--ani-text);display:block}.dl-sg-step code{font-family:var(--ani-font-mono);font-size:14px}.dl-sg-meta a,.dl-sg-first a{color:var(--ani-text);text-decoration:underline 1px;text-decoration-color:var(--ani-rule);text-underline-offset:3px}.dl-sg-first.is-next .dl-sg-guide{margin-top:4px;display:inline-block}[data-dl-app][hidden]{display:none}.dl-others{margin-top:36px;font-size:15px;font-weight:600;line-height:24px;display:none}.dl-sg[data-pending]~.dl-others,.dl-sg.is-ready~.dl-others{display:block}.dl-sg[data-pending]:not(.is-ready)~.dl-others{visibility:hidden}.dl-others+.get-apps{margin-top:12px}@media (width<=899px){.dl-sg[data-pending]{min-height:160px}}@media (prefers-reduced-motion:reduce){.dl-sg{transition:none}}.get-more{max-width:792px;color:var(--ani-dim);margin-top:16px;font-size:15px;line-height:24px}.get-more a{color:var(--ani-text);text-decoration:underline 1px;text-decoration-color:var(--ani-rule);text-underline-offset:3px}.code-block{border:1px solid var(--ani-rule-faint);border-radius:var(--ani-r-box);background:var(--ani-well);max-width:792px;color:var(--ani-text);font-family:var(--ani-font-mono);white-space:pre;margin-top:32px;padding:16px 20px;font-size:14px;line-height:26px;overflow-x:auto}.code-block .c-d{color:var(--ani-dim)}.code-block .c-n{color:#e8bf8c}[data-theme=light] .code-block .c-n{color:#7a4309}@media (width<=899px){.code-block{margin-top:20px;padding:14px 16px;font-size:13px;line-height:22px}}.sect-actions{margin-top:28px}@media (width<=899px){.sect-actions{margin-top:20px}}.l-footer{margin-top:120px;margin-inline:var(--gutter);border-top:1px solid var(--ani-rule-faint);grid-template-columns:minmax(0,344fr) minmax(0,608fr) auto;align-items:end;column-gap:24px;padding:40px 0 56px;display:grid}.footer-mascot{align-items:flex-end;gap:20px;display:flex}.footer-nagare{flex-shrink:0}.footer-mascot p{color:var(--ani-dim);margin-bottom:6px;font-size:13px;line-height:18px}.footer-legal{flex-direction:column;gap:6px;padding-bottom:6px;font-size:15px;line-height:22px;display:flex}.footer-licence{color:var(--ani-dim);font-size:13px;line-height:18px}.l-footer nav{gap:28px;display:flex}@media (width<=899px){.l-footer{flex-direction:column;align-items:stretch;gap:20px;margin-top:72px;padding:32px 0 40px;display:flex}.footer-mascot{gap:16px}.footer-nagare{width:80px;height:128px}.footer-mascot p{margin-bottom:4px}.footer-legal{padding-bottom:0}.l-footer nav{flex-wrap:wrap;gap:0 24px}}.ambient{pointer-events:none;z-index:0;position:absolute;inset:0;overflow:hidden}.amb{font-family:var(--ani-font-mono);color:var(--ani-text);user-select:none;will-change:transform;line-height:1;position:absolute}@media (prefers-reduced-motion:reduce){.ambient{display:none}.term .c-k,.term .cursor{animation:none}}body.landing>.lang-suggest{z-index:40;border:1px solid var(--ani-rule-faint);background:var(--ani-raised);max-width:640px;color:var(--ani-text);border-radius:12px;flex-wrap:wrap;align-items:center;gap:8px 16px;margin-inline:auto;padding:10px 12px 10px 20px;display:flex;position:fixed;inset:auto 16px 16px;box-shadow:0 8px 24px #00000040}body.landing>.lang-suggest[hidden]{display:none}.lang-suggest p{flex:200px;margin:0;font-size:15px;line-height:24px}.lang-suggest button{width:44px;height:44px;color:var(--ani-dim);cursor:pointer;background:0 0;border:0;border-radius:22px;place-items:center;display:grid}.lang-suggest button:hover{color:var(--ani-text)}.l-lang{position:relative}.l-lang summary{cursor:pointer;align-items:center;gap:6px;height:44px;padding:0 3px;font-size:15px;font-weight:500;list-style:none;display:flex}.l-lang summary::-webkit-details-marker{display:none}.l-lang ul{z-index:30;border:1px solid var(--ani-rule-faint);background:var(--ani-ground);min-width:160px;color:var(--ani-text);border-radius:12px;margin:0;padding:6px;list-style:none;position:absolute;inset:44px 0 auto auto;box-shadow:0 8px 24px #00000040}.l-lang li a{border-radius:8px;align-items:center;min-height:40px;padding:0 12px;font-size:15px;text-decoration:none;display:flex}.l-lang li a:hover{background:var(--ani-raised)}.l-lang li a[aria-current=true]{color:var(--ani-obi);font-weight:600}@media (width<=599px){.l-lang-name,.l-nav:has(.l-lang) .l-brand span{display:none}.l-nav:has(.l-lang) .l-nav-links{gap:10px}}
