/* 文字の回転は独立したrotateにし、既存の取得・揺れアニメーションと共存させる。 */
.cell > span { rotate:0deg; transition:rotate .6s cubic-bezier(.3,.05,.2,1); }
.stageLettersInverted .cell > span { rotate:180deg; }
.stageLettersRevealing .cell:not(.stageLetterRevealed) > span { opacity:0 !important; }
.stageCellCurtain { display:none; }
.stageCellHidden .stageCellCurtain {
  display:block; position:absolute; inset:-1px; z-index:8; border-radius:inherit;
  background:#171324; pointer-events:none;
}
/* 暗転中も選択中だけ薄く透かす。選択を外すとすぐに元の暗さへ戻す。 */
.stageCellHidden.sel > .stageCellCurtain { opacity:.7; }
.stageStunned { opacity:.38; }
.stageStunSpinner {
  position:absolute; z-index:8; width:42px; height:42px; margin:-21px;
  border:5px solid #ffffffb3; border-top-color:#7754bc; border-radius:50%;
  box-shadow:0 0 0 3px #37295a66; animation:stageLoading .75s linear infinite;
  pointer-events:none;
}
.stageStunSpinner[hidden] { display:none; }
@keyframes stageLoading { to { transform:rotate(360deg); } }
.stageLightOrb {
  position:fixed; width:22px; height:22px; border-radius:50%; z-index:5000; pointer-events:none;
  background:radial-gradient(circle,#fff 5%,#fffbc1 30%,#ffc87baa 52%,#ffc87b00 75%);
  box-shadow:0 0 10px 3px #ffdb8570;
}
.stageEnemyLight { background:radial-gradient(circle,#fff 5%,#cef6ff 30%,#79c9ffaa 52%,#79c9ff00 75%); box-shadow:0 0 10px 3px #84ceff70; }
.stageStunLight { width:32px; height:32px; opacity:.65; background:radial-gradient(circle,#fff 2%,#fff8bf80 40%,#fff8bf00 75%); box-shadow:0 0 15px 5px #fff8bf44; }
.stageDamageTile {
  position:fixed; z-index:5000; display:grid; place-items:center; pointer-events:none; font-style:normal;
  background-image:linear-gradient(145deg,#ffffff40,transparent 65%);
  box-shadow:inset 0 -4px 0 #0002,0 3px 7px #0004;
}
.stageDamageTile > span {
  font-family:var(--tile-font, 'Kotoba Mochiy'), 'Mochiy Pop One', sans-serif;
  font-weight:var(--tile-font-weight,400); font-size:inherit; line-height:1; color:#fff;
  -webkit-text-stroke:3px var(--tile-stroke,#a8641e); paint-order:stroke fill; text-shadow:0 2px 2px #0003;
}
#board .cell.stageTileSpent:not(.f-s):not(.f-l):not(.sel) { --panel-base:#a8abb2; }
.stageBrightFlash {
  position:absolute; inset:0; z-index:47; pointer-events:none; opacity:0;
  background:radial-gradient(ellipse at center,#ffffffdc,#fff9eced);
  transition:opacity .16s ease-out;
}
.stageBrightFlash.active { opacity:1; }
.stageAbilityCutin {
  position:absolute; left:0; right:0; top:32%; height:190px; z-index:48;
  display:flex; align-items:center; justify-content:center; gap:35px; pointer-events:none;
  background:linear-gradient(90deg,#29204400,#292044ec 22%,#604d87e8 70%,#29204400);
  border-block:3px solid #fff4c880; color:#fff7c7; text-shadow:2px 3px #292044;
  animation:stageAbilitySweep 1.6s ease both;
}
.stageAbilityCutin[hidden] { display:none; }
.stageAbilityCutin img { height:230px; width:220px; object-fit:contain; }
.stageAbilityCutin strong { font-size:52px; letter-spacing:.06em; }
@keyframes stageAbilitySweep {
  0% { opacity:0; transform:translateX(-25%); }
  13%,80% { opacity:1; transform:translateX(0); }
  100% { opacity:0; transform:translateX(25%); }
}
.stageWordCutin { position:absolute; inset:0; z-index:8; overflow:hidden; border-radius:16px; pointer-events:none; }
.stageWordCutin[hidden],body.lightMode .stageWordCutin { display:none; }
.stageWordCutin img { position:absolute; left:50%; top:50%; width:62%; height:92%; max-width:480px; object-fit:contain; transform:translate(-50%,-50%); animation-duration:2.6s; animation-timing-function:linear; animation-fill-mode:both; }
.stageWordCutin[data-lane="upper"] img { animation-name:stageWordUpper; }
.stageWordCutin[data-lane="lower"] img { animation-name:stageWordLower; }
.stageWordCutin[data-lane="left"] img { animation-name:stageWordLeft; }
.stageWordCutin[data-lane="right"] img { animation-name:stageWordRight; }
.stageWordCutin[data-lane="left"] img,.stageWordCutin[data-lane="right"] img { width:92%; height:62%; max-width:none; max-height:480px; }
@keyframes stageWordUpper {
  0% { transform:translate(160%,-50%) scale(.92); opacity:0; }
  6%,94% { opacity:1; }
  23%,61.5% { transform:translate(-50%,-50%) scale(1.04); opacity:1; }
  100% { transform:translate(-260%,-50%) scale(.92); opacity:0; }
}
@keyframes stageWordLower {
  0% { transform:translate(160%,-50%) scale(.92); opacity:0; }
  6%,94% { opacity:1; }
  23%,61.5% { transform:translate(-50%,-50%) scale(1.04); opacity:1; }
  100% { transform:translate(-260%,-50%) scale(.92); opacity:0; }
}
@keyframes stageWordLeft {
  0% { transform:translate(-50%,-260%) scale(.92); opacity:0; }
  6%,94% { opacity:1; }
  23%,61.5% { transform:translate(-50%,-50%) scale(1.04); opacity:1; }
  100% { transform:translate(-50%,160%) scale(.92); opacity:0; }
}
@keyframes stageWordRight {
  0% { transform:translate(-50%,-260%) scale(.92); opacity:0; }
  6%,94% { opacity:1; }
  23%,61.5% { transform:translate(-50%,-50%) scale(1.04); opacity:1; }
  100% { transform:translate(-50%,160%) scale(.92); opacity:0; }
}
@keyframes stageWordFade { 0%,100% { opacity:0; } 23%,61.5% { opacity:1; } }
.stageScoreDetail { display:block; font-size:18px; line-height:1.25; white-space:nowrap; }
.stageLifeCritical { color:#d42e49 !important; }
@media (prefers-reduced-motion:reduce) {
  .cell > span { transition-duration:.15s; }
  .stageAbilityCutin { animation-name:stageAbilityFade; }
  .stageWordCutin[data-lane] img { animation-name:stageWordFade; }
}
@keyframes stageAbilityFade { 0%,100% { opacity:0; } 15%,75% { opacity:1; } }
