.sheep-stage {
  position: absolute;
  inset: 0;
}

.sheep-three-canvas {
  display: block;
  width: 100%;
  height: 100%;
}

.sheep-death-feed {
  position: absolute;
  z-index: 8;
  top: 20px;
  left: 20px;
  display: grid;
  width: 156px;
  gap: 5px;
  pointer-events: none;
}

.sheep-death-feed p {
  margin: 0;
  padding: 7px 9px;
  border-left: 2px solid #ff9180;
  border-radius: 6px;
  background: rgba(16, 41, 42, .82);
  box-shadow: 0 8px 18px rgba(0, 0, 0, .2);
  color: #fff2e9;
  font: 800 9px/1.25 "Noto Sans KR", sans-serif;
  animation: sheep-death-notice 2.8s cubic-bezier(.22, .8, .2, 1) both;
  backdrop-filter: blur(10px);
}

@keyframes sheep-death-notice {
  0% { opacity: 0; transform: translateY(-8px); }
  12%, 72% { opacity: 1; transform: translateY(0); }
  100% { opacity: 0; transform: translateY(6px); }
}

.sheep-utility-actions {
  position: absolute;
  z-index: 8;
  right: 32px;
  bottom: 28px;
  display: flex;
  gap: 8px;
}

.sheep-utility-actions .game-panel-icon {
  position: static;
  --round-button-offset: translateY(0);
}

.sheep-utility-actions .game-audio {
  position: relative;
  inset: auto;
  flex: 0 0 32px;
  transform: none;
}

.sheep-utility-actions .game-audio .game-panel-sound {
  position: absolute;
  top: 50%;
  --round-button-offset: translateY(-50%);
}

.sheep-wrap .scene-explore-controls {
  left: 20px;
  bottom: 20px;
  transform: none;
}

@media (max-width: 520px) {
  .sheep-utility-actions { right:16px; bottom:60px; }
  .sheep-death-feed { top:16px; left:16px; width:108px; }
  .sheep-wrap .scene-explore-controls { left:16px; bottom:16px; gap:6px; }
  .theme-sheep .primary-actions { padding-right:80px; margin-bottom:32px; }
  .theme-sheep .sheep-night-count { font-size:18px; padding:8px 12px; margin-bottom:0; }
  .theme-sheep .game-action-buttons { max-width:100%; }
}

@media (prefers-reduced-motion: reduce) {
  .sheep-death-feed p { animation-name: sheep-death-notice-reduced; }
  @keyframes sheep-death-notice-reduced {
    0%, 100% { opacity: 0; }
    10%, 78% { opacity: 1; }
  }
}

.sheep-help-overlay[hidden] {
  display: none;
}

.theme-sheep .game-heading .result-banner {
  width: max-content;
  max-width: 100%;
}

@media (min-width: 600px) {
  .theme-sheep .game-heading .result-banner { white-space: nowrap; }
}

.sheep-help-overlay > .game-modal-panel {
  max-height: calc(100dvh - 32px);
}

.sheep-simulate-button {
  margin-top: 16px;
  min-width: 100px;
  padding: 8.667px 13.333px;
  font-size: .666667em;
}

.sheep-phase-count {
  position: absolute;
  z-index: 5;
  padding: 6px 16px;
  border-radius: 999px;
  background: rgba(10, 30, 45, .55);
  color: #fff;
  font: 700 20px/1.4 "Noto Sans KR", sans-serif;
  font-variant-numeric: tabular-nums;
  letter-spacing: .04em;
  pointer-events: none;
  white-space: nowrap;
}

.sheep-phase-count[hidden] {
  display: none;
}

.sheep-night-count {
  position: static;
  transform: none;
  margin: 0 auto;
  padding: 10px 26px;
  font-size: 26px;
  margin-bottom: 30px;
}

.sheep-impact-flash {
  position: absolute;
  inset: 0;
  z-index: 4;
  background: radial-gradient(circle at 50% 55%, rgba(255,255,255,.95), rgba(255,255,255,0) 60%);
  opacity: 0;
  pointer-events: none;
}

.sheep-skill-notice { --skill-ink:#a92740; --skill-edge:#ffc97d; position:absolute; z-index:7; bottom:112px; left:0; max-width:86%; box-sizing:border-box; padding:18px 48px 22px 28px; color:#fff5d9; font:900 italic clamp(32px,5vw,60px)/1.12 system-ui; letter-spacing:-.03em; overflow-wrap:normal; pointer-events:none; text-shadow:2px 3px 0 #411626,0 0 16px #ffbd7055; isolation:isolate; transform:rotate(-6deg); transform-origin:left center; animation:sheep-skill-enter .28s cubic-bezier(.16,1,.3,1) both; }
.sheep-skill-notice::before { content:''; position:absolute; z-index:-1; inset:0; background:repeating-linear-gradient(125deg,transparent 0 12px,#ffffff12 12px 15px),linear-gradient(100deg,#172533f5,var(--skill-ink)); border-top:2px solid var(--skill-edge); border-bottom:4px solid var(--skill-edge); clip-path:polygon(0 0,100% 0,91% 75%,97% 83%,84% 100%,0 100%); }
.sheep-skill-notice::after { content:''; position:absolute; left:0; bottom:-8px; width:72%; height:3px; background:var(--skill-edge); box-shadow:20px 6px 0 #ffefd344; }
.sheep-skill-notice[data-skill="disguise"] { --skill-ink:#39736d; --skill-edge:#d4f3c4; }
.sheep-wolf-feedback { position:absolute; z-index:6; transform:translate(-50%,-100%); text-align:center; pointer-events:none; white-space:nowrap; font:900 italic clamp(16px,2.4vw,25px)/1.5 system-ui; text-shadow:1px 2px 0 #301726,-1px -1px 0 #301726,0 0 6px #fff5; }
.sheep-wolf-feedback > div { transform-origin:center bottom; }
.sheep-kill-label { color:#ff4545; }
.sheep-combo-label { color:#ff82c6; margin-left:8px; }
.sheep-wool-label { color:#f5e5ff; }
.sheep-wolf-feedback[hidden],.sheep-wolf-feedback > [hidden] { display:none; }
.sheep-hit-accent { position:absolute; z-index:7; aspect-ratio:1; pointer-events:none; background-position:center; background-size:contain; background-repeat:no-repeat; }
.sheep-slash-impact { width:clamp(100px,11vw,160px); background-image:url('../../assets/sheep-hit-slash-v1.png'); transform-origin:70% 78%; transform:translate(-70%,-78%) rotate(var(--impact-angle,0deg)); animation:sheep-slash-pop .22s ease-out both; }
.sheep-finale-slash { width:clamp(190px,25vw,300px); }
.sheep-wolf-impact { width:clamp(150px,22vw,280px); background-image:url('../../assets/sheep-hit-burst-v1.png'); transform:translate(-50%,-50%); animation:sheep-burst-pop .24s ease-out both; }
.sheep-bite-impact { width:clamp(100px,11vw,160px); }
.sheep-disguise-impact { width:clamp(26px,3vw,42px); }
.sheep-skill-notice[hidden],.sheep-hit-accent[hidden] { display:none; }
@keyframes sheep-skill-enter { from { opacity:0; transform:translateX(-100%) rotate(-6deg) scaleX(1.15); } to { opacity:1; transform:translateX(0) rotate(-6deg) scaleX(1); } }
@keyframes sheep-slash-pop { from { transform:translate(-70%,-78%) rotate(var(--impact-angle,0deg)) scale(.7); } to { transform:translate(-70%,-78%) rotate(var(--impact-angle,0deg)) scale(1); } }
@keyframes sheep-burst-pop { from { transform:translate(-50%,-50%) scale(.65); } to { transform:translate(-50%,-50%) scale(1); } }
@media(prefers-reduced-motion:reduce) { .sheep-skill-notice,.sheep-hit-accent { animation:none; } }
@media(max-width:520px) {
  .sheep-skill-notice { bottom:125px; max-width:90%; font-size:30px; padding:14px 28px 16px 16px; }
  .sheep-bite-impact { width:100px; }
  .sheep-finale-slash { width:190px; }
}

.sheep-day-count {
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  font-size: 34px;
}

.sheep-versus { position:absolute; inset:0; z-index:6; overflow:hidden; pointer-events:none; }
.sheep-speed-lines { position:absolute; inset:0; z-index:3; pointer-events:none; border-radius:inherit; background:repeating-conic-gradient(from 15deg at 50% 55%,transparent 0deg 9deg,#e5faff90 9.2deg 9.7deg,transparent 10deg 18deg); mask-image:radial-gradient(ellipse,transparent 28%,#000 90%); animation:sheep-rush .18s linear infinite alternate; }
.sheep-speed-lines[hidden] { display:none; }
@keyframes sheep-rush { from { opacity:.25; } to { opacity:.6; } }
@media(prefers-reduced-motion:reduce) { .sheep-speed-lines { display:none; } }
.sheep-versus[hidden] { display:none; }
.sheep-victory { position:absolute; inset:0; z-index:6; overflow:hidden; pointer-events:none; border-radius:inherit; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; padding:0 20px 13%; box-sizing:border-box; }
.sheep-victory[hidden] { display:none; }
.sheep-victory span { color:#ffe39b; font:800 14px/1.6 system-ui; letter-spacing:.2em; text-shadow:0 2px 4px #142532; }
.sheep-victory strong { max-width:90%; overflow-wrap:anywhere; text-align:center; padding:10px 30px; border:1px solid #ffe5a8; border-radius:14px; background:linear-gradient(120deg,#193a49ee,#34616fee); color:#fff1cd; font:800 clamp(22px,4vw,38px)/1.3 system-ui; box-shadow:0 5px 24px #ffd37c45; animation:sheep-winner-enter .4s ease-out both; }
.sheep-victory i { position:absolute; left:var(--x); top:-20px; width:8px; height:16px; background:var(--color); animation:sheep-confetti 3.6s var(--delay) linear infinite both; }
@keyframes sheep-winner-enter { from { opacity:0; transform:translateY(12px) scale(.9); } to { opacity:1; transform:none; } }
@keyframes sheep-confetti { from { transform:translateY(0) rotate(0); opacity:1; } to { transform:translateY(85vh) rotate(540deg); opacity:0; } }
@media(prefers-reduced-motion:reduce) { .sheep-victory strong { animation:none; } .sheep-victory i { display:none; } }
.sheep-fighter { position:absolute; width:min(48%,360px); padding:18px 28px; opacity:0; color:#fff5df; background:repeating-linear-gradient(125deg,transparent 0 9px,#ffffff0c 9px 12px),linear-gradient(125deg,#182738,#3e5266); box-shadow:0 5px 0 #eebb62,0 12px 30px #0005; transform:translateX(-110%) skewY(-9deg); }
.sheep-fighter small { display:block; font:800 9px/1.4 system-ui; letter-spacing:.2em; }
.sheep-fighter strong { display:block; font:900 italic clamp(32px,6vw,76px)/1.1 system-ui; text-shadow:3px 4px 0 #101c2c; }
.sheep-fighter-wolf { left:0; top:23%; border-right:6px solid #ff815f; }
.sheep-fighter-sheep { right:0; bottom:18%; color:#153d41; background:repeating-linear-gradient(125deg,transparent 0 9px,#ffffff28 9px 12px),linear-gradient(125deg,#f5eac7,#89d5bf); transform:translateX(110%) skewY(-9deg); border-left:6px solid #fff5c0; }
.sheep-fighter-sheep strong { text-shadow:2px 3px 0 #ffffffa0; }
.sheep-versus[data-beat="wolf"] .sheep-fighter-wolf,.sheep-versus[data-beat="sheep"] .sheep-fighter-sheep,.sheep-versus[data-beat="vs"] .sheep-fighter { opacity:1; transform:translateX(0) skewY(-9deg); animation:sheep-fighter-enter .25s ease-out both; }
.sheep-versus-mark { display:none; position:absolute; left:50%; top:51%; transform:translate(-50%,-50%) rotate(-10deg); color:#fff4c1; font:900 italic clamp(64px,13vw,150px)/1 system-ui; text-shadow:5px 6px 0 #ae452c,0 0 26px #ffb840; }
.sheep-versus[data-beat="vs"] .sheep-versus-mark { display:block; animation:sheep-vs-impact .25s ease-out both; }
@keyframes sheep-fighter-enter { from { opacity:0; filter:brightness(2); } to { opacity:1; filter:brightness(1); } }
@keyframes sheep-vs-impact { from { opacity:0; transform:translate(-50%,-50%) rotate(-10deg) scale(1.8); } to { opacity:1; transform:translate(-50%,-50%) rotate(-10deg) scale(1); } }
@media(max-width:520px) { .sheep-fighter { width:55%; padding:14px 16px; } .sheep-fighter small { font-size:7px; } }
@media(prefers-reduced-motion:reduce) { .sheep-versus .sheep-fighter,.sheep-versus .sheep-versus-mark { animation:none!important; } }