:root{--bg:#f5f7fa;--panel:#fff;--ink:#162e49;--muted:#53677e;--line:#d8e2ec;--soft:#eaf3f7;--accent:#126f70;--blue:#2961be}*{box-sizing:border-box}html{scroll-padding-top:20px}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.6 system-ui,-apple-system,sans-serif}.dark{--bg:#101e2c;--panel:#182c40;--ink:#e6eff7;--muted:#b2c5d6;--line:#38516a;--soft:#233f50;--accent:#79d4ca;--blue:#98bafa}button,input,textarea,select{font:inherit}button,.button{border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--ink);padding:9px 13px;cursor:pointer;font-weight:650}button:hover{border-color:var(--blue)}button:disabled{opacity:.5;cursor:not-allowed}.primary{background:#126f70;color:white;border-color:#126f70}a{color:inherit;text-underline-offset:4px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid #cb8f29;outline-offset:3px}header{display:flex;align-items:center;justify-content:space-between;padding:22px 4%;border-bottom:1px solid var(--line);gap:18px}.brand{font-size:21px;font-weight:850;text-decoration:none;letter-spacing:-.7px}.brand span{font-size:12px;color:var(--muted);font-weight:500}nav{display:flex;gap:24px;align-items:center}nav a{text-decoration:none}.hero{max-width:1500px;margin:auto;padding:60px 4% 45px;display:grid;grid-template-columns:1.5fr 1fr;gap:60px;align-items:center}.eyebrow{font-size:10px;font-weight:850;letter-spacing:2px;color:var(--accent)}h1{font-size:clamp(32px,3.7vw,54px);line-height:1.15;letter-spacing:-2px;margin:15px 0}h1 em{font-style:normal;color:var(--accent)}h2{font-size:25px;letter-spacing:-.8px;line-height:1.25}h3{font-size:17px}.hero p{color:var(--muted);font-size:17px}.hero-tags{display:flex;gap:9px;flex-wrap:wrap;margin-top:25px}.hero-tags span{padding:6px 11px;border-radius:20px;background:var(--soft);font-size:11px}.hero-note{padding:26px;border:1px solid var(--line);border-radius:16px;background:var(--panel);box-shadow:8px 8px 0 var(--soft)}.hero-note b{font-size:20px}.hero-note p{font-size:15px}.hero-note a{font-size:13px;font-weight:700}.start,.lab,.evaluation,.exports,.settings{max-width:1500px;margin:20px auto;padding:30px 4%;border-top:1px solid var(--line)}.section-title,.workspace-top,.mode-bar,.toolbar,.canvas-bottom{display:flex;justify-content:space-between;gap:16px;align-items:center}.section-title h2{margin:8px 0 20px}.start-grid,.lab-grid,.settings{display:grid;grid-template-columns:1fr 1fr;gap:35px}.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:14px 0}.actions button{font-size:12px}label{display:block;font-weight:650;font-size:12px;margin:9px 0 5px}label small{display:block;font-weight:400;color:var(--muted)}input,select,textarea{padding:9px;border:1px solid var(--line);border-radius:7px;background:var(--panel);color:var(--ink);max-width:100%}textarea{width:100%;resize:vertical;font:12px/1.65 ui-monospace,monospace}select{width:100%}input:not([type=checkbox]):not([type=range]){width:100%}.small{font-size:12px}.muted{color:var(--muted)}#workspace{max-width:1700px;margin:25px auto;padding:0 3%}.workspace-top>div:first-child{flex:1;max-width:500px}.workspace-top .actions{max-width:650px}.workspace-top select{width:180px}.mode-bar{background:var(--soft);padding:10px 15px;border:1px solid var(--line);border-bottom:0;border-radius:12px 12px 0 0;font-size:12px;flex-wrap:wrap}.mode-bar label{display:flex;align-items:center;gap:10px;margin:0}.mode-bar select{width:auto;font-size:12px}.workbench{display:grid;grid-template-columns:170px minmax(0,1fr) 300px;border:1px solid var(--line);border-radius:0 0 12px 12px;background:var(--panel);overflow:hidden}aside{padding:18px 12px;border-right:1px solid var(--line);background:var(--bg)}aside>button{margin:10px 0;width:100%}#nodeList{max-height:550px;overflow:auto}#nodeList button{font-size:11px;text-align:left;display:block;width:100%;padding:9px;margin:5px 0}#nodeList button.selected{background:var(--soft);border-color:var(--accent)}details{padding:12px 0;border-bottom:1px solid var(--line)}summary{cursor:pointer;font-weight:650}aside p{font-size:11px;color:var(--muted)}.canvas-panel{min-width:0}.toolbar{padding:12px;border-bottom:1px solid var(--line);flex-wrap:wrap;gap:6px}.toolbar button{font-size:11px;padding:6px 9px}.toolbar label{display:flex;gap:8px;align-items:center;font-size:11px}#zoom{width:85px}#canvasHost{height:450px;overflow:auto;background:#f5f8fc;touch-action:none}#graph{display:block;min-width:650px}#graph [data-node]{cursor:grab}#graph [data-node]:focus{outline:none}#graph [data-node]:focus rect:first-child{stroke:#b47715;stroke-width:4}.canvas-bottom{align-items:start;padding:15px;border-top:1px solid var(--line)}#minimap{width:150px;height:85px;border:1px solid var(--line);flex-shrink:0;cursor:crosshair;background:#f5f8fc}.canvas-bottom>div{font-size:11px;flex:1}#validation{max-height:100px;overflow:auto}.error{color:#a53743}.dark .error{color:#ffb3bc}.ok{color:var(--accent)}.connections{padding:13px}#edgeList{max-height:130px;overflow:auto;font-size:11px}.edge-row{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:5px 0}.edge-row button{padding:3px 8px;font-size:10px}.inspector{padding:18px;border-left:1px solid var(--line);min-width:0}.inspector h2{font-size:20px}.inspector button.primary{margin-top:12px;width:100%}.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}.check{display:flex;gap:8px;align-items:center}pre{background:var(--bg);border:1px solid var(--line);padding:12px;border-radius:7px;white-space:pre-wrap;overflow-wrap:anywhere;max-height:370px;overflow:auto;font:11px/1.65 ui-monospace,monospace}#timeline{max-height:400px;overflow:auto;border:1px solid var(--line);border-radius:9px;padding:12px;background:var(--panel)}.trace{border-bottom:1px solid var(--line);padding:8px 0;font-size:12px}.trace button{font-size:11px;padding:4px 8px;margin-right:8px}.approval{border:2px solid #ba8132;border-radius:10px;padding:16px;background:var(--panel);margin:15px 0}.approval textarea{min-height:100px}.compare{display:grid;grid-template-columns:1fr 1fr;gap:16px}.evaluation-result{padding:15px;border:1px solid var(--line);border-radius:9px;background:var(--panel);margin:10px 0}.settings{max-width:1500px}.settings .actions label{flex:1}.settings details p{font-size:12px;color:var(--muted)}footer{padding:30px 4%;border-top:1px solid var(--line);display:flex;gap:20px;flex-wrap:wrap;font-size:12px}footer span{margin-right:auto;color:var(--muted)}#toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:var(--ink);color:var(--panel);padding:12px 20px;border-radius:10px;max-width:90vw;z-index:20;box-shadow:0 6px 25px #0002}#toast:empty{display:none}dialog{max-width:min(720px,95vw);max-height:90vh;overflow:auto;border:1px solid var(--line);border-radius:14px;background:var(--panel);color:var(--ink);padding:24px}dialog::backdrop{background:#0d2439aa}.skip{position:absolute;top:-100px;left:10px;background:var(--panel);padding:15px;z-index:30}.skip:focus{top:10px}@media(max-width:1150px){.workbench{grid-template-columns:155px minmax(0,1fr)}.inspector{grid-column:1/3;border-left:0;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:15px}.inspector .eyebrow,.inspector h2{grid-column:1/3}.hero{gap:25px}.canvas-bottom{flex-wrap:wrap}}@media(max-width:720px){header{align-items:start;flex-direction:column}nav{flex-wrap:wrap;gap:15px;font-size:12px}.hero,.start-grid,.lab-grid,.settings{grid-template-columns:1fr}.hero{padding:35px 5%;gap:25px}h1{letter-spacing:-1px}.workbench{display:block}aside{border-right:0;border-bottom:1px solid var(--line)}#nodeList{max-height:140px;display:flex;flex-wrap:wrap;gap:5px}#nodeList button{width:auto}aside details{display:none}.inspector{display:block}.section-title,.workspace-top{align-items:start;flex-direction:column}.workspace-top>div:first-child{width:100%}.mode-bar{align-items:start;flex-direction:column}#canvasHost{height:340px}.compare{grid-template-columns:1fr}.hero-note{box-shadow:4px 4px 0 var(--soft)}.start,.lab,.evaluation,.exports,.settings{padding:25px 5%}.canvas-bottom{gap:10px}.connections .actions label{flex:1;min-width:80px}.settings .actions label{min-width:180px}footer{flex-direction:column}.toolbar label{margin-left:auto}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
