#tokenomics.blueprint-directed .token-left>h2{overflow:visible}
.blueprint-line{display:block}
#tokenomics.blueprint-directed:not(.blueprint-arrived) .blueprint-line{clip-path:inset(0 0 100% 0);translate:0 15px}
#tokenomics.blueprint-arrived .blueprint-line{animation:blueprint-copy 1s cubic-bezier(.16,1,.3,1) calc(var(--line)*.18s) both}
#tokenomics .supply{position:relative;isolation:isolate}
.supply-trace{position:absolute;inset:-1px;width:calc(100% + 2px);height:calc(100% + 2px);pointer-events:none}
.supply-trace rect{fill:none;stroke:#e6c67b;stroke-width:1;vector-effect:non-scaling-stroke;stroke-dasharray:100;stroke-dashoffset:100}
.blueprint-arrived .supply-trace rect{animation:blueprint-border 1.5s .35s ease-out forwards}
#tokenomics .supply strong{position:relative;animation:none!important;white-space:nowrap}
#tokenomics .supply strong:after{content:attr(data-supply);position:absolute;inset:0;pointer-events:none;color:transparent;background:linear-gradient(110deg,transparent 35%,#fff3cbcc 48%,transparent 61%);background-size:280% 100%;background-position:150% 0;background-clip:text;-webkit-background-clip:text;opacity:0}
#tokenomics.blueprint-arrived .supply strong:after{animation:supply-glint 1.5s 1s ease-in-out both}
#donut.blueprint-donut{background:none;box-shadow:none;width:min(290px,88%);margin-bottom:28px;isolation:isolate}
#donut.blueprint-donut:after{display:none}
.blueprint-chart{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.allocation-arc{fill:none;stroke:var(--arc-color);stroke-width:18;stroke-linecap:butt;stroke-dasharray:1;stroke-dashoffset:0;cursor:pointer;transition:stroke-width .3s,filter .3s,opacity .3s;outline:none;pointer-events:stroke}
.allocation-arc.is-active{stroke-width:24;filter:drop-shadow(0 0 5px color-mix(in srgb,var(--arc-color) 35%,transparent))}
.allocation-arc:focus-visible{stroke-width:26;filter:drop-shadow(0 0 7px var(--arc-color))}
#tokenomics:not(.blueprint-arrived) .allocation-arc{stroke-dashoffset:1}
.blueprint-arrived .allocation-arc{animation:blueprint-arc var(--arc-duration) var(--arc-delay) linear both}
#donut.blueprint-donut>div{position:absolute;inset:45px;justify-content:center;pointer-events:none;gap:5px}
#donut.blueprint-donut strong{font-size:clamp(60px,6vw,78px);line-height:1}
#donut .allocation-tokens{font:600 12px/1.5 'DM Sans',sans-serif;color:#d5c18b;letter-spacing:0;text-transform:none;margin-top:2px;text-align:center}
.blueprint-chart-hint{text-align:center;font:500 7px/1.6 'DM Sans',sans-serif;letter-spacing:.12em;color:#90a68e;margin:-10px 0 22px}
#tokenomics .allocation-row{transition:background .3s,border-color .3s,box-shadow .3s}
#tokenomics .allocation-row:focus-visible{outline:2px solid #dfc178;outline-offset:3px}
#tokenomics.blueprint-arrived .allocation-row{animation:blueprint-row .8s calc(.3s + var(--row)*.13s) both}
@keyframes blueprint-copy{from{clip-path:inset(0 0 100% 0);translate:0 15px}to{clip-path:inset(0);translate:0 0}}
@keyframes blueprint-border{to{stroke-dashoffset:0}}
@keyframes blueprint-arc{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes blueprint-row{from{opacity:.2;translate:0 10px}to{opacity:1;translate:0 0}}
@keyframes supply-glint{0%{background-position:150% 0;opacity:0}20%{opacity:1}80%{opacity:1}100%{background-position:-80% 0;opacity:0}}
html[data-hero-animation=off] #tokenomics.blueprint-directed *,html[data-hero-animation=off] #tokenomics.blueprint-directed strong:after{animation:none!important;transition:none!important}
html[data-hero-animation=off] #tokenomics .blueprint-line{clip-path:none!important;translate:none!important}
html[data-hero-animation=off] #tokenomics .allocation-arc,html[data-hero-animation=off] #tokenomics .supply-trace rect{stroke-dashoffset:0!important}
@media(max-width:560px){#donut.blueprint-donut{width:min(270px,90%)}#donut .allocation-tokens{font-size:11px}.blueprint-chart-hint{font-size:6px}#tokenomics .supply strong{font-size:clamp(40px,10.8vw,63px)}}
@media(prefers-reduced-motion:reduce){#tokenomics.blueprint-directed *,#tokenomics.blueprint-directed strong:after{animation:none!important;transition:none!important}#tokenomics .blueprint-line{clip-path:none!important;translate:none!important}#tokenomics .allocation-arc,#tokenomics .supply-trace rect{stroke-dashoffset:0!important}}
#tokenomics .blueprint-chart-hint{font:500 7px/1.7 'DM Sans',sans-serif;letter-spacing:.12em;color:#90a68e;margin:-6px 0 22px;text-align:center}
.blueprint-announcement{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@media(max-width:560px){#tokenomics .blueprint-chart-hint{font-size:6px;letter-spacing:.08em}}