.app-version { padding: 4px 7px; border: 1px solid var(--line); border-radius: 3px; color: var(--ink-soft); background: var(--paper); font-size: 11px; font-variant-numeric: tabular-nums; }
.admin-nav-item.is-active { background: var(--ticket); color: var(--ink); }
.admin-view { max-width: 1440px; margin: 0 auto; }
.admin-head { padding: 4px 0 18px; display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--line-strong); }
.admin-head h2 { margin-bottom: 5px; font-size: 20px; }
.admin-head p { margin-bottom: 0; color: var(--ink-soft); }
.admin-head-actions { display: flex; align-items: center; gap: 10px; }
.admin-role-label { padding: 5px 8px; border-radius: 3px; background: var(--ticket); font-size: 12px; font-weight: 800; }
.admin-metrics { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-bottom: 1px solid var(--line-strong); background: var(--paper); }
.admin-metric { min-width: 0; padding: 18px 16px; display: grid; grid-template-columns: auto 1fr; align-items: baseline; column-gap: 8px; border-right: 1px solid var(--line); }
.admin-metric:last-child { border-right: 0; }
.admin-metric strong { grid-row: 1 / 3; font-size: 28px; line-height: 1; font-variant-numeric: tabular-nums; }
.admin-metric span { font-size: 12px; font-weight: 800; }
.admin-metric small { color: var(--ink-soft); font-size: 11px; }
.admin-tabs { margin-top: 16px; display: flex; gap: 4px; border-bottom: 1px solid var(--line-strong); }
.admin-tabs button { min-height: 44px; padding: 0 16px; border: 0; border-bottom: 3px solid transparent; background: transparent; color: var(--ink-soft); font-weight: 700; }
.admin-tabs button:hover { color: var(--ink); background: var(--paper-soft); }
.admin-tabs button.is-active { border-color: var(--jade); color: var(--ink); background: var(--paper); }
.admin-pane { background: var(--paper); }
.admin-pane[hidden] { display: none; }
.admin-pane-head { min-height: 84px; padding: 16px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--line); }
.admin-pane-head h3 { margin: 0 0 3px; font-size: 16px; }
.admin-pane-head p { margin: 0; color: var(--ink-soft); font-size: 12px; }
.admin-search { width: min(320px, 42vw); height: 41px; padding: 0 11px; display: grid; grid-template-columns: 18px minmax(0, 1fr); align-items: center; gap: 8px; border: 1px solid var(--line-strong); border-radius: 4px; background: #fff; }
.admin-search:focus-within { border-color: var(--jade); box-shadow: 0 0 0 3px rgba(8,127,104,.12); }
.admin-search svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; color: var(--ink-soft); }
.admin-search input { min-width: 0; width: 100%; border: 0; outline: 0; background: transparent; }
.admin-table-wrap { width: 100%; overflow-x: auto; }
.admin-table { width: 100%; min-width: 940px; border-collapse: collapse; }
.admin-table th { height: 40px; padding: 0 12px; border-bottom: 1px solid var(--line); background: var(--paper-soft); color: var(--ink-soft); font-size: 11px; text-align: left; white-space: nowrap; }
.admin-table td { height: 58px; padding: 9px 12px; border-bottom: 1px solid var(--line); vertical-align: middle; font-size: 12px; }
.admin-table tbody tr:hover { background: var(--jade-soft); }
.admin-table td strong { display: inline-block; margin-right: 7px; color: var(--ink); font-size: 13px; }
.self-label { padding: 2px 5px; border-radius: 3px; background: var(--ticket-soft); color: #5a490a; font-size: 10px; font-weight: 700; }
.role-tag { display: inline-block; padding: 3px 7px; border-radius: 3px; background: var(--paper-soft); color: var(--ink-soft); font-size: 11px; font-weight: 700; }
.role-tag.is-admin { background: var(--ticket); color: var(--ink); }
.table-actions { display: flex; align-items: center; gap: 10px; }
.text-button.danger { color: var(--red); }
.admin-pagination { min-height: 54px; padding: 9px 14px; display: flex; align-items: center; justify-content: flex-end; gap: 10px; color: var(--ink-soft); font-size: 12px; }
.admin-empty { padding: 32px; color: var(--ink-soft); text-align: center; }
.admin-state { min-height: 132px; padding: 24px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; color: var(--ink-soft); text-align: center; }
.admin-state p { margin: 0; }
.admin-state-spinner { width: 22px; height: 22px; border: 2px solid var(--line); border-top-color: var(--jade); border-radius: 50%; animation: admin-spin .8s linear infinite; }
.admin-state:has(.admin-retry) .admin-state-spinner { display: none; }
.admin-retry { min-height: 36px; }
.admin-metrics-message { grid-column: 1 / -1; border: 1px solid var(--line); background: var(--paper); }
.admin-metric.is-loading strong, .admin-metric.is-loading span, .admin-metric.is-loading small { display: block; width: 70%; min-height: 12px; border-radius: 2px; background: var(--line); color: transparent; animation: admin-pulse 1.2s ease-in-out infinite; }
.admin-metric.is-loading strong { width: 42%; min-height: 28px; }
.admin-metric.is-loading small { width: 58%; }
.admin-pagination .icon-button svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
@keyframes admin-spin { to { transform: rotate(360deg); } }
@keyframes admin-pulse { 50% { opacity: .46; } }
@media (prefers-reduced-motion: reduce) { .admin-state-spinner, .admin-metric.is-loading strong, .admin-metric.is-loading span, .admin-metric.is-loading small { animation: none; } }
.version-current { padding: 5px 8px; border-radius: 3px; background: var(--jade-soft); color: var(--jade-dark); font-weight: 800; }
.version-list { display: grid; }
.version-row { padding: 18px 16px; display: grid; grid-template-columns: 180px 1fr; gap: 8px 20px; border-bottom: 1px solid var(--line); }
.version-row > div { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.version-row h4 { flex-basis: 100%; margin: 2px 0 0; font-size: 14px; }
.version-row strong { font-size: 18px; font-variant-numeric: tabular-nums; }
.version-row span { padding: 2px 5px; border-radius: 3px; background: var(--ticket); font-size: 10px; font-weight: 800; }
.version-row time { align-self: center; justify-self: end; color: var(--ink-soft); font-size: 12px; }
.version-row ul { grid-column: 1 / -1; margin: 4px 0 0; padding-left: 20px; color: var(--ink-soft); }
.version-row li { margin: 3px 0; }
.version-row.is-current { background: var(--jade-soft); }
.admin-dialog .field { margin: 14px 18px 0; }
.admin-dialog-form > .form-error { margin: 8px 18px 0; }
.button-danger { min-height: 40px; padding: 0 14px; border: 1px solid var(--red); border-radius: 4px; background: var(--red); color: #fff; font-weight: 700; }
.button-danger:hover { filter: brightness(.92); }
.update-banner { position: fixed; left: 50%; bottom: 22px; z-index: 60; width: min(520px, calc(100vw - 24px)); padding: 10px 10px 10px 14px; transform: translateX(-50%); display: flex; align-items: center; justify-content: space-between; gap: 14px; border-radius: 6px; background: var(--ink); color: #fff; box-shadow: 0 16px 42px rgba(23,32,29,.24); }
.update-banner[hidden] { display: none; }
.install-guide { padding: 18px; }
.install-guide ol { margin: 0; padding-left: 22px; }
.install-guide li { margin: 8px 0; }
.install-guide p { margin: 0; color: var(--ink-soft); }

@media (max-width: 1120px) {
  .admin-metrics { grid-template-columns: repeat(3, 1fr); }
  .admin-metric:nth-child(3) { border-right: 0; }
  .admin-metric:nth-child(n+4) { border-top: 1px solid var(--line); }
}

@media (max-width: 760px) {
  .admin-nav-item { display: none !important; }
  .admin-top-button { display: none !important; }
  .app-version { display: none; }
  .install-app-button { min-width: 44px; min-height: 44px; padding-inline: 9px; font-size: 11px; }
  .admin-view { padding-inline: 10px; }
  .admin-head { align-items: stretch; flex-direction: column; }
  .admin-head-actions { justify-content: space-between; }
  .admin-metrics { grid-template-columns: repeat(2, 1fr); }
  .admin-metric { min-height: 84px; padding: 14px 12px; }
  .admin-metric:nth-child(2n) { border-right: 0; }
  .admin-metric:nth-child(3) { border-right: 1px solid var(--line); }
  .admin-metric:nth-child(n+3) { border-top: 1px solid var(--line); }
  .admin-tabs { overflow-x: auto; }
  .admin-tabs button { flex: 1 0 auto; min-width: 104px; }
  .admin-pane-head { align-items: stretch; flex-direction: column; }
  .admin-search { width: 100%; }
  .admin-table { min-width: 760px; }
  .audit-table { min-width: 700px; }
  .admin-pagination { justify-content: center; }
  .version-row { grid-template-columns: 1fr auto; }
  .update-banner { bottom: calc(80px + env(safe-area-inset-bottom)); }
}