:root {
    --bg: #eef1f6;
    --surface: #ffffff;
    --ink: #172033;
    --muted: #5b6579;
    --line: #cfd6e3;
    --accent: #2437c9;
    --visited: #6a3fa0;
    color-scheme: light;
  }
  @media (prefers-color-scheme: dark) {
    :root {
      --bg: #12161f;
      --surface: #1a2030;
      --ink: #e8ecf5;
      --muted: #9aa5ba;
      --line: #2f3850;
      --accent: #8fa0ff;
      --visited: #c3a2f0;
      color-scheme: dark;
    }
  }
  * { box-sizing: border-box; }
  html { height: 100%; }
  body {
    margin: 0;
    min-height: 100%;
    background: var(--bg);
    color: var(--ink);
    font: 400 1.0625rem/1.55 "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  }
  main { max-width: 44rem; margin: 0 auto; padding: 14vh 1.25rem 4rem; transition: padding-top .25s ease; }
  body.has-query main { padding-top: 2.5rem; }
  h1 { margin: 0 0 1.25rem; font-size: 2.25rem; font-weight: 600; letter-spacing: -0.02em; line-height: 1.1; }
  body.has-query h1 { font-size: 1.25rem; margin-bottom: .875rem; }

  form { display: flex; gap: .5rem; }
  input[type=search] {
    flex: 1; min-width: 0;
    font: inherit; color: var(--ink);
    background: var(--surface);
    border: 1.5px solid var(--line);
    border-radius: 10px;
    padding: .8rem 1rem;
  }
  input[type=search]::placeholder { color: var(--muted); }
  button {
    font: inherit; font-weight: 600; cursor: pointer;
    color: #fff; background: var(--accent);
    border: 0; border-radius: 10px; padding: 0 1.4rem;
  }
  @media (prefers-color-scheme: dark) { button { color: #0d1220; } }
  input:focus-visible, button:focus-visible, a:focus-visible {
    outline: 3px solid var(--accent); outline-offset: 2px;
  }

  #status { margin: 1.5rem 0 0; color: var(--muted); min-height: 1.5rem; }
  #status.error { color: #c0322b; }
  @media (prefers-color-scheme: dark) { #status.error { color: #ff8a82; } }

  ol { list-style: none; margin: 1rem 0 0; padding: 0; }
  li { padding: 1.1rem 0; border-top: 1px solid var(--line); }
  li:first-child { border-top: 0; }
  .host { font-size: .875rem; color: var(--muted); overflow-wrap: anywhere; }
  li a.title { display: inline-block; margin: .1rem 0 .25rem; font-size: 1.1875rem; font-weight: 500; color: var(--accent); text-decoration: none; }
  li a.title:hover { text-decoration: underline; }
  li a.title:visited { color: var(--visited); }
  .snippet { margin: 0; color: var(--ink); opacity: .85; }