/* Professional Portfolio Design System - Dark theme with vibrant accents */
:root{
  --bg: #0b0f12;
  --surface: #0f1620;
  --muted: #9aa6b2;
  --text: #e6eef3;
  --accent: #7c5cff;       /* primary vibrant purple */
  --accent-2: #00d1b2;     /* secondary teal */
  --glass: rgba(255,255,255,0.04);
  --radius: 12px;
  --shadow: 0 6px 18px rgba(2,6,23,0.6);
  --mono: ui-monospace, SFMono-Regular, Menlo, Monaco, "Roboto Mono", "Helvetica Neue", monospace;
}

/* Light theme overrides (toggled by document.documentElement.classList.add('light')) */
.light{
  --bg: #f7f8fb;
  --surface: #ffffff;
  --muted: #55606a;
  --text: #0b1720;
  --glass: rgba(2,6,23,0.04);
  --shadow: 0 6px 18px rgba(8,15,25,0.06);
}

/* Base */
html,body{height:100%}
html{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;transition:background-color .2s linear,color .2s linear;}

/* Utilities */
.surface{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px}
.muted{color:var(--muted)}
.accent{color:var(--accent)}
.btn-primary{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff;border:none;padding:10px 16px;border-radius:10px;cursor:pointer;box-shadow:0 6px 20px rgba(124,92,255,0.18)}
.glass{background:var(--glass);backdrop-filter:blur(6px);border-radius:var(--radius)}

/* Accessibility & preferences */
@media (prefers-reduced-motion: reduce){
  *{transition:none!important}
}

