/* Secret of Lauf — sandstone Felsenkeller + Wappensaal heraldry, Wenzelschloss backdrop */
[data-theme="secret-of-lauf"] {
  --bg: #14100B;
  --surface: #211A12;
  --surface2: #322617;
  --surface3: #4A3A22;
  --amber: #E0A53B;
  --amber-grad: #B97E22;
  --green: #6E8B4A;
  --red: #A6322B;
  --purple: #6B4E8C;
  --purple-grad: #4E3866;
  --blue: #3F6E8C;
  --text: #EDE2CC;
  --muted: #9C8C6E;
  --text-on-color: #14100B;
  --text-on-dark: #EDE2CC;
  --text-faint: rgba(237, 226, 204, 0.45);
  --loom-teal: #3E8A7A;
  --shadow-sm: 0 2px 8px rgba(0,0,0,.55);
  --shadow-md: 0 8px 24px rgba(0,0,0,.6);
  --bg-image: url(/img/brand/theme-lauf-bg.webp);
  --bg-image-opacity: 0.16;
}

/* === Secret of Lauf — Deluxe Environmental Layer (Issue #315) ===
   Jeder Selektor unter [data-theme="secret-of-lauf"] gescoped.
   Andere Themes bleiben unverändert. Lesbarkeit + ≤300ms + 44px gewahrt. */

/* Geschmiedeter Ornament-Rahmen um Cards & Modals (1 geteiltes Asset, kein DOM-Bloat).
   border-image-slice ist visuell zu tunen: Asset ist 768px, Ornament-Ring ~170px;
   Startwert 170, anpassen bis Eck-Medaillons vollständig (nicht abgeschnitten). */
[data-theme="secret-of-lauf"] .card,
[data-theme="secret-of-lauf"] .modal {
  border: 16px solid transparent;
  border-image: url(/img/brand/lauf-frame.webp) 170 round;
  border-radius: 0;
  background-clip: padding-box;
  position: relative;
}

/* Sandstein-Korn sehr dezent auf der Fläche — Lesbarkeit MUSS erhalten bleiben */
[data-theme="secret-of-lauf"] .card::after,
[data-theme="secret-of-lauf"] .modal::after {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:url(/img/brand/lauf-parchment.webp) center/cover;
  opacity:.06; mix-blend-mode:overlay;
}

/* Stein-Buttons statt Verlauf (HEBEPUNKT_UX_STANDARD: keine Gradient-Buttons) */
[data-theme="secret-of-lauf"] .btn-amber,
[data-theme="secret-of-lauf"] #authOverlay button {
  background: var(--surface3);
  color: var(--amber);
  border: 1px solid var(--amber);
  box-shadow: inset 0 1px 0 rgba(237,226,204,.08), 0 2px 6px rgba(0,0,0,.5);
}
[data-theme="secret-of-lauf"] .btn-amber:hover,
[data-theme="secret-of-lauf"] #authOverlay button:hover {
  filter: none;
  background: var(--surface3);
  box-shadow: inset 0 1px 0 rgba(237,226,204,.12), 0 0 14px rgba(224,165,59,.45);
}

/* Spinner wärmer — KEINE neue Animationsdauer (≤300ms-Regel unberührt) */
[data-theme="secret-of-lauf"] .spin {
  border-color: var(--surface3);
  border-top-color: var(--amber);
}

/* Dezenter Ornament-Divider unter Sektions-Headings (rein CSS, kein Text) */
[data-theme="secret-of-lauf"] .content h2::after {
  content:''; display:block; height:2px; margin-top:.45rem;
  background:linear-gradient(90deg, transparent, var(--amber) 18%, var(--amber) 82%, transparent);
  opacity:.30;
}

/* Ruhiges Wappen unten in der Sidebar — peripher, NIE über Bedien-Inhalt */
[data-theme="secret-of-lauf"] .sidebar { position: relative; }
[data-theme="secret-of-lauf"] .sidebar::after {
  content:''; position:absolute; left:0; right:0; bottom:.6rem; height:88px;
  background:url(/img/brand/lauf-crest.webp) center/contain no-repeat;
  opacity:.12; pointer-events:none;
}
