/* DemonRoute storyboard visual layer — content and routes unchanged. */
:root {
  --dr-orange: #ff5a1f;
  --dr-orange-soft: #ff8a4c;
  --dr-warm-line: rgba(255, 108, 45, .26);
  --dr-panel: #0d0c0b;
  --dr-panel-warm: #14100d;
}
html { background: #050505; }
body {
  background: #050505;
  background-image: radial-gradient(ellipse at 85% -15%, rgba(255, 90, 31, .055), transparent 42%);
}
header {
  background: rgba(5, 5, 5, .92) !important;
  border-bottom-color: var(--dr-warm-line) !important;
  box-shadow: 0 12px 42px rgba(0, 0, 0, .28);
}
.eyebrow { color: var(--dr-orange-soft) !important; letter-spacing: .19em !important; }

/* Home: integrated artwork, directional light and live model nodes. */
[code-path="src/pages/Landing.tsx:12:7"] {
  background:
    linear-gradient(115deg, transparent 0 72%, rgba(255, 90, 31, .82) 72.15% 78%, transparent 78.15%),
    radial-gradient(ellipse at 76% 37%, rgba(255, 79, 18, .19), transparent 40%),
    radial-gradient(ellipse at 48% 95%, rgba(255, 90, 31, .07), transparent 42%);
}
[code-path="src/pages/Landing.tsx:12:7"]::after {
  filter: saturate(1.16) contrast(1.05) drop-shadow(0 0 34px rgba(255, 75, 11, .16));
}
.dr-model-nodes { position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.dr-model-node {
  --node: #ff8a3d;
  position: absolute;
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr) 7px;
  align-items: center;
  gap: 10px;
  width: 235px;
  min-height: 58px;
  padding: 11px 13px;
  pointer-events: auto;
  color: #eee9e5;
  text-decoration: none;
  background: rgba(9, 8, 8, .92);
  border: 1px solid color-mix(in srgb, var(--node) 70%, transparent);
  border-radius: 13px;
  box-shadow: 0 0 24px color-mix(in srgb, var(--node) 17%, transparent), inset 0 0 20px rgba(255,255,255,.015);
  backdrop-filter: blur(10px);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.dr-model-node:hover { transform: translateY(-3px); border-color: var(--node); box-shadow: 0 0 32px color-mix(in srgb, var(--node) 30%, transparent); }
.dr-model-node:nth-child(1) { --node: #b266ff; top: 29%; right: 31%; }
.dr-model-node:nth-child(2) { --node: #38bdf8; top: 41%; right: 2%; }
.dr-model-node:nth-child(3) { --node: #2dd4bf; top: 60%; right: 34%; }
.dr-model-node:nth-child(4) { --node: #ff6b2d; top: 72%; right: 1%; }
.dr-node-gem { width: 9px; height: 9px; background: var(--node); transform: rotate(45deg); box-shadow: 0 0 10px var(--node); }
.dr-model-node strong { display: block; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 10px; line-height: 1.35; font-weight: 500; overflow-wrap: anywhere; }
.dr-model-node small { display: block; margin-top: 2px; color: #a49d98; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 9px; }
.dr-node-status { width: 6px; height: 6px; border-radius: 50%; background: #3ee98a; box-shadow: 0 0 9px #3ee98a; }

/* Shared content surfaces. */
main section { border-color: var(--dr-warm-line) !important; }
main section > div > .eyebrow + h2 { color: #f4f0ed; }
.rowline { border-bottom-color: var(--dr-warm-line) !important; }
[code-path="src/pages/Landing.tsx:63:9"] {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
[code-path="src/pages/Landing.tsx:69:13"] {
  display: block;
  padding: 26px !important;
  background: linear-gradient(145deg, rgba(255,255,255,.025), rgba(255,90,31,.025));
  border: 1px solid #292422;
  border-radius: 15px;
}
[code-path="src/pages/Landing.tsx:69:13"]:hover { transform: translateY(-3px); border-color: #69402f; }
[code-path="src/pages/Landing.tsx:69:13"] > span { display: block; margin-bottom: 38px; font-size: 12px !important; }
[code-path="src/pages/Landing.tsx:72:17"] { font-size: 19px; line-height: 1.35; }
[code-path="src/pages/Landing.tsx:94:11"] { border-radius: 13px; box-shadow: 0 18px 55px rgba(0,0,0,.3), inset 3px 0 0 var(--dr-orange) !important; }

/* Internal SPA pages use a quieter display hierarchy than the home hero. */
[code-path="src/pages/Catalog.tsx:148:5"],
[code-path="src/pages/Pricing.tsx:8:5"],
[code-path="src/pages/Playground.tsx:51:5"],
[code-path="src/pages/Docs.tsx:58:5"],
[code-path="src/pages/Status.tsx:51:5"] {
  position: relative;
  max-width: 1180px;
}
[code-path="src/pages/Catalog.tsx:148:5"]::before,
[code-path="src/pages/Pricing.tsx:8:5"]::before,
[code-path="src/pages/Playground.tsx:51:5"]::before,
[code-path="src/pages/Docs.tsx:58:5"]::before,
[code-path="src/pages/Status.tsx:51:5"]::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  height: 310px;
  background: radial-gradient(ellipse at 50% 0, rgba(255, 90, 31, .095), transparent 68%);
  pointer-events: none;
}
[code-path="src/pages/Catalog.tsx:150:7"],
[code-path="src/pages/Pricing.tsx:10:7"],
[code-path="src/pages/Playground.tsx:53:7"],
[code-path="src/pages/Docs.tsx:59:5"],
[code-path="src/pages/Status.tsx:52:5"] {
  font-family: "Sora", sans-serif;
  font-style: normal;
  font-weight: 700 !important;
  letter-spacing: -.045em !important;
  text-transform: none;
}

/* Catalog: richer filters, compact desktop rows and true mobile cards. */
[code-path="src/pages/Catalog.tsx:158:7"] {
  padding: 16px;
  align-items: center;
  background: rgba(15, 13, 12, .75);
  border: 1px solid #292421;
  border-radius: 15px;
}
[code-path="src/pages/Catalog.tsx:158:7"] input { max-width: 350px !important; }
[code-path="src/pages/Catalog.tsx:202:7"] { border-color: #302821 !important; border-radius: 14px !important; background: rgba(8,8,8,.65); }
[code-path="src/pages/Catalog.tsx:203:9"] { background: #100e0d !important; color: #b6aaa1 !important; }
[code-path="src/pages/Catalog.tsx:207:11"] { transition: background .16s ease, border-color .16s ease, transform .16s ease !important; }
[code-path="src/pages/Catalog.tsx:207:11"]:hover { background: rgba(255,90,31,.055) !important; }
.chip { border-color: #3d332c !important; }
.chip-free { box-shadow: 0 0 12px rgba(54, 211, 128, .06); }
.chip-unc { box-shadow: 0 0 12px rgba(255, 90, 31, .08); }

/* Pricing: two primary value panels and tactile credit packs. */
[code-path="src/pages/Pricing.tsx:8:5"] { max-width: 1080px; }
[code-path="src/pages/Pricing.tsx:9:7"], [code-path="src/pages/Pricing.tsx:10:7"], [code-path="src/pages/Pricing.tsx:11:7"] { text-align: center; margin-left: auto; margin-right: auto; }
[code-path="src/pages/Pricing.tsx:18:7"] {
  gap: 18px;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
}
[code-path="src/pages/Pricing.tsx:19:9"], [code-path="src/pages/Pricing.tsx:26:9"] {
  padding: 30px;
  background: linear-gradient(145deg, #15100d, #0c0b0a);
  border: 1px solid #5b3525;
  border-radius: 17px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
}
[code-path="src/pages/Pricing.tsx:21:11"], [code-path="src/pages/Pricing.tsx:28:11"] { font-size: 46px; letter-spacing: -.05em; }
[code-path="src/pages/Pricing.tsx:40:13"] { border-color: #322922 !important; border-radius: 13px !important; background: #0e0c0b !important; transition: transform .18s ease, border-color .18s ease; }
[code-path="src/pages/Pricing.tsx:40:13"]:hover { transform: translateY(-2px); border-color: var(--dr-orange); }
[code-path="src/pages/Pricing.tsx:64:7"] a { border-radius: 11px !important; }

/* Playground, docs and status panels. */
[code-path="src/pages/Playground.tsx:59:5"], [code-path="src/pages/Playground.tsx:69:5"] {
  border-color: #302721 !important;
  border-radius: 15px !important;
  box-shadow: 0 16px 45px rgba(0,0,0,.2);
}
[code-path="src/pages/Docs.tsx:41:5"], [code-path="src/pages/Status.tsx:66:7"] {
  border-color: #322821 !important;
  border-radius: 14px !important;
  background: #0a0908;
}
[code-path="src/pages/Docs.tsx:42:5"], [code-path="src/pages/Status.tsx:67:7"] { background: #12100e !important; }

/* Tables and static routes share the same warm panel language. */
table { border-collapse: separate; border-spacing: 0; }
th { background: rgba(255,90,31,.035); }
td, th { border-color: var(--dr-warm-line) !important; }
.static-page main > section, .guide-page main > section, .integrations-page main > section,
body > main > section { position: relative; }
.static-page main h1, .guide-page main h1, .integrations-page main h1, body > main h1 {
  font-family: "Sora", sans-serif;
  font-style: normal;
  font-weight: 700;
  letter-spacing: -.045em;
  text-transform: none;
}
.static-page main section > div[class*="rounded"], .guide-page main section > div[class*="rounded"],
.integrations-page main section > div[class*="rounded"] { border-color: #302821; }
footer { background: #030303 !important; border-top-color: var(--dr-warm-line) !important; }
.dr-footer-links a:hover, .dr-footer-links a:focus-visible { color: var(--dr-orange-soft); }

@media (max-width: 1099px) {
  .dr-model-nodes {
    position: relative;
    order: 3;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    width: 100%;
    max-width: 760px;
    margin: 4px 0 24px;
  }
  .dr-model-node { position: relative; inset: auto !important; width: 100%; min-width: 0; }
  [code-path="src/pages/Landing.tsx:24:9"] { order: 4; }
  [code-path="src/pages/Landing.tsx:19:9"] { order: 5; }
  [code-path="src/pages/Landing.tsx:23b:9"] { order: 6; }
  [code-path="src/pages/Landing.tsx:38:9"] { order: 7; }
}
@media (max-width: 767px) {
  [code-path="src/pages/Landing.tsx:63:9"] { grid-template-columns: 1fr; }
  [code-path="src/pages/Landing.tsx:69:13"] > span { margin-bottom: 22px; }
  [code-path="src/pages/Catalog.tsx:158:7"] { padding: 12px; gap: 10px !important; }
  [code-path="src/pages/Catalog.tsx:158:7"] input, [code-path="src/pages/Catalog.tsx:158:7"] select { max-width: 100% !important; }
  [code-path="src/pages/Catalog.tsx:202:7"] { overflow: visible; border: 0; background: transparent; }
  [code-path="src/pages/Catalog.tsx:207:11"] {
    margin-bottom: 12px;
    padding: 17px !important;
    background: linear-gradient(145deg, #11100f, #0a0909);
    border: 1px solid #302923;
    border-radius: 13px;
  }
  [code-path="src/pages/Catalog.tsx:207:11"]:last-of-type { margin-bottom: 0; }
  [code-path="src/pages/Catalog.tsx:215:17"] { white-space: normal; overflow-wrap: anywhere; }
  [code-path="src/pages/Pricing.tsx:19:9"], [code-path="src/pages/Pricing.tsx:26:9"] { padding: 24px; }
  main div:has(> table) { max-width: 100%; overflow-x: auto; }
  main table { min-width: 640px; }
}
@media (max-width: 639px) {
  [code-path="src/pages/Landing.tsx:12:7"] {
    background: linear-gradient(125deg, transparent 0 82%, rgba(255,90,31,.72) 82.2% 91%, transparent 91.2%), radial-gradient(ellipse at 80% 25%, rgba(255,90,31,.17), transparent 46%);
  }
  [code-path="src/pages/Landing.tsx:15:9"] { font-size: clamp(3.8rem, 17.2vw, 4.7rem) !important; }
  .dr-model-nodes { gap: 8px; margin-bottom: 18px; }
  .dr-model-node { grid-template-columns: 9px minmax(0,1fr) 5px; gap: 7px; min-height: 57px; padding: 9px; border-radius: 10px; }
  .dr-model-node strong { font-size: 9px; }
  .dr-model-node small { font-size: 8px; }
  .dr-node-gem { width: 7px; height: 7px; }
  [code-path="src/pages/Catalog.tsx:150:7"], [code-path="src/pages/Pricing.tsx:10:7"],
  [code-path="src/pages/Playground.tsx:53:7"], [code-path="src/pages/Docs.tsx:59:5"],
  [code-path="src/pages/Status.tsx:52:5"] { font-size: 2.65rem !important; }
}
@media (prefers-reduced-motion: reduce) {
  .dr-model-node, [code-path="src/pages/Catalog.tsx:207:11"] { transition: none; }
}

@media (min-width: 768px) and (max-width: 1099px) {
  header nav a.hidden.md\:inline { display: none !important; }
}