.how_story__phEp4{position:relative}.how_grid__XEUO9{display:grid;grid-template-columns:minmax(0,1fr);margin:0 auto;max-width:72rem;padding:0 16px}.how_figureWrap__MYHMA{position:sticky;top:0;z-index:2;height:min(58svh,560px);padding:10px 0 12px;background:var(--brew-paper);order:-1}.how_steps__xy46e{position:relative;z-index:1;margin:0;padding:0;list-style:none}.how_step__LsSiR{min-height:82svh;padding:28px 4px 0}.how_step__LsSiR:last-child{min-height:70svh}.how_stepInner__P0ryQ{max-width:30rem;transition:opacity .4s var(--brew-ease-out)}.how_step__LsSiR[data-active=false] .how_stepInner__P0ryQ{opacity:.32}@media (min-width:1024px){.how_grid__XEUO9{grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:64px;padding:0 32px}.how_figureWrap__MYHMA{order:2;top:max(76px,9vh);height:min(82vh,780px);padding:0;background:none}.how_step__LsSiR{display:flex;align-items:center;min-height:96vh;padding:0}.how_step__LsSiR:first-child{min-height:80vh;align-items:flex-start;padding-top:12vh}}.how_panel__uOYmY{position:relative;height:100%;overflow:hidden;border-radius:24px;background:#0b0b0c;color:#fff;box-shadow:inset 0 0 0 1px hsla(0,0%,100%,.07),0 1px 2px rgba(0,0,0,.08),0 30px 60px -36px rgba(0,0,0,.55);isolation:isolate;touch-action:pan-y}@media (min-width:1024px){.how_panel__uOYmY{border-radius:28px}}.how_canvas__vEubL{position:absolute;inset:0;width:100%;height:100%;transition:opacity .6s var(--brew-ease-out)}.how_canvas__vEubL[data-pointer=true]{cursor:pointer}.how_canvas__vEubL[data-behind=true]{opacity:0}.how_labels__N7d1W{position:absolute;inset:0;pointer-events:none}.how_label__XQl8J{position:absolute;left:0;top:0;white-space:nowrap;font-size:12px;line-height:1;color:hsla(0,0%,100%,.82);will-change:transform,opacity}.how_family__ndxpd{font-size:13px;font-weight:600;letter-spacing:-.01em;text-shadow:0 1px 10px rgba(0,0,0,.9)}.how_callout__YpQ92,.how_heartLabel__T3Nn9{padding:4px 8px;border-radius:99px;background:rgba(11,11,12,.88);font-weight:600}.how_callout__YpQ92,.how_heartLabel__T3Nn9{color:#fff}.how_scoreLabel__y9YFG{font-variant-numeric:tabular-nums;font-weight:600;font-size:11px;color:hsla(0,0%,100%,.42)}.how_scoreLabel__y9YFG[data-fits=true]{color:#fff}.how_tip__TMzY7{padding:6px 9px;border-radius:8px;background:hsla(0,0%,100%,.95);color:#111;font-size:12px;font-weight:500;box-shadow:0 6px 20px -8px rgba(0,0,0,.6);z-index:3}.how_top__ujme9{position:absolute;inset:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;pointer-events:none;font-size:12px;color:hsla(0,0%,100%,.55);z-index:4}.how_stepper__EU49v{display:flex;gap:5px;pointer-events:auto}.how_stepper__EU49v button{width:6px;height:6px;padding:0;border:0;border-radius:99px;background:hsla(0,0%,100%,.28);transition:width .4s var(--brew-ease-out),background-color .3s ease;cursor:pointer}.how_stepper__EU49v button[aria-current=step]{width:18px;background:#fff}.how_caption__4KpTb{position:absolute;inset:auto 0 0;padding:28px 16px 14px;font-size:12.5px;line-height:1.45;color:hsla(0,0%,100%,.62);background:linear-gradient(0deg,rgba(11,11,12,.96) 55%,rgba(11,11,12,0));pointer-events:none;z-index:4}.how_caption__4KpTb strong{color:#fff;font-weight:600}@media (min-width:1024px){.how_top__ujme9{padding:18px 22px}.how_caption__4KpTb{padding:40px 22px 18px;font-size:13px}}.how_loading__hAVvn{position:absolute;inset:0;display:grid;place-items:center;font-size:12px;color:hsla(0,0%,100%,.45);pointer-events:none}.how_chart__mXRGP{position:absolute;inset:64px 12px 70px;display:flex;flex-direction:column;justify-content:center;z-index:3;transition:opacity .5s var(--brew-ease-out),transform .5s var(--brew-ease-out)}.how_chart__mXRGP[data-shown=false]{opacity:0;transform:translateY(calc(10px * var(--brew-motion)));pointer-events:none}@media (min-width:1024px){.how_chart__mXRGP{inset:64px 28px 84px}}.how_rows__uHKsV{position:relative;display:grid;gap:3px}.how_row__itSvQ{position:relative;display:grid;grid-template-columns:28px minmax(0,1.25fr) minmax(0,.75fr) 40px;align-items:center;gap:10px;min-height:34px;padding:3px 4px;border:0;border-radius:10px;background:transparent;color:inherit;font:inherit;text-align:left;transition:background-color .2s ease,opacity .4s ease}.how_row__itSvQ:hover,.how_row__itSvQ[data-playing=true]{background:hsla(0,0%,100%,.06)}.how_row__itSvQ[data-removed=true]{opacity:.38}.how_row__itSvQ[data-removed=true] .how_who__BWJP0 strong{text-decoration:line-through}.how_cover__IPJPa{position:relative;width:28px;height:28px;border-radius:5px;object-fit:cover;background:hsla(0,0%,100%,.08)}.how_who__BWJP0{display:grid;min-width:0;font-size:12.5px;line-height:1.25}.how_who__BWJP0 span,.how_who__BWJP0 strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.how_who__BWJP0 strong{font-weight:600;color:#fff}.how_who__BWJP0 span{color:hsla(0,0%,100%,.5);font-size:11.5px}.how_track__4lr3S{position:relative;height:8px;border-radius:99px;background:hsla(0,0%,100%,.08)}.how_fill__3OC5v{position:absolute;inset:0 auto 0 0;border-radius:99px;background:hsla(0,0%,100%,.24);transform-origin:left;transition:background-color .5s ease,transform .9s var(--brew-ease-out)}.how_row__itSvQ[data-fits=true] .how_fill__3OC5v{background:#fff}.how_chart__mXRGP[data-shown=false] .how_fill__3OC5v{transform:scaleX(0)}.how_value__8Ih_2{font-size:12px;font-weight:600;font-variant-numeric:tabular-nums;text-align:right;color:hsla(0,0%,100%,.5)}.how_row__itSvQ[data-fits=true] .how_value__8Ih_2{color:#fff}.how_barLine__s_fyV{position:absolute;top:-26px;bottom:-6px;width:1.5px;margin-left:-.75px;background:#fff;box-shadow:0 0 0 1.5px #0b0b0c;transition:left .9s var(--brew-ease-spring);pointer-events:none}.how_barLine__s_fyV span{position:absolute;top:0;left:0;transform:translateX(-50%);padding:3px 7px;border-radius:99px;background:#fff;color:#111;font-size:11px;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}.how_rowPlay__ORx8M{all:unset;display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}.how_rowPlay__ORx8M:after{content:"";position:absolute;inset:0;border-radius:10px}.how_rowPlay__ORx8M:focus-visible:after{outline:2px solid #fff;outline-offset:-2px}.how_likePlay__uS5pB{all:unset;position:relative;z-index:1;cursor:pointer;text-decoration:underline;text-decoration-color:hsla(0,0%,100%,.3);text-underline-offset:2px}.how_likePlay__uS5pB:hover,.how_likePlay__uS5pB[aria-pressed=true]{color:#fff;text-decoration-color:#fff}.how_likePlay__uS5pB:focus-visible{outline:2px solid #fff;outline-offset:2px;border-radius:3px}.how_rows__uHKsV[data-mode=learn] .how_row__itSvQ{grid-template-columns:28px minmax(0,1.25fr) minmax(0,.75fr) 40px 26px}@media (min-width:640px){.how_row__itSvQ{grid-template-columns:28px minmax(0,.9fr) minmax(0,1.1fr) 40px}.how_rows__uHKsV[data-mode=learn] .how_row__itSvQ{grid-template-columns:28px minmax(0,.9fr) minmax(0,1.1fr) 40px 26px}}.how_remove__KcHw8{z-index:1;position:relative;display:grid;place-items:center;width:26px;height:26px;border:1px solid hsla(0,0%,100%,.28);border-radius:99px;background:#0b0b0c;color:#fff;font-size:14px;line-height:1;cursor:pointer;transition:border-color .2s ease,background-color .2s ease}.how_remove__KcHw8:hover{border-color:#fff}.how_remove__KcHw8[aria-pressed=true]{background:#fff;color:#111}.how_spotify__TNQq3{display:grid;gap:2px}.how_spotifyHead__yvc21{display:flex;align-items:center;gap:12px;margin-bottom:12px}.how_mosaic__A6D_B{display:grid;grid-template-columns:repeat(2,1fr);width:56px;height:56px;overflow:hidden;border-radius:6px;flex:none}.how_mosaic__A6D_B img{width:100%;height:100%;object-fit:cover}.how_spotifyHead__yvc21 strong{display:block;font-size:18px;font-weight:700;letter-spacing:-.02em;color:#fff}.how_spotifyHead__yvc21 span{font-size:12px;color:hsla(0,0%,100%,.55)}.how_pick__nZLdL{display:grid;grid-template-columns:64px 32px minmax(0,1fr) auto;align-items:center;gap:10px;min-height:40px;padding:4px 6px;border-radius:8px;font-size:12.5px;animation:how_pickRise__dHcAe .6s var(--brew-ease-out) backwards}@keyframes how_pickRise__dHcAe{0%{opacity:0;transform:translateY(calc(12px * var(--brew-motion)));filter:blur(calc(6px * var(--brew-motion)))}}.how_pick__nZLdL[data-today=true]{background:hsla(0,0%,100%,.08);box-shadow:inset 0 0 0 1px hsla(0,0%,100%,.3)}.how_pick__nZLdL time{font-size:11.5px;color:hsla(0,0%,100%,.55)}.how_pick__nZLdL[data-today=true] time{color:#fff;font-weight:600}.how_pick__nZLdL .how_cover__IPJPa{width:32px;height:32px}.how_own__f9LrL{opacity:.45}@media (max-width:639px){.how_own__f9LrL~.how_own__f9LrL{display:none}.how_pick__nZLdL{min-height:36px}.how_spotifyHead__yvc21{margin-bottom:8px}}.how_empty__uaWt_{padding:18px 6px;font-size:13px;line-height:1.5;color:hsla(0,0%,100%,.6)}.how_emptyReset__V_69F{padding:0;border:0;background:none;color:#fff;font:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}.how_song__rCJTp{display:inline-flex;align-items:center;gap:6px;padding:0 9px 0 2px;font-size:.94em;line-height:1.55;border:1px solid color-mix(in srgb,var(--brew-ink) 14%,transparent);border-radius:99px;background:var(--brew-paper);color:var(--brew-ink);font:inherit;font-weight:500;vertical-align:baseline;cursor:pointer;transition:border-color .2s ease}.how_song__rCJTp:hover{border-color:color-mix(in srgb,var(--brew-ink) 45%,transparent)}.how_glyph__cjwAB{display:inline-grid;place-items:center;width:19px;height:19px;border-radius:99px;background:var(--brew-ink);color:var(--brew-paper);flex:none}.how_eq__wQvJ1{display:inline-flex;align-items:flex-end;gap:1.5px;height:9px}.how_eq__wQvJ1 i{width:2px;height:100%;border-radius:1px;background:currentColor;animation:how_eq__wQvJ1 .9s ease-in-out infinite alternate;transform-origin:bottom}.how_eq__wQvJ1 i:nth-child(2){animation-delay:-.3s}.how_eq__wQvJ1 i:nth-child(3){animation-delay:-.6s}.how_pauseGlyph__FRz7e,.how_song__rCJTp:hover .how_eq__wQvJ1{display:none}.how_song__rCJTp:hover .how_pauseGlyph__FRz7e{display:inline}@keyframes how_eq__wQvJ1{0%{transform:scaleY(.3)}to{transform:scaleY(1)}}.how_strip__d0geG{display:grid;grid-template-columns:repeat(10,minmax(0,40px));gap:6px;margin-top:18px}.how_strip__d0geG button{position:relative;aspect-ratio:1;width:100%;padding:0;border:0;border-radius:6px;overflow:hidden;background:var(--brew-soft);cursor:pointer;transition:transform .2s var(--brew-ease-out)}.how_strip__d0geG button:hover{transform:translateY(calc(-2px * var(--brew-motion)))}.how_strip__d0geG button[data-playing=true]{box-shadow:0 0 0 2px var(--brew-paper),0 0 0 4px var(--brew-ink)}.how_strip__d0geG img{width:100%;height:100%;object-fit:cover}.how_readout__nkRSz{margin-top:20px;padding:14px 16px;border-radius:14px;background:var(--brew-surface);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--brew-ink) 8%,transparent);font-size:15px;line-height:1.5}.how_readout__nkRSz b{font-variant-numeric:tabular-nums}.how_reset__f9OiO{margin-top:8px;padding:0;border:0;background:none;color:var(--brew-ink);font:inherit;font-size:14px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}@media (prefers-reduced-motion:reduce){.how_eq__wQvJ1 i{animation:none}.how_barLine__s_fyV,.how_canvas__vEubL,.how_chart__mXRGP,.how_fill__3OC5v,.how_stepInner__P0ryQ{transition:none}.how_pick__nZLdL{animation:none}}