/* SRI — Opportunity Workspace surface. Adapted to the SRI green design system. */
.owRoot { font: 400 13px var(--font-sans); color: var(--foreground); }
.owRoot .tabular { font-variant-numeric: tabular-nums; }

.owPersonaBar { background: var(--muted); border: 1px solid var(--border); border-radius: var(--radius-card);
  padding: 11px 14px; margin-bottom: 14px; display: flex; align-items: flex-start; gap: 10px; flex-wrap: wrap; }
.owPersonaLabel { font: 500 10px var(--font-sans); color: var(--muted-foreground); text-transform: uppercase;
  letter-spacing: 0.06em; white-space: nowrap; padding-top: 6px; }
.owPills { display: flex; gap: 5px; flex-wrap: wrap; }
.owPill { padding: 5px 11px; border-radius: var(--radius-full); font: 500 11px var(--font-sans); cursor: pointer;
  border: 1px solid var(--border-strong); color: var(--muted-foreground); background: transparent;
  transition: all var(--dur-fast) var(--ease-out); white-space: nowrap; }
.owPill:hover { border-color: var(--foreground); color: var(--foreground); }
.owPill.isOn { background: var(--green-9); color: oklch(0.99 0.01 155); border-color: var(--green-9); }

.owCtx { border-radius: var(--radius-input); padding: 9px 13px; margin-bottom: 14px; font: 400 11.5px var(--font-sans);
  line-height: 1.5; border-left: 3px solid var(--green-9); background: var(--muted); color: var(--muted-foreground); text-wrap: pretty; }
.owCtx strong { color: var(--foreground); font-weight: 600; }

.owActions { display: flex; gap: 6px; justify-content: flex-end; margin-bottom: 14px; }
.owBtn { padding: 6px 12px; border-radius: var(--radius-input); font: 500 11.5px var(--font-sans); cursor: pointer; }
.owBtnGhost { background: transparent; border: 1px solid var(--border-strong); color: var(--foreground); }
.owBtnGhost:hover { background: var(--muted); }
.owBtnPrimary { background: var(--green-9); border: 1px solid var(--green-9); color: oklch(0.99 0.01 155); }
.owBtnPrimary:hover { background: var(--green-10); }

.owKpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 9px; margin-bottom: 16px; }
.owKpi { background: var(--muted); border-radius: var(--radius-card); padding: 11px 13px; }
.owKpi.is-alert { border-left: 2px solid #E24B4A; }
.owKpi.is-gold { border-left: 2px solid #E8B44B; }
.owKpi.is-success { border-left: 2px solid #1D9E75; }
.owKpiLabel { font: 400 10px var(--font-sans); color: var(--muted-foreground); margin-bottom: 3px; line-height: 1.3; }
.owKpiValue { font: 500 19px var(--font-sans); color: var(--foreground); }
.owKpiSub { font: 400 10px var(--font-sans); color: var(--muted-foreground); margin-top: 2px; line-height: 1.3; }

.owTabs { display: flex; gap: 0; border-bottom: 1px solid var(--border); margin-bottom: 14px; }
.owTab { padding: 7px 13px; font: 400 11.5px var(--font-sans); cursor: pointer; color: var(--muted-foreground);
  border: 0; background: transparent; border-bottom: 2px solid transparent; margin-bottom: -1px;
  transition: color var(--dur-fast) var(--ease-out); white-space: nowrap; display: flex; align-items: center; }
.owTab:hover { color: var(--foreground); }
.owTab.isOn { color: var(--green-11); border-bottom-color: var(--green-9); font-weight: 500; }
.owBadge { display: inline-flex; align-items: center; justify-content: center; background: var(--background);
  border: 1px solid var(--border); border-radius: var(--radius-full); font: 500 10px var(--font-sans);
  padding: 1px 6px; margin-left: 5px; color: var(--muted-foreground); }

.owToolbar { display: flex; align-items: center; gap: 8px; margin-bottom: 14px; }
.owSelect { padding: 6px 10px; border-radius: var(--radius-input); border: 1px solid var(--border);
  font: 400 11px var(--font-sans); background: var(--card); color: var(--foreground); cursor: pointer; min-width: 120px; }

.owSectionLabel { font: 500 10px var(--font-sans); color: var(--muted-foreground); text-transform: uppercase;
  letter-spacing: 0.06em; margin: 4px 0 9px; }
.owSignals { margin-bottom: 14px; }
.owSignal { background: var(--muted); border-radius: var(--radius-card); padding: 9px 11px; display: flex;
  align-items: flex-start; gap: 9px; margin-bottom: 7px; }
.owSigIcon { width: 26px; height: 26px; border-radius: var(--radius-input); display: flex; align-items: center;
  justify-content: center; flex-shrink: 0; }
.owSigIcon.is-warn { background: #FAEEDA; color: #854F0B; }
.owSigIcon.is-info { background: #E6F1FB; color: #0C447C; }
.owSigIcon.is-success { background: #E1F5EE; color: #085041; }
.owSigIcon.is-pink { background: #FBEAF0; color: #72243E; }
.owSigTitle { font: 500 11.5px var(--font-sans); color: var(--foreground); margin-bottom: 2px; }
.owSigBody { font: 400 10.5px var(--font-sans); color: var(--muted-foreground); line-height: 1.45; text-wrap: pretty; }
.owSigTime { font: 400 10px var(--font-sans); color: var(--muted-foreground); opacity: 0.8; margin-top: 3px; }

.owCards { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-bottom: 16px; }
.owCard { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius-card); padding: 13px;
  transition: border-color var(--dur-fast) var(--ease-out); }
.owCard:hover { border-color: var(--border-strong); }
.owCard.isPinned { border-color: var(--green-9); }
.owCardTop { display: flex; align-items: flex-start; justify-content: space-between; gap: 7px; margin-bottom: 7px; }
.owCardTitle { font: 500 12px var(--font-sans); color: var(--foreground); line-height: 1.35; flex: 1; }
.owCardDesc { font: 400 11px var(--font-sans); color: var(--muted-foreground); line-height: 1.5; margin-bottom: 9px; text-wrap: pretty; }
.owCardMeta { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.owMeta { display: inline-flex; align-items: center; gap: 4px; font: 400 11px var(--font-sans); color: var(--muted-foreground); }
.owMeta svg { color: var(--muted-foreground); }
.owCardFoot { display: flex; align-items: center; justify-content: space-between; margin-top: 9px; padding-top: 7px;
  border-top: 1px solid var(--border); }
.owFootTime { font: 400 10px var(--font-sans); color: var(--muted-foreground); opacity: 0.8; }
.owDot { width: 6px; height: 6px; border-radius: var(--radius-full); background: #1D9E75; flex-shrink: 0; display: inline-block; }
.owDot.isWarn { background: #EF9F27; }
.owDot.isRed { background: #E24B4A; }

.owBarRow { display: flex; align-items: center; gap: 6px; margin-top: 8px; }
.owBarLabel { font: 400 10px var(--font-sans); color: var(--muted-foreground); white-space: nowrap; }
.owBarTrack { flex: 1; height: 4px; background: var(--muted); border-radius: 2px; overflow: hidden; }
.owBarFill { height: 100%; border-radius: 2px; }
.owBarVal { font: 400 10px var(--font-sans); color: var(--muted-foreground); white-space: nowrap; }

/* semantic tags */
.owTag { display: inline-flex; align-items: center; gap: 3px; padding: 2px 6px; border-radius: var(--radius-full);
  font: 500 10px var(--font-sans); white-space: nowrap; flex-shrink: 0; }
.owTag.t-sourcing { background: #FFF8E8; color: #854F0B; border: 1px solid #FAC775; }
.owTag.t-active { background: #E1F5EE; color: #085041; border: 1px solid #5DCAA5; }
.owTag.t-pilot { background: #EEEDFE; color: #3C3489; border: 1px solid #AFA9EC; }
.owTag.t-portfolio { background: #E6F1FB; color: #0C447C; border: 1px solid #85B7EB; }
.owTag.t-rfx { background: #EEEDFE; color: #3C3489; border: 1px solid #AFA9EC; }
.owTag.t-review { background: #FCEBEB; color: #A32D2D; border: 1px solid #F09595; }
.owTag.t-warm { background: #FFF8E8; color: #854F0B; border: 1px solid #FAC775; }
.owTag.t-icp { background: #E1F5EE; color: #085041; border: 1px solid #5DCAA5; }
.owTag.t-marketing { background: #FBEAF0; color: #72243E; border: 1px solid #ED93B1; }
.owTag.t-match { background: var(--green-9); color: oklch(0.99 0.01 155); border: 1px solid var(--green-9); padding: 2px 7px; }

.owShDesc { margin-bottom: 12px; font: 400 11px var(--font-sans); color: var(--muted-foreground); line-height: 1.5; text-wrap: pretty; }
.owWsGrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
.owWs { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius-card); padding: 13px;
  transition: border-color var(--dur-fast) var(--ease-out); }
.owWs:hover { border-color: var(--border-strong); }
.owWsHead { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.owWsAv { width: 30px; height: 30px; border-radius: 7px; background: var(--green-9); display: flex; align-items: center;
  justify-content: center; font: 500 9px var(--font-sans); color: oklch(0.99 0.01 155); flex-shrink: 0; }
.owWsAv.isInternal { background: var(--muted); border: 1px solid var(--border); color: var(--muted-foreground); }
.owWsName { font: 500 12px var(--font-sans); color: var(--foreground); }
.owWsName.isMuted { color: var(--muted-foreground); }
.owWsSub { font: 400 10px var(--font-sans); color: var(--muted-foreground); }
.owWsStats { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-bottom: 9px; }
.owWsStat { background: var(--muted); border-radius: var(--radius-input); padding: 6px 8px; }
.owWsStatV { font: 500 13px var(--font-sans); color: var(--foreground); }
.owWsStatL { font: 400 10px var(--font-sans); color: var(--muted-foreground); }
.owWsFoot { display: flex; align-items: center; justify-content: space-between; padding-top: 7px; border-top: 1px solid var(--border); }
.owWsFootL { font: 400 10px var(--font-sans); color: var(--muted-foreground); display: inline-flex; align-items: center; gap: 4px; }
.owOpenBtn { font: 400 10px var(--font-sans); padding: 3px 8px; border-radius: var(--radius-input); background: transparent;
  border: 1px solid var(--border-strong); color: var(--muted-foreground); cursor: pointer; }
.owOpenBtn:hover { background: var(--muted); color: var(--foreground); }
.owWs.isDashed { border-style: dashed; display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; gap: 5px; padding: 18px; min-height: 150px; color: var(--muted-foreground); }

.owArch { padding: 32px 0; text-align: center; color: var(--muted-foreground); }
.owArchT { font: 500 13px var(--font-sans); color: var(--muted-foreground); margin-top: 9px; }
.owArchD { font: 400 11px var(--font-sans); color: var(--muted-foreground); opacity: 0.85; margin-top: 3px; }