/* Cobalt Pearl: a need connects to scoped work and its evidence. */
.platform-page .wc-explorer { grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr); background:transparent; border:0; gap:64px; }
.wc-needs { min-width:0; padding-top:24px; }
.platform-page .pf-main .wc-caption { color:var(--pearl-muted); font:400 12px/1.6 var(--pearl-font-mono); margin:0 0 12px; }
.wc-needs .pf-tabs { padding:0; border:0; background:transparent; gap:12px; }
.platform-page .wc-need { min-height:76px; margin:0; padding:20px 24px; border:1px solid var(--pearl-line); border-radius:var(--pearl-radius-panel); background:var(--pearl-panel); justify-content:space-between; position:relative; }
.wc-need[aria-selected=true] { border-color:var(--pearl-motion-data); background:var(--pearl-alt); color:var(--pearl-ink); }
.wc-need[aria-selected=true]:after { content:""; position:absolute; width:65px; left:100%; top:50%; border-top:1px solid var(--pearl-motion-data); }
.wc-port { width:8px; height:8px; border:1px solid var(--pearl-strong); border-radius:50%; flex:none; }
.wc-need[aria-selected=true] .wc-port { background:var(--pearl-motion-data); border-color:var(--pearl-motion-data); }
.platform-page .pf-main .wc-scope { margin:24px 0 0; font-size:14px; line-height:1.6; color:var(--pearl-muted); max-width:38ch; }
.wc-panels { min-width:0; border-left:1px solid var(--pearl-motion-data); }
.wc-panel { border:1px solid var(--pearl-line); border-left:0; padding:32px; background:var(--pearl-panel); }
.wc-panel[hidden] { display:none; }
.wc-panel:not([hidden])~.wc-panel:not([hidden]) { margin-top:24px; }
.wc-capability { display:flex; align-items:center; position:relative; gap:24px; padding-bottom:24px; border-bottom:1px solid var(--pearl-line); }
.wc-capability>svg { width:72px; height:72px; flex:none; }
.wc-capability .wc-caption { margin-bottom:8px; }
.wc-handoff { list-style:none; margin:0; padding:0; }
.wc-handoff li { display:grid; grid-template-columns:120px minmax(0,1fr); gap:32px; padding:24px 0; border-bottom:1px solid var(--pearl-line); }
.platform-page .pf-main .wc-handoff h4 { font:600 17px/1.5 var(--pearl-font-display); margin:0; color:var(--pearl-ink); }
.wc-handoff h4 span { display:block; }
.platform-page .pf-main .wc-handoff p { color:var(--pearl-muted); margin:0; font-size:16px; line-height:1.7; }
.wc-evidence { display:flex; gap:20px; align-items:center; padding-top:24px; }
.wc-evidence>svg { width:52px; height:52px; flex:none; stroke:var(--pearl-motion-data); }
.platform-page .pf-main .wc-evidence p { margin:0; }
.platform-page .pf-main .wc-evidence .wc-caption { margin-bottom:4px; }
@media(max-width:1100px) { .platform-page .wc-explorer { gap:32px; grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr); } .wc-need[aria-selected=true]:after { width:33px; } .wc-handoff li { grid-template-columns:1fr; gap:12px; } .wc-handoff h4 span { display:inline; } .wc-handoff h4 span+span:before { content:" "; } }
@media(max-width:760px) { .platform-page .wc-explorer { grid-template-columns:1fr; gap:24px; } .wc-needs { padding:0; } .wc-needs .pf-tabs[role=tablist] { display:flex; flex-direction:column; } .wc-need[aria-selected=true]:after { content:none; } .wc-panels { border-left:0; } .wc-panel { border-left:1px solid var(--pearl-line); } .wc-capability>svg { width:56px; height:56px; } .platform-page .pf-main .wc-scope { max-width:none; } }
@media(max-width:480px) { .wc-panel { padding:24px 20px; } .wc-capability { gap:16px; } .platform-page .pf-main .wc-capability h3 { font-size:20px; } }
@media(prefers-reduced-motion:no-preference) { .wc-need { transition:background-color 160ms ease-out,border-color 160ms ease-out; } }