/* RenderRail — shared theme. Light/dark via [data-theme], animated aurora, glassmorphism. */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;700&family=Inter:wght@400;500;600&display=swap');

:root{
  --bg:#070a10; --bg2:#0b1018; --panel:rgba(22,28,38,.62); --panel-solid:#141b25;
  --line:rgba(255,255,255,.09); --ink:#eaf0f7; --mut:#93a1b2; --faint:#6b7888;
  --accent:#6ea8ff; --accent2:#7af0c8; --brand1:#6366f1; --brand2:#a855f7; --brand3:#22d3ee;
  --a1:rgba(99,102,241,.55); --a2:rgba(168,85,247,.40); --a3:rgba(34,211,238,.38);
  --ok:#34d399; --warn:#fbbf24; --bad:#fb7185; --shadow:0 18px 50px -18px rgba(0,0,0,.7);
  --radius:16px;
}
[data-theme="light"]{
  --bg:#eef2f8; --bg2:#e6ecf5; --panel:rgba(255,255,255,.72); --panel-solid:#ffffff;
  --line:rgba(15,30,60,.10); --ink:#13203a; --mut:#54657c; --faint:#8595a8;
  --accent:#3257d6; --accent2:#0e9f6e; --a1:rgba(99,102,241,.30); --a2:rgba(168,85,247,.22); --a3:rgba(34,211,238,.22);
  --shadow:0 18px 50px -22px rgba(40,60,110,.35);
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.55 Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
/* animated aurora */
body::before{content:"";position:fixed;inset:-25%;z-index:-2;
  background:
    radial-gradient(38% 38% at 18% 26%, var(--a1), transparent 62%),
    radial-gradient(42% 42% at 82% 18%, var(--a2), transparent 60%),
    radial-gradient(48% 48% at 64% 84%, var(--a3), transparent 62%),
    radial-gradient(40% 40% at 30% 78%, var(--a2), transparent 64%);
  filter:blur(70px) saturate(1.25); animation:drift 26s ease-in-out infinite alternate; will-change:transform}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(120% 80% at 50% -10%, transparent 40%, var(--bg) 100%);opacity:.9}
@keyframes drift{0%{transform:translate(-3%,-2%) rotate(0deg) scale(1)}50%{transform:translate(4%,3%) rotate(8deg) scale(1.12)}100%{transform:translate(-2%,5%) rotate(-6deg) scale(1.06)}}
@media (prefers-reduced-motion:reduce){body::before{animation:none}}

h1,h2,h3,.display{font-family:"Space Grotesk",Inter,system-ui;letter-spacing:.2px}
.brand{font-family:"Space Grotesk";font-weight:700}
.grad{background:linear-gradient(110deg,var(--brand1),var(--brand2) 45%,var(--brand3));-webkit-background-clip:text;background-clip:text;color:transparent}
a{color:var(--accent);text-decoration:none}
.glass{background:var(--panel);backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.logo{width:38px;height:38px;border-radius:11px;background:conic-gradient(from 200deg,var(--brand1),var(--brand3),var(--brand2),var(--brand1));display:flex;align-items:center;justify-content:center;font:800 16px "Space Grotesk";color:#fff;box-shadow:0 0 0 1px rgba(255,255,255,.15),0 8px 22px -8px var(--brand2)}
.btn{font:600 13px Inter;border-radius:11px;border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--ink);padding:9px 15px;cursor:pointer;transition:.15s}
.btn:hover{border-color:var(--accent);transform:translateY(-1px)}
.btn.primary{background:linear-gradient(110deg,var(--brand1),var(--brand2));border:0;color:#fff;box-shadow:0 10px 24px -10px var(--brand2)}
.btn.primary:hover{filter:brightness(1.08)}
input,textarea,select{background:rgba(255,255,255,.04);color:var(--ink);border:1px solid var(--line);border-radius:11px;font:14px Inter;padding:10px 12px}
input:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(110,168,255,.18)}
.chip{font:600 11.5px Inter;color:var(--mut);background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:20px;padding:4px 12px}
.themetoggle{position:fixed;top:14px;right:16px;z-index:20;width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:16px}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border-radius:8px}
