.kdb-page { display: grid; gap: 1.5rem; width: 100%; max-width: 88rem; margin-inline: auto; }
.kdb-page [hidden] { display: none !important; }
.kdb-page button, .kdb-modal-bg button { cursor: pointer; }
.kdb-page button:disabled, .kdb-modal-bg button:disabled { cursor: wait; opacity: .55; }
.kdb-page a, .kdb-page button, .kdb-modal-bg button, .kdb-modal-bg input, .kdb-modal-bg select { outline-offset: 2px; }
.kdb-page :is(a,button,input,select):focus-visible, .kdb-modal-bg :is(button,input,select):focus-visible { outline: 2px solid var(--ring); }
.kdb-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .75rem; }
.kdb-heading h1 { margin: 0; font-size: 1.875rem; font-weight: 600; letter-spacing: -.025em; line-height: 1.2; }
.kdb-badge { display: inline-flex; align-items: center; min-height: 1.5rem; padding: .125rem .625rem; border: 1px solid var(--border); border-radius: 999px; background: var(--secondary); color: var(--secondary-foreground); font-size: .75rem; font-weight: 500; }
.kdb-card { min-width: 0; overflow: hidden; border: 1px solid var(--border); border-radius: var(--radius); background: var(--card); color: var(--card-foreground); }
.kdb-card-content { padding: 1.25rem; }
.kdb-card-title { margin: 0; font-size: 1.125rem; font-weight: 600; letter-spacing: -.02em; }
.kdb-muted { color: var(--muted-foreground); }
.kdb-count { font-size: .8125rem; font-weight: 400; }
.kdb-wrap { display: grid; grid-template-columns: minmax(15rem, 17rem) minmax(0, 1fr); align-items: start; gap: 1.25rem; }
.kdb-side, .kdb-main { min-width: 0; }
.kdb-main { display: grid; gap: 1rem; }
.kdb-side .kdb-card-content { display: grid; gap: .25rem; }
.kdb-side-heading { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: 0 .5rem .5rem; }
.kdb-side strong { font-size: .875rem; font-weight: 600; }
.kdb-button { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; min-height: 2.25rem; border: 1px solid var(--border); border-radius: calc(var(--radius) - 2px); padding: .45rem .8rem; color: var(--foreground); background: var(--background); font-size: .8125rem; font-weight: 500; line-height: 1.2; text-decoration: none; white-space: nowrap; }
.kdb-button:hover { background: var(--accent); color: var(--accent-foreground); }
.kdb-button-primary { border-color: var(--primary); background: var(--primary); color: var(--primary-foreground); }
.kdb-button-primary:hover { opacity: .9; background: var(--primary); color: var(--primary-foreground); }
.kdb-catbtn { display: inline-flex; align-items: center; justify-content: center; gap: .25rem; min-width: 1.75rem; min-height: 1.75rem; border-radius: calc(var(--radius) - 3px); padding: .2rem .4rem; background: transparent; color: var(--muted-foreground); font-size: .75rem; }
.kdb-catbtn:hover, .kdb-actions-toggle:hover, .kdb-toggle:hover { background: var(--accent); color: var(--accent-foreground); }
.kdb-cat, .kdb-divider { display: flex; align-items: center; min-width: 0; gap: .2rem; min-height: 2.25rem; border-radius: calc(var(--radius) - 2px); color: var(--muted-foreground); font-size: .8125rem; }
.kdb-cat.active { background: var(--accent); color: var(--accent-foreground); font-weight: 500; }
.kdb-catname { flex: 1; min-width: 0; overflow: hidden; padding: .45rem .25rem; color: inherit; text-overflow: ellipsis; white-space: nowrap; text-decoration: none; }
.kdb-side > .kdb-cat, .kdb-card-content > .kdb-cat { padding-inline: .65rem; }
.kdb-cat .cnt { flex: none; padding: .1rem .35rem; border-radius: 999px; background: var(--muted); color: var(--muted-foreground); font-size: .6875rem; font-variant-numeric: tabular-nums; }
.kdb-topblock, .kdb-children { min-width: 0; }
.kdb-children { margin-left: 1.15rem; padding-left: .35rem; border-left: 1px solid var(--border); }
.kdb-children.collapsed { display: none; }
.kdb-sub { padding-right: .25rem; }
.kdb-divider { gap: .3rem; color: var(--muted-foreground); font-size: .6875rem; }
.kdb-divider-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kdb-divider .ln2 { flex: 1; height: 1px; background: var(--border); }
.kdb-drag { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 1rem; color: var(--muted-foreground); cursor: grab; user-select: none; }
.kdb-drag::before { content: '⋮⋮'; font-size: .75rem; letter-spacing: -.15em; }
.kdb-dragging { opacity: .45; }
.kdb-dragover { box-shadow: inset 0 -2px var(--ring); }
.kdb-toggle, .kdb-actions-toggle { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 1.5rem; height: 1.5rem; border-radius: .25rem; color: var(--muted-foreground); }
.kdb-toggle .material-icons::before { content: '⌄'; font-size: 1rem; }
.kdb-cat-top.collapsed .kdb-toggle .material-icons::before { content: '›'; }
.kdb-actions-toggle .material-icons::before { content: '⋯'; font-size: 1.15rem; }
.kdb-side .material-icons, .kdb-grp .material-icons { font-size: 0; line-height: 0; }
.catact { position: absolute; z-index: 10; display: grid; gap: .15rem; min-width: 10.5rem; margin-top: 2rem; right: .3rem; padding: .25rem; border: 1px solid var(--border); border-radius: calc(var(--radius) - 2px); background: var(--popover); color: var(--popover-foreground); box-shadow: 0 8px 22px rgb(0 0 0 / .14); }
.catact[hidden] { display: none !important; }
.catact .kdb-catbtn { justify-content: flex-start; width: 100%; padding: .4rem .5rem; color: var(--popover-foreground); }
.catact .material-icons { display: none; }
.kdb-cat-top, .kdb-sub, .kdb-divider { position: relative; }
.kdb-category-delete { color: var(--destructive) !important; }
.kdb-category-toggle { display: none; width: 100%; justify-content: space-between; margin-bottom: .75rem; }
.kdb-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.kdb-toolbar .sp { flex: 1; }
.kdb-settings { font-size: .8125rem; }
.kdb-optlbl { display: inline-flex; align-items: center; gap: .45rem; min-height: 2rem; margin-right: .75rem; color: var(--muted-foreground); font-size: .8125rem; cursor: pointer; }
.kdb-optlbl input, .kdb-field input[type=checkbox] { width: 1rem; height: 1rem; accent-color: var(--primary); }
.kdb-table-scroll { width: 100%; overflow-x: auto; border: 1px solid var(--border); border-radius: calc(var(--radius) - 2px); }
.kdb-table { width: 100%; min-width: 70rem; border-collapse: collapse; text-align: left; font-size: .8125rem; }
.kdb-table th { padding: .7rem .75rem; background: var(--muted); color: var(--muted-foreground); font-weight: 500; white-space: nowrap; }
.kdb-table td { padding: .65rem .75rem; border-top: 1px solid var(--border); vertical-align: middle; }
.kdb-table tbody tr:not(.kdb-grp):hover td { background: var(--accent); }
.kdb-table .mono { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; white-space: nowrap; }
.kdb-table .c-product { min-width: 10rem; max-width: 14rem; overflow-wrap: anywhere; font-weight: 500; }
.kdb-table .c-info { max-width: 13rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kdb-table .c-epid { min-width: 27rem; white-space: nowrap; }
.kdb-table .c-code.kdb-mask { cursor: pointer; }
.kdb-table .kdb-inactive { opacity: .6; }
.kdb-typebadge { display: inline-flex; border: 1px solid var(--border); border-radius: 999px; padding: .15rem .5rem; background: var(--secondary); color: var(--secondary-foreground); font-size: .7rem; white-space: nowrap; }
.kdb-act { display: flex; align-items: center; gap: .25rem; }
.kdb-ibtn { min-height: 1.75rem; border: 1px solid var(--border); border-radius: .35rem; padding: .2rem .45rem; color: var(--foreground); background: var(--background); font-size: .7rem; white-space: nowrap; }
.kdb-ibtn:hover { background: var(--accent); }
.kdb-ibtn.kdb-del { color: var(--destructive); }
.kdb-ibtn.kdb-on { color: var(--success); }
.kdb-ibtn.kdb-off { color: var(--muted-foreground); }
.kdb-grp td { padding: .55rem .75rem; background: var(--muted); color: var(--muted-foreground); font-weight: 600; }
.kdb-empty { padding: 1.2rem !important; text-align: center; }
.kdb-spark-empty { font-size: .6875rem; }
.kdb-welcome { display: grid; justify-items: start; gap: .6rem; }
.kdb-welcome p { margin: 0; font-size: .875rem; }
.kdb-welcome-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .5rem; }
.kdb-faq { border-top: 1px solid var(--border); padding: .75rem 0; font-size: .8125rem; }
.kdb-faq:first-of-type { margin-top: .5rem; }
.kdb-faq summary { cursor: pointer; font-weight: 500; }
.kdb-faq-body { padding: .65rem 0 .2rem; color: var(--muted-foreground); line-height: 1.5; }
.kdb-locked { display: grid; justify-items: start; gap: 1rem; padding: 1.5rem; }
.kdb-locked h2 { margin: 0; font-size: 1.25rem; font-weight: 600; }
.kdb-modal-bg { position: fixed; inset: 0; z-index: 100; display: none; align-items: center; justify-content: center; padding: 1rem; background: rgb(0 0 0 / .55); }
.kdb-modal { width: min(100%, 31rem); max-height: min(90vh, 48rem); overflow-y: auto; border: 1px solid var(--border); border-radius: var(--radius); padding: 1.5rem; background: var(--popover); color: var(--popover-foreground); box-shadow: 0 20px 60px rgb(0 0 0 / .2); }
.kdb-modal h3 { margin: 0 0 1.25rem; font-size: 1.125rem; font-weight: 600; }
.kdb-field { display: grid; gap: .35rem; margin-bottom: .85rem; font-size: .8125rem; }
.kdb-field label { font-weight: 500; }
#kc_parentwrap { display: none; }
.kdb-feedback { min-height: 1rem; font-size: .75rem; }
.kdb-dialog-actions { display: flex; justify-content: flex-end; gap: .5rem; margin-top: .5rem; }
.kdb-dialog-actions--confirm { margin-top: .75rem; }
.kdb-confirm-message { font-size: .875rem; line-height: 1.5; }
.kdb-input { width: 100%; min-height: 2.25rem; border: 1px solid var(--input); border-radius: calc(var(--radius) - 2px); padding: .4rem .65rem; background: var(--background); color: var(--foreground); font-size: .8125rem; }
.kdb-input::placeholder { color: var(--muted-foreground); }
#kdbToast { display: none; position: fixed; bottom: 1.25rem; left: 50%; z-index: 1100; max-width: 90%; transform: translateX(-50%); padding: .625rem 1rem; border: 1px solid var(--border); border-left: 3px solid var(--primary); border-radius: calc(var(--radius) - 2px); background: var(--popover); color: var(--popover-foreground); box-shadow: 0 8px 24px rgb(0 0 0 / .2); font-size: .8125rem; }
@media (max-width: 960px) {
  .kdb-wrap { display: block; }
  .kdb-side { margin-bottom: 1rem; }
  .kdb-category-toggle { display: flex; }
  .kdb-toolbar .sp { flex-basis: 100%; }
}
@media (max-width: 600px) {
  .kdb-heading h1 { font-size: 1.5rem; }
  .kdb-card-content { padding: 1rem; }
  .kdb-toolbar .kdb-button { flex: 1; }
  .kdb-optlbl { width: 100%; }
  .kdb-locked { padding: 1rem; }
}