@import url("https://fonts.googleapis.com/css2?family=VT323&display=swap");
* { box-sizing: border-box; }
body { margin: 0; padding: 30px; background: #e6edf6 url("/images/background.png") center / cover fixed; font-family: "VT323", monospace; font-size: 18px; color: #3f0909; }
a { color: #4a6a8a; text-decoration: none; }
a:hover { text-decoration: underline; }
.container { max-width: 780px; margin: auto; }
.topbar { background: #0b0610; padding: 10px 15px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #b8cbe0; color: #968794; }
.site-name { font-size: 24px; letter-spacing: 1px; }
.main-nav { background: #0b0610; border-bottom: 1px solid #b8cbe0; padding: 6px 15px; display: flex; gap: 16px; font-size: 19px; }
.main { padding: 20px; }
.box { background: #0b0610; padding: 10px; margin-bottom: 15px; color: #c9d6e6; }
.content-title { background: #9c9c9c; padding: 2px 0 2px 10px; margin-bottom: 5px; font-size: 20px; border-left: 5px solid #9c9c9c; color: #3f0909; }
.box table { border-collapse: collapse; width: 100%; }
.box th, .box td { text-align: left; padding: 3px 8px; border-bottom: 1px solid #2a2233; }
.box th { color: #968794; width: 12em; font-weight: normal; }
.box td.num { width: 5em; text-align: right; color: #a9becb; }
.ok { color: #7fd08a; }
.bad { color: #e06c6c; }
.footer { background: #0b0610; border-top: 1px solid #b8cbe0; padding: 8px; text-align: center; font-size: 16px; color: #5f7fa3; }
@media (max-width: 768px) { .main-nav { flex-direction: column; gap: 8px; align-items: center; } .topbar { flex-direction: column; align-items: flex-start; gap: 5px; } .box th { width: 8em; } }