1 /* hu13 — Tokyo Night dark-first, hand-written. Sharp corners only. Zero JS. */2 /* Vars: :root = Tokyo Night dark; light overrides under prefers-color-scheme. */3 *{box-sizing:border-box;border-radius:0}4 :root{5   color-scheme:dark light;6   --bg:#1a1b26;7   --bg-alt:#16161e;8   --bg-th:#1f2335;9   --surface:#1f2335;10   --surface-2:#24283b;11   --fg:#c0caf5;12   --fg-dim:#9aa5ce;13   --muted:#9aa5ce;14   --blue:#7aa2f7;15   --cyan:#7dcfff;16   --green:#9ece6a;17   --yellow:#e0af68;18   --red:#f7768e;19   --border:#292e42;20   --field-border:#6a7590;21   --visited:#9aa5ce;22   --btn-fg:#16161e;23   --state-open:#9ece6a;24   --state-merged:#bb9af7;25   --state-closed:#f7768e;26   /* syntax tokens (build-time highlighter) */27   --tok-kw:#bb9af7;28   --tok-str:#9ece6a;29   --tok-num:#ff9e64;30   --tok-com:#8b93b8;31   --tok-fn:#7aa2f7;32   --tok-type:#2ac3de;33   /* scale: one source for gaps, type, corners (f0rge #69) */34   --s1:.25rem;35   --s2:.5rem;36   --s3:.75rem;37   --s4:1rem;38   --s5:1.5rem;39   --s6:2rem;40   --fs-sm:.85rem;41   --fs-lg:1.15rem;42   --fs-xl:1.5rem;43   --fs-2xl:2rem;44   --radius:0;45   --gap-head:.75rem;46   --gap-content:1rem;47   --diff-add:#9ece6a;48   --diff-add-bg:#233328;49   --diff-del:#f7768e;50   --diff-del-bg:#38232e;51   --diff-hunk:#7dcfff;52   --diff-file:#bb9af7;53 }54 @media (prefers-color-scheme:light){55   :root{56     --bg:#f6f7f9;57     --bg-alt:#eceef2;58     --bg-th:#e4e7ee;59     --surface:#ffffff;60     --surface-2:#eef0f4;61     --fg:#343b58;62     --fg-dim:#4a5273;63     --muted:#4a5273;64     --blue:#34548a;65     --cyan:#0f4b6e;66     --green:#33635c;67     --yellow:#7d5f33;68     --red:#8c4351;69     --border:#d6dae2;70     --field-border:#8a93a5;71     --visited:#5a4a78;72     --btn-fg:#ffffff;73     --state-open:#33635c;74     --state-merged:#5a4a78;75     --state-closed:#8c4351;76     --tok-kw:#5a4a78;77     --tok-str:#33635c;78     --tok-num:#7d5f33;79     --tok-com:#4a5273;80     --tok-fn:#34548a;81     --tok-type:#0f4b6e;82     --diff-add:#2a534d;83     --diff-add-bg:#c6d4ca;84     --diff-del:#7a3543;85     --diff-del-bg:#d9c2c7;86     --diff-hunk:#0f4b6e;87     --diff-file:#5a4a78;88   }89 }90 html{background:var(--bg);-webkit-text-size-adjust:100%}91 body{margin:0;background:var(--bg);color:var(--fg);92   font-family:system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,Cantarell,sans-serif;93   line-height:1.55;font-size:16px;overflow-x:clip}94 img,video,svg{max-width:100%;height:auto}95 /* Fluid container: base = mobile single-column, side padding, never fixed px. */96 .wrap{max-width:100%;margin:0 auto;padding:0 1rem;min-width:0}97 .site-header{background:var(--bg-alt);border-bottom:1px solid var(--border)}98 .site-header .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem 1rem;padding:.75rem 1rem}99 .brand{font-weight:700;color:var(--blue);overflow-wrap:anywhere}100 .site-nav{background:var(--bg-alt);border-bottom:1px solid var(--border)}101 .site-nav .wrap{display:flex;flex-wrap:wrap;gap:.25rem 1rem;padding:.5rem 1rem}102 .site-nav a{display:inline-flex;align-items:center;min-height:40px;color:var(--cyan);text-decoration:none;padding:.35rem .1rem}103 .site-nav a:hover,.site-nav a:focus{text-decoration:underline}104 a{color:var(--blue)}105 a:visited{color:var(--visited)}106 main{padding:1.25rem 0 3rem;min-width:0}107 /* Repo header stacks on narrow; clone cmd + sha wrap safely.108    Breathing room under the navbar (m6/code-space, f0rge #40): air via109    CSS margin-top (never <br> spacers); the base stays tight for 360px110    and wider screens get a touch more. Title is explicit 2rem so it111    reads as the page title on every viewport. */112 .repo-head{display:flex;flex-direction:column;gap:.25rem;min-width:0;margin-top:var(--gap-head);margin-bottom:var(--gap-content)}113 .repo-head h1{margin:0 0 .25rem;overflow-wrap:anywhere;font-size:2rem;line-height:1.2}114 .clone,.repo-meta{margin:.25rem 0;min-width:0}115 .clone code,.repo-meta code{overflow-wrap:anywhere;word-break:break-all}116 code,kbd,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;117   background:var(--bg-alt);color:var(--green);padding:.1em .3em;overflow-wrap:anywhere}118 pre{background:var(--bg-alt);color:var(--fg);border:1px solid var(--border);119   padding:1rem;overflow-x:auto;white-space:pre;line-height:1.5;max-width:100%}120 pre code{background:none;padding:0;color:inherit;overflow-wrap:normal;word-break:normal}121 /* Diff colors (line-level spans for #22; renderer lands there, vars live here). */122 .diff-add{color:var(--diff-add);background:var(--diff-add-bg)}123 .diff-del{color:var(--diff-del);background:var(--diff-del-bg)}124 .diff-hunk{color:var(--diff-hunk)}125 .diff-file{color:var(--diff-file);font-weight:700}126 /* Scroll containers: tables never break layout; pre scrolls inside too. */127 .table-scroll,.pre-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}128 .table-scroll{margin:1rem 0}129 .pre-scroll{margin:1rem 0}130 .table-scroll table{margin:0}131 .pre-scroll pre{margin:0}132 table{border-collapse:collapse;width:100%;margin:1rem 0;background:var(--bg-alt)}133 th,td{text-align:left;padding:.5rem .75rem;border:1px solid var(--border);vertical-align:top;overflow-wrap:anywhere}134 th{background:var(--bg-th);color:var(--cyan)}135 tr:nth-child(even) td{background:var(--bg)}136 td code,th code{word-break:break-all}137 /* List tables (m6/tables): long titles/shas wrap inside the scroll box; the # column stays narrow. */138 td.title,td.sha{overflow-wrap:anywhere}139 td.num{width:1%;white-space:nowrap}140 /* Single-column stack; children keep DOM order. */141 .cols{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s6);min-width:0}142 .cols>section,.cols>div{min-width:0}143 /* Forms: full-width on mobile, >=40px touch targets. */144 form{max-width:44rem;margin:1rem 0;min-width:0}145 label{display:block;margin:.75rem 0 .25rem;font-weight:600}146 input[type=text],textarea{display:block;width:100%;max-width:100%;background:var(--surface);147   color:var(--fg);border:1px solid var(--field-border);padding:.5rem .6rem;font:inherit;min-height:40px}148 input[type=text]:focus,textarea:focus{outline:2px solid var(--blue);outline-offset:0}149 textarea{min-height:12rem}150 button,input[type=submit]{display:inline-flex;align-items:center;justify-content:center;151   min-height:40px;min-width:40px;background:var(--blue);color:var(--btn-fg);border:1px solid var(--blue);152   padding:.5rem 1rem;font:inherit;font-weight:700;cursor:pointer}153 button:hover,input[type=submit]:hover{background:var(--cyan)}154 /* Submit buttons (m6/submit-buttons, f0rge #25): link styled as a155    button — Tokyo Night accent fill, >=40px touch target, icon + words. */156 .btn-new{display:inline-flex;align-items:center;justify-content:center;157   min-height:40px;min-width:40px;background:var(--blue);color:var(--btn-fg);158   border:1px solid var(--blue);padding:.5rem 1rem;font:inherit;font-weight:700;159   text-decoration:none;cursor:pointer}160 .btn-new:visited{color:var(--btn-fg)}161 .btn-new:hover,.btn-new:focus{background:var(--cyan);text-decoration:none}162 .muted{color:var(--muted)}163 /* GFM markdown (f0rge #71): task lists, strikethrough, footnotes. */164 li:has(>input[type=checkbox]){list-style:none}165 .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)}166 .prose del,.del{color:var(--fg-dim);text-decoration:line-through}167 .footnotes{margin-top:var(--s5);font-size:var(--fs-sm);color:var(--fg-dim)}168 .footnotes ol{padding-left:var(--s5)}169 .markdown table{background:var(--surface)}170 .markdown th{background:var(--bg-th);font-weight:600}171 .markdown td,.markdown th{padding:var(--s2) var(--s3)}172 .markdown tr:nth-child(even) td{background:var(--bg-alt)}173 footer.site-footer{border-top:1px solid var(--border);margin-top:var(--s6)}174 footer.site-footer .wrap{padding:var(--s4) 1rem var(--s5)}175 .footer-brand{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--s2) var(--s3);margin:0 0 var(--s2)}176 .footer-brand .gl0w-mark{text-decoration:none}177 .footer-tag{color:var(--fg);font-weight:600}178 .footer-links{margin:0 0 var(--s2);font-size:var(--fs-sm)}179 .footer-links a{margin-right:var(--s3)}180 /* Provenance line (m6/footer-line, f0rge #41): the single muted line181    inside the existing footer block — small, no extra whitespace. */182 footer.site-footer .footer-provenance{margin:0;font-size:var(--fs-sm);text-align:left}183 /* Navbar one-bar (m6/navbar, f0rge #18): logo hu13 • scrollable nav • repo.184    Own classes only (.header-bar/.brand-lockup/.site-logo/.hu13-word/.sep/185    .nav-scroll/.nav-scroll-row); earlier rules above are untouched. The nav186    strip scrolls horizontally on narrow (no wrap, snap off) with a visible187    focus ring; the active link gets an accent underline via aria-current. */188 .site-header .wrap.header-bar{display:flex;flex-wrap:nowrap;align-items:center;gap:.5rem .75rem}189 .brand-lockup{display:inline-flex;align-items:center;gap:.5rem;flex:none;color:var(--fg);text-decoration:none;min-height:40px}190 .brand-lockup:visited{color:var(--fg)}191 .gl0w-mark{display:inline-flex;align-items:center;color:var(--cyan);line-height:0;flex:none}192 .gl0w-mark svg{display:block;height:1.3rem;width:auto}193 .brand-lockup:hover .gl0w-mark,.footer-brand .gl0w-mark:hover{color:var(--blue)}194 .lockup-slash{color:var(--border);font-weight:400}195 .site-logo{display:block;width:auto;height:1.75rem;flex:none}196 .hu13-word{font-weight:700;color:var(--blue)}197 .sep{flex:none;color:var(--muted)}198 .nav-sep{flex:0 0 auto;color:var(--muted)}199 .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}200 .nav-scroll-row{display:flex;align-items:center;gap:.25rem 1rem;white-space:nowrap;width:max-content;min-width:100%}201 .site-header .site-nav.nav-scroll a{flex:0 0 auto;white-space:nowrap}202 .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}203 .brand-lockup:focus-visible,.site-header .site-nav.nav-scroll a:focus-visible{outline:2px solid var(--blue);outline-offset:2px}204 .site-header .brand{flex:none}205 @media (min-width:768px){206   .site-nav .wrap{gap:.25rem 1.25rem}207   :root{--gap-head:1.25rem;--gap-content:1.5rem}208   main{padding:1.5rem 0 3rem}209 }210 /* The code tab is always one stacked column: Files, then README.211    No desktop 7/5 split; the file table keeps the full content width. */212 @media (min-width:1100px){213   .wrap{max-width:72rem;padding:0 1.5rem}214 }215 /* Code conventions (m6, f0rge #20): breadcrumbs, file meta, line anchors, clone block. */216 .crumbs{margin:var(--gap-head) 0 .5rem;font-size:.95rem}217 .crumbs a{color:var(--cyan);text-decoration:none}218 .crumbs a:hover,.crumbs a:focus{text-decoration:underline}219 .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)}220 .file-path{overflow-wrap:anywhere;word-break:break-all}221 .file-size,.file-lines{color:var(--muted);white-space:nowrap}222 .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}223 .file-raw:hover,.file-raw:focus{background:var(--surface-2);text-decoration:none}224 .line:target{background:var(--bg-th)}225 /* Code view (f0rge #73): sticky-looking gutter with a rule, token colors. */226 pre.code{background:var(--surface);padding:var(--s2) 0;font-size:.83rem;line-height:1.5;tab-size:4}227 pre.code .line{display:block;padding-right:var(--s4)}228 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}229 pre.code .line:target .ln{color:var(--fg)}230 a.ln:hover,a.ln:focus{text-decoration:underline}231 .tok-kw{color:var(--tok-kw)}232 .tok-str{color:var(--tok-str)}233 .tok-num{color:var(--tok-num)}234 .tok-com{color:var(--tok-com);font-style:italic}235 .tok-fn{color:var(--tok-fn)}236 .tok-type{color:var(--tok-type)}237 .clone-block{margin:1rem 0;padding:.25rem 1rem 1rem;background:var(--bg-alt);border:1px solid var(--border)}238 .clone-block h2{margin:.75rem 0 .25rem}239 .clone-block h3{margin:1rem 0 .25rem}240 .clone-block p{margin:.5rem 0}241 .clone-cmd code{user-select:all;overflow-wrap:anywhere;word-break:break-all}242 /* List tables scroll, never squash (m6/table-scroll, f0rge #30): natural243    width inside .table-scroll; cells nowrap except title cells which wrap244    with a floor so rows scroll horizontally. Hover tint via var. */245 .table-scroll table{width:max-content;min-width:100%;max-width:100%}246 .table-scroll th,.table-scroll td{white-space:nowrap}247 .table-scroll td.title{white-space:normal;overflow-wrap:anywhere;min-width:12rem}248 .table-scroll tbody tr:hover td{background:var(--bg-th)}249 /* Truncate all table fields (m6/truncate, f0rge #42): ellipsis + nowrap250    with per-kind max-widths so desktop tables fit the 1100px container251    without page-level h-scroll. Full text stays in title= attrs.252    Later + equal specificity beats td.title wrap above on desktop. */253 .trunc{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:24ch;min-width:0}254 .table-scroll td.trunc{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:24ch;min-width:0}255 .table-scroll td.trunc-subject,.trunc-subject{max-width:40ch}256 .table-scroll td.trunc-author,.trunc-author{max-width:16ch}257 .table-scroll td.trunc-sha,.trunc-sha{max-width:10ch}258 .table-scroll td.trunc-message,.trunc-message{max-width:72ch}259 .table-scroll td.trunc-title,.trunc-title{max-width:60ch}260 /* Page titles with inline buttons (m6/table-scroll, f0rge #31): h1 +261    button share one flex row; wrap allowed on 360px but stays adjacent. */262 .page-head{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1rem;margin-top:var(--gap-head);margin-bottom:var(--gap-content)}263 .page-head h1{margin:0}264 main>h1:first-child{margin-top:var(--gap-head);margin-bottom:var(--gap-content)}265 .page-head .btn-new{flex:none}266 267 /* Code-gitea (m6, f0rge #33 + #34): file TABLE, language bar, clone details. */268 .file-table th:nth-child(3),.file-table td:nth-child(3){white-space:nowrap}269 .file-table td.title{white-space:normal;overflow-wrap:anywhere;min-width:12rem}270 .langs{margin:1rem 0}271 .lang-bar{display:flex;height:.5rem;overflow:hidden;background:var(--bg-th);border:1px solid var(--border)}272 .lang-bar span{display:block;height:100%}273 .lang-legend{list-style:none;margin:.5rem 0;padding:0;display:flex;flex-wrap:wrap;gap:.25rem 1rem}274 .lang-legend li{display:inline-flex;align-items:center;gap:.35rem}275 .lang-dot{display:inline-block;width:.75rem;height:.75rem;flex:none}276 details.clonebox{margin:1rem 0;padding:.25rem 1rem 1rem;background:var(--bg-alt);border:1px solid var(--border)}277 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}278 .cb-seg{white-space:nowrap}279 .cb-seg+.cb-seg::before{content:"·";margin-right:.5rem;color:var(--fg-dim)}280 details.clonebox>summary:focus-visible{outline:2px solid var(--blue);outline-offset:2px}281 /* Clone gap (m6/code-bits, f0rge #44): no blank line under summary when282    collapsed — collapsed padding stays tight; open gap lives on the283    wrapper's first child so margins never collapse through summary. */284 details.clonebox:not([open]){padding-bottom:.25rem}285 .clonebox .clone-body{margin:0}286 .clonebox .clone-body>:first-child{margin-top:.75rem}287 .clone-hint,.clonebox summary .muted{font-weight:400}288 /* Code page vertical rhythm (f0rge #122/#123): one scale instead of289    browser heading margins. 32px between major blocks, 12px heading ->290    content, 8px language bar -> legend. Scoped so markdown body flow is291    unchanged. */292 .repo-head{margin-top:var(--s6);margin-bottom:var(--s6);gap:var(--s3)}293 .repo-head h1{margin:0}294 .repo-head .clonebox{margin:0}295 .code-files>h2,.code-readme>h2{margin:0 0 var(--s3)}296 .code-files>.table-scroll{margin:0}297 .langs{margin:var(--s6) 0 0}298 .langs>h2{margin:0 0 var(--s3)}299 .lang-bar{margin:0}300 .lang-legend{margin:var(--s2) 0 0}301 .code-readme .markdown>:first-child{margin-top:0}302 /* CI verdict badges (m6/code-bits, f0rge #43): GitHub-style green/red on303    the code repo-head; running/cancelled keep muted tones. */304 .badge{display:inline-block;padding:.1em .5em;border:1px solid var(--border);font-weight:700;font-size:.85rem}305 .badge.pass{color:var(--green);border-color:var(--green)}306 .badge.fail{color:var(--red);border-color:var(--red)}307 .badge.running{color:var(--yellow);border-color:var(--yellow)}308 .badge.cancelled{color:var(--muted);border-color:var(--muted)}309 /* Stacked cards on narrow (m6/no-scroll, f0rge #39): Gitea-style reflow.310    Desktop (>=768px) keeps .table-scroll horizontal scroll untouched above.311    Narrow: no scroll (overflow visible), thead clipped for SR only, each312    tr becomes a bordered card, each td a labeled flex row via data-label.313    Title cells lead bold without a repeated label; nothing is deleted.314    File table exempt (m6/cards2, f0rge #46): dense reference data stays a315    real table at every width — .file-scroll keeps horizontal scroll and316    table layout on narrow while every other list table becomes cards. */317 @media (max-width:767px){318   .table-scroll:not(.file-scroll){overflow-x:visible}319   .table-scroll:not(.file-scroll) table{width:100%;min-width:0}320   .table-scroll:not(.file-scroll) thead{position:absolute;max-width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}321   .table-scroll:not(.file-scroll) tbody,.table-scroll:not(.file-scroll) tr{display:block;width:auto}322   .table-scroll:not(.file-scroll) tr{border:1px solid var(--border);background:var(--bg-alt);margin:0 0 .75rem;padding:.25rem 0}323   .table-scroll:not(.file-scroll) th,.table-scroll:not(.file-scroll) td{white-space:normal}324   .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}325   .table-scroll:not(.file-scroll) td:last-child{border-bottom:none}326   .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}327   .table-scroll:not(.file-scroll) td.title::before{display:none}328   .table-scroll:not(.file-scroll) td.title{font-weight:700;font-size:1.02rem;min-width:0}329   .table-scroll:not(.file-scroll) td.num,.table-scroll:not(.file-scroll) td.sha{width:auto}330   .table-scroll:not(.file-scroll) td code,.table-scroll:not(.file-scroll) td a{overflow-wrap:anywhere;word-break:break-all;min-width:0}331   .table-scroll:not(.file-scroll) tbody tr:hover td{background:none}332   .table-scroll:not(.file-scroll) td.trunc,.trunc{white-space:normal;max-width:none;overflow:visible;text-overflow:clip}333   .file-scroll{overflow-x:auto}334   .file-scroll table{width:max-content;min-width:100%}335 }336 /* Meta pass (f0rge #72): pills, chips, monograms, relative times. */337 .meta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2);margin:0 0 var(--s4)}338 .pill{display:inline-flex;align-items:center;padding:.1em .6em;border:1px solid currentColor;font-weight:700;font-size:var(--fs-sm)}339 .pill.state-open{color:var(--state-open)}340 .pill.state-merged{color:var(--state-merged)}341 .pill.state-closed{color:var(--state-closed)}342 .pill.state-other{color:var(--fg-dim)}343 .chip{display:inline-flex;padding:.1em .5em;border:1px solid var(--border);background:var(--surface);color:var(--fg-dim);font-size:var(--fs-sm)}344 .chip.milestone{border-style:dashed}345 .meta-when{color:var(--fg-dim);font-size:var(--fs-sm)}346 .meta-more{margin:0 0 var(--s4);font-size:var(--fs-sm);color:var(--fg-dim)}347 .meta-more summary{cursor:pointer;color:var(--blue)}348 .meta-more dl{display:grid;grid-template-columns:max-content 1fr;gap:var(--s1) var(--s3);margin:var(--s2) 0 0}349 .meta-more dt{font-weight:600}350 .meta-more dd{margin:0;overflow-wrap:anywhere}351 .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)}352 .mono.m0{color:var(--blue)}353 .mono.m1{color:var(--green)}354 .mono.m2{color:var(--yellow)}355 .mono.m3{color:var(--red)}356 .mono.m4{color:var(--cyan)}357 .mono.m5{color:var(--tok-kw)}358 .comment-head{display:flex;align-items:center;color:var(--fg-dim);font-size:var(--fs-sm);margin:0 0 var(--s2)}359 .comment-head .who{color:var(--fg);font-weight:600;margin-right:.35em}360 time{font-variant-numeric:tabular-nums}361 362 /* Diff cards (f0rge #74): one card per file, dual line numbers. */363 .difffile{border:1px solid var(--border);background:var(--surface);margin:var(--s3) 0}364 .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)}365 .difffile>summary::marker{color:var(--fg-dim)}366 .df-path{color:var(--fg);background:none;padding:0;overflow-wrap:anywhere}367 .df-count{font-size:var(--fs-sm);font-variant-numeric:tabular-nums;margin-left:auto}368 .df-add{color:var(--green)}369 .df-del{color:var(--red)}370 .df-bar{display:inline-block;width:6rem;height:.5rem;background:var(--diff-del-bg);border:1px solid var(--border)}371 .df-bar-add{display:block;height:100%;background:var(--green)}372 .difffile .pre-scroll{margin:0}373 pre.diff{margin:0;border:0;background:var(--surface)}374 pre.diff>span{display:block}375 .df-line{display:block}376 .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}377 .dln+.dln{border-right:1px solid var(--border);margin-right:.5em}378 .diff-add-row{background:var(--diff-add-bg)}379 .diff-del-row{background:var(--diff-del-bg)}380 .diff-file{color:var(--diff-file);font-weight:600}381 .df-meta{color:var(--fg-dim)}382 383 /* Tablet nav (f0rge #91): 768–1099px scrolls off the last tab with no384    affordance. Give the nav its own wrapped row until the full one-row385    header fits at 1100px; separators would otherwise begin a line. */386 @media (min-width:768px) and (max-width:1099px){387   .site-header .wrap.header-bar{flex-wrap:wrap}388   .site-header .sep,.site-header .nav-sep{display:none}389   .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)}390   .nav-scroll-row{flex-wrap:wrap;width:auto;min-width:0;white-space:normal;column-gap:.9rem;row-gap:.1rem}391 }392 /* Branch lanes (f0rge #92): never break inside a branch name; wrap only393    between head, arrow and base (a very long token scrolls its cell).394    Mobile card cells inherit word-break:break-all, so reset it here. */395 .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}396 .lanes .lane{white-space:nowrap}397 .lanes .lane-arrow{color:var(--muted)}398 /* Responsive fixes (f0rge #75): every nav destination visible at 390px,399    file table keeps Name + Age, meta chips never overflow. */400 @media (max-width:767px){401   .site-header .wrap.header-bar{flex-wrap:wrap}402   .site-header .sep,.site-header .nav-sep{display:none}403   .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)}404   .nav-scroll-row{flex-wrap:wrap;width:auto;min-width:0;white-space:normal;column-gap:.9rem;row-gap:.1rem}405   /* Dense file table: drop "Last commit" below 768px instead of wrapping406      commit subjects into four lines or clipping the age column. */407   .file-table th:nth-child(2),.file-table td:nth-child(2){display:none}408   .file-table td.title{white-space:nowrap}409   .file-scroll{overflow-x:auto}410   .meta .chip,.meta .pill{max-width:100%;overflow-wrap:anywhere}411   .clonebox>summary{font-weight:700}412 }