/* admin.client HUD v3 (DESIGN; spec 10): one Dota 2-style HUD, no floating controls.
   Regions: thin top bar (topleft · top · topright), bottom frame (minimap · console · tools), feed (left edge),
   query (left pop-out), modal (settings, timeline, scoreboard, gate, menus, confirms). Loaded after hud.css. */
:root { --mm: 1; }

/* ---------- retired floating pieces ---------- */
.hud2 .cmdbar, .hud2 .help, .hud2 .atlas, .hud2 .toasts, .hud2 .possess, .hud2 .proj, .hud2 .insp-l3 { display: none !important; }
.hud2 .plate { pointer-events: none; }

/* ---------- top bar ---------- */
.hud2 .tabs { padding: 0 8px; gap: 8px; }
.tabs .tl, .tabs .tr { display: flex; align-items: center; gap: 6px; position: relative; flex: none; }
.tabs .menubtn, .tabs .setbtn { height: 30px; padding: 0 10px; background: linear-gradient(180deg, #24170f, #0b0705); border: 1px solid var(--trim-dim); color: var(--hot);
  font-family: var(--label); font-size: 11px; letter-spacing: .12em; cursor: pointer; }
.tabs .setbtn { font-size: 16px; padding: 0 8px; }
.tabs .menubtn:hover, .tabs .setbtn:hover { border-color: var(--trim); color: var(--trim); }
.tabs .menu-dd { position: absolute; left: 0; top: calc(100% + 6px); min-width: 200px; display: flex; flex-direction: column; padding: 6px; z-index: 30;
  background: linear-gradient(180deg, var(--panel-hi), var(--panel-lo)); border: 1px solid var(--trim-dim); box-shadow: 0 0 0 1px #000, 0 8px 20px rgba(0,0,0,.7); }
.tabs .menu-dd[hidden] { display: none; }
.tabs .menu-dd button { text-align: left; background: none; border: 0; border-left: 2px solid transparent; color: var(--hot); font-family: var(--label); font-size: 11px; letter-spacing: .12em; padding: 7px 10px; cursor: pointer; opacity: .85; clip-path: none; }
.tabs .menu-dd button:hover, .tabs .menu-dd button.on { opacity: 1; color: var(--trim); border-left-color: var(--trim); background: rgba(200,164,90,.06); }
.tabs .menu-dd hr { border: 0; border-top: 1px solid var(--trim-dim); margin: 4px 0; }
.actmode .tabs .menu-dd .builder { display: none; }
.tabs .quitbtn { height: 30px; padding: 0 12px; background: linear-gradient(180deg, #3a160a, #120604); border: 1px solid var(--red); color: var(--hot); font-family: var(--label); font-size: 11px; letter-spacing: .12em; cursor: pointer; }
.tabs .quitbtn:hover { background: var(--red); color: #000; }
.tabs .chip.net { height: 24px; display: inline-flex; align-items: center; }
.tabs .topcentre { justify-content: center; }
.seat .mode { position: absolute; left: 0; right: 0; top: 0; text-align: center; font-family: var(--label); font-size: 7px; letter-spacing: .1em; background: var(--red); color: #000; }
.seat .det { font-family: var(--mono); font-size: 8.5px; color: var(--esp-hot); text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.adminbox.details { height: 64px; }

/* ---------- bottom frame (compendium style) ---------- */
.frame { position: absolute; left: 0; right: 0; bottom: 0; zoom: var(--hud, 1); display: grid; grid-template-columns: calc(214px * var(--mm)) minmax(0, 1fr) 232px; align-items: end; pointer-events: none; z-index: 2; }
.frame > * { pointer-events: auto; }
.frame::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 8px; background: linear-gradient(90deg, transparent, var(--trim-dim) 20%, var(--trim-dim) 80%, transparent); pointer-events: none; }

/* minimap */
.r-minimap { position: relative; height: calc(214px * var(--mm)); margin: 0 0 6px 6px; background: #060303; border: 1px solid var(--bevel); box-shadow: 0 0 0 1px #000, inset 0 0 0 1px var(--trim-dim), 0 6px 18px rgba(0,0,0,.6); }
.mm-canvas { position: absolute; inset: 4px 34px 4px 4px; width: calc(100% - 38px); height: calc(100% - 8px); cursor: pointer; }
.mm-btns { position: absolute; right: 3px; top: 4px; bottom: 4px; width: 28px; display: flex; flex-direction: column; gap: 4px; justify-content: flex-end; }
.mm-btns button { width: 28px; height: 28px; display: grid; place-items: center; padding: 0; cursor: pointer; background: radial-gradient(ellipse at 50% 35%, #2a1a13, #0b0705); border: 1px solid var(--trim-dim); color: var(--trim); }
.mm-btns button:hover { border-color: var(--trim); }
.mm-btns button[hidden] { display: none; }
.mm-btns .mm-vis { color: var(--esp-hot); border-color: #2a4a5e; }
.mm-btns .mm-vis.off { color: #7a6a62; border-color: #3a2a1c; background: repeating-linear-gradient(135deg, #0b0705 0 4px, #140c09 4px 8px); }

/* console */
.r-console { position: relative; display: flex; justify-content: center; min-width: 0; padding: 0 8px; }
.r-console .unit { position: relative; left: auto !important; bottom: auto; transform: none; zoom: 1; width: min(940px, 100%); min-width: 0; margin: 0 auto; }
.r-console .buffs { position: absolute; left: 50% !important; bottom: calc(100% + 6px) !important; transform: translateX(-50%); zoom: 1; max-width: 100%; }
.r-console .settings { position: absolute; left: 50% !important; bottom: calc(100% + 44px); transform: translateX(-50%); zoom: 1; width: min(760px, 100%); }
.u-ctl { margin-left: auto; display: inline-flex; gap: 5px; }
.u-ctl button { height: 22px; padding: 0 9px; font-family: var(--label); font-size: 9.5px; letter-spacing: .1em; cursor: pointer; display: inline-flex; align-items: center; gap: 4px;
  background: #120a07; color: var(--hot); border: 1px solid var(--trim-dim); }
.u-ctl button.act { background: linear-gradient(180deg, #3a160a, #120604); border-color: var(--red); }
.u-ctl button.exit { background: linear-gradient(180deg, #ff4a2a, #8a1408); border-color: #ffb199; color: #fff; }
.u-ctl button.talent { color: #ffe7b0; border-color: var(--trim); }
.u-ctl button.talent.on { background: linear-gradient(180deg, #e6c47a, #9c7a3c); color: #140c05; }
.u-bar.self span { color: var(--hot); opacity: .75; font-weight: 400; letter-spacing: .06em; }
.u-bar.self { background: repeating-linear-gradient(135deg, #0b0605 0 6px, #120907 6px 12px); }
.u-inv.self { display: flex; align-items: center; }
.u-inv.self .self-note { font-family: var(--mono); font-size: 10.5px; line-height: 1.5; opacity: .7; margin: 0; }
body.no-hotkeys .ab kbd, body.no-hotkeys .tool kbd { display: none; }

/* tools (3×2 "inventory") + ARMORY shop button */
.r-tools { position: relative; display: flex; flex-direction: column; gap: 5px; margin: 0 6px 6px 0; padding: 8px; background: linear-gradient(180deg, var(--panel-hi), var(--panel-lo));
  border: 1px solid var(--bevel); box-shadow: 0 0 0 1px #000, inset 0 1px 0 rgba(255,220,170,.06), 0 6px 18px rgba(0,0,0,.6); }
.tgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; }
.tool { position: relative; height: 54px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; padding: 0; cursor: pointer; color: var(--hot);
  background: linear-gradient(180deg, #1a100c, #070404); border: 1px solid #000; box-shadow: 0 0 0 1px #3a2a1c, inset 0 0 10px #000; }
.tool .ic { color: var(--trim); }
.tool span { font-family: var(--label); font-size: 8px; letter-spacing: .1em; }
.tool kbd { position: absolute; left: 2px; top: 2px; font-size: 8.5px; padding: 0 3px; line-height: 11px; }
.tool:hover:not(:disabled) { box-shadow: 0 0 0 1px var(--trim), inset 0 0 10px #000; }
.tool.on { box-shadow: 0 0 0 1px var(--esp), 0 0 10px rgba(54,182,255,.35); }
.tool.on .ic { color: var(--esp-hot); }
.tool:disabled { opacity: .4; cursor: default; }
.tool.empty { box-shadow: 0 0 0 1px #1d130e; background: repeating-linear-gradient(135deg, #0b0705 0 4px, #0e0806 4px 8px); }
.shopbtn { height: 34px; display: flex; align-items: center; justify-content: center; gap: 8px; cursor: pointer; font-family: var(--label); font-size: 12px; letter-spacing: .16em; color: #140c05;
  background: linear-gradient(180deg, #e6c47a, #9c7a3c); border: 1px solid #f2d898; }
.shopbtn[hidden] { display: none; }

/* ---------- feed (left edge) ---------- */
.r-feed { position: absolute; left: 8px; top: 8px; width: 300px; max-height: 42%; zoom: var(--hud, 1); display: flex; flex-direction: column; gap: 4px; pointer-events: auto; z-index: 2; }
.feed-sticky:empty { display: none; }
.r-feed .tracker { position: relative; left: auto !important; top: auto !important; transform: none !important; zoom: 1; min-width: 0; width: 100%; }
.feed-list { display: flex; flex-direction: column; gap: 3px; overflow: hidden; }
.r-feed:hover .feed-list { overflow-y: auto; max-height: 40vh; }
.fe { display: flex; gap: 6px; align-items: flex-start; padding: 4px 8px; font-family: var(--mono); font-size: 10.5px; line-height: 1.4; color: var(--hot);
  background: linear-gradient(90deg, rgba(10,5,4,.9), rgba(10,5,4,.55)); border-left: 2px solid var(--trim-dim); transition: opacity .6s; }
.fe i { flex: none; color: var(--trim); padding-top: 1px; }
.fe.err { border-left-color: var(--warn); color: var(--warn); } .fe.err i { color: var(--warn); }
.fe.proof { border-left-color: #f2d898; color: #ffe7b0; } .fe.release { border-left-color: var(--esp); } .fe.release i { color: var(--esp-hot); }
.fe.pin { border-left-color: var(--trim); } .fe.admin i { color: var(--esp-hot); }
.fe.old { opacity: 0; height: 0; padding: 0; overflow: hidden; }
.r-feed:hover .fe.old { opacity: .55; height: auto; padding: 4px 8px; }

/* ---------- query (left pop-out) ---------- */
.r-query { position: absolute; left: 8px; bottom: calc(214px * var(--mm) + 16px); width: 360px; max-height: calc(58% - 20px); overflow: auto; zoom: var(--hud, 1); pointer-events: auto; z-index: 2;
  background: linear-gradient(180deg, var(--panel-hi), var(--panel-lo)); border: 1px solid var(--bevel); box-shadow: 0 0 0 1px #000, 0 6px 18px rgba(0,0,0,.6); }
.r-query[hidden] { display: none; }
.r-query .worldedit { position: relative; right: auto; top: auto; width: 100%; max-height: none; zoom: 1; box-shadow: none; border: 0; }
.q-deep .q-body { padding: 8px 10px; }
.q-deep pre { margin: 0 0 6px; white-space: pre-wrap; font-family: var(--mono); font-size: 10.5px; color: var(--esp-hot); }
.q-deep h5 { margin: 8px 0 3px; font-weight: 400; font-size: 9.5px; letter-spacing: .14em; color: var(--trim); }
.q-deep p { margin: 0 0 2px; font-size: 10.5px; }

/* ---------- modal region ---------- */
.r-modal { position: fixed; inset: 0; pointer-events: none; z-index: 40; }
.r-modal > * { pointer-events: auto; }
.r-modal .timeline { position: fixed; left: 50%; top: 50%; right: auto; transform: translate(-50%, -50%); width: 860px; max-width: calc(100vw / var(--hud, 1) - 40px); max-height: calc(100vh / var(--hud, 1) - 140px); zoom: var(--hud, 1); }
.ctxmenu { position: fixed; zoom: var(--hud, 1); min-width: 230px; background: linear-gradient(180deg, var(--panel-hi), var(--panel-lo)); border: 1px solid var(--trim-dim); box-shadow: 0 0 0 1px #000, 0 8px 22px rgba(0,0,0,.7); }
.ctxmenu[hidden] { display: none; }
.ctxmenu header { padding: 6px 10px; font-family: var(--label); font-size: 10px; letter-spacing: .14em; color: var(--trim); border-bottom: 1px solid var(--trim-dim); }
.ctxmenu button { width: 100%; display: flex; align-items: center; gap: 8px; text-align: left; background: none; border: 0; color: var(--hot); padding: 7px 10px; cursor: pointer; font-family: var(--label); font-size: 10.5px; letter-spacing: .08em; }
.ctxmenu button:hover:not(:disabled) { background: rgba(200,164,90,.1); color: var(--trim); }
.ctxmenu button:disabled { opacity: .45; cursor: not-allowed; }
.ctxmenu button em { margin-left: auto; color: var(--warn); font-style: normal; }
.confirm { position: fixed; inset: 0; display: grid; place-items: center; background: rgba(0,0,0,.55); }
.confirm[hidden] { display: none; }
.cf-box { zoom: var(--hud, 1); width: 360px; padding: 16px 18px; background: linear-gradient(180deg, var(--panel-hi), var(--panel-lo)); border: 1px solid var(--trim-dim); border-top: 2px solid var(--red); color: var(--hot); }
.cf-box h3 { margin: 0 0 6px; font-family: var(--font); font-weight: 400; color: var(--red); font-size: 18px; }
.cf-box p { margin: 0 0 12px; font-family: var(--mono); font-size: 11.5px; line-height: 1.5; }
.cf-acts { display: flex; gap: 6px; justify-content: flex-end; }
.cf-acts button, .acct-acts button, .hk-top button { background: #120a07; color: var(--hot); border: 1px solid var(--trim-dim); font-family: var(--label); font-size: 10px; letter-spacing: .12em; padding: 7px 12px; cursor: pointer; display: inline-flex; gap: 6px; align-items: center; }
.cf-acts .danger, .acct-acts .danger { background: linear-gradient(180deg, #ff4a2a, #8a1408); border-color: #ffb199; color: #fff; }

/* scoreboard (hold TAB) */
.scoreboard { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 960px; max-width: calc(100vw / var(--hud, 1) - 40px); max-height: calc(100vh / var(--hud, 1) - 140px); overflow: auto; zoom: var(--hud, 1);
  background: linear-gradient(180deg, rgba(29,19,16,.97), rgba(6,3,3,.97)); border: 1px solid var(--trim-dim); box-shadow: 0 0 0 1px #000, 0 10px 30px rgba(0,0,0,.8); color: var(--hot); }
.scoreboard[hidden] { display: none; }
.scoreboard header { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-bottom: 1px solid var(--trim-dim); background: linear-gradient(180deg, #2a1a13, #120a07); }
.scoreboard header b { font-family: var(--font); font-weight: 400; color: var(--trim); font-size: 16px; letter-spacing: .06em; }
.scoreboard header span { font-family: var(--mono); font-size: 10px; opacity: .6; }
.scoreboard header button { margin-left: auto; background: none; border: 1px solid var(--trim-dim); color: var(--hot); width: 24px; height: 24px; display: grid; place-items: center; cursor: pointer; padding: 0; }
.scoreboard table { width: 100%; border-collapse: collapse; font-size: 11px; }
.scoreboard th { text-align: left; font-family: var(--label); font-weight: 400; font-size: 9px; letter-spacing: .14em; color: var(--trim); padding: 6px 10px; border-bottom: 1px solid #2a1c14; }
.scoreboard td { padding: 6px 10px; border-bottom: 1px solid #1d130e; font-family: var(--mono); vertical-align: middle; }
.scoreboard td b { font-family: var(--font); font-weight: 400; color: var(--red); font-size: 13px; }
.scoreboard tr.home td b { color: #ffe7b0; } .scoreboard tr.stale { opacity: .5; }
.scoreboard td i { display: inline-block; width: 7px; height: 7px; margin-right: 3px; }
.scoreboard td.mobs { display: flex; flex-wrap: wrap; gap: 4px; }
.scoreboard td button { background: #120a07; color: var(--hot); border: 1px solid #3a2a1c; font-family: var(--mono); font-size: 10.5px; padding: 2px 7px; cursor: pointer; text-transform: uppercase; }
.scoreboard td button:hover { border-color: var(--trim); }
.scoreboard td button code { font-size: 9px; opacity: .6; text-transform: none; }
.scoreboard td button em { font-style: normal; font-size: 8.5px; color: var(--esp-hot); }
.scoreboard p { padding: 12px; font-family: var(--mono); font-size: 11px; opacity: .7; }

/* ⚙ settings */
.setmodal { position: fixed; inset: 0; display: grid; place-items: center; background: rgba(0,0,0,.55); }
.setmodal[hidden] { display: none; }
.sm-box { zoom: var(--hud, 1); width: 780px; max-width: calc(100vw / var(--hud, 1) - 40px); max-height: calc(100vh / var(--hud, 1) - 80px); display: flex; flex-direction: column; color: var(--hot);
  background: linear-gradient(180deg, var(--panel-hi), var(--panel-lo)); border: 1px solid var(--trim-dim); box-shadow: 0 0 0 1px #000, 0 10px 30px rgba(0,0,0,.8); }
.sm-box > header { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-bottom: 1px solid var(--trim-dim); background: linear-gradient(180deg, #2a1a13, #120a07); }
.sm-box > header .ic { color: var(--trim); }
.sm-box > header b { font-family: var(--font); font-weight: 400; color: var(--trim); font-size: 16px; }
.sm-box nav { display: flex; gap: 2px; margin-left: 12px; }
.sm-box nav button { background: none; border: 0; border-bottom: 2px solid transparent; color: var(--hot); opacity: .6; font-family: var(--label); font-size: 10.5px; letter-spacing: .12em; padding: 6px 10px; cursor: pointer; }
.sm-box nav button.on { opacity: 1; color: var(--trim); border-bottom-color: var(--trim); }
.sm-box .x { margin-left: auto; background: none; border: 1px solid var(--trim-dim); color: var(--hot); width: 24px; height: 24px; display: grid; place-items: center; padding: 0; cursor: pointer; }
.sm-body { padding: 12px 14px; overflow: auto; }
.hk-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.hk-warn { color: var(--red); font-family: var(--mono); font-size: 11px; margin: 0 0 8px; display: flex; gap: 6px; align-items: center; }
.hk-groups { columns: 2; column-gap: 18px; }
.hk-group { break-inside: avoid; margin-bottom: 10px; }
.hk-group h5 { margin: 0 0 4px; font-weight: 400; font-size: 9.5px; letter-spacing: .16em; color: var(--trim); }
.hk-row { display: grid; grid-template-columns: 1fr 64px 64px; gap: 4px; align-items: center; padding: 2px 0; font-family: var(--mono); font-size: 11px; }
.hk-row.bad span { color: var(--red); }
.hk-key { height: 22px; background: #000; color: #fff; border: 1px solid #3a2a1c; font-family: var(--mono); font-size: 10.5px; cursor: pointer; }
.hk-key:hover { border-color: var(--trim); }
.hk-key.wait { border-color: var(--esp); color: var(--esp-hot); animation: hkblink 1s steps(2) infinite; }
.hk-key.bad { border-color: var(--red); color: var(--red); }
@keyframes hkblink { 50% { opacity: .5; } }
.hk-note { font-family: var(--mono); font-size: 10.5px; line-height: 1.5; opacity: .65; margin: 8px 0 0; }
.sm-body .tog { display: flex; align-items: center; gap: 8px; font-size: 10.5px; letter-spacing: .1em; margin: 8px 0; }
.sm-body .tog small { font-family: var(--mono); letter-spacing: 0; opacity: .6; }
.sm-body .sl { display: grid; grid-template-columns: 180px 1fr 60px; gap: 10px; align-items: center; margin: 8px 0; font-size: 10.5px; letter-spacing: .1em; }
.sm-body .sl input { accent-color: var(--trim); }
.sm-body .sl b { font-family: var(--mono); color: #fff; }
.acct { display: grid; grid-template-columns: 150px 1fr; gap: 5px 12px; font-size: 10.5px; margin: 0 0 12px; }
.acct dt { letter-spacing: .12em; color: var(--trim); } .acct dd { margin: 0; font-family: var(--mono); }
.acct-acts { display: flex; gap: 8px; }
.hud2 .tabs .chip.cam { display: none !important; }
.u-main header { flex-wrap: wrap; row-gap: 3px; }
.u-main header b { max-width: 100%; }
.ab small { max-width: 62px; overflow: hidden; text-overflow: ellipsis; left: 50%; right: auto; transform: translateX(-50%); }
.r-console .unit:not(.seq) { height: 184px; }
