/* MIAOHA console system
   Dense operational layout for user and admin surfaces. Loaded after cat-theme.css. */

:root {
  --mh-console-canvas: #f7fbff;
  --mh-console-canvas-alt: #fff8fb;
  --mh-console-surface: #ffffff;
  --mh-console-surface-muted: #f8fbff;
  --mh-console-border: #dbe8f3;
  --mh-console-border-strong: #bed5e9;
  --mh-console-text: #1f2937;
  --mh-console-text-muted: #627083;
  --mh-console-primary: #246fae;
  --mh-console-primary-hover: #185e93;
  --mh-console-primary-subtle: #e9f5ff;
  --mh-console-pink-subtle: #fff0f6;
  --mh-console-focus: rgba(47, 130, 201, .28);
  --mh-console-shadow: 0 1px 2px rgba(34, 57, 82, .04);
}

html.dark,
.dark {
  --mh-console-canvas: #101722;
  --mh-console-canvas-alt: #17111f;
  --mh-console-surface: #18212c;
  --mh-console-surface-muted: #131c27;
  --mh-console-border: #2d4053;
  --mh-console-border-strong: #3b5873;
  --mh-console-text: #edf5fb;
  --mh-console-text-muted: #a8b9c9;
  --mh-console-primary: #78baf0;
  --mh-console-primary-hover: #a0d0f5;
  --mh-console-primary-subtle: #172f44;
  --mh-console-pink-subtle: #311d2b;
  --mh-console-focus: rgba(142, 195, 241, .35);
  --mh-console-shadow: 0 1px 2px rgba(0, 0, 0, .2);
}

html[data-miaoha-surface="console"],
html[data-miaoha-surface="admin"],
html[data-miaoha-surface="commerce"] {
  background: var(--mh-console-canvas);
}

html[data-miaoha-surface="console"] body,
html[data-miaoha-surface="admin"] body,
html[data-miaoha-surface="commerce"] body {
  background:
    linear-gradient(135deg, var(--mh-console-canvas) 0%, var(--mh-console-canvas) 54%, var(--mh-console-canvas-alt) 100%) !important;
  color: var(--mh-console-text) !important;
}

html[data-miaoha-surface="console"] body::before,
html[data-miaoha-surface="admin"] body::before,
html[data-miaoha-surface="commerce"] body::before {
  opacity: .3;
  background-size: 44px 44px;
}

html[data-miaoha-surface="console"] #miaoha-cat-canvas,
html[data-miaoha-surface="admin"] #miaoha-cat-canvas,
html[data-miaoha-surface="commerce"] #miaoha-cat-canvas,
html[data-miaoha-surface="auth"] #miaoha-cat-canvas {
  display: none !important;
}

html[data-miaoha-surface="console"] .bg-mesh-gradient,
html[data-miaoha-surface="admin"] .bg-mesh-gradient,
html[data-miaoha-surface="commerce"] .bg-mesh-gradient {
  background:
    radial-gradient(720px 420px at 0 0, rgba(230, 243, 255, .58), transparent 70%),
    radial-gradient(680px 440px at 100% 0, rgba(255, 234, 241, .48), transparent 70%) !important;
  opacity: .7;
}

html.dark[data-miaoha-surface="console"] .bg-mesh-gradient,
html.dark[data-miaoha-surface="admin"] .bg-mesh-gradient,
html.dark[data-miaoha-surface="commerce"] .bg-mesh-gradient {
  background:
    radial-gradient(720px 420px at 0 0, rgba(35, 64, 95, .3), transparent 70%),
    radial-gradient(680px 440px at 100% 0, rgba(87, 48, 74, .26), transparent 70%) !important;
  opacity: .56;
}

html[data-miaoha-surface="console"] main.p-4.md\:p-6.lg\:p-8,
html[data-miaoha-surface="admin"] main.p-4.md\:p-6.lg\:p-8,
html[data-miaoha-surface="commerce"] main.p-4.md\:p-6.lg\:p-8 {
  width: min(100%, 1680px);
  margin: 0 auto;
  padding: 20px 24px 32px;
}

/* Navigation shell */
html[data-miaoha-surface="console"] .sidebar,
html[data-miaoha-surface="admin"] .sidebar,
html[data-miaoha-surface="commerce"] .sidebar {
  background: var(--mh-console-surface) !important;
  border-right: 1px solid var(--mh-console-border) !important;
  box-shadow: none !important;
}

html[data-miaoha-surface="console"] .sidebar::before,
html[data-miaoha-surface="admin"] .sidebar::before,
html[data-miaoha-surface="commerce"] .sidebar::before {
  top: 17px;
  left: auto;
  right: 17px;
  opacity: .24;
}

html[data-miaoha-surface="console"] .sidebar-header,
html[data-miaoha-surface="admin"] .sidebar-header,
html[data-miaoha-surface="commerce"] .sidebar-header {
  min-height: 64px;
  border-bottom: 1px solid var(--mh-console-border);
}

html[data-miaoha-surface="console"] .sidebar-logo,
html[data-miaoha-surface="admin"] .sidebar-logo,
html[data-miaoha-surface="commerce"] .sidebar-logo {
  border-radius: 9px;
}

html[data-miaoha-surface="console"] .sidebar-brand-title,
html[data-miaoha-surface="admin"] .sidebar-brand-title,
html[data-miaoha-surface="commerce"] .sidebar-brand-title {
  color: var(--mh-console-text) !important;
  font-size: .94rem;
  font-weight: 700;
}

html[data-miaoha-surface="console"] .sidebar-nav,
html[data-miaoha-surface="admin"] .sidebar-nav,
html[data-miaoha-surface="commerce"] .sidebar-nav {
  gap: 3px;
  padding-top: 12px;
}

html[data-miaoha-surface="console"] .sidebar-link,
html[data-miaoha-surface="admin"] .sidebar-link,
html[data-miaoha-surface="commerce"] .sidebar-link {
  min-height: 38px;
  margin: 0 10px;
  border: 1px solid transparent;
  border-radius: 8px !important;
  color: var(--mh-console-text-muted) !important;
  font-size: 13px;
  font-weight: 500;
}

html[data-miaoha-surface="console"] .sidebar-link:hover,
html[data-miaoha-surface="admin"] .sidebar-link:hover,
html[data-miaoha-surface="commerce"] .sidebar-link:hover {
  background: var(--mh-console-surface-muted) !important;
  border-color: var(--mh-console-border);
  color: var(--mh-console-text) !important;
  transform: none !important;
}

html[data-miaoha-surface="console"] .sidebar-link-active,
html[data-miaoha-surface="admin"] .sidebar-link-active,
html[data-miaoha-surface="commerce"] .sidebar-link-active {
  position: relative;
  background:
    linear-gradient(90deg, var(--mh-console-primary-subtle), var(--mh-console-pink-subtle)) !important;
  border-color: var(--mh-console-border-strong) !important;
  color: var(--mh-console-primary) !important;
  box-shadow: none !important;
}

html[data-miaoha-surface="console"] .sidebar-link-active::after,
html[data-miaoha-surface="admin"] .sidebar-link-active::after,
html[data-miaoha-surface="commerce"] .sidebar-link-active::after {
  content: "";
  position: absolute;
  left: -11px;
  width: 3px;
  height: 18px;
  border-radius: 0 3px 3px 0;
  background: linear-gradient(180deg, #ed78a2, #6caeea);
}

html[data-miaoha-surface="console"] .sidebar-section-title,
html[data-miaoha-surface="admin"] .sidebar-section-title,
html[data-miaoha-surface="commerce"] .sidebar-section-title {
  margin: 16px 18px 6px;
  color: var(--mh-console-text-muted) !important;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}

html[data-miaoha-surface="console"] header.glass,
html[data-miaoha-surface="admin"] header.glass,
html[data-miaoha-surface="commerce"] header.glass {
  background: color-mix(in srgb, var(--mh-console-surface) 94%, transparent) !important;
  border-color: var(--mh-console-border) !important;
  box-shadow: var(--mh-console-shadow) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html[data-miaoha-surface="console"] header.glass h1,
html[data-miaoha-surface="admin"] header.glass h1,
html[data-miaoha-surface="commerce"] header.glass h1 {
  color: var(--mh-console-text) !important;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.25;
}

html[data-miaoha-surface="console"] header.glass p,
html[data-miaoha-surface="admin"] header.glass p,
html[data-miaoha-surface="commerce"] header.glass p {
  color: var(--mh-console-text-muted) !important;
  font-size: 12px;
}

/* Cards, metrics, filters, and data panels */
html[data-miaoha-surface="console"] .card,
html[data-miaoha-surface="admin"] .card,
html[data-miaoha-surface="commerce"] .card,
html[data-miaoha-surface="console"] .table-scroll-container,
html[data-miaoha-surface="admin"] .table-scroll-container,
html[data-miaoha-surface="commerce"] .table-scroll-container {
  background: var(--mh-console-surface) !important;
  border: 1px solid var(--mh-console-border) !important;
  border-radius: 10px !important;
  box-shadow: var(--mh-console-shadow) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html[data-miaoha-surface="console"] .card:hover,
html[data-miaoha-surface="admin"] .card:hover,
html[data-miaoha-surface="commerce"] .card:hover,
html[data-miaoha-surface="console"] .grid > .rounded-lg:hover,
html[data-miaoha-surface="admin"] .grid > .rounded-lg:hover,
html[data-miaoha-surface="commerce"] .grid > .rounded-lg:hover,
html[data-miaoha-surface="console"] .grid > .rounded-xl:hover,
html[data-miaoha-surface="admin"] .grid > .rounded-xl:hover,
html[data-miaoha-surface="commerce"] .grid > .rounded-xl:hover {
  transform: none !important;
  box-shadow: var(--mh-console-shadow) !important;
}

html[data-miaoha-surface="console"] .grid > .card,
html[data-miaoha-surface="admin"] .grid > .card,
html[data-miaoha-surface="commerce"] .grid > .card {
  min-width: 0;
}

html[data-miaoha-surface="console"] .rounded-lg.border,
html[data-miaoha-surface="admin"] .rounded-lg.border,
html[data-miaoha-surface="commerce"] .rounded-lg.border,
html[data-miaoha-surface="console"] .rounded-xl.border,
html[data-miaoha-surface="admin"] .rounded-xl.border,
html[data-miaoha-surface="commerce"] .rounded-xl.border {
  background: var(--mh-console-surface) !important;
  border-color: var(--mh-console-border) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

html[data-miaoha-surface="console"] .tabular-nums,
html[data-miaoha-surface="admin"] .tabular-nums,
html[data-miaoha-surface="commerce"] .tabular-nums,
html[data-miaoha-surface="console"] .font-mono,
html[data-miaoha-surface="admin"] .font-mono,
html[data-miaoha-surface="commerce"] .font-mono {
  font-variant-numeric: tabular-nums;
}

/* Buttons and form controls */
html[data-miaoha-surface="console"] .btn,
html[data-miaoha-surface="admin"] .btn,
html[data-miaoha-surface="commerce"] .btn {
  min-height: 36px;
  border-radius: 8px !important;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  box-shadow: none !important;
}

html[data-miaoha-surface="console"] .btn-sm,
html[data-miaoha-surface="admin"] .btn-sm,
html[data-miaoha-surface="commerce"] .btn-sm {
  min-height: 32px;
  border-radius: 7px !important;
  font-size: 12px;
}

html[data-miaoha-surface="console"] .btn-primary,
html[data-miaoha-surface="admin"] .btn-primary,
html[data-miaoha-surface="commerce"] .btn-primary,
html[data-miaoha-surface="console"] button[type="submit"],
html[data-miaoha-surface="admin"] button[type="submit"],
html[data-miaoha-surface="commerce"] button[type="submit"] {
  background: var(--mh-console-primary) !important;
  border-color: var(--mh-console-primary) !important;
  color: #ffffff !important;
}

html[data-miaoha-surface="console"] .btn-primary:hover,
html[data-miaoha-surface="admin"] .btn-primary:hover,
html[data-miaoha-surface="commerce"] .btn-primary:hover,
html[data-miaoha-surface="console"] button[type="submit"]:hover,
html[data-miaoha-surface="admin"] button[type="submit"]:hover,
html[data-miaoha-surface="commerce"] button[type="submit"]:hover {
  background: var(--mh-console-primary-hover) !important;
  border-color: var(--mh-console-primary-hover) !important;
  filter: none !important;
  transform: translateY(-1px);
}

html[data-miaoha-surface="console"] .btn-secondary,
html[data-miaoha-surface="admin"] .btn-secondary,
html[data-miaoha-surface="commerce"] .btn-secondary,
html[data-miaoha-surface="console"] .btn-ghost,
html[data-miaoha-surface="admin"] .btn-ghost,
html[data-miaoha-surface="commerce"] .btn-ghost {
  background: var(--mh-console-surface) !important;
  border: 1px solid var(--mh-console-border-strong) !important;
  color: var(--mh-console-text) !important;
}

html[data-miaoha-surface="console"] .btn-secondary:hover,
html[data-miaoha-surface="admin"] .btn-secondary:hover,
html[data-miaoha-surface="commerce"] .btn-secondary:hover,
html[data-miaoha-surface="console"] .btn-ghost:hover,
html[data-miaoha-surface="admin"] .btn-ghost:hover,
html[data-miaoha-surface="commerce"] .btn-ghost:hover {
  background: var(--mh-console-surface-muted) !important;
  border-color: var(--mh-console-primary) !important;
  color: var(--mh-console-primary) !important;
  transform: none !important;
}

html[data-miaoha-surface="console"] .btn-danger,
html[data-miaoha-surface="admin"] .btn-danger,
html[data-miaoha-surface="commerce"] .btn-danger {
  border-color: #c53f58 !important;
  background: #c53f58 !important;
  color: #ffffff !important;
}

html[data-miaoha-surface="console"] input,
html[data-miaoha-surface="admin"] input,
html[data-miaoha-surface="commerce"] input,
html[data-miaoha-surface="console"] textarea,
html[data-miaoha-surface="admin"] textarea,
html[data-miaoha-surface="commerce"] textarea,
html[data-miaoha-surface="console"] select,
html[data-miaoha-surface="admin"] select,
html[data-miaoha-surface="commerce"] select,
html[data-miaoha-surface="console"] .select-trigger,
html[data-miaoha-surface="admin"] .select-trigger,
html[data-miaoha-surface="commerce"] .select-trigger {
  min-height: 36px;
  border: 1px solid var(--mh-console-border-strong) !important;
  border-radius: 8px !important;
  background: var(--mh-console-surface) !important;
  color: var(--mh-console-text) !important;
  box-shadow: none !important;
}

html[data-miaoha-surface="console"] textarea,
html[data-miaoha-surface="admin"] textarea,
html[data-miaoha-surface="commerce"] textarea {
  min-height: 92px;
}

html[data-miaoha-surface="console"] input:focus,
html[data-miaoha-surface="admin"] input:focus,
html[data-miaoha-surface="commerce"] input:focus,
html[data-miaoha-surface="console"] textarea:focus,
html[data-miaoha-surface="admin"] textarea:focus,
html[data-miaoha-surface="commerce"] textarea:focus,
html[data-miaoha-surface="console"] select:focus,
html[data-miaoha-surface="admin"] select:focus,
html[data-miaoha-surface="commerce"] select:focus,
html[data-miaoha-surface="console"] .select-trigger:focus,
html[data-miaoha-surface="admin"] .select-trigger:focus,
html[data-miaoha-surface="commerce"] .select-trigger:focus {
  border-color: var(--mh-console-primary) !important;
  box-shadow: 0 0 0 3px var(--mh-console-focus) !important;
}

/* Table system: preserve sticky geometry, replace visual layer only. */
html[data-miaoha-surface="console"] .table-page-layout,
html[data-miaoha-surface="admin"] .table-page-layout,
html[data-miaoha-surface="commerce"] .table-page-layout {
  gap: 16px;
  height: calc(100dvh - 64px - 52px);
}

html[data-miaoha-surface="console"] .table-scroll-container,
html[data-miaoha-surface="admin"] .table-scroll-container,
html[data-miaoha-surface="commerce"] .table-scroll-container {
  overflow: hidden !important;
}

html[data-miaoha-surface="console"] .table-wrapper,
html[data-miaoha-surface="admin"] .table-wrapper,
html[data-miaoha-surface="commerce"] .table-wrapper {
  background: var(--mh-console-surface) !important;
  overflow: auto !important;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-color: #8da9c1 transparent;
  scrollbar-gutter: stable both-edges;
}

html[data-miaoha-surface="console"] .table-wrapper::-webkit-scrollbar,
html[data-miaoha-surface="admin"] .table-wrapper::-webkit-scrollbar,
html[data-miaoha-surface="commerce"] .table-wrapper::-webkit-scrollbar {
  height: 10px !important;
  width: 10px !important;
}

html[data-miaoha-surface="console"] .table-wrapper::-webkit-scrollbar-thumb,
html[data-miaoha-surface="admin"] .table-wrapper::-webkit-scrollbar-thumb,
html[data-miaoha-surface="commerce"] .table-wrapper::-webkit-scrollbar-thumb {
  background: #8da9c1 !important;
  border: 2px solid transparent !important;
  border-radius: 999px !important;
  background-clip: padding-box !important;
}

html[data-miaoha-surface="console"] .table-wrapper .table-header,
html[data-miaoha-surface="admin"] .table-wrapper .table-header,
html[data-miaoha-surface="commerce"] .table-wrapper .table-header,
html[data-miaoha-surface="console"] .sticky-header-cell,
html[data-miaoha-surface="admin"] .sticky-header-cell,
html[data-miaoha-surface="commerce"] .sticky-header-cell {
  background: #eff7ff !important;
  border-color: var(--mh-console-border) !important;
  color: #456078 !important;
}

html.dark[data-miaoha-surface="console"] .table-wrapper .table-header,
html.dark[data-miaoha-surface="admin"] .table-wrapper .table-header,
html.dark[data-miaoha-surface="commerce"] .table-wrapper .table-header,
html.dark[data-miaoha-surface="console"] .sticky-header-cell,
html.dark[data-miaoha-surface="admin"] .sticky-header-cell,
html.dark[data-miaoha-surface="commerce"] .sticky-header-cell {
  background: #1b2b3a !important;
  color: #c5d9ec !important;
}

html[data-miaoha-surface="console"] .table-scroll-container th,
html[data-miaoha-surface="admin"] .table-scroll-container th,
html[data-miaoha-surface="commerce"] .table-scroll-container th {
  padding: 11px 14px !important;
  color: #456078 !important;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .02em;
}

html[data-miaoha-surface="console"] .table-scroll-container td,
html[data-miaoha-surface="admin"] .table-scroll-container td,
html[data-miaoha-surface="commerce"] .table-scroll-container td {
  padding: 11px 14px !important;
  border-color: var(--mh-console-border) !important;
  color: var(--mh-console-text) !important;
  font-size: 13px;
}

html[data-miaoha-surface="console"] tbody tr,
html[data-miaoha-surface="admin"] tbody tr,
html[data-miaoha-surface="commerce"] tbody tr {
  background: var(--mh-console-surface) !important;
}

html[data-miaoha-surface="console"] tbody tr:hover,
html[data-miaoha-surface="admin"] tbody tr:hover,
html[data-miaoha-surface="commerce"] tbody tr:hover {
  background: #f5faff !important;
}

html.dark[data-miaoha-surface="console"] tbody tr:hover,
html.dark[data-miaoha-surface="admin"] tbody tr:hover,
html.dark[data-miaoha-surface="commerce"] tbody tr:hover {
  background: #1d2b3a !important;
}

html[data-miaoha-surface="console"] tbody .sticky-col,
html[data-miaoha-surface="admin"] tbody .sticky-col,
html[data-miaoha-surface="commerce"] tbody .sticky-col {
  background: var(--mh-console-surface) !important;
}

html[data-miaoha-surface="console"] tbody tr:hover .sticky-col,
html[data-miaoha-surface="admin"] tbody tr:hover .sticky-col,
html[data-miaoha-surface="commerce"] tbody tr:hover .sticky-col {
  background: #f5faff !important;
}

html.dark[data-miaoha-surface="console"] tbody tr:hover .sticky-col,
html.dark[data-miaoha-surface="admin"] tbody tr:hover .sticky-col,
html.dark[data-miaoha-surface="commerce"] tbody tr:hover .sticky-col {
  background: #1d2b3a !important;
}

html[data-miaoha-surface="console"] .is-scrollable .sticky-col-left::after,
html[data-miaoha-surface="admin"] .is-scrollable .sticky-col-left::after,
html[data-miaoha-surface="commerce"] .is-scrollable .sticky-col-left::after,
html[data-miaoha-surface="console"] .is-scrollable .sticky-col-left-second::after,
html[data-miaoha-surface="admin"] .is-scrollable .sticky-col-left-second::after,
html[data-miaoha-surface="commerce"] .is-scrollable .sticky-col-left-second::after {
  background: linear-gradient(to right, rgba(80, 116, 150, .14), transparent) !important;
}

html[data-miaoha-surface="console"] .is-scrollable .sticky-col-right::before,
html[data-miaoha-surface="admin"] .is-scrollable .sticky-col-right::before,
html[data-miaoha-surface="commerce"] .is-scrollable .sticky-col-right::before {
  background: linear-gradient(to left, rgba(80, 116, 150, .14), transparent) !important;
}

/* Non-table feedback surfaces */
html[data-miaoha-surface="console"] .dropdown,
html[data-miaoha-surface="admin"] .dropdown,
html[data-miaoha-surface="commerce"] .dropdown,
html[data-miaoha-surface="console"] .modal-content,
html[data-miaoha-surface="admin"] .modal-content,
html[data-miaoha-surface="commerce"] .modal-content,
html[data-miaoha-surface="console"] [role="dialog"],
html[data-miaoha-surface="admin"] [role="dialog"],
html[data-miaoha-surface="commerce"] [role="dialog"] {
  background: var(--mh-console-surface) !important;
  border: 1px solid var(--mh-console-border) !important;
  border-radius: 12px !important;
  box-shadow: 0 18px 45px rgba(39, 70, 100, .16) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html[data-miaoha-surface="console"] .fixed.inset-0:has([role="dialog"]),
html[data-miaoha-surface="admin"] .fixed.inset-0:has([role="dialog"]),
html[data-miaoha-surface="commerce"] .fixed.inset-0:has([role="dialog"]) {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.driver-overlay,
.driver-popover,
.driver-active-element {
  z-index: 100000100 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html[data-miaoha-surface="console"] .toast,
html[data-miaoha-surface="admin"] .toast,
html[data-miaoha-surface="commerce"] .toast,
html[data-miaoha-surface="console"] [role="alert"],
html[data-miaoha-surface="admin"] [role="alert"],
html[data-miaoha-surface="commerce"] [role="alert"] {
  border-radius: 10px !important;
  box-shadow: 0 12px 32px rgba(39, 70, 100, .16) !important;
}

html[data-miaoha-surface="console"] .empty-state,
html[data-miaoha-surface="admin"] .empty-state,
html[data-miaoha-surface="commerce"] .empty-state {
  min-height: 180px;
  border: 1px dashed var(--mh-console-border-strong);
  border-radius: 10px;
  background: var(--mh-console-surface-muted);
}

html[data-miaoha-surface="console"] .custom-scrollbar::-webkit-scrollbar-thumb,
html[data-miaoha-surface="admin"] .custom-scrollbar::-webkit-scrollbar-thumb,
html[data-miaoha-surface="commerce"] .custom-scrollbar::-webkit-scrollbar-thumb {
  background-color: #8da9c1 !important;
}

/* Authentication is static and accessible, with a deliberately lighter visual weight. */
html[data-miaoha-surface="auth"] .card-glass {
  border: 1px solid var(--mh-border-blue) !important;
  border-radius: 14px !important;
  background: color-mix(in srgb, var(--mh-surface-solid) 94%, transparent) !important;
  box-shadow: 0 18px 48px rgba(68, 104, 143, .14) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html[data-miaoha-surface="auth"] [class*="blur-3xl"] {
  filter: none !important;
  opacity: .2;
}

html[data-miaoha-surface="auth"] .text-gradient {
  background: none !important;
  color: var(--mh-pink-500) !important;
}

html[data-miaoha-surface="auth"] .input-label {
  color: var(--mh-text-2) !important;
  font-weight: 650;
}

/* Keyboard and reduced-motion safety */
.miaoha-skip-link {
  position: fixed;
  left: 12px;
  top: 10px;
  z-index: 100000001;
  transform: translateY(-160%);
  border-radius: 8px;
  background: #185e93;
  color: #ffffff !important;
  padding: 10px 14px;
  font-size: 14px;
  font-weight: 700;
  box-shadow: 0 8px 24px rgba(24, 94, 147, .28);
}

.miaoha-skip-link:focus {
  transform: translateY(0);
}

body.driver-active .miaoha-skip-link,
body.modal-open.driver-active .miaoha-skip-link {
  display: none;
}

html[data-miaoha-motion="reduced"] .animate-ping,
html[data-miaoha-motion="reduced"] .animate-pulse,
html[data-miaoha-motion="reduced"] .animate-spin,
html[data-miaoha-motion="reduced"] .navigation-progress-bar {
  animation: none !important;
}

html[data-miaoha-motion="reduced"] [class*="transition"],
html[data-miaoha-motion="reduced"] [class*="duration-"],
html[data-miaoha-motion="reduced"] .btn,
html[data-miaoha-motion="reduced"] .card,
html[data-miaoha-motion="reduced"] .sidebar-link {
  transition-duration: .01ms !important;
  transition-delay: 0ms !important;
}

@media (min-width: 768px) and (max-width: 1023px) {
  html[data-miaoha-surface="console"] .table-page-layout.mobile-mode,
  html[data-miaoha-surface="admin"] .table-page-layout.mobile-mode,
  html[data-miaoha-surface="commerce"] .table-page-layout.mobile-mode {
    height: calc(100dvh - 64px - 42px);
  }

  html[data-miaoha-surface="console"] .table-page-layout.mobile-mode .layout-section-scrollable,
  html[data-miaoha-surface="admin"] .table-page-layout.mobile-mode .layout-section-scrollable,
  html[data-miaoha-surface="commerce"] .table-page-layout.mobile-mode .layout-section-scrollable {
    min-height: 0;
    flex: 1 1 0%;
  }

  html[data-miaoha-surface="console"] .table-page-layout.mobile-mode .table-scroll-container,
  html[data-miaoha-surface="admin"] .table-page-layout.mobile-mode .table-scroll-container,
  html[data-miaoha-surface="commerce"] .table-page-layout.mobile-mode .table-scroll-container {
    height: 100%;
    overflow: hidden !important;
    border-style: solid;
    background: var(--mh-console-surface) !important;
    box-shadow: var(--mh-console-shadow) !important;
  }

  html[data-miaoha-surface="console"] .table-page-layout.mobile-mode .table-scroll-container table,
  html[data-miaoha-surface="admin"] .table-page-layout.mobile-mode .table-scroll-container table,
  html[data-miaoha-surface="commerce"] .table-page-layout.mobile-mode .table-scroll-container table {
    min-width: max-content;
  }

  html[data-miaoha-surface="console"] .table-page-layout.mobile-mode .table-wrapper,
  html[data-miaoha-surface="admin"] .table-page-layout.mobile-mode .table-wrapper,
  html[data-miaoha-surface="commerce"] .table-page-layout.mobile-mode .table-wrapper {
    overflow: auto !important;
  }
}

@media (max-width: 767px) {
  html[data-miaoha-surface="console"] main.p-4.md\:p-6.lg\:p-8,
  html[data-miaoha-surface="admin"] main.p-4.md\:p-6.lg\:p-8,
  html[data-miaoha-surface="commerce"] main.p-4.md\:p-6.lg\:p-8 {
    padding: 12px 12px 24px;
  }

  html[data-miaoha-surface="console"] .sidebar-link,
  html[data-miaoha-surface="admin"] .sidebar-link,
  html[data-miaoha-surface="commerce"] .sidebar-link {
    min-height: 44px;
  }

  html[data-miaoha-surface="console"] .table-page-layout,
  html[data-miaoha-surface="admin"] .table-page-layout,
  html[data-miaoha-surface="commerce"] .table-page-layout {
    height: auto;
    gap: 12px;
  }

  html[data-miaoha-surface="console"] .table-page-layout.mobile-mode .table-scroll-container,
  html[data-miaoha-surface="admin"] .table-page-layout.mobile-mode .table-scroll-container,
  html[data-miaoha-surface="commerce"] .table-page-layout.mobile-mode .table-scroll-container {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html[data-miaoha-surface="console"] .table-page-layout.mobile-mode .table-wrapper [data-field],
  html[data-miaoha-surface="admin"] .table-page-layout.mobile-mode .table-wrapper [data-field],
  html[data-miaoha-surface="commerce"] .table-page-layout.mobile-mode .table-wrapper [data-field] {
    display: grid;
    grid-template-columns: minmax(88px, .72fr) minmax(0, 1fr);
    gap: 8px;
    padding: 8px 0;
    border-bottom: 1px solid var(--mh-console-border);
    font-size: 13px;
  }

  html[data-miaoha-surface="console"] .card,
  html[data-miaoha-surface="admin"] .card,
  html[data-miaoha-surface="commerce"] .card {
    border-radius: 9px !important;
  }

  html[data-miaoha-surface="console"] .toast,
  html[data-miaoha-surface="admin"] .toast,
  html[data-miaoha-surface="commerce"] .toast {
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html[data-miaoha-surface="console"] *,
  html[data-miaoha-surface="admin"] *,
  html[data-miaoha-surface="commerce"] * {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}