:root{--bg:#101114;--panel:#17191f;--panel-2:#1e212a;--text:#eef1f7;--muted:#9aa3b2;--line:#2d3340;--accent:#64a5ff;--danger:#d76767;--success:#60c68a;--node-shadow:0 10px 30px rgba(0,0,0,.15);--node-radius:14px;}
*{box-sizing:border-box}html,body{margin:0;padding:0;width:100%;height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--text)}a{text-decoration:none;color:inherit}.site-shell{min-height:100vh}
.center-page{min-height:100vh;display:grid;place-items:center;padding:32px}
.lang-switch-wrap{position:fixed;top:12px;right:12px;z-index:120}.lang-switch{display:flex;align-items:center;gap:8px;padding:8px 10px;background:rgba(16,17,20,.92);border:1px solid var(--line);border-radius:12px;box-shadow:var(--node-shadow);backdrop-filter:blur(8px)}.lang-switch label{margin:0;color:var(--muted);font-size:12px}.lang-switch select{width:auto;min-width:112px;padding:7px 10px;border-radius:10px;background:var(--panel-2);color:var(--text);border:1px solid var(--line)}
.hero-card,.auth-card{width:min(100%,440px);background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:28px;box-shadow:var(--node-shadow)}
.hero-actions,.inline{display:flex;gap:12px;align-items:center}.inline.wrap{flex-wrap:wrap}.inline.compact{gap:8px}.btn{appearance:none;background:#242938;color:var(--text);border:1px solid var(--line);padding:10px 14px;border-radius:12px;cursor:pointer}.btn:hover{border-color:#52607a}.btn.primary{background:var(--accent);color:#0a1020;border-color:transparent;font-weight:700}.btn.danger{background:#341d22;border-color:#5d2b35;color:#f8dfe4}.btn.small{padding:7px 9px;font-size:12px;border-radius:10px}.input,select{width:100%;background:var(--panel-2);color:var(--text);border:1px solid var(--line);border-radius:12px;padding:10px 12px}label{display:block;margin:12px 0 6px;color:var(--muted);font-size:14px}.muted{color:var(--muted)}.small-note{color:var(--muted);font-size:12px;margin-top:12px;line-height:1.45}.small{font-size:12px}.alert{background:#3a2127;color:#f5d9de;border:1px solid #6b313d;padding:10px 12px;border-radius:12px;margin-bottom:12px}.linkish{color:var(--accent);display:inline-block;margin-top:12px}
.dashboard-page{display:grid;grid-template-columns:280px 1fr;min-height:100vh}.dashboard-sidebar{border-right:1px solid var(--line);padding:24px;display:flex;flex-direction:column;gap:16px;background:rgba(0,0,0,.15)}.dashboard-main{padding:24px;display:grid;gap:18px;align-content:start}.dashboard-card{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:18px}.project-list{display:grid;gap:10px}.project-row{display:flex;justify-content:space-between;align-items:center;gap:12px;background:var(--panel-2);border:1px solid var(--line);padding:14px;border-radius:14px}.project-row-main{display:flex;justify-content:space-between;align-items:center;gap:12px;flex:1;text-decoration:none;color:inherit}.project-title{font-weight:700}.project-meta,.project-open{color:var(--muted);font-size:13px}
.project-app{display:grid;grid-template-columns:228px 1fr;height:100vh;overflow:hidden;position:relative}.project-app.sidebar-collapsed{grid-template-columns:0 1fr}.left-sidebar{padding:8px;border-right:1px solid var(--line);background:var(--panel);overflow:auto;height:100vh;width:228px;max-width:228px;transition:transform .18s ease,opacity .18s ease;position:relative;z-index:20;scrollbar-width:none;-ms-overflow-style:none;flex:none}.left-sidebar::-webkit-scrollbar{width:0;height:0}.left-sidebar.sidebar-auto-slide-enabled.sidebar-auto-open{background:var(--panel)}.project-app.sidebar-collapsed .left-sidebar{transform:translateX(-100%);opacity:0;pointer-events:none}.project-app.sidebar-collapsed.sidebar-auto-open .left-sidebar{transform:translateX(0);opacity:1;pointer-events:auto}.sidebar-toggle-float{position:absolute;left:8px;top:8px;z-index:26;display:none;min-width:36px;padding:7px 10px}.project-app.sidebar-collapsed .sidebar-toggle-float{display:inline-flex;align-items:center;justify-content:center}.project-app.sidebar-collapsed.sidebar-auto-open .sidebar-toggle-float{display:none}.sidebar-top-controls{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;padding:2px 2px 0;position:sticky;top:0;z-index:2;background:linear-gradient(180deg, rgba(23,25,31,.98) 0%, rgba(23,25,31,.95) 72%, rgba(23,25,31,.82) 100%)}.sidebar-toggle-btn{min-width:36px;padding:7px 10px}.sidebar-auto-slide-toggle{margin:0!important;font-size:12px;color:var(--muted);display:flex;align-items:center;gap:8px;cursor:pointer;user-select:none}.sidebar-auto-slide-toggle input{width:auto;margin:0}.sidebar-group{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:10px 10px 11px;margin-bottom:10px}.sidebar-title{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px}.project-name{font-size:15px;font-weight:700;margin-bottom:6px}.left-sidebar .muted.small{display:block;margin-bottom:8px;line-height:1.45}.project-sidebar-actions{display:grid;gap:8px;margin-top:8px}.project-sidebar-actions .btn.small{display:block;width:100%;margin-top:0}.project-sidebar-actions .btn.small.danger{margin-top:2px}.left-sidebar .btn.small{margin-top:4px}.left-sidebar .btn.small.danger{width:100%}.left-sidebar label{margin:10px 0 7px}.left-sidebar .input,.left-sidebar select,.left-sidebar .inline,.left-sidebar .check-row,.left-sidebar #sheet-list{margin-top:7px}.sheet-pill{width:100%;text-align:left;background:var(--panel-2);border:1px solid var(--line);color:var(--text);padding:7px 9px;border-radius:10px;cursor:pointer;margin-bottom:7px}.sheet-pill.active{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.workspace{display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden}.topbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 12px;border-bottom:1px solid var(--line);background:rgba(0,0,0,.12);position:relative;z-index:5}.topbar-left{display:flex;align-items:center;gap:10px;min-width:0;flex:1}.project-app.sidebar-collapsed .topbar-left{padding-left:48px}.topbar-actions{display:flex;align-items:center;gap:6px;flex-wrap:nowrap;justify-content:flex-end}.canvas-viewport{position:relative;flex:1 1 auto;min-height:0;overflow:auto;background:#0c0d11;cursor:default;overscroll-behavior:contain;user-select:none;-webkit-user-select:none}.canvas-viewport.panning{cursor:grabbing}.canvas-viewport.a4{background:#0c0d11}.board{position:relative;width:5000px;height:5000px;background:#f7f7f7;user-select:none;-webkit-user-select:none;box-sizing:border-box}.board.a4{box-shadow:0 18px 42px rgba(0,0,0,.28)}.board.full,.board.infinite{box-shadow:none}.canvas,.edge-layer{position:absolute;left:0;top:0;transform-origin:0 0}.canvas{min-width:5000px;min-height:5000px;z-index:2;background:transparent;pointer-events:none;user-select:none;-webkit-user-select:none}.canvas.a4{width:794px;min-width:794px;height:1123px;min-height:1123px;margin:0}.canvas.full{min-width:100%;min-height:calc(100vh - 60px)}.canvas.infinite{min-width:20000px;min-height:20000px}.edge-layer{width:5000px;height:5000px;overflow:visible;z-index:1;user-select:none;-webkit-user-select:none}.edge-layer path{fill:none;cursor:default;stroke-linecap:round;pointer-events:none}.edge-layer path.selected{stroke:#64a5ff!important;stroke-dasharray:10 8;animation:dashFlow 1s linear infinite}.edge-layer path.preview{stroke-dasharray:8 8;opacity:.9;pointer-events:none}@keyframes dashFlow{from{stroke-dashoffset:0}to{stroke-dashoffset:-36}}
.node{position:absolute;width:340px;height:220px;background:#fff;color:#111;border:1px solid #d6d6da;border-radius:var(--node-radius);box-shadow:var(--node-shadow);overflow:visible;user-select:none;pointer-events:auto}.node.selected{outline:2px solid var(--accent)}.node.editing{outline:2px solid var(--success)}.node-header{height:36px;display:flex;align-items:center;gap:6px;padding:6px 8px;border-bottom:1px solid #ececf0;background:#f6f6f8;border-top-left-radius:var(--node-radius);border-top-right-radius:var(--node-radius);color:#333;cursor:grab}.node-header:active{cursor:grabbing}.node-title{flex:0 1 auto;min-width:0;max-width:156px;font-weight:700;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 2px;border-radius:6px;cursor:text}.node-title:hover{background:rgba(0,0,0,.04)}.node-header-btn,.origin-badge{width:24px;height:24px;border:none;border-radius:8px;display:grid;place-items:center;cursor:pointer;background:#ececf2;color:#374151;font-size:12px}.node-header-btn:hover{background:#dde2ea}.origin-wrap{display:flex;gap:4px;margin-left:auto}.origin-badge{width:20px;height:20px;background:#dce8ff;color:#123a82;font-size:11px;display:none}.origin-badge.visible{display:grid}.node-body-wrap{position:relative;height:calc(100% - 36px);padding:10px;overflow:auto;display:flex;flex-direction:column;gap:10px}.node-body{flex:1 1 auto;min-height:120px;outline:none;user-select:text;display:block}.node-body.plain-display{white-space:pre-wrap;word-break:break-word;overflow-wrap:anywhere;line-height:1.45;color:#111}.node-body.plain-editor{width:100%;height:100%;resize:none;border:none;background:transparent;color:#111;font:inherit;line-height:1.45;padding:0;margin:0;box-shadow:none;outline:none;white-space:pre-wrap;overflow:auto}.node-media{display:grid;gap:8px;margin-top:0}.node-media img,.node-media iframe{width:100%;max-width:100%;border:1px solid #dde1ea;border-radius:10px;background:#f9fafb}
.resize-handle{position:absolute;right:4px;bottom:3px;width:24px;height:24px;display:grid;place-items:center;cursor:nwse-resize;color:#7a7f89;font-size:14px;background:rgba(255,255,255,.92);border-radius:8px;border:1px solid #e4e6eb}.context-menu{position:absolute;z-index:50;min-width:180px;background:var(--panel);border:1px solid var(--line);border-radius:14px;box-shadow:var(--node-shadow);padding:8px}.context-menu.hidden,.selection-box.hidden{display:none}.context-menu-item{width:100%;text-align:left;background:transparent;border:none;color:var(--text);padding:10px 12px;border-radius:10px;cursor:pointer}.context-menu-item:hover{background:var(--panel-2)}.selection-box{position:absolute;border:1px dashed var(--accent);background:rgba(100,165,255,.10);pointer-events:none;z-index:20}.check-row{display:flex;gap:8px;align-items:center;margin-top:10px}.check-row input{width:auto}.hidden{display:none!important}.connect-source .connect-btn{background:#dce8ff;color:#123a82;border:1px solid #9fc0ff}
@media(max-width:1100px){.project-app,.project-app.sidebar-collapsed{grid-template-columns:1fr}.left-sidebar{position:absolute;left:0;top:0;bottom:0;height:100%;width:min(320px,85vw);max-width:min(320px,85vw);border-right:1px solid var(--line);border-bottom:none;box-shadow:0 18px 42px rgba(0,0,0,.28)}.project-app.sidebar-collapsed .left-sidebar{transform:translateX(calc(-100% - 12px))}.project-app.sidebar-collapsed.sidebar-auto-open .left-sidebar{transform:translateX(0)}.sidebar-toggle-float{left:8px;top:8px}.project-app.sidebar-collapsed .topbar-left{padding-left:48px}}

.canvas-viewport.screenshot-mode{cursor:crosshair}
.canvas-viewport.screenshot-mode .node,.canvas-viewport.screenshot-mode .edge-layer path{pointer-events:none}




.ghost{background:#1d2230}.app-modal{position:absolute;inset:0;display:grid;place-items:center;background:rgba(5,8,14,.58);z-index:70;padding:20px}.app-modal-card{width:min(100%,420px);background:var(--panel);border:1px solid var(--line);border-radius:18px;box-shadow:var(--node-shadow);padding:16px}.app-modal-title{font-size:16px;font-weight:700;margin-bottom:8px}.app-modal-text{font-size:14px;color:var(--muted);line-height:1.45;margin-bottom:12px}.app-modal-input{margin-bottom:12px}.app-modal-actions{display:flex;justify-content:flex-end;gap:8px}.app-toast{position:absolute;right:16px;bottom:16px;z-index:72;max-width:min(420px,calc(100% - 32px));padding:12px 14px;border-radius:14px;background:#1a2130;border:1px solid #35415c;color:var(--text);box-shadow:var(--node-shadow)}
@media(max-width:1400px){.topbar{flex-direction:column;align-items:stretch}.topbar-left{align-items:stretch;flex-direction:column}.topbar-actions{justify-content:flex-start;flex-wrap:wrap}}

.sidebar-lang-form{display:flex;gap:8px;flex-wrap:wrap}.lang-btn.active{background:var(--accent);color:#fff;border-color:var(--accent)}
.topbar-node-jump{display:flex;align-items:center;gap:6px;min-width:0;max-width:min(100%,320px)}.topbar-select{min-width:180px;max-width:240px;padding:7px 9px;font-size:12px;border-radius:10px}.topbar-select option{color:#111;background:#fff}
.auth-card-google{display:grid;gap:14px;justify-items:center;text-align:center}.google-signin-wrap{display:flex;justify-content:center;width:100%}.google-signin-wrap>div{margin:0 auto}
.member-row{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.05)}.member-row:last-child{border-bottom:none;padding-bottom:0}.member-main{min-width:0;display:grid;gap:2px}.member-name{font-weight:600;word-break:break-word}.member-meta{font-size:12px;color:var(--muted);word-break:break-word}.invite-actions{margin-bottom:8px}.invite-list{display:grid;gap:8px;margin-top:8px}.invite-code-row code{display:block;padding:7px 9px;border-radius:10px;background:var(--panel-2);border:1px solid var(--line);font-size:12px;letter-spacing:.08em;word-break:break-all}.dashboard-sidebar .small{line-height:1.45}

.drive-actions{margin-top:8px}.drive-actions .btn.small{flex:1 1 auto}.app-modal-options{display:grid;gap:8px;margin:8px 0 12px}.app-modal-option{appearance:none;width:100%;text-align:left;background:var(--panel-2);border:1px solid var(--line);color:var(--text);padding:10px 12px;border-radius:12px;cursor:pointer;display:grid;gap:4px}.app-modal-option:hover{border-color:#52607a}.app-modal-option-main{font-weight:600;word-break:break-word}.app-modal-option-meta{font-size:12px;color:var(--muted);word-break:break-word}