/* ID-scoped visual aliases only. Shared Classic class rules remain the master. */
#trottl-special-room-list > .trottl-classic-room[data-room-slot="1"] {
  position: relative;
  top: 12px;
}

.trottl-classic-rule-controls #trottl-special-four-reset {
  border-color: rgb(213 234 243 / 22%);
  background: rgb(255 255 255 / 5%);
  color: rgb(225 239 246 / 72%);
}

.trottl-classic-rule-controls #trottl-special-four-confirm {
  border-color: rgb(207 239 250 / 62%);
  background: linear-gradient(180deg, rgb(235 249 255 / 24%), rgb(170 224 243 / 13%));
  box-shadow: 0 0 15px rgb(177 226 246 / 16%);
  color: #f4fcff;
}

.trottl-classic-rule-controls #trottl-special-four-confirm::before {
  margin-right: 0.35em;
  color: #8ff0bd;
  content: "✓";
}

.trottl-classic-rule-controls #trottl-special-four-confirm.is-incomplete {
  border-color: rgb(213 234 243 / 22%);
  background: rgb(255 255 255 / 5%);
  box-shadow: none;
  color: rgb(225 239 246 / 72%);
}

.trottl-classic-rule-controls #trottl-special-four-confirm:not(:disabled):not(.is-incomplete) {
  border-color: rgb(116 242 178 / 76%);
  background: linear-gradient(180deg, rgb(35 120 86 / 82%), rgb(11 68 54 / 88%));
  box-shadow: 0 0 18px rgb(66 224 144 / 27%), inset 0 1px rgb(255 255 255 / 10%);
}

.trottl-classic-rule-controls #trottl-special-four-confirm.is-incomplete::before {
  color: inherit;
}

.trottl-classic-rule-controls #trottl-special-four-confirm.is-ready-impact:not(.is-incomplete) {
  animation: trottl-classic-four-button-ready 210ms ease-out;
}

.trottl-classic-rule-controls #trottl-special-game-feedback {
  position: absolute;
  right: 8px;
  bottom: calc(100% + 3px);
  left: 8px;
  width: auto;
  margin: 0;
  color: #ffd5df;
  font-size: 0.68rem;
  text-align: center;
}

.trottl-special-start-confirm {
  border-color: rgb(116 242 178 / 76%);
  background: linear-gradient(180deg, rgb(35 120 86 / 82%), rgb(11 68 54 / 88%));
  color: #f4fcff;
}

@media (prefers-reduced-motion: reduce) {
  #trottl-special-four-confirm.is-ready-impact { animation: none; }
}

#trottl-special-spectator-count {
  position: fixed;
  z-index: 5;
  top: calc(max(10px, env(safe-area-inset-top)) + 42px);
  left: max(10px, env(safe-area-inset-left));
  display: flex;
  align-items: center;
  gap: 5px;
  color: rgb(222 241 255 / 78%);
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.2;
  pointer-events: none;
}

#trottl-special-session-screen .trottl-special-hearts {
  position: absolute;
  top: calc(100% + 5px + 0.75rem + 3px);
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 3px;
  pointer-events: none;
}
#trottl-special-session-screen .trottl-special-heart { width: 11px; height: 11px; color: #080a10; filter: drop-shadow(0 0 1px rgb(255 255 255 / 95%)) drop-shadow(0 0 4px rgb(255 255 255 / 72%)); }
#trottl-special-session-screen .trottl-special-heart svg { display: block; width: 100%; height: 100%; }
#trottl-special-session-screen .trottl-special-heart.is-live { color: #ef4b65; filter: none; }
#trottl-special-session-screen .trottl-classic-seat-self-marker { top: calc(100% + 5px + 0.75rem + 19px); }
#trottl-special-session-screen [data-lifecycle="critical"] .trottl-special-heart { animation: trottl-special-critical .55s ease-in-out infinite; filter: drop-shadow(0 0 1px rgb(255 255 255 / 100%)) drop-shadow(0 0 5px rgb(255 255 255 / 82%)); }
#trottl-special-session-screen [data-lifecycle="critical"] .trottl-special-heart:nth-child(2) { animation-delay: -.12s; }
#trottl-special-session-screen [data-lifecycle="critical"] .trottl-special-heart:nth-child(3) { animation-delay: -.24s; }
#trottl-special-session-screen .trottl-special-critical-badge { position: absolute; z-index: 5; top: -8px; left: 50%; transform: translateX(-50%); width: max-content; padding: 3px 6px; border: 1px solid #a92c43; border-radius: 999px; background: linear-gradient(180deg, #260e19, #09090d); box-shadow: 0 0 9px rgb(163 30 53 / 55%); color: #fff; font-size: .48rem; font-weight: 950; white-space: nowrap; pointer-events: none; }
#trottl-special-session-screen .trottl-special-result-ready .trottl-classic-avatar-wrap { border-radius: 50%; box-shadow: 0 0 0 2px #70efaa, 0 0 20px 7px rgb(48 215 125 / 90%); }
#trottl-special-session-screen .trottl-special-result-ready .trottl-classic-avatar-wrap::after { position: absolute; z-index: 8; right: -3px; bottom: -3px; display: grid; width: 17px; height: 17px; place-items: center; border: 1px solid #b9ffd5; border-radius: 50%; background: #197045; color: #fff; content: "✓"; font-size: 10px; font-weight: 950; }
#trottl-special-session-screen .trottl-special-minigame-drinks { opacity: 1; color: #f4fcff; border-color: rgb(190 235 255 / 80%); background: rgb(5 12 23 / 96%); box-shadow: 0 0 10px rgb(135 216 255 / 60%); text-shadow: 0 0 8px rgb(200 239 255 / 32%); }
#trottl-special-session-screen .trottl-classic-seat-status-overlay { bottom: 3px; }
#trottl-special-session-screen [data-lifecycle="eliminated"] .trottl-classic-game-avatar,
#trottl-special-session-screen [data-lifecycle="eliminated"] .trottl-classic-seat-name,
#trottl-special-session-screen [data-lifecycle="eliminated"] .trottl-special-hearts { opacity: 0.42; }
#trottl-special-session-screen .trottl-special-skull { position: absolute; inset: 22%; color: rgb(237 245 255 / 65%); pointer-events: none; }
#trottl-special-session-screen .trottl-special-skull svg { width: 100%; height: 100%; }
#trottl-special-session-screen .trottl-special-target { position: absolute; inset: -5px; z-index: 6; min-width: 44px; min-height: 44px; padding: 0; border-radius: 50%; border: 1px solid rgb(163 225 255 / 65%); background: transparent; }
/* Drink picks use the master's seat/atlas glow, not a second hitbox ring. */
#trottl-special-session-screen .trottl-special-drink-target { border-color: transparent; }
#trottl-special-session-screen .trottl-classic-player--allocation-impact .trottl-classic-seat-status-overlay { animation-delay: inherit; }
#trottl-special-session-screen .trottl-special-distribution-seat .trottl-special-minigame-drinks {
  border-color: color-mix(in srgb, var(--player-accent) 72%, transparent);
  box-shadow: 0 0 10px var(--player-glow);
  color: var(--player-accent);
  text-shadow: 0 0 8px color-mix(in srgb, var(--player-accent) 32%, transparent);
}
/* Pending drinks are public settlement state, using Classic's yellow drink palette. */
#trottl-special-session-screen .trottl-special-pending-drink .trottl-special-minigame-drinks {
  color: var(--player-accent);
  border-color: color-mix(in srgb, var(--player-accent) 72%, transparent);
  box-shadow: 0 0 10px var(--player-glow);
  text-shadow: 0 0 8px color-mix(in srgb, var(--player-accent) 32%, transparent);
}
#trottl-special-session-screen .trottl-special-attack-selectable { --player-border: rgb(223 89 107 / 65%); --player-glow: rgb(199 39 69 / 22%); --player-accent: #ff9dad; }
#trottl-special-session-screen .trottl-special-attack-selected { --player-border: rgb(255 83 110 / 92%); --player-glow: rgb(255 45 83 / 48%); --player-accent: #ff7b96; --player-highlight: rgb(255 65 100 / 10%); }
#trottl-special-session-screen .trottl-special-attack-selected .trottl-classic-avatar-wrap { animation: none; }
#trottl-special-session-screen .trottl-special-attack-target { border-color: transparent; }
#trottl-special-session-screen .trottl-special-attack-crosshair { position: absolute; inset: 2%; z-index: 7; pointer-events: none; color: #ff536e; filter: drop-shadow(0 0 4px rgb(255 45 83 / 65%)); }
#trottl-special-session-screen .trottl-special-attack-crosshair svg { display: block; width: 100%; height: 100%; stroke: currentColor; stroke-width: 1.7; }
#trottl-special-session-screen .trottl-special-attack-crosshair.is-fading { animation: trottl-special-attack-exit 350ms ease-out forwards; }
@keyframes trottl-special-attack-exit { 0% { opacity: 1; } 100% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  #trottl-special-session-screen .trottl-special-heart--loss { animation: trottl-special-life-loss-reduced 700ms ease-out; }
}
@keyframes trottl-special-life-loss-reduced { 0%, 50% { filter: drop-shadow(0 0 3px #ff536e); } 100% { filter: none; } }
#trottl-special-session-screen .trottl-special-peak { animation: trottl-special-point-peak 600ms ease-out; }
@keyframes trottl-special-critical { 0%, 100% { transform: translateX(-2px) rotate(-12deg); } 50% { transform: translateX(2px) rotate(12deg); } }
@keyframes trottl-special-point-peak { 50% { box-shadow: 0 0 16px #d9a6ff; } }

#trottl-special-session-screen .trottl-special-minigame-results {
  position: absolute;
  z-index: 12;
  top: calc(max(10px, env(safe-area-inset-top)) + 115px);
  right: max(16px, env(safe-area-inset-right));
  bottom: auto;
  left: max(16px, env(safe-area-inset-left));
  display: flex;
  max-height: calc(100dvh - max(10px, env(safe-area-inset-top)) - max(16px, env(safe-area-inset-bottom)) - 220px);
  padding: 16px;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgb(185 223 245 / 35%);
  border-radius: 18px;
  background: rgb(8 19 34 / 94%);
  color: #f0f8ff;
  box-shadow: 0 8px 30px rgb(0 0 0 / 35%);
}
#trottl-special-session-screen .trottl-special-minigame-results h2 { margin: 0 0 8px; font-size: 1rem; }
#trottl-special-session-screen .trottl-special-minigame-results p { font-size: 0.8rem; }
#trottl-special-session-screen .trottl-special-fish-count-summary { display: flex; flex-direction: column; align-items: center; gap: 5px; margin: 2px 0 14px; text-align: center; }
#trottl-special-session-screen .trottl-special-fish-count-summary[hidden], #trottl-special-session-screen .trottl-special-fish-count-summary [hidden] { display: none; }
#trottl-special-session-screen .trottl-special-fish-count-result-count { color: #b7f2ff; font-size: clamp(1.2rem, 5.5vw, 1.65rem); font-weight: 900; line-height: 1.2; }
#trottl-special-session-screen .trottl-special-fish-count-all-wrong { margin-top: 7px; color: #ff9aad; font-size: .85rem; font-weight: 900; line-height: 1.3; }
#trottl-special-session-screen .trottl-special-fish-count-all-drink { color: #f0f8ff; font-size: .82rem; line-height: 1.3; }
#trottl-special-session-screen .trottl-special-minigame-results ol { min-height: 0; margin: 0; padding: 0; overflow-y: auto; list-style: none; }
#trottl-special-session-screen .trottl-special-minigame-results li { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; gap: 8px; padding: 10px 4px; border-bottom: 1px solid rgb(255 255 255 / 10%); font-size: 0.8rem; }
#trottl-special-session-screen .trottl-special-minigame-results strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#trottl-special-session-screen .trottl-special-minigame-results .is-winner { color: #91efbd; }
#trottl-special-session-screen .trottl-special-minigame-results .is-loser { color: #ff9aad; }
#trottl-special-session-screen .trottl-special-result-identity { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 7px; min-width: 0; }
#trottl-special-session-screen .trottl-special-result-identity strong { min-width: 0; max-width: 100%; }
#trottl-special-session-screen .trottl-special-result-life-loss { color: #ff708b; font-size: .7rem; white-space: nowrap; }
#trottl-special-session-screen .trottl-special-result-value { text-align: right; white-space: nowrap; }
#trottl-special-session-screen .trottl-special-minigame-results.is-panic-result { gap: 12px; background: rgb(8 19 34 / 92%); }
#trottl-special-session-screen .trottl-special-minigame-results.is-panic-result h2 { margin: 0; line-height: 1.3; }
#trottl-special-session-screen .trottl-special-minigame-results.is-panic-result ol { min-height: 0; overflow-y: auto; margin: 0; flex: 0 1 auto; }
#trottl-special-session-screen .trottl-special-panic-result-confirm { flex: 0 0 auto; width: 100%; min-height: 44px; padding: 10px; margin-top: 12px; border: 1px solid rgb(116 242 178 / 76%); border-radius: 12px; background: linear-gradient(180deg, rgb(35 120 86 / 82%), rgb(11 68 54 / 88%)); color: #f4fcff; font-size: .72rem; font-weight: 900; }
#trottl-special-session-screen .trottl-special-panic-result-confirm[hidden] { display: none; }
#trottl-special-session-screen .trottl-special-minigame-result-toggle { position: absolute; z-index: 13; top: calc(max(10px, env(safe-area-inset-top)) + 82px); right: max(16px, env(safe-area-inset-right)); min-width: 44px; min-height: 32px; padding: 5px 10px; border: 1px solid rgb(185 223 245 / 35%); border-radius: 999px; background: rgb(8 19 34 / 85%); color: #f0f8ff; font-size: 0.7rem; }
#trottl-special-session-screen .trottl-special-panic-area { position: absolute; z-index: 8; inset: calc(max(10px, env(safe-area-inset-top)) + 160px) 12px calc(max(12px, env(safe-area-inset-bottom)) + 105px); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; pointer-events: none; color: #fff; text-shadow: 0 3px 12px #000; user-select: none; -webkit-user-select: none; }
#trottl-special-session-screen .trottl-special-panic-area.is-tapping { pointer-events: auto; touch-action: none; }
#trottl-special-session-screen .trottl-special-panic-count { font-size: clamp(2rem, 10vw, 3.8rem); font-weight: 900; font-variant-numeric: tabular-nums; pointer-events: none; }
#trottl-special-session-screen .trottl-special-panic-time { font-size: 1.8rem; font-weight: 850; pointer-events: none; }
#trottl-special-session-screen .trottl-special-panic-glow { position: fixed; z-index: 9; inset: 0; pointer-events: none; border: 2px solid rgb(255 255 255 / 80%); box-shadow: inset 0 0 24px rgb(245 251 255 / 60%); animation: trottl-special-panic-pulse 320ms ease-in-out infinite; }
@keyframes trottl-special-panic-pulse { 50% { opacity: 0.35; } }
@media (prefers-reduced-motion: reduce) { #trottl-special-session-screen .trottl-special-panic-glow { animation: none; opacity: 0.55; } }
@media (prefers-reduced-motion: reduce) {
  #trottl-special-session-screen .trottl-special-heart,
  #trottl-special-session-screen .trottl-special-peak { animation: none; }
}
/* Own horizontal Fisch Roulette-style presentation. Overlay, never a seat-layout child. */
.trottl-special-roulette { position: absolute; z-index: 10; top: calc(env(safe-area-inset-top, 0px) + 145px); left: 12px; right: 12px; pointer-events: none; min-width: 0; padding: 12px; border: 1px solid rgb(184 220 237 / 35%); border-radius: 18px; background: linear-gradient(160deg, #193444, #102837); box-shadow: 0 12px 32px rgb(0 0 0 / 36%), inset 0 1px rgb(255 255 255 / 8%); max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 210px); overflow: auto; }
.trottl-special-roulette[hidden], .trottl-special-roulette [hidden] { display: none; }
.trottl-special-roulette-window { position: relative; height: 124px; overflow: hidden; border-block: 1px solid rgb(255 255 255 / 22%); background: rgb(0 0 0 / 24%); box-shadow: inset 0 0 36px rgb(0 0 0 / 48%); }
.trottl-special-roulette-window::before, .trottl-special-roulette-window::after { position: absolute; z-index: 2; top: 0; bottom: 0; width: 18%; content: ""; pointer-events: none; }
.trottl-special-roulette-window::before { left: 0; background: linear-gradient(90deg, #080b18, transparent); }
.trottl-special-roulette-window::after { right: 0; background: linear-gradient(-90deg, #080b18, transparent); }
.trottl-special-roulette-marker { position: absolute; z-index: 4; top: 0; bottom: 0; left: 50%; width: 4px; background: white; box-shadow: 0 0 15px white; transform: translateX(-50%); }
.trottl-special-roulette-marker::before { position: absolute; top: 0; left: 50%; border-top: 14px solid white; border-right: 9px solid transparent; border-left: 9px solid transparent; content: ""; transform: translateX(-50%); }
.trottl-special-roulette-strip { position: absolute; top: 18px; left: 50%; display: flex; gap: 3px; will-change: transform; }
.trottl-special-roulette-tile { flex: 0 0 78px; height: 88px; display: grid; place-items: center; border-radius: 12px; color: white; font-size: 11px; font-weight: 800; box-shadow: inset 0 0 15px rgb(255 255 255 / 12%); }
.trottl-special-roulette-tile[data-color="RED"], .trottl-special-roulette-colors button[data-value="RED"] { background: #a42530; }
.trottl-special-roulette-tile[data-color="BLACK"], .trottl-special-roulette-colors button[data-value="BLACK"] { background: #171c27; }
.trottl-special-roulette-tile[data-color="GREEN"], .trottl-special-roulette-colors button[data-value="GREEN"] { background: #197045; }
.trottl-special-roulette p { margin: 6px 0; text-align: center; color: white; font-weight: 800; text-shadow: 0 2px 5px black; }
.trottl-special-roulette-colors, .trottl-special-roulette-rewards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin-top: 8px; }
.trottl-special-roulette-rewards { grid-template-columns: minmax(0, 1fr); gap: 10px; animation: trottl-special-roulette-enter 240ms ease-out; }
.trottl-special-roulette-rewards button { min-height: 50px; font-size: .78rem; font-weight: 800; }
.trottl-special-roulette-group.is-fading, .trottl-special-roulette-rewards.is-fading { animation: trottl-special-roulette-exit 320ms ease-in forwards; pointer-events: none; }
.trottl-special-roulette .is-hit { animation: trottl-special-roulette-hit 400ms ease-out; outline: 1px solid #fff; }
.trottl-special-roulette .is-jackpot { animation: trottl-special-roulette-jackpot 800ms ease-out; }
.trottl-special-roulette-confetti { position: absolute; z-index: 5; left: 50%; top: 62px; pointer-events: none; }
.trottl-special-roulette-confetti i { position: absolute; width: 5px; height: 8px; background: #8cf8b5; animation: trottl-special-roulette-confetti 800ms ease-out forwards; }
.trottl-special-roulette-confetti i:nth-child(2n) { background: #ffdd79; }
.trottl-special-heart--loss { animation: trottl-special-life-loss 700ms ease-out; }
.trottl-special-heart--gain { animation: trottl-special-life-gain 800ms ease-out; }
@keyframes trottl-special-roulette-enter { 0% { opacity: 0; transform: translateY(3px); } 100% { opacity: 1; transform: translateY(0); } }
@keyframes trottl-special-roulette-exit { 0% { opacity: 1; } 100% { opacity: 0; } }
@keyframes trottl-special-roulette-hit { 40% { filter: brightness(1.8); box-shadow: 0 0 20px #fff; } }
@keyframes trottl-special-roulette-jackpot { 25%, 65% { filter: brightness(2); scale: 1.045; box-shadow: 0 0 28px #8cffb5; } }
@keyframes trottl-special-roulette-confetti { 0% { opacity: 1; transform: translate(0, 0) rotate(0deg); } 100% { opacity: 0; transform: translate(var(--particle-x), var(--particle-y)) rotate(160deg); } }
@keyframes trottl-special-life-loss { 0%, 30% { color: #ff536e; filter: drop-shadow(0 0 6px #ff536e); } 15%, 45% { transform: rotate(-14deg) scale(1.1); } 30%, 60% { transform: rotate(14deg) scale(1.05); } }
@keyframes trottl-special-life-gain { 0% { color: #38404a; } 20%, 60% { transform: rotate(-12deg) scale(1.18); color: #ff536e; filter: drop-shadow(0 0 7px #ff8598); } 40% { transform: rotate(12deg) scale(1.1); } }
@media (prefers-reduced-motion: reduce) {
  .trottl-special-roulette-group.is-fading, .trottl-special-roulette-rewards.is-fading { animation-duration: 80ms; }
  .trottl-special-roulette-rewards { animation: none; }
  .trottl-special-roulette .is-hit, .trottl-special-roulette .is-jackpot, .trottl-special-heart--loss, .trottl-special-heart--gain { animation: none; }
  .trottl-special-roulette-confetti { display: none; }
}
.trottl-special-roulette button { pointer-events: auto; width: 100%; min-width: 0; min-height: 44px; padding: 6px; font-size: 11px; color: white; background: rgb(20 32 44 / 94%); border: 1px solid rgb(255 255 255 / 35%); border-radius: 12px; overflow-wrap: anywhere; }
.trottl-special-roulette button:disabled { cursor: default; }
.trottl-special-roulette-rewards button:disabled, .trottl-special-roulette button.is-dimmed { opacity: .48; }
.trottl-special-roulette button.is-selected { opacity: 1; border-color: white; box-shadow: 0 0 12px rgb(255 255 255 / 75%); }
.trottl-special-roulette-selected-target { position: absolute; top: -24px; left: 50%; transform: translateX(-50%); white-space: nowrap; padding: 2px 6px; background: #197045; border-radius: 8px; font-size: 10px; color: white; pointer-events: none; }
/* Reusable minigame overlay; never changes table, dice or dock dimensions. */
.trottl-special-minigame-shell { position: absolute; z-index: 11; top: calc(env(safe-area-inset-top, 0px) + 135px); bottom: calc(env(safe-area-inset-bottom, 0px) + 105px); left: 20px; right: 20px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 12px; min-width: 0; overflow: auto; border: 1px solid rgb(255 255 255 / 25%); border-radius: 20px; background: rgb(10 21 31 / 94%); box-shadow: 0 8px 30px rgb(0 0 0 / 40%); }
.trottl-special-minigame-shell[hidden], .trottl-special-minigame-shell [hidden] { display: none; }
.trottl-special-minigame-shell.is-waiting { bottom: auto; background: rgb(10 21 31 / 85%); }
.trottl-special-test-button { position: fixed; top: calc(env(safe-area-inset-top, 0px) + 8px); right: 10px; z-index: 35; min-height: 32px; padding: 4px 8px; border: 1px solid rgb(255 255 255 / 30%); border-radius: 8px; background: rgb(8 19 28 / 65%); color: #fff; font: 11px monospace; }
.trottl-special-test-panel { position: fixed; top: calc(env(safe-area-inset-top, 0px) + 46px); right: 10px; z-index: 36; width: min(290px, calc(100vw - 20px)); max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 60px); overflow: auto; box-sizing: border-box; padding: 14px; border: 1px solid rgb(255 255 255 / 30%); border-radius: 12px; background: rgb(8 19 28 / 97%); color: #fff; font-size: 13px; }
.trottl-special-test-panel label { display: block; margin-bottom: 12px; }
.trottl-special-test-panel select { display: block; width: 100%; min-height: 40px; margin-top: 4px; background: #182b3a; color: #fff; }
.trottl-special-test-panel button { min-height: 44px; }
.trottl-special-test-button[hidden], .trottl-special-test-panel[hidden] { display: none; }
.trottl-special-fish-field { display: grid; width: min(100%, 420px); height: clamp(176px, 27dvh, 220px); box-sizing: border-box; grid-template-columns: repeat(5, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 15px 6px; padding: 20px 6px 10px; overflow: hidden; border-radius: 14px; background: radial-gradient(ellipse at center, #204b62, #0c2332); touch-action: manipulation; }
.trottl-special-fish-slot { position: relative; display: grid; min-width: 0; place-items: end center; }
.trottl-special-fish-hole { width: var(--fish-catch-slot-size, 46px); height: var(--fish-catch-slot-size, 46px); box-sizing: border-box; border: 1px solid rgb(76 156 171 / 58%); border-radius: 50%; background: radial-gradient(circle at 50% 62%, #06131b 0 48%, #0b2832 72%, #123d49 100%); box-shadow: inset 0 5px 11px rgb(0 0 0 / 72%), 0 1px 5px rgb(56 155 176 / 20%); pointer-events: none; }
.trottl-special-fish { position: absolute; z-index: 2; bottom: 12px; left: 50%; width: var(--fish-catch-fish-size, 52px); height: var(--fish-catch-fish-size, 52px); padding: 0; border: 0; background: transparent; box-shadow: none; opacity: 0; transform: translate(-50%, 12px) scale(.82); animation: trottl-special-fish-pop var(--fish-catch-pop-ms, 120ms) ease-out forwards; touch-action: manipulation; -webkit-user-select: none; user-select: none; }
.trottl-special-fish.is-leaving { animation: trottl-special-fish-hide var(--fish-catch-pop-ms, 120ms) ease-in forwards; pointer-events: none; }
.trottl-special-fish.is-hit { filter: brightness(1.2); }
.trottl-special-fish img { display: block; width: 100%; height: 100%; object-fit: contain; pointer-events: none; -webkit-user-drag: none; }
.trottl-special-fish-score { margin: 8px 0 0; color: #fff; text-align: center; font-weight: 800; font-variant-numeric: tabular-nums; }
.trottl-special-fish-score.is-urgent { color: #ffa0a0; }
@keyframes trottl-special-fish-pop { 100% { opacity: 1; transform: translate(-50%, -8px) scale(1); } }
@keyframes trottl-special-fish-hide { 0% { opacity: 1; transform: translate(-50%, -8px) scale(1); } 100% { opacity: 0; transform: translate(-50%, 10px) scale(.84); } }
@media (prefers-reduced-motion: reduce) { .trottl-special-fish { animation-duration: 1ms; } }
.trottl-special-reaction-field { display: flex; width: min(100%, 420px); min-height: clamp(190px, 30dvh, 250px); box-sizing: border-box; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 16px; border: 1px solid rgb(105 188 207 / 38%); border-radius: 14px; background: radial-gradient(ellipse at center, #204b62, #0c2332); color: #fff; box-shadow: none; touch-action: manipulation; -webkit-user-select: none; user-select: none; }
.trottl-special-reaction-field:disabled { opacity: 1; color: #fff; }
.trottl-special-reaction-label { min-height: 24px; font-size: clamp(18px, 5vw, 24px); letter-spacing: .08em; }
.trottl-special-reaction-label.is-signal { color: #9fffc4; text-shadow: 0 0 12px rgb(106 255 167 / 50%); }
.trottl-special-reaction-stage { display: grid; width: 100%; min-height: clamp(105px, 18dvh, 150px); place-items: center; }
.trottl-special-reaction-salmon { grid-area: 1 / 1; display: block; width: clamp(150px, 50%, 220px); max-height: 145px; object-fit: contain; pointer-events: none; -webkit-user-drag: none; }
.trottl-special-reaction-result { grid-area: 1 / 1; color: #fff; font-size: clamp(28px, 9vw, 46px); font-variant-numeric: tabular-nums; text-align: center; }
.trottl-special-reaction-result.is-penalty, .trottl-special-minigame-results .is-penalty { color: #ff7189; }
@media (prefers-reduced-motion: reduce) { .trottl-special-reaction-salmon { animation: none; transition: none; } }
.trottl-special-minigame-shell.is-color-chaos { bottom: calc(env(safe-area-inset-bottom, 0px) + 105px); overflow: hidden; }
.trottl-special-minigame-shell.is-color-chaos.is-countdown .trottl-special-minigame-countdown { position: relative; z-index: 2; display: block; margin: auto; }
.trottl-special-minigame-shell.is-color-chaos .trottl-special-minigame-content { display: grid; width: min(100%, 330px); min-height: 0; place-items: center; }
.trottl-special-color-chaos-game { display: grid; width: 100%; height: clamp(300px, 43dvh, 390px); min-height: 0; grid-template-rows: clamp(44px, 7dvh, 58px) minmax(0, 1fr) clamp(26px, 4dvh, 34px); gap: clamp(8px, 1.5dvh, 12px); opacity: 1; }
.trottl-special-color-chaos-task-zone { display: grid; min-height: 0; place-items: center; opacity: 1; transition: opacity 150ms ease-out, transform 150ms ease-out; }
.trottl-special-color-chaos-grid-zone { position: relative; top: -10px; display: grid; min-height: 0; place-items: center; opacity: 1; transition: opacity 150ms ease-out, transform 150ms ease-out; }
.trottl-special-color-chaos-game.is-leaving .trottl-special-color-chaos-task-zone,
.trottl-special-color-chaos-game.is-leaving .trottl-special-color-chaos-grid-zone { opacity: 0; transform: scale(.98); pointer-events: none; }
.trottl-special-color-chaos-game.is-entering .trottl-special-color-chaos-task-zone,
.trottl-special-color-chaos-game.is-entering .trottl-special-color-chaos-grid-zone { animation: trottl-special-color-chaos-in 150ms ease-out; }
.trottl-special-color-chaos-game.is-transitioning { pointer-events: none; }
.trottl-special-color-chaos-prompt { min-height: 1.3em; margin: 0; color: #f5fbff; font-size: clamp(24px, 7.5vw, 36px); font-weight: 900; line-height: 1.1; letter-spacing: .035em; text-align: center; }
.trottl-special-color-chaos-prompt strong { color: inherit; font: inherit; text-shadow: 0 0 12px currentColor; }
.trottl-special-color-chaos-progress-zone { position: relative; top: -10px; display: grid; min-height: 0; place-items: center; box-sizing: border-box; padding-bottom: 12px; }
.trottl-special-color-chaos-progress { min-height: 1.3em; margin: 0; color: #f5fbff; font-size: clamp(13px, 3.8vw, 16px); font-weight: 800; font-variant-numeric: tabular-nums; text-align: center; }
.trottl-special-color-chaos-grid { display: grid; width: min(100%, 330px); height: 100%; min-height: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: clamp(8px, 2.5vw, 12px); touch-action: manipulation; }
.trottl-special-color-chaos-choice { display: grid; width: 100%; min-width: 0; min-height: 0; place-items: center; padding: 7px; border: 1px solid rgb(130 196 216 / 34%); border-radius: 14px; background: linear-gradient(150deg, rgb(24 52 65 / 96%), rgb(11 27 38 / 96%)); box-shadow: inset 0 1px 0 rgb(255 255 255 / 6%); touch-action: manipulation; }
.trottl-special-color-chaos-choice:disabled { opacity: 1; }
.trottl-special-color-chaos-choice.is-correct { border-color: rgb(105 239 158 / 88%); box-shadow: 0 0 14px rgb(66 223 130 / 38%); }
.trottl-special-color-chaos-choice.is-wrong { border-color: rgb(255 91 112 / 90%); box-shadow: 0 0 14px rgb(236 48 76 / 42%); }
.trottl-special-color-chaos-choice img { display: block; width: clamp(88px, 28vw, 126px); height: clamp(76px, 23vw, 112px); object-fit: contain; pointer-events: none; -webkit-user-drag: none; }
.trottl-special-color-chaos-result { color: #fff; font-size: clamp(30px, 9vw, 46px); font-variant-numeric: tabular-nums; text-align: center; }
@keyframes trottl-special-color-chaos-in { 0% { opacity: 0; transform: scale(.98); } 100% { opacity: 1; transform: scale(1); } }
@media (prefers-reduced-motion: reduce) { .trottl-special-color-chaos-task-zone, .trottl-special-color-chaos-grid-zone { transition-duration: 1ms; } .trottl-special-color-chaos-game.is-entering .trottl-special-color-chaos-task-zone, .trottl-special-color-chaos-game.is-entering .trottl-special-color-chaos-grid-zone { animation-duration: 1ms; } }
.trottl-special-minigame-shell.is-fish-memory { overflow: visible; }
.trottl-special-minigame-shell.is-fish-memory.is-gameplay { top: calc(env(safe-area-inset-top, 0px) + clamp(92px, 13dvh, 118px)); bottom: calc(env(safe-area-inset-bottom, 0px) + clamp(72px, 10dvh, 92px)); padding-block: clamp(20px, 3dvh, 26px); }
.trottl-special-minigame-shell.is-fish-memory .trottl-special-minigame-content { display: grid; width: min(100%, 330px); min-height: 0; place-items: center; }
.trottl-special-fish-memory-game { position: relative; display: grid; box-sizing: border-box; width: 100%; height: clamp(370px, 52dvh, 470px); min-height: 0; grid-template-rows: clamp(60px, 8dvh, 74px) minmax(0, 1fr) 42px; gap: 8px; padding: 10px; border-radius: 18px; background: rgb(7 22 31 / 38%); }
.trottl-special-fish-memory-header { display: grid; min-height: 0; grid-template-rows: auto auto 12px; align-content: center; place-items: center; gap: 2px; }
.trottl-special-fish-memory-instruction { max-width: 100%; margin: 0; color: #f7fbff; font-size: clamp(14px, 4vw, 18px); font-weight: 950; line-height: 1.02; letter-spacing: .02em; text-align: center; text-shadow: 0 0 9px rgb(255 255 255 / 20%); }
.trottl-special-fish-memory-instruction.is-watch { color: #ff6b73; text-shadow: 0 0 10px rgb(255 74 88 / 34%); }
.trottl-special-fish-memory-instruction.is-input { color: #72f0a4; text-shadow: 0 0 10px rgb(75 226 136 / 30%); }
.trottl-special-fish-memory-round { color: #dff7ff; font-size: clamp(12px, 3.6vw, 15px); font-variant-numeric: tabular-nums; }
.trottl-special-fish-memory-dots { display: flex; width: 100%; height: 12px; align-items: center; justify-content: center; gap: 4px; }
.trottl-special-fish-memory-dot { width: 10px; height: 10px; border: 1px solid rgb(225 244 250 / 62%); border-radius: 50%; background: rgb(5 17 24 / 78%); box-shadow: inset 0 0 3px rgb(0 0 0 / 60%); transition: background-color 100ms ease-out, box-shadow 100ms ease-out; }
.trottl-special-fish-memory-dot.is-filled { border-color: rgb(184 255 209 / 90%); background: #a7f3c5; box-shadow: 0 0 7px rgb(105 239 158 / 58%); }
.trottl-special-fish-memory-dots.is-passive .trottl-special-fish-memory-dot { opacity: .44; }
.trottl-special-fish-memory-grid { position: relative; display: grid; width: 100%; height: 100%; min-height: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: clamp(8px, 2.5vw, 12px); touch-action: manipulation; }
.trottl-special-fish-memory-countdown { position: absolute; z-index: 4; top: 50%; left: 50%; display: grid; min-width: 58px; min-height: 44px; place-items: center; margin: 0; translate: -50% -50%; color: #fff; line-height: 1; text-align: center; text-shadow: 0 0 12px rgb(0 0 0 / 88%), 0 0 16px rgb(255 255 255 / 42%); pointer-events: none; }
.trottl-special-fish-memory-choice { display: grid; width: 100%; min-width: 0; min-height: 0; place-items: center; padding: 6px; border: 1px solid rgb(130 196 216 / 30%); border-radius: 14px; background: linear-gradient(150deg, rgb(24 52 65 / 94%), rgb(11 27 38 / 94%)); box-shadow: inset 0 1px 0 rgb(255 255 255 / 6%); transition: border-color 90ms linear, box-shadow 90ms linear, filter 90ms linear, transform 90ms linear; touch-action: manipulation; }
.trottl-special-fish-memory-choice:disabled { opacity: 1; }
.trottl-special-fish-memory-choice img { display: block; width: clamp(82px, 26vw, 118px); height: clamp(68px, 20vw, 102px); object-fit: contain; filter: brightness(.88); pointer-events: none; -webkit-user-drag: none; }
.trottl-special-fish-memory-choice.is-sequence-active { z-index: 1; border-color: rgb(255 255 255 / 94%); background: linear-gradient(150deg, rgb(47 75 86 / 98%), rgb(22 42 53 / 98%)); box-shadow: 0 0 11px 4px rgb(255 255 255 / 76%), 0 0 26px 8px rgb(255 249 224 / 38%), inset 0 0 13px rgb(255 255 255 / 20%); transform: scale(1.06); }
.trottl-special-fish-memory-choice.is-sequence-active img { filter: brightness(1.18) drop-shadow(0 0 8px rgb(255 255 255 / 78%)); }
.trottl-special-fish-memory-timer { align-self: end; justify-self: center; display: grid; min-width: 74px; min-height: 34px; box-sizing: border-box; place-items: center; padding: 3px 12px; border: 1px solid rgb(152 210 225 / 30%); border-radius: 999px; background: rgb(5 18 27 / 68%); color: #e6f8ff; font-size: clamp(20px, 5vw, 25px); font-weight: 900; font-variant-numeric: tabular-nums; line-height: 1; text-align: center; box-shadow: inset 0 1px 0 rgb(255 255 255 / 5%); }
.trottl-special-fish-memory-timer:empty { visibility: hidden; }
.trottl-special-fish-memory-timer.is-urgent { color: #ff9a88; font-size: clamp(22px, 5.6vw, 28px); text-shadow: 0 0 8px rgb(255 97 78 / 40%); }
.trottl-special-fish-memory-result { display: grid; place-items: center; gap: 6px; color: #fff; text-align: center; }
.trottl-special-fish-memory-result strong { font-size: clamp(30px, 9vw, 46px); }
.trottl-special-fish-memory-result span { font-size: clamp(15px, 4vw, 19px); font-weight: 850; }
@media (prefers-reduced-motion: reduce) { .trottl-special-fish-memory-choice { transition: none; } }
.trottl-special-minigame-shell.is-stop-fish { bottom: calc(env(safe-area-inset-bottom, 0px) + 105px); overflow: hidden; }
.trottl-special-minigame-shell.is-stop-fish .trottl-special-minigame-content { display: grid; width: min(100%, 480px); min-height: 0; place-items: center; }
.trottl-special-stop-fish-game { display: grid; box-sizing: border-box; width: 100%; height: clamp(280px, 40dvh, 360px); min-height: 0; grid-template-rows: clamp(78px, 11dvh, 92px) minmax(0, 1fr) 28px; gap: 8px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.trottl-special-stop-fish-header { display: grid; box-sizing: border-box; min-height: 0; grid-template-rows: auto minmax(36px, 1fr); place-items: center; gap: 4px; padding: 8px 12px; border: 1px solid rgb(130 196 216 / 40%); border-radius: 16px; background: rgb(7 22 31 / 52%); }
.trottl-special-stop-fish-instruction { margin: 0; color: #f7fbff; font-size: clamp(13px, 3.8vw, 16px); font-weight: 850; line-height: 1.15; text-align: center; }
.trottl-special-stop-fish-status { display: grid; width: 100%; min-height: 36px; place-items: center; }
.trottl-special-stop-fish-countdown-layer { z-index: 2; grid-area: 1 / 1; display: grid; min-height: 36px; place-items: center; margin: 0; line-height: 1; text-align: center; pointer-events: none; }
.trottl-special-stop-fish-timer { grid-area:1 / 1; color:#f7fbff; font-size:26px; font-variant-numeric:tabular-nums; text-align:center; }
.trottl-special-stop-fish-timer.is-urgent { color:#ff756d; font-size:34px; animation:trottl-special-stop-fish-pulse 700ms ease-in-out infinite alternate; }
.trottl-special-stop-fish-track { position:relative; display:block; width:100%; min-height:0; overflow:hidden; padding:0; border:1px solid rgb(130 196 216 / 40%); border-radius:16px; background:linear-gradient(180deg,rgb(25 58 72 / 94%),rgb(9 27 38 / 94%)); touch-action:manipulation; }
.trottl-special-stop-fish-track:disabled { opacity:1; }
.trottl-special-stop-fish-shadow,.trottl-special-stop-fish-moving { position:absolute; top:50%; left:50%; width:50%; height:auto; aspect-ratio:2/1; object-fit:contain; translate:-50% -50%; pointer-events:none; }
.trottl-special-stop-fish-shadow { opacity:.34; filter:brightness(.5); }
.trottl-special-stop-fish-moving { transition:none; will-change:left; }
.trottl-special-stop-fish-local { min-height:1.3em; color:#f7fbff; text-align:center; }
.trottl-special-stop-fish-local.is-perfect { color:#a7f3c5; text-shadow:0 0 9px rgb(105 239 158 / 60%); }
.trottl-special-result-perfect { display:block; color:#a7f3c5; font-size:11px; white-space:nowrap; }
@keyframes trottl-special-stop-fish-pulse { 100% { text-shadow:0 0 12px rgb(255 90 80 / 70%); transform:scale(1.08); } }
@media (prefers-reduced-motion: reduce) { .trottl-special-stop-fish-timer.is-urgent { animation:none; } }
.trottl-special-minigame-title { color: white; text-align: center; font-size: clamp(24px, 7vw, 36px); margin: 0; }
.trottl-special-minigame-countdown { color: white; font-size: 30px; min-height: 36px; text-shadow: 0 0 16px rgb(255 255 255 / 40%); }
.trottl-special-minigame-copy, .trottl-special-number-hunt-progress { margin: 0; color: white; font-size: 12px; text-align: center; font-variant-numeric: tabular-nums; }
.trottl-special-minigame-content { width: min(100%, 276px); }
.trottl-special-number-hunt-board { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 10px; }
.trottl-special-number-hunt-board button { width: 100%; min-width: 44px; min-height: 48px; height: clamp(48px, 16vw, 72px); padding: 0; font-size: 26px; color: white; border: 1px solid rgb(255 255 255 / 35%); border-radius: 14px; background: linear-gradient(150deg, #294954, #172630); touch-action: manipulation; }
.trottl-special-number-hunt-board button.is-done { opacity: .28; background: #197045; }
.trottl-special-number-hunt-board.is-error-flash { animation: trottl-special-number-hunt-error 320ms ease-out; border-radius: 14px; }
@keyframes trottl-special-number-hunt-error { 0%, 55% { outline: 2px solid #d12b45; box-shadow: 0 0 18px 5px rgb(196 26 52 / 75%); } 100% { outline: 2px solid transparent; box-shadow: 0 0 0 transparent; } }
.trottl-special-minigame-done { box-shadow: 0 0 18px 4px rgb(48 215 125 / 90%); }
.trottl-special-minigame-waiting { box-shadow: 0 0 18px 4px rgb(255 255 255 / 75%); }
@media (prefers-reduced-motion: reduce) { .trottl-special-minigame-title { transition: none; } }
.trottl-special-minigame-shell.is-poison-fish .trottl-special-minigame-copy { white-space: pre-line; font-size: 14px; line-height: 1.5; }
.trottl-special-minigame-shell.is-poison-fish.is-gameplay { top: calc(env(safe-area-inset-top, 0px) + clamp(84px, 11dvh, 108px)); bottom: calc(env(safe-area-inset-bottom, 0px) + clamp(58px, 8dvh, 80px)); justify-content: stretch; padding: 10px; overflow: hidden; }
.trottl-special-minigame-shell.is-fish-count.is-gameplay { top: calc(env(safe-area-inset-top, 0px) + clamp(82px, 11dvh, 108px)); bottom: calc(env(safe-area-inset-bottom, 0px) + clamp(58px, 8dvh, 80px)); padding: 12px; overflow: hidden; }
.trottl-special-minigame-shell.is-fish-count.is-gameplay .trottl-special-minigame-content { display: flex; flex: 1 1 auto; width: 100%; min-height: 0; }
.trottl-special-fish-count-game { display: flex; flex-direction: column; width: 100%; min-height: 0; gap: 12px; }
.trottl-special-fish-count-header { display: flex; flex: 0 0 72px; flex-direction: column; align-items: center; justify-content: center; gap: 4px; min-height: 0; }
.trottl-special-fish-count-heading { flex: 0 0 auto; margin: 0; text-align: center; font-size: clamp(18px, 5vw, 25px); line-height: 1.2; color: #fff; }
.trottl-special-fish-count-timer-slot { display: grid; flex: 0 0 30px; min-height: 30px; place-items: center; }
.trottl-special-fish-count-timer { color: #dff7ff; font-size: clamp(20px, 5.5vw, 25px); font-weight: 800; font-variant-numeric: tabular-nums; line-height: 1; text-align: center; }
.trottl-special-fish-count-timer.is-urgent { color: #ff7585; font-size: clamp(25px, 7vw, 32px); font-weight: 950; text-shadow: 0 0 9px rgb(255 96 116 / 45%); }
.trottl-special-fish-count-field { position: relative; flex: 1 1 auto; min-height: 0; width: 100%; overflow: hidden; border-radius: 16px; background: rgb(255 255 255 / 6%); }
.trottl-special-fish-count-attention { position: absolute; inset: 0; display: grid; place-items: center; margin: 0; font-weight: 800; font-size: clamp(22px, 7vw, 32px); color: #fff; text-align: center; }
.trottl-special-fish-count-waiting { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: clamp(10px, 2dvh, 16px); padding: 16px; color: #fff; text-align: center; }
.trottl-special-fish-count-waiting strong { font-size: clamp(22px, 7vw, 32px); font-weight: 900; line-height: 1.15; }
.trottl-special-fish-count-waiting span { max-width: 280px; color: #c7d7de; font-size: clamp(14px, 3.8vw, 17px); font-weight: 600; line-height: 1.35; }
.trottl-special-fish-count-fishes { position: absolute; inset: 0; }
.trottl-special-fish-count-fishes img { position: absolute; width: var(--fish-count-size); height: var(--fish-count-size); object-fit: contain; pointer-events: none; }
.trottl-special-fish-count-game[data-size="large"] { --fish-count-size: clamp(46px, 13vw, 70px); }
.trottl-special-fish-count-game[data-size="medium"] { --fish-count-size: clamp(40px, 11vw, 58px); }
.trottl-special-fish-count-game[data-size="small"] { --fish-count-size: clamp(33px, 9vw, 48px); }
.trottl-special-fish-count-choices { position: absolute; inset: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: clamp(10px, 3vw, 18px); padding: clamp(12px, 4vw, 24px); }
.trottl-special-fish-count-choices button { min-width: 0; min-height: 54px; border: 1px solid rgb(255 255 255 / 42%); border-radius: 16px; background: rgb(255 255 255 / 14%); color: #fff; font: inherit; font-size: clamp(25px, 8vw, 40px); font-weight: 900; touch-action: manipulation; }
.trottl-special-fish-count-choices button:active:not(:disabled) { background: rgb(255 255 255 / 28%); transform: scale(.98); }
.trottl-special-fish-count-choices button:disabled { opacity: .7; }
.trottl-special-minigame-shell.is-catch-me.is-gameplay { top: calc(env(safe-area-inset-top, 0px) + clamp(60px, 7.5dvh, 76px)); right: max(10px, env(safe-area-inset-right, 0px)); bottom: calc(env(safe-area-inset-bottom, 0px) + clamp(40px, 5dvh, 52px)); left: max(10px, env(safe-area-inset-left, 0px)); justify-content: stretch; padding: 10px; overflow: hidden; }
.trottl-special-minigame-shell.is-catch-me.is-gameplay .trottl-special-minigame-countdown { position: absolute; z-index: 4; top: 50%; left: 50%; margin: 0; translate: -50% -50%; pointer-events: none; }
.trottl-special-minigame-shell.is-catch-me.is-gameplay .trottl-special-minigame-content { display: flex; flex: 1 1 auto; width: 100%; min-height: 0; }
.trottl-special-catch-me-game { display: flex; flex: 1 1 auto; width: 100%; min-height: 0; flex-direction: column; gap: 8px; }
.trottl-special-catch-me-header { display: grid; flex: 0 0 52px; min-height: 0; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 0 12px; color: #f7fcff; }
.trottl-special-catch-me-heading { margin: 0; font-size: clamp(18px, 5.2vw, 25px); font-weight: 950; line-height: 1.1; letter-spacing: .02em; }
.trottl-special-catch-me-progress { min-width: 48px; color: #ffe58d; font-size: clamp(14px, 4vw, 18px); font-weight: 900; font-variant-numeric: tabular-nums; text-align: right; }
.trottl-special-catch-me-field { position: relative; flex: 1 1 auto; width: 100%; min-height: 0; overflow: hidden; border: 1px solid rgb(135 204 224 / 30%); border-radius: 18px; background: radial-gradient(ellipse at 50% 38%, rgb(35 78 85 / 64%), rgb(7 28 39 / 90%)); touch-action: none; }
.trottl-special-catch-me-fish { position: absolute; top: 0; left: 0; display: block; width: clamp(56px, 14vw, 82px); height: clamp(56px, 14vw, 82px); object-fit: contain; pointer-events: none; -webkit-user-drag: none; will-change: transform; }
.trottl-special-catch-me-waiting { position: absolute; inset: 0; display: grid; place-items: center; padding: 20px; color: #eafaff; font-size: clamp(17px, 4.8vw, 22px); font-weight: 900; line-height: 1.3; text-align: center; }
.trottl-special-catch-me-waiting[hidden] { display: none; }
.trottl-special-catch-me-field.is-finished { touch-action: auto; }
.trottl-special-minigame-shell.is-poison-fish.is-gameplay .trottl-special-minigame-content { display: flex; flex: 1 1 auto; width: 100%; min-height: 0; }
.trottl-special-poison-fish-game { display: grid; flex: 1 1 auto; width: 100%; min-height: 0; grid-template-rows: 48px minmax(0, 1fr); gap: 8px; }
.trottl-special-poison-fish-header { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 12px; border: 1px solid rgb(135 204 224 / 36%); border-radius: 14px; background: rgb(8 28 39 / 85%); color: #f2fbff; font-size: clamp(16px, 4.5vw, 20px); font-weight: 900; font-variant-numeric: tabular-nums; }
.trottl-special-poison-fish-timer { display: grid; min-width: 42px; place-items: center; color: #e4faff; font-size: 24px; }
.trottl-special-poison-fish-timer.is-urgent { color: #ff8e95; text-shadow: 0 0 10px rgb(255 84 105 / 65%); }
.trottl-special-poison-fish-field { position: relative; width: 100%; min-height: 0; overflow: hidden; border: 1px solid rgb(135 204 224 / 36%); border-radius: 16px; background: radial-gradient(ellipse at 50% 35%, rgb(35 78 85 / 72%), rgb(7 28 39 / 94%)); touch-action: none; }
.trottl-special-poison-fish-fish { position: absolute; top: 0; left: 0; display: block; width: clamp(42px, 11vw, 62px); height: clamp(42px, 11vw, 62px); object-fit: contain; pointer-events: none; -webkit-user-drag: none; will-change: transform; }
.trottl-special-poison-fish-field.is-preview .trottl-special-poison-fish-fish { visibility: hidden; }
.trottl-special-poison-fish-field.is-finished .trottl-special-poison-fish-fish { opacity: .55; }
.trottl-special-poison-fish-countdown { position: absolute; z-index: 100002; top: 50%; left: 50%; margin: 0; translate: -50% -50%; pointer-events: none; text-shadow: 0 0 14px #04131c, 0 0 18px #fff; }
.trottl-special-poison-fish-hit { position: absolute; z-index: 100001; translate: -50% -50%; color: #e7fff0; font-size: 23px; font-weight: 950; text-shadow: 0 1px 7px #061923; pointer-events: none; animation: trottl-special-poison-hit 350ms ease-out forwards; }
.trottl-special-poison-fish-hit.is-gold { color: #ffe18b; }.trottl-special-poison-fish-hit.is-poison { color: #ff8998; }
@keyframes trottl-special-poison-hit { 100% { opacity: 0; transform: translateY(-18px); } }
@media (prefers-reduced-motion: reduce) { .trottl-special-poison-fish-hit { animation: none; } }
/* Server-authoritative two-player finale. */
.trottl-special-finale{position:absolute;inset:clamp(72px,10dvh,108px) 4% max(22px,env(safe-area-inset-bottom));z-index:18;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(10px,2dvh,22px);text-align:center;color:#fff;pointer-events:none}
.trottl-special-finale[hidden]{display:none}.trottl-special-finale-eyebrow{font-size:clamp(.68rem,1.6vw,.9rem);font-weight:900;letter-spacing:.2em;color:#bcecff}
.trottl-special-finale-title{margin:0;font-size:clamp(1.45rem,5vw,3.3rem);line-height:.95;text-shadow:0 4px 18px #001a2e,0 0 22px #19bff0;animation:trottl-special-finale-title-in .65s cubic-bezier(.2,.8,.2,1) both}
.trottl-special-finale-arena{width:min(900px,96%);display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:clamp(12px,4vw,48px)}
.trottl-special-finale-arena.is-single{grid-template-columns:minmax(0,1fr);width:min(420px,80%)}
.trottl-special-finale-card{min-width:0;display:flex;flex-direction:column;align-items:center;gap:7px;transform:scale(1.18);transform-origin:center;filter:drop-shadow(0 10px 18px #001522aa)}
.trottl-special-finale-card.is-left{animation:trottl-special-finale-left-in .65s ease-out both}.trottl-special-finale-card.is-right{animation:trottl-special-finale-right-in .65s ease-out both}
.trottl-special-finale-avatar{display:grid;place-items:center;width:clamp(92px,18vw,178px);aspect-ratio:1;border-radius:50%;border:4px solid #eafaff;background:#12384b;box-shadow:0 0 0 5px #083147aa,0 12px 26px #001a2eaa;overflow:hidden;transition:box-shadow .2s,filter .2s}
.trottl-special-finale-avatar img{width:100%;height:100%;object-fit:contain}.trottl-special-finale-avatar .is-fallback{width:100%;height:100%;background:radial-gradient(circle,#4c8299,#17394a)}
.trottl-special-finale-card>strong{max-width:min(30vw,260px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:clamp(.9rem,2.3vw,1.3rem);text-shadow:0 2px 6px #001}
.trottl-special-finale-card.is-ready .trottl-special-finale-avatar{box-shadow:0 0 0 6px #55f09a,0 0 30px #37e88bcc,0 12px 26px #001a2eaa}.trottl-special-finale-card>small{color:#78ffad;font-weight:900}
.trottl-special-finale-hearts{display:flex;gap:2px}.trottl-special-finale-hearts .trottl-special-heart{width:clamp(18px,3.6vw,30px)}
.trottl-special-finale-vs{font-size:clamp(1.8rem,7vw,4.8rem);font-weight:1000;font-style:italic;color:#fff;text-shadow:0 0 10px #ff3b54,4px 4px 0 #aa1730;animation:trottl-special-finale-vs .55s .18s cubic-bezier(.2,1.5,.4,1) both}
.trottl-special-finale-status{min-height:1.4em;margin:0;font-weight:800;text-shadow:0 2px 8px #001}.trottl-special-finale-ready{pointer-events:auto;border:0;border-radius:999px;padding:.85em 2.4em;background:linear-gradient(#7dffb2,#24c873);color:#072617;font-weight:1000;font-size:clamp(1rem,2.4vw,1.3rem);box-shadow:0 6px 0 #087d42,0 10px 22px #0018}.trottl-special-finale-ready:disabled{filter:saturate(.35);opacity:.75}
.trottl-special-finale-outcome{font-size:clamp(.72rem,1.8vw,1rem);letter-spacing:.08em}.trottl-special-finale-score{font-weight:900;color:#e7fbff}
.trottl-special-finale[data-phase="minigame"]{opacity:.18;z-index:3}.trottl-special-finale[data-phase="minigame"] .trottl-special-finale-title,.trottl-special-finale[data-phase="minigame"] .trottl-special-finale-status,.trottl-special-finale[data-phase="minigame"] .trottl-special-finale-vs{visibility:hidden}
@keyframes trottl-special-finale-title-in{0%{opacity:0;transform:translateY(-18px) scale(.86)}100%{opacity:1;transform:none}}@keyframes trottl-special-finale-left-in{0%{opacity:0;transform:translateX(-28vw) scale(.9)}100%{opacity:1;transform:scale(1.18)}}@keyframes trottl-special-finale-right-in{0%{opacity:0;transform:translateX(28vw) scale(.9)}100%{opacity:1;transform:scale(1.18)}}@keyframes trottl-special-finale-vs{0%{opacity:0;transform:scale(.2) rotate(-12deg)}100%{opacity:1;transform:none}}
@media(max-width:540px){.trottl-special-finale{inset:76px 2% max(16px,env(safe-area-inset-bottom));gap:10px}.trottl-special-finale-arena{gap:8px}.trottl-special-finale-card{transform:scale(1.08)}.trottl-special-finale-card.is-left,.trottl-special-finale-card.is-right{animation-name:none}.trottl-special-finale-avatar{width:clamp(82px,25vw,124px)}.trottl-special-finale-card>strong{max-width:30vw}}
@media(prefers-reduced-motion:reduce){.trottl-special-finale *{animation:none!important;transition:none!important}}