:root {
  --bg: #f6f8fa; --card: #ffffff; --text: #1f2328; --muted: #59636e; --line: #d1d9e0;
  --link: #0969da; --accent: #0969da; --code-bg: #ffffff; --num: #8c959f;
  --add-bg: #dafbe1; --add-num: #ccffd8; --add: #1a7f37;
  --del-bg: #ffebe9; --del-num: #ffd7d5; --del: #cf222e;
  --hunk-bg: #ddf4ff; --error: #cf222e; --badge: #eff2f5;
  --k: #cf222e; --s: #0a3069; --c: #6e7781; --n: #0550ae; --t: #8250df; --f: #953800; --tag: #116329;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0d1117; --card: #151b23; --text: #e6edf3; --muted: #9198a1; --line: #3d444d;
    --link: #4493f8; --accent: #4493f8; --code-bg: #0d1117; --num: #6e7681;
    --add-bg: rgba(46,160,67,.15); --add-num: rgba(63,185,80,.3); --add: #3fb950;
    --del-bg: rgba(248,81,73,.1); --del-num: rgba(248,81,73,.3); --del: #f85149;
    --hunk-bg: rgba(56,139,253,.1); --error: #f85149; --badge: #262c36;
    --k: #ff7b72; --s: #a5d6ff; --c: #8b949e; --n: #79c0ff; --t: #d2a8ff; --f: #ffa657; --tag: #7ee787;
    color-scheme: dark;
  }
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--text);
  font: 14px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif; }
a { color: var(--link); text-decoration: none; }
a:hover { text-decoration: underline; }
.mono, code, pre, table.code, table.diff { font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace; font-size: 12px; }
.muted { color: var(--muted); }
.small { font-size: 12px; }
.error { color: var(--error); }
.plus { color: var(--add); }
.minus { color: var(--del); }
[hidden] { display: none !important; }

header.top { display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: var(--card);
  border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.brand { font-weight: 700; color: var(--text); font-size: 16px; }
.crumbs { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.crumbs .sep { color: var(--muted); margin: 0 2px; }
.signout { margin-left: auto; }
main { max-width: 1100px; margin: 0 auto; padding: 16px; }
h1 { font-size: 20px; margin: 0 0 12px; }
h2 { font-size: 16px; margin: 0 0 8px; }

.card { background: var(--card); border: 1px solid var(--line); border-radius: 6px; margin: 0 0 16px; overflow: hidden; }
section.card, div.card, p.card, form.card { padding: 12px 16px; }
.card:has(> table.tree), .card:has(> .codewrap), .card:has(> .bar) { padding: 0; }
.pad { padding: 12px 16px; margin: 0; }
.bar { display: flex; gap: 12px; align-items: center; justify-content: space-between; flex-wrap: wrap;
  padding: 8px 16px; border-bottom: 1px solid var(--line); background: var(--bg); }
.actions a { margin-left: 12px; }

button, .button { font: inherit; padding: 5px 14px; border-radius: 6px; border: 1px solid var(--line);
  background: var(--badge); color: var(--text); cursor: pointer; display: inline-block; }
button:hover, .button:hover { text-decoration: none; border-color: var(--muted); }
button.link { border: 0; background: none; color: var(--link); padding: 0; }
button.small { padding: 2px 8px; font-size: 12px; }
input, select { font: inherit; padding: 5px 8px; border: 1px solid var(--line); border-radius: 6px;
  background: var(--code-bg); color: var(--text); max-width: 100%; }
.badge { display: inline-block; font-size: 12px; font-weight: 500; padding: 0 7px; border-radius: 2em;
  border: 1px solid var(--line); background: var(--badge); color: var(--muted); vertical-align: middle; }

.signin { max-width: 420px; margin: 40px auto; }
.signin form { display: grid; gap: 8px; margin: 12px 0; }
.signin input { width: 100%; }

.head-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.head-row h1 { margin: 0; }
.search { display: flex; gap: 6px; flex: 1; max-width: 360px; }
.search input { flex: 1; min-width: 0; }
ul.repos, ul.log { list-style: none; margin: 0; padding: 0; }
ul.repos li { display: flex; justify-content: space-between; gap: 8px; padding: 8px 0; border-top: 1px solid var(--line); flex-wrap: wrap; }
ul.repos li:first-child { border-top: 0; }
.repo { font-weight: 600; }
.empty { margin: 0; }

.repohead { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 12px; }
.reponame { margin: 0; overflow-wrap: anywhere; }
.tabs { display: flex; gap: 4px; }
.tabs a { padding: 4px 10px; border-radius: 6px; color: var(--text); }
.tabs a.on { background: var(--badge); font-weight: 600; }
.refpicker { margin-left: auto; display: flex; gap: 6px; align-items: center; }

table.tree { width: 100%; border-collapse: collapse; }
table.tree td { padding: 7px 16px; border-top: 1px solid var(--line); }
table.tree tr:first-child td { border-top: 0; }
table.tree .kind { width: 1%; color: var(--muted); font-size: 12px; white-space: nowrap; }
table.tree .name { overflow-wrap: anywhere; }
table.tree a.dir { font-weight: 600; }
table.tree .size { text-align: right; color: var(--muted); white-space: nowrap; font-size: 12px; }
.filehead { padding-bottom: 8px; border-bottom: 1px solid var(--line); font-size: 14px; }

.codewrap { overflow-x: auto; }
table.code, table.diff { border-collapse: collapse; width: 100%; background: var(--code-bg); line-height: 20px; }
td.num { width: 1%; min-width: 44px; padding: 0 10px; text-align: right; color: var(--num); user-select: none; white-space: nowrap; vertical-align: top; }
td.num a { color: inherit; }
td.code { padding: 0 12px; white-space: pre; tab-size: 4; }
table.code tr:target td { background: var(--hunk-bg); }
table.diff tr.add td.code { background: var(--add-bg); }
table.diff tr.add td.num { background: var(--add-num); }
table.diff tr.del td.code { background: var(--del-bg); }
table.diff tr.del td.num { background: var(--del-num); }
table.diff tr.hunk td { background: var(--hunk-bg); color: var(--muted); }
table.diff tr.note td.code { color: var(--muted); font-style: italic; }
.mark { display: inline-block; width: 1.2em; user-select: none; color: var(--muted); }

details.file { background: var(--card); border: 1px solid var(--line); border-radius: 6px; margin: 0 0 12px; overflow: hidden; }
details.file > summary { cursor: pointer; padding: 8px 16px; background: var(--bg); display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
details.file[open] > summary { border-bottom: 1px solid var(--line); }
details.file .path { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12px; overflow-wrap: anywhere; flex: 1; }
.counts { font-size: 12px; }
.s-added { color: var(--add); }
.s-deleted { color: var(--del); }
.totals { margin: 0 0 12px; }

ul.log li { padding: 10px 16px; border-top: 1px solid var(--line); }
ul.log li:first-child { border-top: 0; }
ul.log .title { color: var(--text); font-weight: 600; overflow-wrap: anywhere; }
ul.log .mono { margin-left: 6px; }
.pager { display: flex; gap: 16px; padding: 10px 16px; border-top: 1px solid var(--line); }
.pager:empty { display: none; }
.cstitle { font-size: 18px; overflow-wrap: anywhere; }
.message { white-space: pre-wrap; margin: 0 0 8px; }
.changeset p { margin: 4px 0; }
form.compare { display: flex; gap: 12px; align-items: end; flex-wrap: wrap; }
form.compare label { display: grid; gap: 4px; font-size: 12px; color: var(--muted); }

.markdown { overflow-wrap: anywhere; }
.markdown pre { background: var(--bg); padding: 12px; border-radius: 6px; overflow-x: auto; }
.markdown code { background: var(--bg); padding: 1px 4px; border-radius: 4px; }
.markdown pre code { background: none; padding: 0; }
.markdown table { border-collapse: collapse; display: block; overflow-x: auto; }
.markdown th, .markdown td { border: 1px solid var(--line); padding: 4px 10px; }
.markdown blockquote { margin: 0; padding: 0 12px; color: var(--muted); border-left: 3px solid var(--line); }
pre.plain { white-space: pre-wrap; margin: 0; }

/* Highlight colors (highlight.js classes). */
.hljs-keyword, .hljs-selector-tag, .hljs-literal, .hljs-doctag, .hljs-meta .hljs-keyword { color: var(--k); }
.hljs-string, .hljs-regexp, .hljs-meta .hljs-string, .hljs-addition { color: var(--s); }
.hljs-comment, .hljs-quote { color: var(--c); font-style: italic; }
.hljs-number, .hljs-attr, .hljs-attribute, .hljs-variable, .hljs-template-variable, .hljs-built_in, .hljs-symbol, .hljs-selector-attr { color: var(--n); }
.hljs-title, .hljs-title.function_, .hljs-section, .hljs-selector-id { color: var(--t); }
.hljs-type, .hljs-title.class_, .hljs-params, .hljs-meta { color: var(--f); }
.hljs-name, .hljs-tag, .hljs-selector-class, .hljs-bullet { color: var(--tag); }
.hljs-deletion { color: var(--del); }
.hljs-emphasis { font-style: italic; }
.hljs-strong { font-weight: 700; }

@media (max-width: 640px) {
  main { padding: 12px 16px; }
  .refpicker { margin-left: 0; }
  .search { max-width: none; width: 100%; }
  table.tree .kind { display: none; }
  td.num { min-width: 32px; padding: 0 6px; }
}
.diffpager { display: flex; flex-wrap: wrap; gap: 12px; margin: 0 0 12px; }