* {
  box-sizing: border-box;
  margin: 0;
}

html, body { height: 100svh }

body {
  padding: 4px 0;
  overflow-y: hidden
}

:root {
  --bg: #ffffff;
  --surface: #f0f0f0;
  --border: #d4d4d4;
  --primary: #aaaaaa;
  --primary-hover: #999999;
  --danger: #b33a3a;
  --text: #1a1a1a;
  --text-muted: #888888;
  --radius: 8px;
  --shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #121212;
    --surface: #1e1e1e;
    --border: #333333;
    --primary: #cccccc;
    --primary-hover: #dddddd;
    --danger: #d45a5a;
    --text: #e0e0e0;
    --text-muted: #888888;
  }
}