/* =========================================================
   ICON BALI DIGITAL
   SECURITY DECK — PRODUCT BODY
   Scoped to body[data-product="secdeck"].
   Header/footer remain controlled by existing shared runtime.
   ========================================================= */

body[data-product="secdeck"] .secdeck-hero-grid {
    display: grid;
    grid-template-columns: minmax(280px, .82fr) minmax(520px, 1.45fr);
    gap: 28px;
    align-items: stretch;
    margin-top: 34px;
}

body[data-product="secdeck"] .secdeck-hero-summary {
    display: grid;
    gap: 12px;
}

body[data-product="secdeck"] .secdeck-summary-card,
body[data-product="secdeck"] .secdeck-scanner-card,
body[data-product="secdeck"] .secdeck-value-card,
body[data-product="secdeck"] .secdeck-flow-card,
body[data-product="secdeck"] .secdeck-dashboard {
    background: rgba(3, 29, 45, .58);
    border: 1px solid rgba(92, 211, 232, .34);
    box-shadow: 0 18px 42px rgba(0, 0, 0, .15);
    backdrop-filter: blur(10px);
}

body[data-product="secdeck"] .secdeck-summary-card {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 18px;
    border-radius: 16px;
}

body[data-product="secdeck"] .secdeck-summary-card > i {
    flex: 0 0 auto;
    font-size: 1.45rem;
    color: #51dff2;
}

body[data-product="secdeck"] .secdeck-summary-card strong,
body[data-product="secdeck"] .secdeck-summary-card span {
    display: block;
}

body[data-product="secdeck"] .secdeck-summary-card strong {
    margin-bottom: 5px;
    color: #f3fbff;
}

body[data-product="secdeck"] .secdeck-summary-card span {
    color: rgba(224, 241, 247, .7);
    font-size: .9rem;
    line-height: 1.5;
}

body[data-product="secdeck"] .secdeck-dashboard {
    border-radius: 20px;
    padding: 18px;
}

body[data-product="secdeck"] .secdeck-dashboard-head {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: center;
    margin-bottom: 14px;
    color: #f2fbff;
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .06em;
}

body[data-product="secdeck"] .secdeck-dashboard-period {
    color: #7bddec;
    font-size: .7rem;
    font-weight: 600;
}

body[data-product="secdeck"] .secdeck-metric-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

body[data-product="secdeck"] .secdeck-metric {
    min-height: 84px;
    padding: 13px;
    border-radius: 12px;
    border: 1px solid rgba(92, 211, 232, .18);
    background: rgba(4, 39, 58, .55);
}

body[data-product="secdeck"] .secdeck-metric span,
body[data-product="secdeck"] .secdeck-metric strong {
    display: block;
}

body[data-product="secdeck"] .secdeck-metric span {
    color: rgba(222, 240, 246, .62);
    font-size: .72rem;
    margin-bottom: 9px;
}

body[data-product="secdeck"] .secdeck-metric strong {
    color: #effbff;
    font-size: 1rem;
}

body[data-product="secdeck"] .secdeck-metric-new strong {
    color: #ff8484;
}

body[data-product="secdeck"] .secdeck-dashboard-panels {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-top: 10px;
}

body[data-product="secdeck"] .secdeck-panel {
    min-height: 176px;
    padding: 14px;
    border-radius: 14px;
    border: 1px solid rgba(92, 211, 232, .18);
    background: rgba(2, 25, 40, .48);
}

body[data-product="secdeck"] .secdeck-panel-title {
    color: #f0fbff;
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .05em;
    margin-bottom: 14px;
}

body[data-product="secdeck"] .secdeck-trend {
    position: relative;
    height: 88px;
    overflow: hidden;
    border-bottom: 1px solid rgba(130, 217, 232, .16);
    background:
        linear-gradient(to bottom, transparent 32%, rgba(130,217,232,.08) 33%, transparent 34%),
        linear-gradient(to bottom, transparent 65%, rgba(130,217,232,.08) 66%, transparent 67%);
}

body[data-product="secdeck"] .secdeck-trend-line {
    position: absolute;
    left: 4%;
    width: 92%;
    height: 2px;
    transform-origin: left center;
    border-radius: 999px;
}

body[data-product="secdeck"] .trend-open {
    top: 30px;
    background: linear-gradient(90deg, #ff7474, #ff9f6d);
    transform: rotate(4deg);
}

body[data-product="secdeck"] .trend-closed {
    top: 56px;
    background: linear-gradient(90deg, #47d9e8, #5fe39a);
    transform: rotate(-6deg);
}

body[data-product="secdeck"] .trend-new {
    top: 72px;
    width: 68%;
    background: linear-gradient(90deg, #ffc857, #ff8f47);
    transform: rotate(7deg);
}

body[data-product="secdeck"] .secdeck-legend {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    margin-top: 12px;
    color: rgba(224, 241, 247, .66);
    font-size: .7rem;
}

body[data-product="secdeck"] .dot {
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    margin-right: 5px;
}

body[data-product="secdeck"] .dot-open { background: #ff7474; }
body[data-product="secdeck"] .dot-closed { background: #55dda5; }
body[data-product="secdeck"] .dot-new { background: #ffc857; }

body[data-product="secdeck"] .secdeck-map-flow {
    display: grid;
    grid-template-columns: 1fr auto 1.15fr auto 1fr;
    gap: 8px;
    align-items: center;
    min-height: 112px;
}

body[data-product="secdeck"] .secdeck-map-sources,
body[data-product="secdeck"] .secdeck-map-results {
    display: grid;
    gap: 6px;
}

body[data-product="secdeck"] .secdeck-map-sources span,
body[data-product="secdeck"] .secdeck-map-results span {
    display: block;
    padding: 6px 8px;
    border-radius: 8px;
    border: 1px solid rgba(92,211,232,.2);
    color: rgba(232, 247, 251, .78);
    font-size: .64rem;
    text-align: center;
}

body[data-product="secdeck"] .secdeck-map-engine {
    padding: 14px 8px;
    border-radius: 50%;
    aspect-ratio: 1;
    display: grid;
    place-content: center;
    text-align: center;
    border: 1px solid rgba(65, 221, 239, .6);
    color: #ecfbff;
    font-size: .72rem;
    line-height: 1.25;
    box-shadow: inset 0 0 24px rgba(25, 188, 214, .08);
}

body[data-product="secdeck"] .secdeck-map-engine small {
    color: #74ddea;
    font-size: .58rem;
}

body[data-product="secdeck"] .secdeck-map-flow > i {
    color: #42dcec;
}

body[data-product="secdeck"] .secdeck-compatibility,
body[data-product="secdeck"] .secdeck-value {
    padding: 72px 0;
}

body[data-product="secdeck"] .secdeck-scanner-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    max-width: 900px;
    margin: 28px auto 0;
}

body[data-product="secdeck"] .secdeck-scanner-card {
    min-height: 110px;
    border-radius: 16px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    padding: 22px;
    color: #f3fbff;
}

body[data-product="secdeck"] .secdeck-scanner-card i {
    color: #42dcec;
    font-size: 1.4rem;
}

body[data-product="secdeck"] .secdeck-feature-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

body[data-product="secdeck"] .secdeck-feature-grid .vdeck-card {
    height: 100%;
}

body[data-product="secdeck"] .secdeck-value-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-top: 28px;
}

body[data-product="secdeck"] .secdeck-value-card {
    border-radius: 18px;
    padding: 24px;
}

body[data-product="secdeck"] .secdeck-value-card > i {
    display: inline-grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 1px solid rgba(71, 223, 240, .42);
    color: #4bddeb;
    font-size: 1.35rem;
    margin-bottom: 14px;
}

body[data-product="secdeck"] .secdeck-value-card h3 {
    color: #f4fbff;
    margin: 0 0 10px;
    font-size: 1.08rem;
}

body[data-product="secdeck"] .secdeck-value-card p {
    margin: 0;
    color: rgba(224, 241, 247, .72);
    line-height: 1.65;
}

body[data-product="secdeck"] .secdeck-flow {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);
    gap: 12px;
    align-items: stretch;
    margin-top: 30px;
}

body[data-product="secdeck"] .secdeck-flow-card {
    min-height: 210px;
    border-radius: 18px;
    padding: 22px;
    text-align: center;
}

body[data-product="secdeck"] .secdeck-flow-card > i {
    color: #4bddeb;
    font-size: 2rem;
    display: block;
    margin-bottom: 14px;
}

body[data-product="secdeck"] .secdeck-flow-card h3 {
    color: #f3fbff;
    font-size: 1rem;
    margin: 0 0 10px;
}

body[data-product="secdeck"] .secdeck-flow-card p {
    color: rgba(224, 241, 247, .7);
    font-size: .84rem;
    line-height: 1.6;
    margin: 0;
}

body[data-product="secdeck"] .secdeck-flow-arrow {
    align-self: center;
    color: #47ddea;
    font-size: 1.55rem;
}

@media (max-width: 1100px) {
    body[data-product="secdeck"] .secdeck-hero-grid {
        grid-template-columns: 1fr;
    }

    body[data-product="secdeck"] .secdeck-feature-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body[data-product="secdeck"] .secdeck-flow {
        grid-template-columns: 1fr;
    }

    body[data-product="secdeck"] .secdeck-flow-arrow {
        transform: rotate(90deg);
        justify-self: center;
    }
}

@media (max-width: 720px) {
    body[data-product="secdeck"] .secdeck-dashboard-panels,
    body[data-product="secdeck"] .secdeck-value-grid,
    body[data-product="secdeck"] .secdeck-scanner-grid,
    body[data-product="secdeck"] .secdeck-feature-grid {
        grid-template-columns: 1fr;
    }

    body[data-product="secdeck"] .secdeck-metric-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body[data-product="secdeck"] .secdeck-dashboard-head {
        align-items: flex-start;
        flex-direction: column;
    }

    body[data-product="secdeck"] .secdeck-map-flow {
        grid-template-columns: 1fr;
    }

    body[data-product="secdeck"] .secdeck-map-flow > i {
        transform: rotate(90deg);
        justify-self: center;
    }

    body[data-product="secdeck"] .secdeck-map-engine {
        width: 112px;
        justify-self: center;
    }
}

/* SECURITY DECK R18.6 FINAL MARKER */


/* =========================================================
   SECURITY DECK R18.6-C1 — REAL PRODUCT INSPIRED PREVIEW
   Based on current SecDeck dashboard/report/compare workflow.
   ========================================================= */

body[data-product="secdeck"] .secdeck-real-preview {
    padding: 18px;
}

body[data-product="secdeck"] .secdeck-real-preview .secdeck-dashboard-head > div {
    display: grid;
    gap: 4px;
}

body[data-product="secdeck"] .secdeck-real-preview .secdeck-dashboard-head strong {
    color: #f4fbff;
    font-size: 1rem;
}

body[data-product="secdeck"] .secdeck-kicker {
    color: #54ddeb;
    font-size: .64rem;
    font-weight: 800;
    letter-spacing: .12em;
}

body[data-product="secdeck"] .secdeck-filter-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    padding: 10px;
    margin-bottom: 10px;
    border-radius: 10px;
    background: rgba(8, 49, 69, .48);
    border: 1px solid rgba(94, 211, 232, .15);
}

body[data-product="secdeck"] .secdeck-filter-strip span {
    min-height: 32px;
    display: flex;
    align-items: center;
    padding: 0 9px;
    border-radius: 7px;
    background: rgba(236, 248, 252, .06);
    border: 1px solid rgba(195, 235, 243, .11);
    color: rgba(224, 241, 247, .62);
    font-size: .64rem;
}

body[data-product="secdeck"] .secdeck-real-metrics .secdeck-metric strong {
    font-size: 1.25rem;
}

body[data-product="secdeck"] .secdeck-real-panels {
    grid-template-columns: 1.18fr .82fr;
}

body[data-product="secdeck"] .secdeck-exec-panel,
body[data-product="secdeck"] .secdeck-compare-panel {
    min-height: 205px;
}

body[data-product="secdeck"] .secdeck-status-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 7px;
    margin-bottom: 14px;
}

body[data-product="secdeck"] .secdeck-status-row > div,
body[data-product="secdeck"] .secdeck-compare-list > div {
    border-radius: 9px;
    border: 1px solid rgba(104, 205, 226, .15);
    background: rgba(242, 249, 252, .045);
    padding: 9px;
}

body[data-product="secdeck"] .secdeck-status-row span,
body[data-product="secdeck"] .secdeck-compare-list span {
    display: block;
    color: rgba(224, 241, 247, .58);
    font-size: .58rem;
    margin-bottom: 5px;
}

body[data-product="secdeck"] .secdeck-status-row strong,
body[data-product="secdeck"] .secdeck-compare-list strong {
    color: #f2fbff;
    font-size: .92rem;
}

body[data-product="secdeck"] .secdeck-status-row > div:nth-child(2) strong {
    color: #69e59d;
}

body[data-product="secdeck"] .secdeck-status-row > div:nth-child(4) strong {
    color: #ff9b63;
}

body[data-product="secdeck"] .secdeck-mini-chart {
    position: relative;
    height: 70px;
    overflow: hidden;
    border-bottom: 1px solid rgba(130, 217, 232, .14);
    background:
        linear-gradient(to bottom, transparent 32%, rgba(130,217,232,.06) 33%, transparent 34%),
        linear-gradient(to bottom, transparent 65%, rgba(130,217,232,.06) 66%, transparent 67%);
}

body[data-product="secdeck"] .secdeck-chart-line {
    position: absolute;
    left: 5%;
    height: 2px;
    border-radius: 999px;
    transform-origin: left center;
}

body[data-product="secdeck"] .line-s5 {
    width: 78%;
    top: 21px;
    background: #d34d4d;
    transform: rotate(8deg);
}

body[data-product="secdeck"] .line-s4 {
    width: 84%;
    top: 31px;
    background: #ff7043;
    transform: rotate(12deg);
}

body[data-product="secdeck"] .line-s3 {
    width: 88%;
    top: 42px;
    background: #ff9d4d;
    transform: rotate(15deg);
}

body[data-product="secdeck"] .secdeck-chart-legend {
    display: flex;
    gap: 13px;
    flex-wrap: wrap;
    margin-top: 10px;
    font-size: .6rem;
    color: rgba(224, 241, 247, .62);
}

body[data-product="secdeck"] .sev {
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    margin-right: 5px;
}

body[data-product="secdeck"] .sev5 { background: #d34d4d; }
body[data-product="secdeck"] .sev4 { background: #ff7043; }
body[data-product="secdeck"] .sev3 { background: #ff9d4d; }

body[data-product="secdeck"] .secdeck-compare-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    margin-bottom: 13px;
}

body[data-product="secdeck"] .secdeck-findings-bars {
    display: grid;
    gap: 9px;
}

body[data-product="secdeck"] .secdeck-findings-bars span {
    display: grid;
    grid-template-columns: 70px minmax(0,1fr);
    gap: 8px;
    align-items: center;
}

body[data-product="secdeck"] .secdeck-findings-bars b {
    color: rgba(224, 241, 247, .68);
    font-size: .58rem;
    font-weight: 600;
}

body[data-product="secdeck"] .secdeck-findings-bars i {
    position: relative;
    display: block;
    height: 8px;
    border-radius: 999px;
    background: rgba(241, 248, 251, .06);
    overflow: hidden;
}

body[data-product="secdeck"] .secdeck-findings-bars i::after {
    content: "";
    display: block;
    width: var(--w);
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #d64c4c, #ff8e46);
}

body[data-product="secdeck"] .secdeck-preview-caption {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 12px;
    padding-top: 11px;
    border-top: 1px solid rgba(111, 211, 230, .12);
    color: rgba(224, 241, 247, .55);
    font-size: .64rem;
    line-height: 1.45;
}

body[data-product="secdeck"] .secdeck-preview-caption i {
    color: #55dce9;
    flex: 0 0 auto;
}

@media (max-width: 720px) {
    body[data-product="secdeck"] .secdeck-filter-strip,
    body[data-product="secdeck"] .secdeck-status-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body[data-product="secdeck"] .secdeck-real-panels {
        grid-template-columns: 1fr;
    }
}

/* SECURITY DECK R18.6-C1 FINAL MARKER */

/* =========================================================
   SECURITY DECK R18.6-C2 — VISUAL ANALYTICS PREVIEW
   ========================================================= */
body[data-product="secdeck"] .secdeck-visual-preview{padding:18px}
body[data-product="secdeck"] .secdeck-visual-grid{display:grid;gap:14px}
body[data-product="secdeck"] .secdeck-visual-grid-main,body[data-product="secdeck"] .secdeck-visual-grid-secondary{grid-template-columns:repeat(2,minmax(0,1fr))}
body[data-product="secdeck"] .secdeck-chart-card,body[data-product="secdeck"] .secdeck-ratio-card{border-radius:15px;border:1px solid rgba(97,209,230,.18);background:rgba(241,249,252,.055);padding:14px}
body[data-product="secdeck"] .secdeck-chart-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}
body[data-product="secdeck"] .secdeck-chart-card-head>div{display:grid;gap:4px}
body[data-product="secdeck"] .secdeck-chart-card-head strong{color:#f3fbff;font-size:.84rem}
body[data-product="secdeck"] .secdeck-chart-card-head span:not(.secdeck-chart-badge){color:rgba(224,241,247,.55);font-size:.62rem;line-height:1.35}
body[data-product="secdeck"] .secdeck-chart-badge{flex:0 0 auto;padding:5px 8px;border-radius:999px;border:1px solid rgba(99,215,234,.22);background:rgba(3,28,43,.45);color:#dff7fb;font-size:.58rem;font-weight:700}
body[data-product="secdeck"] .secdeck-line-chart{display:block;width:100%;height:auto;overflow:visible}
body[data-product="secdeck"] .chart-grid line{stroke:rgba(177,226,236,.10);stroke-width:1}
body[data-product="secdeck"] .chart-line{fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
body[data-product="secdeck"] .chart-line.severity-5,body[data-product="secdeck"] .chart-point.severity-5{stroke:#b93434;fill:#b93434}
body[data-product="secdeck"] .chart-line.severity-4,body[data-product="secdeck"] .chart-point.severity-4{stroke:#ef3f3f;fill:#ef3f3f}
body[data-product="secdeck"] .chart-line.severity-3,body[data-product="secdeck"] .chart-point.severity-3{stroke:#ff731c;fill:#ff731c}
body[data-product="secdeck"] .chart-value-labels text{fill:rgba(236,248,251,.82);font-size:9px;font-weight:700}
body[data-product="secdeck"] .chart-axis-labels text{fill:rgba(218,238,244,.48);font-size:9px}
body[data-product="secdeck"] .secdeck-ratio-card{margin:14px 0}
body[data-product="secdeck"] .secdeck-ratio-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
body[data-product="secdeck"] .secdeck-ratio-item{padding:12px;border-radius:12px;border:1px solid rgba(97,209,230,.15);background:rgba(3,28,43,.28)}
body[data-product="secdeck"] .secdeck-ratio-date{display:flex;justify-content:space-between;gap:8px;margin-bottom:12px}
body[data-product="secdeck"] .secdeck-ratio-date strong{color:#f2fbff;font-size:.7rem}
body[data-product="secdeck"] .secdeck-ratio-date span{color:rgba(224,241,247,.58);font-size:.6rem;font-weight:700}
body[data-product="secdeck"] .secdeck-ratio-content{display:grid;grid-template-columns:88px 1fr;gap:12px;align-items:center}
body[data-product="secdeck"] .secdeck-donut{width:82px;height:82px;border-radius:50%;display:grid;place-items:center;position:relative}
body[data-product="secdeck"] .secdeck-donut::after{content:"";position:absolute;inset:15px;border-radius:50%;background:#09283a}
body[data-product="secdeck"] .secdeck-donut span{position:relative;z-index:1;display:grid;text-align:center;color:#f3fbff}
body[data-product="secdeck"] .secdeck-donut b{font-size:.78rem}
body[data-product="secdeck"] .secdeck-donut small{color:rgba(224,241,247,.55);font-size:.45rem;text-transform:uppercase}
body[data-product="secdeck"] .donut-0{background:conic-gradient(#1ca65b 0 0%,#e52b2b 0 100%)}
body[data-product="secdeck"] .donut-63{background:conic-gradient(#1ca65b 0 63%,#e52b2b 63% 100%)}
body[data-product="secdeck"] .donut-38{background:conic-gradient(#1ca65b 0 38%,#e52b2b 38% 100%)}
body[data-product="secdeck"] .secdeck-ratio-values{display:grid;gap:8px}
body[data-product="secdeck"] .secdeck-ratio-values span{display:grid;grid-template-columns:8px 1fr auto;gap:6px;align-items:center;color:rgba(224,241,247,.66);font-size:.58rem}
body[data-product="secdeck"] .secdeck-ratio-values b{color:#f1fbff;font-size:.62rem}
body[data-product="secdeck"] .secdeck-ratio-values i{width:7px;height:7px;border-radius:2px}
body[data-product="secdeck"] .ratio-open{background:#e52b2b}
body[data-product="secdeck"] .ratio-closed{background:#1ca65b}
body[data-product="secdeck"] .secdeck-line-chart-compact{max-height:170px}
@media(max-width:980px){body[data-product="secdeck"] .secdeck-ratio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){body[data-product="secdeck"] .secdeck-visual-grid-main,body[data-product="secdeck"] .secdeck-visual-grid-secondary,body[data-product="secdeck"] .secdeck-ratio-grid{grid-template-columns:1fr}body[data-product="secdeck"] .secdeck-ratio-content{grid-template-columns:82px 1fr}body[data-product="secdeck"] .secdeck-chart-card{overflow:hidden}}
/* SECURITY DECK R18.6-C2 FINAL MARKER */


/* =========================================================
   SECURITY DECK R18.6-C3 — CLEAN ANALYTICS REFINEMENT
   ========================================================= */

/* Simple line charts: no filled/coverage areas. */
body[data-product="secdeck"] .secdeck-line-chart .chart-line {
    fill: none !important;
    stroke-width: 1.7 !important;
    stroke-linecap: round;
    stroke-linejoin: round;
}

body[data-product="secdeck"] .secdeck-line-chart .chart-point {
    fill: none !important;
    stroke: none !important;
}

body[data-product="secdeck"] .secdeck-line-chart .chart-point circle {
    stroke: none !important;
}

body[data-product="secdeck"] .secdeck-line-chart .chart-point.severity-5 circle {
    fill: #c73a3a !important;
}

body[data-product="secdeck"] .secdeck-line-chart .chart-point.severity-4 circle {
    fill: #ef4a43 !important;
}

body[data-product="secdeck"] .secdeck-line-chart .chart-point.severity-3 circle {
    fill: #ff7a21 !important;
}

body[data-product="secdeck"] .secdeck-line-chart .chart-line.severity-5 {
    stroke: #c73a3a !important;
}

body[data-product="secdeck"] .secdeck-line-chart .chart-line.severity-4 {
    stroke: #ef4a43 !important;
}

body[data-product="secdeck"] .secdeck-line-chart .chart-line.severity-3 {
    stroke: #ff7a21 !important;
}

/* More breathing room for trend cards. */
body[data-product="secdeck"] .secdeck-chart-card {
    padding: 16px;
}

body[data-product="secdeck"] .secdeck-line-chart {
    margin-top: 4px;
}

/* Three ratio cards fit the panel naturally without crowding. */
body[data-product="secdeck"] .secdeck-ratio-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    max-width: 860px;
    margin-inline: auto;
}

body[data-product="secdeck"] .secdeck-ratio-item {
    min-width: 0;
    padding: 14px;
}

body[data-product="secdeck"] .secdeck-ratio-content {
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 14px;
}

body[data-product="secdeck"] .secdeck-donut {
    width: 86px;
    height: 86px;
}

/* Left explanatory cards now support short explanatory copy. */
body[data-product="secdeck"] .secdeck-summary-card {
    min-height: 150px;
}

body[data-product="secdeck"] .secdeck-summary-card strong {
    font-size: 1rem;
    line-height: 1.35;
}

body[data-product="secdeck"] .secdeck-summary-card span {
    max-width: 36ch;
    margin-top: 8px;
    line-height: 1.6;
}

/* Keep responsive behavior clean. */
@media (max-width: 980px) {
    body[data-product="secdeck"] .secdeck-ratio-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        max-width: none;
    }
}

@media (max-width: 760px) {
    body[data-product="secdeck"] .secdeck-ratio-grid {
        grid-template-columns: 1fr !important;
    }

    body[data-product="secdeck"] .secdeck-summary-card {
        min-height: 0;
    }
}

/* SECURITY DECK R18.6-C3 FINAL MARKER */


/* =========================================================
   SECURITY DECK R18.6-C4 — LAYOUT + EXPLANATION REFINEMENT
   ========================================================= */

/* Keep Open/Closed trends as approved, then ratio in one horizontal row,
   followed by New/Reopened trends underneath. */
body[data-product="secdeck"] .secdeck-ratio-card-singleline {
    width: 100%;
    margin: 14px 0;
}

body[data-product="secdeck"] .secdeck-ratio-grid-singleline {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
    max-width: none !important;
    margin: 0 !important;
}

body[data-product="secdeck"] .secdeck-ratio-grid-singleline .secdeck-ratio-item {
    display: flex;
    flex-direction: column;
    min-height: 142px;
}

body[data-product="secdeck"] .secdeck-ratio-grid-singleline .secdeck-ratio-content {
    grid-template-columns: 86px minmax(0, 1fr) !important;
    align-items: center;
}

/* Keep secondary charts under Ratio section at full right-column width. */
body[data-product="secdeck"] .secdeck-visual-grid-secondary {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
    width: 100%;
    margin-top: 14px;
}

body[data-product="secdeck"] .secdeck-visual-grid-secondary .secdeck-chart-card {
    width: 100%;
    min-width: 0;
}

/* Left narrative cards: concise enterprise explanations aligned to charts. */
body[data-product="secdeck"] .secdeck-summary-card {
    min-height: 0 !important;
    padding: 20px !important;
}

body[data-product="secdeck"] .secdeck-summary-card strong {
    font-size: 1rem !important;
    line-height: 1.35 !important;
}

body[data-product="secdeck"] .secdeck-summary-card span {
    max-width: 42ch !important;
    margin-top: 8px !important;
    font-size: .88rem !important;
    line-height: 1.65 !important;
}

@media (max-width: 900px) {
    body[data-product="secdeck"] .secdeck-ratio-grid-singleline {
        grid-template-columns: 1fr !important;
    }
    body[data-product="secdeck"] .secdeck-visual-grid-secondary {
        grid-template-columns: 1fr !important;
    }
}

/* SECURITY DECK R18.6-C4 FINAL MARKER */

/* SECURITY DECK R18.7 EXPLANATION TITLE */
body[data-product="secdeck"] .secdeck-summary-card .secdeck-explain-title {
    font-size: 1.2rem !important;
    line-height: 1.35 !important;
    margin: 0 0 10px !important;
    color: #f3fbff !important;
}
/* SECURITY DECK R18.7 FINAL MARKER */


/* =========================================================
   SECURITY DECK R18.8 — HERO / FEATURE CLEANUP
   ========================================================= */

body[data-product="secdeck"] .secdeck-hero .hero-logo-centered {
    margin-top: 18px;
    margin-bottom: 14px;
}

/* SECURITY DECK R18.8 FINAL MARKER */


/* =========================================================
   SECURITY DECK R18.12 — ANALYTICS EXPLANATION ALIGNMENT
   ========================================================= */
body[data-product="secdeck"] .secdeck-summary-card {
    text-align: left !important;
}
body[data-product="secdeck"] .secdeck-summary-card .secdeck-explain-title,
body[data-product="secdeck"] .secdeck-summary-card p,
body[data-product="secdeck"] .secdeck-summary-card span {
    text-align: left !important;
}
body[data-product="secdeck"] .secdeck-summary-card span {
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: none !important;
}
/* SECURITY DECK R18.12 FINAL MARKER */