/* =========================
   ui.toast.css（トースト系）
   ========================= */

/* =========================
   4) 属性じゃんけん結果トースト
   ========================= */
.order-toast{
  position:fixed;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%) scale(.96);
  padding:14px 20px;
  min-width:220px;
  max-width:80%;
  text-align:center;
  background:rgba(15,23,42,.95);
  color:#ffffff;
  font-weight:700;
  font-size:15px;
  border-radius:18px;
  box-shadow:0 18px 40px rgba(0,0,0,.45);
  opacity:0;
  pointer-events:none;
  transition:opacity .25s ease, transform .25s ease;
  z-index:9999;
  white-space:pre-line;
}
.order-toast.show{
  opacity:1;
  transform:translate(-50%, -50%) scale(1);
}
.order-toast.hidden{
  display:none !important;
}


/* =========================
   5) センター表示（攻撃HIT表示 / 2HIT,4HIT...）
   ========================= */
#center-float{
  position:fixed;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%) scale(.9);

  padding:14px 18px;
  border-radius:12px;

  background:rgba(0,0,0,0.75);

  font-size:28px;
  font-weight:900;
  letter-spacing:1px;

  opacity:0;
  pointer-events:none;
  transition:opacity .18s ease, transform .18s ease;
  z-index:9999;

  /* ✅ 機種差改行対策 */
  white-space:nowrap;
  width:max-content;
  max-width:90vw;
  overflow:hidden;
  text-overflow:ellipsis;

  /* デフォルト（必要ならここも好きに調整してOK） */
  color:#fff;
  text-shadow:0 0 10px rgba(255,255,255,.25);
}

/* 表示中 */
#center-float.is-show{
  opacity:1;
  transform:translate(-50%, -50%) scale(1);
}

/* =========================
   A〜E 色分け（まずは攻撃種類で）
   ========================= */
#center-float[data-kind="A"],
#center-float[data-kind="A'"]{
  color:#ffffff; /* 白スタート */
}

#center-float[data-kind="B"]{
  color:#ffe08a; /* 黄寄り */
}

#center-float[data-kind="C"]{
  color:#ffb347; /* オレンジ寄り */
}

#center-float[data-kind="D"]{
  color:#ff6b6b; /* 赤寄り */
}

#center-float[data-kind="E"]{
  color:#d8b4fe; /* ラスト前：紫（虹はここを後で） */
}

/* =========================
   ドラ要素：青みを上乗せ（強攻撃感）
   ========================= */
#center-float[data-dragon="1"]{
  text-shadow:0 0 12px rgba(80,160,255,.9), 0 0 24px rgba(80,160,255,.6);
  filter:saturate(1.2);
}