/* Selected components from sp.bbsmc.cn/_v024/css/screens/{game,room,game-shop}.css (GPL-3.0-or-later).
   Keep this fork's portrait/identity, UI-scale, expanded-room and capsule-layering fixes. */
.rm-badge {
  display: inline-flex;
  align-items: center;
  gap: .06rem;
  padding: .04rem .14rem;
  margin-left: .12rem;
  border: 1px solid color-mix(in srgb, var(--mint-400) 55%, transparent);
  background: color-mix(in srgb, var(--mint-400) 12%, transparent);
  color: var(--mint-400);
  font-size: calc(.16 * var(--t));
  font-weight: 700;
  letter-spacing: .12em;
  border-radius: 2px;
  vertical-align: middle;
  white-space: nowrap;
}


.rm-badge--hud { padding: .02rem .1rem; font-size: calc(.14 * var(--t)); letter-spacing: .1em; }
.rm-effect-chip {
  display: inline-flex;
  align-items: center;
  max-width: 1.8rem;
  padding: .02rem .1rem;
  border: 1px solid color-mix(in srgb, var(--amber) 55%, transparent);
  background: color-mix(in srgb, var(--amber) 12%, transparent);
  color: var(--amber);
  font-size: calc(.14 * var(--t));
  font-weight: 600;
  letter-spacing: .04em;
  border-radius: 2px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/* Compact toolbar, collapsible ranking, 2026-10-12b. */
.gm__corner { gap:max(.06rem,5px); }
.gm__corner .gm__gear, .gm__corner .ewheel__btn {
  position:relative; display:flex; align-items:center; justify-content:center; gap:5px;
  height:max(.46rem,30px); min-height:0; min-width:max(.46rem,30px); padding:0 max(.12rem,9px) 0 max(.1rem,7px);
  color:#dcefe8; font-size:max(.13rem,11px); font-weight:600; letter-spacing:.08em;
  background:linear-gradient(180deg,rgba(34,46,41,.94),rgba(11,16,14,.94));
  border:1px solid rgba(78,216,175,.34); border-radius:4px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07), inset 0 -1px 0 rgba(0,0,0,.45), 0 2px 8px rgba(0,0,0,.5);
  transition:color var(--t-fast), border-color var(--t-fast), box-shadow var(--t-fast), background var(--t-fast), transform var(--t-fast);
}
.gm__corner .gm__gear .icon, .gm__corner .ewheel__btn .icon { width:max(.2rem,15px); height:max(.2rem,15px); color:var(--mint-500); }
.gm__corner .gm__tool-label, .gm__corner .ewheel__label { font-size:inherit; font-weight:600; letter-spacing:.08em; }
.gm__corner .gm__gear:hover, .gm__corner .ewheel__btn:hover:not(:disabled) {
  color:#fff; border-color:rgba(89,244,202,.75);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1), 0 0 0 1px rgba(89,244,202,.12), 0 0 12px rgba(89,244,202,.22), 0 2px 8px rgba(0,0,0,.5);
}
.gm__corner .gm__gear:hover .icon, .gm__corner .ewheel__btn:hover .icon { color:var(--mint-400); }
.gm__corner .gm__gear:active, .gm__corner .ewheel__btn:active:not(:disabled) { transform:translateY(1px); }
.gm__corner .gm__gear.is-on, .gm__corner .gm__gear[aria-pressed="true"], .gm__corner .ewheel__btn.is-on {
  color:var(--mint-400); border-color:var(--mint-500);
  background:linear-gradient(180deg,rgba(40,90,74,.9),rgba(14,34,28,.94));
}

.gm__tool-label { white-space:nowrap; font-weight:700; }
/* Current-build hints use violet; promotion and tap confirmation keep their original colours. */
.scard.is-build:not(.is-merge):not(.is-armed){border-color:#bda0ff;box-shadow:inset 0 0 0 1px rgba(177,139,255,.6),0 0 .12rem rgba(163,115,255,.25)}
.scard__buildtag{position:absolute;left:.06rem;top:.78rem;z-index:3;display:inline-flex;align-items:center;gap:.02rem;max-width:calc(100% - .12rem);padding:.02rem .05rem;border:1px solid #ad86ed;background:rgba(33,20,54,.94);color:#e3d2ff;font-size:max(9px,.11rem);font-weight:800;line-height:1.25;white-space:nowrap;pointer-events:none}
.scard__bond.is-build:not(.is-off){color:#dfc9ff;background:rgba(142,96,212,.22);text-decoration:underline;text-underline-offset:2px}
.scard.is-build.is-disabled .scard__buildtag{opacity:.8}

/* Compatibility with this fork's scalable, wrapping toolbar and its safe-area dock. */
.gm__corner { flex-wrap:wrap; max-width:calc(100% - var(--sa-l,0px) - var(--sa-r,0px) - .48rem); }
.gm__corner .gm__gear[aria-expanded="true"] { color:var(--mint-400); border-color:var(--mint-500); background:var(--mint-900); }
.rm-badge--hud { margin-left:0; }
.room-screen .rm-badge { font-size:max(calc(.14 * var(--t)),11px); }
/* Compact reference toolbar; override the old narrow 148px wrap dock in devices.css too. */
.gm__corner,.gm:not(.is-collapsed) .gm__corner,.gm.is-collapsed .gm__corner {
  display:flex; flex-flow:row nowrap; width:max-content; gap:6px; align-items:center; bottom:.24rem;
}
.gm__corner .gm__gear,.gm__corner .ewheel__btn { flex:none; width:auto; min-width:36px; height:36px; min-height:36px; padding:0 8px; gap:5px; font-size:12px; letter-spacing:0; }
.gm__corner .ewheel__btn { min-width:64px; }
.gm__corner .gm__gear .icon,.gm__corner .ewheel__btn .icon { width:16px; height:16px; flex:none; }
/* Reserve the same dock on desktop too: late-round shops can contain several equipment cards. */
.gm .shopbar { max-width:calc(100% - 330px - .5rem); }
.gm .shopbar__row { min-width:0; max-width:100%; }
.gm .shopbar__offers { display:flex; align-items:flex-end; flex:0 1 auto; min-width:0; gap:.08rem; overflow-x:auto; overscroll-behavior-x:contain; touch-action:pan-x; padding:10px 4px 4px; scrollbar-width:thin; }
.gm .shopbar__offers > .shopbar__cards,.gm .shopbar__offers > .shopbar__item { flex:none; overflow:visible; padding-top:0; }
.gm .shopbar__offers .scard,.gm .shopbar__offers .scard-wrap { flex:none; }
.gm .shopbar__row > .lvcard,.gm .shopbar__row > .funds { flex:none; }
.gm .shopbar__offers > .shopbar__reward { flex:none; }
.gm .shopbar__offers .shopbar__rwcards { overflow:visible; }
@media(max-width:767px),(max-height:600px) and (pointer:coarse) {
  .gm__corner .gm__gear,.gm__corner .ewheel__btn { min-width:32px; height:32px; min-height:32px; padding:0 6px; gap:4px; font-size:11px; }
  .gm__corner .ewheel__btn { min-width:56px; }
  .gm__corner .gm__gear .icon,.gm__corner .ewheel__btn .icon { width:15px; height:15px; }
  /* The tools never move above the shop. Reserve the bottom-left row on landscape phones. */
  .gm .shopbar { max-width:calc(100% - 292px - .5rem); }
}
@media(max-width:600px) {
  /* Portrait cannot fit a usable shop beside five tools: keep the shop above the bottom dock. */
  .gm__hud > .shopbar { bottom:52px; max-width:calc(100% - .52rem); }
}
