@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+KR:wght@400;500;600;700&display=swap');
:root{font-family:'DM Sans','Noto Sans KR',sans-serif;color:#e7e9ef;background:#101115;font-size:13px;font-synthesis:none;--accent:#c6f478;--muted:#858892;--line:#2a2c34}*{box-sizing:border-box}body{margin:0}button,input,textarea{font:inherit}button{cursor:pointer;color:inherit;background:none;border:0}button:disabled{opacity:.4;cursor:wait}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:4px}button:hover{filter:brightness(1.15)}[hidden]{display:none!important}.primary{background:var(--accent);color:#202719;padding:11px 17px;border-radius:9px;font-weight:700}.quiet{border:1px solid #363840;border-radius:8px;padding:10px 14px;background:#1b1d23}.tag{font-size:10px;border:1px solid #34373e;color:#9b9ea9;padding:4px 7px;border-radius:5px;white-space:nowrap}.muted{color:var(--muted)}.eyebrow{font-size:10px;font-weight:600;color:#8e929c;letter-spacing:1.8px}.topbar{height:68px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 25px;gap:44px;background:#15161b}.wordmark{text-decoration:none;color:white;font-size:28px;font-weight:700;letter-spacing:-1.5px;display:flex;align-items:center;gap:4px;min-width:155px}.wordmark>span{color:var(--accent)}.wordmark small{font-size:8px;letter-spacing:1px;color:var(--accent);border:1px solid #425332;padding:3px 4px;margin-left:7px}.breadcrumb{display:flex;align-items:center;gap:13px;color:#92959f;font-size:12px}.breadcrumb>span:first-of-type{color:#444}.breadcrumb button{color:#e4e5ea;font-weight:500}.top-actions{margin-left:auto;display:flex;align-items:center;gap:15px}#save-state{font-size:10px;color:#92978b}.avatar{width:31px;height:31px;border-radius:50%;background:#333345;color:#c8b9ec;font-size:11px}.sidebar{position:absolute;top:68px;bottom:0;width:222px;padding:28px 16px;background:#15161b;border-right:1px solid var(--line)}.side-label{font-size:10px;letter-spacing:1px;color:#6e727e;margin:0 12px 15px;display:flex;justify-content:space-between}.side-item{width:100%;text-align:left;padding:12px;border-radius:7px;display:flex;gap:11px;color:#9c9faa;margin-bottom:5px}.side-item.active{color:#d6e9bb;background:#252c22}.side-item span{font-size:16px;line-height:16px}.side-divider{height:1px;background:var(--line);margin:24px 0}.project-item{display:block;width:100%;padding:10px 12px;text-align:left;color:#9d9faa;border-radius:6px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.project-item.current{background:#202229;color:#eee}.project-item:before{content:'◈';color:#8c9b76;margin-right:10px}.side-bottom{position:absolute;bottom:28px;left:28px;color:#9b9f94;font-size:10px}.side-bottom p{line-height:1.9;color:#646874;margin-top:19px}.status-dot,.live-dot{display:inline-block;width:6px;height:6px;background:var(--accent);border-radius:50%;margin-right:6px}#main{position:absolute;top:68px;left:222px;right:0;bottom:0;overflow:hidden;background-color:#101115;background-image:radial-gradient(#303139 .8px,transparent .8px);background-size:22px 22px}.canvas-heading{position:absolute;top:29px;left:34px;right:30px;display:flex;align-items:center;justify-content:space-between;z-index:3;pointer-events:none}.canvas-heading>*{pointer-events:auto}.canvas-heading h1{font-size:23px;letter-spacing:-.7px;margin:9px 0}.canvas-heading p{font-size:11px;color:#787e8c;margin:0}.heading-actions{display:flex;gap:8px}.canvas-meta{position:absolute;left:34px;top:145px;z-index:2;color:#717682;font-size:10px;display:flex;align-items:center;gap:4px}.separator{margin:0 7px}#viewport{position:absolute;inset:170px 0 0;overflow:hidden;touch-action:none}#world{position:absolute;transform-origin:0 0;will-change:transform}#connections{position:absolute;top:0;left:0;width:10000px;height:10000px;overflow:visible;pointer-events:none}#connections path{fill:none;stroke:#4d5841;stroke-width:1.5}#connections circle{fill:#a4bd7f}.page-node{position:absolute;width:306px;border:1px solid #353740;border-radius:12px;background:#1a1c22;box-shadow:0 12px 35px #0003;user-select:none}.page-node.selected{border-color:var(--accent);box-shadow:0 0 0 2px #c6f47814,0 12px 35px #0003}.node-toolbar{position:absolute;bottom:calc(100% + 11px);left:0;display:flex;gap:3px;background:#292c33;border:1px solid #454a50;border-radius:8px;padding:4px;white-space:nowrap;box-shadow:0 8px 20px #0003}.node-toolbar button{padding:7px;font-size:10px;border-radius:4px}.node-toolbar button:hover{background:#3b403c}.node-header{padding:12px 14px;display:flex;gap:8px;align-items:center;border-bottom:1px solid #2d3037;font-size:11px;cursor:grab}.node-header .node-index{color:#9ba48e;font-size:10px}.node-header .node-state{margin-left:auto;color:#a4bc83;font-size:9px}.node-thumb{height:174px;margin:12px;background:#e9ece8;border-radius:5px;overflow:hidden;pointer-events:none;color:#1d2930;position:relative}.node-thumb img{width:100%;height:100%;object-fit:cover}.mini-nav{height:25px;background:#fff;border-bottom:1px solid #ddd;display:flex;align-items:center;gap:8px;padding:0 10px;font-size:7px}.mini-nav strong{margin-right:auto}.mini-content{display:flex;height:149px}.mini-side{width:49px;background:#f8f9fa;padding:12px 5px;font-size:5px;color:#75817a;line-height:2.8}.mini-main{padding:13px 10px;flex:1}.mini-main b{font-size:9px}.mini-line{height:5px;background:#dde3df;margin:8px 0;width:68%}.mini-table{background:#fff;margin-top:10px;border:1px solid #dce2de;border-radius:3px;padding:3px 7px}.mini-row{height:16px;border-bottom:1px solid #edf0ed;display:flex;align-items:center;gap:10px}.mini-row i{width:35%;height:3px;background:#dce2dd}.mini-row i:first-child{width:16%}.mini-button{position:absolute;right:13px;top:43px;font-size:5px;background:#344d3c;color:white;padding:4px 6px;border-radius:2px}.node-footer{padding:0 14px 13px;display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#848a94}.node-footer .chip{font-size:9px;background:#272d24;color:#abc18f;border-radius:4px;padding:4px 7px}.planned .node-thumb{background:repeating-linear-gradient(-45deg,#1b1e24,#1b1e24 7px,#1e2128 7px,#1e2128 8px);border:1px dashed #3c424a;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#8f959f;gap:9px}.planned .node-thumb>span{font-size:24px;color:#69785e}.planned .node-thumb b{font-size:11px;font-weight:500}.planned .node-thumb small{font-size:9px;color:#646c77}.planned .node-state{color:#848995}.planned .node-footer .chip{background:#282a32;color:#9196a4}.node-port{position:absolute;top:128px;width:8px;height:8px;background:#71855a;border:2px solid #20231d;border-radius:50%}.node-port.in{left:-5px}.node-port.out{right:-5px}.composer-wrap{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);width:min(680px,calc(100% - 100px));z-index:5}.composer{border:1px solid #3c4239;background:#202328f5;border-radius:15px;padding:13px 16px 10px;box-shadow:0 15px 60px #0006;backdrop-filter:blur(12px)}textarea{resize:vertical}.composer textarea{width:100%;resize:none;background:none;border:0;outline:none;color:#e1e5df;line-height:1.7;min-height:44px;font-size:12px}.composer textarea::placeholder{color:#7d848a}.composer-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:7px}.composer-bottom>div{display:flex;align-items:center;gap:10px}.attach{width:26px;height:26px;border:1px solid #42484c;border-radius:6px;font-size:18px;color:#bdc2bd}.composer-label{font-size:10px;color:#a1ab98}.generate{border-radius:7px;background:var(--accent);color:#233018;padding:8px 12px;font-size:11px;font-weight:600}.generate span{margin-left:14px}.composer-foot{text-align:center;font-size:9px;color:#636975;margin-top:10px}#selection-context{font-size:10px;color:#b1c894;margin:0 0 8px 4px}#selection-context button{margin-left:9px;color:#aaa}.canvas-controls{position:absolute;bottom:25px;left:25px;display:flex;align-items:center;gap:5px;background:#1c1e24;border:1px solid #33363e;border-radius:7px;padding:5px;z-index:6}.canvas-controls button{width:24px;height:25px;font-size:16px}.canvas-controls span{font-size:9px;color:#a2a6af}.control-divider{height:15px;border-left:1px solid #3c3e44;margin:0 4px}#empty-state{position:absolute;top:24%;left:50%;transform:translateX(-50%);text-align:center;color:#8d939e;min-width:300px}#empty-state>div{font-size:42px;color:var(--accent)}#empty-state h2{font-size:19px;color:#dce1d6}#empty-state p{font-size:12px}#empty-state button{margin-top:16px}dialog{background:#191c22;border:1px solid #42464c;border-radius:15px;color:#e5e9e0;padding:0;width:min(850px,94vw);max-height:90vh;box-shadow:0 25px 100px #0008}dialog::backdrop{background:#06080cb8;backdrop-filter:blur(4px)}dialog.preview-dialog{width:94vw}.modal-top{padding:20px 25px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #30353c}.modal-top h2{font-size:19px;margin:6px 0 0}.icon-button{font-size:27px;color:#a2a7b0}#modal-body{padding:23px;overflow:auto;max-height:calc(90vh - 90px)}.preview-frame{width:100%;height:65vh;background:#fff;border:0;border-radius:7px}.field{display:block;margin-bottom:18px;color:#aaa;font-size:11px}.field input,.field textarea,.full-textarea{display:block;width:100%;margin-top:9px;border:1px solid #3e454a;border-radius:7px;background:#11151a;color:#e6e9e1;padding:12px;line-height:1.6}.field textarea{min-height:150px}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}.description-item{padding:15px 0;border-bottom:1px solid #31363c}.description-item b{font-size:13px}.description-item p{color:#adb4bd;font-size:12px;line-height:1.8;margin:8px 0}.description-item code{font-size:10px;color:#99ac80}.notice{border:1px solid #434b39;background:#242c21;color:#bbcba9;border-radius:8px;padding:12px;font-size:11px;line-height:1.8;margin-bottom:16px}.exception-options{display:flex;flex-wrap:wrap;gap:8px}.exception-options button{border:1px solid #424a43;padding:10px 13px;border-radius:7px}.exception-options button.chosen{border-color:var(--accent);color:var(--accent);background:#2b3425}.exception-item{display:flex;align-items:center;gap:10px;padding:15px 0;border-bottom:1px solid #343a3b}.exception-item button{margin-left:auto}.exception-item small{color:#b9a96e}.preview-note{font-size:11px;color:#919b89;margin-bottom:12px}.attachment{display:inline-flex;align-items:center;gap:7px;padding:5px 8px;background:#30372c;border-radius:6px;font-size:10px;margin:0 6px 9px 0}.attachment img{width:28px;height:28px;border-radius:4px;object-fit:cover}#toast{position:fixed;bottom:24px;right:25px;max-width:440px;z-index:50;padding:13px 18px;background:#30392b;border:1px solid #5c7145;border-radius:8px;box-shadow:0 8px 30px #0004;display:none;line-height:1.7}#toast.visible{display:block}#gate{min-height:100vh;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 30%,#2c3725 0,transparent 60%),#101115}.gate-card{width:380px;text-align:left}.brand-mark{font-size:50px;font-weight:700;color:var(--accent);margin-bottom:28px}.brand-mark span{font-size:30px}.gate-card small{font-size:10px;letter-spacing:3px;color:#a5b396}.gate-card h1{font-size:40px;letter-spacing:-2px;line-height:1.4}.gate-card p{line-height:1.9;color:#929b8b}.gate-card button{margin-top:18px;width:100%}.gate-card #gate-note{font-size:10px;text-align:center}.restore-list{display:flex;align-items:center;padding:12px 0;border-bottom:1px solid #333;gap:15px}.restore-list button{margin-left:auto}@media(max-width:1000px){.sidebar{width:180px}#main{left:180px}.topbar{gap:20px}.wordmark{min-width:130px}.breadcrumb{gap:5px}.breadcrumb>.tag{display:none}#save-state{display:none}.composer-wrap{width:calc(100% - 50px);bottom:65px}.canvas-heading{left:22px}.canvas-heading h1{font-size:19px}.heading-actions{flex-direction:column}.top-actions{gap:7px}}@media(max-width:700px){.sidebar{display:none}#main{left:0}.breadcrumb{display:none}.topbar{padding:0 15px}.canvas-heading p{max-width:180px;line-height:1.7}.canvas-meta{left:22px;font-size:9px}.canvas-meta .separator,.canvas-meta span:last-child{display:none}.composer-wrap{width:calc(100% - 24px)}.canvas-controls{left:12px}.gate-card{width:calc(100vw - 50px)}}

/* The composer belongs to the selected node, inside the transformed canvas. */
#world>.composer-wrap{position:absolute;bottom:auto;transform:none;width:460px;max-width:none;z-index:8;cursor:default;user-select:text}.composer-wrap .composer-foot{text-align:left;padding-left:4px}.composer-wrap #selection-context{margin-left:4px}.composer-wrap .composer{background:#202328;backdrop-filter:none}

.login-field{display:block;color:#b4bcae;font-size:12px;margin-top:18px}.login-field input{display:block;width:100%;padding:13px 14px;margin-top:8px;border-radius:8px;border:1px solid #424b3b;background:#191e18;color:#ecf1e8;outline:none}.login-field input:focus{border-color:var(--accent)}#login-error{color:#edaca1;font-size:12px;min-height:18px}#login-form button{margin-top:25px}.gate-card #gate-note{margin-top:16px}

#drop-overlay{position:fixed;inset:0;z-index:70;pointer-events:none;background:#131b10d9;display:grid;place-items:center;border:3px dashed var(--accent);backdrop-filter:blur(3px)}#drop-overlay>div{text-align:center}#drop-overlay span{font-size:50px;color:var(--accent)}#drop-overlay p{color:#b0bea5}#context-menu{position:fixed;z-index:80;min-width:190px;border:1px solid #46513c;border-radius:9px;background:#252b23;padding:5px;box-shadow:0 15px 40px #0008}#context-menu button{display:block;width:100%;padding:10px 13px;border-radius:5px;text-align:left;font-size:12px;color:#d9e2d2}#context-menu button:hover,#context-menu button:focus{background:#3b4931;outline:none}

#connections path.variant-edge{stroke:#b69bdf;stroke-dasharray:6 5}.restore-list{flex-wrap:wrap}.restore-list button{margin-left:0}.restore-list span{margin-right:auto}.node-toolbar{max-width:none}
/* Keep every action reachable on right-hand canvas nodes. */
.node-toolbar{width:306px;max-width:306px;flex-wrap:wrap}
