:root{--bg:#07070a;--panel:#0d0d12;--line:rgba(255,255,255,.09);--line-strong:rgba(255,255,255,.15);--text:#f7f7fb;--muted:#858592;--accent:#ff7c30;--mint:#52e5d1;--shell:min(1120px,calc(100% - 40px));--shadow:0 28px 90px rgba(0,0,0,.45)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;min-height:100vh;min-height:100dvh;overflow-x:hidden;color:var(--text);background:var(--bg);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:16px;line-height:1.55}body::before{position:fixed;inset:0;z-index:-3;content:"";opacity:.24;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:58px 58px;mask-image:linear-gradient(to bottom,#000,transparent 92%)}body::after{position:fixed;inset:0;z-index:50;content:"";opacity:.024;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}.ambient{position:absolute;z-index:-2;border-radius:999px;filter:blur(120px);pointer-events:none}.ambient--one{top:500px;left:-250px;width:520px;height:900px;background:rgba(255,124,48,.08)}.ambient--two{top:1700px;right:-280px;width:560px;height:900px;background:rgba(82,229,209,.055)}
a{color:inherit;text-decoration:none}button,input{font:inherit}button,a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}button{color:inherit}img,svg{display:block}.shell{width:var(--shell);margin-inline:auto}.reveal{opacity:0;transform:translateY(24px);transition:opacity .75s ease,transform .75s cubic-bezier(.2,.75,.2,1)}.reveal[data-delay="1"]{transition-delay:.12s}.reveal.is-visible{opacity:1;transform:none}.hero-copy.is-visible{animation:heroIntro .9s cubic-bezier(.2,.75,.2,1) both}.nav-wrap{animation:navIntro .7s .08s cubic-bezier(.2,.75,.2,1) both}.fan-card--main{animation:mainCardIntro .9s .18s cubic-bezier(.16,.82,.24,1) both}.fan-card--left{animation:leftCardIntro .9s .3s cubic-bezier(.16,.82,.24,1) both}.fan-card--right{animation:rightCardIntro .9s .3s cubic-bezier(.16,.82,.24,1) both}@keyframes heroIntro{from{opacity:0;filter:blur(8px);transform:translateY(22px)}}@keyframes navIntro{from{opacity:0;transform:translate(-50%,-14px)}}@keyframes mainCardIntro{from{opacity:0;filter:blur(7px);transform:translate(-50%,28px) scale(.94)}}@keyframes leftCardIntro{from{opacity:0;transform:translate(35px,24px) rotateY(18deg) rotateZ(-2deg)}}@keyframes rightCardIntro{from{opacity:0;transform:translate(-35px,24px) rotateY(-18deg) rotateZ(2deg)}}
.nav-wrap{position:fixed;z-index:30;top:max(18px,env(safe-area-inset-top));left:50%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;width:min(920px,calc(100% - 30px));min-height:58px;padding:7px 9px 7px 16px;border:1px solid var(--line);border-radius:999px;background:rgba(8,8,12,.76);box-shadow:0 12px 44px rgba(0,0,0,.3);backdrop-filter:blur(22px);transform:translateX(-50%);transition:background .2s ease,border-color .2s ease}.nav-wrap.is-scrolled{background:rgba(8,8,12,.94);border-color:var(--line-strong)}.brand{display:inline-flex;align-items:center;gap:9px;width:max-content;font-weight:750;letter-spacing:-.035em}.brand img{width:30px;height:30px;object-fit:contain}.desktop-nav{display:flex;gap:26px;color:#85838f;font-size:.78rem}.desktop-nav a:hover,.nav-actions>a:first-child:hover{color:#fff}.nav-actions{display:flex;justify-self:end;align-items:center;gap:14px;color:#9b99a5;font-size:.78rem}.button{display:inline-flex;min-height:46px;align-items:center;justify-content:center;gap:9px;padding:0 20px;border:1px solid rgba(255,255,255,.12);border-radius:12px;color:#09090d;background:linear-gradient(120deg,#ff9456,#69e7d5);box-shadow:0 12px 34px rgba(255,114,33,.18),inset 0 1px rgba(255,255,255,.5);font-size:.84rem;font-weight:750;cursor:pointer;transition:transform .2s ease,filter .2s ease}.button:hover{transform:translateY(-2px);filter:saturate(1.12)}.button--small{min-height:42px;padding-inline:16px;border-radius:999px}.button--ghost{color:#d4d2db;background:rgba(255,255,255,.025);box-shadow:none}.button--ghost:hover{background:rgba(255,255,255,.06)}.menu-button,.mobile-nav{display:none}
.hero{position:relative;min-height:1160px;padding-top:210px;text-align:center}.eyebrow,.section-kicker{margin:0 0 18px;color:var(--mint);font-size:.7rem;font-weight:750;letter-spacing:.15em;text-transform:uppercase}.hero h1{margin:0;font-size:clamp(5rem,11vw,9rem);line-height:.88;letter-spacing:-.09em}.hero h1 span{color:transparent;background:linear-gradient(110deg,#ff9c63 18%,#63e5d2 85%);-webkit-background-clip:text;background-clip:text}.hero-copy>p:not(.eyebrow){margin:24px auto 0;color:var(--muted);font-size:1.05rem}.hero-actions{display:flex;justify-content:center;gap:10px;margin-top:28px}.hero-stats{display:flex;justify-content:center;gap:56px;margin-top:46px}.hero-stats strong,.hero-stats small{display:block}.hero-stats strong{font-size:1.1rem}.hero-stats small{margin-top:3px;color:#595865;font-size:.5rem;letter-spacing:.1em}.profile-fan{position:relative;width:min(730px,100%);height:440px;margin:68px auto 0;perspective:1100px}.profile-fan::before{position:absolute;inset:50px 20% 0;content:"";border-radius:50%;background:linear-gradient(110deg,rgba(255,124,48,.24),rgba(82,229,209,.14));filter:blur(65px)}.fan-card{position:absolute;top:55px;width:250px;height:345px;padding:28px 22px;overflow:hidden;border:1px solid var(--line-strong);border-radius:20px;background:radial-gradient(circle at 50% 0,rgba(255,124,48,.15),transparent 45%),#0b0b10;box-shadow:var(--shadow);text-align:center}.fan-card--left{left:45px;transform:rotateY(18deg) rotateZ(-5deg)}.fan-card--right{right:45px;transform:rotateY(-18deg) rotateZ(5deg)}.fan-card--main{z-index:3;top:0;left:50%;width:280px;height:400px;transform:translateX(-50%);background:radial-gradient(circle at 20% 15%,rgba(255,126,182,.2),transparent 35%),radial-gradient(circle at 85% 25%,rgba(82,229,209,.24),transparent 35%),#0c0b13;transition:transform .16s ease-out}.fan-card .tiny-views,.live-profile .tiny-views{position:absolute;top:14px;right:15px;color:#8b8994;font-size:.55rem}.fan-card>img,.fan-avatar{width:74px;height:74px;margin:44px auto 13px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 4px rgba(255,255,255,.05),0 0 30px rgba(255,124,48,.27)}.fan-avatar{display:grid;place-items:center;color:#101015;font-size:1.6rem;font-weight:850}.fan-avatar--dark{background:linear-gradient(145deg,#ff91c2,#ff7c30)}.fan-avatar--mint{background:linear-gradient(145deg,#74efd9,#619cff)}.fan-card>b,.fan-card>small{display:block}.fan-card>b{font-size:1.05rem}.fan-card>small{color:#777581;font-size:.65rem}.fan-icons{margin:9px 0 20px;color:var(--mint);font-size:.75rem;letter-spacing:.18em}.fan-card>i{display:block;height:36px;margin-top:8px;border:1px solid var(--line);border-radius:9px;background:rgba(255,255,255,.025)}.scroll-cue{position:absolute;bottom:24px;left:50%;color:#4c4b56;animation:float 1.8s ease-in-out infinite;transform:translateX(-50%)}@keyframes float{50%{transform:translate(-50%,7px)}}
.manifesto{display:flex;min-height:700px;flex-direction:column;justify-content:center}.manifesto>p{margin:0 0 16px;color:#696875;font-size:1rem}.manifesto h2,.section-heading h2{margin:0;font-size:clamp(3.3rem,7vw,6.7rem);line-height:.98;letter-spacing:-.07em}.manifesto em,.section-heading em{color:transparent;background:linear-gradient(105deg,#ff9a60,#64e6d3);-webkit-background-clip:text;background-clip:text;font-family:Georgia,"Times New Roman",serif;font-weight:500}.features{padding-top:120px}.section-heading{margin-bottom:70px}.section-heading h2{font-size:clamp(3.1rem,6vw,5.8rem)}.section-heading>p{max-width:600px;margin:18px 0 0;color:var(--muted)}.panel{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:28px;background:linear-gradient(145deg,rgba(255,255,255,.022),rgba(255,255,255,.006));box-shadow:inset 0 1px rgba(255,255,255,.025)}.panel header{position:relative;z-index:2;padding:36px}.panel h3,.connection-panel h3{margin:0 0 8px;font-size:clamp(1.7rem,3vw,2.45rem);letter-spacing:-.045em}.panel header p,.links-copy p,.connection-panel>div>p:last-child{max-width:480px;margin:0;color:var(--muted)}.feature-top-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(290px,.75fr);gap:18px}.customizer-panel,.analytics-panel{min-height:680px}.customizer-workspace{--demo-accent:#ff7c30;--card-opacity:.72;--card-blur:12px;--card-radius:18px;position:absolute;right:28px;bottom:0;left:28px;display:grid;grid-template-columns:minmax(260px,1fr) minmax(250px,1fr);height:495px;overflow:hidden;border:1px solid var(--line);border-bottom:0;border-radius:22px 22px 0 0;background:#09090d;box-shadow:0 -16px 60px rgba(0,0,0,.3)}.live-profile{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;margin:20px;padding:22px;border:1px solid color-mix(in srgb,var(--demo-accent) 25%,var(--line));border-radius:var(--card-radius);background:radial-gradient(circle at 50% 5%,color-mix(in srgb,var(--demo-accent) 26%,transparent),transparent 44%),rgba(10,9,15,var(--card-opacity));backdrop-filter:blur(var(--card-blur));transition:.18s ease}.live-avatar{width:92px;height:92px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 4px rgba(255,255,255,.05),0 0 36px color-mix(in srgb,var(--demo-accent) 35%,transparent);transition:border-radius .2s ease}.live-profile>strong{margin-top:12px;font-size:1.4rem;text-shadow:0 0 18px var(--demo-accent)}.live-profile.no-glow>strong{text-shadow:none}.live-badges{color:var(--demo-accent);letter-spacing:.18em}.live-profile>p{margin:2px 0 0;color:#85838f;font-size:.68rem}.profile-apps{display:flex;gap:11px;margin-top:20px}.live-controls{padding:27px;border-left:1px solid var(--line);background:#0e0e14}.control-title{display:flex;justify-content:space-between;margin-bottom:22px;font-weight:720}.control-title small{padding:4px 6px;border-radius:5px;color:var(--mint);background:rgba(82,229,209,.08);font-size:.5rem;letter-spacing:.1em}.live-controls>label:not(.toggle-row):not(.range-row){color:#74727e;font-size:.69rem}.swatches{display:flex;gap:9px;margin:9px 0 18px}.swatch{width:27px;height:27px;padding:0;border:2px solid transparent;border-radius:50%;background:var(--swatch);box-shadow:inset 0 0 0 3px #0e0e14;cursor:pointer}.swatch.is-active{border-color:#fff}.toggle-row{display:flex;align-items:center;justify-content:space-between;padding:11px 0;border-top:1px solid var(--line);color:#aaa8b3;font-size:.69rem;cursor:pointer}.toggle-row input{position:absolute;opacity:0}.toggle-row i{position:relative;width:34px;height:19px;border-radius:999px;background:#25242c}.toggle-row i::after{position:absolute;top:3px;left:3px;width:13px;height:13px;content:"";border-radius:50%;background:#686672;transition:.2s ease}.toggle-row input:checked+i{background:color-mix(in srgb,var(--demo-accent) 50%,#202028)}.toggle-row input:checked+i::after{background:#fff;transform:translateX(15px)}.range-row{display:block;margin-top:13px;color:#777581;font-size:.65rem}.range-row>span{display:flex;justify-content:space-between;margin-bottom:6px}.range-row b{color:#a3a1ac;font-weight:500}.range-row input{width:100%;height:4px;margin:0;accent-color:var(--demo-accent);cursor:pointer}.analytics-panel{display:flex;flex-direction:column}.analytics-card{margin:auto 34px 32px}.analytics-head{display:flex;align-items:center;justify-content:space-between;color:#b8b6c0;font-size:.78rem}.analytics-head small{display:flex;gap:3px;padding:3px;border-radius:999px;background:#16161c}.analytics-head b,.analytics-head i{padding:4px 7px;border-radius:999px;font-size:.55rem;font-style:normal}.analytics-head b{color:#09090d;background:var(--accent)}.analytics-head i{color:#686672}.analytics-bars{display:flex;align-items:end;gap:8px;height:230px;margin-top:25px;border-bottom:1px solid var(--line)}.analytics-bars i{flex:1;height:var(--h);border-radius:6px 6px 1px 1px;background:linear-gradient(to top,rgba(255,124,48,.45),var(--accent));box-shadow:0 0 22px rgba(255,124,48,.08)}.days{display:flex;justify-content:space-around;padding-top:8px;color:#52515b;font-size:.5rem}.analytics-card footer{display:flex;justify-content:space-between;margin-top:25px;padding-top:15px;border-top:1px solid var(--line);color:#6c6b76;font-size:.68rem}.analytics-card footer b{color:#fff;font-size:1rem}
.feature-bottom-grid{display:grid;grid-template-columns:minmax(290px,.7fr) minmax(0,1.7fr);gap:18px;margin-top:18px}.music-panel,.links-panel{min-height:590px}.music-player{max-width:260px;margin:10px auto 0;text-align:center}.music-player audio{display:none}.cover-art{position:relative;width:155px;height:155px;margin:0 auto 18px;overflow:hidden;border:1px solid var(--line-strong);border-radius:18px;background:#08080d;box-shadow:0 20px 50px rgba(0,0,0,.35)}.cover-art img{width:100%;height:100%;object-fit:cover;transition:filter .3s ease,transform .3s ease}.cover-equalizer{position:absolute;right:0;bottom:0;left:0;display:flex;height:38%;align-items:flex-end;justify-content:center;gap:3px;padding:8px;background:linear-gradient(transparent,rgba(5,5,8,.72))}.cover-equalizer i{width:3px;height:18%;border-radius:5px;background:linear-gradient(180deg,#fff,var(--mint));opacity:.45;transform-origin:bottom}.music-player.is-playing .cover-art img{animation:cover-breathe 2.7s ease-in-out infinite alternate;filter:saturate(1.15) contrast(1.04)}.music-player.is-playing .cover-equalizer i{animation:equalize .72s ease-in-out infinite alternate;opacity:1}.music-player.is-playing .cover-equalizer i:nth-child(3n){animation-duration:.47s}.music-player.is-playing .cover-equalizer i:nth-child(4n){animation-duration:.91s}.music-player.is-playing .cover-equalizer i:nth-child(5n){animation-delay:-.35s}.music-player>strong,.music-player>small{display:block}.music-player>small{color:#676570}.music-progress{--progress:0%;width:100%;height:4px;margin-top:22px;padding:0;border:0;border-radius:99px;outline:none;background:linear-gradient(90deg,var(--accent) 0,var(--mint) var(--progress),#2b2a32 var(--progress),#2b2a32 100%);cursor:pointer;appearance:none}.music-progress::-webkit-slider-thumb{width:10px;height:10px;border:2px solid #fff;border-radius:50%;background:var(--accent);opacity:0;appearance:none;transition:opacity .2s}.music-progress:hover::-webkit-slider-thumb,.music-progress:focus-visible::-webkit-slider-thumb{opacity:1}.music-progress::-moz-range-thumb{width:7px;height:7px;border:2px solid #fff;border-radius:50%;background:var(--accent);opacity:0}.music-progress:hover::-moz-range-thumb,.music-progress:focus-visible::-moz-range-thumb{opacity:1}.music-time{display:flex;justify-content:space-between;margin-top:5px;color:#55535e;font-size:.55rem}.music-controls{display:flex;align-items:center;justify-content:space-between;margin-top:25px;color:#666470}.music-controls button{display:grid;width:50px;height:50px;place-items:center;padding:0;border:0;border-radius:50%;color:#09090d;background:#fff;cursor:pointer;transition:transform .2s,box-shadow .2s}.music-controls button:hover{transform:scale(1.05);box-shadow:0 0 28px rgba(255,124,48,.25)}.music-controls button svg{grid-area:1/1;width:20px;height:20px;fill:currentColor}.pause-icon{display:none}.music-player.is-playing .play-icon{display:none}.music-player.is-playing .pause-icon{display:block}.links-panel{display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:38px;padding:40px}.links-copy h3{margin:0 0 8px;font-size:2.2rem;letter-spacing:-.045em}.smart-links{display:grid;gap:10px;padding:20px;border:1px solid var(--line);border-radius:22px;background:rgba(6,6,9,.5)}.smart-head{display:flex;justify-content:space-between;padding:2px 2px 7px;color:#d6d4dd;font-size:.72rem}.smart-head b{display:flex;align-items:center;gap:8px}.chain-icon{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.smart-head small{color:#65636e}.smart-links>button{display:grid;grid-template-columns:38px 1fr 20px;align-items:center;gap:12px;min-height:70px;padding:10px 13px;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.02);text-align:left;cursor:pointer;transition:.2s ease}.smart-links>button:hover{border-color:rgba(255,124,48,.35);background:rgba(255,124,48,.05);transform:translateY(-2px)}.smart-links>button span:nth-child(2){min-width:0}.smart-links>button b,.smart-links>button small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.smart-links>button b{font-size:.73rem}.smart-links>button small{color:#666470;font-size:.57rem}.copy-icon{position:relative;width:14px;height:14px;border:1px solid #696772;border-radius:3px}.copy-icon::before{position:absolute;right:3px;bottom:3px;width:10px;height:10px;content:"";border:1px solid #696772;border-radius:3px;background:#101016;transform:translate(-4px,-4px)}.connection-panel{display:grid;grid-template-columns:1fr auto;align-items:center;gap:50px;margin-top:18px;padding:46px 52px;border:1px solid rgba(255,124,48,.22);border-radius:28px;background:radial-gradient(circle at 95% 50%,rgba(82,229,209,.1),transparent 32%),radial-gradient(circle at 15% 100%,rgba(255,124,48,.14),transparent 45%),rgba(255,255,255,.012)}.connection-panel>div:first-child{max-width:540px}.connection-icons{display:flex;gap:10px}.connection-icons .brand-icon{width:74px;height:74px;flex-direction:column;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.025)}.connection-icons small{display:block;margin-top:7px;color:#716f7a;font-size:.55rem}
@keyframes equalize{0%{height:14%}45%{height:92%}100%{height:38%}}@keyframes cover-breathe{to{transform:scale(1.055)}}
.brand-icon{display:grid;width:28px;height:28px;place-items:center;color:var(--icon-color,#fff);font-size:0}.brand-icon::before{width:20px;height:20px;content:"";background:currentColor;mask:var(--icon) center/contain no-repeat;-webkit-mask:var(--icon) center/contain no-repeat}.discord{--icon-color:#7289ff;--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19.5 5.3A17 17 0 0 0 15.7 4l-.5 1a13 13 0 0 0-6.4 0l-.5-1a17 17 0 0 0-3.8 1.3C2.1 8.8 1.4 12.2 1.7 15.6A15 15 0 0 0 6.4 18l1.2-1.6c-.7-.3-1.4-.7-2-1.2 4.1 2.1 8.7 2.1 12.8 0-.6.5-1.3.9-2 1.2l1.2 1.6a15 15 0 0 0 4.7-2.4c.4-4-.7-7.3-2.8-10.3ZM8.8 14c-1.1 0-2-1-2-2.2s.9-2.2 2-2.2 2 1 2 2.2-.9 2.2-2 2.2Zm6.4 0c-1.1 0-2-1-2-2.2s.9-2.2 2-2.2 2 1 2 2.2-.9 2.2-2 2.2Z'/%3E%3C/svg%3E")}.spotify{--icon-color:#1ed760;--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm4.58 14.42a.62.62 0 0 1-.85.2c-2.35-1.44-5.31-1.76-8.8-.96a.62.62 0 1 1-.28-1.2c3.82-.88 7.1-.51 9.72 1.09.3.18.4.57.21.87Zm1.21-2.7a.78.78 0 0 1-1.07.26c-2.69-1.65-6.79-2.13-9.97-1.17a.78.78 0 1 1-.45-1.49c3.64-1.1 8.16-.56 11.23 1.33.37.22.48.7.26 1.07Zm.1-2.82C14.67 8.98 9.35 8.8 6.28 9.73a.94.94 0 1 1-.54-1.79c3.52-1.06 9.4-.85 13.12 1.36a.94.94 0 0 1-.96 1.6Z'/%3E%3C/svg%3E")}.github{--icon-color:#f4f4f6;--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.7a9.5 9.5 0 0 0-3 18.5c.5.1.7-.2.7-.5v-2c-2.8.6-3.4-1.2-3.4-1.2-.5-1.2-1.1-1.5-1.1-1.5-.9-.6.1-.6.1-.6 1 0 1.6 1 1.6 1 .9 1.6 2.4 1.1 3 .9.1-.7.4-1.1.7-1.3-2.3-.3-4.6-1.1-4.6-4.7 0-1 .4-1.9 1-2.6-.1-.3-.4-1.3.1-2.6 0 0 .8-.3 2.7 1a9.3 9.3 0 0 1 4.9 0c1.9-1.3 2.7-1 2.7-1 .5 1.3.2 2.3.1 2.6.6.7 1 1.6 1 2.6 0 3.6-2.3 4.4-4.6 4.7.4.3.7 1 .7 1.9v2.8c0 .3.2.6.7.5A9.5 9.5 0 0 0 12 2.7Z'/%3E%3C/svg%3E")}.twitch{--icon-color:#a970ff;--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 2h18v13l-5 5h-4l-3 3v-3H3V2Zm2 2v13h5v2l2-2h4l3-3V4H5Zm5 3h2v6h-2V7Zm5 0h2v6h-2V7Z'/%3E%3C/svg%3E")}.roblox{--icon-color:#e9e9ed;--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='m6 2 16 4-4 16-16-4L6 2Zm4 7-1 5 5 1 1-5-5-1Z'/%3E%3C/svg%3E")}.lastfm{--icon-color:#ff4d7d;--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.6 16.2 9.8 14s-1.3 1.5-3.2 1.5c-1.7 0-3-1.5-3-3.8 0-2.9 1.4-4 2.9-4 2.2 0 2.9 1.4 3.5 3.3l.8 2.5c.8 2.5 2.4 4.5 6.9 4.5 3.2 0 5.3-1 5.3-3.8 0-2.2-1.2-3.3-3.6-3.9l-1.8-.4c-1.2-.3-1.5-.8-1.5-1.6 0-.9.7-1.4 1.9-1.4 1.3 0 2 .5 2.1 1.7l2.7-.3C22.6 5.8 20.9 5 18.1 5c-2.5 0-5 1-5 3.6 0 1.7.8 2.8 2.9 3.4l1.9.5c1.4.4 1.8.9 1.8 1.7 0 1-.9 1.4-2.5 1.4-2.4 0-3.4-1.3-4.2-3.8l-.8-2.4C11.2 6.4 9.4 5 6.4 5 2.8 5 0 7.7 0 11.8 0 15.7 2.6 18 6.2 18c2.9 0 4.4-1.8 4.4-1.8Z'/%3E%3C/svg%3E")}
.pricing{padding-top:190px}.pricing-heading{text-align:center}.pricing-heading h2{margin:0;font-size:clamp(2.7rem,5vw,4.5rem);letter-spacing:-.06em}.pricing-heading p{margin:10px 0 0;color:var(--muted)}.pricing-grid{display:grid;grid-template-columns:1fr 1fr;max-width:760px;gap:18px;margin:55px auto 0}.price-card{position:relative;display:flex;min-height:530px;flex-direction:column;padding:30px;border:1px solid var(--line);border-radius:24px;background:rgba(255,255,255,.015)}.price-card--pro{border-color:rgba(255,124,48,.55);background:radial-gradient(circle at 100% 0,rgba(82,229,209,.08),transparent 35%),radial-gradient(circle at 0 100%,rgba(255,124,48,.12),transparent 45%),rgba(255,255,255,.02);box-shadow:0 25px 70px rgba(207,83,11,.09),inset 0 0 0 1px rgba(255,124,48,.12)}.plan{font-size:.78rem;font-weight:720}.popular{position:absolute;top:20px;right:20px;padding:5px 7px;border-radius:6px;color:var(--mint);background:rgba(82,229,209,.08);font-size:.48rem;font-weight:850;letter-spacing:.1em}.price-card h3{margin:14px 0 4px;font-size:2.25rem;letter-spacing:-.05em}.price-card h3 small{color:#6f6d79;font-size:.7rem;font-weight:500}.price-card ul{display:grid;gap:11px;margin:22px 0 28px;padding:22px 0 0;border-top:1px solid var(--line);list-style:none;color:#aaa8b3;font-size:.73rem}.price-card li::before{margin-right:9px;color:var(--mint);content:"✓"}.price-card .button{width:100%;margin-top:auto}.final-cta{display:flex;min-height:360px;margin-top:190px;flex-direction:column;align-items:center;justify-content:center;padding:45px;border:1px solid var(--line);border-radius:28px;background:radial-gradient(circle at 50% 120%,rgba(255,124,48,.18),transparent 52%),rgba(255,255,255,.012);text-align:center}.final-cta h2{margin:0;font-size:clamp(2rem,4vw,3.5rem);letter-spacing:-.05em}.final-cta>p{margin:10px 0 25px;color:var(--muted)}.final-cta>div{display:flex;gap:10px}.footer{display:grid;grid-template-columns:1.7fr repeat(4,1fr);gap:38px;padding:100px 0 max(40px,env(safe-area-inset-bottom));color:#6e6c78;font-size:.72rem}.footer-brand p{max-width:220px}.footer>div:not(.footer-brand):not(.footer-bottom){display:grid;align-content:start;gap:10px}.footer b{color:#c6c4cd}.footer a:hover{color:#fff}.footer-bottom{grid-column:1/-1;display:flex;justify-content:space-between;margin-top:24px;padding-top:24px;border-top:1px solid var(--line)}.footer-bottom>span{padding:7px 10px;border:1px solid var(--line);border-radius:999px}.footer-bottom i{display:inline-block;width:6px;height:6px;margin-right:7px;border-radius:50%;background:#48dea2;box-shadow:0 0 10px #48dea2}.toast{position:fixed;z-index:60;right:20px;bottom:max(20px,env(safe-area-inset-bottom));max-width:calc(100% - 40px);padding:13px 16px;border:1px solid var(--line-strong);border-radius:12px;background:rgba(14,14,20,.96);box-shadow:var(--shadow);opacity:0;pointer-events:none;transform:translateY(10px);transition:.2s ease}.toast.is-visible{opacity:1;transform:none}
@media(max-width:900px){:root{--shell:min(100% - 28px,720px)}.nav-wrap{grid-template-columns:1fr auto}.desktop-nav,.nav-actions{display:none}.menu-button{display:grid;width:40px;height:40px;place-items:center;padding:11px;border:1px solid var(--line);border-radius:50%;background:transparent;cursor:pointer}.menu-button span{display:block;width:18px;height:1px;margin:2px;background:#ddd;transition:.2s ease}.menu-button[aria-expanded="true"] span:first-child{transform:translateY(2.5px) rotate(45deg)}.menu-button[aria-expanded="true"] span:last-child{transform:translateY(-2.5px) rotate(-45deg)}.mobile-nav{position:absolute;top:66px;right:0;left:0;display:grid;max-height:calc(100dvh - 95px);overflow:auto;gap:3px;padding:10px;border:1px solid var(--line);border-radius:18px;background:rgba(9,9,13,.98);box-shadow:var(--shadow);opacity:0;pointer-events:none;transform:translateY(-8px);transition:.2s ease}.mobile-nav.is-open{opacity:1;pointer-events:auto;transform:none}.mobile-nav a{min-height:44px;padding:11px 13px;border-radius:10px}.feature-top-grid,.feature-bottom-grid{grid-template-columns:1fr}.customizer-panel{min-height:700px}.analytics-panel{min-height:520px}.analytics-card{margin-top:45px}.analytics-bars{height:190px}.music-panel{min-height:560px}.links-panel{min-height:500px}.connection-panel{grid-template-columns:1fr}.connection-icons{flex-wrap:wrap}.footer{grid-template-columns:1.4fr repeat(2,1fr)}.footer-bottom{grid-column:1/-1}}
@media(max-width:620px){:root{--shell:calc(100% - 20px)}.nav-wrap{top:max(10px,env(safe-area-inset-top));width:calc(100% - 18px);min-height:56px}.brand img{width:28px;height:28px}.hero{min-height:950px;padding-top:150px}.hero h1{font-size:clamp(4.1rem,23vw,6rem)}.hero-copy>p:not(.eyebrow){padding-inline:15px;font-size:.94rem}.hero-actions{flex-direction:column;max-width:250px;margin-inline:auto}.hero-stats{gap:26px}.profile-fan{height:370px;margin-top:45px}.fan-card{display:none}.fan-card--main{display:block;top:0;width:min(280px,86vw);height:370px}.manifesto{min-height:560px}.manifesto>p{font-size:.88rem}.manifesto h2{font-size:clamp(3rem,14vw,4.6rem)}.features{padding-top:75px}.section-heading{margin-bottom:42px}.section-heading h2{font-size:clamp(2.9rem,14vw,4.5rem)}.section-heading>p{font-size:.92rem}.panel{border-radius:22px}.panel header{padding:25px 21px}.customizer-panel{min-height:995px}.customizer-workspace{right:12px;left:12px;grid-template-columns:1fr;height:815px;border-radius:18px 18px 0 0}.live-profile{min-height:330px;margin:12px}.live-controls{padding:20px;border-top:1px solid var(--line);border-left:0}.analytics-panel{min-height:490px}.analytics-card{margin:20px 22px 26px}.analytics-bars{height:180px}.feature-bottom-grid{margin-top:12px;gap:12px}.music-panel{min-height:550px}.links-panel{grid-template-columns:1fr;min-height:600px;gap:28px;padding:26px 18px}.links-copy{padding:0 5px}.smart-links{padding:12px}.connection-panel{gap:28px;margin-top:12px;padding:30px 20px}.connection-icons{display:grid;grid-template-columns:repeat(3,1fr)}.connection-icons .brand-icon{width:100%;height:72px}.pricing{padding-top:130px}.pricing-grid{grid-template-columns:1fr;max-width:460px}.price-card{min-height:500px}.final-cta{min-height:390px;margin-top:130px;padding:35px 20px}.final-cta>div{width:100%;flex-direction:column}.footer{grid-template-columns:1fr 1fr;gap:35px 25px;padding-top:80px}.footer-brand{grid-column:1/-1}.footer-bottom{align-items:flex-start;flex-direction:column;gap:18px}.smart-links>button:hover{transform:none}}
@media(max-width:380px){:root{--shell:calc(100% - 14px)}.hero-stats{gap:18px}.hero-stats strong{font-size:.95rem}.customizer-panel{min-height:1020px}.customizer-workspace{right:8px;left:8px}.live-controls{padding:17px}.links-panel{padding-inline:14px}.smart-links{padding:9px}.connection-icons{grid-template-columns:repeat(2,1fr)}}

/* Brand-aware connection tiles */
.connection-panel{position:relative;overflow:hidden;isolation:isolate;min-height:230px;background:radial-gradient(circle at 92% 50%,rgba(255,124,48,.09),transparent 36%),radial-gradient(circle at 12% 110%,rgba(82,229,209,.08),transparent 46%),rgba(255,255,255,.012)}
.connection-panel::after{position:absolute;z-index:-1;right:-12%;bottom:-95%;width:58%;aspect-ratio:1;content:"";border-radius:50%;background:var(--connection-glow,rgba(255,124,48,.12));filter:blur(70px);opacity:.65;transition:background .35s ease,opacity .35s ease}
.connection-icons{align-items:center}
.connection-app{--brand:#a4a2ab;--brand-rgb:164,162,171;position:relative;width:82px!important;height:82px!important;padding:14px 8px!important;border:1px solid rgba(255,255,255,.075)!important;color:#8b8993!important;background:rgba(255,255,255,.025)!important;font:inherit;cursor:pointer;transition:color .22s ease,border-color .22s ease,background .22s ease,box-shadow .22s ease,transform .22s cubic-bezier(.2,.8,.2,1)!important}
.connection-app::before{width:25px!important;height:25px!important;transition:transform .22s ease,filter .22s ease}
.connection-app span{display:block;margin-top:8px;color:#777580;font-size:.64rem;line-height:1;transition:color .22s ease}
.connection-app.discord{--brand:#5865f2;--brand-rgb:88,101,242}.connection-app.spotify{--brand:#1ed760;--brand-rgb:30,215,96}.connection-app.lastfm{--brand:#d92323;--brand-rgb:217,35,35}.connection-app.github{--brand:#f4f4f6;--brand-rgb:244,244,246}.connection-app.roblox{--brand:#e2231a;--brand-rgb:226,35,26}
.connection-app:hover,.connection-app:focus-visible{color:var(--brand)!important;border-color:rgba(var(--brand-rgb),.48)!important;background:linear-gradient(145deg,rgba(var(--brand-rgb),.14),rgba(var(--brand-rgb),.035))!important;box-shadow:0 14px 35px rgba(var(--brand-rgb),.15),inset 0 1px rgba(255,255,255,.055);transform:translateY(-5px) scale(1.035)}
.connection-app:hover::before,.connection-app:focus-visible::before{transform:scale(1.12);filter:drop-shadow(0 0 9px rgba(var(--brand-rgb),.58))}
.connection-app:hover span,.connection-app:focus-visible span{color:var(--brand)}
.connection-app:focus-visible{outline:2px solid var(--brand);outline-offset:3px}
.connection-panel:has(.discord:hover)::after{--connection-glow:rgba(88,101,242,.3)}.connection-panel:has(.spotify:hover)::after{--connection-glow:rgba(30,215,96,.25)}.connection-panel:has(.lastfm:hover)::after{--connection-glow:rgba(217,35,35,.25)}.connection-panel:has(.github:hover)::after{--connection-glow:rgba(244,244,246,.16)}.connection-panel:has(.roblox:hover)::after{--connection-glow:rgba(226,35,26,.25)}
@media(hover:none){.connection-app:active{color:var(--brand)!important;border-color:rgba(var(--brand-rgb),.48)!important;background:rgba(var(--brand-rgb),.12)!important;transform:scale(.98)}.connection-app:active span{color:var(--brand)}}
@media(max-width:620px){.connection-panel{min-height:auto}.connection-icons .connection-app{width:100%!important;height:78px!important}.connection-app:hover{transform:none}}

/* Wider editorial feature system */
@media(min-width:901px){:root{--shell:min(1280px,calc(100% - 56px))}.feature-top-grid{grid-template-columns:minmax(0,2.05fr) minmax(350px,.95fr)}.feature-bottom-grid{grid-template-columns:minmax(350px,.78fr) minmax(0,1.72fr)}}
.customizer-panel,.analytics-panel{min-height:750px}.customizer-workspace{--card-border:1px;right:38px;left:38px;grid-template-columns:minmax(320px,1.05fr) minmax(330px,.95fr);height:560px}.live-profile{margin:26px;border-width:var(--card-border)}.live-controls{overflow:auto;padding:28px 32px}.control-title{font-size:.9rem}.live-controls>label:not(.toggle-row):not(.range-row){display:flex;justify-content:space-between;font-size:.72rem}.live-controls>label em{color:#55535f;font-size:.58rem;font-style:normal;font-weight:500}.swatches{margin-bottom:14px}.toggle-grid{display:grid;grid-template-columns:1fr 1fr;column-gap:20px}.toggle-grid .toggle-row{padding:9px 0}.preview-hidden{opacity:0!important;pointer-events:none}.live-profile .tiny-views,.live-badges{transition:opacity .2s ease}.range-row input{--range-progress:50%;height:5px;border-radius:99px;background:linear-gradient(90deg,var(--demo-accent) var(--range-progress),#44434b var(--range-progress));accent-color:var(--demo-accent);appearance:none}.range-row input::-webkit-slider-thumb{width:14px;height:14px;border:2px solid #0e0e14;border-radius:50%;background:var(--demo-accent);box-shadow:0 0 0 2px rgba(255,255,255,.08);appearance:none}.range-row input::-moz-range-thumb{width:12px;height:12px;border:2px solid #0e0e14;border-radius:50%;background:var(--demo-accent)}
.analytics-card{margin:auto 38px 35px}.analytics-tabs{display:flex;gap:3px;padding:3px;border-radius:999px;background:#16161c}.analytics-tabs button{padding:5px 9px;border:0;border-radius:999px;color:#686672;background:transparent;font-size:.62rem;cursor:pointer;transition:.2s ease}.analytics-tabs button.is-active{color:#09090d;background:#f5f4f7}.analytics-bars{gap:9px}.analytics-bars i{position:relative;cursor:pointer;transition:height .38s cubic-bezier(.2,.8,.2,1),filter .2s,opacity .2s,transform .2s;outline:0}.analytics-bars i::after{position:absolute;bottom:calc(100% + 10px);left:50%;width:max-content;padding:5px 8px;border:1px solid var(--line-strong);border-radius:7px;color:#eee;background:#202027;box-shadow:0 8px 20px rgba(0,0,0,.28);content:attr(data-value);font-size:.6rem;font-style:normal;opacity:0;pointer-events:none;transform:translate(-50%,5px);transition:.18s ease}.analytics-bars:has(i:hover) i:not(:hover),.analytics-bars:has(i:focus-visible) i:not(:focus-visible){filter:saturate(.45);opacity:.28}.analytics-bars i:hover,.analytics-bars i:focus-visible{z-index:2;filter:brightness(1.16);transform:scaleX(1.06)}.analytics-bars i:hover::after,.analytics-bars i:focus-visible::after{opacity:1;transform:translate(-50%,0)}.days{font-size:.56rem}.analytics-card footer{font-size:.72rem}.analytics-card footer b{font-size:1.15rem}
.music-panel,.links-panel{min-height:620px}.music-player{max-width:300px}.cover-art{width:180px;height:180px}.links-panel{grid-template-columns:.85fr 1.15fr;padding:48px}.smart-links{padding:24px}.smart-links>button{min-height:76px;padding:12px 15px}
@media(max-width:900px){.customizer-panel{min-height:780px}.customizer-workspace{right:24px;left:24px;height:575px}.analytics-panel{min-height:560px}}
@media(max-width:760px){.customizer-panel{min-height:1110px}.customizer-workspace{grid-template-columns:1fr;height:910px}.live-profile{min-height:350px}.live-controls{border-top:1px solid var(--line);border-left:0}}
@media(max-width:620px){.customizer-panel{min-height:1110px}.customizer-workspace{right:12px;left:12px;height:910px}.toggle-grid{grid-template-columns:1fr}.live-controls{padding:22px}.analytics-panel{min-height:520px}.music-panel{min-height:610px}.links-panel{min-height:640px;padding:28px 18px}.cover-art{width:170px;height:170px}}

/* Icon and surface refinement */
.customizer-workspace{overflow:visible;border:0;background:transparent;box-shadow:none}.live-controls{background:transparent}.control-title>span,.analytics-head>span{display:flex;align-items:center;gap:8px}.control-title svg,.analytics-head svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.profile-apps button{width:34px;height:34px;padding:0;border:1px solid transparent;border-radius:9px;background:transparent;cursor:pointer;transition:transform .18s ease,border-color .18s ease,background .18s ease,filter .18s ease}.profile-apps button:hover,.profile-apps button:focus-visible{border-color:color-mix(in srgb,currentColor 38%,transparent);background:color-mix(in srgb,currentColor 10%,transparent);filter:drop-shadow(0 0 7px currentColor);transform:translateY(-3px)}.profile-apps button:active{transform:scale(.94)}.profile-apps button:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.copy-icon{width:19px;height:19px;border:0;background:transparent}.copy-icon::before,.copy-icon::after{position:absolute;width:11px;height:11px;content:"";border:1.5px solid #777580;border-radius:3px;background:#101016;transition:border-color .18s ease,transform .18s ease}.copy-icon::before{right:0;bottom:0;transform:none}.copy-icon::after{top:0;left:0}.smart-links>button:hover .copy-icon::before,.smart-links>button:hover .copy-icon::after{border-color:var(--accent)}.smart-links>button:hover .copy-icon::before{transform:translate(1px,1px)}.smart-links>button:hover .copy-icon::after{transform:translate(-1px,-1px)}
.music-controls button{display:grid;place-items:center;border:0;cursor:pointer}.music-controls .music-action{width:36px;height:36px;padding:0;border:1px solid transparent;border-radius:10px;color:#6f6d77;background:transparent;transition:.18s ease}.music-controls .music-action:hover,.music-controls .music-action:focus-visible{border-color:var(--line);color:#fff;background:rgba(255,255,255,.045);transform:translateY(-2px)}.music-controls .music-action:active{transform:scale(.92)}.music-controls .music-action svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.music-controls .play-button svg{width:24px;height:24px}.music-controls .play-button .play-icon{margin-left:2px}.music-controls button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.live-controls{border-left:0}.live-badges{display:flex;align-items:center;justify-content:center;gap:7px;height:19px;margin-top:3px;letter-spacing:0;transition:height .2s ease,margin .2s ease,opacity .15s ease}.live-badges span{display:grid;place-items:center;width:17px;height:17px}.live-badges svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.live-profile.badges-hidden .live-badges{height:0;margin:0;opacity:0;overflow:hidden;pointer-events:none}.live-profile>p,.profile-apps{transition:margin .2s ease,transform .2s ease}.live-profile.badges-hidden>p{margin-top:5px}.live-profile.badges-hidden .profile-apps{margin-top:14px;transform:translateY(-1px)}
@media(hover:none){.button:hover,.smart-links>button:hover{transform:none}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* Unified animated notifications */
.toast{display:grid;grid-template-columns:30px 1fr;align-items:center;min-height:56px;max-width:min(390px,calc(100% - 40px));gap:10px;padding:10px 15px 10px 10px;overflow:hidden;border:1px solid rgba(255,255,255,.13);border-radius:15px;color:#f3f2f7;background:linear-gradient(135deg,rgba(26,25,34,.97),rgba(12,12,16,.95));box-shadow:0 22px 60px rgba(0,0,0,.48),inset 0 1px rgba(255,255,255,.045);backdrop-filter:blur(18px);font-size:.76rem;filter:blur(4px);transform:translateY(16px) scale(.96);transition:opacity .28s ease,transform .36s cubic-bezier(.2,.8,.2,1),filter .28s ease}
.toast::before{display:grid;place-items:center;width:30px;height:30px;border:1px solid rgba(255,124,48,.38);border-radius:9px;color:#fff;background:rgba(255,124,48,.16);box-shadow:0 0 20px rgba(255,124,48,.2);content:"✦"}
.toast::after{position:absolute;right:12px;bottom:0;left:12px;height:2px;border-radius:99px;background:linear-gradient(90deg,#ff7c30,#52e5d1);content:"";transform-origin:left}
.toast.is-visible{opacity:1;filter:none;transform:none}.toast.is-visible::after{animation:toastProgress 3.2s linear both}.toast.is-leaving{opacity:0;filter:blur(2px);transform:translateY(8px) scale(.98)}
@keyframes toastProgress{to{transform:scaleX(0)}}
@media(max-width:520px){.toast{right:12px;bottom:max(12px,env(safe-area-inset-bottom));left:12px;max-width:none}}

/* Landing page fidelity pass */
:root{--bg:#050506;--panel:#0a0a0c;--line:rgba(255,255,255,.075);--line-strong:rgba(255,255,255,.12);--text:#f4f3f6;--muted:#77757f;--accent:#ff7c30;--mint:#ff7c30;--shell:min(1280px,calc(100% - 56px));--shadow:0 30px 90px rgba(0,0,0,.52)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
body{background:#050506;font-size:15px}
body::before{background:none;opacity:0}
body::after{opacity:.018}
.ambient--one{top:430px;left:-300px;width:700px;height:1100px;background:rgba(255,124,48,.075);filter:blur(150px)}
.ambient--two{top:2300px;right:-340px;width:720px;height:1200px;background:rgba(255,124,48,.055);filter:blur(160px)}
.reveal{transform:translateY(34px);filter:blur(5px);transition:opacity .9s ease,transform 1s cubic-bezier(.16,.8,.2,1),filter .9s ease}
.reveal.is-visible{filter:none}
.nav-wrap{top:max(18px,env(safe-area-inset-top));grid-template-columns:1fr auto 1fr;width:min(1020px,calc(100% - 32px));min-height:62px;padding:7px 10px 7px 18px;border-color:rgba(255,255,255,.08);background:rgba(5,5,6,.78);box-shadow:0 18px 60px rgba(0,0,0,.25);backdrop-filter:blur(20px) saturate(1.2)}
.nav-wrap.is-scrolled{border-color:rgba(255,255,255,.11);background:rgba(5,5,6,.93)}
.nav-wrap .brand img{width:32px;height:32px}
.desktop-nav{gap:36px;color:#68666e;font-size:.76rem}
.desktop-nav a{transition:color .2s ease}
.desktop-nav a:hover{color:#f4f3f6}
.nav-actions{justify-self:end}
.button{min-height:44px;padding:0 22px;border-color:rgba(255,255,255,.1);border-radius:12px;color:#fff;background:#ff7c30;box-shadow:0 13px 32px rgba(255,124,48,.18),inset 0 1px rgba(255,255,255,.16);font-size:.8rem;transition:transform .22s cubic-bezier(.2,.8,.2,1),background .2s ease,box-shadow .2s ease}
.button:hover{background:#ff8a46;box-shadow:0 16px 38px rgba(255,124,48,.25),inset 0 1px rgba(255,255,255,.18);filter:none;transform:translateY(-2px)}
.button--small{min-height:40px;padding-inline:21px}
.button--ghost{color:#b4b2ba;background:rgba(255,255,255,.018);box-shadow:none}
.button--ghost:hover{color:#fff;background:rgba(255,255,255,.045);box-shadow:none}
.hero{min-height:1320px;padding-top:245px}
.hero-copy{position:relative;z-index:2}
.hero h1{font-size:clamp(6rem,10vw,9.2rem);font-weight:700;line-height:.86;letter-spacing:-.085em}
.hero h1::after{color:var(--accent);content:"."}
.hero-copy>p:not(.eyebrow){margin-top:34px;color:#706e76;font-size:1rem}
.hero-actions{gap:12px;margin-top:30px}
.hero-stats{gap:62px;margin-top:48px}
.hero-stats strong{font-size:1.06rem;font-weight:700}
.hero-stats small{margin-top:5px;color:#48464e;font-size:.48rem;letter-spacing:.1em}
.profile-fan{width:min(760px,100%);height:500px;margin-top:72px}
.profile-fan::before{inset:52px 15% -30px;background:rgba(255,124,48,.16);filter:blur(82px)}
.fan-card{top:70px;width:252px;height:350px;border-color:rgba(255,255,255,.09);border-radius:18px;background:radial-gradient(circle at 50% 0,rgba(255,124,48,.1),transparent 48%),#09090c;box-shadow:0 34px 90px rgba(0,0,0,.6)}
.fan-card--left{left:42px;transform:rotateY(20deg) rotateZ(-6deg)}
.fan-card--right{right:42px;transform:rotateY(-20deg) rotateZ(6deg)}
.fan-card--main{top:0;width:286px;height:410px;background:radial-gradient(circle at 20% 12%,rgba(255,124,48,.24),transparent 36%),radial-gradient(circle at 90% 34%,rgba(255,124,48,.12),transparent 40%),#0a0910}
.fan-icons{color:#fff;filter:drop-shadow(0 0 7px rgba(255,255,255,.3))}
.scroll-cue{bottom:70px;color:#3b3941;font-size:1.2rem}
.manifesto{min-height:780px;padding-top:50px}
.manifesto>p{margin-bottom:20px;color:#6b6871;font-size:1rem}
.manifesto h2,.section-heading h2{font-size:clamp(4.4rem,7vw,7rem);font-weight:700;line-height:.92;letter-spacing:-.075em}
.manifesto em,.section-heading em{position:relative;color:var(--accent);background:none;font-family:Georgia,"Times New Roman",serif;font-weight:600}
.manifesto em::after{position:absolute;right:0;bottom:-5px;left:0;height:4px;border-radius:999px;background:var(--accent);content:"";opacity:.75;transform:scaleX(0);transform-origin:left;transition:transform 1.1s .35s cubic-bezier(.16,.8,.2,1)}
.manifesto.is-visible em::after{transform:scaleX(1)}
.features{padding-top:160px}
.section-heading{margin:0 0 84px auto;width:min(680px,100%)}
.section-heading h2{font-size:clamp(3.9rem,6.3vw,6.3rem)}
.section-heading>p{margin-top:18px;color:#74717b;font-size:1rem}
.panel{border-color:rgba(255,255,255,.075);border-radius:26px;background:rgba(255,255,255,.012);box-shadow:inset 0 1px rgba(255,255,255,.018)}
.panel header{padding:46px 48px}
.panel h3,.connection-panel h3{font-size:clamp(2rem,3vw,2.7rem);font-weight:700;letter-spacing:-.055em}
.panel header p,.links-copy p,.connection-panel>div>p:last-child{color:#76737c;font-size:.96rem;line-height:1.5}
.feature-top-grid{grid-template-columns:minmax(0,2.05fr) minmax(350px,.95fr);gap:20px}
.feature-bottom-grid{grid-template-columns:minmax(350px,.78fr) minmax(0,1.72fr);gap:20px;margin-top:20px}
.customizer-panel,.analytics-panel{min-height:790px}
.customizer-workspace{right:38px;left:38px;height:585px}
.live-profile{margin:25px;background:radial-gradient(circle at 50% 0,color-mix(in srgb,var(--demo-accent) 18%,transparent),transparent 45%),rgba(8,8,10,var(--card-opacity))}
.live-controls{padding:31px 34px}
.analytics-card{margin:auto 38px 38px}
.analytics-bars i{background:var(--accent);box-shadow:0 0 22px rgba(255,124,48,.08)}
.analytics-tabs button.is-active{color:#fff;background:#29272e}
.music-panel,.links-panel{min-height:650px}
.links-panel{padding:52px}
.connection-panel{min-height:245px;margin-top:20px;border-radius:26px;background:radial-gradient(circle at 100% 100%,rgba(255,124,48,.15),transparent 56%),rgba(255,124,48,.04)}
.section-kicker{display:none}
.connection-app:hover,.connection-app:focus-visible{border-color:rgba(255,124,48,.48)!important;color:#fff!important;background:rgba(255,124,48,.12)!important;box-shadow:0 14px 35px rgba(255,124,48,.14)!important}
.connection-app:hover span,.connection-app:focus-visible span{color:#fff}
.pricing{padding-top:210px}
.pricing-heading h2{font-size:clamp(3rem,5.4vw,5.2rem)}
.pricing-grid{max-width:780px;gap:20px;margin-top:64px}
.price-card{min-height:550px;border-radius:22px;background:#08080a}
.price-card--pro{border-color:rgba(255,124,48,.54);background:rgba(255,124,48,.035);box-shadow:0 24px 80px rgba(255,124,48,.08),inset 0 0 0 1px rgba(255,124,48,.08)}
.popular{color:#fff;background:rgba(255,124,48,.16)}
.price-card li::before{color:var(--accent)}
.final-cta{min-height:300px;max-width:780px;margin-top:200px;border-radius:22px;background:radial-gradient(circle at 50% 120%,rgba(255,124,48,.12),transparent 58%),rgba(255,255,255,.012)}
.final-cta h2{font-size:clamp(2.3rem,4vw,3.5rem)}
.footer{grid-template-columns:repeat(4,1fr);max-width:1120px;padding-top:120px}
.footer-brand{display:none}
.footer-bottom{grid-column:1/-1}
.toast::before{border-color:rgba(255,124,48,.38);background:rgba(255,124,48,.16);box-shadow:0 0 20px rgba(255,124,48,.2)}
.toast::after{background:#ff7c30}
@media(max-width:900px){:root{--shell:min(100% - 28px,760px)}.hero{min-height:1120px;padding-top:190px}.manifesto{min-height:680px}.section-heading{width:100%}.feature-top-grid,.feature-bottom-grid{grid-template-columns:1fr}.footer{grid-template-columns:repeat(2,1fr)}.footer-bottom{grid-column:1/-1}}
@media(max-width:620px){:root{--shell:calc(100% - 20px)}.nav-wrap{top:max(10px,env(safe-area-inset-top));width:calc(100% - 18px)}.nav-wrap .brand img{width:30px;height:30px}.hero{min-height:980px;padding-top:165px}.hero h1{font-size:clamp(5rem,24vw,7rem)}.hero-copy>p:not(.eyebrow){font-size:.9rem}.hero-actions{max-width:250px}.hero-stats{gap:28px}.profile-fan{height:390px;margin-top:52px}.manifesto{min-height:620px}.manifesto h2{font-size:clamp(3.25rem,15vw,4.9rem)}.features{padding-top:90px}.section-heading h2{font-size:clamp(3.1rem,15vw,4.8rem)}.panel header{padding:28px 23px}.customizer-panel{min-height:1120px}.customizer-workspace{height:920px}.analytics-panel{min-height:530px}.music-panel{min-height:620px}.links-panel{min-height:650px;padding:30px 20px}.connection-panel{padding:34px 22px}.pricing{padding-top:150px}.final-cta{margin-top:150px}.footer{grid-template-columns:1fr 1fr;padding-top:90px}}

/* ---- live preview cards (homepage) ---- */
.fan-card.is-skeleton{display:flex;flex-direction:column;align-items:center;gap:10px;padding-top:88px}
.fan-card.is-skeleton .fp-avatar{width:70px;height:70px;border-radius:50%;background:rgba(255,255,255,.05);animation:fpPulse 1.4s ease-in-out infinite}
.fan-card.is-skeleton>i{display:block;width:70%;height:10px;margin:0;border:0;border-radius:6px;background:rgba(255,255,255,.05);animation:fpPulse 1.4s ease-in-out infinite}
.fan-card.is-skeleton>i:nth-of-type(2){width:50%}
.fan-card.is-skeleton>i:nth-of-type(3){width:38%;margin-top:18px}
@keyframes fpPulse{50%{opacity:.45}}
@media(max-width:620px){.fan-card--left.is-skeleton,.fan-card--right.is-skeleton{display:none}}

.fan-card.fade-preview{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:18px 16px;color:var(--p-primary,#f7f7fb);background:#07070a;cursor:pointer;isolation:isolate;overflow:hidden}
@media(max-width:620px){.fan-card--left.fade-preview,.fan-card--right.fade-preview{display:none}}
.fan-card.fade-preview:focus-visible{outline:2px solid var(--p-accent,#ff7c30);outline-offset:4px}
.fade-preview .fp-bg{position:absolute;inset:0;z-index:-1;background-color:var(--p-page,#000);background-position:center;background-size:cover;background-repeat:no-repeat}
.fade-preview.has-background .fp-bg::after{position:absolute;inset:0;content:"";background:radial-gradient(circle at center,rgba(5,5,7,.18),rgba(5,5,7,.86))}
.fade-preview .fp-box{position:relative;display:flex;flex-direction:column;align-items:center;width:100%;padding:30px 16px 20px;border:var(--p-border-width,1px) solid var(--p-border,rgba(255,255,255,.1));border-radius:var(--p-radius,16px);background:color-mix(in srgb,var(--p-card,#101016) var(--p-opacity,12%),transparent);box-shadow:0 20px 60px rgba(0,0,0,.35),inset 0 1px rgba(255,255,255,.03);-webkit-backdrop-filter:blur(var(--p-blur,8px));backdrop-filter:blur(var(--p-blur,8px));text-align:center}

.fade-preview .fp-box.avatar-hidden{padding-top:26px}
.fade-preview .fp-views{position:absolute;top:10px;right:12px;display:flex;align-items:center;gap:4px;color:#fff;font-family:Inter,system-ui,sans-serif;font-size:.58rem}
.fade-preview .fp-views svg{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:2}
.fade-preview .fp-avatar{position:relative;display:grid;flex:none;place-items:center;width:58px;height:58px;margin-bottom:11px;overflow:hidden;border:1px solid rgba(255,255,255,.12);border-radius:50%;color:#fff;background:#000;box-shadow:0 10px 30px rgba(0,0,0,.28);font-family:Inter,system-ui,sans-serif;font-size:1.15rem;font-weight:700}
.fade-preview .fp-avatar.is-square{border-radius:14px}
.fade-preview .fp-avatar img{width:100%;height:100%;object-fit:cover}
.fade-preview .fp-name{position:relative;max-width:100%;overflow:hidden;font-size:1rem;text-overflow:ellipsis;white-space:nowrap}
.fade-preview .fp-name.has-glow{text-shadow:0 0 8px currentColor,0 0 22px color-mix(in srgb,var(--p-accent,#ff7c30) 70%,transparent)}
.fade-preview .fp-badges{position:relative;display:flex;flex-wrap:wrap;justify-content:center;gap:2px;margin-top:6px;color:#fff}
.fade-preview .fp-badge{display:grid;place-items:center;width:19px;height:19px}
.fade-preview .fp-badge svg{width:13px;height:13px;overflow:visible;filter:drop-shadow(0 0 4px rgba(255,255,255,.72)) drop-shadow(0 0 10px rgba(255,255,255,.24))}
.fade-preview .fp-badge .badge-fill{fill:currentColor;stroke:none}
.fade-preview .fp-badge .badge-cut{fill:none;stroke:#08080b;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.fade-preview .fp-bio{position:relative;display:-webkit-box;max-width:100%;margin-top:7px;overflow:hidden;color:var(--p-secondary,#9a99aa);font-size:.66rem;line-height:1.5;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.fade-preview .fp-links{position:relative;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:13px}
.fade-preview .fp-link svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8}
.fade-preview .fp-link .social-fill{fill:currentColor;stroke:none}
.fade-preview .fp-handle{padding:6px 11px;border:1px solid rgba(255,255,255,.08);border-radius:999px;color:rgba(255,255,255,.62);background:rgba(0,0,0,.35);font-family:Inter,system-ui,sans-serif;font-size:.58rem;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.fade-preview.is-empty .fp-box{border-style:dashed;border-color:rgba(255,255,255,.1);background:rgba(255,255,255,.015)}
.fade-preview.is-empty .fp-avatar{color:#5d5b66}
.fade-preview.is-empty .fp-name{color:#f4f3f6}
.fade-preview.is-empty .fp-bio{color:#77757f}
.fade-preview.is-empty .fp-views{color:#77757f}
.fade-preview.is-empty .fp-handle{color:#ff9a5c}
.fade-preview .fp-bg video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.fade-preview.has-background .fp-bg::after{z-index:1}

html{overflow-x:clip}