.numbers-view { display: grid; gap: 14px; }
.numbers-editor-panel, .numbers-directory { padding: 20px; }
.numbers-editor-heading, .numbers-directory-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.numbers-editor-heading h2, .numbers-directory-head h2 { margin: 0 0 4px; }
.numbers-editor-heading p, .numbers-directory-head p { margin: 0; color: var(--muted); }
.numbers-form { display: grid; grid-template-columns: repeat(4, minmax(160px, 1fr)); gap: 14px; margin-top: 18px; align-items: end; }
.numbers-form label { display: grid; gap: 6px; min-width: 0; font-weight: 650; }
.numbers-form input:not([type="checkbox"]), .numbers-form select, .numbers-form textarea, .numbers-filter input, .numbers-filter select { width: 100%; min-width: 0; border: 1px solid var(--border); border-radius: 9px; padding: 10px 11px; color: var(--ink); background: var(--card); font: inherit; }
.numbers-form-check { display: flex !important; align-items: center; gap: 9px !important; min-height: 42px; }
.numbers-form-check input, .numbers-check input { width: 18px; height: 18px; accent-color: #a87631; cursor: pointer; }
.numbers-form-comment { grid-column: span 3; }
.numbers-form-actions { display: flex; justify-content: flex-end; }
.numbers-filters { display: grid; grid-template-columns: minmax(190px, 1fr) 155px minmax(160px, 210px) 130px 130px auto; gap: 10px; margin: 18px 0 14px; align-items: end; }
.numbers-filter { display: grid; gap: 5px; min-width: 0; font-size: 12px; color: var(--muted); }
.numbers-filter-reset { min-height: 42px; white-space: nowrap; }
.numbers-table { width: 100%; border-collapse: separate; border-spacing: 0; font-variant-numeric: tabular-nums; }
.numbers-table th, .numbers-table td { padding: 11px 12px; border-bottom: 1px solid var(--border); text-align: left; vertical-align: middle; white-space: nowrap; }
.numbers-table th { color: var(--muted); font-size: 12px; font-weight: 750; background: var(--card); }
.numbers-header-label { display: inline-flex; align-items: center; justify-content: center; gap: 5px; white-space: nowrap; }
.numbers-header-choice { position: relative; display: inline-grid; place-items: center; flex: 0 0 22px; width: 22px; height: 22px; border: 1px solid var(--border); border-radius: 5px; background: var(--card); color: var(--muted); }
.numbers-header-choice.is-active { border-color: #c99a57; background: #fbf3e8; color: #9b6728; }
.numbers-header-choice:focus-within { outline: 2px solid #a87631; outline-offset: 2px; }
.numbers-header-choice-icon { font-size: 14px; font-weight: 750; line-height: 1; }
.numbers-header-choice select { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.numbers-table tbody tr:hover td { background: rgba(173, 131, 73, .06); }
.numbers-table .numbers-phone { font-size: 14px; }
.numbers-icc { font-size: 12px; letter-spacing: .01em; }
.numbers-table .numbers-check { text-align: center; }
.numbers-comment { min-width: 160px; max-width: 300px; white-space: normal !important; overflow-wrap: anywhere; }
.numbers-comment.is-utility { color: #a42622; font-weight: 750; background: rgba(206, 64, 52, .09); }
.numbers-actions { display: flex; align-items: center; gap: 6px; }
.numbers-actions button { padding: 6px 9px; }
.numbers-actions .danger { color: #a42622; }
@media (max-width: 1420px) { .numbers-filters { grid-template-columns: repeat(3, minmax(0, 1fr)); } .numbers-filter-search { grid-column: span 2; } }
@media (max-width: 1000px) { .numbers-form { grid-template-columns: repeat(2, minmax(0, 1fr)); } .numbers-form-comment { grid-column: span 2; } }
@media (max-width: 600px) {
  .numbers-editor-panel, .numbers-directory { padding: 14px; }
  .numbers-editor-heading, .numbers-directory-head { flex-wrap: wrap; }
  .numbers-form { grid-template-columns: 1fr; }
  .numbers-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .numbers-filter-search, .numbers-filter-date, .numbers-filter-account, .numbers-filter-reset { grid-column: 1 / -1; }
  .numbers-form-comment { grid-column: auto; }
  .numbers-form-actions { justify-content: stretch; }
  .numbers-form-actions button { width: 100%; }
  .numbers-table { min-width: 860px; }
}
