/* ArtifactScan – front.css v2.0 (light, Shadow DOM) */

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap');

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

.ac-report {
    --ac-bg:          #f2f5fb;
    --ac-surface:     #ffffff;
    --ac-surface2:    #eef1f8;
    --ac-border:      #dde3ef;
    --ac-border2:     #c5cedf;

    --ac-pass:        #0a7c52;
    --ac-pass-dim:    #d0f5e8;
    --ac-pass-text:   #064d33;
    --ac-warn:        #b45309;
    --ac-warn-dim:    #fef3c7;
    --ac-warn-text:   #7c3a00;
    --ac-fail:        #c81e1e;
    --ac-fail-dim:    #fee2e2;
    --ac-fail-text:   #8b0000;
    --ac-skip:        #52607a;
    --ac-skip-dim:    #eef1f8;
    --ac-skip-text:   #374151;
    --ac-info:        #1d4ed8;
    --ac-info-dim:    #dbeafe;
    --ac-info-text:   #1e3a8a;

    --ac-accent:      #4338ca;
    --ac-accent2:     #6366f1;
    --ac-text:        #0d1117;
    --ac-text-mid:    #1e2a3a;
    --ac-text-muted:  #52607a;

    --ac-mono:        'JetBrains Mono', monospace;
    --ac-sans:        'Plus Jakarta Sans', system-ui, sans-serif;
    --ac-radius:      12px;
    --ac-radius-sm:   8px;

    font-family: var(--ac-sans);
    font-size: 16px;
    background: var(--ac-bg);
    color: var(--ac-text);
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid var(--ac-border2);
    box-shadow: 0 2px 8px rgba(0,0,0,.06), 0 12px 40px rgba(67,56,202,.06);
}

/* ── Header ── */
.ac-header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 26px 32px;
    background: var(--ac-surface);
    border-bottom: 1px solid var(--ac-border);
    position: relative;
}
.ac-header::after {
    content:''; position:absolute; top:0; left:0; right:0; height:3px;
    background: linear-gradient(90deg,#4338ca 0%,#818cf8 50%,#38bdf8 100%);
}
.ac-header__left { display:flex; flex-direction:column; gap:6px; }
.ac-wordmark {
    font-size:1.2rem; font-weight:800; letter-spacing:-.03em; color:var(--ac-accent);
    display:flex; align-items:center; gap:9px;
}
.ac-wordmark::before {
    content:''; display:inline-block; width:10px; height:10px;
    border-radius:50%; background:var(--ac-accent2);
    box-shadow:0 0 0 3px rgba(99,102,241,.2);
}
.ac-repo-link {
    font-family:var(--ac-mono); font-size:.72rem;
    color:var(--ac-text-muted); text-decoration:none; word-break:break-all;
}
.ac-repo-link:hover { color:var(--ac-accent); }

/* Score ring */
.ac-score-ring { position:relative; width:72px; height:72px; flex-shrink:0; }
.ac-score-ring svg { width:100%; height:100%; transform:rotate(-90deg); }
.ac-ring-bg  { fill:none; stroke:var(--ac-border); stroke-width:4; }
.ac-ring-fill {
    fill:none; stroke:var(--ac-accent2); stroke-width:4; stroke-linecap:round;
    transition:stroke-dasharray 1.2s cubic-bezier(.16,1,.3,1);
}
.ac-score-label {
    position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
    font-size:1.05rem; font-weight:800; color:var(--ac-text);
}
.ac-score-label small { font-size:.5em; color:var(--ac-text-muted); margin-top:3px; }

/* ── Summary tiles ── */
.ac-summary-tiles {
    display:grid; grid-template-columns:repeat(5,1fr);
    background:var(--ac-surface); border-bottom:1px solid var(--ac-border);
}
.ac-tile {
    display:flex; flex-direction:column; align-items:center;
    padding:20px 10px; border-right:1px solid var(--ac-border);
    transition:background .15s;
}
.ac-tile:last-child { border-right:none; }
.ac-tile:hover { background:var(--ac-surface2); }
.ac-tile__icon { font-size:1.1rem; margin-bottom:6px; }
.ac-tile__count {
    font-size:1.75rem; font-weight:800; line-height:1; margin-bottom:4px;
}
.ac-tile__count small { font-size:.45em; font-weight:500; color:var(--ac-text-muted); }
.ac-tile__label { font-size:.68rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--ac-text-muted); }
.ac-tile--pass .ac-tile__count { color:var(--ac-pass); }
.ac-tile--warn .ac-tile__count { color:var(--ac-warn); }
.ac-tile--fail .ac-tile__count { color:var(--ac-fail); }
.ac-tile--skip .ac-tile__count { color:var(--ac-skip); }
.ac-tile--info .ac-tile__count { color:var(--ac-info); }

/* ── Progress bar ── */
.ac-progress-bar { height:4px; background:var(--ac-border); display:flex; overflow:hidden; }
.ac-progress-bar__fill {
    height:100%; background:linear-gradient(90deg,var(--ac-accent),#22c55e);
    transition:width 1.3s cubic-bezier(.16,1,.3,1);
}
.ac-progress-bar__warn { height:100%; background:var(--ac-warn); opacity:.4; }

/* ═══════════════════════════════════════════════ TABS ═══════════════════════════════════════════════ */
.ac-tabs-wrap { background:var(--ac-bg); }

.ac-tabs {
    display:flex;
    flex-wrap:nowrap;
    gap:6px;
    background:var(--ac-bg);
    border-bottom:1px solid var(--ac-border);
    padding:12px 14px;
    overflow:visible;
}

.ac-tab {
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:6px !important;
    flex:1 1 0 !important;
    min-width:0 !important;
    padding:9px 8px !important;
    background:var(--ac-surface) !important;
    border:2px solid var(--ac-border) !important;
    border-bottom:2px solid var(--ac-border) !important;
    border-radius:9px !important;
    margin-bottom:0 !important;
    cursor:pointer !important;
    font-family:var(--ac-sans) !important;
    font-size:.78rem !important;
    font-weight:700 !important;
    color:var(--ac-text-muted) !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    transition:all .15s !important;
    line-height:1.2 !important;
}
.ac-tab:hover {
    border-color:var(--ac-accent2) !important;
    color:var(--ac-text) !important;
    background:var(--ac-surface2) !important;
}
.ac-tab--active {
    background:#ede9fe !important;
    border-color:var(--ac-accent2) !important;
    color:var(--ac-accent) !important;
    box-shadow:0 2px 8px rgba(99,102,241,.18) !important;
}
.ac-tab--fail.ac-tab--active  { background:var(--ac-fail-dim) !important; border-color:var(--ac-fail) !important; color:var(--ac-fail-text) !important; }
.ac-tab--warn.ac-tab--active  { background:var(--ac-warn-dim) !important; border-color:var(--ac-warn) !important; color:var(--ac-warn-text) !important; }

.ac-tab__icon {
    font-size:clamp(.6rem, 1vw, 1rem) !important;
    flex-shrink:0 !important;
}
.ac-tab__name {
    letter-spacing:.03em !important;
    text-transform:uppercase !important;
    font-size:clamp(.55rem, .9vw, .82rem) !important;
    font-weight:800 !important;
    white-space:nowrap !important;
}
.ac-tab__score {
    font-family:var(--ac-mono) !important;
    font-size:clamp(.5rem, .75vw, .7rem) !important;
    background:rgba(0,0,0,.07) !important;
    padding:2px 6px !important;
    border-radius:99px !important;
    color:inherit !important;
    font-weight:600 !important;
    opacity:.85 !important;
}
.ac-tab--active .ac-tab__score { background:rgba(99,102,241,.18) !important; opacity:1 !important; }

.ac-tab__dot {
    width:7px !important; height:7px !important; border-radius:50% !important; flex-shrink:0 !important;
}
.ac-tab__dot--fail { background:var(--ac-fail) !important; }
.ac-tab__dot--warn { background:var(--ac-warn) !important; }

/* ── Tab panels ── */
.ac-tab-panel { display:none; }
.ac-tab-panel--active { display:block; }

/* Panel summary bar */
.ac-panel-summary {
    display:flex; align-items:center; gap:12px; flex-wrap:wrap;
    padding:12px 20px;
    background:var(--ac-surface);
    border-bottom:1px solid var(--ac-border);
    font-size:.82rem;
}
.ac-panel-ratio {
    font-weight:700; color:var(--ac-text);
    font-size:.9rem;
}
.ac-panel-ratio em { font-style:normal; color:var(--ac-text-muted); font-weight:400; }
.ac-panel-stat { padding:2px 9px; border-radius:99px; font-size:.7rem; font-weight:600; }
.ac-panel-stat--fail { background:var(--ac-fail-dim); color:var(--ac-fail-text); }
.ac-panel-stat--warn { background:var(--ac-warn-dim); color:var(--ac-warn-text); }
.ac-panel-stat--skip { background:var(--ac-skip-dim); color:var(--ac-skip-text); }
.ac-panel-stat--info { background:var(--ac-info-dim); color:var(--ac-info-text); }

/* ── Checks list ── */
.ac-checks { margin:0; padding:0; list-style:none; }

.ac-check {
    display:flex; align-items:flex-start; gap:13px;
    padding:13px 20px;
    border-bottom:1px solid var(--ac-border);
    background:var(--ac-surface);
    transition:background .12s;
}
.ac-check:last-child { border-bottom:none; }
.ac-check:hover { background:var(--ac-surface2); }
.ac-check--pass { border-left:3px solid var(--ac-pass); }
.ac-check--warn { border-left:3px solid var(--ac-warn); }
.ac-check--fail { border-left:3px solid var(--ac-fail); }
.ac-check--skip { border-left:3px solid var(--ac-skip); }
.ac-check--info { border-left:3px solid var(--ac-info); }

.ac-check__sev { flex-shrink:0; margin-top:2px; }
.ac-sev--pass { color:var(--ac-pass); }
.ac-sev--warn { color:var(--ac-warn); }
.ac-sev--fail { color:var(--ac-fail); }
.ac-sev--skip { color:var(--ac-skip); }
.ac-sev--info { color:var(--ac-info); }

.ac-check__body { flex:1; min-width:0; display:flex; flex-direction:column; gap:6px; }
.ac-check__top { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.ac-check__msg { font-size:.95rem; line-height:1.5; color:var(--ac-text); }
.ac-check__file { font-family:var(--ac-mono); font-size:.7rem; color:var(--ac-text-muted); }

/* Fix button */
.ac-fix-btn {
    flex-shrink:0; display:inline-flex; align-items:center; gap:5px;
    padding:5px 12px;
    font-family:var(--ac-sans); font-size:.75rem; font-weight:600;
    color:var(--ac-accent);
    background:var(--ac-info-dim);
    border:1px solid rgba(99,102,241,.25); border-radius:6px;
    cursor:pointer; white-space:nowrap;
    transition:background .15s, color .15s;
    line-height:1;
}
.ac-fix-btn:hover { background:#c7d2fe; }
.ac-fix-btn[aria-expanded="true"] { background:var(--ac-accent); color:#fff; border-color:var(--ac-accent); }

/* Fix panel */
.ac-fix-panel {
    padding:13px 16px;
    background:#f5f6ff;
    border:1px solid rgba(99,102,241,.2); border-radius:var(--ac-radius-sm);
    font-size:.9rem; line-height:1.6; color:var(--ac-text-mid);
    animation:ac-slide-in .18s ease;
}
.ac-fix-panel[hidden] { display:none; }
.ac-fix-label {
    display:block; font-size:.67rem; font-weight:700; letter-spacing:.07em;
    text-transform:uppercase; color:var(--ac-accent2); margin-bottom:7px;
}

@keyframes ac-slide-in {
    from { opacity:0; transform:translateY(-4px); }
    to   { opacity:1; transform:translateY(0); }
}

/* ── Footer ── */
.ac-footer {
    padding:14px 26px; background:var(--ac-surface);
    border-top:1px solid var(--ac-border);
    font-size:.72rem; color:var(--ac-text-muted);
    text-align:center; font-family:var(--ac-mono);
}

/* ── Responsive ── */
@media (max-width:640px) {
    .ac-summary-tiles { grid-template-columns:repeat(3,1fr); }
    .ac-tile:nth-child(4),.ac-tile:nth-child(5) { border-top:1px solid var(--ac-border); }
    .ac-header { padding:18px 16px; flex-wrap:wrap; gap:14px; }
    .ac-check__top { flex-direction:column; }
    .ac-fix-btn { align-self:flex-start; }
    .ac-tabs { padding:0 6px; }
    .ac-tab { padding:10px 9px; }
}