:root {
  /*** gray ***/
  --uchu-gray-1-raw: 95.57% 0.003 286.35;
  --uchu-gray-1: oklch(var(--uchu-gray-1-raw));
  --uchu-gray-2-raw: 92.04% 0.002 197.12;
  --uchu-gray-2: oklch(var(--uchu-gray-2-raw));
  --uchu-gray-3-raw: 88.28% 0.003 286.34;
  --uchu-gray-3: oklch(var(--uchu-gray-3-raw));
  --uchu-gray-4-raw: 84.68% 0.002 197.12;
  --uchu-gray-4: oklch(var(--uchu-gray-4-raw));
  --uchu-gray-5-raw: 80.73% 0.002 247.84;
  --uchu-gray-5: oklch(var(--uchu-gray-5-raw));
  --uchu-gray-6-raw: 75.03% 0.002 247.85;
  --uchu-gray-6: oklch(var(--uchu-gray-6-raw));
  --uchu-gray-7-raw: 69.01% 0.003 286.32;
  --uchu-gray-7: oklch(var(--uchu-gray-7-raw));
  --uchu-gray-8-raw: 63.12% 0.004 219.55;
  --uchu-gray-8: oklch(var(--uchu-gray-8-raw));
  --uchu-gray-9-raw: 56.82% 0.004 247.89;
  --uchu-gray-9: oklch(var(--uchu-gray-9-raw));

  /*** red ***/
  --uchu-red-1-raw: 88.98% 0.052 3.28;
  --uchu-red-1: oklch(var(--uchu-red-1-raw));
  --uchu-red-2-raw: 78.78% 0.109 4.54;
  --uchu-red-2: oklch(var(--uchu-red-2-raw));
  --uchu-red-3-raw: 69.86% 0.162 7.82;
  --uchu-red-3: oklch(var(--uchu-red-3-raw));
  --uchu-red-4-raw: 62.73% 0.209 12.37;
  --uchu-red-4: oklch(var(--uchu-red-4-raw));
  --uchu-red-5-raw: 58.63% 0.231 19.6;
  --uchu-red-5: oklch(var(--uchu-red-5-raw));
  --uchu-red-6-raw: 54.41% 0.214 19.06;
  --uchu-red-6: oklch(var(--uchu-red-6-raw));
  --uchu-red-7-raw: 49.95% 0.195 18.34;
  --uchu-red-7: oklch(var(--uchu-red-7-raw));
  --uchu-red-8-raw: 45.8% 0.177 17.7;
  --uchu-red-8: oklch(var(--uchu-red-8-raw));
  --uchu-red-9-raw: 41.17% 0.157 16.58;
  --uchu-red-9: oklch(var(--uchu-red-9-raw));

  /*** pink ***/
  --uchu-pink-1-raw: 95.8% 0.023 354.27;
  --uchu-pink-1: oklch(var(--uchu-pink-1-raw));
  --uchu-pink-2-raw: 92.14% 0.046 352.31;
  --uchu-pink-2: oklch(var(--uchu-pink-2-raw));
  --uchu-pink-3-raw: 88.9% 0.066 354.39;
  --uchu-pink-3: oklch(var(--uchu-pink-3-raw));
  --uchu-pink-4-raw: 85.43% 0.09 354.1;
  --uchu-pink-4: oklch(var(--uchu-pink-4-raw));
  --uchu-pink-5-raw: 82.23% 0.112 355.33;
  --uchu-pink-5: oklch(var(--uchu-pink-5-raw));
  --uchu-pink-6-raw: 76.37% 0.101 355.37;
  --uchu-pink-6: oklch(var(--uchu-pink-6-raw));
  --uchu-pink-7-raw: 70.23% 0.092 354.96;
  --uchu-pink-7: oklch(var(--uchu-pink-7-raw));
  --uchu-pink-8-raw: 64.11% 0.084 353.91;
  --uchu-pink-8: oklch(var(--uchu-pink-8-raw));
  --uchu-pink-9-raw: 57.68% 0.074 353.14;
  --uchu-pink-9: oklch(var(--uchu-pink-9-raw));

  /*** purple ***/
  --uchu-purple-1-raw: 89.1% 0.046 305.24;
  --uchu-purple-1: oklch(var(--uchu-purple-1-raw));
  --uchu-purple-2-raw: 78.68% 0.091 305;
  --uchu-purple-2: oklch(var(--uchu-purple-2-raw));
  --uchu-purple-3-raw: 68.5% 0.136 303.78;
  --uchu-purple-3: oklch(var(--uchu-purple-3-raw));
  --uchu-purple-4-raw: 58.47% 0.181 302.06;
  --uchu-purple-4: oklch(var(--uchu-purple-4-raw));
  --uchu-purple-5-raw: 49.39% 0.215 298.31;
  --uchu-purple-5: oklch(var(--uchu-purple-5-raw));
  --uchu-purple-6-raw: 46.11% 0.198 298.4;
  --uchu-purple-6: oklch(var(--uchu-purple-6-raw));
  --uchu-purple-7-raw: 42.77% 0.181 298.49;
  --uchu-purple-7: oklch(var(--uchu-purple-7-raw));
  --uchu-purple-8-raw: 39.46% 0.164 298.29;
  --uchu-purple-8: oklch(var(--uchu-purple-8-raw));
  --uchu-purple-9-raw: 36.01% 0.145 298.35;
  --uchu-purple-9: oklch(var(--uchu-purple-9-raw));

  /*** blue ***/
  --uchu-blue-1-raw: 89.66% 0.046 260.67;
  --uchu-blue-1: oklch(var(--uchu-blue-1-raw));
  --uchu-blue-2-raw: 80.17% 0.091 258.88;
  --uchu-blue-2: oklch(var(--uchu-blue-2-raw));
  --uchu-blue-3-raw: 70.94% 0.136 258.06;
  --uchu-blue-3: oklch(var(--uchu-blue-3-raw));
  --uchu-blue-4-raw: 62.39% 0.181 258.33;
  --uchu-blue-4: oklch(var(--uchu-blue-4-raw));
  --uchu-blue-5-raw: 54.87% 0.222 260.33;
  --uchu-blue-5: oklch(var(--uchu-blue-5-raw));
  --uchu-blue-6-raw: 51.15% 0.204 260.17;
  --uchu-blue-6: oklch(var(--uchu-blue-6-raw));
  --uchu-blue-7-raw: 47.36% 0.185 259.89;
  --uchu-blue-7: oklch(var(--uchu-blue-7-raw));
  --uchu-blue-8-raw: 43.48% 0.17 260.2;
  --uchu-blue-8: oklch(var(--uchu-blue-8-raw));
  --uchu-blue-9-raw: 39.53% 0.15 259.87;
  --uchu-blue-9: oklch(var(--uchu-blue-9-raw));

  /*** green ***/
  --uchu-green-1-raw: 93.96% 0.05 148.74;
  --uchu-green-1: oklch(var(--uchu-green-1-raw));
  --uchu-green-2-raw: 88.77% 0.096 147.71;
  --uchu-green-2: oklch(var(--uchu-green-2-raw));
  --uchu-green-3-raw: 83.74% 0.139 146.57;
  --uchu-green-3: oklch(var(--uchu-green-3-raw));
  --uchu-green-4-raw: 79.33% 0.179 145.62;
  --uchu-green-4: oklch(var(--uchu-green-4-raw));
  --uchu-green-5-raw: 75.23% 0.209 144.64;
  --uchu-green-5: oklch(var(--uchu-green-5-raw));
  --uchu-green-6-raw: 70.03% 0.194 144.71;
  --uchu-green-6: oklch(var(--uchu-green-6-raw));
  --uchu-green-7-raw: 64.24% 0.175 144.92;
  --uchu-green-7: oklch(var(--uchu-green-7-raw));
  --uchu-green-8-raw: 58.83% 0.158 145.05;
  --uchu-green-8: oklch(var(--uchu-green-8-raw));
  --uchu-green-9-raw: 52.77% 0.138 145.41;
  --uchu-green-9: oklch(var(--uchu-green-9-raw));

  /*** yellow ***/
  --uchu-yellow-1-raw: 97.05% 0.039 91.2;
  --uchu-yellow-1: oklch(var(--uchu-yellow-1-raw));
  --uchu-yellow-2-raw: 95% 0.07 92.39;
  --uchu-yellow-2: oklch(var(--uchu-yellow-2-raw));
  --uchu-yellow-3-raw: 92.76% 0.098 92.58;
  --uchu-yellow-3: oklch(var(--uchu-yellow-3-raw));
  --uchu-yellow-4-raw: 90.92% 0.125 92.56;
  --uchu-yellow-4: oklch(var(--uchu-yellow-4-raw));
  --uchu-yellow-5-raw: 89% 0.146 91.5;
  --uchu-yellow-5: oklch(var(--uchu-yellow-5-raw));
  --uchu-yellow-6-raw: 82.39% 0.133 91.5;
  --uchu-yellow-6: oklch(var(--uchu-yellow-6-raw));
  --uchu-yellow-7-raw: 75.84% 0.122 92.21;
  --uchu-yellow-7: oklch(var(--uchu-yellow-7-raw));
  --uchu-yellow-8-raw: 69.14% 0.109 91.04;
  --uchu-yellow-8: oklch(var(--uchu-yellow-8-raw));
  --uchu-yellow-9-raw: 62.29% 0.097 91.9;
  --uchu-yellow-9: oklch(var(--uchu-yellow-9-raw));

  /*** orange ***/
  --uchu-orange-1-raw: 93.83% 0.037 56.93;
  --uchu-orange-1: oklch(var(--uchu-orange-1-raw));
  --uchu-orange-2-raw: 88.37% 0.07258208750520016 55.80328658240742;
  --uchu-orange-2: oklch(var(--uchu-orange-2-raw));
  --uchu-orange-3-raw: 83.56% 0.10753627570574478 56.492594564236946;
  --uchu-orange-3: oklch(var(--uchu-orange-3-raw));
  --uchu-orange-4-raw: 78.75% 0.14163582809066333 54.32911089172009;
  --uchu-orange-4: oklch(var(--uchu-orange-4-raw));
  --uchu-orange-5-raw: 74.61% 0.171 51.56;
  --uchu-orange-5: oklch(var(--uchu-orange-5-raw));
  --uchu-orange-6-raw: 69.33% 0.157 52.18;
  --uchu-orange-6: oklch(var(--uchu-orange-6-raw));
  --uchu-orange-7-raw: 63.8% 0.142 52.1;
  --uchu-orange-7: oklch(var(--uchu-orange-7-raw));
  --uchu-orange-8-raw: 58.28% 0.128 52.2;
  --uchu-orange-8: oklch(var(--uchu-orange-8-raw));
  --uchu-orange-9-raw: 52.49% 0.113 51.98;
  --uchu-orange-9: oklch(var(--uchu-orange-9-raw));

  /*** general ***/
  --uchu-yin-1-raw: 91.87% 0.003 264.54;
  --uchu-yin-1: oklch(var(--uchu-yin-1-raw));
  --uchu-yin-2-raw: 84.61% 0.004 286.31;
  --uchu-yin-2: oklch(var(--uchu-yin-2-raw));
  --uchu-yin-3-raw: 76.89% 0.004 247.87;
  --uchu-yin-3: oklch(var(--uchu-yin-3-raw));
  --uchu-yin-4-raw: 69.17% 0.004 247.88;
  --uchu-yin-4: oklch(var(--uchu-yin-4-raw));
  --uchu-yin-5-raw: 61.01% 0.005 271.34;
  --uchu-yin-5: oklch(var(--uchu-yin-5-raw));
  --uchu-yin-6-raw: 52.79% 0.005 271.32;
  --uchu-yin-6: oklch(var(--uchu-yin-6-raw));
  --uchu-yin-7-raw: 43.87% 0.005 271.3;
  --uchu-yin-7: oklch(var(--uchu-yin-7-raw));
  --uchu-yin-8-raw: 35.02% 0.005 236.66;
  --uchu-yin-8: oklch(var(--uchu-yin-8-raw));
  --uchu-yin-9-raw: 25.11% 0.006 258.36;
  --uchu-yin-9: oklch(var(--uchu-yin-9-raw));
  --uchu-yin-raw: 14.38% 0.007 256.88;
  --uchu-yin: oklch(var(--uchu-yin-raw));
  --uchu-yang-raw: 99.4% 0 0;
  --uchu-yang: oklch(var(--uchu-yang-raw));

  /*** the rest ***/
  --monospace: "Berkley Mono", monospace;
  --width-with-panel: calc(100% - calc(200px + 1rem));
}

* {
  margin: 0; padding: 0;

  appearance: none;
  box-sizing: inherit;
}

html {
  box-sizing: border-box;
  font-family: sans-serif;
  font-size: 10px;
}

body {
  background-color: var(--uchu-yang);
  font-family: -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif;
  font-size: 1.5rem;
}

::selection {
  background-color: oklch(var(--uchu-yellow-1-raw) / 50%);
  color: var(--uchu-yellow-8);
}

div#cgit {
  border-bottom: 3px solid var(--uchu-gray-2);
  color: var(--uchu-yin-8);
  margin-bottom: 2rem;
  margin-left: auto;
  margin-right: auto;
  max-width: 1000px;
  padding-top: 3rem;

  a {
    color: var(--uchu-blue-5);

    &:not(:hover) {
      text-decoration: underline;
    }

    &:hover {
      text-decoration: none;
    }

    &.branch-deco,
    &.deco,
    &.remote-deco,
    &.tag-deco,
    &.tag-annotated-deco {
      margin: 0 0.5rem; padding: 0 0.25rem;

      border: 1px solid;
      color: #000;
    }

    &.branch-deco {
      background-color: var(--uchu-green-4);
      border-color: var(--uchu-green-7);
      text-decoration: none;
    }

    &.button {
      padding: 0 0.5rem;
    }

    &.deco {
      background-color: var(--uchu-orange-4);
      border-color: var(--uchu-orange-7);
      text-decoration: none;
    }

    &.remote-deco {
      background-color: #ccccff;
      border-color: #000077;
    }

    &.tag-deco {
      background-color: #ffff88;
      border-color: #777700;
    }

    &.tag-annotated-deco {
      background-color: #ffcc88;
      border-color: #777700;
    }
  }

  div {
    &#blob {
      border: 1px solid var(--uchu-yin);
    }

    &#summary {
      margin-bottom: 1rem;
      vertical-align: top;
    }

    &.cgit-panel {
      position: absolute;
      right: 0;

      select {
        width: 100%;
      }

      table {
        background-color: oklch(var(--uchu-gray-1-raw) / 50%);
        border: 1px solid var(--uchu-gray-1);
        width: 200px;
      }

      th {
        text-align: center;
      }

      td {
        padding: 0.25rem 0.5rem;

        &.ctrl {
          padding-left: 0.5rem;
        }

        &.label {
          padding-right: 0.5rem;
        }
      }
    }

    &.commit-msg {
      font-family: var(--monospace);
      white-space: pre;
    }

    &.commit-subject {
      margin: 1.5rem 0 0.5rem 0; padding: 0;
      font-weight: bold;

      a {
        &.branch-deco,
        &.tag-deco,
        &.tag-annotated-deco,
        &.remote-deco,
        &.deco {
          margin-left: 1rem;
        }
      }
    }

    &.content {
      overflow-x: hidden;
      padding: 1rem 0 0 0;
      position: relative;
    }

    &.diffstat-header {
      font-weight: bold;
      width: var(--width-with-panel);
    }

    &.diffstat-summary {
      color: var(--uchu-yin-4);
      padding-top: 1rem;
      width: var(--width-with-panel);
    }

    &.error {
      color: var(--uchu-red-5);
      font-weight: bold;
      margin: 1rem 2rem;
    }

    &.footer {
      color: var(--uchu-gray-3);
      margin-top: 0.5rem;
      text-align: center;

      a {
        color: var(--uchu-gray-3);

        &:not(:hover) {
          text-decoration: none;
        }

        &:hover {
          text-decoration: underline;
        }
      }
    }

    &.notes {
      background-color: #ffd;
      border: 1px solid #ee9;
      float: left;
      font-family: var(--monospace);
      padding: 0.3rem 2rem 0.3rem 1rem;
      white-space: pre;
    }

    &.notes-footer {
      clear: left;
    }

    &.notes-header {
      font-weight: bold;
      padding-top: 1.5rem;
    }

    &.path {
      background-color: var(--uchu-gray-2);
      line-height: 1.33;
      padding: 0.5rem 2rem;
    }
  }

  img {
    border: none;
  }

  input#switch-btn {
    margin: 2px 0 0 0;
  }

  select {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjQgMjQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggZD0iTTcuMTc0MzIgMTAuMjVMMTIgMTYuMTg5NEwxNi44MjU4IDEwLjI1SDcuMTc0MzJaIiBmaWxsPSJibGFjayIvPgo8L3N2Zz4K);
    background-position: right center;
    background-repeat: no-repeat;
    background-size: 1.5rem;
    border: 1px solid var(--uchu-gray-3);
    border-radius: 0;
    line-height: 1.33;
    padding: 0.25rem 0.5rem;
    position: relative;

    &:focus {
      outline: 1px solid var(--uchu-pink-5);
      outline-offset: -1px;
      z-index: 1;
    }
  }

  span {
    &.age-mins {
      color: #080;
      font-weight: bold;
    }

    &.age-hours {
      color: #080;
    }

    &.age-days {
      color: #040;
    }

    &.age-weeks {
      color: #444;
    }

    &.age-months {
      color: #888;
    }

    &.age-years {
      color: #bbb;
    }

    &.deletions {
      color: #800;
    }

    &.insertions {
      color: #080;
    }
  }

  table {
    border-collapse: collapse;

    &[summary^="repository"],
    &[summary^="tree"] {
      margin-bottom: 1.5rem;

      .nohover {
        text-transform: lowercase;

        a {
          color: inherit;
          display: block;
          padding-bottom: 1rem;
          text-decoration: none;
        }
      }
    }

    &#downloads {
      border: 1px solid #777;
      border-collapse: collapse;
      float: right;
      margin-bottom: 0.5rem;
      margin-left: 0.5rem;

      th {
        background-color: var(--uchu-gray-3);
      }
    }

    &#grid {
      margin: 0;
    }

    &#header {
      margin-bottom: 1rem;
      width: 100%;

      td {
        &.form {
          text-align: right;

          form {
            bottom: -1rem;
            display: flex;
            flex-direction: row;
            justify-content: end;
            position: relative;
            white-space: nowrap;

            input {
              border: 1px solid var(--uchu-gray-3);
              border-radius: 0;
              line-height: 1.33;
              padding: 0.25rem 0.5rem;
              position: relative;

              &:focus {
                outline: 1px solid var(--uchu-pink-5);
                outline-offset: -1px;
                z-index: 1;
              }
            }

            select {
              padding: 0.25rem 2.5rem 0.25rem 0.5rem;
              right: -1px;
            }
          }
        }

        &.logo {
          vertical-align: top;
          width: 96px;
        }

        &.main {
          font-size: 250%;
          white-space: nowrap;

          a {
            color: var(--uchu-yin);
          }
        }

        &.sub {
          color: var(--uchu-yin-4);
        }
      }
    }

    &.blob td.linenumbers a,
    &.ssdiff td.lineno a {
      text-align: right;
      text-decoration: none;

      &:not(:hover) {
        color: var(--uchu-yin-4);
      }

      &:hover {
        color: var(--uchu-yin);
      }
    }

    &.bin-blob {
      border: 1px solid var(--uchu-yin);
      margin-top: 0.5rem;

      th {
        border: 1px solid #777;
        font-family: var(--monospace);
        padding: 0.5rem 1rem;
        white-space: pre;
      }

      td {
        border-left: solid 1px #777;
        font-family: var(--monospace);
        padding: 0 1rem;
        white-space: pre;
      }
    }

    &.blame {
      td {
        &.hashes,
        &.lines,
        &.linenumbers {
          padding: 0;
        }

        &.hashes,
        &.lines {
          div.alt {
            padding: 0 0.5rem 0 0.5rem;
          }
        }

        &.linenumbers div.alt {
          padding: 0 0.5rem 0 0;
        }

        &.lines {
          > div {
            position: relative;

            > pre {
              padding: 0 0 0 0.5rem;
              position: absolute;
              top: 0;
            }
          }
        }
      }

      div {
        &.alt {
          &:nth-child(even) {
            background-color: var(--uchu-gray-2);
          }

          &:nth-child(odd) {
            background-color: var(--uchu-yang);
          }
        }
      }
    }

    &.blob {
      border-top: 1px solid var(--uchu-gray-2);
      margin-top: 1rem;
      width: 100%;

      td {
        &.hashes,
        &.lines {
          margin: 0; padding: 0 0 0 0.5em;

          color: var(--uchu-yin);
          vertical-align: top;
        }

        &.linenumbers {
          border-right: 1px solid var(--uchu-gray-2);
          padding-left: 0.5rem;
          padding-right: 0.5rem;
          text-align: right;
          vertical-align: top;
        }
      }

      /* Style definition file generated by highlight 3.9, http://www.andre-simon.de/ */
      /* Highlighting theme: Kwrite Editor */
      /* adapted for cgit */
      .com,
      .slc {
        font-style: italic;
      }

      .kwa,
      .kwc {
        font-weight: bold;
      }

      .com { color: #838183; }
      .esc { color: #ff00ff; }
      .kwa { color: #000000; }
      .kwb { color: #0057ae; }
      .kwc { color: #000000; }
      .kwd { color: #010181; }
      .lin { color: #555555; }
      .num { color: #b07e00; }
      .opt { color: #000000; }
      .ppc { color: #008200; }
      .pps { color: #818100; }
      .slc { color: #838183; }
      .str { color: #bf0303; }
    }

    &.commit-info {
      margin-top: 1.5rem;
      width: var(--width-with-panel);

      th,
      td {
        font-weight: normal;
        padding: 0.1rem 1rem 0.1rem 0.1rem;
      }

      th {
        text-align: left;
        vertical-align: top;
      }
    }

    &.diff {
      font-size: 1.25rem;
      width: 100%;

      td {
        font-family: var(--monospace);
        white-space: pre;

        div {
          &:last-of-type {
            padding-bottom: 1.5rem;
          }

          &.add {
            background-color: var(--uchu-green-1);
          }

          &.del {
            background-color: var(--uchu-red-1);
            color: var(--uchu-red-3);
          }

          &.head {
            font-weight: bold;
            margin-top: 1rem;
          }

          &.hunk {
            background-color: var(--uchu-blue-1);
          }
        }
      }
    }

    &.diffstat {
      background-color: oklch(var(--uchu-gray-1-raw) / 50%);
      border: 1px solid var(--uchu-gray-1);
      width: var(--width-with-panel);

      th {
        font-weight: normal;
        padding: 0.25rem 0.5rem;
        text-align: left;
        text-decoration: underline;
      }

      td {
        border: none;
        padding: 0.25rem 0.5rem;

        &.graph,
        &.mode,
        &.right {
          font-family: var(--monospace);
        }

        &.add {
          a {
            color: var(--uchu-green-6);
          }
        }

        &.del {
          a {
            color: var(--uchu-red-6);
          }
        }

        &.graph {
          vertical-align: middle;
          width: 500px;

          table {
            border: none;
          }

          td {
            border: 0;
            height: 7pt;
            padding: 0;

            &.add {
              background-color: var(--uchu-green-6);
            }

            &.rem {
              background-color: var(--uchu-red-6);
            }
          }
        }

        &.mode {
          white-space: nowrap;
        }

        &.upd {
          a {
            color: var(--uchu-blue-5);
          }
        }

        span.modechange {
          color: var(--uchu-red-6);
          padding-left: 1rem;
        }
      }
    }

    &.hgraph {
      border: 1px solid var(--uchu-yin);
      width: 800px;

      th {
        background-color: #eee;
        border: 1px solid var(--uchu-yin);
        font-weight: bold;
        padding: 1px 0.5rem;
      }

      td {
        padding: 2px;
        vertical-align: middle;
      }

      div.bar {
        background-color: #eee;
        height: 1rem;
      }
    }

    &.list {
      border: none;
      width: 100%;

      tr {
        background-color: var(--uchu-yang);

        &.logheader {
          background-color: var(--uchu-gray-2);
        }

        &:nth-child(even),
        &.nohover-highlight:hover:nth-child(even) {
          background-color: oklch(var(--uchu-gray-1-raw) / 50%);
        }

        &:nth-child(odd),
        &.nohover-highlight:hover:nth-child(odd) {
          background-color: var(--uchu-yang);
        }

        &:hover {
          background-color: var(--uchu-gray-1);
        }

        &.nohover,
        &.nohover:hover {
          background-color: var(--uchu-yang);
        }
      }

      th {
        font-weight: bold;
        padding: 0.1rem 0.5rem 0.05rem 0.5rem;
        vertical-align: baseline;
      }

      td {
        border: none;
        padding: 0.1rem 0.5rem 0.1rem 0.5rem;

        &.commitgraph,
        &.logmsg,
        &.logsubject,
        &.reposection {
          font-family: var(--monospace);
        }

        &.commitgraph {
          white-space: pre;

          .column1 {
            color: #a00;
          }

          .column2 {
            color: #0a0;
          }

          .column3 {
            color: #aa0;
          }

          .column4 {
            color: #00a;
          }

          .column5 {
            color: #a0a;
          }

          .column6 {
            color: #0aa;
          }
        }

        &.logmsg {
          padding: 0 0.5rem;
          white-space: pre;
        }

        &.logsubject {
          font-weight: bold;
        }

        &.reposection {
          color: var(--uchu-yin-4);
          font-style: italic;
        }

        &.sublevel-repo {
          padding-left: 1.5rem;
        }

        a {
          &:not(:hover) {
            color: var(--uchu-yin);
          }

          &:hover {
            color: var(--uchu-blue-5);
          }

          &.ls-dir {
            font-weight: bold;
          }
        }
      }
    }

    &.nowrap {
      td {
        white-space: nowrap;
      }
    }

    &.ssdiff {
      width: 100%;

      span {
        &.add,
        &.del {
          font-weight: bold;
        }

        &.add {
          background: #cfc;
        }

        &.del {
          background: #fcc;
        }
      }

      td {
        border-left: 1px solid #aaa;
        border-right: 1px solid #aaa;
        font-family: var(--monospace);
        padding: 1px 4px 1px 4px;
        white-space: pre;

        &.add,
        &.add_dark,
        &.changed,
        &.changed_dark,
        &.del,
        &.del_dark {
          color: var(--uchu-yin);
          min-width: 50%;
        }

        &.add {
          background: #cfc;
        }

        &.add_dark {
          background: #aca;
        }

        &.changed {
          background: #ffc;
        }

        &.changed_dark {
          background: #cca;
        }

        &.del {
          background: #fcc;
        }

        &.del_dark {
          background: #caa;
        }

        &.foot {
          border-bottom: none;
          border-left: none;
          border-right: none;
          border-top: 1px solid #aaa;
        }

        &.head {
          border-bottom: 1px solid #aaa;
          border-top: 1px solid #aaa;

          div.head {
            font-weight: bold;
          }
        }

        &.hunk {
          background: #ccf;
          border-bottom: 1px solid #aaa;
          border-top: 1px solid #aaa;
          color: var(--uchu-yin);
        }

        &.lineno {
          background-color: var(--uchu-gray-2);
          min-width: 3rem;
          text-align: right;
          width: 3rem;
        }

        &.space {
          border: none;

          div {
            min-height: 3rem;
          }
        }
      }
    }

    &.stats {
      border: 1px solid var(--uchu-yin);
      border-collapse: collapse;

      th {
        background-color: #eee;
        border: 1px solid var(--uchu-yin);
        padding: 1px 0.5rem;
        text-align: left;
      }

      td {
        border: 1px solid var(--uchu-yin);
        padding: 1px 0.5rem;
        text-align: right;

        &.left {
          text-align: left;
        }

        &.sum {
          color: #c00;
          font-weight: bold;
        }

        &.total {
          font-weight: bold;
          text-align: left;
        }
      }
    }

    &.tabs {
      border-bottom: 3px solid var(--uchu-gray-2);
      margin-top: 1.5rem;
      width: 100%;

      tr {
        align-items: baseline;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
      }

      td {
        a {
          line-height: 1.33;
          padding: 0.75rem 1.5rem 0.5rem;
          text-decoration: none;

          &:not(.active) {
            color: var(--uchu-yin-3);
          }

          &.active {
            background-color: var(--uchu-gray-2);
            color: var(--uchu-yin-7);
          }

          &[href^="http://"]::after,
          &[href^="https://"]::after {
            background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAQAAAAnOwc2AAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfgAhcJDQY+gm2TAAAAHWlUWHRDb21tZW50AAAAAABDcmVhdGVkIHdpdGggR0lNUGQuZQcAAABbSURBVAhbY2BABs4MU4CwhYHBh2Erww4wrGFQZHjI8B8IgUIscJWyDHcggltQhI4zGDCcRwhChPggHIggP1QoAVmQkSETrGoHsiAEsACtBYN0oDAMbgU6EBcAAL2eHUt4XUU4AAAAAElFTkSuQmCC);
            content: "";
            margin: 0 0 0 5px;
            opacity: 0.5;
          }
        }

        &.form {
          text-align: right;

          form {
            bottom: 6px;
            display: flex;
            flex-direction: row;
            position: relative;
            white-space: nowrap;

            input {
              border: 1px solid var(--uchu-gray-3);
              border-radius: 0;
              line-height: 1.33;
              padding: 0.25rem 0.5rem;
              position: relative;

              &:focus {
                outline: 1px solid var(--uchu-pink-5);
                outline-offset: -1px;
                z-index: 1;
              }
            }

            select {
              right: -2px;
            }

            input[type="search"] {
              right: -1px;
            }
          }
        }
      }
    }

    &.vgraph {
      border: 1px solid var(--uchu-yin);
      border-collapse: separate;
      height: 200px;

      th {
        background-color: #eee;
        border: 1px solid var(--uchu-yang);
        font-weight: bold;
        padding: 1px 0.5rem;
      }

      td {
          padding: 0 10px;
          vertical-align: bottom;
      }

      div.bar {
        background-color: #eee;
      }
    }
  }

  td {
    &#content {
      border: none;
      padding: 1rem 2rem 1rem 1rem;
      vertical-align: top;
    }

    &#sidebar {
      input.txt {
        margin: 2px 0 0 0;
        width: 100%;
      }
    }

    &.ls-size,
    &.ls-mode {
      width: 10rem;
    }

    &.ls-size {
      text-align: right;
    }
  }

  ul.pager {
    margin: 1rem 0 0 0; padding: 0;

    list-style-type: none;
    text-align: center;

    li {
      display: inline-block;
      margin: 0.25rem 0.5rem;
    }

    a {
      color: #777;
    }

    .current {
      font-weight: bold;
    }
  }

  .left {
    text-align: left;
  }

  .oid {
    font-family: var(--monospace);
  }

  .right {
    text-align: right;
  }
}

div#cgit a.ls-blob,
div#cgit a.ls-dir,
div#cgit .ls-mod,
div#cgit td.ls-mode,
div#cgit td.ls-size {
  font-family: var(--monospace);
}