/* Command Center shine: a glint across the title and a scan line over the panels, meters that ease and flicker,
   PRIME's chat that glows when it answers, and VALOR's panel with a live lamp and a slow sweep.
   Soft and dim, dimmer at night (US Central). Loaded after command-center-palette.css.
   Decoration only: nothing here takes the pointer or changes any data. */

/* --- title glint --- */
.command-hero h1 .title-glint{position:absolute;inset:0;display:block;font-style:normal;color:transparent;-webkit-text-stroke:0;text-shadow:none;pointer-events:none;
  background:linear-gradient(100deg,transparent 42%,rgba(255,255,255,.55) 50%,transparent 58%) 130% 0/260% 100% no-repeat;
  -webkit-background-clip:text;background-clip:text;animation:cc-glint 9s ease-in-out infinite}
@keyframes cc-glint{0%,62%{background-position:130% 0}92%,100%{background-position:-30% 0}}

/* --- scan line over each panel --- */
.control-panel{position:relative;overflow:hidden}
.control-panel .panel-scan{position:absolute;left:0;right:0;top:0;height:2px;pointer-events:none;opacity:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),rgba(101,250,255,.6),transparent);
  box-shadow:0 0 10px rgba(101,250,255,.5);animation:panel-scan 11s linear infinite}
.control-panel:nth-child(2) .panel-scan{animation-delay:-2s}
.control-panel:nth-child(3) .panel-scan{animation-delay:-4.5s}
.control-panel:nth-child(4) .panel-scan{animation-delay:-7s}
.control-panel:nth-child(5) .panel-scan{animation-delay:-9s}
@keyframes panel-scan{0%{top:0;opacity:0}6%{opacity:.6}40%{top:100%;opacity:.35}45%,100%{top:100%;opacity:0}}

/* --- meters: percent readings get a thin bar that eases to new values --- */
.telemetry-layout .meter{display:block;height:3px;margin-top:7px;background:rgba(101,250,255,.12);overflow:hidden}
.telemetry-layout .meter b{display:block;height:100%;width:0;background:linear-gradient(90deg,#ff7a18,#fff);box-shadow:0 0 8px rgba(255,122,24,.55);transition:width .9s ease}
.telemetry-layout .meter[data-level="high"] b{background:linear-gradient(90deg,#ffcf33,#fff);box-shadow:0 0 8px rgba(255,207,51,.6)}
.telemetry-layout .meter[data-level="critical"] b{background:linear-gradient(90deg,#ff3b42,#fff);box-shadow:0 0 8px rgba(255,59,66,.65)}
.telemetry-layout strong.changed{animation:value-flicker .7s steps(1,end)}
@keyframes value-flicker{0%{opacity:.25}20%{opacity:1}40%{opacity:.4}60%{opacity:1}80%{opacity:.7}100%{opacity:1}}

/* --- PRIME's chat --- */
#mcpOutput.fresh{animation:reply-glow 1.8s ease-out}
@keyframes reply-glow{0%{text-shadow:0 0 14px rgba(255,255,255,.9),0 0 26px rgba(255,122,24,.8)}100%{text-shadow:none}}
.mcp-prompt .input-cue{transition:opacity .2s}
.mcp-prompt.thinking .input-cue{animation:think-pulse .7s ease-in-out infinite;color:var(--orange)}
@keyframes think-pulse{0%,100%{opacity:.25}50%{opacity:1}}
.mcp-prompt:focus-within #mcpInput{text-shadow:0 0 12px rgba(255,122,24,.8)}
.mcp-terminal{transition:box-shadow .3s ease}
.mcp-terminal:focus-within,.mcp-terminal.typing{box-shadow:0 0 22px rgba(255,122,24,.2),inset 0 0 28px rgba(101,250,255,.04)}

/* --- VALOR's panel: a live lamp and a slow sweep --- */
.valor-panel .valor-sweep{position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;opacity:.5;
  background:linear-gradient(100deg,transparent 40%,rgba(234,255,255,.16) 50%,transparent 60%) -60% 0/220% 100% no-repeat;animation:valor-sweep 12s ease-in-out infinite}
@keyframes valor-sweep{0%,30%{background-position:-60% 0}70%,100%{background-position:160% 0}}
.valor-panel[data-status="warning"] .valor-sweep{background-image:linear-gradient(100deg,transparent 40%,rgba(255,225,130,.2) 50%,transparent 60%)}
.valor-panel[data-status="critical"] .valor-sweep{background-image:linear-gradient(100deg,transparent 40%,rgba(255,130,136,.26) 50%,transparent 60%)}
.valor-panel .status-lamp{display:inline-block;width:9px;height:9px;margin-left:10px;border-radius:50%;background:#8fa9b6;box-shadow:0 0 6px #8fa9b6;vertical-align:middle;animation:cc-lamp 3s ease-in-out infinite}
.valor-panel .status-lamp[data-state="ok"]{background:#4dff9a;box-shadow:0 0 6px #4dff9a,0 0 14px rgba(77,255,154,.6)}
.valor-panel .status-lamp[data-state="warning"]{background:#ffcf33;box-shadow:0 0 6px #ffcf33,0 0 14px rgba(255,207,51,.6)}
.valor-panel .status-lamp[data-state="critical"]{background:#ff3b42;box-shadow:0 0 6px #ff3b42,0 0 14px rgba(255,59,66,.7);animation-duration:1s}
.valor-panel .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@keyframes cc-lamp{0%,100%{opacity:1}50%{opacity:.55}}

/* --- dimmer at dusk and at night (data-time is set by js/command-center-shine.js) --- */
html[data-time="dusk"] .panel-scan,html[data-time="dusk"] .valor-sweep{opacity:.7}
html[data-time="night"] .valor-sweep{opacity:.35}
html[data-time="night"] .control-panel .panel-scan{animation-duration:16s}

@media(prefers-reduced-motion:reduce){
  .title-glint,.panel-scan,.valor-sweep,.status-lamp,#mcpOutput.fresh,.mcp-prompt.thinking .input-cue,.telemetry-layout strong.changed{animation:none}
  .panel-scan,.valor-sweep,.title-glint{display:none}
  .telemetry-layout .meter b{transition:none}
}
