/* Life OS — 🖥️ Server page (pages/server.js) */
.srv-page { display: flex; flex-direction: column; gap: 16px; max-width: 760px; }
.srv-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; }
.srv-tile { border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; background: var(--panel); min-width: 0; }
.srv-tile.ok { border-color: color-mix(in srgb, #22a06b 55%, var(--border)); }
.srv-tile.bad { border-color: color-mix(in srgb, var(--danger) 55%, var(--border)); }
.srv-tile-label { font-size: 0.8rem; color: var(--text-muted); }
.srv-tile-value { font-size: 1.25rem; font-weight: 700; color: var(--text); margin-top: 2px; }
.srv-tile-note { font-size: 0.78rem; color: var(--text-faint); margin-top: 4px; overflow-wrap: anywhere; }
.srv-box { border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; background: var(--panel); }
.srv-box .section-title { margin: 0 0 8px; }
.srv-row { display: flex; gap: 8px; flex-wrap: wrap; }
.srv-row .sc-input { flex: 1 1 240px; min-width: 0; }
.srv-choice:empty, .srv-backups:empty { display: none; }
.srv-choice, .srv-backups { margin-top: 10px; display: flex; flex-direction: column; gap: 6px; }
.srv-backup { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 4px 0; border-top: 1px solid var(--border); }
.srv-setup > summary { cursor: pointer; list-style: revert; }
.srv-setup > summary .section-title { display: inline; }