:root{
  --bg:#09090b;--bg1:#111115;--bg2:#17171c;
  --border:rgba(255,255,255,.07);--borderh:rgba(255,255,255,.14);
  --text:#e4e4e7;--muted:#71717a;--subtle:#3f3f46;
  --blue:#2563eb;--blueb:#3b82f6;--blued:rgba(59,130,246,.12);--blueg:rgba(59,130,246,.35);
  --green:#22c55e;--greend:rgba(34,197,94,.12);
  --amber:#f59e0b;--red:#ef4444;
  --ff:'DM Sans',system-ui,sans-serif;
  --ffh:'Syne',system-ui,sans-serif;
  --ffm:'DM Mono',monospace;
  --r:8px;--r2:16px;
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:auto;}
body{background:var(--bg);color:var(--text);font-family:var(--ff);overflow-x:hidden;-webkit-font-smoothing:antialiased;}




























































/* ── Glass ambient background blobs ── */

body::before{
  content:'';position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(ellipse 700px 500px at 15% 25%, rgba(59,130,246,.07) 0%, transparent 70%),
    radial-gradient(ellipse 600px 400px at 85% 65%, rgba(34,197,94,.05) 0%, transparent 70%),
    radial-gradient(ellipse 500px 350px at 55% 80%, rgba(124,58,237,.05) 0%, transparent 70%);
  transition:background .4s;
}


::selection{background:var(--blued);color:#fff;}
::-webkit-scrollbar{width:4px;}
::-webkit-scrollbar-track{background:var(--bg);}
::-webkit-scrollbar-thumb{background:var(--subtle);border-radius:2px;}
#pbar{position:fixed;top:0;left:0;height:2px;z-index:9999;background:linear-gradient(90deg,var(--blue),#60a5fa,#a78bfa);width:0%;pointer-events:none;}
@media(pointer:fine){
  body{cursor:none;}
  #cur{position:fixed;width:8px;height:8px;background:#fff;border-radius:50%;pointer-events:none;z-index:9998;transform:translate(-50%,-50%);mix-blend-mode:difference;transition:width .2s,height .2s;}
  #cur-r{position:fixed;width:38px;height:38px;border:1px solid rgba(59,130,246,.5);border-radius:50%;pointer-events:none;z-index:9997;transform:translate(-50%,-50%);transition:width .3s,height .3s,border-color .3s;}
  body:has(a:hover,button:hover) #cur{width:14px;height:14px;}
  body:has(a:hover,button:hover) #cur-r{width:54px;height:54px;border-color:rgba(59,130,246,.8);}
}
