/* SPLITR ribbon identity: ink, violet and cyan. */
:root,body[data-network=solana]{--bg:#080817;--surface:#111124;--surface-2:#1c1935;--accent:#c3acff;--accent-rgb:195,172,255;--text:#f4f2ff;--muted:#aaa6bd;--line:#27243e;--asset-0:#bb9cff;--asset-1:#70d9f1;--asset-2:#dfb58a;--asset-3:#939cff}
body{background:radial-gradient(ellipse 70% 650px at 85% 8%,#22114a65,transparent),var(--bg)}
.header{height:104px}.header .brand,.footer .brand{gap:12px}
[data-network=solana] .brand-mark{width:44px;height:44px;object-fit:contain;filter:drop-shadow(0 0 10px #8648ff26)}
.brand-name{font-size:23px;font-weight:750;letter-spacing:.08em}.brand-dot{font-size:8px;letter-spacing:0;margin-left:5px}
.header nav,.hero-description{color:#bab5cf}.button{background:linear-gradient(110deg,#d0baff,#a99cfa);color:#17102e;border-color:#c8adff;box-shadow:inset 0 1px 0 #ffffff30}.button:hover{box-shadow:0 6px 32px #8658ff35}.button:disabled{box-shadow:none}
.hero-immersive{grid-template-columns:1.12fr 1fr;min-height:710px;padding-top:32px;padding-bottom:42px}
.hero-immersive h1{font-size:clamp(58px,6.4vw,94px);letter-spacing:-.065em;line-height:1.08;font-weight:550;max-width:650px}
.hero-immersive h1 .accent,.closing .accent{background:linear-gradient(110deg,#d9b7ff 5%,#b29cff 48%,#70dbfa 100%);background-clip:text;-webkit-background-clip:text;color:transparent}
.hero-immersive .hero-kicker{display:flex;align-items:center;gap:12px;color:#c0aedc;font-size:10px;letter-spacing:.17em}
.hero-kicker::before{content:'';width:23px;height:1px;background:#a284ed}
.hero-immersive .hero-visual{height:590px}.hero-visual::before{content:'';position:absolute;inset:12% 0 13% -18%;border-radius:50%;background:radial-gradient(ellipse,#6227d41c,transparent 68%);pointer-events:none}
.hero-immersive .asset-label{background:#101025cf;border-color:#51426b}.scene-controls button{background:#211b39;color:#d6cbea;border-color:#49395f}
.hero-note{color:#a59ab9}.status-dot{width:5px;height:5px;border-radius:50%;background:#75dbef;box-shadow:0 0 10px #75dbef55}
.scene-heading,.drag-hint{color:#aaa1bb}.principles{background:#10102160}.principle-num{color:#9b81cd}
.source-token{background:radial-gradient(ellipse at top,#40306b,#171129);border-color:#6d4ea0;box-shadow:0 0 50px #905aff16}.source-brand-mark{object-fit:contain;margin-bottom:3px}
.flow-target{background:#1a1730;border-color:#3c3352}.studio-controls{background:#efedf7;color:#252039}.studio-controls .field-note{color:#686176}
.allocation-item input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(to right,#7752b4 var(--range),#d7cfe5 var(--range))}.allocation-item input[type=range]::-webkit-slider-thumb{background:#6942a7;border-color:#efedf7;box-shadow:0 0 0 1px #6942a7}
.allocation-item input[type=range]::-moz-range-thumb{background:#6942a7;border-color:#efedf7}.allocation-item input[type=range]::-moz-range-track{background:#d7cfe5}
.closing{position:relative;isolation:isolate;overflow:hidden;margin-top:25px;border-radius:24px 24px 0 0;min-height:510px;background:#080717}
.closing::before{content:'';position:absolute;z-index:-2;inset:0;background:url('/assets/splitr-ribbon-banner.webp') center/cover no-repeat;opacity:.7}
.closing::after{content:'';position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,#080817f5,#080817a6 45%,#08081715)}
.closing h2{font-weight:500}.closing-rule{border-color:#5c41704d}.closing-index{font:11px var(--font);letter-spacing:.1em}.closing-bottom p{color:#c2b8d6}
.footer .brand-name{letter-spacing:.08em}.footer>span{color:#b5adc7}
@media(min-width:1500px){.hero-immersive{min-height:770px}.hero-immersive .hero-visual{height:640px}}
@media(max-width:1100px){.hero-immersive{min-height:690px}.hero-immersive h1{font-size:clamp(57px,6.7vw,74px)}.hero-immersive .hero-visual{height:560px}}
@media(max-width:850px){.hero-immersive{min-height:610px}.hero-immersive h1{font-size:56px}.hero-immersive .hero-visual{height:510px}}
@media(max-width:650px){.header{height:84px}.header .brand{gap:7px}[data-network=solana] .header .brand-mark{width:32px;height:32px}.header .brand-name{font-size:18px;letter-spacing:.04em}.header .brand-dot{display:none}.hero-immersive{padding-top:44px;padding-bottom:33px}.hero-immersive h1{font-size:clamp(51px,13.8vw,82px);line-height:1.08;letter-spacing:-.065em}.hero-immersive .hero-kicker{font-size:9px;letter-spacing:.13em}.hero-immersive .hero-visual{height:450px;margin-top:33px}.hero-immersive .hero-description{font-size:15px}.closing{min-height:440px;border-radius:18px 18px 0 0}.closing::before{background-position:61% center;opacity:.5}.closing::after{background:linear-gradient(90deg,#080817ee,#08081765)}.footer .brand-mark{width:35px;height:35px}.footer .brand-name{font-size:20px}}
@media(max-width:380px){.header-actions{gap:10px}.header .brand-name{font-size:16px}.header .button-small{padding:10px 9px;font-size:10px}.header .brand{gap:5px}.hero-immersive h1{font-size:51px}.hero-actions{gap:20px}}