/* =========================================================
   Co-op (docs/coop.md; src/ui/coop.js): the partner on screen
   ========================================================= */
/* each partner has one colour with one job: its ring, the bar over its head, its plate. Blue is always you. The first
   partner is teal; with four players the others are violet (.mate-c1) and amber (.mate-c2) */
:root{
  --mate:#1fa59a; --mate-hi:#7fe3d6; --mate-lo:#0f6e66;
  --g-mate:linear-gradient(180deg,#9df2e6 0%,#2fbcac 45%,#107a70 100%);
}
.mate-c1{--mate:#8a5cd6;--mate-hi:#c9b0ff;--mate-lo:#5a3a9a;--g-mate:linear-gradient(180deg,#e2d6ff 0%,#9f7ae8 45%,#5a3a9a 100%)}
.mate-c2{--mate:#d98a1c;--mate-hi:#ffd27a;--mate-lo:#8f5608;--g-mate:linear-gradient(180deg,#ffe2a6 0%,#e9a43c 45%,#93590a 100%)}

/* the bar over the partner's head: teal, with its name above it */
.ub.mate .ub-track{width:62px;height:12px}
.ub.mate .ub-track>i{background:var(--g-mate)}
.ub.mate .ub-tag{background:none;border:0;box-shadow:none;padding:0;text-transform:none;letter-spacing:0;
  font:400 15px/1 var(--f-display);color:var(--mate-hi);-webkit-text-stroke:4px var(--ink);paint-order:stroke fill}

/* "You" over your own gladiator's bar while there are partners (ui/coop.js), and over your fighter on the party stage */
.ub .ub-you,.pp-you{display:block;width:max-content;margin:0 auto 3px;padding:2px 9px 3px;border:var(--line-xs) solid var(--ink);border-radius:999px;
  background:linear-gradient(180deg,#9cc2ff,#3f7ff0);color:#fff;font:400 15px/1 var(--f-display);-webkit-text-stroke:3px var(--ink);paint-order:stroke fill;box-shadow:0 2px 0 var(--ink)}
.pp-you{position:fixed;left:0;top:0;z-index:4;margin:0;font-size:19px;padding:3px 12px 4px;pointer-events:none}
.pp-you[hidden]{display:none}

/* the partners' plates: under yours, smaller, stacked (up to three) */
.hud-mates{grid-column:1;grid-row:2;justify-self:start;display:grid;gap:4px;width:min(260px,100%);margin-top:-2px;pointer-events:none}
.hud-mates[hidden]{display:none}
.hud-mate{
  display:flex;align-items:center;gap:8px;
  padding:5px 12px 7px 5px;pointer-events:auto;cursor:default;
  background:var(--g-paper);border:var(--line-s) solid var(--ink);border-radius:14px;box-shadow:var(--lip),var(--drop-s);
}
.hud-mate .medal{width:38px;height:38px;border-width:var(--line-s);background:var(--g-mate)}
.hud-mate .medal .ic{width:26px;height:26px}
.hud-mate .hm-main{flex:1;min-width:0;display:grid;gap:3px}
.hud-mate .hm-top{display:flex;align-items:center;gap:6px;min-width:0}
.hud-mate .who{font-size:20px}
.hm-tag{
  flex:none;font:var(--w-strong) var(--t-micro)/1 var(--f-ui);letter-spacing:var(--ls-caps);text-transform:uppercase;color:#fff;
  padding:3px 7px;border:var(--line-xs) solid var(--ink);border-radius:999px;background:linear-gradient(180deg,var(--mate),var(--mate-lo));
}
.hud-mate .bar{height:12px}
.hud-mate .bar.hp>i{background:var(--g-mate)}
.hud-mate .bar>b.ghost{transition:none}
.hud-mate[data-st="down"] .hm-tag{background:linear-gradient(180deg,#8b6f7c,var(--ink-2))}
.hud-mate[data-st="down"] .medal{filter:grayscale(.8)}
.hud-mate[data-st="choosing"] .hm-tag{background:var(--g-gold);color:var(--ink)}
.hud-mate[data-st="ready"] .hm-tag{background:var(--g-laurel)}
/* three partners: slimmer plates */
.hud-mates[data-n="3"] .hud-mate{padding:3px 10px 4px 4px;gap:6px}
.hud-mates[data-n="3"] .medal{width:30px;height:30px}
.hud-mates[data-n="3"] .medal .ic{width:20px;height:20px}
.hud-mates[data-n="3"] .who{font-size:17px}
.hud-mates[data-n="3"] .bar{height:9px}

/* the team's damage (ui/damage.js teamHTML: the Stats panel, the death and victory screens): you in blue, each partner in
   their colour */
.dmg-team .dmg-dot{width:12px;height:12px;margin:3px;border-radius:50%;border:var(--line-xs) solid var(--ink);background:linear-gradient(180deg,#9cc2ff,#3f7ff0)}
.dmg-team .dmg-bar>i{background:linear-gradient(180deg,#9cc2ff,#3f7ff0)}
.dmg-team .mate .dmg-dot,.dmg-team .mate .dmg-bar>i{background:var(--g-mate)}
.dmg-team .me .dmg-name{color:var(--ink)}

/* the round waits for the partner's pick */
.coop-wait{
  position:fixed;left:50%;top:calc(env(safe-area-inset-top,0px) + 150px);translate:-50% 0;z-index:5;display:flex;align-items:center;gap:8px;
  padding:6px 16px 7px 8px;border:var(--line-s) solid var(--ink);border-radius:999px;background:var(--g-paper);box-shadow:var(--lip),var(--drop-s);
  font:var(--w-strong) var(--t-body)/1 var(--f-ui);color:var(--ink);pointer-events:none;white-space:nowrap;
}
.coop-wait .ic{width:26px;height:26px}
.coop-wait[hidden]{display:none}

/* the partner's state on the card screen: a chip beside the round's result (a phone only; on a wide screen the plate says it) */
.draft-sub .mate-chip{display:none;background:var(--g-paper)}
.draft-sub .mate-chip .ic{background:var(--g-mate);border-radius:50%}
.draft-sub .mate-chip em{font:var(--w-strong) var(--t-micro)/1 var(--f-ui);font-style:normal;letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--ink-2);margin-left:4px}
.draft-sub .mate-chip[data-st="choosing"] em{color:var(--gold-lo)}

@media (max-width:600px){
  body.coop[data-screen="draft"] .hud-mates{display:none}
  .draft-sub .mate-chip{display:inline-flex;align-items:center}
  body.coop .hud{grid-template-areas:"life round btns" "glory round btns" "mate mate btns"}
  .hud-mates{grid-area:mate;width:auto;margin-top:0;display:flex;flex-wrap:wrap;gap:4px}
  .hud-mate{padding:4px 10px 5px 4px;gap:6px}
  .hud-mate .medal{width:30px;height:30px}
  .hud-mate .medal .ic{width:20px;height:20px}
  .hud-mate .who{font-size:16px}
  .hud-mate .hm-tag{font-size:10.5px;padding:2px 6px}
  .hud-mate .bar{height:10px;width:110px}
  .hud-mates[data-n="2"] .hud-mate .bar,.hud-mates[data-n="3"] .hud-mate .bar{width:56px}
  .hud-mates[data-n="2"] .hud-mate .hm-tag,.hud-mates[data-n="3"] .hud-mate .hm-tag{display:none}
  .coop-wait{top:calc(env(safe-area-inset-top,0px) + 200px);font-size:var(--t-label)}
  .ub.mate .ub-track{width:50px;height:10px}
}

/* ---------- the room (src/ui/lobby.js): make one or join one; then the card says what is happening until the lobby is ready ---------- */
/* a friend's link while the game loads: the logo, not the menu (index.html; "Joining room…" comes next) */
html.joining #scr-title :is(.title-actions,.title-goal){visibility:hidden}
#scr-coop .menu-card{width:min(520px,100%);grid-template-columns:minmax(0,1fr)}
#scr-coop .or{font:800 14px/1 var(--f-ui);color:var(--ink-2);margin-top:4px}
#scr-coop .or[hidden],#scr-coop .join[hidden],#scr-coop [hidden]{display:none}
#scr-coop .join{display:flex;gap:8px}
#scr-coop .join input{flex:1;min-width:0;font:400 24px/1 var(--f-display);letter-spacing:.18em;text-transform:uppercase;color:var(--ink);background:#fff;border:var(--line-s) solid var(--ink);border-radius:999px;padding:9px 16px}
#scr-coop .join .btn{min-height:48px;padding:0 20px;font-size:20px}
/* a problem, at the top of the form: what went wrong (bold), then what to do next. Words on a plate, no alarm colour */
#scr-coop .coop-msg{margin:0;padding:10px 14px;border-radius:12px;background:var(--paper-2);font:800 15px/1.35 var(--f-ui);color:var(--ink-2);text-align:left}
#scr-coop .coop-msg b{color:var(--ink)}
#scr-coop .coop-msg:empty{display:none}
/* your name in the room (ui/lobby.js) */
#scr-coop .coop-name{display:grid;gap:4px;text-align:left}
#scr-coop .coop-name span{font:800 12px/1 var(--f-ui);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
#scr-coop .coop-name input{min-width:0;font:400 22px/1 var(--f-display);color:var(--ink);background:#fff;border:var(--line-s) solid var(--ink);border-radius:999px;padding:9px 16px}
/* busy ("Creating room…", "Joining Mike's room…"): the card keeps its size and the words take its place, so nothing jumps;
   then, ready, the card steps back and the lobby comes in */
.coop-card .coop-busy{position:absolute;inset:0;z-index:1;display:grid;place-content:center;justify-items:center;gap:10px;padding:32px 28px;border-radius:inherit;
  background:var(--g-paper);text-align:center;opacity:0;visibility:hidden;transition:opacity .18s var(--out),visibility 0s .18s}
.coop-card .coop-busy b{font:400 30px/1.05 var(--f-display);color:var(--ink);text-wrap:balance}
.coop-card .coop-busy small{min-height:1.2em;font:800 15px/1.2 var(--f-ui);color:var(--ink-2)}
.coop-card[data-state="busy"] .coop-busy{opacity:1;visibility:visible;transition:opacity .18s var(--out)}
.coop-card[data-state="busy"]>:not(.coop-busy,.ribbon){visibility:hidden}
.coop-card .ribbon{z-index:2}
/* ready: the card, copied over the new screen where it stood, steps back as the lobby comes in (ui/lobby.js enter) */
.menu-card.coop-ghost{position:fixed;z-index:60;margin:0;box-sizing:border-box;animation:none;pointer-events:none}
.menu-card.coop-ghost.leaving{animation:coop-out .22s var(--out) forwards}
@keyframes coop-out{to{opacity:0;transform:scale(.97)}}
.coop-spin{display:inline-block;flex:none;width:26px;height:26px;box-sizing:border-box;border:4px solid rgba(42,26,46,.16);border-top-color:var(--ink);border-radius:50%;animation:coop-spin .8s linear infinite}
@keyframes coop-spin{to{transform:rotate(1turn)}}

/* the plates in a row (the win's: ui/coop.js): a crown for the host, the name, and a word for where it stands */
.pp{position:absolute;left:0;top:0;display:grid;justify-items:center;gap:3px;min-width:132px;max-width:200px;padding:7px 12px 8px;
  border:var(--line-s) solid var(--ink);border-radius:14px;background:var(--g-paper);box-shadow:inset 0 4px 0 var(--mate),var(--drop-s);
  text-align:center;font:800 13px/1.2 var(--f-ui);color:var(--ink-2);will-change:transform}
.pp b{max-width:100%;font:400 20px/1 var(--f-display);color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pp small{max-width:100%;font:inherit;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pp em{font-style:normal;font-size:11px;letter-spacing:.06em;text-transform:uppercase;padding:2px 9px;border-radius:999px;border:var(--line-xs) solid var(--ink);background:var(--g-gold);color:var(--ink)}
.pp[data-st="ready"] em{background:var(--g-laurel);color:#fff}
.pp-crown{position:absolute;top:-17px;left:50%;translate:-50% 0;display:grid;place-items:center;width:30px;height:30px;border:var(--line-xs) solid var(--ink);border-radius:50%;background:var(--g-gold)}
.pp-crown .ic{width:18px;height:18px}

/* the party on the stage (ui/party.js): over each partner's head its name in its colour (as "You" is in yours), a crown
   for the host, and Picking or Ready; the next free place on the floor line says "+ Invite", a friend still connecting
   "Joining…". A name is never wider than a place (--slot) */
.party-plates{position:fixed;inset:0;pointer-events:none;z-index:4}
.party-plates[hidden]{display:none}
.party-plates .pp{display:flex;align-items:center;gap:6px;min-width:0;max-width:var(--slot,220px);padding:3px 5px 3px 10px;border:var(--line-xs) solid var(--ink);border-radius:999px;
  background:var(--g-mate);box-shadow:0 2px 0 var(--ink);font:800 12px/1 var(--f-ui);white-space:nowrap;transition:opacity .18s var(--out)}
/* over the rail, the card or the name while the camera moves, or its gladiator not there yet: out of the way */
.party-plates .pp.off{opacity:0;pointer-events:none}
.party-plates .pp b{min-width:0;font-size:17px;color:#fff;-webkit-text-stroke:3px var(--ink);paint-order:stroke fill}
.party-plates .pp em{flex:none;font-size:10.5px;padding:2px 7px 3px;background:var(--g-paper);color:var(--ink-2)}
.party-plates .pp[data-st="ready"] em{background:var(--g-laurel);color:#fff}
/* in the Armory (ui/lobby.js): the Armory's mark and the words; where places are tight, the mark alone */
.party-plates .pp em .ic{display:none}
.party-plates .pp[data-st="armory"] em{display:inline-flex;align-items:center;gap:3px;padding-left:4px}
.party-plates .pp[data-st="armory"] em .ic{display:block;width:15px;height:15px;flex:none}
.party-plates.tight .pp[data-st="armory"] em{width:auto;height:auto;padding:0;border:0;background:none}
.party-plates.tight .pp[data-st="armory"] em .ic{width:18px;height:18px}
/* tight places (four players, a phone): Ready is a tick beside the name (the word stays for a screen reader); Picking, nothing */
.party-plates.tight .pp em{display:grid;place-items:center;width:16px;height:16px;padding:0;font-size:0}
.party-plates.tight .pp[data-st="ready"] em::after{content:"\2713";font-size:10px;line-height:1}
.party-plates.tight .pp[data-st="picking"] em{display:none}
.party-plates .pp-crown{position:static;translate:none;flex:none;width:22px;height:22px;margin-left:-6px}
.party-plates .pp-crown .ic{width:14px;height:14px}
.party-plates .pp:is(.invite,.pending){padding:6px 14px 7px;background:rgba(255,250,240,.82);box-shadow:var(--drop-s);font:400 18px/1 var(--f-display);color:var(--ink)}
.party-plates .pp.invite{pointer-events:auto;cursor:pointer;border-style:dashed;transition:background .12s var(--out)}
.party-plates .pp.invite:hover{background:var(--g-paper)}
.party-plates .pp.invite:active{scale:.97}
.party-plates .pp.pending .coop-spin{width:16px;height:16px;border-width:3px}
.pp-plus{font:400 22px/.8 var(--f-display);color:var(--ink)}
/* the lobby's first showing (ui/party.js partyOn enter): the stage (the camera's move), then the party, then the panels */
.party-plates.pre .pp,.party-plates.pre~.pp-you{opacity:0}
.party-plates.in .pp{animation:lb-pop .24s var(--out) backwards;animation-delay:calc(var(--k,0) * 70ms)}
@keyframes lb-pop{from{opacity:0;scale:.9}}
#scr-rebirth.lobby-in .cs-rail{animation:lb-from-l .3s var(--out) .62s backwards}
#scr-rebirth.lobby-in .cs-panel{animation:lb-from-r .3s var(--out) .62s backwards}
#scr-rebirth.lobby-in :is(.rb-sub,.rb-meta,.party-row){animation:lb-up .3s var(--out) .66s backwards}
#scr-rebirth.lobby-in .rb-name{animation:lb-name .5s var(--pop) .62s backwards}
/* held while the room's card still stands over the new stage (ui/party.js partyOn, then partyEnter) */
#scr-rebirth.lobby-hold :is(.cs-rail,.cs-panel,.rb-name,.rb-sub,.rb-meta,.party-row){opacity:0}
/* the name's stamp (select.css rb-name-in), again for the lobby's later beat */
@keyframes lb-name{from{transform:translateY(-14px) scale(1.25) rotate(-3deg);opacity:0}45%{opacity:1}}
@keyframes lb-from-l{from{opacity:0;transform:translateX(-18px)}}
@keyframes lb-from-r{from{opacity:0;transform:translateX(18px)}}
@keyframes lb-up{from{opacity:0;transform:translateY(10px)}}
@keyframes lb-fade{from{opacity:0}}
/* the room, under your name beside the room's heat (one line: the room's), as one control shaped like the heat's chip:
   "Room", the code once, a plain copy mark. A click copies the invite link; "Room" reads "Copied" and the mark is a tick
   for a moment, in place (ui/party.js copyLink). The two words share one cell, so nothing moves. Beside it the Armory, as
   the heat's chip: your coins, and the title's gold count of what they buy now */
#scr-rebirth.has-party .rb-hero{grid-template-columns:auto auto;justify-content:center;column-gap:10px}
#scr-rebirth.has-party .rb-hero>:not(.rb-meta,.party-row),#scr-rebirth.has-party .rb-meta[hidden]+.party-row{grid-column:1/-1}
.party-row{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:8px;pointer-events:auto}
.party-row[hidden]{display:none}
.party-arm{transition:scale .12s var(--out)}
.party-arm:active{scale:.97}
.party-arm .tb-badge{position:static;margin:0 0 0 2px}
.party-bar{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:3px 14px 3px 16px;
  border:var(--line-s) solid var(--ink);border-radius:999px;background:var(--g-paper);box-shadow:0 3px 0 var(--ink);pointer-events:auto;white-space:nowrap;
  transition:scale .12s var(--out)}
.party-bar[hidden]{display:none}
.party-bar:active{scale:.97}
.party-bar:focus-visible{outline:var(--focus-ring);outline-offset:var(--focus-off)}
.party-bar .pb-k{font:800 12px/1 var(--f-ui);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
.party-bar .pb-code{font:400 24px/1 var(--f-display);letter-spacing:.14em;color:var(--ink);font-variant-numeric:tabular-nums}
.pb-ic{width:18px;height:18px;flex:none;fill:none;stroke:var(--ink-2);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.pb-ic .pb-ok{display:none;stroke:var(--ink);stroke-width:2.6}
.party-bar.copied .pb-copy{display:none}
.party-bar.copied .pb-ok{display:inline}
.lb-swap{display:inline-grid}
.lb-swap>*{grid-area:1/1;transition:opacity .12s var(--out),visibility .12s}
.lb-swap>:last-child,.copied .lb-swap>:first-child{opacity:0;visibility:hidden}
.copied .lb-swap>:last-child{opacity:1;visibility:visible}
.party-plates .pp.invite.copied .pp-plus{font-size:0}
.party-plates .pp.invite.copied .pp-plus::after{content:"\2713";font-size:16px}
/* co-op's lobby (ui/party.js focus): the spotlight's clear, undimmed pool spans the whole party, so every gladiator stands
   in focus (Mike: "similar to fornite, not everyones models should be blurred"); the warm pool of light stays yours */
.backdrop.party .bd-spot{
  background:
    radial-gradient(ellipse calc(var(--bd-r,320px) * .55) calc(var(--bd-r,320px) * .72) at var(--bd-hero,64% 46%),rgba(255,218,150,.14) 0%,rgba(255,218,150,0) 100%),
    radial-gradient(ellipse calc(var(--bd-prx) * 3.1) calc(var(--bd-r,320px) * .92) at var(--bd-pc),rgba(var(--bd-plum),0) 40%,rgba(var(--bd-plum),.22) 70%,rgba(var(--bd-plum),.36) 100%);
  -webkit-mask-image:radial-gradient(ellipse calc(var(--bd-prx) * 1.82) calc(var(--bd-r,320px) * .78) at var(--bd-pc),transparent 55%,#000 100%);
  mask-image:radial-gradient(ellipse calc(var(--bd-prx) * 1.82) calc(var(--bd-r,320px) * .78) at var(--bd-pc),transparent 55%,#000 100%);
}
/* what a copy did: a small toast beside the control, gone after a moment */
.lb-toast{position:fixed;z-index:80;padding:6px 12px 7px;border-radius:999px;background:var(--ink);color:#fff;font:800 14px/1.2 var(--f-ui);white-space:nowrap;
  pointer-events:none;box-shadow:var(--drop-s);animation:lb-toast .18s var(--out);transition:opacity .18s var(--out),translate .18s var(--out)}
.lb-toast.out{opacity:0;translate:0 -4px}
@keyframes lb-toast{from{opacity:0;translate:0 4px}}
@media (prefers-reduced-motion:reduce){
  .coop-spin{animation:none}
  .menu-card.coop-ghost.leaving{animation:coop-out .01s forwards}
  .party-plates.in .pp,#scr-rebirth.lobby-in :is(.cs-rail,.cs-panel,.rb-name,.rb-sub,.rb-meta,.party-row),.lb-toast{animation:none}
}
/* a phone: the same floor line, below the corner buttons and a little taller, smaller names; the party bar smaller */
@media (max-width:720px),(max-aspect-ratio:4/5){
  #scr-rebirth.has-party .rb-stage{padding-top:calc(env(safe-area-inset-top,0px) + 70px)}
  /* the strip only fades (a moving strip would carry the fixed Menu with it); the sheet rises */
  #scr-rebirth.lobby-in .cs-rail{animation-name:lb-fade}
  #scr-rebirth.lobby-in .cs-panel{animation-name:lb-up}
  #scr-rebirth.has-party .rb-frame{flex-basis:clamp(140px,22dvh,250px)}
  #scr-rebirth.has-party .rb-hero{column-gap:6px}
  /* three chips do not fit a phone's line: the room's heat on its own, the room and the Armory under it */
  #scr-rebirth.has-party .rb-hero>:is(.rb-meta,.party-row){grid-column:1/-1}
  #scr-rebirth.has-party .rb-hero>.rb-meta:not([hidden])+.party-row{margin-top:2px}
  .party-row{gap:6px}
  .party-bar .pb-k{font-size:10.5px}
  .party-plates .pp{padding:2px 4px 2px 8px;gap:4px}
  .party-plates .pp b{font-size:14px;-webkit-text-stroke:2.5px var(--ink)}
  .party-plates .pp-crown{width:18px;height:18px}
  .party-plates .pp-crown .ic{width:11px;height:11px}
  .party-plates .pp:is(.invite,.pending){padding:4px 10px 5px;font-size:15px}
  .pp-you{font-size:15px;padding:2px 9px 3px}
  .party-bar{padding:3px 12px 3px 13px;gap:6px}
  .party-bar .pb-code{font-size:20px}
}
/* the win (ui/coop.js): each player's choice beside its name, the lobby's plates in a row */
.vic-party{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin:14px 0 4px}
.vic-party[hidden]{display:none}
.vic-party .pp{position:relative;transform:none;min-width:116px;will-change:auto;padding-top:14px}
/* a friend's Keep going while it waits for the host's: the same button, quieter, the words fit */
#btn-endless.waiting{font-size:19px;letter-spacing:0;white-space:nowrap}
.pp[data-st="left"] em{background:var(--paper-2);color:var(--ink-2)}
/* the room's line in the pause menu, during a run */
.pause-room{display:flex;align-items:center;justify-content:center;gap:10px;margin:0;font:800 14px/1.2 var(--f-ui);color:var(--ink-2)}
.pause-room b{font:400 19px/1 var(--f-display);letter-spacing:.1em;color:var(--ink)}
.pause-room .btn{min-height:34px;padding:0 12px;font-size:15px}
/* a friend's speed (ui/coop.js): it shows the room's speed, which the host sets; the phone menu's row says so under its
   name and cannot be pressed (ui/hudmenu.js) */
#btn-speed[aria-disabled="true"]{cursor:default}
.hud-menu .hm-note{display:block;margin-top:2px;font:800 11.5px/1.2 var(--f-ui);color:var(--ink-2)}
.hud-menu .hm-item[aria-disabled="true"]{cursor:default}
.hud-menu .hm-item[aria-disabled="true"]:active{background:none;transform:none}