.architecture-board{border-block:1px solid var(--line);min-width:0;color:var(--text-2);font-family:var(--font-sans);grid-template-columns:minmax(0,1fr);grid-template-areas:"stage""inspector""legend""text";display:grid}.architecture-board--external-inspector{grid-template-areas:"stage""legend""text"}.architecture-board__stage{background-color:var(--surface-2);grid-area:stage;min-width:0}.architecture-board__toolbar{border-bottom:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 24px;padding:12px 16px;display:flex}.architecture-board__caption{color:var(--text-2);font:500 var(--fs-label)/1.4 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;font-variant-numeric:tabular-nums;margin:0}.architecture-board__hint{max-width:none;color:var(--text-2);font:400 var(--fs-label)/1.4 var(--font-mono);flex-wrap:wrap;align-items:center;gap:4px 8px;margin:0;display:flex}.architecture-board__hint-glyph{width:12px;height:14px;fill:var(--domain,var(--text-2));flex:none}.architecture-board__hint-sep{color:var(--text-3)}.architecture-board__key{border:1px solid var(--line-strong);background:var(--surface-1);min-width:20px;height:20px;color:var(--text-1);font:500 var(--fs-label)/1 var(--font-mono);border-bottom-width:2px;border-radius:2px;place-items:center;padding:0 4px;display:inline-grid}.architecture-board__canvas{overscroll-behavior-inline:contain;scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent;overflow:auto hidden}.architecture-board__canvas::-webkit-scrollbar{height:6px}.architecture-board__canvas::-webkit-scrollbar-track{background:0 0}.architecture-board__canvas::-webkit-scrollbar-thumb{background:var(--line-strong)}.architecture-board__svg{width:100%;min-width:var(--board-min-width,960px);max-width:var(--board-max-width,none);height:auto;margin-inline:auto;display:block;overflow:visible}.architecture-board__scroll-hint{color:var(--text-2);font:500 var(--fs-label)/1.4 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;margin:0;padding:8px 16px 12px;display:none}.architecture-board__scroll-hint-icon{margin-right:4px}.architecture-board__lane{fill:#0000}.architecture-board__lane--alt{fill:var(--surface-1);fill-opacity:.55}.architecture-board__lane-sep{stroke:var(--line);stroke-width:1px;stroke-dasharray:2 4}.architecture-board__layer{font:500 12px/1 var(--font-mono);letter-spacing:.08em}.architecture-board__layer-index{fill:var(--domain,var(--text-2))}.architecture-board__layer-name{fill:var(--text-2)}.architecture-board__layer-rule{stroke:var(--line-strong);stroke-width:1px}.architecture-board__node{cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:opacity var(--dur-2) var(--ease-out);outline:none}.architecture-board__node-shape{fill:var(--surface-1);stroke:color-mix(in srgb, var(--domain,var(--text-2)) 55%, var(--line-strong));stroke-width:1px;transition:stroke var(--dur-1) var(--ease-out), fill var(--dur-1) var(--ease-out)}.architecture-board__node--external .architecture-board__node-shape{stroke-dasharray:5 3}.architecture-board__node-detail{fill:none;stroke:var(--line-strong);stroke-width:1px}.architecture-board__node-divider{stroke:var(--line);stroke-width:1px}.architecture-board__node-glyph{fill:none;stroke:var(--domain,var(--text-2));stroke-width:1.25px;stroke-linecap:round;stroke-linejoin:round}.architecture-board__node-plus{fill:none;stroke:var(--text-3);stroke-width:1.25px;stroke-linecap:square;transition:stroke var(--dur-1) var(--ease-out)}.architecture-board__node-type{fill:var(--text-2);font:500 12px/1 var(--font-mono);letter-spacing:.1em}.architecture-board__node-title{fill:var(--text-1);font:500 15px/1 var(--font-sans);letter-spacing:-.01em}.architecture-board__node-tech{fill:var(--text-2);font:400 12px/1 var(--font-mono)}.architecture-board__node-focus{fill:none;stroke:var(--accent);stroke-width:2px;opacity:0}.architecture-board__node:focus-visible .architecture-board__node-focus{opacity:1}.architecture-board__node:hover .architecture-board__node-shape,.architecture-board__node:focus-visible .architecture-board__node-shape{stroke:var(--domain,var(--text-2));fill:var(--surface-2)}.architecture-board__node:hover .architecture-board__node-plus,.architecture-board__node:focus-visible .architecture-board__node-plus,.architecture-board__node.is-selected .architecture-board__node-plus{stroke:var(--domain,var(--text-1))}.architecture-board__node.is-emphasis .architecture-board__node-shape{stroke:var(--domain,var(--text-2));stroke-width:1.5px}.architecture-board__node.is-selected .architecture-board__node-shape{stroke:var(--domain,var(--text-2));stroke-width:2px;fill:var(--surface-2)}.architecture-board__node.is-selected .architecture-board__node-type{fill:var(--domain,var(--text-2))}.architecture-board__node.is-muted{opacity:.55}.architecture-board__node-ring{fill:none;stroke:var(--domain,var(--text-2));stroke-width:1.5px;opacity:0;pointer-events:none;transform-box:fill-box;transform-origin:50%}.architecture-board__node.is-hinting .architecture-board__node-ring{animation:architecture-board-ring 1.4s var(--ease-out) 1}@keyframes architecture-board-ring{0%{opacity:.9;transform:scale(1)}to{opacity:0;transform:scale(1.14,1.3)}}.architecture-board__edge{transition:opacity var(--dur-2) var(--ease-out)}.architecture-board__edge-line{fill:none;stroke:var(--domain,var(--text-2));stroke-opacity:.62;stroke-width:1.5px;transition:stroke-opacity var(--dur-2) var(--ease-out), stroke-width var(--dur-2) var(--ease-out)}.architecture-board__edge--async .architecture-board__edge-line{stroke-dasharray:6 4}.architecture-board__edge--external .architecture-board__edge-line{stroke-width:1.25px;stroke-dasharray:1 3;stroke-linecap:round}.architecture-board__edge--secure .architecture-board__edge-line{stroke-width:4.5px}.architecture-board__edge-inner{fill:none;stroke:var(--surface-2);stroke-width:1.5px}.architecture-board__edge-head{fill:none;stroke:none}.architecture-board__arrow{fill:var(--domain,var(--text-2))}.architecture-board__edge.is-emphasis .architecture-board__edge-line{stroke-opacity:1;stroke-width:2.25px}.architecture-board__edge--secure.is-emphasis .architecture-board__edge-line{stroke-width:5px}.architecture-board__edge.is-muted,.architecture-board__edge-label.is-muted,.architecture-board__packet.is-muted{opacity:.55}.architecture-board__draw{fill:none;stroke-width:14px;stroke-linecap:square;stroke-dasharray:1 1;stroke-dashoffset:0}.architecture-board__edge-label{transition:opacity var(--dur-2) var(--ease-out);pointer-events:none}.architecture-board__edge-label-bg{fill:var(--bg);stroke:var(--line);stroke-width:1px}.architecture-board__edge-label-text{fill:var(--text-2);font:400 12px/1 var(--font-mono);transition:fill var(--dur-1) var(--ease-out)}.architecture-board__edge-lock,.architecture-board__edge-doc .architecture-board__packet-doc{fill:none;stroke:var(--domain,var(--text-2));stroke-width:1px}.architecture-board__edge-doc .architecture-board__packet-fold{stroke:var(--domain,var(--text-2))}.architecture-board__edge-label.is-emphasis .architecture-board__edge-label-text{fill:var(--text-1)}.architecture-board__edge-label.is-emphasis .architecture-board__edge-label-bg{stroke:var(--domain,var(--line-strong))}.architecture-board__packet{pointer-events:none;will-change:transform, opacity}.architecture-board__packet-doc{fill:var(--domain,var(--text-2))}.architecture-board__packet-fold{fill:none;stroke:var(--bg);stroke-width:1px}.architecture-board__packet-lock{fill:none;stroke:var(--text-1);stroke-width:1px}.architecture-board__packet-chip{fill:var(--bg);stroke:var(--domain,var(--line-strong));stroke-width:1px}.architecture-board__packet-text{fill:var(--text-1);font:500 9px/1 var(--font-mono);letter-spacing:.04em}.architecture-board__packet--parked,.architecture-board.is-static-flow .architecture-board__packet{display:none}.architecture-board.is-static-flow .architecture-board__packet--parked{opacity:1;display:inline}.architecture-board.is-pending .architecture-board__packet{visibility:hidden}.architecture-board.is-pending .architecture-board__node-body{opacity:0;transform:translateY(8px)}.architecture-board.is-pending .architecture-board__draw{stroke-dashoffset:1px}.architecture-board.is-pending .architecture-board__edge-label{opacity:0}.architecture-board.is-revealing .architecture-board__node-body{transition:opacity var(--dur-3) var(--ease-out) var(--delay,0s), transform var(--dur-3) var(--ease-out) var(--delay,0s)}.architecture-board.is-revealing .architecture-board__draw{transition:stroke-dashoffset var(--dur-3) var(--ease-out) var(--delay,0s)}.architecture-board.is-revealing .architecture-board__edge-label{transition:opacity var(--dur-2) var(--ease-out) var(--delay,0s)}.architecture-board__inspector{border-top:1px solid var(--line);background-color:var(--surface-1);grid-area:inspector;min-width:0;padding:24px 16px}.architecture-board__inspector-kicker,.architecture-board__connections-heading,.architecture-board__legend-heading,.architecture-board__text-summary{color:var(--text-2);font:500 var(--fs-label)/1.4 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;margin:0}.architecture-board__inspector-kicker{margin-bottom:16px}.architecture-board__inspector.is-empty .architecture-board__inspector-kicker{color:var(--domain,var(--text-2))}.architecture-board__inspector-title{color:var(--text-1);font:500 1.5rem/1.15 var(--font-sans);letter-spacing:-.02em;margin:0}.architecture-board__meta{border-block:1px solid var(--line);gap:8px;margin:16px 0;padding-block:16px;display:grid}.architecture-board__meta-row{grid-template-columns:96px minmax(0,1fr);align-items:baseline;gap:16px;display:grid}.architecture-board__meta dt{color:var(--text-2);font:500 var(--fs-label)/1.4 var(--font-mono);letter-spacing:.12em;text-transform:uppercase}.architecture-board__meta dd{color:var(--text-1);font-size:var(--fs-small);margin:0;line-height:1.5}.architecture-board__inspector-description{color:var(--text-2);font-size:var(--fs-small);margin:0 0 24px;line-height:1.6}.architecture-board__inspector.is-empty .architecture-board__inspector-description{margin-top:12px}.architecture-board__inspector-detail{border-left:2px solid var(--domain,var(--line-strong));gap:8px;margin-bottom:24px;padding-left:12px;display:grid}.architecture-board__inspector-detail .architecture-board__inspector-description{color:var(--text-1);margin:0}.architecture-board__connections+.architecture-board__connections{margin-top:16px}.architecture-board__connections-heading{margin-bottom:4px}.architecture-board__connections-list{margin:0;padding:0;list-style:none}.architecture-board__connection{border:0;border-top:1px solid var(--line);width:100%;min-height:44px;color:var(--text-1);font:inherit;font-size:var(--fs-small);text-align:left;cursor:pointer;background:0 0;border-radius:0;grid-template-columns:16px minmax(0,1fr);align-items:baseline;gap:0 8px;padding:8px 0;display:grid}.architecture-board__connection-icon{color:var(--text-2);font-family:var(--font-mono);transition:transform var(--dur-1) var(--ease-out), color var(--dur-1) var(--ease-out)}.architecture-board__connection-name{transition:color var(--dur-1) var(--ease-out);line-height:1.4}.architecture-board__connection-meta{color:var(--text-2);font:400 var(--fs-label)/1.4 var(--font-mono);grid-column:2}.architecture-board__connection:hover .architecture-board__connection-name,.architecture-board__connection:focus-visible .architecture-board__connection-name{color:var(--domain,var(--text-1))}.architecture-board__connection:hover .architecture-board__connection-icon,.architecture-board__connection:focus-visible .architecture-board__connection-icon{color:var(--domain,var(--text-2));transform:translate(2px)}.architecture-board__connection:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.architecture-board__legend{border-top:1px solid var(--line);background-color:var(--surface-2);flex-wrap:wrap;grid-area:legend;align-items:center;gap:12px 24px;padding:16px;display:flex}.architecture-board__legend-list{flex-wrap:wrap;gap:8px 24px;margin:0;padding:0;list-style:none;display:flex}.architecture-board__legend-item{color:var(--text-2);font:400 var(--fs-label)/1.4 var(--font-mono);align-items:center;gap:8px;display:inline-flex}.architecture-board__legend-sample{width:40px;height:12px;display:block;overflow:visible}.architecture-board__text{border-top:1px solid var(--line);background-color:var(--surface-2);grid-area:text;padding:0 16px}.architecture-board__text-summary{cursor:pointer;align-items:center;gap:8px;min-height:44px;list-style:none;display:flex}.architecture-board__text-summary::-webkit-details-marker{display:none}.architecture-board__text-summary:before{content:"+";width:12px;color:var(--text-2)}.architecture-board__text[open] .architecture-board__text-summary:before{content:"−"}.architecture-board__text-summary:hover{color:var(--text-1)}.architecture-board__text-summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.architecture-board__text-list{max-width:72ch;color:var(--text-2);font-size:var(--fs-small);gap:4px;margin:0;padding:0 0 16px 1.5em;line-height:1.6;display:grid}.architecture-board__text-list li::marker{color:var(--text-2);font-family:var(--font-mono)}@media (width>=1100px){.architecture-board{grid-template:"stage stage""inspector legend""inspector text"1fr/minmax(0,1fr) minmax(0,1fr)}.architecture-board--external-inspector{grid-template-rows:auto auto;grid-template-areas:"stage stage""legend text"}.architecture-board__inspector{border-right:1px solid var(--line);padding:24px}.architecture-board--external-inspector .architecture-board__text{border-left:1px solid var(--line)}}@media (width<=1023px){.architecture-board__scroll-hint{display:block}}@media (width<=560px){.architecture-board__hint{display:none}}.flow-preview{width:100%;min-width:0;position:relative}.flow-preview__svg{width:100%;height:auto;display:block;overflow:visible}.flow-preview__layer{fill:var(--text-3);font-family:var(--font-mono);letter-spacing:.04em;font-weight:500}.flow-preview__rule{stroke:var(--line);stroke-width:1px}.flow-preview__edge{fill:none;stroke:var(--line-strong);stroke-width:1px}.flow-preview__edge--async{stroke-dasharray:3 2.5}.flow-preview__edge--external{stroke-width:.6px}.flow-preview__tick,.flow-preview__arrow{fill:var(--line-strong)}.flow-preview__lit{opacity:0;transition:opacity var(--dur-1) var(--ease-out)}.flow-preview__lit .flow-preview__edge{stroke:var(--domain,var(--text-2))}.flow-preview__lit .flow-preview__tick,.flow-preview__arrow--lit{fill:var(--domain,var(--text-2))}.flow-preview__draw{fill:none;stroke-width:8px;stroke-linecap:square;stroke-dasharray:1 1;stroke-dashoffset:1px}.flow-preview__mark{fill:none;stroke:var(--line-strong);stroke-width:1px;transition:stroke var(--dur-2) var(--ease-out), fill var(--dur-2) var(--ease-out)}.flow-preview__mark--external{stroke-dasharray:1.5 1.5}.flow-preview__mark--output{fill:var(--line-strong)}.flow-preview__mark-detail{fill:none;stroke:var(--line-strong);stroke-width:1px;transition:stroke var(--dur-2) var(--ease-out), fill var(--dur-2) var(--ease-out)}.flow-preview__mark-detail--fill{fill:var(--line-strong);stroke:none}.flow-preview__label{fill:var(--text-3);font-family:var(--font-mono);transition:fill var(--dur-2) var(--ease-out)}.flow-preview.is-active .flow-preview__lit{opacity:1}.flow-preview.is-active .flow-preview__draw{stroke-dashoffset:0;transition:stroke-dashoffset var(--dur-3) var(--ease-out) calc(var(--layer,0) * 80ms)}.flow-preview.is-active .flow-preview__mark{stroke:var(--domain,var(--text-2));transition-delay:calc(var(--layer,0) * 80ms)}.flow-preview.is-active .flow-preview__mark--output,.flow-preview.is-active .flow-preview__mark-detail--fill{fill:var(--domain,var(--text-2))}.flow-preview.is-active .flow-preview__mark-detail:not(.flow-preview__mark-detail--fill){stroke:var(--domain,var(--text-2))}.flow-preview.is-active .flow-preview__label{fill:var(--text-2)}@media (prefers-reduced-motion:reduce){.architecture-board *,.flow-preview *{transition:none!important}.architecture-board__node.is-hinting .architecture-board__node-ring{animation:none}.architecture-board.is-pending .architecture-board__node-body{opacity:1;transform:none}.architecture-board.is-pending .architecture-board__draw{stroke-dashoffset:0}.architecture-board.is-pending .architecture-board__edge-label{opacity:1}}@media (width<=560px){.flow-preview--hero .flow-preview__label,.flow-preview--row .flow-preview__label,.flow-preview__layer,.flow-preview__rule{display:none}}