{"id":671,"date":"2026-02-11T15:05:06","date_gmt":"2026-02-11T15:05:06","guid":{"rendered":"https:\/\/www.opey.org\/opeyit\/?page_id=671"},"modified":"2026-02-13T11:51:48","modified_gmt":"2026-02-13T11:51:48","slug":"executive-risk-matrix","status":"publish","type":"page","link":"https:\/\/www.opey.org\/opeyit\/?page_id=671","title":{"rendered":"Executive Risk Matrix"},"content":{"rendered":"\n\n<div id=\"wcf-risk-matrix\">\n\n<style>\n#wcf-risk-matrix { font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, sans-serif; color: #2d3748; line-height: 1.6; background: #0f172a; min-height: 100vh; }\n#wcf-risk-matrix * { box-sizing: border-box; }\n@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }\n\n\/* HERO *\/\n#wcf-risk-matrix .wcf-hero { background: linear-gradient(145deg, #0f172a 0%, #1e293b 40%, #312e81 100%); padding: 50px 20px; text-align: center; }\n#wcf-risk-matrix .wcf-hero-inner { max-width: 1000px; margin: 0 auto; }\n#wcf-risk-matrix .wcf-dashboard-icon { margin-bottom: 16px; display: flex; justify-content: center; align-items: center; }\n#wcf-risk-matrix .wcf-dashboard-icon svg { width: 48px; height: 48px; }\n#wcf-risk-matrix .wcf-label { color: #a78bfa; font-size: 11px; font-weight: 700; letter-spacing: 3px; text-transform: uppercase; margin-bottom: 12px; display: block; }\n#wcf-risk-matrix .wcf-title { color: #fff; font-size: 40px; font-weight: 800; margin: 0 0 12px; line-height: 1.1; }\n#wcf-risk-matrix .wcf-subtitle { color: rgba(255,255,255,0.9); font-size: 18px; margin: 0 0 16px; }\n#wcf-risk-matrix .wcf-hero-desc { color: rgba(255,255,255,0.7); font-size: 14px; max-width: 600px; margin: 0 auto 20px; }\n#wcf-risk-matrix .wcf-live-badge { display: inline-block; background: #a78bfa; color: #0f172a; padding: 4px 12px; border-radius: 20px; font-size: 10px; font-weight: 700; text-transform: uppercase; animation: pulse 2s infinite; }\n#wcf-risk-matrix .wcf-back-link { display: inline-flex; align-items: center; gap: 8px; color: rgba(255,255,255,0.6); font-size: 13px; text-decoration: none; margin-top: 20px; transition: color 0.2s; }\n#wcf-risk-matrix .wcf-back-link:hover { color: #fff; }\n\n\/* DATA STATUS *\/\n#wcf-risk-matrix .wcf-data-status { background: rgba(254, 243, 199, 0.1); border: 1px solid rgba(245, 158, 11, 0.3); padding: 12px 20px; border-radius: 8px; margin: 20px auto; max-width: 600px; color: #fbbf24; font-size: 13px; display: none; }\n#wcf-risk-matrix .wcf-data-status.visible { display: block; }\n#wcf-risk-matrix .wcf-data-status.error { background: rgba(254, 202, 202, 0.1); border-color: rgba(220, 38, 38, 0.3); color: #f87171; }\n\n\/* KPI BAR *\/\n#wcf-risk-matrix .wcf-kpi-bar { background: #0f172a; padding: 24px 20px; border-bottom: 4px solid #7c3aed; }\n#wcf-risk-matrix .wcf-kpi-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }\n#wcf-risk-matrix .wcf-kpi { background: rgba(255,255,255,0.05); border-radius: 12px; padding: 18px; border: 1px solid rgba(255,255,255,0.1); position: relative; overflow: hidden; }\n#wcf-risk-matrix .wcf-kpi::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; }\n#wcf-risk-matrix .wcf-kpi.red::before { background: #dc2626; }\n#wcf-risk-matrix .wcf-kpi.orange::before { background: #ea580c; }\n#wcf-risk-matrix .wcf-kpi.yellow::before { background: #f59e0b; }\n#wcf-risk-matrix .wcf-kpi.green::before { background: #22c55e; }\n#wcf-risk-matrix .wcf-kpi.purple::before { background: #a78bfa; }\n#wcf-risk-matrix .wcf-kpi-label { font-size: 10px; color: rgba(255,255,255,0.5); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 6px; }\n#wcf-risk-matrix .wcf-kpi-value { font-size: 28px; font-weight: 800; line-height: 1; }\n#wcf-risk-matrix .wcf-kpi.red .wcf-kpi-value { color: #f87171; }\n#wcf-risk-matrix .wcf-kpi.orange .wcf-kpi-value { color: #fb923c; }\n#wcf-risk-matrix .wcf-kpi.yellow .wcf-kpi-value { color: #fbbf24; }\n#wcf-risk-matrix .wcf-kpi.green .wcf-kpi-value { color: #4ade80; }\n#wcf-risk-matrix .wcf-kpi.purple .wcf-kpi-value { color: #c4b5fd; }\n#wcf-risk-matrix .wcf-kpi-delta { font-size: 11px; margin-top: 6px; color: rgba(255,255,255,0.4); }\n\n\/* YEAR FILTER *\/\n#wcf-risk-matrix .wcf-filter-section { background: #1e293b; padding: 20px; border-bottom: 1px solid rgba(255,255,255,0.1); }\n#wcf-risk-matrix .wcf-filter-inner { max-width: 1200px; margin: 0 auto; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }\n#wcf-risk-matrix .wcf-filter-label { font-size: 12px; font-weight: 600; color: rgba(255,255,255,0.6); text-transform: uppercase; letter-spacing: 1px; }\n#wcf-risk-matrix .wcf-year-btn { padding: 8px 16px; font-size: 13px; font-weight: 600; border-radius: 6px; cursor: pointer; border: 1px solid rgba(255,255,255,0.2); background: transparent; color: rgba(255,255,255,0.6); transition: all 0.2s; }\n#wcf-risk-matrix .wcf-year-btn:hover { border-color: #a78bfa; color: #a78bfa; }\n#wcf-risk-matrix .wcf-year-btn.active { background: #a78bfa; border-color: #a78bfa; color: #0f172a; }\n\n\/* MAIN CONTENT *\/\n#wcf-risk-matrix .wcf-main { padding: 30px 20px; }\n#wcf-risk-matrix .wcf-main-inner { max-width: 1200px; margin: 0 auto; }\n\n\/* CARDS *\/\n#wcf-risk-matrix .wcf-card { background: #1e293b; border-radius: 16px; border: 1px solid rgba(255,255,255,0.1); overflow: hidden; margin-bottom: 24px; }\n#wcf-risk-matrix .wcf-card-header { padding: 18px 24px; border-bottom: 1px solid rgba(255,255,255,0.1); display: flex; justify-content: space-between; align-items: center; }\n#wcf-risk-matrix .wcf-card-title { font-size: 18px; font-weight: 700; color: #fff; margin: 0; }\n#wcf-risk-matrix .wcf-card-subtitle { font-size: 12px; color: rgba(255,255,255,0.5); margin-top: 2px; }\n#wcf-risk-matrix .wcf-card-body { padding: 24px; }\n\n\/* ===== RISK MATRIX CHART ===== *\/\n#wcf-risk-matrix .wcf-matrix-chart { position: relative; width: 100%; height: 600px; background: linear-gradient(180deg, rgba(15,23,42,0.8) 0%, rgba(30,41,59,0.6) 100%); border-radius: 12px; overflow: hidden; }\n\n\/* Quadrant backgrounds - positioned dynamically via JS *\/\n#wcf-risk-matrix .wcf-quadrant { position: absolute; transition: all 0.3s ease; }\n#wcf-risk-matrix .wcf-quadrant.top-left { background: rgba(34, 197, 94, 0.05); border-right: 2px dashed rgba(148, 163, 184, 0.3); border-bottom: 2px dashed rgba(148, 163, 184, 0.3); }\n#wcf-risk-matrix .wcf-quadrant.top-right { background: rgba(239, 68, 68, 0.08); border-bottom: 2px dashed rgba(148, 163, 184, 0.3); }\n#wcf-risk-matrix .wcf-quadrant.bottom-left { background: rgba(59, 130, 246, 0.03); border-right: 2px dashed rgba(148, 163, 184, 0.3); }\n#wcf-risk-matrix .wcf-quadrant.bottom-right { background: rgba(245, 158, 11, 0.05); }\n\n\/* Quadrant labels - positioned dynamically via JS *\/\n#wcf-risk-matrix .wcf-quadrant-label { position: absolute; font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: 2px; opacity: 0.7; transition: all 0.3s ease; }\n#wcf-risk-matrix .wcf-quadrant-label .sub { font-size: 10px; font-weight: 400; opacity: 0.6; margin-top: 4px; letter-spacing: 0; text-transform: none; }\n#wcf-risk-matrix .wcf-quadrant-label.top-left { color: #22c55e; }\n#wcf-risk-matrix .wcf-quadrant-label.top-right { color: #ef4444; text-align: right; }\n#wcf-risk-matrix .wcf-quadrant-label.bottom-left { color: #3b82f6; }\n#wcf-risk-matrix .wcf-quadrant-label.bottom-right { color: #f59e0b; text-align: right; }\n\n\/* Axis labels *\/\n#wcf-risk-matrix .wcf-axis-label { position: absolute; font-size: 11px; color: #64748b; font-weight: 500; letter-spacing: 1px; }\n#wcf-risk-matrix .wcf-axis-label.x-axis { bottom: 8px; left: 50%; transform: translateX(-50%); }\n#wcf-risk-matrix .wcf-axis-label.y-axis { left: 8px; top: 50%; transform: translateY(-50%) rotate(-90deg); white-space: nowrap; }\n\n\/* Scale markers *\/\n#wcf-risk-matrix .wcf-scale-marker { position: absolute; font-size: 9px; color: #475569; }\n#wcf-risk-matrix .wcf-scale-marker.x { bottom: 24px; }\n#wcf-risk-matrix .wcf-scale-marker.y { left: 28px; }\n\n\/* Median indicator badges *\/\n#wcf-risk-matrix .wcf-median-badge { position: absolute; font-size: 8px; color: #94a3b8; background: rgba(15, 23, 42, 0.9); padding: 2px 6px; border-radius: 3px; z-index: 10; border: 1px solid rgba(148, 163, 184, 0.3); }\n#wcf-risk-matrix .wcf-median-badge.x-axis { transform: translateX(-50%); }\n#wcf-risk-matrix .wcf-median-badge.y-axis { transform: translateY(50%); }\n\n\/* Provider dots container *\/\n#wcf-risk-matrix .wcf-dots-container { position: absolute; top: 60px; left: 60px; right: 40px; bottom: 60px; }\n\n\/* Provider dot *\/\n#wcf-risk-matrix .wcf-provider-dot { position: absolute; border-radius: 50%; cursor: pointer; transition: transform 0.2s ease, box-shadow 0.2s ease; display: flex; align-items: center; justify-content: center; transform: translate(-50%, 50%); }\n#wcf-risk-matrix .wcf-provider-dot:hover { transform: translate(-50%, 50%) scale(1.15); z-index: 100; }\n#wcf-risk-matrix .wcf-provider-dot.glow { box-shadow: 0 0 30px currentColor, 0 0 60px currentColor; }\n#wcf-risk-matrix .wcf-provider-dot .wcf-dot-label { position: absolute; top: calc(100% + 6px); left: 50%; transform: translateX(-50%); font-size: 10px; color: #cbd5e1; font-weight: 500; white-space: nowrap; text-shadow: 0 2px 4px rgba(0,0,0,0.8); pointer-events: none; }\n\n\/* ===== INSIGHT BOXES ===== *\/\n#wcf-risk-matrix .wcf-insights-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 24px; }\n#wcf-risk-matrix .wcf-insight-box { background: linear-gradient(135deg, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0.02) 100%); border-radius: 10px; padding: 18px 24px; text-align: center; border: 1px solid rgba(255,255,255,0.1); }\n#wcf-risk-matrix .wcf-insight-box.critical { border-color: rgba(239, 68, 68, 0.3); background: linear-gradient(135deg, rgba(239, 68, 68, 0.15) 0%, rgba(239, 68, 68, 0.05) 100%); }\n#wcf-risk-matrix .wcf-insight-box.blackswan { border-color: rgba(245, 158, 11, 0.3); background: linear-gradient(135deg, rgba(245, 158, 11, 0.15) 0%, rgba(245, 158, 11, 0.05) 100%); }\n#wcf-risk-matrix .wcf-insight-box.ai { border-color: rgba(168, 85, 247, 0.3); background: linear-gradient(135deg, rgba(168, 85, 247, 0.15) 0%, rgba(168, 85, 247, 0.05) 100%); }\n#wcf-risk-matrix .wcf-insight-label { font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 6px; }\n#wcf-risk-matrix .wcf-insight-box.critical .wcf-insight-label { color: #ef4444; }\n#wcf-risk-matrix .wcf-insight-box.blackswan .wcf-insight-label { color: #f59e0b; }\n#wcf-risk-matrix .wcf-insight-box.ai .wcf-insight-label { color: #a855f7; }\n#wcf-risk-matrix .wcf-insight-title { font-size: 14px; font-weight: 600; color: #f8fafc; margin-bottom: 4px; }\n#wcf-risk-matrix .wcf-insight-stat { font-size: 12px; color: #94a3b8; }\n\n\/* ===== PROVIDER DETAIL TABLE ===== *\/\n#wcf-risk-matrix .wcf-provider-table { width: 100%; border-collapse: collapse; }\n#wcf-risk-matrix .wcf-provider-table th { text-align: left; padding: 12px 16px; font-size: 10px; text-transform: uppercase; letter-spacing: 1px; color: rgba(255,255,255,0.5); border-bottom: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.03); }\n#wcf-risk-matrix .wcf-provider-table td { padding: 14px 16px; font-size: 13px; color: rgba(255,255,255,0.8); border-bottom: 1px solid rgba(255,255,255,0.05); }\n#wcf-risk-matrix .wcf-provider-table tr:hover td { background: rgba(255,255,255,0.03); }\n#wcf-risk-matrix .wcf-provider-table .wcf-provider-cell { display: flex; align-items: center; gap: 10px; }\n#wcf-risk-matrix .wcf-provider-table .wcf-provider-dot-small { width: 12px; height: 12px; border-radius: 50%; flex-shrink: 0; }\n#wcf-risk-matrix .wcf-provider-table .wcf-quadrant-badge { display: inline-block; padding: 4px 10px; border-radius: 4px; font-size: 10px; font-weight: 600; text-transform: uppercase; }\n#wcf-risk-matrix .wcf-provider-table .wcf-quadrant-badge.critical-concern { background: rgba(239, 68, 68, 0.2); color: #f87171; }\n#wcf-risk-matrix .wcf-provider-table .wcf-quadrant-badge.operational-burden { background: rgba(34, 197, 94, 0.2); color: #4ade80; }\n#wcf-risk-matrix .wcf-provider-table .wcf-quadrant-badge.black-swan { background: rgba(245, 158, 11, 0.2); color: #fbbf24; }\n#wcf-risk-matrix .wcf-provider-table .wcf-quadrant-badge.relatively-stable { background: rgba(59, 130, 246, 0.2); color: #60a5fa; }\n#wcf-risk-matrix .wcf-cost-cell { color: #f87171; font-weight: 600; }\n\n\/* ===== TOOLTIP ===== *\/\n#wcf-risk-matrix .wcf-tooltip { position: fixed; background: linear-gradient(145deg, #1e293b 0%, #0f172a 100%); border: 1px solid rgba(167, 139, 250, 0.4); border-radius: 12px; padding: 0; min-width: 260px; max-width: 320px; box-shadow: 0 20px 60px rgba(0,0,0,0.6), 0 0 40px rgba(167, 139, 250, 0.1); z-index: 99999; pointer-events: none; opacity: 0; visibility: hidden; transition: opacity 0.2s ease, visibility 0.2s ease; overflow: hidden; }\n#wcf-risk-matrix .wcf-tooltip.visible { opacity: 1; visibility: visible; }\n#wcf-risk-matrix .wcf-tooltip-header { display: flex; justify-content: space-between; align-items: center; padding: 14px 16px; background: rgba(167, 139, 250, 0.1); border-bottom: 1px solid rgba(255,255,255,0.1); }\n#wcf-risk-matrix .wcf-tooltip-provider { font-weight: 700; font-size: 15px; color: #a78bfa; text-transform: uppercase; letter-spacing: 0.5px; }\n#wcf-risk-matrix .wcf-tooltip-quadrant { font-size: 10px; padding: 3px 8px; border-radius: 4px; font-weight: 600; }\n#wcf-risk-matrix .wcf-tooltip-body { padding: 14px 16px; }\n#wcf-risk-matrix .wcf-tooltip-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }\n#wcf-risk-matrix .wcf-tooltip-metric { text-align: center; padding: 10px; background: rgba(255,255,255,0.03); border-radius: 8px; }\n#wcf-risk-matrix .wcf-tooltip-metric-value { font-size: 20px; font-weight: 800; color: #f8fafc; }\n#wcf-risk-matrix .wcf-tooltip-metric-value.cost { color: #f87171; }\n#wcf-risk-matrix .wcf-tooltip-metric-label { font-size: 9px; color: rgba(255,255,255,0.4); text-transform: uppercase; letter-spacing: 0.5px; margin-top: 4px; }\n#wcf-risk-matrix .wcf-tooltip-footer { padding: 10px 16px; background: rgba(0,0,0,0.2); font-size: 10px; color: rgba(255,255,255,0.5); }\n\n\/* CTA SECTION *\/\n#wcf-risk-matrix .wcf-cta-section { background: linear-gradient(135deg, #4c1d95 0%, #7c3aed 50%, #0f172a 100%); padding: 50px 20px; margin-top: 30px; }\n#wcf-risk-matrix .wcf-cta-inner { max-width: 900px; margin: 0 auto; display: flex; align-items: center; gap: 40px; flex-wrap: wrap; }\n#wcf-risk-matrix .wcf-cta-content { flex: 1; min-width: 300px; }\n#wcf-risk-matrix .wcf-cta-label { display: inline-block; background: rgba(245, 158, 11, 0.2); color: #f59e0b; padding: 6px 14px; border-radius: 20px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 2px; margin-bottom: 16px; }\n#wcf-risk-matrix .wcf-cta-title { color: #fff; font-size: 32px; font-weight: 800; margin: 0 0 12px; line-height: 1.2; }\n#wcf-risk-matrix .wcf-cta-text { color: rgba(255,255,255,0.8); font-size: 15px; line-height: 1.7; margin: 0 0 24px; }\n#wcf-risk-matrix .wcf-cta-buttons { display: flex; gap: 16px; flex-wrap: wrap; }\n#wcf-risk-matrix .wcf-btn { display: inline-block; padding: 14px 28px; font-size: 14px; font-weight: 700; border-radius: 8px; text-decoration: none; transition: all 0.3s; }\n#wcf-risk-matrix .wcf-btn-primary { background: linear-gradient(135deg, #f59e0b, #d97706); color: #0f172a; }\n#wcf-risk-matrix .wcf-btn-primary:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(245, 158, 11, 0.4); }\n#wcf-risk-matrix .wcf-btn-outline { background: transparent; color: #fff; border: 2px solid rgba(255,255,255,0.3); }\n#wcf-risk-matrix .wcf-btn-outline:hover { border-color: #fff; background: rgba(255,255,255,0.1); }\n\n\/* FOOTER *\/\n#wcf-risk-matrix .wcf-footer { background: #0f172a; padding: 24px 20px; border-top: 1px solid rgba(255,255,255,0.1); }\n#wcf-risk-matrix .wcf-footer-inner { max-width: 1200px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; font-size: 12px; color: rgba(255,255,255,0.4); }\n#wcf-risk-matrix .wcf-footer a { color: #a78bfa; text-decoration: none; }\n#wcf-risk-matrix .wcf-footer a:hover { text-decoration: underline; }\n\n\/* LOADING *\/\n#wcf-risk-matrix .wcf-loading { text-align: center; padding: 60px 20px; color: rgba(255,255,255,0.6); }\n#wcf-risk-matrix .wcf-loading-spinner { width: 40px; height: 40px; border: 3px solid rgba(255,255,255,0.1); border-top-color: #a78bfa; border-radius: 50%; animation: spin 1s linear infinite; margin: 0 auto 16px; }\n@keyframes spin { to { transform: rotate(360deg); } }\n\n\/* ===== NEW RESPONSIVE RULES ===== *\/\n\/* Tablet *\/\n@media (max-width: 1024px) {\n    #wcf-risk-matrix .wcf-kpi-inner { grid-template-columns: repeat(3, 1fr); }\n    #wcf-risk-matrix .wcf-insights-row { grid-template-columns: 1fr 1fr; }\n}\n\n\/* Small tablet \/ large phone landscape *\/\n@media (max-width: 768px) {\n    #wcf-risk-matrix .wcf-title { font-size: 28px; }\n    #wcf-risk-matrix .wcf-subtitle { font-size: 16px; }\n    #wcf-risk-matrix .wcf-kpi-inner { grid-template-columns: repeat(2, 1fr); }\n    #wcf-risk-matrix .wcf-kpi-value { font-size: 22px; }\n    #wcf-risk-matrix .wcf-filter-inner { justify-content: center; }\n    #wcf-risk-matrix .wcf-matrix-chart { height: 450px; }\n    #wcf-risk-matrix .wcf-dots-container { top: 50px; left: 50px; right: 30px; bottom: 50px; }\n    #wcf-risk-matrix .wcf-quadrant-label { font-size: 10px; letter-spacing: 1px; }\n    #wcf-risk-matrix .wcf-quadrant-label .sub { display: none; }\n    #wcf-risk-matrix .wcf-insights-row { grid-template-columns: 1fr; }\n    #wcf-risk-matrix .wcf-cta-inner { flex-direction: column; text-align: center; }\n    #wcf-risk-matrix .wcf-cta-title { font-size: 26px; }\n    #wcf-risk-matrix .wcf-cta-buttons { justify-content: center; }\n    #wcf-risk-matrix .wcf-footer-inner { flex-direction: column; text-align: center; }\n    #wcf-risk-matrix .wcf-card-header { flex-direction: column; align-items: flex-start; }\n}\n\n\/* Phone portrait *\/\n@media (max-width: 480px) {\n    #wcf-risk-matrix .wcf-hero { padding: 30px 15px; }\n    #wcf-risk-matrix .wcf-title { font-size: 24px; }\n    #wcf-risk-matrix .wcf-subtitle { font-size: 14px; }\n    #wcf-risk-matrix .wcf-hero-desc { font-size: 12px; }\n    #wcf-risk-matrix .wcf-kpi-bar { padding: 16px 15px; }\n    #wcf-risk-matrix .wcf-kpi-inner { grid-template-columns: 1fr 1fr; gap: 10px; }\n    #wcf-risk-matrix .wcf-kpi { padding: 12px; }\n    #wcf-risk-matrix .wcf-kpi-value { font-size: 20px; }\n    #wcf-risk-matrix .wcf-kpi-label { font-size: 8px; }\n    #wcf-risk-matrix .wcf-kpi-delta { font-size: 9px; }\n    #wcf-risk-matrix .wcf-main { padding: 15px 10px; }\n    #wcf-risk-matrix .wcf-card-body { padding: 15px; }\n    #wcf-risk-matrix .wcf-matrix-chart { height: 350px; }\n    #wcf-risk-matrix .wcf-dots-container { top: 40px; left: 35px; right: 20px; bottom: 45px; }\n    #wcf-risk-matrix .wcf-quadrant-label { font-size: 8px; letter-spacing: 0.5px; }\n    #wcf-risk-matrix .wcf-axis-label { font-size: 8px; }\n    #wcf-risk-matrix .wcf-axis-label.y-axis { display: none; }\n    #wcf-risk-matrix .wcf-scale-marker { font-size: 7px; }\n    #wcf-risk-matrix .wcf-scale-marker.y { left: 20px; }\n    #wcf-risk-matrix .wcf-median-badge { display: none; }\n    #wcf-risk-matrix .wcf-provider-dot .wcf-dot-label { font-size: 7px; }\n    #wcf-risk-matrix .wcf-tooltip { max-width: 280px; min-width: 220px; }\n    #wcf-risk-matrix .wcf-cta-section { padding: 30px 15px; }\n    #wcf-risk-matrix .wcf-cta-title { font-size: 22px; }\n    #wcf-risk-matrix .wcf-cta-text { font-size: 13px; }\n    #wcf-risk-matrix .wcf-btn { padding: 12px 20px; font-size: 13px; }\n    \/* Make table horizontally scrollable *\/\n    #wcf-risk-matrix .wcf-card-body:has(.wcf-provider-table) { padding: 0; overflow-x: auto; -webkit-overflow-scrolling: touch; }\n    #wcf-risk-matrix .wcf-provider-table { min-width: 550px; }\n}\n\n\/* Very small phones *\/\n@media (max-width: 360px) {\n    #wcf-risk-matrix .wcf-matrix-chart { height: 300px; }\n    #wcf-risk-matrix .wcf-dots-container { top: 35px; left: 25px; right: 15px; bottom: 40px; }\n    #wcf-risk-matrix .wcf-quadrant-label { display: none; }\n    #wcf-risk-matrix .wcf-provider-dot .wcf-dot-label { display: none; }\n    #wcf-risk-matrix .wcf-scale-marker.x:nth-child(2), \n    #wcf-risk-matrix .wcf-scale-marker.x:nth-child(4) { display: none; }\n}\n<\/style>\n\n<!-- HERO -->\n<div class=\"wcf-hero\">\n    <div class=\"wcf-hero-inner\">\n        <div class=\"wcf-dashboard-icon\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke-width=\"1.5\"><circle cx=\"6\" cy=\"18\" r=\"4\" fill=\"#3b82f6\" stroke=\"#3b82f6\"\/><circle cx=\"12\" cy=\"8\" r=\"5\" fill=\"#ef4444\" stroke=\"#ef4444\"\/><circle cx=\"18\" cy=\"14\" r=\"3\" fill=\"#f59e0b\" stroke=\"#f59e0b\"\/><circle cx=\"8\" cy=\"6\" r=\"2\" fill=\"#22c55e\" stroke=\"#22c55e\"\/><\/svg><\/div>\n        <span class=\"wcf-label\">Strategic Intelligence<\/span>\n        <h1 class=\"wcf-title\">Cloud Provider Risk Matrix<\/h1>\n        <p class=\"wcf-subtitle\">Frequency vs. Impact Analysis<\/p>\n        <p class=\"wcf-hero-desc\">Visualize provider concentration risk across incident frequency and economic impact dimensions. Identify critical concerns and black swan risks.<\/p>\n        <span class=\"wcf-live-badge\" id=\"live-badge\">Loading&#8230;<\/span>\n        <div class=\"wcf-data-status\" id=\"data-status\"><\/div>\n        <a href=\"https:\/\/www.opey.org\/opeyit\/?page_id=585\" class=\"wcf-back-link\">\u2190 Back to Full Database<\/a>\n    <\/div>\n<\/div>\n\n<!-- KPI BAR -->\n<div class=\"wcf-kpi-bar\"><div class=\"wcf-kpi-inner\" id=\"kpi-bar\"><div class=\"wcf-loading\"><div class=\"wcf-loading-spinner\"><\/div>Loading data&#8230;<\/div><\/div><\/div>\n\n<!-- YEAR FILTER -->\n<div class=\"wcf-filter-section\"><div class=\"wcf-filter-inner\" id=\"filter-container\"><span class=\"wcf-filter-label\">Loading&#8230;<\/span><\/div><\/div>\n\n<!-- MAIN CONTENT -->\n<div class=\"wcf-main\">\n    <div class=\"wcf-main-inner\">\n        \n        <!-- RISK MATRIX CHART -->\n        <div class=\"wcf-card\">\n            <div class=\"wcf-card-header\"><div><div class=\"wcf-card-title\">Provider Risk Matrix<\/div><div class=\"wcf-card-subtitle\" id=\"matrix-subtitle\">Loading&#8230;<\/div><\/div><\/div>\n            <div class=\"wcf-card-body\">\n                <div class=\"wcf-matrix-chart\" id=\"matrix-chart\">\n                    <!-- Quadrants - positioned dynamically -->\n                    <div class=\"wcf-quadrant top-left\" id=\"q-top-left\"><\/div>\n                    <div class=\"wcf-quadrant top-right\" id=\"q-top-right\"><\/div>\n                    <div class=\"wcf-quadrant bottom-left\" id=\"q-bottom-left\"><\/div>\n                    <div class=\"wcf-quadrant bottom-right\" id=\"q-bottom-right\"><\/div>\n                    \n                    <!-- Quadrant labels - positioned dynamically -->\n                    <div class=\"wcf-quadrant-label top-left\" id=\"lbl-top-left\">OPERATIONAL BURDEN<div class=\"sub\">High Freq \/ Lower Cost<\/div><\/div>\n                    <div class=\"wcf-quadrant-label top-right\" id=\"lbl-top-right\">CRITICAL CONCERN<div class=\"sub\">High Freq \/ High Cost<\/div><\/div>\n                    <div class=\"wcf-quadrant-label bottom-left\" id=\"lbl-bottom-left\">RELATIVELY STABLE<div class=\"sub\">Low Freq \/ Lower Cost<\/div><\/div>\n                    <div class=\"wcf-quadrant-label bottom-right\" id=\"lbl-bottom-right\">BLACK SWAN RISK<div class=\"sub\">Low Freq \/ High Cost<\/div><\/div>\n                    \n                    <div class=\"wcf-axis-label x-axis\">ECONOMIC IMPACT (Log Scale) \u2192<\/div>\n                    <div class=\"wcf-axis-label y-axis\">\u2190 INCIDENT FREQUENCY<\/div>\n                    \n                    <!-- X-axis scale markers -->\n                    <div class=\"wcf-scale-marker x\" style=\"left: 5%;\">$20M<\/div>\n                    <div class=\"wcf-scale-marker x\" style=\"left: 25%;\">$60M<\/div>\n                    <div class=\"wcf-scale-marker x\" style=\"left: 50%;\">$200M<\/div>\n                    <div class=\"wcf-scale-marker x\" style=\"left: 75%;\">$700M<\/div>\n                    <div class=\"wcf-scale-marker x\" style=\"right: 3%;\">$2.5B+<\/div>\n                    \n                    <!-- Y-axis scale markers - dynamic -->\n                    <div class=\"wcf-scale-marker y\" id=\"y-scale-0\" style=\"bottom: 5%;\"><\/div>\n                    <div class=\"wcf-scale-marker y\" id=\"y-scale-1\" style=\"bottom: 25%;\"><\/div>\n                    <div class=\"wcf-scale-marker y\" id=\"y-scale-2\" style=\"bottom: 50%;\"><\/div>\n                    <div class=\"wcf-scale-marker y\" id=\"y-scale-3\" style=\"bottom: 75%;\"><\/div>\n                    <div class=\"wcf-scale-marker y\" id=\"y-scale-4\" style=\"top: 5%;\"><\/div>\n                    \n                    <!-- Median badges -->\n                    <div class=\"wcf-median-badge x-axis\" id=\"median-x-badge\"><\/div>\n                    <div class=\"wcf-median-badge y-axis\" id=\"median-y-badge\"><\/div>\n                    \n                    <div class=\"wcf-dots-container\" id=\"dots-container\"><div class=\"wcf-loading\"><div class=\"wcf-loading-spinner\"><\/div><\/div><\/div>\n                <\/div>\n                <div class=\"wcf-insights-row\" id=\"insights-row\">\n                    <div class=\"wcf-insight-box critical\"><div class=\"wcf-insight-label\">Critical Concern<\/div><div class=\"wcf-insight-title\" id=\"insight-critical-title\">Loading&#8230;<\/div><div class=\"wcf-insight-stat\" id=\"insight-critical-stat\">&#8212;<\/div><\/div>\n                    <div class=\"wcf-insight-box blackswan\"><div class=\"wcf-insight-label\">Black Swan Risk<\/div><div class=\"wcf-insight-title\" id=\"insight-blackswan-title\">Loading&#8230;<\/div><div class=\"wcf-insight-stat\" id=\"insight-blackswan-stat\">&#8212;<\/div><\/div>\n                    <div class=\"wcf-insight-box ai\"><div class=\"wcf-insight-label\">AI Instability<\/div><div class=\"wcf-insight-title\" id=\"insight-ai-title\">Loading&#8230;<\/div><div class=\"wcf-insight-stat\" id=\"insight-ai-stat\">&#8212;<\/div><\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n        \n        <!-- PROVIDER DETAIL TABLE -->\n        <div class=\"wcf-card\">\n            <div class=\"wcf-card-header\"><div><div class=\"wcf-card-title\">Provider Risk Details<\/div><div class=\"wcf-card-subtitle\" id=\"table-subtitle\">Ranked by risk quadrant and impact<\/div><\/div><\/div>\n            <div class=\"wcf-card-body\" style=\"padding: 0;\">\n                <table class=\"wcf-provider-table\"><thead><tr><th>Provider<\/th><th>Incidents<\/th><th>Est. Impact<\/th><th>Avg Duration<\/th><th>Risk Quadrant<\/th><\/tr><\/thead><tbody id=\"provider-table\"><\/tbody><\/table>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/div>\n\n<!-- CTA SECTION -->\n<div class=\"wcf-cta-section\">\n    <div class=\"wcf-cta-inner\">\n        <div class=\"wcf-cta-content\">\n            <span class=\"wcf-cta-label\">Take Action<\/span>\n            <h2 class=\"wcf-cta-title\">Reduce Your Concentration Risk<\/h2>\n            <p class=\"wcf-cta-text\">This matrix reveals industry-wide patterns. Use our Sovereign Risk Assessment to calculate your specific provider dependencies and generate a board-ready diversification strategy.<\/p>\n            <div class=\"wcf-cta-buttons\">\n                <a href=\"https:\/\/www.opey.org\/opeyit\/?page_id=643\" class=\"wcf-btn wcf-btn-primary\">Calculate Your Score<\/a>\n                <a href=\"https:\/\/www.amazon.com\/dp\/B0GHP5RV68\" class=\"wcf-btn wcf-btn-outline\">Get the Book<\/a>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/div>\n\n<!-- FOOTER -->\n<div class=\"wcf-footer\"><div class=\"wcf-footer-inner\"><div>Data: <a href=\"https:\/\/www.opey.org\/opeyit\/?page_id=585\">OPEY Cloud Outage Database<\/a> \u2022 Source: <a href=\"https:\/\/www.amazon.com\/dp\/B0GHP5RV68\">&#8220;When Clouds Fail&#8221;<\/a> by Steve Oppenheim \u2022 License: <a href=\"https:\/\/creativecommons.org\/licenses\/by\/4.0\/\">CC BY 4.0<\/a><\/div><div>Updated: <span id=\"timestamp\"><\/span><\/div><\/div><\/div>\n\n<!-- TOOLTIP -->\n<div class=\"wcf-tooltip\" id=\"wcf-matrix-tooltip\"><\/div>\n\n<\/div>\n\n<script>\n(function() {\n    var SHEET_ID = '11SvFM_W9LB661CrcOVMrOiY0coSV1xIQrKCrOZJnqKE';\n    var incidentData = [], currentYear = 'latest', allYears = [], tooltipEl = null;\n    var PROVIDER_COLORS = { 'aws': '#ff9900', 'amazon': '#ff9900', 'microsoft': '#00A4EF', 'azure': '#0078d4', 'microsoft 365': '#00A4EF', 'google': '#4285f4', 'gcp': '#4285f4', 'cloudflare': '#F38020', 'github': '#6e7681', 'openai': '#10A37F', 'chatgpt': '#10A37F', 'anthropic': '#D4A574', 'claude': '#D4A574', 'meta': '#1877f2', 'facebook': '#1877f2', 'verizon': '#cd040b', 'salesforce': '#00A1E0', 'slack': '#611f69', 'x': '#9ca3af', 'twitter': '#1da1f2', 'oracle': '#f80000', 'tiktok': '#fe2c55', 'xai': '#3B82F6', 'grok': '#3B82F6', 'paypal': '#003087', 'braintree': '#003087', 'spectrum': '#0070c9', 'charter': '#0070c9' };\n    \n    \/\/ Chart scale constants\n    var MIN_COST = 20, MAX_COST = 2500;\n\n    function getField(obj, fieldName) { if (obj[fieldName] && String(obj[fieldName]).trim()) return String(obj[fieldName]); var lower = fieldName.toLowerCase(); for (var key in obj) { if (key.toLowerCase() === lower && obj[key] && String(obj[key]).trim()) return String(obj[key]); } return ''; }\n    function formatDate(value) { if (!value) return value; var months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']; if (typeof value === 'string' && value.indexOf('Date(') === 0) { var match = value.match(\/Date\\((\\d+),(\\d+),(\\d+)\\)\/); if (match) return months[parseInt(match[2])] + ' ' + match[3] + ', ' + match[1]; } if (typeof value === 'string' && \/^[A-Z][a-z]{2}\\s+\\d\/.test(value)) return value; if (typeof value === 'string' && \/^\\d{4}-\\d{2}-\\d{2}\/.test(value)) { var d = new Date(value); return months[d.getMonth()] + ' ' + d.getDate() + ', ' + d.getFullYear(); } return value; }\n    function parseCost(costStr) { if (!costStr) return 0; var matches = costStr.match(\/([\\d.]+)\\s*([BMK])?\/gi); if (!matches || matches.length === 0) return 0; var last = matches[matches.length - 1]; var m = last.match(\/([\\d.]+)\\s*([BMK])?\/i); if (!m) return 0; var n = parseFloat(m[1]); var suffix = (m[2] || '').toUpperCase(); if (suffix === 'B') return n * 1000; if (suffix === 'K') return n \/ 1000; return n; }\n    function parseDuration(dur) { if (!dur) return 0; var hours = dur.match(\/(\\d+)\\s*h\/i); var mins = dur.match(\/(\\d+)\\s*m\/i); var days = dur.match(\/(\\d+)\\s*d\/i); var h = hours ? parseInt(hours[1]) : 0; var m = mins ? parseInt(mins[1]) : 0; var d = days ? parseInt(days[1]) : 0; return (d * 24) + h + (m \/ 60); }\n    function formatCostShort(millions) { if (millions >= 1000) return '$' + (millions \/ 1000).toFixed(1) + 'B'; if (millions >= 1) return '$' + millions.toFixed(0) + 'M'; return '$' + (millions * 1000).toFixed(0) + 'K'; }\n    function getProviderColor(name) { var lower = name.toLowerCase(); for (var key in PROVIDER_COLORS) { if (lower.indexOf(key) !== -1) return PROVIDER_COLORS[key]; } return '#6366f1'; }\n    \n    \/\/ Log scale for X-axis (cost)\n    function logScale(value, minVal, maxVal) { \n        var minLog = Math.log10(Math.max(minVal, 1)); \n        var maxLog = Math.log10(maxVal); \n        var valueLog = Math.log10(Math.max(value, minVal)); \n        return ((valueLog - minLog) \/ (maxLog - minLog)) * 100; \n    }\n\n    function loadData() {\n        var url = 'https:\/\/docs.google.com\/spreadsheets\/d\/' + SHEET_ID + '\/gviz\/tq?tqx=out:json&gid=0&headers=1';\n        fetch(url).then(function(response) { if (!response.ok) throw new Error('HTTP ' + response.status); return response.text(); }).then(function(text) {\n            var start = text.indexOf('{'), end = text.lastIndexOf('}'); if (start === -1) throw new Error('No JSON');\n            var json = JSON.parse(text.substring(start, end + 1));\n            var headers = json.table.cols.map(function(c) { return (c.label || c.id || '').trim(); });\n            if (headers.every(function(h) { return \/^[A-Za-z]$\/.test(h); })) { headers = json.table.rows[0].c.map(function(c) { return c ? String(c.v || '').trim() : ''; }); json.table.rows.shift(); }\n            incidentData = json.table.rows.map(function(row) { if (!row || !row.c) return null; var obj = {}; row.c.forEach(function(cell, i) { if (headers[i]) { var val = cell ? (cell.f || (cell.v != null ? String(cell.v) : '')) : ''; if (headers[i].toLowerCase() === 'date') val = formatDate(val); obj[headers[i].toLowerCase()] = val.trim(); } }); var provStr = getField(obj, 'providers'); obj.providers = provStr ? provStr.split(',').map(function(p) { return p.trim(); }).filter(Boolean) : []; return obj; }).filter(function(o) { return o && getField(o, 'date') && getField(o, 'title') && getField(o, 'severity'); });\n            if (incidentData.length === 0) throw new Error('No valid incidents');\n            document.getElementById('live-badge').textContent = 'Live Data'; showDataStatus('Loaded ' + incidentData.length + ' incidents', false); renderAll();\n        }).catch(function(err) { console.error('Load failed:', err.message); document.getElementById('live-badge').textContent = 'Error'; showDataStatus('Failed to load: ' + err.message, true); });\n    }\n\n    function showDataStatus(message, isError) { var el = document.getElementById('data-status'); el.textContent = message; el.className = 'wcf-data-status visible' + (isError ? ' error' : ''); if (!isError) setTimeout(function() { el.classList.remove('visible'); }, 3000); }\n\n    function renderAll() {\n        incidentData.sort(function(a, b) { return new Date(getField(b, 'date')) - new Date(getField(a, 'date')); });\n        allYears = []; incidentData.forEach(function(inc) { var y = getField(inc, 'year'); if (y && allYears.indexOf(y) === -1) allYears.push(y); }); allYears.sort(function(a, b) { return b - a; }); currentYear = allYears[0] || '2026';\n        renderFilters(); renderDashboard(currentYear); document.getElementById('timestamp').textContent = new Date().toLocaleString(); tooltipEl = document.getElementById('wcf-matrix-tooltip');\n    }\n\n    function renderFilters() { var container = document.getElementById('filter-container'); var html = '<span class=\"wcf-filter-label\">Select Year:<\/span>'; allYears.forEach(function(year, i) { html += '<button class=\"wcf-year-btn' + (i === 0 ? ' active' : '') + '\" onclick=\"wcfMatrixFilter(\\'' + year + '\\')\">' + year + '<\/button>'; }); container.innerHTML = html; }\n    function getFilteredData(year) { return incidentData.filter(function(inc) { return getField(inc, 'year') === year; }); }\n    function renderDashboard(year) { currentYear = year; var data = getFilteredData(year); var providerStats = calculateProviderStats(data); renderKPIs(data, providerStats, year); renderRiskMatrix(providerStats, year); renderInsights(providerStats, year); renderProviderTable(providerStats, year); }\n\n    function calculateProviderStats(data) {\n        var stats = {};\n        data.forEach(function(inc) { \n            var cost = parseCost(getField(inc, 'costestimate')); \n            var duration = parseDuration(getField(inc, 'duration')); \n            var severity = getField(inc, 'severity').toLowerCase(); \n            (inc.providers || []).forEach(function(provider) { \n                var pName = normalizeProviderName(provider); \n                if (!pName) return; \n                if (!stats[pName]) stats[pName] = { name: pName, displayName: provider, incidents: 0, totalCost: 0, totalDuration: 0, durationCount: 0, severities: { critical: 0, major: 0, moderate: 0, minor: 0 } }; \n                stats[pName].incidents++; \n                stats[pName].totalCost += cost; \n                if (duration > 0) { stats[pName].totalDuration += duration; stats[pName].durationCount++; } \n                if (stats[pName].severities.hasOwnProperty(severity)) stats[pName].severities[severity]++; \n            }); \n        });\n        \n        \/\/ Calculate max values for scaling\n        var maxIncidents = 0, maxCost = 0; \n        Object.keys(stats).forEach(function(key) { \n            var s = stats[key]; \n            s.avgDuration = s.durationCount > 0 ? (s.totalDuration \/ s.durationCount) : 0; \n            if (s.incidents > maxIncidents) maxIncidents = s.incidents; \n            if (s.totalCost > maxCost) maxCost = s.totalCost; \n        });\n        maxIncidents = Math.max(maxIncidents, 10); \/\/ Minimum scale\n        \n        \/\/ Calculate medians\n        var incidentValues = Object.values(stats).map(function(s) { return s.incidents; }).sort(function(a,b) { return a-b; }); \n        var costValues = Object.values(stats).map(function(s) { return s.totalCost; }).filter(function(c) { return c > 0; }).sort(function(a,b) { return a-b; }); \n        var medianIncidents = incidentValues.length > 0 ? incidentValues[Math.floor(incidentValues.length \/ 2)] : 3; \n        var medianCost = costValues.length > 0 ? costValues[Math.floor(costValues.length \/ 2)] : 100;\n        \n        \/\/ Calculate visual positions for median lines (as percentages of chart)\n        var medianYPercent = (medianIncidents \/ maxIncidents) * 100;\n        var medianXPercent = logScale(medianCost, MIN_COST, MAX_COST);\n        \n        \/\/ Assign quadrants based on medians\n        Object.keys(stats).forEach(function(key) { \n            var s = stats[key]; \n            var highFreq = s.incidents >= medianIncidents; \n            var highCost = s.totalCost >= medianCost; \n            if (highFreq && highCost) { s.quadrant = 'critical-concern'; s.quadrantLabel = 'Critical Concern'; } \n            else if (highFreq && !highCost) { s.quadrant = 'operational-burden'; s.quadrantLabel = 'Operational Burden'; } \n            else if (!highFreq && highCost) { s.quadrant = 'black-swan'; s.quadrantLabel = 'Black Swan Risk'; } \n            else { s.quadrant = 'relatively-stable'; s.quadrantLabel = 'Relatively Stable'; } \n        });\n        \n        return { \n            providers: stats, \n            maxIncidents: maxIncidents, \n            maxCost: maxCost, \n            medianIncidents: medianIncidents, \n            medianCost: medianCost,\n            medianYPercent: medianYPercent,\n            medianXPercent: medianXPercent\n        };\n    }\n\n    function normalizeProviderName(name) { if (!name) return null; var lower = name.toLowerCase().trim(); if (lower.indexOf('microsoft') !== -1 || lower === 'azure' || lower.indexOf('m365') !== -1) return 'Microsoft\/Azure'; if (lower === 'github') return 'GitHub'; if (lower === 'aws' || lower.indexOf('amazon') !== -1) return 'AWS'; if (lower === 'openai' || lower === 'chatgpt') return 'OpenAI'; if (lower === 'anthropic' || lower === 'claude') return 'Anthropic'; if (lower === 'cloudflare') return 'Cloudflare'; if (lower === 'salesforce') return 'Salesforce'; if (lower === 'slack') return 'Slack'; if (lower === 'x' || lower === 'twitter') return 'X (Twitter)'; if (lower === 'xai' || lower === 'grok') return 'xAI\/Grok'; if (lower === 'verizon') return 'Verizon'; if (lower === 'paypal' || lower === 'braintree' || lower === 'venmo') return 'PayPal'; if (lower === 'meta' || lower === 'facebook') return 'Meta'; if (lower.indexOf('tiktok') !== -1 || lower === 'bytedance') return 'TikTok\/Oracle'; if (lower === 'oracle') return 'TikTok\/Oracle'; if (lower.indexOf('spectrum') !== -1 || lower.indexOf('charter') !== -1) return 'Spectrum'; if (lower.indexOf('google') !== -1 || lower === 'gcp') return 'Google'; if (lower.indexOf('hurricane') !== -1) return 'Hurricane Electric'; return name.trim(); }\n\n    function renderKPIs(data, stats, year) {\n        var totalIncidents = data.length, totalImpact = 0, providers = Object.keys(stats.providers); \n        Object.values(stats.providers).forEach(function(p) { totalImpact += p.totalCost; }); \n        var criticalCount = Object.values(stats.providers).filter(function(p) { return p.quadrant === 'critical-concern'; }).length; \n        var blackSwanCount = Object.values(stats.providers).filter(function(p) { return p.quadrant === 'black-swan'; }).length;\n        document.getElementById('kpi-bar').innerHTML = '<div class=\"wcf-kpi red\"><div class=\"wcf-kpi-label\">' + year + ' Incidents<\/div><div class=\"wcf-kpi-value\">' + totalIncidents + '<\/div><div class=\"wcf-kpi-delta\">Total tracked<\/div><\/div><div class=\"wcf-kpi orange\"><div class=\"wcf-kpi-label\">Est. Impact<\/div><div class=\"wcf-kpi-value\">' + formatCostShort(totalImpact) + '<\/div><div class=\"wcf-kpi-delta\">' + year + ' Total<\/div><\/div><div class=\"wcf-kpi purple\"><div class=\"wcf-kpi-label\">Providers<\/div><div class=\"wcf-kpi-value\">' + providers.length + '<\/div><div class=\"wcf-kpi-delta\">Unique providers<\/div><\/div><div class=\"wcf-kpi yellow\"><div class=\"wcf-kpi-label\">Critical Concern<\/div><div class=\"wcf-kpi-value\">' + criticalCount + '<\/div><div class=\"wcf-kpi-delta\">High freq + high cost<\/div><\/div><div class=\"wcf-kpi green\"><div class=\"wcf-kpi-label\">Black Swan Risk<\/div><div class=\"wcf-kpi-value\">' + blackSwanCount + '<\/div><div class=\"wcf-kpi-delta\">Low freq + high cost<\/div><\/div>';\n    }\n\n    function renderRiskMatrix(stats, year) {\n        var container = document.getElementById('dots-container'); \n        var providers = Object.values(stats.providers); \n        \n        if (providers.length === 0) { \n            container.innerHTML = '<div style=\"text-align:center;color:rgba(255,255,255,0.5);padding:40px;\">No data for ' + year + '<\/div>'; \n            return; \n        }\n        \n        var maxInc = stats.maxIncidents;\n        var medianYPct = stats.medianYPercent;\n        var medianXPct = stats.medianXPercent;\n        \n        \/\/ Clamp median positions to reasonable ranges\n        medianYPct = Math.max(15, Math.min(85, medianYPct));\n        medianXPct = Math.max(15, Math.min(85, medianXPct));\n        \n        \/\/ ===== POSITION QUADRANTS DYNAMICALLY =====\n        \/\/ Top-left: from median Y to top, from left edge to median X\n        document.getElementById('q-top-left').style.cssText = 'top: 0; left: 0; width: ' + medianXPct + '%; height: ' + (100 - medianYPct) + '%;';\n        \/\/ Top-right: from median Y to top, from median X to right\n        document.getElementById('q-top-right').style.cssText = 'top: 0; right: 0; width: ' + (100 - medianXPct) + '%; height: ' + (100 - medianYPct) + '%;';\n        \/\/ Bottom-left: from bottom to median Y, from left edge to median X\n        document.getElementById('q-bottom-left').style.cssText = 'bottom: 0; left: 0; width: ' + medianXPct + '%; height: ' + medianYPct + '%;';\n        \/\/ Bottom-right: from bottom to median Y, from median X to right\n        document.getElementById('q-bottom-right').style.cssText = 'bottom: 0; right: 0; width: ' + (100 - medianXPct) + '%; height: ' + medianYPct + '%;';\n        \n        \/\/ ===== POSITION QUADRANT LABELS =====\n        var topZoneCenter = (100 - medianYPct) \/ 2;\n        var bottomZoneCenter = medianYPct \/ 2;\n        var leftZoneCenter = medianXPct \/ 2;\n        var rightZoneCenter = medianXPct + (100 - medianXPct) \/ 2;\n        \n        document.getElementById('lbl-top-left').style.cssText = 'top: ' + Math.max(8, topZoneCenter - 5) + '%; left: ' + Math.max(5, leftZoneCenter - 15) + '%; color: #22c55e;';\n        document.getElementById('lbl-top-right').style.cssText = 'top: ' + Math.max(8, topZoneCenter - 5) + '%; right: ' + Math.max(5, (100 - rightZoneCenter) - 10) + '%; color: #ef4444; text-align: right;';\n        document.getElementById('lbl-bottom-left').style.cssText = 'bottom: ' + Math.max(12, bottomZoneCenter - 5) + '%; left: ' + Math.max(5, leftZoneCenter - 15) + '%; color: #3b82f6;';\n        document.getElementById('lbl-bottom-right').style.cssText = 'bottom: ' + Math.max(12, bottomZoneCenter - 5) + '%; right: ' + Math.max(5, (100 - rightZoneCenter) - 10) + '%; color: #f59e0b; text-align: right;';\n        \n        \/\/ ===== UPDATE Y-AXIS SCALE MARKERS =====\n        document.getElementById('y-scale-0').textContent = '0';\n        document.getElementById('y-scale-1').textContent = Math.round(maxInc * 0.25);\n        document.getElementById('y-scale-2').textContent = Math.round(maxInc * 0.5);\n        document.getElementById('y-scale-3').textContent = Math.round(maxInc * 0.75);\n        document.getElementById('y-scale-4').textContent = maxInc;\n        \n        \/\/ ===== SHOW MEDIAN BADGES =====\n        var medianXBadge = document.getElementById('median-x-badge');\n        var medianYBadge = document.getElementById('median-y-badge');\n        medianXBadge.textContent = 'Median: ' + formatCostShort(stats.medianCost);\n        medianXBadge.style.cssText = 'left: ' + medianXPct + '%; bottom: 38px;';\n        medianYBadge.textContent = 'Median: ' + stats.medianIncidents;\n        medianYBadge.style.cssText = 'left: 42px; bottom: ' + medianYPct + '%;';\n        \n        \/\/ ===== RENDER PROVIDER DOTS =====\n        providers.sort(function(a, b) { return b.totalCost - a.totalCost; });\n        \n        var html = '';\n        providers.forEach(function(p) { \n            \/\/ X position: log scale for cost\n            var costForCalc = Math.max(p.totalCost, MIN_COST); \n            var xPercent = logScale(costForCalc, MIN_COST, MAX_COST); \n            xPercent = Math.max(3, Math.min(97, xPercent)); \n            \n            \/\/ Y position: linear scale for incidents\n            var yPercent = (p.incidents \/ maxInc) * 100; \n            yPercent = Math.max(3, Math.min(97, yPercent)); \n            \n            \/\/ Dot size based on cost\n            var size = 14 + Math.log10(Math.max(p.totalCost, 10)) * 8; \n            size = Math.max(14, Math.min(50, size)); \n            \n            var color = getProviderColor(p.name); \n            var isGlow = p.quadrant === 'critical-concern' && p.totalCost > 500; \n            \n            var dataStr = encodeURIComponent(JSON.stringify({ \n                name: p.name, incidents: p.incidents, cost: p.totalCost, \n                avgDuration: p.avgDuration, quadrant: p.quadrant, \n                quadrantLabel: p.quadrantLabel, severities: p.severities \n            })); \n            \n            html += '<div class=\"wcf-provider-dot' + (isGlow ? ' glow' : '') + '\" style=\"left: ' + xPercent + '%; bottom: ' + yPercent + '%; width: ' + size + 'px; height: ' + size + 'px; background: ' + color + '; color: ' + color + '; border: 2px solid rgba(255,255,255,0.3); box-shadow: 0 0 15px ' + color + '80;' + (isGlow ? ' box-shadow: 0 0 30px ' + color + '80, 0 0 60px ' + color + '40;' : '') + '\" data-provider=\"' + dataStr + '\"><span class=\"wcf-dot-label\">' + p.name + '<\/span><\/div>'; \n        });\n        \n        container.innerHTML = html; \n        document.getElementById('matrix-subtitle').textContent = year + ' \u2022 Quadrant split at median (' + stats.medianIncidents + ' incidents \/ ' + formatCostShort(stats.medianCost) + ') \u2022 Dot size = impact'; \n        attachDotTooltips();\n    }\n\n    function attachDotTooltips() { \n        var container = document.getElementById('dots-container'); \n        container.addEventListener('mouseover', function(e) { var dot = e.target.closest('.wcf-provider-dot'); if (dot) showProviderTooltip(dot, e); }); \n        container.addEventListener('mouseout', function(e) { var dot = e.target.closest('.wcf-provider-dot'); if (dot) hideTooltip(); }); \n        container.addEventListener('mousemove', function(e) { var dot = e.target.closest('.wcf-provider-dot'); if (dot && tooltipEl && tooltipEl.classList.contains('visible')) positionTooltip(e); }); \n    }\n\n    function showProviderTooltip(dot, e) { \n        if (!tooltipEl) tooltipEl = document.getElementById('wcf-matrix-tooltip'); \n        var data; try { data = JSON.parse(decodeURIComponent(dot.dataset.provider)); } catch(err) { return; } \n        var quadrantColors = { 'critical-concern': 'background: rgba(239, 68, 68, 0.25); color: #f87171;', 'black-swan': 'background: rgba(245, 158, 11, 0.25); color: #fbbf24;', 'operational-burden': 'background: rgba(34, 197, 94, 0.25); color: #4ade80;', 'relatively-stable': 'background: rgba(59, 130, 246, 0.25); color: #60a5fa;' }; \n        var html = '<div class=\"wcf-tooltip-header\"><span class=\"wcf-tooltip-provider\">' + data.name + '<\/span><span class=\"wcf-tooltip-quadrant\" style=\"' + quadrantColors[data.quadrant] + '\">' + data.quadrantLabel + '<\/span><\/div><div class=\"wcf-tooltip-body\"><div class=\"wcf-tooltip-metrics\"><div class=\"wcf-tooltip-metric\"><div class=\"wcf-tooltip-metric-value\">' + data.incidents + '<\/div><div class=\"wcf-tooltip-metric-label\">Incidents<\/div><\/div><div class=\"wcf-tooltip-metric\"><div class=\"wcf-tooltip-metric-value cost\">' + formatCostShort(data.cost) + '<\/div><div class=\"wcf-tooltip-metric-label\">Est. Impact<\/div><\/div><div class=\"wcf-tooltip-metric\"><div class=\"wcf-tooltip-metric-value\">' + (data.avgDuration > 0 ? data.avgDuration.toFixed(1) + 'h' : 'N\/A') + '<\/div><div class=\"wcf-tooltip-metric-label\">Avg Duration<\/div><\/div><div class=\"wcf-tooltip-metric\"><div class=\"wcf-tooltip-metric-value\">' + (data.severities.critical + data.severities.major) + '<\/div><div class=\"wcf-tooltip-metric-label\">Critical+Major<\/div><\/div><\/div><\/div><div class=\"wcf-tooltip-footer\">Severity: ' + data.severities.critical + ' critical, ' + data.severities.major + ' major, ' + data.severities.moderate + ' moderate, ' + data.severities.minor + ' minor<\/div>'; \n        tooltipEl.innerHTML = html; positionTooltip(e); tooltipEl.classList.add('visible'); \n    }\n    function positionTooltip(e) { if (!tooltipEl) return; var x = e.clientX + 20, y = e.clientY + 15, tooltipWidth = 280, tooltipHeight = tooltipEl.offsetHeight || 180; if (x + tooltipWidth > window.innerWidth - 20) x = e.clientX - tooltipWidth - 20; if (y + tooltipHeight > window.innerHeight - 20) y = e.clientY - tooltipHeight - 15; if (x < 10) x = 10; if (y < 10) y = 10; tooltipEl.style.left = x + 'px'; tooltipEl.style.top = y + 'px'; }\n    function hideTooltip() { if (tooltipEl) tooltipEl.classList.remove('visible'); }\n\n    function renderInsights(stats, year) {\n        var providers = Object.values(stats.providers); \n        var criticalProviders = providers.filter(function(p) { return p.quadrant === 'critical-concern'; }); \n        criticalProviders.sort(function(a, b) { return b.totalCost - a.totalCost; }); \n        var criticalNames = criticalProviders.slice(0, 2).map(function(p) { return p.name; }).join(' + ') || 'None'; \n        var criticalIncidents = criticalProviders.reduce(function(sum, p) { return sum + p.incidents; }, 0); \n        var criticalCost = criticalProviders.reduce(function(sum, p) { return sum + p.totalCost; }, 0);\n        document.getElementById('insight-critical-title').textContent = criticalNames; \n        document.getElementById('insight-critical-stat').textContent = criticalIncidents + ' incidents, ' + formatCostShort(criticalCost);\n        \n        var blackSwanProviders = providers.filter(function(p) { return p.quadrant === 'black-swan'; }); \n        blackSwanProviders.sort(function(a, b) { return b.totalCost - a.totalCost; }); \n        var blackSwanNames = blackSwanProviders.slice(0, 2).map(function(p) { return p.name; }).join(' + ') || 'None'; \n        var blackSwanIncidents = blackSwanProviders.reduce(function(sum, p) { return sum + p.incidents; }, 0); \n        var blackSwanCost = blackSwanProviders.reduce(function(sum, p) { return sum + p.totalCost; }, 0);\n        document.getElementById('insight-blackswan-title').textContent = blackSwanNames; \n        document.getElementById('insight-blackswan-stat').textContent = blackSwanIncidents + ' incidents, ' + formatCostShort(blackSwanCost);\n        \n        var aiProviders = ['OpenAI', 'Anthropic', 'xAI\/Grok']; \n        var aiStats = providers.filter(function(p) { return aiProviders.indexOf(p.name) !== -1; }); \n        var aiIncidents = aiStats.reduce(function(sum, p) { return sum + p.incidents; }, 0); \n        var aiNames = aiStats.map(function(p) { return p.name; }).join(' + ') || 'No AI providers';\n        document.getElementById('insight-ai-title').textContent = aiNames; \n        document.getElementById('insight-ai-stat').textContent = aiIncidents + ' incidents in ' + year;\n    }\n\n    function renderProviderTable(stats, year) {\n        var providers = Object.values(stats.providers); \n        var quadrantOrder = { 'critical-concern': 0, 'black-swan': 1, 'operational-burden': 2, 'relatively-stable': 3 }; \n        providers.sort(function(a, b) { var qDiff = quadrantOrder[a.quadrant] - quadrantOrder[b.quadrant]; if (qDiff !== 0) return qDiff; return b.totalCost - a.totalCost; });\n        var html = providers.slice(0, 15).map(function(p) { var color = getProviderColor(p.name); return '<tr><td><div class=\"wcf-provider-cell\"><div class=\"wcf-provider-dot-small\" style=\"background: ' + color + ';\"><\/div>' + p.name + '<\/div><\/td><td>' + p.incidents + '<\/td><td class=\"wcf-cost-cell\">' + formatCostShort(p.totalCost) + '<\/td><td>' + (p.avgDuration > 0 ? p.avgDuration.toFixed(1) + 'h' : '-') + '<\/td><td><span class=\"wcf-quadrant-badge ' + p.quadrant + '\">' + p.quadrantLabel + '<\/span><\/td><\/tr>'; }).join('');\n        document.getElementById('provider-table').innerHTML = html || '<tr><td colspan=\"5\" style=\"text-align:center;color:rgba(255,255,255,0.5);padding:40px;\">No provider data<\/td><\/tr>'; \n        document.getElementById('table-subtitle').textContent = 'Ranked by risk quadrant and impact \u2022 ' + year;\n    }\n\n    window.wcfMatrixFilter = function(year) { \n        currentYear = year; \n        document.querySelectorAll('#wcf-risk-matrix .wcf-year-btn').forEach(function(btn) { btn.classList.remove('active'); if (btn.textContent === year) btn.classList.add('active'); }); \n        var data = getFilteredData(year); \n        var providerStats = calculateProviderStats(data); \n        renderKPIs(data, providerStats, year); \n        renderRiskMatrix(providerStats, year); \n        renderInsights(providerStats, year); \n        renderProviderTable(providerStats, year); \n    };\n\n    if (document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', loadData); } else { loadData(); }\n})();\n<\/script>\n\n\n\n\n\n<div id=\"elemID031021\" style=\"line-height:16px;text-align:center;z-index:100000;\"><a title=\"wix guests ip\" href=\"https:\/\/www.tracemyip.org\/pv1-3-36447-2\"><img decoding=\"async\" src=\"\/\/s3.tracemyip.org\/vLg\/1217\/4684NR-IPIB\/57003\/9\/njsUrl\/\" alt=\"Wix guests ip\" referrerpolicy=\"no-referrer-when-downgrade\" style=\"border:0px;\"><\/a><div><a href=\"https:\/\/www.tracemyip.org\/pv1-3-36447-2\">ip traffic<\/a><\/div><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Strategic Intelligence Cloud Provider Risk Matrix Frequency vs. Impact Analysis Visualize provider concentration risk across incident frequency and economic impact dimensions. Identify critical concerns and black swan risks. Loading&#8230; \u2190 Back to Full Database Loading data&#8230; Loading&#8230; Provider Risk Matrix Loading&#8230; OPERATIONAL BURDEN High Freq \/ Lower Cost CRITICAL CONCERN High Freq \/ High Cost [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-671","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.opey.org\/opeyit\/index.php?rest_route=\/wp\/v2\/pages\/671","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.opey.org\/opeyit\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.opey.org\/opeyit\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.opey.org\/opeyit\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.opey.org\/opeyit\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=671"}],"version-history":[{"count":6,"href":"https:\/\/www.opey.org\/opeyit\/index.php?rest_route=\/wp\/v2\/pages\/671\/revisions"}],"predecessor-version":[{"id":682,"href":"https:\/\/www.opey.org\/opeyit\/index.php?rest_route=\/wp\/v2\/pages\/671\/revisions\/682"}],"wp:attachment":[{"href":"https:\/\/www.opey.org\/opeyit\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=671"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}