/* =====================================================================
   MELTDOWN STYLE: HACKER (earlier version)
   ===================================================================== */
[data-meltdown="hacker"] #fx{
  --cp-red:#ff003c; --cp-red-2:#ff4d6d; --cp-dark:#12000a; --cp-cyan:#00f0ff; --cp-yellow:#fcee0a;
  font-family:"Rajdhani","JetBrains Mono",sans-serif;
}
[data-meltdown="hacker"] .postcode-msg{color:#ff4d6d!important;font-family:"JetBrains Mono",monospace}

.cp-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}

/* scanlines + vignette + daze */
.cp-scan{position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,.28) 0 1px,transparent 1px 3px);mix-blend-mode:multiply;opacity:0;transition:opacity .2s}
.cp-scan.on{opacity:1}
.cp-vignette{position:absolute;inset:-10%;pointer-events:none;background:radial-gradient(ellipse at center,transparent calc(var(--open,70%) - 25%),rgba(20,0,4,.85) var(--open,70%),#000 calc(var(--open,70%) + 15%));opacity:0;transition:opacity .4s}
.cp-vignette.on{opacity:1}
.cp-flash{position:absolute;inset:0;background:var(--cp-red);mix-blend-mode:screen;opacity:0;pointer-events:none}

/* regional optical blur */
.cp-blurzone{position:absolute;pointer-events:none;-webkit-backdrop-filter:blur(var(--b,8px)) saturate(1.8) brightness(1.15);backdrop-filter:blur(var(--b,8px)) saturate(1.8) brightness(1.15);border-top:1px solid rgba(255,0,60,.6);border-bottom:1px solid rgba(0,240,255,.25)}

/* HUD */
.cp-hud{position:absolute;inset:0;pointer-events:none;color:var(--cp-red);text-transform:uppercase;opacity:0}
.cp-hud.on{opacity:1;animation:cpHudIn .5s steps(6)}
@keyframes cpHudIn{0%{opacity:0}20%{opacity:1}35%{opacity:0}60%{opacity:1}75%{opacity:.2}100%{opacity:1}}
.cp-corner{position:absolute;width:48px;height:48px;border:3px solid var(--cp-red)}
.cp-corner.tl{top:18px;left:18px;border-right:0;border-bottom:0}
.cp-corner.tr{top:18px;right:18px;border-left:0;border-bottom:0}
.cp-corner.bl{bottom:18px;left:18px;border-right:0;border-top:0}
.cp-corner.br{bottom:18px;right:18px;border-left:0;border-top:0}
.cp-hud-tl{position:absolute;top:30px;left:80px;font-weight:700;font-size:26px;letter-spacing:.08em;line-height:1;text-shadow:0 0 12px rgba(255,0,60,.7)}
.cp-hud-tl span{display:block;font:500 12px "JetBrains Mono",monospace;letter-spacing:.12em;margin-top:6px;color:var(--cp-red-2)}
.cp-hud-tr{position:absolute;top:30px;right:80px;text-align:right;font:700 13px "JetBrains Mono",monospace;letter-spacing:.1em;line-height:1.5}
.cp-hud-tr .cp-clock{font-size:22px;color:#fff;text-shadow:0 0 10px var(--cp-red)}
.cp-hud-bl{position:absolute;bottom:34px;left:80px;font:700 13px "JetBrains Mono",monospace;letter-spacing:.1em}
.cp-hud-bl b{color:var(--cp-yellow)}
.cp-ticker{position:absolute;left:0;right:0;bottom:70px;height:22px;overflow:hidden;background:rgba(255,0,60,.12);border-top:1px solid rgba(255,0,60,.5);border-bottom:1px solid rgba(255,0,60,.5)}
.cp-ticker div{white-space:nowrap;font:700 12px/22px "JetBrains Mono",monospace;letter-spacing:.14em;color:var(--cp-red-2);animation:cpTicker 6s linear infinite}
@keyframes cpTicker{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (max-width:700px){.cp-hud-tl{left:30px;top:74px;font-size:20px}.cp-hud-tr{right:30px;top:26px}.cp-hud-tr .cp-clock{font-size:16px}.cp-hud-bl{left:30px;font-size:11px}.cp-corner{width:30px;height:30px}}

/* Warning pop-ups: a line that expands into a window */
.cp-pop{position:absolute;pointer-events:none;filter:drop-shadow(0 0 14px rgba(255,0,60,.45));animation:cpExpand .42s cubic-bezier(.2,.9,.1,1) both}
.cp-pop.out{animation:cpCollapse .22s steps(4) forwards}
@keyframes cpExpand{
  0%{clip-path:inset(50% 50% 50% 50%);transform:scale(1.25)}
  35%{clip-path:inset(calc(50% - 1px) 0 calc(50% - 1px) 0);transform:scale(1.1)}
  100%{clip-path:inset(0 0 0 0);transform:scale(1)}
}
@keyframes cpCollapse{
  0%{clip-path:inset(0 0 0 0);opacity:1}
  50%{clip-path:inset(calc(50% - 1px) 0 calc(50% - 1px) 0);opacity:1}
  100%{clip-path:inset(50% 0 50% 100%);opacity:0}
}
.cp-pop-in{background:linear-gradient(180deg,rgba(40,0,10,.92),rgba(12,0,5,.94));border:1px solid var(--cp-red);clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,18px 100%,0 calc(100% - 18px));color:#ffd6de}
.cp-pop-head{display:flex;justify-content:space-between;gap:12px;background:var(--cp-red);color:#000;padding:4px 22px 4px 10px;font-weight:700;font-size:17px;letter-spacing:.08em;text-transform:uppercase}
.cp-pop-head span:last-child{font:700 11px/22px "JetBrains Mono",monospace}
.cp-pop-body{padding:12px 14px 14px}
.cp-pop-body p{margin:0 0 10px;font-weight:600;font-size:16px;line-height:1.2;letter-spacing:.04em;text-transform:uppercase}
.cp-pop-body p small{display:block;font:500 11px "JetBrains Mono",monospace;color:var(--cp-red-2);letter-spacing:.06em;margin-top:4px;text-transform:none}
.cp-bar{height:12px;border:1px solid rgba(255,0,60,.7);padding:2px;background:rgba(255,0,60,.08)}
.cp-bar i{display:block;height:100%;width:0;background:repeating-linear-gradient(90deg,var(--cp-red) 0 6px,transparent 6px 8px)}
.cp-pop-foot{display:flex;justify-content:space-between;margin-top:6px;font:700 11px "JetBrains Mono",monospace;letter-spacing:.1em;color:var(--cp-red-2)}
.cp-pop.failed .cp-status{color:var(--cp-yellow);animation:cpBlink .3s steps(2) infinite}
.cp-pop.failed .cp-pop-head{background:var(--cp-yellow)}
.cp-pop.cyan .cp-pop-in{border-color:var(--cp-cyan);color:#d5fbff}
.cp-pop.cyan .cp-pop-head{background:var(--cp-cyan)}
.cp-pop.cyan .cp-bar{border-color:var(--cp-cyan)}
.cp-pop.cyan .cp-bar i{background:repeating-linear-gradient(90deg,var(--cp-cyan) 0 6px,transparent 6px 8px)}
.cp-pop.cyan{filter:drop-shadow(0 0 14px rgba(0,240,255,.35))}
.cp-pop.split .cp-pop-in{animation:cpSplit .1s steps(2) infinite}
@keyframes cpSplit{0%{transform:translate(2px,0);box-shadow:-3px 0 0 rgba(0,240,255,.6)}100%{transform:translate(-2px,1px);box-shadow:3px 0 0 rgba(255,0,60,.8)}}
@keyframes cpBlink{50%{opacity:0}}

/* full-width warning banner */
.cp-banner{position:absolute;left:0;right:0;height:120px;display:flex;align-items:center;justify-content:center;gap:28px;background:repeating-linear-gradient(-45deg,var(--cp-yellow) 0 22px,#000 22px 44px);animation:cpBanner .35s cubic-bezier(.2,.9,.1,1) both}
.cp-banner.out{animation:cpCollapse .2s steps(4) forwards}
.cp-banner b{background:#000;color:var(--cp-yellow);padding:6px 26px;font-weight:700;font-size:clamp(26px,5vw,58px);letter-spacing:.14em;text-transform:uppercase}
@keyframes cpBanner{0%{clip-path:inset(48% 50% 48% 50%)}40%{clip-path:inset(48% 0 48% 0)}100%{clip-path:inset(0 0 0 0)}}

/* big central failure text with split-channel glitch */
.cp-big{position:absolute;inset:0;display:grid;place-items:center;text-align:center;pointer-events:none}
.cp-big .t{position:relative;font-weight:700;font-size:clamp(54px,11vw,170px);line-height:.9;letter-spacing:.04em;color:#fff;text-transform:uppercase;text-shadow:0 0 30px rgba(255,0,60,.9);animation:cpExpand .45s cubic-bezier(.2,.9,.1,1) both}
.cp-big .t::before,.cp-big .t::after{content:attr(data-text);position:absolute;inset:0}
.cp-big .t::before{color:var(--cp-red);animation:cpSlice1 .18s steps(2) infinite;mix-blend-mode:screen}
.cp-big .t::after{color:var(--cp-cyan);animation:cpSlice2 .23s steps(2) infinite;mix-blend-mode:screen}
.cp-big small{display:block;margin-top:18px;font:700 clamp(12px,1.6vw,20px) "JetBrains Mono",monospace;letter-spacing:.3em;color:var(--cp-red-2)}
@keyframes cpSlice1{0%{clip-path:inset(10% 0 60% 0);transform:translate(-8px,0)}50%{clip-path:inset(55% 0 20% 0);transform:translate(10px,0)}100%{clip-path:inset(30% 0 45% 0);transform:translate(-4px,0)}}
@keyframes cpSlice2{0%{clip-path:inset(70% 0 5% 0);transform:translate(8px,0)}50%{clip-path:inset(5% 0 75% 0);transform:translate(-10px,0)}100%{clip-path:inset(40% 0 35% 0);transform:translate(6px,0)}}

/* CRT switch-off */
.cp-off{position:absolute;inset:0;pointer-events:none}
.cp-off .half{position:absolute;left:0;right:0;height:50%;background:#000}
.cp-off .top{top:0;transform:translateY(-100%)}
.cp-off .bot{bottom:0;transform:translateY(100%)}
.cp-off .line{position:absolute;left:0;right:0;top:50%;height:4px;margin-top:-2px;background:#fff;box-shadow:0 0 20px 6px var(--cp-red),0 0 60px 20px rgba(255,0,60,.6);opacity:0}
.cp-off.go .top,.cp-off.go .bot{transition:transform .28s cubic-bezier(.7,0,1,1);transform:translateY(0)}
.cp-off.go .line{animation:cpLine .9s .26s forwards}
@keyframes cpLine{0%{opacity:1;transform:scaleX(1)}35%{opacity:1;transform:scaleX(.004)}70%{opacity:1;transform:scaleX(.004) scaleY(1.2)}100%{opacity:0;transform:scaleX(0)}}
.cp-off.fade{background:#000;opacity:0;transition:opacity 1.2s}
.cp-off.fade.go{opacity:1}
.cp-off{z-index:9999}
.cp-big{z-index:900}
.cp-hud{z-index:950}
body.melting[data-meltdown="hacker"] .site-header{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;border-color:transparent}
