:root{
  --bg: #0a0a0b;
  --bg-1: #0f0f11;
  --bg-2: #141418;
  --line: #1e1e24;
  --line-2: #2a2a32;
  --fg: #e8e8ea;
  --fg-dim: #a0a0a8;
  --fg-mute: #6a6a74;
  --accent: oklch(0.82 0.14 135);
  --accent-dim: oklch(0.82 0.14 135 / .18);
  --danger: oklch(0.72 0.18 25);
  --warn: oklch(0.82 0.14 75);
  --mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --sans: "Inter", system-ui, -apple-system, Segoe UI, sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--fg);font-family:var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{
  background-image:
    radial-gradient(800px 400px at 80% -10%, rgba(180,255,120,0.04), transparent 60%),
    radial-gradient(600px 300px at -10% 30%, rgba(120,180,255,0.03), transparent 70%),
    linear-gradient(var(--bg), var(--bg));
  min-height:100vh;
}
.grid-bg{
  position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(rgba(255,255,255,0.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.018) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(ellipse at 50% 30%, black 30%, transparent 80%);
}
a{color:inherit;text-decoration:none}
::selection{background:var(--accent);color:#0a0a0b}
.mono{font-family:var(--mono);font-feature-settings:"ss01","cv01"}
button{font-family:inherit}

::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:10px}
::-webkit-scrollbar-thumb:hover{background:#3a3a44}

@keyframes blink { 0%,49%{opacity:1} 50%,100%{opacity:0} }
.caret{display:inline-block;width:0.55ch;height:1em;background:var(--accent);vertical-align:text-bottom;animation:blink 1s steps(2) infinite;margin-left:2px;transform:translateY(2px)}

@keyframes scan { 0%{transform:translateY(-100%)} 100%{transform:translateY(100%)} }

@keyframes fadeUp { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:translateY(0)} }
.fadeup{animation:fadeUp .6s ease both}

@keyframes pulse { 0%{box-shadow:0 0 0 0 var(--accent-dim)} 70%{box-shadow:0 0 0 8px transparent} 100%{box-shadow:0 0 0 0 transparent}}
.livedot{width:8px;height:8px;border-radius:50%;background:var(--accent);animation:pulse 2s infinite}

.card{transition:transform .25s ease, border-color .25s ease, background .25s ease}
.card:hover{transform:translateY(-2px);border-color:var(--line-2);background:var(--bg-2)}