:root {
        --text: #4b463f;
        --text-h: #1d1b16;
        --bg: #faf8f4;
        --card: #ffffff;
        --border: #e2ddd3;
        --accent: #3f5d3f;
        color-scheme: light dark;
      }
      @media (prefers-color-scheme: dark) {
        :root {
          --text: #c9c4bb;
          --text-h: #f0ede7;
          --bg: #171512;
          --card: #211e1a;
          --border: #3a352e;
          --accent: #7ea87e;
        }
      }
      * { box-sizing: border-box; }
      body {
        margin: 0;
        min-height: 100dvh;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 1.5rem;
        font: 16px/1.5 system-ui, 'Segoe UI', Roboto, sans-serif;
        color: var(--text);
        background: var(--bg);
      }
      .card {
        width: 100%;
        max-width: 22rem;
        background: var(--card);
        border: 1px solid var(--border);
        border-radius: 12px;
        padding: 2rem 1.5rem;
        text-align: center;
      }
      h1 { margin: 0 0 0.25rem; font-size: 1.5rem; color: var(--text-h); }
      p { margin: 0 0 1.5rem; font-size: 0.9rem; }
      .denied {
        display: none;
        margin: 0 0 1rem;
        font-size: 0.85rem;
        color: #a33c2f;
      }
      a.provider {
        display: block;
        margin: 0.6rem 0;
        padding: 0.8rem 1rem;
        border: 1px solid var(--border);
        border-radius: 8px;
        color: var(--text-h);
        text-decoration: none;
        font-weight: 600;
      }
      a.provider:hover { border-color: var(--accent); }