/* Shared styles for privacy.html, terms.html and 404.html (the home page keeps its own inline CSS). */
:root {
  --bg: #0f0b17; --obsidian: #181818; --panel: #15111e;
  --purple: #a56bff; --purple-d: #5b36b8; --grass-lit: #55FF55;
  --diamond: #4AEDD9; --redstone: #FF3300; --text: #EDEBF5; --muted: #BDB7D0;
}
html { scrollbar-color: var(--purple-d) var(--bg); }
body { background: var(--bg); color: var(--text); font-family: Inter, system-ui, sans-serif; line-height: 1.7; -webkit-font-smoothing: antialiased; }
::selection { background: var(--purple); color: #0f0b17; }
:focus-visible { outline: 3px solid var(--diamond); outline-offset: 3px; }

.pframe {
  position: relative; background: var(--panel);
  box-shadow: 4px 0 0 0 var(--purple-d), -4px 0 0 0 var(--purple-d), 0 4px 0 0 var(--purple-d), 0 -4px 0 0 var(--purple-d);
}
.nav-link { font-family: 'Press Start 2P', monospace; font-size: .7rem; text-transform: uppercase; padding: .5rem 0; border-bottom: 4px solid transparent; transition: color .12s, border-color .12s; }
.nav-link:hover, .nav-link:focus-visible { color: var(--redstone); border-bottom-color: var(--redstone); }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .6rem;
  font-family: 'Press Start 2P', monospace; font-size: .72rem; line-height: 1.4; text-transform: uppercase; text-align: center;
  padding: 1rem 1.25rem; border: 4px solid #000; cursor: pointer; background: var(--diamond); color: #04211e;
  box-shadow: inset -4px -4px 0 rgba(0,0,0,.35), inset 4px 4px 0 rgba(255,255,255,.4), 0 5px 0 #000;
  transition: transform .08s, box-shadow .08s, border-color .12s;
}
.btn:hover { transform: translateY(2px); border-color: var(--redstone); background: #7ff5e6; box-shadow: inset -4px -4px 0 rgba(0,0,0,.35), inset 4px 4px 0 rgba(255,255,255,.4), 0 3px 0 #000; }

.doc h1 { font-family: 'Press Start 2P', monospace; font-size: clamp(1.1rem, 4.4vw, 1.9rem); line-height: 1.5; text-shadow: 3px 3px 0 #000; }
.doc h2 { font-family: 'Press Start 2P', monospace; font-size: .8rem; line-height: 1.7; text-transform: uppercase; margin-top: 2.5rem; margin-bottom: .75rem; color: var(--grass-lit); }
.doc p, .doc li { color: #DAD5E8; }
.doc p + p { margin-top: 1rem; }
.doc ul { list-style: square; padding-left: 1.4rem; margin-top: .75rem; }
.doc ul + p { margin-top: 1rem; }
.doc li + li { margin-top: .4rem; }
.doc a { color: var(--diamond); text-decoration: underline; text-underline-offset: 3px; }
.doc a:hover { color: var(--redstone); }
.doc a.btn, .doc a.btn:hover { color: #04211e; text-decoration: none; }
.doc .meta { color: var(--muted); font-size: .9rem; margin-top: 1rem; }
.doc .note { margin-top: 1.5rem; padding: 1rem 1.25rem; background: #0d0a14; border: 2px solid var(--purple-d); color: var(--muted); font-size: .92rem; }

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; } }