/* MYKOS colors and typography for Apache's generated directory listings. */
:root { color-scheme: dark; font-family: monospace; font-size: 12px; }
* { box-sizing: border-box; }
body { margin: 0 auto; max-width: 1500px; min-height: 100vh; padding: 30px 28px; background: #0b1120; color: #e2e8f0; line-height: 1.6; }
h1 { display: flex; align-items: center; gap: 12px; margin: 0 0 24px; padding: 0 0 18px; border-bottom: 1px solid #334155; font: 600 20px/1.5 monospace; overflow-wrap: anywhere; }
h1::before { content: '|'; display: inline-flex; align-items: center; flex: 0 0 auto; height: 38px; padding-left: 40px; background: url('/.mykos-flower.svg') left center / 28px 38px no-repeat; color: #94a3b8; font-weight: 400; }
a { color: #38bdf8; text-decoration: none; }
a:hover { color: #7dd3fc; text-decoration: underline; }
a:focus-visible { outline: 2px solid #38bdf8; outline-offset: 4px; border-radius: 2px; }
table { width: 100%; border-spacing: 0; border: 1px solid #29384d; border-radius: 9px; background: #121d30; overflow: hidden; text-align: left; }
th, td { padding: 12px 16px; border-bottom: 1px solid #29384d; white-space: nowrap; }
th { background: #111c30; color: #94a3b8; font-weight: 400; }
th a { color: #94a3b8; }
td { color: #94a3b8; }
td:nth-child(2) { width: 100%; }
td:nth-child(2) a { color: #fef08a; }
td:nth-child(2) a[href$='/'] { color: #38bdf8; }
tr:hover td { background: #19314b; }
tr:last-child td { border-bottom: 0; }
th:first-child, td:first-child { width: 28px; padding-right: 0; }
td:first-child img { width: 18px; height: 18px; object-fit: contain; opacity: .8; filter: grayscale(1) brightness(1.4) sepia(1) saturate(3) hue-rotate(100deg); }
th:first-child img { visibility: hidden; }
tr:has(th[colspan]) { display: none; }
hr { border: 0; border-top: 1px solid #29384d; }
address { margin-top: 20px; color: #94a3b8; font: 11px monospace; }
pre { padding: 18px; background: #121d30; border: 1px solid #29384d; border-radius: 9px; overflow-x: auto; }
@media (max-width: 700px) {
  body { padding: 20px 12px; }
  th, td { padding: 10px 8px; }
  td:nth-child(2) { white-space: normal; overflow-wrap: anywhere; }
  th:nth-child(5), td:nth-child(5) { display: none; }
}