:root {
  --ink: #07142d;
  --muted: #65718a;
  --subtle: #8c96ad;
  --line: #e7eaf2;
  --panel: #ffffff;
  --soft: #f6f7fb;
  --nav: #06172f;
  --nav-2: #0a2140;
  --violet: #5b2df2;
  --violet-2: #7a5cff;
  --violet-soft: #f0ebff;
  --blue: #3584ff;
  --green: #21b461;
  --orange: #ff8a2a;
  --red: #ef3b46;
  --beige: #e8ded2;
  --radius: 16px;
  --shadow: 0 20px 60px rgba(15, 23, 42, .08);
  --font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html, body { min-height: 100%; }
body {
  margin: 0;
  font-family: var(--font);
  background: var(--soft);
  color: var(--ink);
  letter-spacing: 0;
  font-size: 13px;
  overflow-x: hidden;
}
button, input, select { font: inherit; }
button { cursor: pointer; }
a { color: var(--violet); text-decoration: none; font-weight: 700; }
.hidden { display: none !important; }

.brand-mark {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #fff;
  box-shadow: 0 14px 34px rgba(16, 84, 224, .22);
  overflow: hidden;
}
.brand-mark img { width: 100%; height: 100%; object-fit: cover; display: block; }
.brand-row { display: flex; align-items: center; gap: 12px; font-size: 17px; color: white; }
.brand-row.compact { color: var(--ink); font-size: 17px; }
.brand-logo-full {
  width: min(190px, 66%);
  max-height: 76px;
  object-fit: contain;
  object-position: left center;
  display: block;
  margin-bottom: 18px;
}

.icon { width: 20px; height: 20px; stroke: currentColor; stroke-width: 2; fill: none; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.icon-button {
  width: 40px;
  height: 40px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  display: inline-grid;
  place-items: center;
  color: var(--ink);
  position: relative;
}
.icon-button.has-dot::after {
  content: "";
  position: absolute;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--violet);
  top: 10px;
  right: 11px;
}
#notificationBellCount {
  position: absolute;
  right: -6px;
  top: -6px;
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  border-radius: 999px;
  background: var(--violet);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 18px;
  text-align: center;
}
#notificationBellCount.hidden {
  display: none;
}
.primary, .secondary, .chip-button {
  min-height: 40px;
  border-radius: 12px;
  border: 1px solid transparent;
  padding: 0 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-weight: 800;
  white-space: nowrap;
}
.primary { background: var(--violet); color: #fff; box-shadow: 0 12px 26px rgba(91,45,242,.22); }
.primary.dark { background: var(--ink); box-shadow: none; }
.secondary { background: #fff; color: var(--ink); border-color: var(--line); }
.secondary.violet { color: var(--violet); border-color: var(--violet-2); }
.secondary.danger { color: var(--red); background: #fff6f6; border-color: #ffdada; }
.chip-button { min-height: 40px; padding: 0 12px; background: #fff; border-color: var(--line); color: var(--ink); }
.chip-button.active { background: var(--violet); color: white; border-color: var(--violet); }
.full { width: 100%; }

.login-view {
  position: relative;
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: clamp(22px, 3vw, 32px);
  background:
    radial-gradient(circle at 50% -10%, rgba(105, 159, 255, .22), transparent 30%),
    radial-gradient(circle at 18% 20%, rgba(32, 107, 255, .18), transparent 28%),
    radial-gradient(circle at 82% 22%, rgba(128, 95, 255, .12), transparent 26%),
    linear-gradient(180deg, #020611 0%, #051126 32%, #030918 100%);
  overflow: hidden;
  isolation: isolate;
}
.login-view::before {
  content: "";
  position: absolute;
  inset: -14%;
  background:
    radial-gradient(circle at 18% 26%, rgba(89, 153, 255, .38) 0%, rgba(89, 153, 255, .18) 16%, transparent 36%),
    radial-gradient(circle at 74% 24%, rgba(132, 95, 255, .32) 0%, rgba(132, 95, 255, .16) 18%, transparent 38%),
    radial-gradient(circle at 56% 72%, rgba(75, 227, 255, .22) 0%, rgba(75, 227, 255, .08) 14%, transparent 30%);
  filter: blur(44px);
  opacity: .95;
  animation: loginCosmos 30s ease-in-out infinite alternate;
  pointer-events: none;
}
.login-view::after {
  content: "";
  position: absolute;
  inset: -8%;
  background:
    linear-gradient(110deg, transparent 0%, rgba(106, 158, 255, .14) 24%, transparent 42%),
    linear-gradient(250deg, transparent 4%, rgba(132, 95, 255, .12) 30%, transparent 54%),
    linear-gradient(180deg, transparent 0%, rgba(73, 110, 255, .08) 40%, transparent 72%);
  filter: blur(38px);
  opacity: .72;
  animation: loginSweepField 24s ease-in-out infinite;
  pointer-events: none;
}
.login-hero {
  position: absolute;
  inset: 0;
  overflow: hidden;
  padding: clamp(28px, 4.2vw, 56px);
  background:
    radial-gradient(circle at 14% 16%, rgba(85, 151, 255, .26), transparent 20%),
    radial-gradient(circle at 84% 12%, rgba(140, 95, 255, .3), transparent 20%),
    radial-gradient(circle at 72% 70%, rgba(51, 191, 255, .14), transparent 24%),
    radial-gradient(circle at 36% 56%, rgba(87, 95, 255, .15), transparent 26%),
    linear-gradient(90deg, rgba(49, 87, 255, .08) 0%, rgba(49, 87, 255, 0) 22%, rgba(129, 86, 255, 0) 72%, rgba(129, 86, 255, .08) 100%),
    linear-gradient(130deg, #020712 0%, #06142d 28%, #081d3f 58%, #140c34 100%);
}
.login-hero::before {
  content: "";
  position: absolute;
  inset: -16%;
  background:
    radial-gradient(circle at 28% 34%, rgba(108, 91, 255, .28), transparent 20%),
    radial-gradient(circle at 70% 24%, rgba(59, 172, 255, .2), transparent 18%),
    radial-gradient(circle at 54% 66%, rgba(136, 97, 255, .18), transparent 20%),
    radial-gradient(circle at 84% 64%, rgba(80, 239, 255, .12), transparent 16%);
  filter: blur(40px);
  opacity: 1;
  animation: loginDrift 28s ease-in-out infinite alternate;
}
.login-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(3, 8, 20, .06), rgba(3, 8, 20, .38)),
    radial-gradient(circle at center, transparent 40%, rgba(1, 5, 15, .54) 100%);
  pointer-events: none;
}
.login-galaxy,
.login-galaxy > span {
  position: absolute;
  inset: 0;
  display: block;
  pointer-events: none;
}
.login-galaxy {
  inset: -18%;
}
.login-galaxy::before,
.login-galaxy::after {
  content: "";
  position: absolute;
  inset: -10% auto -12% auto;
  width: 28vw;
  min-width: 220px;
  max-width: 420px;
  border-radius: 999px;
  filter: blur(34px);
  opacity: .88;
  animation: loginColumn 16s ease-in-out infinite alternate;
}
.login-galaxy::before {
  left: 10%;
  background:
    linear-gradient(180deg, rgba(118, 165, 255, .2), rgba(118, 165, 255, .04) 42%, rgba(118, 165, 255, 0));
}
.login-galaxy::after {
  right: 8%;
  background:
    linear-gradient(180deg, rgba(142, 104, 255, .18), rgba(142, 104, 255, .04) 42%, rgba(142, 104, 255, 0));
  animation-duration: 20s;
  animation-direction: alternate-reverse;
}
.login-nebula {
  border-radius: 50%;
  filter: blur(48px);
  mix-blend-mode: screen;
  opacity: .96;
}
.nebula-a {
  inset: 8% auto auto 4%;
  width: 52vw;
  height: 52vw;
  max-width: 760px;
  max-height: 760px;
  background:
    radial-gradient(circle at 36% 34%, rgba(104, 191, 255, .96) 0%, rgba(50, 120, 255, .52) 30%, rgba(20, 49, 145, .22) 52%, transparent 74%);
  animation: loginPulse 26s ease-in-out infinite;
}
.nebula-b {
  inset: auto -2% -2% auto;
  width: 46vw;
  height: 46vw;
  max-width: 660px;
  max-height: 660px;
  background:
    radial-gradient(circle at 54% 46%, rgba(154, 105, 255, .82) 0%, rgba(83, 44, 171, .3) 36%, transparent 76%);
  animation: loginPulse 20s ease-in-out infinite reverse;
}
.nebula-c {
  inset: 24% auto auto 34%;
  width: 34vw;
  height: 34vw;
  max-width: 480px;
  max-height: 480px;
  background:
    radial-gradient(circle at 50% 50%, rgba(99, 239, 255, .48) 0%, rgba(85, 235, 255, .16) 34%, transparent 72%);
  animation: loginFloat 24s ease-in-out infinite;
}
.nebula-d {
  inset: 48% auto auto 58%;
  width: 26vw;
  height: 26vw;
  max-width: 360px;
  max-height: 360px;
  background:
    radial-gradient(circle at 50% 50%, rgba(117, 102, 255, .32) 0%, rgba(63, 100, 255, .08) 42%, transparent 74%);
  animation: loginPulse 18s ease-in-out infinite alternate;
}
.login-aurora {
  filter: blur(24px);
  opacity: .62;
  mix-blend-mode: screen;
}
.aurora-a {
  inset: 6% auto auto 42%;
  width: 48vw;
  height: 18vw;
  max-width: 760px;
  max-height: 240px;
  border-radius: 999px;
  background:
    linear-gradient(90deg, rgba(75, 155, 255, 0), rgba(75, 155, 255, .34), rgba(122, 92, 255, .32), rgba(118, 255, 247, 0));
  transform: rotate(-8deg);
  animation: loginSweep 24s ease-in-out infinite;
}
.aurora-b {
  inset: auto auto 10% 12%;
  width: 42vw;
  height: 16vw;
  max-width: 620px;
  max-height: 220px;
  border-radius: 999px;
  background:
    linear-gradient(90deg, rgba(127, 103, 255, 0), rgba(127, 103, 255, .26), rgba(67, 196, 255, .24), rgba(127, 103, 255, 0));
  transform: rotate(14deg);
  animation: loginSweep 28s ease-in-out infinite reverse;
}
.login-dust {
  opacity: .32;
  mix-blend-mode: screen;
}
.dust-a,
.dust-b {
  background-image:
    radial-gradient(circle at 8% 18%, rgba(255,255,255,.8) 0 1px, transparent 2px),
    radial-gradient(circle at 17% 68%, rgba(125, 213, 255, .72) 0 1px, transparent 2px),
    radial-gradient(circle at 28% 26%, rgba(255,255,255,.66) 0 1px, transparent 2px),
    radial-gradient(circle at 42% 58%, rgba(215, 229, 255, .54) 0 1px, transparent 2px),
    radial-gradient(circle at 58% 22%, rgba(176, 154, 255, .7) 0 1px, transparent 2px),
    radial-gradient(circle at 73% 74%, rgba(255,255,255,.64) 0 1px, transparent 2px),
    radial-gradient(circle at 86% 38%, rgba(133, 233, 255, .68) 0 1px, transparent 2px),
    radial-gradient(circle at 92% 84%, rgba(255,255,255,.42) 0 1px, transparent 2px);
}
.dust-a {
  animation: loginDust 30s linear infinite;
}
.dust-b {
  transform: scale(1.15);
  opacity: .18;
  animation: loginDust 46s linear infinite reverse;
}
.login-ring {
  border-radius: 50%;
  border: 1px solid rgba(173, 201, 255, .08);
  box-shadow: inset 0 0 80px rgba(119, 147, 255, .04), 0 0 80px rgba(86, 122, 255, .05);
}
.ring-a {
  inset: 2% auto auto 56%;
  width: 34vw;
  height: 34vw;
  max-width: 460px;
  max-height: 460px;
  animation: loginRotate 44s linear infinite;
}
.ring-b {
  inset: auto auto 2% 8%;
  width: 26vw;
  height: 26vw;
  max-width: 360px;
  max-height: 360px;
  animation: loginRotate 52s linear infinite reverse;
}
.login-starfield {
  background-image:
    radial-gradient(circle at 12% 18%, rgba(255,255,255,.92) 0 1px, transparent 1.8px),
    radial-gradient(circle at 24% 72%, rgba(148, 211, 255, .82) 0 1px, transparent 2px),
    radial-gradient(circle at 38% 30%, rgba(255,255,255,.78) 0 1px, transparent 1.8px),
    radial-gradient(circle at 52% 56%, rgba(199, 226, 255, .72) 0 1px, transparent 2px),
    radial-gradient(circle at 66% 18%, rgba(196, 160, 255, .8) 0 1px, transparent 2px),
    radial-gradient(circle at 78% 76%, rgba(255,255,255,.75) 0 1px, transparent 2px),
    radial-gradient(circle at 88% 34%, rgba(133, 233, 255, .74) 0 1px, transparent 2px);
  opacity: .58;
}
.starfield-a {
  animation: loginDrift 28s linear infinite, loginTwinkle 8s ease-in-out infinite;
}
.starfield-b {
  transform: scale(1.28);
  opacity: .24;
  animation: loginDrift 38s linear infinite reverse, loginTwinkle 10s ease-in-out infinite reverse;
}
.login-comet {
  opacity: .7;
  filter: blur(.2px);
}
.comet-a,
.comet-b {
  width: 220px;
  height: 2px;
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(169, 221, 255, .9), rgba(92, 145, 255, 0));
  box-shadow: 0 0 18px rgba(135, 203, 255, .4);
  transform-origin: left center;
}
.comet-a {
  inset: 24% auto auto 70%;
  transform: rotate(18deg);
  animation: loginComet 18s ease-in-out infinite;
}
.comet-b {
  inset: 70% auto auto 14%;
  transform: rotate(-12deg);
  opacity: .46;
  animation: loginComet 22s ease-in-out infinite 6s;
}
.brand-row { display: none; }
.hero-copy {
  display: none;
}
.eyebrow {
  display: inline-flex;
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(160, 197, 255, .18);
  color: #f4f8ff;
  font-weight: 700;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 0 34px rgba(93, 120, 255, .08);
}
.hero-copy h1 {
  font-family: "Space Grotesk", var(--font);
  font-size: clamp(34px, 4vw, 58px);
  line-height: 1.02;
  margin: 22px 0 14px;
  letter-spacing: -.04em;
}
.hero-copy h1 span {
  color: #afd4ff;
  display: block;
}
.hero-copy p {
  color: rgba(222, 233, 248, .84);
  font-size: 15px;
  line-height: 1.75;
  max-width: 490px;
  text-shadow: 0 8px 24px rgba(3, 8, 20, .32);
}
.hero-points {
  display: none;
}
.hero-points article { display: grid; grid-template-columns: 46px 1fr; gap: 14px; align-items: center; }
.hero-points article > span {
  width: 46px;
  height: 46px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: linear-gradient(180deg, rgba(112, 88, 255, .26), rgba(61, 149, 255, .18));
  border: 1px solid rgba(179, 207, 255, .12);
  color: #b8cdff;
  box-shadow: 0 18px 32px rgba(7, 18, 49, .22);
}
.hero-points strong {
  font-size: 14px;
  letter-spacing: .01em;
}
.hero-points small {
  color: rgba(201, 208, 226, .78);
  display: block;
  margin-top: 5px;
  line-height: 1.6;
}
.login-proof {
  display: none;
}
.login-proof span { color: white; display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-width: 0; }
.login-proof b { white-space: nowrap; }
.login-proof i { display: inline-grid; place-items: center; color: white; }
.dashboard-ghost {
  display: none;
}
.ghost-card,
.ghost-chart,
.ghost-donut,
.ghost-pill,
.ghost-ticker,
.ghost-orbit {
  border-radius: 20px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.08);
}
.ghost-pill {
  grid-column: span 2;
  min-height: 52px;
}
.ghost-orbit {
  position: absolute;
  inset: 34px 34px auto auto;
  width: 84px;
  height: 84px;
  border-radius: 50%;
  background: transparent;
  border-color: rgba(153, 183, 255, .14);
}
.ghost-card { min-height: 72px; }
.ghost-chart {
  grid-column: span 2;
  grid-row: span 2;
  background: linear-gradient(180deg, rgba(113,83,255,.22), rgba(113,83,255,.03));
}
.ghost-donut {
  grid-row: span 2;
  border-radius: 28px;
}
.ghost-ticker {
  grid-column: span 3;
  min-height: 46px;
}
.login-panel-wrap {
  position: relative;
  z-index: 4;
  width: 100%;
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 18px;
}
.login-panel-wrap::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(86vw, 920px);
  height: min(86vw, 920px);
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background:
    radial-gradient(circle, rgba(83, 132, 255, .22) 0%, rgba(83, 132, 255, .08) 30%, rgba(123, 95, 255, .08) 46%, transparent 72%);
  filter: blur(18px);
  opacity: .95;
  pointer-events: none;
}
.login-tools { position: absolute; top: 32px; right: clamp(24px, 4vw, 64px); display: flex; gap: 10px; }
.login-panel-stack {
  width: min(100%, 560px);
  display: grid;
  gap: 16px;
}
.login-card {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(13, 22, 47, .8), rgba(7, 14, 30, .9)),
    radial-gradient(circle at top right, rgba(108, 94, 255, .12), transparent 32%);
  border: 1px solid rgba(176, 206, 255, .18);
  border-radius: 30px;
  box-shadow:
    0 40px 140px rgba(0, 0, 0, .5),
    0 0 90px rgba(48, 95, 255, .12),
    inset 0 1px 0 rgba(255, 255, 255, .08);
  backdrop-filter: blur(30px);
  padding: clamp(28px, 3.6vw, 40px);
  width: min(100%, 520px);
  justify-self: center;
  color: #edf4ff;
}
.login-card::before {
  content: "";
  position: absolute;
  inset: -30% auto auto 42%;
  width: 280px;
  height: 280px;
  border-radius: 50%;
  background:
    radial-gradient(circle, rgba(108, 94, 255, .22), transparent 64%);
  filter: blur(16px);
  pointer-events: none;
}
.login-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background:
    linear-gradient(135deg, rgba(255,255,255,.08), transparent 18%, transparent 80%, rgba(133, 186, 255, .06));
  pointer-events: none;
}
.login-card-top,
.login-card label,
.login-card .form-row,
.login-card .divider,
.login-card .split-actions,
.login-card .login-note {
  position: relative;
  z-index: 1;
}
.login-card-top {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
  align-items: start;
  justify-items: center;
  text-align: center;
  margin-bottom: 18px;
}
.login-card-mark {
  width: 66px;
  height: 66px;
  box-shadow: 0 18px 44px rgba(27, 119, 255, .24), 0 0 36px rgba(98, 127, 255, .18);
}
.login-card-kicker {
  display: inline-flex;
  margin-bottom: 10px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: #95b8ff;
}
.login-card h2 {
  font-family: "Space Grotesk", var(--font);
  font-size: clamp(30px, 4vw, 38px);
  letter-spacing: -.03em;
  margin: 0 0 8px;
}
.login-card p {
  color: rgba(212, 224, 244, .76);
  margin: 0 0 22px;
  font-size: 14px;
  line-height: 1.7;
  max-width: 360px;
}
.login-card label {
  display: grid;
  gap: 8px;
  font-weight: 700;
  margin-top: 16px;
  color: #e7f0ff;
}
.input {
  width: 100%;
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 0 14px;
  background: #fff;
  color: var(--ink);
  outline: none;
}
.input::placeholder {
  color: #8f9ab2;
}
.input:focus {
  border-color: rgba(91,45,242,.56);
  box-shadow: 0 0 0 4px rgba(91,45,242,.10);
}
.login-card input {
  width: 100%;
  height: 48px;
  border: 1px solid rgba(166, 194, 240, .18);
  border-radius: 16px;
  padding: 0 15px;
  background: rgba(9, 19, 40, .78);
  color: #f4f7ff;
  outline: none;
}
.login-card input::placeholder {
  color: rgba(197, 213, 239, .42);
}
.login-card input:focus {
  border-color: rgba(134, 174, 255, .72);
  box-shadow: 0 0 0 4px rgba(91,45,242,.16);
}
.input.strong { height: 44px; border-color: var(--violet); }
.input.invalid { border-color: #ff9c9c; background: #fff6f6; }
.form-row, .split-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.form-row { margin: 18px 0; }
.check { display: flex !important; grid-template-columns: auto 1fr; align-items: center; gap: 10px !important; margin: 0 !important; color: rgba(198, 214, 236, .72); }
.check.compact { white-space: nowrap; }
.check input { width: 17px; height: 17px; accent-color: var(--violet); }
.login-card .form-row a,
.login-note a {
  color: #aecdff;
}
.login-submit {
  min-height: 50px;
  background: linear-gradient(135deg, #4f7fff 0%, #7358ff 54%, #8d5fff 100%);
  box-shadow: 0 22px 44px rgba(80, 104, 255, .32);
}
.divider {
  display: flex;
  align-items: center;
  gap: 12px;
  color: rgba(169, 187, 216, .64);
  margin: 24px 0 18px;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .12em;
}
.divider::before, .divider::after { content: ""; height: 1px; background: rgba(164, 188, 228, .14); flex: 1; }
.split-actions .secondary {
  flex: 1;
  min-height: 46px;
  background: rgba(10, 21, 42, .72);
  border-color: rgba(163, 192, 238, .16);
  color: #eff5ff;
}
.info-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
.info-grid span { border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; background: white; color: var(--muted); display: flex; flex-direction: column; gap: 6px; font-size: 13px; }
.info-grid b { color: var(--ink); font-size: 16px; }
.selected-row { background: rgba(91, 45, 242, 0.08); }
.login-note {
  display: block;
  text-align: center;
  color: rgba(192, 208, 232, .72);
  margin-top: 22px;
  font-size: 13px;
}
.login-platform-strip {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 14px;
  padding: 18px;
  border: 1px solid rgba(176, 206, 255, .16);
  border-radius: 24px;
  background:
    linear-gradient(180deg, rgba(9, 17, 36, .84), rgba(7, 13, 28, .92)),
    radial-gradient(circle at top left, rgba(84, 173, 255, .14), transparent 36%);
  box-shadow: 0 24px 70px rgba(0, 0, 0, .26);
  color: #edf4ff;
}
.login-platform-strip-heading {
  text-align: center;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(216, 231, 255, .92);
}
.login-platform-icon-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}
.login-platform-icon {
  width: 50px;
  height: 50px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, .14);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 14px 30px rgba(0, 0, 0, .28);
  color: white;
}
.login-platform-icon.whatsapp { background: linear-gradient(135deg, #27d768, #0d9f46); }
.login-platform-icon.sms { background: linear-gradient(135deg, #ff9f43, #ff5f6d); }
.login-platform-icon.email { background: linear-gradient(135deg, #5ea8ff, #4b6bff); }
.login-platform-icon.omni { background: linear-gradient(135deg, #7d6bff, #4fd1c5); }
.login-platform-icon.tax { background: linear-gradient(135deg, #f6c453, #ff8a4c); }
.party-form.form-attention {
  animation: partyFormPulse 1.8s ease;
}
@keyframes partyFormPulse {
  0% { box-shadow: 0 0 0 0 rgba(91, 45, 242, .18), 0 18px 40px rgba(26, 50, 96, .08); }
  25% { box-shadow: 0 0 0 8px rgba(91, 45, 242, .08), 0 22px 46px rgba(26, 50, 96, .12); }
  100% { box-shadow: 0 18px 40px rgba(26, 50, 96, .08); }
}
.login-captcha-card {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 14px;
  padding: 16px;
  margin-top: 16px;
  border-radius: 20px;
  border: 1px solid rgba(166, 194, 240, .16);
  background: rgba(7, 18, 38, .62);
}
.login-captcha-kicker {
  display: inline-block;
  margin-bottom: 4px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #95b8ff;
  font-size: 11px;
  font-weight: 800;
}
.login-captcha-card strong {
  display: block;
  font-family: "Space Grotesk", var(--font);
  font-size: 24px;
  margin-bottom: 6px;
}
.login-captcha-card p {
  margin: 0;
  max-width: none;
  color: rgba(212, 224, 244, .72);
}
.login-inline-status {
  position: relative;
  z-index: 1;
  margin-top: 16px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(176, 206, 255, .18);
  background: rgba(10, 21, 42, .72);
  color: #e9f2ff;
  font-size: 13px;
  line-height: 1.5;
}
.login-inline-status.is-error {
  border-color: rgba(255, 156, 156, .28);
  background: rgba(61, 16, 16, .48);
  color: #ffe0e0;
}

@keyframes loginPulse {
  0% { transform: scale(1) translate3d(0, 0, 0); opacity: .72; }
  50% { transform: scale(1.08) translate3d(2%, -2%, 0); opacity: .88; }
  100% { transform: scale(.98) translate3d(-2%, 2%, 0); opacity: .74; }
}

@keyframes loginFloat {
  0% { transform: translate3d(0, 0, 0); }
  50% { transform: translate3d(3%, -4%, 0); }
  100% { transform: translate3d(-2%, 3%, 0); }
}

@keyframes loginDrift {
  0% { transform: translate3d(0, 0, 0) scale(1); }
  100% { transform: translate3d(4%, -3%, 0) scale(1.04); }
}

@keyframes loginCosmos {
  0% { transform: translate3d(-2%, 0, 0) scale(1); }
  50% { transform: translate3d(2%, -2%, 0) scale(1.06); }
  100% { transform: translate3d(-1%, 3%, 0) scale(1.02); }
}

@keyframes loginSweepField {
  0% { transform: translate3d(-6%, 0, 0) scale(1); opacity: .56; }
  50% { transform: translate3d(4%, -2%, 0) scale(1.04); opacity: .82; }
  100% { transform: translate3d(-2%, 3%, 0) scale(1.01); opacity: .6; }
}

@keyframes loginColumn {
  0% { transform: translate3d(0, -2%, 0) scaleY(1); opacity: .32; }
  50% { transform: translate3d(0, 2%, 0) scaleY(1.08); opacity: .58; }
  100% { transform: translate3d(0, -1%, 0) scaleY(.96); opacity: .36; }
}

@keyframes loginDust {
  0% { transform: translate3d(0, 0, 0) scale(1); }
  100% { transform: translate3d(-3%, 2%, 0) scale(1.08); }
}

@keyframes loginSweep {
  0% { transform: rotate(-8deg) translate3d(0, 0, 0) scaleX(1); opacity: .42; }
  50% { transform: rotate(-6deg) translate3d(2%, -4%, 0) scaleX(1.05); opacity: .68; }
  100% { transform: rotate(-10deg) translate3d(-2%, 3%, 0) scaleX(.98); opacity: .4; }
}

@keyframes loginRotate {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

@keyframes loginFloatCard {
  0% { transform: translateY(-50%) perspective(1200px) rotateY(-18deg) rotateX(8deg) rotateZ(8deg) translate3d(0, 0, 0); }
  50% { transform: translateY(calc(-50% - 10px)) perspective(1200px) rotateY(-14deg) rotateX(9deg) rotateZ(6deg) translate3d(0, 0, 0); }
  100% { transform: translateY(-50%) perspective(1200px) rotateY(-18deg) rotateX(8deg) rotateZ(8deg) translate3d(0, 0, 0); }
}

@keyframes loginTwinkle {
  0%, 100% { opacity: .38; }
  50% { opacity: .62; }
}

@keyframes loginComet {
  0%, 72%, 100% { opacity: 0; transform: translate3d(-2%, 0, 0) rotate(18deg) scaleX(.92); }
  12% { opacity: .7; }
  28% { opacity: .15; transform: translate3d(22%, 12%, 0) rotate(18deg) scaleX(1.08); }
}

.blocked-access-view {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 32px 18px;
  background: linear-gradient(180deg, #f7f8fc, #eef2fb);
}
.blocked-access-card {
  width: min(720px, 100%);
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 24px;
  box-shadow: var(--shadow);
  padding: clamp(24px, 3.4vw, 40px);
  display: grid;
  gap: 22px;
}
.blocked-access-copy h1 {
  margin: 14px 0 8px;
  font-size: clamp(28px, 3vw, 38px);
  line-height: 1.08;
}

.analytics-page-head {
  align-items: start;
}

.analytics-filter-panel,
.analytics-support-panel,
.analytics-insight-panel,
.analytics-predictive-panel,
.analytics-drilldown-panel {
  display: grid;
  gap: 18px;
}

.analytics-filter-head,
.analytics-drilldown-summary {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 16px;
}

.analytics-filter-head h2,
.analytics-section-head h2,
.analytics-chart-head h3,
.analytics-support-panel h3,
.analytics-drilldown-summary strong {
  margin: 0;
}

.analytics-filter-head p,
.analytics-section-head p,
.analytics-chart-head p,
.analytics-support-panel p,
.analytics-drilldown-summary small,
.analytics-page-head p {
  margin: 6px 0 0;
  color: var(--muted);
}

.analytics-filter-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.analytics-filter-grid label {
  display: grid;
  gap: 8px;
  font-weight: 700;
}

.analytics-filter-grid label span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
}

.analytics-filter-actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  flex-wrap: wrap;
}

.analytics-executive-shell,
.analytics-section,
.analytics-predictive-panel,
.analytics-drilldown-panel {
  display: grid;
  gap: 18px;
}

.analytics-executive-grid,
.analytics-section-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.analytics-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.analytics-metric-grid,
.analytics-sub-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.analytics-metric-card {
  min-height: 128px;
  text-align: left;
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 16px;
  padding: 16px;
  display: grid;
  gap: 8px;
  box-shadow: 0 14px 30px rgba(15, 23, 42, .05);
}

.analytics-metric-card:disabled,
.analytics-prediction-card:disabled,
.analytics-insight-card:disabled,
.analytics-legend-row:disabled,
.analytics-bar-card:disabled,
.analytics-heatmap-cell:disabled,
.analytics-segment-chip:disabled {
  cursor: default;
}

.analytics-card-button:not(:disabled),
.analytics-insight-card:not(:disabled),
.analytics-prediction-card:not(:disabled),
.analytics-segment-chip:not(:disabled),
.analytics-legend-row:not(:disabled),
.analytics-bar-card:not(:disabled),
.analytics-heatmap-cell:not(:disabled) {
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.analytics-card-button:not(:disabled):hover,
.analytics-insight-card:not(:disabled):hover,
.analytics-prediction-card:not(:disabled):hover,
.analytics-segment-chip:not(:disabled):hover,
.analytics-legend-row:not(:disabled):hover,
.analytics-bar-card:not(:disabled):hover,
.analytics-heatmap-cell:not(:disabled):hover {
  transform: translateY(-1px);
  box-shadow: 0 18px 34px rgba(91, 45, 242, .10);
  border-color: rgba(91, 45, 242, .22);
}

.analytics-metric-card small,
.analytics-prediction-card small {
  color: var(--muted);
  font-weight: 700;
}

.analytics-metric-card b {
  font-size: 28px;
  line-height: 1.05;
}

.analytics-metric-card em {
  color: var(--muted);
  font-style: normal;
  line-height: 1.5;
}

.analytics-metric-delta {
  font-size: 12px;
  font-weight: 800;
}

.analytics-metric-delta.up { color: var(--green); }
.analytics-metric-delta.down { color: var(--red); }

.analytics-chart-card {
  display: grid;
  gap: 14px;
  min-height: 360px;
}

.analytics-chart-head {
  padding-bottom: 6px;
  border-bottom: 1px solid var(--line);
}

.analytics-chart-frame {
  min-height: 260px;
  display: grid;
  align-items: stretch;
}

.analytics-chart {
  display: grid;
  gap: 14px;
  height: 100%;
}

.analytics-svg {
  width: 100%;
  height: auto;
  display: block;
}

.analytics-grid-line {
  stroke: #e8edf8;
  stroke-width: 1;
}

.analytics-axis-label {
  fill: #77839b;
  font-size: 11px;
  font-family: var(--font);
}

.analytics-axis-left {
  text-anchor: end;
}

.analytics-line-stroke {
  fill: none;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.analytics-line-dot {
  stroke: #fff;
  stroke-width: 2.5;
  cursor: pointer;
}

.analytics-chart-legend {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  color: var(--muted);
  font-weight: 700;
  font-size: 12px;
}

.analytics-chart-legend span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.analytics-chart-legend i,
.analytics-legend-swatch {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  display: inline-block;
  flex: none;
}

.analytics-bar-grid {
  min-height: 260px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 12px;
  align-items: end;
}

.analytics-bar-card {
  height: 100%;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, #fcfdff 0%, #f7f8fd 100%);
  border-radius: 16px;
  padding: 14px 12px;
  display: grid;
  gap: 10px;
  text-align: left;
}

.analytics-bar-track {
  height: 150px;
  border-radius: 14px;
  background: #eef2fb;
  display: flex;
  align-items: end;
  justify-content: center;
  padding: 8px;
}

.analytics-bar-fill {
  width: 100%;
  border-radius: 12px 12px 6px 6px;
  display: block;
}

.analytics-bar-card strong,
.analytics-legend-row strong,
.analytics-prediction-card strong {
  font-size: 16px;
}

.analytics-bar-card em,
.analytics-legend-row small,
.analytics-prediction-card p,
.analytics-insight-card p,
.analytics-insight-card small {
  color: var(--muted);
  font-style: normal;
}

.analytics-donut-chart {
  grid-template-columns: minmax(200px, 240px) minmax(0, 1fr);
  display: grid;
  gap: 18px;
  align-items: center;
}

.analytics-donut-visual {
  width: 220px;
  height: 220px;
  border-radius: 50%;
  margin: 0 auto;
  display: grid;
  place-items: center;
}

.analytics-donut-hole {
  width: 132px;
  height: 132px;
  border-radius: 50%;
  background: #fff;
  display: grid;
  place-items: center;
  text-align: center;
  box-shadow: inset 0 0 0 1px var(--line);
}

.analytics-donut-hole strong {
  font-size: 18px;
}

.analytics-donut-hole small {
  color: var(--muted);
}

.analytics-legend-list {
  display: grid;
  gap: 10px;
}

.analytics-legend-row {
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 14px;
  padding: 12px 14px;
  display: flex;
  align-items: center;
  gap: 12px;
  text-align: left;
}

.analytics-legend-row div {
  display: grid;
  gap: 2px;
}

.analytics-heatmap-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(112px, 1fr));
  gap: 12px;
}

.analytics-heatmap-cell {
  border: 1px solid transparent;
  border-radius: 16px;
  min-height: 96px;
  padding: 14px;
  color: #fff;
  text-align: left;
  display: grid;
  align-content: space-between;
}

.analytics-heatmap-cell small {
  color: rgba(255, 255, 255, .82);
}

.analytics-insight-grid,
.analytics-inline-insights,
.analytics-predictive-grid,
.analytics-support-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.analytics-insight-card,
.analytics-prediction-card,
.analytics-segment-chip {
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
  padding: 16px;
  display: grid;
  gap: 10px;
  text-align: left;
}

.analytics-insight-card.deleted {
  border-color: rgba(239, 59, 70, .18);
  background: linear-gradient(180deg, #fff 0%, #fff5f6 100%);
}

.analytics-insight-card.partial {
  border-color: rgba(255, 138, 42, .18);
  background: linear-gradient(180deg, #fff 0%, #fff9f2 100%);
}

.analytics-insight-card.paid {
  border-color: rgba(33, 180, 97, .18);
  background: linear-gradient(180deg, #fff 0%, #f4fff8 100%);
}

.analytics-segment-chip b {
  font-size: 18px;
}

.analytics-drilldown-meta {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.analytics-drilldown-host {
  display: grid;
  gap: 12px;
}

.analytics-hover-tooltip {
  position: fixed;
  z-index: 9999;
  max-width: 260px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(7, 20, 45, .94);
  color: #fff;
  font-size: 12px;
  line-height: 1.5;
  box-shadow: 0 24px 44px rgba(7, 20, 45, .28);
  pointer-events: none;
}

.analytics-workspace {
  display: grid;
  grid-template-columns: minmax(210px, 250px) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}
.analytics-sidebar,
.analytics-detail-panel,
.analytics-card {
  min-width: 0;
  overflow: hidden;
}
.analytics-sidebar {
  position: sticky;
  top: calc(var(--topbar-height, 56px) + 16px);
  display: grid;
  gap: 10px;
  align-self: start;
}
.analytics-menu {
  display: grid;
  gap: 8px;
}
.analytics-menu-item {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  width: 100%;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
  color: var(--ink);
  text-align: left;
}
.analytics-menu-item b,
.analytics-menu-item small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.analytics-menu-item small {
  color: var(--muted);
  font-size: 11px;
}
.analytics-menu-item.active {
  border-color: rgba(91, 45, 242, .3);
  background: linear-gradient(135deg, rgba(91, 45, 242, .1), rgba(14, 165, 233, .08));
}
.analytics-detail-panel {
  display: grid;
  gap: 14px;
  padding: 16px;
}
.analytics-detail-panel .report-detail-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}
.analytics-detail-panel .history-filters {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr)) auto;
  gap: 10px;
  align-items: end;
}
.analytics-metrics.history-metrics-compact {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.analytics-trend,
.analytics-card {
  border-radius: 20px;
  background: linear-gradient(180deg, #fff, #fbfcff);
}
.analytics-card .panel-title,
.analytics-trend .panel-title {
  align-items: flex-start;
}
.analytics-panels {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  align-items: start;
}
.analytics-card h2,
.analytics-trend h2 {
  overflow-wrap: anywhere;
}
.analytics-card .table-wrap {
  max-width: 100%;
  overflow-x: auto;
}
.analytics-card table {
  table-layout: fixed;
  width: 100%;
}
.analytics-card th,
.analytics-card td {
  min-width: 0;
  max-width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.analytics-row-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}
.analytics-row-list article,
.analytics-line-notes article {
  min-width: 0;
  display: grid;
  gap: 4px;
  padding: 12px;
  border: 1px solid rgba(148, 163, 184, .24);
  border-radius: 16px;
  background:
    radial-gradient(circle at 16% 0%, rgba(91, 45, 242, .08), transparent 34%),
    #fff;
}
.analytics-row-list article b,
.analytics-row-list article strong,
.analytics-row-list article small,
.analytics-line-notes article b,
.analytics-line-notes article strong,
.analytics-line-labels span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.analytics-row-list article strong {
  color: var(--violet);
  font-size: clamp(14px, 1.3vw, 18px);
}
.analytics-row-list article small,
.analytics-line-notes article b {
  color: var(--muted);
}
.analytics-line-chart {
  display: grid;
  gap: 10px;
}
.analytics-line-chart-head,
.analytics-line-legend,
.analytics-line-labels,
.analytics-line-notes {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
}
.analytics-line-chart-head {
  justify-content: space-between;
}
.analytics-line-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.analytics-line-legend i {
  width: 10px;
  height: 10px;
  border-radius: 999px;
}
.analytics-line-legend i.primary { background: var(--violet); }
.analytics-line-legend i.secondary { background: #f97316; }
.analytics-line-chart-body {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 8px;
  min-height: 190px;
}
.analytics-line-axis {
  display: grid;
  align-content: space-between;
  color: var(--muted);
  font-size: 10px;
  text-align: right;
  padding: 4px 0;
}
.analytics-line-chart-frame {
  position: relative;
  min-width: 0;
  min-height: 190px;
  border: 1px solid rgba(148, 163, 184, .22);
  border-radius: 18px;
  background: linear-gradient(180deg, #fbfdff, #f6f8ff);
  overflow: hidden;
}
.analytics-line-grid {
  position: absolute;
  inset: 0;
  display: grid;
  align-content: space-between;
  padding: 14px 0;
}
.analytics-line-grid span {
  border-top: 1px dashed rgba(148, 163, 184, .35);
}
.analytics-line-svg {
  position: absolute;
  inset: 10px;
  width: calc(100% - 20px);
  height: calc(100% - 20px);
  overflow: visible;
}
.analytics-line-primary,
.analytics-line-secondary {
  fill: none;
  stroke-width: 3;
  vector-effect: non-scaling-stroke;
}
.analytics-line-primary { stroke: var(--violet); }
.analytics-line-secondary { stroke: #f97316; stroke-dasharray: 6 5; }
.analytics-line-point-primary,
.analytics-line-point-secondary {
  fill: #fff;
  vector-effect: non-scaling-stroke;
}
.analytics-line-point-primary { stroke: var(--violet); }
.analytics-line-point-secondary { stroke: #f97316; }
.analytics-line-labels {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}
.analytics-line-notes {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}
.analytics-empty-state {
  min-height: 120px;
  display: grid;
  place-items: center;
  padding: 18px;
  border: 1px dashed rgba(148, 163, 184, .45);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(248, 250, 252, .95), rgba(239, 246, 255, .72));
  color: #64748b;
  font-weight: 900;
  text-align: center;
}

@media (max-width: 1280px) {
  .analytics-workspace {
    grid-template-columns: 1fr;
  }
  .analytics-sidebar {
    position: static;
  }
  .analytics-menu {
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  }
  .analytics-detail-panel .history-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .analytics-panels {
    grid-template-columns: 1fr;
  }
  .analytics-filter-grid,
  .analytics-metric-grid,
  .analytics-sub-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .analytics-insight-grid,
  .analytics-inline-insights,
  .analytics-predictive-grid,
  .analytics-support-grid,
  .analytics-grid,
  .analytics-executive-grid,
  .analytics-section-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 980px) {
  .analytics-detail-panel .report-detail-head {
    flex-direction: column;
  }
  .analytics-detail-panel .history-filters,
  .analytics-metrics.history-metrics-compact,
  .analytics-menu {
    grid-template-columns: 1fr;
  }
  .analytics-line-chart-body {
    grid-template-columns: 1fr;
  }
  .analytics-line-axis {
    display: none;
  }
  .analytics-filter-head,
  .analytics-drilldown-summary {
    flex-direction: column;
  }

  .analytics-filter-grid,
  .analytics-metric-grid,
  .analytics-sub-metrics,
  .analytics-insight-grid,
  .analytics-inline-insights,
  .analytics-predictive-grid,
  .analytics-support-grid,
  .analytics-grid,
  .analytics-executive-grid,
  .analytics-section-grid,
  .analytics-donut-chart {
    grid-template-columns: 1fr;
  }

  .analytics-donut-visual {
    width: 180px;
    height: 180px;
  }

  .analytics-donut-hole {
    width: 112px;
    height: 112px;
  }
}
.blocked-access-copy > p {
  margin: 0;
  color: var(--muted);
  line-height: 1.6;
}
.blocked-access-reason {
  margin-top: 12px !important;
  color: var(--ink) !important;
  font-weight: 600;
}
.blocked-access-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}
.blocked-access-meta span {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  background: #f5f7fb;
  border: 1px solid #e4e8f1;
  color: var(--ink);
  font-size: 12px;
  font-weight: 700;
}
.blocked-access-tenant {
  display: block;
  color: var(--subtle);
  margin-top: 14px;
  font-size: 12px;
}
.blocked-access-actions {
  justify-content: flex-start;
}
.subscription-guard-card {
  width: min(760px, 100%);
  margin: 40px auto 0;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 24px;
  box-shadow: var(--shadow);
  padding: clamp(24px, 3vw, 36px);
  display: grid;
  gap: 16px;
}
.subscription-guard-card h1 {
  margin: 0;
  font-size: clamp(28px, 3vw, 38px);
  line-height: 1.08;
}
.subscription-guard-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.6;
}
.guard-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 8px;
}
.support-dialog { width: min(720px, 100%); }

.workspace-view { min-height: 100vh; height: 100vh; display: grid; grid-template-columns: var(--workspace-nav-width) 1fr; transition: grid-template-columns .22s ease; overflow: hidden; }
.workspace-view.sidebar-collapsed { grid-template-columns: var(--workspace-nav-width) 1fr; }
.workspace-view,
.main-shell {
  position: relative;
}
.workspace-view {
  --workspace-nav-width: 236px;
}
.workspace-view.sidebar-collapsed {
  --workspace-nav-width: 78px;
}
.sidebar {
  background: var(--nav);
  color: white;
  padding: 18px 14px;
  position: sticky;
  top: 0;
  z-index: 40;
  height: 100vh;
  display: flex;
  flex-direction: column;
  gap: 18px;
  min-height: 0;
  overflow: hidden;
}
.side-brand { display: grid; grid-template-columns: 46px minmax(0, 1fr) 34px; align-items: center; gap: 10px; font-size: 16px; padding: 0 6px 8px; }
.side-brand .brand-mark { width: 46px; height: 46px; }
.side-brand-text {
  display: grid;
  gap: 1px;
  min-width: 0;
  color: #fff;
  font-size: 16px;
  line-height: 1.05;
  letter-spacing: 0;
}
.side-brand-text span,
.side-brand-text em {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.side-brand-text em {
  color: #dce6f7;
  font-style: normal;
  font-weight: 750;
}
.sidebar-toggle-button {
  width: 34px;
  height: 34px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 10px;
  background: rgba(255,255,255,.06);
  color: #dce6f7;
  display: grid;
  place-items: center;
  padding: 0;
}
.sidebar-toggle-button:hover { background: rgba(255,255,255,.12); color: white; }
.sidebar-toggle-button .icon { width: 18px; height: 18px; transition: transform .18s ease; }
.side-nav {
  display: grid;
  gap: 6px;
  align-content: start;
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: 4px;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.34) transparent;
}
.side-nav::-webkit-scrollbar { width: 6px; }
.side-nav::-webkit-scrollbar-track { background: transparent; }
.side-nav::-webkit-scrollbar-thumb { background: rgba(255,255,255,.28); border-radius: 999px; }
.side-nav:hover::-webkit-scrollbar-thumb { background: rgba(255,255,255,.44); }
.side-nav button, .logout {
  min-height: 44px;
  border: 0;
  border-radius: 12px;
  padding: 0 14px;
  background: transparent;
  color: #dce6f7;
  display: flex;
  align-items: center;
  gap: 12px;
  text-align: left;
  position: relative;
  }
  .side-nav button.active, .side-nav button:hover { background: var(--violet); color: white; }
.side-nav button .icon,
.logout .icon {
  width: 18px;
  height: 18px;
  color: #b7c7df;
}
.side-nav button.active .icon,
.side-nav button:hover .icon,
.logout:hover .icon {
  color: white;
}
.side-nav button.nav-highlight {
  border: 1px solid rgba(148, 240, 208, .22);
  background: rgba(17, 184, 134, .12);
}
.side-nav button.nav-highlight .icon {
  color: #94f0d0;
}
.side-nav button.nav-highlight.active,
.side-nav button.nav-highlight:hover {
  background: linear-gradient(135deg, var(--violet), #0f766e);
  color: white;
}
.side-nav button::after,
.logout::after {
  content: attr(data-tooltip);
  position: absolute;
  left: calc(100% + 12px);
  top: 50%;
  transform: translateY(-50%) translateX(-4px);
  z-index: 50;
  min-width: max-content;
  max-width: 220px;
  padding: 8px 10px;
  border-radius: 8px;
  background: #101828;
  color: #fff;
  box-shadow: 0 14px 34px rgba(7,20,45,.24);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  opacity: 0;
  pointer-events: none;
  transition: opacity .14s ease, transform .14s ease;
  white-space: nowrap;
}
.side-nav button::before,
.logout::before {
  content: "";
  position: absolute;
  left: calc(100% + 6px);
  top: 50%;
  transform: translateY(-50%);
  border: 6px solid transparent;
  border-right-color: #101828;
  opacity: 0;
  pointer-events: none;
  transition: opacity .14s ease;
  z-index: 51;
}
.side-nav button:hover::after,
.side-nav button:focus-visible::after,
.logout:hover::after,
.logout:focus-visible::after {
  opacity: 1;
  transform: translateY(-50%) translateX(0);
}
.side-nav button:hover::before,
.side-nav button:focus-visible::before,
.logout:hover::before,
.logout:focus-visible::before {
  opacity: 1;
}
.side-footer {
  flex: 0 0 auto;
  display: grid;
  gap: 8px;
  border-top: 1px solid rgba(255,255,255,.11);
  padding-top: 8px;
  margin-top: 0;
}
.logout { width: 100%; }
.logout:hover { background: rgba(255,255,255,.08); color: white; }
.workspace-view.sidebar-collapsed .sidebar { padding-inline: 10px; }
.workspace-view.sidebar-collapsed .side-brand { grid-template-columns: 1fr; justify-items: center; padding-inline: 0; }
.workspace-view.sidebar-collapsed .side-brand strong,
.workspace-view.sidebar-collapsed .side-brand-text,
.workspace-view.sidebar-collapsed .side-nav b,
.workspace-view.sidebar-collapsed .side-footer b {
  display: none;
}
.workspace-view.sidebar-collapsed .side-brand .brand-mark { width: 40px; height: 40px; }
.workspace-view.sidebar-collapsed .sidebar-toggle-button {
  width: 36px;
  height: 32px;
}
.workspace-view.sidebar-collapsed .sidebar-toggle-button .icon { transform: scaleX(-1); }
.workspace-view.sidebar-collapsed .side-nav button,
.workspace-view.sidebar-collapsed .logout {
  justify-content: center;
  width: 48px;
  min-height: 48px;
  margin-inline: auto;
  padding-inline: 0;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.02);
}

.operations-billing-inline {
  display: grid;
  grid-template-columns: repeat(2, minmax(86px, 1fr));
  gap: 6px;
  margin-top: 8px;
  max-width: 250px;
}
.operations-billing-inline .input {
  min-height: 34px;
  padding: 7px 9px;
  font-size: 12px;
  border-radius: 10px;
}
.operations-resource-form {
  display: grid;
  gap: 12px;
}
.operations-resource-form label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}
.operations-resource-form .inline-check {
  grid-template-columns: auto 1fr;
  align-items: center;
  color: var(--text);
}
.operations-resource-form .action-row { justify-content: flex-end; }

.ops-dashboard {
  display: grid;
  gap: 20px;
  padding-bottom: 28px;
}
.ops-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: start;
  padding: 24px;
  border: 1px solid rgba(128, 143, 171, .22);
  border-radius: 24px;
  background:
    linear-gradient(135deg, rgba(90, 64, 238, .09), rgba(18, 178, 208, .07) 46%, rgba(255,255,255,.98)),
    #fff;
  box-shadow: 0 18px 45px rgba(15, 23, 42, .07);
}
.ops-hero h1 {
  margin: 12px 0 8px;
  font-size: clamp(28px, 3vw, 42px);
  line-height: 1.04;
  letter-spacing: 0;
  color: var(--text);
}
.ops-hero p {
  max-width: 820px;
  margin: 0;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.6;
}
.ops-context-line {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}
.ops-context-line span {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 6px 10px;
  border: 1px solid rgba(128, 143, 171, .22);
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.ops-hero-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
  min-width: 320px;
}
.ops-kpi-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(150px, 1fr));
  gap: 14px;
}
.ops-kpi-card {
  position: relative;
  overflow: hidden;
  min-height: 118px;
  padding: 18px;
  border: 1px solid rgba(128, 143, 171, .18);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 14px 32px rgba(15, 23, 42, .06);
}
.ops-kpi-card::after {
  content: "";
  position: absolute;
  inset: auto 16px 16px auto;
  width: 42px;
  height: 42px;
  border-radius: 16px;
  background: currentColor;
  opacity: .10;
}
.ops-kpi-card span,
.ops-kpi-card small {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.ops-kpi-card strong {
  display: block;
  margin: 10px 0 8px;
  font-size: 30px;
  line-height: 1;
  color: var(--text);
}
.ops-tabs {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 6px;
  border: 1px solid rgba(128, 143, 171, .18);
  border-radius: 18px;
  background: rgba(255,255,255,.82);
  box-shadow: 0 10px 28px rgba(15, 23, 42, .05);
}
.ops-tabs button {
  border: 0;
  border-radius: 14px;
  background: transparent;
  color: var(--muted);
  padding: 11px 14px;
  font-weight: 900;
  white-space: nowrap;
  cursor: pointer;
}
.ops-tabs button.active {
  color: #3b1ac8;
  background: #ede9fe;
  box-shadow: inset 0 0 0 1px rgba(94, 56, 230, .18), 0 10px 20px rgba(94, 56, 230, .10);
}
.ops-tab-panel { display: none; }
.ops-tab-panel.active {
  display: grid;
  gap: 18px;
}
.ops-workspace-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
  gap: 18px;
  align-items: start;
}
.ops-panel {
  border: 1px solid rgba(128, 143, 171, .18);
  border-radius: 22px;
  background: rgba(255,255,255,.96);
  box-shadow: 0 14px 34px rgba(15, 23, 42, .06);
  padding: 18px;
}
.ops-section-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 16px;
}
.ops-section-head h3 {
  margin: 0 0 4px;
  color: var(--text);
  font-size: 18px;
}
.ops-section-head p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}
.ops-section-head b {
  color: var(--primary);
  white-space: nowrap;
}
.ops-resource-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(285px, 1fr));
  gap: 14px;
}
.ops-resource-grid.expanded { grid-template-columns: repeat(auto-fit, minmax(310px, 1fr)); }
.ops-resource-card {
  display: grid;
  gap: 14px;
  min-height: 250px;
  padding: 18px;
  border: 1px solid rgba(128, 143, 171, .2);
  border-left: 4px solid #94a3b8;
  border-radius: 18px;
  background: linear-gradient(180deg, #fff, #fbfdff);
  box-shadow: 0 12px 24px rgba(15, 23, 42, .05);
}
.ops-resource-top {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}
.ops-resource-top strong {
  display: block;
  color: var(--text);
  font-size: 17px;
}
.ops-resource-top small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-weight: 700;
}
.ops-resource-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.ops-resource-meta div {
  min-width: 0;
  padding: 10px;
  border-radius: 14px;
  background: #f8fafc;
  border: 1px solid rgba(128, 143, 171, .12);
}
.ops-resource-meta span {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}
.ops-resource-meta b {
  display: block;
  overflow: hidden;
  margin-top: 4px;
  color: var(--text);
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ops-card-actions,
.ops-row-actions,
.ops-modal-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.compact-button {
  min-height: 36px;
  padding: 8px 12px;
  border-radius: 12px;
  font-size: 13px;
}
.ops-table-shell {
  overflow: auto;
  border: 1px solid rgba(128, 143, 171, .18);
  border-radius: 18px;
}
.ops-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  min-width: 860px;
  background: #fff;
}
.ops-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #f8fafc;
  color: var(--muted);
  font-size: 11px;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.ops-table th,
.ops-table td {
  padding: 14px 16px;
  border-bottom: 1px solid rgba(128, 143, 171, .14);
  text-align: left;
  vertical-align: middle;
}
.ops-table td small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
}
.ops-status-badge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  background: #eef2f7;
  color: #475569;
  white-space: nowrap;
}
.ops-status-badge.is-good,
.ops-kpi-card.is-good { color: #047857; }
.ops-status-badge.is-good { background: #dcfce7; }
.ops-status-badge.is-blue,
.ops-kpi-card.is-blue { color: #2563eb; }
.ops-status-badge.is-blue { background: #dbeafe; }
.ops-status-badge.is-waiting,
.ops-kpi-card.is-waiting { color: #b45309; }
.ops-status-badge.is-waiting { background: #fef3c7; }
.ops-status-badge.is-active,
.ops-kpi-card.is-active { color: #6d28d9; }
.ops-status-badge.is-active { background: #ede9fe; }
.ops-status-badge.is-review,
.ops-kpi-card.is-review { color: #c2410c; }
.ops-status-badge.is-review { background: #ffedd5; }
.ops-status-badge.is-process,
.ops-kpi-card.is-process { color: #0369a1; }
.ops-status-badge.is-process { background: #e0f2fe; }
.ops-status-badge.is-risk,
.ops-kpi-card.is-risk { color: #b91c1c; }
.ops-status-badge.is-risk { background: #fee2e2; }
.ops-status-badge.is-neutral,
.ops-kpi-card.is-neutral { color: #475569; }
.ops-resource-card.is-good { border-left-color: #10b981; }
.ops-resource-card.is-blue { border-left-color: #3b82f6; }
.ops-resource-card.is-waiting { border-left-color: #f59e0b; }
.ops-resource-card.is-active { border-left-color: #7c3aed; }
.ops-resource-card.is-review { border-left-color: #f97316; }
.ops-resource-card.is-process { border-left-color: #0ea5e9; }
.ops-resource-card.is-risk { border-left-color: #ef4444; }
.ops-empty-state {
  padding: 26px;
  border: 1px dashed rgba(128, 143, 171, .35);
  border-radius: 18px;
  background: #f8fafc;
  color: var(--muted);
  font-weight: 800;
  text-align: center;
}
.ops-queue-list {
  display: grid;
  gap: 12px;
}
.ops-queue-card {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) minmax(180px, 2fr) auto;
  gap: 14px;
  align-items: center;
  padding: 14px;
  border: 1px solid rgba(128, 143, 171, .16);
  border-radius: 16px;
  background: #fff;
}
.ops-queue-card strong,
.ops-queue-card span {
  display: block;
}
.ops-queue-card p {
  margin: 0;
  color: var(--muted);
}
.ops-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(15, 23, 42, .42);
  backdrop-filter: blur(7px);
}
.ops-modal {
  width: min(620px, 100%);
  border: 1px solid rgba(128, 143, 171, .2);
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 28px 80px rgba(15, 23, 42, .28);
  padding: 20px;
}
.ops-modal-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}
.ops-modal-head h3 {
  margin: 0 0 6px;
  color: var(--text);
}
.ops-modal-head p {
  margin: 0;
  color: var(--muted);
}
.ops-bill-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 16px;
}
.ops-bill-summary span {
  min-width: 0;
  padding: 10px;
  border-radius: 14px;
  background: #f8fafc;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.ops-bill-summary b {
  display: block;
  overflow: hidden;
  margin-top: 4px;
  color: var(--text);
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ops-bill-form,
.ops-management-form {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.ops-form-note {
  margin: 12px 0 0;
  padding: 10px 12px;
  border: 1px solid rgba(91, 45, 242, .16);
  border-radius: 14px;
  background: #f8f6ff;
  color: var(--muted);
  font-weight: 700;
}
.ops-modal-actions {
  justify-content: flex-end;
  margin-top: 18px;
}

@media (max-width: 1180px) {
  .ops-hero,
  .ops-workspace-grid {
    grid-template-columns: 1fr;
  }
  .ops-hero-actions {
    justify-content: flex-start;
    min-width: 0;
  }
  .ops-kpi-grid {
    grid-template-columns: repeat(2, minmax(160px, 1fr));
  }
}

@media (max-width: 760px) {
  .ops-hero,
  .ops-panel {
    padding: 16px;
    border-radius: 18px;
  }
  .ops-kpi-grid,
  .ops-resource-meta,
  .ops-bill-summary,
  .ops-bill-form,
  .ops-management-form {
    grid-template-columns: 1fr;
  }
  .ops-queue-card {
    grid-template-columns: 1fr;
  }
}
.workspace-view.sidebar-collapsed .side-nav { padding-right: 0; }
.workspace-view.sidebar-collapsed .side-nav button.active,
.workspace-view.sidebar-collapsed .side-nav button:hover,
.workspace-view.sidebar-collapsed .logout:hover {
  background: rgba(91,45,242,.92);
  border-color: rgba(166,140,255,.52);
}

.main-shell { min-width: 0; z-index: 1; width: 100%; min-height: 100vh; height: 100vh; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; overflow: hidden; }
.topbar {
  min-height: 54px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 6px 20px;
  width: 100%;
  box-sizing: border-box;
  max-width: 100%;
  min-width: 0;
  background: rgba(247,248,252,.92);
  backdrop-filter: blur(12px);
  position: sticky;
  top: 0;
  z-index: 20;
}
.mobile-brand { display: none; align-items: center; gap: 10px; }
.mobile-brand .brand-mark { width: 38px; height: 38px; font-size: 12px; }
.topbar-breadcrumb {
  min-width: 0;
  max-width: min(100%, 560px);
  display: flex;
  align-items: center;
  overflow: hidden;
}
.search {
  justify-self: end;
  width: 200px;
  max-width: 200px;
  height: 38px;
  border: 1px solid var(--line);
  border-radius: 14px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 14px;
  background: white;
  cursor: pointer;
}
.search:focus-within, .search:hover { border-color: #d7dcef; box-shadow: 0 10px 28px rgba(15, 23, 42, .05); }
.search input { border: 0; outline: 0; flex: 1; min-width: 0; cursor: pointer; background: transparent; color: var(--muted); }
kbd { background: #f3f4f8; color: var(--muted); border-radius: 8px; padding: 3px 9px; font-weight: 700; }
.command-palette-button {
  color: var(--violet);
  background: linear-gradient(180deg, #fff, #f8f6ff);
  border-color: #ded7ff;
  box-shadow: 0 10px 22px rgba(91, 45, 242, .09);
}
.command-palette-button:hover,
.command-palette-button:focus-visible {
  border-color: var(--violet-2);
  box-shadow: 0 14px 28px rgba(91, 45, 242, .16);
}
.command-palette-button .icon {
  width: 19px;
  height: 19px;
}
.top-actions { display: flex; gap: 10px; align-items: center; }
.workspace-picker, .profile {
  min-height: 40px;
  border: 1px solid var(--line);
  background: white;
  border-radius: 12px;
  display: grid;
  align-items: center;
}
.workspace-picker {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  min-width: 0;
  max-width: min(360px, 34vw);
  height: 40px;
}
.workspace-picker-label {
  min-width: 0;
  flex: 1;
  display: flex;
  align-items: center;
  gap: 4px;
  overflow: hidden;
  white-space: nowrap;
}
.workspace-picker .icon:first-child {
  width: 16px;
  height: 16px;
  color: #4b5563;
  flex: none;
}
.workspace-picker small, .workspace-picker b {
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: left;
}
.workspace-picker small {
  font-size: 12px;
  color: var(--ink);
  font-weight: 700;
}
.workspace-picker small::after {
  content: " /";
  color: var(--subtle);
  margin-left: 4px;
}
.workspace-picker b {
  font-size: 12px;
  font-weight: 800;
  color: var(--ink);
}
.workspace-picker [data-icon="chevron-down"] {
  width: 16px;
  height: 16px;
  color: var(--subtle);
  flex: none;
}
.workspace-picker-menu {
  position: fixed;
  z-index: 90;
  display: grid;
  gap: 4px;
  padding: 8px;
  background: rgba(255,255,255,.98);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: 0 20px 48px rgba(15, 23, 42, .18);
}
.workspace-picker-option {
  min-height: 52px;
  display: grid;
  gap: 4px;
  text-align: left;
  padding: 10px 12px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: transparent;
  color: var(--ink);
}
.workspace-picker-option:hover,
.workspace-picker-option.active {
  background: var(--violet-soft);
  border-color: #ded6ff;
}
.workspace-picker-option strong { font-size: 13px; }
.workspace-picker-option small { color: var(--muted); font-size: 11px; }
.workspace-picker small, .profile small { color: var(--muted); font-size: 11px; }
.profile b { grid-column: 2; text-align: left; }
.profile {
  width: 40px;
  height: 40px;
  grid-template-columns: 1fr;
  column-gap: 0;
  padding: 0;
  place-items: center;
}
.profile b,
.profile small {
  display: none;
}
.profile span {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: linear-gradient(135deg, #2563eb, #4f46e5);
  color: white;
  display: grid;
  place-items: center;
  font-weight: 800;
  font-size: 12px;
  grid-row: auto;
}
.profile:hover,
.profile:focus-visible {
  border-color: #cfc4ff;
  box-shadow: 0 12px 30px rgba(91, 45, 242, .12);
}
.profile-menu {
  position: fixed;
  z-index: 95;
  min-width: 220px;
  display: grid;
  gap: 4px;
  padding: 8px;
  background: rgba(255,255,255,.98);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: 0 20px 48px rgba(15, 23, 42, .18);
}
.profile-menu-head {
  padding: 10px 12px 8px;
  display: grid;
  gap: 2px;
}
.profile-menu-head strong {
  color: var(--ink);
  font-size: 13px;
}
.profile-menu-head small {
  color: var(--muted);
  font-size: 11px;
}
.profile-menu button {
  min-height: 44px;
  display: grid;
  grid-template-columns: 18px 1fr;
  align-items: center;
  gap: 10px;
  text-align: left;
  padding: 10px 12px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: transparent;
  color: var(--ink);
}
.profile-menu button:hover,
.profile-menu button:focus-visible {
  background: var(--violet-soft);
  border-color: #ded6ff;
}
.mobile-signout-button {
  display: none;
}

.page-host {
  min-height: 0;
  padding: 0 26px 110px;
  overflow: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  scroll-padding-bottom: 110px;
}
.page { display: none; }
.page.active { display: block; }
.app-footer {
  min-height: 30px;
  padding: 0 26px 10px;
  color: var(--subtle);
  font-size: 12px;
  text-align: right;
  justify-content: flex-end;
  align-items: center;
  pointer-events: none;
}
.app-footer strong { color: var(--muted); font-weight: 800; }
.command-palette {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: start center;
  padding: min(10vh, 84px) 18px 18px;
}
.command-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(7, 20, 45, .46);
  backdrop-filter: blur(7px);
}
.command-dialog {
  position: relative;
  width: min(720px, 100%);
  max-height: min(720px, 84vh);
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  background: rgba(255,255,255,.98);
  border: 1px solid rgba(231,234,242,.92);
  border-radius: 18px;
  box-shadow: 0 32px 92px rgba(7,20,45,.28);
  overflow: hidden;
}

.onboarding-dialog {
  width: min(760px, 100%);
}

.confirm-dialog {
  width: min(520px, calc(100vw - 28px));
  grid-template-rows: auto auto auto;
}

.confirm-body {
  display: grid;
  gap: 8px;
  padding: 22px 24px 10px;
}

.confirm-body p {
  margin: 0;
  color: var(--ink);
  font-weight: 800;
  line-height: 1.45;
}

.confirm-body small {
  color: var(--muted);
  line-height: 1.5;
  font-weight: 650;
}

.confirm-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 18px 24px 24px;
}

.onboarding-form {
  display: grid;
  gap: 18px;
  padding: 0 24px 24px;
}
.command-head {
  height: 58px;
  display: grid;
  grid-template-columns: 24px 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 0 16px;
  border-bottom: 1px solid var(--line);
}
.command-head input {
  height: 44px;
  border: 0;
  outline: 0;
  color: var(--ink);
  font-size: 15px;
  font-weight: 650;
  background: transparent;
}
.command-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 12px 16px;
  color: var(--muted);
  border-bottom: 1px solid #f0f2f7;
}
.command-meta strong { color: var(--ink); }
.command-results { overflow: auto; padding: 8px; display: grid; gap: 4px; }
.command-item {
  width: 100%;
  min-height: 66px;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: transparent;
  padding: 10px 12px;
  text-align: left;
  color: var(--ink);
}
.command-item.active, .command-item:hover { background: var(--violet-soft); border-color: #ded6ff; }
.command-icon {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: white;
  color: var(--violet);
  border: 1px solid #e8e3ff;
}
.command-copy { min-width: 0; display: grid; gap: 4px; }
.command-copy b { font-size: 13px; }
.command-copy small { color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.command-item em {
  font-style: normal;
  color: var(--subtle);
  font-size: 11px;
  font-weight: 800;
  background: #f7f8fb;
  border-radius: 999px;
  padding: 5px 8px;
}
.command-empty {
  min-height: 180px;
  display: grid;
  place-content: center;
  text-align: center;
  gap: 8px;
  color: var(--muted);
}
.command-empty b { color: var(--ink); font-size: 15px; }
.command-foot {
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 14px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  background: #fbfcff;
  font-size: 12px;
}
.command-foot span { display: inline-flex; align-items: center; gap: 5px; }
.page-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; margin: 14px 0 20px; }
.page-head small { color: var(--muted); font-weight: 800; }
.page-head h1 { font-size: clamp(24px, 2vw, 32px); line-height: 1.12; margin: 5px 0 6px; }
.page-head p { margin: 0; color: var(--muted); font-size: 13px; }
.action-head {
  align-items: center;
  margin: 8px 0 12px;
  padding: 12px 14px;
  border: 1px solid rgba(226, 232, 240, .88);
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(91,45,242,.055), rgba(255,255,255,.98) 48%),
    #fff;
  box-shadow: 0 14px 34px rgba(15, 23, 42, .055);
}
.action-head > div:first-child {
  min-width: 0;
  display: grid;
  gap: 3px;
}
.action-head h1 {
  margin: 0;
  color: var(--ink);
  font-size: clamp(22px, 1.7vw, 30px);
  line-height: 1.08;
  letter-spacing: 0;
}
.action-head p {
  max-width: 920px;
  font-size: 12px;
  line-height: 1.45;
}
.action-cluster { display: flex; gap: 9px; flex-wrap: wrap; justify-content: flex-end; align-items: center; }
.action-cluster .compact-date { min-height: 38px; max-width: 168px; }
.action-cluster button {
  min-height: 40px;
  border-radius: 12px;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .055);
}
.page-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  margin: 8px 0 12px;
  min-width: 0;
}
.page-heading-card {
  padding: 12px 14px;
  border: 1px solid rgba(226, 232, 240, .88);
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(91,45,242,.055), rgba(255,255,255,.98) 48%),
    #fff;
  box-shadow: 0 14px 34px rgba(15, 23, 42, .055);
}
.page-heading-main {
  display: grid;
  gap: 3px;
  min-width: 0;
}
.page-heading-title {
  margin: 2px 0 0;
  color: var(--ink);
  font-size: clamp(20px, 1.65vw, 27px);
  line-height: 1.08;
  letter-spacing: 0;
}
.page-heading-subtitle {
  margin: 0;
  max-width: 920px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}
.page-heading-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}
.page-action-icon {
  width: 38px;
  height: 38px;
  border-radius: 12px;
  color: var(--violet);
  background: #fff;
}
.breadcrumb {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  max-width: 100%;
  min-height: 30px;
  padding: 4px 8px;
  border: 1px solid #e4e8f2;
  border-radius: 999px;
  background: rgba(255,255,255,.78);
  box-shadow: 0 8px 24px rgba(15,23,42,.04);
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
}
.breadcrumb button {
  border: 0;
  background: transparent;
  color: #55627c;
  font: inherit;
  min-height: 22px;
  padding: 0 4px;
  border-radius: 999px;
  cursor: pointer;
}
.breadcrumb button:hover {
  color: var(--violet);
  background: var(--violet-soft);
}
.breadcrumb svg {
  width: 13px;
  height: 13px;
  color: #9aa4b7;
  flex: 0 0 auto;
}
.breadcrumb strong {
  color: var(--violet);
  padding: 0 6px;
  white-space: nowrap;
}
.page-heading .breadcrumb {
  min-height: 25px;
  width: fit-content;
  padding: 2px 7px;
  font-size: 10px;
  box-shadow: none;
  background: rgba(255,255,255,.82);
}
.page-heading-compact .breadcrumb .icon {
  width: 11px;
  height: 11px;
}
.reports-page > .reports-page-breadcrumb-source {
  display: none;
}
.page-head .breadcrumb { display: none; }
.topbar-breadcrumb .breadcrumb {
  display: inline-flex;
  max-width: 100%;
  min-height: 34px;
  padding: 5px 12px;
  font-size: 11px;
  background: rgba(255,255,255,.88);
  box-shadow: 0 10px 30px rgba(15,23,42,.06);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.topbar-breadcrumb .breadcrumb button {
  min-height: 24px;
  padding: 0 5px;
  max-width: 138px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.topbar-breadcrumb .breadcrumb strong {
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.metric-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(180px, 1fr));
  gap: 14px;
  margin-bottom: 14px;
}
.metric, .panel {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: 0 10px 30px rgba(15,23,42,.04);
}
.metric { padding: 16px; min-height: 106px; position: relative; overflow: hidden; }
.metric > span:first-child { width: 42px; height: 42px; display: grid; place-items: center; color: var(--violet); background: var(--violet-soft); border-radius: 13px; float: left; margin-right: 12px; }
.metric small { color: var(--muted); font-weight: 700; }
.metric b { display: block; font-size: 15px; margin: 5px 0; clear: right; }
.metric em { font-style: normal; font-size: 12px; color: var(--muted); }
.metric em.up, .up { color: var(--green); }
.metric em.down { color: var(--red); }
.spark { height: 32px; width: 90px; margin-left: auto; border-radius: 50% 50% 0 0; background: linear-gradient(180deg, rgba(91,45,242,.22), transparent); clip-path: polygon(0 80%, 12% 64%, 24% 72%, 36% 38%, 48% 55%, 60% 34%, 72% 18%, 84% 44%, 100% 20%, 100% 100%, 0 100%); }
.spark.blue { background: linear-gradient(180deg, rgba(53,132,255,.25), transparent); }
.spark.green { background: linear-gradient(180deg, rgba(33,180,97,.25), transparent); }
.spark.orange { background: linear-gradient(180deg, rgba(255,138,42,.25), transparent); }

.dashboard-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 14px;
  align-items: start;
}
.dashboard-grid > .panel { min-width: 0; grid-column: span 4; overflow: hidden; }
.dashboard-grid > .sales-analytics { grid-column: span 5; }
.dashboard-grid > .table-panel { grid-column: span 8; }
.dashboard-grid > .stock-alerts { grid-column: span 4; }
.dashboard-grid > .products-panel { grid-column: span 4; }
.panel { padding: 16px; }
.panel h2 { margin: 0 0 12px; font-size: 14px; }
.panel-title { display: flex; justify-content: space-between; gap: 12px; align-items: center; margin-bottom: 10px; }
.panel-title h2 { margin: 0; }
.panel-title .action-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; min-width: 0; }
.action-row-spacer { flex: 1 1 auto; min-width: 16px; }
.branch-action-row #branchRuleStatus { max-width: min(100%, 520px); }
.sales-analytics { min-height: 300px; }
.chart-lines { height: 220px; position: relative; border-bottom: 1px solid var(--line); background: repeating-linear-gradient(to bottom, transparent 0 43px, #edf0f6 44px); overflow: hidden; }
.chart-lines span, .chart-lines i, .chart-lines b { position: absolute; left: 0; right: 0; height: 100%; bottom: 0; }
.chart-lines span { background: linear-gradient(180deg, rgba(91,45,242,.16), rgba(91,45,242,.02)); clip-path: polygon(0 84%, 5% 54%, 10% 68%, 16% 32%, 22% 58%, 28% 38%, 34% 76%, 41% 61%, 48% 40%, 55% 62%, 62% 48%, 70% 68%, 78% 36%, 85% 32%, 92% 78%, 100% 48%, 100% 100%, 0 100%); }
.chart-lines i { border-bottom: 3px solid var(--violet); clip-path: polygon(0 84%, 5% 54%, 10% 68%, 16% 32%, 22% 58%, 28% 38%, 34% 76%, 41% 61%, 48% 40%, 55% 62%, 62% 48%, 70% 68%, 78% 36%, 85% 32%, 92% 78%, 100% 48%); }
.chart-lines b { border-bottom: 2px dashed #a68cff; opacity: .6; clip-path: polygon(0 72%, 8% 62%, 14% 42%, 22% 24%, 30% 58%, 38% 48%, 46% 64%, 54% 42%, 62% 28%, 70% 58%, 78% 30%, 86% 42%, 94% 22%, 100% 36%); }
.donut-wrap { display: grid; grid-template-columns: 150px 1fr; gap: 16px; align-items: center; }
.donut { width: 144px; height: 144px; border-radius: 50%; background: conic-gradient(var(--violet) 0 57%, var(--blue) 57% 82%, #62cc82 82% 95%, var(--orange) 95%); display: grid; place-items: center; position: relative; }
.donut::after { content: ""; position: absolute; inset: 20px; border-radius: 50%; background: white; }
.donut strong, .donut small { z-index: 1; text-align: center; }
.donut small { display: block; color: var(--muted); margin-top: 34px; }
.donut-wrap ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.donut-wrap li { display: flex; justify-content: space-between; gap: 12px; color: var(--muted); font-size: 12px; }
.donut-wrap li b { color: var(--ink); }
.alert-row, .product-row { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid #f0f2f7; }
.product-thumb { width: 38px; height: 38px; border-radius: 9px; display: grid; place-items: center; background: #f1f3f7; }
.alert-row small { display: block; color: var(--red); margin-top: 5px; }
.table-panel { grid-column: span 2; }
.products-panel, .quick-actions, .stock-alerts { min-height: 230px; }
.table-wrap { overflow: auto; }
table { width: 100%; border-collapse: collapse; min-width: 640px; }
th, td { text-align: left; padding: 10px 9px; border-bottom: 1px solid #edf0f5; font-size: 12px; }
th { color: #5b6681; font-size: 10px; text-transform: uppercase; }
.dashboard-grid .table-wrap table,
.analytics-card .table-wrap table,
.report-detail-table {
  min-width: 0;
  table-layout: fixed;
}
.dashboard-grid th,
.dashboard-grid td,
.analytics-card th,
.analytics-card td,
.report-detail-table th,
.report-detail-table td {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.reports-page {
  max-width: none;
}
.report-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  min-width: 0;
}
.report-library-panel,
.report-detail-panel {
  min-width: 0;
  width: 100%;
  max-width: 100%;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  box-shadow: 0 12px 34px rgba(15, 23, 42, .05);
}
.report-library-panel {
  padding: 16px;
}
.report-sidebar-title {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}
.report-sidebar-title strong {
  font-size: 15px;
}
.report-sidebar-title small {
  color: var(--muted);
  line-height: 1.4;
}
.report-catalog-groups {
  display: grid;
  gap: 14px;
  min-width: 0;
}
.report-finder-head {
  display: grid;
  grid-template-columns: minmax(260px, 360px) minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}
.report-finder-search {
  position: relative;
  min-width: 0;
}
.report-finder-search .icon {
  position: absolute;
  left: 13px;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  color: var(--muted);
  z-index: 1;
}
.report-finder-search .input {
  padding-left: 42px;
  height: 44px;
  border-radius: 14px;
}
.report-category-tabs {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-width: 0;
  overflow-x: auto;
  padding-bottom: 4px;
  scrollbar-width: thin;
}
.report-category-tab {
  min-height: 44px;
  border: 1px solid #e2e7f2;
  border-radius: 14px;
  background: #fff;
  color: var(--ink);
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 0 12px;
  font-weight: 850;
  white-space: nowrap;
}
.report-category-tab .icon {
  width: 17px;
  height: 17px;
  color: var(--report-accent, var(--violet));
}
.report-category-tab small {
  min-width: 24px;
  padding: 3px 7px;
  border-radius: 999px;
  background: #f3f6fb;
  color: var(--muted);
  text-align: center;
}
.report-category-tab.active {
  border-color: color-mix(in srgb, var(--report-accent, var(--violet)) 42%, #dfe6f3);
  background: color-mix(in srgb, var(--report-accent, var(--violet)) 10%, #ffffff);
  box-shadow: inset 0 -2px 0 var(--report-accent, var(--violet));
}
.report-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}
.report-card {
  min-width: 0;
  min-height: 112px;
  border: 1px solid #e3e8f3;
  border-radius: 14px;
  background: #fff;
  padding: 13px;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  grid-template-rows: auto auto auto;
  column-gap: 11px;
  row-gap: 4px;
  text-align: left;
  color: var(--ink);
}
.report-card:hover,
.report-card:focus-visible,
.report-card.active {
  border-color: color-mix(in srgb, var(--report-accent, var(--violet)) 48%, #dfe6f3);
  box-shadow: 0 14px 30px rgba(15, 23, 42, .08);
  transform: translateY(-1px);
}
.report-card.active {
  background: linear-gradient(180deg, color-mix(in srgb, var(--report-accent, var(--violet)) 8%, #fff), #fff);
}
.report-card-icon {
  grid-row: 1 / span 3;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: color-mix(in srgb, var(--report-accent, var(--violet)) 12%, #fff);
  color: var(--report-accent, var(--violet));
}
.report-card b,
.report-card small,
.report-card em {
  min-width: 0;
}
.report-card b {
  font-size: 13px;
  line-height: 1.25;
}
.report-card small {
  color: var(--muted);
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.report-card em {
  width: fit-content;
  max-width: 100%;
  padding: 4px 8px;
  border-radius: 999px;
  background: #f6f8fb;
  color: var(--subtle);
  font-style: normal;
  font-size: 10px;
  font-weight: 850;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.report-empty {
  grid-column: 1 / -1;
  min-height: 92px;
}
.report-detail-panel {
  display: block;
  padding: clamp(14px, 1.8vw, 20px);
}
.report-detail-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
.report-detail-head h2 {
  margin: 2px 0 5px;
  font-size: clamp(18px, 1.7vw, 24px);
}
.report-detail-head p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}
.report-detail-head small {
  color: var(--subtle);
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.report-detail-head .action-row {
  flex: 0 0 auto;
  margin-left: auto;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.reports-page .history-filters {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(210px, 100%), 1fr));
  gap: 10px;
  align-items: end;
  width: 100%;
  max-width: 100%;
  padding: 12px;
  margin: 0 0 14px;
  border: 1px solid #edf1f7;
  border-radius: 16px;
  background: #fafbfe;
}
.reports-page .history-filters label,
.reports-page .report-entity-filter {
  min-width: 0;
}
.reports-page .history-filters label {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.reports-page .history-filters .input,
.reports-page .history-filters select,
.reports-page .history-filters input {
  width: 100%;
  min-width: 0;
}
.reports-page .history-filters .fit {
  width: 100%;
  min-width: 0;
}
.report-entity-filter {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr));
  gap: 10px;
  align-items: end;
  grid-column: 1 / -1;
  min-width: 0;
}
.report-entity-filter.single-entity {
  grid-template-columns: minmax(220px, 1fr);
}
.report-entity-filter.single-entity label {
  min-width: 0;
}
.report-entity-all {
  min-height: 40px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}
.report-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}
.report-summary article {
  min-height: 74px;
  padding: 12px 14px;
  border: 1px solid #e8edf5;
  border-radius: 14px;
  background: #fff;
}
.report-summary small {
  color: var(--muted);
  font-weight: 750;
}
.report-summary b {
  display: block;
  margin-top: 5px;
  font-size: 16px;
}
.report-table-wrap {
  max-width: 100%;
  min-width: 0;
  width: 100%;
  overflow: auto;
  border: 1px solid #edf1f7;
  border-radius: 14px;
}
.report-table-wrap table {
  min-width: 860px;
}
.report-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 12px;
  padding: 10px 2px 0;
}
.report-pagination small {
  color: var(--muted);
  font-weight: 650;
}
.report-detail-table th,
.report-detail-table td {
  white-space: normal;
  vertical-align: top;
  line-height: 1.35;
}
.dashboard-grid .analytics-row-list article,
.dashboard-grid .product-row,
.dashboard-grid .alert-row {
  min-width: 0;
}
.dashboard-grid .analytics-row-list article b,
.dashboard-grid .analytics-row-list article strong,
.dashboard-grid .analytics-row-list article small,
.dashboard-grid .product-row b,
.dashboard-grid .product-row span,
.dashboard-grid .product-row strong,
.dashboard-grid .alert-row b,
.dashboard-grid .alert-row small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pill { padding: 5px 8px; border-radius: 8px; font-weight: 800; font-size: 11px; display: inline-flex; }
.paid, .completed { background: #e7f8ed; color: #148f4c; }
.pending { background: #fff2df; color: #db7600; }
.warning { background: #fff2df; color: #db7600; }
.partial { background: #ffe9df; color: #dd5e10; }
.draft { background: #eff1f5; color: #667085; }
.deleted { background: #ffe1e3; color: #d31624; }
.refunded { background: #e5f1ff; color: #1769d5; }
.quick-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.quick-grid button { min-height: 76px; border: 0; border-radius: 12px; background: #f7f5ff; color: var(--ink); display: grid; place-items: center; gap: 6px; }
.quick-grid span { color: var(--violet); }
.page-phase2-full .transaction-layout {
  grid-template-columns: minmax(0, 1fr);
}
.page-phase2-full .transaction-stack {
  max-width: 100%;
}
.investment-sequence {
  display: grid;
  gap: 18px;
}
.investment-hero-panel,
.investment-section {
  border-radius: 24px;
  border: 1px solid rgba(154, 168, 198, .18);
  background:
    radial-gradient(circle at top right, rgba(109, 94, 255, .07), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(247,249,255,.96));
  box-shadow: 0 16px 36px rgba(15, 23, 42, .05);
}
.investment-hero-head,
.investment-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
.investment-hero-head h2,
.investment-section-head h2 {
  margin: 6px 0 0;
  color: #0f1f53;
  font-size: 24px;
  line-height: 1.1;
}
.investment-hero-head p,
.investment-section-head p {
  margin: 8px 0 0;
  max-width: 760px;
  color: #66779f;
  font-size: 14px;
  line-height: 1.6;
}
.investment-step-tag {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(79, 70, 229, .1);
  color: #4f46e5;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.investment-hero-actions,
.investment-entry-actions,
.investment-ledger-actions,
.investment-filter-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.investment-hero-actions .secondary,
.investment-ledger-actions .secondary,
.investment-entry-actions button,
.investment-filter-actions button {
  min-height: 42px;
  padding-inline: 16px;
  white-space: nowrap;
}
.investment-filters-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-items: end;
}
.investment-filter-actions {
  align-self: end;
  justify-content: flex-end;
  grid-column: 1 / -1;
}
.investment-entry-head {
  margin-bottom: 18px;
}
.investment-entry-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
}
.investment-entry-grid label.span-2:last-child textarea,
.investment-entry-grid textarea {
  min-height: 118px;
}
.investment-section .table-wrap {
  border-radius: 18px;
  border: 1px solid rgba(222, 229, 241, .9);
  overflow: auto;
  background: rgba(255,255,255,.86);
}
.investment-section .history-table thead th {
  background: rgba(248, 250, 255, .96);
}
.investment-hero-panel .history-metrics-compact {
  margin-bottom: 0;
}

@media (max-width: 1080px) {
  .investment-hero-head h2,
  .investment-section-head h2 {
    font-size: 21px;
  }

  .investment-filters-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .investment-entry-actions,
  .investment-ledger-actions,
  .investment-hero-actions {
    width: 100%;
  }
}

@media (max-width: 820px) {
  .investment-filters-grid,
  .investment-entry-grid {
    grid-template-columns: 1fr;
  }

  .investment-filter-actions,
  .investment-entry-actions,
  .investment-ledger-actions,
  .investment-hero-actions {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
  }

  .investment-filter-actions button,
  .investment-entry-actions button,
  .investment-ledger-actions button,
  .investment-hero-actions button {
    width: 100%;
  }
}

.invoice-layout {
  display: grid;
  grid-template-columns: minmax(320px, .78fr) minmax(0, 1.22fr);
  gap: 14px;
  align-items: start;
  min-width: 0;
}
.scanner-panel { grid-row: span 2; }
steplabel { width: 34px; height: 34px; border-radius: 50%; display: inline-grid; place-items: center; background: var(--violet-soft); color: var(--violet); font-weight: 900; margin-right: 8px; }
.search-row { display: grid; grid-template-columns: 1fr auto auto; gap: 8px; margin: 12px 0; }
.mini-table { display: grid; gap: 0; border-top: 1px solid var(--line); margin-top: 12px; }
.mini-row { display: grid; grid-template-columns: 1.4fr .8fr .5fr .7fr auto; gap: 8px; align-items: center; padding: 10px 0; border-bottom: 1px solid #eff1f5; font-size: 12px; }
.mini-row b { color: var(--violet); }
.fit { width: fit-content; margin-top: 14px; }
.cart-panel { min-height: 340px; min-width: 0; overflow: hidden; }
.cart-panel .panel-title strong span { color: var(--violet); }
.cart-rows { display: grid; gap: 0; min-width: 0; overflow-x: auto; overflow-y: visible; padding-bottom: 8px; }
.cart-row { display: grid; grid-template-columns: minmax(140px, 1fr) 72px 104px 72px 84px 92px 38px; align-items: center; gap: 8px; min-width: 690px; padding: 12px 0; border-top: 1px solid #eff1f5; }
.cart-row .item { display: flex; gap: 10px; align-items: center; }
.cart-row .qty { display: grid; grid-template-columns: 30px 1fr 30px; border: 1px solid var(--line); border-radius: 9px; overflow: hidden; }
.cart-row .qty button { border: 0; background: white; min-height: 30px; }
.cart-row .qty input { border: 0; text-align: center; width: 100%; }
.customer-panel, .billing-panel { min-height: 230px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.form-grid.wide { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.form-grid label { display: grid; gap: 6px; font-size: 12px; font-weight: 700; color: #47536d; }
.form-grid .wide-field { grid-column: span 2; }
.party-layout { display: grid; grid-template-columns: 1fr; gap: 16px; align-items: stretch; }
.party-form, .party-list { min-width: 0; height: 100%; display: flex; flex-direction: column; }
.party-layout > .panel { height: 100%; }
.party-list .filters { grid-template-columns: minmax(220px, 1fr) auto; }
.party-list .table-wrap {
  flex: 1 1 auto;
  min-height: 0;
  max-height: none;
  display: block;
}
.party-list { order: 1; }
.party-form {
  order: 2;
  padding: 18px;
  border-color: rgba(194, 212, 255, .84);
  background:
    linear-gradient(180deg, rgba(248, 251, 255, .98), rgba(239, 246, 255, .94)),
    radial-gradient(circle at top right, rgba(126, 166, 255, .12), transparent 34%);
}
.party-form .form-grid.wide {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}
.party-form .wide-field {
  grid-column: 1 / -1;
}
@media (max-width: 1180px) {
  .party-form .form-grid.wide {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.party-form .action-row { display: flex; gap: 10px; justify-content: flex-end; margin-top: 14px; flex-wrap: wrap; }
textarea.input { min-height: 72px; resize: vertical; line-height: 1.4; padding-top: 10px; }
.total-panel { background: #f5f2ff; }
.total-panel strong { color: var(--violet); font-size: 20px; display: block; margin-bottom: 12px; }
.total-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 12px; }
.total-grid span { background: rgba(255,255,255,.7); border: 1px solid #e6e0ff; border-radius: 10px; padding: 10px; color: var(--muted); font-size: 11px; }
.total-grid b { display: block; color: var(--ink); font-size: 14px; margin-top: 5px; }
.sticky-actions {
  position: sticky;
  bottom: 10px;
  z-index: 18;
  display: flex;
  justify-content: flex-end;
  gap: 14px;
  margin-top: 16px;
  padding: 12px;
  border: 1px solid rgba(226, 232, 240, .92);
  border-radius: 16px;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 18px 46px rgba(15, 23, 42, .08);
  backdrop-filter: blur(14px);
}
.sticky-actions button { min-width: 160px; }
#page-product .sticky-actions {
  position: static;
  margin-top: 14px;
  justify-content: flex-end;
  background: #fff;
}

.history-metrics .metric { min-height: 100px; }
.history-grid { display: grid; grid-template-columns: minmax(0, 1fr) 292px; gap: 14px; align-items: start; }
.filters { display: grid; grid-template-columns: repeat(4, 1fr) auto auto; gap: 12px; margin-bottom: 14px; }
.pager { display: flex; justify-content: flex-end; align-items: center; gap: 10px; padding-top: 16px; }
.pager span { margin-right: auto; color: var(--muted); }
.history-side { display: grid; gap: 14px; }
.mini-chart b { font-size: 17px; display: block; margin-bottom: 12px; }
.quick-list { display: grid; gap: 10px; }
.quick-list button { height: 40px; border: 1px solid var(--line); border-radius: 10px; background: white; display: flex; justify-content: space-between; align-items: center; padding: 0 12px; color: var(--ink); font-weight: 700; }

.platform-admin-head { padding-bottom: 8px; }
.platform-admin-mode-nav {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}
.platform-admin-mode-nav button {
  border: 1px solid var(--line);
  border-radius: 14px;
  background: white;
  color: var(--ink);
  padding: 14px 16px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 4px 12px;
  align-items: center;
  text-align: left;
}
.platform-admin-mode-nav button span[data-icon] {
  grid-row: span 2;
}
.platform-admin-mode-nav button b,
.platform-admin-mode-nav button small {
  display: block;
  min-width: 0;
}
.platform-admin-mode-nav button small {
  color: var(--muted);
  line-height: 1.35;
}
.platform-admin-mode-nav button.active {
  border-color: rgba(37, 99, 235, 0.35);
  background: #eff6ff;
  box-shadow: 0 12px 28px rgba(37, 99, 235, 0.10);
}
.platform-admin-shell {
  display: grid;
  grid-template-columns: minmax(300px, 360px) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
  margin-bottom: 18px;
}
.platform-admin-list-panel,
.platform-admin-editor-panel,
.platform-admin-assignment-panel { min-width: 0; }
.platform-admin-list-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}
.platform-admin-list-summary article {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 12px 14px;
  background: #fbfcff;
}
.platform-admin-list-summary small,
.platform-admin-preview-grid .metric small {
  display: block;
  color: var(--muted);
  margin-bottom: 6px;
}
.platform-admin-list-summary b,
.platform-admin-preview-grid .metric b {
  font-size: 22px;
  font-weight: 800;
}
.platform-admin-template-list {
  display: grid;
  gap: 10px;
  max-height: calc(100vh - 360px);
  overflow: auto;
  padding-right: 4px;
}
.platform-admin-template-item {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: white;
  padding: 14px 16px;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  text-align: left;
  color: var(--ink);
}
.platform-admin-template-item div { min-width: 0; }
.platform-admin-template-item strong,
.platform-admin-template-item small,
.platform-admin-template-item span { display: block; }
.platform-admin-template-item small,
.platform-admin-template-item span { color: var(--muted); }
.platform-admin-template-item span {
  text-align: right;
  font-size: 12px;
  line-height: 1.4;
}
.platform-admin-template-item.active {
  border-color: rgba(91, 56, 245, 0.35);
  background: linear-gradient(180deg, rgba(109, 77, 255, 0.08), rgba(109, 77, 255, 0.02));
  box-shadow: 0 18px 36px rgba(91, 56, 245, 0.10);
}
.platform-admin-form { display: grid; gap: 16px; }
.platform-admin-editor-head { align-items: flex-start; }
.platform-admin-editor-head .action-cluster {
  flex-wrap: wrap;
  justify-content: flex-end;
}
.platform-admin-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.platform-admin-fields label,
.platform-admin-description {
  display: grid;
  gap: 8px;
  min-width: 0;
}
.platform-admin-fields label span,
.platform-admin-description span {
  font-size: 13px;
  font-weight: 700;
  color: var(--muted);
}
.platform-admin-description textarea {
  min-height: 110px;
  resize: vertical;
}
.platform-admin-flag-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.platform-admin-flag-row .inline-check,
.platform-admin-toggle-list .inline-check {
  display: flex;
  gap: 10px;
  align-items: flex-start;
}
.platform-admin-flag-row .inline-check {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 12px 14px;
  background: #fbfcff;
}
.platform-admin-toggle-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.platform-admin-toggle-panel { padding: 18px; }
.platform-admin-toggle-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 14px;
  max-height: 380px;
  overflow: auto;
  padding-right: 4px;
}
.platform-admin-toggle-list .inline-check {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 10px 12px;
  background: white;
}
.platform-admin-assignment-form {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(220px, 1fr) auto;
  gap: 12px;
  margin-bottom: 16px;
  align-items: center;
}
.platform-admin-preview-grid { margin-bottom: 16px; }
.platform-admin-table-wrap td small {
  display: block;
  color: var(--muted);
  margin-top: 4px;
}
.help-topic-admin-panel {
  min-width: 0;
}
.help-topic-table-wrap th:last-child,
.help-topic-table-wrap td:last-child {
  position: sticky;
  right: 0;
  z-index: 1;
  background: white;
  box-shadow: -10px 0 16px rgba(15, 23, 42, 0.06);
}
.compact-action {
  min-height: 32px;
  padding: 7px 10px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.product-master-panel { min-width: 0; }
.product-master-filters { grid-template-columns: minmax(260px, 1fr) 150px 150px auto auto; }
.product-master-panel tbody tr[data-product-open] { cursor: pointer; }
.product-master-panel tbody tr[data-product-open]:hover { background: #faf8ff; }
.product-master-panel td small { display: block; color: var(--muted); margin-top: 3px; max-width: 360px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.product-master-panel code { color: var(--violet); font-weight: 800; }
#page-product { padding-bottom: 54px; }
.product-layout {
  display: grid;
  grid-template-columns: minmax(220px, 255px) minmax(0, 1fr) minmax(235px, 285px);
  gap: 12px;
  align-items: start;
}
.product-layout > *,
.product-form {
  min-width: 0;
}
.variant-shelf, .product-side { position: static; top: auto; }
.product-layout .panel {
  border-color: rgba(212, 220, 234, .94);
  border-radius: 18px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 12px 30px rgba(15, 23, 42, .045);
}
.variant-row {
  width: 100%;
  border: 1px solid transparent;
  background: white;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas:
    "name pill"
    "barcode stock";
  gap: 6px 10px;
  align-items: center;
  padding: 11px 10px;
  border-bottom-color: #eff1f5;
  font-size: 12px;
  color: var(--ink);
  text-align: left;
  overflow: hidden;
}
.variant-row:hover, .variant-row.active { background: #f7f4ff; border-color: #e5dcff; color: var(--violet); border-radius: 12px; }
.variant-row b { grid-area: name; min-width: 0; font-size: 12px; line-height: 1.25; overflow: hidden; text-overflow: ellipsis; }
.variant-row > span:nth-of-type(1) { grid-area: barcode; min-width: 0; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.variant-row > span:nth-of-type(2) { grid-area: stock; color: var(--ink); font-weight: 800; text-align: right; }
.variant-row .pill { grid-area: pill; white-space: nowrap; justify-self: end; padding: 4px 7px; font-size: 10px; }
.variant-total { margin-top: 16px; display: grid; grid-template-columns: 42px 1fr 1fr; gap: 10px; align-items: center; background: #fafbfe; border: 1px solid var(--line); border-radius: 12px; padding: 12px; }
.variant-total > span { width: 36px; height: 36px; display: grid; place-items: center; background: var(--violet-soft); color: var(--violet); border-radius: 10px; }
.variant-total small { display: block; margin-bottom: 4px; }
.product-form { display: grid; gap: 14px; }
.steps { display: grid; grid-template-columns: repeat(3, 1fr); background: white; border: 1px solid rgba(226,232,240,.9); border-radius: 16px; overflow: hidden; box-shadow: 0 10px 26px rgba(15,23,42,.04); }
.steps button { border: 0; background: white; min-height: 58px; display: grid; grid-template-columns: 34px 1fr; align-items: center; text-align: left; column-gap: 10px; padding: 9px 14px; font-weight: 800; border-bottom: 3px solid transparent; }
.steps button.active { border-bottom-color: var(--violet); color: var(--violet); }
.steps b { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: var(--violet); color: white; grid-row: span 2; }
.steps small { color: var(--muted); font-weight: 600; }
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
#page-product .form-grid.wide { grid-template-columns: repeat(3, minmax(0, 1fr)); }
#page-product .form-grid label { min-width: 0; }
#page-product .input { min-width: 0; min-height: 38px; padding: 8px 12px; font-size: 12px; }
#page-product .entry-action-bar {
  position: static;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  width: 100%;
  max-width: 100%;
  overflow: visible;
  z-index: 1;
  margin: 0;
  padding: 10px;
  border: 1px solid rgba(226,232,240,.92);
  border-radius: 18px;
  background:
    radial-gradient(circle at 0% 0%, rgba(91, 45, 242, .07), transparent 28%),
    linear-gradient(135deg, rgba(255,255,255,.98), rgba(248,250,252,.94));
  box-shadow: 0 14px 34px rgba(15, 23, 42, .055);
}
#page-product .product-form > .entry-action-bar {
  align-items: center;
  justify-content: stretch;
}
#page-product .entry-action-bar button {
  width: 100%;
  min-width: 0;
  min-height: 44px;
  padding: 10px 12px;
  font-size: 13px;
  white-space: nowrap;
}
#page-product .page-head.action-head {
  align-items: flex-start;
  gap: 14px;
}
#page-product .page-head .action-cluster {
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}
#page-product .variant-shelf,
#page-product .product-form,
#page-product .product-side {
  min-width: 0;
}
.toggle-line { grid-template-columns: 1fr auto !important; align-items: center; }
.toggle-line input { width: 46px; height: 24px; accent-color: var(--violet); }
.price-matrix { margin-top: 14px; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.price-matrix-head, .price-matrix label { display: grid; grid-template-columns: 1fr 120px; align-items: center; gap: 12px; padding: 8px 12px; border-bottom: 1px solid #edf0f5; }
.price-matrix-head { background: #fafbfe; color: #5b6681; font-size: 10px; font-weight: 900; text-transform: uppercase; }
.price-matrix label { font-size: 12px; font-weight: 800; color: var(--ink); }
.price-matrix label:last-child { border-bottom: 0; }
.price-matrix .input { min-height: 34px; padding: 6px 9px; }
.enterprise-logo-panel {
  display: grid;
  gap: 10px;
}
.enterprise-logo-preview {
  min-height: 124px;
  border: 1px dashed #cfd8e6;
  border-radius: 14px;
  background: linear-gradient(135deg, #f9fbff, #ffffff);
  padding: 16px;
  display: grid;
  place-items: center;
  gap: 8px;
  text-align: center;
  color: var(--muted);
}
.enterprise-logo-preview.has-image {
  place-items: start;
  justify-items: start;
  text-align: left;
}
.enterprise-logo-preview img {
  max-width: 180px;
  max-height: 92px;
  object-fit: contain;
}
.enterprise-logo-preview b {
  color: var(--ink);
}
.snapshot b { font-size: 21px; display: block; margin: 7px 0; }
.snapshot p { display: flex; justify-content: space-between; color: var(--muted); }
.media-drop { min-height: 124px; display: grid; place-items: center; text-align: center; border-style: dashed; color: var(--muted); }
.media-drop span { color: var(--muted); }

.product-image-panel { gap: 12px; }
.product-image-preview { width: 100%; aspect-ratio: 1 / 1; border: 1px solid rgba(99, 102, 241, .18); border-radius: 22px; background: linear-gradient(145deg, #f8fbff, #eef6ff); display: grid; place-items: center; overflow: hidden; color: #64748b; }
.product-image-preview img { width: 100%; height: 100%; object-fit: cover; }
.product-image-preview .icon { width: 42px; height: 42px; opacity: .65; }

.pos-workspace-root {
  min-height: calc(100vh - 84px);
  margin-top: -14px;
}
.pos-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(332px, 364px);
  gap: 16px;
  align-items: stretch;
  min-height: calc(100vh - 98px);
}
.pos-main,
.pos-cart-panel {
  min-width: 0;
  background: rgba(255, 255, 255, .96);
  border: 1px solid rgba(148, 163, 184, .16);
  border-radius: 28px;
  box-shadow: 0 18px 46px rgba(15, 23, 42, .08);
}
.pos-main {
  padding: 16px;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  gap: 12px;
  overflow: hidden;
  background:
    radial-gradient(circle at top left, rgba(37, 99, 235, .08), transparent 34%),
    radial-gradient(circle at bottom right, rgba(129, 140, 248, .08), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(246,248,255,.96));
}
.pos-command-strip {
  display: grid;
  gap: 10px;
}
.pos-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.pos-title-block {
  min-width: 0;
  display: grid;
  gap: 2px;
}
.pos-kicker {
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #64748b;
}
.pos-toolbar h1 {
  margin: 0;
  font-size: 1.05rem;
  line-height: 1.05;
  letter-spacing: -.03em;
  color: #0f172a;
}
.pos-toolbar p {
  margin: 0;
  color: #64748b;
  font-size: .76rem;
  font-weight: 700;
}
.pos-toolbar-metrics {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.pos-toolbar-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 31px;
  padding: 0 11px;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, .16);
  background: rgba(255,255,255,.84);
  color: #475569;
  font-size: .74rem;
  font-weight: 800;
  white-space: nowrap;
}
.pos-toolbar-pill.strong {
  color: #fff;
  border-color: transparent;
  background: linear-gradient(135deg, #0f172a, #312e81);
  box-shadow: 0 12px 28px rgba(49, 46, 129, .24);
}
.pos-search {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  min-height: 50px;
  padding: 6px 6px 6px 10px;
  border-radius: 20px;
  border: 1px solid rgba(148, 163, 184, .18);
  background: rgba(255,255,255,.92);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.94), 0 10px 24px rgba(15, 23, 42, .04);
}
.pos-search-icon,
.pos-search > span {
  color: #64748b;
}
.pos-search .input {
  min-height: 36px;
  padding: 8px 8px 8px 2px;
  border: 0;
  background: transparent;
  box-shadow: none;
  font-size: .94rem;
}
.pos-search .input:focus {
  outline: none;
}
.pos-search .primary {
  min-height: 38px;
  padding: 8px 14px;
  border-radius: 14px;
  white-space: nowrap;
}
.pos-category-tabs {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 0 0 2px;
  scroll-behavior: smooth;
  scrollbar-width: none;
}
.pos-category-tabs::-webkit-scrollbar {
  display: none;
}
.pos-category-tabs button {
  border: 1px solid rgba(148, 163, 184, .18);
  background: rgba(255,255,255,.78);
  color: #0f172a;
  border-radius: 999px;
  padding: 0 14px;
  min-height: 36px;
  max-width: 190px;
  font-size: .78rem;
  font-weight: 800;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
  box-shadow: 0 8px 20px rgba(15, 23, 42, .04);
}
.pos-category-tabs button span:last-child {
  overflow: hidden;
  text-overflow: ellipsis;
}
.pos-category-tabs button .icon {
  width: 14px;
  height: 14px;
}
.pos-category-tabs button.active,
.pos-category-tabs button:hover {
  color: #fff;
  border-color: transparent;
  background: linear-gradient(135deg, #2563eb, #4f46e5);
  box-shadow: 0 14px 26px rgba(79, 70, 229, .22);
}
.pos-grid-shell {
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 10px;
  padding: 12px;
  border-radius: 24px;
  border: 1px solid rgba(148, 163, 184, .14);
  background: rgba(255,255,255,.72);
}
.pos-grid-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.pos-grid-head strong {
  display: block;
  font-size: .96rem;
  line-height: 1.1;
  color: #0f172a;
}
.pos-grid-head small,
.pos-grid-hint {
  color: #64748b;
  font-size: .72rem;
  font-weight: 800;
}
.pos-product-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(156px, 1fr));
  gap: 12px;
  min-height: 0;
  padding-right: 4px;
  overflow-y: auto;
  overflow-x: hidden;
  align-content: start;
  scrollbar-width: thin;
  scrollbar-color: rgba(148, 163, 184, .42) transparent;
}
.pos-product-grid::-webkit-scrollbar,
.pos-cart-lines::-webkit-scrollbar,
.pos-receipt-dialog::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
.pos-product-grid::-webkit-scrollbar-thumb,
.pos-cart-lines::-webkit-scrollbar-thumb,
.pos-receipt-dialog::-webkit-scrollbar-thumb {
  background: rgba(148, 163, 184, .38);
  border-radius: 999px;
}
.pos-product-card {
  position: relative;
  display: grid;
  gap: 8px;
  align-content: start;
  min-width: 0;
  padding: 10px;
  border-radius: 22px;
  border: 1px solid rgba(148, 163, 184, .16);
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,255,.96));
  box-shadow: 0 8px 22px rgba(15, 23, 42, .04);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.pos-product-card:hover {
  transform: translateY(-2px);
  border-color: rgba(79, 70, 229, .26);
  box-shadow: 0 18px 36px rgba(15, 23, 42, .09);
}
.pos-product-image {
  height: 102px;
  border-radius: 18px;
  overflow: hidden;
  display: grid;
  place-items: center;
  background: linear-gradient(145deg, #eef4ff, #f8fbff);
}
.pos-product-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 10px;
}
.pos-product-placeholder {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  gap: 8px;
  padding: 12px;
  text-align: center;
  color: #1e3a8a;
}
.pos-product-placeholder small {
  max-width: 100%;
  color: rgba(15, 23, 42, .58);
  font-size: .64rem;
  font-weight: 800;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pos-placeholder-badge {
  width: 46px;
  height: 46px;
  border-radius: 15px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,.76);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.6);
  font-size: .92rem;
  font-weight: 900;
  letter-spacing: .06em;
}
.pos-product-placeholder.tone-default {
  background: radial-gradient(circle at top left, rgba(59, 130, 246, .22), transparent 38%), linear-gradient(145deg, #dbeafe, #eff6ff);
}
.pos-product-placeholder.tone-cool {
  background: radial-gradient(circle at top left, rgba(6, 182, 212, .22), transparent 38%), linear-gradient(145deg, #cffafe, #eff6ff);
}
.pos-product-placeholder.tone-warm {
  background: radial-gradient(circle at top left, rgba(249, 115, 22, .22), transparent 38%), linear-gradient(145deg, #ffedd5, #fff7ed);
}
.pos-product-placeholder.tone-indigo {
  background: radial-gradient(circle at top left, rgba(99, 102, 241, .24), transparent 38%), linear-gradient(145deg, #e0e7ff, #eef2ff);
}
.pos-product-placeholder.tone-emerald {
  background: radial-gradient(circle at top left, rgba(16, 185, 129, .22), transparent 38%), linear-gradient(145deg, #d1fae5, #ecfdf5);
}
.pos-product-copy {
  min-width: 0;
  display: grid;
  gap: 4px;
}
.pos-product-copy strong {
  display: -webkit-box;
  min-height: 32px;
  font-size: .82rem;
  line-height: 1.18;
  color: #0f172a;
  overflow: hidden;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.pos-product-copy small {
  color: #64748b;
  font-size: .68rem;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pos-product-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.pos-product-meta b {
  color: #155bd8;
  font-size: .96rem;
  line-height: 1;
  letter-spacing: -.02em;
}
.pos-stock-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: .64rem;
  font-weight: 900;
  white-space: nowrap;
}
.stock-ok,
.pos-stock-pill.stock-ok {
  color: #047857 !important;
  background: rgba(16, 185, 129, .12);
}
.pos-stock-pill.stock-mid {
  color: #b45309;
  background: rgba(245, 158, 11, .14);
}
.stock-low,
.pos-stock-pill.stock-low {
  color: #b91c1c !important;
  background: rgba(239, 68, 68, .12);
}
.pos-add-button,
.pos-product-card > .primary {
  width: 100%;
  min-height: 34px;
  padding: 7px 10px;
  border-radius: 14px;
  font-size: .8rem;
  justify-content: center;
}
.pos-cart-panel {
  position: sticky;
  top: 6px;
  max-height: calc(100vh - 96px);
  padding: 14px;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 12px;
  overflow: hidden;
  background:
    radial-gradient(circle at top right, rgba(79, 70, 229, .08), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(247,249,255,.97));
}
.pos-cart-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(148, 163, 184, .18);
}
.pos-cart-head h2 {
  margin: 0;
  font-size: 1.04rem;
  line-height: 1.05;
  color: #0f172a;
}
.pos-cart-head small {
  display: block;
  margin-top: 4px;
  color: #64748b;
  font-size: .72rem;
  font-weight: 800;
}
.pos-clear-button {
  min-height: 34px;
  padding: 7px 12px;
  border-radius: 12px;
  flex: 0 0 auto;
}
.pos-cart-body {
  min-height: 0;
  display: grid;
  grid-template-rows: minmax(120px, 1fr) auto;
  gap: 12px;
}
.pos-cart-lines {
  min-height: 0;
  display: grid;
  gap: 8px;
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: 2px;
}
.pos-cart-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto auto;
  align-items: center;
  column-gap: 8px;
  padding: 9px 10px;
  border-radius: 16px;
  border: 1px solid rgba(148, 163, 184, .14);
  background: rgba(255,255,255,.9);
}
.pos-cart-item-copy {
  min-width: 0;
  overflow: hidden;
}
.pos-cart-line strong {
  display: -webkit-box;
  overflow: hidden;
  color: #0f172a;
  font-size: .78rem;
  line-height: 1.14;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.pos-cart-line small {
  display: block;
  margin-top: 3px;
  color: #64748b;
  font-size: .65rem;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pos-cart-line > b {
  font-size: .8rem;
  line-height: 1;
  white-space: nowrap;
  color: #0f172a;
}
.pos-cart-line > .icon-button {
  width: 30px;
  height: 30px;
  border-radius: 11px;
}
.pos-qty {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px;
  border-radius: 999px;
  background: rgba(241,245,249,.92);
  border: 1px solid rgba(148, 163, 184, .16);
}
.pos-qty button {
  width: 24px;
  height: 24px;
  border-radius: 999px;
  border: 0;
  background: #fff;
  color: #0f172a;
  font-weight: 900;
  line-height: 1;
  box-shadow: 0 2px 6px rgba(15, 23, 42, .08);
}
.pos-qty span {
  min-width: 18px;
  text-align: center;
  font-size: .76rem;
  font-weight: 900;
}
.pos-checkout-box {
  display: grid;
  gap: 10px;
  padding: 12px;
  border-radius: 20px;
  border: 1px solid rgba(148, 163, 184, .14);
  background: rgba(255,255,255,.82);
}
.pos-payment-box {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.pos-payment-box label {
  display: grid;
  gap: 5px;
  font-size: .72rem;
  color: #475569;
  font-weight: 800;
}
.pos-payment-box .input {
  min-height: 36px;
  padding: 7px 10px;
  font-size: .8rem;
  border-radius: 12px;
}
.pos-total-box {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 7px 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(148, 163, 184, .18);
  font-size: .8rem;
  align-items: center;
}
.pos-total-box strong {
  justify-self: end;
}
.pos-total-box .grand {
  color: #155bd8;
  font-size: 1.16rem;
  font-weight: 900;
  letter-spacing: -.03em;
}
.loyalty-mini-card,
.pos-loyalty-summary {
  display: grid;
  gap: 8px;
  border: 1px solid rgba(16, 185, 129, .18);
  background: linear-gradient(135deg, rgba(236, 253, 245, .96), rgba(240, 249, 255, .9));
  border-radius: 16px;
  padding: 11px 12px;
  color: #064e3b;
}
.loyalty-mini-card > div:first-child,
.pos-loyalty-summary {
  align-items: center;
}
.loyalty-mini-card > div:first-child {
  display: flex;
  gap: 8px;
}
.loyalty-mini-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.loyalty-mini-stats span {
  display: grid;
  gap: 2px;
  padding: 8px;
  border-radius: 12px;
  background: rgba(255,255,255,.72);
}
.loyalty-mini-card small,
.pos-loyalty-summary small {
  color: #047857;
  font-weight: 700;
}
.pos-loyalty-summary {
  grid-template-columns: auto auto minmax(0, 1fr);
  gap: 8px;
  padding: 9px 10px;
  font-size: .78rem;
}
.pos-loyalty-summary small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pos-save {
  width: 100%;
  min-height: 46px;
  border-radius: 16px;
  font-size: .92rem;
  box-shadow: 0 16px 30px rgba(91, 45, 242, .2);
}
.pos-hold {
  width: 100%;
  min-height: 38px;
  border-radius: 14px;
}
.pos-empty {
  grid-column: 1 / -1;
  min-height: 170px;
  display: grid;
  place-items: center;
  text-align: center;
  color: #64748b;
  border: 1px dashed rgba(148, 163, 184, .24);
  border-radius: 22px;
  padding: 22px;
  background: linear-gradient(145deg, rgba(248,250,252,.92), rgba(255,255,255,.88));
}
.pos-empty .icon {
  width: 22px;
  height: 22px;
}
.pos-empty strong {
  color: #0f172a;
  display: block;
  margin-top: 6px;
}
.pos-empty p {
  margin: 6px 0 0;
  font-size: .76rem;
}
.pos-empty.mini {
  min-height: 110px;
}
.pos-deals-state {
  min-height: 220px;
}
.pos-receipt-modal { position: fixed; inset: 0; z-index: 1400; display: grid; place-items: center; padding: 18px; }
.pos-receipt-backdrop { position: absolute; inset: 0; background: rgba(15, 23, 42, .56); backdrop-filter: blur(6px); }
.pos-receipt-dialog { position: relative; width: min(470px, 96vw); max-height: min(720px, 92vh); overflow-y: auto; overflow-x: hidden; background: #f8fafc; border: 1px solid rgba(255,255,255,.52); border-radius: 24px; box-shadow: 0 28px 80px rgba(15, 23, 42, .32); padding: 14px; box-sizing: border-box; }
.pos-receipt-paper { width: 100%; max-width: 100%; box-sizing: border-box; background: #fff; color: #111827; border-radius: 18px; padding: 16px; font-family: Consolas, "Lucida Console", "Courier New", monospace; box-shadow: inset 0 0 0 1px rgba(15, 23, 42, .08); overflow: hidden; }
.pos-receipt-paper * { box-sizing: border-box; min-width: 0; }
.pos-receipt-head { text-align: center; border-bottom: 1px dashed #94a3b8; padding-bottom: 10px; margin-bottom: 10px; }
.pos-receipt-brand { display: grid; justify-items: center; gap: 6px; margin-bottom: 8px; }
.pos-receipt-brand img { max-width: 150px; max-height: 68px; object-fit: contain; }
.pos-receipt-company { font-family: Inter, "Segoe UI", sans-serif; font-size: 1rem; font-weight: 900; line-height: 1.2; letter-spacing: -.01em; }
.pos-receipt-branch { font-size: .78rem; font-weight: 800; color: #475569; }
.pos-receipt-company-detail { font-size: .72rem; color: #64748b; line-height: 1.35; }
.pos-receipt-head h2 { margin: 0 0 4px; font-size: 1.2rem; }
.pos-receipt-head p { margin: 2px 0; font-size: .78rem; color: #475569; }
.pos-receipt-meta, .pos-receipt-total-row { display: flex; justify-content: space-between; gap: 10px; font-size: .78rem; margin: 5px 0; min-width: 0; }
.pos-receipt-meta strong { text-align: right; overflow-wrap: anywhere; }
.pos-receipt-paper table { width: 100%; max-width: 100%; table-layout: fixed; border-collapse: collapse; margin: 12px 0; font-size: .72rem; }
.pos-receipt-paper th, .pos-receipt-paper td { border-bottom: 1px dashed #cbd5e1; padding: 6px 3px; text-align: left; vertical-align: top; overflow-wrap: anywhere; }
.pos-receipt-paper th:first-child, .pos-receipt-paper td:first-child { width: 42%; }
.pos-receipt-paper th:nth-child(2), .pos-receipt-paper td:nth-child(2) { width: 15%; text-align: right; }
.pos-receipt-paper th:nth-child(3), .pos-receipt-paper td:nth-child(3) { width: 18%; text-align: right; }
.pos-receipt-paper th:nth-child(4), .pos-receipt-paper td:nth-child(4) { width: 25%; text-align: right; }
.pos-receipt-paper th:last-child, .pos-receipt-paper td:last-child { text-align: right; }
.pos-receipt-totals { border-top: 1px dashed #94a3b8; padding-top: 8px; }
.pos-receipt-total-row.grand { font-size: .98rem; font-weight: 900; color: #155bd8; }
.pos-receipt-footer { border-top: 1px dashed #cbd5e1; margin-top: 10px; padding-top: 8px; display: grid; gap: 4px; text-align: center; font-size: .72rem; color: #475569; }
.pos-receipt-actions { display: flex; gap: 10px; justify-content: flex-end; margin-top: 12px; flex-wrap: wrap; }

@media (max-width: 1620px) {
  #page-product .product-layout {
    grid-template-columns: minmax(220px, 250px) minmax(0, 1fr);
  }

  #page-product .product-side {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    align-items: start;
  }

  #page-product .product-side > .product-image-panel {
    grid-column: auto;
  }

  #page-product .product-image-panel {
    align-self: start;
  }

  #page-product .product-image-preview {
    max-width: 320px;
    margin: 0 auto;
  }

  #page-product .entry-action-bar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1180px) {
  .pos-shell { grid-template-columns: 1fr; min-height: auto; }
  .pos-cart-panel { position: static; max-height: none; }
  #page-product .entry-action-bar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  #page-pos.page { padding: 8px 8px 84px; }
  .pos-workspace-root { min-height: auto; margin-top: -6px; }
  .pos-shell { grid-template-columns: 1fr; gap: 10px; min-height: auto; }
  .pos-main, .pos-cart-panel { border-radius: 20px; }
  .pos-main { padding: 12px; }
  .pos-toolbar { align-items: flex-start; }
  .pos-toolbar h1 { font-size: 1rem; }
  .pos-toolbar p { display: block; }
  .pos-toolbar-metrics { width: 100%; }
  .pos-toolbar-pill { min-height: 28px; }
  .pos-search { grid-template-columns: minmax(0, 1fr) auto; min-height: 46px; }
  .pos-search > span { display: none; }
  .pos-category-tabs button { max-width: 150px; min-height: 34px; }
  .pos-grid-shell { padding: 10px; }
  .pos-grid-head { align-items: flex-start; }
  .pos-grid-hint { width: 100%; }
  .pos-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); min-height: auto; overflow: visible; gap: 8px; padding-right: 0; }
  .pos-product-card { padding: 8px; border-radius: 18px; }
  .pos-product-image { height: 98px; border-radius: 16px; }
  .pos-product-meta { align-items: flex-start; flex-direction: column; }
  .pos-cart-panel { max-height: none; overflow: visible; padding: 12px; }
  .pos-cart-body { grid-template-rows: auto auto; }
  .pos-cart-lines { max-height: none; overflow: visible; }
  .pos-cart-line { grid-template-columns: minmax(0, 1fr) auto auto; grid-template-areas: "copy qty remove" "copy total remove"; align-items: center; }
  .pos-cart-item-copy { grid-area: copy; }
  .pos-qty { grid-area: qty; justify-self: end; }
  .pos-cart-line > b { grid-area: total; justify-self: end; }
  .pos-cart-line > .icon-button { grid-area: remove; justify-self: end; }
  .pos-payment-box { grid-template-columns: 1fr; }
  .pos-checkout-box { padding: 10px; }
  .pos-save { position: sticky; bottom: 0; }
  .pos-receipt-dialog { width: min(390px, 96vw); padding: 10px; border-radius: 20px; }
  .pos-receipt-paper { padding: 12px; border-radius: 15px; }
  .pos-receipt-paper table { font-size: .68rem; }
}

@media (min-width: 761px) and (max-width: 980px) {
  .pos-shell { grid-template-columns: 1fr; }
  .pos-cart-panel { position: static; max-height: none; }
  .pos-product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pos-payment-box { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.empty-state { padding: 14px 0; color: var(--muted); font-size: 12px; }
.source-summary { color: var(--muted); font-size: 12px; font-weight: 700; min-height: 22px; padding: 6px 2px 2px; }
.status-toast {
  position: fixed;
  left: auto;
  top: calc(var(--topbar-height, 76px) + 14px);
  right: 24px;
  bottom: auto;
  transform: none;
  z-index: 240;
  width: min(380px, calc(100vw - var(--workspace-nav-width, 82px) - 48px));
  max-width: min(380px, calc(100vw - var(--workspace-nav-width, 82px) - 48px));
  padding: 12px 16px;
  border-radius: 12px;
  border: 1px solid #bce8c8;
  background: #f0fff5;
  color: #107c3f;
  box-shadow: 0 18px 48px rgba(15, 23, 42, .14);
  font-weight: 800;
  pointer-events: auto;
}
.status-toast.error {
  border-color: #ffd0d0;
  background: #fff4f4;
  color: #dc2626;
}
.status-toast.hidden { display: none; }
.vendro-toast-stack {
  position: fixed;
  top: calc(var(--topbar-height, 56px) + 14px);
  right: 24px;
  z-index: 260;
  display: grid;
  gap: 10px;
  width: min(390px, calc(100vw - var(--workspace-nav-width, 82px) - 48px));
  pointer-events: none;
}
.vendro-toast {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) 28px;
  align-items: center;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(148, 163, 184, .26);
  border-radius: 16px;
  background: rgba(255, 255, 255, .96);
  color: #0f172a;
  box-shadow: 0 18px 50px rgba(15, 23, 42, .16);
  backdrop-filter: blur(14px);
  pointer-events: auto;
  animation: vendroToastIn .2s ease-out both;
}
.vendro-toast.success { border-color: rgba(22, 163, 74, .24); }
.vendro-toast.error { border-color: rgba(220, 38, 38, .26); }
.vendro-toast.info { border-color: rgba(37, 99, 235, .22); }
.vendro-toast-icon {
  width: 34px;
  height: 34px;
  display: inline-grid;
  place-items: center;
  border-radius: 12px;
  color: #2563eb;
  background: #eff6ff;
}
.vendro-toast.success .vendro-toast-icon {
  color: #15803d;
  background: #ecfdf3;
}
.vendro-toast.error .vendro-toast-icon {
  color: #dc2626;
  background: #fff1f2;
}
.vendro-toast-text {
  min-width: 0;
  color: #10203f;
  font-size: .86rem;
  font-weight: 800;
  line-height: 1.35;
}
.vendro-toast-close {
  width: 28px;
  height: 28px;
  display: inline-grid;
  place-items: center;
  border: 0;
  border-radius: 10px;
  color: #64748b;
  background: transparent;
  cursor: pointer;
}
.vendro-toast-close:hover { background: #f1f5f9; color: #0f172a; }
.vendro-toast.closing { animation: vendroToastOut .18s ease-in both; }
.vendro-loading-overlay {
  position: fixed;
  inset: 0;
  z-index: 255;
  display: grid;
  place-items: start center;
  padding-top: calc(var(--topbar-height, 56px) + 18px);
  background: rgba(15, 23, 42, .08);
  pointer-events: none;
}
.vendro-loading-overlay.hidden { display: none; }
.vendro-loading-card {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  padding: 10px 16px;
  border: 1px solid rgba(148, 163, 184, .22);
  border-radius: 999px;
  background: rgba(255, 255, 255, .96);
  color: #172554;
  box-shadow: 0 18px 50px rgba(15, 23, 42, .13);
  font-size: .85rem;
  font-weight: 900;
  backdrop-filter: blur(14px);
}
.vendro-loading-spinner {
  width: 18px;
  height: 18px;
  border-radius: 999px;
  border: 3px solid #dbeafe;
  border-top-color: #5b2df5;
  animation: vendroSpin .8s linear infinite;
}
@keyframes vendroToastIn {
  from { opacity: 0; transform: translateY(-8px) scale(.98); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes vendroToastOut {
  to { opacity: 0; transform: translateY(-8px) scale(.98); }
}
@keyframes vendroSpin {
  to { transform: rotate(360deg); }
}
.main-shell:has(#page-sale.active),
.main-shell:has(#page-purchase.active) {
  grid-template-rows: auto minmax(0, 1fr) auto;
}
.main-shell:has(#page-sale.active) .app-footer,
.main-shell:has(#page-purchase.active) .app-footer {
  display: flex;
  justify-content: flex-end;
  text-align: right;
}
.help-center {
  position: fixed;
  inset: 0;
  z-index: 82;
  display: grid;
  place-items: center;
  padding: 24px;
}
.help-center.hidden { display: none; }
.entitlement-note {
  margin: 0 0 16px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid #f3d7a8;
  background: #fff7ea;
  color: #8a4f00;
  font-size: 13px;
  font-weight: 700;
}
.muted-inline {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}
.help-dialog {
  position: relative;
  width: min(1180px, calc(100vw - 40px));
  max-height: calc(100vh - 48px);
  border: 1px solid var(--line);
  border-radius: 24px;
  background: rgba(255,255,255,.98);
  box-shadow: 0 30px 70px rgba(15, 23, 42, 0.28);
  overflow: hidden;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}
.help-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 18px 22px;
  border-bottom: 1px solid var(--line);
  background: rgba(248, 250, 252, 0.92);
}
.help-head small { display: block; color: var(--subtle); margin-bottom: 4px; }
.help-head strong { font-size: 20px; }
.help-layout {
  display: grid;
  grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
  min-height: 0;
}
.help-menu {
  min-width: 0;
  overflow: auto;
  padding: 18px;
  border-right: 1px solid var(--line);
  background: rgba(248, 250, 252, 0.84);
  display: grid;
  gap: 10px;
  align-content: start;
}
.help-menu button {
  border: 1px solid transparent;
  background: transparent;
  border-radius: 14px;
  padding: 12px 14px;
  text-align: left;
  display: grid;
  gap: 4px;
}
.help-menu button.active {
  border-color: rgba(91, 47, 242, 0.18);
  background: rgba(91, 47, 242, 0.08);
}
.help-menu small { color: var(--subtle); }
.help-body {
  min-width: 0;
  overflow: auto;
  padding: 24px;
}
.help-section-copy {
  display: grid;
  gap: 18px;
}
.help-section-copy h2,
.help-section-copy h3,
.help-section-copy p { margin: 0; }
.help-section-copy .panel { padding: 18px; }
.help-step-list,
.help-checklist {
  display: grid;
  gap: 12px;
}
.help-step-list article,
.help-checklist article {
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
  padding: 14px 16px;
}
.help-step-list small,
.help-checklist small { display: block; color: var(--subtle); margin-top: 4px; }
.help-topic-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 10px;
}
.help-topic-list button {
  min-height: 76px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
  text-align: left;
  padding: 12px 14px;
  display: grid;
  gap: 4px;
  color: var(--ink);
}
.help-topic-list button:hover,
.help-topic-list button.active {
  border-color: #b8cdf8;
  background: #f7faff;
}
.help-topic-list small,
.help-topic-keywords {
  color: var(--muted);
  line-height: 1.45;
}
.help-topic-detail {
  display: grid;
  gap: 12px;
}
.help-topic-answer {
  color: var(--ink);
  margin: 0;
  line-height: 1.55;
}
.help-topic-long {
  color: var(--subtle);
  line-height: 1.6;
}
.help-topic-preview-panel {
  background: #f8fbff;
}
.inline-action-group {
  grid-column: span 2;
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.inline-action-group small {
  color: var(--subtle);
  font-size: 12px;
}

.setup-shell {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}
.setup-nav {
  position: sticky;
  top: 80px;
  display: grid;
  gap: 8px;
  padding: 10px;
}
.setup-nav button {
  min-height: 62px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: transparent;
  display: grid;
  grid-template-columns: 38px 1fr;
  column-gap: 10px;
  align-items: center;
  text-align: left;
  padding: 10px;
  color: var(--ink);
}
.setup-nav button:hover, .setup-nav button.active {
  background: #f4f1ff;
  border-color: #ded6ff;
  color: var(--violet);
}
.setup-nav button > span { grid-row: span 2; width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; background: white; color: currentColor; }
.setup-nav small { color: var(--muted); font-size: 11px; line-height: 1.35; }
.setup-content { min-width: 0; }
.setup-tab { display: none; }
.setup-tab.active { display: grid; gap: 14px; }
.setup-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.setup-form-row {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) repeat(4, auto);
  gap: 12px;
  align-items: center;
  margin-bottom: 14px;
}
.setup-select { max-width: 280px; }
.switch-line {
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 8px 10px;
  display: grid !important;
  grid-template-columns: auto 1fr;
  gap: 10px;
  align-items: center;
  background: #fff;
}
.switch-line input { display: none; }
.switch-line span {
  width: 42px;
  height: 24px;
  border-radius: 999px;
  background: #d8deea;
  position: relative;
  transition: .18s ease;
}
.switch-line span::after {
  content: "";
  position: absolute;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: white;
  left: 3px;
  top: 3px;
  box-shadow: 0 2px 8px rgba(15,23,42,.18);
  transition: .18s ease;
}
.switch-line input:checked + span { background: var(--violet); }
.switch-line input:checked + span::after { transform: translateX(18px); }
.switch-line b { font-size: 12px; color: var(--ink); }
.rule-explainer {
  margin-top: 14px;
  padding: 14px;
  border: 1px solid #dfe7ff;
  border-radius: 12px;
  background: #f7f9ff;
}
.rule-explainer p, .roadmap-card p { color: var(--muted); line-height: 1.55; margin: 6px 0 0; }
.integration-stack { display: grid; gap: 14px; }
.integration-block {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fafbfe;
}
.integration-switch {
  justify-self: start;
  min-width: 260px;
  background: white;
}
.integration-switch-row {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
}
.import-guidance {
  margin-top: 14px;
  display: grid;
  gap: 8px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fafbfe;
}
.import-guidance p { color: var(--muted); margin: 0; line-height: 1.5; }
.import-guidance-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}
.import-columns {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
}
.import-columns span {
  color: var(--muted);
  font-weight: 800;
  font-size: 11px;
  text-transform: uppercase;
}
.import-columns code {
  white-space: normal;
  color: var(--ink);
}
.import-job-form { margin-top: 14px; }
.import-coverage-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 14px;
}
.import-coverage-card {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 14px 16px;
  background: #fff;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: start;
}
.import-coverage-card strong {
  display: block;
  margin-bottom: 4px;
}
.import-coverage-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}
.import-coverage-card.available {
  background: #fbfcff;
}
.import-sequence-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.import-sequence-step {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 14px 16px;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  align-items: start;
  background: #fff;
}
.import-sequence-step span {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: var(--violet-soft);
  color: var(--violet);
  font-weight: 800;
  font-size: 12px;
}
.import-sequence-step strong {
  display: block;
  margin-bottom: 4px;
}
.import-sequence-step p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}
.import-sequence-step.active {
  border-color: rgba(86, 62, 255, 0.32);
  box-shadow: 0 10px 24px rgba(86, 62, 255, 0.08);
  background: #fcfbff;
}
.import-sample {
  margin-top: 10px;
  border-top: 1px solid var(--line);
  padding-top: 10px;
}
.import-sample span {
  display: block;
  margin-bottom: 8px;
  color: var(--muted);
  font-weight: 800;
  font-size: 11px;
  text-transform: uppercase;
}
.import-sample pre {
  margin: 0;
  padding: 12px 14px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: auto;
  font-size: 12px;
  line-height: 1.5;
  color: var(--ink);
}
.table-wrap td small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
}
.import-row-preview-panel {
  overflow: hidden;
}
.import-row-preview-panel .table-wrap {
  max-width: 100%;
  max-height: min(440px, calc(100vh - 280px));
  overflow: auto;
}
.import-row-review-table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
}
.import-row-review-table th:nth-child(1),
.import-row-review-table td:nth-child(1) {
  width: 56px;
}
.import-row-review-table th:nth-child(2),
.import-row-review-table td:nth-child(2) {
  width: 92px;
}
.import-row-review-table th:nth-child(3),
.import-row-review-table td:nth-child(3) {
  width: 130px;
}
.import-row-review-table th:nth-child(4),
.import-row-review-table td:nth-child(4) {
  width: 190px;
}
.import-row-review-table th:nth-child(5),
.import-row-review-table td:nth-child(5) {
  width: auto;
}
.import-row-error,
.import-row-data code {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.import-row-data code {
  display: block;
  max-height: 76px;
  overflow: auto;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
  color: var(--ink);
  line-height: 1.35;
  font-size: 11px;
}
.import-document-preview {
  margin-top: 12px;
  display: grid;
  gap: 10px;
}
.import-document-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 8px;
}
.import-document-card {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
}
.import-document-card span {
  font-size: 11px;
  color: var(--muted);
  font-weight: 800;
}
.import-document-card b {
  color: var(--ink);
}
.import-document-card small {
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.import-document-card em {
  width: fit-content;
  padding: 3px 7px;
  border-radius: 999px;
  background: rgba(34, 197, 94, .12);
  color: #15803d;
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
}
.import-document-card.has-warning em {
  background: rgba(245, 158, 11, .14);
  color: #b45309;
}
@media (max-width: 960px) {
  .import-guidance-grid,
  .import-coverage-grid,
  .import-sequence-grid {
    grid-template-columns: 1fr;
  }
}
.roadmap-card { min-height: 150px; }
.roadmap-card > span { width: 42px; height: 42px; display: grid; place-items: center; color: var(--violet); background: var(--violet-soft); border-radius: 13px; margin-bottom: 14px; }

.manufacturing-shell {
  display: grid;
  gap: 18px;
}

.manufacturing-entry-shell {
  grid-template-columns: 1fr;
}

.manufacturing-master-card,
.manufacturing-form-card,
.manufacturing-lines-card,
.manufacturing-summary-card {
  border-radius: 18px;
}

.manufacturing-summary-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 180px)) minmax(240px, 1fr);
  gap: 12px;
  align-items: stretch;
  margin-bottom: 16px;
}

.manufacturing-stat {
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fafbfe;
  display: grid;
  gap: 6px;
}

.manufacturing-stat span,
.manufacturing-inline-note,
.master-code + .muted-text {
  color: var(--muted);
}

.manufacturing-stat strong {
  font-size: 26px;
  line-height: 1;
  color: var(--ink);
}

.manufacturing-inline-note {
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid #dfe5f5;
  background: linear-gradient(180deg, #fafbff 0%, #f5f7ff 100%);
  display: flex;
  align-items: flex-start;
  min-width: 0;
  line-height: 1.55;
  white-space: normal;
  overflow-wrap: anywhere;
}

.manufacturing-master-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 420px) auto;
  gap: 12px;
  align-items: center;
  margin-bottom: 16px;
}

.manufacturing-master-toolbar-wide {
  grid-template-columns: minmax(240px, 1.35fr) minmax(180px, .7fr) auto;
}

.manufacturing-master-table th,
.manufacturing-master-table td,
.manufacturing-lines-table th,
.manufacturing-lines-table td {
  vertical-align: middle;
}

.manufacturing-master-table td,
.manufacturing-lines-table td {
  padding-top: 14px;
  padding-bottom: 14px;
}

.manufacturing-lines-wrap {
  overflow-x: auto;
}

.manufacturing-lines-table {
  min-width: 1120px;
}

.manufacturing-lines-table .input {
  min-width: 120px;
}

.manufacturing-lines-table td:nth-child(2) .input,
.manufacturing-lines-table td:nth-child(3) .input {
  min-width: 220px;
}

.manufacturing-form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.manufacturing-form-grid > label {
  display: grid;
  gap: 8px;
  font-size: 12px;
  font-weight: 800;
  color: var(--muted);
  text-transform: uppercase;
}

.manufacturing-form-grid .wide-field {
  grid-column: 1 / -1;
}

.manufacturing-form-grid textarea {
  min-height: 110px;
}

.manufacturing-flag {
  align-self: end;
  min-height: 48px;
}

.manufacturing-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.manufacturing-section-head h2 {
  margin: 0;
}

.manufacturing-section-head p {
  margin: 6px 0 0;
  color: var(--muted);
  line-height: 1.5;
}

.manufacturing-summary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.manufacturing-detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(320px, .95fr);
  gap: 16px;
}

.manufacturing-sub-card,
.manufacturing-reversal-card {
  display: grid;
  gap: 14px;
}

.manufacturing-stage-wrap {
  overflow-x: auto;
  overflow-y: visible;
}

.manufacturing-lookup-field {
  position: relative;
}

.manufacturing-lookup-panel {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  z-index: 25;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--panel);
  box-shadow: 0 18px 38px rgba(15, 23, 42, 0.12);
  max-height: 260px;
  overflow: auto;
  padding: 6px;
}

.manufacturing-lookup-option {
  width: 100%;
  border: 0;
  background: transparent;
  border-radius: 12px;
  padding: 10px 12px;
  text-align: left;
  display: grid;
  gap: 3px;
  cursor: pointer;
  color: var(--ink);
}

.manufacturing-lookup-option:hover,
.manufacturing-lookup-option:focus-visible {
  background: color-mix(in srgb, var(--accent) 8%, white 92%);
  outline: none;
}

.manufacturing-lookup-option-title {
  font-weight: 700;
  line-height: 1.3;
}

.manufacturing-lookup-option small,
.manufacturing-lookup-empty {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.manufacturing-lookup-empty {
  padding: 12px;
}

.manufacturing-stage-table {
  width: 100%;
  min-width: 1080px;
  table-layout: fixed;
}

.manufacturing-stage-table th:nth-child(1),
.manufacturing-stage-table td:nth-child(1) {
  width: 20%;
}

.manufacturing-stage-table th:nth-child(2),
.manufacturing-stage-table td:nth-child(2) {
  width: 12%;
}

.manufacturing-stage-table th:nth-child(3),
.manufacturing-stage-table td:nth-child(3),
.manufacturing-stage-table th:nth-child(4),
.manufacturing-stage-table td:nth-child(4) {
  width: 14%;
}

.manufacturing-stage-table th:nth-child(6),
.manufacturing-stage-table td:nth-child(6) {
  width: 110px;
}

.manufacturing-stage-table .input {
  min-width: 0;
  width: 100%;
  font-size: 13px;
  padding: 10px 12px;
}

.manufacturing-stage-table .row-actions .fit {
  min-width: 92px;
}

.manufacturing-stage-date {
  font-size: 12px;
  line-height: 1.35;
  color: var(--muted);
  overflow-wrap: anywhere;
}

.manufacturing-qc-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.manufacturing-reversal-grid {
  grid-template-columns: 1fr;
}

.manufacturing-inline-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

#manufacturingCompletionHint {
  flex: 1 1 280px;
  color: var(--muted);
}

.manufacturing-stage-layout {
  align-items: start;
}

.manufacturing-summary-card {
  padding: 18px 20px;
  display: grid;
  gap: 10px;
}

.manufacturing-summary-card span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.manufacturing-summary-card strong {
  font-size: 32px;
  line-height: 1;
  color: var(--ink);
}

.manufacturing-footer-actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}

.manufacturing-footer-actions-wide {
  align-items: stretch;
}

.manufacturing-footer-actions-right {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  flex-wrap: wrap;
}

.row-actions {
  white-space: nowrap;
}

.row-success {
  background: rgba(33, 180, 97, 0.08);
}

.row-risk {
  background: rgba(239, 59, 70, 0.06);
}

.manufacturing-stage-process-table th {
  white-space: normal;
  line-height: 1.25;
}

.manufacturing-stage-process-table td {
  vertical-align: top;
}

.manufacturing-stage-process-table th:nth-child(3),
.manufacturing-stage-process-table td:nth-child(3),
.manufacturing-stage-process-table th:nth-child(4),
.manufacturing-stage-process-table td:nth-child(4) {
  width: 14%;
}

.manufacturing-stage-process-table th:nth-child(5),
.manufacturing-stage-process-table td:nth-child(5) {
  width: 82px;
}

.manufacturing-stage-process-table th:nth-child(6),
.manufacturing-stage-process-table td:nth-child(6) {
  width: 112px;
}

.manufacturing-stage-process-table th:nth-child(7),
.manufacturing-stage-process-table td:nth-child(7),
.manufacturing-stage-process-table th:nth-child(8),
.manufacturing-stage-process-table td:nth-child(8) {
  width: 10%;
}

.manufacturing-stage-process-table th:nth-child(9),
.manufacturing-stage-process-table td:nth-child(9) {
  width: 16%;
}

.manufacturing-stage-process-table th:nth-child(10),
.manufacturing-stage-process-table td:nth-child(10) {
  width: 98px;
}

.manufacturing-stage-process-table .input[type="number"] {
  text-align: right;
}

.manufacturing-stage-process-table .row-actions {
  text-align: right;
}

.manufacturing-master-table tr.row-selected td {
  background: rgba(91, 68, 243, 0.06);
}

.manufacturing-material-issue-detail {
  margin-top: 18px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(248, 250, 255, 0.9);
  padding: 18px;
}

.manufacturing-material-issue-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.manufacturing-material-issue-head strong {
  display: block;
  font-size: 18px;
  color: var(--ink);
}

.manufacturing-material-issue-head small {
  display: block;
  color: var(--muted);
  margin-top: 4px;
}

.manufacturing-material-issue-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}

.manufacturing-material-issue-summary div {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 12px 14px;
  background: var(--panel);
}

.manufacturing-material-issue-summary span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 6px;
}

.manufacturing-material-issue-summary strong {
  color: var(--ink);
  font-size: 20px;
}

.manufacturing-job-work-payment-table {
  min-width: 780px;
}

.manufacturing-job-work-payment-table th:nth-child(1),
.manufacturing-job-work-payment-table td:nth-child(1) {
  width: 20%;
}

.manufacturing-job-work-payment-table th:nth-child(2),
.manufacturing-job-work-payment-table td:nth-child(2) {
  width: 16%;
}

.manufacturing-job-work-payment-table th:nth-child(3),
.manufacturing-job-work-payment-table td:nth-child(3) {
  width: 14%;
}

.manufacturing-job-work-payment-table th:nth-child(4),
.manufacturing-job-work-payment-table td:nth-child(4) {
  width: 20%;
}

.manufacturing-job-work-payment-table th:nth-child(6),
.manufacturing-job-work-payment-table td:nth-child(6) {
  width: 94px;
}

.manufacturing-payment-status {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  border-radius: 999px;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 700;
}

.manufacturing-payment-status.partial {
  color: #8a5b00;
  background: rgba(255, 184, 0, 0.14);
}

.manufacturing-payment-status.paid {
  color: #117a4f;
  background: rgba(33, 180, 97, 0.14);
}

.manufacturing-history-summary,
.manufacturing-history-quality-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
}

.manufacturing-history-metric {
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 14px 16px;
  background: var(--panel);
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.manufacturing-history-metric span {
  font-size: 12px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
}

.manufacturing-history-metric strong {
  font-size: 16px;
  color: var(--ink);
  line-height: 1.35;
}

.manufacturing-history-empty {
  border: 1px dashed var(--line);
  border-radius: 16px;
  padding: 18px;
  color: var(--muted);
  background: color-mix(in srgb, var(--panel) 92%, white 8%);
}

.master-code {
  font-weight: 800;
  color: var(--ink);
}

.mobile-nav { display: none; }

@media (max-width: 1320px) {
  .metric-grid { grid-template-columns: repeat(3, 1fr); }
  .dashboard-grid, .history-grid, .product-layout, .setup-shell, .party-layout { grid-template-columns: 1fr; }
  .platform-admin-shell,
  .platform-admin-toggle-grid,
  .platform-admin-fields,
  .platform-admin-flag-row,
  .platform-admin-assignment-form,
  .platform-admin-toggle-list,
  .platform-admin-list-summary { grid-template-columns: 1fr; }
  .dashboard-grid > .panel,
  .dashboard-grid > .sales-analytics,
  .dashboard-grid > .table-panel,
  .dashboard-grid > .stock-alerts,
  .dashboard-grid > .products-panel { grid-column: auto; }
  .table-panel { grid-column: auto; }
  .product-side, .variant-shelf, .setup-nav { position: static; }
  .setup-nav { grid-template-columns: repeat(3, 1fr); }
  .invoice-layout { grid-template-columns: 1fr; }
  .cart-row { grid-template-columns: minmax(180px, 1fr) 84px 128px 90px 96px 100px 42px; }
}

@media (max-width: 1500px) and (min-width: 1321px) {
  .cart-row {
    grid-template-columns: minmax(136px, 1fr) 68px 98px 68px 78px 82px 36px;
    gap: 8px;
    font-size: 12px;
  }
  .cart-row .input {
    padding-inline: 10px;
  }
}

@media (max-width: 980px) {
  .login-view { padding: 18px; }
  .login-hero { padding: 24px; }
  .login-panel-wrap { min-height: 100vh; padding: 22px 14px; }
  .login-card { width: min(100%, 520px); }
  .workspace-view { grid-template-columns: 1fr; }
  .sidebar { display: none; }
  .topbar { grid-template-columns: 1fr; height: auto; padding: 10px 14px; }
  .mobile-brand { display: flex; }
  .search { justify-self: stretch; order: 2; }
  .top-actions { justify-content: space-between; overflow-x: auto; padding-bottom: 2px; }
  .workspace-picker {
    min-width: 170px;
    max-width: 58vw;
    height: 40px;
  }
  .workspace-picker-label {
    gap: 3px;
  }
  .workspace-picker small,
  .workspace-picker b {
    font-size: 11px;
  }
  .profile { display: flex; padding: 0; }
  .page-host { padding: 0 14px 84px; }
  .app-footer { padding: 0 14px 92px; text-align: center; }
  .command-palette { padding-top: 18px; }
  .command-dialog { max-height: calc(100vh - 36px); border-radius: 16px; }
  .help-center { padding: 14px; }
  .help-dialog { width: calc(100vw - 28px); max-height: calc(100vh - 28px); border-radius: 18px; }
  .help-layout { grid-template-columns: 1fr; }
  .help-menu { border-right: 0; border-bottom: 1px solid var(--line); max-height: 220px; }
  .command-meta, .command-foot { align-items: flex-start; flex-direction: column; }
  .command-item { grid-template-columns: 38px minmax(0, 1fr); }
  .command-item em { display: none; }
  .mobile-nav {
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: 12px;
    z-index: 9999;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    background: var(--nav);
    border-radius: 16px;
    padding: 6px;
    box-shadow: 0 18px 50px rgba(0,0,0,.24);
    pointer-events: auto;
    transform: translateZ(0);
  }
  .mobile-nav button { border: 0; border-radius: 12px; min-height: 48px; color: #cbd6ea; background: transparent; display: grid; place-items: center; gap: 2px; font-size: 10px; pointer-events: auto; }
  .mobile-nav button.active { color: white; background: var(--violet); }
  .vendro-toast-stack {
    top: 12px;
    left: 12px;
    right: 12px;
    width: auto;
  }
  .vendro-loading-overlay {
    padding: 14px 12px 0;
    place-items: start center;
  }
  .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .form-grid.wide, .filters, .setup-card-grid, .party-list .filters, .product-master-filters { grid-template-columns: repeat(2, 1fr); }
  .setup-form-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .setup-nav { grid-template-columns: repeat(2, 1fr); }
  .manufacturing-summary-row,
  .manufacturing-master-toolbar,
  .manufacturing-master-toolbar-wide,
  .manufacturing-form-grid,
  .manufacturing-summary-grid,
  .manufacturing-detail-grid,
  .manufacturing-qc-grid {
    grid-template-columns: 1fr 1fr;
  }
  .cart-row { grid-template-columns: 1fr; border: 1px solid var(--line); border-radius: 14px; padding: 14px; }
  .cart-row .qty { max-width: 140px; }
  .sticky-actions { position: static; flex-wrap: wrap; background: transparent; padding: 18px 0 0; }
  .sticky-actions button { flex: 1; min-width: 150px; }
  #page-product .form-grid.wide { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .status-toast { top: 12px; right: 14px; left: 14px; width: auto; max-width: none; bottom: auto; transform: none; }
}

@media (max-width: 620px) {
  .login-view { padding: 12px; }
  .login-hero { padding: 18px; }
  .brand-row { font-size: 16px; top: 18px; left: 18px; transform: scale(.92); transform-origin: top left; }
  .brand-mark { width: 38px; height: 38px; }
  .login-panel-wrap { padding: 16px 10px; }
  .login-tools { top: 20px; right: 14px; }
  .login-card { padding: 22px 18px; border-radius: 24px; }
  .login-card-top { gap: 12px; }
  .login-card-mark { width: 52px; height: 52px; }
  .login-card h2 { font-size: 24px; margin-top: 0; }
  .form-row { gap: 8px; }
  .split-actions, .form-row, .page-head, .action-head { flex-direction: column; align-items: stretch; }
  .action-head { padding: 12px; }
  .page-heading {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .page-heading-actions {
    justify-content: flex-start;
  }
  .breadcrumb { width: 100%; overflow-x: auto; justify-content: flex-start; border-radius: 14px; }
  .breadcrumb button, .breadcrumb strong { white-space: nowrap; }
  .metric-grid, .form-grid, .form-grid.wide, .two-col, .filters, .total-grid, .donut-wrap, .setup-card-grid, .setup-form-row, .setup-nav, .party-list .filters, .product-master-filters, .party-form .form-grid.wide, .login-platform-strip { grid-template-columns: 1fr; }
  #page-product .form-grid.wide { grid-template-columns: 1fr; }
  .page-head h1 { font-size: 24px; }
  .action-cluster { justify-content: stretch; }
  .action-cluster button { flex: 1; }
  .manufacturing-summary-row,
  .manufacturing-master-toolbar,
  .manufacturing-master-toolbar-wide,
  .manufacturing-form-grid,
  .manufacturing-summary-grid,
  .manufacturing-detail-grid,
  .manufacturing-qc-grid {
    grid-template-columns: 1fr;
  }
  .manufacturing-section-head,
  .manufacturing-footer-actions,
  .manufacturing-inline-actions {
    flex-direction: column;
    align-items: stretch;
  }
  .manufacturing-footer-actions-right {
    justify-content: stretch;
  }
  .manufacturing-footer-actions-right button {
    flex: 1;
  }
  .quick-grid { grid-template-columns: 1fr 1fr; }
  .steps { grid-template-columns: 1fr; }
  .top-actions .icon-button:not(#openHelpCenterButton):not(#mobileSignOutButton) { display: none; }
  .workspace-picker small { display: none; }
  .mobile-signout-button { display: inline-grid; }
  .inline-action-group { grid-column: auto; align-items: flex-start; }
}

.module-workspace-root {
  display: grid;
  gap: 16px;
}

.module-head {
  align-items: start;
}

.module-workspace-grid {
  display: grid;
  gap: 16px;
}

.restaurant-workspace { display: grid; gap: 10px; min-width: 0; }
.restaurant-shell { display: grid; grid-template-columns: minmax(260px, 300px) minmax(0, 1fr); gap: 12px; min-height: auto; align-items: start; }
.restaurant-floors,
.restaurant-main,
.restaurant-footer { border-radius: 14px; background: #fff; box-shadow: 0 10px 30px rgba(15, 23, 42, .06); }
.restaurant-side-head,
.restaurant-main-head,
.restaurant-footer { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.restaurant-side-head div,
.restaurant-title { display: flex; align-items: center; gap: 12px; }
.restaurant-side-head h2,
.restaurant-title h1 { margin: 0; font-size: 20px; color: #101a34; }
.restaurant-title p { margin: 4px 0 0; color: #52658b; font-size: 13px; }
.restaurant-floor-list { display: grid; gap: 8px; margin-top: 10px; max-height: min(420px, calc(100vh - 280px)); overflow: auto; padding-right: 2px; }
.restaurant-floor-card { min-height: 64px; display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: 10px; border: 1px solid #e4eaf5; border-radius: 10px; background: #fff; padding: 8px 11px; text-align: left; cursor: pointer; }
.restaurant-floor-card.active { border-color: #2f6df6; box-shadow: 0 8px 24px rgba(47, 109, 246, .15); }
.restaurant-floor-card strong { display: block; color: #111b35; font-size: 16px; }
.restaurant-floor-card small { color: #53658a; font-size: 13px; }
.restaurant-floor-card b { min-width: 36px; padding: 8px; border-radius: 9px; background: #edf3ff; color: #1c63ff; text-align: center; }
.floor-icon,
.restaurant-title > span,
.table-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; background: #eef6ff; color: #1d63f2; }
.restaurant-hint { margin-top: 10px; display: flex; gap: 10px; align-items: flex-start; border: 1px solid #cfe0ff; background: #f5f9ff; border-radius: 10px; padding: 10px; color: #52658b; }
.restaurant-main { padding: 14px; min-width: 0; overflow: hidden; }
.restaurant-main-head { align-items: stretch; flex-direction: column; gap: 8px; }
.restaurant-summary-strip { width: 100%; display: grid; grid-template-columns: repeat(9, minmax(78px, 1fr)); gap: 6px; min-width: 0; }
.restaurant-summary { border: 1px solid #e5ebf5; border-radius: 9px; padding: 7px 8px; background: linear-gradient(180deg, #fff, #f9fbff); min-height: 62px; }
.restaurant-summary small { display: block; color: #50638a; font-weight: 800; font-size: 10.5px; line-height: 1.15; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.restaurant-summary b { display: block; margin-top: 4px; font-size: 19px; line-height: 1.1; color: #0f1933; }
.restaurant-summary.free { background: #f0fff4; border-color: #d8f7df; }
.restaurant-summary.occupied b { color: #e11d2e; }
.restaurant-summary.reserved b { color: #f97316; }
.restaurant-summary.printed b { color: #6d28d9; }
.restaurant-summary.danger b { color: #dc2626; }
.restaurant-view-tabs { display: none; }
.restaurant-view-tab { min-height: 42px; display: inline-flex; align-items: center; gap: 8px; padding: 0 14px; border: 1px solid #dbe4f2; border-radius: 999px; background: #fff; color: #31456f; font: inherit; font-weight: 700; cursor: pointer; }
.restaurant-view-tab.active { border-color: #2f6df6; background: #eef4ff; color: #1d63f2; }
.restaurant-toolbar { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(170px, 210px) auto; gap: 8px; align-items: center; margin: 10px 0 12px; }
.restaurant-search { min-height: 42px; display: flex; align-items: center; gap: 8px; border: 1px solid #e2e8f4; border-radius: 10px; padding: 0 12px; background: #fff; }
.restaurant-search input { width: 100%; border: 0; outline: 0; font: inherit; }
.restaurant-view-actions { display: flex; gap: 10px; justify-content: flex-end; }
.restaurant-view-actions .icon-button.active { border-color: #2f6df6; background: #f3f7ff; color: #1d63f2; }
.restaurant-table-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(205px, 1fr)); gap: 12px; }
.restaurant-table-card { min-height: 154px; display: grid; grid-template-rows: auto 1fr auto; gap: 12px; border: 1px solid #e2e8f4; border-bottom-width: 3px; border-radius: 10px; background: #fff; padding: 16px; text-align: left; cursor: pointer; transition: transform .16s ease, box-shadow .16s ease; }
.restaurant-table-card:hover { transform: translateY(-2px); box-shadow: 0 14px 28px rgba(15, 23, 42, .08); }
.restaurant-table-card.free { border-bottom-color: #22c55e; }
.restaurant-table-card.occupied { border-bottom-color: #ef4444; }
.restaurant-table-card.cleaning,
.restaurant-table-card.reserved { border-bottom-color: #f59e0b; }
.restaurant-table-card.printed { border-bottom-color: #8b5cf6; }
.restaurant-table-card[disabled] { opacity: .55; cursor: not-allowed; }
.table-card-top { display: grid; grid-template-columns: 44px 1fr auto; gap: 12px; align-items: start; }
.table-card-top strong { display: block; color: #111b35; font-size: 16px; }
.table-card-top small { color: #53658a; }
.table-card-top em { border-radius: 7px; padding: 7px 9px; background: #edf7ee; color: #16a34a; font-style: normal; font-weight: 800; font-size: 12px; }
.restaurant-table-card.occupied .table-card-top em { background: #ffe8e8; color: #dc2626; }
.restaurant-table-card.cleaning .table-card-top em,
.restaurant-table-card.reserved .table-card-top em { background: #fff3df; color: #ea580c; }
.restaurant-table-card.printed .table-card-top em { background: #f0e7ff; color: #6d28d9; }
.restaurant-table-card.free .table-icon { background: #e9fbee; color: #16a34a; }
.restaurant-table-card.occupied .table-icon { background: #ffe7e7; color: #dc2626; }
.restaurant-table-card.cleaning .table-icon,
.restaurant-table-card.reserved .table-icon { background: #fff2dc; color: #ea580c; }
.restaurant-table-card.printed .table-icon { background: #f2e8ff; color: #7c3aed; }
.table-amount { color: #e11d2e; font-size: 17px; padding-left: 56px; }
.table-spacer { min-height: 20px; }
.restaurant-card-note { display: grid; gap: 4px; margin-top: -4px; padding-left: 56px; }
.restaurant-card-note strong { color: #101a34; font-size: 13px; }
.restaurant-card-note small { color: #5b6e93; font-size: 12px; }
.table-card-meta { border-top: 1px solid #eef2f7; padding-top: 10px; display: flex; justify-content: space-between; color: #52658b; font-size: 13px; }
.table-card-meta span { display: inline-flex; align-items: center; gap: 6px; }
.table-card-meta i { display: inline-grid; }
.restaurant-card-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.restaurant-card-actions button { min-width: 92px; }

/* Compact dashboard card overrides: keep narrow table cards readable without header/status collisions. */
.restaurant-table-grid { grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }
.restaurant-table-card {
  grid-template-rows: auto minmax(24px, 1fr) auto auto;
  gap: 10px;
  padding: 14px;
  min-width: 0;
  overflow: hidden;
}
.table-card-top {
  grid-template-columns: 36px minmax(0, 1fr) auto;
  gap: 10px;
  min-width: 0;
}
.table-card-top > div { min-width: 0; }
.table-card-top strong {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  color: #111b35;
  font-size: 15px;
  line-height: 1.18;
  word-break: break-word;
}
.table-card-top small {
  display: block;
  margin-top: 4px;
  color: #53658a;
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.table-card-top em {
  align-self: start;
  max-width: 78px;
  padding: 6px 8px;
  font-size: 11px;
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.table-amount {
  padding-left: 46px;
  align-self: start;
}
.table-spacer { min-height: 18px; }
.restaurant-card-note {
  margin-top: -2px;
  padding-left: 46px;
  min-width: 0;
}
.restaurant-card-note strong,
.restaurant-card-note small {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-break: break-word;
}
.restaurant-card-note strong {
  -webkit-line-clamp: 2;
  line-height: 1.2;
}
.restaurant-card-note small {
  -webkit-line-clamp: 2;
  line-height: 1.25;
}
.table-card-meta {
  gap: 8px;
  padding-top: 9px;
  font-size: 12px;
  min-width: 0;
}
.table-card-meta span {
  min-width: 0;
  gap: 5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.restaurant-card-actions {
  gap: 8px;
  align-items: center;
}
.restaurant-card-actions button {
  min-width: 82px;
  min-height: 34px;
  padding: 7px 12px;
  font-size: 12px;
}
.restaurant-kitchen-grid,
.restaurant-waiter-grid,
.restaurant-reservation-list,
.restaurant-delivery-grid { display: grid; gap: 14px; align-items: start; }
.restaurant-kitchen-grid,
.restaurant-waiter-grid,
.restaurant-delivery-grid { grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); }
.restaurant-kitchen-ticket,
.restaurant-waiter-card { border: 1px solid #e2e8f4; border-radius: 12px; background: #fff; padding: 14px; display: grid; gap: 12px; min-width: 0; }
.restaurant-kitchen-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.restaurant-kitchen-head strong { color: #101a34; font-size: 16px; }
.restaurant-kitchen-head small { display: block; margin-top: 4px; color: #5b6e93; }
.restaurant-status-badge { display: inline-flex; align-items: center; justify-content: center; min-height: 32px; padding: 0 12px; border-radius: 999px; font-size: 12px; font-weight: 800; background: #eef4ff; color: #315fd8; }
.restaurant-status-badge.pending { background: #eef4ff; color: #315fd8; }
.restaurant-status-badge.sent,
.restaurant-status-badge.preparing { background: #fff4de; color: #c97516; }
.restaurant-status-badge.ready { background: #ebfff3; color: #169c55; }
.restaurant-status-badge.served { background: #e7f8ff; color: #0f7ea0; }
.restaurant-status-badge.outfordelivery,
.restaurant-status-badge.assigned { background: #ede9fe; color: #6d28d9; }
.restaurant-status-badge.delivered { background: #dcfce7; color: #15803d; }
.restaurant-status-badge.cancelled,
.restaurant-status-badge.delayed { background: #fee2e2; color: #b91c1c; }
.restaurant-status-badge.reserved { background: #fff2df; color: #ea580c; }
.restaurant-status-badge.neutral { background: #eef3fb; color: #4f5f82; }
.restaurant-kitchen-ticket.is-delayed { border-color: #fecaca; box-shadow: 0 12px 28px rgba(185, 28, 28, .08); }
.restaurant-kitchen-timeline { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.restaurant-timeline-step { min-width: 0; border: 1px solid #e6edf7; border-radius: 10px; padding: 8px; background: #f8fbff; color: #64748b; }
.restaurant-timeline-step.done { border-color: #bbf7d0; background: #f0fdf4; color: #166534; }
.restaurant-timeline-step i { display: block; width: 8px; height: 8px; border-radius: 50%; background: currentColor; margin-bottom: 5px; }
.restaurant-timeline-step b,
.restaurant-timeline-step small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.restaurant-timeline-step b { font-size: 11px; text-transform: uppercase; letter-spacing: .02em; }
.restaurant-timeline-step small { margin-top: 3px; font-size: 11px; }
.restaurant-ticket-meta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.restaurant-ticket-meta span { min-width: 0; border: 1px solid #edf2fa; border-radius: 10px; background: #fbfcff; padding: 8px 10px; color: #607394; font-size: 12px; }
.restaurant-ticket-meta strong { color: #101a34; }
.restaurant-kitchen-lines,
.restaurant-waiter-table-list { display: grid; gap: 8px; }
.restaurant-kitchen-line,
.restaurant-waiter-table { border: 1px solid #edf2fa; border-radius: 10px; background: #fbfcff; padding: 10px; text-align: left; min-width: 0; }
.restaurant-kitchen-line strong,
.restaurant-waiter-table strong { display: block; color: #0f1933; }
.restaurant-kitchen-line small,
.restaurant-waiter-table small { display: block; margin-top: 4px; color: #607394; }
.restaurant-kitchen-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.restaurant-kitchen-actions button { min-height: 36px; padding-inline: 12px; }
.delivery-card .restaurant-kitchen-head {
  align-items: center;
}
.delivery-card .restaurant-kitchen-head small {
  max-width: 42ch;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.delivery-card .restaurant-kitchen-lines {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.delivery-card .restaurant-kitchen-line:last-child:nth-child(odd) {
  grid-column: 1 / -1;
}
.restaurant-action-modal {
  position: fixed;
  inset: 0;
  z-index: 180;
  display: grid;
  place-items: center;
  padding: 22px;
  background: rgba(15, 23, 42, .42);
  backdrop-filter: blur(8px);
}
.restaurant-top-actions {
  display: flex;
  align-items: center;
  gap: 5px;
  flex-wrap: nowrap;
  padding: 6px;
  margin: 6px 0 8px;
  border-radius: 12px;
  background: rgba(255,255,255,.94);
  border: 1px solid #dbe6f7;
  box-shadow: 0 10px 24px rgba(15,23,42,.05);
  overflow-x: auto;
  scrollbar-width: thin;
  justify-content: flex-end;
}
.restaurant-top-actions button {
  flex: 0 0 auto;
  min-height: 34px;
  padding: 6px 7px;
  border-radius: 9px;
  font-size: 11.5px;
  line-height: 1;
  gap: 4px;
  white-space: nowrap;
}
.restaurant-top-actions button span[data-icon],
.restaurant-top-actions button svg {
  width: 14px;
  height: 14px;
}
.restaurant-action-dialog {
  max-width: min(720px, calc(100vw - 28px));
}
.restaurant-action-dialog .form-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.restaurant-action-dialog .span-2 {
  grid-column: 1 / -1;
}
.restaurant-dialog-note {
  margin: 10px 0 4px;
  padding: 12px 14px;
  border-radius: 14px;
  background: #fff8ed;
  border: 1px solid #fed7aa;
  color: #7c2d12;
  font-weight: 700;
}
.restaurant-manage-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 10px;
  margin: 12px 0 4px;
  max-height: 220px;
  overflow: auto;
}
.restaurant-manage-card {
  border: 1px solid #dbe6f7;
  border-radius: 16px;
  padding: 12px;
  background: linear-gradient(145deg, #ffffff, #f7fbff);
  display: grid;
  gap: 5px;
}
.restaurant-manage-card strong { color: #08152f; font-size: .95rem; }
.restaurant-manage-card span,
.restaurant-manage-card small { color: #557095; font-size: .8rem; }
.restaurant-transaction-dialog .restaurant-manage-list {
  max-height: 260px;
}
.restaurant-action-dialog {
  width: min(520px, 100%);
  display: grid;
  gap: 16px;
  border: 1px solid rgba(226, 232, 244, .96);
  border-radius: 18px;
  background: #fff;
  padding: 20px;
  box-shadow: 0 24px 70px rgba(15, 23, 42, .22);
}
.restaurant-action-dialog header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}
.restaurant-action-dialog h3 {
  margin: 0;
  color: #101a34;
  font-size: 20px;
}
.restaurant-action-dialog p {
  margin: 4px 0 0;
  color: #607394;
  line-height: 1.5;
}
.restaurant-action-dialog .form-grid {
  grid-template-columns: 1fr;
}
.restaurant-action-dialog textarea.input {
  min-height: 110px;
}
.restaurant-action-dialog footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}
.restaurant-footer { display: none; }
.restaurant-footer > strong,
.restaurant-footer > span { display: none; }
.restaurant-footer > div { margin-left: 0; display: flex; gap: 12px; flex-wrap: wrap; justify-content: flex-end; width: 100%; }
.restaurant-loading { min-height: 220px; display: grid; place-items: center; color: #52658b; }
.restaurant-loading.error { color: #b91c1c; background: #fff5f5; }
.restaurant-sale-banner { margin: -10px 0 16px; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 12px; border: 1px solid #cfe0ff; background: #f4f8ff; border-radius: 12px; padding: 12px 16px; }
.restaurant-sale-banner > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; background: #e8f0ff; color: #1d63f2; }
.restaurant-sale-copy { display: grid; gap: 4px; min-width: 0; }
.restaurant-sale-banner strong { color: #0f1933; }
.restaurant-sale-banner small { color: #52658b; }
.restaurant-sale-actions { grid-column: 1 / -1; display: flex; gap: 10px; flex-wrap: wrap; }

@media (max-width: 1280px) {
  .restaurant-shell { grid-template-columns: 280px minmax(0, 1fr); }
  .restaurant-table-grid { grid-template-columns: repeat(3, minmax(180px, 1fr)); }
  .restaurant-summary-strip { grid-template-columns: repeat(9, minmax(72px, 1fr)); min-width: 0; gap: 5px; }
  .restaurant-summary { padding: 6px 7px; min-height: 58px; }
  .restaurant-summary b { font-size: 17px; }
  .restaurant-kitchen-grid,
  .restaurant-waiter-grid,
  .restaurant-delivery-grid { grid-template-columns: 1fr; }
}

@media (max-width: 980px) {
  .restaurant-shell { grid-template-columns: 1fr; }
  .restaurant-toolbar { grid-template-columns: 1fr; }
  .restaurant-table-grid { grid-template-columns: repeat(2, minmax(170px, 1fr)); }
  .restaurant-sale-banner { grid-template-columns: auto 1fr; }
  .restaurant-main-head { flex-direction: column; }
  .restaurant-summary-strip { grid-template-columns: repeat(auto-fit, minmax(92px, 1fr)); gap: 8px; }
  .restaurant-action-dialog .form-grid { grid-template-columns: 1fr; }
  .restaurant-top-actions { gap: 8px; flex-wrap: wrap; }
  .restaurant-top-actions button { flex: 1 1 150px; justify-content: center; }
}

.module-hero-card,
.module-card-panel {
  background: linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(248,250,255,.92) 100%);
  border: 1px solid rgba(33, 54, 105, .08);
  border-radius: 22px;
  box-shadow: 0 14px 34px rgba(47, 72, 142, .07);
}

.module-hero-card {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(300px, .9fr);
  gap: 18px;
  padding: 22px;
  overflow: hidden;
  position: relative;
}

.module-hero-card.sales::after,
.module-hero-card.inventory::after,
.module-hero-card.manufacturing::after {
  content: "";
  position: absolute;
  inset: auto -60px -60px auto;
  width: 260px;
  height: 260px;
  background: radial-gradient(circle, rgba(124, 92, 255, .12) 0%, rgba(73, 192, 255, .06) 45%, transparent 72%);
  pointer-events: none;
}

.module-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(86, 102, 255, .08);
  color: #495ad0;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.module-hero-card h2 {
  margin: 12px 0 8px;
  font-size: 24px;
  line-height: 1.16;
  color: #10234d;
}

.module-hero-card p {
  margin: 0;
  max-width: 58ch;
  color: #5d6f96;
  font-size: 13px;
  line-height: 1.55;
}

.module-stat-stack {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.module-stat-card {
  display: flex;
  gap: 12px;
  align-items: start;
  width: 100%;
  padding: 14px;
  border-radius: 18px;
  background: rgba(255,255,255,.95);
  border: 1px solid rgba(33, 54, 105, .08);
  box-shadow: 0 8px 20px rgba(60, 79, 147, .06);
  color: inherit;
  font: inherit;
  text-align: left;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.module-stat-card.is-clickable:hover,
.module-stat-card.is-clickable:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(95, 104, 255, .28);
  box-shadow: 0 16px 34px rgba(60, 79, 147, .14);
  outline: none;
}

.module-stat-icon,
.module-action-icon,
.module-activity-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(73, 192, 255, .12) 0%, rgba(124, 92, 255, .1) 100%);
  color: #495ad0;
}

.module-stat-card small,
.module-card-panel small,
.module-activity-row small {
  display: block;
  color: #7384a8;
  font-size: 11px;
}

.module-stat-card strong {
  display: block;
  margin-top: 4px;
  font-size: 17px;
  line-height: 1.1;
  color: #10234d;
}

.module-stat-card em {
  display: block;
  margin-top: 6px;
  color: #6f809f;
  font-size: 11.5px;
  font-style: normal;
}

.module-card-panel {
  padding: 18px;
}

.module-section-head {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 12px;
  margin-bottom: 14px;
}

.module-section-head h3 {
  margin: 0;
  font-size: 16px;
  color: #10234d;
}

.module-action-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 14px;
}

.module-action-card {
  display: flex;
  gap: 14px;
  align-items: start;
  width: 100%;
  padding: 16px;
  border-radius: 18px;
  border: 1px solid rgba(33, 54, 105, .08);
  background: rgba(255,255,255,.96);
  box-shadow: 0 10px 22px rgba(64, 82, 146, .05);
  text-align: left;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.module-action-card:hover,
.module-action-card:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(95, 104, 255, .25);
  box-shadow: 0 18px 36px rgba(64, 82, 146, .12);
}

.module-action-card strong {
  display: block;
  color: #152754;
  font-size: 14px;
}

.module-action-card p {
  margin: 4px 0 0;
  color: #627498;
  font-size: 12px;
  line-height: 1.45;
}

.module-activity-list {
  display: grid;
  gap: 12px;
}

.module-activity-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  padding: 14px 16px;
  border-radius: 16px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(33, 54, 105, .08);
}

.module-activity-row strong {
  display: block;
  color: #152754;
}

.module-activity-row p {
  margin: 3px 0 0;
  color: #627498;
  font-size: 12px;
  line-height: 1.42;
}

.module-dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(320px, .95fr);
  gap: 16px;
  align-items: start;
}

.module-hero-stage {
  display: grid;
  gap: 16px;
}

.module-side-rail {
  display: grid;
  gap: 16px;
}

.module-kpi-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.module-report-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.module-side-rail .module-report-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.module-report-tile {
  display: grid;
  gap: 12px;
  justify-items: start;
  width: 100%;
  padding: 14px 14px;
  border-radius: 18px;
  border: 1px solid rgba(33, 54, 105, .08);
  background: rgba(255,255,255,.96);
  box-shadow: 0 8px 20px rgba(66, 84, 145, .05);
  text-align: left;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.module-report-tile:hover,
.module-report-tile:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(95, 104, 255, .22);
  box-shadow: 0 16px 30px rgba(66, 84, 145, .11);
}

.module-report-tile strong {
  color: #152754;
  font-size: 13px;
  line-height: 1.35;
}

.module-progress-layout {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.module-progress-meter {
  display: grid;
  gap: 10px;
  align-content: start;
}

.module-progress-meter strong {
  font-size: 28px;
  line-height: 1;
  color: #122858;
}

.module-progress-meter small {
  color: #7384a8;
  font-size: 12px;
}

.module-progress-bar {
  position: relative;
  height: 12px;
  border-radius: 999px;
  background: rgba(185, 199, 225, .45);
  overflow: hidden;
}

.module-progress-bar span {
  position: absolute;
  inset: 0 auto 0 0;
  border-radius: inherit;
  background: linear-gradient(90deg, #2e6df7 0%, #17b3a4 100%);
}

.module-breakdown-list {
  display: grid;
  gap: 10px;
}

.module-breakdown-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(33, 54, 105, .08);
}

.module-breakdown-row strong {
  display: block;
  color: #152754;
  font-size: 13px;
}

.module-breakdown-row p {
  margin: 3px 0 0;
  color: #6a7a9f;
  font-size: 11.5px;
  line-height: 1.45;
}

.module-breakdown-row b {
  color: #10234d;
  font-size: 16px;
}

.module-breakdown-row.good b {
  color: #0d8a66;
}

.module-breakdown-row.warn b {
  color: #c77b18;
}

.module-breakdown-row.risk b {
  color: #c25454;
}

.module-breakdown-row.neutral b {
  color: #2e6df7;
}

.module-empty-state {
  padding: 28px;
  border-radius: 18px;
  background: rgba(243, 246, 255, .8);
  color: #6c7d9f;
  text-align: center;
}

@media (max-width: 1180px) {
  .module-hero-card {
    grid-template-columns: 1fr;
  }

  .module-dashboard-grid,
  .manufacturing-dashboard-grid {
    grid-template-columns: 1fr;
  }

  .module-progress-layout,
  .manufacturing-progress-layout {
    grid-template-columns: 1fr;
  }

  .module-report-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .module-hero-card {
    padding: 22px;
  }

  .module-hero-card h2 {
    font-size: 26px;
  }

  .module-stat-stack,
  .module-action-grid,
  .module-kpi-grid,
  .module-report-grid {
    grid-template-columns: 1fr;
  }

  .module-section-head,
  .module-activity-row {
    grid-template-columns: 1fr;
  }
}

.manufacturing-dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(320px, .95fr);
  gap: 20px;
  align-items: start;
}

.manufacturing-hero-stage {
  display: grid;
  gap: 20px;
}

.manufacturing-hero-card {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(280px, .85fr);
  gap: 22px;
  padding: 28px;
  border-radius: 28px;
  background:
    linear-gradient(135deg, rgba(242, 248, 255, .96) 0%, rgba(230, 248, 255, .96) 52%, rgba(255,255,255,.98) 100%);
  border: 1px solid rgba(74, 111, 195, .12);
  box-shadow: 0 22px 54px rgba(69, 98, 165, .10);
}

.manufacturing-hero-copy h2 {
  margin: 18px 0 12px;
  font-size: 52px;
  line-height: 1.02;
  color: #0f2554;
  max-width: 720px;
}

.manufacturing-hero-copy p {
  margin: 0;
  max-width: 620px;
  color: #627498;
  font-size: 17px;
  line-height: 1.72;
}

.manufacturing-hero-visual {
  display: grid;
  place-items: center;
  min-height: 240px;
  position: relative;
}

.manufacturing-visual-platform {
  position: relative;
  width: 260px;
  height: 200px;
  border-radius: 36px;
  background: linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(226, 245, 255, .94) 100%);
  box-shadow: 0 26px 46px rgba(77, 111, 183, .18);
  transform: rotate(-7deg);
}

.manufacturing-visual-platform::before,
.manufacturing-visual-platform::after {
  content: "";
  position: absolute;
  border-radius: 24px;
  background: linear-gradient(180deg, rgba(99, 209, 255, .18) 0%, rgba(115, 112, 255, .1) 100%);
}

.manufacturing-visual-platform::before {
  inset: 18px 120px 86px 22px;
}

.manufacturing-visual-platform::after {
  inset: 96px 20px 24px 116px;
}

.manufacturing-visual-platform span {
  position: absolute;
  display: block;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(228, 240, 255, .95) 100%);
  box-shadow: 0 14px 28px rgba(84, 114, 181, .14);
}

.manufacturing-visual-platform span:nth-child(1) {
  width: 72px;
  height: 72px;
  top: 28px;
  left: 26px;
}

.manufacturing-visual-platform span:nth-child(2) {
  width: 88px;
  height: 56px;
  top: 34px;
  right: 26px;
}

.manufacturing-visual-platform span:nth-child(3) {
  width: 90px;
  height: 48px;
  left: 34px;
  bottom: 28px;
}

.manufacturing-visual-platform span:nth-child(4) {
  width: 54px;
  height: 54px;
  right: 38px;
  bottom: 34px;
}

.manufacturing-action-panel,
.manufacturing-activity-card,
.manufacturing-report-panel,
.manufacturing-progress-panel {
  background: linear-gradient(180deg, rgba(255,255,255,.97) 0%, rgba(249,251,255,.94) 100%);
  border: 1px solid rgba(33, 54, 105, .08);
  border-radius: 24px;
  box-shadow: 0 18px 40px rgba(56, 78, 144, .08);
}

.manufacturing-action-panel,
.manufacturing-report-panel,
.manufacturing-progress-panel,
.manufacturing-activity-card {
  padding: 24px;
}

.manufacturing-action-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.manufacturing-action-card {
  min-height: 136px;
}

.manufacturing-side-rail {
  display: grid;
  gap: 20px;
}

.manufacturing-kpi-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.manufacturing-kpi-card {
  min-height: 144px;
}

.module-activity-row.compact {
  padding: 14px 16px;
}

.manufacturing-report-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
}

.manufacturing-report-tile {
  display: grid;
  gap: 14px;
  justify-items: start;
  width: 100%;
  padding: 20px 18px;
  border-radius: 22px;
  border: 1px solid rgba(33, 54, 105, .08);
  background: rgba(255,255,255,.96);
  box-shadow: 0 12px 26px rgba(66, 84, 145, .06);
  text-align: left;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.manufacturing-report-tile:hover,
.manufacturing-report-tile:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(95, 104, 255, .22);
  box-shadow: 0 18px 34px rgba(66, 84, 145, .11);
}

.manufacturing-report-tile strong {
  color: #152754;
  font-size: 14px;
  line-height: 1.45;
}

.manufacturing-progress-layout {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  gap: 24px;
  align-items: center;
}

.manufacturing-progress-donut {
  --module-progress: 0;
  width: 210px;
  height: 210px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at center, #fff 0 58%, transparent 59%),
    conic-gradient(#17b3a4 0 calc(var(--module-progress) * 1%), #2e6df7 calc(var(--module-progress) * 1%) calc((var(--module-progress) + 18) * 1%), #9db2d9 calc((var(--module-progress) + 18) * 1%) calc((var(--module-progress) + 26) * 1%), #f5a34a calc((var(--module-progress) + 26) * 1%) 100%);
  box-shadow: inset 0 0 0 16px rgba(255,255,255,.42), 0 18px 34px rgba(70, 93, 162, .10);
}

.manufacturing-progress-donut > div {
  display: grid;
  justify-items: center;
  gap: 6px;
}

.manufacturing-progress-donut strong {
  font-size: 38px;
  line-height: 1;
  color: #122858;
}

.manufacturing-progress-donut small {
  color: #7384a8;
}

.manufacturing-progress-breakdown {
  display: grid;
  gap: 12px;
}

.manufacturing-progress-breakdown article {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(249, 251, 255, .9);
  border: 1px solid rgba(33, 54, 105, .07);
}

.manufacturing-progress-breakdown strong {
  color: #18305f;
}

.manufacturing-progress-breakdown b {
  color: #10234d;
  font-size: 16px;
}

.manufacturing-progress-breakdown .dot {
  width: 12px;
  height: 12px;
  border-radius: 999px;
  display: inline-block;
}

.manufacturing-progress-breakdown .dot.completed { background: #17b3a4; }
.manufacturing-progress-breakdown .dot.inprogress { background: #2e6df7; }
.manufacturing-progress-breakdown .dot.planned { background: #9db2d9; }
.manufacturing-progress-breakdown .dot.hold { background: #f5a34a; }

@media (max-width: 1280px) {
  .manufacturing-dashboard-grid {
    grid-template-columns: 1fr;
  }

  .manufacturing-report-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 980px) {
  .manufacturing-hero-card,
  .manufacturing-progress-layout {
    grid-template-columns: 1fr;
  }

  .manufacturing-action-grid,
  .manufacturing-kpi-grid,
  .manufacturing-report-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .manufacturing-hero-copy h2 {
    font-size: 40px;
  }
}

@media (max-width: 700px) {
  .manufacturing-hero-card {
    padding: 22px;
  }

  .manufacturing-hero-copy h2 {
    font-size: 30px;
  }

  .manufacturing-action-grid,
  .manufacturing-kpi-grid,
  .manufacturing-report-grid {
    grid-template-columns: 1fr;
  }

  .manufacturing-progress-donut {
    width: 180px;
    height: 180px;
    margin-inline: auto;
  }
}

.manufacturing-process-shell {
  display: grid;
  gap: 22px;
  padding: 30px 28px;
  border-radius: 32px;
  background:
    radial-gradient(circle at top left, rgba(224, 243, 255, .9) 0%, rgba(255,255,255,.98) 18%, rgba(255,255,255,.98) 100%);
  border: 1px solid rgba(71, 108, 194, .10);
  box-shadow: 0 22px 48px rgba(58, 82, 145, .08);
  overflow: visible;
}

.manufacturing-process-head {
  display: grid;
  gap: 10px;
  max-width: min(840px, 100%);
  min-width: 0;
}

.manufacturing-process-title {
  font-size: 16px;
  font-weight: 800;
  letter-spacing: .02em;
}

.manufacturing-process-head h2 {
  margin: 0;
  font-size: 28px;
  line-height: 1.08;
  color: #10295b;
}

.manufacturing-process-head p {
  margin: 0;
  color: #60739b;
  font-size: 15px;
  line-height: 1.7;
  overflow-wrap: anywhere;
}

.manufacturing-process-board {
  position: relative;
  min-width: 0;
  overflow: hidden;
}

.manufacturing-process-flow {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(188px, 1fr));
  align-items: stretch;
  gap: 16px;
  overflow: visible;
  padding: 8px 0 2px;
}

.manufacturing-process-card {
  position: relative;
  display: grid;
  gap: 18px;
  padding: 22px 18px 18px;
  border-radius: 28px;
  border: 1px solid rgba(64, 92, 160, .14);
  background: linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(247, 250, 255, .96) 100%);
  box-shadow: 0 14px 34px rgba(72, 95, 156, .08);
}

.manufacturing-process-card.featured {
  border-width: 2px;
  border-color: rgba(38, 100, 250, .92);
  box-shadow: 0 22px 42px rgba(42, 104, 251, .16);
}

.manufacturing-process-main {
  display: grid;
  justify-items: center;
  gap: 14px;
  width: 100%;
  padding: 8px 0 0;
  border: 0;
  background: transparent;
  text-align: center;
  cursor: pointer;
}

.manufacturing-process-main.disabled,
.manufacturing-process-main:disabled {
  cursor: default;
  opacity: .6;
}

.manufacturing-process-main h3 {
  margin: 0;
  color: #12275a;
  font-size: 18px;
  line-height: 1.25;
}

.manufacturing-process-icon-card {
  width: 112px;
  height: 112px;
  display: grid;
  place-items: center;
  border-radius: 30px;
  background: linear-gradient(180deg, rgba(248, 252, 255, .98) 0%, rgba(238, 247, 255, .94) 100%);
  border: 1px solid rgba(54, 89, 176, .08);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.84), 0 14px 28px rgba(87, 110, 168, .08);
}

.manufacturing-process-card.featured .manufacturing-process-icon-card {
  background: linear-gradient(180deg, rgba(248, 252, 255, .98) 0%, rgba(238, 247, 255, .94) 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.84), 0 14px 28px rgba(87, 110, 168, .08);
}

.manufacturing-process-icon-card .icon {
  width: 42px;
  height: 42px;
  color: #1f66ec;
}

.manufacturing-process-card.featured .manufacturing-process-icon-card .icon {
  color: #1f66ec;
}

.manufacturing-process-metrics {
  display: grid;
  gap: 10px;
}

.manufacturing-process-metric {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  width: 100%;
  padding: 11px 14px;
  border-radius: 18px;
  border: 1px solid rgba(57, 85, 149, .10);
  background: rgba(255,255,255,.94);
  color: #21406f;
  box-shadow: 0 8px 20px rgba(78, 97, 152, .05);
  text-align: left;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.manufacturing-process-metric:hover,
.manufacturing-process-metric:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(35, 104, 245, .2);
  box-shadow: 0 14px 26px rgba(61, 85, 149, .09);
}

.manufacturing-process-metric.disabled,
.manufacturing-process-metric:disabled {
  opacity: .55;
  cursor: default;
  transform: none;
  box-shadow: none;
}

.manufacturing-process-metric span:not(.manufacturing-process-metric-icon) {
  color: #35527f;
  font-size: 14px;
  font-weight: 600;
}

.manufacturing-process-metric strong {
  color: #1667ea;
  font-size: 18px;
  line-height: 1;
}

.manufacturing-process-metric-icon {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: rgba(235, 243, 255, .96);
}

.manufacturing-process-metric-icon .icon {
  width: 18px;
  height: 18px;
  color: #1f66ec;
}

.manufacturing-process-arrow {
  display: none;
  place-items: center;
  align-self: center;
}

.manufacturing-process-arrow .icon {
  width: 28px;
  height: 28px;
  color: #2472ef;
}

.manufacturing-process-legend {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 14px;
}

.manufacturing-process-summary {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 16px 18px;
  border-radius: 20px;
  border: 1px solid rgba(56, 86, 150, .08);
  background: rgba(255,255,255,.9);
  box-shadow: 0 10px 24px rgba(69, 88, 145, .05);
}

.manufacturing-process-summary-icon {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: rgba(235, 243, 255, .95);
}

.manufacturing-process-summary-icon .icon {
  width: 22px;
  height: 22px;
  color: #2168ec;
}

.manufacturing-process-summary small,
.manufacturing-process-summary em {
  display: block;
}

.manufacturing-process-summary small {
  color: #7183a7;
  font-size: 12px;
  margin-bottom: 4px;
}

.manufacturing-process-summary strong {
  color: #10275b;
  font-size: 24px;
  line-height: 1.1;
}

.manufacturing-process-summary em {
  margin-top: 5px;
  color: #7384a8;
  font-size: 12px;
  font-style: normal;
  line-height: 1.5;
}

.manufacturing-process-report-panel {
  margin-top: 20px;
}

@media (max-width: 1380px) {
  .manufacturing-process-legend {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 920px) {
  .manufacturing-process-shell {
    padding: 24px 20px;
    border-radius: 26px;
  }

  .manufacturing-process-card {
    flex-basis: 196px;
  }

  .manufacturing-process-icon-card {
    width: 94px;
    height: 94px;
  }

  .manufacturing-process-legend {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .manufacturing-process-head h2 {
    font-size: 24px;
  }

  .manufacturing-process-flow {
    gap: 14px;
  }

  .manufacturing-process-card {
    flex-basis: 180px;
    padding-inline: 14px;
  }

  .manufacturing-process-arrow {
    flex-basis: 28px;
  }

  .manufacturing-process-legend {
    grid-template-columns: 1fr;
  }
}

.process-dashboard-toggle {
  display: inline-flex;
  gap: 6px;
  width: max-content;
  max-width: 100%;
  padding: 5px;
  margin: 0 0 14px;
  border: 1px solid rgba(45, 87, 169, .14);
  border-radius: 14px;
  background: rgba(255,255,255,.9);
  box-shadow: 0 10px 24px rgba(46, 76, 140, .06);
}

.process-dashboard-toggle button {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 14px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #2f466f;
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

.process-dashboard-toggle button.active {
  background: #1f66ec;
  color: #fff;
  box-shadow: 0 10px 20px rgba(31, 102, 236, .22);
}

.process-dashboard-toggle .icon {
  width: 17px;
  height: 17px;
}

.process-chart-shell,
.manufacturing-process-shell {
  display: grid;
  gap: 18px;
  padding: 22px;
  border-radius: 22px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,251,255,.98));
  border: 1px solid rgba(57, 87, 151, .12);
  box-shadow: 0 18px 42px rgba(58, 82, 145, .08);
  overflow: hidden;
}

.process-chart-head,
.manufacturing-process-head {
  display: grid;
  gap: 8px;
  justify-items: center;
  text-align: center;
  max-width: none;
}

.process-chart-head h2,
.manufacturing-process-head h2 {
  margin: 0;
  color: #08164d;
  font-size: clamp(24px, 2.35vw, 38px);
  line-height: 1.08;
  font-weight: 900;
}

.process-chart-head p,
.manufacturing-process-head p {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  color: #51617f;
  font-size: 16px;
  line-height: 1.35;
}

.process-chart-head p span,
.manufacturing-process-head p span {
  width: 44px;
  height: 1px;
  background: #9eacc5;
}

.process-chart-topline,
.manufacturing-process-topline {
  display: grid;
  grid-template-columns: repeat(7, minmax(150px, 1fr));
  gap: 12px;
  min-width: 0;
}

.process-chart-pill,
.manufacturing-process-pill {
  min-height: 64px;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border: 1.5px dashed #2d72e8;
  border-radius: 12px;
  background: #fff;
  color: #081b55;
  font-size: 13px;
  font-weight: 900;
}

.process-chart-pill small {
  display: block;
  margin-top: 3px;
  color: #455b7e;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.35;
}

.process-chart-pill .icon,
.manufacturing-process-pill .icon {
  width: 38px;
  height: 38px;
  padding: 8px;
  border-radius: 50%;
  color: #fff;
  background: #1565d8;
}

.process-chart-pill-green,
.manufacturing-process-pill-green { border-color: #0c9a7c; }
.process-chart-pill-green .icon,
.manufacturing-process-pill-green .icon { background: #0c9a7c; }
.process-chart-pill-purple,
.manufacturing-process-pill-purple { border-color: #7a3bd1; }
.process-chart-pill-purple .icon,
.manufacturing-process-pill-purple .icon { background: #7a3bd1; }
.process-chart-pill-teal,
.manufacturing-process-pill-teal { border-color: #07858a; }
.process-chart-pill-teal .icon,
.manufacturing-process-pill-teal .icon { background: #07858a; }
.process-chart-pill-orange,
.manufacturing-process-pill-orange { border-color: #f05a00; }
.process-chart-pill-orange .icon,
.manufacturing-process-pill-orange .icon { background: #f05a00; }

.process-chart-scroller,
.manufacturing-process-board {
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 2px 2px 10px;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-inline: contain;
}

.process-chart-flow,
.manufacturing-process-flow {
  display: flex;
  align-items: stretch;
  gap: 12px;
  min-width: max-content;
  padding: 4px 0;
}

.process-chart-stage,
.manufacturing-process-card {
  width: 176px;
  min-width: 176px;
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 10px;
  padding: 12px;
  border-radius: 14px;
  border: 1px solid rgba(42, 71, 132, .16);
  border-top: 3px solid var(--stage-accent, #155bd8);
  background: linear-gradient(180deg, #fff, rgba(250, 252, 255, .98));
  box-shadow: 0 10px 22px rgba(48, 78, 137, .07);
}

.process-chart-stage-head,
.manufacturing-process-main {
  position: relative;
  display: grid;
  grid-template-columns: 32px 30px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-height: 52px;
  width: 100%;
  padding: 4px 0 8px;
  border: 0;
  background: transparent;
  color: #081b55;
  text-align: left;
  cursor: pointer;
}

.process-chart-number,
.manufacturing-process-number {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: var(--stage-accent, #155bd8);
  color: #fff;
  font-size: 15px;
  font-weight: 900;
  box-shadow: 0 8px 16px rgba(30, 78, 150, .18);
}

.process-chart-stage-icon,
.manufacturing-process-icon-card {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: var(--stage-soft, rgba(21,91,216,.08));
  color: var(--stage-accent, #155bd8);
}

.process-chart-stage-icon .icon,
.manufacturing-process-icon-card .icon {
  width: 20px;
  height: 20px;
  color: currentColor;
}

.process-chart-stage-head strong,
.manufacturing-process-card-title {
  color: #081b55;
  font-size: 14px;
  line-height: 1.2;
  font-weight: 900;
}

.process-chart-substeps,
.manufacturing-process-substeps {
  display: grid;
  gap: 8px;
}

.process-chart-substep,
.manufacturing-process-substep {
  min-height: 48px;
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  padding: 8px;
  border: 1px solid rgba(42, 71, 132, .13);
  border-radius: 9px;
  background: rgba(255,255,255,.96);
  color: #0e2256;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.28;
  text-align: left;
  cursor: pointer;
}

.process-chart-substep .icon,
.manufacturing-process-substep .icon {
  width: 27px;
  height: 27px;
  color: var(--stage-accent, #155bd8);
}

.process-chart-counts,
.manufacturing-process-metrics {
  display: grid;
  gap: 6px;
  margin-top: 2px;
}

.process-chart-count,
.manufacturing-process-count {
  min-height: 34px;
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  gap: 7px;
  align-items: center;
  padding: 6px 8px;
  border: 1px solid rgba(42, 71, 132, .11);
  border-radius: 10px;
  background: var(--stage-soft, rgba(21,91,216,.08));
  color: #263f6d;
  font: inherit;
  font-size: 11px;
  font-weight: 800;
  text-align: left;
  cursor: pointer;
}

.process-chart-count strong,
.manufacturing-process-count strong {
  color: var(--stage-accent, #155bd8);
  font-size: 14px;
  white-space: nowrap;
}

.process-chart-count-icon,
.manufacturing-process-count-icon {
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: rgba(255,255,255,.72);
  color: var(--stage-accent, #155bd8);
}

.process-chart-count-icon .icon,
.manufacturing-process-count-icon .icon {
  width: 15px;
  height: 15px;
}

.process-chart-arrow,
.manufacturing-process-arrow {
  width: 24px;
  min-width: 24px;
  display: grid;
  place-items: center;
  align-self: center;
  color: #092162;
}

.process-chart-arrow .icon,
.manufacturing-process-arrow .icon {
  width: 22px;
  height: 22px;
}

.process-chart-exception-flow,
.manufacturing-exception-flow {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 10px;
  padding-top: 4px;
  color: #d51c1c;
}

.process-chart-exception-label,
.manufacturing-exception-label {
  flex-basis: 100%;
  text-align: center;
  color: #d51c1c;
  font-weight: 900;
}

.process-chart-exception-card,
.manufacturing-exception-card {
  min-height: 48px;
  min-width: 190px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 8px 14px;
  border: 1px solid #ef4444;
  border-radius: 10px;
  background: #fffafa;
  color: #991b1b;
  font: inherit;
  font-weight: 900;
  cursor: pointer;
}

.process-chart-exception-card .icon,
.manufacturing-exception-card .icon {
  width: 25px;
  height: 25px;
  color: #dc2626;
}

.process-chart-exception-arrow,
.manufacturing-exception-arrow {
  color: #dc2626;
}

.process-chart-benefits,
.manufacturing-benefits-strip {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0;
  border: 1px solid rgba(42, 71, 132, .12);
  border-radius: 14px;
  background: #fff;
  overflow: hidden;
}

.process-chart-benefits article,
.manufacturing-benefits-strip article {
  min-width: 0;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding: 12px 14px;
  border-right: 1px solid rgba(42, 71, 132, .12);
}

.process-chart-benefits article:last-child,
.manufacturing-benefits-strip article:last-child {
  border-right: 0;
}

.process-chart-benefits .icon,
.manufacturing-benefits-strip .icon {
  width: 34px;
  height: 34px;
  color: #155bd8;
}

.process-chart-benefits strong,
.manufacturing-benefits-strip strong {
  display: block;
  color: #0d2460;
  font-size: 12px;
}

.process-chart-benefits small,
.manufacturing-benefits-strip small {
  display: block;
  margin-top: 3px;
  color: #4b638b;
  font-size: 11px;
  line-height: 1.35;
}

.manufacturing-process-legacy-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(184px, 1fr));
  gap: 14px;
}

.manufacturing-process-legacy-grid .manufacturing-process-card {
  width: auto;
  min-width: 0;
}

button.disabled,
button:disabled {
  cursor: not-allowed;
}

@media (max-width: 1440px) {
  .process-chart-topline,
  .manufacturing-process-topline {
    grid-template-columns: repeat(4, minmax(150px, 1fr));
  }

  .process-chart-benefits,
  .manufacturing-benefits-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .process-chart-shell,
  .manufacturing-process-shell {
    padding: 18px;
    border-radius: 18px;
  }

  .process-chart-topline,
  .manufacturing-process-topline,
  .process-chart-benefits,
  .manufacturing-benefits-strip {
    grid-template-columns: 1fr;
  }

  .process-chart-benefits article,
  .manufacturing-benefits-strip article {
    border-right: 0;
    border-bottom: 1px solid rgba(42, 71, 132, .12);
  }

  .process-chart-benefits article:last-child,
  .manufacturing-benefits-strip article:last-child {
    border-bottom: 0;
  }
}

@media (max-width: 760px) {
  .process-dashboard-toggle {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  }

  .process-dashboard-toggle button {
    width: 100%;
    min-width: 0;
    padding-inline: 10px;
  }

  .process-chart-shell,
  .manufacturing-process-shell {
    gap: 14px;
    padding: 14px;
    border-radius: 16px;
    overflow: visible;
  }

  .process-chart-head,
  .manufacturing-process-head {
    justify-items: start;
    text-align: left;
  }

  .process-chart-head h2,
  .manufacturing-process-head h2 {
    font-size: 24px;
    line-height: 1.12;
  }

  .process-chart-head p,
  .manufacturing-process-head p {
    display: block;
    font-size: 14px;
  }

  .process-chart-head p span,
  .manufacturing-process-head p span {
    display: none;
  }

  .process-chart-pill,
  .manufacturing-process-pill {
    min-height: 54px;
    grid-template-columns: 34px minmax(0, 1fr);
    padding: 9px 10px;
  }

  .process-chart-pill .icon,
  .manufacturing-process-pill .icon {
    width: 32px;
    height: 32px;
    padding: 7px;
  }

  .process-chart-scroller,
  .manufacturing-process-board {
    overflow: visible;
    padding: 0;
  }

  .process-chart-flow,
  .manufacturing-process-flow {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
    min-width: 0;
    padding: 0;
  }

  .process-chart-stage,
  .manufacturing-process-card {
    width: auto;
    min-width: 0;
    gap: 8px;
    padding: 10px;
    border-radius: 12px;
  }

  .process-chart-stage-head,
  .manufacturing-process-main {
    grid-template-columns: 30px 28px minmax(0, 1fr);
    min-height: 44px;
    padding-bottom: 6px;
  }

  .process-chart-number,
  .manufacturing-process-number {
    width: 28px;
    height: 28px;
  }

  .process-chart-stage-icon,
  .manufacturing-process-icon-card {
    width: 28px;
    height: 28px;
    border-radius: 9px;
  }

  .process-chart-substep,
  .manufacturing-process-substep {
    min-height: 42px;
    padding: 7px;
  }

  .process-chart-count,
  .manufacturing-process-count {
    min-height: 32px;
  }

  .process-chart-arrow,
  .manufacturing-process-arrow {
    width: 100%;
    min-width: 0;
    height: 18px;
    justify-items: center;
    transform: rotate(90deg);
  }

  .process-chart-arrow .icon,
  .manufacturing-process-arrow .icon {
    width: 18px;
    height: 18px;
  }

  .process-chart-exception-flow,
  .manufacturing-exception-flow {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    justify-items: stretch;
    gap: 8px;
  }

  .process-chart-exception-label,
  .manufacturing-exception-label {
    flex-basis: auto;
    text-align: left;
  }

  .process-chart-exception-card,
  .manufacturing-exception-card {
    width: 100%;
    min-width: 0;
    justify-content: flex-start;
  }

  .process-chart-exception-arrow,
  .manufacturing-exception-arrow {
    justify-self: center;
    transform: rotate(90deg);
  }

  .process-chart-benefits article,
  .manufacturing-benefits-strip article {
    grid-template-columns: 32px minmax(0, 1fr);
    padding: 10px 12px;
  }

  .process-chart-benefits .icon,
  .manufacturing-benefits-strip .icon {
    width: 30px;
    height: 30px;
  }
}

.manufacturing-report-stack {
  display: grid;
  gap: 16px;
}

.manufacturing-report-filter {
  margin-bottom: 16px;
}

.manufacturing-report-filter .manufacturing-master-toolbar {
  grid-template-columns: 180px 180px auto;
  justify-content: start;
  align-items: end;
}

.manufacturing-report-filter .input[type="date"] {
  min-width: 0;
  width: 180px;
}

.trace-detail-head,
.trace-detail-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.trace-detail-head {
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(32, 56, 128, 0.08);
  margin-bottom: 12px;
}

.trace-detail-head small,
.trace-detail-row small {
  display: block;
  color: var(--muted, #6d7fa7);
  font-size: 12px;
}

.trace-detail-list {
  display: grid;
  gap: 10px;
}

#manufacturingJobWorkStageRows .input,
#manufacturingStageProcessRowsDetail .input {
  min-width: 0;
}

.trace-detail-row {
  border: 1px solid rgba(32, 56, 128, 0.08);
  border-radius: 14px;
  padding: 12px 14px;
  background: rgba(255,255,255,0.85);
}

.omnichannel-shell {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(280px, 0.9fr);
  gap: 16px;
  align-items: start;
}

.omnichannel-side-stack {
  display: grid;
  gap: 16px;
}

.omnichannel-settings-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 16px;
}

.omnichannel-settings-grid label,
.omnichannel-settings-panel .platform-admin-description {
  display: grid;
  gap: 8px;
}

.omnichannel-settings-grid label span {
  font-size: 12px;
  color: var(--muted, #6d7fa7);
  font-weight: 600;
}

.omnichannel-flag-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 16px;
  margin-top: 18px;
}

.omnichannel-actions-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 18px;
}

.omnichannel-log-panel {
  margin-top: 16px;
}

.omnichannel-phase-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.95fr);
  gap: 16px;
  margin-top: 16px;
  align-items: start;
}

.omnichannel-detail-panel {
  min-height: 100%;
}

.omnichannel-detail-stack {
  display: grid;
  gap: 14px;
}

.omnichannel-detail-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.omnichannel-detail-summary div,
.omnichannel-detail-copy {
  padding: 12px 14px;
  border: 1px solid rgba(32, 56, 128, 0.08);
  border-radius: 14px;
  background: rgba(255,255,255,0.82);
}

.omnichannel-detail-summary small,
.omnichannel-detail-copy small {
  display: block;
  color: var(--muted, #6d7fa7);
  font-size: 12px;
  margin-bottom: 6px;
}

.omnichannel-detail-summary strong {
  font-size: 15px;
  color: var(--navy, #0f2454);
}

.omnichannel-detail-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.omnichannel-detail-copy-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.omnichannel-detail-copy pre {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: inherit;
  font-size: 13px;
  color: var(--navy, #0f2454);
}

.omnichannel-order-filters {
  grid-template-columns: minmax(240px, 1.2fr) 180px 180px auto;
}

.omnichannel-log-filters {
  grid-template-columns: 180px 220px auto;
}

.omnichannel-product-filters {
  grid-template-columns: minmax(280px, 1.4fr) auto auto auto;
}

.omnichannel-webhook-filters {
  grid-template-columns: minmax(240px, 1fr) 180px auto;
}

.omnichannel-scope-item {
  justify-content: space-between;
  min-width: 0;
  gap: 8px;
  overflow: hidden;
}

.omnichannel-scope-item span:last-child {
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.row-selected {
  background: rgba(99, 73, 255, 0.05);
}

.marketplace-shell {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.marketplace-tabs {
  position: sticky;
  top: 88px;
}

.marketplace-tab-list,
.marketplace-panel-stack,
.marketplace-side-note,
.marketplace-public-result-list,
.marketplace-public-bookings,
.marketplace-slot-list {
  display: grid;
  gap: 12px;
}

.marketplace-tab-list button,
.marketplace-slot-card {
  border: 1px solid rgba(32, 56, 128, 0.08);
  background: rgba(255,255,255,0.88);
  border-radius: 12px;
  padding: 12px 14px;
  font: inherit;
  color: var(--navy, #0f2454);
  text-align: left;
}

.marketplace-tab-list button.active,
.marketplace-slot-card.available:hover {
  border-color: rgba(99, 73, 255, 0.35);
  background: rgba(99, 73, 255, 0.08);
}

.marketplace-main > [data-marketplace-panel] {
  display: none;
}

.marketplace-main > [data-marketplace-panel].active {
  display: grid;
}

.marketplace-overview-grid,
.marketplace-discovery-grid,
.marketplace-public-grid,
.marketplace-public-profile-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, 0.95fr);
  gap: 16px;
  align-items: start;
}

.marketplace-summary-grid,
.marketplace-form-grid,
.marketplace-flag-grid,
.marketplace-public-filter-grid {
  display: grid;
  gap: 12px 16px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.marketplace-form-grid-two .wide-field {
  grid-column: 1 / -1;
}

.marketplace-summary-grid > div,
.marketplace-flag-card,
.marketplace-copy-block,
.marketplace-public-hero,
.marketplace-result-card,
.marketplace-public-booking-card,
.marketplace-discovery-detail,
.marketplace-slot-card {
  border: 1px solid rgba(32, 56, 128, 0.08);
  border-radius: 14px;
  background: rgba(255,255,255,0.88);
  padding: 14px 16px;
}

.marketplace-copy-block p,
.marketplace-result-card p {
  margin: 0;
}

.marketplace-copy-block small,
.marketplace-summary-grid small,
.marketplace-flag-card small,
.marketplace-side-note small {
  display: block;
  font-size: 12px;
  color: var(--muted, #6d7fa7);
  margin-bottom: 6px;
}

.marketplace-side-note strong,
.marketplace-summary-grid strong,
.marketplace-result-head h3,
.marketplace-public-profile-head h2 {
  color: var(--navy, #0f2454);
}

.marketplace-actions-row,
.marketplace-result-actions,
.marketplace-inline-actions,
.marketplace-label-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.marketplace-flag-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.marketplace-flag-card {
  display: grid;
  gap: 6px;
}

.marketplace-check-card {
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid rgba(32, 56, 128, 0.08);
  border-radius: 14px;
  background: rgba(255,255,255,0.85);
}

.marketplace-inline-actions .icon-button {
  width: 34px;
  height: 34px;
}

.marketplace-result-head,
.marketplace-public-profile-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.marketplace-result-head h3,
.marketplace-public-profile-head h2 {
  margin: 4px 0 6px;
}

.marketplace-result-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  color: var(--muted, #6d7fa7);
  font-size: 13px;
}

.marketplace-result-meta span {
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(15, 36, 84, 0.05);
}

.marketplace-table-stack {
  margin-top: 16px;
}

.marketplace-public-body {
  margin: 0;
  min-height: 100vh;
  background:
    radial-gradient(circle at top right, rgba(122, 92, 255, 0.16), transparent 26%),
    radial-gradient(circle at left center, rgba(53, 132, 255, 0.10), transparent 28%),
    linear-gradient(180deg, #f5f7ff 0%, #eef2fb 100%);
  font-family: "Inter", sans-serif;
  color: var(--navy, #0f2454);
}

.marketplace-public-app {
  max-width: 1480px;
  margin: 0 auto;
  padding: 28px 20px 56px;
}

.marketplace-public-shell {
  display: grid;
  gap: 22px;
}

.marketplace-public-hero {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  gap: 24px;
}

.marketplace-public-hero h1 {
  margin: 8px 0 12px;
  font-size: clamp(34px, 4vw, 56px);
  line-height: 1.02;
}

.marketplace-public-auth-status {
  display: grid;
  gap: 6px;
  min-width: 220px;
}

.marketplace-public-landing {
  align-items: stretch;
}

.marketplace-public-hero-copy {
  position: relative;
  overflow: hidden;
  flex: 1 1 auto;
  border-radius: 28px;
  padding: clamp(26px, 4vw, 46px);
  color: #fff;
  background:
    radial-gradient(circle at top right, rgba(133, 106, 255, .46), transparent 26%),
    linear-gradient(135deg, #04152d 0%, #081d3d 58%, #3a1ca8 100%);
  box-shadow: 0 28px 70px rgba(9, 18, 45, .22);
}

.marketplace-public-hero-copy::before {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-radial-gradient(circle at 84% 22%, rgba(255,255,255,.14) 0 1px, transparent 1px 20px);
  opacity: .35;
  pointer-events: none;
}

.marketplace-public-brand {
  position: relative;
  z-index: 1;
  color: #fff;
}

.marketplace-public-brand strong {
  display: block;
  font-size: 18px;
}

.marketplace-public-brand small {
  display: block;
  color: rgba(232, 238, 255, .82);
  font-size: 12px;
  margin-top: 2px;
}

.marketplace-public-eyebrow {
  position: relative;
  z-index: 1;
  margin-top: 32px;
}

.marketplace-public-hero-copy > h1,
.marketplace-public-hero-copy > p {
  position: relative;
  z-index: 1;
}

.marketplace-public-hero-copy > p {
  color: #dde5f6;
  font-size: 15px;
  line-height: 1.65;
  max-width: 720px;
}

.marketplace-landing-benefits {
  position: relative;
  z-index: 1;
  margin-top: 28px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.marketplace-landing-benefit {
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 20px;
  padding: 16px 18px;
  background: rgba(255,255,255,.06);
  backdrop-filter: blur(10px);
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 14px;
  align-items: start;
}

.marketplace-landing-benefit > span {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  color: #fff;
  background: rgba(255,255,255,.12);
}

.marketplace-landing-benefit strong {
  display: block;
  margin-bottom: 4px;
}

.marketplace-landing-benefit small {
  color: #d6ddf2;
  line-height: 1.55;
}

.marketplace-auth-card {
  align-self: stretch;
  width: min(100%, 470px);
  border-radius: 28px;
  box-shadow: 0 24px 70px rgba(20, 33, 74, .14);
}

.marketplace-auth-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.marketplace-auth-header small {
  color: var(--muted);
  font-weight: 700;
}

.marketplace-auth-switch {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 6px;
  border-radius: 16px;
  background: #f3f5fb;
  margin: 20px 0;
}

.marketplace-auth-switch button,
.text-button {
  border: 0;
  background: transparent;
  color: var(--muted);
  font-weight: 800;
}

.marketplace-auth-switch button {
  min-height: 42px;
  border-radius: 12px;
}

.marketplace-auth-switch button.active {
  background: #fff;
  color: var(--ink);
  box-shadow: 0 10px 24px rgba(15, 23, 42, .08);
}

.marketplace-auth-form-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.marketplace-auth-note {
  display: block;
  margin-top: 14px;
  color: var(--muted);
  text-align: center;
}

.text-button {
  padding: 0;
  min-height: auto;
  cursor: pointer;
  color: var(--violet);
}

.marketplace-preview-strip {
  border-radius: 24px;
}

.marketplace-preview-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 14px;
}

.marketplace-preview-card {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(180deg, #ffffff 0%, #f8f9fe 100%);
  padding: 18px 16px;
  display: grid;
  gap: 6px;
  text-align: left;
  box-shadow: 0 14px 30px rgba(15, 23, 42, .05);
}

.marketplace-preview-card strong {
  font-size: 14px;
}

.marketplace-preview-card small {
  color: var(--muted);
}

.marketplace-dashboard-hero {
  border-radius: 28px;
  padding: 24px 28px;
  background: linear-gradient(135deg, #ffffff 0%, #f6f8ff 100%);
  border: 1px solid rgba(91, 45, 242, .10);
  box-shadow: 0 20px 50px rgba(15, 23, 42, .08);
  align-items: end;
}

.marketplace-dashboard-hero h1 {
  font-size: clamp(30px, 3vw, 44px);
}

.marketplace-dashboard-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.marketplace-dashboard-stat {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
  padding: 16px 18px;
  display: grid;
  gap: 6px;
  box-shadow: 0 14px 30px rgba(15, 23, 42, .05);
}

.marketplace-dashboard-stat small {
  color: var(--muted);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
}

.marketplace-dashboard-stat strong {
  font-size: 22px;
}

.marketplace-dashboard-stat span {
  color: var(--muted);
}

.marketplace-dashboard-stat-actions {
  align-content: start;
}

.marketplace-dashboard-stat-actions .secondary {
  margin-top: 6px;
}

.marketplace-public-side {
  display: grid;
  gap: 16px;
}

.marketplace-public-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(320px, .9fr);
  gap: 18px;
}

.marketplace-public-guest-grid {
  grid-template-columns: minmax(0, 1.25fr) minmax(340px, .9fr);
  align-items: start;
}

.marketplace-public-filter-panel,
.marketplace-public-grid .panel,
.marketplace-public-side .panel,
.marketplace-preview-strip {
  border-radius: 24px;
  box-shadow: 0 18px 48px rgba(15, 23, 42, .06);
}

.marketplace-public-result-list,
.marketplace-public-bookings {
  display: grid;
  gap: 14px;
}

.marketplace-result-card,
.marketplace-public-booking-card {
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 16px;
  background: linear-gradient(180deg, #fff 0%, #fbfcff 100%);
  box-shadow: 0 12px 26px rgba(15, 23, 42, .05);
}

.marketplace-result-head h3,
.marketplace-public-profile-head h2 {
  margin: 6px 0 8px;
  font-size: 20px;
}

.marketplace-result-head p,
.marketplace-public-booking-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.marketplace-result-actions,
.marketplace-actions-row {
  flex-wrap: wrap;
}

.marketplace-tab-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.marketplace-tab-list button {
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--muted);
  padding: 0 16px;
  font-weight: 800;
}

.marketplace-tab-list button.active {
  background: var(--violet);
  color: #fff;
  border-color: var(--violet);
  box-shadow: 0 14px 28px rgba(91,45,242,.22);
}

.marketplace-public-slots .marketplace-actions-row label {
  min-width: 220px;
}

.marketplace-slot-card.available {
  cursor: pointer;
}

.marketplace-slot-card.blocked {
  opacity: 0.7;
}

@media (max-width: 1180px) {
  .marketplace-shell,
  .marketplace-overview-grid,
  .marketplace-discovery-grid,
  .marketplace-public-grid,
  .marketplace-public-profile-grid {
    grid-template-columns: 1fr;
  }

  .marketplace-preview-grid,
  .marketplace-dashboard-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .marketplace-tabs {
    position: static;
  }
}

@media (max-width: 820px) {
  .marketplace-flag-grid,
  .marketplace-summary-grid,
  .marketplace-form-grid,
  .marketplace-public-filter-grid {
    grid-template-columns: 1fr;
  }

  .marketplace-public-hero,
  .marketplace-result-head,
  .marketplace-public-profile-head {
    flex-direction: column;
    align-items: start;
  }

  .marketplace-landing-benefits,
  .marketplace-auth-form-grid,
  .marketplace-preview-grid,
  .marketplace-dashboard-strip {
    grid-template-columns: 1fr;
  }

  .marketplace-public-app {
    padding: 20px 14px 40px;
  }

  .marketplace-public-hero-copy,
  .marketplace-dashboard-hero,
  .marketplace-auth-card {
    padding: 22px;
    border-radius: 22px;
  }
}

@media (max-width: 1080px) {
  .omnichannel-shell {
    grid-template-columns: 1fr;
  }

  .omnichannel-phase-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .omnichannel-settings-grid,
  .omnichannel-flag-grid,
  .omnichannel-log-filters,
  .omnichannel-product-filters,
  .omnichannel-order-filters,
  .omnichannel-webhook-filters,
  .omnichannel-detail-summary,
  .omnichannel-detail-copy-grid {
    grid-template-columns: 1fr;
  }

  .omnichannel-actions-row {
    flex-direction: column;
  }
}

@media (max-width: 1180px) {
  .report-finder-head {
    grid-template-columns: 1fr;
  }
  .report-card-grid {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  }
}

@media (max-width: 980px) {
  .report-detail-head {
    flex-direction: column;
    align-items: stretch;
  }
  .report-detail-head .action-row,
  .report-detail-head .action-row button {
    width: 100%;
  }
  .report-entity-filter {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .report-library-panel,
  .report-detail-panel {
    border-radius: 14px;
  }
  .report-library-panel,
  .report-detail-panel {
    padding: 12px;
  }
  .report-sidebar-title {
    display: grid;
    gap: 4px;
  }
  .report-category-tabs {
    margin-inline: -2px;
  }
  .report-category-tab {
    min-height: 40px;
    padding-inline: 10px;
  }
  .report-card-grid {
    grid-template-columns: 1fr;
  }
  .reports-page .history-filters {
    grid-template-columns: 1fr;
  }
  .report-summary {
    grid-template-columns: 1fr;
  }
  .report-table-wrap table {
    min-width: 760px;
  }
}

/* ========================================================================== */
/* Vendro ERP Theme Consistency Pass - 2026-06-03                              */
/* Purpose: make the uploaded theme look consistent, compact, ERP-like, and    */
/* reduce oversized typography/spacing without changing application logic.     */
/* ========================================================================== */
:root {
  --erp-font-xs: 10.5px;
  --erp-font-sm: 11.5px;
  --erp-font-md: 12.5px;
  --erp-font-lg: 14px;
  --erp-font-xl: 17px;
  --erp-control-h: 36px;
  --erp-radius-sm: 10px;
  --erp-radius-md: 14px;
  --erp-radius-lg: 18px;
  --erp-shadow-card: 0 10px 26px rgba(15, 23, 42, .055);
  --erp-shadow-soft: 0 6px 18px rgba(15, 23, 42, .045);
}

html,
body {
  font-size: 13px;
  line-height: 1.42;
}

/* Compact, professional application chrome */
.topbar {
  min-height: 48px;
  padding: 5px 18px;
  gap: 10px;
}
.icon-button,
.workspace-picker,
.profile,
.search {
  height: 36px;
  min-height: 36px;
  border-radius: var(--erp-radius-sm);
}
.workspace-picker {
  max-width: min(320px, 30vw);
  padding-inline: 10px;
}
.workspace-picker small,
.workspace-picker b,
.profile-menu-head strong,
.profile-menu-head small {
  font-size: var(--erp-font-sm);
}
.profile span {
  width: 28px;
  height: 28px;
  font-size: 11px;
}
.page-host {
  padding: 0 20px 88px;
}
.app-footer {
  min-height: 26px;
  padding: 0 20px 8px;
  font-size: 11px;
}

/* Core ERP typography scale */
h1,
.page-heading h1,
.module-hero h1,
.dashboard-hero h1 {
  font-size: clamp(20px, 1.45vw, 28px) !important;
  line-height: 1.14 !important;
  letter-spacing: -0.02em;
}
h2,
.panel h2,
.panel-title h2,
.report-detail-head h2,
.analytics-card h2 {
  font-size: clamp(14px, 1.05vw, 18px) !important;
  line-height: 1.2 !important;
}
h3,
.metric h3,
.card h3,
.report-card b {
  font-size: 13px !important;
  line-height: 1.22 !important;
}
p,
small,
.panel p,
.report-card small,
.analytics-card small {
  line-height: 1.42;
}

/* Consistent controls */
.primary,
.secondary,
.chip-button,
button.primary,
button.secondary,
button.fit,
.action-row button,
.report-category-tab,
.report-card,
.marketplace-tab-list button {
  min-height: 36px;
  font-size: var(--erp-font-md);
  border-radius: var(--erp-radius-sm);
}
.primary,
.secondary,
.chip-button,
.action-row button {
  padding-inline: 12px;
  gap: 8px;
}
.input,
select,
textarea,
.label input,
.label select,
.label textarea,
.reports-page .history-filters .input,
.reports-page .history-filters select,
.reports-page .history-filters input {
  min-height: 36px !important;
  font-size: var(--erp-font-md) !important;
  border-radius: var(--erp-radius-sm) !important;
}
.label,
.reports-page .history-filters label,
.detail-grid label {
  font-size: var(--erp-font-sm);
}
.label span,
.detail-grid label span,
.reports-page .history-filters label span {
  font-size: var(--erp-font-xs);
  letter-spacing: .04em;
}

/* Panels/cards: less bulky, cleaner ERP rhythm */
.panel,
.metric,
.report-library-panel,
.report-detail-panel,
.analytics-card,
.analytics-trend,
.marketplace-result-card,
.marketplace-public-booking-card {
  border-radius: var(--erp-radius-md) !important;
  box-shadow: var(--erp-shadow-soft) !important;
}
.panel,
.report-library-panel,
.report-detail-panel {
  padding: 14px !important;
}
.panel-title {
  margin-bottom: 8px;
}
.dashboard-grid,
.report-summary,
.analytics-grid,
.analytics-kpi-grid,
.summary-grid,
.metric-grid {
  gap: 12px !important;
}

/* Tables/grids: compact and readable */
table,
.report-detail-table,
.fixed-grid-scroll table,
.data-table,
.grid-table {
  font-size: 12px;
}
th,
td,
.report-detail-table th,
.report-detail-table td,
.fixed-grid-scroll th,
.fixed-grid-scroll td {
  padding: 8px 9px !important;
  line-height: 1.32;
  vertical-align: middle;
}
th,
.report-detail-table th,
.fixed-grid-scroll th {
  font-size: 10.5px !important;
  letter-spacing: .055em;
  text-transform: uppercase;
}

/* Reports Center refinements */
.report-workspace {
  gap: 14px !important;
}
.report-finder-head {
  gap: 10px !important;
}
.report-card-grid {
  gap: 10px !important;
}
.report-card {
  padding: 11px !important;
  min-height: 86px !important;
}
.report-card b,
.report-card small,
.report-card em {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
}
.report-card b { -webkit-line-clamp: 2; }
.report-card small,
.report-card em { -webkit-line-clamp: 2; }
.report-card-icon {
  width: 34px !important;
  height: 34px !important;
  border-radius: 11px !important;
}
.report-detail-head {
  gap: 10px !important;
  padding-bottom: 10px;
}
.report-summary article {
  padding: 10px 12px !important;
  border-radius: 12px !important;
}
.report-summary b {
  font-size: 15px !important;
}
.report-table-wrap {
  border-radius: var(--erp-radius-md) !important;
}

/* Analytics: stop overflow/overlap and make panels feel finished */
.analytics-card,
.analytics-trend,
.analytics-detail-panel {
  min-width: 0;
  overflow: hidden;
}
.analytics-card,
.analytics-trend {
  padding: 14px !important;
}
.analytics-card *,
.analytics-trend *,
.analytics-detail-panel * {
  min-width: 0;
}
.analytics-card h2,
.analytics-trend h2,
.analytics-card strong,
.analytics-trend strong {
  overflow-wrap: anywhere;
}
.analytics-rank-list,
.analytics-card-list,
.analytics-mini-list {
  display: grid;
  gap: 8px !important;
}
.analytics-rank-item,
.analytics-card-row,
.analytics-mini-row {
  min-height: 0 !important;
  padding: 9px 10px !important;
  border-radius: 12px !important;
  overflow: hidden;
}
.analytics-rank-item strong,
.analytics-card-row strong,
.analytics-mini-row strong,
.analytics-rank-item span,
.analytics-card-row span,
.analytics-mini-row span {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.analytics-chart,
.analytics-chart-card,
.analytics-chart-body,
.analytics-graph,
.analytics-panel-chart {
  min-height: 180px;
  max-height: 320px;
  overflow: hidden;
}
.analytics-empty,
.chart-empty,
.report-empty {
  min-height: 110px !important;
  display: grid;
  place-items: center;
  text-align: center;
  color: var(--muted);
  background: linear-gradient(180deg, #fff, #f8fafc);
  border: 1px dashed #d8deea;
  border-radius: var(--erp-radius-md);
  font-size: 12px;
}

/* Master forms: keep full-width ERP consistency */
.party-layout,
.product-layout,
.setup-layout,
.finance-layout,
.master-layout {
  gap: 14px !important;
}
.party-layout > .panel,
.product-layout .panel,
.setup-layout .panel,
.finance-layout .panel,
.master-layout .panel {
  min-width: 0;
}
.party-form,
.product-form,
.detail-grid,
.form-grid {
  gap: 10px 12px !important;
}

/* POS remains premium but consistent with ERP shell */
.pos-workspace,
.pos-catalog-shell,
.pos-checkout-panel {
  border-radius: var(--erp-radius-lg) !important;
}
.pos-command-strip,
.pos-category-row,
.pos-card,
.pos-cart-row {
  font-size: var(--erp-font-md);
}
.pos-card-title,
.pos-card-name {
  font-size: 12.5px !important;
  line-height: 1.2 !important;
}
.pos-card-price {
  font-size: 14px !important;
}
.pos-card,
.pos-cart-row {
  box-shadow: var(--erp-shadow-soft) !important;
}

/* Prevent huge marketing-style type inside authenticated ERP pages */
.workspace-view .page-host .module-hero h1,
.workspace-view .page-host .hero h1,
.workspace-view .page-host .page-hero h1 {
  font-size: clamp(20px, 1.5vw, 28px) !important;
}
.workspace-view .page-host .module-hero p,
.workspace-view .page-host .hero p,
.workspace-view .page-host .page-hero p {
  font-size: 13px !important;
  max-width: 820px;
}

/* Responsive cleanup */
@media (max-width: 1180px) {
  .page-host { padding-inline: 16px; }
  .topbar { padding-inline: 14px; }
  .workspace-picker { max-width: min(260px, 34vw); }
  .report-card-grid { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important; }
}

@media (max-width: 760px) {
  body { font-size: 12.5px; }
  .topbar { min-height: 46px; padding-inline: 10px; }
  .page-host { padding: 0 12px 84px; }
  .panel,
  .report-library-panel,
  .report-detail-panel { padding: 12px !important; }
  .primary,
  .secondary,
  .chip-button,
  .action-row button { min-height: 36px; }
  h1,
  .page-heading h1,
  .module-hero h1 { font-size: 21px !important; }
  .report-table-wrap table { min-width: 680px; }
}

/* Analytics command-center redesign: category first, segment second */
.analytics-command-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 20px !important;
  background:
    radial-gradient(circle at 10% 0%, rgba(91, 45, 242, .12), transparent 34%),
    linear-gradient(135deg, #fff, #f8fbff);
}
.analytics-command-hero h2 {
  margin: 8px 0 6px;
  font-size: clamp(20px, 1.7vw, 28px);
}
.analytics-command-hero p {
  max-width: 820px;
  color: var(--muted);
}
.analytics-category-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 12px;
}
.analytics-category-card {
  position: relative;
  min-height: 150px;
  display: grid;
  align-content: start;
  gap: 8px;
  padding: 16px !important;
  text-align: left;
  border: 1px solid rgba(148, 163, 184, .28);
  overflow: hidden;
}
.analytics-category-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  background: var(--analytics-accent, var(--violet));
}
.analytics-category-card [data-icon] {
  width: 38px;
  height: 38px;
  display: inline-grid;
  place-items: center;
  border-radius: 14px;
  color: var(--analytics-accent, var(--violet));
  background: color-mix(in srgb, var(--analytics-accent, #5b2ff2) 12%, #fff);
}
.analytics-category-card strong {
  font-size: 15px;
}
.analytics-category-card p {
  min-height: 44px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}
.analytics-category-card small {
  color: var(--analytics-accent, var(--violet));
  font-weight: 900;
}
.analytics-category-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 18px 36px rgba(15, 23, 42, .08);
}
.analytics-command-shell {
  display: grid;
  gap: 12px;
}
.analytics-category-strip {
  display: flex;
  gap: 9px;
  overflow-x: auto;
  padding: 4px 2px 9px;
  scrollbar-width: thin;
}
.analytics-category-pill {
  flex: 0 0 auto;
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border: 1px solid rgba(148, 163, 184, .34);
  border-radius: 999px;
  background: #fff;
  color: var(--ink);
  font-size: 12px;
  box-shadow: var(--erp-shadow-soft);
}
.analytics-category-pill [data-icon] {
  color: var(--analytics-accent, var(--violet));
}
.analytics-category-pill b {
  max-width: 170px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.analytics-category-pill.active {
  color: #fff;
  border-color: transparent;
  background: linear-gradient(135deg, var(--analytics-accent, #5b2ff2), color-mix(in srgb, var(--analytics-accent, #5b2ff2) 72%, #111827));
}
.analytics-category-pill.active [data-icon] {
  color: #fff;
}
.analytics-focus-layout {
  display: grid;
  grid-template-columns: minmax(220px, 275px) minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}
.analytics-segment-rail {
  position: sticky;
  top: calc(var(--topbar-height, 56px) + 12px);
  padding: 14px !important;
}
.analytics-segment-buttons {
  display: grid;
  gap: 8px;
}
.analytics-segment-button {
  display: grid;
  gap: 3px;
  width: 100%;
  padding: 11px 12px;
  border: 1px solid rgba(148, 163, 184, .28);
  border-radius: 14px;
  background: #fff;
  text-align: left;
}
.analytics-segment-button strong,
.analytics-segment-button small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.analytics-segment-button small {
  color: var(--muted);
  font-size: 11px;
}
.analytics-segment-button.active {
  border-color: rgba(91, 45, 242, .26);
  background: linear-gradient(135deg, rgba(91, 45, 242, .1), rgba(14, 165, 233, .08));
  color: var(--violet);
}
.analytics-focus-content,
.analytics-focused-overview {
  min-width: 0;
  display: grid;
  gap: 14px;
}
.analytics-metric-grid-focused {
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
}
.analytics-section-grid-focused {
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}
.analytics-focused-panel {
  min-width: 0;
}
.analytics-focused-panel .analytics-insight-grid,
.analytics-focused-panel .analytics-inline-insights {
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}
.analytics-filter-panel-compact {
  padding: 14px 16px !important;
}
.analytics-filter-drawer {
  margin-top: 10px;
}
.analytics-filter-drawer summary {
  cursor: pointer;
  width: fit-content;
  padding: 8px 12px;
  border: 1px solid rgba(148, 163, 184, .28);
  border-radius: 999px;
  color: var(--violet);
  font-weight: 900;
  background: #fff;
}
.analytics-filter-drawer[open] summary {
  margin-bottom: 12px;
}

@media (max-width: 1180px) {
  .analytics-focus-layout {
    grid-template-columns: 1fr;
  }
  .analytics-segment-rail {
    position: static;
  }
  .analytics-segment-buttons {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  }
}

@media (max-width: 760px) {
  .analytics-category-grid {
    grid-template-columns: 1fr;
  }
  .analytics-category-card {
    min-height: 124px;
  }
  .analytics-category-pill b {
    max-width: 120px;
  }
  .analytics-section-grid-focused {
    grid-template-columns: 1fr;
  }
  .analytics-filter-drawer summary {
    width: 100%;
  }
}