/* sc-ssh-keys-v1: account SSH keys (Security page) + installed keys / reinstall picker (server window).
   Uses the portal tokens only; every value has a fallback so the file works on both pages. */
.ssk{display:flex;flex-direction:column;gap:14px;--ssk-line:var(--line,var(--bdr,#22262e));--ssk-bg:var(--bg1,var(--bg2,#0f1217));
  --ssk-bg2:var(--bg2,var(--bg3,#151922));--ssk-acc:var(--accent,var(--blue,#89c4e1));--ssk-mono:var(--mono,ui-monospace,monospace)}
.ssk-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
.ssk-sub{margin:0;color:var(--ink2);font-size:.84rem;line-height:1.55;flex:1 1 320px}
.ssk-count{font-family:var(--ssk-mono);font-size:.72rem;letter-spacing:.08em;color:var(--ink3,var(--muted));white-space:nowrap;padding-top:2px}
.ssk-card{background:var(--ssk-bg);border:1px solid var(--ssk-line);border-radius:var(--sc-radius,8px);padding:16px}
.ssk-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:end}
.ssk-field{display:flex;flex-direction:column;gap:6px;min-width:0}
.ssk-field-key{grid-column:1/-1}
.ssk-field>span{font-size:.74rem;color:var(--ink2);letter-spacing:.02em}
.ssk-field input,.ssk-field textarea{width:100%;padding:9px 12px;background:var(--ssk-bg2);border:1px solid var(--ssk-line);border-radius:var(--r-sm,6px);
  color:var(--ink);font:inherit;font-size:.86rem;outline:none;box-sizing:border-box}
.ssk-field textarea{font-family:var(--ssk-mono);font-size:.76rem;line-height:1.5;min-height:78px;resize:vertical;word-break:break-all}
.ssk-field input:focus,.ssk-field textarea:focus{border-color:var(--ssk-acc)}
.ssk-hint{grid-column:1/-1;margin:0;color:var(--ink3,var(--muted));font-size:.76rem;line-height:1.5}
.ssk-hint code,.ssk-mono{font-family:var(--ssk-mono);font-size:.74rem;color:var(--ink3,var(--muted))}
.ssk-err{grid-column:1/-1;color:#fca5a5;font-size:.8rem;margin:0;line-height:1.5}
.ssk-note{margin:0;color:var(--ink2);font-size:.8rem;line-height:1.5}
.ssk-list{list-style:none;margin:0;padding:0;background:var(--ssk-bg);border:1px solid var(--ssk-line);border-radius:var(--sc-radius,8px);overflow:hidden}
.ssk-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 16px;align-items:center;padding:12px 14px;border-bottom:1px solid var(--ssk-line)}
.ssk-list>li:last-child{border-bottom:0}
.ssk-main{min-width:0;display:flex;flex-direction:column;gap:5px}
.ssk-name{display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:var(--ink);font-weight:600;font-size:.88rem;min-width:0}
.ssk-name>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.ssk-chip{font-size:.66rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:2px 8px;border-radius:999px;border:1px solid var(--ssk-line);color:var(--ink2);white-space:nowrap}
.ssk-chip.is-acc{color:var(--ssk-acc);border-color:color-mix(in srgb,var(--ssk-acc) 45%,transparent)}
.ssk-chip.is-warn{color:#fbbf24;border-color:color-mix(in srgb,#fbbf24 45%,transparent)}
.ssk-meta{display:flex;flex-wrap:wrap;gap:4px 14px;color:var(--ink2);font-size:.76rem}
.ssk-fp{font-family:var(--ssk-mono);font-size:.74rem;color:var(--ink3,var(--muted));word-break:break-all}
.ssk-act{display:flex;gap:6px;align-items:center;justify-content:flex-end;flex-wrap:wrap}
.ssk-confirm{font-size:.76rem;color:var(--ink2)}
.ssk-empty,.ssk-loaderr{padding:20px 16px;text-align:center;color:var(--ink2);font-size:.86rem;background:var(--ssk-bg);border:1px dashed var(--ssk-line);border-radius:var(--sc-radius,8px)}
.ssk-pre{margin:6px 0 0;padding:9px 12px;background:var(--ssk-bg2);border:1px solid var(--ssk-line);border-radius:var(--r-sm,6px);overflow-x:auto;
  font-family:var(--ssk-mono);font-size:.74rem;line-height:1.6;color:var(--ink);white-space:pre}
@media (max-width:560px){.ssk-form{grid-template-columns:1fr}.ssk-form .btn{justify-content:center}.ssk-row{grid-template-columns:minmax(0,1fr)}.ssk-act{justify-content:flex-start}.ssk-card{padding:14px}}

/* server window: what is installed */
.ssk-srv{margin:10px 0 12px;padding:10px 12px;border:1px solid var(--sc-line,var(--bdr,#22262e));border-radius:10px;display:flex;flex-direction:column;gap:8px}
.ssk-srv__top{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.ssk-srv__label{font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.ssk-srv__user{font-size:.84rem;color:var(--ink)}
.ssk-srv__user code{font-family:var(--mono,ui-monospace,monospace)}
.ssk-srv__keys{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:5px}
.ssk-srv__keys li{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;font-size:.8rem;color:var(--ink)}
.ssk-srv__muted{font-size:.78rem;color:var(--muted);line-height:1.5;margin:0}
.ssk-srv__muted a,.ssk-pick a{color:var(--blue,#89c4e1)}
.ssk-srv .ok{color:var(--grn,#34d399)}
.ssk-srv .warn{color:#fbbf24}
#srv-modal-body[data-tab=network] .ssk-srv,#srv-modal-body[data-tab=backups] .ssk-srv{display:none}

/* reinstall: key picker */
.ssk-pick{display:flex;flex-direction:column;gap:6px;margin:0;padding:0;border:0;font-size:12px;color:var(--muted,#8a929e)}
.ssk-pick legend{padding:0;margin-bottom:4px}
.ssk-pick label{display:flex;align-items:center;gap:8px;color:var(--sc-text,#e6e9ee);font-size:13px;cursor:pointer}
.ssk-pick label .ssk-fp{font-size:.72rem}
.ssk-pick input[type=checkbox]{accent-color:var(--blue,#89c4e1);width:15px;height:15px;flex:none}
.ssk-pick .ssk-pw{margin-top:4px;padding-top:8px;border-top:1px solid var(--sc-line,#22262e)}
.ssk-pick .ssk-pw.is-off{opacity:.55;cursor:not-allowed}
