.ability-film{opacity:1}
.ability-film:after{background:linear-gradient(90deg,rgba(244,247,241,.32),rgba(244,247,241,.08) 32%,transparent 68%,rgba(244,247,241,.14)),linear-gradient(0deg,rgba(244,247,241,.32),transparent 22%,rgba(244,247,241,.12))}
.hero>.kicker{background:rgba(249,251,246,.56);border-color:rgba(17,24,17,.08);box-shadow:none;backdrop-filter:blur(6px);font-weight:700}
.hero h1{font-size:clamp(64px,9vw,144px);font-weight:800;color:rgba(17,24,17,.84);letter-spacing:-.055em;text-shadow:0 1px 3px rgba(255,255,255,.58)}
.hero h1 span:nth-child(2){color:rgba(54,91,15,.82);text-shadow:0 1px 3px rgba(255,255,255,.58)}
.hero-copy{background:rgba(249,251,246,.56);border-color:rgba(17,24,17,.08);box-shadow:none;backdrop-filter:blur(6px);font-size:14px;font-weight:500}
.facts{background:linear-gradient(90deg,rgba(249,251,246,.42),transparent);backdrop-filter:blur(3px)}
.flow-layout{grid-template-columns:.72fr 1.28fr;gap:5vw}
.flow-orb{--step-color:#c7f34a;position:relative;aspect-ratio:16/11;display:block;overflow:hidden;border-radius:30px;background:#fff;box-shadow:0 30px 80px rgba(42,52,38,.14);text-align:left}
.flow-orb>img{width:100%;height:100%;display:block;object-fit:cover}
.flow-caption{position:absolute;left:18px;right:18px;bottom:18px;padding:16px 18px;display:grid;grid-template-columns:auto 1fr;gap:3px 14px;align-items:center;border:1px solid rgba(255,255,255,.72);border-radius:18px;background:rgba(250,251,247,.91);color:#111811;backdrop-filter:blur(16px);box-shadow:0 12px 34px rgba(23,31,21,.13)}
.flow-caption>span{grid-row:1/3;align-self:start;padding:6px 8px;border-radius:8px;background:var(--step-color);font-size:12px;font-weight:900}
.flow-caption strong{margin:0;font-size:22px;line-height:1.1;text-transform:none}
.flow-caption p{max-width:62ch;margin:5px 0 0;font-size:12px;line-height:1.55;color:#4b554a}
.flow-caption:after{content:"";position:absolute;left:18px;right:18px;bottom:7px;height:2px;border-radius:999px;background:linear-gradient(90deg,var(--step-color) 50%,rgba(17,24,17,.12) 50%);background-size:200% 100%;background-position:100% 0}.flow-orb.cycling .flow-caption:after{animation:step-progress 4.8s linear forwards}.flow-orb>img{transition:opacity .18s;will-change:transform,opacity,clip-path}@keyframes step-progress{to{background-position:0 0}}
@media(max-width:820px){.flow-layout{grid-template-columns:1fr}.flow-orb{margin-top:28px;aspect-ratio:4/3;border-radius:22px}.flow-caption{left:10px;right:10px;bottom:10px;padding:12px}.flow-caption strong{font-size:18px}.flow-caption p{font-size:11px}}
@media(prefers-reduced-motion:reduce){.flow-orb.cycling .flow-caption:after{animation:none}.flow-orb>img{transition:none}}
.flow-layout:has(li:nth-child(1) button.active) .flow-orb>img{content:url("./assets/steps/step-01.webp?v=2")}.flow-layout:has(li:nth-child(2) button.active) .flow-orb>img{content:url("./assets/steps/step-02.webp?v=2")}.flow-layout:has(li:nth-child(3) button.active) .flow-orb>img{content:url("./assets/steps/step-03.webp?v=2")}.flow-layout:has(li:nth-child(4) button.active) .flow-orb>img{content:url("./assets/steps/step-04.webp?v=2")}.flow-layout:has(li:nth-child(5) button.active) .flow-orb>img{content:url("./assets/steps/step-05.webp?v=2")}.flow-layout:has(li:nth-child(6) button.active) .flow-orb>img{content:url("./assets/steps/step-06.webp?v=2")}
.flow{position:relative;isolation:isolate;overflow:hidden;background:#0d110e;color:#edf4e9}.flow:before{content:"";position:absolute;z-index:-2;inset:-25%;background:radial-gradient(circle at 18% 34%,rgba(171,244,42,.16),transparent 26%),radial-gradient(circle at 82% 58%,rgba(20,183,177,.13),transparent 29%),radial-gradient(circle at 58% 8%,rgba(93,129,255,.09),transparent 23%);animation:flow-aurora 16s ease-in-out infinite alternate}.flow:after{content:"";position:absolute;z-index:-1;inset:0;background-image:linear-gradient(rgba(202,255,82,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(202,255,82,.035) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(to bottom,transparent,black 22%,black 82%,transparent);animation:flow-grid 22s linear infinite}.flow>.kicker{color:#baf044}.flow>h2{max-width:12ch;color:#f2f6ee;font-size:clamp(58px,7.2vw,112px);font-weight:820;line-height:.88;text-shadow:none}.flow-layout{position:relative;z-index:1;margin-top:78px;grid-template-columns:.78fr 1.22fr;align-items:center}.flow-layout ol{padding:10px 18px;border:1px solid rgba(202,255,82,.09);border-radius:24px;background:rgba(14,20,15,.58);backdrop-filter:blur(10px)}.flow-layout button{min-height:104px;height:auto;padding:16px 8px;grid-template-columns:48px 1fr;grid-template-rows:auto auto;align-content:center;border-bottom-color:rgba(222,239,218,.13);color:#778177}.flow-layout button>span{color:#abb4a8;font-size:19px;font-weight:750;text-transform:none;transition:color .2s}.flow-layout button:after{content:attr(data-copy);grid-column:2;max-width:44ch;margin-top:7px;color:#6f7a6d;font-size:11px;font-weight:500;line-height:1.55;transition:color .2s}.flow-layout button.active{color:#c8f54d}.flow-layout button.active>span{color:#f1f6ed}.flow-layout button.active:after{color:#b8c4b5}.flow-layout button:hover>span{color:#e0e8dc}.flow-orb{border:1px solid rgba(202,255,82,.2);background:#111612;box-shadow:0 34px 100px rgba(0,0,0,.4),0 0 80px rgba(171,244,42,.06)}.flow-caption{border-color:rgba(202,255,82,.14);background:rgba(13,18,14,.88);color:#f1f6ed;box-shadow:0 15px 36px rgba(0,0,0,.28)}.flow-caption p{color:#aeb9ab}.flow-caption:after{background:linear-gradient(90deg,var(--step-color) 50%,rgba(255,255,255,.12) 50%);background-size:200% 100%;background-position:100% 0}@keyframes flow-aurora{to{transform:translate3d(4%,-3%,0) scale(1.08) rotate(2deg)}}@keyframes flow-grid{to{background-position:42px 42px}}
@media(max-width:820px){.flow-layout{grid-template-columns:1fr;margin-top:48px}.flow-layout ol{padding-inline:12px}.flow-layout button{min-height:92px}.flow-layout button:after{font-size:10px}.flow-orb{margin-top:28px}}
@media(prefers-reduced-motion:reduce){.flow:before,.flow:after{animation:none}}
.flow-orb{aspect-ratio:auto;display:grid;grid-template-rows:auto auto}.flow-orb>img{width:100%;height:auto;aspect-ratio:1354/1058;object-fit:contain;background:#0d110e}.flow-caption{position:relative;left:auto;right:auto;bottom:auto;margin:0;border-width:1px 0 0;border-radius:0;padding:18px 22px 24px}.flow-caption:after{left:22px;right:22px;bottom:10px}.flow-layout:has(li:nth-child(1) button.active) .flow-orb>img{content:url("./assets/steps/step-01.webp?v=3")}.flow-layout:has(li:nth-child(2) button.active) .flow-orb>img{content:url("./assets/steps/step-02.webp?v=3")}.flow-layout:has(li:nth-child(3) button.active) .flow-orb>img{content:url("./assets/steps/step-03.webp?v=3")}.flow-layout:has(li:nth-child(4) button.active) .flow-orb>img{content:url("./assets/steps/step-04.webp?v=3")}.flow-layout:has(li:nth-child(5) button.active) .flow-orb>img{content:url("./assets/steps/step-05.webp?v=3")}.flow-layout:has(li:nth-child(6) button.active) .flow-orb>img{content:url("./assets/steps/step-06.webp?v=3")}@media(max-width:820px){.flow-orb{aspect-ratio:auto}.flow-caption{margin:0;left:auto;right:auto;bottom:auto;border-radius:0;padding:14px 16px 22px}}
.flow.section{padding-top:96px;padding-bottom:96px}.flow>h2{font-size:clamp(52px,6.2vw,94px)}.flow-layout{margin-top:48px;gap:4vw;align-items:start}.flow-layout ol{padding:6px 14px}.flow-layout button{min-height:78px;padding:10px 6px}.flow-layout button:after{margin-top:4px;line-height:1.4}.flow-orb>img{max-height:580px}.flow-caption{padding:13px 18px 19px}.flow-caption strong{font-size:20px}.flow-caption p{margin-top:3px;line-height:1.45}.flow-caption:after{left:18px;right:18px;bottom:7px}@media(max-width:1100px) and (min-width:821px){.flow-layout{grid-template-columns:.72fr 1.28fr}.flow-layout button{min-height:70px}.flow-layout button:after{display:none}.flow-orb>img{max-height:520px}}@media(max-width:820px){.flow.section{padding-top:76px;padding-bottom:76px}.flow-layout{margin-top:36px}.flow-layout button{min-height:82px}.flow-layout button:after{display:block}.flow-orb>img{max-height:none}.flow-caption{padding:12px 14px 19px}}
.download{display:grid;grid-template-columns:1.05fr .95fr;gap:7vw;align-items:end;background:#dff0ff;color:#111811}.download-state{display:inline-flex;padding:8px 11px;border-radius:999px;background:#111811;color:#f4f7f1;font-size:11px;font-weight:800;letter-spacing:.08em}.download h2{margin:26px 0 0;font-size:clamp(54px,7vw,108px);font-weight:850;line-height:.88;letter-spacing:-.06em}.download-copy>p{max-width:520px;margin:30px 0 0;color:#4c594c;font-size:15px;line-height:1.75}.download-options{display:grid;gap:12px}.download-options button{min-height:112px;padding:22px 24px;display:grid;grid-template-columns:1fr auto;gap:6px 18px;align-items:center;border:1px solid rgba(17,24,17,.13);border-radius:22px;background:rgba(255,255,255,.7);color:#111811;text-align:left;opacity:1;cursor:not-allowed}.download-options button span{font-size:24px;font-weight:850}.download-options button small{grid-column:1;color:#607060;font-size:12px}.download-options button b{grid-column:2;grid-row:1/3;padding:9px 12px;border-radius:999px;background:#c7f34a;font-size:11px}.site-footer{height:auto;min-height:260px;padding:55px 4vw;display:grid;grid-template-columns:1.4fr .8fr 1fr;gap:6vw;align-items:start;background:#111811;color:#dce4d9}.footer-brand p{margin:18px 0 0;color:#8f9b8d;font-size:12px}.footer-nav{display:grid;gap:12px}.footer-nav span{margin-bottom:6px;color:#748071;font-size:10px;letter-spacing:.12em}.footer-nav a{font-size:13px}.footer-meta{display:grid;gap:12px;color:#8f9b8d;font-size:11px;line-height:1.5}
@media(max-width:820px){.download{grid-template-columns:1fr;align-items:start}.download-options{margin-top:20px}.site-footer{grid-template-columns:1fr 1fr}.footer-meta{grid-column:1/-1;padding-top:28px;border-top:1px solid rgba(255,255,255,.1)}}
@media(max-width:520px){.download h2{font-size:15vw}.download-options button{grid-template-columns:1fr}.download-options button b{grid-column:1;grid-row:auto;justify-self:start}.site-footer{grid-template-columns:1fr}.footer-meta{grid-column:auto}}
.download-panel{display:grid;gap:14px}.download-options .download-card{width:100%;min-height:112px;padding:22px 24px;display:grid;grid-template-columns:1fr auto;gap:6px 18px;align-items:center;border:1px solid rgba(17,24,17,.13);border-radius:22px;background:rgba(255,255,255,.7);color:#111811;font:inherit;text-align:left;opacity:1;box-shadow:none;appearance:none;-webkit-appearance:none}.download-options .download-card span{font-size:24px;font-weight:850}.download-options .download-card small{grid-column:1;color:#607060;font-size:12px}.download-options .download-card b{grid-column:2;grid-row:1/3;padding:9px 12px;border-radius:999px;background:#c7f34a;font-size:11px}.download-card--pending{cursor:not-allowed}.download-options .download-card--pending:disabled{color:#111811}.download-options .download-card--available{cursor:pointer;text-decoration:none;transition:transform .2s ease,border-color .2s ease,background .2s ease,box-shadow .2s ease}.download-options .download-card--available:hover{transform:translateY(-3px);border-color:rgba(80,117,24,.55);background:#fff;box-shadow:0 20px 42px rgba(52,76,37,.16)}.download-options .download-card--available:focus-visible{outline:3px solid #527918;outline-offset:4px}.download-options .download-card--available:active{transform:translateY(-1px)}.download-notice{padding:15px 17px;border:1px solid rgba(17,24,17,.12);border-radius:16px;background:rgba(255,255,255,.48);color:#41503f}.download-notice strong{display:block;color:#1a2519;font-size:12px}.download-notice p{margin:6px 0 0;font-size:11px;line-height:1.65}@media(max-width:820px){.download-panel{margin-top:20px}}@media(max-width:520px){.download-options .download-card{grid-template-columns:1fr}.download-options .download-card b{grid-column:1;grid-row:auto;justify-self:start}}
header{position:fixed;top:14px;left:2vw;right:2vw;height:62px;padding:7px 9px 7px 12px;border:1px solid rgba(255,255,255,.46);border-radius:18px;background:rgba(248,250,245,.78);color:#111811;backdrop-filter:blur(18px) saturate(1.2);box-shadow:0 8px 30px rgba(22,31,20,.09);transition:background .25s,box-shadow .25s,transform .25s}
header.header-scrolled{background:rgba(248,250,245,.94);box-shadow:0 12px 38px rgba(22,31,20,.13)}
header .logo img{width:38px;height:38px}header .logo b{font-size:16px}
header nav{gap:5px}header nav a{position:relative;padding:12px 15px;border-radius:12px;color:#354034;font-size:13px;font-weight:700;letter-spacing:.01em;text-transform:none;transition:background .2s,color .2s,transform .2s}header nav a:hover{background:rgba(17,24,17,.07);color:#111811}header nav a:focus-visible{outline:2px solid #6e9821;outline-offset:2px}header nav a.active{background:#c7f34a;color:#17200e}header nav a:active{transform:scale(.97)}
#flow,#abilities,#studio,#download{scroll-margin-top:96px}
@media(max-width:820px){header{left:12px;right:12px;top:10px}.menu{position:relative;z-index:2;width:44px;height:44px;padding:8px;border-radius:12px;background:rgba(17,24,17,.07)}.menu i{margin:5px auto;background:#111811;transition:transform .2s}.menu-open .menu i:first-child{transform:translateY(3.5px) rotate(45deg)}.menu-open .menu i:last-child{transform:translateY(-3.5px) rotate(-45deg)}header nav{position:absolute;top:70px;left:0;right:0;padding:8px;display:grid;gap:4px;border:1px solid rgba(17,24,17,.1);border-radius:16px;background:rgba(248,250,245,.97);box-shadow:0 16px 42px rgba(22,31,20,.14);opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .2s,visibility .2s,transform .2s}.menu-open nav{opacity:1;visibility:visible;transform:none}header nav a{padding:14px 16px}}
.flow.section{padding-top:68px;padding-bottom:68px}.flow-layout{margin-top:34px}@media(max-width:820px){.flow.section{padding-top:56px;padding-bottom:56px}.flow-layout{margin-top:28px}}
.flow.section{padding-top:48px;padding-bottom:48px}.flow-title span{display:block;animation:flow-title-wave 5.2s ease-in-out infinite;will-change:transform}.flow-title span+span{animation-delay:-2.6s}.flow-layout{margin-top:26px}@keyframes flow-title-wave{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-7px,0)}}@media(max-width:820px){.flow.section{padding-top:42px;padding-bottom:42px}.flow-layout{margin-top:22px}}@media(prefers-reduced-motion:reduce){.flow-title span{animation:none}}
