@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Noto+Sans+KR:wght@400;500;700;900&display=swap');
:root{--lime:#c8ff3d;--ink:#11130e;--muted:#74786b;--line:#dfe2d8;--paper:#f4f5ef}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Noto Sans KR',sans-serif;min-height:100vh}.glow{position:fixed;width:480px;height:480px;border-radius:50%;background:rgba(200,255,61,.25);filter:blur(100px);right:-140px;top:-240px;pointer-events:none}main{width:min(1180px,calc(100% - 48px));margin:auto;position:relative}header{height:92px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{font:500 18px 'DM Mono';letter-spacing:2px;display:flex;align-items:center;gap:13px}.brand b{color:#75951d}.logo{display:grid;place-items:center;background:var(--ink);color:var(--lime);width:40px;height:40px;border-radius:9px;font-weight:bold}.secure{font:11px 'DM Mono';letter-spacing:1px}.secure i,.status:before{display:inline-block;width:7px;height:7px;background:#7da413;border-radius:50%;margin-right:8px}.hero{display:grid;grid-template-columns:1fr 480px;gap:80px;padding:84px 0 78px;align-items:center}.eyebrow{font:500 12px 'DM Mono';letter-spacing:2px;color:#789b17;margin:0 0 22px}.intro h1{font-size:clamp(46px,5vw,72px);line-height:1.12;letter-spacing:-4px;margin:0;font-weight:900}.intro h1 em{font-style:normal;color:#7a9e18}.lead{color:var(--muted);font-size:15px;line-height:1.9;margin-top:30px}.panel{background:#fff;border:1px solid var(--line);border-radius:16px;padding:28px;box-shadow:0 18px 60px rgba(40,50,20,.08)}.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.panel-head>div{display:flex;align-items:center;gap:12px}.panel h2{font-size:19px;margin:0}.step{font:12px 'DM Mono';color:#87a72b}.status{font:11px 'DM Mono';color:var(--muted)}label{display:block;font:500 11px 'DM Mono';letter-spacing:.5px;margin:15px 0 0}input{display:block;width:100%;border:1px solid var(--line);border-radius:8px;padding:13px 14px;margin-top:8px;background:#fafbf7;font:14px 'DM Mono';outline:none}input:focus{border-color:#91b323;box-shadow:0 0 0 3px rgba(200,255,61,.18)}.grid{display:grid;grid-template-columns:1fr 2fr;gap:12px}.divider{display:flex;align-items:center;gap:12px;color:#9ca093;font-size:10px;margin:20px 0 4px}.divider:before,.divider:after{content:"";height:1px;background:var(--line);flex:1}.drop{display:flex;border:1px dashed #cbd0c0;border-radius:9px;padding:15px;align-items:center;gap:13px;cursor:pointer}.drop:hover{background:#f9fbeF;border-color:#90ab43}.drop input{display:none}.upload{font-size:21px;color:#789b17}.drop b,.drop small{display:block}.drop b{font:500 12px 'Noto Sans KR'}.drop small{color:#999;font:10px 'DM Mono';margin-top:3px}.panel button[type=submit]{width:100%;border:0;border-radius:9px;background:var(--ink);color:white;padding:16px 18px;margin-top:20px;display:flex;justify-content:space-between;font-weight:700;cursor:pointer;transition:.2s}.panel button:hover{background:#272b20;transform:translateY(-1px)}.panel button b{color:var(--lime)}.error{color:#c43d35;font-size:12px;margin:12px 0 0;min-height:17px}.terminal-wrap{margin:0 0 60px;border-radius:14px;overflow:hidden;box-shadow:0 20px 70px rgba(10,12,8,.2)}.terminal-bar{height:48px;background:#24271f;color:#bfc4b5;display:flex;align-items:center;justify-content:space-between;padding:0 16px;font:11px 'DM Mono'}.terminal-bar i{display:inline-block;width:10px;height:10px;border-radius:50%;background:#ff6259;margin-right:6px}.terminal-bar i:nth-child(2){background:#ffbd2e}.terminal-bar i:nth-child(3){background:#27c840}.terminal-bar button{background:none;border:1px solid #565b50;color:#bbb;border-radius:5px;padding:6px 10px;cursor:pointer}#terminal{height:460px;background:#11130e;padding:14px}footer{border-top:1px solid var(--line);padding:27px 0 40px;display:flex;justify-content:space-between;color:#92968a;font:10px 'DM Mono';letter-spacing:1px}@media(max-width:850px){main{width:min(100% - 28px,600px)}.hero{grid-template-columns:1fr;gap:42px;padding:55px 0}.intro h1{letter-spacing:-2px}.secure{display:none}.panel{padding:22px}footer{gap:12px;flex-direction:column}.terminal-wrap{margin-top:20px}}
.advanced{margin-top:14px;color:var(--muted);font-size:11px}.advanced summary{cursor:pointer;font:11px 'DM Mono';text-align:right}.advanced small{display:block;margin-top:6px;line-height:1.5}.advanced[open]{padding:12px;background:#f7f8f3;border-radius:8px}.advanced[open] summary{text-align:left}
.panel button:disabled{cursor:wait;opacity:.65;transform:none}
.key-vault{margin-top:7px;padding:8px 10px;border-radius:8px;background:#f7f8f3}.remember-key{display:flex;align-items:center;gap:7px;margin:0;font:500 11px 'Noto Sans KR';cursor:pointer}.remember-key input{width:auto;margin:0;accent-color:#789b17}.vault-help{display:block;color:#8b8f82;font-size:9px;line-height:1.45;margin-top:5px}.saved-key-row{display:flex;align-items:center;justify-content:space-between;margin-top:6px;padding-top:6px;border-top:1px solid var(--line);font-size:10px}.saved-key-row span,.saved-key-row small{display:block}.saved-key-row small{color:#789b17;margin-top:2px}.saved-key-row button{border:1px solid #d5aaa6;border-radius:5px;background:white;color:#a33b34;padding:3px 8px;font-size:10px;cursor:pointer}
.host-presets{border:0;padding:0;margin:6px 0 0;display:flex;gap:6px;flex-wrap:wrap}.host-presets legend{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.host-presets button{border:1px solid var(--line);border-radius:999px;background:#fafbf7;color:var(--muted);padding:5px 9px;font:10px 'DM Mono';cursor:pointer;transition:.15s}.host-presets button:hover{border-color:#91b323;color:var(--ink)}.host-presets button[aria-pressed=true]{border-color:#91b323;background:rgba(200,255,61,.18);color:#58730e}
.terminal-actions{display:flex;gap:6px}.terminal-actions .danger{border-color:#b95b55;color:#ffb1aa}.terminal-wrap:fullscreen{background:#11130e;border-radius:0;margin:0;display:flex;flex-direction:column}.terminal-wrap:fullscreen #terminal{height:auto;flex:1}.terminal-wrap:fullscreen .terminal-bar{flex:0 0 48px}@media(max-width:650px){.terminal-actions button:not(.danger){display:none}.terminal-bar{padding:0 10px}.terminal-bar>span{max-width:45%;overflow:hidden;text-overflow:ellipsis}}

/* Keep the connection card compact so every authentication option is visible at once. */
.panel{padding:14px 22px}.panel-head{margin-bottom:8px}.panel-head>div{gap:10px}.panel h2{font-size:18px}label{font-size:10px;margin-top:7px}input{padding:7px 11px;margin-top:3px;font-size:13px}.grid,.auth-grid{display:grid;grid-template-columns:1fr 2fr;gap:10px}.auth-grid .drop{grid-column:1/-1}.auth-grid:has(#passphrase-field:not([hidden])) .drop{grid-column:auto}.divider{gap:10px;margin:7px 0 1px;font-size:9px}.drop{padding:7px 11px;gap:10px}.upload{font-size:18px}.drop b{font-size:11px}.drop small{font-size:9px;margin-top:1px}.advanced{margin-top:5px;font-size:10px}.advanced summary{font-size:10px}.advanced small{margin-top:4px;line-height:1.4}.advanced[open]{padding:7px}.panel button[type=submit]{padding:9px 14px;margin-top:7px}.error{font-size:11px;margin-top:3px;min-height:12px}
@media(max-width:850px){.panel{padding:14px 18px}}@media(max-width:500px){.auth-grid{grid-template-columns:1fr}}
