:root {
      --brand: 16 185 129;
      --brand-dark: 5 150 105;
      --surface: 248 250 252;
      --ink: 15 23 42;
    }
    html { scroll-behavior: smooth; }
    .public-site-root {
      font-family: 'Assistant', sans-serif;
      background-color: #f8fafc;
      color: #0f172a;
      overflow-x: hidden;
    }
    .gradient-text { background: linear-gradient(135deg, #059669, #3b82f6); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
    .ai-gradient-text { background: linear-gradient(135deg, #8b5cf6, #d946ef); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
    .hero-bg { background: radial-gradient(circle at top right, rgba(16, 185, 129, 0.08) 0%, rgba(248, 250, 252, 1) 50%); }
    .ai-bg { background: radial-gradient(circle at center, #1e1b4b 0%, #0f172a 100%); }
    .glass-card { background: rgba(255,255,255,0.72); backdrop-filter: blur(14px); border: 1px solid rgba(226,232,240,0.8); }
    .section-label { letter-spacing: 0.1em; }
    .printscreen-container {
      box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25), 0 0 0 1px rgba(15, 23, 42, 0.05);
      background: white;
      border-radius: 1.25rem;
      border: 6px solid #1e293b;
      position: relative;
      width: 100%;
      max-width: 100%;
      min-width: 0;
      box-sizing: border-box;
    }
    .hidden-scroll::-webkit-scrollbar { width: 0; height: 0; display: none; }
    .hidden-scroll { -ms-overflow-style: none; scrollbar-width: none; }
    .sys-glass { backdrop-filter: blur(10px); background: rgba(255,255,255,.8); }
    .sys-panel-shadow { box-shadow: 0 12px 32px rgba(15, 23, 42, .08); }
    .sys-soft-shadow { box-shadow: 0 6px 18px rgba(15, 23, 42, .05); }
    .sys-sidebar-link.sys-active {
      background: linear-gradient(135deg, rgb(var(--brand)), rgb(var(--brand-dark)));
      color: white; box-shadow: 0 10px 24px rgba(16, 185, 129, .2);
    }
    .sys-badge { display: inline-flex; align-items: center; gap: .35rem; padding: .3rem .75rem; border-radius: 999px; font-size: .75rem; font-weight: 800; white-space: nowrap; }
    .sys-status-draft { background: #e2e8f0; color: #475569; }
    .sys-status-pending { background: #ffedd5; color: #c2410c; }
    .sys-status-approved { background: #dcfce7; color: #166534; }
    .sys-step-queued { background: #e0e7ff; color: #4338ca; }
    .sys-timeline { position: relative; padding-right: 1.25rem; }
    .sys-timeline::before { content: ""; position: absolute; top: .5rem; bottom: .5rem; right: .45rem; width: 2px; background: #e2e8f0; border-radius: 99px; }
    .sys-timeline-item { position: relative; padding-right: 1.3rem; }
    .sys-timeline-dot { position: absolute; right: .12rem; top: .38rem; width: .75rem; height: .75rem; border-radius: 999px; border: 2px solid white; box-shadow: 0 0 0 2px #e2e8f0; background: #94a3b8; }
    .sys-timeline-dot.sys-step-approved { background: #10b981; box-shadow: 0 0 0 2px #d1fae5; }
    .sys-timeline-dot.sys-step-pending { background: #f97316; box-shadow: 0 0 0 2px #ffedd5; }
    .sys-timeline-dot.sys-step-queued { background: #6366f1; box-shadow: 0 0 0 2px #e0e7ff; }
html, body {
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
}
body {
  font-family: 'Assistant', sans-serif;
}
.public-site-root {
  width: 100%;
  max-width: 100%;
}
main {
  width: 100%;
  max-width: 100%;
}

/* CMS menu — desktop header */
#menu .menu-list,
.desktop-menu .menu-list {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: wrap;
  gap: 2rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

#menu .menu-item,
.desktop-menu .menu-item {
  margin: 0;
  padding: 0;
}

#menu .menu-item > a,
.desktop-menu .menu-item > a {
  font-weight: 700;
  color: rgb(71 85 105);
  text-decoration: none;
  transition: color 0.15s ease;
  white-space: nowrap;
}

#menu .menu-item > a:hover,
.desktop-menu .menu-item > a:hover {
  color: rgb(5 150 105);
}

#menu .menu-item-active > a,
#menu .menu-item > a.is-active {
  color: rgb(5 150 105);
}

#menu .submenu {
  display: none;
}

/* CMS menu — mobile panel */
#mobileNavPanel .menu-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 0;
  width: 100%;
}

#mobileNavPanel .menu-item > a {
  display: block;
  font-weight: 700;
  color: rgb(51 65 85);
  font-size: 1.125rem;
  border-bottom: 1px solid rgb(241 245 249);
  padding-bottom: 0.5rem;
  margin-bottom: 0.5rem;
  text-decoration: none;
}

#mobileNavPanel .submenu {
  display: none;
}