:root {
  --font-sans: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  --color-bg: #ffffff;
  --color-bg-alt: #f5f5f7;
  --color-fg: #111111;
  --color-fg-subtle: #444;
  --color-accent: #1c71d8; /* Adwaita blue */
  --color-border: #d1d5db;
  --radius-sm: 4px;
  --radius-md: 8px;
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.12);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --term-black: #241f31;
  --term-red: #c01c28;
  --term-green: #2ec27e;
  --term-yellow: #f5c211;
  --term-blue: #1c71d8;
  --term-magenta: #813d9c;
  --term-cyan: #16a085;
  --term-white: #d0cfcc;
  --term-bright-black: #5e5c64;
  --term-bright-red: #ed333b;
  --term-bright-green: #57e389;
  --term-bright-yellow: #f8e45c;
  --term-bright-blue: #3584e4;
  --term-bright-magenta: #9141ac;
  --term-bright-cyan: #2aa1b3;
  --term-bright-white: #ffffff;
}

@media (prefers-color-scheme: dark) {
  :root[data-theme="auto"],:root:not([data-theme]) {
    --color-bg: #0e0f12;
    --color-bg-alt: #1d2024;
    --color-fg: #e6e6e6;
    --color-fg-subtle: #aaa;
    --color-border: #2c3137;
  }
}

:root[data-theme="dark"] {
  --color-bg: #0e0f12;
  --color-bg-alt: #1d2024;
  --color-fg: #e6e6e6;
  --color-fg-subtle: #aaa;
  --color-border: #2c3137;
}

:root[data-theme="light"] {
  --color-bg: #ffffff;
  --color-bg-alt: #f5f5f7;
  --color-fg: #111111;
  --color-fg-subtle: #444;
  --color-border: #d1d5db;
}

* { box-sizing: border-box; }
html, body { height: 100%; }
body {
  margin: 0;
  font-family: var(--font-sans);
  background: var(--color-bg);
  color: var(--color-fg);
  -webkit-font-smoothing: antialiased;
}

h1,h2,h3 { line-height: 1.2; }

p { line-height: 1.55; }

.skip { position:absolute; left:-999px; top:auto; width:1px; height:1px; overflow:hidden; }
.skip:focus { position:static; width:auto; height:auto; padding: var(--space-2); background:var(--color-accent); color:#fff; }

#hero { min-height: 100vh; display:flex; align-items:center; justify-content:center; padding: var(--space-6) var(--space-4); }
.hero-inner { display:flex; flex-direction:column; align-items:stretch; gap: var(--space-4); width:100%; }
#hero h1 { width:min(1600px,92vw); margin:0 auto 0; padding: 0 clamp(1.5rem,4vw,5rem) 0; font-size: clamp(2rem,5vw,3rem); font-weight:700; letter-spacing:-0.02em; text-align:center; }

main { max-width: 860px; margin: 0 auto; padding: var(--space-6) var(--space-4); }

.link-list { list-style:none; padding:0; margin:0; display:grid; grid-template-columns: repeat(auto-fit,minmax(150px,1fr)); gap: var(--space-2); }
.link-list a { display:block; padding: var(--space-2) var(--space-3); background: var(--color-bg-alt); border:1px solid var(--color-border); border-radius:var(--radius-sm); text-decoration:none; color: var(--color-fg); font-weight:500; }
.link-list a:hover, .link-list a:focus { border-color: var(--color-accent); color: var(--color-accent); }

blockquote { margin: var(--space-6) 0; padding: var(--space-4); background: var(--color-bg-alt); border-left:4px solid var(--color-accent); border-radius:var(--radius-sm); }
blockquote p { margin:0 0 var(--space-2); }
blockquote footer { font-size:0.875rem; opacity:0.7; }