:root{--c-bg:#e6e6fa;--c-card-light:#f8f4ff;--c-purple-light:#9d81ba;--c-purple-mid:#8b5fbf;--c-brand:#673147;--c-brand-dark:#2d1b33;--c-card-dark:#2d1b33;--c-grid:indigo;--f-display:"Mada", system-ui, -apple-system, sans-serif}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{background-color:var(--c-bg);color:var(--c-brand);font-family:var(--f-display);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;position:relative;overflow:hidden}a{color:inherit;text-decoration:none}button{font-family:inherit}.bg-canvas{z-index:0;pointer-events:none;background-image:repeating-radial-gradient(circle,#0000 0 48px,#6731470f 48px 50px);width:200%;height:200%;animation:150s linear infinite rotateBg;position:fixed;top:-50%;left:-50%;-webkit-mask-image:linear-gradient(to bottom right,#000 20%,#0000 80%);mask-image:linear-gradient(to bottom right,#000 20%,#0000 80%)}@keyframes rotateBg{0%{transform:rotate(0)scale(1)}50%{transform:rotate(180deg)scale(1.1)}to{transform:rotate(360deg)scale(1)}}@media (prefers-reduced-motion:reduce){.bg-canvas{animation:none}}.nav-frame{pointer-events:none;z-index:40;padding:2.5rem;position:fixed;inset:0}.nav-item{color:var(--c-brand);pointer-events:auto;cursor:pointer;letter-spacing:.02em;font-size:1.25rem;font-weight:500;transition:all .3s;position:absolute}.nav-item:hover{color:var(--c-brand-dark);transform:scale(1.05)}.nav-top{font-size:1.6rem;font-weight:800;top:2.5rem;left:50%;transform:translate(-50%)}.nav-bottom{bottom:2.5rem;left:50%;transform:translate(-50%)}.nav-left{transform-origin:0;top:50%;left:2.5rem;transform:translateY(-50%)rotate(-90deg)}.nav-right{transform-origin:100%;top:50%;right:2.5rem;transform:translateY(-50%)rotate(90deg)}.nav-item:hover.nav-top,.nav-item:hover.nav-bottom{transform:translate(-50%)scale(1.05)}.nav-item:hover.nav-left{transform:translateY(-50%)rotate(-90deg)scale(1.05)}.nav-item:hover.nav-right{transform:translateY(-50%)rotate(90deg)scale(1.05)}@media (width<=640px){.nav-frame{padding:1.5rem}.nav-item{font-size:1rem}.nav-top{font-size:1.25rem}.nav-left{left:1.5rem}.nav-right{right:1.5rem}}.pill-btn{background:var(--c-brand-dark);color:var(--c-bg);font-family:var(--f-display);cursor:pointer;border:none;border-radius:999px;align-items:center;padding:1.25rem 3rem;font-size:1.1rem;font-weight:700;transition:all .4s cubic-bezier(.25,1,.5,1);display:inline-flex;position:relative;overflow:hidden}.pill-btn:after{content:"";box-shadow:inset 0 0 0 2px var(--c-brand-dark);opacity:0;border-radius:999px;transition:all .4s cubic-bezier(.25,1,.5,1);position:absolute;inset:0;transform:scale(1.1)}.pill-label{z-index:1;position:relative}.btn-icon{z-index:1;opacity:0;transition:all .4s cubic-bezier(.25,1,.5,1);position:absolute;left:1.5rem;transform:translate(10px)}.pill-btn:hover{color:var(--c-brand-dark);background:0 0;padding-left:4rem}.pill-btn:hover:after{opacity:1;transform:scale(1)}.pill-btn:hover .btn-icon{opacity:1;transform:translate(0)}.hero-section{z-index:30;direction:ltr;flex-direction:column;align-items:flex-start;max-width:520px;display:flex;position:absolute;bottom:12vh;left:8vw}.hero-title{font-family:var(--f-display);letter-spacing:-.02em;color:var(--c-brand-dark);margin-bottom:2rem;font-size:clamp(5rem,10vw,11rem);font-weight:900;line-height:.85}.hero-desc{text-align:left;color:var(--c-brand);opacity:.85;max-width:90%;margin-bottom:2.5rem;font-size:clamp(1rem,1.4vw,1.2rem);line-height:1.6}@media (width<=768px){.hero-section{text-align:center;align-items:center;max-width:88vw;bottom:14vh;left:50%;transform:translate(-50%)}.hero-desc{text-align:center}}.scatter-container{z-index:10;pointer-events:none;width:70vw;height:100vh;position:absolute;top:0;right:0}.tool-card{pointer-events:auto;cursor:pointer;will-change:transform;border-radius:16px;width:180px;height:112px;transition:all .5s cubic-bezier(.34,1.56,.64,1);position:absolute;overflow:hidden;box-shadow:0 20px 40px #2d1b3314}.tool-card:after{content:"";pointer-events:none;border-radius:16px;position:absolute;inset:0;box-shadow:inset 0 0 0 1px #fff3}.tool-card:hover{box-shadow:0 30px 60px #2d1b3326;z-index:20!important;transform:scale(1.15)translateY(-10px)!important}@keyframes float-1{0%,to{transform:translate(0)rotate(-4deg)}50%{transform:translate(-15px,-25px)rotate(2deg)}}@keyframes float-2{0%,to{transform:translate(0)rotate(6deg)}50%{transform:translate(20px,-15px)rotate(-2deg)}}@keyframes float-3{0%,to{transform:translate(0)rotate(-2deg)}50%{transform:translate(10px,20px)rotate(4deg)}}@keyframes float-4{0%,to{transform:translate(0)rotate(8deg)}50%{transform:translate(-20px,15px)rotate(1deg)}}.card-1{background:var(--c-purple-mid);z-index:12;animation:12s ease-in-out infinite float-1;top:15%;left:10%}.card-2{background:var(--c-purple-light);z-index:11;animation:14s ease-in-out 1s infinite float-2;top:8%;left:55%}.card-3{background:var(--c-card-dark);z-index:15;animation:15s ease-in-out 2s infinite float-3;top:35%;left:35%}.card-4{background:var(--c-purple-light);z-index:13;animation:13s ease-in-out .5s infinite float-4;top:30%;left:75%}.card-5{background:var(--c-card-light);z-index:14;animation:16s ease-in-out 1.5s infinite float-2;top:60%;left:15%}.card-6{background:var(--c-card-light);z-index:16;animation:14s ease-in-out .2s infinite float-1;top:65%;left:60%}.card-7{background:var(--c-card-light);z-index:17;animation:15s ease-in-out 2.5s infinite float-4;top:80%;left:35%}.card-8{background:var(--c-card-dark);z-index:11;animation:17s ease-in-out 1s infinite float-3;top:55%;left:85%}.card-art{width:100%;height:100%;position:relative}.card-art svg{width:100%;height:100%;display:block}@media (prefers-reduced-motion:reduce){.tool-card{animation:none}}.home{width:100%;height:100%;position:relative;overflow:hidden}.home-main{width:100%;height:100%;position:relative}.placeholder{width:100%;height:100%;position:relative;overflow:hidden}.placeholder-inner{z-index:5;text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:1rem;height:100%;padding:1rem;display:flex;position:relative}.placeholder-inner h1{letter-spacing:-.02em;color:var(--c-brand);font-size:clamp(2.5rem,8vw,5rem);font-weight:900}.placeholder-inner p{color:var(--c-purple-mid);font-size:1.2rem;font-weight:500}.placeholder-inner .back{color:var(--c-purple-mid);border-bottom:2px solid var(--c-purple-light);margin-top:.75rem;padding-bottom:2px;font-weight:700;transition:color .3s}.placeholder-inner .back:hover{color:var(--c-brand)}