/* Database panel (public/modules/database.js) */
.pm-dlg.db-dlg { max-width: 820px; width: calc(100vw - 32px); max-height: calc(100vh - 48px); overflow: auto; }
.db-meta { margin: -4px 0 0; font-size: 13px; color: var(--ink-muted); }
.db-tabs { display: flex; gap: 6px; flex-wrap: wrap; }
.db-tab { display: inline-flex; align-items: center; gap: 6px; font: inherit; font-size: 13.5px; font-weight: 600; padding: 7px 12px; border-radius: 999px; border: 1px solid var(--line); background: var(--card); color: var(--ink-muted); cursor: pointer; }
.db-tab[aria-selected="true"] { color: var(--ink); background: var(--chip-bg); border-color: color-mix(in srgb, var(--ink) 18%, var(--line)); }
.db-n { font-size: 11.5px; font-weight: 600; color: var(--ink-faint); }
.db-pane { display: flex; flex-direction: column; gap: 10px; }
.db-rule-h, .db-rows-h { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; margin-top: 4px; }
.db-rule-h b, .db-rows-h b { font-size: 14px; }
.db-rules { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 6px; }
.db-rule { display: flex; flex-direction: column; gap: 3px; text-align: left; font: inherit; color: var(--ink); padding: 10px 12px; border-radius: 12px; border: 1px solid var(--line); background: var(--field); cursor: pointer; }
.db-rule b { font-size: 13.5px; } .db-rule span { font-size: 12px; line-height: 1.35; color: var(--ink-muted); }
.db-rule[aria-checked="true"] { border-color: color-mix(in srgb, var(--cta-a) 60%, var(--line)); background: color-mix(in srgb, var(--cta-b) 9%, var(--card)); }
.db-rule:focus-visible, .db-tab:focus-visible { outline: 2px solid var(--accent-text); outline-offset: 2px; }
.db-acts { display: flex; gap: 6px; flex-wrap: wrap; }
.db-table-wrap { max-height: 360px; overflow: auto; }
.db-table td { font-size: 13px; max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.db-when, .db-by { color: var(--ink-muted); }
.db-row-acts { width: 1%; white-space: nowrap; }
.db-row-acts .icon-btn { width: 30px; height: 30px; }
.db-del:hover { color: var(--danger); }
.db-none { margin: 0; padding: 14px 12px; font-size: 13.5px; color: var(--ink-muted); }
.db-users .db-none { padding: 10px 0; }
.db-more { align-self: center; }
.db-edit { display: flex; flex-direction: column; gap: 8px; padding: 14px; border-radius: 14px; border: 1px solid var(--line); background: var(--field); }
.db-kv { display: flex; flex-direction: column; gap: 6px; }
.db-kv-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) auto; gap: 6px; align-items: center; }
.db-hint { margin: 0; font-size: 13px; color: var(--ink-muted); }
.db-users { list-style: none; margin: 0; padding: 0; }
.db-users li { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-top: 1px solid var(--line); }
.db-users li:first-child { border-top: 0; }
.db-users li > div { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.db-users b { font-size: 14px; } .db-users span { font-size: 12.5px; color: var(--ink-muted); overflow: hidden; text-overflow: ellipsis; }
.db-wipe { align-self: flex-start; color: var(--danger); margin-top: 6px; }
.db-empty { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; padding: 18px 8px 8px; }
.db-empty-ic { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; background: var(--chip-bg); color: var(--ink-muted); margin-bottom: 4px; }
.db-empty p { margin: 0; max-width: 420px; font-size: 13.5px; line-height: 1.5; color: var(--ink-muted); }
@media (max-width: 560px) { .db-kv-row { grid-template-columns: minmax(0, 1fr) auto; } .db-kv-row input:nth-child(2) { grid-column: 1; } }