/* J.A.R.V.I.S. AI Panel v2 */

/* === Floating Button === */
#jarvisAiBtn {
    position: fixed; bottom: 28px; right: 28px;
    width: 62px; height: 62px; border-radius: 50%;
    background: linear-gradient(135deg,#6366f1 0%,#8b5cf6 50%,#06b6d4 100%);
    border: none; cursor: pointer; z-index: 9998;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 0 0 0 rgba(99,102,241,0.7);
    animation: japBtnPulse 2.8s cubic-bezier(0.4,0,0.6,1) infinite;
    transition: transform 0.25s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.25s ease;
    overflow: hidden;
}
#jarvisAiBtn::before {
    content: ''; position: absolute; inset: 0; border-radius: 50%;
    background: conic-gradient(from 0deg,#6366f1,#8b5cf6,#06b6d4,#6366f1);
    animation: japBtnRotate 3s linear infinite;
    opacity: 0; transition: opacity 0.3s;
}
#jarvisAiBtn:hover::before { opacity: 0.4; }
#jarvisAiBtn:hover {
    transform: scale(1.14) rotate(-5deg);
    box-shadow: 0 0 0 8px rgba(99,102,241,0.18), 0 8px 32px rgba(99,102,241,0.55);
}
#jarvisAiBtn .jarvis-btn-icon {
    font-size: 1.6em; color: #fff;
    filter: drop-shadow(0 0 10px rgba(255,255,255,0.9));
    z-index: 1; transition: transform 0.3s cubic-bezier(0.34,1.56,0.64,1);
}
#jarvisAiBtn:hover .jarvis-btn-icon { transform: scale(1.15) rotate(10deg); }
#jarvisAiBadge {
    position: absolute; top: -5px; right: -5px;
    background: linear-gradient(135deg,#10b981,#059669);
    color: #fff; font-size: 0.6em; font-weight: 800;
    min-width: 20px; height: 20px; padding: 0 5px;
    border-radius: 10px; display: none;
    align-items: center; justify-content: center;
    box-shadow: 0 2px 8px rgba(16,185,129,0.5);
    animation: japBadgePop 0.4s cubic-bezier(0.34,1.56,0.64,1);
    z-index: 2;
}
#jarvisAiBadge.show { display: flex; }

@keyframes japBtnPulse {
    0%   { box-shadow: 0 0 0 0 rgba(99,102,241,0.8); }
    55%  { box-shadow: 0 0 0 16px rgba(99,102,241,0); }
    100% { box-shadow: 0 0 0 0 rgba(99,102,241,0); }
}
@keyframes japBtnRotate { to { transform: rotate(360deg); } }
@keyframes japBadgePop {
    0%   { transform: scale(0) rotate(-10deg); opacity: 0; }
    70%  { transform: scale(1.3) rotate(5deg); opacity: 1; }
    100% { transform: scale(1) rotate(0); opacity: 1; }
}

/* === Overlay === */
#jarvisAiOverlay {
    position: fixed; inset: 0; background: rgba(3,7,18,0.55);
    z-index: 9997; opacity: 0; pointer-events: none;
    transition: opacity 0.35s ease; backdrop-filter: blur(4px);
}
#jarvisAiOverlay.open { opacity: 1; pointer-events: all; }

/* === Side Panel === */
#jarvisAiPanel {
    position: fixed; top: 0; right: 0;
    width: 430px; max-width: 100vw; height: 100vh;
    z-index: 9999; display: flex; flex-direction: column;
    background: #080d17;
    transform: translateX(110%);
    transition: transform 0.42s cubic-bezier(0.16,1,0.3,1);
    overflow: hidden;
    border-left: 1px solid rgba(99,102,241,0.2);
    box-shadow: -12px 0 80px rgba(0,0,0,0.7);
}
#jarvisAiPanel.open { transform: translateX(0); }

/* Rainbow top bar */
#jarvisAiPanel::before {
    content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2.5px;
    background: linear-gradient(90deg,#6366f1,#8b5cf6,#06b6d4,#10b981,#f59e0b,#6366f1);
    background-size: 400% 100%;
    animation: japTopBarFlow 5s linear infinite;
    z-index: 10;
}
@keyframes japTopBarFlow {
    0%   { background-position: 0% 50%; }
    100% { background-position: 400% 50%; }
}

/* Ambient glow inside panel */
#jarvisAiPanel::after {
    content: ''; position: absolute; top: -100px; right: -80px;
    width: 320px; height: 320px; border-radius: 50%;
    background: radial-gradient(circle, rgba(99,102,241,0.07) 0%, transparent 70%);
    pointer-events: none; animation: japGlowDrift 8s ease-in-out infinite;
}
@keyframes japGlowDrift {
    0%, 100% { transform: translate(0, 0); }
    50%       { transform: translate(-30px, 40px); }
}

/* === Header === */
.jap-header {
    padding: 18px 18px 14px; flex-shrink: 0;
    background: linear-gradient(135deg,rgba(99,102,241,0.14) 0%,rgba(139,92,246,0.08) 60%,rgba(6,182,212,0.05) 100%);
    border-bottom: 1px solid rgba(99,102,241,0.12);
    position: relative; z-index: 2;
}
.jap-header-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.jap-logo { display: flex; align-items: center; gap: 12px; }
.jap-logo-icon {
    width: 42px; height: 42px; border-radius: 12px;
    background: linear-gradient(135deg,#6366f1,#8b5cf6);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.25em; color: #fff;
    box-shadow: 0 0 0 0 rgba(99,102,241,0.5);
    animation: japIconPulse 3.5s ease-in-out infinite;
}
@keyframes japIconPulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(99,102,241,0.5); transform: scale(1); }
    50%       { box-shadow: 0 0 0 8px rgba(99,102,241,0.1); transform: scale(1.04); }
}
.jap-logo-text h2 {
    margin: 0; font-size: 1.02em; font-weight: 800; letter-spacing: 0.5px;
    background: linear-gradient(90deg,#a5b4fc 0%,#c084fc 50%,#67e8f9 100%);
    background-size: 200% 100%;
    -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
    animation: japTitleShimmer 4s ease-in-out infinite;
}
@keyframes japTitleShimmer {
    0%, 100% { background-position: 0% 50%; }
    50%       { background-position: 100% 50%; }
}
.jap-logo-text small { font-size: 0.7em; color: rgba(165,180,252,0.6); }
.jap-close {
    background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1);
    color: #64748b; width: 34px; height: 34px; border-radius: 9px;
    cursor: pointer; display: flex; align-items: center; justify-content: center;
    font-size: 0.95em; transition: all 0.2s cubic-bezier(0.34,1.56,0.64,1);
}
.jap-close:hover {
    background: rgba(239,68,68,0.18); color: #f87171;
    border-color: rgba(239,68,68,0.4); transform: rotate(90deg) scale(1.1);
}
.jap-status-row { display: flex; gap: 6px; flex-wrap: wrap; }
.jap-badge {
    font-size: 0.68em; font-weight: 600; padding: 3px 10px;
    border-radius: 20px; display: flex; align-items: center; gap: 5px;
    transition: all 0.3s ease;
}
.jap-badge.online  { background: rgba(16,185,129,0.15); color: #34d399; border: 1px solid rgba(16,185,129,0.3); }
.jap-badge.offline { background: rgba(239,68,68,0.15);  color: #f87171; border: 1px solid rgba(239,68,68,0.3); }
.jap-badge.info    { background: rgba(99,102,241,0.15); color: #a5b4fc; border: 1px solid rgba(99,102,241,0.25); }
.jap-badge .dot {
    width: 6px; height: 6px; border-radius: 50%; background: currentColor;
    animation: japDotBlink 1.8s ease-in-out infinite;
}
@keyframes japDotBlink { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: 0.3; transform: scale(0.7); } }

/* === Tabs === */
.jap-tabs {
    display: flex; flex-shrink: 0;
    background: rgba(0,0,0,0.25);
    border-bottom: 1px solid rgba(99,102,241,0.1);
}
.jap-tab {
    flex: 1; padding: 11px 4px; font-size: 0.72em; font-weight: 600;
    color: #475569; border: none; background: none; cursor: pointer;
    transition: color 0.2s, background 0.2s; position: relative; overflow: hidden;
}
.jap-tab::after {
    content: ''; position: absolute; bottom: 0; left: 50%; right: 50%;
    height: 2px; background: linear-gradient(90deg,#6366f1,#8b5cf6);
    border-radius: 1px; transition: left 0.3s cubic-bezier(0.34,1.56,0.64,1), right 0.3s cubic-bezier(0.34,1.56,0.64,1);
}
.jap-tab.active { color: #a5b4fc; background: rgba(99,102,241,0.05); }
.jap-tab.active::after { left: 15%; right: 15%; }
.jap-tab:hover:not(.active) { color: #94a3b8; background: rgba(255,255,255,0.02); }
.jap-tab i { margin-right: 4px; }

/* === Body === */
.jap-body {
    flex: 1; overflow-y: auto; padding: 16px;
    scrollbar-width: thin; scrollbar-color: rgba(99,102,241,0.25) transparent;
}
.jap-body::-webkit-scrollbar { width: 3px; }
.jap-body::-webkit-scrollbar-thumb { background: rgba(99,102,241,0.3); border-radius: 2px; }
.jap-pane { display: none; }
.jap-pane.active { display: block; animation: japPaneFade 0.28s cubic-bezier(0.16,1,0.3,1); }
@keyframes japPaneFade {
    from { opacity: 0; transform: translateY(10px) scale(0.98); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* === Score Ring === */
.jap-score-row { display: flex; gap: 12px; margin-bottom: 14px; align-items: center; }
.jap-score-ring { width: 76px; height: 76px; flex-shrink: 0; position: relative; }
.jap-score-ring svg { transform: rotate(-90deg); }
.jap-score-ring .score-val {
    position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
    font-size: 1.35em; font-weight: 900;
    background: linear-gradient(135deg,#a5b4fc,#67e8f9);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.jap-score-info .score-label { font-size: 0.68em; color: #475569; margin-bottom: 3px; }
.jap-score-info .score-status { font-size: 0.95em; font-weight: 700; color: #e2e8f0; margin-bottom: 2px; }
.jap-score-info .score-cycle { font-size: 0.64em; color: #334155; }

/* === Summary === */
.jap-summary-card {
    background: linear-gradient(135deg,rgba(99,102,241,0.07),rgba(139,92,246,0.04));
    border: 1px solid rgba(99,102,241,0.16); border-radius: 13px;
    padding: 14px; margin-bottom: 12px; position: relative; overflow: hidden;
}
.jap-summary-card .jap-shimmer {
    position: absolute; inset: 0;
    background: linear-gradient(90deg,transparent 0%,rgba(99,102,241,0.06) 50%,transparent 100%);
    background-size: 200% 100%;
    animation: japShimmerMove 1.8s ease-in-out infinite;
}
@keyframes japShimmerMove { 0% { background-position: -200% 0; } 100% { background-position: 200% 0; } }
.jap-summary-label {
    font-size: 0.64em; font-weight: 700; color: #6366f1;
    text-transform: uppercase; letter-spacing: 1.2px; margin-bottom: 9px;
    display: flex; align-items: center; gap: 6px;
}
/* Markdown-rendered summary */
.jap-summary-text { font-size: 0.82em; line-height: 1.7; color: #cbd5e1; }
.jap-summary-text strong, .jap-summary-text b { color: #e2e8f0; font-weight: 700; }
.jap-summary-text em { color: #a5b4fc; font-style: italic; }
.jap-summary-text .md-h3 { font-size: 0.9em; font-weight: 700; color: #a5b4fc; margin: 8px 0 3px; }
.jap-summary-text .md-h4 { font-size: 0.85em; font-weight: 700; color: #818cf8; margin: 6px 0 2px; }
.jap-summary-text .md-li { padding-left: 14px; position: relative; margin: 2px 0; }
.jap-summary-text .md-li::before { content: '•'; position: absolute; left: 4px; color: #6366f1; }
.jap-summary-meta { font-size: 0.64em; color: #334155; margin-top: 9px; display: flex; justify-content: space-between; }

/* === Skeleton Loader === */
.jap-skeleton {
    background: linear-gradient(90deg,rgba(255,255,255,0.04) 25%,rgba(255,255,255,0.08) 50%,rgba(255,255,255,0.04) 75%);
    background-size: 200% 100%;
    border-radius: 5px; height: 12px; margin: 6px 0;
    animation: japSkeletonFlow 1.5s ease-in-out infinite;
}
@keyframes japSkeletonFlow { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }

/* === Ask Input === */
.jap-ask-form { display: flex; gap: 8px; margin-bottom: 12px; }
.jap-ask-input {
    flex: 1; background: rgba(255,255,255,0.04);
    border: 1px solid rgba(99,102,241,0.22); border-radius: 11px;
    padding: 10px 13px; color: #e2e8f0; font-size: 0.82em; outline: none;
    transition: all 0.25s ease; font-family: inherit;
}
.jap-ask-input:focus { border-color: rgba(99,102,241,0.55); background: rgba(99,102,241,0.06); box-shadow: 0 0 0 3px rgba(99,102,241,0.1); }
.jap-ask-input::placeholder { color: #334155; }
.jap-ask-btn {
    background: linear-gradient(135deg,#6366f1,#8b5cf6); border: none;
    border-radius: 11px; color: #fff; padding: 10px 16px;
    cursor: pointer; font-size: 0.9em;
    transition: all 0.2s cubic-bezier(0.34,1.56,0.64,1);
    box-shadow: 0 4px 15px rgba(99,102,241,0.3);
}
.jap-ask-btn:hover { transform: scale(1.06); box-shadow: 0 6px 20px rgba(99,102,241,0.5); }
.jap-ask-btn:disabled { opacity: 0.45; cursor: not-allowed; transform: none; box-shadow: none; }
.jap-action-btn {
    padding: 10px 10px; border-radius: 10px;
    border: 1px solid rgba(99,102,241,0.18); background: rgba(99,102,241,0.06);
    color: #818cf8; font-size: 0.76em; font-weight: 600;
    cursor: pointer; transition: all 0.2s cubic-bezier(0.34,1.56,0.64,1);
    display: flex; align-items: center; gap: 7px;
    font-family: inherit;
}
.jap-action-btn:hover { background: rgba(99,102,241,0.14); border-color: rgba(99,102,241,0.38); transform: translateY(-2px); box-shadow: 0 4px 12px rgba(99,102,241,0.15); }
.jap-action-btn.pro { border-color: rgba(245,158,11,0.22); background: rgba(245,158,11,0.06); color: #fbbf24; }
.jap-action-btn.pro:hover { background: rgba(245,158,11,0.13); box-shadow: 0 4px 12px rgba(245,158,11,0.2); }
.jap-pro-result {
    background: rgba(245,158,11,0.04); border: 1px solid rgba(245,158,11,0.14);
    border-radius: 11px; padding: 13px; font-size: 0.82em; color: #fef3c7;
    line-height: 1.7; display: none; margin-bottom: 10px;
    animation: japPaneFade 0.3s ease;
}
.jap-ask-result-card {
    background: rgba(99,102,241,0.05); border: 1px solid rgba(99,102,241,0.18);
    border-radius: 11px; padding: 13px; font-size: 0.82em; color: #c7d2fe;
    line-height: 1.7; display: none; margin-bottom: 10px;
    animation: japPaneFade 0.3s ease;
}

/* Spinner */
.jap-spinner { display: none; align-items: center; justify-content: center; gap: 10px; padding: 18px; color: #6366f1; font-size: 0.82em; }
.jap-spinner.active { display: flex; }
.jap-spinner i { animation: japSpin 0.75s linear infinite; }
@keyframes japSpin { to { transform: rotate(360deg); } }

/* Stats */
.jap-stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 12px; }
.jap-stat {
    background: rgba(255,255,255,0.025); border: 1px solid rgba(255,255,255,0.07);
    border-radius: 11px; padding: 11px 13px;
    transition: background 0.2s, border-color 0.2s, transform 0.2s;
}
.jap-stat:hover { background: rgba(99,102,241,0.06); border-color: rgba(99,102,241,0.2); transform: translateY(-1px); }
.jap-stat small { font-size: 0.64em; color: #475569; display: block; margin-bottom: 4px; text-transform: uppercase; letter-spacing: 0.5px; }
.jap-stat .val { font-size: 0.95em; font-weight: 700; color: #e2e8f0; }
.jap-stat .val.green { color: #34d399; }
.jap-stat .val.red { color: #f87171; }

/* Footer */
.jap-footer {
    padding: 10px 16px; border-top: 1px solid rgba(255,255,255,0.04);
    flex-shrink: 0; display: flex; align-items: center; justify-content: space-between;
    background: rgba(0,0,0,0.3);
}
.jap-footer-left { font-size: 0.63em; color: #1e293b; }
.jap-footer-cycle { font-size: 0.65em; color: #6366f1; font-weight: 600; display: flex; align-items: center; gap: 5px; }

/* Responsive */
@media (max-width: 480px) {
    #jarvisAiPanel { width: 100vw; }
    #jarvisAiBtn { bottom: 16px; right: 16px; width: 54px; height: 54px; }
}

/* ============================================================= */
/* === v3 POLISH — refinamento visual do pop-up (override) ===== */
/* ============================================================= */

/* Painel: vidro mais profundo + malha sutil de fundo (futurista) */
#jarvisAiPanel {
    width: 452px;
    background:
        radial-gradient(120% 90% at 100% 0%, rgba(99,102,241,0.10) 0%, transparent 55%),
        linear-gradient(180deg, #0a1020 0%, #070b14 100%);
    -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
    border-left: 1px solid rgba(129,140,248,0.28);
    box-shadow: -16px 0 90px rgba(0,0,0,0.75), inset 1px 0 0 rgba(255,255,255,0.03);
}
#jarvisAiPanel .jap-body::before {
    content: ''; position: fixed; inset: 0; z-index: 0; pointer-events: none;
    background-image: linear-gradient(rgba(129,140,248,0.045) 1px, transparent 1px),
                      linear-gradient(90deg, rgba(129,140,248,0.045) 1px, transparent 1px);
    background-size: 26px 26px; opacity: 0.5;
    -webkit-mask-image: radial-gradient(circle at 80% 8%, #000 0%, transparent 60%);
            mask-image: radial-gradient(circle at 80% 8%, #000 0%, transparent 60%);
}
.jap-body > * { position: relative; z-index: 1; }

/* Header: aura + scanline discreta */
.jap-header {
    padding: 20px 18px 15px;
    background: linear-gradient(135deg, rgba(99,102,241,0.20) 0%, rgba(139,92,246,0.10) 55%, rgba(6,182,212,0.06) 100%);
    border-bottom: 1px solid rgba(129,140,248,0.18);
}
.jap-header::after {
    content: ''; position: absolute; left: 0; right: 0; top: 0; height: 100%;
    background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.05) 48%, transparent 52%);
    background-size: 250% 100%; animation: japHeadScan 6s ease-in-out infinite;
    pointer-events: none;
}
@keyframes japHeadScan { 0%,100% { background-position: 130% 0; } 50% { background-position: -30% 0; } }
.jap-logo-icon { width: 44px; height: 44px; border-radius: 13px; }
.jap-logo-text h2 { font-size: 1.08em; letter-spacing: 0.6px; }
.jap-logo-text small { color: rgba(196,181,253,0.72); font-weight: 500; letter-spacing: 0.3px; }

/* Badges mais nítidos + glow no online */
.jap-badge { font-size: 0.7em; padding: 4px 11px; backdrop-filter: blur(4px); }
.jap-badge.online { box-shadow: 0 0 14px -2px rgba(16,185,129,0.5); }
.jap-badge.info { color: #c7d2fe; }

/* Tabs: estado ativo em "pílula", inativo mais legível */
.jap-tabs { background: rgba(4,7,15,0.5); padding: 5px 6px; gap: 3px; border-bottom: 1px solid rgba(129,140,248,0.12); }
.jap-tab {
    border-radius: 10px; padding: 9px 4px; font-size: 0.73em; color: #64748b;
    transition: color 0.2s, background 0.25s, box-shadow 0.25s;
}
.jap-tab.active {
    color: #e0e7ff; background: linear-gradient(135deg, rgba(99,102,241,0.28), rgba(139,92,246,0.18));
    box-shadow: inset 0 0 0 1px rgba(129,140,248,0.35), 0 4px 14px -4px rgba(99,102,241,0.6);
}
.jap-tab.active::after { display: none; } /* já temos o realce em pílula */
.jap-tab:hover:not(.active) { color: #cbd5e1; background: rgba(129,140,248,0.08); }

/* Score ring: maior, com glow colorido por nota (classe setada no JS) */
.jap-score-row {
    gap: 16px; padding: 14px; margin-bottom: 14px; border-radius: 15px;
    background: linear-gradient(135deg, rgba(99,102,241,0.08), rgba(6,182,212,0.03));
    border: 1px solid rgba(129,140,248,0.16);
}
.jap-score-ring { width: 88px; height: 88px; border-radius: 50%; transition: box-shadow 0.6s ease; }
.jap-score-ring svg { width: 88px; height: 88px; }
.jap-score-ring .score-val { font-size: 1.7em; }
.jap-score-ring.low  { box-shadow: 0 0 22px -4px rgba(239,68,68,0.55); }
.jap-score-ring.mid  { box-shadow: 0 0 22px -4px rgba(245,158,11,0.55); }
.jap-score-ring.high { box-shadow: 0 0 24px -4px rgba(16,185,129,0.6); }
.jap-score-info .score-label { font-size: 0.7em; color: #7c8aa5; text-transform: uppercase; letter-spacing: 0.8px; }
.jap-score-info .score-status { font-size: 1.05em; font-weight: 800; }
.jap-score-info .score-cycle { font-size: 0.68em; color: #64748b; margin-top: 3px; }

/* Resumo: hierarquia clara — seções com barra de acento, leitura confortável */
.jap-summary-card { border-radius: 15px; padding: 15px 16px; border-color: rgba(129,140,248,0.2); }
.jap-summary-card::before {
    content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px;
    background: linear-gradient(90deg, transparent, rgba(129,140,248,0.6), transparent);
}
.jap-summary-label { font-size: 0.66em; color: #a5b4fc; letter-spacing: 1.4px; }
.jap-summary-text { font-size: 0.85em; line-height: 1.75; color: #d4dbe8; }
.jap-summary-text strong, .jap-summary-text b { color: #fff; }
.jap-summary-text .md-h3 {
    font-size: 0.92em; font-weight: 800; color: #c7d2fe;
    margin: 13px 0 5px; padding: 3px 0 3px 11px; border-left: 3px solid #6366f1;
    background: linear-gradient(90deg, rgba(99,102,241,0.10), transparent); border-radius: 0 6px 6px 0;
}
.jap-summary-text .md-h4 { color: #93c5fd; margin: 9px 0 3px; }
.jap-summary-text .md-li { padding-left: 17px; margin: 4px 0; }
.jap-summary-text .md-li::before { content: '▸'; color: #818cf8; left: 2px; font-size: 0.9em; }
.jap-summary-meta { font-size: 0.66em; color: #5b6b86; border-top: 1px solid rgba(255,255,255,0.05); padding-top: 8px; margin-top: 11px; }

/* Botão de ação principal (Atualizar/Executar): um pouco mais presente */
.jap-action-btn { font-size: 0.78em; padding: 11px 12px; }

/* Stats: leitura melhor */
.jap-stat .val { font-size: 1.05em; }
.jap-stat small { color: #6b7a93; }

/* Rodapé: corrige contraste (antes quase invisível) */
.jap-footer { padding: 11px 16px; background: rgba(4,7,15,0.55); border-top: 1px solid rgba(129,140,248,0.1); }
.jap-footer-left { color: rgba(148,163,184,0.55); font-weight: 500; }
.jap-footer-cycle { color: #a5b4fc; }
.jap-footer-cycle i { animation: japSpin 4s linear infinite; }

/* Acessibilidade: respeita quem prefere menos movimento */
@media (prefers-reduced-motion: reduce) {
    #jarvisAiPanel::before, #jarvisAiPanel::after, .jap-header::after,
    .jap-logo-icon, .jap-summary-card .jap-shimmer, .jap-footer-cycle i,
    .jap-badge .dot { animation: none !important; }
}

/* ============================================================= */
/* === v4 POLISH — pop-up premium (2026-07-04) ================= */
/* ============================================================= */
#jarvisAiPanel { width: 460px; }

/* Logo: o núcleo 3D vira o herói — tile de VIDRO sutil (sem caixa roxa sólida),
   com halo suave girando por trás pra dar profundidade. */
.jap-logo-icon {
    position: relative;
    background: radial-gradient(120% 120% at 30% 22%, rgba(129,140,248,0.30), rgba(124,58,237,0.10) 62%, transparent 100%);
    box-shadow: inset 0 0 0 1px rgba(165,180,252,0.32), 0 8px 20px -8px rgba(99,102,241,0.65);
    animation: none;
}
.jap-logo-icon::after {
    content: ''; position: absolute; inset: -4px; border-radius: 16px; z-index: -1;
    background: conic-gradient(from 0deg, transparent, rgba(103,232,249,0.35), transparent 55%, rgba(167,139,250,0.30), transparent);
    filter: blur(3px); opacity: 0.7; animation: japHalo 7s linear infinite;
}
@keyframes japHalo { to { transform: rotate(360deg); } }
.jap-logo-icon .jarvis-core-icon { width: 32px; height: 32px; }

/* Header: título/subtítulo mais nítidos */
.jap-logo-text h2 { font-size: 1.12em; }
.jap-logo-text small { color: rgba(199,210,254,0.80); }
.jap-close { border-radius: 10px; }

/* Badges premium (vidro + acento). O backend agora mostra "Cerebras · Groq". */
.jap-status-row { gap: 7px; margin-top: 2px; }
.jap-badge { border-radius: 9px; padding: 4px 11px; font-weight: 600; }
.jap-badge.info {
    background: linear-gradient(135deg, rgba(99,102,241,0.18), rgba(6,182,212,0.09));
    border: 1px solid rgba(129,140,248,0.30); color: #c7d2fe;
}
.jap-badge.info i { opacity: 0.85; }
.jap-badge.online { box-shadow: 0 0 16px -3px rgba(16,185,129,0.6); }

/* Score: card premium, anel maior */
.jap-score-row {
    gap: 18px; padding: 16px; border-radius: 16px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.05);
}
.jap-score-ring, .jap-score-ring svg { width: 92px; height: 92px; }
.jap-score-ring .score-val { font-size: 1.9em; }
.jap-score-info .score-label { font-size: 0.72em; letter-spacing: 1px; }
.jap-score-info .score-status { font-size: 1.12em; }

/* Resumo: mais respiro e leitura confortável */
.jap-summary-card { padding: 16px 17px; border-radius: 16px; }
.jap-summary-label { font-size: 0.68em; letter-spacing: 1.6px; }
.jap-summary-text { font-size: 0.87em; line-height: 1.82; }

/* Inputs/botões: cantos mais suaves e consistentes */
.jap-action-btn, .jap-ask-btn, .jap-ask-input, .jap-pro-result, .jap-ask-result-card { border-radius: 12px; }

/* Overlay: escurecimento + blur um pouco mais premium */
#jarvisAiOverlay { background: rgba(3,7,18,0.62); backdrop-filter: blur(6px); }

@media (prefers-reduced-motion: reduce) { .jap-logo-icon::after { animation: none !important; } }
@media (max-width: 480px) { #jarvisAiPanel { width: 100vw; } }