/* =====================================================================
   SCOUNDREL — base.css
   Reset · Seiten-Gerüst · Hintergrund · Titel · Status-Log
   ===================================================================== */

*{ box-sizing:border-box; margin:0; padding:0; }

html,body{ height:100%; }
body{
  font-family:var(--serif);
  color:var(--parch);
  background:radial-gradient(120% 90% at 50% -10%, #241c12 0%, var(--bg-1) 45%, var(--bg-0) 100%);
  min-height:100%;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}

/* Stein-Textur + Fackel-Vignette */
body::before{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:0;
  background:
    radial-gradient(60% 50% at 50% 38%, rgba(232,168,56,.10), transparent 70%),
    repeating-linear-gradient(27deg, rgba(255,255,255,.012) 0 2px, transparent 2px 5px),
    repeating-linear-gradient(-63deg, rgba(0,0,0,.10) 0 3px, transparent 3px 7px);
  animation:torch 7s ease-in-out infinite;
}
@keyframes torch{ 0%,100%{opacity:.85} 50%{opacity:1} }

/* gemeinsame Hilfs-Animation (Kampfmenü & Overlay nutzen sie) */
@keyframes fadeIn{ from{opacity:0} to{opacity:1} }

.wrap{
  position:relative; z-index:1;
  max-width:960px; margin:0 auto; padding:22px 18px 60px;
  display:flex; flex-direction:column; gap:20px;
}

/* ---------- Titel ---------- */
header{ text-align:center; padding-top:6px; }
h1{
  font-family:var(--display); font-weight:900;
  font-size:clamp(38px,8vw,68px); letter-spacing:.16em;
  color:var(--gold);
  text-shadow:0 2px 0 #000, 0 0 26px rgba(201,168,74,.35);
  line-height:1;
}
.tagline{
  margin-top:8px; color:var(--ink-faint); font-style:italic;
  font-size:clamp(13px,2.4vw,16px); letter-spacing:.04em;
}

/* ---------- Status-Log ---------- */
.log{
  text-align:center; min-height:24px; font-style:italic; color:var(--ink-faint);
  font-size:clamp(13px,2.6vw,15px); transition:color .3s; letter-spacing:.01em;
}
.log b{ font-style:normal; font-weight:600; }
.log .dmg{ color:var(--blood-hi); }
.log .heal{ color:var(--herb-hi); }
.log .steel{ color:var(--steel-hi); }
.log .gold{ color:var(--gold-hi); }

/* ---------- Barrierefreiheit: reduzierte Bewegung ---------- */
@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.001s !important; animation-iteration-count:1 !important; transition-duration:.001s !important; }
  body::before{ animation:none; }
}