:root{

  --bg:      #0a0a0b;
  --bg-2:    #0f0f11;
  --panel:   #141416;
  --panel-2: #1a1a1d;
  --panel-3: #212125;
  --line:      #26262b;
  --line-soft: #1b1b1f;
  --line-strong:#33333a;

  --text:  #e8e6e1;
  --dim:   #9a978f;
  --faint: #5c5a55;

  --accent:     #ff6a00;
  --accent-2:   #ff8534;
  --accent-dim: #7a3510;
  --accent-glow: rgba(255,106,0,.14);

  --ok:  #7d9b5f;
  --err: #d1503f;
  --warn:#d9a441;

  --disp: 'Space Grotesk','Inter Tight',system-ui,sans-serif;
  --body: 'Inter Tight','Inter',sans-serif;
  --mono: 'JetBrains Mono','SFMono-Regular',ui-monospace,monospace;

  --radius: 2px;
  --max: 1360px;
  --shadow: 0 24px 60px rgba(0,0,0,.55);
}

body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--body);
  letter-spacing:.1px;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

h1,h2,h3,.disp{font-family:var(--disp);font-weight:600;letter-spacing:-.01em}

.hr-accent{height:1px;background:linear-gradient(90deg,var(--accent),transparent);border:0}

.btn{border-radius:var(--radius);font-family:var(--disp);font-weight:500;
  letter-spacing:.08em;text-transform:uppercase}
.btn.ghost{background:transparent;border:1px solid var(--line-strong);color:var(--text)}
.btn.ghost:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-glow)}

.brand .m,.logo .m{background:var(--accent);box-shadow:0 0 12px var(--accent-glow)}

@supports selector(::-webkit-scrollbar){
@media screen and (-webkit-min-device-pixel-ratio:0){
  ::-webkit-scrollbar{width:9px;height:9px}
  ::-webkit-scrollbar-track{background:var(--bg)}
  ::-webkit-scrollbar-thumb{background:var(--panel-3);border-radius:0}
  ::-webkit-scrollbar-thumb:hover{background:var(--line-strong)}
}
}

html{scrollbar-width:thin;scrollbar-color:var(--panel-3) var(--bg)}

::selection{background:var(--accent);color:#0a0a0b}
