/* stableaudio.top - Chladni plates: frosted glass plates over a resonating sand figure */
:root{
  --bg:#07100c;--bg2:#0b1712;--ink:#eaf2ec;--mut:#a9bbb0;--dim:#8ea295;
  --grn:#4fe3a1;--grn2:#8df2c3;--sand:#e9e2cf;--on:#04130c;
  --glass:rgba(176,255,220,.055);--glass2:rgba(176,255,220,.09);--line:rgba(200,255,230,.14);--line2:rgba(200,255,230,.24);
  --r:14px;--col:680px;
  --disp:"Funnel Display","Funnel Sans",system-ui,sans-serif;--body:"Funnel Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"Fira Code",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.65 var(--body);overflow-x:hidden;min-height:100vh;position:relative}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(520px 420px at 50% 16%,rgba(79,227,161,.20),transparent 70%),
    radial-gradient(620px 520px at 12% 78%,rgba(40,170,130,.13),transparent 70%),
    radial-gradient(560px 480px at 90% 58%,rgba(233,226,207,.07),transparent 70%),
    url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 500 500'><path d='M14 7h0m321 0h0m-323 1h0m1 2h0m315 0h0m30 0h0m-88 1h0m2 0h0m-261 1h0m322 0h0m22 0h0m-346 1h0m1 0h0m264 0h0m54 0h0m1 0h0m-312 1h0m2 1h0m304 1h0m126 0h0m-442 1h0m87 0h0m237 0h0m35 0h0m-270 1h0m235 0h0m1 0h0m-321 1h0m357 0h0m-271 4h0m268 3h0m5 0h0m-187 1h0m193 0h0m1 0h0m73 0h0m-425 2h0m75 0h0m226 0h0m50 0h0m-193 1h0m271 0h0m-1 2h0m-270 1h0m272 0h0m-195 1h0m-154 1h0m73 1h0m143 0h0m-284 2h0m284 0h0m-69 1h0m203 0h0m-415 1h0m65 0h0m77 0h0m138 2h0m-208 1h0m206 0h0m-139 2h0m134 0h0m2 0h0m81 0h0m-157 1h0m-194 1h0m2 0h0m190 0h0m79 0h0m157 0h0m-424 2h0m116 0h0m8 0h0m2 0h0m142 0h0m81 0h0m-264 1h0m26 0h0m13 0h0m-7 1h0m6 0h0m317 0h0m-439 1h0m91 0h0m9 0h0m17 0h0m2 0h0m13 0h0m134 0h0m-264 1h0m106 0h0m5 0h0m3 0h0m4 0h0m3 0h0m-16 1h0m55 0h0m101 0h0m-157 1h0m44 0h0m11 0h0m-7 1h0m-6 1h0m1 0h0m4 1h0m-14 1h0m3 0h0m1 0h0m122 0h0m107 0h0m-367 1h0m-2 1h0m10 0h0m0 2h0m247 0h0m-121 1h0m3 0h0m-126 1h0m123 0h0m116 0h0m125 0h0m0 1h0m-241 4h0m248 1h0m1 0h0m-123 1h0m122 0h0m-357 5h0m-5 1h0m110 1h0m-103 2h0m105 0h0m-3 1h0m119 0h0m137 0h0m-149 1h0m-109 2h0m102 0h0m-100 1h0m102 2h0m5 0h0m-7 1h0m-196 1h0m237 0h0m18 1h0m104 0h0m-93 1h0m-81 1h0m1 0h0m80 0h0m-172 2h0m142 0h0m5 0h0m24 0h0m13 0h0m-342 1h0m68 0h0m274 0h0m-187 1h0m-161 1h0m8 0h0m72 0h0m164 0h0m62 0h0m38 0h0m5 0h0m-335 2h0m226 1h0m3 0h0m65 0h0m126 0h0m-421 1h0m226 2h0m63 1h0m60 0h0m-278 1h0m3 0h0m148 1h0m-2 1h0m206 0h0m-277 1h0m208 0h0m0 1h0m-349 1h0m7 1h0m202 0h0m211 0h0m-344 1h0m204 0h0m143 1h0m-70 2h0m-347 1h0m198 0h0m-127 2h0m201 0h0m149 0h0m-148 1h0m-143 1h0m4 0h0m289 0h0m-292 1h0m221 1h0m-272 1h0m49 0h0m-49 1h0m107 0h0m239 0h0m-297 3h0m143 0h0m154 0h0m-301 1h0m146 0h0m86 0h0m-226 1h0m301 0h0m2 1h0m-249 1h0m-96 1h0m346 1h0m1 0h0m-347 1h0m2 0h0m30 0h0m148 0h0m164 0h0m-428 3h0m91 0h0m22 0h0m-114 1h0m178 0h0m177 0h0m-259 1h0m82 0h0m0 1h0m-2 1h0m265 0h0m-320 1h0m56 1h0m179 0h0m-260 1h0m5 1h0m14 0h0m-18 1h0m2 0h0m78 0h0m-57 1h0m235 0h0m81 0h0m-334 1h0m72 3h0m-81 1h0m4 0h0m4 0h0m18 0h0m146 0h0m-153 1h0m9 0h0m-25 1h0m3 0h0m5 0h0m0 1h0m163 0h0m-169 1h0m22 1h0m-14 1h0m-11 1h0m2 1h0m5 0h0m5 0h0m70 0h0m-74 2h0m71 0h0m92 0h0m88 0h0m-253 1h0m342 0h0m-440 1h0m96 0h0m9 0h0m2 0h0m4 0h0m319 0h0m10 0h0m-443 1h0m93 0h0m339 0h0m-317 1h0m14 0h0m137 0h0m-178 1h0m88 0h0m89 0h0m92 0h0m-256 1h0m3 0h0m70 0h0m-75 1h0m84 0h0m170 0h0m-235 1h0m149 0h0m-86 1h0m175 0h0m65 0h0m14 0h0m1 0h0m-438 1h0m1 0h0m81 0h0m10 0h0m3 0h0m170 0h0m163 0h0m-301 1h0m67 0h0m237 0h0m-297 1h0m52 0h0m169 0h0m89 0h0m-365 1h0m34 0h0m82 0h0m218 0h0m13 0h0m-432 1h0m357 0h0m-347 1h0m5 0h0m42 0h0m25 0h0m50 0h0m298 0h0m-431 1h0m122 0h0m82 0h0m9 0h0m63 0h0m69 0h0m4 0h0m3 0h0m3 0h0m67 0h0m-283 1h0m6 0h0m127 0h0m7 0h0m1 0h0m65 0h0m7 0h0m-216 1h0m1 0h0m22 0h0m113 0h0m-286 1h0m11 0h0m61 0h0m9 0h0m56 0h0m30 0h0m64 0h0m2 0h0m2 0h0m49 0h0m2 0h0m66 0h0m5 0h0m75 0h0m1 0h0m1 0h0m-445 1h0m8 0h0m11 0h0m7 0h0m142 0h0m86 0h0m3 0h0m1 0h0m18 0h0m29 0h0m5 0h0m6 0h0m62 0h0m-384 1h0m9 0h0m27 0h0m43 0h0m190 0h0m6 0h0m65 0h0m3 0h0m97 0h0m3 0h0m-405 1h0m55 0h0m172 0h0m22 0h0m27 0h0m113 0h0m-371 1h0m134 0h0m112 0h0m110 0h0m7 0h0m15 0h0m-367 1h0m109 0h0m-125 1h0m120 0h0m2 0h0m3 0h0m121 0h0m12 0h0m-251 1h0m2 0h0m230 0h0m122 0h0m14 0h0m2 0h0m-251 1h0m243 0h0m2 0h0m-248 1h0m8 0h0m1 0h0m236 0h0m-116 1h0m-106 1h0m-26 1h0m2 0h0m12 1h0m4 0h0m-142 1h0m0 1h0m1 2h0m143 0h0m222 1h0m-222 1h0m-2 1h0m1 0h0m-142 1h0m362 1h0m-4 1h0m-358 1h0m151 0h0m-3 1h0m1 0h0m3 0h0m204 0h0m-358 1h0m154 0h0m1 1h0m203 1h0m-204 1h0m5 1h0m196 0h0m-2 1h0m-193 3h0m-163 1h0m162 0h0m-3 1h0m-159 1h0m167 0h0m96 2h0m-165 1h0m76 0h0m-76 1h0m-11 1h0m-90 1h0m106 0h0m8 1h0m7 0h0m312 0h0m8 0h0m1 0h0m-266 1h0m-88 1h0m29 0h0m9 0h0m-20 1h0m13 0h0m58 0h0m260 0h0m2 0h0m-321 1h0m66 0h0m81 1h0m-267 1h0m128 0h0m140 1h0m162 0h0m2 0h0m-162 1h0m-192 1h0m3 0h0m-5 1h0m53 4h0m291 0h0m-150 2h0m78 0h0m66 2h0m-347 2h0m277 0h0m-146 1h0m4 1h0m-208 1h0m277 0h0m71 0h0m-280 1h0m141 0h0m137 0h0m1 0h0m-278 1h0m347 0h0m-71 1h0m-2 1h0m75 0h0m-278 1h0m-79 7h0m225 2h0m48 0h0m1 0h0m-279 2h0m229 0h0m-304 1h0m2 0h0m240 0h0m59 0h0m50 1h0m77 0h0m-423 1h0m68 0h0m230 0h0m3 0h0m41 0h0m-42 1h0m-235 1h0m2 1h0m88 0h0m178 0h0m-89 1h0m63 1h0m-151 2h0m-92 1h0m239 0h0m22 0h0m5 0h0m-21 1h0m12 1h0m-257 1h0m185 0h0m73 0h0m-71 1h0m-1 1h0m1 0h0m3 0h0m1 1h0m-196 2h0m96 1h0m-100 3h0m6 0h0m96 2h0m110 1h0m149 0h0m-153 2h0m-2 1h0m-203 1h0m1 0h0m205 0h0m153 1h0m-149 1h0m-216 1h0m2 1h0m105 0h0m255 0h0m-363 1h0m221 0h0m-215 1h0m-4 1h0m-1 1h0m212 0h0m13 0h0m133 0h0m-250 1h0m112 0h0m139 1h0m5 0h0m-254 1h0m117 3h0m6 0h0m116 0h0m3 0h0m-370 1h0m126 0h0m244 0h0m-368 1h0m116 0h0m122 0h0m125 0h0m-356 1h0m355 0h0m-347 1h0m6 0h0m348 0h0m-379 1h0m119 0h0m5 0h0m13 0h0m9 0h0m1 0h0m10 0h0m200 0h0m17 0h0m-384 1h0m3 0h0m10 0h0m83 0h0m20 0h0m10 0h0m26 0h0m111 0h0m103 0h0m-261 1h0m7 0h0m25 0h0m2 0h0m128 0h0m95 0h0m1 0h0m4 0h0m3 0h0m57 0h0m-345 1h0m120 0h0m174 0h0m-288 1h0m277 0h0m-287 1h0m36 0h0m28 0h0m276 0h0m6 0h0m-287 1h0m278 0h0m-346 1h0m70 0h0m135 0h0m133 0h0m-404 1h0m61 0h0m71 0h0m78 0h0m62 0h0m137 0h0m-353 1h0m1 0h0m150 0h0m68 0h0m56 0h0m76 0h0m7 0h0m-273 1h0m-86 1h0m226 0h0m41 0h0m13 0h0m-287 1h0m239 0h0m117 0h0m-438 1h0m84 0h0m180 0h0m48 0h0m7 0h0m40 0h0m77 0h0m3 0h0m-440 1h0m10 0h0m157 0h0m141 0h0m-302 1h0m316 0h0m2 0h0m25 0h0m-346 1h0m166 0h0m3 0h0m92 0h0m50 0h0m13 0h0m18 0h0m1 0h0m92 0h0m-439 1h0m1 0h0m6 0h0m74 0h0m256 0h0m9 0h0m-264 2h0m263 0h0m1 0h0m-346 1h0m340 0h0m-80 1h0m1 0h0m-179 1h0m87 0h0m183 0h0m-88 1h0m70 0h0m-253 1h0m230 0h0m13 0h0m22 0h0m-345 1h0m173 0h0m167 0h0m5 0h0m-18 3h0m14 1h0m-3 1h0m-166 1h0m167 0h0m-165 1h0m167 0h0m-5 1h0m-6 1h0m13 0h0m-263 1h0m248 0h0m-247 2h0m91 0h0m164 0h0m7 0h0m-20 1h0m5 0h0m-65 1h0m57 0h0m13 0h0m1 0h0m7 0h0m96 0h0m-110 2h0m16 0h0m1 0h0m1 0h0m-26 1h0m7 1h0m14 0h0m6 1h0m-344 1h0m313 0h0m17 0h0m-15 1h0m10 0h0m12 0h0m99 0h0m-441 1h0m-2 1h0m9 0h0m256 0h0m-257 1h0m167 0h0m176 0h0m-261 1h0m173 0h0m62 1h0m26 0h0m9 0h0m-347 1h0m76 0h0m234 0h0m37 0h0m-35 2h0m-234 2h0m171 0h0m184 0h0m-83 2h0m-106 1h0m1 0h0m-240 1h0m346 0h0m-339 1h0m150 0h0m140 0h0m3 0h0m-143 2h0m-78 3h0m349 0h0m-352 1h0m-67 1h0m350 0h0m-63 1h0m133 0h0m-345 2h0m348 0h0m-138 1h0m67 0h0m71 0h0m1 0h0m-350 1h0m279 0h0m1 0h0m-346 2h0m348 0h0m-72 2h0m-205 1h0m-72 1h0m5 3h0m72 0h0m60 0h0m64 0h0m-123 1h0m123 0h0m-195 2h0m79 0h0m346 1h0m-300 1h0m230 0h0m-225 1h0m222 0h0m-229 1h0m-36 1h0m22 0h0m9 0h0m-115 1h0m91 0h0m23 0h0m8 0h0m321 0h0m-323 1h0m55 1h0m3 0h0m-77 1h0m342 0h0m-331 1h0m7 0h0m11 2h0m231 0h0m-97 1h0m99 0h0m-206 2h0m-153 1h0m152 0h0m-154 3h0m145 0h0m2 0h0m-145 2h0m149 0h0m-6 2h0m228 0h0m-233 1h0m231 0h0m-109 3h0m-127 1h0m7 0h0m-133 1h0m1 0h0m363 0h0m2 0h0m-238 2h0m-123 1h0m1 1h0m364 0h0m-118 1h0m128 0h0m-252 1h0m117 0h0m-119 1h0m4 0h0m120 0h0m125 1h0m-128 1h0m-2 1h0m4 1h0m-4 1h0m132 0h0m-355 1h0m-6 1h0m3 0h0m6 0h0m98 1h0m112 0h0m153 0h0m-264 1h0m124 0h0m-16 1h0m-8 1h0m11 0h0m-209 1h0m-73 1h0m169 0h0m154 0h0m5 0h0m-72 1h0m62 0h0m10 0h0m2 0h0m15 0h0m89 0h0m-131 1h0m21 0h0m3 0h0m-163 1h0m-152 1h0m295 0h0m3 0h0m46 0h0m-270 1h0m162 0h0m54 0h0m-137 1h0m79 0h0m7 0h0m188 0h0m-348 1h0m157 0h0m-224 1h0m142 0h0m2 1h0m276 0h0m-419 1h0m353 0h0m68 0h0m-424 1h0m213 1h0m135 0h0m7 1h0m-269 2h0m123 0h0m214 0h0m7 0h0m-72 1h0m-278 1h0m124 0h0m225 0h0m-292 2h0m146 0h0m79 0h0m66 0h0m-293 1h0m1 0h0m226 0h0m72 0h0m-344 1h0m47 0h0m2 0h0m63 0h0m-65 1h0m302 2h0m-4 2h0m5 0h0m-307 1h0m65 0h0m-107 1h0m3 1h0m353 0h0m-347 1h0m181 0h0m160 0h0m-309 1h0m1 0h0m1 0h0m59 0h0m253 0h0m-352 1h0m45 0h0m1 0h0m-44 1h0m40 0h0m57 0h0m-95 1h0m92 1h0m-177 1h0m85 0h0m38 0h0m-35 2h0m33 0h0m4 0h0m-39 1h0m182 0h0m-140 2h0m310 0h0m1 0h0m1 0h0m-350 1h0m91 0h0m85 0h0m3 0h0m166 0h0m-345 1h0m25 1h0m1 0h0m4 0h0m4 0h0m233 1h0m-265 1h0m85 0h0m267 0h0' fill='none' stroke='%23e9e2cf' stroke-opacity='.38' stroke-width='2.1' stroke-linecap='round'/></svg>") center 90px/min(980px,170vw) auto no-repeat,
    linear-gradient(180deg,#07100c,#0a1611 60%,#07100c);
}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 50% 40%,transparent 30%,rgba(4,10,7,.72) 100%)}
img,svg{max-width:100%}
a{color:var(--grn2);text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{color:#fff}
:focus-visible{outline:2px solid var(--grn);outline-offset:3px;border-radius:4px}
h1,h2,h3{font-family:var(--disp);line-height:1.12;margin:0;letter-spacing:-.015em;text-wrap:balance;overflow-wrap:anywhere}
p{margin:0 0 1em}
code,pre,kbd{font-family:var(--mono)}
.skip{position:absolute;left:12px;top:-80px;z-index:60;background:var(--grn);color:var(--on);padding:12px 16px;border-radius:8px;font-weight:600}
.skip:focus{top:12px}

/* figures: sand grains */
.fig{display:block;width:100%;height:auto;overflow:visible}
.fig path{fill:none;stroke:var(--sand);stroke-width:2.3;stroke-linecap:round}

/* plates */
.plate{position:relative;background:linear-gradient(160deg,var(--glass2),var(--glass) 42%,rgba(176,255,220,.03));border:1px solid var(--line);
  border-radius:var(--r);box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 24px 60px -30px rgba(0,0,0,.8);
  -webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%);min-width:0}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 24px;border-radius:10px;border:1px solid transparent;
  background:var(--grn);color:var(--on);font:600 16px/1.2 var(--body);text-decoration:none;cursor:pointer;text-align:center;
  box-shadow:0 0 0 1px rgba(79,227,161,.35),0 10px 34px -10px rgba(79,227,161,.65);transition:transform .15s,box-shadow .15s,background .15s}
.btn:hover{background:#7df0bd;color:var(--on);transform:translateY(-1px)}
.btn.ghost{background:rgba(176,255,220,.05);color:var(--ink);border-color:var(--line2);box-shadow:none}
.btn.ghost:hover{background:rgba(176,255,220,.12);color:#fff}
.btn.sm{min-height:44px;padding:9px 16px;font-size:15px}
.btn[disabled]{opacity:.6;cursor:default;transform:none}

/* header */
.top{position:relative;z-index:30}
.top-in{max-width:calc(var(--col) + 40px);margin:0 auto;padding:22px 20px 12px;display:flex;align-items:center;gap:16px}
.brand{display:inline-flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;font:700 19px/1 var(--disp);letter-spacing:-.01em;min-height:44px;min-width:0}
.brand span{overflow-wrap:anywhere}
.brand .mark{width:34px;height:34px;flex:none;padding:4px;border:1px solid var(--line2);border-radius:8px;background:rgba(176,255,220,.07)}
.brand .mark path{stroke-width:4.4}
.tag{margin:0 0 0 auto;color:var(--mut);font:400 12.5px/1.3 var(--mono);text-align:right;max-width:19em}
.topcta,.burger{display:none}
.nav{position:sticky;top:10px;z-index:40;padding:0 20px;margin:0 auto 8px;max-width:calc(var(--col) + 80px)}
.strip{display:flex;align-items:stretch;gap:0;padding:5px;border:1px solid var(--line2);border-radius:14px;
  background:rgba(9,22,17,.72);-webkit-backdrop-filter:blur(18px) saturate(150%);backdrop-filter:blur(18px) saturate(150%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 18px 40px -22px rgba(0,0,0,.9)}
.strip>a:not(.btn){flex:1 1 0;min-width:0;display:flex;align-items:center;justify-content:center;min-height:44px;padding:0 8px;color:var(--mut);
  text-decoration:none;font:600 15px/1.1 var(--body);border-right:1px solid var(--line);position:relative;white-space:nowrap}
.strip>a:not(.btn):hover{color:#fff}
.strip>a[aria-current]{color:#fff}
.strip>a[aria-current]::after{content:"";position:absolute;left:50%;bottom:3px;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:var(--grn);box-shadow:0 0 10px 2px rgba(79,227,161,.7)}
.strip .btn{margin-left:8px;flex:none;white-space:nowrap}

/* layout */
main{display:block;max-width:calc(var(--col) + 40px);margin:0 auto;padding:0 20px 40px}
main>*{min-width:0}
.sec{margin-top:76px}
main>section:not([class]){margin-top:76px}
.sh{display:flex;align-items:center;gap:16px;margin-bottom:22px}
.sh .gl{flex:none;width:58px;height:58px;padding:6px;border:1px solid var(--line2);border-radius:10px;background:rgba(176,255,220,.06);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 0 26px -6px rgba(79,227,161,.45)}
.sh .gl path{stroke-width:3.1}
.sh>div{min-width:0}
.mode{display:block;font:500 12px/1 var(--mono);color:var(--grn);letter-spacing:.14em;margin-bottom:7px}
h2{font-size:clamp(1.55rem,3.6vw,2rem);font-weight:700}
h3{font-size:1.1rem;font-weight:700;letter-spacing:-.005em;line-height:1.25}
.lbl{font:500 12px/1.2 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--grn);margin:0 0 14px}

/* hero */
.hero,.phead{position:relative}
.hero::before,.phead::before{content:"";position:absolute;z-index:-1;left:50%;top:0;width:min(900px,100vw);height:100%;transform:translateX(-50%);pointer-events:none;
  background:radial-gradient(ellipse 50% 46% at 50% 44%,rgba(7,16,12,.94) 35%,rgba(7,16,12,.6) 70%,transparent 100%)}
.hero.nf::before{display:none}
.hero{text-align:center;padding:54px 0 0}
.eyebrow{display:inline-flex;align-items:center;gap:10px;margin:0 0 22px;padding:7px 14px;border:1px solid var(--line2);border-radius:999px;
  font:500 12.5px/1.3 var(--mono);letter-spacing:.06em;color:var(--grn2);background:rgba(9,22,17,.55)}
.eyebrow i{width:7px;height:7px;border-radius:50%;background:var(--grn);box-shadow:0 0 10px 2px rgba(79,227,161,.8);flex:none}
h1{font-size:clamp(2.15rem,6.2vw,3.5rem);font-weight:700;letter-spacing:-.03em;line-height:1.04}
.hero h1{text-shadow:0 2px 30px rgba(7,16,12,.9)}
.lead{font-size:1.14rem;line-height:1.6;color:var(--mut);margin:22px auto 0;max-width:36em;text-wrap:pretty}
.acts-row{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin:30px 0 0}
.modes{list-style:none;margin:54px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;text-align:left}
.modes li{padding:16px 16px 18px}
.modes .fig{width:100%;max-width:150px;margin:0 auto 12px}
.modes p{margin:0;font-size:.95rem;line-height:1.5;color:var(--ink)}
.modes li:nth-child(2){transform:translateY(14px)}
.modes li:nth-child(3){transform:translateY(28px)}
.try{margin-top:96px}

/* facts */
.facts{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:1px;margin-top:22px;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--line)}
.fact{grid-column:span 2;background:rgba(9,22,17,.86);padding:16px 16px 15px;min-width:0}
.fact:nth-child(-n+2){grid-column:span 3}
.fact b{display:block;font:700 1.5rem/1.1 var(--disp);color:#fff;letter-spacing:-.02em;overflow-wrap:anywhere}
.fact:nth-child(-n+2) b{color:var(--grn);font-size:1.9rem}
.fact span{display:block;margin-top:6px;font-size:.84rem;line-height:1.35;color:var(--mut)}
.facts.big .fact{padding:22px 20px}
.facts.big .fact:nth-child(-n+2) b{font-size:clamp(2.3rem,8vw,3.3rem)}
.facts.big .fact b{font-size:1.7rem}
.sub{margin:16px 0 0;text-align:center;color:var(--mut);font:400 13.5px/1.5 var(--mono)}
.priceboard{margin-top:44px}

/* features */
.feats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:hidden}
.feat{padding:22px 22px 20px;border-bottom:1px solid var(--line);min-width:0}
.feat:nth-child(odd){border-right:1px solid var(--line)}
.feat:nth-last-child(-n+2){border-bottom:0}
.feat h3{display:flex;gap:10px;align-items:baseline}
.feat h3::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--sand);transform:translateY(-3px)}
.feat p,.use p{margin:8px 0 0;font-size:.96rem;color:var(--mut);line-height:1.55}

/* steps */
.steps{list-style:none;margin:0;padding:0;position:relative}
.steps::before{content:"";position:absolute;left:27px;top:30px;bottom:30px;border-left:2px dotted rgba(233,226,207,.4)}
.steps li{position:relative;display:flex;gap:20px;align-items:flex-start;padding:12px 0}
.num{flex:none;width:56px;height:56px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--line2);background:#0c1a14;
  font:700 1.35rem/1 var(--disp);color:var(--grn);box-shadow:0 0 0 6px var(--bg),0 0 24px -4px rgba(79,227,161,.5)}
.steps li>div{min-width:0;padding-top:4px}
.steps p{margin:6px 0 0;color:var(--mut);font-size:.98rem}
.steps.ex li>div{flex:1;padding:16px 18px;border:1px solid var(--line);border-radius:var(--r);background:rgba(9,22,17,.6)}
.steps.ex p{font-family:var(--mono);font-size:.86rem;line-height:1.6;color:var(--ink)}

/* use cases / benefits */
.uses{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.use{padding:22px 20px 20px}
.use::before{content:"";position:absolute;right:14px;top:14px;width:26px;height:26px;border-radius:50%;
  background:radial-gradient(circle,var(--sand) 1.5px,transparent 2px) 0 0/8.6px 8.6px;opacity:.55;-webkit-mask:radial-gradient(circle,#000 60%,transparent 62%);mask:radial-gradient(circle,#000 60%,transparent 62%)}
.use h3{padding-right:34px}

/* prose */
.prose{padding:34px 34px 30px;overflow-wrap:anywhere}
.prose>:first-child{margin-top:0}
.prose>:last-child{margin-bottom:0}
.prose h2{margin:2.1em 0 .6em;padding-top:.2em;font-size:clamp(1.4rem,3.2vw,1.75rem);scroll-margin-top:90px}
.prose h2::before{content:"";display:block;width:34px;height:8px;margin-bottom:14px;background:radial-gradient(circle,var(--grn) 1.6px,transparent 2.1px) 0 0/8.5px 8px}
.prose h3{margin:1.7em 0 .5em}
.prose p,.prose li{color:#d6e2da}
.prose ul,.prose ol{padding-left:1.25em;margin:0 0 1.1em}
.prose li{margin:.4em 0}
.prose li::marker{color:var(--grn)}
.prose strong{color:#fff}
.prose :not(pre)>code{font-size:.88em;padding:.12em .4em;border-radius:5px;background:rgba(79,227,161,.12);color:var(--grn2);overflow-wrap:anywhere}
.prose.read{font-size:1.06rem;line-height:1.75}
.prose table,main table{width:100%;border-collapse:collapse;font-size:.92rem;margin:1em 0 1.4em}
.prose th,.prose td,main table th,main table td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.prose thead th,main table thead th{font:500 12px/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--grn);opacity:1;border-bottom-color:var(--line2)}
.prose tbody th,main table tbody th{color:#fff;font-weight:600}
.prose table{display:block;overflow-x:auto}
main>section:not([class]){padding:30px 30px 22px;border:1px solid var(--line);border-radius:var(--r);background:linear-gradient(160deg,var(--glass2),var(--glass) 42%,rgba(176,255,220,.03));
  -webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%);overflow-wrap:anywhere}
main>section:not([class]) h2{margin-bottom:.6em}
main>section:not([class]) p{color:#d6e2da}
main>section:not([class]) code{font-size:.88em;color:var(--grn2)}
main>section:not([class]) [class$="s"]{overflow-x:auto}

/* code */
pre.code{position:relative;margin:1.2em 0;padding:46px 18px 18px;border-radius:12px;border:1px solid var(--line);background:rgba(2,8,5,.78);
  color:#dbe8df;font:400 13.5px/1.65 var(--mono);overflow-x:auto;max-width:100%;white-space:pre;tab-size:2;-webkit-overflow-scrolling:touch}
pre.code code{font:inherit;background:none;padding:0;color:inherit;white-space:pre;overflow-wrap:normal}
pre.code .k{color:var(--grn)}
pre.code .s{color:#ecd9a0}
pre.code .c{color:#93a89b;font-style:italic}
.copy{position:absolute;top:6px;right:6px;min-height:34px;min-width:44px;padding:6px 12px;border-radius:8px;border:1px solid var(--line2);background:rgba(176,255,220,.08);
  color:var(--ink);font:500 12px/1 var(--mono);cursor:pointer}
.copy::before{content:"";position:absolute;inset:-6px}
.copy:hover{background:rgba(79,227,161,.22);color:#fff}
.codebox{border:1px solid var(--line2);border-radius:var(--r);overflow:hidden;background:rgba(2,8,5,.72);
  -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 30px 70px -34px rgba(79,227,161,.45);min-width:0}
.codetabs{display:flex;gap:4px;padding:6px;border-bottom:1px solid var(--line);background:rgba(176,255,220,.05);overflow-x:auto}
.codetabs button{min-height:44px;padding:0 16px;border:0;border-radius:9px;background:none;color:var(--mut);font:500 13.5px/1 var(--mono);cursor:pointer;white-space:nowrap}
.codetabs button:hover{color:#fff}
.codetabs button[aria-selected="true"]{background:rgba(79,227,161,.16);color:var(--grn2);box-shadow:inset 0 0 0 1px rgba(79,227,161,.4)}
.codebox pre.code{margin:0;border:0;border-radius:0;background:none}

/* page head */
.phead{text-align:center;padding:44px 0 0}
.phead.tight{padding-top:26px}
.phead h1{font-size:clamp(2rem,5.4vw,3rem)}
.phead.tight h1{font-size:clamp(1.85rem,4.6vw,2.5rem)}
.phead.tight .lead{margin-top:14px;font-size:1.05rem}
.headfig{width:96px;margin:0 auto 22px;padding:9px;border:1px solid var(--line2);border-radius:14px;background:rgba(176,255,220,.06);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 0 60px -8px rgba(79,227,161,.55)}
.headfig.xl{width:min(260px,70vw);padding:18px}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:4px 0;margin:0 0 16px;padding:0;font:400 12.5px/1.4 var(--mono);color:var(--mut)}
.crumbs li+li::before{content:"\00b7";margin:0 10px;color:var(--grn)}
.crumbs a{color:var(--mut);text-decoration:none;display:inline-block;padding:10px 0}
.crumbs li{padding:0;display:flex;align-items:center}
.crumbs a:hover{color:#fff;text-decoration:underline}
.crumbs [aria-current]{color:var(--ink)}
.stamp{text-align:center;margin:18px 0 0;font:400 12.5px/1.4 var(--mono);color:var(--mut)}

/* toc + takeaways */
.toc,.take{margin-top:36px;padding:24px 26px}
.toc ol{margin:0;padding:0;list-style:none;counter-reset:t}
.toc.two ol{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 26px}
.toc li{counter-increment:t;border-top:1px solid var(--line);min-width:0}
.toc a{display:flex;gap:12px;align-items:baseline;min-height:44px;padding:10px 0;color:var(--ink);text-decoration:none;font-size:.96rem;line-height:1.35}
.toc a::before{content:counter(t,decimal-leading-zero);font:500 12px/1 var(--mono);color:var(--grn);flex:none}
.toc a:hover{color:var(--grn2)}
.take{margin-top:28px;background:linear-gradient(160deg,rgba(79,227,161,.16),rgba(79,227,161,.05) 50%,rgba(176,255,220,.03));border-color:rgba(79,227,161,.38)}
.take ol{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.take li{display:flex;gap:14px;align-items:flex-start}
.take .num{width:32px;height:32px;font-size:.95rem;box-shadow:none;background:rgba(4,19,12,.6)}
.take li p{margin:3px 0 0;line-height:1.55}
.toc+.sec,.take+.toc{margin-top:16px}
.toc+.sec{margin-top:16px}

/* aside + closing */
.side{margin-top:16px;padding:24px 26px;display:flex;align-items:center;gap:22px;justify-content:space-between}
.side h2{font-size:1.3rem}
.side p{margin:8px 0 0;color:var(--mut);font-size:.96rem}
.side .btn{flex:none}
.end{overflow:hidden;text-align:center;padding:56px 26px 52px;border-color:rgba(79,227,161,.4)}
.endfig{position:absolute;left:50%;top:50%;width:520px;max-width:none;transform:translate(-50%,-50%);opacity:.22;pointer-events:none}
.endfig path{stroke-width:1.2}
.end::after{content:"";position:absolute;inset:0;background:radial-gradient(closest-side,rgba(79,227,161,.20),transparent);pointer-events:none}
.end-in{position:relative;z-index:1}
.end p{color:#d6e2da;max-width:30em;margin:14px auto 0}
.end .acts-row{margin-top:26px}

/* faq */
.qa{padding:4px 24px}
.qa details{border-bottom:1px solid var(--line)}
.qa details:last-child{border-bottom:0}
.qa summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:60px;padding:14px 0;cursor:pointer;list-style:none;font:600 1.03rem/1.35 var(--body);color:var(--ink)}
.qa summary::-webkit-details-marker{display:none}
.qa summary i{flex:none;width:26px;height:26px;border-radius:50%;border:1px solid var(--line2);position:relative}
.qa summary i::before,.qa summary i::after{content:"";position:absolute;left:50%;top:50%;width:10px;height:2px;margin:-1px 0 0 -5px;background:var(--grn);border-radius:2px;transition:transform .2s}
.qa summary i::after{transform:rotate(90deg)}
.qa details[open] summary i::after{transform:rotate(0)}
.qa details[open] summary{color:#fff}
.qa details p{margin:0 0 18px;color:var(--mut);padding-right:40px}

/* signup */
.keyform{position:relative;margin-top:26px}
.formfig{position:absolute;left:50%;top:-30px;width:760px;max-width:none;transform:translateX(-50%);opacity:.26;pointer-events:none;z-index:-1}
.formfig path{stroke-width:.55}
.form{position:relative;max-width:480px;margin:0 auto;padding:22px 24px 24px;border:1px solid rgba(79,227,161,.42);border-radius:18px;
  background:linear-gradient(165deg,rgba(18,40,31,.88),rgba(9,22,17,.9));-webkit-backdrop-filter:blur(20px) saturate(150%);backdrop-filter:blur(20px) saturate(150%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 0 0 6px rgba(79,227,161,.06),0 40px 90px -30px rgba(79,227,161,.5)}
.tabs2{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;margin-bottom:16px;border-radius:11px;background:rgba(0,0,0,.4);border:1px solid var(--line)}
.tabs2 button{min-height:44px;border:0;border-radius:8px;background:none;color:var(--mut);font:600 15px/1.2 var(--body);cursor:pointer;padding:6px 8px}
.tabs2 button[aria-selected="true"]{background:rgba(79,227,161,.18);color:#fff;box-shadow:inset 0 0 0 1px rgba(79,227,161,.45)}
.msg{display:none;margin:0 0 14px;padding:11px 14px;border-radius:10px;font-size:.93rem;line-height:1.45;background:rgba(79,227,161,.12);border:1px solid rgba(79,227,161,.4);color:var(--ink)}
.msg:not(:empty){display:block}
.msg.err{background:rgba(255,120,110,.13);border-color:rgba(255,140,130,.6);color:#ffd0ca}
.row{margin:0 0 14px;min-width:0}
.row label,.calc label{display:block;margin-bottom:6px;font:500 12px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mut)}
input,select,textarea{width:100%;min-height:48px;padding:11px 14px;border-radius:10px;border:1px solid var(--line2);background:rgba(2,8,5,.6);color:var(--ink);
  font:400 16px/1.4 var(--body);-webkit-appearance:none;appearance:none}
select{background-image:linear-gradient(45deg,transparent 50%,var(--grn) 50%),linear-gradient(135deg,var(--grn) 50%,transparent 50%);
  background-position:calc(100% - 20px) 21px,calc(100% - 14px) 21px;background-size:6px 6px;background-repeat:no-repeat;padding-right:40px!important}
select option{background:#0b1712;color:var(--ink)}
textarea{min-height:150px;resize:vertical;padding:12px 14px!important}
input:focus,select:focus,textarea:focus{outline:2px solid var(--grn);outline-offset:1px;border-color:var(--grn)}
.note{margin:8px 0 0;font-size:.85rem;line-height:1.45;color:var(--mut)}
.form form .btn{width:100%;margin-top:4px}
.form form>.note{text-align:center;margin-top:12px}
.form .btn.ghost{background:rgba(255,255,255,.06)}
.keyout{display:none}
.keyout.on{display:block}
.keyout h3{font-size:1.25rem;margin-bottom:12px}
.keybox{display:flex;align-items:center;gap:10px;padding:8px 8px 8px 14px;border-radius:10px;border:1px dashed rgba(79,227,161,.6);background:rgba(2,8,5,.7)}
.keybox span{flex:1;min-width:0;font:500 13.5px/1.5 var(--mono);color:var(--grn2);overflow-wrap:anywhere;word-break:break-all}
.keyout p{font-size:.94rem;line-height:1.8;margin:12px 0 0}
.keyout code{font-size:.86em;color:var(--grn2);overflow-wrap:anywhere}
.keyout .mut,.mut{color:var(--mut)}
.acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.acts .btn{flex:1 1 auto}

/* calculator */
.calc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding:24px;border:1px solid var(--line2);border-radius:var(--r);
  background:linear-gradient(160deg,var(--glass2),var(--glass) 42%,rgba(176,255,220,.03));-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1)}
.calc>div{min-width:0}
.calc>div:last-child{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:18px 20px;border-radius:12px;
  background:rgba(2,8,5,.66);border:1px solid rgba(79,227,161,.38)}
.calc>div:last-child label{margin:0}
.calc output{font:700 clamp(2rem,7vw,2.8rem)/1 var(--disp);color:var(--grn);letter-spacing:-.02em;text-shadow:0 0 30px rgba(79,227,161,.5)}
.calc input{font-family:var(--mono);font-size:16px}

/* support */
.supp{max-width:560px;margin:0 auto}
.supp form{margin-top:0!important}
.supp form .btn{min-width:160px}
.supp [data-support-msg]{color:var(--grn2);min-height:1.4em}

/* footer */
.foot{margin-top:70px;border-top:1px solid var(--line);background:rgba(4,10,7,.6)}
.foot-in{max-width:calc(var(--col) + 40px);margin:0 auto;padding:36px 20px 44px;text-align:center}
.foot .tagline{margin:8px 0 0;color:var(--mut);font:400 12.5px/1.4 var(--mono)}
.foot ul{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:0 22px;margin:18px 0 0;padding:0}
.foot ul a{display:inline-flex;align-items:center;min-height:44px;color:var(--ink);text-decoration:none;font-size:.95rem}
.foot ul a:hover{color:var(--grn2);text-decoration:underline}
.legal{margin:16px 0 0;font-size:.84rem;color:var(--mut)}
.nf{padding-bottom:60px}

@media (max-width:760px){
  body{font-size:16px}
  .top{position:sticky;top:0;background:rgba(7,16,12,.86);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
  .top-in{padding:8px 14px;gap:8px}
  .brand{font-size:16px;gap:8px;flex:1 1 auto}
  .brand .mark{width:30px;height:30px}
  .tag{display:none}
  .topcta{display:inline-flex;flex:none;padding:8px 12px;font-size:14px}
  .burger{display:inline-flex;flex:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:44px;height:44px;border:1px solid var(--line2);border-radius:10px;background:rgba(176,255,220,.06);cursor:pointer;padding:0}
  .burger i{display:block;width:18px;height:2px;border-radius:2px;background:var(--ink)}
  .nav{display:none;position:fixed;top:66px;left:0;right:0;padding:0 14px;margin:0;max-width:none}
  .nav.open{display:block}
  .strip{flex-direction:column;padding:6px;background:rgba(9,22,17,.97)}
  .strip>a:not(.btn){flex:none;justify-content:flex-start;min-height:48px;padding:0 14px;border-right:0;border-bottom:1px solid var(--line);font-size:16px}
  .strip>a[aria-current]::after{left:auto;right:14px;bottom:50%;margin:0 0 -3px}
  .strip .btn{margin:8px 0 0;min-height:48px}
  main{padding:0 16px 30px}
  .hero{padding-top:36px}
  .modes{grid-template-columns:1fr;margin-top:36px;gap:10px}
  .modes li{display:grid;grid-template-columns:72px minmax(0,1fr);gap:4px 14px;align-items:center;padding:12px 14px;transform:none!important}
  .modes .fig{grid-row:1/3;margin:0;width:72px}
  .modes .mode{margin:0;align-self:end}
  .modes p{align-self:start}
  .sec,.try,main>section:not([class]){margin-top:56px}
  .sh{gap:12px}
  .sh .gl{width:48px;height:48px;padding:5px}
  .fact,.fact:nth-child(-n+2){grid-column:span 3}
  .fact:last-child{grid-column:1/-1}
  .fact b{font-size:1.3rem}
  .fact:nth-child(-n+2) b{font-size:1.55rem}
  .feats,.uses,.toc.two ol{grid-template-columns:1fr}
  .feat:nth-child(odd){border-right:0}
  .feat:nth-last-child(2){border-bottom:1px solid var(--line)}
  .prose{padding:22px 18px}
  main>section:not([class]){padding:22px 18px 14px}
  .steps::before{left:21px}
  .steps li{gap:14px}
  .num{width:44px;height:44px;font-size:1.1rem}
  .side{flex-direction:column;align-items:stretch;text-align:left}
  .calc{grid-template-columns:1fr;padding:16px}
  .form{padding:16px 16px 18px}
  .keyform{margin-top:18px}
  .phead{padding-top:28px}
  .phead.tight{padding-top:18px}
  .headfig{width:76px;margin-bottom:16px}
  .qa{padding:2px 16px}
  .qa details p{padding-right:0}
  .toc,.take{padding:18px 16px}
  .end{padding:40px 18px}
  pre.code{font-size:12.5px;padding-left:14px;padding-right:14px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}html{scroll-behavior:auto}}
