:root{--color-bg: #f0f4f8;--color-surface: #ffffff;--color-surface-elevated: #e8eef4;--color-border: #d0dae4;--color-text: #1a2332;--color-text-muted: #5c6b7e;--color-accent: #0969da;--color-accent-hover: #0550ae;--color-success: #1a7f37;--color-warning: #9a6700;--color-danger: #cf222e;--color-disputed: #cf222e;--color-demo-match: #1a7f37;--color-demo-mismatch: #cf222e;--color-demo-frozen: #9a6700;--font-sans: "IBM Plex Sans", system-ui, sans-serif;--font-mono: "IBM Plex Mono", ui-monospace, monospace;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-6: 1.5rem;--space-8: 2rem;--radius: 6px;--radius-lg: 8px}*{box-sizing:border-box}body{margin:0;font-family:var(--font-sans);font-size:var(--text-base);color:var(--color-text);background:var(--color-bg);line-height:1.5}#root{min-height:100vh}a{color:var(--color-accent);text-decoration:none}a:hover{color:var(--color-accent-hover);text-decoration:underline}code,.mono{font-family:var(--font-mono);font-size:var(--text-sm)}.app-shell{display:flex;flex-direction:column;min-height:100vh}.app-banner{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-3) var(--space-6);background:var(--color-surface);border-bottom:1px solid var(--color-border)}.app-body{display:flex;flex:1;min-height:0}.app-nav{width:236px;flex-shrink:0;background:var(--color-surface);border-right:1px solid var(--color-border);padding:var(--space-4)}.app-brand-title{font-size:var(--text-lg);font-weight:700;letter-spacing:.02em}.app-banner .app-brand-tags{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.app-brand-tags{margin-top:0;display:flex;flex-wrap:wrap;gap:6px}.app-tag{display:inline-block;font-size:11px;color:var(--color-text-muted);border:1px solid var(--color-border);border-radius:999px;padding:2px 8px;line-height:1.2}.app-nav h2{font-size:var(--text-sm);text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-muted);margin:0 0 var(--space-3)}.app-nav ul{list-style:none;padding:0;margin:0}.app-nav li{margin-bottom:var(--space-1)}.app-nav a{display:block;padding:var(--space-2) var(--space-3);border-radius:var(--radius);color:var(--color-text)}.app-nav a:hover{background:var(--color-surface-elevated)}.app-nav a.active{background:var(--color-surface-elevated);color:var(--color-accent)}.app-main{flex:1;padding:var(--space-6);max-width:min(1600px,92vw);margin:0 auto;width:100%}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4);margin-bottom:var(--space-4)}.card h3{margin:0 0 var(--space-3);font-size:var(--text-sm);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em}.data-table{width:100%;border-collapse:collapse;font-size:var(--text-sm)}.data-table.data-table--fixed{table-layout:fixed;min-width:1000px}.data-table.data-table--wide{min-width:1280px}.data-table th,.data-table td{padding:var(--space-2) var(--space-3);text-align:left;border-bottom:1px solid var(--color-border)}.data-table th{color:var(--color-text-muted);font-weight:600}.data-table tr:hover td{background:var(--color-surface-elevated)}.data-table .cell-nowrap{white-space:nowrap}.data-table .cell-num{white-space:nowrap;min-width:5rem;text-align:right}.cell-service{white-space:nowrap}.cell-service .service-badge{display:inline-block;font-size:var(--text-xs);padding:2px 8px;border-radius:999px;background:var(--color-surface-elevated);border:1px solid var(--color-border);color:var(--color-text)}.badge{display:inline-block;padding:var(--space-1) var(--space-2);border-radius:var(--radius);font-size:var(--text-xs);font-weight:600}.badge--proposed{background:var(--color-warning);color:#fff}.badge--finalized{background:var(--color-success);color:#fff}.badge--disputed{background:var(--color-disputed);color:#fff}.badge--pending{background:var(--color-warning);color:#fff}.badge--paid{background:var(--color-success);color:#fff}.badge--open{background:var(--color-danger);color:#fff}.badge--dismissed,.badge--upheld{background:var(--color-text-muted);color:#fff}input,select,button{font-family:inherit;font-size:var(--text-sm)}input,select{padding:var(--space-2) var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius);background:var(--color-bg);color:var(--color-text);min-width:160px}button,.button{display:inline-block;padding:var(--space-2) var(--space-4);border-radius:var(--radius);border:1px solid var(--color-border);background:var(--color-surface-elevated);color:var(--color-text);cursor:pointer;font-family:inherit;font-size:var(--text-sm);text-decoration:none;text-align:center}a.button:hover{background:var(--color-surface-elevated)}button.primary,a.button.primary{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}button.primary:hover,a.button.primary:hover{background:var(--color-accent-hover);color:#fff}button.danger,a.button.danger{background:var(--color-danger);color:#fff;border-color:var(--color-danger)}button.danger:hover,a.button.danger:hover{color:#fff}button:disabled{opacity:.5;cursor:not-allowed}.error-banner{background:#cf222e1a;border:1px solid var(--color-danger);border-radius:var(--radius);padding:var(--space-3);margin-bottom:var(--space-4)}.error-banner .error-code{font-weight:600;font-family:var(--font-mono)}.freeze-banner{background:#cf222e1f;border:1px solid var(--color-disputed);border-radius:var(--radius);padding:var(--space-3);margin-bottom:var(--space-4);font-weight:500}.demo-page h1{font-size:2.2rem;line-height:1.15}.demo-page>p{font-size:var(--text-lg)}.demo-pipeline{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-2);margin-bottom:var(--space-3)}.demo-stage-card{background:linear-gradient(180deg,var(--color-surface-elevated),var(--color-surface));border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-2) var(--space-3)}.demo-stage-card h4{margin:0 0 6px;font-size:var(--text-lg)}.demo-stage-card p{margin:0 0 6px;color:var(--color-text-muted);font-size:var(--text-xs);line-height:1.35}.demo-stage-card strong{font-family:var(--font-mono);font-size:var(--text-xs)}.demo-stage-index{width:18px;height:18px;border-radius:999px;border:1px solid var(--color-border);font-size:var(--text-xs);display:inline-flex;align-items:center;justify-content:center;margin-bottom:var(--space-2);color:var(--color-text-muted)}.demo-controls-wrap .card{padding:var(--space-3);margin-bottom:var(--space-3)}.demo-controls-wrap h3{margin-bottom:var(--space-2)}.demo-controls-wrap input,.demo-controls-wrap select{min-width:128px;padding:7px 10px}.demo-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(380px,520px);gap:var(--space-4)}.demo-layout>div:first-child{min-width:0;overflow-x:auto}.demo-layout>div:last-child{min-width:0;overflow:visible;overflow-wrap:break-word}.demo-layout>div:last-child .card{min-width:0;overflow:visible}.demo-layout .card .evidence-panel-header{word-break:break-all;font-size:var(--text-sm)}.demo-layout .card .evidence-panel-header strong{font-weight:600}.demo-layout .card.evidence-compare-card{border:none;padding:0;margin-top:var(--space-3);box-shadow:none;background:transparent}.demo-layout .card.evidence-compare-card .mono,.demo-layout .card.evidence-compare-card td{word-break:break-all;font-size:var(--text-sm)}.demo-layout .card.evidence-compare-card table{max-width:100%;table-layout:fixed}.demo-layout .card.evidence-compare-card dd{word-break:break-all;min-width:0}@media (max-width: 900px){.demo-pipeline{grid-template-columns:1fr 1fr}.demo-layout{grid-template-columns:1fr}}@media (max-width: 560px){.demo-pipeline{grid-template-columns:1fr}}.settlement-detail-layout{display:grid;grid-template-columns:1fr minmax(320px,400px);gap:var(--space-6);align-items:start}.execution-gate-wrap{position:sticky;top:var(--space-4)}.execution-gate-wrap .card,.execution-gate-wrap .action-panel{margin-bottom:var(--space-4)}@media (max-width: 900px){.settlement-detail-layout{grid-template-columns:1fr}.execution-gate-wrap{position:static}}
