/* 大肥鱼api — shared, quiet surfaces; semantic status colours stay intact. */
:root {
  --fish-canvas: #fafaf8;
  --fish-surface: #ffffff;
  --fish-subtle: #f2f3f2;
  --fish-border: #e5e7e5;
  --fish-ink: #242831;
  --fish-muted: #737982;
  --fish-accent: #365ec4;
  --fish-accent-hover: #294ca7;
  --fish-selected: #edf2fc;
  --fish-focus: #365ec433;
}
html.dark {
  --fish-canvas: #111316;
  --fish-surface: #191c21;
  --fish-subtle: #23272e;
  --fish-border: #30353e;
  --fish-ink: #edf0f5;
  --fish-muted: #a3aab5;
  --fish-accent: #8caaff;
  --fish-accent-hover: #b1c5ff;
  --fish-selected: #263149;
  --fish-focus: #8caaff40;
}
html, body { background: var(--fish-canvas); }
body { color: var(--fish-ink); letter-spacing: .005em; }
#app .bg-mesh-gradient { background-image: none !important; }
#app .text-gradient {
  background: none !important;
  -webkit-text-fill-color: currentColor;
  color: var(--fish-ink) !important;
}
#app :is(.glass, .glass-card, .card, .card-glass, .stat-card) {
  background: var(--fish-surface) !important;
  border-color: var(--fish-border) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
}
#app :is(.glass-card, .card, .card-glass, .stat-card, .modal-content) { border-radius: 12px; }
#app .card-hover:hover { transform: none; border-color: #b9c2d0 !important; }
#app :is(.shadow-glow, .shadow-glass, .shadow-glass-sm) { box-shadow: none !important; }
#app :is(.card-header, .card-footer, .modal-header, .modal-footer) { border-color: var(--fish-border); }
#app .btn {
  border-radius: 8px;
  box-shadow: none !important;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
#app .btn-primary {
  background: #365ec4 !important;
  color: #fff !important;
  border: 1px solid transparent;
}
#app .btn-primary:hover:not(:disabled) { background: #294ca7 !important; }
#app .btn-secondary { background: var(--fish-surface); border-color: var(--fish-border); }
#app .btn-danger { background: #dc3545 !important; }
#app .btn-success { background: #16805c !important; }
#app .btn-warning { background: #b66b10 !important; }
#app :is(.input, .select, .textarea) {
  background: var(--fish-surface);
  border-color: var(--fish-border);
  border-radius: 8px;
  box-shadow: none;
}
#app :is(.input, .select, .textarea):focus {
  border-color: var(--fish-accent);
  box-shadow: 0 0 0 3px var(--fish-focus);
  outline: none;
}
#app .input-error { border-color: #dc3545; }
#app .input-error:focus { border-color: #dc3545; box-shadow: 0 0 0 3px #dc354526; }
#app .input-label { font-size: 13px; font-weight: 500; margin-bottom: 8px; }
#app :is(button, a):focus-visible { outline: 2px solid var(--fish-accent); outline-offset: 3px; }
#app .sidebar {
  background: var(--fish-surface) !important;
  border-right: 1px solid var(--fish-border);
  box-shadow: none;
  backdrop-filter: none;
}
#app .sidebar-header { border-color: var(--fish-border); }
#app .sidebar-logo { border-radius: 10px; box-shadow: none !important; }
#app .sidebar-brand-title { font-size: 17px; font-weight: 650; letter-spacing: -.025em; }
#app .sidebar-link { border-radius: 8px; font-weight: 450; }
#app .sidebar-link:hover { background: var(--fish-subtle); }
#app .sidebar-link-active,
#app .sidebar-link-active:hover {
  background: var(--fish-selected) !important;
  color: var(--fish-accent) !important;
  box-shadow: none !important;
  font-weight: 600;
}
#app .sidebar-section-title { font-size: 11px; color: var(--fish-muted); letter-spacing: .06em; }
#app header.glass { border-color: var(--fish-border); }
#app .stat-value { font-weight: 600; letter-spacing: -.035em; font-variant-numeric: tabular-nums; }
#app .stat-icon { border-radius: 10px; }
#app :is(.table-container, .dropdown) { border-color: var(--fish-border); border-radius: 10px; }
#app .table th { background: var(--fish-subtle); font-size: 12px; }
#app .table td { border-color: var(--fish-border); }
#app .table tbody tr:hover { background: var(--fish-subtle); }
#app .dropdown { box-shadow: 0 8px 28px #0000000d; }
#app .modal-content { background: var(--fish-surface); box-shadow: 0 16px 64px #00000020; }

/* AuthLayout's structure is shared by login/reset/register, without replacing forms. */
#app .min-h-screen:has(> .relative.z-10.w-full.max-w-md) {
  min-height: 100svh;
  padding: 48px 24px;
  background: var(--fish-canvas);
  overflow: visible;
}
#app .min-h-screen:has(> .relative.z-10.w-full.max-w-md) > .absolute { display: none; }
#app .relative.z-10.w-full.max-w-md:has(> .card-glass) { max-width: 360px; }
#app .relative.z-10.w-full.max-w-md > .mb-8 { margin-bottom: 36px; }
#app .relative.z-10.w-full.max-w-md > .mb-8 > .inline-flex {
  width: 48px;
  height: 48px;
  border-radius: 13px;
  box-shadow: none !important;
  margin-bottom: 16px;
}
#app .relative.z-10.w-full.max-w-md h1 { font-size: 27px; font-weight: 650; letter-spacing: -.04em; }
#app .relative.z-10.w-full.max-w-md > .mb-8 > p { color: var(--fish-muted); font-size: 13px; }
#app .relative.z-10.w-full.max-w-md > .card-glass {
  padding: 0;
  background: transparent !important;
  border: 0;
  border-radius: 0;
  box-shadow: none !important;
}
#app .relative.z-10.w-full.max-w-md .card-glass h2 { font-size: 18px; font-weight: 600; }
#app .relative.z-10.w-full.max-w-md .card-glass .text-center > p { color: var(--fish-muted); font-size: 13px; }
#app .relative.z-10.w-full.max-w-md .input { min-height: 48px; border-radius: 10px; font-size: 14px; }
#app .relative.z-10.w-full.max-w-md .btn { min-height: 46px; border-radius: 10px; font-weight: 550; }
#app .relative.z-10.w-full.max-w-md > .mt-8 { margin-top: 40px; font-size: 11px; color: var(--fish-muted); }
#app [data-testid="compact-home"] { background: var(--fish-canvas); }
#app [data-testid="compact-home"] :is(header, footer) { border-color: var(--fish-border); }
#app [data-testid="compact-home"] main h1 { font-weight: 650; letter-spacing: -.045em; }
#app [data-testid="compact-home"] main p { color: var(--fish-muted); }
@media (max-width: 480px) {
  #app .min-h-screen:has(> .relative.z-10.w-full.max-w-md) { padding: 32px 24px; }
  #app .relative.z-10.w-full.max-w-md > .mb-8 { margin-bottom: 28px; }
}
@media (prefers-reduced-motion: reduce) {
  #app .btn, #app .card-hover, #app .sidebar-link { transition: none; }
}
