/* A presentation of the existing game DOM and state; no duplicate content or rules. */
body[data-appearance="retro"] {
  --bg:#07130b; --card:#0b1b10; --line:#356b42; --text:#b9f5b5;
  --muted:#82b985; --amber:#cbff9e; --green:#a8f08d; --red:#f0b987; --blue:#a5ddaa;
  --primary:var(--amber); --primary-contrast:var(--bg);
  background:var(--bg); color:var(--text);
  font:16px/1.45 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  text-shadow:0 0 6px rgba(133,255,139,.16);
}
body[data-appearance="retro"]::before {
  content:""; position:fixed; inset:0; pointer-events:none; z-index:10;
  background:repeating-linear-gradient(to bottom,transparent 0,transparent 3px,rgba(0,0,0,.12) 4px);
}
body[data-appearance="retro"] main { max-width:720px; }
body[data-appearance="retro"] h1,
body[data-appearance="retro"] .display,
body[data-appearance="retro"] .tile .word,
body[data-appearance="retro"] .message.big,
body[data-appearance="retro"] .reveal b { font-family:inherit; font-weight:700; }
body[data-appearance="retro"] h1 { font-size:clamp(24px,5vw,34px); text-transform:uppercase; letter-spacing:.08em; }
body[data-appearance="retro"] .topline { border-bottom:2px solid var(--line); padding-bottom:10px; }
body[data-appearance="retro"] .hook { margin-top:14px; }
body[data-appearance="retro"] .card,
body[data-appearance="retro"] .tile,
body[data-appearance="retro"] input,
body[data-appearance="retro"] textarea,
body[data-appearance="retro"] .appeal-form,
body[data-appearance="retro"] button,
body[data-appearance="retro"] .voice,
body[data-appearance="retro"] .bar,
body[data-appearance="retro"] .bar span { border-radius:0; box-shadow:none; }
body[data-appearance="retro"] .card { border-width:1px; }
body[data-appearance="retro"] .tile { background:#09170d; }
body[data-appearance="retro"] .tile.target,
body[data-appearance="retro"] .tile.agent { border-color:var(--amber); }
body[data-appearance="retro"] .tile.stretch { border-style:dashed; }
body[data-appearance="retro"] .tile.linked,
body[data-appearance="retro"] .tile.revealed.agent { background:#15371b; }
body[data-appearance="retro"] .tile.decoy.linked,
body[data-appearance="retro"] .tile.revealed.assassin { background:#362619; }
body[data-appearance="retro"] .primary { background:var(--amber); color:var(--bg); }
body[data-appearance="retro"] .count[aria-pressed="true"] { background:var(--amber); color:var(--bg); border-color:var(--amber); }
body[data-appearance="retro"] .appearance { font-family:inherit; text-transform:uppercase; }
body[data-appearance="retro"] .appearance button { font-family:inherit; border-radius:0; }
body[data-appearance="retro"] .appearance button[aria-pressed="true"] { background:var(--amber); color:var(--bg); border-color:var(--amber); }
body[data-appearance="retro"] .voice { border-left-style:double; border-left-width:5px; }
body[data-appearance="retro"] input { caret-color:var(--amber); }
body[data-appearance="retro"] :focus-visible { outline:2px solid var(--amber); outline-offset:3px; }
@media (prefers-reduced-motion:reduce) {
  body[data-appearance="retro"]::before { display:none; }
}
