:root {
  --bg: #101012;
  --panel: #0b0b0d;
  --text: #e9e9ec;
  --muted: #8b8b93;
  --dim: #56565e;
  --line: #242428;
  --accent: #6ee7b7;
  --mono: ui-monospace, "Cascadia Mono", "SF Mono", Menlo, Consolas, monospace;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body { background: var(--bg); color: var(--text); font-family: var(--sans); font-size: 14.5px; line-height: 1.55; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; height: auto; }

.wrap { max-width: 900px; margin: 0 auto; padding: 0 24px; }

/* header */
.top { padding: 40px 0 30px; }
.top a { font-family: var(--mono); font-size: 0.7rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); }
.top a:hover { color: var(--accent); }

/* title block */
.title { padding-bottom: 4px; }
.title .kicker { font-family: var(--mono); font-size: 0.68rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--dim); }
.title h1 { font-size: clamp(1.9rem, 5vw, 2.6rem); font-weight: 800; letter-spacing: 0.02em; line-height: 1.05; margin: 10px 0 12px; }
.title .tag { font-size: 1.05rem; color: var(--text); max-width: 60ch; }
.title .status { margin-top: 10px; font-family: var(--mono); font-size: 0.7rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--accent); }

.btns { margin-top: 18px; display: flex; gap: 8px; flex-wrap: wrap; }
.btns a { font-family: var(--mono); font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase; border: 1px solid var(--line); padding: 8px 14px; color: var(--muted); }
.btns a:hover { border-color: var(--accent); color: var(--accent); }
.btns a.primary { border-color: var(--accent); color: var(--accent); }

/* key image */
.key { display: block; margin-top: 22px; border: 1px solid var(--line); overflow: hidden; }
.key img { width: 100%; aspect-ratio: 3/1; object-fit: cover; object-position: 50% 55%; }

/* sections */
.section { margin-top: 44px; }
.section h2 { font-family: var(--mono); font-size: 0.7rem; font-weight: 400; letter-spacing: 0.2em; text-transform: uppercase; color: var(--muted);
              padding-bottom: 9px; border-bottom: 1px solid var(--line); margin-bottom: 16px; }
.section p { color: var(--muted); max-width: 68ch; }
.section p + p { margin-top: 10px; }
.section p strong, .section li strong { color: var(--text); font-weight: 600; }
.section ul { list-style: none; }
.section li { color: var(--muted); padding: 9px 0; border-bottom: 1px solid var(--line); }
.section li:last-child { border-bottom: 0; }

/* small cards */
.cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.cards div { border: 1px solid var(--line); background: var(--panel); padding: 14px 16px; }
.cards h3 { font-size: 0.95rem; font-weight: 700; }
.cards p { font-size: 0.85rem; color: var(--muted); margin-top: 5px; }

/* privacy page text */
.section li.plain { border-bottom: 0; padding: 4px 0; }
.section ul.bullets li { border-bottom: 0; padding: 4px 0 4px 1.1em; position: relative; }
.section ul.bullets li::before { content: "\2013"; position: absolute; left: 0; color: var(--dim); }
.section a { color: var(--accent); }
.section a:hover { text-decoration: underline; }
.muted { color: var(--dim); font-size: 0.8rem; }

/* footer */
footer { margin-top: 52px; padding: 22px 0 48px; border-top: 1px solid var(--line); font-size: 0.78rem; color: var(--dim);
         display: flex; flex-wrap: wrap; gap: 6px 16px; }
footer a { color: var(--muted); }
footer a:hover { color: var(--accent); }

@media (max-width: 720px) {
  .top { padding: 30px 0 22px; }
  .key img { aspect-ratio: 2/1; }
  .cards { grid-template-columns: 1fr; }
}