:root{--bg:#f6f8fb;--card:#ffffff;--soft:#f1f5f9;--line:#d9e2ef;--text:#111827;--muted:#667085;--primary:#2563eb;--primary2:#60a5fa;--danger:#ef4444;--shadow:0 18px 45px rgba(15,23,42,.08);--r:24px;--rs:14px}*{box-sizing:border-box}html,body{margin:0;height:100%;font-family:Inter,"Segoe UI",Arial,sans-serif;background:radial-gradient(circle at 10% 5%,#e0f2fe 0,transparent 30%),linear-gradient(135deg,#f8fafc,#eef4f8);color:var(--text);overflow:hidden}button,input,select{font:inherit}button{cursor:pointer}.hidden{display:none!important}.auth-screen{min-height:100vh;display:grid;grid-template-columns:1.1fr .9fr;gap:28px;padding:28px}.auth-hero{border-radius:36px;padding:40px;background:linear-gradient(135deg,#ffffffcc,#f8fafccc);border:1px solid #fff;box-shadow:var(--shadow);display:flex;flex-direction:column;justify-content:space-between}.brand{display:flex;align-items:center;gap:12px}.brand.small{padding-bottom:14px;border-bottom:1px solid var(--line)}.logo{width:46px;height:46px;border-radius:16px;background:linear-gradient(135deg,var(--primary),var(--primary2));color:#fff;display:grid;place-items:center;font-weight:900}.brand strong{display:block;font-size:20px}.brand span{display:block;color:var(--muted);font-size:13px;margin-top:2px}.auth-hero h1{font-size:clamp(34px,5vw,64px);line-height:1;letter-spacing:-.06em;max-width:820px;margin:50px 0 18px}.auth-hero p{font-size:16px;color:var(--muted);line-height:1.65;max-width:680px}.hero-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:36px}.hero-grid div{background:#fff;border:1px solid var(--line);border-radius:20px;padding:16px}.hero-grid strong,.hero-grid span{display:block}.hero-grid span{color:var(--muted);font-size:13px;margin-top:4px}.auth-card{align-self:center;justify-self:center;width:min(100%,480px);background:#ffffffd9;backdrop-filter:blur(18px);border:1px solid #fff;border-radius:32px;padding:28px;box-shadow:var(--shadow)}.tabs{display:grid;grid-template-columns:1fr 1fr;background:#eef4fb;padding:5px;border-radius:18px;margin-bottom:24px}.tab{border:0;background:transparent;border-radius:14px;padding:13px;font-weight:900;color:var(--muted)}.tab.active{background:#fff;color:var(--primary);box-shadow:0 8px 20px rgba(15,23,42,.06)}h2{letter-spacing:-.04em;margin:0 0 8px}.auth-card p{color:var(--muted);line-height:1.55;margin:0 0 20px}label{display:block;font-size:12px;font-weight:900;color:#475467;margin:14px 0 8px}input,select{width:100%;border:1px solid var(--line);border-radius:15px;padding:12px 13px;background:#fff;outline:0;color:var(--text)}input:focus,select:focus{border-color:var(--primary);box-shadow:0 0 0 4px rgba(37,99,235,.12)}.btn{border:0;border-radius:15px;padding:12px 15px;font-weight:900;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:.2s}.btn:hover{transform:translateY(-1px)}.btn.full{width:100%;margin-top:14px}.primary{background:linear-gradient(135deg,var(--primary),#3b82f6);color:#fff}.secondary{background:#fff;color:var(--text);border:1px solid var(--line)}.danger{background:var(--danger);color:#fff}.link-btn{border:0;background:transparent;color:var(--primary);font-weight:900;padding:6px}.auth-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:16px;flex-wrap:wrap}.message{margin-top:16px;border-radius:16px;padding:12px 14px;background:#eff6ff;border:1px solid #bfdbfe;color:#1d4ed8;font-size:13px;line-height:1.4}.message.error{background:#fef2f2;border-color:#fecaca;color:#b91c1c}.message.success{background:#ecfdf5;border-color:#bbf7d0;color:#047857}.app-shell{height:100vh;display:grid;grid-template-columns:310px 1fr;overflow:hidden}.sidebar{background:#ffffffd9;backdrop-filter:blur(16px);border-right:1px solid var(--line);padding:16px;display:flex;flex-direction:column;gap:12px;overflow:auto;box-shadow:var(--shadow);z-index:20}.user-box,.panel{background:#fff;border:1px solid var(--line);border-radius:22px;padding:14px}.user-box{display:flex;align-items:center;justify-content:space-between;gap:10px}.user-box strong{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.panel-head h3{margin:0;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.08em}.project-list{display:grid;gap:8px;max-height:210px;overflow:auto}.project-item{border:1px solid var(--line);border-radius:16px;padding:10px;background:#fbfdff;display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}.project-main{cursor:pointer;min-width:0}.project-item.active{border-color:var(--primary);background:#eff6ff}.project-main strong{display:block;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.project-main span{display:block;font-size:11px;color:var(--muted);margin-top:3px}.project-delete{border:0;background:#fff;color:var(--danger);font-weight:900;border-radius:10px;padding:7px}.shape-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.shape-grid button{min-height:46px;border:1px solid var(--line);background:#fff;border-radius:14px;font-size:12px;font-weight:900}.shape-grid button:hover{border-color:var(--primary);color:var(--primary);background:#eff6ff}.two-cols{display:grid;grid-template-columns:1fr 1fr;gap:10px}.main{padding:14px;display:flex;flex-direction:column;gap:12px;overflow:hidden;min-width:0}.topbar{background:#ffffffd9;backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:24px;padding:13px 14px;display:flex;align-items:center;justify-content:space-between;gap:12px;box-shadow:0 8px 28px rgba(15,23,42,.05)}.topbar h2{font-size:20px;margin:0}.topbar span{font-size:12px;color:var(--muted);font-weight:700}.top-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.file-label{position:relative;overflow:hidden}.file-label input{position:absolute;inset:0;opacity:0;cursor:pointer}.workspace{position:relative;flex:1;min-height:0;background:#fff;border:1px solid var(--line);border-radius:26px;overflow:hidden;box-shadow:var(--shadow)}.workspace-head{height:54px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 16px}.workspace-head span{font-size:12px;color:var(--muted)}.canvas-wrap{position:absolute;inset:54px 0 0 0;overflow:auto;background:radial-gradient(circle at 1px 1px,rgba(100,116,139,.22) 1px,transparent 0);background-size:26px 26px;background-color:#f8fafc}#canvas{position:relative;width:2800px;height:1800px;transform-origin:0 0;transition:transform .12s}svg#connections{position:absolute;inset:0;width:2800px;height:1800px;pointer-events:none;overflow:visible;z-index:1}.node{position:absolute;min-width:170px;max-width:270px;min-height:72px;background:#fff;border:2px solid #bfd6ff;box-shadow:0 14px 34px rgba(15,23,42,.09);z-index:2;display:grid;place-items:center;text-align:center;padding:14px 18px;cursor:grab;user-select:none;font-weight:800;color:#111827;border-radius:18px}.node:hover{box-shadow:0 22px 44px rgba(15,23,42,.13)}.node.selected{border-color:var(--primary)!important;box-shadow:0 0 0 5px rgba(37,99,235,.12),0 22px 44px rgba(15,23,42,.13)}.node.start-end{border-radius:999px}.node.decision{width:164px;height:164px;min-width:164px;min-height:164px;max-width:164px;transform:rotate(45deg);border-radius:20px}.node.decision .node-text{transform:rotate(-45deg);max-width:105px}.node.input-output{transform:skewX(-13deg)}.node.input-output .node-text{transform:skewX(13deg)}.node.document{border-radius:18px 18px 32px 32px}.node.database{border-radius:50%/18%;min-height:92px}.handle{position:absolute;width:16px;height:16px;background:var(--primary);border:3px solid #fff;border-radius:99px;box-shadow:0 6px 14px rgba(37,99,235,.32);z-index:3}.handle.in{left:-10px;top:50%;transform:translateY(-50%)}.handle.out{right:-10px;top:50%;transform:translateY(-50%);cursor:crosshair}.zoom-controls{position:absolute;left:16px;bottom:16px;z-index:10;display:flex;align-items:center;gap:8px;background:#ffffffd9;backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:18px;padding:8px;box-shadow:var(--shadow)}.zoom-controls button{height:36px;border:1px solid var(--line);border-radius:12px;background:#fff;font-weight:900;padding:0 12px}.zoom-controls span{min-width:54px;text-align:center;font-weight:900;color:var(--muted);font-size:13px}.context{position:absolute;display:none;z-index:40;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);overflow:hidden}.context button{display:block;width:170px;border:0;background:#fff;text-align:left;padding:12px 14px;font-weight:800}.context button:hover{background:#f8fafc}.mobile-only{display:none}.icon-btn{border:1px solid var(--line);background:#fff;border-radius:14px;padding:10px 12px;font-weight:900}@media(max-width:1100px){.auth-screen{grid-template-columns:1fr;overflow:auto}.auth-hero{min-height:auto}.hero-grid{grid-template-columns:1fr}}@media(max-width:920px){.app-shell{grid-template-columns:1fr}.sidebar{position:fixed;top:10px;bottom:10px;left:10px;width:min(330px,calc(100vw - 20px));border:1px solid var(--line);border-radius:24px;transform:translateX(calc(-100% - 16px));transition:.25s}.sidebar.open{transform:translateX(0)}.mobile-only{display:inline-flex}.main{padding:10px}.topbar{align-items:flex-start}.top-actions{width:100%}.btn{padding:11px 12px}.auth-screen{padding:12px}.auth-hero{display:none}.auth-card{margin:auto;border-radius:26px}}@media(max-width:600px){.topbar{border-radius:20px}.workspace{border-radius:20px}.workspace-head{height:64px}.canvas-wrap{inset:64px 0 0 0}.top-actions .btn,.file-label{font-size:12px}.auth-card{padding:20px}}
