/* ipw-theme:start */
/* ipw-design-system: mky-print-station */

:root {
  color-scheme: light;

  /* ---- core colour roles ---- */
  --ipw-color-bg: #eceef1;
  --ipw-color-surface: #ffffff;
  --ipw-color-text: #12141a;
  --ipw-color-muted: #5b6270;
  --ipw-color-border: #d2d7df;
  --ipw-color-primary: #15181f;
  --ipw-color-secondary: #2b3140;
  --ipw-color-accent: #00798f;
  --ipw-color-success: #1d7a4d;
  --ipw-color-warning: #a86400;
  --ipw-color-danger: #ac1f3c;
  --ipw-color-on-primary: #ffffff;
  --ipw-color-primary-soft: #e6e9ef;

  /* ---- page background system ---- */
  --ipw-bg-color: #eceef1;
  --ipw-bg-decoration-opacity: 0.6;
  --ipw-bg-gradient:
    radial-gradient(1100px 560px at 10% -12%, rgb(0 160 198 / 0.18), transparent 62%),
    radial-gradient(900px 520px at 94% 2%, rgb(210 31 107 / 0.1), transparent 64%),
    linear-gradient(180deg, #f5f7f9 0%, #e8eaee 100%);
  --ipw-bg-image: none;
  --ipw-bg-overlay: rgb(14 16 22 / 0.46);

  /* ---- CMYK ink system (indicators only) ---- */
  --ipw-ink-cyan: #00a0c6;
  --ipw-ink-magenta: #d21f6b;
  --ipw-ink-yellow: #f0b429;
  --ipw-ink-key: #12141a;
  --ipw-cmyk-registration: conic-gradient(
    from 210deg,
    var(--ipw-ink-cyan) 0deg 90deg,
    var(--ipw-ink-magenta) 90deg 180deg,
    var(--ipw-ink-yellow) 180deg 270deg,
    var(--ipw-ink-cyan) 270deg 360deg
  );

  /* ---- typography ---- */
  --ipw-font-display: "Segoe UI Variable Display", "Segoe UI", Inter, system-ui,
    -apple-system, "Helvetica Neue", Arial, sans-serif;
  --ipw-font-body: "Segoe UI Variable Text", "Segoe UI", Inter, system-ui,
    -apple-system, "Helvetica Neue", Arial, sans-serif;
  --ipw-font-mono: "Cascadia Mono", "SF Mono", Consolas, ui-monospace, "Liberation Mono", monospace;
  --ipw-type-scale: 1;
  --ipw-body-line-height: 1.62;
  --ipw-ui-font-size: 13px;
  --ipw-label-font-size: 11px;
  --ipw-micro-font-size: 10px;
  --ipw-h1-size: clamp(2.25rem, 1.35rem + 3.4vw, 4.25rem);
  --ipw-h2-size: clamp(1.6rem, 1.1rem + 1.9vw, 2.6rem);
  --ipw-h3-size: clamp(1.15rem, 0.95rem + 0.7vw, 1.6rem);
  --ipw-tracking-label: 0.14em;
  --ipw-tracking-display: -0.02em;

  /* ---- layout & spacing (8px system) ---- */
  --ipw-content-width: 1320px;
  --ipw-page-padding: 24px;
  --ipw-section-space: 80px;
  --ipw-unit: 8px;
  --ipw-space-8: 8px;
  --ipw-space-16: 16px;
  --ipw-space-24: 24px;
  --ipw-space-32: 32px;
  --ipw-space-40: 40px;
  --ipw-space-48: 48px;
  --ipw-space-64: 64px;
  --ipw-space-80: 80px;
  --ipw-space-96: 96px;

  /* ---- surfaces, glass, panels ---- */
  --ipw-card-bg: var(--ipw-color-surface);
  --ipw-card-border: var(--ipw-color-border);
  --ipw-card-radius: 12px;
  --ipw-card-shadow: 0 1px 2px rgb(16 20 28 / 6%), 0 14px 30px -20px rgb(16 20 28 / 30%);
  --ipw-card-blur: 16px;
  --ipw-button-radius: 10px;
  --ipw-radius-sm: 6px;
  --ipw-radius-md: 10px;
  --ipw-radius-lg: 16px;
  --ipw-radius-pill: 999px;
  --ipw-panel-bg: var(--ipw-color-surface);
  --ipw-panel-border: var(--ipw-color-border);
  --ipw-panel-shadow: 0 1px 2px rgb(16 20 28 / 5%), 0 18px 40px -26px rgb(16 20 28 / 42%);
  --ipw-glass-bg: rgb(255 255 255 / 0.72);
  --ipw-glass-border: rgb(16 20 28 / 0.1);
  --ipw-shadow-artboard: 0 1px 1px rgb(16 20 28 / 5%), 0 2px 6px rgb(16 20 28 / 5%),
    0 26px 54px -30px rgb(16 20 28 / 45%);
  --ipw-shadow-float: 0 2px 6px rgb(16 20 28 / 8%), 0 30px 60px -30px rgb(16 20 28 / 50%);

  /* ---- canvas / print production detail ---- */
  --ipw-canvas-bg: #e4e7eb;
  --ipw-grid-line: rgb(18 20 26 / 0.06);
  --ipw-grid-line-strong: rgb(18 20 26 / 0.11);
  --ipw-ruler-fg: #656c7a;
  --ipw-ruler-bg: var(--ipw-panel-bg);
  --ipw-ruler-tick: rgb(18 20 26 / 0.16);
  --ipw-hairline: rgb(18 20 26 / 0.12);
  --ipw-ink-label: var(--ipw-color-muted);
  --ipw-node-stroke: var(--ipw-color-accent);
  --ipw-node-fill: var(--ipw-color-surface);
  --ipw-focus-ring: 0 0 0 2px var(--ipw-color-surface), 0 0 0 4px var(--ipw-color-accent);
  --ipw-selection: rgb(0 121 143 / 0.14);

  /* ---- motion ---- */
  --ipw-motion-style: "crisp";
  --ipw-motion-duration: 190ms;
  --ipw-motion-distance: 4px;
  --ipw-motion-ease: cubic-bezier(0.2, 0.7, 0.3, 1);
  --ipw-motion-duration-fast: 140ms;
  --ipw-motion-duration-slow: 320ms;
}

/* ---- explicit dark workspace ---- */
[data-theme="dark"] {
  color-scheme: dark;

  --ipw-color-bg: #0d0f14;
  --ipw-color-surface: #171a21;
  --ipw-color-text: #eef1f6;
  --ipw-color-muted: #99a1b1;
  --ipw-color-border: #2b313d;
  --ipw-color-primary: #eef1f6;
  --ipw-color-secondary: #c7cfdc;
  --ipw-color-accent: #3fc6e4;
  --ipw-color-success: #46c98a;
  --ipw-color-warning: #e6a33a;
  --ipw-color-danger: #f2668a;
  --ipw-color-on-primary: #0d0f14;
  --ipw-color-primary-soft: #1f242e;

  --ipw-bg-color: #0d0f14;
  --ipw-bg-decoration-opacity: 0.5;
  --ipw-bg-gradient:
    radial-gradient(1100px 560px at 8% -12%, rgb(63 198 228 / 0.16), transparent 62%),
    radial-gradient(900px 520px at 96% 0%, rgb(240 180 41 / 0.1), transparent 64%),
    linear-gradient(180deg, #14171d 0%, #0b0d11 100%);
  --ipw-bg-overlay: rgb(4 6 10 / 0.66);

  --ipw-ink-cyan: #35c3e0;
  --ipw-ink-magenta: #f0578f;
  --ipw-ink-yellow: #f4c455;
  --ipw-ink-key: #eef1f6;

  --ipw-card-bg: var(--ipw-color-surface);
  --ipw-card-border: var(--ipw-color-border);
  --ipw-card-shadow: 0 1px 2px rgb(0 0 0 / 40%), 0 16px 34px -22px rgb(0 0 0 / 80%);
  --ipw-panel-bg: #14171e;
  --ipw-panel-border: var(--ipw-color-border);
  --ipw-panel-shadow: 0 1px 2px rgb(0 0 0 / 45%), 0 22px 48px -26px rgb(0 0 0 / 85%);
  --ipw-glass-bg: rgb(20 23 30 / 0.74);
  --ipw-glass-border: rgb(238 241 246 / 0.1);
  --ipw-shadow-artboard: 0 1px 1px rgb(0 0 0 / 50%), 0 2px 8px rgb(0 0 0 / 40%),
    0 30px 60px -30px rgb(0 0 0 / 90%);
  --ipw-shadow-float: 0 2px 8px rgb(0 0 0 / 50%), 0 34px 68px -30px rgb(0 0 0 / 95%);

  --ipw-canvas-bg: #0a0c10;
  --ipw-grid-line: rgb(238 241 246 / 0.05);
  --ipw-grid-line-strong: rgb(238 241 246 / 0.1);
  --ipw-ruler-fg: #8b93a3;
  --ipw-ruler-bg: #12151b;
  --ipw-ruler-tick: rgb(238 241 246 / 0.18);
  --ipw-hairline: rgb(238 241 246 / 0.14);
  --ipw-ink-label: var(--ipw-color-muted);
  --ipw-node-stroke: var(--ipw-color-accent);
  --ipw-node-fill: #10131a;
  --ipw-focus-ring: 0 0 0 2px var(--ipw-color-bg), 0 0 0 4px var(--ipw-color-accent);
  --ipw-selection: rgb(63 198 228 / 0.16);
}

/* ---- follow the operating system when the visitor picks "System" ---- */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;

    --ipw-color-bg: #0d0f14;
    --ipw-color-surface: #171a21;
    --ipw-color-text: #eef1f6;
    --ipw-color-muted: #99a1b1;
    --ipw-color-border: #2b313d;
    --ipw-color-primary: #eef1f6;
    --ipw-color-secondary: #c7cfdc;
    --ipw-color-accent: #3fc6e4;
    --ipw-color-success: #46c98a;
    --ipw-color-warning: #e6a33a;
    --ipw-color-danger: #f2668a;
    --ipw-color-on-primary: #0d0f14;
    --ipw-color-primary-soft: #1f242e;

    --ipw-bg-color: #0d0f14;
    --ipw-bg-decoration-opacity: 0.5;
    --ipw-bg-gradient:
      radial-gradient(1100px 560px at 8% -12%, rgb(63 198 228 / 0.16), transparent 62%),
      radial-gradient(900px 520px at 96% 0%, rgb(240 180 41 / 0.1), transparent 64%),
      linear-gradient(180deg, #14171d 0%, #0b0d11 100%);
    --ipw-bg-overlay: rgb(4 6 10 / 0.66);

    --ipw-ink-cyan: #35c3e0;
    --ipw-ink-magenta: #f0578f;
    --ipw-ink-yellow: #f4c455;
    --ipw-ink-key: #eef1f6;

    --ipw-card-shadow: 0 1px 2px rgb(0 0 0 / 40%), 0 16px 34px -22px rgb(0 0 0 / 80%);
    --ipw-panel-bg: #14171e;
    --ipw-panel-shadow: 0 1px 2px rgb(0 0 0 / 45%), 0 22px 48px -26px rgb(0 0 0 / 85%);
    --ipw-glass-bg: rgb(20 23 30 / 0.74);
    --ipw-glass-border: rgb(238 241 246 / 0.1);
    --ipw-shadow-artboard: 0 1px 1px rgb(0 0 0 / 50%), 0 2px 8px rgb(0 0 0 / 40%),
      0 30px 60px -30px rgb(0 0 0 / 90%);
    --ipw-shadow-float: 0 2px 8px rgb(0 0 0 / 50%), 0 34px 68px -30px rgb(0 0 0 / 95%);

    --ipw-canvas-bg: #0a0c10;
    --ipw-grid-line: rgb(238 241 246 / 0.05);
    --ipw-grid-line-strong: rgb(238 241 246 / 0.1);
    --ipw-ruler-fg: #8b93a3;
    --ipw-ruler-bg: #12151b;
    --ipw-ruler-tick: rgb(238 241 246 / 0.18);
    --ipw-hairline: rgb(238 241 246 / 0.14);
    --ipw-node-fill: #10131a;
    --ipw-focus-ring: 0 0 0 2px var(--ipw-color-bg), 0 0 0 4px var(--ipw-color-accent);
    --ipw-selection: rgb(63 198 228 / 0.16);
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --ipw-motion-duration: 1ms;
    --ipw-motion-duration-fast: 1ms;
    --ipw-motion-duration-slow: 1ms;
  }
}

/* ipw-theme:end */