:root{color-scheme:light dark;--ink:#f4f2ea;--muted:#a7acb8;--bar:#171922;--line:#303442;--accent:#50c5b7;--paper:#fff}*{box-sizing:border-box}html,body{height:100%;margin:0}body{overflow:hidden;background:var(--bar);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.skip-link{position:fixed;left:12px;top:-60px;z-index:50;padding:10px 14px;background:#fff;color:#111;border-radius:6px}.skip-link:focus{top:10px}.diagram-app{height:100svh;display:grid;grid-template-rows:58px minmax(0,1fr)}.utility-bar{position:relative;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 18px;border-bottom:1px solid var(--line);background:var(--bar);color:var(--ink)}.utility-identity,.utility-actions{display:flex;align-items:center}.utility-identity{gap:14px;min-width:0}.brand{display:flex;text-decoration:none;font-size:17px;font-weight:900;letter-spacing:-.08em}.brand span:nth-child(1){color:#ef7c8e}.brand span:nth-child(2){color:#f4ba55}.brand span:nth-child(3){color:#73c8a9}.brand span:nth-child(4){color:#83a8ef}.brand span:nth-child(5){color:#c79be8}.brand span:nth-child(6){color:#f2f0e8}.divider{width:1px;height:26px;background:var(--line)}.utility-identity div{display:flex;align-items:baseline;gap:10px;min-width:0}.utility-identity strong{font-size:14px;white-space:nowrap}.utility-identity small{overflow:hidden;color:var(--muted);font-size:11px;letter-spacing:.03em;text-overflow:ellipsis;white-space:nowrap}.utility-actions{gap:8px;white-space:nowrap}.utility-actions a,.utility-actions button{border:1px solid var(--line);border-radius:6px;background:#21242e;color:var(--ink);font:inherit;font-size:12px;font-weight:700;text-decoration:none;padding:8px 11px;cursor:pointer;transition:border-color .16s ease,background .16s ease,transform .16s ease}.utility-actions a:hover,.utility-actions button:hover{border-color:#596074;background:#292d39;transform:translateY(-1px)}.utility-actions a:focus-visible,.utility-actions button:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.local-status{display:flex;align-items:center;gap:7px;margin-right:4px;color:var(--muted);font-size:11px}.local-status i{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px rgba(80,197,183,.12)}.diagram-workspace{position:relative;min-height:0;background:var(--paper)}.diagram-workspace iframe{display:block;width:100%;height:100%;border:0;background:#fff;opacity:0;transition:opacity .22s ease}.diagram-workspace.is-ready iframe{opacity:1}.editor-loading{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;gap:14px;background:#f4f3ef;color:#222733;transition:opacity .2s ease,visibility .2s ease}.editor-loading>span{width:22px;height:22px;border:2px solid #c8cbd1;border-top-color:#466bb0;border-radius:50%;animation:spin .8s linear infinite}.editor-loading div{display:grid;gap:2px}.editor-loading strong{font-size:13px}.editor-loading small{color:#707684;font-size:11px}.diagram-workspace.is-ready .editor-loading{opacity:0;visibility:hidden}.editor-error{position:absolute;inset:0;display:grid;place-items:center;margin:0;background:#fff;color:#842029}.diagram-workspace:fullscreen{background:#fff}.diagram-workspace:fullscreen iframe{height:100%}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:760px){.diagram-app{grid-template-rows:52px minmax(0,1fr)}.utility-bar{padding:0 10px}.utility-identity{gap:9px}.utility-identity div{display:block}.utility-identity small,.divider,.local-status{display:none}.utility-actions{gap:5px}.utility-actions a,.utility-actions button{padding:7px 8px}.brand{font-size:15px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.utility-actions a,.utility-actions button,.diagram-workspace iframe,.editor-loading{transition:none}.editor-loading>span{animation-duration:1.5s}}