html, body { margin: 0; }

.admin-dialog-overlay { font-family: Roboto, Helvetica, Arial, sans-serif; }
.admin-shell, .admin-shell *, .admin-dialog-overlay, .admin-dialog-overlay * {
  box-sizing: border-box;
}
#root .admin-shell { height: 100vh; height: 100dvh; overflow: hidden; }
.admin-shell .admin-sidebar { width: 298px; flex-shrink: 0; overflow-y: auto; }
.admin-shell .admin-content { min-width: 0; min-height: 0; overflow-wrap: anywhere; }
.admin-content > div, .admin-page-header > div, .admin-detail-row > div { min-width: 0; }
.admin-shell button, .admin-dialog-overlay button {
  min-height: 44px; overflow-wrap: normal; flex-shrink: 0;
}
.admin-shell button:focus-visible, .admin-dialog-overlay button:focus-visible,
.admin-table-scroll:focus-visible { outline: 3px solid #9c7af4; outline-offset: 3px; }
.admin-nav-item { border: 0; background: transparent; text-align: left; font-family: inherit; }
.admin-shell .admin-nav-item { width: 100%; }
.admin-page-header, .admin-actions { flex-wrap: wrap; gap: 12px; }
.admin-form-row > div { min-width: 0; }
.admin-weight-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.admin-table-scroll { max-width: 100%; overscroll-behavior-x: contain; }
.admin-table-hint, .admin-mobile-header { display: none; }
.admin-dialog-body { min-height: 0; }
.admin-dialog-header, .admin-dialog-footer { flex-shrink: 0; }
.admin-dialog-header { gap: 12px; }
.admin-dialog-header h3 { overflow-wrap: anywhere; }
.admin-dialog-header button { min-width: 44px; flex-shrink: 0; }
.admin-option-row > input { min-width: 0; }

@media (max-width: 900px) {
  #root .admin-shell { flex-direction: column; }
  .admin-shell .admin-content { padding: 20px; }
  .admin-mobile-header {
    display: flex; align-items: center; gap: 12px; flex-shrink: 0;
    min-height: 64px; padding: 10px 16px; background: #fff;
    border-bottom: 1px solid #e0e0e0;
  }
  .admin-mobile-heading { min-width: 0; }
  .admin-mobile-heading b { display: block; color: #6200ee; font-size: 16px; }
  .admin-mobile-heading span {
    display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    color: #5f6368; font-size: 13px;
  }
  .admin-menu-toggle, .admin-menu-close {
    min-width: 44px; min-height: 44px; border: 1px solid #ddd;
    border-radius: 8px; color: #6200ee; background: #fff;
    cursor: pointer; font-size: 22px; flex-shrink: 0;
  }
  .admin-shell .admin-sidebar {
    position: fixed; top: 0; left: 0; bottom: 0; z-index: 51;
    width: min(310px, calc(100vw - 40px)); padding: 20px;
    box-shadow: 4px 0 24px rgba(0,0,0,.2);
    padding-bottom: max(20px, env(safe-area-inset-bottom));
  }
  .admin-menu-scrim {
    position: fixed; inset: 0; z-index: 50; border: 0;
    background: rgba(0,0,0,.45); cursor: pointer;
  }
  .admin-menu-close { margin-left: auto; }
  .admin-table-hint { display: block; color: #6b7280; font-size: 13px; }
}

@media (max-width: 600px) {
  .admin-shell .admin-content { padding: 16px; }
  .admin-page-header { flex-direction: column; align-items: stretch !important; }
  .admin-page-header > .admin-actions { width: 100%; justify-content: flex-start !important; }
  .admin-page-header > button { align-self: flex-start; }
  .admin-detail-row, .admin-form-row, .admin-log-header { flex-direction: column; }
  .admin-form-row { align-items: stretch !important; }
  .admin-log-date { min-width: 0 !important; text-align: left !important; }
  .admin-weight-fields { grid-template-columns: 1fr; }
  .admin-dialog-overlay { padding: 12px; }
  .admin-dialog-overlay .admin-dialog-content {
    width: 100%; max-width: 100%; max-height: calc(100vh - 24px);
    max-height: calc(100dvh - 24px);
  }
  .admin-dialog-overlay .admin-dialog-header, .admin-dialog-overlay .admin-dialog-body,
  .admin-dialog-overlay .admin-dialog-footer { padding: 16px; }
  .admin-dialog-overlay .admin-dialog-footer { flex-wrap: wrap; }
  .admin-dialog-footer > button { flex: 1 1 120px; }
  .admin-dialog-overlay input, .admin-dialog-overlay textarea, .admin-dialog-overlay select {
    font-size: 16px; max-width: 100%;
  }
  .admin-option-row { flex-wrap: wrap; }
  .admin-option-row > input:first-child { flex-basis: 100% !important; }
}