#resHint { flex-wrap:wrap; }
#mainArea.online .brainRankingButton { display:none; }
.resBtn.brainRankingButton {
  background:linear-gradient(180deg,#b88be9,#8564c5); box-shadow:0 5px 0 #654697,0 8px 14px #65469733;
  font-size:22px; padding:11px 25px;
}
.stageBrainOverlay {
  position:absolute; inset:0; z-index:118; overflow:hidden; padding:0; background:#4b355168; cursor:default;
}
.stageBrainOverlay[hidden], .brainMeaning[hidden] { display:none; }
.brainDialog {
  position:absolute; left:72px; top:54px; width:min(1020px,calc(100% - 96px)); max-height:calc(100% - 96px); min-height:460px; display:flex; flex-direction:column;
  border:4px solid #fff; border-radius:30px; background:#fffaf3; color:#584264;
  box-shadow:0 18px 50px #39244645; overflow:hidden; text-align:left; font-size:18px;
  animation:brainDialogEnter .35s cubic-bezier(.2,.8,.25,1) both;
}
.brainHeader { position:relative; padding:23px 28px 18px; background:linear-gradient(120deg,#ffedd2,#ffe1ec 60%,#eee4ff); cursor:grab; touch-action:none; }
.brainHeader.brainDragging { cursor:grabbing; }
.brainStageLabel { color:#8b668b; font-weight:800; font-size:18px; padding-right:135px; }
.brainHeader h2 { margin:7px 120px 0 0; font-size:34px; font-family:'Mochiy Pop One',sans-serif; line-height:1.45; color:#7953a0; }
.brainClose { position:absolute; top:25px; right:23px; touch-action:auto; }
.brainClose,.brainReplay,.brainTab {
  border:2px solid #dec5e6;
  border-radius:14px;
  padding: 6px 15px;
  background:#fff;
  color:#805399;
  font:800 18px 'M PLUS Rounded 1c',sans-serif;
  cursor:pointer;
}
.brainClose:hover,.brainReplay:hover { background:#f1e7ff; }
.brainTabs { position:relative; z-index:0; display:flex; gap:12px; padding:17px 24px 0; }
.brainTab {flex:1;border-radius:16px;font-size: 25px;transition:color .4s;}
.brainTab[aria-pressed="true"] { color:#fff; background:#a279c9; border-color:#a279c9; box-shadow:0 4px 0 #8056a9; }
/* 選ばれているタブの紫は .brainTabGlider が描き、次の発表へ移るときに横へ滑る（stage-ranking.js の GLIDE_MS と合わせる） */
.brainTabLabel { position:relative; z-index:2; }
.brainTabGlider { position:absolute; left:0; top:0; z-index:1; display:none; background:#a279c9; box-shadow:0 4px 0 #8056a9; pointer-events:none; transition:transform .48s cubic-bezier(.55,0,.2,1); }
.brainTabs.hasGlider .brainTabGlider { display:block; }
.brainTabs.hasGlider .brainTab[aria-pressed="true"] { background:#fff; border-color:#dec5e6; box-shadow:none; }
.brainList.brainListLeaving { opacity:.3; transition:opacity .3s; }
.brainSectionTitle {margin: 17px 28px 2px;font-size: 36px;color:#9c6597;text-align: center;}
.brainList { flex:1 1 auto; min-height:0; overflow-y:auto; padding:14px 24px 20px; display:flex; flex-direction:column; gap:13px; overscroll-behavior:contain; }
.brainRankEntry {
  position:relative; flex:none; padding:16px 20px; border:2px solid #e8d8eb; border-radius:22px; background:#fff;
  box-shadow:0 5px 0 #f0e5ef; transform-origin:center; animation:brainRankEnter .65s cubic-bezier(.16,.85,.25,1) both;
}
.brainRankEntry[data-rank="1"] { border-color:#e9bd59; background:linear-gradient(120deg,#fff7dc,#fffdf7 58%,#fff0ce); box-shadow:0 5px 0 #f1dc9d; }
.brainRankEntry[data-rank="2"] { border-color:#b8ccdf; }
.brainRankEntry[data-rank="3"] { border-color:#dfbc9d; }
.brainPerson { display:grid; grid-template-columns:65px 62px minmax(0,1fr) auto; align-items:center; gap:14px; }
.brainRankNumber { display:flex; align-items:baseline; justify-content:center; color:#9e81b3; }
.brainRankNumber b { font-size:40px; line-height:1; }
.brainRankNumber span { font-size:18px; font-weight:900; }
.brainRankEntry[data-rank="1"] .brainRankNumber { color:#c68a24; }
.brainAvatar { display:grid; place-items:center; position:relative; width:62px; height:62px; border-radius:50%; background:#f2e8f9; font-size:32px; overflow:hidden; border:3px solid #fff; box-shadow:0 0 0 2px #e3d3eb; }
.brainAvatar img { position:absolute; width:100%; height:100%; object-fit:cover; }
.brainPersonName {font-size: 30px;overflow-wrap:anywhere;line-height:1.35;}
.brainPersonCount { display:flex; gap:6px; align-items:baseline; white-space:nowrap; color:#c96893; }
.brainPersonCount b {font-size: 40px;line-height:1;}
.brainPersonCount span { font-size:18px; font-weight:900; }
/* 5文字以上のランキングの「6文字」。「語」と同じ大きさで、語数の前に置く */
.brainPersonCount .brainPersonLength { margin-right:6px; }
.brainWords { display:flex; flex-wrap:wrap; gap:7px; list-style:none; margin:13px 0 0 79px; padding:2px 3px 4px; max-height:125px; overflow-y:auto; overscroll-behavior:contain; }
.brainWord {border:1px solid #e4d5ed;border-radius:11px;padding:5px 12px;background:#f7effa;color:#6e4c85;font: 800 20px 'M PLUS Rounded 1c',sans-serif;cursor:pointer;transition:background .15s,transform .15s;overflow-wrap:anywhere;text-align:left;}
.brainWord:hover { background:#ecdafa; transform:translateY(-2px); }
.brainWord:focus-visible,.brainTab:focus-visible,.brainClose:focus-visible,.brainReplay:focus-visible { outline:3px solid #ac6ad2; outline-offset:3px; }
.brainWordsVertical { display:flex; flex-direction:column; flex-wrap:nowrap; gap:6px; max-height:230px; }
.brainWordsVertical li { display:flex; align-items:center; gap:16px; flex:none; }
.brainWordsVertical .brainWord { min-width:180px; }
.brainWordLength {color:#9c829e;font-size: 20px;white-space:nowrap;}
.brainEmpty { margin:42px 15px; padding:24px; text-align:center; font-size:23px; font-weight:800; color:#a28ca7; border:2px dashed #e6d4ea; border-radius:20px; }
.brainFooter { display:flex; gap:16px; align-items:center; justify-content:space-between; flex:none; padding:17px 24px; border-top:1px solid #ecdeef; background:#fff6fb; }
.brainFooter p { font-size:18px; line-height:1.5; color:#96739c; }
.brainReplay { flex:none; }
.brainAnnouncement { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); font-size:18px; }
.brainMeaning {
  position:fixed; z-index:10000; width:max-content; max-width:min(490px,calc(100vw - 16px)); max-height:calc(100vh - 16px);
  overflow:auto; padding:16px 20px; border:2px solid #d9b2e7; border-radius:18px;
  box-shadow:0 8px 22px #53356840; background:#fffdf8; color:#594668; pointer-events:none; font-size:19px;
  animation:brainMeaningEnter .18s ease-out both;
}
.brainMeaningWord { display:block; font-size:23px; color:#9960ad; overflow-wrap:anywhere; }
.brainMeaningText { margin-top:8px; font-size:19px; line-height:1.6; white-space:pre-wrap; overflow-wrap:anywhere; }
.brainAlreadyShown { animation:none; }
@keyframes brainDialogEnter { from { opacity:0; transform:translateY(18px) scale(.96); } to { opacity:1; transform:none; } }
@keyframes brainRankEnter {
  0% { opacity:0; transform:translateX(35px) scale(.94); }
  65% { opacity:1; transform:translateX(-5px) scale(1.015); }
  100% { opacity:1; transform:translateX(0) scale(1); }
}
@keyframes brainMeaningEnter { from { opacity:0; transform:translateY(5px); } to { opacity:1; transform:none; } }
@media (prefers-reduced-motion:reduce) {
  .brainDialog,.brainRankEntry,.brainMeaning { animation:none; }
  .brainWord,.brainTab,.brainTabGlider,.brainList.brainListLeaving { transition:none; }
}