{{template_css_start}}
    :root {
      --bg: #0a0a0c;
      --bg-elevated: #111115;
      --text: #e8e8ed;
      --text-dimmed: #6e6e7a;
      --accent: {{accent}};
      --font-primary: '{{font_primary}}', -apple-system, BlinkMacSystemFont, sans-serif;
    }

    .container {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      min-height: 100vh;
      text-align: center;
    }

    h1 {
      font-size: 2rem;
      font-weight: 600;
      margin-bottom: var(--spacing-sm);
    }

    .subtitle {
      color: var(--text-dimmed);
      font-size: 1rem;
    }
{{template_css_end}}
{{template_body_start}}
    <div class="container fade-in">
      <h1{{title_i18n}}>{{title}}</h1>
      <div class="subtitle"{{tagline_i18n}}>{{tagline}}</div>
      <div style="margin-top:2rem;">
        <button data-i18n-toggle title="Maschinell übersetzt / Machine-translated — German is the original." style="background:none;border:1px solid currentColor;color:var(--text-dimmed,#888);font-size:0.65rem;letter-spacing:0.1em;padding:4px 12px;border-radius:4px;cursor:pointer;opacity:0.6;">EN</button>
        <br><small data-de="Maschinell übersetzt" data-en="Machine-translated" style="color:var(--text-dimmed,#888);font-size:0.6rem;opacity:0.5;">Maschinell übersetzt</small>
      </div>
    </div>
{{template_body_end}}