:root {
  --ms-radius: 18px;
}
body { background: #f6f7f9; }
.page-wrap { max-width: 1240px; padding: 24px 16px 80px; }
.card { border: 0; border-radius: var(--ms-radius); box-shadow: 0 8px 30px rgba(15, 23, 42, .06); }
.card-header { background: #fff; border-bottom: 1px solid #eef0f3; border-radius: var(--ms-radius) var(--ms-radius) 0 0 !important; }
.form-control, .form-select, .btn { border-radius: 12px; }
.btn { font-weight: 600; }
.mobile-action-bar { position: sticky; bottom: 0; z-index: 20; background: rgba(246,247,249,.95); backdrop-filter: blur(8px); padding: 12px 0; border-top: 1px solid #e7e9ee; }
.variant-card { border: 1px solid #e6e9ee; border-radius: 16px; padding: 16px; background: #fff; }
.variant-label { font-weight: 700; color: #111827; }
.thumb { width: 92px; height: 92px; object-fit: cover; border-radius: 14px; border: 1px solid #e5e7eb; background: #fff; }
.table thead th { white-space: nowrap; }
.small-muted { color: #6b7280; font-size: .875rem; }
@media (max-width: 768px) {
  .desktop-table { display: none; }
  .page-wrap { padding-left: 12px; padding-right: 12px; }
  .card-body { padding: 16px; }
  .btn { min-height: 42px; }
  .form-control, .form-select { min-height: 44px; }
}
@media (min-width: 769px) { .mobile-cards { display: none; } }
.category-card { border: 1px solid #e6e9ee; border-radius: 16px; padding: 14px; background: #fff; margin-left: calc(var(--depth, 0) * 18px); }
.category-pill { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; background: #eef2ff; color: #3730a3; font-size: .78rem; font-weight: 700; }
.category-tree-list { max-height: 320px; overflow: auto; border: 1px solid #edf0f4; border-radius: 14px; padding: 10px; background: #fff; }
@media (max-width: 768px) { .category-card { margin-left: 0; } }
.category-quick-add { border: 1px dashed #cfd6e2; border-radius: 14px; padding: 12px; background: #fafbfc; }
.category-quick-feedback { min-height: 20px; }