#settings-btn{display:none;cursor:pointer}
#settings-btn.ks-authenticated{display:flex}
#settings-btn svg{width:23px;height:23px}
.ks-dialog{width:min(480px,calc(100vw - 32px));max-height:calc(100dvh - 32px)}
.ks-dialog .kc-header h2{font-size:18px;font-weight:600}
.ks-dialog .kc-header{padding:20px 24px}
.ks-body{padding:20px 24px}
.ks-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}
.ks-heading label,.ks-field>label{font-size:14px;font-weight:600}
.ks-dialog p{font-size:12px;line-height:1.65;color:var(--kc-muted-fg)}
.ks-heading p{margin-top:5px}
#ks-auto{appearance:none;position:relative;flex:none;width:38px;height:22px;background:#d4d4d8;border:1px solid transparent;border-radius:22px;cursor:pointer;transition:background .2s}
#ks-auto:before{content:"";position:absolute;left:2px;top:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px #0002;transition:transform .2s}
#ks-auto:checked{background:#18181b}
#ks-auto:checked:before{transform:translateX(16px)}
#ks-auto:focus-visible{outline:1px solid #71717a;outline-offset:3px}
.ks-field{margin-top:22px;display:grid;gap:9px}
.ks-input-row{display:flex;align-items:center;gap:10px}
.ks-input-row input,.ks-input-row select{height:36px;border:1px solid var(--kc-border);border-radius:6px;background:#fff;color:var(--kc-fg);padding:0 10px;font:inherit;outline:none;min-width:0}
.ks-input-row input{width:110px;max-width:55%}
.ks-input-row select{width:86px}
.ks-dialog [hidden]{display:none!important}
.ks-schedule-row{flex-wrap:wrap}
.ks-schedule-row select{width:auto;min-width:86px}
.ks-input-row input:focus,.ks-input-row select:focus{border-color:var(--kc-border-active)}
.ks-dialog :disabled{opacity:.5;cursor:default}
.ks-next{margin-top:12px;padding:10px 12px;border:1px solid var(--kc-border);border-radius:6px;background:#fafafa;overflow-wrap:anywhere}
.ks-port{padding-top:20px;border-top:1px solid var(--kc-border)}
.ks-status{min-height:38px;padding-top:12px}
.ks-dialog .ks-status.error{color:var(--kc-block)}
.ks-actions{display:flex;justify-content:flex-end;margin-top:10px}
.ks-primary{background:#18181b;color:#fff;border-color:#18181b}
.ks-restart{border-top:1px solid var(--kc-border);padding:20px 24px;display:flex;align-items:flex-start;gap:16px}
.ks-restart>div{flex:1;min-width:0}
.ks-restart h3{font-size:14px;font-weight:600;margin-bottom:5px}
.ks-restart button{flex-shrink:0;color:#b91c1c}
#ks-restart,#ks-confirm{background:#fee2e2;border-color:#fecaca;color:#b91c1c}
#ks-restart:hover:not(:disabled),#ks-confirm:hover:not(:disabled){background:#fecaca;border-color:#fca5a5}
.ks-last{margin-top:8px;overflow-wrap:anywhere}
.ks-version{padding:0 24px 16px;font-size:11px;color:var(--kc-muted-fg);overflow-wrap:anywhere}
.ks-version.ks-version-error{color:#b91c1c}
#ks-restart{min-width:82px;min-height:36px;display:inline-flex;align-items:center;justify-content:center}
.ks-spinner{display:none;width:20px;height:20px}
#ks-restart.ks-waiting{opacity:1;cursor:wait}
.ks-waiting .ks-restart-label{display:none}
.ks-waiting .ks-spinner{display:block;animation:ks-spin 1s linear infinite}
@keyframes ks-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.ks-waiting .ks-spinner{animation-duration:2.5s}}
@media(max-width:500px){.ks-body,.ks-restart{padding:18px 16px}.ks-dialog .kc-header{padding:16px}.ks-restart{flex-direction:column}.ks-actions{margin-top:6px}}
