/* Mapa de oportunidades Meta — usa os tokens da dash (styles.css :root). */
#meta-opportunities { border:1px solid var(--line); border-radius:12px; background:var(--panel); padding:18px; display:grid; grid-template-columns:minmax(0,1fr); gap:14px; min-width:0; }
#meta-opportunities > *, #meta-opps-body > * { min-width:0; }
#meta-opportunities h3 { margin:0; font-size:17px; }
#meta-opportunities .mo-head { display:grid; gap:4px; }
#meta-opportunities .mo-head p { margin:0; color:var(--muted); font-size:13px; overflow-wrap:anywhere; }
#meta-opportunities .mo-stale { color:var(--yellow); }
.mo-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.mo-kpi { border:1px solid var(--line); background:var(--panel-soft); border-radius:12px; padding:14px; display:grid; gap:4px; min-width:0; }
.mo-kpi span { color:var(--muted); font-size:12px; letter-spacing:.04em; text-transform:uppercase; }
.mo-kpi strong { font-size:24px; font-variant-numeric:tabular-nums; }
.mo-kpi small { color:var(--muted); font-size:12px; overflow-wrap:anywhere; }
.mo-kpi .mo-period { color:#6f839c; }
.mo-toolbar { display:flex; flex-wrap:wrap; gap:10px; align-items:end; justify-content:space-between; }
.mo-tabs { display:flex; flex-wrap:wrap; gap:6px; }
.mo-tabs button { border:1px solid var(--line); background:var(--panel-soft); color:var(--muted); border-radius:8px; padding:8px 12px; cursor:pointer; font:inherit; font-size:13px; }
.mo-tabs button.is-active { color:var(--text); border-color:var(--blue); box-shadow:inset 0 -2px var(--blue); }
.mo-toolbar label { display:grid; gap:4px; color:var(--muted); font-size:12px; }
.mo-toolbar select { min-height:36px; border:1px solid var(--line); border-radius:8px; padding:6px 10px; color:var(--text); background:var(--panel-soft); }
.mo-legend { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:8px 14px; color:var(--muted); font-size:12px; margin-bottom:10px; }
.mo-legend div { display:grid; gap:4px; justify-items:start; align-content:start; }
.mo-scroll { overflow-x:auto; border:1px solid var(--line); border-radius:10px; }
.mo-table { border-collapse:collapse; width:100%; font-size:13px; }
.mo-table th, .mo-table td { text-align:left; padding:9px 11px; border-bottom:1px solid var(--line); vertical-align:top; }
.mo-table thead th { color:var(--muted); font-size:11px; letter-spacing:.07em; text-transform:uppercase; background:var(--panel-soft); white-space:nowrap; }
.mo-table tbody tr:last-child > * { border-bottom:0; }
.mo-table .mo-num { text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.mo-table .mo-wide { min-width:300px; } .mo-table .mo-mid { min-width:200px; }
.mo-sub { display:block; color:var(--muted); font-size:12px; font-weight:500; margin-top:2px; }
.mo-chip { display:inline-block; font-size:12px; font-weight:700; border-radius:999px; padding:2px 9px; white-space:nowrap; border:1px solid var(--line); color:var(--text); }
.mo-k-deep, .mo-win { color:var(--green); border-color:rgba(85,214,154,.45); }
.mo-k-expand, .mo-new { color:var(--blue); border-color:rgba(84,182,255,.45); }
.mo-k-isolate { color:#b69cff; border-color:rgba(182,156,255,.45); }
.mo-k-recover, .mo-paused { color:#4fd6d0; border-color:rgba(79,214,208,.45); }
.mo-k-improve, .mo-thin { color:var(--yellow); border-color:rgba(255,207,112,.45); }
.mo-loss, .mo-fail { color:var(--red); border-color:rgba(255,119,119,.45); }
.mo-never { color:#6f839c; }
.mo-pos { color:var(--green); } .mo-neg { color:var(--red); } .mo-alert { color:var(--yellow); }
.mo-cell { min-width:116px; }
.mo-cell b { display:block; font-size:14px; font-variant-numeric:tabular-nums; color:var(--text); }
.mo-cell .mo-st { display:block; font-size:12px; font-weight:600; }
.mo-cell .mo-meta { display:block; font-size:11px; color:var(--muted); font-variant-numeric:tabular-nums; }
.mo-cell.mo-win { background:rgba(85,214,154,.10); } .mo-cell.mo-loss { background:rgba(255,119,119,.10); }
.mo-cell.mo-fail { background:rgba(255,119,119,.06); } .mo-cell.mo-broad { background:rgba(182,156,255,.07); }
.mo-note { color:var(--muted); font-size:13px; margin:0 0 10px; max-width:100ch; }
.mo-h4 { margin:16px 0 4px; font-size:14px; }
.mo-empty { color:var(--muted); border:1px dashed var(--line); border-radius:10px; padding:16px; margin:0; }
.mo-counts { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:10px; }
#meta-opportunities details { color:var(--muted); font-size:13px; }
#meta-opportunities details summary { cursor:pointer; color:#9bd5ff; }
#meta-opportunities details ul { margin:8px 0 0; padding-left:18px; display:grid; gap:4px; }
@media (max-width:900px) { .mo-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:520px) { .mo-kpis { grid-template-columns:1fr; } #meta-opportunities { padding:14px; } }
.mo-ap-bar { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-bottom:8px; }
.mo-ap-toggle { border:1px solid var(--line); background:var(--panel-soft); color:var(--text); border-radius:8px; padding:8px 14px; cursor:pointer; font:inherit; font-size:13px; }
.mo-ap-toggle:hover { border-color:var(--blue); }