:root {
  --css-red: #c92525;
  --css-red-dark: #ae1f1f;
  --bg-dark: #3c3c3c;
  --bg-darker: #2f2f2f;
  --panel-white: #ffffff;
  --panel-light: #f2f2f2;
  --panel-line: #dddddd;
  --text-light: #ffffff;
  --text-dark: #111111;
  --text-soft-dark: #4a4a4a;
  --text-muted: #d9d9d9;
  --border-soft: rgba(255, 255, 255, 0.08);
  --container: 1360px;
  --shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  height: 100%;
}

body {
  margin: 0;
  min-height: 100vh;
  font-family: Arial, Helvetica, sans-serif;
  background: var(--bg-dark);
  color: var(--text-light);
  display: flex;
  flex-direction: column;
}

main {
  flex: 1;
}

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

img {
  max-width: 100%;
  display: block;
}

button,
input {
  font: inherit;
}

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