/* variáveis, reset e splash — fatia do v17, linhas 8-101 */
  :root {
    /* Tema Bauhaus Puro + Verde Sage + Champagne */
    --bg-deep: #3e5b3c;          /* verde sage - fundo da página */
    --bg-felt: #4a6b48;          /* verde sage levemente mais claro */
    --bg-felt-2: #557a52;
    --gold: #c9a05c;             /* champagne dourado - accent */
    --gold-bright: #d8b070;
    --gold-deep: #7a5020;
    --paper: #e8d8a8;            /* champagne claro - papel da carta */
    --paper-shadow: #d0bc88;
    --paper-line: #a89a68;
    --ink: #1a0e0e;              /* preto bordô profundo - texto */
    --ink-soft: #4a2828;
    --red-rosa: #c41e1e;         /* bordô vermelho vivo - accent primário */
    --blue-rosa: #1c3a1a;        /* verde MUITO escuro - vitória/secundário */
    --green-rosa: #1c3a1a;
    --win: #1c3a1a;
    --loss: #c41e1e;
    --tie: #7a5020;
    --like: #1c3a1a;
    --dislike: #c41e1e;
    --magnify: #c9a05c;
    --shadow-card: 6px 6px 0 #1a0e0e;
  }

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

  body {
    font-family: "Trebuchet MS", "Avenir", "Futura", "Helvetica Neue", -apple-system, Arial, sans-serif;
    background:
      radial-gradient(ellipse at top, var(--bg-felt) 0%, var(--bg-deep) 70%),
      var(--bg-deep);
    background-attachment: fixed;
    color: var(--paper);
    min-height: 100vh;
    overflow-x: hidden;
    line-height: 1.45;
  }

  .hidden { display: none !important; }

  /* ============ SPLASH ============ */
  #splash {
    position: fixed; inset: 0;
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    padding: 24px;
    text-align: center;
    z-index: 100;
    background: var(--bg-deep);
  }
  .logo-mark {
    font-size: 2.8rem;
    font-weight: 900;
    letter-spacing: 1px;
    margin-bottom: 4px;
    color: var(--paper);
    text-shadow: 4px 4px 0 var(--red-rosa);
    text-transform: uppercase;
    font-family: "Trebuchet MS", "Avenir", sans-serif;
  }
  .logo-sub {
    font-size: 0.95rem;
    color: var(--gold);
    letter-spacing: 3px;
    text-transform: uppercase;
    margin-bottom: 32px;
    font-weight: 700;
  }
  .splash-balance { margin-bottom: 28px; }
  .splash-meta {
    font-size: 0.85rem;
    color: rgba(255,255,255,0.55);
    margin-bottom: 28px;
    max-width: 380px;
  }

  .btn-primary {
    background: var(--gold);
    color: var(--ink);
    border: 3px solid var(--ink);
    padding: 14px 36px;
    font-size: 1.05rem;
    font-weight: 900;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: 0;
    cursor: pointer;
    box-shadow: 5px 5px 0 var(--ink);
    transition: transform 0.1s, box-shadow 0.1s;
  }
  .btn-primary:hover { background: var(--gold-bright); transform: translate(-2px,-2px); box-shadow: 7px 7px 0 var(--ink); }
  .btn-primary:active { transform: translate(5px,5px); box-shadow: none; }