/*
 * DataDab "Control Room" — instrumentation & micro-interaction layer.
 * Loaded by pages via <link rel="stylesheet" href="/assets/css/cr-effects.css">.
 * Pairs with /assets/js/cr-effects.js (count-ups, typing, glow tracking).
 * Contract: decoration only — opacity/transform animations, no layout shifts,
 * everything hard-disabled under prefers-reduced-motion (see theme.css).
 */

/* ============ hero scanline ============ */
.hero::after{content:'';position:absolute;left:0;right:0;height:140px;top:0;background:linear-gradient(to bottom,transparent,rgba(255,176,0,.045),transparent);animation:cr-scan 9s linear infinite;pointer-events:none;z-index:1;}
@keyframes cr-scan{from{transform:translateY(-160px);}to{transform:translateY(max(90vh,900px));}}

/* ============ console chrome for panels ============ */
.console-bar{display:flex;align-items:center;gap:.55rem;font-family:var(--font-mono);font-size:.66rem;color:var(--cr-faint);letter-spacing:.14em;text-transform:uppercase;border-bottom:1px solid var(--cr-border);padding-bottom:.9rem;margin-bottom:1.4rem;}
.console-bar i{width:8px;height:8px;border-radius:50%;background:var(--cr-border-2);}
.console-bar i:nth-child(1){background:#FF5C5C;}
.console-bar i:nth-child(2){background:var(--cr-amber);}
.console-bar i:nth-child(3){background:var(--cr-green);}
.console-bar span{margin-left:.35rem;}

/* blinking LED (status contexts) */
.cr-led{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--cr-green);box-shadow:0 0 8px var(--cr-green);animation:cr-led 2.2s ease-in-out infinite;}
@keyframes cr-led{0%,100%{opacity:1;}50%{opacity:.35;}}

/* ============ corner brackets (targeting frame) ============ */
.corner-frame{position:relative;}
.corner-frame::before{content:'';position:absolute;inset:6px;pointer-events:none;
background:
linear-gradient(var(--cr-amber),var(--cr-amber)) top left/var(--cf-len,22px) 2px,
linear-gradient(var(--cr-amber),var(--cr-amber)) top left/2px var(--cf-len,22px),
linear-gradient(var(--cr-amber),var(--cr-amber)) top right/var(--cf-len,22px) 2px,
linear-gradient(var(--cr-amber),var(--cr-amber)) top right/2px var(--cf-len,22px),
linear-gradient(var(--cr-amber),var(--cr-amber)) bottom left/var(--cf-len,22px) 2px,
linear-gradient(var(--cr-amber),var(--cr-amber)) bottom left/2px var(--cf-len,22px),
linear-gradient(var(--cr-amber),var(--cr-amber)) bottom right/var(--cf-len,22px) 2px,
linear-gradient(var(--cr-amber),var(--cr-amber)) bottom right/2px var(--cf-len,22px);
background-repeat:no-repeat;opacity:.85;}

/* ============ pointer-tracked glow on cards ============ */
.cr-glow{position:relative;}
.cr-glow::after{content:'';position:absolute;inset:0;background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(255,176,0,.09),transparent 65%);opacity:0;transition:opacity .35s var(--transition-smooth);pointer-events:none;}
.cr-glow:hover::after{opacity:1;}

/* ============ waveform divider (energy pulse along a hairline) ============ */
.cr-divider{position:relative;height:1px;background:var(--cr-border);overflow:hidden;}
.cr-divider::after{content:'';position:absolute;top:-1px;left:0;width:140px;height:3px;background:linear-gradient(90deg,transparent,var(--cr-amber),transparent);animation:cr-pulse 7s linear infinite;}
@keyframes cr-pulse{from{transform:translateX(-160px);}to{transform:translateX(110vw);}}

/* ============ count-up digits ============ */
.metric-value,.research-stat-value{font-variant-numeric:tabular-nums;}
.cr-counting{color:var(--cr-amber);}

/* ============ typing caret for status lines ============ */
.cr-type::after{content:'▌';margin-left:2px;color:var(--cr-green);animation:cr-caret 1s steps(1) infinite;}
@keyframes cr-caret{50%{opacity:0;}}

/* ============ hover lift for interactive rows/cards (replaces none) ============ */
.cr-lift{transition:border-color var(--transition-fast),transform .25s var(--transition-smooth);}
.cr-lift:hover{transform:translateY(-3px);}

@media(prefers-reduced-motion:reduce){
.hero::after,.cr-led,.cr-divider::after,.cr-type::after{animation:none!important;}
.cr-glow::after{display:none;}
}