*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  min-height: 100%;
}

body {
  background: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-family);
  font-size: var(--font-size-m);
  line-height: 1.5;
}

/* Platzhalter-Seite, bis die erste App-Version steht */
.placeholder {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-s);
  padding: var(--space-xl) var(--space-m);
  text-align: center;
}

.placeholder__logo {
  width: 64px;
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px dashed var(--color-text-muted);
  border-radius: var(--radius-l);
  color: var(--color-text-muted);
  font-size: var(--font-size-s);
  margin-bottom: var(--space-m);
}

.placeholder__title {
  margin: 0;
  font-size: var(--font-size-xl);
  letter-spacing: -0.02em;
}

.placeholder__claim {
  margin: 0;
  color: var(--color-text-muted);
  font-size: var(--font-size-l);
}

.placeholder__text {
  max-width: 420px;
  margin: 0;
  color: var(--color-text-muted);
}

.placeholder__meta {
  margin: var(--space-l) 0 0;
  padding: var(--space-xs) var(--space-m);
  border-radius: var(--radius-m);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  color: var(--color-text-muted);
  font-size: var(--font-size-s);
}
