/* Phase 21 — Scientific Decision Workspace */
:root{
  --p21-navy:#0B1626;
  --p21-deep:#06101C;
  --p21-cyan:#20B8C5;
  --p21-teal:#0B7480;
  --p21-teal-hover:#095F68;
  --p21-white:#FFFFFF;
  --p21-fog:#F4F7F8;
  --p21-text:#364553;
  --p21-muted:#5C6B7A;
  --p21-line:#D9E2E8;
  --p21-control:#768797;
  --p21-success:#157348;
  --p21-warning:#925B0C;
  --p21-error:#B42318;
  --p21-info:#1D4ED8;
  --p21-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --p21-serif:Charter,"Bitstream Charter","Iowan Old Style","Source Serif 4",Georgia,"Times New Roman",serif;
  --p21-mono:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace;
}
*{box-sizing:border-box}
body{margin:0;background:var(--p21-fog);color:var(--p21-navy);font-family:var(--p21-sans)}
.p21-skip{position:fixed;left:12px;top:8px;z-index:3000;transform:translateY(-160%);padding:10px 14px;background:var(--p21-navy);color:#fff;border-radius:6px}
.p21-skip:focus{transform:none}
.p21-shell{display:grid;grid-template-columns:264px minmax(0,1fr);min-height:calc(100vh - 64px)}
.p21-main{min-width:0}
.p21-wrap{width:min(1180px,calc(100% - 48px));margin:0 auto;padding:28px 0 64px}
.p21-breadcrumbs{margin:0 0 16px;color:var(--p21-muted);font-size:14px}
.p21-breadcrumbs a{color:var(--p21-teal);text-decoration:underline;text-underline-offset:3px}
.p21-hero{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(260px,.75fr);gap:32px;align-items:end;padding:36px 38px;border:1px solid var(--p21-line);border-top:3px solid var(--p21-cyan);background:#fff}
.p21-kicker,.p21-step{margin:0 0 10px;color:var(--p21-teal);font-size:12px;font-weight:800;letter-spacing:.11em;text-transform:uppercase}
.p21-hero h1{max-width:800px;margin:0;font:700 clamp(36px,4.3vw,58px)/1.02 var(--p21-serif);letter-spacing:-.025em}
.p21-lead{max-width:72ch;margin:18px 0 0;color:var(--p21-text);font:400 18px/1.65 var(--p21-serif)}
.p21-hero-flow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;align-items:center;gap:8px;padding:16px;border:1px solid var(--p21-line);background:var(--p21-fog);font-size:13px;font-weight:700;text-align:center}
.p21-hero-flow b{color:var(--p21-cyan)}
.p21-scope{margin:18px 0 22px;padding:14px 16px;border-left:4px solid var(--p21-cyan);background:#fff;color:var(--p21-text);line-height:1.6}
.p21-card{margin:0 0 22px;padding:28px;border:1px solid var(--p21-line);background:#fff;border-radius:8px}
.p21-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:20px}
.p21-section-head h2,.p21-learning h2{margin:0;font:700 29px/1.15 var(--p21-serif)}
.p21-section-head p:not(.p21-step){max-width:75ch;margin:8px 0 0;color:var(--p21-muted);line-height:1.55}
.p21-actions{display:flex;gap:9px;flex-wrap:wrap;align-items:center}
.p21-btn{min-height:42px;padding:9px 14px;border:1px solid var(--p21-control);border-radius:6px;background:#fff;color:var(--p21-navy);font:700 14px/1.2 var(--p21-sans);cursor:pointer}
.p21-btn:hover{border-color:var(--p21-teal);color:var(--p21-teal)}
.p21-btn.primary{border-color:var(--p21-navy);background:var(--p21-navy);color:#fff}
.p21-btn.primary:hover{background:#122236}
.p21-btn.secondary{border-color:var(--p21-teal);color:var(--p21-teal)}
.p21-btn.ghost{border-color:var(--p21-line);background:var(--p21-fog)}
.p21-btn:disabled{cursor:not-allowed;opacity:.52}
.p21-btn:focus-visible,.p21-field input:focus-visible,.p21-field select:focus-visible,.p21-field textarea:focus-visible,.p21-table-wrap:focus-visible{outline:3px solid rgba(32,184,197,.34);outline-offset:2px}
.p21-context-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin-bottom:20px;background:var(--p21-line);border:1px solid var(--p21-line)}
.p21-context-grid>div{min-width:0;padding:14px;background:#fff}
.p21-context-grid span{display:block;margin-bottom:5px;color:var(--p21-muted);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.07em}
.p21-context-grid strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}
.p21-field{display:flex;flex-direction:column;gap:7px;min-width:0}
.p21-field label{font-size:13px;font-weight:800}
.p21-field input,.p21-field select,.p21-field textarea{width:100%;min-height:42px;padding:9px 11px;border:1px solid var(--p21-control);border-radius:5px;background:#fff;color:var(--p21-navy);font:400 14px/1.4 var(--p21-sans)}
.p21-field textarea{resize:vertical;min-height:130px}
.p21-field small{color:var(--p21-muted);line-height:1.4}
.p21-source-field{max-width:680px}
.p21-status{margin-top:14px;padding:10px 12px;border:1px solid var(--p21-line);background:var(--p21-fog);color:var(--p21-text);font-size:13px}
.p21-status.ok{border-color:#9FD2BC;background:#F1F8F5;color:#0C5C39}
.p21-status.err{border-color:#E7B2AE;background:#FFF4F3;color:#8D2019}
.p21-status.info{border-color:#B9C9F4;background:#F3F6FF;color:#163F9E}
.p21-toolbar{display:grid;grid-template-columns:minmax(220px,1.7fr) minmax(190px,.8fr) minmax(170px,.7fr) auto;gap:12px;align-items:end;margin-bottom:16px}
.p21-reset{margin-bottom:0}
.p21-table-wrap{overflow:auto;border:1px solid var(--p21-line);border-radius:5px}
.p21-table{width:100%;min-width:1020px;border-collapse:collapse;font-size:13px}
.p21-table th{padding:11px 10px;background:var(--p21-fog);border-bottom:1px solid var(--p21-control);text-align:left;color:var(--p21-text);font-size:11px;text-transform:uppercase;letter-spacing:.06em}
.p21-table td{padding:12px 10px;border-bottom:1px solid var(--p21-line);vertical-align:top}
.p21-table tbody tr:last-child td{border-bottom:0}
.p21-table tbody tr:hover{background:#F9FBFC}
.p21-table code,.p21-seq{font-family:var(--p21-mono);font-size:12px;overflow-wrap:anywhere}
.p21-score{font-variant-numeric:tabular-nums;font-weight:800}
.p21-metric-list{display:flex;gap:6px;flex-wrap:wrap}
.p21-metric{display:inline-flex;padding:3px 6px;border:1px solid var(--p21-line);border-radius:4px;background:var(--p21-fog);white-space:nowrap;font-size:11px}
.p21-warning-list{margin:0;padding-left:17px;color:#6E4609}
.p21-warning-list li+li{margin-top:4px}
.p21-none{color:var(--p21-muted)}
.p21-table-note{margin:8px 0 0;color:var(--p21-muted);font-size:12px}
.p21-compare-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.p21-compare-card{min-width:0;border:1px solid var(--p21-line);border-top:3px solid var(--p21-cyan);border-radius:6px;padding:17px;background:#fff}
.p21-compare-card h3{margin:0 0 6px;font-size:18px}
.p21-compare-type{margin:0 0 14px;color:var(--p21-muted);font-size:12px}
.p21-compare-card dl{display:grid;grid-template-columns:minmax(110px,.6fr) minmax(0,1fr);gap:7px 10px;margin:14px 0 0}
.p21-compare-card dt{color:var(--p21-muted);font-size:12px}
.p21-compare-card dd{margin:0;font-size:12px;overflow-wrap:anywhere}
.p21-empty{grid-column:1/-1;padding:28px;border:1px dashed var(--p21-control);background:var(--p21-fog);color:var(--p21-muted);text-align:center}
.p21-provenance{display:grid;grid-template-columns:minmax(190px,.45fr) minmax(0,1fr);gap:0;margin:0;border:1px solid var(--p21-line)}
.p21-provenance dt,.p21-provenance dd{margin:0;padding:10px 12px;border-bottom:1px solid var(--p21-line)}
.p21-provenance dt{background:var(--p21-fog);color:var(--p21-muted);font-size:12px;font-weight:800}
.p21-provenance dd{font-family:var(--p21-mono);font-size:12px;overflow-wrap:anywhere}
.p21-provenance dt:last-of-type,.p21-provenance dd:last-of-type{border-bottom:0}
.p21-decision-card{border-top:3px solid var(--p21-navy)}
.p21-decision-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
.p21-checks{margin:16px 0;padding:14px 16px;border:1px solid var(--p21-line);border-radius:5px}
.p21-checks legend{padding:0 6px;font-size:13px;font-weight:800}
.p21-checks label{display:flex;align-items:flex-start;gap:9px;margin:8px 0;color:var(--p21-text);line-height:1.45}
.p21-checks input{width:18px;height:18px;flex:none;margin-top:1px}
.p21-learning{padding:34px 36px;background:var(--p21-deep);color:#fff}
.p21-learning .p21-kicker{color:var(--p21-cyan)}
.p21-learning h2{color:#fff}
.p21-learning p:last-child{max-width:80ch;margin:14px 0 0;color:#B6C6D6;line-height:1.65}
.p21-demo-badge{display:inline-flex;margin-left:7px;padding:2px 6px;border-radius:3px;background:#FFF3D8;color:#744907;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.p21-evidence-badge{display:inline-flex;padding:2px 6px;border:1px solid var(--p21-line);border-radius:3px;background:var(--p21-fog);color:var(--p21-text);font-size:10px;font-weight:800;text-transform:uppercase}
html[data-theme="dark"] body{background:#0B1626;color:#fff}
html[data-theme="dark"] .p21-hero,html[data-theme="dark"] .p21-card{background:#122236;border-color:#36506A}
html[data-theme="dark"] .p21-scope,html[data-theme="dark"] .p21-context-grid>div,html[data-theme="dark"] .p21-compare-card{background:#122236;color:#fff}
html[data-theme="dark"] .p21-context-grid,html[data-theme="dark"] .p21-provenance{border-color:#36506A;background:#36506A}
html[data-theme="dark"] .p21-field input,html[data-theme="dark"] .p21-field select,html[data-theme="dark"] .p21-field textarea{background:#0F1D2D;border-color:#657C93;color:#fff}
html[data-theme="dark"] .p21-table th,html[data-theme="dark"] .p21-status,html[data-theme="dark"] .p21-metric,html[data-theme="dark"] .p21-provenance dt,html[data-theme="dark"] .p21-empty{background:#0F1D2D}
html[data-theme="dark"] .p21-table td,html[data-theme="dark"] .p21-table-wrap,html[data-theme="dark"] .p21-provenance dt,html[data-theme="dark"] .p21-provenance dd{border-color:#36506A}
html[data-theme="dark"] .p21-table tbody tr:hover{background:#15283D}
html[data-theme="dark"] .p21-btn{background:#122236;border-color:#657C93;color:#fff}
html[data-theme="dark"] .p21-btn.primary{background:var(--p21-cyan);border-color:var(--p21-cyan);color:var(--p21-navy)}
html[data-theme="dark"] .p21-btn.secondary{color:#8FE4EA;border-color:#20B8C5}
html[data-theme="dark"] .p21-muted,html[data-theme="dark"] .p21-section-head p:not(.p21-step),html[data-theme="dark"] .p21-field small,html[data-theme="dark"] .p21-table-note{color:#B6C6D6}
@media(max-width:1000px){
  .p21-hero{grid-template-columns:1fr}
  .p21-context-grid{grid-template-columns:1fr 1fr}
  .p21-toolbar{grid-template-columns:1fr 1fr}
  .p21-compare-grid{grid-template-columns:1fr}
}
@media(max-width:900px){
  .p21-shell{display:block}
  .p21-wrap{width:min(100% - 32px,1180px);padding-top:20px}
}
@media(max-width:700px){
  .p21-wrap{width:min(100% - 28px,1180px)}
  .p21-hero,.p21-card,.p21-learning{padding:22px 18px}
  .p21-hero h1{font-size:36px}
  .p21-hero-flow{grid-template-columns:1fr;justify-items:start;text-align:left}
  .p21-hero-flow b{transform:rotate(90deg);margin-left:17px}
  .p21-section-head{display:block}
  .p21-section-head .p21-actions{margin-top:16px}
  .p21-actions .p21-btn{width:100%}
  .p21-context-grid,.p21-toolbar,.p21-decision-grid{grid-template-columns:1fr}
  .p21-provenance{grid-template-columns:1fr}
  .p21-provenance dt{border-bottom:0;padding-bottom:3px}
  .p21-provenance dd{padding-top:3px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}
