/* SDG evidence (Data Reef) panel on the map + owner export button. */
.datareef-panel { margin-top:16px; padding:14px; border:1px solid var(--line); border-radius:var(--radius-sm); background:var(--surface-card-2); }
.datareef-panel header { display:flex; justify-content:space-between; align-items:baseline; gap:10px; margin-bottom:12px; }
.datareef-panel header a { color:var(--cyan); font-size:11px; text-decoration:none; white-space:nowrap; }
.datareef-panel header a:hover { text-decoration:underline; }
.datareef-goals { display:grid; grid-template-columns:repeat(9, 1fr); gap:4px; }
.datareef-goal { display:grid; place-items:center; aspect-ratio:1; border-radius:6px; font-size:11px; font-weight:700; color:var(--ink); background:var(--surface-hover); border:1px solid transparent; }
.datareef-goal.t-found, .datareef-legend i.t-found { background:color-mix(in srgb, var(--green) 30%, transparent); border-color:color-mix(in srgb, var(--green) 55%, transparent); }
.datareef-goal.t-gap, .datareef-legend i.t-gap { background:color-mix(in srgb, var(--coral) 28%, transparent); border-color:color-mix(in srgb, var(--coral) 55%, transparent); }
.datareef-goal.t-partial, .datareef-goal.t-other, .datareef-legend i.t-partial, .datareef-legend i.t-other { background:color-mix(in srgb, var(--gold) 26%, transparent); border-color:color-mix(in srgb, var(--gold) 50%, transparent); }
.datareef-goal.t-none, .datareef-legend i.t-none { background:transparent; border-color:var(--line-strong); color:var(--muted); }
.datareef-goal.t-null, .datareef-legend i.t-null { background:transparent; border:1px dashed var(--line-strong); color:var(--dim); }
.datareef-legend { display:flex; flex-wrap:wrap; gap:6px 12px; margin:10px 0 12px; color:var(--muted); font-size:11px; }
.datareef-legend span { display:inline-flex; align-items:center; gap:5px; }
.datareef-legend i { width:9px; height:9px; border-radius:3px; border:1px solid transparent; }
.datareef-row { display:flex; justify-content:space-between; padding:8px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); font-size:12px; color:var(--muted); }
.datareef-row strong { color:var(--ink-strong); }
.datareef-muted { color:var(--muted) !important; font-weight:600; }
.datareef-sub { margin:12px 0 6px; font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:.08em; }
.datareef-missions { margin:0; padding-left:16px; font-size:12px; line-height:1.6; }
.datareef-missions a { color:var(--cyan); }
.datareef-missions small { color:var(--muted); }
.datareef-note { margin:6px 0 0; color:var(--muted); font-size:11px; line-height:1.5; }
.datareef-source { margin:12px 0 0; padding-top:8px; border-top:1px solid var(--line); color:var(--dim); font-size:10px; }
.datareef-unavailable { padding:12px; border-radius:9px; border:1px solid color-mix(in srgb, var(--danger) 45%, transparent); background:color-mix(in srgb, var(--danger) 9%, transparent); }
.datareef-unavailable strong { color:var(--danger); font-size:13px; }
.datareef-unavailable p { margin:6px 0 10px; color:var(--muted); font-size:11px; line-height:1.5; }
.datareef-export { margin-top:16px; display:flex; justify-content:flex-end; }
