/* Alderun site — shared styling (dark fantasy, matches the in-game menu palette) */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  background: #0a0a14;
  color: #d8d8e8;
  font-family: Georgia, 'Times New Roman', serif;
  line-height: 1.6;
}
a { color: #f7d60d; text-decoration: none; }
a:hover { text-decoration: underline; }

header.site {
  background: #10131f url('assets/start.jpg') center 30% / cover no-repeat;
  background-blend-mode: overlay;
  text-align: center;
  padding: 48px 16px 32px;
  border-bottom: 2px solid #7a6520;
}
header.site img.logo { max-width: min(288px, 60vw); height: auto; }
header.site p.tag { color: #f0e6c8; font-size: 1.15em; margin: 12px 0 0; text-shadow: 0 1px 4px #000; }

nav.site {
  background: #10131f;
  border-bottom: 1px solid #333245;
  text-align: center;
  padding: 10px 0;
  position: sticky;
  top: 0;
  z-index: 5;
}
nav.site a { margin: 0 18px; font-size: 1.05em; letter-spacing: 0.04em; }

main { max-width: 900px; margin: 0 auto; padding: 32px 20px 64px; }
h1, h2, h3 { color: #f7d60d; font-weight: bold; }
h1 { font-size: 2em; }
h2 { border-bottom: 1px solid #333245; padding-bottom: 6px; margin-top: 2em; }
h3 { color: #ffffff; margin-bottom: 0.3em; }

.panel {
  background: #10131f;
  border: 1px solid #333245;
  border-radius: 6px;
  padding: 20px 24px;
  margin: 20px 0;
}

.shots { display: flex; gap: 16px; flex-wrap: wrap; justify-content: center; margin: 24px 0; }
.shots img { max-width: min(420px, 100%); border: 1px solid #7a6520; border-radius: 4px; }

table { border-collapse: collapse; width: 100%; margin: 16px 0; }
/* Phones: a wide table (damage matrix, key lists) scrolls inside itself rather than
   pushing the whole page sideways. */
@media (max-width: 700px) {
  table { display: block; overflow-x: auto; }
}
th, td { border: 1px solid #333245; padding: 7px 10px; text-align: left; }
th { background: #151a2b; color: #f7d60d; }
tr:nth-child(even) td { background: #0e1220; }
.small { font-size: 0.9em; color: #8a93ac; }

/* controls page — key caps */
.kbd {
  display: inline-block;
  min-width: 1.9em;
  padding: 1px 7px;
  margin: 1px 2px;
  background: #1b2038;
  border: 1px solid #7a6520;
  border-bottom-width: 3px;
  border-radius: 4px;
  color: #f0e6c8;
  font-family: 'Segoe UI', Tahoma, sans-serif;
  font-size: 0.85em;
  font-weight: bold;
  line-height: 1.5;
  text-align: center;
  white-space: nowrap;
}

/* wiki hero cards */
.hero-card {
  background: #10131f;
  border: 1px solid #333245;
  border-left: 4px solid #7a6520;
  border-radius: 6px;
  padding: 18px 24px;
  margin: 22px 0;
}
.hero-card h3 { font-size: 1.5em; color: #f7d60d; margin-top: 0; }
.hero-card img.portrait {
  float: right; width: 72px; height: 72px; object-fit: cover;
  border: 2px solid #7a6520; border-radius: 6px; margin: 0 0 8px 14px; background: #000;
}
img.skill-ico {
  width: 26px; height: 26px; vertical-align: -7px; margin-right: 7px;
  border: 1px solid #7a6520; border-radius: 3px; background: #000;
}
.hero-card .role { color: #f0e6c8; font-style: italic; margin-top: -6px; }
.hero-card h4 { color: #ffffff; margin: 1.1em 0 0.4em; letter-spacing: 0.03em; }
.hero-card ul { margin: 0.3em 0 0.6em 1.2em; padding: 0; }
.hero-card li { margin: 0.35em 0; }
.hero-card li b { color: #f0e6c8; }
.mech { color: #9fd0ff; }

footer.site {
  background: #10131f;
  border-top: 1px solid #333245;
  text-align: center;
  padding: 26px 16px;
  color: #8a93ac;
  font-size: 0.95em;
}
footer.site img { height: 56px; vertical-align: middle; border-radius: 4px; margin-bottom: 8px; }