#skf-root, #skf-root * { box-sizing: border-box; } #skf-root .skf-scope { font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial; line-height: 1.5; }
#skf-root .skf-text-strong { color: #e5e7eb; } #skf-root .skf-text-muted { color: #94a3b8; } #skf-root .skf-ring { border: 1px solid rgba(255,255,255,.10); } #skf-root .skf-shadow { box-shadow: 0 30px 80px -30px rgba(0,0,0,.55); } #skf-root .skf-divider { border-bottom: 1px solid rgba(255,255,255,.08); }
#skf-root .skf-card { border: 1px solid rgba(255,255,255,.08); border-radius: 1rem; padding: 1rem; backdrop-filter: blur(6px); background: rgba(2,6,23,.25); }
#skf-root .skf-card-gradient { background: linear-gradient(180deg, rgba(2,6,23,.35), rgba(2,6,23,.2)); border: 1px solid rgba(255,255,255,.08); }
#skf-root .skf-report-card { position: relative; overflow: hidden; } #skf-root #skf-view-report { contain: layout style; }
#skf-root .group > * { margin: 0; } #skf-root #skf-tabs { margin-bottom: .5rem; } #skf-root .skf-controls { margin-top: 1rem; }
#skf-root .skf-input { border: 1px solid rgba(255,255,255,.14); border-radius: 1rem; background: rgba(255,255,255,.06); color: #e5e7eb; padding: 0 .95rem; height: 44px; line-height: 44px; outline: none; transition: .2s; }
#skf-root .skf-input::placeholder { color:#73839a; } #skf-root .skf-input:focus { border-color: var(--skf-a); box-shadow: 0 0 0 .35rem color-mix(in srgb, var(--skf-a) 30%, transparent); }
#skf-root .skf-input-s { border: 1px solid rgba(255,255,255,.12); border-radius: .75rem; background: rgba(255,255,255,.06); color:#e5e7eb; padding: 0 .6rem; height: 36px; line-height: 36px; }
#skf-root .skf-select, #skf-root .skf-select-s { appearance: none; -webkit-appearance:none; -moz-appearance:none; border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.06); color:#e5e7eb; outline:none; transition:.2s; border-radius: 1rem; height: 44px; line-height: 44px; padding: 0 2.4rem 0 .9rem; }
#skf-root .skf-select-s { height: 36px; line-height: 36px; padding: 0 2rem 0 .6rem; border-radius:.75rem; }
#skf-root .skf-caret { position:absolute; pointer-events:none; color:#e5e7eb; opacity:.75; }
#skf-root .skf-caret-md { right: .9rem; top: 50%; transform: translateY(-50%); width:0; height:0; border-left:6px solid transparent; border-right:6px solid transparent; border-top:6px solid currentColor; }
#skf-root .skf-caret-sm { right: .6rem; top: 50%; transform: translateY(-50%); width:0; height:0; border-left:5px solid transparent; border-right:5px solid transparent; border-top:5px solid currentColor; }
#skf-root .skf-btn-primary { display:inline-flex; align-items:center; justify-content:center; padding:.8rem 1rem; border-radius: 1rem; color:#fff; background: linear-gradient(90deg, var(--skf-a), var(--skf-b)); font-weight:600; box-shadow: 0 10px 20px -10px rgba(0,0,0,.55); transition:.15s transform; white-space: nowrap; }
#skf-root .skf-btn-primary:hover { transform: translateY(-1px); } #skf-root .skf-disabled { opacity:.65; pointer-events:none; }
#skf-root .skf-btn-ghost, #skf-root .skf-btn-ghost-s, #skf-root .skf-btn-chip { border: 1px solid rgba(255,255,255,.12); color:#e5e7eb; background: transparent; border-radius: .9rem; padding:.48rem .72rem; transition:.15s background; white-space: nowrap; font-size:.86rem; line-height:1.1; }
#skf-root .skf-btn-ghost-s { padding:.35rem .55rem; border-radius:.7rem; font-size:.8rem; }
#skf-root .skf-exports { display:flex; align-items:center; gap:.5rem; white-space: nowrap; flex-wrap: nowrap; min-width: 0; } #skf-root .skf-exports > * { flex: 0 0 auto; }
#skf-root .skf-btn-ghost:hover, #skf-root .skf-btn-ghost-s:hover, #skf-root .skf-btn-chip:hover { background: rgba(255,255,255,.08); } #skf-root .skf-chip-active { background:#fff; color:#111827; }
#skf-root .skf-seg { display:inline-flex; border:1px solid rgba(255,255,255,.12); border-radius:.9rem; overflow:hidden; } #skf-root .skf-seg-btn { padding:.5rem .75rem; font-size:.8rem; color:#e5e7eb; } #skf-root .skf-seg-active { background:#fff; color:#111827; }
#skf-root .skf-spinner { width: 20px; height: 20px; border:2px solid rgba(148,163,184,.5); border-top-color: transparent; border-radius:50%; animation: skf-spin 1s linear infinite; } @keyframes skf-spin { to { transform: rotate(360deg); } }
#skf-root .skf-controls { display: grid; grid-template-columns: minmax(200px, 1fr) 180px 140px 160px auto; gap: 12px; } #skf-root .skf-cell-long { min-width: 0; } #skf-root .skf-cell { min-width: 0; }
@media (max-width: 1100px) { #skf-root .skf-controls { grid-template-columns: 1fr 1fr 1fr; } #skf-root #skf-exports { grid-column: 1 / -1; justify-content: flex-start; } }
@media (max-width: 640px) { #skf-root .skf-controls { grid-template-columns: 1fr; } #skf-root #skf-exports { justify-content: flex-start; } }
#skf-root .skf-card > .skf-table { width: 100%; min-width: 980px; border-spacing: 0; border-collapse: separate; table-layout: fixed; }
#skf-root .skf-thead { position: sticky; top: 0; z-index: 5; background: rgba(255,255,255,.06); backdrop-filter: blur(6px); }
#skf-root .skf-th, #skf-root .skf-td { padding: .625rem 1rem; font-size: 13px; text-align:left; } #skf-root .skf-th { font-weight: 600; color:#e5e7eb; border-bottom: 1px solid rgba(255,255,255,.10); }
#skf-root .skf-tbody .skf-tr { transition: background .12s; } #skf-root .skf-tbody .skf-tr:hover { background: rgba(255,255,255,.06); }
#skf-root .skf-td { border-bottom: 1px solid rgba(255,255,255,.08); color:#e5e7eb; vertical-align: middle; } #skf-root .skf-kw { word-break: break-word; overflow-wrap: anywhere; line-height: 1.4; }
#skf-root .skf-bar { width:100%; height:8px; background: rgba(255,255,255,.12); border-radius: 999px; overflow:hidden; } #skf-root .skf-bar-fill { height:8px; background: linear-gradient(90deg, var(--skf-a), var(--skf-b)); border-radius: 999px; }
#skf-root .skf-badge { display:inline-flex; align-items:center; border-radius:999px; padding:.15rem .5rem; font-size:12px; border:1px solid rgba(255,255,255,.12); color:#e5e7eb; }
#skf-root .skf-badge-neutral { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.12); color:#e5e7eb; } #skf-root .skf-badge-sky { background:#0ea5e922; border-color:#0ea5e955; color:#7dd3fc; } #skf-root .skf-badge-amber { background:#f59e0b22; border-color:#f59e0b55; color:#fcd34d; } #skf-root .skf-badge-emerald { background:#10b98122; border-color:#10b98155; color:#6ee7b7; }
#skf-root .skf-diff { font-weight:600; } #skf-root .skf-diff-low { color:#10b981; } #skf-root .skf-diff-mid { color:#f59e0b; } #skf-root .skf-diff-high { color:#ef4444; }
#skf-root .skf-skel { height:8px; width:80%; border-radius:.5rem; background: linear-gradient(90deg, rgba(255,255,255,.08), rgba(255,255,255,.16), rgba(255,255,255,.08)); background-size:200% 100%; animation: skf-shine 1.2s linear infinite; } #skf-root .skf-skel-lg { height:12px; width:70%; } @keyframes skf-shine { to { background-position: -200% 0; } }
#skf-root .skf-error { color:#fca5a5; }
#skf-root #skf-view-report .skf-card canvas { display:block; width:100% !important; height:280px !important; }
@media (min-width: 1024px) { #skf-root #skf-view-report .skf-card canvas { height:340px !important; } }
#skf-root .invisible { visibility: hidden; }