/* Quests: tracker under the minimap, notices, quest log. Same pixel style as game.css (art pixels, zoomed by --px). */
#quest-tracker { position: absolute; right: 4px; top: 128px; width: 124px; padding: 3px 4px 4px; }
#quest-tracker .qt-head { display: flex; justify-content: space-between; align-items: center; height: 10px; padding: 0 1px;
  font-size: 7px; color: var(--gold); cursor: pointer; text-shadow: 1px 1px 0 var(--ink); }
#quest-tracker .qt-fold { width: 10px; text-align: center; color: var(--dim); }
#quest-tracker .qt-fold:hover { color: var(--text); }
#quest-tracker .qt-body { display: flex; flex-direction: column; gap: 3px; margin-top: 2px; }
#quest-tracker .qt-entry { cursor: pointer; padding: 2px 3px 3px; background: rgba(0, 0, 0, .28); box-shadow: inset 0 0 0 1px #2e251c; }
#quest-tracker .qt-entry:hover { box-shadow: inset 0 0 0 1px var(--bronze); }
#quest-tracker .qt-more { font-size: 6px; color: var(--dim); text-align: right; cursor: pointer; padding: 0 1px; }
#quest-tracker .qt-more:hover { color: var(--text); }

.qt-title { font-size: 7px; line-height: 9px; color: var(--text); }
.qt-kind { display: inline-block; font-size: 6px; padding: 0 2px; margin-right: 3px; line-height: 7px; vertical-align: 1px;
  color: var(--ink); background: var(--gold); }
.qt-kind.k-skill { background: #8cc2ff; }
.qt-kind.k-bio { background: #8df08d; }
.qt-kind.k-camp { background: #e8a868; }
.qt-kind.k-smith { background: #d8c08a; }
.qt-kind.k-daily { background: #e0a8ff; }
.qt-kind.k-weekly { background: #ff9f7a; }
.qt-step { display: flex; justify-content: space-between; gap: 4px; font-size: 6px; line-height: 8px; color: var(--dim); margin-top: 1px; }
.qt-entry.next .qt-title { color: var(--dim); }
.qt-step .qt-label { min-width: 0; }
.qt-step .qt-val { white-space: nowrap; color: var(--text); }
.qt-step.done .qt-val, .qt-step.done .qt-label { color: var(--green); }
.qt-bar { height: 2px; margin-top: 1px; background: #110b09; box-shadow: 0 0 0 1px var(--edge); }
.qt-bar > i { display: block; height: 100%; background: var(--gold); }
.qt-actions { margin-top: 3px; display: flex; justify-content: flex-end; }
.qt-go { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* quest log in the character window */
.qt-log { max-height: 190px; overflow-y: auto; margin-top: 3px; padding-right: 2px; }
.qt-group { font-size: 7px; color: var(--gold); margin: 4px 0 2px; padding-bottom: 1px; border-bottom: 1px solid #3a2d20;
  display: flex; justify-content: space-between; gap: 4px; }
.qt-group .qt-reset { color: var(--dim); white-space: nowrap; }
.qt-entry.full { padding: 3px 4px 4px; margin-bottom: 3px; background: rgba(0, 0, 0, .25); box-shadow: inset 0 0 0 1px #2e251c; }
.qt-desc { font-size: 6px; line-height: 8px; color: var(--dim); margin: 1px 0 2px; }
.qt-hint { font-size: 6px; line-height: 8px; color: #9fd6ff; margin-top: 2px; }
.qt-reward { font-size: 6px; line-height: 8px; color: #ffe08a; margin-top: 2px; }

/* notices */
#quest-toast { position: absolute; left: 50%; top: 52px; transform: translateX(-50%); min-width: 120px; max-width: 220px; padding: 4px 8px 5px;
  text-align: center; pointer-events: none; background: rgba(14, 11, 9, .9);
  box-shadow: 0 0 0 1px var(--edge), inset 0 0 0 1px var(--gold-d), 0 2px 0 1px rgba(0, 0, 0, .45); }
#quest-toast .qn-head { font-size: 6px; color: var(--dim); letter-spacing: .5px; }
#quest-toast .qn-title { font-size: 9px; color: var(--gold); text-shadow: 1px 1px 0 var(--ink); }
#quest-toast.done .qn-head { color: var(--green); }
#quest-toast .qn-reward { font-size: 6px; line-height: 8px; color: #ffe08a; margin-top: 1px; }

/* heading with the own gearscore (hunting window, ui/hunt.js) */
.hunt-head { display: flex; justify-content: space-between; align-items: baseline; gap: 4px; margin-top: 1px; }
.hunt-head .gold { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hunt-head .hgs { flex: none; font-size: 7px; cursor: help; }
.dialog-text .path-skills { color: #9fd6ff; }

.qt-pending { display: flex; justify-content: space-between; align-items: center; gap: 4px; font-size: 7px; color: #ffaa40; margin: 2px 0; padding: 2px 3px;
  background: rgba(0, 0, 0, .25); box-shadow: inset 0 0 0 1px #4a3520; }

/* special inventory (Sonderinventar), folds out left of the inventory window */
#special-handle { position: absolute; left: -10px; top: 40px; width: 10px; height: 26px; cursor: pointer;
  display: flex; align-items: center; justify-content: center; font-size: 7px; color: var(--gold);
  background: linear-gradient(90deg, #3b2f23, #2a2119); box-shadow: 0 0 0 1px var(--edge), inset 0 0 0 1px var(--bronze); }
#special-handle:hover { color: #fff; }
#special-handle.on { color: var(--text); }
#special-handle.new { animation: inv-new-tab 1.2s ease-in-out infinite; }
#special-inv { width: 104px; }
/* five category tabs in two rows (3 + 2): in one row "Lager" ran over the window edge with other display scaling */
#special-inv .sp-cats { flex-wrap: wrap; }
#special-inv .sp-cats .tab { flex: 1 0 calc((100% - 3px) / 3); padding: 0 3px; }
#special-inv .sp-pages { margin-bottom: 3px; }
#special-inv .sp-help { margin-top: 3px; text-align: center; }

/* village / hunt trip button under the minimap */
#travel-btn { position: absolute; right: 4px; top: 111px; width: 82px; height: 14px; display: flex; align-items: center; justify-content: center; gap: 3px;
  cursor: pointer; font-size: 7px; color: var(--text); }
#travel-btn i { width: 10px; height: 10px; background: var(--ic-map) center / 10px 10px no-repeat; }
#travel-btn.hunt i { background-image: var(--ic-sword); }
#travel-btn.hunt { color: #b6ffa0; }
#travel-btn:hover { box-shadow: 0 0 0 1px var(--edge), inset 0 0 0 1px var(--gold); }
.trip-row { display: flex; gap: 3px; margin-top: 3px; }
.trip-row .btn { flex: 1; }

/* tracker: three entries visible, the rest scrolls (max-height set in ui/quests.js); pins */
#quest-tracker .qt-body { overflow-y: auto; }
.qt-pin { float: right; width: 8px; height: 9px; margin-left: 2px; cursor: pointer; opacity: .55;
  background: var(--ic-pin) -2px -1px / 12px 12px no-repeat; }
.qt-pin:hover { opacity: 1; }
.qt-pinbtn { float: right; margin-left: 3px; padding: 0 2px; font-size: 6px; line-height: 8px; color: var(--dim); cursor: pointer;
  box-shadow: inset 0 0 0 1px #4a3b2b; }
.qt-pinbtn:hover { color: var(--text); box-shadow: inset 0 0 0 1px var(--bronze); }