/* === СТИЛИ ДЛЯ ВНУТРЕННИХ СТРАНИЦ MB === */

body { background:#f5f2e8; color:#1a1a1a; }

/* ХЛЕБНЫЕ КРОШКИ */
.breadcrumbs {
  background:#e8dcc0;
  padding:0.6rem 1.5rem;
  font-size:0.85rem;
  border-bottom:1px solid rgba(0,0,0,0.1);
}
.breadcrumbs a { color:#8b0000; text-decoration:none; }
.breadcrumbs a:hover { text-decoration:underline; }
.breadcrumbs span { color:#1a1a1a; font-weight:600; }

/* СТРАНИЦА */
.page-header {
  background:#FFE800;
  padding:2rem 1.5rem;
  border-bottom:4px solid #cc0000;
}
.page-header .container { max-width:1100px; }
.page-header h1 {
  font-family:'UnifrakturMaguntia', cursive;
  font-size:clamp(2.5rem, 6vw, 4rem);
  color:#1a1a1a;
  line-height:1;
  transform:rotate(-1deg);
  display:inline-block;
}
.page-header p {
  font-family:'IM Fell English', serif;
  font-style:italic;
  color:#5a0000;
  margin-top:0.8rem;
  font-size:1.05rem;
  line-height:1.6;
  max-width:700px;
}

.page-content {
  max-width:1100px;
  margin:0 auto;
  padding:2.5rem 1.5rem;
  font-family:'IM Fell English', 'Volkhov', serif;
  font-size:1.05rem;
  line-height:1.75;
}

.page-content h2 {
  font-family:'UnifrakturMaguntia', cursive;
  font-size:2rem;
  margin:2rem 0 1rem;
  color:#1a1a1a;
  padding-bottom:0.3rem;
  border-bottom:2px solid #cc0000;
}
.page-content h3 {
  font-family:'Special Elite', serif;
  text-transform:uppercase;
  letter-spacing:0.05em;
  color:#8b0000;
  font-size:1.1rem;
  margin:1.5rem 0 0.6rem;
}
.page-content h4 {
  font-family:'Special Elite', serif;
  color:#1a1a1a;
  font-size:1rem;
  text-transform:uppercase;
  margin:1rem 0 0.4rem;
}
.page-content p { margin-bottom:0.8rem; }

/* СПИСКИ */
.page-content ul, .page-content ol { margin-left:1.5rem; margin-bottom:1rem; }
.page-content li { margin-bottom:0.3rem; }

/* ТАБЛИЦЫ */
.page-content table {
  width:100%;
  border-collapse:collapse;
  margin:1rem 0;
  font-size:0.95rem;
}
.page-content th {
  background:#1a1a1a;
  color:#FFE800;
  text-align:left;
  padding:0.5rem 0.8rem;
  font-family:'Special Elite', serif;
  text-transform:uppercase;
  font-size:0.85rem;
  letter-spacing:0.04em;
}
.page-content td {
  padding:0.5rem 0.8rem;
  border-bottom:1px solid rgba(0,0,0,0.1);
}
.page-content tr:hover td { background:rgba(139,0,0,0.05); }
.page-content td:first-child { color:#8b0000; font-weight:700; }

/* КАРТОЧКИ */
.card {
  background:rgba(0,0,0,0.04);
  border-left:5px solid #cc0000;
  padding:1rem 1.2rem;
  margin:1rem 0;
  box-shadow:3px 3px 0 rgba(0,0,0,0.08);
}
.card h4 {
  color:#8b0000;
  font-family:'Special Elite', serif;
  text-transform:uppercase;
  font-size:1.05rem;
  margin-bottom:0.5rem;
}

/* ПОДСВЕТКА */
.stat { color:#cc0000; font-weight:700; }
.dice { color:#5a0000; font-weight:700; }
strong { color:#1a1a1a; font-weight:700; }
em { color:#8b0000; font-style:italic; }

/* СПИСОК ЭЛЕМЕНТОВ (классов, монстров и т.д.) */
.item-list {
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(280px, 1fr));
  gap:1rem;
  margin-top:1.5rem;
}
.item-card {
  display:block;
  background:#fff;
  border:2px solid #1a1a1a;
  padding:1.2rem;
  text-decoration:none;
  color:#1a1a1a;
  transition:background 0.15s, transform 0.15s;
  position:relative;
}
.item-card:hover {
  background:#FFE800;
  transform:translateY(-2px);
}
.item-card-number {
  position:absolute;
  top:0.6rem; right:0.8rem;
  font-family:'Special Elite', serif;
  color:#cc0000;
  font-size:0.9rem;
  font-weight:700;
}
.item-card-title {
  font-family:'UnifrakturMaguntia', cursive;
  font-size:1.6rem;
  line-height:1.05;
  margin-bottom:0.4rem;
  padding-right:1.5rem;
}
.item-card-stats {
  font-family:'Share Tech Mono', monospace;
  font-size:0.8rem;
  color:#cc0000;
  margin:0.5rem 0;
  letter-spacing:0.02em;
}
.item-card-desc {
  font-family:'IM Fell English', serif;
  font-style:italic;
  font-size:0.9rem;
  color:#5a4030;
  line-height:1.5;
}

/* НАВИГАЦИЯ ПО СТРАНИЦЕ */
.page-nav {
  background:#e8dcc0;
  padding:0.8rem 1.5rem;
  border-bottom:1px solid rgba(0,0,0,0.1);
  position:sticky;
  top:52px;
  z-index:50;
}
.page-nav .container { max-width:1100px; display:flex; gap:0.5rem; flex-wrap:wrap; }
.page-nav a {
  padding:0.3rem 0.8rem;
  background:#fff;
  border-left:3px solid #cc0000;
  text-decoration:none;
  color:#1a1a1a;
  font-family:'Special Elite', serif;
  text-transform:uppercase;
  font-size:0.75rem;
  letter-spacing:0.04em;
  transition:background 0.15s;
}
.page-nav a:hover { background:#FFE800; }
.page-nav a.active { background:#1a1a1a; color:#FFE800; }

/* DETAILS */
.page-content details {
  background:rgba(0,0,0,0.03);
  border-left:4px solid #1a1a1a;
  margin:1rem 0;
  box-shadow:2px 2px 0 rgba(0,0,0,0.06);
}
.page-content summary {
  cursor:pointer;
  padding:0.9rem 1rem;
  font-weight:700;
  color:#1a1a1a;
  list-style:none;
  font-family:'Special Elite', serif;
  text-transform:uppercase;
  font-size:0.95rem;
  letter-spacing:0.03em;
}
.page-content summary::before { content:'† '; color:#cc0000; }
.page-content details[open] summary::before { content:'☨ '; }
.page-content details .inner { padding:0 1rem 1rem; }

/* === БРОСАЛКИ === */
.dice.rollable {
  cursor:pointer;
  border-bottom:1px dashed currentColor;
  padding:0 0.15em;
  user-select:none;
  transition:background 0.1s, color 0.1s;
}
.dice.rollable:hover {
  background:rgba(204,0,0,0.12);
  color:#cc0000;
}
.dice.rollable:active { background:#cc0000; color:#FFE800; }

.roll-btn-wrap { margin:0.6rem 0; }
.roll-btn {
  display:inline-block;
  background:#1a1a1a;
  color:#FFE800;
  border:none;
  padding:0.5rem 1rem;
  font-family:'Special Elite', serif;
  text-transform:uppercase;
  font-size:0.85rem;
  letter-spacing:0.06em;
  cursor:pointer;
  border-bottom:3px solid #cc0000;
  box-shadow:2px 2px 0 rgba(0,0,0,0.3);
  transition:background 0.1s, transform 0.05s;
}
.roll-btn:hover { background:#cc0000; color:#FFE800; }
.roll-btn:active { transform:translate(1px,1px); box-shadow:1px 1px 0 rgba(0,0,0,0.3); }

.page-content tr:has(.rolled) td,
.page-content td.rolled,
.page-content td.rolled-result {
  background:rgba(255,232,0,0.55) !important;
  color:#1a1a1a;
  font-weight:700;
}
.page-content td.rolled {
  box-shadow:inset 4px 0 0 #cc0000;
  animation:mb-roll-flash 0.7s ease-out;
}
@keyframes mb-roll-flash {
  0% { background:#cc0000 !important; color:#FFE800; }
  60% { background:#FFE800 !important; }
  100% { background:rgba(255,232,0,0.55) !important; color:#1a1a1a; }
}

/* === ТОСТЕР === */
.dice-toaster {
  position:fixed;
  bottom:20px; right:20px;
  z-index:10000;
  display:flex; flex-direction:column-reverse;
  gap:0.5rem;
  pointer-events:none;
  max-width:90vw;
}
.dice-toast {
  background:#1a1a1a;
  color:#f5f2e8;
  padding:0.7rem 1.1rem;
  border-left:5px solid #cc0000;
  font-family:'Special Elite', serif;
  font-size:0.95rem;
  box-shadow:4px 4px 0 rgba(0,0,0,0.4);
  opacity:0;
  transform:translateX(30px);
  transition:opacity 0.3s, transform 0.3s;
}
.dice-toast.show { opacity:1; transform:none; }
.dice-toast .formula { color:#c8c4b0; }
.dice-toast .result {
  color:#FFE800;
  font-size:1.4rem;
  font-weight:700;
  margin:0 0.2rem;
}
.dice-toast small { color:#8b8470; font-size:0.75rem; }

@media (max-width:768px) {
  .item-list { grid-template-columns:1fr; }
  .page-content { padding:1.5rem 1rem; }
  .page-header { padding:1.5rem 1rem; }
  .page-nav { padding:0.6rem 1rem; top:48px; }
  .dice-toaster { bottom:10px; right:10px; left:10px; }
}
