/* One reversible timeline, driven entirely by scroll position. */
.experience.scroll-story{padding:0;height:270svh;overflow:visible;background:#e9eee7}
.story-pin{position:sticky;top:0;height:100svh;min-height:620px;padding:25px 6% 22px;display:flex;flex-direction:column;overflow:hidden}
.story-pin .section-top{flex:none;padding-bottom:13px;font-size:8px}.story-pin .section-top a{color:#536b57}
.story-heading{display:flex;justify-content:space-between;align-items:center;flex:none;padding:21px 0 4px}
.story-heading h2{font-size:clamp(35px,4.1vw,65px);line-height:.97}.story-heading h2>span{color:#7a8c7b}.story-heading em{font-style:normal;color:#244b32}
.story-heading>p{font-size:11px;line-height:1.8;color:#6a816b}.story-heading>p span{margin-left:20px}
.story-stage{position:relative;flex:1;min-height:0;width:100%;perspective:1300px;isolation:isolate}
.story-grid{position:absolute;inset:0;background:radial-gradient(#7d977a55 .7px,transparent .7px);background-size:20px 20px;mask-image:radial-gradient(ellipse,#000,transparent 70%);z-index:-1}
.story-feed{position:absolute;left:12%;top:20px;width:61%;max-width:630px;background:#fcfdfa;border:1px solid #bac5b7;border-radius:9px;box-shadow:0 25px 50px #30403116;overflow:hidden;transform-origin:30% 50%;will-change:transform,opacity}
.story-feed .post{padding:19px 23px}.story-feed .ghost-post{padding:13px 23px}.story-feed .contract{transition:none;background:#e8ede4;border-color:#b7c6b3;cursor:default}.story-feed .story-contract.is-detected{background:#bdeacb;border-color:#679976;box-shadow:0 0 0 5px #a0dcb225}
.story-panel{position:absolute;left:57%;top:15px;width:290px;padding:18px;background:#101612;color:#e5ede7;border:1px solid #486151;border-radius:10px;box-shadow:0 30px 60px #14291d35;transform-origin:0 50%;will-change:transform,opacity}
.story-panel .panel-bar{margin-bottom:15px}.story-panel .panel-address{margin:13px 0}.story-amount{display:flex;align-items:center;justify-content:space-between;background:#1b271f;border:1px solid #3f5846;border-radius:4px;padding:10px 12px}.story-amount small{font-size:8px;color:#91aa99;display:block}.story-amount b{font:400 29px var(--display);display:block;letter-spacing:-.05em}.story-amount strong{font-size:11px}
.story-quick{display:flex;gap:6px;margin:9px 0 16px}.story-quick>span{flex:1;text-align:center;border:1px solid #344d3b;border-radius:3px;padding:6px;color:#8da896;font-size:9px}.story-quick .is-chosen{background:var(--mint);color:#143522;border-color:var(--mint)}.story-buy,.story-confirm{display:flex;justify-content:space-between;align-items:center;background:var(--mint);color:#143522;border-radius:4px;padding:12px;font-size:11px;font-weight:600;margin-top:14px}.story-buy.is-pressed,.story-confirm.is-pressed{background:#7ccea0;box-shadow:inset 0 2px 5px #17462c35;transform:scale(.97)}
.story-approval{position:absolute;left:41%;top:22px;width:310px;background:#f5f9ef;border:1px solid #a6b8a1;padding:24px;text-align:center;border-radius:10px;box-shadow:0 25px 60px #1f40252a;will-change:transform,opacity}.approval-mark{display:grid;place-items:center;width:45px;height:45px;background:#d1e8d0;border-radius:50%;font-size:23px;margin:0 auto 15px}.story-approval>span{font-size:7px;letter-spacing:.15em;color:#5c775f}.story-approval h3{font:500 31px var(--display);letter-spacing:-.06em;margin:8px 0}.story-approval p{font-size:11px;color:#789077}.approval-amount{display:flex;justify-content:space-between;align-items:center;padding:17px 0 4px;font-size:8px;border-top:1px solid #d7e1d1;margin-top:20px}.approval-amount b{font-size:17px}.story-approval>small{font-size:8px;color:#789077;display:block;margin-top:13px}.story-confirm{background:#254d33;color:#e2f8e5}
.story-cursor{position:absolute;left:0;top:0;z-index:8;pointer-events:none;will-change:transform;filter:drop-shadow(0 3px 4px #0002)}.story-cursor svg{display:block;width:25px;height:31px;fill:#183523;stroke:#f0ffe9;stroke-width:1.7}.story-cursor span{position:absolute;top:25px;left:22px;background:#22472f;color:#daf4dc;border-radius:3px;padding:3px 8px;font-size:7px;letter-spacing:.06em}.story-cursor i{position:absolute;width:40px;height:40px;border:2px solid #426e4c;border-radius:50%;left:-17px;top:-17px;opacity:var(--click-alpha,0);transform:scale(var(--click-scale,.3))}
.story-bottom{position:relative;flex:none;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:20px;padding:16px 0 12px;border-top:1px solid #193e242c}.story-steps{display:flex;gap:7px}.story-steps button{background:none;border:0;color:#8b9d8a;padding:7px 11px;font-size:12px;white-space:nowrap}.story-steps button>span{font-size:8px;margin-right:9px}.story-steps button[aria-current=step]{color:#e9f6e6;background:#23452d;border-radius:3px}.story-bottom>p{font-size:11px;text-align:center;color:#52705a;margin:0}.story-disclaimer{font-size:7px;letter-spacing:.06em;color:#7f957e}.story-progress{position:absolute;bottom:0;height:2px;left:0;right:0;background:#b8cdb744}.story-progress i{display:block;width:100%;height:100%;background:#42674b;transform-origin:left;transform:scaleX(var(--story-progress,0))}
/* The same coin follows a curved route, then falls into the wallet pocket. */
.transfer-network{position:absolute;inset:0;will-change:opacity;pointer-events:none}.transfer-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:none}.branch{stroke:#6489663d;stroke-width:1;stroke-dasharray:3 8}.route-track{stroke:#7c9f7747;stroke-width:2}.route-light{stroke:#4c815b;stroke-width:2.5;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--route-progress,0));filter:drop-shadow(0 0 5px #71b18855)}
.source-node{position:absolute;left:16%;top:48%;translate:-50% -50%;text-align:center}.source-node>span{display:grid;place-items:center;width:75px;height:75px;background:#203b29;color:#e6f1df;border:1px solid #6b926c;border-radius:19px;font-size:38px;box-shadow:0 16px 40px #23462521}.source-node small,.routing-node small{display:block;font-size:8px;letter-spacing:.12em;margin-top:13px;white-space:nowrap;color:#6b876a}.routing-node{position:absolute;left:43%;top:25%;text-align:center;translate:-50% -50%}.routing-node>span{display:grid;place-items:center;width:41px;height:43px;background:#b5ddbc;border:1px solid #719f7b;border-radius:4px 14px 4px 4px;font:italic 600 27px var(--display);margin:auto;color:#2b5135}.routing-node small{font-size:7px}
.satellite{position:absolute;display:grid;place-items:center;width:33px;height:33px;border:1px solid #87a68555;color:#829d7d;border-radius:50%;font-size:20px}.satellite-a{left:7%;top:15%}.satellite-b{left:17%;top:80%}.satellite-c{right:7%;top:12%}
.balance-wallet{position:absolute;left:64%;top:31%;width:27%;max-width:260px;height:250px;padding:20px;background:#f3f8ed;border:1px solid #adc4a5;border-radius:12px;box-shadow:0 26px 45px #36563d20;transform:translateY(var(--wallet-bounce,0px));will-change:transform}.balance-head{display:flex;justify-content:space-between;font-size:8px;letter-spacing:.09em;color:#5b7f61;margin-bottom:14px}.balance-head>b{font-size:13px}.balance-wallet>small{font-size:7px;letter-spacing:.08em;color:#97aa90}.balance-wallet>strong{display:block;font:500 30px var(--display);letter-spacing:-.05em;color:#2b4e34}.balance-gain{font-size:9px;color:#487b54;opacity:var(--landed,0);transform:translateY(calc((1 - var(--landed,0))*8px));margin-top:4px}.balance-gain>span{float:right}.coin-pocket{position:absolute;left:15px;right:15px;bottom:12px;height:78px;perspective:500px}.pocket-front{position:absolute;left:-3px;right:-3px;bottom:-1px;height:34px;background:linear-gradient(130deg,#dae9d2,#c0d7b7);border:1px solid #a4be99;border-radius:5px 5px 8px 8px;box-shadow:0 -2px 12px #315b2d0d;z-index:3}.pocket-coin{position:absolute;bottom:9px;width:50px;height:50px;display:grid;place-items:center;border:2px solid #8baa7c;background:linear-gradient(125deg,#f2ffe6,#bedaa7 45%,#8fab76);box-shadow:inset 0 0 0 3px #e6f1d6,3px 3px 0 #7c9c6e;color:#527249;border-radius:50%;font:normal 25px var(--display);transform:rotate(-17deg);z-index:1}.pocket-one{left:3%}.pocket-two{left:28%;bottom:20px;transform:rotate(12deg)}.pocket-three{right:1%;bottom:14px;transform:rotate(20deg)}.pocket-new{left:53%;bottom:25px;opacity:var(--landed,0);transform:rotate(-12deg);z-index:2}
.travelling-coin{position:absolute;left:0;top:0;width:52px;height:52px;display:grid;place-items:center;background:linear-gradient(125deg,#f1ffe6,#bddda5 50%,#88a96f);border:2px solid #779766;border-radius:50%;box-shadow:inset 0 0 0 4px #e5f9d3,4px 4px 0 #789567,0 12px 20px #45623522;color:#3e673c;font:500 30px var(--display);will-change:transform;z-index:4}.travelling-coin:before{content:'';position:absolute;right:100%;top:40%;width:90px;height:2px;background:linear-gradient(90deg,transparent,#6888578c);opacity:var(--trail,0);transform-origin:right}.landing-ring{position:absolute;width:90px;height:30px;border:1px solid #5a9c62;border-radius:50%;opacity:var(--ring-alpha,0);transform:translate(-50%,-50%) scale(var(--ring-scale,1));z-index:5}.network-caption{position:absolute;left:30%;bottom:5%;font:400 10px/1.8 var(--body);letter-spacing:.1em;color:#7b9878}.network-caption b{font-size:14px;color:#4b714f;font-weight:500}
@media(min-width:1500px){.story-pin{padding-left:10%;padding-right:10%}.story-panel{width:320px}.story-feed .post{padding-top:25px;padding-bottom:25px}}
@media(max-width:900px){.story-bottom{grid-template-columns:auto 1fr;gap:8px}.story-disclaimer{grid-column:2;text-align:right}.story-bottom>p{text-align:right;font-size:10px}.story-steps{grid-row:1/3}.story-steps button{padding:7px;font-size:10px}.story-steps button>span{margin-right:5px}.story-panel{left:52%;width:270px}.story-feed{left:3%;width:70%}.story-approval{left:35%;width:280px}.balance-wallet{width:30%;left:61%;padding:16px}.balance-wallet>strong{font-size:25px}}
@media(max-width:600px){.experience.scroll-story{height:250svh}.story-pin{min-height:570px;padding:18px 6%}.story-pin .section-top{font-size:6px;padding-bottom:12px}.story-heading{padding:22px 0 13px}.story-heading h2{font-size:37px}.story-heading>p{font-size:8px;text-align:right;max-width:100px}.story-heading>p span{display:block}.story-feed{left:1%;top:22px;width:98%;transform-origin:25% 50%}.story-feed .post{padding:15px 12px;font-size:10px}.story-feed .ghost-post{padding:12px}.story-feed .post small{font-size:7px}.story-feed .feed-title{padding:12px;gap:55px;font-size:10px}.story-feed .contract{font-size:10px;padding:8px}.story-feed .avatar{width:24px;height:24px;font-size:13px}.story-panel{left:20%;top:12px;width:76%;max-width:285px;padding:14px}.story-panel .panel-asset strong{font-size:13px}.story-panel .panel-bar{margin-bottom:12px}.story-amount b{font-size:25px}.story-quick{margin-bottom:12px}.story-approval{left:13%;top:20px;width:80%;padding:20px}.story-approval h3{font-size:29px}.story-cursor svg{width:20px;height:25px}.story-cursor span{font-size:6px;top:23px;left:16px}.story-bottom{grid-template-columns:1fr;gap:9px;padding-top:10px}.story-steps{grid-row:auto;justify-content:space-between}.story-steps button{font-size:10px;padding:7px 9px}.story-bottom>p{font-size:10px;text-align:left;margin:0}.story-disclaimer{grid-column:1;text-align:left;font-size:6px;letter-spacing:.07em}.source-node{left:13%}.source-node>span{width:45px;height:45px;border-radius:11px;font-size:26px}.source-node small{font-size:6px}.routing-node{left:41%;top:20%}.routing-node>span{width:30px;height:32px;font-size:21px}.routing-node small{font-size:5px}.balance-wallet{left:53%;top:29%;width:45%;height:207px;padding:13px;border-radius:9px}.balance-head{font-size:6px;margin-bottom:14px}.balance-wallet>small{font-size:6px}.balance-wallet>strong{font-size:24px}.balance-gain{font-size:8px}.coin-pocket{left:8px;right:8px;bottom:9px;height:70px}.pocket-coin{width:35px;height:35px;font-size:19px;border-width:1px;box-shadow:inset 0 0 0 2px #e6f1d6,2px 2px 0 #7c9c6e}.pocket-new{left:49%;bottom:26px}.pocket-front{height:26px}.travelling-coin{width:37px;height:37px;font-size:23px;border-width:1px;box-shadow:inset 0 0 0 3px #e5f9d3,3px 3px 0 #789567,0 9px 15px #45623522}.satellite{width:25px;height:25px;font-size:16px}.network-caption{left:12%;bottom:6%;font-size:7px}.network-caption b{font-size:11px}}
@media(max-height:690px) and (min-width:601px){.story-pin{min-height:530px;padding-top:16px;padding-bottom:14px}.story-heading{padding:13px 0 0}.story-heading h2{font-size:35px}.story-panel{scale:.86;transform-origin:top left}.story-feed{scale:.86;transform-origin:top left}.story-approval{scale:.85;transform-origin:top left}.balance-wallet{height:210px}.story-bottom{padding-top:9px;padding-bottom:8px}.story-bottom>p{max-width:200px}}
.story-reduced .experience.scroll-story{height:auto}.story-reduced .story-pin{position:relative;height:850px;max-height:none}.story-reduced .story-cursor{display:none}
@media(prefers-reduced-motion:reduce){.experience.scroll-story{height:auto}.story-pin{position:relative;height:850px}.story-cursor{display:none}}