:root{--paper: #f7f5f0;--paper-deep: #f1eee6;--paper-card: #fdfcf8;--ink: #1a1a1a;--ink-2: #4a4a4a;--ink-3: #8a8580;--line: #d8d4ca;--line-strong: #a8a39a;--accent: #2d6a8e;--accent-soft: #d6e3eb;--warm: #b97c0e;--warm-soft: #f1e6cd;--normal: #4a7c4a;--exception: #a85050;--maturity-spec: #1a1a1a;--maturity-adopted: #4d3eaa;--maturity-experimental: #b97c0e;--sans: "Inter", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;--mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;--fz-xs: 11px;--fz-sm: 12px;--fz-md: 13px;--fz-lg: 15px;--radius-sm: 3px;--radius-md: 5px;--gap: 16px;--gap-sm: 8px;--gap-xs: 4px;--dot: 1px;--dot-step: 16px}*{box-sizing:border-box}html,body,#root{margin:0;padding:0;height:100%;font-family:var(--sans);font-size:var(--fz-md);color:var(--ink);background:var(--paper)}body{background-image:radial-gradient(circle at 1px 1px,var(--line) var(--dot),transparent var(--dot));background-size:var(--dot-step) var(--dot-step)}code,kbd,pre,.mono{font-family:var(--mono)}button{font:inherit;color:inherit;background:var(--paper-card);border:1px solid var(--line-strong);border-radius:var(--radius-sm);padding:4px 10px;cursor:pointer}button:hover{background:var(--paper-deep)}select{font:inherit;font-family:var(--mono);font-size:var(--fz-sm);color:var(--ink);background:var(--paper-card);border:1px solid var(--line-strong);border-radius:var(--radius-sm);padding:3px 6px}.app{display:grid;grid-template-rows:auto 1fr 180px;grid-template-columns:minmax(0,1fr) 260px 380px;grid-template-areas:"header header header" "stack  gutter yaml" "trace  trace  trace";height:100vh;width:100vw;overflow:hidden}.header{grid-area:header;display:flex;align-items:center;gap:var(--gap);padding:10px 16px;background:var(--paper-deep);border-bottom:1px solid var(--line-strong)}.header h1{font-size:var(--fz-md);font-weight:600;margin:0;letter-spacing:.02em}.header .spacer{flex:1}.header label{display:inline-flex;align-items:center;gap:6px;font-size:var(--fz-sm);color:var(--ink-2)}.pane{display:flex;flex-direction:column;min-height:0;min-width:0}.pane-title{font-family:var(--mono);font-size:var(--fz-xs);text-transform:uppercase;letter-spacing:.08em;color:var(--ink-3);padding:6px 12px;border-bottom:1px solid var(--line);background:var(--paper-deep)}.pane-body{flex:1;min-height:0;overflow:auto;padding:var(--gap)}.stack{grid-area:stack}.stack .pane-body{display:flex;flex-direction:column;gap:var(--gap)}.gutter{grid-area:gutter;border-left:1px solid var(--line)}.gutter .pane-body{display:flex;flex-direction:column;gap:var(--gap-sm)}.yaml{grid-area:yaml;border-left:1px solid var(--line-strong);background:var(--paper-card)}.yaml .pane-body{padding:0;font-family:var(--mono);font-size:var(--fz-sm)}.yaml-line{display:grid;grid-template-columns:40px 1fr;white-space:pre}.yaml-line .gutter-num{color:var(--ink-3);text-align:right;padding:0 8px 0 0;-webkit-user-select:none;user-select:none;border-right:1px solid var(--line)}.yaml-line .src{padding:0 12px}.yaml-line.highlight{background:var(--accent-soft)}.yaml-line.highlight .gutter-num{color:var(--accent);font-weight:500}.trace{grid-area:trace;border-top:1px solid var(--line-strong);background:var(--paper-card)}.trace .pane-body{padding:8px 16px;font-family:var(--mono);font-size:var(--fz-sm);color:var(--ink-3)}.card{background:var(--paper-card);border:1px solid var(--line-strong);border-radius:var(--radius-md);padding:0;cursor:pointer;transition:border-color .12s ease,box-shadow .12s ease}.card:hover{border-color:var(--ink-2)}.card.selected{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}.card-title{display:flex;align-items:baseline;gap:8px;padding:8px 12px;border-bottom:1px solid var(--line);background:var(--paper-deep);border-top-left-radius:var(--radius-md);border-top-right-radius:var(--radius-md)}.card-title .kind{font-family:var(--mono);font-size:var(--fz-xs);text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3)}.card-title .id{font-family:var(--mono);font-size:var(--fz-sm);color:var(--ink);font-weight:500}.card-title .badge{margin-left:auto;font-family:var(--mono);font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--ink-3);border:1px solid var(--line-strong);border-radius:999px;padding:1px 8px}.card-body{padding:10px 12px}.container-card .card-body{display:flex;flex-direction:column;gap:6px;font-family:var(--mono);font-size:var(--fz-sm);color:var(--ink-2)}.container-card .child-row{display:flex;gap:8px}.container-card .child-chip{border:1px dashed var(--line-strong);border-radius:var(--radius-sm);padding:2px 6px;font-size:var(--fz-xs)}.action-card{border-style:solid;box-shadow:inset 0 0 0 2px var(--paper-card),inset 0 0 0 3px var(--line)}.action-card .card-body{font-family:var(--mono);font-size:var(--fz-xs);color:var(--ink-2)}.action-card .ports{display:flex;gap:6px;margin-top:6px}.port{font-family:var(--mono);font-size:10px;border:1px solid var(--line-strong);border-radius:999px;padding:1px 8px;letter-spacing:.04em}.port.normal{border-color:var(--normal);color:var(--normal)}.port.exception{border-color:var(--exception);color:var(--exception)}