/* The developer page at night: the same warm brand, dark and plainer. A lantern earns its keep
   in the dark. Everything is scoped to html[data-icp="dev"], so the main page is untouched. */
[data-icp="dev"] {
  --night: #0d0e0c;
  --night-2: #141513;
  --night-3: #1c1d1a;
  --night-line: #2d2e2a;
  --night-text: #ece8df;
  --night-muted: #a39f94;
  --glow: #f2b45e;
  color: var(--night-text);
  background: var(--night);
  color-scheme: dark;
}
[data-icp="dev"] body { background: var(--night); }
[data-icp="dev"] ::selection { background: #f2b45e55; }

/* Type: a plain sans headline, mono for agent names and paths */
[data-icp="dev"] h1,
[data-icp="dev"] h2,
[data-icp="dev"] h3 { font-family: inherit; font-style: normal; color: var(--night-text); }
[data-icp="dev"] h2 { font-weight: 600; letter-spacing: -0.045em; }
[data-icp="dev"] .eyebrow { color: var(--glow); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: 0.08em; }
[data-icp="dev"] .section-intro p:not(.eyebrow) { color: var(--night-muted); }

/* Header */
[data-icp="dev"] .site-header { border-bottom-color: var(--night-line); }
[data-icp="dev"] .site-header .header-download { background: #ffffff0d; border-color: var(--night-line); }

/* Hero: centered copy, an amber glow, then the demo */
[data-icp="dev"] .hero-garden {
  background:
    radial-gradient(60% 45% at 50% 62%, #f2b45e1f, transparent 70%),
    radial-gradient(40% 30% at 50% 0%, #f2b45e14, transparent 70%),
    var(--night);
  color: var(--night-text);
}
[data-icp="dev"] .hero-garden .hero {
  grid-template-columns: minmax(0, 1fr);
  justify-items: center;
  min-height: 0;
  padding-block: 132px 48px;
  text-align: center;
}
[data-icp="dev"] .hero-copy { display: flex; flex-direction: column; align-items: center; text-shadow: none; }
[data-icp="dev"] .hero .eyebrow { justify-content: center; color: #d9d3c6; font-family: inherit; letter-spacing: 1.7px; }
[data-icp="dev"] .hero h1 {
  max-width: 900px;
  font-size: clamp(44px, 6vw, 80px);
  font-weight: 600;
  line-height: 1.02;
  letter-spacing: -0.055em;
}
[data-icp="dev"] .hero h1 em { font-style: normal; color: var(--glow); }
[data-icp="dev"] .hero-description { max-width: 560px; margin-inline: auto; color: var(--night-muted); }
[data-icp="dev"] .hero-actions { justify-content: center; }
[data-icp="dev"] .download-extras { justify-content: center; }
[data-icp="dev"] .dev-platforms { color: var(--night-muted); opacity: 1; }
[data-icp="dev"] .hero .text-link,
[data-icp="dev"] .icp-switch { color: var(--night-muted); }

.dev-demo { position: relative; margin: 0 auto; padding-bottom: 96px; }
.dev-demo__frame {
  position: relative;
  overflow: hidden;
  border: 1px solid #3a3933;
  border-radius: 14px;
  background: #000;
  box-shadow: 0 0 0 6px #ffffff08, 0 40px 120px -30px #f2b45e40, 0 30px 60px -30px #000;
}
.dev-demo__video { display: block; width: 100%; height: auto; aspect-ratio: 1920 / 1164; object-fit: cover; }
.dev-demo__toggle {
  position: absolute;
  right: calc(var(--gutter, 24px) + 14px);
  bottom: 112px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 8px 12px;
  border: 1px solid #ffffff26;
  border-radius: 7px;
  background: #0d0e0ccc;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  color: var(--night-text);
  font-size: 11px;
}

/* Agent ticker */
[data-icp="dev"] .ticker-heading p,
[data-icp="dev"] #ticker-pause,
[data-icp="dev"] .ticker-group li { color: var(--night-muted); }
[data-icp="dev"] .ticker-group img { filter: saturate(.9); }

/* Cards: rounded dark panels, no slanted paper edges */
[data-icp="dev"] .ln-grid { --ln-ink: var(--night-line); }
[data-icp="dev"] .ln-card { --panel: inset(0 round 16px); padding: 1px; }
[data-icp="dev"] .ln-card__inner { background: var(--night-2); }
[data-icp="dev"] .ln-card__copy p { color: var(--night-muted); }
[data-icp="dev"] .ln-step-number { color: var(--glow); }
[data-icp="dev"] .ln-card--point .ln-card__copy,
[data-icp="dev"] .ln-card--screen .ln-card__copy { padding-inline: 27px; }
[data-icp="dev"] .ln-scene,
[data-icp="dev"] .ln-scene[class*="ln-ask-tone"],
[data-icp="dev"] .ln-scene--notice,
[data-icp="dev"] .ln-scene--reply {
  background-color: var(--night-3);
  background-image: radial-gradient(#ffffff12 .7px, transparent .8px);
  background-size: 17px 17px;
  border-bottom: 1px solid var(--night-line);
}
[data-icp="dev"] .ln-scene-label { color: #8d897f; }

/* Widgets inside the scenes */
[data-icp="dev"] :is(.ln-window:not(.ln-window--dark), .ln-dev-question, .ln-dev-hub, .ln-dev-agents span, .ln-dev-machine > span:first-child,
  .ln-dev-tabs, .ln-dev-toolbar, .ln-dev-done, .ln-dev-key, .ln-dev-say > span:last-child, .ln-dev-chips span, .ln-dev-phone,
  .ln-dev-joined, .ln-dev-cloud, .ln-dev-pill, .ln-notice, .ln-ask-box, .ln-ask-answer, .ln-ask-start, .ln-ask-result) {
  border-color: #3a3b36;
  background: #22231f;
  box-shadow: 0 10px 24px -14px #000;
  color: var(--night-text);
}
[data-icp="dev"] .ln-window:not(.ln-window--dark) .ln-window__bar { border-color: #33342f; color: #9b978c; }
[data-icp="dev"] .ln-dev-option { border-color: #34352f; background: #1a1b18; color: #d6d2c8; }
[data-icp="dev"] .ln-dev-option kbd { background: #2e2f2a; color: #cfcabe; }
[data-icp="dev"] .ln-dev-option.is-picked { border-color: #5f8f55; background: #1f2b1c; }
[data-icp="dev"] .ln-dev-question p,
[data-icp="dev"] .ln-ask-answer strong { color: var(--night-text); }
[data-icp="dev"] :is(.ln-dev-question__head, .ln-dev-legend, .ln-dev-machine, .ln-dev-cloud p, .ln-dev-sleep, .ln-found, .ln-note, .ln-notice span, .ln-ask-answer p) { color: var(--night-muted); }
[data-icp="dev"] .ln-dev-tabs span:first-child { background: var(--glow); color: #1b1408; }
[data-icp="dev"] .ln-dev-chips span.is-picked { border-color: var(--glow); background: #2a2216; box-shadow: none; color: var(--night-text); }
[data-icp="dev"] .ln-dev-lines,
[data-icp="dev"] .ln-dev-lines::before { border-color: #4a4a43; }
[data-icp="dev"] .ln-dev-link { border-color: #4a4a43; }
[data-icp="dev"] .ln-dev-machine svg { color: #d6d2c8; }
[data-icp="dev"] .ln-dev-phone { border-color: #4a4a43; }
[data-icp="dev"] .ln-dev-phone time { color: var(--night-text); }
[data-icp="dev"] .ln-dev-push { border-color: #3a3b36; background: #2a2b26; }
[data-icp="dev"] .ln-dev-push span { color: var(--night-muted); }
[data-icp="dev"] .ln-dev-replies span { border-color: #3a3b36; background: #1a1b18; }
[data-icp="dev"] .ln-dev-cloud .ln-code { color: #bdb8ac; }
[data-icp="dev"] .ln-dev-cloud__head em { background: #23304a; color: #a9c1f2; }
[data-icp="dev"] .ln-reply-bubble { border-color: #3f5537; background: #1f2b1c; color: #bcd6ae; }
[data-icp="dev"] .ln-compose { border-color: #33342f; color: #9b978c; }

/* Quick wins */
[data-icp="dev"] .dev-quick li { border-top-color: var(--night-line); color: var(--night-muted); }
[data-icp="dev"] .dev-quick strong { color: var(--night-text); }

/* Try it here */
[data-icp="dev"] .preview-section { background: var(--night-2); border-block: 1px solid var(--night-line); }
[data-icp="dev"] .preview-copy > p:not(.eyebrow):not(.preview-disclaimer),
[data-icp="dev"] .preview-tip,
[data-icp="dev"] .preview-disclaimer,
[data-icp="dev"] .demo-scene-footer,
[data-icp="dev"] .demo-scene-footer button { color: var(--night-muted); }
[data-icp="dev"] .replay-button { background: #ffffff0d; color: var(--night-text); }

/* Details, compatibility */
[data-icp="dev"] .detail-card { background: var(--night-2); border-color: var(--night-line); }
[data-icp="dev"] :is(.detail-card p, .detail-art > span, .compatibility > div > p, .compatibility > div > p.compatibility-note) { color: var(--night-muted); }
[data-icp="dev"] .compatibility strong { color: var(--night-text); }

/* Pricing */

/* FAQ */
[data-icp="dev"] .faq-list details { border-color: var(--night-line); }
[data-icp="dev"] .faq-list summary > span { color: var(--glow); }
[data-icp="dev"] .faq-list details p,
[data-icp="dev"] .faq-section > div > p { color: var(--night-muted); }
[data-icp="dev"] .faq-section > div > p > a { color: var(--glow); }

/* Closing, family links, footer */
[data-icp="dev"] .closing-section { background: var(--night-2); border: 1px solid var(--night-line); border-radius: 20px; }
[data-icp="dev"] .closing-glow { background: radial-gradient(circle, #f2b45e33, transparent 65%); }
[data-icp="dev"] .closing-section > p:not(.eyebrow),
[data-icp="dev"] .closing-note { color: var(--night-muted); }
[data-icp="dev"] .closing-section img { width: 72px; height: 72px; }
[data-icp="dev"] .product-family-links,
[data-icp="dev"] .product-family-links > span,
[data-icp="dev"] .site-footer > p,
[data-icp="dev"] .site-footer > p > a,
[data-icp="dev"] .site-footer > a:last-child { color: var(--night-muted); }
[data-icp="dev"] .product-family-links a[aria-current] { color: var(--glow); }
[data-icp="dev"] :is(.product-family-links, .site-footer) { border-color: var(--night-line); }

@media (max-width: 760px) {
  [data-icp="dev"] .hero-garden .hero { padding-block: 112px 32px; }
  [data-icp="dev"] .hero-actions { flex-wrap: wrap; }
  .dev-demo { padding-bottom: 64px; }
  .dev-demo__frame { border-radius: 10px; }
  .dev-demo__toggle { bottom: 76px; right: 26px; }
}