:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#153c42;background:#f0ecdf;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,select,input{border:1px solid #a9b7ad;border-radius:7px;background:#fbf8ed;color:inherit;padding:10px 12px;min-height:42px}button{cursor:pointer;font-size:12px;font-weight:650;transition:background .15s,transform .15s}button:hover{background:#e4dcca;transform:translateY(-1px)}button:disabled{opacity:.4;cursor:not-allowed;transform:none}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #dc7953;outline-offset:3px}input,select{width:100%;min-width:0}label{display:block;font-size:11px;font-weight:650;letter-spacing:.04em;margin:12px 0}label input,label select{display:block;margin-top:6px;font-size:12px;letter-spacing:0}main{min-height:100svh}header{padding:35px 40px 28px;display:flex;gap:60px;align-items:flex-start;background:#113d43;color:#f4efdf}.brand{display:flex;gap:14px;align-items:center;font-size:12px;letter-spacing:.15em;line-height:1.5}.brand b{font-weight:450}.mark{font-size:48px;color:#e18a62}.intro{flex:1}.eyebrow{font-size:10px;letter-spacing:.2em;color:#99b8ac}h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(40px,4.5vw,66px);line-height:.98;margin:16px 0 4px}h1 em{color:#e9a07b;font-weight:400}.header-actions{display:flex;flex-direction:column;gap:26px;align-items:flex-end}.header-actions button{color:#ede9d8;background:transparent;border-color:#64827d}.pill{border:1px solid #64827d;border-radius:30px;padding:8px 12px;font-size:10px}.toolbar{display:flex;align-items:center;gap:8px;padding:16px 25px;border-bottom:1px solid #bcc1b0;flex-wrap:wrap;background:#e5e5d7}.toolbar label{display:flex;gap:10px;align-items:center;margin:0 16px 0 0}.toolbar select{width:210px;margin:0}.count{margin-left:auto;font-size:11px}.workspace{display:grid;grid-template-columns:240px minmax(320px,1fr) 260px;min-height:730px}.panel{padding:24px 18px;border-right:1px solid #bbc5b8}.right{border-right:0;border-left:1px solid #bbc5b8}.section-heading{display:flex;gap:12px;font-size:10px;letter-spacing:.13em;font-weight:750;margin:5px 0 19px}.section-heading span{color:#be7758}.node-list{max-height:265px;overflow:auto;margin-bottom:20px}.node{width:100%;display:flex;gap:10px;text-align:left;align-items:center;border:0;background:transparent;border-radius:0;border-bottom:1px solid #d5d9cb}.node>span:last-child{margin-left:auto}.node b{font-size:12px;overflow-wrap:anywhere}.node small{display:block;color:#6d8580;font-size:9px;margin-top:4px}.node-type{font-family:Georgia,serif;font-size:25px;width:24px}.node.active{background:#dae3d3;border-left:3px solid #d58661}.wide{width:100%;margin:5px 0}.primary{background:#174c50;color:#f8f1dc;border-color:#174c50}.primary:hover{background:#24636a}.hint{font-size:10px;line-height:1.65;color:#647d78;margin:12px 0 22px}.callout{border-left:2px solid #d88761;padding-left:12px;font-size:11px;margin:18px 0}.callout p{font-size:10px;line-height:1.6;color:#637b75}.pair{display:grid;grid-template-columns:1fr 1fr;gap:8px}.stage{background:#f7f3e7;min-width:0;display:flex;flex-direction:column}.stage-bar{display:flex;justify-content:space-between;padding:22px;font-size:9px;letter-spacing:.12em;color:#68817a}.canvas{width:100%;height:580px;display:block;touch-action:none}.canvas circle{cursor:grab}.svg-label{font-size:11px;fill:#70857b;font-family:ui-monospace,monospace}.caption{padding:18px 25px;border-top:1px solid #dce0d2}.caption h2{font-family:Georgia,serif;font-weight:400;font-size:25px;overflow-wrap:anywhere;white-space:pre-wrap;margin:0 0 10px}.caption span{font-size:10px;color:#6c827a}.principles{display:grid;grid-template-columns:1fr 1fr 1fr;border-top:1px solid #dce0d2;padding:20px;gap:18px}.principles b{font-size:10px}.principles p{font-size:10px;color:#71867e;line-height:1.6}.port-map{border:1px solid #c4ccbf;border-radius:7px;overflow:hidden}.port-map>div{display:grid;grid-template-columns:1fr 1fr;gap:5px;padding:10px;border-bottom:1px solid #d6dccf;font-size:11px}.port-map small{grid-column:1/-1;color:#6b8079;overflow-wrap:anywhere}.edge-list{max-height:330px;overflow:auto}.edge{position:relative;padding:12px 35px 12px 0;border-bottom:1px solid #d2daca;overflow-wrap:anywhere}.edge>b{font-size:11px}.edge small{display:block;font-size:10px;line-height:1.5;color:#6a817a;margin-top:5px}.edge button{position:absolute;right:0;top:12px;padding:2px 9px;min-height:30px}.edition{display:grid;grid-template-columns:1fr 1fr 1fr;gap:40px;padding:35px 40px;background:#e4e5d6;border-top:1px solid #bcc8b9}footer{padding:20px 40px;background:#153d43;color:#e9eddd;font-size:12px}footer details{font-size:11px;line-height:1.6;max-width:1000px}footer button{margin:8px 5px 8px 0}footer summary{cursor:pointer;color:#c2d2c4}footer p[role=status]{font-weight:650;line-height:1.5}.warning{color:#b65630;font-size:11px;line-height:1.5}footer .warning{color:#ffb18b}.tracer{display:none}.flow .tracer{display:block;stroke-dasharray:6 90;animation:flow 3s linear infinite}@keyframes flow{to{stroke-dashoffset:-192}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.flow .tracer{display:none}}@media(max-width:1100px){header{gap:25px}.workspace{grid-template-columns:210px minmax(320px,1fr)}.right{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:10px 30px;border-top:1px solid #bbc5b8}.right .section-heading{grid-column:1/-1}.canvas{height:530px}}@media(max-width:700px){header{padding:25px;flex-wrap:wrap}.intro{min-width:150px}.brand{font-size:10px}.header-actions{flex-direction:row;width:100%;align-items:center;justify-content:space-between;gap:10px}.toolbar{padding:15px}.workspace{display:flex;flex-direction:column}.stage{order:-1}.canvas{height:440px}.panel{border-bottom:1px solid #bbc5b8}.node-list{display:flex;max-height:none;overflow-x:auto}.node{min-width:160px}.right{display:block}.edition{grid-template-columns:1fr;padding:25px;gap:25px}.principles{gap:10px}.caption h2{font-size:22px}footer{padding:25px}}
