:root{--bg:#fff;--fg:#111;--muted:#666;--accent:#a16207;--accent-2:#15803d;--sel:#fff6e0;--lane:#9333ea}*{box-sizing:border-box;margin:0}body{background:var(--bg);color:var(--fg);font:16px/1.6 ui-sans-serif,system-ui,-apple-system,sans-serif}main{max-width:36rem;margin:0 auto;padding:20vh 1.5rem}h1{margin-bottom:1rem;font-size:1.25rem;font-weight:500}nav{gap:1.25rem;display:flex}a{color:var(--fg);text-underline-offset:3px;-webkit-text-decoration-color:var(--muted);text-decoration-color:var(--muted)}a:hover{-webkit-text-decoration-color:var(--fg);text-decoration-color:var(--fg)}.log{margin-top:3.5rem;font:.875rem/1.6 ui-monospace,SFMono-Regular,Menlo,monospace}.log h2{font:inherit;color:var(--muted);margin-bottom:1rem}.prompt{-webkit-user-select:none;user-select:none}.log ol{--l0:.25rem;--l1:1.5rem;--y:.8em;padding:0;list-style:none}.log ol>li{padding:0 0 .75rem 2.5rem;position:relative}.log ol>li.branch{padding-bottom:1.25rem}.graph{pointer-events:none;width:2.25rem;animation:draw .4s ease-out calc(var(--i) * .14s) backwards;position:absolute;inset:0 auto 0 0}:where(.graph>span){border:0 solid var(--muted);position:absolute}.main{left:var(--l0);border-left-width:1px;top:0;bottom:0}.log ol>li:first-child .main{top:var(--y)}.log ol>li:last-child:not(.branch) .main{height:0;bottom:auto}.merge{left:var(--l0);width:calc(var(--l1) - var(--l0) + 1px);height:var(--y);border-top-width:1px;border-right-width:1px;border-top-right-radius:100%;top:0}.lane{left:var(--l1);top:var(--y);border-left-width:1px;bottom:1.1rem}.fork{left:var(--l0);width:calc(var(--l1) - var(--l0) + 1px);border-bottom-width:1px;border-right-width:1px;border-bottom-right-radius:100%;height:.5rem;bottom:.6rem}.node{--x:var(--l0);left:calc(var(--x) - .25rem + .5px);top:calc(var(--y) - .25rem);background:var(--bg);border:1px solid var(--fg);border-radius:50%;width:.5rem;height:.5rem}.branch .node{--x:var(--l1);border-color:var(--lane)}.merge,.lane,.fork{border-color:var(--lane)}.log ol>li:first-child .node{background:var(--fg)}.log ol>li>details{animation:fade .4s ease-out calc(var(--i) * .14s + .1s) backwards}@keyframes draw{0%{clip-path:inset(0 0 100%)}to{clip-path:inset(0)}}@keyframes fade{0%{opacity:0;transform:translate(-.25rem)}}@media (prefers-reduced-motion:reduce){.graph,.log ol>li>details{animation:none}}.log summary{cursor:pointer;border-radius:3px;flex-wrap:wrap;gap:0 .6rem;margin-left:-.5rem;padding-left:.5rem;list-style:none;display:flex}.log summary::-webkit-details-marker{display:none}.log summary:hover,.log summary:focus-visible{background:var(--sel);outline:none}.hash{color:var(--accent)}.ref{color:var(--accent-2)}.at,.date{color:var(--muted)}.date{flex-basis:100%}.log summary:hover .msg,.log summary:focus-visible .msg{text-underline-offset:3px;text-decoration:underline}.show{color:var(--muted);padding:.5rem 0 .25rem}.show ul{color:var(--accent-2);padding:.5rem 0 0;list-style:none}.show ul li:before{content:"+ ";-webkit-user-select:none;user-select:none}
