/* Trauma Kingdom — Desktop OHNE Rahmenbalken
   ------------------------------------------------------------ */

html, body { height: auto; }

.layout {
  display: block;
  height: auto;
  overflow: visible;
  max-width: 1240px;
  margin: 0 auto;
}

/* ---------- Kopfzeile: Wand bleibt sichtbar ---------- */
.site-header {
  background: transparent;
  border-bottom: none;
  padding: 34px 28px 18px;
  align-items: flex-end;
  position: relative;
}
.site-logo {
  width: 84px;
  height: 84px;
  border-radius: 50%;
  border: 3px outset rgba(217, 143, 176, 0.55);
  box-shadow: 0 5px 0 rgba(0, 0, 0, 0.6), 0 0 22px rgba(0, 0, 0, 0.55);
}
.site-title { text-shadow: 3px 3px 0 #000, 0 0 26px rgba(217, 143, 176, 0.45); }
.site-tagline { text-shadow: 2px 2px 0 #000; }
.badge { box-shadow: 0 4px 0 rgba(0, 0, 0, 0.6); }

/* Duenne Zierlinie statt Balken */
.site-header::after {
  content: '';
  position: absolute;
  left: 28px;
  right: 28px;
  bottom: 0;
  height: 2px;
  background: rgba(127,217,217,0.55);
  pointer-events: none;
}
  bottom: 0;
  height: 2px;
  background: rgba(127,217,217,0.55);
  pointer-events: none;
}
.site-header { position: relative; }

/* ---------- Zwei Spalten im normalen Seitenfluss ---------- */
.middle {
  display: grid;
  grid-template-columns: 216px minmax(0, 1fr);
  gap: 32px;
  overflow: visible;
  padding: 24px 28px 20px;
  align-items: start;
}

.sidebar {
  background: transparent;
  border-right: none;
  overflow: visible;
  position: sticky;
  top: 22px;
  padding: 0;
}
.sidebar h2 {
  border-bottom: none;
  text-shadow: 2px 2px 0 #000;
  background: rgba(127,217,217,0.55);
  padding-bottom: 8px;
}
.nav-link { box-shadow: 0 4px 0 rgba(0, 0, 0, 0.55); }
.link-box, .counter, .note, .bgm-box { box-shadow: 0 4px 0 rgba(0, 0, 0, 0.5); }

/* ---------- Inhalt: Tafeln haengen auf der Wand ---------- */
.content {
  overflow: visible;
  padding: 0;
  max-width: 860px;
}
.panel { box-shadow: 0 6px 0 rgba(0, 0, 0, 0.55), 0 0 26px rgba(0, 0, 0, 0.5); }

/* ---------- Fusszeile: Zeile statt Leiste ---------- */
.site-footer {
  background: transparent;
  border-top: none;
  margin: 0 28px;
  padding: 18px 0 34px;
  height: auto;
  position: relative;
}
.site-footer::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 2px;
  background: rgba(127,217,217,0.55);
}