/* palette: guts.nvim (github.com/vossenwout/guts.nvim) */
:root { --bg:#101113; --bg2:#161719; --fg:#9f9e99; --sub:#7a837c; --line:#554a62; --hl:#e1ffe5;
  --ok:#a7d8b0; --bad:#ac7f7b; --wait:#997e95; --link:#8288a0; }
* { box-sizing: border-box; }
html { background: var(--bg); }
body { margin:0; background:var(--bg); color:var(--fg);
  font: 16px/1.4 "Perfect DOS VGA 437", "Px437 IBM VGA 8x16", ui-monospace, "Cascadia Mono", Menlo, Consolas, monospace;
  font-variant-ligatures: none; }
main { max-width: 1000px; margin: 0 auto; padding: 16px; }
.sr { position:absolute; left:-9999px; }
.banner { display:block; width:100%; max-width:660px; height:auto; margin: 0 auto 16px; }
.top { display:grid; grid-template-columns: minmax(0, 660px) minmax(0, 1fr); gap: 0 16px; align-items: stretch; justify-content: center; }
.top-main { min-width: 0; }
.top .banner { margin-left: 0; margin-right: 0; }
.top .nfo { margin: 0; }
.top-main { margin-bottom: 8px; }
.quick { border: 3px double var(--line); background: var(--bg2); padding: 8px 12px; min-width: 0; }
.quick .qh { margin: 0 0 6px; }
.quick ul { list-style: none; margin: 0; padding: 0; }
.quick li::before { content: "> "; color: var(--line); }
.quick a:focus-visible { outline: 2px solid var(--link); outline-offset: 2px; }
a { color: var(--link); }
a:hover { color: var(--hl); }
.nfo { display:grid; grid-template-columns: max-content 1fr; gap: 2px 16px; max-width: 660px; padding: 8px 12px; margin: 0 auto 8px;
  border: 3px double var(--line); background: var(--bg2); }
.nfo .k { color: var(--sub); }
.nfo .k::after { content: " ........"; color: var(--line); }
.nfo .btn { display:inline-block; padding:0 8px; border:1px solid var(--line); color:var(--fg); text-decoration:none; }
.nfo .btn:hover { color:var(--bg); background:var(--fg); border-color:var(--fg); }
.nfo .btn:focus-visible { outline:2px solid var(--link); outline-offset:2px; }
h2 { display:flex; align-items:center; gap:10px; font-size:16px; margin:28px 0 8px; color:var(--hl); font-weight:normal; letter-spacing:.14em; }
h2 small { color: var(--sub); letter-spacing: 0; font-size: 14px; }
h2 i { width: 36px; height: 14px; flex: none;
  background: linear-gradient(90deg, var(--fg) 0 25%, #787487 25% 50%, var(--line) 50% 75%, #2b2733 75%); }
.bar { margin: 0 0 8px; color: var(--sub); }
.bar button { font: inherit; color: var(--fg); background: none; border: 1px solid var(--line); padding: 2px 8px; margin: 0 4px 4px 0; cursor: pointer; }
.bar button.on { color: var(--bg); background: var(--fg); border-color: var(--fg); }
.bar button:focus-visible, .bar input:focus-visible { outline: 2px solid var(--link); outline-offset: 2px; }
.bar label { margin-left: 8px; }
.pager { margin: 8px 0 0; }
.pager[hidden] { display: none; }
.bar button:disabled { color: var(--line); border-color: var(--line); cursor: default; }
.tablewrap { border: 3px double var(--line); overflow-x: auto; background: var(--bg2); }
.tablewrap:focus-visible { outline: 2px solid var(--link); outline-offset: 2px; }
table { border-collapse: collapse; width: 100%; min-width: 680px; }
th, td { text-align: left; padding: 4px 10px; vertical-align: top; }
th { color: var(--hl); font-weight: normal; border-bottom: 1px solid var(--line); white-space: nowrap; }
tbody tr:nth-child(even) { background: var(--bg); }
td.n, th.n { text-align: right; }
td .d { display: block; color: var(--sub); font-size: 14px; }
td .fork { color: var(--sub); }
.ok { color: var(--ok); } .bad { color: var(--bad); } .wait { color: var(--wait); } .none, .closed { color: var(--sub); } .merged { color: var(--ok); } .open { color: var(--wait); }
.events { list-style: none; margin: 0; padding: 8px 12px; border: 3px double var(--line); background: var(--bg2); }
.events li { padding: 2px 0; }
.events time { color: var(--sub); margin-right: 8px; }
footer { margin-top: 32px; color: var(--sub); font-size: 14px; }
footer pre { margin: 0 0 6px; white-space: pre-wrap; color: var(--fg); }
#stamp::after { content: "_"; color: var(--hl); }
@media (prefers-reduced-motion: no-preference) { #stamp::after { animation: blink 1.1s steps(1) infinite; } }
@keyframes blink { 50% { opacity: 0; } }
@media (max-width: 980px) { .top { grid-template-columns: minmax(0, 1fr); } .top .banner, .top .nfo { margin-left: auto; margin-right: auto; } .quick { max-width: 660px; width: 100%; margin: 0 auto 8px; } }
@keyframes drop {
  0% { transform: scale(1,1); animation-timing-function: cubic-bezier(.2,.6,.4,1); }
  14% { transform: scale(1.015,.94); animation-timing-function: ease-in-out; }
  30% { transform: scale(.99,1.035); animation-timing-function: ease-in-out; }
  46% { transform: scale(1.008,.972); animation-timing-function: ease-in-out; }
  60% { transform: scale(.996,1.014); animation-timing-function: ease-in-out; }
  74% { transform: scale(1.003,.99); animation-timing-function: ease-in-out; }
  100% { transform: scale(1,1); }
}
@media (prefers-reduced-motion: no-preference) { main.bounce { animation: drop .7s both; will-change: transform; } }
@media (max-width: 520px) { body { font-size: 14px; } main { padding: 12px; } .nfo { gap: 2px 10px; } .nfo .k::after { content: " .."; } }
#totop { position: fixed; right: 16px; bottom: 16px; font: inherit; color: var(--fg); background: var(--bg2); border: 3px double var(--line); padding: 2px 10px; cursor: pointer; }
#wreck { position: fixed; left: 16px; bottom: 16px; z-index: 10; font: inherit; color: var(--fg); background: var(--bg2); border: 3px double var(--line); padding: 2px 10px; cursor: pointer; }
#wreck { max-width: calc(100vw - 140px); text-align: left; overflow-wrap: anywhere; }
#wreck:hover { color: var(--bg); background: var(--fg); border-color: var(--fg); }
#wreck:focus-visible { outline: 2px solid var(--link); outline-offset: 2px; }
#wreck[aria-disabled="true"] { color: var(--line); cursor: default; }
#totop { z-index: 10; }
.banner { user-select: none; -webkit-user-select: none; -webkit-tap-highlight-color: transparent; }
.ad { position: fixed; z-index: 8; background: #c0c0c0; border: 2px solid; border-color: #fff #404040 #404040 #fff; padding: 2px;
  font: 13px/1.25 Arial, Helvetica, sans-serif; color: #000; cursor: pointer; box-shadow: 3px 3px 0 rgba(0,0,0,.5);
  transition: opacity .5s, transform .5s; transform-origin: center; }
.ad-title { display: flex; justify-content: space-between; align-items: center; gap: 6px; padding: 2px 3px; color: #fff; font-weight: bold; font-size: 12px;
  background: linear-gradient(90deg, #000080, #1084d0); }
.ad-ttext { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ad-btns { display: flex; flex: none; }
.ad-btns span { width: 16px; height: 14px; margin-left: 2px; background: #c0c0c0; color: #000; border: 1px solid; border-color: #fff #404040 #404040 #fff; text-align: center; line-height: 12px; font-size: 11px; }
.ad-body { background: #fff; color: #000; padding: 8px; text-align: center; border: 2px solid; border-color: #808080 #fff #fff #808080; }
.ad-body > div { margin: 3px 0; }
.ad-pre { font-weight: bold; letter-spacing: .12em; font-size: 12px; }
.ad-big { font-size: 18px; font-weight: bold; }
.ad-h { font-size: 15px; font-weight: bold; color: #1a3a8a; }
.ad-small { font-size: 12px; }
.ad-script { font: italic bold 17px Georgia, serif; color: #fff; }
.ad-cta { display: inline-block; margin-top: 4px; padding: 3px 10px; background: #2e8b2e; color: #fff; font-weight: bold; border: 2px solid; border-color: #9be29b #145214 #145214 #9be29b; border-radius: 3px; }
.ad-redbar { background: #d01818; color: #fff; font-weight: bold; padding: 2px 4px; }
.ad-blue { font-size: 17px; font-weight: bold; color: #1a3a8a; }
.ad-price { font-size: 30px; font-weight: bold; color: #d01818; }
.ad-green { background: #2e8b2e; color: #fff; font-weight: bold; padding: 4px; }
.ad-li { text-align: left; color: #1a3acc; text-decoration: underline; font-size: 12px; }
.ad-star { background: #d01818; color: #fff; font-weight: bold; font-size: 16px; padding: 14px 8px; border-radius: 50% / 40%; }
.ad-hotred { color: #d01818; }
.ad-tag { font-size: 10px; color: #666; text-align: right; }
.ad-dial .ad-body { background: linear-gradient(135deg, #fff 0 20%, #7a3fa0 20%); color: #fff; }
.ad-dial .ad-cta { background: #fff; color: #7a3fa0; border-color: #ddd #888 #888 #ddd; }
.ad-yougo .ad-body { background: linear-gradient(#3a7bc8, #1c4e96); color: #fff; }
.ad-news .ad-body { background: #ffeeaa; }
.ad-win .ad-body, .ad-iq .ad-body { background: #f4f8ff; }
.ad-nap .ad-body { background: #e9f1ff; }
.ad-visit .ad-body { background: #fffbe0; }
.ad.bye { opacity: 0; transform: scale(0); }
@media (prefers-reduced-motion: reduce) { .ad.bye { transform: none; } }
html.wrecked { overflow-x: hidden; }
html.wrecked .tablewrap { overflow: visible; }
@media (prefers-reduced-motion: reduce) { #wreck { display: none; } }
#totop[hidden] { display: none; }
#totop:hover { color: var(--bg); background: var(--fg); border-color: var(--fg); }
#totop:focus-visible { outline: 2px solid var(--link); outline-offset: 2px; }
[tabindex="-1"]:focus { outline: none; }
