/* EL-PIERROS · fx.css – Spiel-Ebene */

/* Grüner Scan über den Header-Motiven: aus */
.scan{display:none!important}

/* Fadenkreuz-Cursor */
html.fx-hov,html.fx-hov *{cursor:none!important}
#fxCursor{position:fixed;left:0;top:0;z-index:99998;pointer-events:none;opacity:0;transition:opacity 200ms ease;will-change:transform}
#fxCursor.on.hot,#fxCursor.on.lock{opacity:1}
.fx-box{position:absolute;left:-14px;top:-14px;width:28px;height:28px;filter:drop-shadow(0 0 1px rgba(0,0,0,.9));transition:transform 160ms cubic-bezier(0.23,1,0.32,1)}
.fx-box i{position:absolute;width:8px;height:8px;border:0 solid #fff;transition:border-color 160ms ease}
.fx-box i:nth-child(1){left:0;top:0;border-top-width:1px;border-left-width:1px}
.fx-box i:nth-child(2){right:0;top:0;border-top-width:1px;border-right-width:1px}
.fx-box i:nth-child(3){left:0;bottom:0;border-bottom-width:1px;border-left-width:1px}
.fx-box i:nth-child(4){right:0;bottom:0;border-bottom-width:1px;border-right-width:1px}
.fx-dot{position:absolute;left:-2px;top:-2px;width:4px;height:4px;background:#fff;transform:rotate(45deg);filter:drop-shadow(0 0 1px rgba(0,0,0,.9));transition:background-color 160ms ease}
#fxCursor.hot .fx-box{transform:scale(1.25)}
#fxCursor.lock .fx-box{transform:scale(1.7)}
#fxCursor.lock .fx-box i{border-color:#33FF99}
#fxCursor.lock .fx-dot{background:#33FF99}
#fxCursor.press .fx-box{transform:scale(.8)}
.fx-tag{position:absolute;left:30px;top:16px;white-space:nowrap;background:#000;color:#33FF99;font:700 11px/1 ui-monospace,Menlo,monospace;letter-spacing:1px;padding:5px 8px;opacity:0;transform:translateX(-4px);transition:opacity 160ms ease,transform 160ms cubic-bezier(0.23,1,0.32,1)}
#fxCursor.lock .fx-tag{opacity:1;transform:none}

/* HUD: Files decrypted */
#fxHud{position:fixed;left:24px;bottom:16px;z-index:35;display:flex;gap:14px;align-items:center;height:28px;padding:0 10px;background:rgba(0,0,0,.78);border:1px solid #1f1f1f;font:700 11px/1 ui-monospace,Menlo,monospace;letter-spacing:1px;color:#A3A3A3;text-transform:uppercase;opacity:0;pointer-events:none;transition:opacity 300ms ease,border-color 160ms ease}
#fxHud.on{opacity:1;pointer-events:auto}
#fxHud .n{color:#fff;font-variant-numeric:tabular-nums;transition:color 160ms ease}
#fxHud .h{color:#33FF99}
#fxHud.flash .n,#fxHud.done .n{color:#33FF99}
#fxHud.flash{border-color:#33FF99}
body.player-open #fxHud{opacity:0;pointer-events:none}
@media (pointer:coarse){#fxHud .h{display:none}}

/* Konsole */
#fxCon{position:fixed;left:0;right:0;bottom:0;z-index:99990;height:min(46vh,420px);display:flex;flex-direction:column;background:rgba(0,0,0,.94);border-top:1px solid #33FF99;font:14px/1.55 ui-monospace,Menlo,Consolas,monospace;color:#33FF99;clip-path:inset(100% 0 0 0);visibility:hidden;transition:clip-path 300ms cubic-bezier(0.23,1,0.32,1),visibility 0s 300ms}
#fxCon.open{clip-path:inset(0 0 0 0);visibility:visible;transition:clip-path 300ms cubic-bezier(0.23,1,0.32,1),visibility 0s}
.fx-con-out{flex:1;overflow:auto;padding:20px 24px 8px;white-space:pre-wrap;word-break:break-word}
.fx-con-out .w,.fx-con-out span.w{color:#fff}
.fx-con-out .e{color:#DD4444}
.fx-con-out .d{color:#A3A3A3}
.fx-con-out .y{color:#DEE369}
.fx-con-row{display:flex;gap:10px;align-items:center;padding:8px 24px 20px}
.fx-pr{color:#fff;white-space:nowrap}
#fxIn{flex:1;min-width:0;background:none;border:0;outline:0;color:#33FF99;font:inherit;caret-color:#33FF99}

/* Toast */
#fxToast{position:fixed;left:50%;top:24px;z-index:99995;max-width:calc(100vw - 48px);transform:translate(-50%,-12px);opacity:0;background:#000;border:1px solid #33FF99;color:#33FF99;font:700 12px/1.4 ui-monospace,Menlo,monospace;letter-spacing:2px;text-transform:uppercase;text-align:center;padding:10px 16px;pointer-events:none;transition:opacity 250ms ease,transform 250ms cubic-bezier(0.23,1,0.32,1)}
#fxToast.on{opacity:1;transform:translate(-50%,0)}

/* Konami-Modus */
body.fx-glitch #homeHead,body.fx-glitch #homeContent,body.fx-glitch .case-head,body.fx-glitch #caseMain{animation:fxJit 140ms steps(2) infinite;filter:hue-rotate(80deg) saturate(1.5) contrast(1.1)}
body.fx-glitch .hl,body.fx-glitch .lb-title,body.fx-glitch .case-title,body.fx-glitch .brand-title{text-shadow:3px 0 #DD4444,-3px 0 #33FF99}
@keyframes fxJit{0%{transform:translate(0,0)}50%{transform:translate(-2px,1px)}100%{transform:translate(2px,-1px)}}
#fxRain{position:fixed;inset:0;z-index:99980;pointer-events:none;opacity:.55}

/* Screensaver */
#fxSaver{position:fixed;inset:0;z-index:99985;background:#000;opacity:0;transition:opacity 600ms ease}
#fxSaver.on{opacity:1}
#fxSaver video,#fxSaver canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.fx-sv-msg{position:absolute;left:50%;bottom:15%;transform:translateX(-50%);background:#000;color:#33FF99;font:700 13px/1 ui-monospace,Menlo,monospace;letter-spacing:3px;padding:12px 18px;white-space:nowrap}
.fx-sv-msg .c{animation:fxBlink 1s steps(1) infinite}
@keyframes fxBlink{50%{opacity:0}}

/*EP-PATCH:u3*/
/* ───── Update 3 ───── */

/* iPhone / Safari */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;overflow-x:hidden}
@supports (overflow:clip){html,body{overflow-x:clip}}
body{-webkit-tap-highlight-color:transparent}
button{-webkit-appearance:none;appearance:none;border-radius:0}

/* Kein grüner Rahmen um die Case-Headline nach dem Eintauchen */
#caseH1:focus,#caseH1:focus-visible{outline:none}

/* Mitscrollender Zurück-Button mit grauer Outline (wie Files decrypted) */
.diamond.case-back::before{background:rgba(0,0,0,.78);box-shadow:inset 0 0 0 1px #333}
#fxHud{border-color:#333}

/* Balken bei mehrzeiligen Titeln nur vor der ersten Zeile */
.case-title,.lb-title{align-items:flex-start}
.case-title .mk{margin-top:.125em}
.lb-title .mk{margin-top:.15em}

/* Mobile: alles linksbündig, nichts ragt über den Rand */
@media (max-width:767px){
  .hl,.hl.end,.hl.center{justify-content:flex-start;text-align:left}
  .hl{font-size:clamp(22px,6.4vw,32px);letter-spacing:2px;-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word}
  .hl .tx{min-width:0}
  .m10.right .m10-txt{text-align:left}
  .m10.right .m10-line{margin-left:0;transform-origin:left}
  .m10.right .copy,.m16 .copy{margin-left:0;margin-right:0}
  .m16{text-align:left}
  .case-label{max-width:calc(100vw - 2 * var(--pad))}
  .case-title{white-space:normal;font-size:clamp(22px,7vw,34px);letter-spacing:2px;-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word}
  .case-kicker{white-space:normal}
  .teaser .label{max-width:calc(100% - 2 * var(--pad))}
  .lb-title{white-space:normal;letter-spacing:2px;overflow-wrap:break-word}
  .brand-title{letter-spacing:2px}
  .fx-sv-msg{white-space:normal;text-align:center;width:calc(100vw - 48px);line-height:1.5}
  #fxIn{font-size:16px}
}

/* ASCII-Ladebalken */
.fx-load{position:absolute;left:50%;top:50%;z-index:4;transform:translate(-50%,-50%);pointer-events:none;font:400 14px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:0;color:#DEE369;white-space:nowrap;opacity:0;transition:opacity 250ms ease}
.fx-load.on{opacity:1}
.fx-load span{display:inline-block;animation:fxPulse 2.4s ease-in-out infinite}
.fx-load.out{opacity:0}
@keyframes fxPulse{0%,100%{opacity:1}50%{opacity:.7}}
#pBg:has(.fx-load:not(.out)) ~ .p-note{display:none}

/*EP-PATCH:u4*/
/* ───── Update 4 ───── */

/* Kategorie-Seiten: Teaser direkt unter dem Header */
#case.is-cat #caseMain > .wrap:first-child,#case.is-cat .gal-top{display:none}
#case.is-cat #catList{border-top:0}

/* Trenner in Kategorien */
#catList .cat-break{padding-top:96px;padding-bottom:40px}
#catList .cat-break .fu{margin-top:16px}
#catList .cat-break .copy{color:#A3A3A3}

/* Login: Password? */
.pw-guest{display:inline-flex;align-items:center;min-height:44px;margin-top:8px;color:#A3A3A3;font:400 13px/1.4 "Roboto Condensed",system-ui,sans-serif;letter-spacing:1px;transition:color 160ms ease}
@media (hover:hover) and (pointer:fine){.pw-guest:hover{color:#DD4444}}

/* Videos: Zoom-Drift nur auf Standbildern, nie auf laufenden Videos */
.case-head.awake #caseMedia{animation:none}
.case-head.awake #caseMedia > canvas{animation:drift 9s ease-in-out infinite alternate}
body.player-open .case-head #caseMedia > canvas{animation-play-state:paused}

/*EP-PATCH:novig*/
#homeHead .vignette{display:none}