:root{--ink:#0f2420;--paper:#ffffff;--teal:#12866f;--amber:#ffc23d;--tint:#e7f3ef;--r:18px;--fd:"Red Hat Display",system-ui,sans-serif;--ft:"Red Hat Text",system-ui,sans-serif;color-scheme:light}*{box-sizing:border-box}html{scroll-behavior:smooth;scrollbar-color:var(--teal) var(--tint);overflow-x:clip}body{margin:0;background:var(--paper);color:var(--ink);font:400 1rem/1.6 var(--ft);text-align:center;caret-color:var(--teal);overflow-x:clip}::selection{background:var(--amber);color:var(--ink)}h1,h2{font-family:var(--fd);font-weight:800;text-wrap:balance;margin:0}h1{font-size:clamp(1.75rem,1.1rem + 3vw,2.75rem);line-height:1.1;letter-spacing:-0.02em}h2{font-size:1.2rem;line-height:1.3}p{text-wrap:pretty;margin:0}a{color:inherit}a:focus-visible,[role="slider"]:focus-visible,summary:focus-visible{outline:3px solid var(--teal);outline-offset:3px;border-radius:8px}.sq{border-radius:var(--r)}@supports (corner-shape: squircle){.sq{corner-shape:squircle;border-radius:calc(var(--r) * 1.6)}}.wrap{width:min(100% - 32px,1120px);margin-inline:auto}.hero{position:relative;overflow:hidden;background:var(--tint);padding:max(16px,env(safe-area-inset-top)) 0 32px}.hero > *{position:relative;z-index:1}.hero-in{display:grid;gap:24px;align-items:center}.logo{display:block;margin:0 auto 10px;width:64px;height:64px;border-radius:14px}.lead{max-width:34em;margin:10px auto 16px}.path{list-style:none;margin:0 auto;padding:0;max-width:420px;display:grid;justify-items:center}.q{display:flex;gap:12px;align-items:flex-start;text-align:left;background:var(--paper);border:2px solid var(--ink);padding:10px 14px;width:100%}.num{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--teal);color:var(--paper);font-weight:700;line-height:1}.q b{display:block;font-weight:700;line-height:1.35}.q .no{line-height:1.4}.yes{display:flex;align-items:center;gap:6px;height:34px;font-weight:700}.yes svg{width:16px;height:30px}.start-btn{display:inline-flex;align-items:center;justify-content:center;min-width:240px;min-height:56px;padding:0 28px;background:var(--amber);color:var(--ink);border:3px solid var(--ink);font:700 1.2rem/1.1 var(--ft);text-decoration:none;transition:transform .14s cubic-bezier(.16,1,.3,1)}.start-btn:active{transform:scale(.96)}@media (hover: hover){.start-btn:hover{background:#ffd062}}.under{margin-top:10px}.fig{margin:0 auto;width:min(100%,380px)}.fig svg,.stage svg{display:block;width:100%;height:auto}.t{font:700 16px var(--ft);fill:var(--ink);text-anchor:middle}.tw{fill:var(--paper);font-size:14px}.scene .ph,.scene .ipa,.scene .cab,.scene .app,.scene .lab-app,.scene .lab-ipa{transition:transform .6s cubic-bezier(.16,1,.3,1),opacity .4s ease-out;transform-box:fill-box;transform-origin:center}.scene[data-step="1"] .ph{transform:translate(24px,-8px);opacity:.45}.scene[data-step="1"] .cab,.scene[data-step="1"] .app,.scene[data-step="1"] .lab-app,.scene[data-step="2"] .app,.scene[data-step="2"] .lab-app{opacity:0}.scene[data-step="1"] .app,.scene[data-step="2"] .app{transform:scale(.3)}.scene[data-step="2"] .ipa{transform:translate(120px,64px)}.scene[data-step="2"] .lab-ipa,.scene[data-step="3"] .lab-ipa{opacity:0}.scene[data-step="3"] .ipa{transform:translate(212px,100px) scale(.4);opacity:0}section{padding:var(--pad) 0}.toc{--pad:3rem}.toc .box{max-width:560px;margin:0 auto;border:1px solid rgba(15,36,32,.2);padding:20px}.toc ol{list-style:none;margin:12px 0 0;padding:0}.toc li + li{border-top:1px solid rgba(15,36,32,.14)}.toc a{display:flex;justify-content:center;gap:10px;align-items:center;min-height:48px;font-weight:700;text-decoration:none}.toc a .num{width:24px;height:24px}.toc p{margin-top:8px}.how{--pad:3.5rem;background:var(--ink);color:var(--paper)}.how-grid{display:grid;gap:0}.stage{position:sticky;top:60px;z-index:2;background:var(--paper);padding:12px;margin:16px auto 0;width:min(100%,420px)}.stage svg{max-height:32dvh}.steps{list-style:none;margin:0;padding:0}.step{min-height:70dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:24px 8px;opacity:.5;transition:opacity .4s ease-out}.step.on{opacity:1}.step p{font-size:1.2rem;line-height:1.4;max-width:22em}.how .num{width:36px;height:36px}.inside{--pad:4rem}.bento{display:grid;gap:16px;margin-top:20px}.tile{background:var(--tint);padding:20px}.tile.list{background:var(--paper);border:1px solid rgba(15,36,32,.2);text-align:left}.rows{list-style:none;margin:0;padding:0}.rows li{display:flex;gap:12px;align-items:center;padding:12px 0}.rows li + li{border-top:1px solid rgba(15,36,32,.14)}.rows b{display:block}#ex{--s:1}#ex .part{transform:translate(calc((1 - var(--s)) * var(--dx)),calc((1 - var(--s)) * var(--dy)))}#ex .lead-l{opacity:var(--s)}#ex.anim .part{transition:transform .25s cubic-bezier(.16,1,.3,1)}.slide{margin:16px auto 0;max-width:320px}.track{position:relative;height:44px;touch-action:none;cursor:pointer}.track::before{content:"";position:absolute;left:0;right:0;top:19px;height:6px;border-radius:3px;background:var(--paper);border:1px solid rgba(15,36,32,.3)}.knob{--k:1;position:absolute;top:0;left:calc(var(--k) * (100% - 44px));width:44px;height:44px;border-radius:50%;background:var(--amber);border:3px solid var(--ink);cursor:grab}.knob:active{cursor:grabbing;transform:scale(.94)}.faq{--pad:4.5rem;background:var(--ink);color:var(--paper)}.faq .list{max-width:680px;margin:20px auto 0;text-align:left}.faq details{border-top:1px solid rgba(255,255,255,.22)}.faq details:last-child{border-bottom:1px solid rgba(255,255,255,.22)}.faq summary{cursor:pointer;min-height:52px;display:flex;align-items:center;font-weight:700;padding:12px 0;list-style:none}.faq summary::-webkit-details-marker{display:none}.faq summary::after{content:"";margin-left:auto;flex:none;width:12px;height:12px;border-right:2px solid var(--paper);border-bottom:2px solid var(--paper);transform:rotate(45deg);transition:transform .2s ease-out}.faq details[open] summary::after{transform:rotate(-135deg)}.faq details p{padding:0 0 16px;color:#d9e7e3}.close{--pad:5rem;background:var(--tint)}.close .logo{width:96px;height:96px;margin-bottom:16px;border-radius:22px}.close h2{margin-bottom:20px}footer{background:var(--ink);color:var(--paper);padding:3rem 0 calc(96px + env(safe-area-inset-bottom))}.metro{list-style:none;margin:0 auto;padding:0;display:grid;max-width:220px;position:relative;text-align:left}.metro::before{content:"";position:absolute;left:21px;top:22px;bottom:22px;width:6px;border-radius:3px;background:var(--teal)}.metro a{position:relative;display:flex;align-items:center;gap:14px;min-height:44px;text-decoration:none;font-weight:700}.metro a::before{content:"";flex:none;width:20px;height:20px;margin-left:14px;border-radius:50%;background:var(--paper);border:4px solid var(--teal)}.fold{max-width:560px;margin:28px auto 0;border-top:1px solid rgba(255,255,255,.22);border-bottom:1px solid rgba(255,255,255,.22)}.fold summary{cursor:pointer;min-height:48px;display:flex;align-items:center;justify-content:center;font-weight:700}.fold ul{list-style:none;margin:0;padding:0 0 12px}.fold li{padding:6px 0}.fold a{display:inline-flex;min-height:44px;align-items:center}.small{margin-top:24px;color:#d9e7e3}.srctab{position:fixed;top:max(8px,env(safe-area-inset-top));right:max(8px,env(safe-area-inset-right));z-index:6;display:flex;align-items:center;min-height:44px;padding:0 14px;background:var(--paper);border:1px solid rgba(15,36,32,.3);border-radius:12px;text-decoration:none;font-weight:700;color:var(--ink)}.bar{position:fixed;left:0;right:0;bottom:0;z-index:5;background:var(--paper);border-top:1px solid rgba(15,36,32,.2);padding:10px 16px calc(10px + env(safe-area-inset-bottom));transform:translateY(110%);transition:transform .35s cubic-bezier(.16,1,.3,1)}.bar{visibility:hidden}.bar.show{transform:none;visibility:visible}.bar .start-btn{min-height:48px;width:min(100%,360px)}@media (min-width: 900px){.logo{width:96px;height:96px;border-radius:20px}.hero{padding:40px 0 56px}.hero-in{grid-template-columns:1.1fr .9fr;gap:40px}.fig{width:min(100%,400px)}.how-grid{grid-template-columns:1fr 1fr;gap:48px;align-items:start}.stage{top:calc(50dvh - 190px);margin-top:0}.stage svg{max-height:none}.bento{grid-template-columns:1.6fr 1fr;align-items:stretch}.metro{max-width:760px;grid-template-columns:repeat(5,1fr);text-align:center}.metro::before{left:10%;right:10%;top:19px;bottom:auto;width:auto;height:6px}.metro a{flex-direction:column;gap:6px;min-height:auto}.metro a::before{margin-left:0}}@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none !important;animation:none !important}}@font-face{font-family: 'Red Hat Display';font-style: normal;font-weight: 800;font-display: swap;src: url(../media/redhatdisplay.72160e16.woff2) format('woff2');unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;}@font-face{font-family: 'Red Hat Display';font-style: normal;font-weight: 800;font-display: swap;src: url(../media/redhatdisplay.50fba68e.woff2) format('woff2');unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}@font-face{font-family: 'Red Hat Text';font-style: normal;font-weight: 400;font-display: swap;src: url(../media/redhattext.92d5ab79.woff2) format('woff2');unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;}@font-face{font-family: 'Red Hat Text';font-style: normal;font-weight: 400;font-display: swap;src: url(../media/redhattext.c0e0ce0a.woff2) format('woff2');unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}@font-face{font-family: 'Red Hat Text';font-style: normal;font-weight: 700;font-display: swap;src: url(../media/redhattext.92d5ab79.woff2) format('woff2');unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;}@font-face{font-family: 'Red Hat Text';font-style: normal;font-weight: 700;font-display: swap;src: url(../media/redhattext.c0e0ce0a.woff2) format('woff2');unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}