/* Edahnien CSS — autogeneriert aus edahnien.css */

/* ── Patchnotes-Popup ─────────────────────────────────────────────────────── */
.pn-overlay {
    position: fixed; inset: 0; z-index: 9000;
    background: rgba(0,0,0,.75);
    display: flex; align-items: center; justify-content: center;
    opacity: 1; transition: opacity .3s;
    padding: 20px;
}
.pn-modal {
    position: relative;
    background: var(--panel, #0e1a14);
    border: 1px solid var(--jade, #3a7c56);
    max-width: 640px; width: 100%;
    max-height: 80vh;
    display: flex; flex-direction: column;
    box-shadow: 0 20px 60px rgba(0,0,0,.8);
}
.pn-corner {
    position: absolute; width: 10px; height: 10px;
    border-color: var(--jade, #3a7c56); border-style: solid;
}
.pn-corner.tl { top: -1px; left: -1px;  border-width: 2px 0 0 2px; }
.pn-corner.tr { top: -1px; right: -1px; border-width: 2px 2px 0 0; }
.pn-corner.bl { bottom: -1px; left: -1px;  border-width: 0 0 2px 2px; }
.pn-corner.br { bottom: -1px; right: -1px; border-width: 0 2px 2px 0; }
.pn-header {
    padding: 24px 28px 16px;
    border-bottom: 1px solid rgba(255,255,255,.07);
    flex-shrink: 0;
}
.pn-eyebrow {
    display: block;
    font-size: .7rem; letter-spacing: .15em; color: var(--jade, #3a7c56);
    text-transform: uppercase; margin-bottom: 6px;
}
.pn-title {
    margin: 0; font-size: 1.3rem; color: var(--gold, #c9a227);
    font-weight: 700; letter-spacing: .03em;
}
.pn-body {
    padding: 20px 28px; overflow-y: auto; flex: 1;
    font-size: .88rem; line-height: 1.65;
    color: var(--text-muted, #b0b8b4);
}
.pn-body .pn-h2 {
    font-size: .95rem; color: var(--gold, #c9a227);
    margin: 18px 0 4px; font-weight: 700; letter-spacing: .05em;
}
.pn-body .pn-h3 {
    font-size: .82rem; color: var(--jade, #3a7c56);
    margin: 14px 0 4px; font-weight: 700;
    text-transform: uppercase; letter-spacing: .1em;
}
.pn-body .pn-list {
    margin: 4px 0 8px 16px; padding: 0;
    list-style: none;
}
.pn-body .pn-list li {
    padding: 2px 0 2px 14px; position: relative;
}
.pn-body .pn-list li::before {
    content: '›'; position: absolute; left: 0;
    color: var(--jade, #3a7c56); font-weight: 700;
}
.pn-body code {
    font-family: monospace; font-size: .83em;
    background: rgba(255,255,255,.06); padding: 1px 4px;
    border-radius: 2px; color: var(--text, #d4ddd8);
}
.pn-footer {
    padding: 16px 28px 24px;
    border-top: 1px solid rgba(255,255,255,.07);
    display: flex; justify-content: flex-end;
    flex-shrink: 0;
}
.pn-close-btn { min-width: 200px; }

/* ── Generische Popups (Profil, Hilfe …) ──────────────────────────────── */
.popup-overlay {
    position: fixed; inset: 0; z-index: 900;
    background: rgba(0,0,0,.65);
    display: flex; align-items: center; justify-content: center;
}
.popup-overlay[hidden] { display: none; }

.popup-box {
    background: var(--surface, #1a2520);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 8px;
    width: min(540px, 92vw);
    max-height: 80vh;
    display: flex; flex-direction: column;
    box-shadow: 0 16px 48px rgba(0,0,0,.6);
}

.popup-header {
    display: flex; justify-content: space-between; align-items: center;
    padding: 16px 20px;
    border-bottom: 1px solid rgba(255,255,255,.08);
    font-weight: 700; letter-spacing: .04em;
    font-size: .95rem; color: var(--accent, #7ecfa0);
}

.popup-close {
    background: none; border: none; cursor: pointer;
    color: var(--ink-dim, #7a9085); font-size: 1rem;
    padding: 2px 6px; border-radius: 4px;
    transition: color .15s;
}
.popup-close:hover { color: var(--text, #d4ddd8); }

.popup-body {
    padding: 20px; overflow-y: auto;
    flex: 1; font-size: .9rem; line-height: 1.6;
}

/* ── Einstellungs-Sektion im Profil-Popup ───────────────────────────────── */
.settings-section { display: flex; flex-direction: column; gap: 18px; }
.settings-title {
  font-family: 'Cinzel', serif;
  font-size: 11px; letter-spacing: .22em; text-transform: uppercase;
  color: var(--gold, #e8c98c); border-bottom: 1px solid rgba(232,201,140,.15);
  padding-bottom: 8px;
}
.settings-row {
  display: flex; align-items: center;
  justify-content: space-between; gap: 14px;
  flex-wrap: wrap;
}
.settings-label { display: flex; flex-direction: column; gap: 3px; flex: 1; min-width: 160px; }
.settings-label-name {
  font-family: 'Cormorant Garamond', serif;
  font-size: 16px; color: var(--ink);
}
.settings-label-desc { font-size: 12px; color: var(--ink-faint); font-style: italic; }
.settings-toggle-wrap { display: flex; gap: 4px; flex-shrink: 0; }
.settings-opt {
  font-family: 'Cinzel', serif;
  font-size: 10px; letter-spacing: .15em; text-transform: uppercase;
  padding: 6px 14px; border-radius: 3px; cursor: pointer;
  background: rgba(10,16,10,.60);
  border: 1px solid rgba(74,222,128,.20);
  color: var(--ink-faint);
  transition: all .14s ease;
}
.settings-opt.active {
  background: rgba(20,50,20,.80);
  border-color: rgba(74,222,128,.55);
  color: #aff4c4;
}
.settings-opt:hover:not(.active) {
  border-color: rgba(74,222,128,.38);
  color: var(--ink);
}
.settings-note {
  font-size: 12px; color: var(--ink-faint); font-style: italic; margin: 0;
}
.settings-msg { font-size: 12px; margin: 0; }
.settings-msg--ok  { color: #7ce87c; }
.settings-msg--err { color: #e87c7c; }

/* button in Topbar ohne Button-Optik */
.info-icon-btn[type="button"] {
    background: none; border: none; cursor: pointer;
    font: inherit;
}

/* ── Badnav ─────────────────────────────────────────────────────────────── */
.badnav-wrap {
    padding: 1.5rem 1rem;
    text-align: center;
}
.badnav-title {
    color: var(--jade);
    font-size: 1.1rem;
    margin-bottom: .5rem;
}
.badnav-msg {
    color: var(--text-muted);
    font-size: .9rem;
    margin-bottom: 1.2rem;
}
.badnav-back {
    font-weight: bold;
}

/* ── Dialog-System ─────────────────────────────────────────────────────── */

.dlg-wrap {
  max-width: 100%;
  margin: 0;
  padding: 4px 0 16px;
  font-family: 'Cormorant Garamond', serif;
  position: relative;
}
.dlg-controls {
  position: absolute; top: 0; right: 0;
  display: flex; align-items: center; gap: 5px;
  z-index: 2;
}
.dlg-reset-icon,
.dlg-speed-icon {
  position: static;
  background: rgba(20,50,20,0.70);
  border: 1px solid rgba(74,222,128,0.45);
  border-radius: 4px;
  color: #aff4c4;
  cursor: pointer;
  padding: 5px 10px;
  line-height: 1;
  transition: background .14s ease, border-color .14s ease, color .14s ease;
}
.dlg-reset-icon { font-size: 12px; }
.dlg-speed-icon {
  font-size: 12px;
  font-family: 'Cinzel', serif;
  letter-spacing: 0.05em;
  font-weight: 600;
}
.dlg-reset-icon:hover,
.dlg-speed-icon:hover {
  background: rgba(40,90,36,0.90);
  border-color: var(--jade, #4ade80);
  color: #fff;
}
/* ── SU Dialog-Tree Inspector ───────────────────────────────────────────── */
.dlg-su-dbg-btn {
  position: static;
  background: rgba(120,80,10,.18);
  border: 1px solid rgba(180,130,30,.38);
  border-radius: 4px;
  color: rgba(220,170,50,.85);
  cursor: pointer;
  padding: 5px 9px;
  font-size: 12px;
  line-height: 1;
  transition: background .14s, border-color .14s;
}
.dlg-su-dbg-btn:hover       { background: rgba(120,80,10,.36); border-color: rgba(220,170,50,.6); color:#ffe97a; }
.dlg-su-dbg-btn.su-btn-active { background: rgba(120,80,10,.42); border-color: rgba(220,170,50,.75); color:#ffe97a; }

.dlg-su-tree {
  margin-top: 10px;
  background: rgba(4,8,4,.92);
  border: 1px solid rgba(120,80,10,.35);
  border-radius: 6px;
  padding: 10px 12px;
  font-family: 'Consolas','Monaco',monospace;
  font-size: 11.5px;
  max-height: 420px;
  overflow-y: auto;
  scrollbar-width: thin;
}
.dlg-su-header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 8px; padding-bottom: 6px;
  border-bottom: 1px solid rgba(120,80,10,.3);
  color: rgba(220,170,50,.85);
}
.dlg-su-title { font-weight: 600; font-size: 12px; }
.dlg-su-edit-link { color: rgba(74,222,128,.65); text-decoration: none; font-size: 11px; }
.dlg-su-edit-link:hover { color: rgba(74,222,128,1); }

.dlg-su-node {
  border-left: 2px solid rgba(120,80,10,.35);
  margin: 3px 0;
  padding: 4px 0 4px 8px;
  border-radius: 0 4px 4px 0;
  transition: border-color .15s, background .15s;
}
.dlg-su-node.su-active {
  border-left-color: rgba(74,222,128,.85);
  background: rgba(74,222,128,.05);
}
.dlg-su-node-head { display: flex; gap: 5px; align-items: center; flex-wrap: wrap; }
.dlg-su-node-id   { color: rgba(220,170,50,.9); font-weight: 600; min-width: 10ch; }
.dlg-su-node-speaker { color: rgba(140,180,140,.55); font-size: 10.5px; }
.dlg-su-node-lines {
  color: rgba(190,195,175,.45); font-style: italic; font-size: 10.5px;
  margin-top: 2px; font-family: 'Inter',sans-serif; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis; max-width: 100%;
}
.dlg-su-tag {
  font-size: 9.5px; padding: 1px 5px; border-radius: 3px;
  font-family: 'Inter',sans-serif; font-style: normal; white-space: nowrap;
}
.su-tag-terminal { background:rgba(200,50,50,.15); color:rgba(220,80,80,.9);  border:1px solid rgba(200,50,50,.3);  }
.su-tag-navigate { background:rgba(50,100,210,.15); color:rgba(100,150,230,.9); border:1px solid rgba(50,100,210,.3); }
.su-tag-next     { background:rgba(90,90,90,.18);   color:rgba(160,160,150,.8); border:1px solid rgba(90,90,90,.3);  }
.su-tag-hook     { background:rgba(170,90,10,.18);  color:rgba(220,140,40,.9);  border:1px solid rgba(170,90,10,.3); }
.su-tag-anim     { background:rgba(90,50,180,.18);  color:rgba(150,100,220,.9); border:1px solid rgba(90,50,180,.3); }
.su-tag-start    { background:rgba(40,160,40,.15);  color:rgba(80,200,80,.9);   border:1px solid rgba(40,160,40,.3); }

/* Via-Verbinder zwischen Parent und Kind-Node */
.dlg-su-via {
  font-family: 'Consolas','Monaco',monospace;
  font-size: 10px; line-height: 1.4;
  margin: 2px 0 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.dlg-su-via.via-auto   { color: rgba(120,140,120,.5); }
.dlg-su-via.via-choice { color: rgba(160,160,140,.65); }
.dlg-su-via.via-orphan { color: rgba(200,140,20,.6); margin-top: 8px; }
.via-arrow    { color: rgba(120,140,120,.55); margin-right: 2px; }
.via-lbl-auto { color: rgba(100,130,100,.55); font-style: italic; }
.dlg-su-via-text { color: rgba(190,175,130,.7); }
.via-cond     { color: rgba(180,130,60,.7); font-size: 9.5px; margin-left: 4px; }
.via-orphan-lbl { color: rgba(200,140,20,.65); font-size: 10px; }

/* Back-Reference (Zyklus) */
.dlg-su-ref {
  font-size: 10px; color: rgba(130,130,110,.5);
  margin: 1px 0; font-family: 'Consolas','Monaco',monospace;
}
.dlg-su-ref code { color: rgba(200,160,40,.6); }

/* Orphan-Node */
.dlg-su-node.su-orphan { border-left-color: rgba(200,140,20,.3); }
.su-tag-orphan { background:rgba(200,140,20,.12); color:rgba(200,150,30,.85); border:1px solid rgba(200,140,20,.3); }

.dlg-su-choices { margin:3px 0 0 0; padding-left:14px; font-size:10.5px; color:rgba(170,190,160,.65); }
.dlg-su-choices li { margin:1px 0; font-family:'Inter',sans-serif; }
.dlg-su-choices code { color:rgba(220,170,50,.75); }
.dlg-su-choices em   { color:rgba(180,130,60,.8); }

.dlg-su-effects { margin-top:3px; display:flex; flex-wrap:wrap; gap:3px; }
.dlg-su-eff {
  font-size:9.5px; padding:1px 5px; border-radius:3px;
  background:rgba(74,222,128,.07); border:1px solid rgba(74,222,128,.2);
  color:rgba(74,222,128,.75); font-family:'Inter',sans-serif;
}
.dlg-su-raw summary {
  cursor:pointer; color:rgba(130,130,110,.55); font-size:10.5px;
  margin-top:8px; padding:3px 0; user-select:none;
}
.dlg-su-raw pre {
  font-size:10px; color:rgba(170,185,155,.6); background:rgba(0,0,0,.35);
  padding:6px 8px; border-radius:4px; margin:4px 0 0;
  overflow:auto; max-height:260px; white-space:pre;
}

.dlg-panel {
  background: transparent;
  border: none;
  border-radius: 0;
  overflow: visible;
  box-shadow: none;
  position: relative;
}
.dlg-panel::before { display: none; }
.dlg-location { display: none; }
.dlg-location-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--gold);
  flex-shrink: 0;
  animation: dlg-pulse 2s ease-in-out infinite;
}
.dlg-location-name {
  font-family: 'Bangers', cursive;
  color: var(--gold);
  font-size: 13px;
  letter-spacing: 2px;
  text-transform: uppercase;
}
.dlg-stage {
  min-height: 160px;
  max-height: 420px;      /* ≈ 3 Zeilen à ~130px + Luft */
  overflow-y: auto;
  overflow-x: hidden;
  padding: 4px 0 8px;
  position: relative;
  scroll-behavior: smooth;
}
/* Scrollbar dezent halten */
.dlg-stage::-webkit-scrollbar { width: 4px; }
.dlg-stage::-webkit-scrollbar-track { background: transparent; }
.dlg-stage::-webkit-scrollbar-thumb { background: var(--line-strong); border-radius: 2px; }

/* ── Scrollbar-Puls wenn noch Inhalt unterhalb liegt ────────────────── */
@keyframes dlg-scrollbar-pulse {
  0%, 100% { background: var(--line-strong); }
  50%       { background: rgba(74,222,128,.75); }
}
.dlg-stage.scroll-hint-visible::-webkit-scrollbar-thumb {
  animation: dlg-scrollbar-pulse 1.1s ease-in-out infinite;
}

/* ── Scroll-Hinweis-Pfeil: zeigt wenn Stage-Inhalt unter dem Viewport liegt ── */
@keyframes dlg-hint-bounce {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(5px); }
}
.dlg-stage::after {
  content: '▾';
  display: none;
  position: sticky;
  bottom: 0;
  width: 100%;
  text-align: center;
  padding: 6px 0 2px;
  background: linear-gradient(transparent, rgba(8,13,6,.88));
  color: var(--jade-bright, #4ade80);
  font-size: 22px;
  line-height: 1;
  text-shadow: 0 0 10px rgba(74,222,128,.7);
  animation: dlg-hint-bounce .9s ease-in-out infinite;
  pointer-events: none;
  z-index: 5;
}
.dlg-stage.scroll-hint-visible::after {
  display: block;
}
/* Scene-Dialog-Overlay: dlg-wrap ist der Scroll-Container */
.scene-dlg-slot .dlg-wrap::-webkit-scrollbar { width: 5px; }
.scene-dlg-slot .dlg-wrap::-webkit-scrollbar-track { background: rgba(6,9,4,0.6); border-radius: 3px; }
.scene-dlg-slot .dlg-wrap::-webkit-scrollbar-thumb { background: rgba(74,222,128,0.45); border-radius: 3px; }
.scene-dlg-slot .dlg-wrap::-webkit-scrollbar-thumb:hover { background: rgba(74,222,128,0.70); }
.dlg-row {
  display: flex;
  align-items: flex-end;
  gap: 16px;
  margin-bottom: 16px;
}
.dlg-row.player-row { flex-direction: row-reverse; }
.dlg-avatar {
  width: 92px; height: 116px;
  border-radius: 4px;
  border: 2px solid var(--line);
  flex-shrink: 0;
  overflow: hidden;
  display: flex; align-items: center; justify-content: center;
  background: #0a0f0a;
  box-shadow: none;
}
.dlg-avatar--player {
  background: #050a0f;
  box-shadow: none;
}
/* Doppel-NPC (z.B. Avara & Sevra) — breiteres Bild, goldener Rahmen */
.dlg-avatar--dual {
  width: 148px;
  border-color: #b07cc0;
  box-shadow: 0 0 8px rgba(176,124,192,0.25);
}
.dlg-avatar img { width:100%; height:100%; object-fit:cover; }
.av-wrap { display:flex; flex-direction:column; align-items:center; }
.dlg-avname {
  font-family: 'Bangers', cursive;
  font-size: 11px; letter-spacing: 2px;
  text-align: center; margin-top: 4px;
  text-transform: uppercase; color: var(--ink-dim);
}
.dlg-avname--player { color: var(--ink-dim); }
.dlg-row .bubble {
  position: relative;
  background: rgba(8,12,8,.88);
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  padding: 12px 16px;
  max-width: 78%; min-height: 48px;
  box-shadow: none;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity .2s ease, transform .2s ease;
}
.dlg-row .bubble.shown { opacity:1; transform:none; }
.dlg-row .bubble.npc-bubble { border-color: var(--line-strong); }
.dlg-row .bubble.npc-bubble::before {
  content:''; position:absolute; left:-10px; bottom:36px;
  border:5px solid transparent; border-right-color:var(--line-strong);
}
.dlg-row .bubble.npc-bubble::after {
  content:''; position:absolute; left:-8px; bottom:37px;
  border:4px solid transparent; border-right-color:rgba(8,12,8,.88);
}
.dlg-row .bubble.player-bubble { background:rgba(5,10,20,.88); border-color:var(--line-strong); }
.dlg-row .bubble.player-bubble::before {
  content:''; position:absolute; right:-10px; bottom:36px;
  border:5px solid transparent; border-left-color:var(--line-strong);
}
.dlg-row .bubble.player-bubble::after {
  content:''; position:absolute; right:-8px; bottom:37px;
  border:4px solid transparent; border-left-color:rgba(5,10,20,.88);
}
/* ── Erzähler-Zeile (Narrativ-Text, kein Sprecher) ────────────────────── */
.dlg-row.narrator-row { justify-content: center; padding: 0 8px; }
.dlg-row.narrator-row .av-wrap { display: none !important; }
.bubble.narrator-bubble {
  max-width: 96%; width: 96%;
  background: transparent;
  border: none;
  border-left: 2px solid rgba(160,200,120,.20);
  border-radius: 0;
  padding: 6px 12px 6px 20px;
  box-shadow: none;
}
.bubble.narrator-bubble::before,
.bubble.narrator-bubble::after { display: none !important; }
.bubble.narrator-bubble .bubble-speaker,
.bubble.narrator-bubble .emotion-tag { display: none !important; }
.bubble.narrator-bubble .bubble-text {
  font-family: 'IM Fell English', 'Georgia', serif;
  font-style: italic;
  font-size: 16px;
  color: var(--ink-dim, rgba(200,220,190,.65));
  line-height: 1.75;
}
.bubble-text {
  font-size:18px; color:var(--ink); line-height:1.5;
  font-family:'Inter',sans-serif; font-style:normal; min-height:24px;
}
.bubble-speaker {
  font-family:'Bangers',cursive; font-size:13px;
  letter-spacing:1.5px; text-transform:uppercase;
  margin-bottom:5px; color:var(--gold);
}
.bubble-speaker.dlg-spk-player { color:var(--ink-dim); }
.emotion-tag {
  display:inline-block; font-family:'Bangers',cursive;
  font-size:12px; letter-spacing:1px; padding:2px 8px;
  border-radius:4px; border:1px solid; margin-bottom:6px;
  text-transform:uppercase;
}
.em-neutral { color:var(--ink-dim); border-color:var(--line-strong); background:rgba(255,255,255,.04); }
.em-stern   { color:#e05020;       border-color:#8b2a00;             background:rgba(139,42,0,.12); }
.em-warm    { color:#4ade80;       border-color:#2a5a00;             background:rgba(74,222,128,.08); }
.em-freudig { color:#7aa8e0;       border-color:#2a4a8b;             background:rgba(42,74,139,.12); }
.dlg-cursor {
  display:inline-block; width:2px; height:16px;
  background:var(--ink-dim); vertical-align:middle; margin-left:2px;
  animation:dlg-blink .7s infinite;
}
.dlg-divider { border:none; border-top:1px solid var(--line); margin:0; }
.dlg-choices { padding:10px 0 16px; }
.choices-label {
  font-family:'Bangers',cursive; font-size:11px; letter-spacing:2px;
  color:rgba(232,201,140,.6); text-transform:uppercase;
  margin-bottom:10px; display:flex; align-items:center; gap:8px;
}
.choices-label::after { content:''; flex:1; height:1px; background:var(--line-strong); }
.choice-btn {
  display:flex; align-items:center; width:100%;
  background:rgba(8,12,8,.9); border:2px solid var(--line-strong);
  border-radius:8px; padding:10px 14px; margin-bottom:8px;
  color:var(--ink-dim); font-family:'Cormorant Garamond',serif;
  font-size:16px; font-style:italic; text-align:left;
  cursor:pointer; transition:all .15s ease;
  opacity:0; transform:translateX(-12px);
}
.choice-text { flex:1; }
.dlg-cost {
  margin-left:auto; padding-left:14px; flex-shrink:0;
  font-family:'Bangers',cursive; font-size:10px; letter-spacing:1px;
  color:#c0922a; font-style:normal; opacity:.75;
}
.choice-btn.visible { opacity:1; transform:none; }
.choice-btn::before { content:'▶'; font-size:10px; margin-right:10px; color:var(--ink-faint); font-style:normal; flex-shrink:0; }
.choice-btn:hover { background:rgba(74,222,128,.06); border-color:var(--jade); color:var(--ink); }
.choice-btn:hover::before { color:var(--jade); }
.choice-btn:active { transform:scale(.98); }
.choice-btn:disabled { opacity:.4; cursor:default; }
.dlg-sfx {
  font-family:'Bangers',cursive; font-size:22px;
  color:var(--gold); letter-spacing:2px; text-align:center;
  padding:8px 0 4px;
  animation:dlg-sfxpop .4s cubic-bezier(.34,1.56,.64,1) forwards;
  transform:scale(0);
}
@keyframes dlg-pulse  { 0%,100%{opacity:1} 50%{opacity:.4} }
@keyframes dlg-blink  { 0%,49%{opacity:1} 50%,100%{opacity:0} }
@keyframes dlg-sfxpop { to{transform:scale(1)} }

/* ── Dialog-System: Eingabefeld (node.input) ─────────────────────────────── */

.dlg-input-wrap {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 4px 0;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity .25s ease, transform .25s ease;
}
.dlg-input-wrap--visible { opacity: 1; transform: none; }

/* Zeile: Feld + Submit-Button nebeneinander */
.dlg-input-row {
  display: flex;
  align-items: stretch;
  gap: 0;
  border: 2px solid var(--line-strong);
  border-radius: 8px;
  overflow: hidden;
  transition: border-color .15s ease;
}
.dlg-input-row:focus-within { border-color: var(--jade); }

.dlg-input-field {
  flex: 1;
  min-width: 80px;
  background: rgba(6,9,4,0.85);
  border: none;
  border-right: 1px solid var(--line-strong);
  color: var(--ink);
  font-family: 'Cormorant Garamond', serif;
  font-size: 16px;
  font-style: italic;
  padding: 10px 14px;
  outline: none;
  -moz-appearance: textfield;
}
.dlg-input-field::-webkit-inner-spin-button,
.dlg-input-field::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.dlg-input-field::placeholder { color: var(--ink-faint); }

/* Submit-Button: sieht aus wie ein choice-btn, aber passend zur Zeile */
.dlg-input-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  background: rgba(8,12,8,.9);
  border: none;
  padding: 10px 18px;
  color: var(--ink-dim);
  font-family: 'Cormorant Garamond', serif;
  font-size: 16px;
  font-style: italic;
  cursor: pointer;
  transition: background .15s ease, color .15s ease;
  white-space: nowrap;
}
.dlg-input-btn::before {
  content: '▶';
  font-size: 10px;
  color: var(--ink-faint);
  font-style: normal;
  flex-shrink: 0;
  transition: color .15s ease;
}
.dlg-input-btn:hover {
  background: rgba(74,222,128,.08);
  color: var(--ink);
}
.dlg-input-btn:hover::before { color: var(--jade); }
.dlg-input-btn:active { background: rgba(74,222,128,.14); }
.dlg-input-btn:disabled { opacity: .4; cursor: default; }

/* Abbrechen-Button: eigene Zeile, schmaler */
.dlg-input-cancel {
  border: 2px solid var(--line-strong);
  border-radius: 8px;
  background: rgba(8,12,8,.7);
  color: var(--ink-faint);
  font-size: 14px;
  padding: 7px 14px;
  width: 100%;
  justify-content: flex-start;
}
.dlg-input-cancel::before { content: '✕'; font-size: 10px; }
.dlg-input-cancel:hover { border-color: #f87171; color: #f87171; background: rgba(248,113,113,.06); }
.dlg-input-cancel:hover::before { color: #f87171; }

.dlg-input-error {
  color: #f87171;
  font-size: 11px;
  padding: 2px 2px;
  min-height: 16px;
}

/* ── Schließfach-Panel ─────────────────────────────────────────────────── */
.sf-panel {
  background: rgba(6,9,4,0.85);
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  padding: 18px 20px;
  margin-top: 24px;
}
.sf-panel-head {
  display: flex; justify-content: space-between; align-items: baseline;
  margin-bottom: 12px;
}
.sf-title {
  font-family: 'Cinzel', serif; font-size: 14px;
  letter-spacing: 0.08em; color: var(--ink);
}
.sf-gems-display {
  font-family: 'JetBrains Mono', monospace; font-size: 13px;
  color: #7dd3fc;
}
.sf-bar {
  height: 4px; background: var(--line-strong); border-radius: 2px;
  overflow: hidden; margin-bottom: 16px;
}
.sf-bar > span {
  display: block; height: 100%;
  background: linear-gradient(90deg, #38bdf8, #7dd3fc);
  border-radius: 2px;
  transition: width .4s ease;
}
.sf-actions { display: flex; gap: 20px; flex-wrap: wrap; }
.sf-action-block { flex: 1; min-width: 160px; }
.sf-label {
  display: block; font-size: 10px; letter-spacing: 0.15em;
  text-transform: uppercase; color: var(--ink-faint); margin-bottom: 6px;
}
.sf-input-row { display: flex; gap: 0; border: 1px solid var(--line-strong); border-radius: 6px; overflow: hidden; margin-bottom: 4px; }
.sf-input {
  flex: 1; min-width: 60px;
  background: rgba(6,9,4,0.7); border: none;
  color: var(--ink); font-family: 'Cormorant Garamond',serif;
  font-size: 15px; font-style: italic; padding: 8px 10px; outline: none;
  -moz-appearance: textfield;
}
.sf-input::-webkit-inner-spin-button,
.sf-input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.sf-btn {
  background: rgba(8,12,8,.9); border: none; border-left: 1px solid var(--line-strong);
  color: var(--ink-dim); font-family: 'Cormorant Garamond',serif;
  font-size: 14px; font-style: italic; padding: 8px 12px;
  cursor: pointer; white-space: nowrap; flex-shrink: 0;
  transition: background .15s, color .15s;
}
.sf-btn:hover { background: rgba(56,189,248,.08); color: #7dd3fc; }
.sf-btn:active { background: rgba(56,189,248,.15); }
.sf-hint {
  font-size: 11px; color: var(--ink-faint);
  font-variant-numeric: tabular-nums;
}
.sf-msg { margin-top: 10px; font-size: 13px; padding: 6px 0; }
.sf-msg--ok    { color: var(--jade-bright); }
.sf-msg--error { color: #f87171; }

/* ── Schließfach-Widget im Dialog-Bubble ───────────────────────────────── */
.sf-widget-bubble { padding: 0 !important; overflow: hidden; }
.sf-widget {
  padding: 14px 16px;
  width: 100%;
  box-sizing: border-box;
}
.sf-widget-head {
  display: flex; justify-content: space-between; align-items: baseline;
  margin-bottom: 10px;
}
.sf-widget-title {
  font-family: 'Cinzel', serif; font-size: 13px;
  letter-spacing: 0.07em; color: var(--ink);
}
.sf-widget-gems { font-family: 'JetBrains Mono', monospace; font-size: 12px; color: #7dd3fc; }
.sf-widget-bar {
  height: 3px; background: var(--line-strong); border-radius: 2px;
  overflow: hidden; margin-bottom: 12px;
}
.sf-widget-bar > .sf-w-bar-fill {
  display: block; height: 100%;
  background: linear-gradient(90deg, #38bdf8, #7dd3fc);
  border-radius: 2px; transition: width .4s ease;
}
.sf-widget-rows { display: flex; gap: 14px; flex-wrap: wrap; }
.sf-widget-row  { flex: 1; min-width: 140px; }
.sf-w-label {
  display: block; font-size: 10px; letter-spacing: 0.15em;
  text-transform: uppercase; color: var(--ink-faint); margin-bottom: 5px;
}
.sf-w-hint { font-size: 13px; color: var(--ink-dim); margin-top: 6px; line-height: 1.4; }
.sf-w-msg { font-size: 13px; margin-top: 10px; padding: 4px 0; }
.sf-w-msg--ok  { color: var(--jade-bright); }
.sf-w-msg--err { color: #f87171; }

/* ── Ruhmesliste-Widget im Dialog-Bubble ───────────────────────────────── */
.rl-widget { padding: 18px 20px; min-width: 320px; }
.rl-head {
  font-family: 'Cinzel', serif; font-size: 12px;
  letter-spacing: .18em; text-transform: uppercase;
  color: var(--jade-bright); margin-bottom: 14px;
}
.rl-table { width: 100%; border-collapse: collapse; font-size: 15px; }
.rl-table thead th {
  font-family: 'Cinzel', serif; font-size: 11px;
  letter-spacing: .12em; text-transform: uppercase;
  color: var(--ink-dim); border-bottom: 1px solid rgba(232,239,226,.15);
  padding: 4px 8px 8px; text-align: left;
}
.rl-table th:last-child, .rl-table td:last-child { text-align: right; }
.rl-table tbody tr { border-bottom: 1px solid rgba(232,239,226,.07); }
.rl-table tbody tr:last-child { border-bottom: none; }
.rl-table td { padding: 8px 8px; color: var(--ink); }
.rl-rank { color: var(--ink-dim); font-size: 14px; width: 36px; }
.rl-name { font-weight: 500; font-size: 15px; }
.rl-lv   { color: var(--ink-dim); font-size: 14px; width: 36px; }
.rl-bp   { color: var(--jade-bright); font-size: 15px; font-weight: 600; }
.rl-self td { color: var(--jade-bright) !important; }
.rl-sep  td { color: var(--ink-faint); font-size: 12px; text-align: center; padding: 4px; border: none; letter-spacing: .2em; }
.rl-empty   { color: var(--ink-faint); font-style: italic; font-size: 14px; padding: 16px 8px; }

/* ── Formular-Grundklassen (Buttons + Inputs) ──────────────────────────── */
.btn-evo {
  display: inline-block;
  padding: 7px 16px;
  background: rgba(159,173,120,.15);
  border: 1px solid var(--jade-bright, #9fad78);
  border-radius: 5px;
  color: var(--jade-bright, #9fad78);
  font-size: 0.9em;
  cursor: pointer;
  text-decoration: none;
  transition: background .15s, color .15s;
  line-height: 1.4;
}
.btn-evo:hover {
  background: rgba(159,173,120,.28);
  color: #c8d9a8;
  text-decoration: none;
}
.btn-evo--sm  { padding: 4px 10px; font-size: 0.82em; }
.btn-evo--danger {
  border-color: #f87171;
  color: #f87171;
  background: rgba(248,113,113,.08);
}
.btn-evo--danger:hover { background: rgba(248,113,113,.22); color: #fca5a5; }

.input-evo {
  background: rgba(255,255,255,.06);
  border: 1px solid var(--border, rgba(255,255,255,.15));
  border-radius: 4px;
  color: var(--ink);
  padding: 5px 9px;
  font-size: 0.9em;
  outline: none;
  transition: border-color .15s;
}
.input-evo:focus { border-color: var(--jade-bright, #9fad78); }

/* ── Haussystem ────────────────────────────────────────────────────────── */
.house-rooms {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.house-room-link {
  display: inline-block;
  padding: 7px 14px;
  border: 1px solid var(--border, rgba(255,255,255,.12));
  border-radius: 5px;
  color: var(--ink);
  text-decoration: none;
  font-size: 0.92em;
  background: rgba(255,255,255,.03);
  transition: border-color .15s, background .15s;
}
.house-room-link:hover {
  border-color: var(--jade-bright, #9fad78);
  background: rgba(159,173,120,.07);
  color: var(--jade-bright, #9fad78);
  text-decoration: none;
}
.house-room-locked {
  color: var(--ink-faint);
  cursor: default;
  opacity: .55;
}
.house-room-locked:hover {
  border-color: var(--border, rgba(255,255,255,.12));
  background: rgba(255,255,255,.03);
  color: var(--ink-faint);
}

/* ── Meilenstein-Overlay (Fullscreen Scene) ─────────────────────────────────── */
#milestone-overlay {
  display: none; /* toggled to flex via JS — resets CSS animations automatically */
  position: fixed;
  inset: 0;
  z-index: 9990;
  flex-direction: column;
  align-items: center;
  overflow: hidden;
  background: radial-gradient(circle at center,
      rgba(20,8,0,.18),
      rgba(0,0,0,.96) 80%);
  cursor: pointer;
  font-family: 'Cormorant Garamond', Georgia, serif;
  color: #f3d9a2;
}

/* ── Rising ember particles ─────────────────────────────────────────────────── */
.ms-particles {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  z-index: 1;
}
.ms-particles span {
  position: absolute;
  width: 4px; height: 4px;
  background: #ffcc73;
  border-radius: 50%;
  box-shadow: 0 0 10px #ffb347, 0 0 24px rgba(255,160,50,.55);
  opacity: 0;
  animation: ms-float-up linear infinite;
}
.ms-particles span:nth-child(1) { left:  8%; bottom:  -6%; animation-duration: 11s; animation-delay: 0.0s; }
.ms-particles span:nth-child(2) { left: 22%; bottom:  -4%; animation-duration:  8s; animation-delay: 1.2s; }
.ms-particles span:nth-child(3) { left: 38%; bottom: -12%; animation-duration: 10s; animation-delay: 0.6s; }
.ms-particles span:nth-child(4) { left: 51%; bottom:  -8%; animation-duration: 12s; animation-delay: 2.1s; }
.ms-particles span:nth-child(5) { left: 64%; bottom: -15%; animation-duration:  9s; animation-delay: 0.3s; }
.ms-particles span:nth-child(6) { left: 78%; bottom:  -4%; animation-duration: 13s; animation-delay: 1.6s; }
.ms-particles span:nth-child(7) { left: 90%; bottom: -10%; animation-duration: 10s; animation-delay: 2.8s; }
.ms-particles span:nth-child(8) { left: 32%; bottom:  -2%; animation-duration: 14s; animation-delay: 3.4s; width: 3px; height: 3px; }
.ms-particles span:nth-child(9) { left: 70%; bottom:  -6%; animation-duration: 11s; animation-delay: 4.1s; width: 3px; height: 3px; }

/* ── Header block (upper ~1/3) ──────────────────────────────────────────────── */
.ms-header {
  flex: 0 0 32vh;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0 6vw;
  position: relative;
  z-index: 3;
}

.ms-kicker {
  font-family: 'IM Fell English SC', 'Cinzel', serif;
  font-size: clamp(11px, 1.3vh, 18px);
  letter-spacing: .55em;
  text-transform: uppercase;
  color: #c9a76a;
  text-shadow: 0 0 14px rgba(255,200,100,.4);
  opacity: 0;
  animation: ms-fade-up 1.5s ease forwards 1s;
}
.ms-kicker::before,
.ms-kicker::after {
  content: '❖';
  margin: 0 .9em;
  color: #a9863a;
  font-size: .7em;
  letter-spacing: 0;
}

.ms-main-title {
  margin-top: 1.4vh;
  font-family: 'Cinzel', serif;
  font-weight: 700;
  font-size: clamp(28px, 6.2vh, 84px);
  line-height: .98;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #f4d18f;
  text-shadow:
    0 0 14px rgba(255,220,120,.55),
    0 0 36px rgba(255,180,50,.30),
    0 0 90px rgba(255,140,0,.18);
  opacity: 0;
  transform: scale(.92);
  animation: ms-title-reveal 2s cubic-bezier(.2,.7,.2,1) forwards 1.7s;
}

.ms-header-divider {
  width: clamp(160px, 22vw, 320px);
  height: 2px;
  margin: 2vh auto 1.6vh;
  background: linear-gradient(to right, transparent, #d8b16b, transparent);
  opacity: 0;
  animation: ms-fade-in 2s ease forwards 2.5s;
}

#ms-desc {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: clamp(15px, 2.1vh, 26px);
  line-height: 1.4;
  color: #d8bf8d;
  max-width: 820px;
  opacity: 0;
  animation: ms-fade-up 2s ease forwards 3.0s;
}

/* ── Stage block (lower ~2/3 — parchment or plain card) ────────────────────── */
.ms-stage {
  flex: 1 1 auto;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding-bottom: 7vh;
  position: relative;
  min-height: 0;
}

/* ── Parchment certificate ──────────────────────────────────────────────────── */
.ms-parchment {
  position: relative;
  height: min(62vh, calc(86vw * 1448 / 1086));
  aspect-ratio: 1086 / 1448;
  /* background-image wird dynamisch per JS gesetzt (artworkPath aus milestone_definitions) */
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  filter: drop-shadow(0 24px 50px rgba(0,0,0,.7));
  opacity: 0;
  transform: scale(1.08);
  animation: ms-parchment-appear 2.5s cubic-bezier(.2,.7,.2,1) forwards 3.6s;
}

.ms-magic-light {
  position: absolute;
  left: 50%; top: 50%;
  width: 62%;
  aspect-ratio: 1 / 1;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: radial-gradient(circle,
      rgba(255,220,140,.35),
      rgba(255,180,80,.08) 45%,
      transparent 70%);
  filter: blur(8px);
  mix-blend-mode: screen;
  pointer-events: none;
  opacity: 0;
  animation:
    ms-fade-in    2.5s ease              forwards 4.4s,
    ms-pulse-light 4.5s ease-in-out infinite      6.5s;
}

/* 8-row grid overlaid on the parchment artwork */
#ms-content {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-rows: 25% 3% 14% 3% 22% 1% 18% 14%;
  padding: 0 20%;
  text-align: center;
  color: #5a3a1a;
  opacity: 0;
  animation: ms-fade-in 1.6s ease forwards 4.6s;
}

.ms-pg-row {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

/* Titel über dem Siegel (row 1) */
.ms-urk-header-row {
  justify-content: flex-end;
  padding-bottom: .8vh;
  gap: .3vh;
}

/* Urkunde body (row 5) */
.ms-urkunde { gap: 1vh; overflow: hidden; }

.ms-urk-label {
  font-family: 'IM Fell English SC', serif;
  font-size: clamp(10px, 1.05vh, 16px);
  letter-spacing: .5em;
  text-transform: uppercase;
  color: #7a4a1e;
}
.ms-urk-title {
  font-family: 'Cinzel', serif;
  font-weight: 800;
  font-size: clamp(12px, 2.0vh, 28px);
  line-height: 1.1;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #2a1808;
  max-width: 100%;
  overflow-wrap: break-word;
  text-shadow:
    0 1px 0 rgba(255,240,200,.6),
    0 0 16px rgba(255,200,110,.5),
    0 0 32px rgba(255,160,50,.3);
}
.ms-urk-rule {
  width: 55%;
  height: 1px;
  margin: .4vh 0;
  background: linear-gradient(to right,
      transparent, #8a5a25 20%, #c8973b 50%, #8a5a25 80%, transparent);
  opacity: .7;
}
.ms-urk-flavor {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: clamp(12px, 1.7vh, 22px);
  line-height: 1.4;
  color: #4a2c10;
  max-width: 100%;
  overflow-wrap: break-word;
}
.ms-urk-flavor strong {
  font-weight: 600;
  font-style: normal;
  color: #2a1808;
}

/* Banner ribbon (row 7) */
.ms-banner-row { transform: translateY(-.4vh); }
.ms-banner-name {
  font-family: 'Cinzel', serif;
  font-weight: 700;
  font-size: clamp(13px, 2.1vh, 28px);
  letter-spacing: .18em;
  text-transform: uppercase;
  color: #3a2410;
  text-shadow: 0 1px 0 rgba(255,235,180,.5);
}
.ms-banner-sub {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: clamp(10px, 1.2vh, 16px);
  color: #5a3a1a;
  margin-top: .2vh;
  letter-spacing: .04em;
}
.ms-banner-titles {
  font-family: 'IM Fell English SC', serif;
  font-size: clamp(9px, 1.0vh, 14px);
  color: #7a4a1e;
  letter-spacing: .2em;
  margin-top: .3vh;
  opacity: .85;
}

/* Signatures row (row 7) */
.ms-signatures-row {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .5vh;
  overflow: hidden;
  position: relative;
  z-index: 2;
}
.ms-sig-names {
  display: flex;
  gap: 4vw;
  justify-content: center;
}
.ms-sig-name {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-weight: 700;
  font-size: clamp(12px, 1.7vh, 21px);
  color: #1a2a4a;
  letter-spacing: .03em;
  border-top: 1px solid rgba(20,40,80,.4);
  padding-top: .4vh;
  text-shadow: 0 1px 2px rgba(180,200,255,.3);
  min-width: 30%;
  text-align: center;
}

/* ── Plain card (non-parchment milestones) ──────────────────────────────────── */
.ms-plain {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 3vh 8vw;
  opacity: 0;
  animation: ms-fade-up 2s ease forwards 2.8s;
}

.ms-icon {
  font-size: clamp(52px, 9vh, 96px);
  line-height: 1;
  margin-bottom: 2vh;
  display: block;
  filter: drop-shadow(0 0 18px rgba(201,163,104,.6));
  animation: ms-icon-pulse 2.5s ease-in-out infinite 3.5s;
}

.ms-subtitle {
  font-family: 'Cormorant SC', Georgia, serif;
  font-size: clamp(12px, 1.6vh, 20px);
  letter-spacing: .28em;
  text-transform: uppercase;
  color: #c9a76a;
  opacity: .9;
}

/* ── Continue hint ──────────────────────────────────────────────────────────── */
.ms-continue {
  position: absolute;
  bottom: 2vh;
  width: 100%;
  text-align: center;
  color: #c7a875;
  font-family: 'IM Fell English SC', serif;
  font-size: .95rem;
  letter-spacing: .5em;
  text-transform: uppercase;
  text-shadow: 0 0 10px rgba(0,0,0,.6);
  opacity: 0;
  animation:
    ms-fade-in   2s ease          forwards 6.0s,
    ms-pulse-text 2s ease infinite          7.2s;
  pointer-events: none;
  z-index: 4;
}

/* ── Keyframes ──────────────────────────────────────────────────────────────── */
@keyframes ms-parchment-appear {
  from { transform: scale(1.08); opacity: 0; filter: blur(10px) drop-shadow(0 24px 50px rgba(0,0,0,.7)); }
  to   { transform: scale(1);    opacity: 1; filter: blur(0)     drop-shadow(0 24px 50px rgba(0,0,0,.7)); }
}
@keyframes ms-title-reveal {
  to { opacity: 1; transform: scale(1); }
}
@keyframes ms-fade-up {
  from { opacity: 0; transform: translateY(28px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes ms-fade-in {
  to { opacity: 1; }
}
@keyframes ms-pulse-light {
  0%,100% { transform: translate(-50%,-50%) scale(1);    opacity: .85; }
  50%     { transform: translate(-50%,-50%) scale(1.07); opacity: 1;   }
}
@keyframes ms-float-up {
  0%   { transform: translateY(0)       scale(0);   opacity: 0; }
  10%  { opacity: 1; }
  100% { transform: translateY(-110vh)  scale(1.4); opacity: 0; }
}
@keyframes ms-pulse-text {
  0%,100% { opacity: .4; }
  50%     { opacity: 1; }
}
@keyframes ms-icon-pulse {
  0%,100% { filter: drop-shadow(0 0 12px rgba(201,163,104,.45)); transform: scale(1); }
  50%     { filter: drop-shadow(0 0 28px rgba(201,163,104,.8));  transform: scale(1.06); }
}

@media (max-width: 720px) {
  .ms-header { flex-basis: 28vh; padding: 0 4vw; }
  #ms-desc   { max-width: 96%; }
}

/* Rucksack-Badge (item_added) */
.info-icon-btn .item-badge {
  position: absolute;
  top: 2px; right: 2px;
  width: 8px; height: 8px;
  background: var(--jade-bright, #9fad78);
  border-radius: 50%;
  border: 1px solid var(--bg, #111);
  animation: badge-pulse 1.8s ease-in-out infinite;
}
.info-icon-btn { position: relative; }
@keyframes badge-pulse {
  0%,100% { opacity: 1; transform: scale(1); }
  50%      { opacity: .6; transform: scale(1.3); }
}

/* Neue Item-Karte im Inventar */
.iv-D-card.iv-new {
  border-color: var(--jade-bright, #9fad78);
  box-shadow: 0 0 0 1px var(--jade-bright, #9fad78), inset 0 0 12px rgba(159,173,120,.1);
}
.iv-D-card.iv-new::after {
  content: 'NEU';
  position: absolute;
  top: 4px; right: 6px;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .08em;
  color: var(--jade-bright, #9fad78);
  opacity: .85;
}

/* ══════════════════════════════════════════════════════════════════════════
   Inventar / Rucksack — Redesign (Variant D)
   Fonts: Cinzel · Cormorant Garamond · Cormorant SC · Inter
   ══════════════════════════════════════════════════════════════════════════ */