/* FogAct user console polish: keep the panel aligned with the upstream Xboard-style user UI. */
@font-face {
  font-family: "FogAct Billing";
  src: url("/assets/noto-sans-sc-billing.20261008.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}
body {
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", "FogAct Billing", sans-serif;
}

#app .tabular-nums,
#app [class*="tabular-nums"] {
  font-variant-numeric: tabular-nums;
}

#app .text-primary.tabular-nums,
#app .text-amber-600.tabular-nums,
#app .dark\:text-amber-400.tabular-nums,
#app .text-2xl.font-bold.tabular-nums,
#app .font-bold.tabular-nums.text-primary,
#app p[class*="text-2xl"][class*="tabular-nums"],
#app p[class*="font-bold"][class*="tabular-nums"] {
  max-width: 100%;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.18;
}

@media (min-width: 1024px) {
  #app p[class*="text-2xl"][class*="tabular-nums"],
  #app p[class*="font-bold"][class*="tabular-nums"] {
    font-size: clamp(0.95rem, 1.25vw, 1.35rem);
  }
}

#app aside p[class*="tabular-nums"],
#app aside .tabular-nums,
#app aside [class*="font-mono"] {
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
}

#app [class*="grid-cols-2"][class*="sm:grid-cols-4"] .tabular-nums,
#app [class*="grid-cols-2"][class*="sm:grid-cols-4"] [class*="font-bold"] {
  display: block;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: clamp(0.68rem, 0.68vw, 0.82rem);
  line-height: 1.15;
}

#app [class*="h-40"] {
  min-height: 10rem;
}

#app [class*="h-44"],
#app [class*="h-64"],
#app [class*="h-80"] {
  min-height: 11rem;
}

#app canvas {
  max-width: 100% !important;
}

#app .grid.grid-cols-1.mb-8 .flex.items-start.justify-between {
  gap: 0.75rem;
  min-width: 0;
}

#app .grid.grid-cols-1.mb-8 .flex.items-start.justify-between > .space-y-1 {
  flex: 1 1 auto;
  min-width: 0;
}

#app .grid.grid-cols-1.mb-8 .flex.items-start.justify-between > .relative {
  flex: 0 0 auto;
}

#app .grid.grid-cols-1.mb-8 .text-2xl.font-bold.tabular-nums {
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.2;
}

@media (max-width: 640px) {
  #app .toaster {
    width: calc(100vw - 2rem) !important;
    max-width: calc(100vw - 2rem) !important;
  }
}

#app [class*="bg-card/80"] {
  background-color: hsl(var(--card) / 0.92) !important;
}

#app [class*="backdrop-blur-xl"] {
  backdrop-filter: none;
}

#app [class*="border-border/60"] {
  border-color: hsl(var(--border) / 0.75) !important;
}

#app [class*="shadow-primary/10"] {
  box-shadow: none !important;
}

#app [class*="text-2xl"][class*="font-semibold"][class*="tracking-tight"] {
  letter-spacing: -0.02em;
}

#app input.font-mono,
#app input[class*="font-mono"] {
  letter-spacing: 0;
}

#app [class*="rounded-xl"][class*="border"] {
  box-shadow: none;
}

#app .fogact-sidebar-brand-link {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  min-width: 0;
  flex: 0 1 auto;
  color: inherit;
  text-decoration: none;
  border-radius: 0.75rem;
  margin: -0.25rem 0;
  padding: 0.25rem 0.375rem 0.25rem 0;
  transition: color 0.18s ease, background-color 0.18s ease;
}

#app .fogact-sidebar-brand-link:hover {
  color: hsl(var(--foreground));
  background-color: hsl(var(--muted) / 0.42);
}

#app .fogact-sidebar-brand-link:focus-visible,
#app .fogact-sidebar-home-icon:focus-visible {
  outline: 2px solid hsl(var(--ring));
  outline-offset: 2px;
}

#app .fogact-sidebar-home-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 2rem;
  flex: 0 0 1.75rem;
  margin-right: 0.125rem;
  border-radius: 0.5rem;
  color: #fff;
  text-decoration: none;
  background: linear-gradient(135deg, hsl(var(--primary)), hsl(var(--primary) / 0.65));
}

#app .fogact-sidebar-home-icon:hover {
  filter: brightness(1.04);
}
