:root {
  --olive: #4B5320;
  --olive-dark: #2F3514;
  --brass: #C9A227;
  --brass-light: #E6C65C;
  --stencil: #F2EEDC;
  --ink: #1B1E12;
  --danger: #B3261E;
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: var(--olive-dark); color: var(--stencil); font: 16px/1.5 system-ui, sans-serif; }
main { max-width: 440px; margin: 0 auto; padding: 24px 16px 48px; }
h1 { font-family: 'Black Ops One', system-ui; letter-spacing: .08em; color: var(--brass-light); text-align: center; }
.code strong { font-family: 'Black Ops One', system-ui; font-size: 1.4em; letter-spacing: .1em; }
label { display: block; margin: 12px 0; }
input { display: block; width: 100%; margin-top: 4px; padding: 12px; font-size: 16px; border-radius: 8px; border: 2px solid var(--brass); background: var(--ink); color: var(--stencil); }
button { width: 100%; margin: 12px 0 0; padding: 14px; font: 18px 'Black Ops One', system-ui; letter-spacing: .06em; border: 2px solid var(--brass); border-radius: 10px; background: var(--olive); color: var(--stencil); cursor: pointer; }
button.ghost { background: transparent; }
button.danger { background: var(--danger); }
.tabs { display: flex; gap: 8px; }
.tabs button { margin: 0; }
.tabs button.on { background: var(--brass); color: var(--ink); }
a { color: var(--brass-light); display: inline-block; margin-top: 12px; }
#status.error { color: #FF8A80; }
[hidden] { display: none !important; }