.how-lead{font:400 16px/1.55 var(--font-sans);color:var(--ee-ink-lead);margin:14px 0 0}.site .wrap.how-intro{padding-top:40px;padding-bottom:36px}.site .how-intro__title{margin-top:12px;font-size:52px;line-height:1.04}.how-intro__lead{margin-top:16px;font-size:17px}.how-step{border-top:1px dashed color-mix(in srgb, var(--ee-ink) 18%, transparent);padding:40px 0 44px}.how-step__head{align-items:baseline;gap:12px;display:flex}.how-step__num{font-family:var(--font-display);color:var(--ee-watermark);flex:none;font-size:44px;line-height:1;display:block}.site .how-step__title{font-size:40px;line-height:1.06}.how-write{margin-top:28px;padding-bottom:64px;position:relative}.how-write__letter{background:var(--ee-paper);border-radius:6px;margin:0 6px;padding:24px 22px 22px;position:relative;transform:rotate(-1.5deg);box-shadow:0 14px 30px -18px #38202073}.site .tape--write{margin-left:-30px;top:-9px;left:50%}.site .how-write__to{font-size:26px}.how-write__body{font:400 15px/1.65 var(--font-sans);margin:8px 0 0}.site .how-write__from{margin-top:12px;font-size:22px;font-style:italic}.how-spark{box-sizing:border-box;background:var(--color-dusk);border-radius:6px;width:214px;padding:14px 16px;position:absolute;bottom:0;right:8px;transform:rotate(3deg);box-shadow:0 14px 30px -18px #38202073}.how-spark__label{font:600 11px var(--font-sans);letter-spacing:.12em;text-transform:uppercase;margin:0}.site .how-spark__q{margin-top:4px;padding-right:44px;font-size:20px;line-height:1.15}.how-spark__sticker{width:40px;height:auto;position:absolute;bottom:10px;right:12px;transform:rotate(-8deg)}.how-kinds{flex-wrap:wrap;gap:8px;margin:16px 0 0;padding:0;list-style:none;display:flex}.how-kinds li{font:500 13px var(--font-sans);border-radius:999px;align-items:center;gap:6px;padding:7px 12px;display:inline-flex}.how-kinds svg{fill:none;width:16px;height:16px;stroke:var(--ee-ink);stroke-width:2px;stroke-linecap:round;stroke-linejoin:round}.how-capture{height:330px;margin-top:26px;position:relative}.how-capture__photo{width:160px;height:200px;top:6px;left:4px;transform:rotate(-5deg)}.site .tape--capture-photo{z-index:3;top:-9px;left:50px}.how-video{z-index:2;width:190px;position:absolute;top:64px;right:6px;transform:rotate(3deg)}.how-video__frame{background:var(--ee-bezel);border-radius:12px;height:136px;position:relative;overflow:hidden;box-shadow:0 22px 40px -20px #38202099}.how-video__frame picture,.how-video__frame img{object-fit:cover;width:100%;height:100%;display:block}.how-video__shade{background:linear-gradient(#0000 50%,#00000080);position:absolute;inset:0}.how-video__play{background:#fff8eef0;border-radius:50%;justify-content:center;align-items:center;width:46px;height:46px;margin:-23px 0 0 -23px;display:flex;position:absolute;top:50%;left:50%}.how-video__play svg,.how-voice__play svg{width:16px;height:16px}.how-video__play svg{fill:var(--color-chocolate)}.how-video__title{font:600 13px var(--font-sans);color:var(--color-cloud);position:absolute;bottom:10px;left:12px}.how-video__time{font:600 12px var(--font-sans);color:var(--color-cloud);background:#00000059;border-radius:999px;padding:2px 7px;position:absolute;bottom:9px;right:10px}.site .tape--capture-video{z-index:3;top:-9px;left:65px;transform:rotate(4deg)}.how-voice{z-index:3;position:absolute;bottom:12px;left:10px;right:10px;transform:rotate(-2deg)}.how-voice__card{background:var(--color-cotton-candy);border-radius:16px;align-items:center;gap:12px;padding:14px 16px;display:flex;position:relative;box-shadow:0 20px 40px -22px #38202080}.how-voice__play{background:var(--color-chocolate);border-radius:50%;flex:none;justify-content:center;align-items:center;width:44px;height:44px;display:flex}.how-voice__play svg{fill:var(--color-cotton-candy)}.how-voice__main{flex:1;min-width:0}.how-voice__title{font:600 13px var(--font-sans);margin:0 0 4px}.how-voice__wave{width:100%;height:24px;fill:var(--color-chocolate);display:block}.how-voice__time{font:600 13px var(--font-sans)}.site .tape--capture-voice{z-index:3;margin-left:-30px;top:-9px;left:50%;transform:rotate(-2deg)}.how-peek{height:330px;margin-top:26px;position:relative;overflow:hidden}.how-peek__device{box-sizing:border-box;background:var(--ee-bezel);border-radius:40px;width:230px;margin:0 auto;padding:7px;position:relative;box-shadow:0 30px 60px -28px #38202099}.how-peek__screen{border-radius:33px;width:100%;height:auto;display:block}.how-peek__fade{background:linear-gradient(transparent, var(--ee-page));height:90px;position:absolute;bottom:0;left:0;right:0}.how-hand{padding-bottom:56px}.how-hand__list{margin:20px 0 0;padding:0;list-style:none}.how-hand__era{border-top:1px solid color-mix(in srgb, var(--ee-ink) 10%, transparent);align-items:center;gap:12px;padding:14px 0;display:flex}.how-hand__era--last{border-bottom:1px solid color-mix(in srgb, var(--ee-ink) 10%, transparent)}.how-hand__face{width:44px;height:44px;box-shadow:0 0 0 2px var(--ee-page), 0 0 0 3px color-mix(in srgb, var(--ee-ink) 12%, transparent);border-radius:50%;flex:none;overflow:hidden}.how-hand__face picture,.how-hand__face img{object-fit:cover;width:100%;height:100%;display:block}.how-hand__who{flex:1;min-width:0}.site .how-hand__name{font-size:22px;font-weight:400;line-height:1.1;display:block}.how-hand__meta{font:400 13px var(--font-sans);color:var(--ee-ink-muted);margin-top:2px;display:block}.how-hand__now{background:var(--ee-primary);color:var(--ee-on-primary);font:600 12px var(--font-sans);white-space:nowrap;border-radius:999px;padding:5px 10px}.how-hand__handed{border-top:1px solid color-mix(in srgb, var(--ee-ink) 10%, transparent);font:600 13px var(--font-sans);color:var(--ee-accent);align-items:center;gap:12px;padding:10px 0 10px 56px;display:flex}.how-hand__handed svg{fill:none;width:16px;height:16px;stroke:var(--ee-accent);stroke-width:2px;stroke-linecap:round;stroke-linejoin:round}.site .band.how-close{text-align:center;margin-top:20px;padding:56px 0}.how-close__lead{font:400 16px/1.55 var(--font-sans);color:color-mix(in srgb, var(--ee-on-band-teal) 85%, transparent);text-wrap:balance;margin:14px 0 24px}
@media (min-width:600px){.how-lead{margin-top:18px;font-size:18px;line-height:1.6}.site .wrap.how-intro{text-align:center;padding-top:72px;padding-bottom:24px}.site .how-intro__title{margin-top:18px;font-size:72px;line-height:1.04}.how-intro__lead{max-width:580px;margin:22px auto 0;font-size:18px}.how-step{border-top:0;padding:72px 0}.how-step__wrap{position:relative}.how-step:not(.how-step--write) .how-step__wrap:before{content:"";border-top:1px dashed color-mix(in srgb, var(--ee-ink) 18%, transparent);position:absolute;top:-72px;left:32px;right:32px}.how-step__text{max-width:620px}.how-step__head{display:block}.how-step__num{font-size:80px;line-height:.8}.site .how-step__title{margin-top:8px;font-size:52px;line-height:1.05}.how-write{height:420px;margin-top:40px;padding-bottom:0}.how-write__letter{box-sizing:border-box;width:500px;margin:0;padding:34px 40px 30px;position:absolute;top:24px;left:24px;transform:rotate(-2deg);box-shadow:0 18px 40px -22px #38202073}.site .tape--write{margin-left:0;top:-11px;left:212px}.site .how-write__to{font-size:32px}.how-write__body{margin-top:12px;font-size:17px;line-height:1.7}.site .how-write__from{margin-top:16px;font-size:28px}.how-spark{width:250px;padding:22px 22px 20px;bottom:10px;right:20px;transform:rotate(4deg);box-shadow:0 18px 40px -22px #38202073}.how-spark__label{font-size:12px}.site .how-spark__q{margin-top:8px;padding-right:50px;font-size:24px}.how-spark__sticker{width:54px;bottom:12px;right:14px}.how-kinds{gap:10px;margin-top:24px}.how-kinds li{gap:8px;padding:9px 16px;font-size:15px}.how-capture{height:450px;margin-top:44px}.how-capture__photo{width:260px;height:316px;top:14px;left:30px}.site .tape--capture-photo{top:-11px;left:92px;transform:rotate(-3deg)}.how-video{width:340px;top:44px;right:30px}.how-video__frame{border-radius:14px;height:226px;box-shadow:0 26px 50px -24px #38202099}.how-video__shade{background:linear-gradient(#0000 55%,#00000073)}.how-video__play{width:60px;height:60px;margin:-30px 0 0 -30px}.how-video__title{bottom:12px;left:14px}.how-video__time{padding:3px 8px;bottom:12px;right:14px}.site .tape--capture-video{top:-11px;left:132px}.how-voice{width:390px;bottom:10px;left:190px;right:auto}.how-voice__card{gap:14px;padding:16px 18px}.how-voice__play{width:46px;height:46px}.site .tape--capture-voice{margin-left:0;top:-11px;left:157px}.how-step--choose .how-step__wrap,.how-step--open .how-step__wrap{align-items:center;gap:40px;display:grid}.how-step--choose .how-step__wrap{grid-template-columns:minmax(0,1fr) 320px}.how-step--open .how-step__wrap{grid-template-columns:320px minmax(0,1fr)}.how-step--open .how-peek{order:-1}.how-step--choose .how-step__text,.how-step--open .how-step__text{max-width:none}.how-peek{height:440px;margin-top:0;-webkit-mask-image:linear-gradient(#000 72%,#0000);mask-image:linear-gradient(#000 72%,#0000)}.how-peek__device{border-radius:48px;width:280px;padding:9px;box-shadow:0 24px 40px -24px #38202099}.how-peek__screen{border-radius:39px}.how-peek__fade{display:none}.how-hand{padding:72px 0 80px}.site .how-hand .section-title{margin-top:10px}.how-hand__list{margin-top:36px}.how-hand__era{gap:18px;padding:20px 0}.how-hand__face{width:60px;height:60px;box-shadow:0 0 0 3px var(--ee-page), 0 0 0 4px color-mix(in srgb, var(--ee-ink) 12%, transparent)}.site .how-hand__name{font-size:30px;line-height:1.05}.how-hand__meta{margin-top:3px;font-size:14px}.how-hand__now{padding:6px 12px;font-size:13px}.how-hand__handed{padding:12px 0 12px 78px;font-size:14px}.site .band.how-close{margin-top:28px;padding:80px 0}.site .how-close .section-title{font-size:56px;line-height:1}.how-close__lead{max-width:540px;font:400 18px/1.6 var(--font-sans);margin:18px auto 0}.how-close .invite-face{margin-top:32px}}@media (min-width:1024px){.how-lead{font-size:20px;line-height:1.55}.site .wrap.how-intro{max-width:900px}.site .how-intro__title{font-size:88px;line-height:.98}.how-intro__lead{max-width:620px;margin-top:24px}.how-step{padding:64px 0}.how-step:not(.how-step--write) .how-step__wrap:before{top:-64px;left:40px;right:40px}.how-step .how-step__wrap,.how-step--choose .how-step__wrap,.how-step--open .how-step__wrap{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:90px;display:grid}.how-step__text{max-width:none}.how-step__num{font-size:96px}.site .how-step__title{font-size:56px;line-height:1.04}.how-step--capture .how-capture,.how-step--open .how-peek{order:-1}.how-write{height:400px;margin-top:0}.how-write__letter{width:550px;left:30px}.site .tape--write{top:-12px;left:190px}.how-spark{width:284px;bottom:6px;right:0}.site .how-spark__q{padding-right:44px}.how-capture{height:440px;margin-top:0}.how-capture__photo{width:250px;height:304px;left:10px}.site .tape--capture-photo,.site .tape--capture-video,.site .tape--capture-voice{width:76px;height:22px;top:-12px}.site .tape--capture-photo{left:97px}.how-video{width:290px;top:50px;left:240px;right:auto}.how-video__frame{height:200px}.site .tape--capture-video{left:107px}.how-voice{width:360px;bottom:8px;left:90px}.site .tape--capture-voice{left:140px}.how-peek{-webkit-mask-image:none;mask-image:none}.how-peek__device{border-radius:50px;padding:10px;box-shadow:0 40px 80px -36px #382020a6}.how-peek__screen{border-radius:40px}.how-peek__fade{height:120px;display:block}.how-hand{padding-bottom:72px}.site .how-hand .section-title{font-size:56px;line-height:1.04}.how-hand__list{margin-top:0}.how-hand__era{gap:16px;padding:18px 0}.how-hand__face{width:56px;height:56px}.how-hand__handed{padding-left:72px}.site .band.how-close{margin-top:40px;padding:84px 0 92px}.site .how-close .section-title{font-size:64px}.how-close__lead{margin-top:20px;font-size:20px}.how-close .invite-face{margin-top:34px}}
.how-pin{display:none}@media (min-width:1024px){.motion-ready .how-steps{box-sizing:border-box;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:90px;max-width:1240px;margin:0 auto;padding:0 40px;display:grid;position:relative}.motion-ready .how-steps>.how-step{grid-column:1;align-items:center;min-height:72vh;padding:48px 0;display:flex}.motion-ready .how-steps .how-step__wrap,.motion-ready .how-steps .how-step--choose .how-step__wrap,.motion-ready .how-steps .how-step--open .how-step__wrap{max-width:none;margin:0;padding:0;display:block}.motion-ready .how-steps .how-step__wrap:before{top:-48px;left:0;right:0}.motion-ready .how-steps .how-write,.motion-ready .how-steps .how-capture,.motion-ready .how-steps .how-peek{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.motion-ready .how-pin{grid-area:1/2/span 4;justify-content:center;align-self:start;align-items:center;gap:28px;height:560px;display:flex;position:sticky;top:calc(50vh - 280px)}.how-pin__rail{flex-direction:column;gap:10px;display:flex}.how-pin__notch{background:var(--ee-rail);width:6px;height:44px;transition:background .3s var(--ease-settle);border-radius:3px}.how-steps[data-step="1"] .how-pin__notch[data-n="1"],.how-steps[data-step="2"] .how-pin__notch:is([data-n="1"],[data-n="2"]),.how-steps[data-step="3"] .how-pin__notch:is([data-n="1"],[data-n="2"],[data-n="3"]),.how-steps[data-step="4"] .how-pin__notch{background:var(--ee-accent)}.how-pin__screen{opacity:0;transition:opacity .3s var(--ease-settle)}.how-steps:not([data-step]) .how-pin__screen[data-n="1"],.how-steps[data-step="1"] .how-pin__screen[data-n="1"],.how-steps[data-step="2"] .how-pin__screen[data-n="2"],.how-steps[data-step="3"] .how-pin__screen[data-n="3"],.how-steps[data-step="4"] .how-pin__screen[data-n="4"]{opacity:1}.how-pin__letter{box-sizing:border-box;background:var(--color-sand);opacity:0;width:230px;transition:opacity .5s var(--ease-settle), transform .7s cubic-bezier(.34, 1.3, .64, 1);pointer-events:none;border-radius:6px;padding:20px 22px;position:absolute;bottom:60px;right:40px;transform:translate(-60px,40px)rotate(-6deg)scale(.86);box-shadow:0 18px 40px -22px #38202073}.how-steps[data-step="4"] .how-pin__letter{opacity:1;transform:translate(0)rotate(0)scale(1)}.site .how-pin__letter-to{font-size:26px;line-height:1.15}.how-pin__letter-body{font:400 15px/1.5 var(--font-sans);margin:8px 0 0}}
