#hud{position:absolute;left:10px;top:auto;bottom:34px;align-items:flex-end;display:flex;gap:6px;flex-wrap:wrap}
#hud .btn{min-height:34px;padding:5px 10px;font-size:12.5px;background:rgba(15,23,34,.78);backdrop-filter:blur(6px)}
#hud-title{position:absolute;left:12px;top:12px;display:flex;align-items:center;gap:12px;background:rgba(16,20,26,.84);border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:9px 18px 9px 12px;font-weight:800;font-size:clamp(15px,1.9vw,26px);letter-spacing:.2px;backdrop-filter:blur(8px)}
#hud-tasks{position:absolute;left:12px;top:calc(12px + clamp(50px,5.2vw,66px) + 10px);width:clamp(210px,24%,300px);background:rgba(18,22,28,.86);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:6px 8px 8px;backdrop-filter:blur(8px)}
.tk-head{width:100%;text-align:left;background:none;border:0;font-weight:700;font-size:clamp(14px,1.45vw,19px);padding:6px 6px 4px;display:flex;justify-content:space-between;color:#fff}
.tk-head span{color:var(--muted);font-weight:600;font-size:.82em}
#tk-list{list-style:none;margin:0;padding:0}
#tk-list li{display:grid;grid-template-columns:30px 1fr auto;align-items:center;gap:8px;padding:5px 6px;border-radius:9px;font-size:clamp(12.5px,1.3vw,17px);cursor:default}
#tk-list li:nth-child(odd){background:rgba(255,255,255,.045)}
#tk-list li i{width:24px;height:24px;border-radius:50%;border:3px solid #62666e;display:block;position:relative}
#tk-list li.cur i{border-color:#f0a21a}
#tk-list li.done i{background:#35b24c;border-color:#35b24c}
#tk-list li.done i::after{content:"";position:absolute;left:6px;top:2px;width:6px;height:11px;border:solid #fff;border-width:0 3px 3px 0;transform:rotate(45deg)}
#tk-list li em{font-style:normal;color:#cfd6df;font-variant-numeric:tabular-nums}
#hud-tasks.closed #tk-list{display:none}
#hud-stats{position:absolute;right:12px;top:12px;display:flex;gap:10px}
.pill{display:flex;align-items:center;gap:10px;background:rgba(16,20,26,.84);border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:8px 16px;backdrop-filter:blur(8px);font-size:clamp(14px,1.7vw,24px)}
.pill small{display:block;font-size:.62em;color:#cdd5df;line-height:1.1}
.pill b{font-variant-numeric:tabular-nums;font-size:1em}
.xp{display:block;width:clamp(70px,7vw,112px);height:9px;background:#3a3f48;border-radius:6px;overflow:hidden;margin-top:3px}
.xp i{display:block;height:100%;background:#4ad25b;width:45%}
#toast{position:absolute;left:50%;bottom:76px;top:auto;transform:translateX(-50%);max-width:min(92%,620px);background:rgba(15,23,34,.92);border:1px solid var(--line);border-radius:12px;padding:8px 12px;font-size:13px;opacity:0;transition:opacity .25s;pointer-events:none;text-align:center}
#toast.show{opacity:1}
#toast.bad{border-color:var(--bad);color:#ffd9cf}
#toast.good{border-color:var(--good)}
.tip{bottom:6px}
#next{background:#1f3350;border:1px solid var(--acc);border-radius:12px;padding:8px 11px;margin:8px 0;font-size:13.2px}
#next b{color:var(--gold)}
h3{font-size:13px;margin:12px 0 2px;color:var(--soft);text-transform:uppercase;letter-spacing:.05em}
.sel{width:100%;background:var(--panel2);color:var(--text);border:1px solid var(--line);border-radius:8px;padding:6px;font:inherit}
table.res{width:100%;border-collapse:collapse;font-size:12.3px;margin:6px 0}
table.res th,table.res td{padding:3px 4px;border-bottom:1px solid var(--line);text-align:right}
table.res th:first-child,table.res td:first-child{text-align:left}
.note{color:var(--muted);font-size:12px}
.bar{height:8px;background:#0e1824;border:1px solid var(--line);border-radius:6px;overflow:hidden;margin:3px 0}
.bar i{display:block;height:100%;background:var(--acc);width:0}
.bits{display:flex;flex-wrap:wrap;gap:5px;margin:6px 0}
.bits .btn{padding:5px 9px;min-height:34px;font-size:12.5px}
.job{background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:7px 10px;font-size:12.5px;margin:6px 0}
.job b{color:var(--gold)}
.shop{display:grid;gap:5px;margin:6px 0}
.shop .btn{display:flex;justify-content:space-between;gap:8px;text-align:left;font-size:12.5px;min-height:34px}
.shop .btn[disabled]{opacity:.55;cursor:default}
@media (max-width:820px){
 #hud-title{left:6px;top:6px;padding:5px 9px 5px 7px;gap:6px;font-size:13px;border-radius:10px}
 #hud-title svg{width:20px;height:20px}
 #hud-tasks{left:6px;top:46px;width:min(55%,190px);padding:3px 5px 5px}
 #tk-list li{padding:3px 4px;font-size:11.5px;grid-template-columns:20px 1fr auto;gap:5px}
 #tk-list li i{width:16px;height:16px;border-width:2px}
 #tk-list li.done i::after{left:3px;top:0;width:4px;height:8px;border-width:0 2px 2px 0}
 .tk-head{font-size:12px;padding:3px 4px}
 #hud-stats{right:6px;top:6px;gap:4px;flex-wrap:wrap;justify-content:flex-end;max-width:58%}
 .pill{padding:3px 8px;gap:5px;font-size:12px;border-radius:9px}
 .pill svg{width:16px;height:16px}
 .xp{width:46px;height:6px}
 #hud{bottom:26px;left:6px}
 #hud .btn{padding:3px 7px;min-height:28px;font-size:11.5px}
 #toast{bottom:62px;font-size:12px}
}