:root{--bg:#0f172a;--surface:#1e293b;--surface-2:#172033;--muted:#232f45;--border:#2b374d;--border-2:#3f4d67;--text:#f1f5f9;--dim:#94a3b8;--dim-2:#64748b;--accent:#22c55e;--accent-2:#16a34a;--accent-ink:#052e16;--accent-soft:#132a1e;--danger:#ef4444;--mono:"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;--sans:"Pretendard", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;--r:14px;--r-sm:10px;--r-xs:8px;--shadow:0 12px 40px #00000073}*{box-sizing:border-box}html,body{height:100%}body{background:var(--bg);color:var(--text);font-family:var(--sans);-webkit-font-smoothing:antialiased;margin:0;font-size:15px;line-height:1.5}a{color:inherit;text-decoration:none}::selection{background:#22c55e47}button,input,select,textarea{font-family:inherit}.mono{font-family:var(--mono)}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}.top{border-bottom:1px solid var(--border);backdrop-filter:saturate(1.4)blur(12px);z-index:20;background:#0f172ab8;align-items:center;gap:14px;height:56px;padding:0 20px;display:flex;position:sticky;top:0}.brand{font-family:var(--mono);letter-spacing:-.5px;align-items:center;gap:9px;font-size:17px;font-weight:700;display:flex}.brand .cube{background:linear-gradient(140deg,var(--accent),var(--accent-2));width:26px;height:26px;color:var(--accent-ink);border-radius:7px;place-items:center;font-size:14px;font-weight:800;display:grid}.brand b{color:var(--accent)}.top .sp{flex:1}.top .who{color:var(--dim);font-size:13px;font-family:var(--mono)}.top .out{color:var(--dim);border:1px solid var(--border-2);border-radius:var(--r-xs);padding:7px 13px;font-size:13px;font-weight:600;transition:all .15s}.top .out:hover{color:var(--text);border-color:var(--dim)}.langtog{color:var(--dim);border:1px solid var(--border-2);border-radius:var(--r-xs);cursor:pointer;font-size:12px;font-weight:700;font-family:var(--mono);background:0 0;padding:6px 11px;transition:all .15s}.langtog:hover{color:var(--text);border-color:var(--dim)}body.land{position:relative;overflow-y:auto}body.land:before{content:"";z-index:0;pointer-events:none;background:radial-gradient(680px 380px at 22% -6%,#22c55e21,#0000 60%),radial-gradient(720px 420px at 90% 8%,#3859ff1f,#0000 60%);position:fixed;inset:0}body.land .top{backdrop-filter:none;background:0 0;border-bottom:0;position:relative}.land-main{z-index:1;text-align:center;max-width:1040px;margin:0 auto;padding:20px 22px 24px;position:relative}.eyebrow{font-family:var(--mono);color:var(--accent);background:var(--accent-soft);border:1px solid #22c55e47;border-radius:999px;align-items:center;gap:8px;margin:8px 0 18px;padding:6px 13px;font-size:12.5px;font-weight:500;display:inline-flex}.eyebrow .dot{background:var(--accent);width:7px;height:7px;box-shadow:0 0 10px var(--accent);border-radius:50%}h1.hero{letter-spacing:-.035em;margin:0 0 16px;font-size:clamp(30px,5.4vw,50px);font-weight:800;line-height:1.08}h1.hero .g{color:var(--accent)}p.lead{color:var(--dim);max-width:520px;margin:0 auto 26px;font-size:clamp(15px,2vw,17px);line-height:1.6}.cta{background:var(--accent);height:52px;color:var(--accent-ink);border-radius:13px;align-items:center;gap:11px;padding:0 26px;font-size:16px;font-weight:800;transition:transform .14s,box-shadow .18s,filter .15s;display:inline-flex;box-shadow:0 10px 30px #22c55e52}.cta:hover{filter:brightness(1.05);transform:translateY(-2px);box-shadow:0 14px 38px #22c55e6b}.cta:active{transform:translateY(0)}.cta .gwrap{background:#fff;border-radius:5px;place-items:center;width:22px;height:22px;display:grid}.cta .gwrap svg{width:15px;height:15px}.termcard{border-radius:var(--r);border:1px solid var(--border-2);background:var(--surface-2);max-width:540px;box-shadow:var(--shadow);text-align:left;margin:30px auto 0;overflow:hidden}.termcard .bar{background:var(--surface);border-bottom:1px solid var(--border);align-items:center;gap:7px;padding:11px 14px;display:flex}.termcard .bar i{border-radius:50%;width:11px;height:11px;display:block}.termcard .bar .r{background:#ff5f57}.termcard .bar .y{background:#febc2e}.termcard .bar .gr{background:#28c840}.termcard .bar span{font-family:var(--mono);color:var(--dim-2);margin-left:8px;font-size:12px}.termcard pre{font-family:var(--mono);color:#cbd5e1;white-space:pre-wrap;margin:0;padding:16px 18px;font-size:13px;line-height:1.7}.termcard .p{color:var(--accent)}.termcard .a{color:#7dd3fc}.termcard .c{color:var(--dim-2)}.termcard .cur{background:var(--accent);vertical-align:-2px;width:8px;height:15px;animation:1.1s step-end infinite blink;display:inline-block}@keyframes blink{50%{opacity:0}}.feats{flex-wrap:wrap;justify-content:center;gap:14px;margin-top:28px;display:flex}.feat{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);text-align:left;width:210px;padding:18px 20px}.feat .fi{background:var(--accent-soft);width:34px;height:34px;color:var(--accent);border-radius:9px;place-items:center;margin-bottom:12px;display:grid}.feat b{margin-bottom:5px;font-size:15px;font-weight:700;display:block}.feat span{color:var(--dim);font-size:13px;line-height:1.55}footer.land{z-index:1;text-align:center;color:var(--dim-2);font-size:12px;font-family:var(--mono);padding:8px 0 30px;position:relative}body.app{overflow:hidden}.app-wrap{height:calc(100% - 56px);display:flex}aside{border-right:1px solid var(--border);background:var(--surface-2);flex-direction:column;flex:none;width:264px;display:flex}.side-h{justify-content:space-between;align-items:center;padding:15px 15px 11px;display:flex}.side-h span{font-family:var(--mono);letter-spacing:1px;color:var(--dim-2);text-transform:uppercase;font-size:11.5px;font-weight:600}#addbtn{background:var(--accent);color:var(--accent-ink);border-radius:var(--r-xs);cursor:pointer;border:0;align-items:center;gap:5px;padding:7px 13px;font-size:13px;font-weight:800;transition:filter .15s;display:inline-flex}#addbtn:hover{filter:brightness(1.08)}#hosts{flex:1;padding:0 9px 14px;overflow-y:auto}#hosts .empty{color:var(--dim-2);padding:14px;font-size:13px;line-height:1.7}.hostrow{border-radius:var(--r-sm);cursor:pointer;align-items:center;gap:8px;margin-bottom:2px;padding:11px;transition:background .13s;display:flex}.hostrow:hover{background:var(--muted)}.hostrow .hi{flex-direction:column;flex:1;gap:2px;display:flex;overflow:hidden}.hostrow .hi b{white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:600;overflow:hidden}.hostrow .hi small{color:var(--dim);font-size:11.5px;font-family:var(--mono);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.hostrow .edit,.hostrow .del{color:var(--dim-2);cursor:pointer;opacity:0;background:0 0;border:0;border-radius:6px;padding:4px;font-size:14px;transition:all .13s}.hostrow:hover .edit,.hostrow:hover .del{opacity:1}.hostrow .edit:hover{color:var(--text);background:var(--muted)}.hostrow .del:hover{color:var(--danger);background:#ef44441f}main{flex:1;min-width:0;position:relative}.welcome{text-align:center;place-items:center;height:100%;padding:40px 22px;display:grid;overflow:auto}.welcome .win{max-width:540px}.welcome .eyebrow{margin:0 0 22px}.welcome h1{letter-spacing:-.03em;margin:0 0 16px;font-size:clamp(26px,4vw,40px);font-weight:800;line-height:1.12}.welcome h1 .g{color:var(--accent)}.welcome .sub{color:var(--dim);max-width:420px;margin:0 auto 26px;font-size:15px;line-height:1.6}.startbtn{background:var(--accent);color:var(--accent-ink);cursor:pointer;border:0;border-radius:12px;align-items:center;gap:7px;height:46px;padding:0 22px;font-size:15px;font-weight:800;transition:transform .14s,filter .15s;display:inline-flex;box-shadow:0 8px 24px #22c55e47}.startbtn:hover{filter:brightness(1.06);transform:translateY(-1px)}.welcome .feats{margin-top:40px}.tabs{border-bottom:1px solid var(--border);background:var(--surface-2);align-items:center;gap:3px;height:44px;padding:0 12px;display:flex}.tab{color:var(--dim);cursor:pointer;border-radius:var(--r-xs) var(--r-xs) 0 0;background:0 0;border:0;padding:9px 14px;font-size:13.5px;font-weight:600;transition:all .13s}.tab:hover{color:var(--text)}.tab.on{color:var(--text);background:var(--bg);box-shadow:inset 0 -2px 0 var(--accent)}.tabs .conn{color:var(--dim-2);font-size:12px;font-family:var(--mono);margin-left:auto}.tabs .fontctl{gap:2px;margin-left:12px;display:inline-flex}.tabs .fontctl button{color:var(--dim);font-size:12px;font-weight:700;font-family:var(--mono);border:1px solid var(--border-2);border-radius:var(--r-xs);cursor:pointer;background:0 0;padding:5px 9px;line-height:1;transition:all .15s}.tabs .fontctl button:hover{color:var(--text);border-color:var(--dim)}.tabs .disc{color:var(--dim);border:1px solid var(--border-2);border-radius:var(--r-xs);cursor:pointer;background:0 0;align-items:center;margin-left:12px;padding:6px 12px;font-size:12px;font-weight:600;transition:all .15s;display:inline-flex}.tabs .disc:hover{color:var(--danger);border-color:var(--danger);background:#ef44441a}.pane{position:absolute;inset:44px 0 0}#pane-term{background:var(--bg);padding:8px 10px}#pane-term .xterm{height:100%}.fbar{border-bottom:1px solid var(--border);background:var(--surface-2);align-items:center;gap:10px;height:38px;padding:0 12px;display:flex}.fbar .up{background:var(--muted);color:var(--text);border:1px solid var(--border-2);border-radius:var(--r-xs);cursor:pointer;font-size:12px;font-family:var(--mono);padding:4px 11px}.fbar .up:hover{border-color:var(--dim)}.fbar .cwd{color:var(--dim);font-size:12.5px;font-family:var(--mono);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.fbody{display:flex;position:absolute;inset:38px 0 0}.flist{border-right:1px solid var(--border);flex:none;width:270px;margin:0;padding:8px;list-style:none;overflow-y:auto}.flist li{border-radius:var(--r-xs);cursor:pointer;font-size:13px;font-family:var(--mono);white-space:nowrap;text-overflow:ellipsis;padding:6px 9px;transition:background .1s;overflow:hidden}.flist li:hover{background:var(--muted)}.flist li.dir{color:#7dd3fc;font-weight:600}.fed{flex-direction:column;flex:1;min-width:0;display:flex}.edhead{border-bottom:1px solid var(--border);background:var(--surface-2);align-items:center;gap:10px;height:38px;padding:0 12px;display:flex}.edhead .edpath{color:var(--dim);font-size:12.5px;font-family:var(--mono);text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.edhead .save{background:var(--accent);color:var(--accent-ink);border-radius:var(--r-xs);cursor:pointer;border:0;padding:5px 14px;font-size:12px;font-weight:800;transition:filter .15s}.edhead .save:hover{filter:brightness(1.08)}.edhead .save:disabled{background:var(--muted);color:var(--dim-2);cursor:default}.edroot{flex:1;overflow:auto}.cm-editor{height:100%;font-size:13px}.cm-editor .cm-scroller{font-family:var(--mono)}.ov{backdrop-filter:blur(4px);z-index:100;background:#02060fa8;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.modal{background:var(--surface);border:1px solid var(--border-2);border-radius:var(--r);width:min(94vw,360px);box-shadow:var(--shadow);padding:24px}.modal.wide{width:min(96vw,460px)}.modal h3{margin:0 0 18px;font-size:17px;font-weight:700}.modal label{color:var(--dim);flex-direction:column;gap:6px;margin-bottom:13px;font-size:12px;font-weight:600;display:flex}.modal .row2{gap:11px;display:flex}.modal .row2 label:last-child{flex:none;width:96px}.modal input,.modal select{background:var(--bg);border:1px solid var(--border-2);border-radius:var(--r-xs);color:var(--text);width:100%;padding:10px 12px;font-size:14px;transition:border-color .15s,box-shadow .15s}.modal input:focus,.modal select:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 3px #22c55e2e}.modal .keyrow{flex-wrap:wrap;align-items:center;gap:9px;margin-bottom:15px;display:flex}.modal .keyrow .pick{background:var(--muted);color:var(--text);border:1px solid var(--border-2);border-radius:var(--r-xs);cursor:pointer;padding:8px 13px;font-size:13px;font-weight:600}.modal .keyrow .pick:hover{border-color:var(--dim)}.modal .keyrow .keyname{color:var(--dim);font-size:12px;font-family:var(--mono)}.modal .chk{color:var(--text);cursor:pointer;flex-direction:row;align-items:center;gap:7px;width:100%;margin:0;font-weight:500}.modal .chk input{width:auto}.mbtns{justify-content:flex-end;gap:9px;margin-top:6px;display:flex}.mbtns button{border-radius:var(--r-xs);cursor:pointer;border:0;padding:9px 18px;font-size:13.5px;font-weight:700;transition:filter .15s}.mbtns .cancel{background:var(--muted);color:var(--text)}.mbtns .ok{background:var(--accent);color:var(--accent-ink)}.mbtns .ok:hover,.mbtns .cancel:hover{filter:brightness(1.1)}@media (width<=640px){aside{width:210px}.flist{width:180px}}
