/* Toolkit Admin UI — breaker-panel skin, matches ovkit.com (v3.10.1) */

/* Barlow + Barlow Condensed, bundled (SIL OFL 1.1, assets/fonts/OFL.txt). */
@font-face { font-family: 'OvKit Barlow'; font-style: normal; font-weight: 400; font-display: swap; src: url('../../assets/fonts/barlow-400-latin.woff2') format('woff2'); }
@font-face { font-family: 'OvKit Barlow'; font-style: normal; font-weight: 500; font-display: swap; src: url('../../assets/fonts/barlow-500-latin.woff2') format('woff2'); }
@font-face { font-family: 'OvKit Barlow'; font-style: normal; font-weight: 600; font-display: swap; src: url('../../assets/fonts/barlow-600-latin.woff2') format('woff2'); }
@font-face { font-family: 'OvKit Condensed'; font-style: normal; font-weight: 600; font-display: swap; src: url('../../assets/fonts/barlow-condensed-600-latin.woff2') format('woff2'); }
@font-face { font-family: 'OvKit Condensed'; font-style: normal; font-weight: 700; font-display: swap; src: url('../../assets/fonts/barlow-condensed-700-latin.woff2') format('woff2'); }

/* ═══════════════════════════════════════════════════════════
   DESIGN TOKENS
═══════════════════════════════════════════════════════════ */
:root {
    /* Names kept for the existing rules; values are the ovkit.com panel world. */
    --ovkit-navy:   #16181b;  /* ink: headings, primary actions */
    --ovkit-coral:  #ff5f0f;  /* live: on-state, focus, current */
    --ovkit-bg:     #e6e9ec;  /* light steel: section heads, wells */
    --ovkit-card:   #fafaf6;  /* label tape / paper */
    --ovkit-border: #aab0b6;  /* steel edge */
    --ovkit-radius: 6px;
    --ovkit-text:   #24282d;  /* body */
    --ovkit-dim:    #4a5058;  /* ink-2, readable on tape and steel */
    --ovkit-green:  #1f6f45;
    --ovkit-amber:  #8a5a00;
    --ovkit-red:    #b32d2e;
    --ovkit-steel:  #d7dadd;
    --ovkit-seam:   rgba(22, 24, 27, 0.14);
    --ovkit-live-ink: #a63a00;
    --ovkit-cond:   'OvKit Condensed', 'Arial Narrow', sans-serif;
    --ovkit-body:   'OvKit Barlow', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

/* ═══════════════════════════════════════════════════════════
   BASE
═══════════════════════════════════════════════════════════ */
.ovkit-wrap {
    max-width: 1100px;
    margin: 0 auto;
    padding: 20px;
    font-family: var(--ovkit-body);
    color: var(--ovkit-text);
}
.ovkit-wrap *,
.ovkit-wrap *::before,
.ovkit-wrap *::after {
    box-sizing: border-box;
}

/* ═══════════════════════════════════════════════════════════
   HEADER
═══════════════════════════════════════════════════════════ */
.ovkit-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
}
.ovkit-logo {
    width: 36px;
    height: 36px;
    flex-shrink: 0;
}
.ovkit-header-text h1 {
    font-size: 20px;
    font-weight: 700;
    color: var(--ovkit-text);
    margin: 0;
    padding: 0;
    line-height: 1.2;
}
.ovkit-header-text span {
    font-size: 11px;
    color: var(--ovkit-dim);
}

/* ═══════════════════════════════════════════════════════════
   SUMMARY STATS
═══════════════════════════════════════════════════════════ */
.ovkit-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    margin-bottom: 16px;
}
.ovkit-stat {
    background: var(--ovkit-card);
    border: 1px solid var(--ovkit-border);
    border-radius: var(--ovkit-radius);
    padding: 14px 16px;
    text-align: center;
    cursor: pointer;
    transition: border-color .15s, box-shadow .15s, background .15s;
    user-select: none;
    color: inherit;
    text-decoration: none;
}
.ovkit-stat:focus { outline: 2px solid var(--ovkit-navy); outline-offset: 2px; }
.ovkit-stat:hover {
    border-color: var(--ovkit-navy);
    background: #f5f7ff;
}
.ovkit-stat.ovkit-stat-active {
    border-color: var(--ovkit-navy);
    box-shadow: 0 0 0 1px var(--ovkit-navy);
}
.ovkit-stat-num {
    display: block;
    font-size: 24px;
    font-weight: 700;
    color: var(--ovkit-text);
    line-height: 1;
}
.ovkit-stat-green { color: var(--ovkit-green); }
.ovkit-stat-blue  { color: var(--ovkit-navy); }
.ovkit-stat-amber { color: var(--ovkit-amber); }
.ovkit-stat-label {
    font-size: 11px;
    color: var(--ovkit-dim);
    margin-top: 4px;
    display: block;
}

/* ═══════════════════════════════════════════════════════════
   BUTTONS
═══════════════════════════════════════════════════════════ */
.ovkit-btn {
    font-size: 12px;
    padding: 7px 14px;
    border-radius: 8px;
    border: 1px solid var(--ovkit-border);
    background: var(--ovkit-card);
    color: var(--ovkit-text);
    cursor: pointer;
    font-weight: 500;
    font-family: inherit;
    transition: background .12s, border-color .12s, color .12s;
    white-space: nowrap;
}
.ovkit-btn:hover {
    background: #f0ede8;
    border-color: #ccc9c3;
}
.ovkit-btn-primary {
    background: var(--ovkit-navy);
    color: #fff;
    border-color: var(--ovkit-navy);
}
.ovkit-btn-primary:hover {
    background: #1b2f63;
    border-color: #1b2f63;
}
.ovkit-btn-primary.ovkit-saved {
    background: var(--ovkit-green);
    border-color: var(--ovkit-green);
}
.ovkit-btn:disabled {
    opacity: .45;
    cursor: default;
    pointer-events: none;
}
.ovkit-btn-small {
    font-size: 11px;
    padding: 3px 9px;
    border-radius: 6px;
    border: 1px solid var(--ovkit-border);
    background: var(--ovkit-card);
    color: var(--ovkit-dim);
    cursor: pointer;
    font-family: inherit;
    font-weight: 500;
    transition: background .12s, color .12s;
    white-space: nowrap;
}
.ovkit-btn-small:hover {
    background: #f0ede8;
    color: var(--ovkit-text);
}
.ovkit-btn-danger { color: var(--ovkit-red); border-color: var(--ovkit-red); }
.ovkit-btn-danger:hover { background: #fdecea; }
.ovkit-btn-active {
    background: var(--ovkit-navy) !important;
    color: #fff !important;
    border-color: var(--ovkit-navy) !important;
}

/* ═══════════════════════════════════════════════════════════
   ACTION BAR
═══════════════════════════════════════════════════════════ */
.ovkit-actions {
    display: flex;
    gap: 8px;
    margin-bottom: 16px;
    flex-wrap: wrap;
    align-items: center;
}

/* ═══════════════════════════════════════════════════════════
   TABS
═══════════════════════════════════════════════════════════ */
.ovkit-tabs {
    display: flex;
    gap: 4px;
    margin-bottom: 12px;
    margin-top: 24px;
    padding-top: 16px;
    border-top: 1px solid var(--ovkit-border);
    align-items: center;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.ovkit-tabs::-webkit-scrollbar { display: none; }

.ovkit-tab {
    font-size: 13px;
    padding: 6px 10px;
    border: none;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    cursor: pointer;
    background: transparent;
    color: var(--ovkit-dim);
    font-weight: 500;
    font-family: inherit;
    transition: color .12s, border-color .12s;
    white-space: nowrap;
    flex-shrink: 0;
}
.ovkit-tab:hover {
    color: var(--ovkit-text);
}
.ovkit-tab-active {
    color: var(--ovkit-navy) !important;
    border-bottom-color: var(--ovkit-navy) !important;
}
.ovkit-tab-sep {
    width: 1px;
    height: 18px;
    background: var(--ovkit-border);
    margin: 0 4px;
    flex-shrink: 0;
    align-self: center;
}
.ovkit-tab-count {
    font-size: 10px;
    color: var(--ovkit-dim);
    margin-left: 2px;
}
#ovkit-card { opacity: 0; }
#ovkit-card.ovkit-ready { opacity: 1; transition: opacity 0.1s; }
.ovkit-empty-state {
    padding: 40px 24px;
    text-align: center;
    color: var(--ovkit-dim);
    font-size: 14px;
}
.ovkit-empty-state a {
    color: var(--ovkit-navy);
    font-weight: 600;
    text-decoration: none;
}
.ovkit-empty-state a:hover { text-decoration: underline; }
.ovkit-scan-intro {
    font-size: 13px;
    color: var(--ovkit-dim);
    margin: 0 0 16px;
    line-height: 1.5;
}

/* ═══════════════════════════════════════════════════════════
   FEATURE CARD
═══════════════════════════════════════════════════════════ */
.ovkit-card {
    background: var(--ovkit-card);
    border: 1px solid var(--ovkit-border);
    border-radius: var(--ovkit-radius);
    overflow: hidden;
}

/* ─── Section header ─── */
.ovkit-section {
    padding: 8px 16px;
    background: var(--ovkit-bg);
    border-bottom: 1px solid var(--ovkit-border);
}
.ovkit-section:not(:first-child) {
    border-top: 1px solid var(--ovkit-border);
}
.ovkit-section p {
    font-size: 11px;
    font-weight: 600;
    color: var(--ovkit-dim);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0;
}
.ovkit-section.ovkit-hidden { display: none; }

/* ─── Feature row ─── */
.ovkit-row {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 10px 16px;
    min-height: 52px;
    border-bottom: 1px solid var(--ovkit-bg);
    transition: background .1s;
}
.ovkit-row:last-child { border-bottom: none; }
.ovkit-row:hover { background: #fafaf8; }
.ovkit-row.ovkit-hidden { display: none; }

/* ─── Icon ─── */
.ovkit-row-icon {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: var(--ovkit-bg);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: var(--ovkit-dim);
    margin-top: 2px;
}

/* ─── Info block ─── */
.ovkit-row-info {
    flex: 1;
    min-width: 0;
}
.ovkit-row-top {
    display: flex;
    align-items: center;
    gap: 5px;
    flex-wrap: wrap;
}
.ovkit-row-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--ovkit-text);
    line-height: 1.3;
}
.ovkit-row-desc {
    font-size: 11px;
    color: var(--ovkit-dim);
    margin-top: 2px;
    line-height: 1.4;
}

/* ═══════════════════════════════════════════════════════════
   BADGES
═══════════════════════════════════════════════════════════ */
/* Risk badges */
.ovkit-risk {
    font-size: 11px;
    padding: 1px 7px;
    border-radius: 10px;
    font-weight: 500;
    display: inline-block;
    line-height: 1.6;
    flex-shrink: 0;
}
.ovkit-risk-safe  { background: #e6f7ef; color: var(--ovkit-green); }
.ovkit-risk-rec   { background: #e8eeff; color: var(--ovkit-navy); }
.ovkit-risk-adv   { background: #fef5e0; color: var(--ovkit-amber); }
.ovkit-risk-risky { background: #fdecea; color: var(--ovkit-red); }

/* Level badges */
.ovkit-level {
    font-size: 11px;
    padding: 1px 7px;
    border-radius: 10px;
    font-weight: 500;
    display: inline-block;
    line-height: 1.6;
    flex-shrink: 0;
}
.ovkit-level-std { background: transparent; color: var(--ovkit-dim); }
.ovkit-level-adv { background: #fff0e6; color: #c85400; }

/* Audience badges */
.ovkit-audience {
    font-size: 11px;
    padding: 1px 7px;
    border-radius: 10px;
    font-weight: 500;
    display: inline-block;
    line-height: 1.6;
    flex-shrink: 0;
}
.ovkit-audience-woo { background: #f3e8ff; color: #6b21a8; }

/* Detected badge */
.ovkit-detected {
    font-size: 11px;
    padding: 1px 7px;
    border-radius: 10px;
    background: #f0ebff;
    color: #5b41c0;
    font-weight: 500;
    display: inline-block;
    line-height: 1.6;
    flex-shrink: 0;
}

/* Detection message — inline, not full-width */
.ovkit-row-detection {
    font-size: 11px;
    margin-top: 5px;
    padding: 3px 9px;
    border-radius: 6px;
    line-height: 1.5;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    max-width: 100%;
}
.ovkit-det-ok   { background: #e8f7f0; color: #146444; }
.ovkit-det-warn { background: #fdf4e3; color: #7a5000; }

.ovkit-savings {
    font-size: 10px;
    padding: 1px 6px;
    border-radius: 8px;
    background: rgba(0,0,0,.06);
    color: inherit;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════════
   HELP TOOLTIP
═══════════════════════════════════════════════════════════ */
.ovkit-help {
    position: relative;
    display: inline-flex;
}
.ovkit-help-btn {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #eeedf0;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    color: var(--ovkit-dim);
    font-weight: 700;
    font-family: inherit;
    padding: 0;
    transition: background .12s, color .12s;
    flex-shrink: 0;
}
.ovkit-help-btn:hover {
    background: #dce4ff;
    color: var(--ovkit-navy);
}

.ovkit-tooltip {
    display: none;
    position: absolute;
    left: 0;
    top: calc(100% + 8px);
    z-index: 9999;
    width: 360px;
    max-width: min(360px, calc(100vw - 40px));
    padding: 16px;
    background: var(--ovkit-card);
    border: 1px solid var(--ovkit-border);
    border-radius: var(--ovkit-radius);
    box-shadow: 0 8px 32px rgba(0,0,0,.13);
    word-wrap: break-word;
    overflow-wrap: break-word;
    overflow: visible;
}
.ovkit-tooltip.ovkit-tooltip-open { display: block; }
.ovkit-tooltip-above {
    top: auto;
    bottom: calc(100% + 8px);
}

.ovkit-tt-close {
    position: absolute;
    top: 8px;
    right: 10px;
    background: none;
    border: none;
    font-size: 16px;
    color: var(--ovkit-dim);
    cursor: pointer;
    padding: 0;
    line-height: 1;
    transition: color .12s;
}
.ovkit-tt-close:hover { color: var(--ovkit-text); }

.ovkit-tt-title {
    font-size: 13px;
    font-weight: 700;
    color: var(--ovkit-text);
    margin-bottom: 8px;
    padding-right: 20px;
    word-wrap: break-word;
    overflow-wrap: break-word;
}
.ovkit-tt-text {
    font-size: 12px;
    color: #4a4f65;
    line-height: 1.6;
    margin-bottom: 8px;
    word-wrap: break-word;
    overflow-wrap: break-word;
}
.ovkit-tt-benefit {
    font-size: 12px;
    color: #0f5c38;
    font-weight: 500;
    margin-bottom: 10px;
    padding: 7px 10px;
    background: #e8f7f0;
    border-radius: 6px;
    word-wrap: break-word;
    overflow-wrap: break-word;
    line-height: 1.5;
}
.ovkit-tt-label {
    font-size: 10px;
    font-weight: 700;
    color: var(--ovkit-dim);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 6px;
}
.ovkit-tt-example {
    font-size: 11px;
    padding: 10px 12px;
    background: var(--ovkit-bg);
    border-radius: 8px;
    color: #4a4f65;
    line-height: 1.6;
    word-wrap: break-word;
    overflow-wrap: break-word;
}
.ovkit-before { color: var(--ovkit-red);   font-weight: 600; }
.ovkit-after  { color: var(--ovkit-green); font-weight: 600; }

/* ═══════════════════════════════════════════════════════════
   EXTRAS / SETTINGS FIELDS
═══════════════════════════════════════════════════════════ */
.ovkit-extras {
    margin-top: 10px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.ovkit-extra-label {
    font-size: 11px;
    font-weight: 600;
    color: #4a4f65;
    margin: 4px 0 1px;
}
.ovkit-extra-field {
    display: block;
    width: 100%;
    max-width: 420px;
    padding: 7px 11px;
    border: 1px solid var(--ovkit-border);
    border-radius: 8px;
    font-size: 12px;
    font-family: inherit;
    color: var(--ovkit-text);
    background: var(--ovkit-card);
    resize: vertical;
    transition: border-color .15s, box-shadow .15s;
    line-height: 1.4;
}
.ovkit-extra-field:focus {
    outline: none;
    border-color: var(--ovkit-navy);
    box-shadow: 0 0 0 2px rgba(36,59,120,.12);
}
.ovkit-extra-desc {
    font-size: 11px;
    color: var(--ovkit-dim);
    margin: 2px 0 0;
    line-height: 1.5;
}
.ovkit-extra-desc a {
    color: var(--ovkit-navy);
    text-decoration: underline;
}

/* Color picker row */
.ovkit-color-row {
    display: flex;
    align-items: center;
    gap: 8px;
}
.ovkit-color-input {
    width: 34px;
    height: 34px;
    padding: 2px;
    border: 1px solid var(--ovkit-border);
    border-radius: 8px;
    cursor: pointer;
    background: none;
}
.ovkit-color-hex {
    font-size: 12px;
    color: var(--ovkit-dim);
    font-family: 'SF Mono', Monaco, Consolas, monospace;
}

/* Media upload row */
.ovkit-media-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.ovkit-media-row .ovkit-extra-field {
    flex: 1;
    min-width: 180px;
}
.ovkit-media-btn  { white-space: nowrap; }
.ovkit-media-preview { display: flex; align-items: center; }

/* Code textarea */
.ovkit-code-field {
    font-family: 'SF Mono', Monaco, Consolas, 'Courier New', monospace;
    font-size: 11px;
    line-height: 1.5;
    background: #f8f7f4;
    tab-size: 2;
}

/* ═══════════════════════════════════════════════════════════
   TOGGLE
═══════════════════════════════════════════════════════════ */
.ovkit-toggle {
    width: 36px;
    height: 20px;
    flex-shrink: 0;
    cursor: pointer;
    margin-top: 2px;
}
.ovkit-toggle-track {
    width: 36px;
    height: 20px;
    border-radius: 10px;
    padding: 2px;
    transition: background .2s;
}
.ovkit-toggle-thumb {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #fff;
    transition: transform .2s;
    box-shadow: 0 1px 3px rgba(0,0,0,.18);
}
.ovkit-on  .ovkit-toggle-track { background: var(--ovkit-navy); }
.ovkit-off .ovkit-toggle-track { background: #C9C7C2; }
.ovkit-on  .ovkit-toggle-thumb { transform: translateX(16px); }

/* ═══════════════════════════════════════════════════════════
   ACTIVITY LOG
═══════════════════════════════════════════════════════════ */
.ovkit-log-panel {
    background: var(--ovkit-card);
    border: 1px solid var(--ovkit-border);
    border-radius: var(--ovkit-radius);
    padding: 20px;
    margin-top: 16px;
}
.ovkit-log-panel h3 {
    font-size: 14px;
    font-weight: 700;
    margin: 0 0 12px;
    color: var(--ovkit-text);
}
.ovkit-log-empty {
    font-size: 13px;
    color: var(--ovkit-dim);
}
.ovkit-log-entry {
    padding: 10px 0;
    border-bottom: 1px solid var(--ovkit-bg);
}
.ovkit-log-entry:last-child { border-bottom: none; }
.ovkit-log-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 12px;
    color: var(--ovkit-dim);
    margin-bottom: 6px;
    flex-wrap: wrap;
}
.ovkit-log-user {
    font-weight: 600;
    color: var(--ovkit-text);
}
.ovkit-log-count {
    background: var(--ovkit-bg);
    padding: 1px 8px;
    border-radius: 8px;
    font-size: 10px;
    color: var(--ovkit-dim);
    font-weight: 500;
}
.ovkit-log-changes {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}
.ovkit-log-change {
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 6px;
    background: var(--ovkit-bg);
    color: #4a4f65;
}
.ovkit-log-more {
    font-size: 11px;
    color: var(--ovkit-dim);
    padding: 2px 4px;
}

/* Rollback button state */
.ovkit-rollback:hover {
    background: #fdecea;
    border-color: var(--ovkit-red);
    color: var(--ovkit-red);
}

/* ═══════════════════════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════════════════════ */
.ovkit-footer {
    margin-top: 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.ovkit-save {
    padding: 10px 28px;
    font-size: 13px;
}

/* ═══════════════════════════════════════════════════════════
   SEARCH
═══════════════════════════════════════════════════════════ */
.ovkit-search {
    font-size: 12px;
    padding: 5px 12px;
    border-radius: 20px;
    border: 1px solid var(--ovkit-border);
    background: var(--ovkit-card);
    color: var(--ovkit-text);
    font-family: inherit;
    width: 150px;
    max-width: 160px;
    transition: border-color .15s;
    flex-shrink: 1;
}
.ovkit-search:focus {
    outline: none;
    border-color: var(--ovkit-navy);
    width: 190px;
    box-shadow: 0 0 0 2px rgba(36,59,120,.1);
}
.ovkit-search::placeholder { color: #b5b3ae; }

/* ═══════════════════════════════════════════════════════════
   SITE SCAN RESULTS (injected rows)
═══════════════════════════════════════════════════════════ */
#ovkit-site-scan-list > div {
    word-wrap: break-word;
    overflow-wrap: break-word;
}

/* ═══════════════════════════════════════════════════════════
   HERO STATUS CARD
═══════════════════════════════════════════════════════════ */
.ovkit-hero {
    background: var(--ovkit-card);
    border: 1px solid var(--ovkit-border);
    border-radius: var(--ovkit-radius);
    padding: 16px 20px;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}
.ovkit-hero-left {
    display: flex;
    align-items: center;
    gap: 12px;
}
.ovkit-status-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    flex-shrink: 0;
}
.ovkit-dot-healthy  { background: var(--ovkit-green); box-shadow: 0 0 0 3px rgba(34,160,107,.15); }
.ovkit-dot-warning  { background: var(--ovkit-amber); box-shadow: 0 0 0 3px rgba(207,138,0,.15); }
.ovkit-dot-critical { background: var(--ovkit-red);   box-shadow: 0 0 0 3px rgba(226,72,61,.15); }
.ovkit-hero-msg {
    font-size: 14px;
    font-weight: 600;
    color: var(--ovkit-text);
    line-height: 1.3;
}
.ovkit-hero-url {
    font-size: 11px;
    color: var(--ovkit-dim);
    margin-top: 2px;
}
.ovkit-hero-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    flex-shrink: 0;
}

/* ═══════════════════════════════════════════════════════════
   STAT PILLS — Red variant
═══════════════════════════════════════════════════════════ */
.ovkit-stat-red { color: var(--ovkit-red); }

/* ═══════════════════════════════════════════════════════════
   SITE SCAN PANEL
═══════════════════════════════════════════════════════════ */
.ovkit-scan-panel {
    background: var(--ovkit-card);
    border: 1px solid var(--ovkit-border);
    border-radius: var(--ovkit-radius);
    padding: 16px 20px;
    margin-bottom: 16px;
}
.ovkit-scan-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}
.ovkit-scan-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--ovkit-text);
}
.ovkit-scan-ts {
    font-size: 11px;
    color: var(--ovkit-dim);
    margin-left: 8px;
}
.ovkit-scan-empty {
    font-size: 13px;
    color: var(--ovkit-dim);
    margin: 0;
    text-align: center;
    padding: 12px 0;
}

/* Scan groups (details/summary) */
.ovkit-scan-group {
    border-top: 1px solid var(--ovkit-bg);
}
.ovkit-scan-group:first-child { border-top: none; }
.ovkit-scan-group-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 0;
    font-size: 12px;
    font-weight: 600;
    color: var(--ovkit-dim);
    cursor: pointer;
    list-style: none;
    user-select: none;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}
.ovkit-scan-group-header::-webkit-details-marker { display: none; }
.ovkit-scan-group-header::before {
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 0 4px 6px;
    border-color: transparent transparent transparent currentColor;
    transition: transform .15s;
    color: var(--ovkit-dim);
    flex-shrink: 0;
}
details[open] > .ovkit-scan-group-header::before { transform: rotate(90deg); }
.ovkit-scan-group-count {
    background: var(--ovkit-bg);
    color: var(--ovkit-dim);
    font-size: 10px;
    padding: 1px 6px;
    border-radius: 8px;
    font-weight: 500;
}

/* Scan items */
.ovkit-scan-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 8px 12px;
    border-radius: 8px;
    margin-bottom: 4px;
}
.ovkit-scan-ok       { background: #f0fdf6; }
.ovkit-scan-warning  { background: #fefce8; }
.ovkit-scan-conflict { background: #fef2f2; }
.ovkit-scan-missing  { background: var(--ovkit-bg); }
.ovkit-scan-icon {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 700;
    flex-shrink: 0;
    color: #fff;
    line-height: 1;
}
.ovkit-scan-ok       .ovkit-scan-icon { background: var(--ovkit-green); }
.ovkit-scan-warning  .ovkit-scan-icon { background: var(--ovkit-amber); }
.ovkit-scan-conflict .ovkit-scan-icon { background: var(--ovkit-red); }
.ovkit-scan-missing  .ovkit-scan-icon { background: var(--ovkit-dim); color: #fff; }
.ovkit-scan-body  { flex: 1; min-width: 0; }
.ovkit-scan-label {
    font-size: 13px;
    font-weight: 600;
    color: var(--ovkit-text);
    line-height: 1.3;
}
.ovkit-scan-detail {
    font-size: 12px;
    color: #555;
    line-height: 1.5;
}
.ovkit-scan-suggestion {
    font-size: 11px;
    color: var(--ovkit-navy);
    margin-top: 3px;
    font-style: italic;
}
.ovkit-scan-sources {
    font-size: 11px;
    color: var(--ovkit-dim);
    margin-top: 2px;
}

/* ═══════════════════════════════════════════════════════════
   STICKY FOOTER SAVE BAR
═══════════════════════════════════════════════════════════ */
.ovkit-sticky-footer {
    position: sticky;
    bottom: 0;
    background: rgba(255, 255, 255, 0.97);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-top: 1px solid var(--ovkit-border);
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.07);
    padding: 14px 20px;
    margin: 16px -20px 0;
    width: calc(100% + 40px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    z-index: 100;
}
.ovkit-footer-right {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.ovkit-log-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--ovkit-navy);
    color: #fff;
    font-size: 10px;
    font-weight: 600;
    min-width: 16px;
    height: 16px;
    border-radius: 8px;
    padding: 0 4px;
    margin-left: 2px;
    vertical-align: middle;
}

/* ═══════════════════════════════════════════════════════════
   EXTRAS — Bool / Media
═══════════════════════════════════════════════════════════ */
.ovkit-extra-bool {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: #555;
    cursor: pointer;
}
.ovkit-media-thumb {
    max-height: 40px;
    border-radius: 4px;
}

/* Activity log panel — hidden by default, JS reveals */
.ovkit-log-panel { display: none; }
.ovkit-log-panel.ovkit-log-visible { display: block; }

/* ═══════════════════════════════════════════════════════════
   SCAN ITEM EXPAND (suggestion + sources hidden until clicked)
═══════════════════════════════════════════════════════════ */
.ovkit-scan-item { cursor: pointer; }
.ovkit-scan-item .ovkit-scan-suggestion,
.ovkit-scan-item .ovkit-scan-sources { display: none; }
.ovkit-scan-item.ovkit-scan-expanded .ovkit-scan-suggestion,
.ovkit-scan-item.ovkit-scan-expanded .ovkit-scan-sources { display: block; }

/* Scan fix links */
.ovkit-scan-fix { font-size: 11px; color: var(--ovkit-navy); text-decoration: none; font-weight: 600; margin-left: 8px; }
.ovkit-scan-fix:hover { text-decoration: underline; }

/* Feature row highlight (scan → feature jump) */
.ovkit-highlight { animation: ovkit-pulse 0.5s ease 3; }
@keyframes ovkit-pulse {
    0%,100% { background: transparent; }
    50%      { background: rgba(36, 59, 120, 0.08); }
}

/* ═══════════════════════════════════════════════════════════
   HEALTH CHECK PANEL
═══════════════════════════════════════════════════════════ */
.ovkit-health-btn {
    background: none;
    border: none;
    padding: 0;
    font-size: 11px;
    color: var(--ovkit-dim);
    cursor: pointer;
    margin-left: 10px;
    text-decoration: underline;
    font-family: inherit;
}
.ovkit-health-btn:hover { color: var(--ovkit-navy); }

.ovkit-health-panel {
    background: var(--ovkit-card);
    border: 1px solid var(--ovkit-border);
    border-radius: var(--ovkit-radius);
    margin-bottom: 16px;
    overflow: hidden;
}
.ovkit-health-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--ovkit-border);
    background: #fafaf8;
}
.ovkit-health-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--ovkit-text);
    flex: 1;
}
.ovkit-health-summary {
    font-size: 12px;
    font-weight: 600;
}
.ovkit-hc-sum-pass { color: var(--ovkit-green); }
.ovkit-hc-sum-warn { color: var(--ovkit-amber); }
.ovkit-hc-sum-fail { color: var(--ovkit-red); }
.ovkit-health-close {
    background: none;
    border: none;
    font-size: 18px;
    line-height: 1;
    color: var(--ovkit-dim);
    cursor: pointer;
    padding: 0 2px;
}
.ovkit-health-close:hover { color: var(--ovkit-text); }

.ovkit-health-results { padding: 4px 0; }
.ovkit-health-loading {
    padding: 16px;
    font-size: 13px;
    color: var(--ovkit-dim);
    text-align: center;
}

.ovkit-health-row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 8px 16px;
    border-bottom: 1px solid var(--ovkit-border);
    font-size: 13px;
}
.ovkit-health-row:last-child { border-bottom: none; }
.ovkit-hc-icon { font-size: 14px; flex-shrink: 0; line-height: 1.5; }
.ovkit-hc-body { display: flex; flex-direction: column; gap: 2px; }
.ovkit-hc-name { font-weight: 600; color: var(--ovkit-text); }
.ovkit-hc-msg  { font-size: 12px; color: var(--ovkit-dim); }
.ovkit-hc-pass .ovkit-hc-name { color: var(--ovkit-green); }
.ovkit-hc-fail .ovkit-hc-name { color: var(--ovkit-red); }
.ovkit-hc-warn .ovkit-hc-name { color: var(--ovkit-amber); }
.ovkit-hc-fail { background: #fff8f8; }
.ovkit-hc-warn { background: #fffbf0; }

/* ═══════════════════════════════════════════════════════════
   UTILITY
═══════════════════════════════════════════════════════════ */
.ovkit-hidden { display: none !important; }

/* ═══════════════════════════════════════════════════════════
   RESPONSIVE — < 768px
═══════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
    .ovkit-wrap {
        padding: 12px;
    }

    /* Stats: 2 columns on small */
    .ovkit-summary {
        grid-template-columns: repeat(2, 1fr);
        gap: 8px;
    }

    /* Hero: stack */
    .ovkit-hero {
        flex-direction: column;
        align-items: flex-start;
    }

    /* Tabs: scroll horizontally, do not wrap */
    .ovkit-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 4px;
        gap: 2px;
    }
    .ovkit-tab {
        font-size: 12px;
        padding: 6px 8px;
    }

    /* Feature rows: stack icon + info vertically */
    .ovkit-row {
        flex-wrap: wrap;
        padding: 10px 12px;
        gap: 8px;
        min-height: unset;
    }
    .ovkit-row-icon {
        width: 28px;
        height: 28px;
    }
    .ovkit-row-info {
        width: calc(100% - 40px);
    }
    .ovkit-toggle {
        margin-left: auto;
    }

    /* Tooltip: avoid overflow off screen */
    .ovkit-tooltip {
        left: 0;
        right: 0;
        max-width: calc(100vw - 24px);
        width: auto;
    }

    /* Extras fields: full width */
    .ovkit-extra-field {
        max-width: 100%;
    }

    /* Sticky footer: stack */
    .ovkit-sticky-footer {
        flex-direction: column;
        align-items: flex-start;
    }
    .ovkit-save {
        width: 100%;
        text-align: center;
    }
    .ovkit-footer-right {
        width: 100%;
    }

    /* Search input: shrink further on mobile */
    .ovkit-search {
        max-width: 120px;
        font-size: 12px;
    }

    /* Action buttons: scroll or wrap */
    .ovkit-actions {
        gap: 6px;
    }
}

@media (max-width: 480px) {
    .ovkit-summary {
        grid-template-columns: repeat(2, 1fr);
    }
    .ovkit-log-meta {
        gap: 6px;
    }
}

/* ═══════════════════════════════════════════════════════════
   DASHBOARD QUICK STATS
═══════════════════════════════════════════════════════════ */
.ovkit-quick-stats {
    display: flex;
    gap: 16px;
    margin-bottom: 16px;
    padding: 12px 16px;
    background: var(--ovkit-bg);
    border-radius: var(--ovkit-radius);
}
.ovkit-quick-stat { text-align: center; flex: 1; }
.ovkit-qs-num { display: block; font-size: 20px; font-weight: 700; color: var(--ovkit-navy); }
.ovkit-qs-label { font-size: 11px; color: var(--ovkit-dim); }

/* ═══════════════════════════════════════════════════════════
   SCAN PANEL — COLLAPSED SUMMARY BAR (dashboard)
═══════════════════════════════════════════════════════════ */
.ovkit-scan-details { margin: 0; }
.ovkit-scan-details > summary { list-style: none; }
.ovkit-scan-details > summary::-webkit-details-marker { display: none; }
.ovkit-scan-summary-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 4px;
    cursor: pointer;
    font-size: 13px;
    color: var(--ovkit-dim);
    border-top: 1px solid var(--ovkit-border);
    margin-top: 4px;
    user-select: none;
}
.ovkit-scan-summary-bar:hover { color: var(--ovkit-text); }
.ovkit-scan-summary-bar::before {
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 0 4px 6px;
    border-color: transparent transparent transparent currentColor;
    margin-right: 6px;
    transition: transform .15s;
    display: inline-block;
    color: var(--ovkit-dim);
}
.ovkit-scan-details[open] > .ovkit-scan-summary-bar::before { transform: rotate(90deg); }
.ovkit-scan-view-all {
    font-size: 12px;
    color: var(--ovkit-navy);
    text-decoration: none;
    font-weight: 500;
    flex-shrink: 0;
    margin-left: 12px;
}
.ovkit-scan-view-all:hover { text-decoration: underline; }

/* ═══════════════════════════════════════════════════════════
   DASHBOARD NAV CARDS
═══════════════════════════════════════════════════════════ */
.ovkit-dashboard-nav {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    margin-top: 20px;
}
.ovkit-nav-card {
    display: block;
    padding: 20px;
    background: var(--ovkit-card);
    border: 1px solid var(--ovkit-border);
    border-radius: var(--ovkit-radius);
    text-decoration: none;
    transition: border-color .15s, box-shadow .15s;
}
.ovkit-nav-card:hover {
    border-color: var(--ovkit-navy);
    box-shadow: 0 2px 8px rgba(36,59,120,.08);
}
.ovkit-nav-card-title {
    font-size: 15px;
    font-weight: 600;
    color: var(--ovkit-navy);
    display: block;
    margin-bottom: 4px;
}
.ovkit-nav-card-desc {
    font-size: 12px;
    color: var(--ovkit-dim);
    display: block;
}

@media (max-width: 768px) {
    .ovkit-dashboard-nav { grid-template-columns: 1fr; }
}

/* ── Dashboard nav cards + quick stats (hard-coded values, no var() dependency) ── */
.ovkit-dashboard-nav{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:20px}
.ovkit-nav-card{background:#fff;border:1px solid #e8e6e1;border-radius:12px;padding:20px;text-decoration:none!important;display:block;transition:border-color .15s,box-shadow .15s}
.ovkit-nav-card:hover{border-color:#243B78;box-shadow:0 2px 8px rgba(36,59,120,.08)}
.ovkit-nav-card-icon{display:block;margin-bottom:10px;color:#243B78;line-height:0}
.ovkit-nav-card-icon svg{display:block}
.ovkit-nav-card-title{font-size:15px;font-weight:600;color:#243B78;display:block;margin-bottom:4px}
.ovkit-nav-card-desc{font-size:12px;color:#8B8FA3;display:block;line-height:1.5;margin-bottom:10px}
.ovkit-nav-card-status{font-size:12px;font-weight:600;color:#243B78;display:block}

/* Dashboard status card */
.ovkit-status-card{display:flex;align-items:center;gap:16px;background:#fff;border:1px solid #e8e6e1;border-radius:12px;padding:20px 24px;margin-bottom:16px}
.ovkit-status-card.ovkit-status-ok{}
.ovkit-status-card.ovkit-status-attention{}
.ovkit-status-icon{flex-shrink:0;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%}
.ovkit-status-ok .ovkit-status-icon{background:#e8f5ec;color:#2a9d5f}
.ovkit-status-attention .ovkit-status-icon{background:#fcebe2;color:#c25a2e}
.ovkit-status-card.ovkit-status-critical{background:#fcf0f1}
.ovkit-status-critical .ovkit-status-icon{background:#f7d7d9;color:#b32d2e}
.ovkit-status-card.ovkit-status-recommend{}
.ovkit-status-recommend .ovkit-status-icon{background:#fbf0d9;color:#9a6a12}
.ovkit-status-card.ovkit-status-neutral{}
.ovkit-status-neutral .ovkit-status-icon{background:#e7eaf3;color:#28396f}
.ovkit-status-card .ovkit-status-sub+.ovkit-status-sub{margin-top:4px}
.ovkit-status-card .ovkit-status-link{display:inline-block;margin-top:6px}
.ovkit-status-body{flex:1;min-width:0}
.ovkit-status-msg{font-size:16px;font-weight:600;color:#243B78;margin-bottom:4px}
.ovkit-status-sub{font-size:13px;color:#6b7280}
.ovkit-status-link{font-size:13px;font-weight:600;color:#243B78;text-decoration:none}
.ovkit-status-link:hover{text-decoration:underline}

/* Features page action row */
.ovkit-features-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:12px;justify-content:flex-end}
.ovkit-import-label{cursor:pointer}
.ovkit-quick-stats{display:flex;margin-bottom:16px;background:#fff;border:1px solid #e8e6e1;border-radius:12px;overflow:hidden}
.ovkit-quick-stat{text-align:center;flex:1;padding:14px 12px;border-right:1px solid #e8e6e1}
.ovkit-quick-stat:last-child{border-right:none}
.ovkit-qs-num{display:block;font-size:22px;font-weight:700;color:#243B78}
.ovkit-qs-label{font-size:11px;color:#8B8FA3;margin-top:2px;display:block}
@media(max-width:768px){.ovkit-dashboard-nav{grid-template-columns:1fr}.ovkit-quick-stats{flex-direction:column}.ovkit-quick-stat{border-right:none;border-bottom:1px solid #e8e6e1}.ovkit-quick-stat:last-child{border-bottom:none}}

.ovkit-tt-blog-link { display: inline-block; margin-top: 8px; font-size: 12px; color: var(--ovkit-navy); font-weight: 600; text-decoration: none; }
.ovkit-tt-blog-link:hover { text-decoration: underline; }

/* Dashboard site-type presets */
.ovkit-presets { margin-bottom: 20px; }
.ovkit-presets h3 { font-size: 16px; font-weight: 600; color: var(--ovkit-text); margin-bottom: 4px; }
.ovkit-presets-desc { font-size: 13px; color: var(--ovkit-dim); margin-bottom: 12px; }
.ovkit-preset-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.ovkit-preset-btn { background: var(--ovkit-card); border: 1px solid var(--ovkit-border); border-radius: var(--ovkit-radius); padding: 16px; text-align: left; cursor: pointer; transition: border-color 0.15s, box-shadow 0.15s; font-family: inherit; }
.ovkit-preset-btn:hover { border-color: var(--ovkit-navy); box-shadow: 0 2px 8px rgba(36,59,120,0.08); }
.ovkit-preset-icon { display: block; margin-bottom: 8px; color: var(--ovkit-navy); }
.ovkit-preset-icon svg { width: 24px; height: 24px; }
.ovkit-preset-name { font-size: 14px; font-weight: 600; color: var(--ovkit-navy); display: block; margin-bottom: 2px; }
.ovkit-preset-detail { font-size: 11px; color: var(--ovkit-dim); }
@media (max-width: 768px) { .ovkit-preset-grid { grid-template-columns: 1fr; } }

.ovkit-scan-detail-flush {
	margin: 0;
}

.ovkit-scan-icon svg {
	width: 12px;
	height: 12px;
	stroke-width: 2.5;
}


/* ═══════════════════════════════════════════════════════════
   PANEL SKIN — the ovkit.com breaker-panel world, adapted for daily admin use
═══════════════════════════════════════════════════════════ */
body.ovkit-screen #wpcontent, body.ovkit-screen #wpbody-content { background: var(--ovkit-steel); }
body.ovkit-screen #wpfooter { background: var(--ovkit-steel); }

.ovkit-wrap { font-size: 14px; }
.ovkit-wrap :focus-visible { outline: 3px solid var(--ovkit-coral); outline-offset: 2px; }
.ovkit-wrap ::selection { background: var(--ovkit-coral); color: #16181b; }

/* Header: condensed engineering heading, version as a tape strip */
.ovkit-wrap .ovkit-header-text h1 { font-family: var(--ovkit-cond); font-size: 30px; font-weight: 700; letter-spacing: -0.005em; color: #16181b; line-height: 1; }
.ovkit-wrap .ovkit-header-text span { font: 600 12px/1 var(--ovkit-cond); letter-spacing: 0.08em; text-transform: uppercase; color: var(--ovkit-dim); }
.ovkit-wrap .ovkit-logo { color: #16181b; }

/* Headings inside panels */
.ovkit-wrap h2, .ovkit-wrap h3, .ovkit-presets h3 { font-family: var(--ovkit-cond); font-weight: 700; color: #16181b; letter-spacing: 0; }
.ovkit-presets h3 { font-size: 22px; }
.ovkit-presets-desc, .ovkit-scan-intro { color: var(--ovkit-dim); font-size: 14px; }

/* Objects on the steel field: tape-paper panels with a long soft shadow, seams inside */
.ovkit-wrap .ovkit-card,
.ovkit-wrap .ovkit-status-card,
.ovkit-wrap .ovkit-preset-btn,
.ovkit-wrap .ovkit-nav-card,
.ovkit-wrap .ovkit-dashboard-nav > a,
.ovkit-wrap .ovkit-log-panel,
.ovkit-wrap .ovkit-scan-panel {
    background: var(--ovkit-card);
    border: 1px solid var(--ovkit-border);
    border-radius: var(--ovkit-radius);
    box-shadow: 0 18px 32px -26px rgba(22, 24, 27, 0.55), 0 1px 0 rgba(255, 255, 255, 0.6) inset;
}
.ovkit-wrap .ovkit-row { border-bottom: 1px solid var(--ovkit-seam); }
.ovkit-wrap .ovkit-row:hover { background: #f3f3ee; }
.ovkit-wrap .ovkit-row-title { font-family: var(--ovkit-cond); font-size: 18px; font-weight: 600; color: #16181b; letter-spacing: 0.005em; }
.ovkit-wrap .ovkit-row-desc { font-size: 13px; color: var(--ovkit-dim); }
.ovkit-wrap .ovkit-row-icon { background: transparent; border: 1px solid var(--ovkit-seam); border-radius: 3px; color: #16181b; }

/* Section heads = the label strip above a breaker bed */
.ovkit-wrap .ovkit-section { background: var(--ovkit-bg); border-color: var(--ovkit-seam); padding: 10px 16px; }
.ovkit-wrap .ovkit-section p {
    display: inline-block; font: 700 13px/1 var(--ovkit-cond); letter-spacing: 0.1em; color: #16181b;
    background: var(--ovkit-card); padding: 5px 9px 4px; box-shadow: 0 1px 2px rgba(22, 24, 27, 0.22);
}

/* Label-maker tape: risk, audience and "found" labels */
.ovkit-wrap .ovkit-risk,
.ovkit-wrap .ovkit-audience,
.ovkit-wrap .ovkit-detected {
    font: 700 11px/1 var(--ovkit-cond); letter-spacing: 0.08em; text-transform: uppercase;
    padding: 4px 7px 3px; border-radius: 2px; background: var(--ovkit-card); color: #16181b;
    box-shadow: 0 0 0 1px var(--ovkit-seam); line-height: 1;
}
.ovkit-wrap .ovkit-risk::before { content: ""; display: inline-block; width: 7px; height: 7px; margin: 0 5px 1px 0; border-radius: 1px; vertical-align: middle; background: currentColor; }
.ovkit-wrap .ovkit-risk-safe  { color: var(--ovkit-green); }
.ovkit-wrap .ovkit-risk-rec   { color: #16181b; }
.ovkit-wrap .ovkit-risk-adv   { color: var(--ovkit-amber); }
.ovkit-wrap .ovkit-risk-risky { color: #fff; background: var(--ovkit-red); box-shadow: none; }
.ovkit-wrap .ovkit-risk-risky::before { background: #fff; }
.ovkit-wrap .ovkit-detected { background: transparent; color: var(--ovkit-live-ink); box-shadow: 0 0 0 1px rgba(166, 58, 0, 0.45); }

/* Buttons: black is the primary action; secondary = outlined ink */
.ovkit-wrap .ovkit-btn, .ovkit-wrap .ovkit-btn-small, .ovkit-wrap .ovkit-health-btn {
    font-family: var(--ovkit-cond); font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase;
    border-radius: 3px; border: 1.5px solid #16181b; background: transparent; color: #16181b;
}
.ovkit-wrap .ovkit-btn { font-size: 15px; padding: 9px 16px; }
.ovkit-wrap .ovkit-btn-small { font-size: 12px; padding: 5px 10px; }
.ovkit-wrap .ovkit-btn:hover, .ovkit-wrap .ovkit-btn-small:hover { background: #16181b; color: var(--ovkit-card); }
.ovkit-wrap .ovkit-btn-primary, .ovkit-sticky-footer .ovkit-btn-primary { background: #16181b; color: var(--ovkit-card); border-color: #16181b; box-shadow: 0 10px 18px -12px rgba(22, 24, 27, 0.8); }
.ovkit-wrap .ovkit-btn-primary:hover, .ovkit-sticky-footer .ovkit-btn-primary:hover { background: #000; }
.ovkit-wrap .ovkit-btn-danger { color: var(--ovkit-red); border-color: var(--ovkit-red); }
.ovkit-wrap .ovkit-btn-danger:hover { background: var(--ovkit-red); color: #fff; }

/* Tabs: condensed labels, ink underline for the current one */
.ovkit-wrap .ovkit-tab { font: 600 15px/1 var(--ovkit-cond); letter-spacing: 0.02em; color: var(--ovkit-dim); padding: 9px 10px; }
.ovkit-wrap .ovkit-tab:hover { color: #16181b; }
.ovkit-wrap .ovkit-tab-active { color: #16181b !important; border-bottom: 3px solid #16181b !important; }
.ovkit-wrap .ovkit-tab-count { font: 700 11px/1 var(--ovkit-cond); color: var(--ovkit-live-ink); }

/* Inputs read as tape fields */
.ovkit-wrap input[type="text"], .ovkit-wrap input[type="url"], .ovkit-wrap input[type="number"], .ovkit-wrap input[type="email"], .ovkit-wrap input[type="search"], .ovkit-wrap textarea, .ovkit-wrap select {
    background: #fff; border: 1.5px solid #16181b; border-radius: 3px; color: #16181b; font-family: var(--ovkit-body);
}
.ovkit-wrap input:focus, .ovkit-wrap textarea:focus, .ovkit-wrap select:focus { border-color: #16181b; box-shadow: 0 0 0 3px rgba(255, 95, 15, 0.45); outline: none; }
.ovkit-wrap code { background: rgba(22, 24, 27, 0.07); color: #16181b; border-radius: 2px; }

/* The switch is a breaker: black body, lever, orange lamp when live */
.ovkit-wrap .ovkit-toggle { width: 44px; height: 26px; }
.ovkit-wrap .ovkit-toggle-track {
    position: relative; width: 44px; height: 26px; border-radius: 4px; padding: 3px;
    background: #1f2226 !important; box-shadow: inset 0 0 0 1px #000, 0 1px 0 rgba(255, 255, 255, 0.5);
}
.ovkit-wrap .ovkit-toggle-thumb {
    width: 16px; height: 20px; border-radius: 2px; background: #c6cbd0;
    box-shadow: inset 0 -3px 0 rgba(0, 0, 0, 0.18); transition: transform .16s cubic-bezier(.2, .7, .2, 1), background .16s;
}
.ovkit-wrap .ovkit-on .ovkit-toggle-thumb { transform: translateX(22px); background: #fafaf6; }
.ovkit-wrap .ovkit-toggle-track::after {
    content: ""; position: absolute; left: 27px; top: 10px; width: 6px; height: 6px; border-radius: 50%;
    background: #3a3f46; transition: background .16s, box-shadow .16s;
}
.ovkit-wrap .ovkit-on .ovkit-toggle-track::after { left: 11px; background: var(--ovkit-coral); box-shadow: 0 0 6px 2px rgba(255, 95, 15, 0.7); }
@media (prefers-reduced-motion: reduce) { .ovkit-wrap .ovkit-toggle-thumb, .ovkit-wrap .ovkit-toggle-track::after { transition: none; } }

/* Status card: stamps instead of coloured side tabs */
.ovkit-wrap .ovkit-status-card { border-left-width: 1px !important; border-left-color: var(--ovkit-border) !important; align-items: flex-start; }
.ovkit-wrap .ovkit-status-msg { font-family: var(--ovkit-cond); font-size: 24px; font-weight: 700; color: #16181b; line-height: 1.05; }
.ovkit-wrap .ovkit-status-sub { font-size: 14px; color: var(--ovkit-dim); }
.ovkit-wrap .ovkit-status-link { font: 700 14px/1 var(--ovkit-cond); letter-spacing: 0.04em; text-transform: uppercase; color: #16181b; text-decoration: underline; text-decoration-color: var(--ovkit-coral); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.ovkit-wrap .ovkit-status-icon { border-radius: 3px; }
.ovkit-wrap .ovkit-status-ok .ovkit-status-icon { background: #e3efe7; color: var(--ovkit-green); }
.ovkit-wrap .ovkit-status-recommend .ovkit-status-icon { background: #f4ead6; color: var(--ovkit-amber); }
.ovkit-wrap .ovkit-status-neutral .ovkit-status-icon { background: var(--ovkit-bg); color: #16181b; }
.ovkit-wrap .ovkit-status-attention .ovkit-status-icon { background: #f6dede; color: var(--ovkit-red); }
.ovkit-wrap .ovkit-status-card.ovkit-status-critical { background: #16181b; border-color: #16181b !important; }
.ovkit-wrap .ovkit-status-critical .ovkit-status-msg { color: #fff; }
.ovkit-wrap .ovkit-status-critical .ovkit-status-sub { color: #d9dde1; }
.ovkit-wrap .ovkit-status-critical .ovkit-status-sub strong { color: #fff; }
.ovkit-wrap .ovkit-status-critical .ovkit-status-icon { background: var(--ovkit-coral); color: #16181b; }

/* Presets and dashboard cards */
.ovkit-wrap .ovkit-preset-btn { transition: transform .12s, box-shadow .12s; }
.ovkit-wrap .ovkit-preset-btn:hover { border-color: #16181b; transform: translateY(-1px); }
.ovkit-wrap .ovkit-preset-name { font: 700 19px/1.1 var(--ovkit-cond); color: #16181b; }
.ovkit-wrap .ovkit-preset-detail { font-size: 13px; color: var(--ovkit-dim); }
.ovkit-wrap .ovkit-preset-icon { color: #16181b; }

/* Sticky save bar: ink band like the site footer */
.ovkit-sticky-footer { background: rgba(250, 250, 246, 0.96); border-top: 1px solid var(--ovkit-border); box-shadow: 0 -12px 24px -20px rgba(22, 24, 27, 0.6); }

.ovkit-wrap .ovkit-nav-card-icon { color: #16181b; }
.ovkit-wrap .ovkit-nav-card-title { font: 700 21px/1.1 var(--ovkit-cond); color: #16181b; }
.ovkit-wrap .ovkit-nav-card-desc { font-size: 13px; color: var(--ovkit-dim); }
.ovkit-wrap .ovkit-nav-card-status {
    display: inline-block; font: 700 12px/1 var(--ovkit-cond); letter-spacing: 0.08em; text-transform: uppercase;
    color: #16181b; background: var(--ovkit-bg); padding: 5px 8px 4px; border-radius: 2px;
}
.ovkit-wrap .ovkit-nav-card:hover { border-color: #16181b; box-shadow: 0 22px 34px -24px rgba(22, 24, 27, 0.7); }

/* Detection notes: a strip of paper with the finding, the saving as a tape tag */
.ovkit-wrap .ovkit-det-ok, .ovkit-wrap .ovkit-det-warn { background: var(--ovkit-bg); color: #16181b; border-radius: 2px; }
.ovkit-wrap .ovkit-det-warn { color: var(--ovkit-amber); }
.ovkit-wrap .ovkit-savings { background: var(--ovkit-card); color: #16181b; border-radius: 2px; font: 700 11px/1.3 var(--ovkit-cond); letter-spacing: 0.04em; box-shadow: 0 0 0 1px var(--ovkit-seam); }
.ovkit-wrap .ovkit-logo { width: 44px; height: 32px; }
.ovkit-wrap .ovkit-health-btn { font-size: 11px; padding: 4px 8px; margin-left: 8px; }

/* Site scan: rows sit on the paper; the state is carried by the icon, not a tinted row */
.ovkit-wrap .ovkit-scan-ok, .ovkit-wrap .ovkit-scan-warning, .ovkit-wrap .ovkit-scan-conflict { background: transparent; }
.ovkit-wrap .ovkit-scan-item { border-bottom: 1px solid var(--ovkit-seam); }
.ovkit-wrap .ovkit-scan-item:hover { background: #f3f3ee; }
.ovkit-wrap .ovkit-scan-group-header { font: 700 14px/1 var(--ovkit-cond); letter-spacing: 0.08em; text-transform: uppercase; color: #16181b; }
.ovkit-wrap .ovkit-scan-group-count { font: 700 11px/1 var(--ovkit-cond); background: var(--ovkit-bg); color: #16181b; border-radius: 2px; }

/* Pro screens use the same wrap */
.ovkit-wrap.ovkit-pro-screen h1 { font-family: var(--ovkit-cond); font-size: 30px; font-weight: 700; color: #16181b; }
.ovkit-wrap.ovkit-pro-screen .widefat { background: var(--ovkit-card); border: 1px solid var(--ovkit-border); border-radius: var(--ovkit-radius); box-shadow: 0 18px 32px -26px rgba(22, 24, 27, 0.55); }
.ovkit-wrap.ovkit-pro-screen .widefat td { border-bottom: 1px solid var(--ovkit-seam); padding: 12px 14px; }
.ovkit-wrap.ovkit-pro-screen .widefat strong { font-family: var(--ovkit-cond); font-size: 16px; }
.ovkit-wrap.ovkit-pro-screen .striped > tbody > :nth-child(odd) { background: transparent; }

/* ═══ Review pass: one ground, shape before colour, hardware panels ═══ */
html:has(body.ovkit-screen), body.ovkit-screen, body.ovkit-screen #wpwrap { background: var(--ovkit-steel); }

/* Orange stays for live only: "found" is an ink stamp, tab counts are quiet */
.ovkit-wrap .ovkit-detected { color: #16181b; background: transparent; box-shadow: none; border: 1.5px solid #16181b; border-radius: 2px; padding: 3px 6px 2px; }
.ovkit-wrap .ovkit-tab-count { color: var(--ovkit-dim); }
.ovkit-wrap .ovkit-tab-active .ovkit-tab-count { color: #16181b; }

/* Risk = label shape: safe plain tape, recommended tape with ink edge, advanced ink outline, risky solid ink */
.ovkit-wrap .ovkit-risk::before { display: none; }
.ovkit-wrap .ovkit-risk-safe  { color: #16181b; background: var(--ovkit-card); box-shadow: 0 0 0 1px var(--ovkit-seam); }
.ovkit-wrap .ovkit-risk-rec   { color: #16181b; background: var(--ovkit-card); box-shadow: 0 0 0 1px #16181b; }
.ovkit-wrap .ovkit-risk-adv   { color: #16181b; background: transparent; box-shadow: none; border: 1.5px solid #16181b; padding: 3px 6px 2px; }
.ovkit-wrap .ovkit-risk-risky { color: var(--ovkit-card); background: #16181b; box-shadow: none; }

/* Scan state icons: ink shapes */
.ovkit-wrap .ovkit-scan-icon { background: var(--ovkit-dim); color: #fff; border-radius: 3px; }
.ovkit-wrap .ovkit-scan-ok .ovkit-scan-icon { background: transparent; color: #16181b; box-shadow: inset 0 0 0 1.5px #16181b; }
.ovkit-wrap .ovkit-scan-warning .ovkit-scan-icon { background: #16181b; color: var(--ovkit-card); }
.ovkit-wrap .ovkit-scan-conflict .ovkit-scan-icon { background: var(--ovkit-red); color: #fff; }
.ovkit-wrap .ovkit-scan-label { font-family: var(--ovkit-cond); font-size: 17px; font-weight: 600; color: #16181b; }
.ovkit-wrap .ovkit-status-recommend .ovkit-status-icon,
.ovkit-wrap .ovkit-status-ok .ovkit-status-icon { background: transparent; color: #16181b; box-shadow: inset 0 0 0 2px #16181b; }
.ovkit-wrap .ovkit-status-attention .ovkit-status-icon { background: #16181b; color: var(--ovkit-card); }

/* Dashboard: presets and links as rows inside one steel panel box */
.ovkit-wrap .ovkit-preset-grid, .ovkit-wrap .ovkit-dashboard-nav {
    background: #c9ced3; border-radius: 6px; padding: 12px; gap: 8px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55), 0 24px 40px -30px rgba(22, 24, 27, 0.6);
}
.ovkit-wrap .ovkit-preset-btn, .ovkit-wrap .ovkit-nav-card { box-shadow: 0 1px 1px rgba(22, 24, 27, 0.18); border-color: transparent; border-radius: 3px; }
.ovkit-wrap .ovkit-preset-btn:hover, .ovkit-wrap .ovkit-nav-card:hover { transform: none; box-shadow: 0 0 0 2px #16181b; border-color: transparent; }
.ovkit-wrap .ovkit-presets h3 { border-bottom: 2px solid #16181b; padding-bottom: 8px; }

/* One panel title everywhere */
.ovkit-wrap .ovkit-scan-title, .ovkit-wrap .ovkit-log-panel h3 { font: 700 22px/1.1 var(--ovkit-cond); color: #16181b; }

/* Inputs and checkboxes as tape fields */
.ovkit-wrap input[type="text"], .ovkit-wrap input[type="url"], .ovkit-wrap input[type="number"], .ovkit-wrap input[type="email"], .ovkit-wrap input[type="search"], .ovkit-wrap textarea, .ovkit-wrap select { background: #fafaf6; border-width: 2px; }
.ovkit-wrap input[type="checkbox"] { width: 18px; height: 18px; border: 2px solid #16181b; border-radius: 2px; background: #fafaf6; box-shadow: none; }
.ovkit-wrap input[type="checkbox"]:checked::before { filter: brightness(0); }

/* Activity log */
.ovkit-wrap .ovkit-log-count { font: 700 11px/1 var(--ovkit-cond); letter-spacing: 0.06em; text-transform: uppercase; background: var(--ovkit-card); color: #16181b; border-radius: 2px; padding: 4px 6px 3px; box-shadow: 0 0 0 1px var(--ovkit-seam); }
.ovkit-wrap .ovkit-rollback { margin-left: auto; }
.ovkit-wrap .ovkit-rollback:hover { background: #16181b; color: var(--ovkit-card); border-color: #16181b; }

/* Small controls meet the 24px target */
.ovkit-wrap .ovkit-health-btn, .ovkit-wrap .ovkit-btn-small { font-size: 13px; min-height: 28px; text-decoration: none; padding: 5px 10px; }
.ovkit-sticky-footer { margin: 16px 0 0 !important; width: 100% !important; }

@media (max-width: 782px) {
    .ovkit-wrap select, .ovkit-wrap input[type="text"], .ovkit-wrap input[type="url"], .ovkit-wrap input[type="number"] { width: 100%; max-width: 100%; font-size: 16px; }
    .ovkit-wrap .ovkit-tabs { -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
}

/* Stamps (Security Check): shape carries the severity */
.ovkit-wrap .ovkit-stamp { display: inline-block; font: 700 12px/1 var(--ovkit-cond); letter-spacing: 0.08em; text-transform: uppercase; padding: 4px 7px 3px; border-radius: 2px; color: #16181b; }
.ovkit-wrap .ovkit-stamp-problem { background: #16181b; color: var(--ovkit-card); }
.ovkit-wrap .ovkit-stamp-warning { box-shadow: inset 0 0 0 2px #16181b; }
.ovkit-wrap .ovkit-stamp-ok { color: var(--ovkit-dim); }
/* Pro settings: each form-table section sits on a paper panel */
.ovkit-wrap.ovkit-pro-screen .form-table { background: var(--ovkit-card); border: 1px solid var(--ovkit-border); border-radius: var(--ovkit-radius); box-shadow: 0 18px 32px -26px rgba(22, 24, 27, 0.55); }
.ovkit-wrap.ovkit-pro-screen .form-table th { padding-left: 16px; font-family: var(--ovkit-cond); font-size: 16px; color: #16181b; }
.ovkit-wrap.ovkit-pro-screen h2 { font: 700 22px/1.1 var(--ovkit-cond); color: #16181b; border-bottom: 2px solid #16181b; padding-bottom: 6px; }

.ovkit-wrap hr.wp-header-end { border: 0; margin: 0; }