:root { --bg:#f5f6fb; --card:rgba(255,255,255,.65); --border:rgba(15,23,42,.08); --text:#0f172a; --muted:#64748b; --accent:#6d5efc; --accent2:#22d3ee; }
.dark { --bg:#07080f; --card:rgba(255,255,255,.05); --border:rgba(255,255,255,.09); --text:#f1f5f9; --muted:#94a3b8; }
html { scroll-behavior:smooth; }
body { background:var(--bg); color:var(--text); font-family:Inter,system-ui,sans-serif; min-height:100vh; overflow-x:hidden; transition:background .3s; }
.font-display { font-family:'Space Grotesk',Inter,sans-serif; }
.aurora { position:fixed; inset:0; z-index:-1; overflow:hidden; }
.aurora i { position:absolute; width:46vmax; height:46vmax; border-radius:50%; filter:blur(90px); opacity:.35; animation:float 18s ease-in-out infinite alternate; }
.aurora i:nth-child(1){ background:var(--accent); top:-15%; left:-10%; }
.aurora i:nth-child(2){ background:var(--accent2); bottom:-20%; right:-10%; animation-delay:-6s; }
.aurora i:nth-child(3){ background:#f472b6; top:40%; left:45%; opacity:.18; animation-delay:-12s; }
@keyframes float { to { transform:translate(6vmax,4vmax) scale(1.15); } }
.glass { background:var(--card); border:1px solid var(--border); backdrop-filter:blur(22px) saturate(160%); -webkit-backdrop-filter:blur(22px) saturate(160%); border-radius:1.75rem; box-shadow:0 20px 60px -25px rgba(30,20,90,.35); }
.muted { color:var(--muted); }
.field { background:rgba(127,127,160,.1); border:1px solid var(--border); border-radius:1.1rem; transition:border-color .2s, box-shadow .2s; }
.field:focus-within, .field:hover { border-color:var(--accent); box-shadow:0 0 0 4px rgba(109,94,252,.15); }
.btn-grad { background:linear-gradient(135deg,var(--accent),var(--accent2)); color:#fff; }
.chip { border:1px solid var(--border); background:rgba(127,127,160,.08); border-radius:999px; padding:.35rem .8rem; font-size:.8rem; font-weight:600; transition:all .2s; }
.chip:hover, .chip.active { background:var(--accent); color:#fff; border-color:var(--accent); }
.badge { width:2.1rem; height:2.1rem; border-radius:50%; display:grid; place-items:center; font-size:.62rem; font-weight:800; color:#fff; flex:none; }
.swap { transition:transform .5s cubic-bezier(.2,.9,.3,1.4); }
.swap.spin { transform:rotate(180deg); }
.skeleton { animation:pulse 1.2s ease-in-out infinite; }
@keyframes pulse { 50% { opacity:.45; } }
.fade-in { animation:fade .6s ease both; }
@keyframes fade { from { opacity:0; transform:translateY(14px); } }
#modal { transition:opacity .2s; }
#modal.hidden-modal { opacity:0; pointer-events:none; }
::-webkit-scrollbar { width:8px; } ::-webkit-scrollbar-thumb { background:rgba(127,127,160,.35); border-radius:8px; }
@media (prefers-reduced-motion:reduce){ *{ animation:none!important; transition:none!important; } }