/* New homepage only. Existing stylesheets are retained byte-for-byte. */
body.id-home { background:#f6f7fb; }
body.id-home *,body.id-home *::before,body.id-home *::after {box-sizing:border-box}
body.id-home {--id-muted:#657080;--id-rule:#dce1e8;--id-blue:#536c8e;--id-dark:#171b23}
body.id-home a {text-decoration:none}
body.id-home button,body.id-home a {-webkit-tap-highlight-color:transparent}
body.id-home a:focus-visible,body.id-home button:focus-visible {outline:3px solid #0b84ff;outline-offset:5px}
body.id-home [hidden] {display:none!important}
body.id-home .id-wrap {max-width:1380px;margin:0 auto;padding:0 48px}
body.id-home .id-skip {position:fixed;top:-80px;left:20px;z-index:100;background:#fff;color:#14181f;padding:12px}
body.id-home .id-skip:focus {top:12px}
body.id-home .wdd-subnav__inner {max-width:1380px;padding:0 48px}
body.id-home .wdd-subnav__list {gap:27px}
body.id-home .wdd-subnav__link {font-size:12px}
body.id-home .id-nav-demo {font-size:12px;background:#e05a47;color:#fff;padding:11px 17px;border-radius:4px;white-space:nowrap;font-weight:600;display:flex;gap:20px;align-items:center}
body.id-home .id-nav-demo:hover {background:#c24534}
body.id-home .id-eyebrow {font:500 10px/1.5 var(--wdd-font-mono);letter-spacing:.15em;color:#536c8e;margin:0 0 25px}
body.id-home .id-eyebrow>span {display:inline-block;width:6px;height:6px;background:#e05a47;margin-right:7px;vertical-align:middle}
body.id-home h1,body.id-home h2 {font-family:var(--wdd-font-display);font-weight:350;letter-spacing:-.045em;color:#14181f}
body.id-home h1 {font-size:clamp(45px,4.55vw,68px);line-height:1.08;margin:0 0 26px}
body.id-home h1 em,body.id-home h2 em {font-weight:350;color:#536c8e}
body.id-home h2 {font-size:clamp(34px,3.15vw,47px);line-height:1.13;margin:0 0 25px}
body.id-home .id-lede {font-size:18px;line-height:1.65;color:#303945;margin:0 0 20px;max-width:460px}
body.id-home .id-hero {
  box-sizing: border-box;
  padding: clamp(48px, 7vw, 100px) clamp(24px, 6vw, 88px);
  background: #f4f1e9;
  color: #171916;
  font-family: Arial, Helvetica, sans-serif;
}

body.id-home .id-hero-inner {
  max-width: 1240px;
  margin: 0 auto;
}

body.id-home .id-hero-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: clamp(32px, 5vw, 64px);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: 0.12em;
}

body.id-home .id-hero-brand > span {
  display: inline-block;
  flex: 0 0 12px;
  width: 12px;
  height: 12px;
  background: #d94732;
}

body.id-home .id-hero-title {
  margin: 0;
  color: #171916;
  font-family: "Arial Black", Arial, Helvetica, sans-serif;
  font-size: clamp(44px, 7.5vw, 108px);
  font-weight: 900;
  line-height: 1.02;
  letter-spacing: -0.065em;
}

body.id-home .id-hero-title > span {
  display: block;
}

body.id-home .id-hero-title-accent {
  margin-top: 0.08em;
  color: #d94732;
  font-size: 1.08em;
}

body.id-home .id-hero-tagline {
  max-width: 650px;
  margin: clamp(28px, 4vw, 44px) 0 0;
  color: #41443d;
  font-size: clamp(18px, 1.7vw, 23px);
  font-weight: 400;
  line-height: 1.55;
  letter-spacing: -0.025em;
}

body.id-home .id-hero-tagline strong {
  color: #171916;
  font-weight: 800;
}

body.id-home .id-hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 24px 36px;
  margin-top: 32px;
}

body.id-home .id-hero-demo {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 36px;
  min-height: 58px;
  padding: 16px 24px;
  border: 2px solid #171916;
  border-radius: 4px;
  background: #171916;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.25;
  text-decoration: none;
}

body.id-home .id-hero-demo:hover {
  border-color: #33362f;
  background: #33362f;
}

body.id-home .id-hero-demo > span {
  font-size: 23px;
  line-height: 1;
}

body.id-home .id-hero-workflow {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  min-height: 48px;
  color: #171916;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
}

body.id-home .id-hero-workflow:hover {
  color: #d94732;
}

body.id-home .id-hero-workflow > span {
  font-size: 22px;
  line-height: 1;
}
body.id-home .id-hero-grid {display:grid;grid-template-columns:.9fr 1.25fr;gap:45px;align-items:center;padding-bottom:76px}
body.id-home .id-hero-copy {padding:0 0 4px;max-width:495px}
body.id-home .id-hero-detail {font-size:14px;line-height:1.85;color:#68717e;max-width:430px;margin:0 0 29px}
body.id-home .id-actions {display:flex;align-items:center;gap:23px;flex-wrap:wrap}
body.id-home .id-button {display:inline-flex;align-items:center;gap:26px;padding:16px 22px;background:#e05a47;color:#fff;border:1px solid #e05a47;border-radius:4px;font-size:12px;font-weight:600;transition:background .2s}
body.id-home .id-button:hover {background:#c24534;border-color:#c24534}
body.id-home .id-button span {font-size:18px;line-height:1;font-weight:400}
body.id-home .id-text-link {display:inline-flex;align-items:center;gap:13px;font-size:13px;font-weight:600;color:#303945}
body.id-home .id-text-link:hover {color:#e05a47}
body.id-home .id-caption {font-size:10px;line-height:1.6;color:#6b7686}
body.id-home .id-demo-caption {margin:16px 0 0}
body.id-home .id-demo-caption span {color:#7f8895}
body.id-home .id-product-figure {margin:0;min-width:0;position:relative}
body.id-home .id-product-figure::before {content:'';position:absolute;inset:28px -28px 0 25px;border:1px solid #dce1e8;border-radius:11px;z-index:0}
body.id-home .id-product {position:relative;background:#e8edf1;border:1px solid #252b38;border-radius:7px;box-shadow:0 25px 55px -20px #25324955;overflow:hidden;font-family:Inter,Arial,sans-serif;user-select:none}
body.id-home .id-app-top {height:35px;background:#11151b;color:#b9c2d0;display:flex;align-items:center;justify-content:space-between;padding:0 12px;font-size:7px;border-bottom:1px solid #394151}
body.id-home .id-app-top>b {font-size:7px;font-weight:500}
body.id-home .id-app-logo {font-family:Georgia,serif;font-style:italic;font-size:21px;color:#fff;letter-spacing:-1px}
body.id-home .id-app-logo small {font:7px Inter,sans-serif;letter-spacing:0;color:#a3aebb}
body.id-home .id-app-body {display:grid;grid-template-columns:98px minmax(0,1fr) 127px;height:390px}
body.id-home .id-app-sidebar {background:#252734;color:#a3a7b8;position:relative;font-size:7px;padding:0 0 15px}
body.id-home .id-app-side-icons {border-bottom:1px solid #ffffff15;padding:11px;color:#bdc4cf;font-size:12px}
body.id-home .id-side-heading {padding:12px 8px 8px;font-size:8px;color:#d7dbe6;border-bottom:1px solid #ffffff0a}
body.id-home .id-side-heading span {float:right}
body.id-home .id-side-item {padding:8px 10px}
body.id-home .id-current {background:#0b84ff25;border-left:2px solid #0b84ff;color:#c3dcff}
body.id-home .id-side-file {padding:5px 0 7px 27px;color:#afb9cc;font-size:6px}
body.id-home .id-app-side-bottom {position:absolute;bottom:12px;left:10px;font:6px var(--wdd-font-mono);color:#8f97a7}
body.id-home .id-app-center {min-width:0;display:flex;flex-direction:column}
body.id-home .id-app-breadcrumb {display:flex;align-items:center;justify-content:space-between;gap:4px;background:#f7f8fa;height:28px;flex:none;padding:0 8px;border-bottom:1px solid #cfd6df;font-size:6px;color:#7b8492}
body.id-home .id-app-breadcrumb b {font-weight:500;color:#4d677e}
body.id-home .id-app-canvas {background-color:#e3e9ee;background-image:radial-gradient(#b4bfcb88 .65px,transparent .65px);background-size:10px 10px;position:relative;padding:42px 15px 26px;flex:1}
body.id-home .id-floating-tools {position:absolute;top:9px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:3px;background:#2d2d3d;color:#d9dcec;padding:4px 6px;border-radius:5px;box-shadow:0 3px 8px #0002;z-index:2;font-size:10px;white-space:nowrap}
body.id-home .id-floating-tools>span {padding:3px}
body.id-home .id-tool-active {background:#0b84ff;border-radius:2px;color:#fff}
body.id-home .id-floating-tools .id-tool-separator {height:15px;padding:0;width:1px;background:#ffffff30;margin:0 3px}
body.id-home .id-sample-site {height:100%;background:#f8f6f0;border:1px solid #168bff;position:relative;box-shadow:0 3px 9px #35434d1c}
body.id-home .id-sample-nav {padding:12px 12px 11px;display:flex;align-items:center;justify-content:space-between;color:#464a40;font-size:4px;border-bottom:1px solid #48534615;gap:5px}
body.id-home .id-sample-nav>b {font-size:8px;letter-spacing:-.4px;white-space:nowrap}
body.id-home .id-sample-nav>b span {font-size:4px;vertical-align:top;margin-left:2px}
body.id-home .id-sample-hero {padding:19px 15px 14px;color:#3c493e}
body.id-home .id-sample-hero>p {font-size:4px;letter-spacing:1.3px;margin:0 0 10px}
body.id-home .id-sample-hero h2 {font-family:Georgia,serif;color:#35483d;font-size:26px;line-height:1.02;letter-spacing:-1.1px;margin:0 0 10px;font-weight:400}
body.id-home .id-sample-hero h2 i {font-weight:400}
body.id-home .id-sample-description {font-size:5px;line-height:1.8;color:#808477}
body.id-home .id-sample-link {display:inline-block;font-size:4px;padding:7px 0 0;border-bottom:1px solid #58634f;margin-top:5px}
body.id-home .id-sample-image {position:absolute;bottom:0;left:0;width:100%;height:37%;overflow:hidden;background:#bfc8bc}
body.id-home .id-sample-image svg {display:block;width:100%;height:100%;object-fit:cover}
body.id-home .id-selection-tag {position:absolute;top:-12px;left:-1px;background:#168bff;color:#fff;font-size:5px;padding:2px 4px}
body.id-home .id-selection-corner {position:absolute;width:5px;height:5px;border:1px solid #168bff;background:#fff;bottom:-3px;right:-3px}
body.id-home .id-canvas-axis {position:absolute;bottom:8px;left:10px;right:10px;display:flex;justify-content:space-between;color:#9ca9b3;font-size:5px}
body.id-home .id-app-bottom {height:20px;flex:none;background:#f7f8fa;border-top:1px solid #d3dae3;color:#6d7986;font-size:5px;padding:6px 8px}
body.id-home .id-app-bottom>span {padding:0 5px}
body.id-home .id-app-bottom-right {float:right}
body.id-home .id-style-panel {background:#2d2d3d;color:#b7b8ca;font-size:7px;border-left:1px solid #222435}
body.id-home .id-panel-tabs {height:29px;display:flex;align-items:center;gap:18px;padding:0 9px;border-bottom:1px solid #ffffff15;color:#85889b;font-size:7px}
body.id-home .id-panel-tabs b {height:29px;display:flex;align-items:center;color:#fff;border-bottom:2px solid #0b84ff;font-weight:500}
body.id-home .id-style-label {font-size:5px;letter-spacing:1px;color:#85889b;padding:12px 9px 6px}
body.id-home .id-selector {font-family:var(--wdd-font-mono);margin:0 8px 10px;padding:7px;background:#212130;border:1px solid #55566a;border-radius:3px;color:#d6def0}
body.id-home .id-selector span {float:right}
body.id-home .id-panel-title {padding:9px;background:#ffffff06;border-top:1px solid #ffffff09;border-bottom:1px solid #ffffff08;font-size:7px;color:#d2d5df}
body.id-home .id-prop {display:flex;justify-content:space-between;align-items:center;padding:6px 9px;font-size:6px}
body.id-home .id-prop b {min-width:46px;font-weight:400;background:#20202f;border:1px solid #ffffff10;padding:4px 6px;border-radius:2px;color:#d4d9e4}
body.id-home .id-segments {display:flex;justify-content:space-between;margin:2px 8px 4px;background:#21212f;border-radius:2px;font-size:5px;color:#959bb0}
body.id-home .id-segments>* {padding:5px;font-weight:400}
body.id-home .id-segments>b {background:#0b84ff35;color:#c2ddff}
body.id-home .id-spacing {margin:8px;display:flex;align-items:center;flex-direction:column;border:1px dashed #636275;padding:4px 8px;font-size:5px;color:#9599aa;position:relative}
body.id-home .id-spacing>small {position:absolute;left:3px;top:2px;font-size:4px}
body.id-home .id-spacing>div {width:100%;margin:3px;border:1px solid #6b89654a;background:#77ad6e0e;display:flex;align-items:center;flex-direction:column;position:relative;gap:4px;padding:4px}
body.id-home .id-spacing>div small {position:absolute;left:3px;top:2px;font-size:4px}
body.id-home .id-spacing b {font-size:5px;font-weight:400;white-space:nowrap}
body.id-home .id-product-figure figcaption {position:relative;display:flex;justify-content:space-between;padding:18px 3px 0;font:8px var(--wdd-font-mono);color:#7b8593}
body.id-home .id-product-figure figcaption i {width:5px;height:5px;background:#5b8a74;display:inline-block;border-radius:50%;margin-right:5px}
body.id-home .id-principles {border-top:1px solid #dce1e8;display:grid;grid-template-columns:repeat(3,1fr);padding-top:25px;padding-bottom:25px;gap:24px}
body.id-home .id-principles>div {display:flex;align-items:center;gap:14px;font-size:11px;color:#536071;justify-content:center}
body.id-home .id-principles>div+div {border-left:1px solid #dce1e8}
body.id-home .id-principle-symbol {font:16px var(--wdd-font-mono);color:#6e849c}
body.id-home .id-section {padding:90px 0;scroll-margin-top:120px}
body.id-home .id-workflow.id-section {
  --ink: #171916;
  --muted: #5a6057;
  --accent: #d94732;
  --rule: #d6d7cc;
  padding: clamp(48px, 6vw, 88px) clamp(24px, 5vw, 76px);
  background: #fff;
  color: var(--ink);
  font-family: Arial, Helvetica, sans-serif;
}

body.id-home .id-workflow .id-wrap {
  max-width: 1240px;
  margin: 0 auto;
  padding: 0;
}

body.id-home .id-workflow .id-section-intro {
  display: block;
  margin-bottom: 48px;
}

body.id-home .id-workflow .id-eyebrow {
  display: flex;
  align-items: center;
  gap: 11px;
  margin: 0 0 20px;
  color: #646a60;
  font: 700 12px/1.4 "Courier New", monospace;
  letter-spacing: .13em;
}

body.id-home .id-workflow .id-eyebrow::before {
  content: "";
  width: 9px;
  height: 9px;
  flex: 0 0 9px;
  background: var(--accent);
}

body.id-home .id-workflow h2 {
  max-width: 1120px;
  margin: 0;
  color: var(--ink);
  font-family: inherit;
  font-size: clamp(34px, 4.1vw, 56px);
  font-weight: 800;
  line-height: 1.12;
  letter-spacing: -.045em;
  text-wrap: balance;
}

body.id-home .id-workflow h2 em {
  color: var(--accent);
  font-weight: inherit;
}

body.id-home .id-workflow .id-workflow-grid {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  gap: clamp(36px, 5vw, 72px);
  align-items: start;
}

body.id-home .id-workflow .id-workflow-copy {
  min-width: 0;
}

body.id-home .id-workflow .id-feature {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 18px;
  margin: 0;
  padding: 25px 0 27px;
  border-top: 1px solid var(--rule);
}

body.id-home .id-workflow .id-feature > span {
  padding-top: 3px;
  color: var(--accent);
  font: 700 17px/1.5 "Courier New", monospace;
}

body.id-home .id-workflow .id-feature h3 {
  margin: 0 0 10px;
  color: var(--ink);
  font-family: inherit;
  font-size: clamp(22px, 1.9vw, 26px);
  font-weight: 750;
  line-height: 1.22;
  letter-spacing: -.035em;
}

body.id-home .id-workflow .id-feature p {
  max-width: 430px;
  margin: 0;
  color: var(--muted);
  font-size: 17px;
  line-height: 1.65;
}

body.id-home .id-workflow .id-text-link {
  display: inline-flex;
  align-items: center;
  gap: 26px;
  margin: 10px 0 0 56px;
  padding: 7px 0;
  border-bottom: 1px solid var(--ink);
  color: var(--ink);
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
}

body.id-home .id-workflow .id-text-link > span {
  font-size: 22px;
}

body.id-home .id-workflow .id-text-link:hover {
  color: var(--accent);
  border-color: var(--accent);
}

body.id-home .id-workflow .id-code-workspace {
  min-width: 0;
  overflow: hidden;
  border: 1px solid #29332e;
  border-radius: 12px;
  background: #1c2225;
  box-shadow: 0 24px 48px -30px #242c2455;
}

body.id-home .id-workflow .id-code-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 17px 0 8px;
  border-bottom: 1px solid #373f40;
  background: #1c2225;
  color: #9ca9aa;
  font: 11px/1.4 "Courier New", monospace;
}

body.id-home .id-workflow .id-code-toolbar > div {
  display: flex;
}

body.id-home .id-workflow .id-code-toolbar button {
  padding: 20px 16px 17px;
  border: 0;
  border-bottom: 3px solid transparent;
  background: transparent;
  color: #aab5b7;
  font: 700 13px/1.4 "Courier New", monospace;
  cursor: pointer;
}

body.id-home .id-workflow .id-code-toolbar button:hover {
  background: #ffffff09;
  color: #fff;
}

body.id-home .id-workflow .id-code-toolbar button[aria-selected="true"] {
  border-bottom-color: #ed715a;
  background: #ffffff06;
  color: #fff;
}

body.id-home .id-workflow .id-code-pane {
  height: 520px;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: #1c2225;
}

body.id-home .id-workflow [hidden] {
  display: none !important;
}

body.id-home .id-workflow .id-design-pane {
  background: #e8ece6;
}

body.id-home .id-workflow .id-mini-ruler {
  display: flex;
  align-items: center;
  gap: 9px;
  flex: 0 0 40px;
  padding: 0 17px;
  border-bottom: 1px solid #d7ded5;
  background: #f8faf6;
  color: #89938b;
  font: 9px/1.4 "Courier New", monospace;
}

body.id-home .id-workflow .id-mini-ruler b {
  color: #4e6d65;
  font-weight: 700;
}

body.id-home .id-workflow .id-ruler-size {
  margin-left: auto;
}

body.id-home .id-workflow .id-mini-canvas {
  flex: 1;
  min-height: 0;
  display: flex;
  align-items: center;
  padding: 38px 26px;
  background-image: radial-gradient(#bdc9bc .8px, transparent .8px);
  background-size: 12px 12px;
}

body.id-home .id-workflow .id-mini-section {
  position: relative;
  width: 100%;
  padding: 34px 28px;
  border: 1px solid #3987cd;
  background: #faf7ee;
  color: #35483b;
  box-shadow: 0 10px 25px -18px #35483b88;
}

body.id-home .id-workflow .id-mini-tag {
  position: absolute;
  top: -23px;
  left: -1px;
  padding: 5px 8px;
  background: #3987cd;
  color: #fff;
  font: 10px/1.2 "Courier New", monospace;
}

body.id-home .id-workflow .id-mini-section > p {
  margin: 0 0 22px;
  color: #74816e;
  font: 9px/1.4 "Courier New", monospace;
  letter-spacing: .09em;
}

body.id-home .id-workflow .id-mini-section h3 {
  margin: 0 0 25px;
  color: #35483b;
  font: 42px/1.06 Georgia, serif;
  letter-spacing: -1.5px;
}

body.id-home .id-workflow .id-mini-columns {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  align-items: center;
  gap: 18px;
}

body.id-home .id-workflow .id-mini-columns p {
  margin: 0;
  color: #6d796d;
  font-size: 12px;
  line-height: 1.6;
}

body.id-home .id-workflow .id-mini-button {
  padding: 12px 8px;
  border: 1px solid #819082;
  font-size: 11px;
  line-height: 1.4;
  text-align: center;
}

body.id-home .id-workflow .id-mini-section > i {
  position: absolute;
  right: -4px;
  bottom: -4px;
  width: 7px;
  height: 7px;
  border: 1px solid #3987cd;
  background: #fff;
}

body.id-home .id-workflow .id-code-pane pre {
  flex: 1;
  min-height: 0;
  margin: 0;
  padding: 24px;
  overflow: auto;
  color: #d6e1e0;
  font: 12px/1.85 "Courier New", monospace;
  scrollbar-color: #596461 #1c2225;
}

body.id-home .id-workflow .id-code-pane code {
  font: inherit;
}

body.id-home .id-workflow .id-token-comment {color:#8a9b98}
body.id-home .id-workflow .id-token-tag {color:#9ac8ed}
body.id-home .id-workflow .id-token-attr {color:#e4bd82}
body.id-home .id-workflow .id-token-string {color:#b1d3af}

body.id-home .id-workflow .id-code-note {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex: 0 0 auto;
  padding: 16px 18px;
  border-top: 1px solid #3a4443;
  background: #252d30;
  color: #afbcbb;
  font: 10px/1.5 "Courier New", monospace;
}

body.id-home .id-workflow .id-code-note > span:first-child {
  color: #f0f3ed;
  font-weight: 700;
}

@media (max-width: 650px) {
  body.id-home .id-workflow .id-workflow-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 38px;
  }

  body.id-home .id-workflow .id-section-intro {margin-bottom:34px}
  body.id-home .id-workflow .id-feature p {max-width:620px}
  body.id-home .id-workflow .id-code-workspace {max-width:680px;width:100%}
  body.id-home .id-workflow .id-code-pane {height:480px}
}

@media (max-width: 480px) {
  body.id-home .id-workflow .id-feature {
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 14px;
    padding: 22px 0;
  }

  body.id-home .id-workflow .id-feature h3 {font-size:22px}
  body.id-home .id-workflow .id-feature p {font-size:16px}
  body.id-home .id-workflow .id-text-link {margin-left:42px}
  body.id-home .id-workflow .id-code-toolbar {padding-right:8px}
  body.id-home .id-workflow .id-code-toolbar > span {display:none}
  body.id-home .id-workflow .id-code-toolbar button {padding-right:14px;padding-left:14px}
  body.id-home .id-workflow .id-mini-ruler {padding:0 10px;gap:6px;font-size:8px}
  body.id-home .id-workflow .id-ruler-size {display:none}
  body.id-home .id-workflow .id-mini-canvas {padding:34px 18px}
  body.id-home .id-workflow .id-mini-section {padding:28px 18px}
  body.id-home .id-workflow .id-mini-section h3 {font-size:34px}
  body.id-home .id-workflow .id-mini-columns {grid-template-columns:minmax(0,1fr);gap:18px}
  body.id-home .id-workflow .id-mini-button {justify-self:start;padding:10px 13px}
  body.id-home .id-workflow .id-code-note {padding:13px 12px;gap:12px;font-size:9px}
  body.id-home .id-workflow .id-code-pane pre {padding:18px;font-size:11px}
}
body.id-home .id-export {background:#f0f2f7;border-top:1px solid #e5e8ef}
body.id-home .id-export-grid {display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:center}
body.id-home .id-export-copy>.id-lede {font-size:18px;margin:0 0 18px}
body.id-home .id-export-copy>p:not(.id-eyebrow):not(.id-lede) {font-size:13px;line-height:1.85;color:#78828f;max-width:400px;margin-bottom:26px}
body.id-home .id-export-point {display:flex;align-items:flex-start;gap:13px;margin:18px 0}
body.id-home .id-export-point>span {color:#5c7d67;font-size:12px;padding-top:1px}
body.id-home .id-export-point strong {font-size:14px;font-weight:500;display:block;margin-bottom:5px;color:#303a47}
body.id-home .id-export-point div>span {font-size:12px;color:#7b8593}
body.id-home .id-export-copy>.id-text-link {margin-top:10px}
body.id-home .id-file-visual {background:#fff;border:1px solid #d5dce6;border-radius:6px;box-shadow:0 16px 45px -27px #243b5c55}
body.id-home .id-file-header {display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e7ebf2;padding:19px 23px;color:#414b5c;font:11px var(--wdd-font-mono)}
body.id-home .id-file-header small {font-size:8px;color:#8c98a9;letter-spacing:.1em}
body.id-home .id-file-body {padding:28px 33px 30px}
body.id-home .id-file-root {font:13px var(--wdd-font-mono);color:#3b536f;padding-bottom:17px}
body.id-home .id-file-root>span {margin-right:7px;font-size:20px}
body.id-home .id-file-tree {border-left:1px solid #dce3ec;margin-left:10px;padding:0 0 0 25px}
body.id-home .id-file-tree>div {position:relative;display:flex;align-items:center;gap:10px;min-height:32px;font:11px var(--wdd-font-mono);color:#647b99}
body.id-home .id-file-tree>div::before {content:'';position:absolute;left:-25px;width:15px;height:1px;background:#dce3ec}
body.id-home .id-file-tree b {font-weight:400;color:#3c495d}
body.id-home .id-file-icon {font-size:8px;background:#edf1f8;padding:4px;border-radius:2px;color:#6b86a9}
body.id-home .id-file-tree small {margin-left:auto;font:9px var(--wdd-font-body);color:#97a0ad}
body.id-home .id-file-folder {margin-top:5px}
body.id-home .id-file-folder>span {font-size:20px;width:23px}
body.id-home .id-file-tree .id-file-nested {padding-left:34px;font-size:10px;min-height:25px;color:#929dad}
body.id-home .id-file-tree .id-file-nested::before {left:14px;width:11px}
body.id-home .id-file-footer {padding:15px 20px;display:flex;align-items:center;gap:7px;border-top:1px solid #e5e9f0;flex-wrap:wrap}
body.id-home .id-file-footer>span {font:8px var(--wdd-font-mono);padding:5px 7px;background:#f0f3f8;color:#6f8198;border:1px solid #e5eaf3;border-radius:2px}
body.id-home .id-file-footer i {margin-left:auto;font:8px var(--wdd-font-body);color:#929cab}
body.id-home .wdd-vstrip {margin:0}
body.id-home .id-demo {background:#171b23;color:#bbc2cd}
body.id-home .id-demo-grid {display:grid;grid-template-columns:1.3fr 1fr;gap:100px;align-items:center}
body.id-home .id-demo h2 {color:#f4f3ef}
body.id-home .id-demo h2 em {color:#9daec4}
body.id-home .id-demo .id-eyebrow {color:#a0b0c7}
body.id-home .id-demo-grid>div>p:not(.id-eyebrow) {font-size:13px;line-height:1.8;max-width:390px;margin:0 0 26px;color:#a6aebb}
body.id-home .id-demo .id-caption {display:block;color:#858f9e;margin-top:15px}
body.id-home .id-demo-checklist {border-left:1px solid #343b47;padding-left:50px}
body.id-home .id-demo-checklist>p {font:9px var(--wdd-font-mono);letter-spacing:.13em;color:#75849b;margin:0 0 25px}
body.id-home .id-demo-checklist>div {display:grid;grid-template-columns:24px 1fr;column-gap:14px;row-gap:7px;margin:24px 0}
body.id-home .id-demo-checklist>div>span {grid-row:1/3;font:9px var(--wdd-font-mono);color:#6c7e98;padding-top:3px}
body.id-home .id-demo-checklist b {font-size:16px;font-weight:500;color:#e0e4ec}
body.id-home .id-demo-checklist small {font-size:12px;color:#838f9f;line-height:1.7}
body.id-home .id-services {padding:48px 0;background:#f7f8fb}
body.id-home .id-services-grid {display:grid;grid-template-columns:1fr 1.2fr 1.2fr;gap:45px;align-items:center}
body.id-home .id-services .id-eyebrow {margin-bottom:10px;font-size:8px}
body.id-home .id-services h2 {font-size:29px;margin:0}
body.id-home .id-services-grid>a {border-left:1px solid #dce1e8;padding:4px 0 4px 34px;color:#3c4756}
body.id-home .id-services-grid>a>span {font-size:13px;font-weight:500}
body.id-home .id-services-grid>a>p {font-size:10px;line-height:1.8;color:#8a929e;margin:8px 0 11px}
body.id-home .id-services-grid>a>b {font-size:9px;color:#5b7596;font-weight:500}
body.id-home .id-services-grid>a:hover>b {color:#e05a47}
@media(min-width:1600px){body.id-home .id-app-body {height:425px}}
@media(max-width:1150px){body.id-home .id-wrap,body.id-home .wdd-subnav__inner {padding-left:32px;padding-right:32px}body.id-home .wdd-subnav__list {gap:18px}body.id-home .id-hero-grid {gap:28px;grid-template-columns:.9fr 1.1fr}body.id-home .id-app-body {grid-template-columns:75px minmax(0,1fr) 100px;height:355px}body.id-home .id-sample-hero h2 {font-size:22px}body.id-home .id-panel-tabs {gap:10px}body.id-home .id-hero-detail {font-size:13px}body.id-home .id-lede {font-size:16px}body.id-home .id-actions {gap:16px}body.id-home .id-button {padding:14px 17px;gap:15px;font-size:11px}body.id-home .id-text-link {font-size:11px}body.id-home .id-workflow-grid {gap:45px}body.id-home .id-export-grid {gap:55px}body.id-home .id-app-breadcrumb>span:first-of-type {display:none}body.id-home .id-file-footer i {width:100%;margin:4px 0 0}body.id-home .id-demo-grid {gap:60px}body.id-home .id-services-grid {gap:30px}}
@media(max-width:900px) and (min-width:769px){body.id-home .wdd-subnav__list {gap:14px}body.id-home .wdd-subnav__link {font-size:10px}body.id-home .id-nav-demo {padding:9px 12px;font-size:10px;gap:8px}body.id-home .id-hero-grid {grid-template-columns:1fr;gap:45px}body.id-home .id-hero-copy {max-width:650px}body.id-home .id-hero-detail {max-width:550px}body.id-home .id-product-figure {max-width:700px;width:100%;margin:0 auto}body.id-home .id-app-body {grid-template-columns:110px minmax(0,1fr) 155px;height:400px}body.id-home .id-sample-hero h2 {font-size:32px}body.id-home .id-principles>div {font-size:9px;gap:10px}body.id-home .id-workflow-grid {gap:30px}body.id-home .id-mini-canvas {padding:32px 20px}body.id-home .id-mini-section {padding:20px}body.id-home .id-mini-section h3 {font-size:24px}body.id-home .id-section-intro>p {max-width:250px}body.id-home .id-export-grid {gap:35px}body.id-home .id-file-body {padding:22px}body.id-home .id-file-tree small {font-size:8px}body.id-home .id-services-grid {grid-template-columns:1fr 1fr}body.id-home .id-services-grid>div {grid-column:1/-1}body.id-home .id-services-grid>a {padding-left:20px}}
@media(max-width:768px){body.id-home .id-wrap,body.id-home .wdd-subnav__inner {padding-left:23px;padding-right:23px}body.id-home .wdd-promo-header {padding:10px 23px}body.id-home .wdd-promo-header__inner {font-size:10px;gap:12px}body.id-home .wdd-promo-header__link {font-size:9px;flex:none}body.id-home .wdd-promo-header__text {max-width:255px;line-height:1.6}body.id-home .wdd-announce {font-size:8px;letter-spacing:.06em;padding:10px 13px;line-height:1.6}body.id-home .wdd-announce__dot {width:4px;height:4px;margin:0 7px}body.id-home .wdd-subnav__brand-name {font-size:23px}body.id-home .wdd-subnav.is-open .wdd-subnav__list {padding:10px 23px 18px;gap:0}body.id-home .wdd-subnav.is-open .id-nav-demo {margin-top:10px;justify-content:space-between}body.id-home h1 {font-size:51px}body.id-home .id-hero-grid {grid-template-columns:1fr;gap:38px;padding-bottom:37px}body.id-home .id-hero-copy {max-width:550px}body.id-home .id-eyebrow {font-size:9px;margin-bottom:20px}body.id-home .id-lede {font-size:16px}body.id-home .id-hero-detail {font-size:13px;max-width:500px}body.id-home .id-actions {gap:20px}body.id-home .id-button {font-size:11px;padding:15px 18px}body.id-home .id-demo-caption {font-size:9px}body.id-home .id-product-figure {width:100%;max-width:620px;margin:0 auto}body.id-home .id-product-figure::before {inset:18px -12px 2px 15px}body.id-home .id-app-body {height:325px;grid-template-columns:70px minmax(0,1fr) 98px}body.id-home .id-app-sidebar {font-size:6px}body.id-home .id-side-heading {font-size:6px;padding:11px 6px 8px}body.id-home .id-side-item {padding:7px 6px;font-size:5px}body.id-home .id-side-file {font-size:5px;padding:5px 0 6px 17px}body.id-home .id-app-side-bottom {font-size:5px;left:6px}body.id-home .id-app-top {font-size:5px;padding:0 8px;height:31px}body.id-home .id-app-top>b {font-size:5px}body.id-home .id-app-logo {font-size:18px}body.id-home .id-app-canvas {padding:40px 9px 23px}body.id-home .id-sample-nav {padding:11px 9px;font-size:3px}body.id-home .id-sample-nav>b {font-size:6px}body.id-home .id-sample-hero {padding:16px 10px 12px}body.id-home .id-sample-hero h2 {font-size:24px}body.id-home .id-sample-hero>p {font-size:3px;letter-spacing:.6px}body.id-home .id-sample-description {font-size:4px}body.id-home .id-style-panel {font-size:5px}body.id-home .id-panel-tabs {font-size:6px;padding-left:7px;gap:13px}body.id-home .id-prop {font-size:5px;padding:5px 7px}body.id-home .id-prop b {min-width:38px;padding:3px 4px}body.id-home .id-selector {font-size:6px}body.id-home .id-panel-title {font-size:6px;padding:8px}body.id-home .id-product-figure figcaption {font-size:6px;gap:10px;padding-top:15px}body.id-home .id-principles {grid-template-columns:1fr;padding-top:19px;padding-bottom:19px;gap:14px}body.id-home .id-principles>div {justify-content:flex-start;font-size:10px;gap:13px}body.id-home .id-principles>div+div {border-left:0}body.id-home .id-principle-symbol {font-size:13px;width:20px;text-align:center}body.id-home .id-section {padding:57px 0;scroll-margin-top:115px}body.id-home h2 {font-size:36px}body.id-home .id-section-intro {display:block;margin-bottom:35px}body.id-home .id-section-intro>p {font-size:13px;margin:22px 0 0;max-width:420px}body.id-home .id-workflow-grid {grid-template-columns:1fr;gap:35px}body.id-home .id-feature {margin-bottom:25px;gap:18px}body.id-home .id-feature h3 {font-size:13px}body.id-home .id-feature p {font-size:12px}body.id-home .id-code-pane {height:330px}body.id-home .id-code-pane pre {font-size:9px;padding:18px;line-height:1.8}body.id-home .id-code-toolbar button {padding:15px 13px;font-size:9px}body.id-home .id-mini-canvas {padding:32px 22px}body.id-home .id-mini-section {padding:22px}body.id-home .id-mini-section h3 {font-size:28px}body.id-home .id-mini-columns {gap:16px}body.id-home .id-code-note {font-size:8px;padding:13px}body.id-home .id-mini-ruler {font-size:6px;gap:7px;padding:0 13px}body.id-home .id-export-grid {grid-template-columns:1fr;gap:38px}body.id-home .id-export-copy>p:not(.id-eyebrow):not(.id-lede) {max-width:500px}body.id-home .id-file-body {padding:25px}body.id-home .id-file-tree>div {font-size:10px;min-height:31px}body.id-home .id-file-footer i {width:auto;margin:0 0 0 auto;font-size:7px}body.id-home .id-demo-grid {grid-template-columns:1fr;gap:35px}body.id-home .id-demo-checklist {padding:25px 0 0;border-left:0;border-top:1px solid #343b47}body.id-home .id-demo-checklist>p {font-size:8px}body.id-home .id-demo-checklist>div {margin:23px 0 0}body.id-home .id-services {padding:37px 0}body.id-home .id-services-grid {grid-template-columns:1fr;gap:25px}body.id-home .id-services-grid>a {padding:0 0 0 20px}body.id-home .id-services h2 {font-size:29px}}
@media(max-width:390px){body.id-home .id-wrap,body.id-home .wdd-subnav__inner {padding-left:18px;padding-right:18px}body.id-home h1 {font-size:45px}body.id-home .id-app-body {grid-template-columns:59px minmax(0,1fr) 85px;height:305px}body.id-home .id-sample-hero h2 {font-size:21px}body.id-home .id-panel-tabs {gap:8px;font-size:5px}body.id-home .id-prop b {min-width:32px}body.id-home .id-segments>* {padding:4px 3px}body.id-home .id-product-figure figcaption {font-size:5.5px}body.id-home .id-actions {gap:15px}body.id-home .id-button {padding:14px;font-size:10px}body.id-home .id-text-link {font-size:10px}body.id-home .id-mini-section h3 {font-size:25px}body.id-home .id-file-header {font-size:9px;padding:16px}body.id-home .id-file-tree small {font-size:8px}body.id-home .id-file-footer i {width:100%;margin:4px 0 0}}
@media(prefers-reduced-motion:reduce){body.id-home *,body.id-home *::before,body.id-home *::after {animation:none!important;transition:none!important;scroll-behavior:auto!important}}
body.id-home .id-app-center,body.id-home .id-app-canvas {min-height:0}
body.id-home .id-app-body {grid-template-rows:minmax(0,1fr)}
body.id-home .id-style-panel {min-height:0;overflow:hidden}