/* hu13 — Tokyo Night dark-first, hand-written. Sharp corners only. Zero JS. */
/* Vars: :root = Tokyo Night dark; light overrides under prefers-color-scheme. */
*{box-sizing:border-box;border-radius:0}
:root{
  color-scheme:dark light;
  --bg:#1a1b26;
  --bg-alt:#16161e;
  --bg-th:#1f2335;
  --surface:#1f2335;
  --surface-2:#24283b;
  --fg:#c0caf5;
  --fg-dim:#9aa5ce;
  --muted:#9aa5ce;
  --blue:#7aa2f7;
  --cyan:#7dcfff;
  --green:#9ece6a;
  --yellow:#e0af68;
  --red:#f7768e;
  --border:#292e42;
  --field-border:#6a7590;
  --visited:#9aa5ce;
  --btn-fg:#16161e;
  --state-open:#9ece6a;
  --state-merged:#bb9af7;
  --state-closed:#f7768e;
  /* syntax tokens (build-time highlighter) */
  --tok-kw:#bb9af7;
  --tok-str:#9ece6a;
  --tok-num:#ff9e64;
  --tok-com:#8b93b8;
  --tok-fn:#7aa2f7;
  --tok-type:#2ac3de;
  /* scale: one source for gaps, type, corners (f0rge #69) */
  --s1:.25rem;
  --s2:.5rem;
  --s3:.75rem;
  --s4:1rem;
  --s5:1.5rem;
  --s6:2rem;
  --fs-sm:.85rem;
  --fs-lg:1.15rem;
  --fs-xl:1.5rem;
  --fs-2xl:2rem;
  --radius:0;
  --gap-head:.75rem;
  --gap-content:1rem;
  --diff-add:#9ece6a;
  --diff-add-bg:#233328;
  --diff-del:#f7768e;
  --diff-del-bg:#38232e;
  --diff-hunk:#7dcfff;
  --diff-file:#bb9af7;
}
@media (prefers-color-scheme:light){
  :root{
    --bg:#f6f7f9;
    --bg-alt:#eceef2;
    --bg-th:#e4e7ee;
    --surface:#ffffff;
    --surface-2:#eef0f4;
    --fg:#343b58;
    --fg-dim:#4a5273;
    --muted:#4a5273;
    --blue:#34548a;
    --cyan:#0f4b6e;
    --green:#33635c;
    --yellow:#7d5f33;
    --red:#8c4351;
    --border:#d6dae2;
    --field-border:#8a93a5;
    --visited:#5a4a78;
    --btn-fg:#ffffff;
    --state-open:#33635c;
    --state-merged:#5a4a78;
    --state-closed:#8c4351;
    --tok-kw:#5a4a78;
    --tok-str:#33635c;
    --tok-num:#7d5f33;
    --tok-com:#4a5273;
    --tok-fn:#34548a;
    --tok-type:#0f4b6e;
    --diff-add:#2a534d;
    --diff-add-bg:#c6d4ca;
    --diff-del:#7a3543;
    --diff-del-bg:#d9c2c7;
    --diff-hunk:#0f4b6e;
    --diff-file:#5a4a78;
  }
}
html{background:var(--bg);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,Cantarell,sans-serif;
  line-height:1.55;font-size:16px;overflow-x:clip}
img,video,svg{max-width:100%;height:auto}
/* Fluid container: base = mobile single-column, side padding, never fixed px. */
.wrap{max-width:100%;margin:0 auto;padding:0 1rem;min-width:0}
.site-header{background:var(--bg-alt);border-bottom:1px solid var(--border)}
.site-header .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem 1rem;padding:.75rem 1rem}
.brand{font-weight:700;color:var(--blue);overflow-wrap:anywhere}
.site-nav{background:var(--bg-alt);border-bottom:1px solid var(--border)}
.site-nav .wrap{display:flex;flex-wrap:wrap;gap:.25rem 1rem;padding:.5rem 1rem}
.site-nav a{display:inline-flex;align-items:center;min-height:40px;color:var(--cyan);text-decoration:none;padding:.35rem .1rem}
.site-nav a:hover,.site-nav a:focus{text-decoration:underline}
a{color:var(--blue)}
a:visited{color:var(--visited)}
main{padding:1.25rem 0 3rem;min-width:0}
/* Repo header stacks on narrow; clone cmd + sha wrap safely.
   Breathing room under the navbar (m6/code-space, f0rge #40): air via
   CSS margin-top (never <br> spacers); the base stays tight for 360px
   and wider screens get a touch more. Title is explicit 2rem so it
   reads as the page title on every viewport. */
.repo-head{display:flex;flex-direction:column;gap:.25rem;min-width:0;margin-top:var(--gap-head);margin-bottom:var(--gap-content)}
.repo-head h1{margin:0 0 .25rem;overflow-wrap:anywhere;font-size:2rem;line-height:1.2}
.clone,.repo-meta{margin:.25rem 0;min-width:0}
.clone code,.repo-meta code{overflow-wrap:anywhere;word-break:break-all}
code,kbd,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  background:var(--bg-alt);color:var(--green);padding:.1em .3em;overflow-wrap:anywhere}
pre{background:var(--bg-alt);color:var(--fg);border:1px solid var(--border);
  padding:1rem;overflow-x:auto;white-space:pre;line-height:1.5;max-width:100%}
pre code{background:none;padding:0;color:inherit;overflow-wrap:normal;word-break:normal}
/* Diff colors (line-level spans for #22; renderer lands there, vars live here). */
.diff-add{color:var(--diff-add);background:var(--diff-add-bg)}
.diff-del{color:var(--diff-del);background:var(--diff-del-bg)}
.diff-hunk{color:var(--diff-hunk)}
.diff-file{color:var(--diff-file);font-weight:700}
/* Scroll containers: tables never break layout; pre scrolls inside too. */
.table-scroll,.pre-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
.table-scroll{margin:1rem 0}
.pre-scroll{margin:1rem 0}
.table-scroll table{margin:0}
.pre-scroll pre{margin:0}
table{border-collapse:collapse;width:100%;margin:1rem 0;background:var(--bg-alt)}
th,td{text-align:left;padding:.5rem .75rem;border:1px solid var(--border);vertical-align:top;overflow-wrap:anywhere}
th{background:var(--bg-th);color:var(--cyan)}
tr:nth-child(even) td{background:var(--bg)}
td code,th code{word-break:break-all}
/* List tables (m6/tables): long titles/shas wrap inside the scroll box; the # column stays narrow. */
td.title,td.sha{overflow-wrap:anywhere}
td.num{width:1%;white-space:nowrap}
/* Single-column stack; children keep DOM order. */
.cols{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s6);min-width:0}
.cols>section,.cols>div{min-width:0}
/* Forms: full-width on mobile, >=40px touch targets. */
form{max-width:44rem;margin:1rem 0;min-width:0}
label{display:block;margin:.75rem 0 .25rem;font-weight:600}
input[type=text],textarea{display:block;width:100%;max-width:100%;background:var(--surface);
  color:var(--fg);border:1px solid var(--field-border);padding:.5rem .6rem;font:inherit;min-height:40px}
input[type=text]:focus,textarea:focus{outline:2px solid var(--blue);outline-offset:0}
textarea{min-height:12rem}
button,input[type=submit]{display:inline-flex;align-items:center;justify-content:center;
  min-height:40px;min-width:40px;background:var(--blue);color:var(--btn-fg);border:1px solid var(--blue);
  padding:.5rem 1rem;font:inherit;font-weight:700;cursor:pointer}
button:hover,input[type=submit]:hover{background:var(--cyan)}
/* Submit buttons (m6/submit-buttons, f0rge #25): link styled as a
   button — Tokyo Night accent fill, >=40px touch target, icon + words. */
.btn-new{display:inline-flex;align-items:center;justify-content:center;
  min-height:40px;min-width:40px;background:var(--blue);color:var(--btn-fg);
  border:1px solid var(--blue);padding:.5rem 1rem;font:inherit;font-weight:700;
  text-decoration:none;cursor:pointer}
.btn-new:visited{color:var(--btn-fg)}
.btn-new:hover,.btn-new:focus{background:var(--cyan);text-decoration:none}
.muted{color:var(--muted)}
/* GFM markdown (f0rge #71): task lists, strikethrough, footnotes. */
li:has(>input[type=checkbox]){list-style:none}
.markdown input[type=checkbox],li>input[type=checkbox]{width:auto;height:auto;min-height:0;margin:0 .4em 0 -1.2em;vertical-align:middle;accent-color:var(--green)}
.prose del,.del{color:var(--fg-dim);text-decoration:line-through}
.footnotes{margin-top:var(--s5);font-size:var(--fs-sm);color:var(--fg-dim)}
.footnotes ol{padding-left:var(--s5)}
.markdown table{background:var(--surface)}
.markdown th{background:var(--bg-th);font-weight:600}
.markdown td,.markdown th{padding:var(--s2) var(--s3)}
.markdown tr:nth-child(even) td{background:var(--bg-alt)}
footer.site-footer{border-top:1px solid var(--border);margin-top:var(--s6)}
footer.site-footer .wrap{padding:var(--s4) 1rem var(--s5)}
.footer-brand{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--s2) var(--s3);margin:0 0 var(--s2)}
.footer-brand .gl0w-mark{text-decoration:none}
.footer-tag{color:var(--fg);font-weight:600}
.footer-links{margin:0 0 var(--s2);font-size:var(--fs-sm)}
.footer-links a{margin-right:var(--s3)}
/* Provenance line (m6/footer-line, f0rge #41): the single muted line
   inside the existing footer block — small, no extra whitespace. */
footer.site-footer .footer-provenance{margin:0;font-size:var(--fs-sm);text-align:left}
/* Navbar one-bar (m6/navbar, f0rge #18): logo hu13 • scrollable nav • repo.
   Own classes only (.header-bar/.brand-lockup/.site-logo/.hu13-word/.sep/
   .nav-scroll/.nav-scroll-row); earlier rules above are untouched. The nav
   strip scrolls horizontally on narrow (no wrap, snap off) with a visible
   focus ring; the active link gets an accent underline via aria-current. */
.site-header .wrap.header-bar{display:flex;flex-wrap:nowrap;align-items:center;gap:.5rem .75rem}
.brand-lockup{display:inline-flex;align-items:center;gap:.5rem;flex:none;color:var(--fg);text-decoration:none;min-height:40px}
.brand-lockup:visited{color:var(--fg)}
.gl0w-mark{display:inline-flex;align-items:center;color:var(--cyan);line-height:0;flex:none}
.gl0w-mark svg{display:block;height:1.3rem;width:auto}
.brand-lockup:hover .gl0w-mark,.footer-brand .gl0w-mark:hover{color:var(--blue)}
.lockup-slash{color:var(--border);font-weight:400}
.site-logo{display:block;width:auto;height:1.75rem;flex:none}
.hu13-word{font-weight:700;color:var(--blue)}
.sep{flex:none;color:var(--muted)}
.nav-sep{flex:0 0 auto;color:var(--muted)}
.site-header .site-nav.nav-scroll{flex:1 1 auto;min-width:0;background:none;border-bottom:none;overflow-x:auto;scroll-snap-type:none;-webkit-overflow-scrolling:touch}
.nav-scroll-row{display:flex;align-items:center;gap:.25rem 1rem;white-space:nowrap;width:max-content;min-width:100%}
.site-header .site-nav.nav-scroll a{flex:0 0 auto;white-space:nowrap}
.site-header .site-nav.nav-scroll a[aria-current="page"]{font-weight:700;text-decoration:underline;text-decoration-color:var(--blue);text-underline-offset:.25em}
.brand-lockup:focus-visible,.site-header .site-nav.nav-scroll a:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.site-header .brand{flex:none}
@media (min-width:768px){
  .site-nav .wrap{gap:.25rem 1.25rem}
  :root{--gap-head:1.25rem;--gap-content:1.5rem}
  main{padding:1.5rem 0 3rem}
}
/* The code tab is always one stacked column: Files, then README.
   No desktop 7/5 split; the file table keeps the full content width. */
@media (min-width:1100px){
  .wrap{max-width:72rem;padding:0 1.5rem}
}
/* Code conventions (m6, f0rge #20): breadcrumbs, file meta, line anchors, clone block. */
.crumbs{margin:var(--gap-head) 0 .5rem;font-size:.95rem}
.crumbs a{color:var(--cyan);text-decoration:none}
.crumbs a:hover,.crumbs a:focus{text-decoration:underline}
.file-meta{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem 1rem;margin:.5rem 0;padding:.5rem .75rem;background:var(--bg-alt);border:1px solid var(--border)}
.file-path{overflow-wrap:anywhere;word-break:break-all}
.file-size,.file-lines{color:var(--muted);white-space:nowrap}
.file-raw{display:inline-flex;align-items:center;min-height:40px;padding:0 .75rem;border:1px solid var(--border);color:var(--blue);font-weight:600}
.file-raw:hover,.file-raw:focus{background:var(--surface-2);text-decoration:none}
.line:target{background:var(--bg-th)}
/* Code view (f0rge #73): sticky-looking gutter with a rule, token colors. */
pre.code{background:var(--surface);padding:var(--s2) 0;font-size:.83rem;line-height:1.5;tab-size:4}
pre.code .line{display:block;padding-right:var(--s4)}
pre.code .ln{display:inline-block;width:3.4em;padding-right:var(--s3);margin-right:var(--s3);border-right:1px solid var(--border);text-align:right;color:var(--fg-dim);text-decoration:none;user-select:none}
pre.code .line:target .ln{color:var(--fg)}
a.ln:hover,a.ln:focus{text-decoration:underline}
.tok-kw{color:var(--tok-kw)}
.tok-str{color:var(--tok-str)}
.tok-num{color:var(--tok-num)}
.tok-com{color:var(--tok-com);font-style:italic}
.tok-fn{color:var(--tok-fn)}
.tok-type{color:var(--tok-type)}
.clone-block{margin:1rem 0;padding:.25rem 1rem 1rem;background:var(--bg-alt);border:1px solid var(--border)}
.clone-block h2{margin:.75rem 0 .25rem}
.clone-block h3{margin:1rem 0 .25rem}
.clone-block p{margin:.5rem 0}
.clone-cmd code{user-select:all;overflow-wrap:anywhere;word-break:break-all}
/* List tables scroll, never squash (m6/table-scroll, f0rge #30): natural
   width inside .table-scroll; cells nowrap except title cells which wrap
   with a floor so rows scroll horizontally. Hover tint via var. */
.table-scroll table{width:max-content;min-width:100%;max-width:100%}
.table-scroll th,.table-scroll td{white-space:nowrap}
.table-scroll td.title{white-space:normal;overflow-wrap:anywhere;min-width:12rem}
.table-scroll tbody tr:hover td{background:var(--bg-th)}
/* Truncate all table fields (m6/truncate, f0rge #42): ellipsis + nowrap
   with per-kind max-widths so desktop tables fit the 1100px container
   without page-level h-scroll. Full text stays in title= attrs.
   Later + equal specificity beats td.title wrap above on desktop. */
.trunc{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:24ch;min-width:0}
.table-scroll td.trunc{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:24ch;min-width:0}
.table-scroll td.trunc-subject,.trunc-subject{max-width:40ch}
.table-scroll td.trunc-author,.trunc-author{max-width:16ch}
.table-scroll td.trunc-sha,.trunc-sha{max-width:10ch}
.table-scroll td.trunc-message,.trunc-message{max-width:72ch}
.table-scroll td.trunc-title,.trunc-title{max-width:60ch}
/* Page titles with inline buttons (m6/table-scroll, f0rge #31): h1 +
   button share one flex row; wrap allowed on 360px but stays adjacent. */
.page-head{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1rem;margin-top:var(--gap-head);margin-bottom:var(--gap-content)}
.page-head h1{margin:0}
main>h1:first-child{margin-top:var(--gap-head);margin-bottom:var(--gap-content)}
.page-head .btn-new{flex:none}

/* Code-gitea (m6, f0rge #33 + #34): file TABLE, language bar, clone details. */
.file-table th:nth-child(3),.file-table td:nth-child(3){white-space:nowrap}
.file-table td.title{white-space:normal;overflow-wrap:anywhere;min-width:12rem}
.langs{margin:1rem 0}
.lang-bar{display:flex;height:.5rem;overflow:hidden;background:var(--bg-th);border:1px solid var(--border)}
.lang-bar span{display:block;height:100%}
.lang-legend{list-style:none;margin:.5rem 0;padding:0;display:flex;flex-wrap:wrap;gap:.25rem 1rem}
.lang-legend li{display:inline-flex;align-items:center;gap:.35rem}
.lang-dot{display:inline-block;width:.75rem;height:.75rem;flex:none}
details.clonebox{margin:1rem 0;padding:.25rem 1rem 1rem;background:var(--bg-alt);border:1px solid var(--border)}
details.clonebox>summary{cursor:pointer;min-height:40px;font-weight:700;color:var(--cyan);margin:0;display:flex;flex-wrap:wrap;align-items:center;gap:.15rem .5rem}
.cb-seg{white-space:nowrap}
.cb-seg+.cb-seg::before{content:"·";margin-right:.5rem;color:var(--fg-dim)}
details.clonebox>summary:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
/* Clone gap (m6/code-bits, f0rge #44): no blank line under summary when
   collapsed — collapsed padding stays tight; open gap lives on the
   wrapper's first child so margins never collapse through summary. */
details.clonebox:not([open]){padding-bottom:.25rem}
.clonebox .clone-body{margin:0}
.clonebox .clone-body>:first-child{margin-top:.75rem}
.clone-hint,.clonebox summary .muted{font-weight:400}
/* Code page vertical rhythm (f0rge #122/#123): one scale instead of
   browser heading margins. 32px between major blocks, 12px heading ->
   content, 8px language bar -> legend. Scoped so markdown body flow is
   unchanged. */
.repo-head{margin-top:var(--s6);margin-bottom:var(--s6);gap:var(--s3)}
.repo-head h1{margin:0}
.repo-head .clonebox{margin:0}
.code-files>h2,.code-readme>h2{margin:0 0 var(--s3)}
.code-files>.table-scroll{margin:0}
.langs{margin:var(--s6) 0 0}
.langs>h2{margin:0 0 var(--s3)}
.lang-bar{margin:0}
.lang-legend{margin:var(--s2) 0 0}
.code-readme .markdown>:first-child{margin-top:0}
/* CI verdict badges (m6/code-bits, f0rge #43): GitHub-style green/red on
   the code repo-head; running/cancelled keep muted tones. */
.badge{display:inline-block;padding:.1em .5em;border:1px solid var(--border);font-weight:700;font-size:.85rem}
.badge.pass{color:var(--green);border-color:var(--green)}
.badge.fail{color:var(--red);border-color:var(--red)}
.badge.running{color:var(--yellow);border-color:var(--yellow)}
.badge.cancelled{color:var(--muted);border-color:var(--muted)}
/* Stacked cards on narrow (m6/no-scroll, f0rge #39): Gitea-style reflow.
   Desktop (>=768px) keeps .table-scroll horizontal scroll untouched above.
   Narrow: no scroll (overflow visible), thead clipped for SR only, each
   tr becomes a bordered card, each td a labeled flex row via data-label.
   Title cells lead bold without a repeated label; nothing is deleted.
   File table exempt (m6/cards2, f0rge #46): dense reference data stays a
   real table at every width — .file-scroll keeps horizontal scroll and
   table layout on narrow while every other list table becomes cards. */
@media (max-width:767px){
  .table-scroll:not(.file-scroll){overflow-x:visible}
  .table-scroll:not(.file-scroll) table{width:100%;min-width:0}
  .table-scroll:not(.file-scroll) thead{position:absolute;max-width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .table-scroll:not(.file-scroll) tbody,.table-scroll:not(.file-scroll) tr{display:block;width:auto}
  .table-scroll:not(.file-scroll) tr{border:1px solid var(--border);background:var(--bg-alt);margin:0 0 .75rem;padding:.25rem 0}
  .table-scroll:not(.file-scroll) th,.table-scroll:not(.file-scroll) td{white-space:normal}
  .table-scroll:not(.file-scroll) td{display:flex;gap:.5rem;align-items:baseline;padding:.4rem .75rem;border:none;border-bottom:1px solid var(--border);min-width:0;overflow-wrap:anywhere}
  .table-scroll:not(.file-scroll) td:last-child{border-bottom:none}
  .table-scroll:not(.file-scroll) td::before{content:attr(data-label);flex:0 0 6rem;color:var(--muted);font-weight:600;font-size:.8rem;overflow-wrap:anywhere}
  .table-scroll:not(.file-scroll) td.title::before{display:none}
  .table-scroll:not(.file-scroll) td.title{font-weight:700;font-size:1.02rem;min-width:0}
  .table-scroll:not(.file-scroll) td.num,.table-scroll:not(.file-scroll) td.sha{width:auto}
  .table-scroll:not(.file-scroll) td code,.table-scroll:not(.file-scroll) td a{overflow-wrap:anywhere;word-break:break-all;min-width:0}
  .table-scroll:not(.file-scroll) tbody tr:hover td{background:none}
  .table-scroll:not(.file-scroll) td.trunc,.trunc{white-space:normal;max-width:none;overflow:visible;text-overflow:clip}
  .file-scroll{overflow-x:auto}
  .file-scroll table{width:max-content;min-width:100%}
}
/* Meta pass (f0rge #72): pills, chips, monograms, relative times. */
.meta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2);margin:0 0 var(--s4)}
.pill{display:inline-flex;align-items:center;padding:.1em .6em;border:1px solid currentColor;font-weight:700;font-size:var(--fs-sm)}
.pill.state-open{color:var(--state-open)}
.pill.state-merged{color:var(--state-merged)}
.pill.state-closed{color:var(--state-closed)}
.pill.state-other{color:var(--fg-dim)}
.chip{display:inline-flex;padding:.1em .5em;border:1px solid var(--border);background:var(--surface);color:var(--fg-dim);font-size:var(--fs-sm)}
.chip.milestone{border-style:dashed}
.meta-when{color:var(--fg-dim);font-size:var(--fs-sm)}
.meta-more{margin:0 0 var(--s4);font-size:var(--fs-sm);color:var(--fg-dim)}
.meta-more summary{cursor:pointer;color:var(--blue)}
.meta-more dl{display:grid;grid-template-columns:max-content 1fr;gap:var(--s1) var(--s3);margin:var(--s2) 0 0}
.meta-more dt{font-weight:600}
.meta-more dd{margin:0;overflow-wrap:anywhere}
.mono{display:inline-flex;width:1.4rem;height:1.4rem;align-items:center;justify-content:center;font-size:.75rem;font-weight:700;border:1px solid var(--border);background:var(--surface-2);color:var(--fg);vertical-align:-.25rem;margin-right:var(--s2)}
.mono.m0{color:var(--blue)}
.mono.m1{color:var(--green)}
.mono.m2{color:var(--yellow)}
.mono.m3{color:var(--red)}
.mono.m4{color:var(--cyan)}
.mono.m5{color:var(--tok-kw)}
.comment-head{display:flex;align-items:center;color:var(--fg-dim);font-size:var(--fs-sm);margin:0 0 var(--s2)}
.comment-head .who{color:var(--fg);font-weight:600;margin-right:.35em}
time{font-variant-numeric:tabular-nums}

/* Diff cards (f0rge #74): one card per file, dual line numbers. */
.difffile{border:1px solid var(--border);background:var(--surface);margin:var(--s3) 0}
.difffile>summary{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2) var(--s3);padding:var(--s2) var(--s3);cursor:pointer;background:var(--bg-alt)}
.difffile>summary::marker{color:var(--fg-dim)}
.df-path{color:var(--fg);background:none;padding:0;overflow-wrap:anywhere}
.df-count{font-size:var(--fs-sm);font-variant-numeric:tabular-nums;margin-left:auto}
.df-add{color:var(--green)}
.df-del{color:var(--red)}
.df-bar{display:inline-block;width:6rem;height:.5rem;background:var(--diff-del-bg);border:1px solid var(--border)}
.df-bar-add{display:block;height:100%;background:var(--green)}
.difffile .pre-scroll{margin:0}
pre.diff{margin:0;border:0;background:var(--surface)}
pre.diff>span{display:block}
.df-line{display:block}
.dln{display:inline-block;width:2.8em;text-align:right;padding-right:.5em;color:var(--fg-dim);user-select:none;font-variant-numeric:tabular-nums}
.dln+.dln{border-right:1px solid var(--border);margin-right:.5em}
.diff-add-row{background:var(--diff-add-bg)}
.diff-del-row{background:var(--diff-del-bg)}
.diff-file{color:var(--diff-file);font-weight:600}
.df-meta{color:var(--fg-dim)}

/* Tablet nav (f0rge #91): 768–1099px scrolls off the last tab with no
   affordance. Give the nav its own wrapped row until the full one-row
   header fits at 1100px; separators would otherwise begin a line. */
@media (min-width:768px) and (max-width:1099px){
  .site-header .wrap.header-bar{flex-wrap:wrap}
  .site-header .sep,.site-header .nav-sep{display:none}
  .site-header .site-nav.nav-scroll{flex:1 1 100%;overflow-x:visible;border-top:1px solid var(--border);margin-top:var(--s1);padding-top:var(--s1)}
  .nav-scroll-row{flex-wrap:wrap;width:auto;min-width:0;white-space:normal;column-gap:.9rem;row-gap:.1rem}
}
/* Branch lanes (f0rge #92): never break inside a branch name; wrap only
   between head, arrow and base (a very long token scrolls its cell).
   Mobile card cells inherit word-break:break-all, so reset it here. */
.lanes{display:inline-flex;flex-wrap:wrap;align-items:baseline;gap:.15rem .35rem;max-width:100%;overflow-x:auto;word-break:normal;overflow-wrap:normal}
.lanes .lane{white-space:nowrap}
.lanes .lane-arrow{color:var(--muted)}
/* Responsive fixes (f0rge #75): every nav destination visible at 390px,
   file table keeps Name + Age, meta chips never overflow. */
@media (max-width:767px){
  .site-header .wrap.header-bar{flex-wrap:wrap}
  .site-header .sep,.site-header .nav-sep{display:none}
  .site-header .site-nav.nav-scroll{flex:1 1 100%;overflow-x:visible;border-top:1px solid var(--border);margin-top:var(--s1);padding-top:var(--s1)}
  .nav-scroll-row{flex-wrap:wrap;width:auto;min-width:0;white-space:normal;column-gap:.9rem;row-gap:.1rem}
  /* Dense file table: drop "Last commit" below 768px instead of wrapping
     commit subjects into four lines or clipping the age column. */
  .file-table th:nth-child(2),.file-table td:nth-child(2){display:none}
  .file-table td.title{white-space:nowrap}
  .file-scroll{overflow-x:auto}
  .meta .chip,.meta .pill{max-width:100%;overflow-wrap:anywhere}
  .clonebox>summary{font-weight:700}
}
