@font-face{font-family:"Manrope";font-weight:400;font-display:swap;src:url(/assets/fonts/manrope/manrope-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Manrope";font-weight:500;font-display:swap;src:url(/assets/fonts/manrope/manrope-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Manrope";font-weight:600;font-display:swap;src:url(/assets/fonts/manrope/manrope-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Manrope";font-weight:700;font-display:swap;src:url(/assets/fonts/manrope/manrope-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Manrope";font-weight:800;font-display:swap;src:url(/assets/fonts/manrope/manrope-latin-800-normal.woff2) format("woff2")}
/* Vibe96 — shared base styles (all component styling is inline on the elements) */
body{margin:0;overflow-x:hidden;background:#fff;color:#211A31;font-family:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;font-weight:400;-webkit-font-smoothing:antialiased;text-wrap:pretty}
a{color:#7624F4;text-decoration:none}a:hover{color:#5B14CF}
*,*::before,*::after{box-sizing:border-box}
img,svg{max-width:100%}
input,select,textarea,button{font-family:inherit}
@keyframes v96pulse{0%,100%{opacity:.35}50%{opacity:1}}
@keyframes v96rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
.v96tile{opacity:0;transition:transform .32s cubic-bezier(.22,.7,.3,1),box-shadow .32s ease,border-color .2s ease,background-color .2s ease}
.v96tile.v96in{animation:v96rise .55s cubic-bezier(.22,.7,.3,1) both}
@supports (animation-timeline:view()){.v96tile{animation:v96rise .55s cubic-bezier(.22,.7,.3,1) both;animation-timeline:view();animation-range:entry 0% cover 28%;animation-delay:0s!important}}
@media (prefers-reduced-motion:reduce){.v96tile{opacity:1!important;animation:none!important}}
.v96tile:hover{transform:translateY(-6px);box-shadow:0 26px 46px -30px rgba(32,32,32,.34)}
.v96tile .v96ico{transition:transform .32s cubic-bezier(.34,1.4,.5,1),background-color .25s ease,color .25s ease}
.v96tile:hover .v96ico{transform:scale(1.08) rotate(-4deg)}
.v96tile .v96arrow{transition:transform .3s cubic-bezier(.22,.7,.3,1),opacity .25s ease;opacity:.55}
.v96tile:hover .v96arrow{transform:translate(4px,-4px);opacity:1}
@keyframes v96spin{to{transform:rotate(360deg)}}
@keyframes v96scan{0%{transform:translateY(-28px)}100%{transform:translateY(200px)}}
@keyframes v96blink{0%,100%{opacity:1}50%{opacity:.2}}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}
@keyframes v96dot{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}

/* inline display: values must not override the hidden attribute (wizard steps, panels, chat) */
[hidden]{display:none !important}
@keyframes v96slide{0%{transform:translateX(-100%)}100%{transform:translateX(260%)}}
.on[data-compare]{border-color:#7624F4!important;color:#7624F4!important;background:#F4EEFE!important}

/* ───────── Buttons: blue #0C50FB, violet #731FF9 on hover ─────────
   Package 195: pages no longer style buttons inline. This rule stays only for buttons that scripts
   build on the fly (getitlive.js, compare.js, notify.js); new code should use .v-btn from vibe96.css. */
a[style*="background:#0C50FB"]:hover,button[style*="background:#0C50FB"]:hover,input[style*="background:#0C50FB"]:hover,
a[style*="background: #0C50FB"]:hover,button[style*="background: #0C50FB"]:hover,input[style*="background: #0C50FB"]:hover,
a[style*="background-color:#0C50FB"]:hover,button[style*="background-color:#0C50FB"]:hover{background:#731FF9!important;border-color:#731FF9!important;color:#fff!important}
/* The header's outline "Sell a project" button fills violet on hover. */
a[data-cta="sell"]:hover{background:#731FF9!important;border-color:#731FF9!important;color:#fff!important}
button,a[style*="#0C50FB"]{transition:background-color .15s,border-color .15s,color .15s}
