.ew{--ink:#27233c;--paper:#edece8;--white:#fcfcfb;--line:#e1e0dc;--muted:#616069;--orange:#eb7a3d;--orange-ink:#b3541a;--green:#136b4b;--ease:cubic-bezier(.2, .75, .15, 1)}.ew-ph{background:#ededec;border-radius:5px;height:10px;display:block}.ew-box{width:100%;height:calc(380px * var(--s,1));position:relative}.ew-stage{width:460px;height:380px;translate:-50%;scale:var(--s,1);transform-origin:50% 0;--house:var(--orange);--on-house:var(--ink);--tk-font:var(--font-lexend);position:absolute;top:0;left:50%}.ew-tk{filter:drop-shadow(0 26px 26px #27233c38);transform-origin:0 100%;width:340px;height:170px;transition:transform .9s var(--ease), opacity .6s ease;position:absolute;top:110px;left:60px}.ew-main{background:var(--white);color:var(--ink);border-radius:14px;flex-direction:column;gap:6px;padding:16px 18px;display:flex;position:absolute;inset:0 104px 0 0;-webkit-mask:radial-gradient(10px at 100% 0,#0000 97%,#000) top/100% 51% no-repeat,radial-gradient(10px at 100% 100%,#0000 97%,#000) bottom/100% 51% no-repeat;mask:radial-gradient(10px at 100% 0,#0000 97%,#000) top/100% 51% no-repeat,radial-gradient(10px at 100% 100%,#0000 97%,#000) bottom/100% 51% no-repeat}.ew-stub{background:var(--house);width:104px;height:170px;color:var(--on-house);border-left:2px dashed #27233c40;border-radius:14px;place-items:center;transition:background-color .5s,color .5s;display:grid;position:absolute;top:0;right:0;-webkit-mask:radial-gradient(10px at 0 0,#0000 97%,#000) top/100% 51% no-repeat,radial-gradient(10px at 0 100%,#0000 97%,#000) bottom/100% 51% no-repeat;mask:radial-gradient(10px at 0 0,#0000 97%,#000) top/100% 51% no-repeat,radial-gradient(10px at 0 100%,#0000 97%,#000) bottom/100% 51% no-repeat}.ew-line{min-height:1em;position:relative}.ew-line .ew-ph{transition:opacity .3s ease var(--d,0s);position:absolute;inset:50% auto auto 0;translate:0 -50%}.ew-tx{white-space:nowrap;clip-path:inset(0 100% 0 0);display:block}.ew-l1{color:var(--muted);font-size:11px}.ew-l2{font-family:var(--tk-font);letter-spacing:-.02em;font-size:22px;font-weight:700;line-height:1.15}.ew-l3{font-size:13px}.ew-l4{color:var(--muted);margin-top:auto;font-size:12px}.ew-stage[data-written=true] .ew-tx{animation:ew-type .7s steps(18, end) var(--d,0s) both}.ew-stage[data-written=true] .ew-line .ew-ph{opacity:0}@keyframes ew-type{to{clip-path:inset(0)}}.ew-chip{white-space:nowrap;background:var(--white);color:var(--ink);opacity:0;transition:opacity .4s ease, translate .5s var(--ease);border-radius:999px;align-items:center;gap:8px;padding:8px 12px;font-size:13px;font-weight:600;display:inline-flex;position:absolute;translate:0 8px;box-shadow:0 14px 30px -14px #27233c73}.ew-cap{text-align:center;opacity:0;font-size:13px;transition:opacity .4s;position:absolute;top:300px;left:0;right:0}.ew-src{background:var(--white);width:250px;color:var(--ink);opacity:0;transition:opacity .4s ease, translate .6s var(--ease);border-radius:12px;padding:10px 12px;font-size:11.5px;position:absolute;top:0;left:20px;translate:0 -10px;box-shadow:0 18px 34px -20px #27233c80}.ew-src-row{border-top:1px solid var(--line);justify-content:space-between;gap:8px;padding:4px 0;display:flex}.ew-src-row:first-of-type{border-top:0}.ew-src-row.is-hot{color:var(--orange-ink);font-weight:600}.ew-stage[data-step="1"] .ew-src,.ew-stage[data-step="1"] .ew-cap-src{opacity:1;translate:0}.ew-swatches{opacity:0;justify-content:center;gap:10px;transition:opacity .4s;display:flex;position:absolute;top:304px;left:0;right:0}.ew-swatches span{outline-offset:3px;border-radius:999px;outline:2px solid #0000;width:18px;height:18px;transition:outline-color .3s}.ew-swatches span.is-on{outline-color:currentColor}.ew-stage[data-step="2"] .ew-swatches{opacity:1}.ew-pay{top:52px;left:150px}.ew-pay b{color:var(--green)}.ew-env{background:var(--white);opacity:0;border-radius:8px;width:180px;height:110px;position:absolute;top:200px;left:140px;box-shadow:inset 0 0 0 1.5px #cecdd8,0 20px 30px -18px #27233c80}.ew-env:before,.ew-env:after{content:"";border-radius:8px;position:absolute;inset:0}.ew-env:after{background:linear-gradient(to top right,#0000 calc(50% - 1px),#cecdd8 50%,#0000 calc(50% + 1px)) 0 100%/50% 60% no-repeat,linear-gradient(to top left,#0000 calc(50% - 1px),#cecdd8 50%,#0000 calc(50% + 1px)) 100% 100%/50% 60% no-repeat}.ew-env:before{clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:50% 0;z-index:1;background:#f5f5f3;bottom:40%;transform:rotateX(180deg);box-shadow:inset 0 0 0 1.5px #cecdd8}.ew-mailbox{opacity:0;width:92px;height:150px;transition:opacity .4s;position:absolute;top:196px;left:352px}.ew-mailbox-body{background:var(--ink);border-radius:46px 46px 10px 10px;position:absolute;inset:0 0 46px}.ew-mailbox-body:before{content:"";background:#151320;border-radius:4px;height:7px;position:absolute;top:34px;left:18px;right:18px}.ew-mailbox-post{background:#82818a;width:12px;height:48px;position:absolute;bottom:0;left:40px}.ew-flag{background:var(--orange);transform-origin:50% 100%;border-radius:3px;width:8px;height:46px;position:absolute;top:38px;right:-14px;transform:rotate(90deg)}.ew-flag:after{content:"";background:var(--orange);border-radius:2px;width:22px;height:14px;position:absolute;top:0;left:0}.ew-inbox{top:150px;left:296px}.ew-stage[data-step="3"] .ew-pay{opacity:1;translate:0}.ew-stage[data-step="3"] .ew-mailbox{opacity:1}.ew-stage[data-step="3"] .ew-tk{animation:ew-post 1.1s var(--ease) 1s both}.ew-stage[data-step="3"] .ew-env{animation:ew-env 3.4s var(--ease) .5s both}.ew-stage[data-step="3"] .ew-env:before{animation:3.4s .5s both ew-flap}.ew-stage[data-step="3"] .ew-flag{animation:ew-flag .5s var(--ease) 3.6s both}.ew-stage[data-step="3"] .ew-inbox{animation:ew-pop .4s var(--ease) 3.8s both}@keyframes ew-post{to{opacity:0;transform:translate(92px,98px)scale(.42)}}@keyframes ew-env{0%{opacity:0;transform:translateY(30px)}14%,62%{opacity:1;transform:none}88%{opacity:1;transform:translate(214px,-38px)scale(.36)}to{opacity:0;transform:translate(218px,-40px)scale(.3)}}@keyframes ew-flap{0%,50%{transform:rotateX(180deg)}60%,to{transform:rotateX(0)}}@keyframes ew-flag{to{transform:rotate(0)}}@keyframes ew-pop{0%{opacity:0;translate:0 8px;scale:.92}to{opacity:1;translate:0;scale:1}}.ew-scan{opacity:0;pointer-events:none;--c:var(--orange);background:linear-gradient(var(--c), var(--c)) 0 0 / 22px 3px no-repeat, linear-gradient(var(--c), var(--c)) 0 0 / 3px 22px no-repeat, linear-gradient(var(--c), var(--c)) 100% 0 / 22px 3px no-repeat, linear-gradient(var(--c), var(--c)) 100% 0 / 3px 22px no-repeat, linear-gradient(var(--c), var(--c)) 0 100% / 22px 3px no-repeat, linear-gradient(var(--c), var(--c)) 0 100% / 3px 22px no-repeat, linear-gradient(var(--c), var(--c)) 100% 100% / 22px 3px no-repeat, linear-gradient(var(--c), var(--c)) 100% 100% / 3px 22px no-repeat;width:120px;height:190px;position:absolute;top:100px;left:288px}.ew-scan:after{content:"";background:var(--orange);opacity:0;height:2px;position:absolute;top:10px;left:8px;right:8px;box-shadow:0 0 14px 3px #eb7a3db3}.ew-ok{top:306px;left:120px}.ew-ok b{background:var(--green);width:20px;height:20px;color:var(--white);border-radius:999px;place-items:center;font-size:12px;display:inline-grid}.ew-count{opacity:0;font-size:13px;font-weight:600;position:absolute;top:40px;left:60px}.ew-stage[data-step="4"] .ew-scan{animation:.3s .2s both ew-pop}.ew-stage[data-step="4"] .ew-scan:after{animation:1.1s ease-in-out .5s 2 both ew-sweep}.ew-stage[data-step="4"] .ew-ok{animation:ew-pop .4s var(--ease) 2.7s both}.ew-stage[data-step="4"] .ew-stub{animation:ew-tear .9s var(--ease) 3.1s both}.ew-stage[data-step="4"] .ew-count{animation:ew-pop .4s var(--ease) 3.5s both}@keyframes ew-sweep{0%{opacity:1;top:10px}50%{top:176px}to{opacity:0;top:10px}}@keyframes ew-tear{to{transform:translate(22px,40px)rotate(10deg)}}.ew-chart{background:var(--white);width:270px;color:var(--ink);opacity:0;transition:opacity .5s ease .2s, translate .6s var(--ease) .2s;border-radius:14px;padding:14px 16px 12px;font-size:11.5px;position:absolute;top:24px;left:176px;translate:0 10px;box-shadow:0 24px 40px -24px #27233c80}.ew-bars{border-bottom:1px solid var(--line);align-items:flex-end;gap:14px;height:120px;margin:12px 0 8px;display:flex}.ew-bar{flex-direction:column;flex:1;justify-content:flex-end;align-items:center;gap:4px;height:100%;font-weight:600;display:flex}.ew-bar i{background:var(--orange);transform-origin:50% 100%;border-radius:6px 6px 0 0;width:100%;display:block;transform:scaleY(0)}.ew-bar span{opacity:0}.ew-stage[data-step="5"] .ew-chart{opacity:1;translate:0}.ew-stage[data-step="5"] .ew-bar i{animation:ew-grow .9s var(--ease) var(--d) both}.ew-stage[data-step="5"] .ew-bar span{animation:ew-pop .3s ease calc(var(--d) + .6s) both}.ew-stage[data-step="5"] .ew-tk{opacity:.9;transform:translate(-44px,70px)scale(.5)}.ew-stage[data-step="5"] .ew-stub{animation:ew-fly 1s var(--ease) .3s both}@keyframes ew-grow{to{transform:scaleY(1)}}@keyframes ew-fly{0%{transform:translate(22px,40px)rotate(10deg)}to{opacity:0;transform:translate(120px,-150px)rotate(0)scale(.3)}}.ew-dark{color:#d8d7de}.ew-thread path{fill:none;stroke-linecap:round}.ew-rider{z-index:3;pointer-events:none;filter:drop-shadow(0 6px 10px #27233c59);will-change:transform;width:44px;height:34px;margin:-17px 0 0 -22px;position:absolute;top:0;left:0}@media not (min-width:64rem){.ew-rider{scale:.6}}.ew-tear{touch-action:pan-y;-webkit-user-select:none;user-select:none;transition:transform .25s var(--ease)}.ew-tear[data-dragging=true]{transition:none}.ew-tear[data-torn=true]{animation:.9s cubic-bezier(.5,0,.75,0) both ew-fall}@keyframes ew-fall{to{opacity:0;transform:translate(60px,260px)rotate(24deg)}}.ew-grip{animation:2.8s ease-in-out 1.5s infinite ew-nudge}@keyframes ew-nudge{0%,70%,to{translate:0}80%{translate:8px}90%{translate:0}}@media (prefers-reduced-motion:reduce){.ew *,.ew :before,.ew :after{transition:none!important;animation:none!important}.ew-tx{clip-path:none}.ew-stage:not([data-written=true]) .ew-tx{visibility:hidden}.ew-stage[data-step="3"] .ew-tk{opacity:0}.ew-stage[data-step="3"] .ew-flag{transform:none}.ew-stage[data-step="3"] .ew-inbox,.ew-stage[data-step="4"] .ew-scan,.ew-stage[data-step="4"] .ew-ok,.ew-stage[data-step="4"] .ew-count{opacity:1;translate:0}.ew-stage[data-step="4"] .ew-stub{transform:translate(22px,40px)rotate(10deg)}.ew-stage[data-step="5"] .ew-stub{opacity:0}.ew-stage[data-step="5"] .ew-bar i{transform:none}.ew-stage[data-step="5"] .ew-bar span{opacity:1}.ew-rider{display:none}}
