:root{
  --bg: #0b0b0b;
  --bg2:#121212;
  --text:#f2f2f2;
  --muted:#c9c9c9;
  --card:#151515;
  --line:#2a2a2a;

  --accent:#7a4a1f;   /* cuivre/brun */
  --accent2:#ffffff;

  --radius: 16px;
  --shadow: 0 12px 30px rgba(0,0,0,.25);
  --container: 1120px;
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background: var(--bg);
  color: var(--text);
  line-height: 1.5;
}

a{ color: inherit; text-decoration: none; }
a:hover{ text-decoration: underline; }

.container{
  width: min(var(--container), calc(100% - 40px));
  margin: 0 auto;
}

.skiplink{
  position:absolute; left:-9999px; top:auto;
}
.skiplink:focus{
  left:12px; top:12px; z-index:1000;
  background:#fff; color:#000;
  padding:10px 12px; border-radius:10px;
}

.muted{ color: var(--muted); }