[x-cloak] { display: none !important; }

.summary-card {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    align-items: center;
    column-gap: .75rem;
    text-align: left;
    padding: 1rem;
    border: 1px solid rgb(30 41 59);
    border-radius: 1rem;
    background: rgba(15, 23, 42, .7);
}
.summary-card .health-dot { grid-row: span 2; }
.health-dot { width: .72rem; height: .72rem; border-radius: 999px; display: inline-block; box-shadow: 0 0 0 4px rgba(255,255,255,.035); }
.health-green { background: #22c55e; box-shadow: 0 0 14px rgba(34,197,94,.45); }
.health-yellow { background: #eab308; box-shadow: 0 0 14px rgba(234,179,8,.4); }
.health-red { background: #ef4444; box-shadow: 0 0 14px rgba(239,68,68,.45); }
.health-gray { background: #64748b; }
.toolbar-button, .filter-chip { border: 1px solid rgb(51 65 85); border-radius: .55rem; color: rgb(148 163 184); font-size: .75rem; padding: .47rem .7rem; }
.toolbar-button:hover, .filter-chip:hover { color: white; background: rgb(30 41 59); }
.filter-chip-active { color: #e2e8f0; border-color: rgb(71 85 105); background: rgb(30 41 59); }
.crawler-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 330px), 1fr)); gap: 1rem; }
.crawler-card { cursor: pointer; padding: 1rem; border: 1px solid rgb(30 41 59); border-radius: .85rem; background: rgba(2, 6, 23, .48); }
.crawler-card:hover { border-color: rgb(71 85 105); transform: translateY(-1px); }
.crawler-card dt { color: rgb(100 116 139); }
.crawler-card dd { color: rgb(203 213 225); margin-top: .15rem; }
.state-badge, .tag-pill { font-size: .66rem; border: 1px solid rgb(51 65 85); border-radius: 999px; padding: .2rem .45rem; color: rgb(148 163 184); }
.switch { width: 2.6rem; height: 1.45rem; border-radius: 999px; background: rgb(51 65 85); padding: .15rem; }
.switch span { display: block; width: 1.15rem; height: 1.15rem; border-radius: 999px; background: white; transform: translateX(0); }
.switch-on { background: #16a34a; }
.switch-on span { transform: translateX(1.15rem); }
.detail-stat { border: 1px solid rgb(30 41 59); border-radius: .75rem; padding: .8rem; background: rgba(15,23,42,.6); }
.detail-stat span { display: block; color: rgb(100 116 139); font-size: .68rem; text-transform: uppercase; letter-spacing: .06em; }
.detail-stat strong { display: block; margin-top: .3rem; color: rgb(226 232 240); font-size: .8rem; font-weight: 500; }
.data-preview { max-height: 18rem; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; border: 1px solid rgb(30 41 59); border-radius: .75rem; background: rgb(2 6 23); color: rgb(148 163 184); padding: 1rem; font-size: .72rem; }
.run-row { display: grid; grid-template-columns: 6rem 1fr; gap: .75rem; align-items: center; border: 1px solid rgb(30 41 59); border-radius: .75rem; padding: .75rem; }
.run-outcome { font-size: .68rem; text-transform: uppercase; letter-spacing: .04em; }
.outcome-succeeded { color: #4ade80; }.outcome-no_change { color: #94a3b8; }.outcome-running { color: #60a5fa; }.outcome-partial { color: #facc15; }.outcome-failed, .outcome-abandoned { color: #f87171; }