.minecraft-page { padding-top: 14px; }

.minecraft-masthead {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px;
  align-items: end;
  padding: 13px 0 12px;
}

.minecraft-masthead h1 {
  margin: 0;
  font-size: clamp(38px, 6vw, 62px);
  letter-spacing: -0.075em;
  line-height: 0.9;
  text-transform: uppercase;
}

.minecraft-intro {
  max-width: 350px;
  margin: 0;
  font-size: 17px;
  line-height: 1.35;
}

.minecraft-layout {
  display: grid;
  grid-template-columns: 205px minmax(0, 1fr);
  gap: 20px;
  align-items: start;
  margin-top: 18px;
}

.minecraft-sidebar { display: grid; gap: 13px; }

.server-state {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 9px;
  font: 700 12px "Courier New", monospace;
}

.server-state.online { color: var(--green); }
.server-state.offline { color: var(--red); }
.server-state.unknown { color: #777; }

.status-light {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 7px currentColor;
}

.server-details {
  width: 100%;
  border-collapse: collapse;
  font: 12px "Courier New", monospace;
}

.server-details th,
.server-details td {
  padding: 5px 2px;
  border-bottom: 1px dotted #777;
  text-align: left;
  vertical-align: top;
}

.server-details td { text-align: right; overflow-wrap: anywhere; }
.online { color: var(--green); }
.dead { color: var(--red); }
.rules-list { margin: 0; padding-left: 19px; font-size: 13px; line-height: 1.55; }
.data-updated { margin-top: 9px !important; font: 9px/1.45 "Courier New", monospace; }
.sidebar-danger-meter { height: 12px; margin-top: 10px; border: 2px inset #fff; background: #fff; }
.sidebar-danger-meter span { display: block; height: 100%; min-width: 2px; background: var(--red); }
.heart-ascii { margin: 0; color: var(--red); font: 11px/1 "Courier New", monospace; text-align: center; }
.hardcore-copy { text-align: center; }
.minecraft-content { min-width: 0; }

.section-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 10px;
}

.section-heading h2 { margin: 0; font-size: clamp(24px, 4vw, 34px); }
.section-heading h2::before { content: "[ "; color: var(--red); }
.section-heading h2::after { content: " ]"; color: var(--red); }
.section-heading > span { font: 10px "Courier New", monospace; text-transform: uppercase; }

.compose-preview {
  margin-bottom: 28px;
  padding: 14px;
  border: 2px inset #fff;
  background: #d6d6d6;
}

.compose-grid { display: grid; gap: 9px; }

.honeypot {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.compose-grid label {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  font-weight: 700;
}

.compose-grid label.message-label { align-items: start; }

.compose-grid input,
.compose-grid textarea {
  width: 100%;
  padding: 7px;
  border: 2px inset #fff;
  color: #000;
  font: 14px "Courier New", monospace;
  background: #fff;
}

.compose-grid textarea { min-height: 82px; resize: vertical; }
.compose-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 9px 13px; margin: 11px 0 0 102px; }
.preview-note { font: italic 11px "Times New Roman", serif; }

.activity-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}

.activity-stat {
  min-width: 0;
  padding: 10px;
  border: 2px inset #fff;
  text-align: center;
  background: #d6d6d6;
}

.activity-stat b {
  display: block;
  overflow: hidden;
  font: 700 19px "Courier New", monospace;
  text-overflow: ellipsis;
}

.activity-stat span {
  display: block;
  margin-top: 4px;
  font: 9px "Courier New", monospace;
  text-transform: uppercase;
}

.activity-chart {
  display: grid;
  grid-template-columns: repeat(24, minmax(4px, 1fr));
  gap: 3px;
  height: 165px;
  padding: 10px 8px 24px;
  border: 2px inset #fff;
  background:
    linear-gradient(to top, transparent 24%, #aaa 25%, transparent 26%, transparent 49%, #aaa 50%, transparent 51%, transparent 74%, #aaa 75%, transparent 76%),
    #fff;
}

.activity-column {
  position: relative;
  display: flex;
  align-items: end;
  min-width: 0;
  height: 100%;
}

.activity-bar {
  display: block;
  width: 100%;
  min-height: 5px;
  border: 1px solid rgba(0, 0, 0, 0.35);
  background: var(--green);
}

.activity-bar.active { background: var(--green); }
.activity-bar.idle { background: #82a366; }
.activity-bar.offline { background: var(--red); }
.activity-bar.no-data { border-style: dotted; background: #aaa; }

.activity-column small {
  position: absolute;
  top: calc(100% + 5px);
  left: 50%;
  font: 8px "Courier New", monospace;
  white-space: nowrap;
  transform: translateX(-50%);
}

.activity-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 13px;
  margin-top: 8px;
  font: 9px "Courier New", monospace;
  text-transform: uppercase;
}

.activity-legend span { display: inline-flex; align-items: center; gap: 4px; }
.activity-legend i { width: 9px; height: 9px; border: 1px solid #555; }
.activity-legend i.active { background: var(--green); }
.activity-legend i.idle { background: #82a366; }
.activity-legend i.offline { background: var(--red); }
.activity-legend i.no-data { background: #aaa; }
.activity-note { margin: 9px 0 24px; font: 10px/1.5 "Courier New", monospace; }

.leaderboard-wrap { overflow-x: auto; border: 2px outset #fff; }

.minecraft-leaderboard {
  width: 100%;
  min-width: 520px;
  border-collapse: collapse;
  font: 13px Arial, sans-serif;
  background: #fff;
}

.minecraft-leaderboard th,
.minecraft-leaderboard td {
  padding: 8px 9px;
  border-right: 1px solid #aaa;
  border-bottom: 1px solid #aaa;
  text-align: left;
}

.minecraft-leaderboard th { border: 2px outset #fff; background: #c0c0c0; }
.minecraft-leaderboard td:first-child { width: 52px; font: 700 12px "Courier New", monospace; text-align: center; }
.minecraft-leaderboard td:nth-child(3) { font-family: "Courier New", monospace; }
.minecraft-leaderboard tbody tr.player-alive td { background: #eaf4e8; }
.minecraft-leaderboard tbody tr.player-dead td { color: #704f4f; background: #f6e4e2; }
.minecraft-leaderboard .player-dead td:nth-child(2) { text-decoration: line-through; }

.minecraft-leaderboard tbody tr:hover td { filter: brightness(0.97); }

.minecraft-leaderboard .podium-gold td:first-child {
  color: #4d3700;
  background: #e7c967;
  box-shadow: inset 4px 0 0 #9b7000;
}

.minecraft-leaderboard .podium-gold td:nth-child(2) b { color: #8a6200; }

.minecraft-leaderboard .podium-silver td:first-child {
  color: #35383c;
  background: #c9cdd1;
  box-shadow: inset 4px 0 0 #7b8188;
}

.minecraft-leaderboard .podium-silver td:nth-child(2) b { color: #60666d; }

.minecraft-leaderboard .podium-bronze td:first-child {
  color: #432711;
  background: #cd966b;
  box-shadow: inset 4px 0 0 #8c542d;
}

.minecraft-leaderboard .podium-bronze td:nth-child(2) b { color: #985b31; }

.life-state {
  display: inline-block;
  min-width: 49px;
  padding: 2px 5px;
  border: 1px solid currentColor;
  font: 700 9px "Courier New", monospace;
  text-align: center;
  text-transform: uppercase;
}

.minecraft-footer-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px 12px; }

.request-result {
  width: min(690px, 100%);
  margin: 34px auto;
  padding: 18px;
  border: 2px inset #fff;
  background: #d6d6d6;
}

.request-result h1 {
  margin: 0 0 14px;
  font-size: clamp(32px, 7vw, 64px);
  letter-spacing: -0.055em;
  line-height: 0.95;
  text-transform: uppercase;
  text-shadow: 3px 3px 0 #aaa;
}

.request-result p { font-size: 18px; line-height: 1.45; }
.request-result .button { margin-top: 8px; }

.dark-mode .compose-preview,
.dark-mode .box,
.dark-mode .request-result,
.dark-mode .activity-stat { color: #c5c8c6; border-color: #111; background: #282a2e; }
.dark-mode .compose-grid input,
.dark-mode .compose-grid textarea,
.dark-mode .sidebar-danger-meter { color: #c5c8c6; border-color: #111; background: #282a2e; }
.dark-mode .activity-chart {
  border-color: #111;
  background:
    linear-gradient(to top, transparent 24%, #4c4c4c 25%, transparent 26%, transparent 49%, #4c4c4c 50%, transparent 51%, transparent 74%, #4c4c4c 75%, transparent 76%),
    #1d1f21;
}
.dark-mode .minecraft-leaderboard { color: #c5c8c6; background: #1d1f21; }
.dark-mode .leaderboard-wrap { border-color: #111; }
.dark-mode .minecraft-leaderboard th { color: #c5c8c6; border-color: #111; background: #282a2e; }
.dark-mode .minecraft-leaderboard td { border-color: #111; }
.dark-mode .minecraft-leaderboard tbody tr.player-alive td { background: #293027; }
.dark-mode .minecraft-leaderboard tbody tr.player-dead td { color: #c5a5a5; background: #3a171c; }
.dark-mode .minecraft-leaderboard .podium-gold td:first-child { color: #1d1f21; background: #f0c674; box-shadow: inset 4px 0 0 #b18c32; }
.dark-mode .minecraft-leaderboard .podium-gold td:nth-child(2) b { color: #f0c674; }
.dark-mode .minecraft-leaderboard .podium-silver td:first-child { color: #1d1f21; background: #c5c8c6; box-shadow: inset 4px 0 0 #969896; }
.dark-mode .minecraft-leaderboard .podium-silver td:nth-child(2) b { color: #c5c8c6; }
.dark-mode .minecraft-leaderboard .podium-bronze td:first-child { color: #1d1f21; background: #de935f; box-shadow: inset 4px 0 0 #a6663f; }
.dark-mode .minecraft-leaderboard .podium-bronze td:nth-child(2) b { color: #de935f; }

@media (max-width: 760px) {
  .minecraft-masthead { grid-template-columns: 1fr; }
  .minecraft-intro { max-width: 620px; }
  .minecraft-layout { grid-template-columns: 1fr; }
  .minecraft-sidebar { grid-template-columns: repeat(2, minmax(0, 1fr)); order: 2; }
  .minecraft-content { order: 1; }
}

@media (max-width: 500px) {
  .minecraft-sidebar { grid-template-columns: 1fr; }
  .activity-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .activity-chart { gap: 2px; padding-right: 5px; padding-left: 5px; }
  .compose-grid label { grid-template-columns: 1fr; gap: 3px; }
  .compose-actions { align-items: start; flex-direction: column; margin-left: 0; }
  .section-heading { align-items: start; flex-direction: column; gap: 4px; }
}