/* SCP-012 */
.staff { position: relative; height: 118px; margin-bottom: 4px; background: repeating-linear-gradient(to bottom, transparent 0 22px, #3d4443 22px 23px); background-size: 100% 115px; background-repeat: no-repeat; background-position: 0 4px; transition: box-shadow 3s; }
.staff .nt { position: absolute; font-size: 26px; line-height: 1; color: var(--accent); animation: inkIn .6s ease; }
.staff .nt.blood { color: #d0161e; text-shadow: 0 0 8px rgba(208,22,30,.6); }
.staff.bleed { box-shadow: inset 0 -40px 50px -24px rgba(194,29,36,.55); }
@keyframes inkIn { from { opacity: 0; transform: scale(1.8); filter: blur(4px); } }
body.redout .view { filter: sepia(1) saturate(7) hue-rotate(-45deg) brightness(.55); transition: filter .3s; }

/* rury i żyły */
.grow { position: fixed; inset: 0; z-index: 575; pointer-events: none; }
.grow svg { width: 100%; height: 100%; display: block; }
.grow path { fill: none; stroke-dasharray: 1; stroke-dashoffset: 1; stroke-linecap: round; stroke-linejoin: round; transition-property: stroke-dashoffset; transition-timing-function: linear; }
.grow.on path { stroke-dashoffset: 0; }
.grow.pipes path { stroke: #50565a; filter: drop-shadow(0 0 2px #000) drop-shadow(3px 3px 0 #1c1f21); }
.grow.pipes.leak path:nth-child(4) { stroke: #7a1016; }
.grow.flesh path { stroke: #8b0d14; filter: drop-shadow(0 0 6px rgba(160,10,20,.7)); animation: vein 2.2s ease-in-out infinite; }
@keyframes vein { 50% { stroke: #b3161f; } }

/* SCP-017 */
.lamps { display: flex; gap: 14px; margin: 6px 0 4px; }
.lamp { width: 46px; height: 46px; border-radius: 50%; cursor: pointer; border: 2px solid #2f3839; background: #111; transition: background .2s, box-shadow .2s; }
.lamp.on { background: radial-gradient(circle at 40% 35%, #fffbe6, #f1d77a 60%, #b18a2a); box-shadow: 0 0 22px rgba(255,236,160,.6); border-color: #b18a2a; }
.darkness { position: fixed; inset: 0; z-index: 578; pointer-events: none; background: #000; opacity: 0; transition: opacity .35s; }

/* SCP-058 */
.view.heartbeat { animation: beat 1.1s infinite; }
@keyframes beat { 0%, 40%, 100% { transform: none; } 10% { transform: scale(1.006); } 20% { transform: none; } 30% { transform: scale(1.004); } }
.heartglow { position: fixed; inset: 0; z-index: 570; pointer-events: none; box-shadow: inset 0 0 140px rgba(194,29,36,.55); animation: beatGlow 1.1s infinite; }
@keyframes beatGlow { 0%, 40%, 100% { opacity: .25; } 10% { opacity: 1; } 20% { opacity: .35; } 30% { opacity: .8; } }

/* SCP-066 */
.boom { position: fixed; inset: 0; z-index: 940; display: flex; align-items: center; justify-content: center; pointer-events: none; background: rgba(120,0,6,.35); }
.boom div { font-family: var(--head); font-size: clamp(48px, 12vw, 140px); color: #fff; letter-spacing: .06em; text-shadow: 0 0 30px #ff2a33, 4px 0 0 #ff2a33, -4px 0 0 #2af; animation: shake .25s infinite; }
.boom.big div { font-size: clamp(64px, 16vw, 200px); }

/* SCP-457 */
.ember { position: fixed; bottom: -10px; z-index: 576; pointer-events: none; border-radius: 50%; background: #ffc15a; box-shadow: 0 0 8px #ff8a1f, 0 0 16px #ff5a0f; animation: rise linear forwards; }
@keyframes rise { 0% { transform: translate(0, 0); opacity: 1; } 50% { transform: translate(20px, -55vh); } 100% { transform: translate(-15px, -110vh); opacity: 0; } }
.heat { position: fixed; left: 0; right: 0; bottom: 0; height: 40vh; z-index: 570; pointer-events: none; background: linear-gradient(to top, rgba(255,110,20,.28), transparent); transition: opacity 3s, height 3s; opacity: .7; }
.heat.hot { height: 65vh; opacity: 1; }

/* SCP-513 */
.ding { position: fixed; inset: 0; z-index: 945; pointer-events: none; display: flex; align-items: center; justify-content: center; background: rgba(255,255,255,.08); animation: dingOut .9s ease forwards; }
.ding span { font-family: var(--head); font-size: 90px; letter-spacing: .3em; color: rgba(255,255,255,.18); }
@keyframes dingOut { from { opacity: 1; } to { opacity: 0; } }
.tall { position: fixed; bottom: 0; z-index: 585; pointer-events: none; opacity: .78; filter: blur(1.2px); animation: tallIn 2.5s ease; }
.tall svg { width: 100%; height: 100%; display: block; }
@keyframes tallIn { from { opacity: 0; } }

/* SCP-1048 */
.bear { position: fixed; z-index: 610; width: 36px; height: 44px; color: #8a5a34; cursor: pointer; animation: bearIn .4s ease, wobble 1.6s ease-in-out infinite .4s; filter: drop-shadow(0 4px 6px rgba(0,0,0,.8)); }
.bear svg { width: 100%; height: 100%; display: block; }
.bear.evil { color: #b8908a; filter: drop-shadow(0 0 8px rgba(194,29,36,.9)); }
@keyframes bearIn { from { transform: scale(0); } }
@keyframes wobble { 50% { transform: rotate(-8deg); } }

/* SCP-3199 */
.egg { position: fixed; z-index: 612; width: 26px; height: 34px; cursor: pointer; border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%; background: radial-gradient(circle at 35% 30%, #fff8f2, #e8cfc6 60%, #b8958a); box-shadow: 0 4px 8px rgba(0,0,0,.7); animation: bearIn .3s ease; }
.egg.crack { animation: eggShake .15s infinite; background: radial-gradient(circle at 35% 30%, #fff8f2, #e8b8ad 60%, #9e6a5f); }
.egg.crack::after { content: ""; position: absolute; left: 20%; right: 20%; top: 40%; height: 2px; background: #3a0a0a; transform: rotate(-12deg); }
.egg.smash { transform: scaleY(.2) scaleX(1.6); opacity: 0; transition: .3s; }
@keyframes eggShake { 50% { transform: rotate(10deg); } }
.eggcount { position: fixed; left: 50%; top: 96px; transform: translateX(-50%); z-index: 760; padding: 9px 20px; font-family: var(--head); font-size: 15px; letter-spacing: .22em; color: var(--accent); background: rgba(8,10,11,.94); border: 1px solid var(--line-2); border-radius: 3px; box-shadow: 0 6px 24px rgba(0,0,0,.6); pointer-events: none; white-space: nowrap; }
.eggcount.red { color: #ff6a6f; border-color: var(--red); box-shadow: 0 0 22px rgba(200,30,40,.4); animation: pulse 1.4s infinite; }
@media (max-width: 720px) { .eggcount { top: 84px; font-size: 13px; padding: 7px 14px; } }

/* SCP-PL-1313 */
.card.cursed { animation: cursed 4s infinite steps(1); }
@keyframes cursed { 0%, 100% { border-color: var(--line); } 91% { border-color: var(--red); box-shadow: 0 0 20px var(--red-glow); } 93% { border-color: var(--line); box-shadow: none; } 95% { border-color: var(--red); } }
.pupil { position: absolute; z-index: 2; width: 2.4px; height: 2.4px; border-radius: 50%; background: #000; transform: translate(-50%, -50%); box-shadow: 0 0 2px #000; pointer-events: none; }
.knock-log { font-size: 15px; letter-spacing: .12em; color: #ff8a8f; min-height: 26px; line-height: 1.8; }
.knock-log b { display: block; margin-top: 8px; letter-spacing: .04em; }
.jumpscare { position: fixed; inset: 0; z-index: 990; background: #000; overflow: hidden; pointer-events: none; transition: opacity .45s; }
.jumpscare img { width: 100%; height: 100%; object-fit: cover; transform-origin: 50% 34%; filter: contrast(1.5) saturate(1.4) brightness(1.2); animation: lunge .5s cubic-bezier(.2,.9,.3,1) forwards; }
.jumpscare.out { opacity: 0; }
@keyframes lunge { from { transform: scale(1.4); } to { transform: scale(3.2); } }

/* SCP-610: macki do 50% skażenia, alarm, awaria i spalenie ryciny */
.flesh610 { position: fixed; inset: 0; z-index: 575; pointer-events: none; transition: opacity 2s, filter 1s; }
.flesh610 svg { width: 100%; height: 100%; display: block; transform-origin: 50% 50%; animation: breathe 3.2s ease-in-out infinite; }
.flesh610 .tents { filter: drop-shadow(0 0 6px rgba(120,0,10,.6)); }
.flesh610 path { fill: none; stroke-linecap: round; transition-property: stroke-dashoffset; transition-timing-function: ease-out; }
.flesh610.burnt { opacity: 0; filter: brightness(.3) sepia(1); }
@keyframes breathe { 50% { transform: scale(1.012); } }
.glow610 { position: fixed; inset: 0; z-index: 574; pointer-events: none; opacity: 0; transition: opacity 1s; }
.fleshglow { position: absolute; inset: 0; box-shadow: inset 0 0 240px rgba(110,0,10,.9); animation: beatGlow 1.1s infinite; }
.view.inf610 { filter: sepia(calc(var(--inf, 0) * .45)) saturate(calc(1 + var(--inf, 0))) hue-rotate(calc(var(--inf, 0) * -20deg)); transition: filter 1s; }
.redalert { position: fixed; inset: 0; z-index: 983; pointer-events: none; display: flex; align-items: center; justify-content: center; text-align: center; animation: redAlert .5s steps(1) infinite; }
.redalert div { font-family: var(--head); font-size: clamp(30px, 7vw, 76px); letter-spacing: .12em; color: #fff; text-shadow: 0 0 30px #ff1f2a, 0 0 4px #000; }
.redalert small { display: block; margin-top: 10px; font-family: var(--mono); font-size: clamp(11px, 1.6vw, 15px); letter-spacing: .3em; color: #ffd0d2; }
@keyframes redAlert { 0% { background: rgba(170,0,8,.55); } 50% { background: rgba(20,0,0,.25); } }
.redalert.act { pointer-events: auto; }
.redalert .btn { display: block; margin: 26px auto 0; font-size: 14px; background: rgba(0,0,0,.6); }
.blackout610 { position: fixed; inset: 0; z-index: 984; pointer-events: none; background: #000; opacity: .97; transition: opacity .12s; }
.blackout610.out { opacity: 0; transition: opacity 1.2s; }
.fire610 { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 4; pointer-events: none; filter: blur(1.2px) saturate(1.2); transition: opacity 1.5s; }
.fire610.out { opacity: 0; }
.fig-frame img.burning { filter: sepia(1) saturate(3) brightness(.55) contrast(1.4); transition: filter 2.5s; }

/* licencje i autorzy */
.credits { max-width: 980px; }
.credits h1 { margin: 8px 0 16px; font-family: var(--head); font-size: clamp(28px, 4vw, 40px); letter-spacing: .06em; color: var(--accent); line-height: 1.1; }
.credits p { color: var(--text-dim); max-width: 760px; }
.tbl { overflow-x: auto; border: 1px solid var(--line); }
.tbl table { width: 100%; border-collapse: collapse; font-size: 13px; }
.tbl th { text-align: left; font-weight: 500; font-size: 10px; letter-spacing: .16em; color: var(--text-mute); padding: 10px 14px; background: var(--bg-2); border-bottom: 1px solid var(--line); }
.tbl td { padding: 8px 14px; border-bottom: 1px solid rgba(34,41,42,.6); vertical-align: top; }
.tbl td:first-child { white-space: nowrap; font-weight: 700; }
.tbl tr:last-child td { border-bottom: 0; }
.lic-note { font-size: 12px; color: var(--text-mute) !important; margin-top: 10px; }
.lic-list { margin: 0; padding-left: 20px; color: var(--text-dim); font-size: 13.5px; }
.lic-list li { margin-bottom: 8px; }
.lic-list b { color: var(--text); }

/* przycisk dźwięku */
.snd-btn { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 30px; padding: 0; cursor: pointer; background: transparent; color: var(--accent); border: 1px solid var(--line-2); }
.snd-btn:hover { border-color: var(--accent); }
.snd-btn svg { width: 18px; height: 18px; }
.snd-btn .x { display: none; }
.snd-btn.off { color: var(--text-mute); }
.snd-btn.off .w { display: none; }
.snd-btn.off .x { display: inline; }

@media (max-width: 860px) {
  .status { gap: 8px; }
  .snd-btn { width: 30px; }
}

@media (prefers-reduced-motion: reduce) {
  .view.heartbeat, .heartglow, .boom, .jumpscare img { animation: none; }
}