/* Questreihen und Quest-Schritte (questguide-view.js): eine Datei für loot.html und die statischen Quest-/Questreihen-Seiten.
   Farben wie die übrige Loot-Datenbank (loot/loot-redesign.css): Fläche #070d18, Karten #0b1220, Rahmen #253142, Gold #e5bd60.
   Blau nur, wo es im Spiel etwas bedeutet (Item-Qualität „Rar“, Allianz). Türkis nur für „parallel“ und „eine davon“. */
:root{--ql-bg:#070d18;--ql-card:#0b1220;--ql-in:#0e1726;--ql-line:#253142;--ql-gold:#e5bd60;--ql-gold-l:rgba(229,189,96,.55);
 --ql-txt:#e8ebf1;--ql-mut:#a3adbd;--ql-teal:#67e8f9;--ql-brass:#d8b46a;--ql-brass-l:#6e5a2c;--ql-copper:#e8957a;--ql-copper-l:#7a3e2e;
 --ql-solo:#b4bcc8;--ql-solo-l:#3a4352;--ql-done:#7fcf8e}
/* Guide-Kasten in loot.html */
.qgw{margin:10px 20px 4px;border:1px solid var(--ql-line);border-radius:12px;background:var(--ql-card)}
.qgw-k{border-color:var(--ql-brass-l)}
.qgw>summary{cursor:pointer;padding:12px 16px;list-style:none;display:flex;gap:8px;align-items:baseline;flex-wrap:wrap;font-size:15px}
.qgw>summary::-webkit-details-marker{display:none}
.qgw>summary::before{content:"▸";color:var(--ql-gold);font-weight:800}.qgw[open]>summary::before{content:"▾"}
.qgw-t{color:var(--ql-gold);font-weight:800;letter-spacing:.06em;font-size:14px;text-transform:uppercase}
.qgw>summary small{color:var(--ql-mut);font-size:14px}
.qgw-b{padding:0 16px 14px}
/* Guide */
.qg{font-size:15px;line-height:1.55}.qg h4{font:700 16px Georgia,serif;color:var(--ql-gold);margin:16px 0 6px}
.qg-lead{margin:4px 0 10px}.qg-note{color:var(--ql-copper);margin:6px 0}
.qg-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:8px;margin:0}
.qg-facts div{background:var(--ql-in);border:1px solid var(--ql-line);border-radius:10px;padding:8px 10px}
.qg-facts dt{color:var(--ql-mut);font-size:14px}.qg-facts dd{margin:2px 0 0}
.qg-pre,.qg-tips,.qg-rew{margin:0;padding-left:20px}.qg-pre li,.qg-tips li,.qg-rew li{margin:3px 0}
.qg-steps{margin:0;padding-left:26px}.qg-step{margin:0 0 12px}.qg-step::marker{color:var(--ql-gold);font-weight:800}
.qg-sh{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}.qg-sh small{color:var(--ql-mut);font-size:14px}
.qg-l{list-style:none;margin:4px 0 0;padding:0}.qg-l>li{margin:2px 0;padding-left:0}
.qg-k{display:inline-block;min-width:92px;color:var(--ql-mut);font-size:14px;margin-right:6px}
.qg-src{display:block;color:var(--ql-mut);font-size:14px;margin-left:98px}
.qg-hint{color:var(--ql-txt)}.qg-el{color:var(--ql-copper);font-size:14px}
/* Badges: Solo grau, Elite und Dungeon Messing, Raid Kupferrot */
.qg-g{font-size:14px;font-weight:700;border-radius:999px;padding:0 9px;border:1px solid var(--ql-solo-l);color:var(--ql-solo)}
.qg-g-elite,.qg-g-gruppe{color:var(--ql-brass);border-color:var(--ql-brass-l)}
.qg-g-dungeon{color:var(--ql-brass);border-color:var(--ql-brass-l);background:rgba(216,180,106,.08)}
.qg-g-raid{color:var(--ql-copper);border-color:var(--ql-copper-l);background:rgba(232,149,122,.08)}
.qg-pl{white-space:nowrap}.qg-pl b{color:var(--ql-gold);font-weight:700}
.qg-npc,.qg-zone{color:var(--ql-gold);text-decoration:none;border-bottom:1px dotted var(--ql-gold-l)}.qg-npc:hover,.qg-zone:hover{color:#f3d48a}
.qg-mapb{margin-left:auto;background:none;border:1px solid var(--ql-line);border-radius:999px;color:var(--ql-gold);font:600 13px/1.2 inherit;padding:4px 11px;cursor:pointer}
.qg-mapb[aria-expanded="true"]{background:var(--ql-in);border-color:var(--ql-gold-l)}
.qg-mapw{margin:10px 0 6px}.qg-mapw .gm{max-width:560px;margin-bottom:8px}.qg-legend{margin:4px 0 0}
.qg-map{display:inline-block;position:relative;width:26px;height:18px;margin-right:5px;vertical-align:-3px;border:1px solid var(--ql-line);border-radius:3px;background:var(--ql-in)}
.qg-map i{position:absolute;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:var(--ql-gold);box-shadow:0 0 0 2px rgba(229,189,96,.25)}
.qg-var>summary{cursor:pointer;color:var(--ql-gold);font-size:14px}.qg-var ul{margin:4px 0 4px;padding-left:18px}
.qg-src-note{color:var(--ql-mut);font-size:14px;margin-top:14px}
.qg-wh a,.whd a{color:var(--ql-gold);font-size:14px}
.qgs .qg-steps{margin-top:8px}
/* Blättern in der Reihe (Questseiten) */
.qpager{align-items:center;padding:10px 12px;border:1px solid var(--ql-line);border-radius:12px;background:var(--ql-card)}
.qpager a{color:var(--ql-gold);text-decoration:none;border-bottom:1px dotted var(--ql-gold-l);font-weight:600}
.qpager-m{color:var(--ql-mut);font-size:14px;text-align:center}
.qpager-top{margin:4px 0 14px}
@media(max-width:620px){.qgw{margin:10px 8px 4px}.qgw-b{padding:0 10px 12px}.qg-k{display:block;min-width:0}.qg-src{margin-left:0}.qg-pl{white-space:normal}.qg-steps{padding-left:20px}
 .qpager{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}.qpager-m{grid-column:1/-1;grid-row:1}
 .qpager a{display:block;border-bottom:0;min-height:40px;line-height:40px;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.qpager a[rel=next]{text-align:right}.qpager-m a{display:inline;min-height:0;line-height:inherit;overflow:visible}}
.qpm,.qpager-m a{white-space:nowrap}
/* ---------- Stufenleiste (Variante A) ---------- */
.qgl{--ql-ico-npc:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='5' r='3'/%3E%3Cpath d='M2 15c0-3.3 2.7-5.5 6-5.5s6 2.2 6 5.5z'/%3E%3C/svg%3E");
 --ql-ico-zone:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1a5 5 0 0 0-5 5c0 3.6 5 9 5 9s5-5.4 5-9a5 5 0 0 0-5-5zm0 7a2 2 0 1 1 0-4 2 2 0 0 1 0 4z'/%3E%3C/svg%3E");
 --ql-ico-inst:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2 15V7a6 6 0 0 1 12 0v8h-3V8a3 3 0 0 0-6 0v7z'/%3E%3C/svg%3E");
 --ql-ico-quest:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 1h3l-.6 9.5H7.1zM8 12a1.6 1.6 0 1 1 0 3.2A1.6 1.6 0 0 1 8 12z'/%3E%3C/svg%3E")}
.ql-a{color:var(--ql-gold);text-decoration:none;border-bottom:1px dotted var(--ql-gold-l)}
a.ql-a:hover{color:#f3d48a;border-bottom-style:solid}
.ql-a::before{content:"";display:inline-block;width:.85em;height:.85em;margin-right:3px;vertical-align:-.08em;background:currentColor;-webkit-mask:var(--ql-ico) center/contain no-repeat;mask:var(--ql-ico) center/contain no-repeat;opacity:.85}
.ql-a-npc{--ql-ico:var(--ql-ico-npc)}.ql-a-zone{--ql-ico:var(--ql-ico-zone)}.ql-a-inst{--ql-ico:var(--ql-ico-inst)}.ql-a-quest{--ql-ico:var(--ql-ico-quest)}
.ql-a-obj::before{display:none}
.ql-nolink{color:var(--ql-txt);border-bottom:0}.ql-nolink::before{opacity:.5}
.ql-it{display:inline-flex;align-items:center;gap:4px;text-decoration:none;font-weight:600;vertical-align:-3px}
.ql-ic{width:18px;height:18px;border-radius:3px;border:1px solid var(--ql-line);flex:0 0 auto}
.ql-ic-0{display:inline-block;background:var(--ql-in)}
.ql-ic.b-uncommon{border-color:#1eff00}.ql-ic.b-rare{border-color:#4ea2ff}.ql-ic.b-epic{border-color:#b06bff}.ql-ic.b-legendary{border-color:#ff9a3c}
.ql-sep{color:var(--ql-mut)}
.ql-about{border:1px solid var(--ql-line);border-radius:12px;background:var(--ql-card);padding:0 14px;margin:8px 0 12px}
.ql-about>summary{cursor:pointer;padding:10px 0;font-weight:700;color:var(--ql-gold);list-style:none}
.ql-about>summary::-webkit-details-marker{display:none}
.ql-about>summary::before{content:"▸ "}.ql-about[open]>summary::before{content:"▾ "}
.ql-about>summary small{color:var(--ql-mut);font-weight:400;margin-left:6px}
.ql-about[open]{padding-bottom:12px}
.ql-top{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;justify-content:space-between;margin:0 0 10px}
.ql-sidesw{display:inline-flex;border:1px solid var(--ql-line);border-radius:999px;overflow:hidden}
.ql-sw{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;font-weight:700;text-decoration:none;color:var(--ql-mut)}
.ql-sw[aria-current]{background:var(--ql-in);color:var(--ql-txt)}
.ql-sw-A[aria-current]{box-shadow:inset 0 -3px 0 #4e86d8}.ql-sw-H[aria-current]{box-shadow:inset 0 -3px 0 #c8483a}
a.ql-sw:hover{color:var(--ql-gold)}
.ql-prog{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;margin:0;color:var(--ql-mut);font-size:14px}
.ql-btn{background:none;border:1px solid var(--ql-line);border-radius:999px;color:var(--ql-gold);font:600 13px/1.2 inherit;padding:0 12px;min-height:32px;cursor:pointer}
.ql{display:grid;grid-template-columns:minmax(210px,290px) minmax(0,1fr);gap:16px;align-items:start}
/* Leiste */
.ql-rail{position:sticky;top:12px;max-height:calc(100vh - 24px);overflow:auto;border:1px solid var(--ql-line);border-radius:12px;background:var(--ql-card);padding:10px 8px}
.ql-ol{list-style:none;margin:0;padding:0}
.ql-ri{position:relative}
.ql-ri::before{content:"";position:absolute;left:19px;top:0;bottom:0;border-left:2px solid var(--ql-line)}
.ql-rail>.ql-ol>.ql-ri:first-child::before{top:50%}.ql-rail>.ql-ol>.ql-ri:last-child::before{bottom:50%}
.ql-rl{position:relative;display:flex;gap:10px;align-items:center;min-height:40px;padding:4px 6px;border-radius:8px;text-decoration:none;color:var(--ql-txt)}
.ql-rl:hover{background:var(--ql-in)}
.ql-dot{flex:0 0 28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:800;background:var(--ql-bg);border:2px solid var(--ql-line);color:var(--ql-mut)}
.ql-rt{font-size:14px;line-height:1.3}
.ql-r-done .ql-dot{border-color:var(--ql-done);color:var(--ql-bg);background:var(--ql-done)}
.ql-r-done .ql-rt{color:var(--ql-mut)}
.ql-r-cur .ql-rl{background:var(--ql-in)}
.ql-r-cur .ql-dot{border-color:var(--ql-gold);background:var(--ql-gold);color:#1a1300}
.ql-r-cur .ql-rt{color:var(--ql-gold);font-weight:700}
.ql-grp{margin:6px 0;border:1px dashed rgba(103,232,249,.55);border-radius:10px;padding:4px 2px 2px}
.ql-gl{display:block;padding:0 8px 2px;color:var(--ql-teal);font-size:12px;font-weight:700;letter-spacing:.03em}
.ql-grp .ql-ri::before{display:none}
.ql-str{margin:2px 0 4px}
.ql-sl{display:block;padding:2px 8px;color:var(--ql-mut);font-size:12px;font-weight:700}
/* Karten */
.ql-card{background:var(--ql-card);border:1px solid var(--ql-line);border-radius:14px;padding:14px 16px;margin:0 0 12px;scroll-margin-top:12px}
.ql-js .ql-card{display:none}.ql-js .ql-card.ql-cur,.ql-js.ql-all .ql-card{display:block}
.ql-card.ql-cur{border-color:var(--ql-gold-l)}
.ql-card.ql-is-done .ql-t{text-decoration:line-through;text-decoration-color:var(--ql-mut)}
.ql-ch{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;align-items:start}
.ql-ch>*{grid-column:1}.ql-ch .ql-done{grid-column:2;grid-row:1/span 3}
.ql-kick{margin:0;color:var(--ql-mut);font-size:13px;font-weight:600;letter-spacing:.02em}
.ql-k-grp{color:var(--ql-teal)}.ql-k-str{color:var(--ql-gold)}
.ql-t{margin:2px 0 0;font:700 20px/1.3 Georgia,serif}
.ql-t .ql-a{color:var(--ql-txt);border-bottom-color:var(--ql-gold-l)}.ql-t .ql-a-quest::before{color:var(--ql-gold)}
.ql-ingame{margin:2px 0 0;color:var(--ql-mut);font-size:14px}
.ql-badges{margin:6px 0 0;display:flex;flex-wrap:wrap;gap:6px;align-items:center}.ql-badges small{color:var(--ql-mut);font-size:14px}
.ql-side-A{color:#7fa9e8}.ql-side-H{color:#f08a7a}
.ql-done{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 12px;border:1px solid var(--ql-line);border-radius:999px;cursor:pointer;font-size:14px;color:var(--ql-mut);white-space:nowrap}
.ql-done input{width:18px;height:18px;accent-color:var(--ql-done);margin:0}
.ql-is-done .ql-done{border-color:var(--ql-done);color:var(--ql-done);font-weight:700}
/* Abhaken speichert nur mit JavaScript (localStorage): ohne .ql-js kein Kasten */
.qgl:not(.ql-js) .ql-done{display:none}
.ql-ch .ql-done-next{grid-column:2;justify-self:end;margin-top:6px;min-height:36px;border-color:var(--ql-done);color:var(--ql-done)}
.ql-msg{color:var(--ql-done);font-weight:600}
.ql-rl-0 .ql-rt{color:var(--ql-mut)}
.ql-f{margin:12px 0 0}
.ql-f>div{display:grid;grid-template-columns:104px minmax(0,1fr);gap:10px;padding:9px 0;border-top:1px solid var(--ql-line)}
.ql-f dt{color:var(--ql-mut);font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding-top:2px}
.ql-f dd{margin:0;min-width:0;overflow-wrap:anywhere}
.ql-todo{margin:0;padding:0;list-style:none}.ql-todo li{margin:0 0 6px}
.ql-f .qg-src{margin:2px 0 0;display:block}
.ql-more{display:inline}.ql-more>summary{display:inline;cursor:pointer;color:var(--ql-gold);font-size:13px}
.ql-more[open]>summary{color:var(--ql-mut)}.ql-more ul{margin:4px 0 0;padding-left:18px}
.ql-rew{display:flex;flex-wrap:wrap;gap:6px 14px}
.ql-gold{color:var(--ql-gold);font-weight:700}
.ql-hint{margin:10px 0 0;padding:10px 12px;background:var(--ql-in);border-radius:10px}
.ql-tools{margin:10px 0 0;display:flex;gap:8px}.ql-tools .qg-mapb{margin-left:0;min-height:36px}
.ql-nav{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center;margin:14px 0 0;padding-top:12px;border-top:1px solid var(--ql-line)}
.ql-nav a{display:inline-flex;align-items:center;gap:.3em;min-height:40px;color:var(--ql-gold);font-weight:700;text-decoration:none;white-space:nowrap}
.ql-next{justify-self:end}.ql-pos{color:var(--ql-mut);font-size:14px;text-align:center}.ql-pos-x{white-space:nowrap}
.qg-start .ql-it,.qg-pre .ql-a{vertical-align:baseline}
@media(max-width:760px){
 .ql{grid-template-columns:minmax(0,1fr)}
 .ql-rail{position:static;max-height:none;padding:8px}
 .ql-rail .ql-ol{display:flex;flex-wrap:wrap;gap:4px}
 .ql-rail .ql-ri::before{display:none}
 .ql-rl{padding:0;min-height:40px;min-width:40px;justify-content:center}
 .ql-dot{flex:0 0 36px;height:36px;font-size:13px}
 .ql-rt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
 .ql-grp{display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin:0;padding:2px 4px}
 .ql-gl{flex-basis:100%;padding:0 2px}
 .ql-str{display:flex;flex-wrap:wrap;gap:4px;align-items:center;margin:0}
 .ql-sl{flex-basis:100%;padding:0 2px}
 .ql-f>div{grid-template-columns:minmax(0,1fr);gap:2px}
 .ql-ch{grid-template-columns:minmax(0,1fr)}.ql-ch .ql-done{grid-column:1;grid-row:auto;justify-self:start;margin-top:6px}
 .ql-ch .ql-done-next{grid-column:1;justify-self:start}
 .ql-t{font-size:18px}
 .ql-card{padding:12px}
 .ql-js:not(.ql-all) .ql-cur .ql-nav{position:fixed;left:0;right:0;bottom:0;z-index:60;margin:0;padding:6px 16px calc(6px + env(safe-area-inset-bottom));background:var(--ql-card);border-top:1px solid var(--ql-gold-l);box-shadow:0 -6px 18px rgba(0,0,0,.45)}
 .ql-js:not(.ql-all) .ql-main{padding-bottom:64px}
 /* Loot-Datenbank/Gildenbereich: über „Mein Charakter / Wunschliste“ und der Tableiste (Höhe misst questline.js, inkl. Safe-Area) */
 html.ql-lift .ql-js:not(.ql-all) .ql-cur .ql-nav{bottom:var(--ql-below,0px);padding-bottom:6px;box-shadow:0 -6px 18px rgba(0,0,0,.35)}
 /* im Handy-Sheet bzw. Dialog liegen Dock und Tableiste darunter: dort wieder ganz unten */
 html.ql-lift .mdb-sheet .ql-js:not(.ql-all) .ql-cur .ql-nav,html.ql-lift dialog .ql-js:not(.ql-all) .ql-cur .ql-nav{bottom:0;padding-bottom:calc(6px + env(safe-area-inset-bottom))}
}
/* Lange englische Titel neben der Überschrift (h1 .ver) brechen auf dem Handy um statt quer zu scrollen. */
h1 .ver{white-space:normal;overflow-wrap:anywhere}
.ql-rep{color:var(--ql-txt);font-weight:700}
.qgs h2 small a{color:var(--ql-gold);text-decoration:none;border-bottom:1px dotted var(--ql-gold-l)}
/* Handy: Ränder der Blätterleiste nur „← 1“ / „3 →“ (Wort steht im aria-label), damit die Mitte („Fassung 2 von 3 · eine davon reicht“) Platz hat */
@media(max-width:480px){.ql-nw{display:none}.ql-nav{gap:8px}.ql-nav a{min-width:40px}.ql-next{justify-content:flex-end}}
