@font-face {
  font-family: "Cipher Orbitron";
  src: url("./fonts/orbitron-400.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Cipher Orbitron";
  src: url("./fonts/orbitron-500.ttf") format("truetype");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: "Cipher Orbitron";
  src: url("./fonts/orbitron-600.ttf") format("truetype");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: "Cipher Orbitron";
  src: url("./fonts/orbitron-700.ttf") format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: "Cipher Orbitron";
  src: url("./fonts/orbitron-800.ttf") format("truetype");
  font-style: normal;
  font-weight: 800;
  font-display: swap;
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) {
  color-scheme: dark;
  --cipher-primary: #39ff7a;
  --cipher-background: #020603;
  --cipher-panel: #07110b;
  --cipher-text: #edf8f0;
  --cipher-line: color-mix(in srgb, var(--cipher-primary) 28%, transparent);
  --cipher-line-strong: color-mix(in srgb, var(--cipher-primary) 58%, transparent);
  --cipher-glow: color-mix(in srgb, var(--cipher-primary) 18%, transparent);
  --cipher-font:
    "Cipher Orbitron", "JetBrains Mono", "Cascadia Mono", "Microsoft YaHei UI",
    monospace;
  --background: var(--cipher-background);
  --foreground: var(--cipher-text);
  --card: color-mix(in srgb, var(--cipher-panel) 92%, black);
  --card-foreground: var(--cipher-text);
  --popover: color-mix(in srgb, var(--cipher-panel) 96%, black);
  --popover-foreground: var(--cipher-text);
  --primary: var(--cipher-primary);
  --primary-foreground: #001b08;
  --secondary: color-mix(in srgb, var(--cipher-panel) 72%, var(--cipher-primary) 8%);
  --secondary-foreground: var(--cipher-text);
  --muted: color-mix(in srgb, var(--cipher-panel) 84%, white 3%);
  --muted-foreground: #a9bcb0;
  --accent: color-mix(in srgb, var(--cipher-primary) 15%, var(--cipher-panel));
  --accent-foreground: var(--cipher-text);
  --border: var(--cipher-line);
  --input: color-mix(in srgb, var(--cipher-primary) 22%, transparent);
  --ring: var(--cipher-primary);
  --destructive: #ff5c6c;
  --destructive-foreground: #fff5f6;
  --success: #36e69a;
  --success-foreground: #001c11;
  --warning: #f6c85f;
  --warning-foreground: #241700;
  --info: #62b8ff;
  --info-foreground: #00192d;
  --chart-1: var(--cipher-primary);
  --chart-2: #42d6c8;
  --chart-3: #62b8ff;
  --chart-4: #c28cff;
  --chart-5: #f6c85f;
  --sidebar: color-mix(in srgb, var(--cipher-background) 94%, black);
  --sidebar-foreground: var(--cipher-text);
  --sidebar-primary: var(--cipher-primary);
  --sidebar-primary-foreground: #001b08;
  --sidebar-accent: color-mix(in srgb, var(--cipher-primary) 13%, var(--cipher-panel));
  --sidebar-accent-foreground: var(--cipher-text);
  --sidebar-border: var(--cipher-line);
  --sidebar-ring: var(--cipher-primary);
  --table-row: color-mix(in srgb, var(--cipher-panel) 84%, transparent);
  --table-header: color-mix(in srgb, var(--cipher-primary) 8%, var(--cipher-panel));
  --table-row-hover: color-mix(in srgb, var(--cipher-primary) 7%, var(--cipher-panel));
  --table-row-selected: color-mix(in srgb, var(--cipher-primary) 12%, var(--cipher-panel));
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  )[data-cipher-font="system-mono"] {
  --cipher-font:
    "JetBrains Mono", "Cascadia Mono", "SFMono-Regular", "Microsoft YaHei UI",
    monospace;
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ),
html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) body {
  min-height: 100%;
  background: var(--cipher-background);
  color: var(--cipher-text);
  font-family: var(--cipher-font);
  font-variant-numeric: tabular-nums;
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) body {
  background-image:
    radial-gradient(circle at 50% 15%, var(--cipher-glow), transparent 32rem),
    linear-gradient(180deg, color-mix(in srgb, var(--cipher-primary) 3%, transparent), transparent 42%);
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) body::before {
  position: fixed;
  z-index: 0;
  inset: 0;
  pointer-events: none;
  content: "";
  background-image:
    linear-gradient(var(--cipher-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--cipher-line) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(to bottom, black, transparent 82%);
  opacity: 0.12;
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) #root {
  position: relative;
  z-index: 1;
  min-height: 100svh;
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) #cipher-new-ui-matrix {
  position: fixed;
  z-index: 2;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  opacity: 0.28;
  mix-blend-mode: screen;
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) [data-home-page] {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--cipher-primary) 2%, transparent), transparent 28rem),
    transparent;
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) [data-home-decoration="aurora"] {
  opacity: 0.34 !important;
  background:
    radial-gradient(ellipse 58% 48% at 20% 20%, color-mix(in srgb, var(--cipher-primary) 25%, transparent) 0%, transparent 70%),
    radial-gradient(ellipse 48% 38% at 80% 15%, color-mix(in srgb, var(--cipher-primary) 14%, transparent) 0%, transparent 72%),
    radial-gradient(ellipse 38% 32% at 42% 82%, color-mix(in srgb, var(--cipher-primary) 10%, transparent) 0%, transparent 72%) !important;
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) [data-home-element="eyebrow"] {
  border-color: var(--cipher-line-strong) !important;
  background: color-mix(in srgb, var(--cipher-primary) 8%, transparent) !important;
  color: var(--cipher-primary) !important;
  box-shadow: 0 0 20px color-mix(in srgb, var(--cipher-primary) 10%, transparent);
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) [data-home-element="eyebrow-dot"] span {
  background-color: var(--cipher-primary) !important;
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) [data-home-element="headline-accent"] {
  background-image: linear-gradient(90deg, #f2fff6 0%, var(--cipher-primary) 48%, #12d95d 100%) !important;
  filter: drop-shadow(0 0 16px color-mix(in srgb, var(--cipher-primary) 28%, transparent));
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) [data-home-terminal-demo] > div {
  border-color: var(--cipher-line-strong) !important;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--cipher-primary) 6%, transparent), transparent 45%),
    color-mix(in srgb, var(--cipher-panel) 96%, black) !important;
  box-shadow:
    inset 0 0 32px color-mix(in srgb, var(--cipher-primary) 4%, transparent),
    0 0 0 1px color-mix(in srgb, var(--cipher-primary) 8%, transparent),
    0 24px 70px rgba(0, 0, 0, 0.58),
    0 0 42px color-mix(in srgb, var(--cipher-primary) 10%, transparent) !important;
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) [data-home-terminal-demo] :is(
    [class*="text-blue-"],
    [class*="text-sky-"],
    [class*="text-violet-"],
    [class*="text-purple-"],
    [class*="text-emerald-"]
  ) {
  color: var(--cipher-primary) !important;
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) [data-home-terminal-demo] :is(
    [class*="border-blue-"],
    [class*="border-violet-"],
    [class*="border-emerald-"]
  ) {
  border-color: var(--cipher-primary) !important;
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) [data-home-page] :is(
    [class*="hover:border-blue-"],
    [class*="border-blue-"]
  ) {
  border-color: var(--cipher-line) !important;
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) :is(h1, h2, h3, [data-slot="card-title"], [data-slot="dialog-title"]) {
  letter-spacing: 0.025em;
  text-shadow: 0 0 20px color-mix(in srgb, var(--cipher-primary) 14%, transparent);
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) :is(
    [data-slot="card"],
    [data-slot="dialog-content"],
    [data-slot="alert-dialog-content"],
    [data-slot="sheet-content"],
    [data-slot="drawer-content"],
    [data-slot="popover-content"],
    [data-slot="dropdown-menu-content"],
    [data-slot="select-content"],
    [data-slot="hover-card-content"]
  ) {
  border-color: var(--cipher-line);
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--cipher-primary) 5%, transparent), transparent 42%),
    color-mix(in srgb, var(--cipher-panel) 94%, transparent);
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, white 2%, transparent),
    inset 0 0 28px color-mix(in srgb, var(--cipher-primary) 4%, transparent),
    0 0 0 1px color-mix(in srgb, var(--cipher-primary) 4%, transparent),
    0 18px 48px rgba(0, 0, 0, 0.38);
  backdrop-filter: blur(16px);
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) :is(header, [data-slot="navbar"], [data-slot="sidebar"], [data-slot="sidebar-wrapper"]) {
  border-color: var(--cipher-line);
  background-color: color-mix(in srgb, var(--cipher-background) 88%, transparent);
  backdrop-filter: blur(18px);
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) :is(
    [data-slot="button"],
    button,
    [role="button"],
    input,
    textarea,
    select,
    [data-slot="select-trigger"],
    [data-slot="input-group"]
  ) {
  border-color: var(--cipher-line);
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) :is(
    [data-slot="button"],
    button,
    [role="button"],
    input,
    textarea,
    select,
    [data-slot="select-trigger"],
    [data-slot="input-group"]
  ):focus-visible {
  outline: 2px solid var(--cipher-primary);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--cipher-primary) 18%, transparent);
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) :is([data-slot="button"], button, [role="button"]):not(:disabled):hover {
  box-shadow: 0 0 22px color-mix(in srgb, var(--cipher-primary) 16%, transparent);
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) :is([data-slot="table-container"], [data-slot="data-table-card"]) {
  border-color: var(--cipher-line);
  background: color-mix(in srgb, var(--cipher-panel) 82%, transparent);
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) [data-slot="tabs-list"] {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  overflow-x: auto;
  border-color: var(--cipher-line);
  scrollbar-width: thin;
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) [data-slot="tabs-trigger"] {
  flex: 0 0 auto;
  min-height: 2rem;
  border-color: transparent;
  white-space: nowrap;
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) [data-slot="tabs-trigger"][data-active],
html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) [data-slot="tabs-trigger"][aria-selected="true"] {
  color: var(--cipher-primary);
  text-shadow: 0 0 14px var(--cipher-glow);
}

html:is(
    [data-theme-applied-template="cipher-new-ui"],
    [data-theme-preview-template="cipher-new-ui"]
  ) :is(a, [data-slot="breadcrumb-page"]):focus-visible {
  border-radius: 4px;
  outline: 2px solid var(--cipher-primary);
  outline-offset: 3px;
}

@media (max-width: 767px) {
  html:is(
      [data-theme-applied-template="cipher-new-ui"],
      [data-theme-preview-template="cipher-new-ui"]
    ) #cipher-new-ui-matrix {
    opacity: 0.22;
  }
}

@media (prefers-reduced-motion: reduce) {
  html:is(
      [data-theme-applied-template="cipher-new-ui"],
      [data-theme-preview-template="cipher-new-ui"]
    ) *,
  html:is(
      [data-theme-applied-template="cipher-new-ui"],
      [data-theme-preview-template="cipher-new-ui"]
    ) *::before,
  html:is(
      [data-theme-applied-template="cipher-new-ui"],
      [data-theme-preview-template="cipher-new-ui"]
    ) *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}