#multimediaBrandKeywordDataView { width: 100%; min-width: 0; }

.brand-keyword-page {
  display: grid;
  gap: 18px;
  width: 100%;
  padding: 22px 24px 40px;
  color: #243b45;
  background: #f3f6f8;
}
.brand-keyword-control-card,
.brand-keyword-data-card {
  border: 1px solid #dfe7e9;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(31, 55, 65, 0.07);
}
.brand-keyword-control-card { padding: 22px; }
.brand-keyword-heading,
.brand-keyword-table-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
}
.brand-keyword-heading h3,
.brand-keyword-table-heading h4 { margin: 0; color: #18333f; }
.brand-keyword-heading h3 { font-size: 25px; }
.brand-keyword-heading p { margin: 7px 0 0; color: #71838b; }
.brand-keyword-save-area { display: flex; align-items: center; gap: 12px; }
.brand-keyword-save-area span { color: #71838b; font-size: 13px; }
.brand-keyword-save-area button,
.brand-keyword-unsaved-dialog button {
  min-height: 40px;
  padding: 0 16px;
  border: 1px solid #ef4766;
  border-radius: 8px;
  color: #fff;
  background: #ef4766;
  font-weight: 700;
}
.brand-keyword-save-area button:disabled { cursor: not-allowed; opacity: 0.45; }
.brand-keyword-control-card .multimedia-filters { margin-top: 18px; }
.brand-keyword-validation { margin-top: 12px; padding: 10px 12px; border-radius: 8px; color: #b42318; background: #fff1f0; }
.brand-keyword-validation.hidden { display: none; }

.brand-keyword-data-card { overflow: hidden; }
.brand-keyword-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-bottom: 1px solid #dfe7e9; background: #f7f9fa; }
.brand-keyword-tabs button { min-height: 48px; border: 0; border-radius: 0; color: #536a73; background: transparent; box-shadow: none; font-weight: 700; }
.brand-keyword-tabs button.active { color: #e62f51; background: #fff; box-shadow: inset 0 -3px #ef4766; }
.brand-keyword-table-heading { padding: 18px 20px; border-bottom: 1px solid #e3eaec; }
.brand-keyword-table-heading > div { display: flex; align-items: baseline; gap: 10px; }
.brand-keyword-table-heading span,
.brand-keyword-table-heading small { color: #71838b; }
.brand-keyword-table-scroll { overflow: auto; }
.brand-keyword-table { width: 100%; min-width: 720px; border-collapse: collapse; table-layout: fixed; }
.brand-keyword-table th,
.brand-keyword-table td { height: 54px; padding: 8px 14px; border-right: 1px solid #e2e8ea; border-bottom: 1px solid #e2e8ea; text-align: right; }
.brand-keyword-table th:last-child,
.brand-keyword-table td:last-child { border-right: 0; }
.brand-keyword-table thead th { color: #526872; background: #f4f7f8; font-weight: 700; }
.brand-keyword-table tbody th { color: #334e59; background: #fafcfc; text-align: left; }
.brand-keyword-table input { width: 100%; min-height: 38px; padding: 0 10px; border: 1px solid transparent; border-radius: 7px; text-align: right; font-variant-numeric: tabular-nums; }
.brand-keyword-table input:hover,
.brand-keyword-table input:focus { border-color: #b8c9cf; background: #fff; outline: none; }
.brand-keyword-table input.invalid { border-color: #f04438; color: #b42318; background: #fff1f0; }
.brand-keyword-table input::placeholder { color: #b1bdc2; }
.brand-keyword-empty,
.brand-keyword-loading { padding: 46px; color: #71838b; text-align: center; }
.brand-keyword-loading.error { color: #b42318; }

.brand-keyword-unsaved-dialog { width: min(520px, calc(100vw - 48px)); padding: 0; border: 0; border-radius: 14px; box-shadow: 0 24px 70px rgba(20, 39, 47, 0.24); }
.brand-keyword-unsaved-dialog::backdrop { background: rgba(26, 42, 49, 0.46); }
.brand-keyword-unsaved-dialog > div { padding: 28px; }
.brand-keyword-unsaved-dialog h3 { margin: 0; font-size: 22px; }
.brand-keyword-unsaved-dialog p { margin: 10px 0 24px; color: #71838b; }
.brand-keyword-unsaved-dialog footer { display: flex; justify-content: flex-end; gap: 10px; }
.brand-keyword-unsaved-dialog button.secondary { border-color: #dce5e8; color: #425962; background: #f5f8f9; }
.brand-keyword-unsaved-dialog button.ghost { border-color: transparent; color: #6d8088; background: transparent; }

@media (max-width: 760px) {
  .brand-keyword-page { padding: 14px; }
  .brand-keyword-heading,
  .brand-keyword-table-heading { align-items: flex-start; flex-direction: column; }
  .brand-keyword-save-area { width: 100%; justify-content: space-between; }
}