.howto-seg{isolation:isolate;background:var(--wash,#3522420f);border-radius:11px;flex:none;grid-auto-columns:1fr;grid-auto-flow:column;padding:3px;display:inline-grid;position:relative}.howto-seg button{z-index:1;height:32px;color:var(--ink-50);font-family:var(--f-ui);white-space:nowrap;background:0 0;border:0;border-radius:8px;justify-content:center;align-items:center;gap:6px;padding:0 12px;font-size:13.5px;font-weight:650;transition:color .2s;display:inline-flex}.howto-seg button[data-on]{color:var(--ink)}.howto-seg button:hover{color:var(--ink-86)}.howto-seg button:focus-visible{outline:2px solid var(--tangerine);outline-offset:1px}.howto-seg svg{flex:none;width:14px;height:14px}.howto-seg-ind{z-index:0;background:var(--field);border-radius:8px;width:calc(50% - 3px);transition:transform .32s cubic-bezier(.34,1.3,.64,1);position:absolute;top:3px;bottom:3px;left:3px;box-shadow:0 1px 3px #140c1a24}.howto-seg-ind[data-pos="1"]{transform:translate(100%)}.howto{text-align:center;flex-direction:column;justify-content:safe center;align-items:center;gap:clamp(14px,2.4vh,26px);width:100%;min-height:100%;padding:clamp(12px,2.4vh,28px) clamp(4px,1.4vw,20px);display:flex;overflow:auto;container-type:inline-size}.howto-wait{min-height:320px}.howto-hero{background:#140c19;border-radius:20px;flex:none;width:min(100%,660px);animation:.5s cubic-bezier(.22,1,.36,1) both howto-in;position:relative;overflow:hidden;box-shadow:0 18px 50px #140c1a38}.howto-hero-media{aspect-ratio:1;position:relative}.howto-hero-media[data-size=wide]{aspect-ratio:16/9}.howto-hero-media video,.howto-hero-media img{object-fit:cover;width:100%;height:100%;display:block}.howto-head{text-align:left;pointer-events:none;background:radial-gradient(120% 100% at 0 0,#140c19d1,#140c1980 45%,#0000 75%);gap:6px;width:min(100%,560px);padding:clamp(14px,2.4cqw,26px) clamp(16px,2.8cqw,30px) 56px;display:grid;position:absolute;top:0;left:0}.howto-h{color:#fff1d8;font-family:var(--f-display);letter-spacing:-.025em;text-transform:uppercase;text-wrap:balance;text-shadow:0 2px 16px #0006;margin:0;font-size:clamp(22px,3.4cqw,40px);font-weight:800;line-height:.98}.howto-sub{color:#fff1d8db;text-wrap:pretty;max-width:44ch;margin:0;font-size:clamp(13px,1.6cqw,15.5px);line-height:1.45}.howto-steps{grid-template-columns:repeat(var(--n,3), minmax(0, 1fr));flex:none;gap:clamp(10px,1.2vw,18px);width:100%;max-width:1180px;margin:0;padding:0;list-style:none;display:grid}.howto-card{border:1px solid var(--line);background:var(--surface);text-align:left;min-width:0;animation:.55s cubic-bezier(.22,1,.36,1) both howto-in;animation-delay:calc(80ms + var(--i,0) * 80ms);border-radius:18px;grid-template-rows:auto 1fr;display:grid;overflow:hidden;box-shadow:0 10px 30px #3522420f}.howto-media{aspect-ratio:1;background:var(--wash,#3522420f);position:relative;overflow:hidden}.howto-media[data-size=wide]{aspect-ratio:16/9}.howto-media video,.howto-media img{object-fit:cover;width:100%;height:100%;display:block}.howto-txt{align-content:start;gap:4px;padding:13px 16px 16px;display:grid}.howto-n{color:var(--tangerine);letter-spacing:.02em;font-size:12px;font-weight:700}.howto-txt b{color:var(--ink);font-family:var(--f-display);letter-spacing:-.01em;font-size:17px;font-weight:800;line-height:1.15}.howto-txt p{color:var(--ink-70);margin:0;font-size:13.5px;line-height:1.45}.howto-go{background:var(--ink);height:40px;color:var(--bg);font-family:var(--f-ui);border:0;border-radius:12px;align-items:center;gap:8px;padding:0 18px;font-size:14px;font-weight:700;transition:transform .2s;animation:.55s cubic-bezier(.22,1,.36,1) .3s backwards howto-in;display:inline-flex}.howto-go:hover{transform:translateY(-1px)}.howto-go svg{width:14px;height:14px}@container (width<=640px){.howto-steps{overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;padding-block:var(--bleed-t) var(--bleed-b);margin-block:calc(var(--bleed-t) * -1) calc(4px - var(--bleed-b));grid-template-columns:none;grid-auto-columns:min(78%,340px);grid-auto-flow:column;overflow:auto hidden}.howto-steps::-webkit-scrollbar{display:none}.howto-card{scroll-snap-align:center}}.howto[data-compact] .howto-h{font-size:clamp(20px,2.8cqw,32px)}.howto[data-compact] .howto-hero{width:min(100%,580px)}@keyframes howto-in{0%{opacity:0;transform:translateY(10px)}}@media (prefers-reduced-motion:reduce){.howto-hero,.howto-card,.howto-go{animation:none}.howto-seg-ind{transition:none}}
