/* メガレベルの切り替え（メガの追加SPアタック「＋わざ」の威力に効く）
   theme.css と同じく、どのツールに置いても同じ見た目になるよう自己完結させてある。
   役割色はメガと同じマゼンタ（火力チェッカー等の「メガ・ゲンシ」タブとそろえる） */
.megalv{display:inline-flex;align-items:center;gap:7px;flex-wrap:wrap}
.megalv .mlvl{font-size:.72rem;font-weight:800;letter-spacing:.03em;color:#e07ab8;white-space:nowrap}
:root.light .megalv .mlvl{color:#b02a76}
.megalv .mlvseg{display:inline-flex;gap:2px}
.megalv .mlvnote{font-size:.64rem;font-weight:700;color:#8b93b5;white-space:nowrap}
:root.light .megalv .mlvnote{color:#6b7396}
.megalv .mlvseg button{
  min-width:30px;padding:5px 7px;border:0;cursor:pointer;
  font:inherit;font-size:.78rem;font-weight:800;line-height:1.1;font-variant-numeric:tabular-nums;
  color:#e07ab8;background:linear-gradient(180deg,#1e2850,#151d38);
  box-shadow:0 2px 0 rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.06);
  border-radius:5px;transition:transform .12s,box-shadow .12s,background .12s,color .12s}
.megalv .mlvseg button:first-child{border-radius:9px 5px 5px 9px}
.megalv .mlvseg button:last-child{border-radius:5px 9px 9px 5px}
.megalv .mlvseg button:hover{transform:translateY(-1px)}
.megalv .mlvseg button[aria-pressed="true"]{
  color:#fff;transform:translateY(-1px);
  background:linear-gradient(160deg,#f795c8 0%,#d63384 45%,#9c1a5e 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6)}
:root.light .megalv .mlvseg button{
  color:#b02a76;background:linear-gradient(180deg,#ffffff,#f3f0f8);
  box-shadow:0 2px 0 rgba(90,70,120,.16),inset 0 1px 0 rgba(255,255,255,.9)}
:root.light .megalv .mlvseg button[aria-pressed="true"]{
  color:#fff;background:linear-gradient(160deg,#f795c8 0%,#d63384 45%,#9c1a5e 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5)}
@media (max-width:560px){ .megalv{width:100%} .megalv .mlvseg{flex:1} .megalv .mlvseg button{flex:1} }

/* ⚠ ツール側の .modes button / .gtabs button などが後から当たると点灯色が消えるので、
   セレクタは必ず .megalv .mlvseg button の形（クラス2つ＋要素）にして詳細度で勝たせる */