:root { --ink:#05090d; --paper:#e9f1f3; --glass:#b9e6f2; --cyan:#7fd4ff; --signal:#ff3b4e; --mute:#7d8e97; --line:rgba(185,230,242,.16);
  --display:'Chakra Petch',system-ui,sans-serif; --mono:'IBM Plex Mono',ui-monospace,monospace; color-scheme: dark; }
* { box-sizing: border-box; }
body.page { margin: 0; min-height: 100vh; display: grid; place-items: center; padding: 24px 16px;
  background: radial-gradient(80% 60% at 50% 0%, #0f2733 0%, var(--ink) 70%); color: var(--paper); font: 14px/1.6 var(--mono); }
.card { width: min(560px, 100%); padding: 40px 32px; border: 1px solid var(--line); background: rgba(5,9,13,.7); }
.mark { display: block; margin-bottom: 26px; }
.kicker { margin: 0 0 10px; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--cyan); }
h1 { margin: 0 0 14px; font: 600 clamp(26px, 5vw, 36px)/1.08 var(--display); text-wrap: balance; }
h1 em { font-style: normal; color: var(--cyan); text-transform: uppercase; }
.muted { color: var(--mute); }
code { color: var(--glass); font-size: 12px; }
.files { list-style: none; padding: 0; margin: 26px 0; }
.files a { display: flex; justify-content: space-between; padding: 14px 4px; border-top: 1px solid var(--line); color: var(--paper); text-decoration: none; }
.files li:last-child a { border-bottom: 1px solid var(--line); }
.files a:hover { color: var(--cyan); }
.arrow { font-family: var(--display); }
.summary { display: grid; grid-template-columns: auto 1fr; gap: 6px 18px; margin: 24px 0; padding: 16px; border: 1px solid var(--line); }
.summary dt { color: var(--mute); font-size: 12px; text-transform: uppercase; letter-spacing: .1em; }
.summary dd { margin: 0; }
.btn { display: inline-flex; justify-content: center; padding: 16px 24px; font: 600 13px var(--display); letter-spacing: .16em; text-transform: uppercase;
  border: 1px solid var(--paper); background: var(--paper); color: var(--ink); cursor: pointer; width: 100%;
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px)); }
.btn:disabled { opacity: .5; cursor: default; }
.back { display: inline-block; margin-top: 18px; color: var(--mute); font-size: 12px; }
.page--dev .card { border-color: rgba(255,59,78,.4); }
.page--dev .kicker { color: var(--signal); }
