/* Bources — app shell. Loads after /styles.css and reuses its tokens + components. */

:root{
  --r-lg:20px;      /* panels, tiles */
  --r-md:14px;      /* fields, buttons, inner blocks */
  --r-sm:10px;
  --r-xs:8px;
  --iris-1:#9a74ff; /* the iridescent set — all within the brand violet */
  --iris-2:#5f8cff;
  --iris-3:#d684ff;
}
@property --ang{syntax:"<angle>";initial-value:0deg;inherits:false}

/* ───────── shell ───────── */
html.app,html.app body{overflow-x:hidden}
body.app{min-height:100vh;min-height:100svh;background:var(--ink)}

/* ───────── living background ───────── */
.a-bg{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;background:var(--ink);animation:aIris 26s ease-in-out infinite}
.a-bg i{position:absolute;display:block;border-radius:50%;filter:blur(72px);mix-blend-mode:screen;will-change:transform}
.a-bg .b1{width:78vmax;height:78vmax;left:-20vmax;top:-34vmax;background:radial-gradient(closest-side,rgba(255,90,31,.34),rgba(255,90,31,.08) 58%,transparent 76%);animation:aDrift1 52s ease-in-out infinite alternate}
.a-bg .b2{width:62vmax;height:62vmax;right:-22vmax;top:-18vmax;background:radial-gradient(closest-side,rgba(95,140,255,.26),rgba(95,140,255,.06) 58%,transparent 76%);animation:aDrift2 64s ease-in-out infinite alternate}
.a-bg .b3{width:70vmax;height:70vmax;left:10vmax;bottom:-34vmax;background:radial-gradient(closest-side,rgba(255,90,31,.28),rgba(255,90,31,.05) 58%,transparent 76%);animation:aDrift3 58s ease-in-out infinite alternate}
.a-bg .b4{width:44vmax;height:44vmax;right:2vmax;bottom:-24vmax;background:radial-gradient(closest-side,rgba(120,225,190,.14),transparent 70%);animation:aDrift4 71s ease-in-out infinite alternate}
.a-bg .veil{position:absolute;inset:0;border-radius:0;filter:none;mix-blend-mode:normal;background:radial-gradient(150% 100% at 50% 0%,transparent 46%,rgba(6,6,9,.5) 74%,rgba(6,6,9,.84))}
.a-bg .grain{position:absolute;inset:0;border-radius:0;filter:none;mix-blend-mode:overlay;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}

@keyframes aIris{0%,100%{filter:hue-rotate(-16deg) saturate(1)}50%{filter:hue-rotate(18deg) saturate(1.18)}}
@keyframes aDrift1{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(16vw,10vh,0) scale(1.16)}}
@keyframes aDrift2{0%{transform:translate3d(0,0,0) scale(1.08)}100%{transform:translate3d(-14vw,16vh,0) scale(.92)}}
@keyframes aDrift3{0%{transform:translate3d(0,0,0) scale(.95)}100%{transform:translate3d(-12vw,-14vh,0) scale(1.14)}}
@keyframes aDrift4{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(-18vw,-8vh,0) scale(1.2)}}

.a-shell{position:relative;z-index:1;display:grid;grid-template-rows:auto 1fr auto;min-height:100vh;min-height:100svh}

/* ───────── top bar ───────── */
.a-top{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:clamp(12px,2.4vw,32px);height:56px;padding-inline:var(--g);border-bottom:1px solid var(--line);background:rgba(255,255,255,.9);-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4)}
.a-brand{display:inline-flex;align-items:center;gap:10px;font-size:12px;font-weight:400;letter-spacing:.42em;text-transform:uppercase;text-decoration:none;white-space:nowrap}
.a-brand .a-back{font:400 13px/1 var(--f-mono);letter-spacing:0;color:var(--pearl-3);transition:color .25s,transform .25s var(--ease)}
.a-brand:hover .a-back{color:var(--pearl);transform:translateX(-3px)}

.a-nav{display:flex;align-items:center;gap:2px;min-width:0;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}
.a-nav::-webkit-scrollbar{display:none}
.a-nav a{flex:none;padding:7px 9px;border:1px solid transparent;border-radius:999px;font:400 11px/1 var(--f-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--pearl-3);text-decoration:none;white-space:nowrap;transition:color .25s,border-color .25s,background .25s}
.a-nav a:hover{color:var(--pearl)}
.a-nav a[aria-current="page"]{color:var(--pearl);border-color:var(--line-2);background:rgba(14,14,16,.06)}

.a-right{display:flex;align-items:center;gap:12px}
.a-badge{display:inline-flex;align-items:center;gap:7px;padding:5px 10px;border:1px solid var(--line);border-radius:999px;font:400 10px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--pearl-3);white-space:nowrap}
.a-badge i{width:5px;height:5px;border-radius:50%;background:var(--lilac);animation:aPing 2.6s ease-out infinite}
@keyframes aPing{0%{box-shadow:0 0 0 0 rgba(255,90,31,.5)}80%,100%{box-shadow:0 0 0 7px rgba(255,90,31,0)}}
.a-connect{flex:none;padding:9px 16px;border:1px solid var(--line-2);border-radius:999px;background:rgba(14,14,16,.06);color:var(--pearl);font:400 12px/1 var(--f-sans);letter-spacing:.06em;white-space:nowrap;cursor:pointer;transition:background .3s,color .3s,border-color .3s,letter-spacing .5s var(--ease)}
.a-connect:hover{background:var(--pearl);color:var(--ink);border-color:var(--pearl)}
.a-connect.is-soon,.a-connect.is-soon:hover{background:rgba(255,90,31,.09);color:var(--pearl);border-color:rgba(255,90,31,.6);letter-spacing:.16em}

/* ───────── page body ───────── */
.a-main{width:100%;max-width:1180px;margin-inline:auto;padding:clamp(26px,4.4vh,46px) var(--g) 56px}
.a-view{display:none}
.a-view.is-on{display:block;animation:aIn .55s var(--ease)}
@keyframes aIn{from{opacity:0;transform:translateY(12px)}}

.a-head{display:grid;gap:10px;margin-bottom:clamp(22px,3.4vh,34px)}
.a-head h1{margin:0;font-size:clamp(28px,3.4vw,46px);font-weight:200;line-height:1.05;letter-spacing:-.01em;text-transform:uppercase}
.a-head p{margin:0;max-width:38em;font-size:var(--fs-s);font-weight:300;line-height:1.4;color:var(--pearl-2);text-wrap:pretty}

/* ───────── hub tiles ───────── */
.a-hub{display:grid;grid-template-columns:repeat(auto-fill,minmax(232px,1fr));gap:14px}

.a-tile{position:relative;display:flex;flex-direction:column;min-height:214px;border-radius:var(--r-lg);background:var(--ink-2);color:inherit;text-decoration:none;overflow:hidden;isolation:isolate;transition:transform .55s var(--ease),box-shadow .55s var(--ease)}
.a-tile:hover{transform:translateY(-4px);box-shadow:0 20px 44px -22px rgba(255,90,31,.55)}

/* hairline that becomes a running iridescent edge on hover */
.a-tile::before{content:"";position:absolute;inset:0;z-index:3;border-radius:inherit;padding:1px;background:linear-gradient(160deg,rgba(14,14,16,.18),rgba(14,14,16,.05) 45%,rgba(14,14,16,.12));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;pointer-events:none}
.a-tile::after{content:"";position:absolute;inset:0;z-index:3;border-radius:inherit;padding:1px;background:conic-gradient(from var(--ang),transparent 0deg,var(--iris-1) 40deg,var(--iris-3) 80deg,var(--iris-2) 120deg,transparent 190deg,transparent 360deg);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;opacity:0;pointer-events:none;transition:opacity .45s}
.a-tile:hover::after,.a-tile:focus-visible::after{opacity:.9;animation:aSpin 3.6s linear infinite}
@keyframes aSpin{to{--ang:360deg}}

.a-tile .arr{position:absolute;z-index:4;top:14px;right:16px;color:var(--pearl-3);transition:transform .35s var(--ease),color .3s}
.a-tile:hover .arr{color:var(--pearl)}

/* art band */
.a-art{position:relative;flex:1;min-height:104px;display:grid;place-items:center;overflow:hidden;background:radial-gradient(105% 130% at 50% 120%,rgba(255,90,31,.17),transparent 62%)}
.a-art::after{content:"";position:absolute;inset:0;background:linear-gradient(102deg,transparent 32%,rgba(255,90,31,.17) 50%,transparent 68%);transform:translateX(-120%)}
.a-tile:hover .a-art::after{animation:aSheen 1.15s var(--ease)}
@keyframes aSheen{to{transform:translateX(120%)}}
.a-art svg{width:min(152px,74%);height:auto;overflow:visible;color:var(--lilac)}

.a-tile-meta{position:relative;z-index:2;display:grid;gap:4px;padding:14px 16px 16px;border-top:1px solid var(--line);background:var(--ink-2)}
.a-num{font:400 10px/1 var(--f-mono);letter-spacing:.24em;color:var(--pearl-3)}
.a-tile h2{margin:3px 0 0;font-size:19px;font-weight:300;line-height:1.1}
.a-tile p{margin:0;min-height:2.7em;font-size:11px;font-weight:400;line-height:1.35;letter-spacing:.04em;text-transform:uppercase;color:var(--pearl-2)}

/* ───────── tile art ───────── */
.art{stroke-linecap:round;stroke-linejoin:round}
.art .x-ln{fill:none;stroke:currentColor;stroke-width:1.5;opacity:.9}
.art .x-dim{fill:none;stroke:rgba(14,14,16,.2);stroke-width:1.5}
.art .x-fl{fill:currentColor}
.art .x-fdim{fill:rgba(14,14,16,.15)}
.art .x-glow{filter:drop-shadow(0 0 5px rgba(255,90,31,.8))}
/* percentage transform-origins need the element's own box */
.art-stake .x-st,.art-pools .x-bar,.art-an .x-ab{transform-box:fill-box}
/* the tape fades out instead of getting clipped */
.art-act{-webkit-mask:linear-gradient(180deg,transparent,#000 24%,#000 76%,transparent);mask:linear-gradient(180deg,transparent,#000 24%,#000 76%,transparent)}

/* 01 swap — two tokens trade places */
.art-swap .x-tokA{animation:aSwapA 3.8s var(--ease) infinite}
.art-swap .x-tokB{animation:aSwapB 3.8s var(--ease) infinite}
@keyframes aSwapA{0%,10%{transform:translateX(0)}50%,60%{transform:translateX(64px)}100%{transform:translateX(0)}}
@keyframes aSwapB{0%,10%{transform:translateX(0)}50%,60%{transform:translateX(-64px)}100%{transform:translateX(0)}}
.art-swap .x-arcT{stroke-dasharray:4 5;animation:aDash 2.2s linear infinite}
.art-swap .x-arcB{stroke-dasharray:4 5;animation:aDash 2.2s linear infinite reverse}
@keyframes aDash{to{stroke-dashoffset:-18}}

/* 02 wrap — a core takes on its shell */
.art-wrap .x-ringA{transform-origin:60px 30px;stroke-dasharray:7 7;animation:aRot 9s linear infinite}
.art-wrap .x-ringB{transform-origin:60px 30px;stroke-dasharray:3 6;animation:aRot 6s linear infinite reverse}
@keyframes aRot{to{transform:rotate(360deg)}}
.art-wrap .x-core{transform-origin:60px 30px;animation:aCore 3.2s var(--ease) infinite}
@keyframes aCore{0%,100%{transform:scale(1);opacity:.85}50%{transform:scale(1.16);opacity:1}}

/* 03 pools — depth curve with a range window sliding */
.art-pools .x-win{animation:aWin 6.5s var(--ease) infinite alternate}
@keyframes aWin{0%{transform:translateX(-15px)}100%{transform:translateX(15px)}}
.art-pools .x-bar{transform-origin:50% 100%;animation:aBreathe 4.2s var(--ease) infinite}
.art-pools .x-bar:nth-of-type(2n){animation-delay:.5s}
.art-pools .x-bar:nth-of-type(3n){animation-delay:.95s}
@keyframes aBreathe{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.74)}}

/* 04 portfolio — the line draws itself */
.art-pf .x-line{stroke-dasharray:130;stroke-dashoffset:130;animation:aDraw 3.6s var(--ease) infinite}
@keyframes aDraw{0%{stroke-dashoffset:130}55%,100%{stroke-dashoffset:0}}
.art-pf .x-cap{opacity:0;animation:aCap 3.6s var(--ease) infinite}
@keyframes aCap{0%,48%{opacity:0}64%,100%{opacity:1}}
.art-pf .x-fill{opacity:0;animation:aFade 3.6s var(--ease) infinite}
@keyframes aFade{0%,42%{opacity:0}72%,100%{opacity:.45}}

/* 05 bots — a signal runs the chain */
.art-bots .x-pulse{offset-path:path("M32 30 H88");offset-distance:0%;animation:aRun 2.8s var(--ease) infinite}
@keyframes aRun{0%{offset-distance:0%;opacity:0}12%{opacity:1}86%{opacity:1}100%{offset-distance:100%;opacity:0}}
.art-bots .x-blk{animation:aBlink 2.8s var(--ease) infinite}
.art-bots .x-b2{animation-delay:.5s}
.art-bots .x-b3{animation-delay:1s}
@keyframes aBlink{0%,62%,100%{opacity:.4}20%{opacity:1}}

/* 06 autopilot — radar sweep */
.art-auto .x-sweep{transform-origin:60px 30px;animation:aRot 3.4s linear infinite}
.art-auto .x-ring{transform-origin:60px 30px;animation:aRipple 3.4s ease-out infinite}
.art-auto .x-r2{animation-delay:1.15s}
.art-auto .x-r3{animation-delay:2.3s}
@keyframes aRipple{0%{opacity:.6;transform:scale(.3)}100%{opacity:0;transform:scale(1)}}
.art-auto .x-blip{opacity:0;animation:aBlip 3.4s linear infinite}
.art-auto .x-p2{animation-delay:1.7s}
@keyframes aBlip{0%,5%{opacity:1}45%,100%{opacity:0}}

/* 07 staking — the stack builds up */
.art-stake .x-st{transform-origin:50% 100%;animation:aStack 4.2s var(--ease) infinite}
.art-stake .x-s2{animation-delay:.35s}
.art-stake .x-s3{animation-delay:.7s}
.art-stake .x-s4{animation-delay:1.05s}
@keyframes aStack{0%{transform:scaleY(0);opacity:0}20%,76%{transform:scaleY(1);opacity:1}100%{transform:scaleY(0);opacity:0}}

/* 08 analytics — bars find their level */
.art-an .x-ab{transform-origin:50% 100%;animation:aLevel 3.8s var(--ease) infinite}
.art-an .x-ab:nth-of-type(2){animation-delay:.13s}
.art-an .x-ab:nth-of-type(3){animation-delay:.26s}
.art-an .x-ab:nth-of-type(4){animation-delay:.39s}
.art-an .x-ab:nth-of-type(5){animation-delay:.52s}
.art-an .x-ab:nth-of-type(6){animation-delay:.65s}
@keyframes aLevel{0%,100%{transform:scaleY(.32)}50%{transform:scaleY(1)}}

/* 09 activity — the tape scrolls */
.art-act .x-tape{animation:aTape 5s linear infinite}
@keyframes aTape{to{transform:translateY(-30px)}}

/* 10 docs — a highlight reads down the page */
.art-docs .x-hl{animation:aRead 4.4s var(--ease) infinite}
@keyframes aRead{0%,100%{transform:translateY(0)}30%{transform:translateY(11px)}60%{transform:translateY(22px)}}

/* ───────── panels & grid ───────── */
.a-grid{display:grid;gap:14px}
.a-grid.c2{grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr))}
.a-grid.c3{grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr))}
.a-split{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:14px;align-items:start}

.a-panel{position:relative;padding:18px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--ink-2);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.a-panel>h2,.a-panel>h3{margin:0 0 14px;font-size:13px;font-weight:400;letter-spacing:.14em;text-transform:uppercase;color:var(--pearl-2)}
.a-note{margin:12px 0 0;font:400 10px/1.45 var(--f-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--pearl-3)}

/* data blocks borrowed from the landing get the softer corners too */
.a-panel .mini{border:1px solid var(--line);border-radius:var(--r-md);background:radial-gradient(120% 90% at 100% 0%,rgba(255,90,31,.1),transparent 60%),#FFFFFF}
.a-panel .srow,.a-panel .node{border-radius:var(--r-xs)}

/* stat blocks */
.a-stat{display:grid;gap:7px;padding:15px 17px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--ink-2)}
.a-stat dt{font:400 10px/1 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--pearl-3)}
.a-stat dd{margin:0;font-size:clamp(20px,2.4vw,30px);font-weight:200;line-height:1;font-variant-numeric:tabular-nums}
.a-stat dd small{font-size:13px;font-weight:300;color:var(--pearl-3)}
.a-stat dd.none{font-size:18px;font-weight:300;color:var(--pearl-3);letter-spacing:.06em}

/* ───────── form controls ───────── */
.a-field{display:grid;gap:8px;padding:13px 15px;border:1px solid var(--line);border-radius:var(--r-md);background:#FFFFFF;transition:border-color .3s,box-shadow .3s}
.a-field:focus-within{border-color:rgba(255,90,31,.45);box-shadow:0 0 0 3px rgba(255,90,31,.09)}
.a-field label{font:400 10px/1 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--pearl-3)}
.a-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px}
.a-amt{width:100%;min-width:0;border:0;background:none;color:var(--pearl);font:200 26px/1.1 var(--f-sans);font-variant-numeric:tabular-nums;outline:none;appearance:none}
.a-amt::placeholder{color:rgba(14,14,16,.28)}
.a-amt::-webkit-outer-spin-button,.a-amt::-webkit-inner-spin-button{appearance:none;margin:0}
.a-sel{flex:none;padding:8px 11px;border:1px solid var(--line-2);border-radius:999px;background:var(--ink-2);color:var(--pearl);font:400 12px/1 var(--f-mono);letter-spacing:.06em;cursor:pointer}
.a-sub{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 10px;font:400 10px/1.3 var(--f-mono);letter-spacing:.06em;color:var(--pearl-3)}
.a-sub b{font-weight:400;color:var(--pearl-2)}

.a-flip{display:grid;place-items:center;height:0;position:relative;z-index:1}
.a-flip button{display:grid;place-items:center;width:32px;height:32px;border:1px solid var(--line-2);border-radius:50%;background:var(--ink-2);color:var(--pearl);font-size:13px;cursor:pointer;transition:transform .45s var(--ease),background .3s}
.a-flip button:hover{background:rgba(255,90,31,.18);transform:rotate(180deg)}

.a-go{position:relative;width:100%;margin-top:14px;padding:15px;border:1px solid var(--line-2);border-radius:var(--r-md);background:rgba(14,14,16,.06);color:var(--pearl);font:400 14px/1 var(--f-sans);letter-spacing:.04em;cursor:pointer;overflow:hidden;transition:background .3s,color .3s,border-color .3s,letter-spacing .5s var(--ease)}
.a-go:hover{background:var(--pearl);color:var(--ink);border-color:var(--pearl)}
.a-go.is-soon,.a-go.is-soon:hover{background:rgba(255,90,31,.09);color:var(--pearl);border-color:rgba(255,90,31,.6);letter-spacing:.18em}
.a-go.is-soon::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,90,31,.26) 50%,transparent 70%);transform:translateX(-100%);animation:aSweep 1.6s var(--ease) forwards}
@keyframes aSweep{to{transform:translateX(100%)}}

.a-quick{display:flex;gap:6px}
.a-quick button{flex:1;padding:8px;border:1px solid var(--line);border-radius:var(--r-xs);background:none;color:var(--pearl-3);font:400 10px/1 var(--f-mono);letter-spacing:.1em;cursor:pointer;transition:color .25s,border-color .25s,background .25s}
.a-quick button:hover{color:var(--pearl);border-color:var(--line-2);background:rgba(14,14,16,.04)}

/* filter chips */
.a-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}
.a-chips button{padding:8px 14px;border:1px solid var(--line);border-radius:999px;background:none;color:var(--pearl-3);font:400 11px/1 var(--f-sans);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:color .25s,border-color .25s,background .25s}
.a-chips button:hover{color:var(--pearl)}
.a-chips button[aria-pressed="true"]{color:var(--pearl);border-color:rgba(255,90,31,.5);background:rgba(255,90,31,.12)}

/* ───────── pool cards ───────── */
.a-pool{position:relative;display:grid;gap:14px;padding:17px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--ink-2);overflow:hidden;transition:border-color .35s,transform .5s var(--ease),box-shadow .5s var(--ease)}
.a-pool::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 100% at 100% 0%,rgba(255,90,31,.13),transparent 58%);opacity:0;transition:opacity .45s;pointer-events:none}
.a-pool:hover{border-color:var(--line-2);transform:translateY(-3px);box-shadow:0 18px 38px -24px rgba(255,90,31,.5)}
.a-pool:hover::before{opacity:1}
.a-pool>*{position:relative}
.a-pool-top{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px}
.a-logo{display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--line-2);border-radius:50%;background:radial-gradient(closest-side,rgba(255,90,31,.24),rgba(255,90,31,.06));font:400 11px/1 var(--f-mono);color:var(--pearl)}
.a-pool-id{min-width:0}
.a-pool-id b{display:block;font:400 14px/1.2 var(--f-mono);color:var(--pearl);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.a-pool-id span{font:400 10px/1.3 var(--f-sans);letter-spacing:.1em;text-transform:uppercase;color:var(--pearl-3)}
.a-tag{flex:none;padding:5px 10px;border:1px solid var(--line-2);border-radius:999px;font:400 9px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--pearl-2)}
.a-tag.live{border-color:rgba(139,227,185,.45);background:rgba(139,227,185,.08);color:var(--up)}
.a-tag.idle{color:var(--pearl-3)}
.a-figs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding-top:14px;border-top:1px solid var(--line);font:400 10px/1.3 var(--f-mono);letter-spacing:.05em;text-transform:uppercase}
.a-figs div{display:grid;gap:5px;min-width:0}
.a-figs dt{color:var(--pearl-3)}
.a-figs dd{margin:0;font-size:14px;color:var(--pearl);font-variant-numeric:tabular-nums}
.a-figs dd.up{color:var(--up)}
.a-acts{display:flex;gap:8px}
.a-acts button{flex:1;padding:11px;border:1px solid var(--line-2);border-radius:var(--r-xs);background:none;color:var(--pearl);font:400 11px/1 var(--f-sans);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:background .3s,color .3s,border-color .3s}
.a-acts button:hover{background:rgba(255,90,31,.14);border-color:rgba(255,90,31,.45)}
.a-acts button.ghost{color:var(--pearl-3);border-color:var(--line)}
.a-acts button.ghost:hover{color:var(--pearl);background:rgba(14,14,16,.06)}

/* ───────── tables ───────── */
.a-scroll{overflow-x:auto;scrollbar-width:thin}
.a-table{width:100%;border-collapse:collapse;font:400 11px/1.3 var(--f-mono);letter-spacing:.04em;font-variant-numeric:tabular-nums}
.a-table th{padding:0 12px 10px 0;border-bottom:1px solid var(--line);font-weight:400;letter-spacing:.14em;text-transform:uppercase;color:var(--pearl-3);text-align:right;white-space:nowrap}
.a-table th:first-child,.a-table td:first-child{text-align:left;padding-left:0}
.a-table td{padding:11px 12px 11px 0;border-bottom:1px solid rgba(14,14,16,.07);color:var(--pearl-2);text-align:right;white-space:nowrap}
.a-table td:first-child{color:var(--pearl)}
.a-table tbody tr{transition:background .25s}
.a-table tbody tr:hover{background:rgba(255,90,31,.05)}
.a-table tr:last-child td{border-bottom:0}
.a-table td.up{color:var(--up)}

/* horizontal bars */
.a-bars{display:grid;gap:9px;margin:0;font:400 11px/1 var(--f-mono);letter-spacing:.05em}
.a-bars div{display:grid;grid-template-columns:6ch minmax(0,1fr) 9ch;align-items:center;gap:12px}
.a-bars dt{color:var(--pearl-2)}
.a-bars .bar{height:6px;border-radius:999px;background:rgba(14,14,16,.08);overflow:hidden}
.a-bars .bar i{display:block;height:100%;width:var(--w,0%);border-radius:999px;background:linear-gradient(90deg,rgba(95,140,255,.7),var(--lilac) 58%,rgba(255,90,31,.92));transform-origin:0 50%;animation:aBar 1.1s var(--ease) both}
@keyframes aBar{from{transform:scaleX(0)}}
.a-bars dd{margin:0;text-align:right;color:var(--pearl);font-variant-numeric:tabular-nums}

/* ───────── empty state ───────── */
.a-empty{display:grid;justify-items:center;gap:14px;padding:clamp(34px,7vh,64px) 20px;border:1px dashed var(--line);border-radius:var(--r-lg);text-align:center;background:radial-gradient(120% 100% at 50% 0%,rgba(255,90,31,.07),transparent 60%)}
.a-empty p{margin:0;max-width:30em;font:400 11px/1.5 var(--f-mono);letter-spacing:.07em;text-transform:uppercase;color:var(--pearl-3)}
.a-empty .a-go{width:auto;margin:0;padding:13px 28px}

/* ───────── docs ───────── */
.a-doc{position:relative;display:grid;gap:10px;padding:18px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--ink-2);color:inherit;text-decoration:none;overflow:hidden;transition:border-color .3s,transform .5s var(--ease),box-shadow .5s var(--ease)}
.a-doc::before{content:"";position:absolute;inset:0;background:radial-gradient(110% 100% at 0% 0%,rgba(255,90,31,.15),transparent 56%);opacity:0;transition:opacity .4s}
.a-doc:hover{border-color:var(--line-2);transform:translateY(-3px);box-shadow:0 16px 34px -24px rgba(255,90,31,.5)}
.a-doc:hover::before{opacity:1}
.a-doc h3{position:relative;margin:0;font-size:16px;font-weight:300}
.a-doc p{position:relative;margin:0;font:400 11px/1.4 var(--f-sans);letter-spacing:.04em;text-transform:uppercase;color:var(--pearl-2)}

/* ───────── footer ───────── */
.a-foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding:18px var(--g);border-top:1px solid var(--line);font:400 10px/1.4 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--pearl-3)}
.a-foot a{text-decoration:none;transition:color .25s}
.a-foot a:hover{color:var(--pearl)}

/* ───────── responsive ───────── */
@media (max-width:1359px){
  .a-badge{display:none}
}
@media (max-width:899px){
  .a-split{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:759px){
  :root{--r-lg:16px;--r-md:12px}
  .a-top{grid-template-columns:auto auto;grid-template-rows:auto auto;height:auto;padding-block:10px;gap:10px}
  .a-nav{grid-column:1/-1;grid-row:2;margin-inline:calc(var(--g)*-1);padding-inline:var(--g)}
  .a-main{padding-bottom:40px}
  .a-hub{grid-template-columns:repeat(auto-fill,minmax(min(168px,100%),1fr));gap:10px}
  .a-tile{min-height:188px}
  .a-art{min-height:88px}
  .a-figs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .a-bars div{grid-template-columns:5ch minmax(0,1fr) 8ch;gap:8px}
}
@media (prefers-reduced-motion:reduce){
  .a-bg,.a-bg i,.a-view.is-on,.a-bars .bar i,.a-badge i,.art *{animation:none!important}
  .a-tile:hover,.a-pool:hover,.a-doc:hover{transform:none}
  .a-tile:hover::after{animation:none;opacity:.6}
}

/* borrowed histogram bars pick up the softer corners too */
.a-panel .hist i{border-radius:3px 3px 1px 1px}

/* ───────── live swap ───────── */
.a-connect.is-on{border-color:rgba(139,227,185,.5);background:rgba(139,227,185,.1);font-family:var(--f-mono);letter-spacing:.04em}
.a-connect.is-on:hover{background:var(--up);color:var(--ink);border-color:var(--up)}
.a-connect.is-warn{border-color:rgba(255,180,120,.6);background:rgba(255,180,120,.12);color:#9A3412}
.a-connect.is-warn:hover{background:#9A3412;color:var(--ink);border-color:#9A3412}

button.a-sel{transition:border-color .25s,background .25s}
button.a-sel:hover{border-color:rgba(255,90,31,.6);background:rgba(255,90,31,.14)}

.a-link{padding:0;border:0;background:none;color:var(--pearl-3);font:400 10px/1.3 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:color .25s}
.a-link:hover{color:var(--lilac)}

.a-go:disabled{opacity:.5;cursor:default}
.a-go:disabled:hover{background:rgba(14,14,16,.06);color:var(--pearl);border-color:var(--line-2)}

.a-status{margin:12px 0 0;font:400 10px/1.5 var(--f-mono);letter-spacing:.05em;color:var(--pearl-2);word-break:break-word}
.a-status:empty{margin:0}
.a-status a{color:var(--lilac)}

/* token picker */
.a-dlg{width:min(400px,calc(100vw - 32px));padding:18px;border:1px solid var(--line-2);border-radius:var(--r-lg);background:var(--ink-2);color:var(--pearl);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}
.a-dlg::backdrop{background:rgba(14,14,16,.4);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.a-dlg-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.a-dlg-head h2{margin:0;font-size:13px;font-weight:400;letter-spacing:.14em;text-transform:uppercase;color:var(--pearl-2)}
.a-dlg-head button{padding:4px 8px;border:0;background:none;color:var(--pearl-3);font-size:13px;cursor:pointer;transition:color .25s}
.a-dlg-head button:hover{color:var(--pearl)}
.a-dlg-add{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}
.a-dlg-add input{min-width:0;padding:11px 13px;border:1px solid var(--line);border-radius:var(--r-md);background:#FFFFFF;color:var(--pearl);font:400 11px/1 var(--f-mono);letter-spacing:.03em;outline:none;transition:border-color .25s}
.a-dlg-add input:focus{border-color:rgba(255,90,31,.5)}
.a-dlg-add button{padding:11px 16px;border:1px solid var(--line-2);border-radius:var(--r-md);background:rgba(14,14,16,.06);color:var(--pearl);font:400 11px/1 var(--f-sans);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:background .25s}
.a-dlg-add button:hover{background:rgba(255,90,31,.16)}
.a-dlg-add button:disabled{opacity:.5;cursor:default}
.a-dlg-err{margin:10px 0 0;font:400 10px/1.4 var(--f-mono);letter-spacing:.04em;color:var(--down)}
.a-dlg-err:empty{margin:0}

.a-toklist{display:grid;gap:4px;margin-top:14px;max-height:min(46vh,300px);overflow-y:auto;scrollbar-width:thin}
.a-tokrow{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:11px 13px;border:1px solid transparent;border-radius:var(--r-md);background:#FFFFFF;color:inherit;text-align:left;cursor:pointer;transition:border-color .25s,background .25s}
.a-tokrow:hover{border-color:rgba(255,90,31,.4);background:rgba(255,90,31,.1)}
.a-toksym{font:400 14px/1.2 var(--f-mono);color:var(--pearl)}
.a-tokaddr{font:400 10px/1.2 var(--f-mono);letter-spacing:.03em;color:var(--pearl-3)}

/* ───────── portfolio ───────── */
.a-panel-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:14px}
.a-panel-head h2{margin:0;font-size:13px;font-weight:400;letter-spacing:.14em;text-transform:uppercase;color:var(--pearl-2)}
.a-table td.up,.a-stat dd.up{color:var(--up)}
.a-table td.down,.a-stat dd.down{color:var(--down)}
.a-table td.a-muted{color:var(--pearl-3)}
.a-flag{display:inline-block;margin-left:8px;padding:2px 7px;border:1px solid var(--line);border-radius:999px;font:400 9px/1.4 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--pearl-3);cursor:help}
#pfEmpty[hidden],#pfTable[hidden]{display:none}
#pfEmpty{border:0;padding:clamp(26px,5vh,44px) 16px}

/* ───────── staking ───────── */
.a-go-ghost{margin-top:8px;background:none;border-color:var(--line);color:var(--pearl-2);font-size:12px;padding:12px;letter-spacing:.1em;text-transform:uppercase}
.a-go-ghost:hover{background:rgba(255,90,31,.12);color:var(--pearl);border-color:rgba(255,90,31,.45)}
.a-go-ghost:disabled:hover{background:none;color:var(--pearl-2);border-color:var(--line)}
#stUndeployed[hidden],#stPanel[hidden]{display:none}
#lgOff[hidden],#lgPanel[hidden]{display:none}

/* ───────── concept screens ───────── */
.a-concept{display:flex;gap:12px;margin-bottom:22px;padding:14px 18px;border:1px solid rgba(255,180,120,.34);
border-radius:var(--r-md);background:rgba(255,180,120,.07);
font:400 11px/1.5 var(--f-mono);letter-spacing:.05em;text-transform:uppercase;color:#9A3412}
.a-concept::before{content:"⚑";flex:none;font-size:13px;line-height:1.3}

.a-drop{display:grid;justify-items:center;gap:6px;margin-bottom:12px;padding:26px 16px;
border:1px dashed var(--line-2);border-radius:var(--r-md);background:#FFFFFF;
text-align:center;cursor:pointer;transition:border-color .3s,background .3s}
.a-drop:hover{border-color:rgba(255,90,31,.5);background:rgba(255,90,31,.07)}
.a-drop-i{display:grid;place-items:center;width:34px;height:34px;border:1px solid var(--line-2);
border-radius:50%;font-size:17px;color:var(--pearl-2)}
.a-drop span{font:400 12px/1 var(--f-sans);letter-spacing:.1em;text-transform:uppercase;color:var(--pearl-2)}
.a-drop small{font:400 10px/1.3 var(--f-mono);letter-spacing:.05em;color:var(--pearl-3)}

.a-txt{width:100%;min-width:0;border:0;background:none;color:var(--pearl);
font:300 17px/1.35 var(--f-sans);outline:none;resize:none}
.a-txt::placeholder{color:rgba(14,14,16,.26)}
.a-opt{margin-left:8px;font-size:9px;letter-spacing:.12em;color:rgba(14,14,16,.3)}
.a-field+.a-field{margin-top:10px}

.a-split3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:12px}
.a-seg{display:grid;gap:5px}
.a-seg i{height:4px;border-radius:2px}
.a-seg b{font:200 24px/1 var(--f-sans);font-variant-numeric:tabular-nums}
.a-seg span{font:400 10px/1.3 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--pearl-3)}
.a-seg i.s1,.a-splitbar i.s1{background:var(--lilac)}
.a-seg i.s2,.a-splitbar i.s2{background:rgba(95,140,255,.85)}
.a-seg i.s3,.a-splitbar i.s3{background:rgba(255,90,31,.85)}
.a-splitbar{display:flex;height:8px;border-radius:999px;overflow:hidden}
.a-splitbar i.s1{flex:60}.a-splitbar i.s2{flex:25}.a-splitbar i.s3{flex:15}

.a-steps{display:grid;gap:16px;margin:0;padding:0;list-style:none;counter-reset:s}
.a-steps li{display:grid;gap:4px;padding-left:44px;position:relative;counter-increment:s}
.a-steps li::before{content:counter(s,decimal-leading-zero);position:absolute;left:0;top:1px;
display:grid;place-items:center;width:28px;height:28px;border:1px solid var(--line-2);border-radius:50%;
font:400 10px/1 var(--f-mono);letter-spacing:.04em;color:var(--pearl-2)}
.a-steps b{font-size:15px;font-weight:400}
.a-steps span{font:400 11px/1.5 var(--f-sans);letter-spacing:.03em;color:var(--pearl-2)}

/* tile art: 11 launch, 12 fortune */
.art-launch .x-lp1{animation:aLp 3.4s var(--ease) infinite}
.art-launch .x-lp2{animation:aLp 3.4s var(--ease) infinite reverse}
@keyframes aLp{0%,100%{transform:translateX(0)}50%{transform:translateX(7px)}}
.art-launch .x-lfan{stroke-dasharray:3 5;animation:aDash 1.9s linear infinite}
.art-launch .x-lfan2,.art-launch .x-lfan3{stroke-dasharray:3 5;animation:aDash 2.6s linear infinite}
.art-fortune .x-wheel{transform-origin:60px 30px;animation:aSpinW 4.4s cubic-bezier(.3,.9,.25,1) infinite}
@keyframes aSpinW{0%{transform:rotate(0)}70%,100%{transform:rotate(324deg)}}
.art-fortune .x-fl2{fill:none;stroke:var(--lilac);stroke-width:3;opacity:.9;
filter:drop-shadow(0 0 5px rgba(255,90,31,.8))}
.art-fortune .x-pin{fill:currentColor;stroke:none}

/* ───────── holding page ───────── */
.a-soon{display:grid;justify-items:center;align-content:center;gap:14px;
min-height:min(56vh,520px);padding:40px 20px;text-align:center}
.a-soon-art{display:block;width:min(190px,52vw);margin-bottom:10px}
.a-soon-art svg{width:100%;height:auto;overflow:visible;color:var(--lilac)}
.a-soon-eyebrow{display:flex;align-items:center;gap:16px;margin:0;
font:400 11px/1 var(--f-mono);letter-spacing:.42em;text-transform:uppercase;color:var(--pearl-3)}
.a-soon-eyebrow::before,.a-soon-eyebrow::after{content:"";width:36px;height:1px;background:var(--line-2)}
.a-soon h1{margin:0;font-size:clamp(34px,5vw,64px);font-weight:200;line-height:1.04;
letter-spacing:-.01em;text-transform:uppercase}
.a-soon-sub{margin:0;font:400 12px/1.5 var(--f-sans);letter-spacing:.12em;
text-transform:uppercase;color:var(--pearl-2)}

/* ───────── launch form ───────── */
.a-sel.is-static{cursor:default}
.a-field+.a-quick{margin-top:10px}
.a-field textarea.a-txt{resize:vertical;font-size:14px}
.a-txt.is-sm{font-size:13px;font-weight:400}
.a-check{display:flex;align-items:center;gap:11px;margin-top:10px;padding:13px 15px;border:1px solid var(--line);border-radius:var(--r-md);background:#FFFFFF;cursor:pointer;font:400 11px/1.35 var(--f-mono);letter-spacing:.05em;color:var(--pearl-2);transition:border-color .3s,color .3s}
.a-check:hover{border-color:var(--line-2);color:var(--pearl)}
.a-check input{flex:none;width:15px;height:15px;margin:0;accent-color:var(--lilac);cursor:pointer}
.a-panel .mini .kv a{color:var(--lilac);text-decoration:none}
.a-panel .mini .kv a:hover{text-decoration:underline}
.a-lead{margin:-4px 0 14px;font-size:var(--fs-s);font-weight:300;line-height:1.45;color:var(--pearl-2);text-wrap:pretty}

/* logo picker */
.a-logo{display:flex;align-items:center;gap:13px}
.a-logo-pic{flex:none;display:grid;place-items:center;width:54px;height:54px;border:1px dashed var(--line-2);border-radius:var(--r-md);
background:#FFFFFF center/cover no-repeat;font:400 9px/1 var(--f-mono);letter-spacing:.1em;color:var(--pearl-3);overflow:hidden}
.a-logo-pic.is-set{border-style:solid;border-color:rgba(255,90,31,.45)}
.a-logo-pic::after{content:"IMG"}
.a-logo-pic.is-set::after{content:none}
.a-logo-act{display:flex;flex-wrap:wrap;gap:6px;min-width:0}
.a-mini{white-space:nowrap;padding:8px 13px;border:1px solid var(--line-2);border-radius:999px;background:none;color:var(--pearl-2);font:400 10px/1 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:color .25s,border-color .25s,background .25s}
.a-mini:hover{color:var(--pearl);border-color:rgba(255,90,31,.5);background:rgba(255,90,31,.1)}
.a-mini:disabled{opacity:.45;cursor:default}
.a-mini:disabled:hover{color:var(--pearl-2);border-color:var(--line-2);background:none}

/* fee slider */
.a-fee{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.a-fee-n{flex:none;font:200 clamp(30px,3.6vw,42px)/1 var(--f-sans);font-variant-numeric:tabular-nums;color:var(--pearl)}
.a-fee-n b{font-weight:200}
.a-fee-l{font:400 10px/1.5 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--pearl-3)}
.a-range{width:100%;height:22px;margin:0;background:none;appearance:none;cursor:pointer}
.a-range:focus-visible{outline-offset:2px}
.a-range::-webkit-slider-runnable-track{height:4px;border-radius:2px;background:linear-gradient(90deg,var(--iris-2),var(--iris-1) 55%,var(--iris-3))}
.a-range::-moz-range-track{height:4px;border-radius:2px;background:linear-gradient(90deg,var(--iris-2),var(--iris-1) 55%,var(--iris-3))}
.a-range::-webkit-slider-thumb{appearance:none;width:16px;height:16px;margin-top:-6px;border:1px solid rgba(11,10,15,.9);border-radius:50%;background:var(--pearl);box-shadow:0 0 0 4px rgba(255,90,31,.16)}
.a-range::-moz-range-thumb{width:16px;height:16px;border:1px solid rgba(11,10,15,.9);border-radius:50%;background:var(--pearl);box-shadow:0 0 0 4px rgba(255,90,31,.16)}
.a-range-ends{margin-bottom:14px}

/* who takes what */
.a-bar{display:flex;height:9px;margin-bottom:12px;border-radius:999px;overflow:hidden;background:rgba(0,0,0,.4)}
.a-bar i{transition:width .35s var(--ease)}
.a-dot{display:inline-block;width:7px;height:7px;margin-right:8px;border-radius:50%;vertical-align:baseline}
.f-pons{background:var(--pearl-3)}
.f-you{background:linear-gradient(90deg,var(--iris-1),var(--iris-3))}
.a-panel .mini .kv>span:first-child{color:var(--pearl-2)}

/* ═════════ Bources light — overrides ═════════ */
body.app{background:#fff}
.a-bg{display:none}
.a-top{border-bottom:0;height:64px}
.a-brand{gap:9px;font-size:20px;font-weight:700;letter-spacing:-.02em;text-transform:none;color:var(--pearl)}
.a-brand .mark{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:var(--lilac);color:#fff;font-size:15px;letter-spacing:0}
.a-nav{padding:4px;border-radius:999px;background:var(--ink-2)}
.a-nav a{padding:9px 14px;border:0;font:600 13px/1 var(--f-sans);letter-spacing:0;text-transform:none;color:var(--pearl-2)}
.a-nav a:hover{color:var(--pearl);background:#fff}
.a-nav a[aria-current="page"]{color:#fff;background:var(--lilac);border:0}
.a-badge{border:0;background:var(--ink-2);font-size:11px;letter-spacing:0;text-transform:none;color:var(--pearl-2)}
.a-badge i{background:var(--up);animation:pulse 2.4s ease-out infinite}
.a-connect{padding:11px 20px;border:0;background:var(--pearl);color:#fff;font:600 14px/1 var(--f-sans);letter-spacing:0}
.a-connect:hover{background:var(--lilac);color:#fff}
.a-connect.is-soon,.a-connect.is-soon:hover{background:var(--lilac);color:#fff;letter-spacing:.08em}
.a-connect.is-on{border:0;background:var(--ink-2);color:var(--pearl);font-family:var(--f-mono)}
.a-connect.is-on:hover{background:var(--pearl);color:#fff}
.a-connect.is-warn{border:0;background:#FFEDD5;color:#9A3412}

.a-head h1{font-size:clamp(34px,4.4vw,56px);font-weight:700;letter-spacing:-.035em;text-transform:none}
.a-head p{font-size:16px;font-weight:400;color:var(--pearl-2)}

.a-panel,.a-stat,.a-pool,.a-doc,.a-tile{border:0;background:var(--ink-2);-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none}
.a-panel{padding:24px}
.a-panel>h2,.a-panel>h3,.a-panel-head h2,.a-dlg-head h2{font-size:17px;font-weight:600;letter-spacing:-.01em;text-transform:none;color:var(--pearl)}
.a-panel .mini{border:0;background:#fff}
.a-note{font:400 12px/1.5 var(--f-sans);letter-spacing:0;text-transform:none;color:var(--pearl-3)}

.a-tile{min-height:220px}
.a-tile::before,.a-tile::after,.a-art::after{display:none}
.a-tile:hover,.a-pool:hover,.a-doc:hover{box-shadow:none}
.a-art{background:none}
.a-art svg{color:var(--lilac)}
.art .x-dim{stroke:var(--line-2)}
.art .x-fdim{fill:var(--ink-3)}
.art .x-glow{filter:none}
.art-fortune .x-fl2{stroke:var(--lilac);filter:none}
.a-tile-meta{border-top:0;background:none;padding:0 20px 20px}
.a-num{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:10px;background:#fff;font-size:12px;letter-spacing:0;color:var(--accent-ink)}
.a-tile h2{font-size:22px;font-weight:600;letter-spacing:-.02em}
.a-tile p{font-size:14px;letter-spacing:0;text-transform:none;color:var(--pearl-2)}

.a-stat dt{font-size:12px;letter-spacing:0;text-transform:none}
.a-stat dd{font-size:clamp(26px,3vw,38px);font-weight:700;letter-spacing:-.03em}
.a-grid.c3>.a-stat:first-child{background:var(--pearl);color:#fff}
.a-grid.c3>.a-stat:first-child dt{color:#8A8A90}

.a-field{border:0;background:#fff;border-radius:16px}
.a-field:focus-within{box-shadow:0 0 0 2px var(--lilac)}
.a-field label{font-size:12px;letter-spacing:0;text-transform:none}
.a-amt{font:400 24px/1.1 var(--f-mono)}
.a-sel{border:0;background:var(--ink-2);font:600 13px/1 var(--f-sans);letter-spacing:0;padding:10px 14px}
button.a-sel:hover{background:var(--pearl);color:#fff}
.a-sub{font-size:12px;letter-spacing:0}
.a-flip button{border:0;background:var(--lilac);color:#fff;width:38px;height:38px}
.a-flip button:hover{background:var(--pearl)}
.a-link{font:600 13px/1.3 var(--f-sans);letter-spacing:0;text-transform:none;color:var(--accent-ink)}
.a-link:hover{color:var(--pearl)}

.a-go{border:0;border-radius:999px;background:var(--pearl);color:#fff;font:600 15px/1 var(--f-sans);letter-spacing:0;padding:17px}
.a-go:hover{background:var(--lilac);color:#fff}
.a-go.is-soon,.a-go.is-soon:hover{background:var(--lilac);color:#fff;letter-spacing:.1em}
.a-go.is-soon::before{background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.3) 50%,transparent 70%)}
.a-go:disabled:hover{background:var(--pearl);color:#fff}
.a-go-ghost{background:#fff;color:var(--pearl);text-transform:none;font-size:14px;letter-spacing:0}
.a-go-ghost:hover{background:var(--pearl);color:#fff}
.a-go-ghost:disabled:hover{background:#fff;color:var(--pearl)}

.a-quick button,.a-chips button,.a-acts button,.a-mini{border:0;border-radius:999px;background:#fff;color:var(--pearl-2);font:600 13px/1 var(--f-sans);letter-spacing:0;text-transform:none}
.a-view>.a-chips button{background:var(--ink-2)}
.a-quick button:hover,.a-chips button:hover,.a-acts button:hover,.a-mini:hover{background:var(--pearl);color:#fff}
.a-chips button[aria-pressed="true"]{border:0;background:var(--lilac);color:#fff}
.a-chips button{padding:10px 18px}
.a-acts button.ghost{background:transparent;color:var(--pearl-3)}

.a-logo{border:0;background:#fff;color:var(--pearl)}
.a-pool-id b{font-size:15px}
.a-pool-id span,.a-figs,.a-tag{letter-spacing:0;text-transform:none}
.a-tag{border:0;background:#fff;font-size:11px}
.a-tag.live{border:0;background:#DCFCE7;color:var(--up)}
.a-figs{border-top:1px solid var(--line);font-size:12px}

.a-table{font-size:13px;letter-spacing:0}
.a-table th{font:500 12px/1.2 var(--f-sans);letter-spacing:0;text-transform:none}
.a-table td{border-bottom-color:var(--line)}
.a-table tbody tr:hover{background:#fff}

.a-bars .bar{background:#fff}
.a-bars .bar i{background:var(--lilac)}

.a-empty{border:0;background:var(--ink-2)}
.a-empty p{font:400 14px/1.5 var(--f-sans);letter-spacing:0;text-transform:none;color:var(--pearl-2)}
.a-empty .a-go{padding:14px 28px}

.a-doc h3{font-size:20px;font-weight:600;letter-spacing:-.02em}
.a-doc p{font-size:14px;letter-spacing:0;text-transform:none}

.a-dlg{border:0;border-radius:24px;background:#fff;color:var(--pearl);box-shadow:0 24px 60px -20px rgba(14,14,16,.35)}
.a-dlg-add input{border:0;background:var(--ink-2);color:var(--pearl);font-size:13px}
.a-dlg-add button{border:0;border-radius:999px;background:var(--pearl);color:#fff;font:600 13px/1 var(--f-sans);letter-spacing:0;text-transform:none}
.a-dlg-add button:hover{background:var(--lilac)}
.a-tokrow{background:var(--ink-2);border:0}
.a-tokrow:hover{background:var(--accent-soft);border:0}

.a-txt{color:var(--pearl);font:400 17px/1.35 var(--f-sans)}
.a-txt::placeholder,.a-amt::placeholder{color:#A8A8AD}
.a-opt{color:var(--pearl-3);letter-spacing:0;text-transform:none;font-size:11px}
.a-check{border:0;background:#fff;font:400 13px/1.35 var(--f-sans);letter-spacing:0}
.a-logo-pic{background-color:var(--ink-2)}
.a-fee-n{font-weight:700;letter-spacing:-.03em}
.a-fee-n b{font-weight:700}
.a-fee-l{font:400 12px/1.5 var(--f-sans);letter-spacing:0;text-transform:none}
.a-range::-webkit-slider-runnable-track{background:var(--lilac)}
.a-range::-moz-range-track{background:var(--lilac)}
.a-range::-webkit-slider-thumb{border:3px solid var(--lilac);background:#fff;box-shadow:none}
.a-range::-moz-range-thumb{border:3px solid var(--lilac);background:#fff;box-shadow:none}
.a-bar{background:#fff}
.f-pons{background:var(--pearl-3)}
.f-you{background:var(--lilac)}
.a-concept{border:0;background:#FFEDD5;color:#9A3412;letter-spacing:0;text-transform:none;font-size:13px}

.a-soon h1{font-weight:700;letter-spacing:-.035em;text-transform:none}
.a-soon-eyebrow{letter-spacing:.2em;color:var(--accent-ink)}
.a-soon-sub{letter-spacing:0;text-transform:none;font-size:15px}
.a-soon-art svg{color:var(--lilac)}

.a-foot{border-top:0;font:400 13px/1.4 var(--f-sans);letter-spacing:0;text-transform:none}
.a-foot a{color:var(--accent-ink)}
.a-foot a:hover{color:var(--pearl)}

/* keep every screen inside the viewport on phones (a wide child used to stretch the shell grid) */
.a-shell{grid-template-columns:minmax(0,1fr)}
.a-main{min-width:0}

/* ───────── phones: the light overrides above pin the header to 64px; undo that and tidy the two-row header ───────── */
@media (max-width:759px){
  .a-top{height:auto;grid-template-columns:minmax(0,1fr) auto;padding-block:12px;row-gap:12px}
  .a-right{justify-self:end}
  .a-nav{margin-inline:0;padding:4px}
  .a-nav a{padding:9px 13px}
  .a-connect{padding:10px 16px;font-size:13px}
  /* key/value rows wrap instead of cutting words off */
  .a-view .mini .kv{align-items:flex-start}
  .a-view .mini .kv>span{white-space:normal;text-overflow:clip}
  .a-view .mini .kv>span:last-child{text-align:right}
  .a-grid>.a-stat{margin:0}
  .a-grid.c3{margin-bottom:14px}
}

/* ───────── gated screen glyph (public build) ───────── */
.art-lock .x-locks{animation:aLockS 4s var(--ease) infinite}
@keyframes aLockS{0%,72%,100%{transform:translateY(0)}82%{transform:translateY(-3px)}}
.art-lock .x-lockb{animation:aLockB 4s var(--ease) infinite}
@keyframes aLockB{0%,72%,100%{opacity:.9}82%{opacity:1}}
