/* ============================================================
   ResilienceGauge + MVP-inspired dashboard components
   (tier sub-index cards · synergy match feed · neural engine)
   Skyvidya identity — coral/cyan/HUD, no green theme.
   ============================================================ */

/* ---- ScoreGauge (HUD radial) ---- */
.sg-wrap { display:flex; flex-direction:column; align-items:center; justify-content:center; width:100%; margin:0 auto; padding:6px 0 2px; }
.sg-dial { position:relative; width:100%; aspect-ratio:1/1; display:flex; align-items:center; justify-content:center; }
.sg-svg { width:100%; height:100%; display:block; filter:drop-shadow(0 0 18px var(--sg-glow)); }
/* outer HUD decorator rings */
.sg-ring { position:absolute; inset:0; border-radius:50%; pointer-events:none; }
.sg-ring1 { border:1px solid rgba(255,255,255,0.05); transform:scale(1.15); }
.sg-ring2 { border:1px solid color-mix(in srgb, var(--sg-color) 22%, transparent); transform:scale(1.3); animation:sg-pulse 2.4s cubic-bezier(.4,0,.6,1) infinite; }
.sg-ring3 { border:1px solid rgba(255,255,255,0.05); transform:scale(1.45); opacity:0.2; }
[data-theme="light"] .sg-ring1, [data-theme="light"] .sg-ring3 { border-color:rgba(10,11,13,0.06); }
@keyframes sg-pulse { 0%,100% { opacity:1; } 50% { opacity:0.4; } }
/* center */
.sg-center { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.sg-num-wrap { position:relative; transition:transform 500ms; }
.sg-dial:hover .sg-num-wrap { transform:scale(1.08); }
.sg-num { font-family:var(--font-mono); font-weight:700; font-size:64px; letter-spacing:-0.05em; font-variant-numeric:tabular-nums; line-height:1; }
.sg-badge { position:absolute; right:-30px; top:4px; font-size:11px; font-weight:700; color:var(--fg-mute); opacity:0.45; letter-spacing:0.02em; }
.sg-dots { display:flex; gap:6px; margin-top:16px; }
.sg-dot { width:12px; height:4px; border-radius:9999px; background:var(--sv-ink-600); transition:background 600ms, box-shadow 600ms; }
[data-theme="light"] .sg-dot { background:#D9D2C2; }
/* bottom pill */
.sg-label { margin-top:clamp(14px,6%,34px); display:flex; align-items:center; gap:14px; padding:8px 22px; border-radius:9999px;
  background:color-mix(in srgb, var(--bg-elev) 55%, transparent); border:1px solid var(--rule); backdrop-filter:blur(10px); }
.sg-label p { margin:0; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:0.4em; color:var(--fg-soft); }
.sg-radar { animation:sg-spin 10s linear infinite; }
@keyframes sg-spin { from { transform:rotate(0); } to { transform:rotate(360deg); } }
.sg-sub { margin-top:8px; font-size:9px; letter-spacing:0.1em; text-transform:uppercase; color:var(--fg-mute); text-align:center; }
/* compact (cards / selo) */
.sg-compact .sg-num { font-size:30px; letter-spacing:-0.03em; font-weight:700; }
.sg-compact .sg-badge { display:none; }
.sg-compact .sg-dots { margin-top:8px; gap:4px; }
.sg-compact .sg-dot { width:7px; height:3px; }
.sg-compact .sg-svg { filter:drop-shadow(0 0 9px var(--sg-glow)); }

/* ---- resilience hero row ---- */
.res-hero { display:grid; grid-template-columns:340px 1fr; gap:14px; margin-bottom:20px; }
@media (max-width:1100px){ .res-hero { grid-template-columns:1fr; } }
.res-gauge-card { display:flex; align-items:center; justify-content:center; }
.res-right { display:flex; flex-direction:column; gap:14px; min-width:0; }

/* tier sub-index cards */
.tier-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
@media (max-width:760px){ .tier-cards { grid-template-columns:1fr; } }
.tier-card { background:var(--bg-elev); border:1px solid var(--rule); border-radius:var(--radius); padding:15px 16px; position:relative; overflow:hidden; }
.tier-card::after { content:""; position:absolute; left:0; top:0; bottom:0; width:2px; background:var(--tc-accent, var(--sv-cyan)); }
.tc-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:11px; }
.tc-tier { font-family:var(--font-mono); font-size:9px; letter-spacing:0.12em; text-transform:uppercase; color:var(--fg-mute); }
.tc-src { font-family:var(--font-mono); font-size:9px; letter-spacing:0.04em; color:var(--fg-mute); }
.tc-name { font-family:var(--font-display); font-size:13px; font-weight:600; color:var(--fg); letter-spacing:0.02em; text-transform:uppercase; margin-bottom:10px; }
.tc-rating { display:flex; align-items:baseline; gap:7px; }
.tc-val { font-family:var(--font-display); font-weight:600; font-size:32px; line-height:1; letter-spacing:-0.02em; color:var(--tc-accent, var(--fg)); font-variant-numeric:tabular-nums; }
.tc-rlabel { font-family:var(--font-mono); font-size:9px; letter-spacing:0.1em; text-transform:uppercase; color:var(--fg-mute); }
.tc-bar { height:4px; border-radius:3px; background:var(--sv-ink-600); margin-top:12px; overflow:hidden; }
.tc-bar i { display:block; height:100%; border-radius:3px; background:var(--tc-accent, var(--sv-cyan)); transition:width 900ms cubic-bezier(.2,.7,.3,1); }

/* neural engine output */
.neural { display:flex; gap:11px; align-items:flex-start; padding:13px 15px; border:1px solid var(--rule);
  border-radius:var(--radius); background:linear-gradient(90deg, color-mix(in srgb, var(--sv-cyan) 6%, transparent), transparent); }
.neural-ico { width:30px; height:30px; flex:none; border:1px solid color-mix(in srgb,var(--sv-cyan) 35%, transparent); border-radius:6px;
  display:grid; place-items:center; background:color-mix(in srgb,var(--sv-cyan) 8%, transparent); }
.neural-body { min-width:0; }
.neural-head { font-family:var(--font-mono); font-size:9px; letter-spacing:0.14em; text-transform:uppercase; color:var(--fg-soft); margin-bottom:5px; display:flex; align-items:center; gap:7px; }
.neural-head .nh-dot { width:5px; height:5px; border-radius:50%; background:var(--sv-success); animation:pulse-dot 2.4s infinite; }
.neural-txt { font-family:var(--font-italic); font-style:italic; font-size:15px; line-height:1.45; color:var(--fg); }

/* synergy match feed */
.synergy-list { display:flex; flex-direction:column; }
.syn-item { display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:14px; padding:13px 16px; border-bottom:1px solid var(--rule-soft);
  cursor:pointer; transition:background 140ms; }
.syn-item:last-child { border-bottom:none; }
.syn-item:hover { background:var(--bg-elev-2); }
.syn-main { min-width:0; }
.syn-org { font-family:var(--font-mono); font-size:9.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--fg-mute); margin-bottom:4px; }
.syn-prod { font-size:13.5px; color:var(--fg); font-weight:500; }
.syn-prod b { color:var(--sv-coral); font-weight:600; }
.syn-meta { display:flex; flex-direction:column; align-items:flex-end; gap:5px; }
.syn-tier { font-family:var(--font-mono); font-size:9px; letter-spacing:0.08em; text-transform:uppercase; padding:2px 8px; border-radius:4px; border:1px solid; }
.syn-tier.t1 { color:var(--risk-low); border-color:color-mix(in srgb,var(--risk-low) 45%, transparent); }
.syn-tier.t2 { color:var(--sv-cyan); border-color:color-mix(in srgb,var(--sv-cyan) 45%, transparent); }
.syn-tier.t3 { color:var(--sv-warn); border-color:color-mix(in srgb,var(--sv-warn) 45%, transparent); }
.syn-score { font-family:var(--font-mono); font-size:9.5px; color:var(--fg-mute); letter-spacing:0.04em; }
.syn-match { display:flex; align-items:center; gap:8px; }
.syn-match .sm-ring { position:relative; width:34px; height:34px; }
.syn-arrow { color:var(--fg-mute); transition:transform 140ms, color 140ms; }
.syn-item:hover .syn-arrow { color:var(--sv-coral); transform:translateX(3px); }
.syn-eligible { font-family:var(--font-mono); font-size:8.5px; letter-spacing:0.06em; text-transform:uppercase; }
.syn-eligible.ok { color:var(--risk-low); } .syn-eligible.no { color:var(--fg-mute); }