@font-face {
  font-family: "Vazirmatn";
  src: url("/static/fonts/Vazirmatn-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

.page-accounting .accounting-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.page-accounting .accounting-hero h2,
.page-accounting .accounting-detail h2,
.page-accounting .accounting-detail h3 {
  margin-block: 4px 8px;
}

.page-accounting .accounting-tabs {
  display: flex;
  align-items: stretch;
  gap: 4px;
  min-inline-size: 0;
  margin-block: 8px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scrollbar-width: thin;
}

.page-accounting .accounting-direction-tabs {
  scrollbar-width: none;
}

.page-accounting .accounting-direction-tabs::-webkit-scrollbar {
  display: none;
}

.page-accounting .accounting-destinations {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.page-accounting .accounting-bailment-filters {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
}

.page-accounting .accounting-bailment-filters .accounting-tabs {
  margin-block: 0;
}

.page-accounting .accounting-direction-tabs {
  min-inline-size: 0;
}

.page-accounting .accounting-state-tabs {
  border: 0;
  background: transparent;
  padding: 0;
}

.page-accounting .accounting-tab {
  display: grid;
  place-items: center;
  flex: 1 0 max-content;
  min-block-size: 36px;
  padding: 7px 11px;
  border-radius: 10px;
  color: var(--muted);
  text-align: center;
  text-decoration: none;
  font-weight: 800;
  line-height: 1.35;
}

.page-accounting .accounting-tab.is-current {
  color: var(--primary);
  background: var(--primary-soft);
}

.page-accounting .accounting-state-tabs .accounting-tab {
  flex: 0 0 auto;
  min-block-size: 32px;
  padding: 5px 10px;
  border: 1px solid var(--line);
  background: var(--surface);
  font-size: 0.84rem;
}

.page-accounting .accounting-state-tabs .accounting-tab.is-current {
  border-color: color-mix(in srgb, var(--primary) 44%, var(--line));
  background: var(--primary-soft);
}

.page-accounting .accounting-search {
  margin-block: 4px 8px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
}

.page-accounting .accounting-search .search-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 6px;
}

.page-accounting .accounting-search input,
.page-accounting .accounting-search .button {
  block-size: 34px;
  min-block-size: 34px;
}

.page-accounting .accounting-search .button {
  padding-inline: 14px;
}

.page-accounting .accounting-guide {
  position: relative;
  margin: 0;
  padding-inline: 10px;
  border: 1px dashed var(--line);
  border-radius: 10px;
  background: color-mix(in srgb, var(--surface) 76%, transparent);
}

.page-accounting .accounting-guide summary {
  min-block-size: 32px;
  display: flex;
  align-items: center;
  color: var(--primary);
  font-weight: 800;
  cursor: pointer;
}

.page-accounting .accounting-guide .help {
  position: absolute;
  z-index: 3;
  inset-block-start: calc(100% + 4px);
  inset-inline-end: 0;
  inline-size: min(420px, calc(100vw - 48px));
  margin: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  box-shadow: var(--shadow-soft);
}

.page-accounting .accounting-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-inline-size: 0;
  margin-block-end: 6px;
}

.page-accounting .accounting-panel-head h3 {
  min-inline-size: 0;
  margin: 0;
}

body.page-accounting.has-console-grid .console-grid-toolbar {
  margin-block: 2px;
  padding: 2px;
}

.page-accounting .accounting-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.page-accounting .accounting-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-width: 0;
  padding: 15px;
  border: 1px solid var(--line);
  border-radius: 16px;
  color: var(--ink);
  background: var(--surface);
  text-decoration: none;
}

.page-accounting .accounting-card:hover {
  border-color: color-mix(in srgb, var(--primary) 46%, var(--line));
  box-shadow: var(--shadow-soft);
}

.page-accounting .accounting-card > span,
.page-accounting .accounting-metric {
  display: grid;
  min-width: 0;
}

.page-accounting .accounting-card strong,
.page-accounting .accounting-card small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.page-accounting .accounting-card small {
  color: var(--muted);
}

.page-accounting .accounting-metric {
  flex: 0 0 auto;
  text-align: left;
}

.page-accounting .accounting-serials {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 6px;
  padding: 0;
  list-style: none;
}

.page-accounting .accounting-serials li {
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--primary-soft);
}

@media (max-width: 680px) {
  .page-accounting .accounting-grid {
    grid-template-columns: 1fr;
  }

  .page-accounting .accounting-hero {
    align-items: flex-start;
  }

  .page-accounting .accounting-destinations {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .page-accounting .accounting-bailment-filters {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 4px;
  }

  .page-accounting .accounting-tab {
    min-block-size: 34px;
    padding-inline: 8px;
    font-size: 0.8rem;
  }

  .page-accounting .accounting-direction-tabs .accounting-tab {
    flex-basis: max-content;
  }

  .page-accounting .accounting-search {
    padding: 3px;
  }

  .page-accounting .accounting-search .button {
    padding-inline: 10px;
  }

  .page-accounting .accounting-detail {
    padding: 12px;
  }
}

/* Console app shell v4: persistent bottom App Bar + soft page navigation */
:root {
  --neon-blue: #2f6df6;
  --neon-cyan: #16bfae;
  --neon-violet: #6f73f6;
  --neon-pink: #e264a6;
  --neon-lime: #42c88a;
  --app-bar-accent: #2f6df6;
  --app-bar-accent-end: #13b8a6;
  --app-bar-surface: rgba(250, 252, 255, 0.91);
  --app-bar-border: rgba(47, 109, 246, 0.2);
  --app-bar-glow: rgba(47, 109, 246, 0.25);
  --app-bar-height: 4.75rem;
}

:root[data-theme="dark"] {
  --neon-blue: #78a7ff;
  --neon-cyan: #43d5c0;
  --neon-violet: #9b9cff;
  --neon-pink: #f18bbd;
  --neon-lime: #63d7a2;
  --app-bar-accent: #6f9fff;
  --app-bar-accent-end: #36cdb7;
  --app-bar-surface: rgba(12, 29, 48, 0.94);
  --app-bar-border: rgba(111, 159, 255, 0.3);
  --app-bar-glow: rgba(67, 213, 192, 0.18);
}

body:has(.app-bar),
body.page-pricing,
body.page-inventory,
body.page-serials,
body.page-work,
body.page-accounting,
body.page-preferences,
body.page-events,
body.page-settings,
body.has-app-bar {
  padding-bottom:
    calc(var(--app-bar-height) + 3.25rem + env(safe-area-inset-bottom));
}

.app-header {
  position: sticky;
  z-index: 40;
  top: 0;
  grid-template-columns: 1fr;
  grid-template-rows: auto;
  min-height: 3.65rem;
  padding-block: 0.55rem;
}

.app-header .brand {
  grid-column: 1;
  grid-row: 1;
}

.app-header .brand-copy strong {
  font-size: 1.05rem;
  letter-spacing: 0.02em;
}

.app-header .header-meta,
.app-header .shell-tools,
.app-header .module-strip,
.app-header .module-trigger {
  display: none;
}

.app-bar {
  position: fixed;
  z-index: 65;
  inset-inline: 0;
  bottom: 0;
  display: flex;
  justify-content: center;
  padding:
    0.5rem
    max(0.55rem, env(safe-area-inset-right))
    calc(0.5rem + env(safe-area-inset-bottom))
    max(0.55rem, env(safe-area-inset-left));
  pointer-events: none;
}

.app-bar-track {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(2.75rem, 1fr));
  width: min(36rem, 100%);
  min-height: var(--app-bar-height);
  align-items: center;
  gap: 0.2rem;
  padding: 0.42rem;
  border: 1px solid var(--app-bar-border);
  border-radius: 1.45rem;
  background: var(--app-bar-surface);
  box-shadow:
    0 18px 50px rgba(24, 56, 128, 0.18),
    0 0 28px var(--app-bar-glow);
  backdrop-filter: blur(22px) saturate(145%);
  pointer-events: auto;
}

:root[data-theme="dark"] .app-bar-track {
  box-shadow:
    0 18px 54px rgba(0, 0, 0, 0.5),
    0 0 34px var(--app-bar-glow);
}

.app-bar-active-pill {
  position: absolute;
  z-index: 0;
  top: 0.42rem;
  bottom: 0.42rem;
  left: var(--app-pill-x, 0);
  width: var(--app-pill-width, 0);
  border: 1px solid color-mix(in srgb, var(--neon-cyan) 64%, white);
  border-radius: 1.05rem;
  opacity: 0;
  background:
    linear-gradient(
      135deg,
      var(--app-bar-accent),
      color-mix(in srgb, var(--app-bar-accent) 45%, var(--app-bar-accent-end))
        48%,
      var(--app-bar-accent-end)
    );
  box-shadow:
    0 10px 26px color-mix(in srgb, var(--app-bar-accent) 34%, transparent),
    0 0 18px color-mix(in srgb, var(--app-bar-accent-end) 24%, transparent);
  transform: translateY(-0.22rem);
  transition:
    left 390ms cubic-bezier(0.22, 1, 0.36, 1),
    width 390ms cubic-bezier(0.22, 1, 0.36, 1),
    opacity 160ms ease,
    transform 390ms cubic-bezier(0.22, 1, 0.36, 1);
  pointer-events: none;
}

.app-bar-track.app-bar-pill-ready .app-bar-active-pill {
  opacity: 1;
}

.app-bar-item {
  position: relative;
  z-index: 1;
  display: grid;
  min-width: 0;
  min-height: 3.65rem;
  place-items: center;
  align-content: center;
  gap: 0.13rem;
  padding: 0.36rem 0.18rem;
  border: 1px solid transparent;
  border-radius: 1.05rem;
  color: var(--muted);
  text-decoration: none;
  transition:
    color 180ms ease,
    background 200ms ease,
    border-color 200ms ease,
    transform 220ms cubic-bezier(0.2, 0.8, 0.2, 1),
    box-shadow 220ms ease;
}

.app-bar-item:hover,
.app-bar-item:focus-visible {
  color: var(--primary-dark);
  background: color-mix(in srgb, var(--primary-soft) 72%, transparent);
}

.app-bar-icon {
  display: grid;
  width: 1.45rem;
  height: 1.45rem;
  place-items: center;
}

.app-bar-icon svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.app-bar-label {
  overflow: hidden;
  max-width: 100%;
  font-size: 0.62rem;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.app-bar-indicator {
  width: 0.28rem;
  height: 0.28rem;
  border-radius: 999px;
  background: transparent;
}

.app-bar-item.app-bar-current,
.page-pricing .app-bar-item[data-app-destination="pricing"],
.page-inventory .app-bar-item[data-app-destination="products"],
.page-serials .app-bar-item[data-app-destination="products"],
.page-work .app-bar-item[data-app-destination="work"],
.page-consignments .app-bar-item[data-app-destination="consignments"],
.page-preferences .app-bar-item[data-app-destination="settings"],
.page-events .app-bar-item[data-app-destination="settings"],
.page-settings .app-bar-item[data-app-destination="settings"],
.page-users .app-bar-item[data-app-destination="settings"] {
  border-color: transparent;
  color: #fff;
  background: transparent;
  box-shadow: none;
  transform: translateY(-0.18rem);
}

.app-bar-item.app-bar-current .app-bar-indicator,
.page-pricing .app-bar-item[data-app-destination="pricing"] .app-bar-indicator,
.page-inventory .app-bar-item[data-app-destination="products"] .app-bar-indicator,
.page-serials .app-bar-item[data-app-destination="products"] .app-bar-indicator,
.page-work .app-bar-item[data-app-destination="work"] .app-bar-indicator,
.page-consignments .app-bar-item[data-app-destination="consignments"] .app-bar-indicator,
.page-preferences .app-bar-item[data-app-destination="settings"] .app-bar-indicator,
.page-events .app-bar-item[data-app-destination="settings"] .app-bar-indicator,
.page-settings .app-bar-item[data-app-destination="settings"] .app-bar-indicator,
.page-users .app-bar-item[data-app-destination="settings"] .app-bar-indicator {
  background: #fff;
  box-shadow: 0 0 10px #fff;
}

.app-bar-placeholder {
  cursor: default;
  opacity: 0.62;
}

.app-bar-placeholder .app-bar-icon {
  color: color-mix(in srgb, var(--app-bar-accent-end) 78%, var(--muted));
  filter: drop-shadow(
    0 0 7px color-mix(in srgb, var(--app-bar-accent-end) 35%, transparent)
  );
}

body[data-app-navigation-pending="true"] main[data-app-view] {
  opacity: 0.9;
  transform: translateY(0.12rem);
}

main[data-app-view] {
  scroll-padding-bottom:
    calc(var(--app-bar-height) + 2rem + env(safe-area-inset-bottom));
  transition:
    opacity 140ms ease,
    transform 190ms cubic-bezier(0.22, 1, 0.36, 1);
}

main[data-app-view].app-view-enter {
  animation: app-view-enter 300ms cubic-bezier(0.22, 1, 0.36, 1);
}

body[data-app-navigation-pending="true"]::after {
  position: fixed;
  z-index: 70;
  right: 50%;
  bottom: calc(var(--app-bar-height) + 1rem + env(safe-area-inset-bottom));
  width: min(9rem, 34vw);
  height: 0.22rem;
  border-radius: 999px;
  background:
    linear-gradient(90deg, transparent, var(--app-bar-accent), var(--app-bar-accent-end), transparent);
  box-shadow: 0 0 14px var(--app-bar-glow);
  content: "";
  transform: translateX(50%);
  animation: app-navigation-progress 850ms ease-in-out infinite;
}

@keyframes app-view-enter {
  from {
    opacity: 0.9;
    transform: translateY(0.2rem);
  }
}

@keyframes app-navigation-progress {
  0%,
  100% {
    opacity: 0.35;
    transform: translateX(50%) scaleX(0.42);
  }
  50% {
    opacity: 1;
    transform: translateX(50%) scaleX(1);
  }
}

.work-view-switcher {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.45rem;
  margin: 0 0 1rem;
  padding: 0.42rem;
  border: 1px solid color-mix(in srgb, var(--neon-blue) 20%, var(--line));
  border-radius: 1rem;
  background: var(--surface-glass);
  box-shadow: var(--shadow-soft);
}

.work-view-switcher a {
  position: static;
  display: grid;
  min-width: 0;
  min-height: 2.85rem;
  place-items: center;
  align-content: center;
  gap: 0.08rem;
  padding: 0.35rem;
  border-radius: 0.75rem;
  color: var(--muted);
  background: transparent;
  box-shadow: none;
  font-size: 0.78rem;
  text-decoration: none;
}

.work-view-switcher a > small {
  font-size: 0.65rem;
  font-weight: 800;
}

.work-view-switcher .work-nav-current {
  color: var(--primary-dark);
  background: var(--primary-soft);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--neon-cyan) 28%, var(--line));
}

.work-view-switcher .work-quick-add {
  color: #fff;
  background: linear-gradient(135deg, var(--neon-blue), var(--neon-violet));
  box-shadow: 0 8px 22px color-mix(in srgb, var(--neon-blue) 32%, transparent);
  font-size: 1.35rem;
}

.has-work-navigation main {
  margin-bottom: 2rem;
}

.filter-fab {
  bottom: calc(var(--app-bar-height) + 1.5rem + env(safe-area-inset-bottom));
}

.card,
.panel,
.price-mobile-card,
.inventory-mobile-card {
  transition:
    border-color 180ms ease,
    box-shadow 200ms ease,
    transform 200ms ease;
}

.price-mobile-card:hover,
.inventory-mobile-card:hover {
  border-color: color-mix(in srgb, var(--neon-cyan) 44%, var(--line));
  box-shadow:
    var(--shadow-soft),
    0 0 22px color-mix(in srgb, var(--neon-blue) 12%, transparent);
  transform: translateY(-2px);
}

.page-pricing .price-mobile-list,
.page-inventory .mobile-product-list,
.event-list {
  gap: 0.45rem;
}

.page-pricing .price-mobile-card-link,
.page-inventory .inventory-mobile-card {
  padding: 0.68rem 0.75rem;
}

.page-pricing .price-mobile-specs {
  gap: 0.18rem 0.55rem;
  margin-block: 0.35rem;
}

.page-pricing .product-retail-price {
  margin-block: 0.3rem 0.15rem;
  padding: 0.48rem 0.6rem;
}

.page-inventory .inventory-mobile-copy {
  gap: 0.22rem;
}

.page-inventory .inventory-status {
  min-height: 1.75rem;
  margin-top: 0.1rem;
  padding: 0.25rem 0.48rem;
}

.event-row {
  gap: 0.2rem 0.65rem;
  padding-block: 0.62rem;
}

html.reveal-capable [data-lazy-reveal]:not(.is-revealed) {
  opacity: 0.82;
  transform: translateY(6px) scale(0.996);
}

[data-lazy-reveal].is-revealed {
  opacity: 1;
  transform: none;
  transition:
    opacity 220ms ease,
    transform 300ms cubic-bezier(0.2, 0.8, 0.2, 1);
  transition-delay: var(--reveal-delay, 0ms);
}

@media (max-width: 720px) {
  .app-header {
    min-height: calc(3.55rem + env(safe-area-inset-top));
    padding:
      calc(0.48rem + env(safe-area-inset-top))
      0.7rem
      0.48rem;
  }

  .app-bar-track {
    border-radius: 1.3rem;
  }

  .app-bar-label {
    font-size: 0.58rem;
  }

  .has-work-navigation main {
    margin-bottom: 1rem;
  }

  .work-view-switcher {
    margin-inline: 0;
  }
}

/* Central console grid: every operational table inherits one interaction and theme contract. */
.console-grid-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 0.5rem;
  margin-block: 0.55rem;
  padding: 0.55rem;
  border: 1px solid color-mix(in srgb, var(--primary) 18%, var(--line));
  border-radius: 0.85rem;
  background: color-mix(in srgb, var(--surface) 92%, var(--primary-soft));
  box-shadow: var(--shadow-soft);
}

.console-grid-toolbar label {
  display: grid;
  gap: 0.2rem;
  min-width: 8rem;
  color: var(--muted);
  font-size: 0.66rem;
  font-weight: 800;
}

.console-grid-toolbar input,
.console-grid-toolbar select {
  min-height: 2.15rem;
  margin: 0;
  padding: 0.38rem 0.55rem;
  border: 1px solid var(--line);
  border-radius: 0.65rem;
  color: var(--ink);
  background: var(--surface);
  font: inherit;
}

.console-grid {
  --grid-row-padding: 0.52rem;
  width: max-content;
  min-width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}

.console-grid[data-grid-density="compact"] {
  --grid-row-padding: 0.32rem;
}

.console-grid[data-grid-density="relaxed"] {
  --grid-row-padding: 0.78rem;
}

.console-grid th,
.console-grid td {
  box-sizing: border-box;
  min-width: 16px;
  padding: var(--grid-row-padding) 0.48rem;
  border-inline-start: 1px solid color-mix(in srgb, var(--line) 70%, transparent);
  text-align: center;
  vertical-align: middle;
}

.console-grid.console-grid-wrap th,
.console-grid.console-grid-wrap td,
.console-grid.console-grid-wrap th > *,
.console-grid.console-grid-wrap td > * {
  overflow-wrap: anywhere;
  white-space: normal;
}

.console-grid:not(.console-grid-wrap) th,
.console-grid:not(.console-grid-wrap) td {
  white-space: nowrap;
}

.console-grid thead th {
  position: sticky;
  z-index: 3;
  top: 0;
  color: var(--ink);
  background: color-mix(in srgb, var(--surface) 80%, var(--primary-soft));
  box-shadow: inset 0 -1px color-mix(in srgb, var(--primary) 22%, var(--line));
}

.console-grid tbody tr:nth-child(odd) > td {
  background: color-mix(in srgb, var(--surface) 97%, var(--primary-soft));
}

.console-grid tbody tr:nth-child(even) > td {
  background: color-mix(in srgb, var(--surface) 96%, var(--mint));
}

.console-grid tbody tr:hover > td {
  background: var(--row-hover);
}

.console-grid td.is-grid-selected,
.console-grid th.is-grid-column-selected {
  position: relative;
  background:
    color-mix(in srgb, var(--primary-soft) 78%, var(--surface)) !important;
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--primary) 72%, transparent);
}

.console-grid td.is-grid-selected::after,
.console-grid th.is-grid-column-selected::after {
  position: absolute;
  z-index: 7;
  inset: 0;
  border: 1px solid color-mix(in srgb, var(--primary) 64%, transparent);
  pointer-events: none;
  content: "";
}

.console-grid tr.is-grid-row-selected > td {
  background:
    color-mix(in srgb, var(--primary-soft) 60%, var(--surface)) !important;
}

.console-grid-resizer {
  position: absolute;
  inset-block: 0;
  inset-inline-end: -0.32rem;
  z-index: 5;
  width: 0.64rem;
  cursor: col-resize;
  touch-action: none;
  user-select: none;
}

.console-grid-resizer::after {
  position: absolute;
  inset-block: 22%;
  inset-inline-start: calc(50% - 1px);
  width: 2px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--primary) 28%, transparent);
  content: "";
}

.console-grid-resizer:hover::after,
.console-grid-resizer:focus-visible::after {
  background: var(--primary);
  box-shadow: 0 0 0.55rem color-mix(in srgb, var(--primary) 55%, transparent);
}

@media (pointer: coarse) {
  .console-grid-resizer {
    inset-inline-end: -1rem;
    width: 2rem;
  }
}

.console-grid-context-menu {
  position: fixed;
  z-index: 190;
  display: grid;
  gap: 0.15rem;
  width: min(17rem, calc(100vw - 1rem));
  padding: 0.4rem;
  border: 1px solid color-mix(in srgb, var(--primary) 32%, var(--line));
  border-radius: 0.85rem;
  color: var(--ink);
  background: color-mix(in srgb, var(--surface-raised) 94%, transparent);
  box-shadow: 0 1rem 2.6rem color-mix(in srgb, var(--ink) 22%, transparent);
  backdrop-filter: blur(18px) saturate(140%);
}

.console-grid-context-menu[hidden] {
  display: none;
}

.console-grid-context-menu button {
  width: 100%;
  min-height: 2.2rem;
  padding: 0.42rem 0.6rem;
  border: 0;
  border-radius: 0.58rem;
  color: var(--ink);
  background: transparent;
  text-align: right;
  font: inherit;
  font-size: 0.74rem;
  font-weight: 780;
  cursor: pointer;
}

.console-grid-context-menu button:hover,
.console-grid-context-menu button:focus-visible {
  color: var(--primary-strong);
  background: var(--primary-soft);
}

.console-grid-context-menu hr {
  width: 100%;
  margin: 0.2rem 0;
  border: 0;
  border-block-start: 1px solid var(--line);
}

.console-grid-menu-control,
.console-grid-filter-control {
  display: grid;
  gap: 0.3rem;
  padding: 0.42rem 0.55rem;
  color: var(--muted);
  font-size: 0.7rem;
  font-weight: 800;
}

.console-grid-menu-control select,
.console-grid-filter-search input {
  width: 100%;
  min-height: 2.1rem;
  margin-top: 0.22rem;
  border: 1px solid var(--line);
  border-radius: 0.58rem;
  color: var(--ink);
  background: var(--surface);
}

.console-grid-filter-control button:disabled {
  opacity: 0.46;
  cursor: default;
}

.console-grid-filter-indicator {
  position: relative;
  display: inline-grid;
  width: 1.35rem;
  height: 1.35rem;
  margin-inline-start: 0.2rem;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 999px;
  color: var(--primary);
  background: var(--primary-soft);
  cursor: pointer;
}

.console-grid-filter-indicator[hidden] {
  display: none;
}

.console-grid-filter-indicator::before {
  width: 0;
  height: 0;
  border-inline: 0.3rem solid transparent;
  border-block-start: 0.42rem solid currentColor;
  content: "";
}

.console-grid-filter-indicator::after {
  position: absolute;
  inset-block-start: 0.72rem;
  width: 0.16rem;
  height: 0.3rem;
  border-radius: 0 0 0.12rem 0.12rem;
  background: currentColor;
  content: "";
}

.app-header {
  position: sticky;
  z-index: 70;
  top: 0;
  transition: transform 180ms ease, box-shadow 180ms ease;
  will-change: transform;
}

.app-header.is-scroll-hidden {
  transform: translateY(calc(-100% - 0.35rem));
}

.app-busy-overlay {
  position: fixed;
  z-index: 140;
  inset: 0;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 0.55rem;
  color: var(--ink);
  background: color-mix(in srgb, var(--paper) 72%, transparent);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  backdrop-filter: blur(8px);
  transition: opacity 140ms ease, visibility 140ms ease;
}

body[data-app-navigation-pending="true"] .app-busy-overlay,
body[data-update-applying="true"] .app-busy-overlay {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

/* Catalog metadata is compact on desktop and stays readable as one column on mobile. */
body.console-shell-atlassian .product-detail .product-slug {
  display: inline-flex;
  gap: 4px;
  margin-inline-start: 12px;
  color: var(--atlas-text-subtle);
}

body.console-shell-atlassian .product-metadata-editor {
  padding: 0;
  overflow: clip;
}

body.console-shell-atlassian .product-metadata-editor > summary {
  min-height: 42px;
  padding: 0 14px;
  border-bottom: 1px solid transparent;
  color: var(--atlas-text);
  cursor: pointer;
  font-weight: 700;
}

body.console-shell-atlassian .product-metadata-editor[open] > summary {
  border-bottom-color: var(--atlas-border);
}

body.console-shell-atlassian .catalog-metadata-form {
  display: grid;
  gap: 12px;
  padding: 14px;
}

body.console-shell-atlassian
  :is(.catalog-identity-grid, .catalog-fields-grid) {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

body.console-shell-atlassian
  :is(.catalog-identity-grid, .catalog-fields-grid)
  label {
  display: grid;
  min-width: 0;
  align-content: start;
  gap: 5px;
  margin: 0;
  color: var(--atlas-text-subtle);
  font-size: 12px;
}

body.console-shell-atlassian
  :is(.catalog-identity-grid, .catalog-fields-grid)
  :is(input, select) {
  width: 100%;
  min-width: 0;
  height: 34px;
  min-height: 34px;
  margin: 0;
  padding-block: 4px;
  color: var(--atlas-text);
  background: var(--atlas-surface);
}

body.console-shell-atlassian
  .catalog-identity-grid
  input[readonly] {
  color: var(--atlas-text-subtle);
  background: var(--atlas-surface-subtle);
}

body.console-shell-atlassian .catalog-identity-grid small,
body.console-shell-atlassian .catalog-brand-hint {
  color: var(--atlas-text-subtle);
  font-size: 11px;
  line-height: 1.45;
}

body.console-shell-atlassian .catalog-brand-hint {
  color: var(--atlas-primary);
}

body.console-shell-atlassian .catalog-metadata-form .form-actions {
  display: flex;
  justify-content: flex-end;
}

body.console-shell-atlassian .catalog-metadata-form .form-actions button {
  min-width: 160px;
}

body.console-shell-atlassian .catalog-advanced-identity,
body.console-shell-atlassian .catalog-shared-specifications {
  padding: 12px;
  border: 1px solid var(--atlas-border);
  border-radius: 8px;
  background: var(--atlas-surface-subtle);
}

body.console-shell-atlassian .catalog-advanced-identity > summary {
  min-height: 44px;
  cursor: pointer;
  font-weight: 700;
}

body.console-shell-atlassian .catalog-shared-specifications .section-heading {
  margin-block-end: 10px;
}

body.console-shell-atlassian .catalog-shared-specifications h3,
body.console-shell-atlassian .catalog-shared-specifications p {
  margin: 0;
}

body.console-shell-atlassian .specification-conflict > ul {
  display: grid;
  gap: 8px;
}

body.console-shell-atlassian .specification-conflict li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

body.console-shell-atlassian .field-unit {
  color: var(--atlas-text-subtle);
  font-size: 10px;
  font-weight: 500;
}

@media (max-width: 760px) {
  body.console-shell-atlassian .product-detail .product-slug {
    display: flex;
    margin: 4px 0 0;
  }

  body.console-shell-atlassian
    :is(.catalog-identity-grid, .catalog-fields-grid) {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  body.console-shell-atlassian .catalog-metadata-form {
    padding: 10px;
  }

  body.console-shell-atlassian .catalog-metadata-form .form-actions button {
    width: 100%;
  }
}

.app-busy-mark {
  display: grid;
  place-items: center;
  width: 3.35rem;
  height: 3.35rem;
  border-radius: 1.05rem;
  color: white;
  background: linear-gradient(145deg, var(--primary), var(--neon-cyan));
  box-shadow: 0 0 1.8rem color-mix(in srgb, var(--neon-cyan) 46%, transparent);
  font-weight: 900;
  animation: app-busy-pulse 900ms ease-in-out infinite alternate;
}

@keyframes app-busy-pulse {
  to { transform: translateY(-0.25rem) scale(1.04); }
}

.back-to-top {
  position: fixed;
  z-index: 82;
  inset-inline-start: 1rem;
  bottom: calc(var(--app-bar-height) + 1.35rem + env(safe-area-inset-bottom));
  display: grid;
  place-items: center;
  width: 2.75rem;
  height: 2.75rem;
  padding: 0;
  border: 1px solid color-mix(in srgb, var(--primary) 38%, var(--line));
  border-radius: 999px;
  color: white;
  background: linear-gradient(145deg, var(--primary), var(--neon-cyan));
  box-shadow: 0 0.7rem 1.7rem color-mix(in srgb, var(--primary) 30%, transparent);
}

.back-to-top[hidden],
.price-save-dock[hidden] {
  display: none;
}

.price-save-dock {
  position: fixed;
  z-index: 95;
  inset-inline: max(1rem, calc((100% - 36rem) / 2));
  bottom: calc(var(--app-bar-height) + 0.85rem + env(safe-area-inset-bottom));
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.6rem 0.7rem 0.6rem 0.9rem;
  border: 1px solid color-mix(in srgb, var(--neon-cyan) 46%, var(--line));
  border-radius: 1rem;
  color: white;
  background: color-mix(in srgb, var(--ink) 88%, transparent);
  box-shadow: 0 0.9rem 2.2rem color-mix(in srgb, var(--primary) 35%, transparent);
  backdrop-filter: blur(14px);
}

.price-save-dock button {
  min-height: 2.55rem;
  border: 0;
  border-radius: 0.72rem;
  color: white;
  background: linear-gradient(135deg, var(--primary), var(--neon-cyan));
  font-weight: 900;
}

.update-ready-notice {
  position: fixed;
  z-index: 110;
  inset-inline: max(1rem, calc((100% - 42rem) / 2));
  bottom: calc(var(--app-bar-height) + 0.9rem + env(safe-area-inset-bottom));
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.75rem;
  border: 1px solid color-mix(in srgb, var(--neon-cyan) 50%, var(--line));
  border-radius: 1rem;
  background: var(--surface-raised);
  box-shadow: 0 1rem 2.5rem color-mix(in srgb, var(--primary) 28%, transparent);
}

.update-ready-notice div {
  display: grid;
  gap: 0.15rem;
}

.update-ready-notice span {
  color: var(--muted);
  font-size: 0.75rem;
}

.update-ready-notice.has-unsaved-work {
  border-color: color-mix(in srgb, var(--warning) 60%, var(--line));
}

.update-ready-actions {
  display: flex !important;
  grid-auto-flow: column;
  align-items: center;
  gap: 0.4rem !important;
}

.update-ready-actions .icon-button {
  min-width: 2.35rem;
  padding: 0;
}

body[data-update-applying="true"] {
  overflow: hidden;
}

@media (max-width: 760px) {
  .page-pricing .console-grid-toolbar,
  .page-inventory .console-grid-toolbar,
  .page-serials .console-grid-toolbar {
    display: none;
  }

  .price-save-dock,
  .update-ready-notice {
    inset-inline: 0.65rem;
  }

  .update-ready-notice {
    align-items: stretch;
    flex-direction: column;
  }

  .update-ready-actions {
    justify-content: flex-end;
  }
}

@media (prefers-reduced-motion: reduce) {
  .app-header,
  .app-busy-overlay,
  .app-bar-active-pill,
  main[data-app-view] {
    transition: none;
  }

  .app-busy-mark {
    animation: none;
  }
}

/* Work card board: one responsive, persisted interaction on desktop/mobile. */
body.console-shell-atlassian.page-work .work-list-panel {
  min-width: 0;
  overflow: visible;
}

.work-board-shell,
.work-board,
.work-board-lane,
.work-board-dropzone,
.work-task-card {
  min-width: 0;
  max-width: 100%;
}

.work-board-shell {
  display: grid;
  gap: 0.7rem;
}

.work-board-status {
  min-height: 1.3rem;
  padding-inline: 0.2rem;
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 750;
}

.work-board-status:empty {
  display: none;
}

.work-board-status[data-state="success"] {
  color: var(--success);
}

.work-board-status[data-state="error"] {
  color: var(--danger);
}

.work-board {
  display: grid;
  grid-template-columns:
    repeat(auto-fit, minmax(min(17rem, 100%), 1fr));
  align-items: start;
  gap: 0.75rem;
  width: 100%;
  overflow: visible;
}

.work-board-lane {
  display: grid;
  align-content: start;
  gap: 0.55rem;
  padding: 0.65rem;
  border: 1px solid var(--line);
  border-radius: 0.95rem;
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--surface-raised) 88%, var(--primary-soft)),
      var(--surface)
    );
  box-shadow: var(--shadow-soft);
  transition:
    border-color 150ms ease,
    background 150ms ease,
    opacity 150ms ease;
}

.work-board-lane > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  min-height: 2rem;
  padding-inline: 0.2rem;
}

.work-board-lane > header h3 {
  margin: 0;
  color: var(--ink);
  font-size: 0.82rem;
}

.work-board-lane > header [data-work-lane-count] {
  display: inline-grid;
  min-width: 1.7rem;
  min-height: 1.7rem;
  place-items: center;
  padding-inline: 0.35rem;
  border-radius: 999px;
  color: var(--muted);
  background: color-mix(in srgb, var(--line) 62%, transparent);
  font-size: 0.68rem;
  font-weight: 900;
}

.work-board-lane[data-status="OPEN"] {
  border-block-start: 3px solid var(--primary);
}

.work-board-lane[data-status="IN_PROGRESS"] {
  border-block-start: 3px solid var(--warning);
}

.work-board-lane[data-status="BLOCKED"] {
  border-block-start: 3px solid var(--danger);
}

.work-board-lane[data-status="DONE"] {
  border-block-start: 3px solid var(--success);
}

.work-board-lane[data-status="CANCELLED"] {
  border-block-start: 3px solid var(--muted);
}

.work-board-dropzone {
  display: grid;
  align-content: start;
  gap: 0.55rem;
  min-height: 3.25rem;
}

.work-board-lane-empty {
  margin: 0;
  padding: 0.75rem;
  border: 1px dashed color-mix(in srgb, var(--line) 76%, transparent);
  border-radius: 0.75rem;
  color: var(--muted);
  text-align: center;
  font-size: 0.7rem;
}

.work-board.is-board-dragging .work-board-lane.is-drop-target {
  border-color: color-mix(in srgb, var(--primary) 62%, var(--line));
}

.work-board.is-board-dragging .work-board-lane.is-drop-current {
  background: color-mix(in srgb, var(--primary-soft) 62%, var(--surface));
  box-shadow:
    0 0 0 2px color-mix(in srgb, var(--primary) 28%, transparent),
    var(--shadow-soft);
}

.work-board.is-board-dragging .work-board-lane.is-drop-disabled {
  opacity: 0.48;
}

.work-task-card {
  position: relative;
  display: grid;
  gap: 0.65rem;
  padding: 0.72rem;
  overflow: visible;
  border: 1px solid color-mix(in srgb, var(--line) 88%, transparent);
  border-radius: 0.82rem;
  background: var(--surface-raised);
  box-shadow: 0 5px 16px color-mix(in srgb, var(--ink) 8%, transparent);
  transition:
    transform 150ms ease,
    border-color 150ms ease,
    box-shadow 150ms ease,
    opacity 150ms ease;
}

.work-task-card:hover,
.work-task-card:focus-within,
.work-task-card.is-keyboard-focused {
  border-color: color-mix(in srgb, var(--primary) 42%, var(--line));
  box-shadow: 0 8px 22px color-mix(in srgb, var(--ink) 12%, transparent);
}

.work-task-card:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--primary) 28%, transparent);
  outline-offset: 2px;
}

.work-task-card.is-board-dragging {
  z-index: 4;
  opacity: 0.82;
  transform: scale(0.985);
  border-color: var(--primary);
  box-shadow: 0 16px 34px color-mix(in srgb, var(--primary) 22%, transparent);
}

.work-task-card.is-work-row-selected {
  border-color: var(--primary);
  background: color-mix(in srgb, var(--primary-soft) 38%, var(--surface-raised));
}

.task-card-header {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  align-items: start;
  gap: 0.45rem;
}

.task-card-title {
  display: grid;
  min-width: 0;
  gap: 0.28rem;
}

.task-card-title > a {
  min-width: 0;
  color: var(--ink);
  overflow-wrap: anywhere;
  font-size: 0.82rem;
  font-weight: 850;
  line-height: 1.65;
  text-decoration: none;
}

.task-card-title > a:hover,
.task-card-title > a:focus-visible {
  color: var(--primary);
  text-decoration: underline;
  text-underline-offset: 0.18rem;
}

.task-card-parent,
.task-card-children {
  width: fit-content;
  max-width: 100%;
  color: var(--muted);
  overflow-wrap: anywhere;
  font-size: 0.66rem;
  text-decoration: none;
}

.task-card-parent a,
.task-card-children a {
  color: inherit;
  overflow-wrap: anywhere;
  text-decoration: none;
}

.task-card-parent a:hover,
.task-card-parent a:focus-visible,
.task-card-children a:hover,
.task-card-children a:focus-visible {
  color: var(--primary);
  text-decoration: underline;
  text-underline-offset: 0.15rem;
}

.task-card-children > summary {
  width: fit-content;
  max-width: 100%;
  cursor: pointer;
}

.task-card-children > ul {
  display: grid;
  gap: 0.25rem;
  margin: 0.3rem 0 0;
  padding-inline-start: 1rem;
}

.task-card-children li {
  min-width: 0;
}

.task-card-children li > span {
  display: block;
  margin-inline-start: 0.25rem;
}

.task-card-complete-form {
  margin: 0;
}

.task-card-selector {
  position: absolute;
  inset-block-start: -0.35rem;
  inset-inline-start: -0.35rem;
  z-index: 2;
  display: inline-grid;
  width: 1.55rem;
  height: 1.55rem;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: var(--surface-raised);
  box-shadow: var(--shadow-soft);
  cursor: pointer;
}

.task-card-selector input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.task-card-selector span {
  color: transparent;
  font-size: 0.72rem;
}

.task-card-selector input:checked + span {
  color: #fff;
}

.task-card-selector:has(input:checked) {
  border-color: var(--primary);
  background: var(--primary);
}

.task-card-selector:has(input:focus-visible) {
  outline: 3px solid color-mix(in srgb, var(--primary) 28%, transparent);
  outline-offset: 2px;
}

.task-card-drag-handle {
  padding: 0;
  touch-action: none;
  color: var(--muted);
  background: transparent;
  box-shadow: none;
  cursor: grab;
  user-select: none;
}

.task-card-drag-handle[aria-pressed="true"] {
  color: var(--primary);
  background: var(--primary-soft);
  cursor: grabbing;
}

.task-card-actions {
  position: relative;
}

.task-card-actions > summary {
  display: inline-grid;
  place-items: center;
  border-radius: 0.55rem;
  color: var(--muted);
  cursor: pointer;
  list-style: none;
}

body.console-shell-atlassian
  button.task-card-drag-handle[data-work-drag-handle],
body.console-shell-atlassian .task-card-actions > summary {
  width: 44px;
  min-width: 44px;
  min-height: 44px;
}

.task-card-actions > summary::-webkit-details-marker {
  display: none;
}

.task-card-actions[open] > summary {
  color: var(--primary);
  background: var(--primary-soft);
}

.task-card-actions > div {
  position: absolute;
  z-index: 8;
  inset-block-start: calc(100% + 0.25rem);
  inset-inline-end: 0;
  width: max-content;
  max-width: min(15rem, calc(100vw - 2rem));
  padding: 0.45rem;
  border: 1px solid var(--line);
  border-radius: 0.7rem;
  background: var(--surface-raised);
  box-shadow: var(--shadow-strong);
}

.task-card-actions form,
.task-card-actions button {
  width: 100%;
  margin: 0;
}

.task-card-facts {
  display: flex;
  min-width: 0;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.task-card-facts > span {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: 0.2rem;
  padding: 0.22rem 0.42rem;
  border-radius: 999px;
  color: var(--muted);
  background: color-mix(in srgb, var(--line) 48%, transparent);
  overflow-wrap: anywhere;
  font-size: 0.64rem;
  line-height: 1.45;
}

.task-card-priority {
  color: var(--danger) !important;
  font-weight: 850;
}

.work-select-all {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.72rem;
}

.work-select-all input {
  min-height: auto;
}

@media (max-width: 720px) {
  body.console-shell-atlassian.page-work .work-list-panel {
    padding-inline: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
  }

  .work-board {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.65rem;
    overflow: visible;
  }

  .work-board-lane {
    padding: 0.55rem;
    border-radius: 0.82rem;
  }

  .work-task-card {
    padding: 0.68rem;
  }

  .task-card-header {
    grid-template-columns: auto minmax(0, 1fr) auto auto;
  }

  .task-card-actions > div {
    position: fixed;
    z-index: 70;
    inset: auto 0 0;
    width: 100%;
    max-width: none;
    padding:
      0.8rem 0.8rem
      calc(0.8rem + env(safe-area-inset-bottom));
    border-radius: 1rem 1rem 0 0;
  }

  .work-bulk-bar {
    inset-inline: 0.5rem;
    width: auto;
    max-width: calc(100vw - 1rem);
  }
}

@media (max-width: 390px) {
  .work-task-card,
  .task-card-header,
  .task-card-title,
  .task-card-facts {
    max-width: 100%;
  }

  .task-card-header {
    gap: 0.3rem;
  }

  .task-card-title > a {
    font-size: 0.78rem;
  }

  .task-card-facts > span {
    font-size: 0.61rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.reveal-capable [data-lazy-reveal],
  [data-lazy-reveal].is-revealed,
  .app-bar-item,
  .app-bar-active-pill,
  main[data-app-view] {
    opacity: 1;
    transform: none;
    transition: none;
    animation: none;
  }

  body[data-app-navigation-pending="true"]::after {
    animation: none;
  }
}

@font-face {
  font-family: "Vazirmatn";
  src: url("/static/fonts/Vazirmatn-Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

:root {
  color-scheme: light;
  --paper: #f4f7fd;
  --surface: #ffffff;
  --surface-soft: #eef3fb;
  --surface-raised: #ffffff;
  --surface-tint: #f8faff;
  --ink: #152033;
  --muted: #68758a;
  --line: #d8e2f0;
  --primary: #2f6fea;
  --primary-dark: #1f57cf;
  --primary-soft: #eaf1ff;
  --mint: #e8faf4;
  --amber: #fff7e6;
  --coral: #fff0f1;
  --blue: #eaf1ff;
  --success: #0fa67d;
  --warning: #e99008;
  --danger: #ec4752;
  --warning-ink: #805000;
  --on-primary: #ffffff;
  --on-danger: #ffffff;
  --warning-surface: #fff7e6;
  --danger-surface: #fff0f1;
  --accent-blue-surface: #edf3ff;
  --accent-green-surface: #eafaf5;
  --accent-amber-surface: #fff8e8;
  --accent-coral-surface: #fff1f2;
  --surface-glass: color-mix(in srgb, var(--surface) 96%, transparent);
  --surface-panel: color-mix(in srgb, var(--surface) 98%, var(--paper));
  --row-hover: color-mix(in srgb, var(--primary-soft) 45%, var(--surface));
  --backdrop: rgba(9, 20, 38, 0.48);
  --shadow: 0 18px 48px rgba(32, 66, 128, 0.1);
  --shadow-soft: 0 7px 22px rgba(32, 66, 128, 0.065);
  --header-shadow: 0 5px 22px rgba(32, 66, 128, 0.075);
  --control-shadow: 0 8px 20px color-mix(in srgb, var(--primary) 20%, transparent);
  --radius-card: 1rem;
  --radius-control: 0.8rem;
  font-family: "Vazirmatn", "Segoe UI", Tahoma, sans-serif;
  font-synthesis: none;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --paper: #071321;
  --surface: #0d1f33;
  --surface-soft: #142942;
  --surface-raised: #12273f;
  --surface-tint: #10243a;
  --ink: #edf4ff;
  --muted: #a0b2ca;
  --line: #29425f;
  --primary: #78aaff;
  --primary-dark: #b1ceff;
  --primary-soft: #183b66;
  --mint: #103e36;
  --amber: #44331b;
  --coral: #43252e;
  --blue: #183b66;
  --success: #4ed9ab;
  --warning: #f5bd59;
  --danger: #ff7f8b;
  --warning-ink: #ffdc91;
  --on-primary: #061426;
  --on-danger: #1a0a0e;
  --warning-surface: #44331b;
  --danger-surface: #43252e;
  --accent-blue-surface: #17375e;
  --accent-green-surface: #103b35;
  --accent-amber-surface: #3d301d;
  --accent-coral-surface: #3d252f;
  --surface-glass: color-mix(in srgb, var(--surface) 92%, transparent);
  --surface-panel: color-mix(in srgb, var(--surface) 98%, var(--paper));
  --row-hover: color-mix(in srgb, var(--primary-soft) 54%, var(--surface));
  --backdrop: rgba(2, 9, 19, 0.76);
  --shadow: 0 22px 56px rgba(0, 7, 18, 0.42);
  --shadow-soft: 0 10px 28px rgba(0, 7, 18, 0.28);
  --header-shadow: 0 8px 28px rgba(0, 7, 18, 0.32);
  --control-shadow: 0 8px 24px rgba(42, 104, 204, 0.3);
}

* {
  box-sizing: border-box;
}

html {
  min-width: 320px;
  background: var(--paper);
}

body {
  min-height: 100svh;
  margin: 0;
  color: var(--ink);
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--primary-soft) 24%, var(--paper)) 0,
      var(--paper) 15rem
    );
  background-attachment: fixed;
  font-family: inherit;
  font-weight: 400;
  line-height: 1.65;
  text-rendering: optimizeLegibility;
}

button,
input,
select,
textarea {
  font: inherit;
}

a {
  color: var(--primary);
  text-underline-offset: 0.2em;
}

.app-header {
  position: sticky;
  z-index: 40;
  top: 0;
  display: grid;
  grid-template-columns: minmax(3rem, 1fr) auto minmax(3rem, 1fr);
  grid-template-rows: auto auto;
  min-height: 7rem;
  align-items: center;
  gap: 0.45rem 0.75rem;
  padding: 0.65rem max(1rem, calc((100% - 1180px) / 2)) 0.5rem;
  border-bottom: 1px solid color-mix(in srgb, var(--primary) 18%, var(--line));
  background: var(--surface-glass);
  box-shadow: var(--header-shadow);
  backdrop-filter: blur(16px) saturate(135%);
}

.brand {
  grid-column: 2;
  grid-row: 1;
  display: flex;
  min-width: 0;
  align-items: center;
  justify-self: center;
  gap: 0.75rem;
  text-align: center;
}

.brand-mark {
  display: none;
  width: 2.75rem;
  height: 2.75rem;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 0.75rem;
  color: var(--on-primary);
  background: var(--primary);
  font-size: 0.8rem;
  font-weight: 900;
}

.brand-copy {
  display: grid;
  min-width: 0;
  gap: 0.12rem;
}

.brand-copy strong {
  font-size: 0.96rem;
}

.brand-copy small {
  overflow: hidden;
  color: var(--muted);
  font-size: 0.68rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.module-strip,
.actions,
.inline-form,
.session-bar {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  flex-wrap: wrap;
}

.module-strip {
  grid-column: 1 / -1;
  grid-row: 2;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: min(34rem, 100%);
  justify-content: center;
  margin-inline: auto;
  padding-top: 0.35rem;
  border-top: 1px solid color-mix(in srgb, var(--primary) 12%, var(--line));
}

.module-link {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  gap: 0.45rem;
  justify-content: center;
  padding: 0.5rem 0.8rem;
  border: 1px solid transparent;
  border-radius: var(--radius-control);
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 750;
  text-decoration: none;
  white-space: nowrap;
}

.module-link:hover {
  color: var(--primary);
  background: var(--primary-soft);
}

.module-link.module-current {
  border-color: color-mix(in srgb, var(--primary) 32%, var(--line));
  color: var(--primary-dark);
  background: var(--primary-soft);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary) 7%, transparent);
}

.module-placeholder {
  cursor: not-allowed;
  opacity: 0.68;
  user-select: none;
}

.module-placeholder:hover {
  color: var(--muted);
  background: transparent;
}

.module-icon {
  display: grid;
  width: 1.45rem;
  height: 1.45rem;
  place-items: center;
  border-radius: 0.45rem;
  background: currentColor;
}

.module-icon::after {
  color: var(--surface);
  font-size: 0.8rem;
  font-weight: 900;
}

.module-icon[data-icon="list"]::after {
  content: "◫";
}

.module-icon[data-icon="inventory"]::after {
  content: "▣";
}

.module-icon[data-icon="work"]::after {
  content: "✓";
}

.module-icon[data-icon="accounting"]::after {
  content: "﷼";
  font-size: 0.7rem;
}

.module-trigger {
  display: none;
  min-height: 44px;
  align-items: center;
  gap: 0.4rem;
  color: var(--primary);
  background: var(--primary-soft);
}

.header-meta {
  grid-column: 3;
  grid-row: 1;
  display: flex;
  align-items: center;
  justify-self: end;
  gap: 0.55rem;
}

.app-header:has(.shell-tools) .header-meta {
  display: none;
}

.shell-account-link {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  padding-inline: 0.65rem;
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 700;
  text-decoration: none;
}

.module-drawer-links {
  display: grid;
  align-content: start;
  gap: 0.7rem;
}

.module-drawer-link {
  width: 100%;
  justify-content: flex-start;
  padding: 0.8rem;
  border-color: var(--line);
  background: var(--surface-raised);
}

.breadcrumb {
  display: flex;
  min-height: 2.75rem;
  align-items: center;
  gap: 0.5rem;
  margin: 0 0 0.45rem;
  color: var(--muted);
  font-size: 0.78rem;
  overflow: hidden;
}

.breadcrumb a {
  color: var(--muted);
  text-decoration: none;
}

.breadcrumb a:hover,
.breadcrumb a:focus-visible {
  color: var(--primary);
}

.breadcrumb-home {
  display: grid;
  width: 2.4rem;
  height: 2.4rem;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 0.65rem;
  background: var(--surface-soft);
  font-size: 1.15rem;
}

.breadcrumb-items {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 0.5rem;
  overflow: hidden;
  white-space: nowrap;
}

.breadcrumb-items > * {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.breadcrumb-current {
  color: var(--ink);
  font-weight: 750;
}

.breadcrumb-separator {
  flex: 0 0 auto;
  color: var(--muted);
}

.work-bottom-nav {
  display: none;
}

.toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-bottom: 0.85rem;
}

.toolbar form,
.toolbar p {
  margin: 0;
}

.sync-state {
  font-size: 0.78rem;
  font-weight: 700;
}

.sync-failed {
  color: var(--danger);
}

.filter-fab {
  display: none;
}

.mobile-product-list {
  display: none;
}

.preferences-panel {
  max-width: 34rem;
}

.preferences-panel select {
  margin-top: 0.45rem;
}

.theme-choice {
  display: inline-grid;
  grid-template-columns: repeat(2, minmax(6rem, 1fr));
  gap: 0.25rem;
  width: fit-content;
  max-width: 100%;
  margin-top: 0.75rem;
  padding: 0.25rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: var(--surface-soft);
}

.theme-choice label {
  position: relative;
  margin: 0;
}

.theme-choice input {
  position: absolute;
  width: 1px;
  min-height: 1px;
  opacity: 0;
  pointer-events: none;
}

.theme-choice button,
.theme-choice label > span {
  display: inline-flex;
  width: 100%;
  min-height: 2.5rem;
  align-items: center;
  justify-content: center;
  padding: 0.45rem 0.8rem;
  border: 1px solid transparent;
  border-radius: calc(var(--radius-control) - 0.2rem);
  color: var(--muted);
  background: transparent;
  box-shadow: none;
  cursor: pointer;
  font-size: 0.76rem;
  font-weight: 800;
}

.theme-choice button[aria-pressed="true"],
.theme-choice input:checked + span {
  border-color: color-mix(in srgb, var(--primary) 28%, var(--line));
  color: var(--primary-dark);
  background: var(--surface);
  box-shadow: var(--shadow-soft);
}

.theme-choice input:focus-visible + span {
  outline: 3px solid color-mix(in srgb, var(--primary) 58%, transparent);
  outline-offset: 2px;
}

.nav-current {
  padding: 0.55rem 0.75rem;
  border-radius: 0.7rem;
  color: var(--primary);
  background: var(--mint);
  font-size: 0.76rem;
  font-weight: 800;
  text-decoration: none;
}

.nav-link {
  padding: 0.5rem 0.65rem;
  border-radius: 0.7rem;
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
}

.nav-link:hover {
  color: var(--primary);
  background: var(--surface-soft);
}

.nav-link.nav-current {
  color: var(--primary);
  background: var(--mint);
}

.storage-badge {
  padding: 0.35rem 0.55rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  background: var(--surface);
  font-size: 0.62rem;
  white-space: nowrap;
}

.session-bar {
  width: min(1180px, calc(100% - 2rem));
  justify-content: flex-end;
  margin: 0.8rem auto -0.45rem;
  padding: 0.55rem 0.7rem;
  border: 1px solid var(--line);
  border-radius: 0.85rem;
  color: var(--muted);
  background: var(--surface-glass);
  font-size: 0.7rem;
}

.session-bar > span:first-child {
  margin-inline-end: auto;
}

main {
  width: min(1180px, calc(100% - 2rem));
  margin: 1.35rem auto 4rem;
}

.page-heading {
  margin: 1rem 0 1.35rem;
}

.page-heading > span {
  display: block;
  margin-bottom: 0.32rem;
  color: var(--primary);
  font-size: 0.68rem;
  font-weight: 900;
}

h1,
h2,
h3,
p {
  overflow-wrap: anywhere;
}

h1 {
  margin: 0;
  font-size: clamp(1.4rem, 4vw, 2rem);
  line-height: 1.55;
}

h2 {
  margin-top: 0;
  font-size: 1rem;
}

h3 {
  font-size: 0.88rem;
}

.muted,
.help {
  color: var(--muted);
}

.help {
  margin-top: -0.25rem;
  font-size: 0.72rem;
  line-height: 1.8;
}

.panel,
.card,
.notice,
.metric {
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  background: var(--surface-panel);
}

.panel,
.card {
  padding: 1.1rem;
}

.panel {
  box-shadow: var(--shadow-soft);
}

.card {
  transition: border-color 0.16s ease, transform 0.16s ease;
}

.card:hover {
  border-color: color-mix(in srgb, var(--primary) 30%, var(--line));
  transform: translateY(-1px);
}

.notice {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  margin-bottom: 1rem;
  padding: 0.85rem 1rem;
  color: var(--muted);
  font-size: 0.72rem;
  line-height: 1.8;
}

.notice strong {
  color: var(--ink);
  white-space: nowrap;
}

.warning {
  border-color: color-mix(in srgb, var(--warning) 42%, var(--line));
  background: var(--warning-surface);
}

.error {
  border-color: color-mix(in srgb, var(--danger) 42%, var(--line));
  background: var(--danger-surface);
}

.sync-result {
  margin-bottom: 1rem;
  padding: 0.8rem;
  border-radius: 0.9rem;
  color: var(--primary-dark);
  background: var(--mint);
  font-size: 0.76rem;
  font-weight: 800;
}

.quick-start {
  display: flex;
  min-height: 8.5rem;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  overflow: hidden;
  padding: 1.25rem 1.4rem;
  border: 0;
  color: var(--on-primary);
  background:
    radial-gradient(circle at 8% 15%, rgba(255, 255, 255, 0.14), transparent 12rem),
    linear-gradient(140deg, var(--primary-dark), var(--primary));
  box-shadow: var(--shadow);
}

.quick-start h2 {
  margin-bottom: 0.35rem;
  font-size: 1.2rem;
}

.quick-start .muted {
  max-width: 55ch;
  margin: 0;
  color: color-mix(in srgb, var(--on-primary) 78%, transparent);
  font-size: 0.75rem;
  line-height: 1.8;
}

.grid,
.counts,
.form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 225px), 1fr));
  gap: 0.85rem;
  margin-block: 1rem;
}

.counts {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.metric {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  padding: 0.85rem 0.95rem;
}

.metric span {
  overflow: hidden;
  color: var(--muted);
  font-size: 0.68rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.metric strong {
  display: grid;
  width: 2.35rem;
  height: 2.35rem;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 0.75rem;
  color: var(--primary-dark);
  background: var(--accent-blue-surface);
  font-size: 1rem;
}

.counts .metric:nth-child(4n + 2) strong {
  color: var(--success);
  background: var(--accent-green-surface);
}

.counts .metric:nth-child(4n + 3) strong {
  color: var(--warning);
  background: var(--accent-amber-surface);
}

.counts .metric:nth-child(4n + 4) strong {
  color: var(--danger);
  background: var(--accent-coral-surface);
}

.filters {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr));
  align-items: end;
  gap: 0.65rem;
  margin-block: 1rem;
  padding: 0.85rem;
  box-shadow: none;
}

form {
  display: grid;
  gap: 0.8rem;
}

.template-field-list {
  display: grid;
  gap: 0.55rem;
}

.template-field-row {
  display: block;
  overflow: clip;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 0.85rem;
  background: color-mix(in srgb, var(--surface) 88%, var(--primary-soft));
}

.template-field-row[open] {
  border-color: color-mix(in srgb, var(--primary) 34%, var(--line));
  box-shadow: 0 0.5rem 1.2rem color-mix(in srgb, var(--ink) 7%, transparent);
}

.template-field-summary {
  display: flex;
  min-height: 3.15rem;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
  padding: 0.62rem 0.75rem;
  cursor: pointer;
  list-style: none;
}

.template-field-summary::-webkit-details-marker {
  display: none;
}

.template-field-summary > span:first-child {
  display: grid;
  min-width: 0;
  gap: 0.08rem;
}

.template-field-summary strong,
.template-field-summary small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.template-field-summary small {
  color: var(--muted);
  direction: ltr;
  font-size: 0.65rem;
  text-align: right;
}

.template-field-editor {
  display: grid;
  grid-template-columns: minmax(9rem, 0.8fr) minmax(12rem, 1.5fr) auto auto;
  align-items: end;
  gap: 0.65rem;
  padding: 0.7rem;
  border-top: 1px solid var(--line);
  background: var(--surface);
}

.template-field-row code {
  overflow-wrap: anywhere;
  direction: ltr;
  font-size: 0.78rem;
}

.template-field-row .check-label {
  display: flex;
  min-height: 2.75rem;
  align-items: center;
  gap: 0.45rem;
  padding: 0.55rem 0.65rem;
  border: 1px solid var(--line);
  border-radius: 0.75rem;
  background: var(--surface);
}

.template-field-row .check-label input {
  width: 1.1rem;
  min-height: 1.1rem;
  margin: 0;
}

.template-field-row .remove-field {
  color: var(--danger);
}

.template-metadata,
.template-metadata-grid {
  grid-column: 1 / -1;
}

.template-metadata {
  padding: 0;
  border: 0;
}

.template-metadata > summary {
  min-height: 44px;
  padding: 0.65rem 0.75rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  color: var(--primary);
  background: var(--primary-soft);
  cursor: pointer;
  font-size: 0.72rem;
  font-weight: 750;
}

.template-metadata-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr));
  gap: 0.65rem;
  padding-top: 0.1rem;
}

.template-choice-values {
  grid-column: span 2;
}

.template-choice-values[hidden] {
  display: none;
}

.template-section-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.35rem;
  margin-block: 0.75rem;
  padding: 0.25rem;
  border: 1px solid var(--line);
  border-radius: 0.85rem;
  background: color-mix(in srgb, var(--surface) 82%, var(--canvas));
}

.template-section-tabs a {
  min-height: 44px;
  padding: 0.65rem 0.75rem;
  border-radius: 0.65rem;
  color: var(--muted);
  text-align: center;
  text-decoration: none;
  font-size: 0.76rem;
  font-weight: 850;
}

.template-section-tabs a:hover,
.template-section-tabs a:focus-visible,
.template-section-tabs a.is-active {
  color: var(--primary-dark);
  background: var(--surface);
  box-shadow: 0 0.3rem 0.9rem color-mix(in srgb, var(--ink) 8%, transparent);
}

.common-attribute-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
  margin-top: 0.7rem;
  padding: 0.75rem;
  border: 1px solid color-mix(in srgb, var(--success) 32%, var(--line));
  border-radius: 0.85rem;
  background: color-mix(in srgb, var(--success) 9%, var(--surface));
}

.common-attribute-card h3,
.common-attribute-card p {
  margin: 0.2rem 0 0;
}

.common-attribute-card p {
  color: var(--muted);
  font-size: 0.7rem;
}

.template-editor-heading,
.attribute-status-disclosure > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.7rem;
}

.template-editor-heading h2,
.template-editor-heading p {
  margin: 0;
}

.template-add-field {
  width: fit-content;
  min-height: 44px;
}

.template-save-dock {
  position: sticky;
  z-index: 8;
  bottom: 0.4rem;
  display: grid;
  padding: 0.4rem;
  border: 1px solid var(--line);
  border-radius: 0.85rem;
  background: color-mix(in srgb, var(--surface) 88%, transparent);
  box-shadow: 0 0.6rem 1.5rem color-mix(in srgb, var(--ink) 12%, transparent);
  backdrop-filter: blur(12px);
}

.attribute-status-disclosure > summary {
  min-height: 52px;
  cursor: pointer;
}

.attribute-status-disclosure > summary > span:first-child {
  display: grid;
  gap: 0.12rem;
}

.attribute-status-disclosure > summary small {
  color: var(--muted);
}

.attribute-status-disclosure > .panel {
  margin-top: 0.65rem;
  box-shadow: none;
}

.attribute-status-search {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 0.55rem;
  margin-block: 0.7rem 0.35rem;
}

.attribute-status-search :is(input, button) {
  min-height: 44px;
}

label {
  display: grid;
  gap: 0.38rem;
  color: var(--ink);
  font-size: 0.72rem;
  font-weight: 700;
}

fieldset {
  min-width: 0;
  margin: 0;
  padding: 0.75rem;
  border: 1px solid var(--line);
  border-radius: 0.85rem;
}

legend {
  padding-inline: 0.35rem;
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 700;
}

input,
select,
textarea,
button,
.button {
  max-width: 100%;
  min-height: 2.75rem;
  padding: 0.62rem 0.78rem;
  border-radius: 0.75rem;
  font: inherit;
}

input,
select,
textarea {
  width: 100%;
  border: 1px solid var(--line);
  outline: none;
  color: var(--ink);
  background: var(--surface);
  transition: border-color 0.16s ease, box-shadow 0.16s ease;
}

textarea {
  min-height: 6rem;
  resize: vertical;
  line-height: 1.8;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 16%, transparent);
}

:where(a, button, summary, input, select, textarea):focus-visible {
  outline: 3px solid color-mix(in srgb, var(--primary) 58%, transparent);
  outline-offset: 3px;
}

[data-check-field] {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 0.5rem;
}

.test-check-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(3.4rem, 1fr));
  gap: 0.35rem;
}

[data-check-ok],
[data-check-problem] {
  min-height: 2.75rem;
  padding-inline: 0.65rem;
  border: 1px solid var(--line);
  color: var(--muted);
  background: var(--surface);
  box-shadow: none;
}

[data-check-ok]:hover,
[data-check-problem]:hover {
  color: var(--ink);
  background: var(--surface-soft);
}

[data-check-ok][aria-pressed="true"],
[data-check-problem][aria-pressed="true"] {
  border-color: var(--primary);
  color: var(--primary-dark);
  background: var(--mint);
}

[data-check-field][data-check-state="ok"] .test-check-input {
  border-color: var(--primary);
  background: color-mix(in srgb, var(--mint) 52%, var(--surface));
}

[data-check-field][data-check-state="problem"] .test-check-input,
[data-check-field][data-check-state="problem"]
  [data-check-problem][aria-pressed="true"] {
  border-color: var(--danger);
  color: var(--danger);
  background: color-mix(in srgb, var(--coral) 50%, var(--surface));
}

.test-result-form {
  align-items: start;
}

.test-form-intro {
  padding: 0.8rem 0.9rem;
  border: 1px solid color-mix(in srgb, var(--primary) 22%, var(--line));
  border-radius: var(--radius-control);
  background: var(--primary-soft);
}

.test-form-intro p {
  margin: 0.25rem 0 0;
}

.test-field-card {
  display: grid;
  gap: 0.75rem;
  padding: 0.9rem;
  border-color: var(--line);
  background: var(--surface-raised);
  box-shadow: var(--shadow-soft);
}

.test-field-card > legend {
  color: var(--primary);
}

.test-field-card-header {
  display: flex;
  min-height: 2rem;
  align-items: center;
  justify-content: space-between;
  gap: 0.55rem;
}

.test-field-card-header > span {
  padding: 0.2rem 0.45rem;
  border-radius: 999px;
  color: var(--muted);
  background: var(--surface-soft);
  font-size: 0.62rem;
}

.test-field-card-header .test-field-unit {
  margin-inline-start: auto;
  color: var(--primary-dark);
  background: var(--primary-soft);
}

.verdict-control {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem;
  padding: 0;
  border: 0;
}

.verdict-control legend {
  margin-bottom: 0.35rem;
  color: var(--ink);
}

.verdict-control label {
  display: flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: var(--surface);
  cursor: pointer;
}

.verdict-control input {
  width: 1.05rem;
  min-height: 1.05rem;
  margin: 0;
}

.verdict-control label:has(input[value="HEALTHY"]:checked) {
  border-color: var(--success);
  color: var(--success);
  background: color-mix(in srgb, var(--mint) 72%, var(--surface));
}

.verdict-control label:has(input[value="DEFECT"]:checked) {
  border-color: var(--danger);
  color: var(--danger);
  background: color-mix(in srgb, var(--coral) 72%, var(--surface));
}

.inspection-card:not([data-defect="true"]) .issue-note {
  display: none;
}

.test-field-card[data-invalid="true"] {
  border-color: var(--danger);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger) 16%, transparent);
}

.test-result-form .form-actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.65rem;
  padding-top: 0.75rem;
  border-top: 1px solid var(--line);
}

button,
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  color: var(--on-primary);
  background: var(--primary);
  box-shadow: var(--control-shadow);
  cursor: pointer;
  font-size: 0.72rem;
  font-weight: 800;
  text-decoration: none;
  transition: background 0.16s ease, transform 0.16s ease;
}

button:hover,
.button:hover {
  background: var(--primary-dark);
}

button:active,
.button:active {
  transform: translateY(1px);
}

button.secondary,
.button.secondary {
  border: 1px solid var(--line);
  color: var(--primary);
  background: var(--surface);
  box-shadow: none;
}

button:disabled,
.button[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: 0.55;
}

.wide {
  grid-column: 1 / -1;
}

.choice-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(135px, 1fr));
  gap: 0.5rem;
}

.choice-list label {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.55rem;
  border-radius: 0.65rem;
  background: var(--surface-soft);
}

.choice-list input {
  width: 1rem;
  min-height: auto;
  accent-color: var(--primary);
}

.optional-fields {
  grid-column: 1 / -1;
  border: 1px dashed var(--line);
  border-radius: 0.85rem;
  background: color-mix(in srgb, var(--surface-soft) 72%, transparent);
}

.optional-fields summary {
  padding: 0.75rem;
  color: var(--primary);
  cursor: pointer;
  font-size: 0.72rem;
  font-weight: 800;
}

.optional-fields > .form-grid {
  padding: 0 0.75rem 0.75rem;
}

.field-with-action,
.time-picker-controls {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.5rem;
}

.time-picker-controls {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.table-wrap {
  margin-block: 1rem 1.5rem;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 1rem;
  background: var(--surface);
  -webkit-overflow-scrolling: touch;
}

.work-bulk-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-block: 0.75rem -0.35rem;
  padding: 0.55rem 0.7rem;
  border: 1px solid var(--line);
  border-radius: 0.8rem;
  background: var(--surface-soft);
}

.work-bulk-bar button {
  min-height: 2.35rem;
}

table.console-grid.has-grid-row-selectors {
  --grid-row-selector-width: 3.25rem;
}

.console-grid-row-selector,
.work-row-selector {
  position: sticky;
  z-index: 8;
  inset-inline-start: 0;
  width: var(--grid-row-selector-width, 3.25rem);
  min-width: var(--grid-row-selector-width, 3.25rem) !important;
  max-width: var(--grid-row-selector-width, 3.25rem);
  text-align: center;
  background: var(--surface) !important;
}

.console-grid thead .console-grid-row-selector,
.work-table thead .work-row-selector {
  z-index: 10;
  background: var(--surface-soft) !important;
}

.console-grid-row-selector label,
.work-row-selector label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  min-width: 2.25rem;
  min-height: 2.25rem;
  cursor: pointer;
}

.console-grid-row-selector input,
.work-row-selector input {
  width: 1rem;
  min-width: 1rem;
  height: 1rem;
  margin: 0;
}

.work-table tr.is-work-row-selected > td {
  background: color-mix(in srgb, var(--primary) 12%, var(--surface)) !important;
}

.work-archived-notice {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem;
}

.work-bulk-result ol {
  display: grid;
  gap: 0.4rem;
  padding-inline-start: 1.5rem;
}

table {
  width: 100%;
  min-width: 760px;
  border-collapse: collapse;
}

th,
td {
  padding: 0.78rem;
  border-bottom: 1px solid var(--line);
  text-align: start;
  vertical-align: middle;
  font-size: 0.7rem;
}

th {
  color: var(--muted);
  background: var(--surface-soft);
  font-size: 0.64rem;
  white-space: nowrap;
}

tbody tr:last-child td {
  border-bottom: 0;
}

tbody tr:hover td {
  background: var(--row-hover);
}

.action-badge {
  display: inline-flex;
  margin-bottom: 0.25rem;
  padding: 0.28rem 0.55rem;
  border-radius: 999px;
  font-size: 0.64rem;
  font-weight: 800;
  white-space: nowrap;
}

.action-badge.ready {
  color: var(--primary-dark);
  background: var(--mint);
}

.action-badge.review {
  color: var(--warning-ink);
  background: var(--amber);
}

.stable-code {
  display: inline-block;
  direction: ltr;
  color: var(--muted);
  font-family: Consolas, monospace;
  font-size: 0.62rem;
  unicode-bidi: isolate;
}

.price-group {
  margin-top: 1rem;
}

.pricing-category-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr));
  gap: 0.75rem;
  margin-top: 1rem;
}

.pricing-category-card {
  display: grid;
  gap: 0.35rem;
  min-height: 7rem;
  align-content: center;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: 0.9rem;
  color: var(--ink);
  background: var(--surface-soft);
  text-decoration: none;
}

.pricing-category-card:hover {
  border-color: var(--primary);
}

.pricing-category-card span,
.pricing-category-card small {
  color: var(--muted);
}

.pricing-badge {
  display: inline-flex;
  width: fit-content;
  padding: 0.3rem 0.58rem;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 850;
  white-space: nowrap;
}

.pricing-badge.priced {
  color: var(--primary-dark);
  background: var(--mint);
}

.pricing-badge.remaining {
  color: var(--warning-ink);
  background: var(--amber);
}

.price-row.priced td {
  background: color-mix(in srgb, var(--mint) 35%, var(--surface));
}

.price-row.remaining td {
  background: color-mix(in srgb, var(--amber) 22%, var(--surface));
}

.table-wrap:has(.pricing-table) {
  max-width: 100%;
  overflow: auto;
  overscroll-behavior-inline: auto;
  scrollbar-gutter: stable;
}

.pricing-table {
  border-collapse: separate;
  border-spacing: 0;
}

.pricing-table thead th {
  position: sticky;
  z-index: 3;
  top: 0;
}

.pricing-form-actions {
  display: flex;
  gap: 0.65rem;
  flex-wrap: wrap;
}

.price-mobile-list {
  display: none;
}

.price-mobile-card {
  display: grid;
  gap: 0.8rem;
  padding: 0.95rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  background: var(--surface-raised);
  box-shadow: var(--shadow-soft);
}

.price-mobile-card-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}

.price-mobile-card h3 {
  margin: 0 0 0.3rem;
  font-size: 0.96rem;
  line-height: 1.65;
}

.price-mobile-card p {
  margin: 0;
  color: var(--muted);
  font-size: 0.72rem;
}

.price-mobile-card dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.55rem;
  margin: 0;
}

.price-mobile-card dl > div {
  padding: 0.65rem;
  border-radius: 0.65rem;
  background: var(--surface-soft);
}

.price-mobile-card dt {
  color: var(--muted);
  font-size: 0.65rem;
}

.price-mobile-card dd {
  margin: 0.2rem 0 0;
  color: var(--primary-dark);
  font-size: 0.84rem;
  font-weight: 850;
}

.price-mobile-card .button {
  width: 100%;
  max-width: none;
}

.product-preview-specs,
.product-specifications {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 0.65rem;
  margin: 1rem 0;
}

.product-preview-specs > div,
.product-specifications > div,
.price-pair > div {
  border: 1px solid var(--line);
  border-radius: 0.85rem;
  padding: 0.75rem;
  background: var(--surface-soft);
}

.product-preview-specs dt,
.product-specifications dt,
.price-pair span,
.product-retail-price span {
  color: var(--muted);
  font-size: 0.78rem;
}

.product-preview-specs dd,
.product-specifications dd {
  margin: 0.3rem 0 0;
  font-weight: 800;
}

.product-retail-price,
.price-pair {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.price-pair > div {
  flex: 1;
  display: grid;
  gap: 0.25rem;
}

.pricing-management > summary {
  cursor: pointer;
  min-height: 44px;
  display: flex;
  align-items: center;
  font-weight: 850;
}

.management-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 0.85rem;
  margin-block: 1rem;
}

.management-block {
  border: 1px solid var(--line);
  border-radius: 1rem;
  background: var(--surface-soft);
  padding: 0.85rem;
}

.management-block ul {
  margin: 0.65rem 0 0;
  padding-inline-start: 1.15rem;
}

.compact-editor,
.product-price-form {
  margin-block-start: 0.85rem;
}

[data-aed-price-fields],
[data-fixed-price-fields] {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.pricing-facts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr));
  gap: 0.65rem;
  margin: 0;
}

.pricing-facts div {
  padding: 0.7rem;
  border-radius: 0.7rem;
  background: var(--surface-soft);
}

.pricing-facts dt {
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 750;
}

.pricing-facts dd {
  margin: 0.3rem 0 0;
  overflow-wrap: anywhere;
  font-size: 0.8rem;
}

.empty-state {
  padding: 1rem;
  border: 1px dashed var(--line);
  border-radius: var(--radius-card);
  color: var(--muted);
  background: var(--surface-soft);
  line-height: 1.8;
}

.nowrap {
  white-space: nowrap;
}

.pagination {
  display: flex;
  justify-content: center;
  gap: 0.35rem;
  margin: 1rem 0;
}

.pagination a,
.pagination strong {
  display: grid;
  min-width: 2.2rem;
  min-height: 2.2rem;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 0.65rem;
  background: var(--surface);
  font-size: 0.68rem;
  text-decoration: none;
}

.timeline {
  display: grid;
  gap: 0.75rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.timeline li {
  padding: 0.75rem;
  border-inline-start: 3px solid var(--mint);
  border-radius: 0.55rem;
  background: var(--surface-soft);
  font-size: 0.72rem;
  line-height: 1.8;
}

.jalali-dialog {
  width: min(92vw, 24rem);
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: 1.15rem;
  color: var(--ink);
  background: var(--surface);
  box-shadow: var(--shadow);
}

.jalali-dialog::backdrop {
  background: var(--backdrop);
  backdrop-filter: blur(3px);
}

.calendar-head,
.calendar-jump,
.calendar-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.45rem;
}

.calendar-jump {
  flex: 1;
}

.calendar-jump label {
  flex: 1;
}

.calendar-week,
.calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 0.25rem;
  margin-top: 0.65rem;
}

.calendar-week span {
  color: var(--muted);
  font-size: 0.62rem;
  text-align: center;
}

.calendar-day {
  position: relative;
  min-height: 2.2rem;
  padding: 0;
  border: 1px solid transparent;
  color: var(--ink);
  background: transparent;
  box-shadow: none;
}

.calendar-day:hover,
.calendar-day.today {
  border-color: color-mix(in srgb, var(--primary) 58%, var(--line));
  color: var(--primary);
  background: color-mix(in srgb, var(--primary-soft) 76%, var(--surface));
}

.calendar-day.today:not(.selected) {
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, var(--primary) 62%, transparent),
    0 0 0 2px color-mix(in srgb, var(--primary) 13%, transparent);
  font-weight: 950;
}

.calendar-day.today:not(.selected)::after {
  position: absolute;
  inset-inline-start: 50%;
  bottom: 0.16rem;
  width: 0.25rem;
  height: 0.25rem;
  border-radius: 999px;
  background: var(--primary);
  content: "";
  transform: translateX(-50%);
}

.calendar-day.selected {
  color: var(--on-primary);
  background: var(--primary);
}

.calendar-actions {
  justify-content: flex-end;
  margin-top: 0.8rem;
}

.shell-tools {
  display: contents;
}

.shell-tool {
  position: relative;
  display: inline-flex;
  min-height: 2.65rem;
  align-items: center;
  gap: 0.45rem;
  padding: 0.35rem 0.5rem;
  border: 1px solid var(--line);
  border-radius: 0.85rem;
  color: var(--ink);
  background: var(--surface-raised);
  box-shadow: none;
  white-space: nowrap;
}

.shell-tool:hover,
.shell-tool[aria-expanded="true"] {
  border-color: color-mix(in srgb, var(--primary) 42%, var(--line));
  color: var(--primary-dark);
  background: var(--primary-soft);
}

.shell-tool-admin,
.shell-tool[data-shell-tool="admin"] {
  grid-column: 3;
  grid-row: 1;
  justify-self: end;
  border-color: color-mix(in srgb, var(--primary) 28%, var(--line));
  background: var(--primary-soft);
}

.shell-tool-account,
.shell-tool[data-shell-tool="account"] {
  grid-column: 1;
  grid-row: 1;
  justify-self: start;
  border-color: color-mix(in srgb, var(--success) 24%, var(--line));
}

.shell-tool-icon {
  display: grid;
  width: 1.9rem;
  height: 1.9rem;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 0.65rem;
  color: var(--primary-dark);
  background: var(--mint);
  font-size: 0.7rem;
  font-weight: 900;
}

.shell-tool-admin .shell-tool-icon,
.shell-tool[data-shell-tool="admin"] .shell-tool-icon {
  color: var(--primary-dark);
  background: color-mix(in srgb, var(--primary-soft) 72%, var(--surface));
}

.shell-tool-account .shell-tool-icon,
.shell-tool[data-shell-tool="account"] .shell-tool-icon {
  color: var(--success);
  background: var(--mint);
}

.shell-tool-copy {
  max-width: 8rem;
  overflow: hidden;
  font-size: 0.7rem;
  text-overflow: ellipsis;
}

.shell-tool-badge,
.filter-count {
  display: grid;
  min-width: 1.25rem;
  min-height: 1.25rem;
  place-items: center;
  padding-inline: 0.3rem;
  border-radius: 999px;
  color: var(--on-primary);
  background: var(--primary);
  font-size: 0.58rem;
  font-weight: 900;
}

.ui-drawer {
  position: fixed;
  z-index: 100;
  inset: 0 0 0 auto;
  width: min(92vw, 25rem);
  max-width: none;
  height: 100dvh;
  max-height: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-inline-end: 1px solid var(--line);
  border-radius: 1.5rem 0 0 1.5rem;
  color: var(--ink);
  background: var(--surface);
  box-shadow: var(--shadow);
}

.ui-drawer[open] {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  animation: drawer-enter 0.2s ease-out;
}

.ui-drawer::backdrop {
  background: var(--backdrop);
  backdrop-filter: blur(2px);
}

html.ui-drawer-open {
  overflow: hidden;
}

@keyframes drawer-enter {
  from {
    opacity: 0.4;
    transform: translateX(1.5rem);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.ui-drawer-header,
.ui-drawer-footer {
  padding: 1rem;
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--surface) 90%, var(--primary-soft));
}

.ui-drawer-header {
  display: flex;
  min-height: 5rem;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.ui-drawer-footer {
  border-top: 1px solid var(--line);
  border-bottom: 0;
}

.ui-drawer-footer form,
.ui-drawer-footer button {
  width: 100%;
}

.ui-drawer-body {
  display: grid;
  align-content: start;
  gap: 0.8rem;
  overflow-y: auto;
  padding: 1rem;
  overscroll-behavior: contain;
}

.drawer-title {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 0.7rem;
}

.drawer-title > span:last-child {
  display: grid;
  min-width: 0;
  gap: 0.15rem;
}

.drawer-title strong,
.drawer-title small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.drawer-title strong {
  font-size: 0.9rem;
}

.drawer-title small {
  color: var(--muted);
  font-size: 0.67rem;
}

.drawer-avatar {
  display: grid;
  width: 2.65rem;
  height: 2.65rem;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 0.85rem;
  color: var(--primary-dark);
  background: var(--mint);
  font-size: 0.68rem;
  font-weight: 900;
}

.icon-button {
  display: grid;
  width: 2.5rem;
  min-height: 2.5rem;
  flex: 0 0 auto;
  place-items: center;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 0.75rem;
  color: var(--muted);
  background: var(--surface);
  box-shadow: none;
  font-size: 1.25rem;
}

.drawer-session {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.8rem;
  border: 1px solid color-mix(in srgb, var(--primary) 25%, var(--line));
  border-radius: 0.9rem;
  background: var(--primary-soft);
}

.drawer-session > span:last-child {
  display: grid;
  gap: 0.15rem;
}

.drawer-session strong {
  font-size: 0.76rem;
}

.drawer-session small {
  color: var(--muted);
  font-size: 0.64rem;
}

.status-dot {
  width: 0.68rem;
  height: 0.68rem;
  flex: 0 0 auto;
  border: 3px solid color-mix(in srgb, var(--mint) 70%, var(--surface));
  border-radius: 50%;
  background: var(--primary);
  box-shadow: 0 0 0 1px var(--primary);
}

.drawer-links {
  display: grid;
  gap: 0.55rem;
}

.drawer-link {
  display: grid;
  gap: 0.2rem;
  padding: 0.8rem;
  border: 1px solid var(--line);
  border-radius: 0.9rem;
  color: var(--ink);
  background: var(--surface-raised);
  text-decoration: none;
}

.drawer-link:hover {
  border-color: color-mix(in srgb, var(--primary) 38%, var(--line));
  background: var(--surface-tint);
}

.drawer-link span {
  font-size: 0.78rem;
  font-weight: 850;
}

.drawer-link small {
  color: var(--muted);
  font-size: 0.64rem;
}

.capability-disclosure {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 0.9rem;
  background: var(--surface-raised);
}

.capability-disclosure summary {
  padding: 0.8rem;
  color: var(--primary-dark);
  cursor: pointer;
  font-size: 0.72rem;
  font-weight: 850;
}

.capability-disclosure ul {
  display: flex;
  gap: 0.4rem;
  flex-wrap: wrap;
  margin: 0;
  padding: 0 0.8rem 0.8rem;
  list-style: none;
}

.capability-disclosure li {
  padding: 0.35rem 0.55rem;
  border-radius: 999px;
  color: var(--primary-dark);
  background: var(--primary-soft);
  font-size: 0.62rem;
}

.drawer-theme {
  padding: 0.8rem;
  border: 1px solid var(--line);
  border-radius: 0.9rem;
  background: var(--surface-raised);
}

.drawer-theme select {
  margin-top: 0.35rem;
}

.danger-button {
  border: 1px solid color-mix(in srgb, var(--danger) 45%, var(--line));
  color: var(--danger);
  background: color-mix(in srgb, var(--coral) 45%, var(--surface));
  box-shadow: none;
}

.danger-button:hover {
  color: var(--on-danger);
  background: var(--danger);
}

.release-list {
  gap: 0.65rem;
}

.release-card,
.drawer-empty {
  padding: 0.9rem;
  border: 1px solid var(--line);
  border-radius: 0.95rem;
  background: var(--surface-raised);
}

.release-card-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
}

.release-card-meta strong {
  padding: 0.28rem 0.5rem;
  border-radius: 999px;
  color: var(--primary-dark);
  background: var(--mint);
  font-size: 0.62rem;
}

.release-card-meta time {
  color: var(--muted);
  font-size: 0.62rem;
}

.release-card h3 {
  margin: 0.75rem 0 0.3rem;
  font-size: 0.85rem;
}

.release-card p,
.release-card li,
.drawer-empty p {
  color: var(--muted);
  font-size: 0.68rem;
  line-height: 1.85;
}

.release-card p,
.drawer-empty p {
  margin-block: 0.25rem;
}

.release-card ul {
  margin: 0.55rem 0 0;
  padding-inline-start: 1.1rem;
}

.search-control {
  position: relative;
}

.search-control input {
  padding-inline-end: 2.8rem;
}

[data-search-clear] {
  position: absolute;
  inset-block-end: 0.42rem;
  inset-inline-end: 0.42rem;
  width: 2rem;
  min-height: 2rem;
  padding: 0;
  border: 0;
  border-radius: 0.55rem;
  color: var(--muted);
  background: transparent;
  box-shadow: none;
}

[data-search-clear]:hover {
  color: var(--ink);
  background: var(--surface-soft);
}

body[data-console-capabilities]:not(
  [data-console-capabilities~="work.view"]
) [data-requires-capability="work.view"],
body[data-console-capabilities]:not(
  [data-console-capabilities~="inventory.view"]
) [data-requires-capability="inventory.view"],
body[data-console-capabilities]:not(
  [data-console-capabilities~="pricing.view"]
) [data-requires-capability="pricing.view"],
body[data-console-capabilities]:not(
  [data-console-capabilities~="operations.view"]
) [data-requires-capability="operations.view"] {
  display: none;
}

.sync-progress {
  display: grid;
  gap: 0.35rem;
  min-width: min(100%, 18rem);
  padding: 0.75rem;
  border: 1px solid var(--line);
  border-radius: 0.85rem;
  background: var(--surface-raised);
}

.sync-completed {
  border-color: color-mix(in srgb, var(--success) 36%, var(--line));
}

.sync-progress p {
  margin: 0;
}

.sync-progress progress {
  width: 100%;
  accent-color: var(--primary);
}

.sync-failed {
  border-color: color-mix(in srgb, var(--danger) 35%, var(--line));
}

.event-list {
  display: grid;
  gap: 0.55rem;
  margin: 1rem 0;
  padding: 0;
  list-style: none;
}

.event-row {
  display: grid;
  grid-template-columns: minmax(9rem, auto) minmax(13rem, 1fr) auto auto;
  align-items: center;
  gap: 0.65rem;
  padding: 0.75rem;
  border: 1px solid var(--line);
  border-radius: 0.85rem;
  background: var(--surface-raised);
}

.event-row time,
.event-row .muted {
  font-size: 0.68rem;
}

.release-page-heading {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.release-page .release-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
}

.price-detail-sheet {
  width: min(44rem, calc(100% - 2rem));
  max-width: none;
  max-height: calc(100dvh - 2rem);
  margin: auto;
  padding: 0;
  overflow: visible;
  border: 0;
  color: var(--ink);
  background: transparent;
}

.price-detail-sheet::backdrop {
  background: var(--backdrop);
  backdrop-filter: blur(3px);
}

.price-detail-sheet-shell,
.price-detail-sheet-frame {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  max-height: calc(100dvh - 2rem);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 1.15rem;
  color: var(--ink);
  background: var(--surface);
  box-shadow: var(--shadow);
}

.price-detail-sheet-header {
  position: sticky;
  z-index: 2;
  top: 0;
  display: flex;
  min-height: 4rem;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--line);
  background: var(--surface-glass);
  backdrop-filter: blur(12px);
}

.price-detail-sheet-header strong {
  min-width: 0;
  overflow: hidden;
  font-size: 0.9rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.price-detail-sheet-body {
  min-height: 8rem;
  overflow-y: auto;
  padding: 1rem;
  overscroll-behavior: contain;
}

.price-detail-sheet-body > :first-child {
  margin-top: 0;
}

.price-detail-sheet-body > :last-child {
  margin-bottom: 0;
}

.price-detail-sheet-loading,
.price-detail-sheet-error {
  display: grid;
  min-height: 8rem;
  place-items: center;
  margin: 0;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  color: var(--muted);
  background: var(--surface-soft);
  text-align: center;
}

.price-detail-sheet-error {
  border-color: color-mix(in srgb, var(--danger) 42%, var(--line));
  color: var(--danger);
  background: var(--danger-surface);
}

[data-price-detail-close] {
  width: 2.75rem;
  min-height: 2.75rem;
  padding: 0;
  color: var(--muted);
  background: var(--surface);
  box-shadow: none;
}

[data-price-detail-close]:hover {
  color: var(--ink);
  background: var(--surface-soft);
}

html:has(.price-detail-sheet[open]) {
  overflow: hidden;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

@media (max-width: 720px) {
  .price-detail-sheet {
    inset: auto 0 0;
    width: 100%;
    max-height: calc(100dvh - env(safe-area-inset-top) - 0.5rem);
    margin: auto 0 0;
  }

  .price-detail-sheet-shell,
  .price-detail-sheet-frame {
    max-height: calc(100dvh - env(safe-area-inset-top) - 0.5rem);
    border-inline: 0;
    border-bottom: 0;
    border-radius: 1.2rem 1.2rem 0 0;
  }

  .price-detail-sheet-header {
    min-height: 3.75rem;
    padding: 0.65rem 0.85rem;
  }

  .price-detail-sheet-body {
    padding:
      0.85rem
      max(0.85rem, env(safe-area-inset-right))
      calc(0.85rem + env(safe-area-inset-bottom))
      max(0.85rem, env(safe-area-inset-left));
  }

  .event-row {
    grid-template-columns: 1fr;
  }

  .release-page-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .app-header {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    grid-template-rows: auto auto;
    min-height: calc(7rem + env(safe-area-inset-top));
    align-items: center;
    gap: 0.45rem 0.5rem;
    padding:
      calc(0.55rem + env(safe-area-inset-top))
      max(0.75rem, env(safe-area-inset-right))
      0.45rem
      max(0.75rem, env(safe-area-inset-left));
  }

  .app-header .brand {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
    justify-self: center;
    text-align: center;
  }

  .app-header .brand-mark {
    width: 2.55rem;
    height: 2.55rem;
  }

  .brand-copy small,
  .storage-badge {
    display: none;
  }

  .module-strip {
    grid-column: 1 / -1;
    grid-row: 2;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
    gap: 0.35rem;
    margin: 0;
    padding-top: 0.45rem;
    border-top: 1px solid color-mix(in srgb, var(--primary) 12%, var(--line));
  }

  .module-strip .module-link {
    min-width: 0;
    min-height: 2.65rem;
    justify-content: center;
    gap: 0.3rem;
    padding: 0.4rem 0.3rem;
    border-color: transparent;
    font-size: 0.72rem;
  }

  .module-strip .module-icon {
    width: 1.25rem;
    height: 1.25rem;
  }

  .module-trigger {
    display: none;
  }

  .header-meta {
    grid-column: 3;
    grid-row: 1;
    min-width: 0;
    justify-self: end;
  }

  .app-header:has(.shell-tools) .header-meta {
    display: none;
  }

  .shell-account-link {
    width: 2.55rem;
    padding: 0;
    justify-content: center;
    overflow: hidden;
    color: transparent;
  }

  .shell-account-link::before {
    content: "⚙";
    color: var(--muted);
    font-size: 1.15rem;
  }

  .shell-tools {
    position: static;
    grid-column: 1;
    grid-row: 1;
    justify-self: start;
    margin: 0;
  }

  .shell-tool {
    width: 2.75rem;
    min-height: 2.75rem;
    justify-content: center;
    padding: 0.25rem;
  }

  .shell-tool-copy {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
  }

  .shell-tool-badge {
    position: absolute;
    top: -0.28rem;
    right: -0.25rem;
  }

  .shell-tool-admin,
  .shell-tool[data-shell-tool="admin"] {
    border-color: color-mix(in srgb, var(--primary) 34%, var(--line));
    background: var(--primary-soft);
  }

  .shell-tool-admin .shell-tool-icon,
  .shell-tool[data-shell-tool="admin"] .shell-tool-icon {
    color: var(--primary-dark);
    background: transparent;
  }

  .shell-tool-account,
  .shell-tool[data-shell-tool="account"] {
    border-color: color-mix(in srgb, var(--success) 28%, var(--line));
  }

  .shell-tool-account .shell-tool-icon,
  .shell-tool[data-shell-tool="account"] .shell-tool-icon {
    color: var(--success);
    background: var(--mint);
  }

  .session-bar {
    justify-content: space-between;
    margin-top: 0.65rem;
  }

  .session-bar > span:first-child {
    width: 100%;
  }

  main {
    margin-top: 0.7rem;
  }

  .page-heading {
    margin: 0.35rem 0 0.9rem;
  }

  .page-heading h1 {
    font-size: clamp(1.05rem, 6vw, 1.35rem);
  }

  .breadcrumb {
    margin-bottom: 0.2rem;
  }

  .quick-start {
    display: grid;
    min-height: auto;
    padding: 1.1rem;
  }

  .quick-start .actions {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    width: 100%;
  }

  .counts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
  }

  .metric {
    align-items: flex-start;
    flex-direction: column-reverse;
  }

  .metric strong {
    width: 2rem;
    height: 2rem;
  }

  .filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .filters label:first-child {
    grid-column: 1 / -1;
  }

  .template-field-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .template-field-row > label:first-of-type,
  .template-field-row > label:nth-of-type(2) {
    grid-column: 1 / -1;
  }

  .form-grid {
    grid-template-columns: 1fr;
  }

  [data-check-field] {
    grid-template-columns: 1fr;
  }

  .test-check-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .wide {
    grid-column: auto;
  }

  .notice {
    display: grid;
  }

  .filter-panel {
    display: none;
  }

  .filter-panel.filter-open {
    display: grid;
    margin-top: 0.8rem;
  }

  .filter-fab {
    position: fixed;
    z-index: 30;
    bottom:
      calc(var(--app-bar-height) + 1.15rem + env(safe-area-inset-bottom));
    left: 1rem;
    display: grid;
    min-width: 4.2rem;
    min-height: 3.2rem;
    place-items: center;
    border-radius: 999px;
    box-shadow: var(--shadow);
  }

  .page-inventory .filter-fab {
    position: static;
    display: inline-grid;
    width: 100%;
    min-height: 44px;
    margin-top: 0.7rem;
    border-radius: var(--radius-control);
    box-shadow: none;
  }

  .has-work-navigation .filter-fab {
    display: none;
  }

  .has-work-navigation main {
    margin-bottom: calc(6rem + env(safe-area-inset-bottom));
  }

  .work-bottom-nav {
    position: fixed;
    z-index: 35;
    inset-inline: 0;
    bottom: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    min-height: calc(4.2rem + env(safe-area-inset-bottom));
    padding: 0.35rem 0.65rem calc(0.35rem + env(safe-area-inset-bottom));
    border-top: 1px solid var(--line);
    background: var(--surface-glass);
    box-shadow: var(--header-shadow);
    backdrop-filter: blur(16px) saturate(135%);
  }

  .work-bottom-nav a:not(.work-quick-add) {
    display: grid;
    min-height: 44px;
    place-items: center;
    gap: 0.15rem;
    border-radius: 0.65rem;
    color: var(--muted);
    text-decoration: none;
  }

  .work-bottom-nav a > span {
    font-size: 1.1rem;
  }

  .work-bottom-nav a > small {
    font-size: 0.68rem;
    font-weight: 750;
  }

  .work-bottom-nav .work-nav-current {
    color: var(--primary);
    background: var(--primary-soft);
  }

  .work-quick-add {
    position: absolute;
    inset-inline-end: 1rem;
    bottom: calc(4.65rem + env(safe-area-inset-bottom));
    display: grid;
    width: 3.5rem;
    height: 3.5rem;
    place-items: center;
    border-radius: 50%;
    color: var(--on-primary);
    background: var(--primary);
    box-shadow: var(--shadow);
    font-size: 1.65rem;
    text-decoration: none;
  }

  .filter-fab > span:first-child {
    font-size: 1rem;
  }

  .table-wrap:has(.inventory-table):not(:has(.consignment-results-table)) {
    display: none;
  }

  .mobile-product-list {
    display: grid;
    gap: 0.65rem;
  }

  .mobile-product-card {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 0.95rem;
    background: var(--surface);
  }

  .mobile-product-card summary {
    display: grid;
    gap: 0.2rem;
    padding: 0.85rem;
    cursor: pointer;
    list-style-position: inside;
    font-size: 0.9rem;
  }

  .mobile-product-card summary bdi {
    color: var(--muted);
    font-size: 0.82rem;
  }

  .mobile-product-details {
    padding: 0 0.85rem 0.85rem;
    border-top: 1px solid var(--line);
  }

  .mobile-product-details p {
    display: flex;
    justify-content: space-between;
    gap: 0.7rem;
    margin: 0;
    padding: 0.55rem 0;
    border-bottom: 1px solid var(--line);
    font-size: 0.84rem;
  }

  .mobile-product-details p span {
    color: var(--muted);
  }

  .table-wrap:has(.work-table),
  .table-wrap:has(.inventory-table) {
    overflow: visible;
    border: 0;
    background: transparent;
  }

  .work-table,
  .inventory-table {
    display: block;
    min-width: 0;
  }

  .work-table thead,
  .inventory-table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
  }

  .work-table tbody,
  .inventory-table tbody {
    display: grid;
    gap: 0.7rem;
  }

  .work-table tr,
  .inventory-table tr {
    display: block;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 0.9rem;
    background: var(--surface);
    box-shadow: var(--shadow-soft);
  }

  .work-table td,
  .inventory-table td {
    display: grid;
    grid-template-columns: minmax(4.8rem, 0.35fr) 1fr;
    gap: 0.7rem;
    padding: 0.65rem 0.8rem;
    font-size: 0.84rem;
    white-space: normal;
  }

  .work-table td::before,
  .inventory-table td::before {
    content: attr(data-label);
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 800;
  }

  label {
    font-size: 0.82rem;
  }

  input,
  select,
  textarea,
  button,
  .button {
    min-height: 3rem;
    font-size: 0.84rem;
  }

  .action-badge,
  .pricing-badge {
    font-size: 0.74rem;
  }

  .pricing-form-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .work-table td:not([data-label]),
  .inventory-table td:not([data-label]) {
    display: block;
  }

  .work-table td:not([data-label])::before,
  .inventory-table td:not([data-label])::before {
    content: none;
  }

  .work-table tbody tr:hover td,
  .inventory-table tbody tr:hover td {
    background: transparent;
  }

  .table-wrap:has(.pricing-table),
  .table-wrap:has(.consignment-results-table) {
    display: block;
    overflow-x: auto;
    border: 1px solid var(--line);
    background: var(--surface);
  }

  .table-wrap:has(.pricing-table) + .mobile-product-list {
    display: none;
  }

  .pricing-table.inventory-table,
  .consignment-results-table.inventory-table {
    display: table;
    width: max-content;
    min-width: 42rem;
  }

  .pricing-table.inventory-table thead,
  .consignment-results-table.inventory-table thead {
    position: static;
    width: auto;
    height: auto;
    overflow: visible;
    clip: auto;
  }

  .pricing-table.inventory-table tbody,
  .consignment-results-table.inventory-table tbody {
    display: table-row-group;
  }

  .pricing-table.inventory-table tr,
  .consignment-results-table.inventory-table tr {
    display: table-row;
    overflow: visible;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  .pricing-table.inventory-table :is(th, td),
  .consignment-results-table.inventory-table :is(th, td) {
    display: table-cell;
    min-width: 7.5rem;
    padding: 0.62rem 0.7rem;
    font-size: 0.76rem;
    white-space: nowrap;
  }

  .pricing-table.inventory-table :is(th, td):first-child,
  .consignment-results-table.inventory-table :is(th, td):first-child {
    min-width: 11rem;
    max-width: 14rem;
    white-space: normal;
  }

  .pricing-table.inventory-table td::before,
  .consignment-results-table.inventory-table td::before {
    content: none;
  }

  .pricing-table.inventory-table tbody tr:hover td,
  .consignment-results-table.inventory-table tbody tr:hover td {
    background: inherit;
  }
}

@media (max-width: 720px) {
  .test-template-admin,
  .template-editor-panel,
  .attribute-status-panel {
    padding: 0.62rem;
  }

  .template-section-tabs {
    position: sticky;
    z-index: 7;
    top: 0.35rem;
    margin-block: 0.5rem;
    background: color-mix(in srgb, var(--surface) 92%, transparent);
    backdrop-filter: blur(12px);
  }

  .template-section-tabs a {
    min-height: 44px;
    padding: 0.5rem 0.35rem;
    font-size: 0.7rem;
  }

  .template-category-filter {
    grid-template-columns: 1fr;
    gap: 0.45rem;
    margin-block: 0.5rem;
    padding: 0.55rem;
  }

  .common-attribute-card {
    align-items: flex-start;
    padding: 0.6rem;
  }

  .common-attribute-card > strong {
    font-size: 0.66rem;
    white-space: nowrap;
  }

  .template-editor-heading {
    margin-bottom: 0.2rem;
  }

  .template-field-list {
    gap: 0.4rem;
  }

  .template-field-summary {
    min-height: 2.85rem;
    padding: 0.48rem 0.58rem;
  }

  .template-field-summary .storage-badge {
    padding: 0.25rem 0.42rem;
    font-size: 0.62rem;
  }

  .template-field-editor,
  .template-metadata-grid {
    grid-template-columns: 1fr;
    gap: 0.5rem;
  }

  .template-field-editor {
    padding: 0.55rem;
  }

  .template-choice-values {
    grid-column: auto;
  }

  .template-field-row .check-label {
    min-height: 44px;
    padding: 0.4rem 0.5rem;
  }

  .template-field-editor :is(input:not([type="hidden"]), select, textarea) {
    min-height: 44px;
  }

  .template-add-field {
    width: 100%;
  }

  .template-save-dock {
    bottom: calc(4.85rem + env(safe-area-inset-bottom));
  }

  .attribute-status-disclosure > summary {
    min-height: 48px;
  }

  .attribute-status-disclosure > .panel {
    padding: 0.5rem;
  }

  .attribute-status-search {
    grid-template-columns: 1fr;
  }

  .attribute-status-search button {
    width: 100%;
  }

  .attribute-status-disclosure .table-wrap {
    max-height: min(62vh, 34rem);
    overflow: auto;
    overscroll-behavior: contain;
  }
}

@media (max-width: 430px) {
  .ui-drawer {
    width: 100vw;
    border-radius: 0;
  }

  .app-header nav .nav-current {
    padding-inline: 0.6rem;
  }

  .app-header {
    padding-inline:
      max(0.65rem, env(safe-area-inset-right))
      max(0.65rem, env(safe-area-inset-left));
  }

  main,
  .session-bar {
    width: min(100% - 1rem, 1180px);
  }

  .panel,
  .card {
    padding: 0.85rem;
  }

  .filters {
    grid-template-columns: 1fr;
  }

  .filters label:first-child {
    grid-column: auto;
  }

  .template-field-row {
    grid-template-columns: 1fr;
  }

  .template-field-row > label:first-of-type,
  .template-field-row > label:nth-of-type(2) {
    grid-column: auto;
  }

  .quick-start .actions {
    grid-template-columns: 1fr;
  }

  .theme-choice {
    width: 100%;
  }
}

@media (max-width: 380px) {
  .app-header .brand-copy {
    display: grid;
  }

  .app-header .brand-copy strong {
    font-size: 0.86rem;
  }

  .module-strip .module-link {
    font-size: 0.66rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition: none !important;
  }

  .card:hover,
  button:active,
  .button:active {
    transform: none;
  }
}

@media (max-width: 720px) {
  .page-pricing .pricing-table-wrap {
    display: none;
  }

  .page-pricing .price-mobile-list {
    display: grid;
    gap: 0.7rem;
  }
}

/* Owner-approved compact mobile shell: Price List and Inventory */
.price-mobile-controls,
.inventory-status-tabs {
  display: none;
}

.price-status-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.45rem;
  width: 100%;
}

.price-status-tabs .button {
  min-width: 0;
  min-height: 2.75rem;
  justify-content: center;
  border-color: var(--line);
  color: var(--muted);
  background: var(--surface-raised);
  box-shadow: none;
  white-space: nowrap;
}

.price-status-tabs .button[aria-current="page"] {
  border-color: color-mix(in srgb, var(--primary) 42%, var(--line));
  color: var(--primary-dark);
  background: var(--primary-soft);
}

@media (max-width: 720px) {
  .page-pricing main,
  .page-inventory main {
    margin-top: 0.7rem;
  }

  .page-pricing .storage-notice,
  .page-inventory .storage-notice,
  .page-pricing .page-heading,
  .page-inventory .page-heading {
    display: none;
  }

  .page-pricing .breadcrumb,
  .page-inventory .breadcrumb {
    min-height: 3.35rem;
    margin: 0 0 0.55rem;
    padding-inline: 0.15rem;
  }

  .page-pricing .breadcrumb-home,
  .page-inventory .breadcrumb-home {
    width: 2.25rem;
    height: 2.25rem;
    background: transparent;
  }

  .page-pricing .pricing-control-panel,
  .page-pricing .pricing-list-panel,
  .page-inventory .inventory-control-panel,
  .page-inventory .inventory-list-panel {
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
  }

  .page-pricing .price-mobile-controls {
    display: grid;
    gap: 0.65rem;
    margin: 0;
  }

  .exchange-rate-chip {
    width: fit-content;
    padding: 0.42rem 0.7rem;
    border: 1px solid color-mix(in srgb, var(--success) 22%, var(--line));
    border-radius: 0.65rem;
    color: var(--success);
    background: color-mix(in srgb, var(--mint) 72%, var(--surface));
    font-size: 0.72rem;
    font-weight: 800;
  }

  .price-mobile-search input,
  .inventory-search input {
    min-height: 3rem;
    padding-inline: 0.9rem;
    border-radius: 0.8rem;
    background: var(--surface);
  }

  .price-mobile-category {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 2.85rem;
    gap: 0.55rem;
  }

  .price-mobile-category label {
    min-width: 0;
  }

  .price-mobile-category select {
    min-height: 2.85rem;
    border-color: var(--primary);
    color: var(--on-primary);
    background: var(--primary);
    font-weight: 800;
  }

  .price-mobile-category button {
    width: 2.85rem;
    min-height: 2.85rem;
    padding: 0;
    color: var(--muted);
    background: var(--surface);
    box-shadow: none;
    font-size: 1rem;
  }

  .page-pricing .filter-fab,
  .page-inventory .filter-fab {
    display: none;
  }

  .page-pricing .pricing-list-panel {
    margin-top: 0.75rem;
  }

  .page-pricing .pricing-list-panel > .section-heading {
    display: none;
  }

  .page-pricing .price-mobile-list {
    gap: 0.55rem;
  }

  .page-pricing .price-mobile-card {
    display: block;
    overflow: hidden;
    padding: 0;
    border-radius: 0.8rem;
    background: var(--surface);
    border-color: color-mix(in srgb, var(--primary) 10%, var(--line));
    box-shadow: var(--shadow-soft);
  }

  .page-pricing .price-mobile-card:not(:has(> .price-mobile-card-link)) {
    display: grid;
    padding: 0.85rem;
  }

  .price-mobile-card-link {
    position: relative;
    display: grid;
    grid-template:
      "title title" auto
      "specs price" 1fr
      "code arrow" auto
      / minmax(0, 1fr) minmax(7.3rem, auto);
    gap: 0.45rem 0.75rem;
    padding: 0.85rem;
    color: var(--ink);
    text-decoration: none;
  }

  .price-mobile-card-link h3 {
    grid-area: title;
    margin: 0;
    font-size: 0.95rem;
    text-align: start;
  }

  .price-mobile-specs {
    grid-area: specs;
    display: grid;
    align-content: center;
    gap: 0.32rem;
    min-width: 0;
    margin: 0;
    padding: 0;
    color: var(--muted);
    font-size: 0.72rem;
    list-style: none;
  }

  .price-mobile-specs li {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 0.4rem;
  }

  .price-mobile-specs i {
    width: 0.42rem;
    height: 0.42rem;
    flex: 0 0 auto;
    border: 1.5px solid var(--muted);
    border-radius: 0.14rem;
  }

  .price-mobile-specs bdi {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .page-pricing .price-mobile-card .product-retail-price {
    grid-area: price;
    display: grid;
    align-content: center;
    justify-items: end;
    gap: 0.15rem;
    margin: 0;
    text-align: end;
  }

  .page-pricing .product-retail-price strong {
    color: var(--success);
    font-size: 0.88rem;
    white-space: nowrap;
  }

  .price-mobile-card-link > small {
    grid-area: code;
    color: var(--muted);
    direction: ltr;
    font-size: 0.64rem;
    text-align: left;
  }

  .price-card-chevron {
    grid-area: arrow;
    align-self: end;
    justify-self: end;
    color: var(--muted);
    font-size: 1.5rem;
    line-height: 1;
  }

  .page-pricing .pricing-management {
    margin-top: 0.7rem;
    padding: 0.15rem 0.85rem;
    box-shadow: none;
  }

  .page-pricing .pricing-management > summary {
    color: var(--ink);
    font-size: 0.78rem;
  }

  .page-pricing .product-detail {
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
  }

  .page-pricing .product-detail > .section-heading {
    padding: 0.9rem;
    border: 1px solid var(--line);
    border-radius: 0.85rem;
    background: var(--surface);
  }

  .page-pricing .product-detail > .section-heading h2 {
    margin-bottom: 0.25rem;
    font-size: 1.08rem;
  }

  .page-pricing .product-specifications {
    display: block;
    overflow: hidden;
    margin: 0.65rem 0;
    padding: 0.3rem 0.8rem;
    border: 1px solid var(--line);
    border-radius: 0.85rem;
    background: var(--surface);
  }

  .page-pricing .product-specifications > div {
    display: grid;
    grid-template-columns: minmax(5.5rem, 0.35fr) minmax(0, 1fr);
    gap: 0.65rem;
    padding: 0.62rem 0;
    border: 0;
    border-bottom: 1px solid var(--line);
    border-radius: 0;
    background: transparent;
  }

  .page-pricing .product-specifications > div:last-child {
    border-bottom: 0;
  }

  .page-pricing .product-specifications dd {
    margin: 0;
  }

  .page-pricing .price-pair {
    display: grid;
    gap: 0.6rem;
  }

  .page-pricing .price-pair > div {
    min-height: 5rem;
    align-content: center;
    padding: 0.85rem;
    border-radius: 0.85rem;
    background: var(--surface);
  }

  .page-pricing .price-pair > div:first-child strong {
    color: var(--success);
  }

  .page-pricing .price-pair > div:last-child strong {
    color: var(--primary);
  }

  .page-inventory .inventory-operations {
    display: none;
  }

  .page-inventory .inventory-filter-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.55rem;
    margin: 0;
    padding: 0;
  }

  .page-inventory .inventory-search {
    grid-column: 1 / -1;
  }

  .page-inventory .inventory-search > span,
  .page-inventory .inventory-filter-form > label:not(.inventory-search) {
    font-size: 0;
  }

  .page-inventory .inventory-filter-form select {
    min-height: 2.85rem;
    border-color: var(--primary);
    color: var(--on-primary);
    background: var(--primary);
    font-size: 0.8rem;
    font-weight: 800;
  }

  .page-inventory .inventory-state-select {
    display: none;
  }

  .page-inventory .inventory-status-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.45rem;
    margin-top: 0.65rem;
  }

  .inventory-status-tab {
    display: flex;
    min-height: 2.75rem;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    padding: 0.45rem 0.25rem;
    border: 1px solid var(--line);
    border-radius: 0.75rem;
    color: var(--muted);
    background: var(--surface);
    font-size: 0.68rem;
    font-weight: 800;
    text-align: center;
    text-decoration: none;
  }

  .inventory-status-tab i,
  .inventory-status i {
    width: 0.52rem;
    height: 0.52rem;
    flex: 0 0 auto;
    border-radius: 50%;
    background: var(--muted);
  }

  .inventory-status-tab.ready i,
  .inventory-status.ready i {
    background: var(--success);
  }

  .inventory-status-tab.review i,
  .inventory-status.review i {
    background: var(--warning);
  }

  .inventory-status-tab.is-current.ready {
    border-color: var(--success);
    color: var(--success);
    background: var(--mint);
  }

  .inventory-status-tab.is-current.review {
    border-color: var(--warning);
    color: var(--warning);
    background: var(--amber);
  }

  .inventory-status-tab.is-current.untested {
    border-color: var(--muted);
    color: var(--ink);
    background: var(--surface-soft);
  }

  .page-inventory .inventory-list-panel {
    margin-top: 0.8rem;
  }

  .page-inventory .inventory-list-panel > h2 {
    margin-bottom: 0.55rem;
    padding-inline: 0.15rem;
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 750;
  }

  .page-inventory .mobile-product-list {
    gap: 0.55rem;
  }

  .page-pricing .pricing-list-panel .empty-state,
  .page-inventory .inventory-list-panel .empty-state {
    margin: 0;
    padding: 0.85rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-card);
    background: var(--surface);
  }

  .inventory-mobile-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 0.75rem;
    padding: 0.85rem;
    border: 1px solid color-mix(in srgb, var(--primary) 10%, var(--line));
    border-radius: 0.85rem;
    background: var(--surface);
    box-shadow: var(--shadow-soft);
  }

  .inventory-mobile-copy {
    display: grid;
    gap: 0.35rem;
  }

  .inventory-mobile-copy h3,
  .inventory-mobile-copy p {
    margin: 0;
  }

  .inventory-mobile-copy h3 {
    font-size: 0.94rem;
  }

  .inventory-mobile-copy p {
    color: var(--muted);
    direction: ltr;
    font-size: 0.7rem;
    text-align: right;
  }

  .inventory-status {
    display: inline-flex;
    width: fit-content;
    min-height: 2rem;
    align-items: center;
    gap: 0.35rem;
    margin-top: 0.2rem;
    padding: 0.35rem 0.55rem;
    border-radius: 0.65rem;
    color: var(--muted);
    background: var(--surface-soft);
    font-size: 0.7rem;
    font-weight: 800;
  }

  .inventory-status.ready {
    color: var(--success);
    background: var(--mint);
  }

  .inventory-status.review {
    color: var(--warning);
    background: var(--amber);
  }

  .inventory-test-action {
    min-height: 2.75rem;
    align-self: end;
    padding: 0.55rem 0.7rem;
    white-space: nowrap;
  }
}

/* Unified Settings and Owner navigation map */
.settings-drawer {
  inset: 0 0 0 auto;
  width: min(34rem, 100%);
  max-width: none;
  height: 100dvh;
  max-height: none;
  margin: 0;
  padding: 0;
  overflow: visible;
  border: 0;
  color: var(--ink);
  background: transparent;
}

.settings-drawer::backdrop {
  background: color-mix(in srgb, var(--backdrop) 88%, transparent);
  backdrop-filter: blur(4px);
}

.settings-drawer-shell {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  height: 100%;
  overflow: hidden;
  border-inline-start: 1px solid var(--line);
  color: var(--ink);
  background: var(--surface);
  box-shadow: -18px 0 48px color-mix(in srgb, #09152b 24%, transparent);
}

.settings-drawer-header,
.settings-quick-actions {
  display: flex;
  min-height: 4rem;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.7rem 0.85rem;
  border-bottom: 1px solid var(--line);
  background: var(--surface-glass);
  backdrop-filter: blur(16px) saturate(125%);
}

.settings-drawer-header {
  position: relative;
  z-index: 3;
}

.settings-drawer-body {
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.settings-drawer-content {
  display: grid;
  min-height: 100%;
  align-content: start;
  gap: 0.7rem;
  padding: 0 0.8rem 1rem;
}

.settings-quick-actions {
  position: sticky;
  z-index: 2;
  top: 0;
  margin-inline: -0.8rem;
  border-radius: 0;
}

.settings-quick-actions > div:first-child {
  display: grid;
  gap: 0.08rem;
}

.settings-quick-actions small {
  color: var(--muted);
  font-size: 0.66rem;
}

.settings-quick-buttons {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.settings-quick-buttons .icon-button {
  position: relative;
  width: 2.55rem;
  min-height: 2.55rem;
  padding: 0;
  color: var(--primary);
  background: var(--primary-soft);
  box-shadow: none;
}

.context-sync-wrap {
  position: relative;
  display: inline-flex;
}

.context-sync-wrap[hidden],
.context-sync-hint[hidden] {
  display: none;
}

.context-sync-hint {
  position: absolute;
  z-index: 4;
  inset-block-end: calc(100% + 0.5rem);
  inset-inline-end: 0;
  width: max-content;
  max-width: min(20rem, calc(100vw - 2rem));
  padding: 0.45rem 0.6rem;
  border: 1px solid color-mix(in srgb, var(--primary) 24%, transparent);
  border-radius: 0.65rem;
  color: var(--ink);
  background: color-mix(in srgb, var(--surface) 82%, transparent);
  box-shadow: var(--shadow-soft);
  backdrop-filter: blur(12px);
  font-size: 0.68rem;
  pointer-events: none;
}

.context-sync-button::before {
  position: absolute;
  inset: -0.2rem;
  border: 2px solid transparent;
  border-radius: 50%;
  content: "";
  pointer-events: none;
}

.context-sync-button[data-sync-state="running"]::before {
  border-color: color-mix(in srgb, var(--primary) 18%, transparent);
  border-top-color: var(--primary);
  animation: context-sync-spin 720ms linear infinite;
}

.context-sync-button[data-sync-state="success"] {
  color: var(--success);
  background: var(--mint);
}

.context-sync-button[data-sync-state="success"]::before {
  border-color: var(--success);
}

.context-sync-button[data-sync-state="error"] {
  color: var(--danger);
  background: var(--coral);
}

.context-sync-button[data-sync-state="error"]::before {
  border-color: var(--danger);
}

.floating-sync {
  position: fixed;
  z-index: 58;
  inset-inline-end: max(1rem, env(safe-area-inset-right));
  bottom:
    calc(var(--app-bar-height) + 1rem + env(safe-area-inset-bottom));
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.35rem;
  border: 1px solid color-mix(in srgb, var(--primary) 28%, var(--line));
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface) 90%, transparent);
  box-shadow: 0 14px 36px color-mix(in srgb, var(--ink) 18%, transparent);
  backdrop-filter: blur(16px) saturate(130%);
}

.floating-sync[hidden] {
  display: none;
}

.floating-sync-main {
  position: relative;
  display: inline-flex;
  min-height: 2.8rem;
  align-items: center;
  gap: 0.45rem;
  padding: 0.55rem 0.85rem;
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(135deg, var(--primary), var(--neon-violet));
  box-shadow: none;
  font-size: 0.72rem;
  font-weight: 900;
}

.floating-sync-main[data-sync-state="success"] {
  color: #fff;
  background: var(--success);
}

.floating-sync-main[data-sync-state="error"] {
  color: #fff;
  background: var(--danger);
}

.floating-sync-close {
  width: 2.25rem;
  min-height: 2.25rem;
  padding: 0;
  color: var(--muted);
  background: transparent;
  box-shadow: none;
}

.floating-sync-hint {
  inset-block-end: calc(100% + 0.55rem);
  inset-inline-end: 0;
}

.quick-task-dialog {
  width: min(36rem, calc(100% - 2rem));
  max-width: none;
  max-height: min(88dvh, 48rem);
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 1rem;
  color: var(--ink);
  background: var(--surface);
  box-shadow: 0 24px 70px color-mix(in srgb, var(--ink) 28%, transparent);
}

.quick-task-dialog::backdrop {
  background: color-mix(in srgb, var(--backdrop) 88%, transparent);
  backdrop-filter: blur(4px);
}

.quick-task-shell {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  max-height: min(88dvh, 48rem);
}

.quick-task-header {
  display: flex;
  min-height: 4rem;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.7rem 0.85rem;
  border-bottom: 1px solid var(--line);
  background: var(--surface-glass);
}

.quick-task-header > div {
  display: grid;
  gap: 0.08rem;
}

.quick-task-header small {
  color: var(--muted);
  font-size: 0.66rem;
}

.quick-task-body {
  min-height: 12rem;
  overflow: auto;
  padding: 0.8rem;
  overscroll-behavior: contain;
}

.quick-task-body > .panel {
  margin: 0;
  border: 0;
  box-shadow: none;
}

.quick-task-status {
  margin-bottom: 0.6rem;
}

.quick-task-toast {
  position: fixed;
  z-index: 82;
  inset-inline-start: 50%;
  bottom:
    calc(var(--app-bar-height) + 1rem + env(safe-area-inset-bottom));
  width: min(32rem, calc(100% - 2rem));
  padding: 0.75rem 0.9rem;
  border: 1px solid color-mix(in srgb, var(--success) 35%, var(--line));
  border-radius: 0.85rem;
  color: var(--ink);
  background: color-mix(in srgb, var(--surface) 92%, transparent);
  box-shadow: 0 18px 48px color-mix(in srgb, var(--ink) 22%, transparent);
  transform: translateX(-50%);
  backdrop-filter: blur(16px);
  text-align: center;
}

.quick-task-toast[hidden] {
  display: none;
}

.quick-task-toast a {
  color: var(--primary);
  font-weight: 900;
}

.card-mirza-action {
  display: inline-flex;
  min-height: 2rem;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
  margin-block-start: 0.55rem;
  margin-inline-start: auto;
  padding: 0.32rem 0.55rem;
  border: 1px solid color-mix(in srgb, var(--primary) 24%, var(--line));
  border-radius: 999px;
  color: var(--primary);
  background: color-mix(in srgb, var(--primary-soft) 72%, var(--surface));
  box-shadow: none;
  font-size: 0.62rem;
  font-weight: 850;
}

.card-mirza-action:hover,
.card-mirza-action:focus-visible {
  border-color: var(--primary);
  color: var(--primary-strong);
  background: var(--primary-soft);
}

@keyframes context-sync-spin {
  to { transform: rotate(360deg); }
}

.settings-drawer-loading {
  display: grid;
  min-height: 10rem;
  place-items: center;
  margin: 0;
  color: var(--muted);
}

.settings-form,
.settings-section-list {
  display: grid;
  gap: 0.7rem;
}

.settings-section {
  margin: 0;
  padding: 0.85rem;
  border-color: color-mix(in srgb, var(--neon-blue) 14%, var(--line));
  box-shadow: var(--shadow-soft);
}

.settings-section-frame {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 0.65rem;
}

.settings-disclosure {
  min-width: 0;
}

.settings-section-summary {
  position: relative;
  align-items: center;
  margin: 0;
  padding-inline-end: 2rem;
  cursor: pointer;
  list-style: none;
}

.settings-section-summary::-webkit-details-marker {
  display: none;
}

.settings-section-summary::after {
  position: absolute;
  inset-inline-end: 0.35rem;
  color: var(--muted);
  content: "⌄";
  font-size: 1.15rem;
  line-height: 1;
  transform: rotate(0deg);
  transition: transform 160ms ease;
}

details[open] > .settings-section-summary::after {
  transform: rotate(180deg);
}

.settings-section-summary:focus-visible {
  border-radius: 0.55rem;
  outline: 3px solid color-mix(in srgb, var(--primary) 55%, transparent);
  outline-offset: 0.2rem;
}

.settings-section-body {
  display: grid;
  gap: 0.75rem;
  padding-top: 0.75rem;
}

.settings-sync-panel {
  margin: 0 0 0.7rem;
  padding: 0.85rem;
  border-color: color-mix(in srgb, var(--primary) 22%, var(--line));
  box-shadow: var(--shadow-soft);
}

.settings-sync-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
}

.settings-sync-actions .sync-command-form,
.settings-sync-actions button {
  width: 100%;
}

.settings-section.is-dragging,
.sortable-row.is-dragging {
  opacity: 0.55;
  border-color: var(--neon-cyan);
  box-shadow: 0 0 24px color-mix(in srgb, var(--neon-cyan) 25%, transparent);
}

.settings-section-header {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  margin-bottom: 0.65rem;
}

.settings-section-header h2,
.settings-section-header p {
  margin: 0;
}

.settings-section-header h2 {
  font-size: 1rem;
}

.settings-section-header p {
  margin-top: 0.12rem;
  color: var(--muted);
  font-size: 0.72rem;
}

.settings-section-header.settings-section-summary {
  align-items: center;
  margin-bottom: 0;
}

.settings-summary-copy {
  display: grid;
  min-width: 0;
  gap: 0.12rem;
}

.settings-summary-copy strong {
  font-size: 1rem;
}

.settings-summary-copy > span {
  color: var(--muted);
  font-size: 0.72rem;
}

.drag-handle {
  display: inline-grid;
  width: 1.8rem;
  min-width: 1.8rem;
  height: 1.8rem;
  place-items: center;
  border-radius: 0.6rem;
  color: var(--neon-violet);
  background: color-mix(in srgb, var(--neon-violet) 11%, var(--surface));
  cursor: grab;
  user-select: none;
}

.account-summary {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(8rem, 1fr);
  gap: 0.5rem;
  margin: 0 0 0.7rem;
}

.account-summary > div {
  min-width: 0;
  padding: 0.55rem 0.65rem;
  border-radius: 0.75rem;
  background: var(--surface-soft);
}

.account-summary dt {
  color: var(--muted);
  font-size: 0.65rem;
}

.account-summary dd {
  overflow-wrap: anywhere;
  margin: 0.18rem 0 0;
  font-size: 0.78rem;
  font-weight: 800;
}

.danger-action {
  color: var(--danger);
  border-color: color-mix(in srgb, var(--danger) 35%, var(--line));
}

.theme-orbit {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.45rem;
  padding: 0.32rem;
  border: 1px solid color-mix(in srgb, var(--neon-violet) 18%, var(--line));
  border-radius: 1rem;
  background: var(--surface-soft);
}

.theme-orbit button {
  display: flex;
  min-height: 2.8rem;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  border: 1px solid transparent;
  color: var(--muted);
  background: transparent;
  box-shadow: none;
}

.theme-orbit button[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--neon-cyan) 62%, white);
  color: #fff;
  background: linear-gradient(135deg, var(--neon-blue), var(--neon-violet));
  box-shadow: 0 8px 22px color-mix(in srgb, var(--neon-blue) 28%, transparent);
}

.sortable-list {
  display: grid;
  gap: 0.4rem;
  margin-bottom: 0.65rem;
}

.sortable-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 0.55rem;
  padding: 0.46rem 0.55rem;
  border: 1px solid var(--line);
  border-radius: 0.78rem;
  background: var(--surface);
}

.module-enabled-toggles {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.3rem;
}

.module-enabled-toggle {
  display: inline-flex;
  min-height: 2rem;
  align-items: center;
  gap: 0.3rem;
  padding: 0.28rem 0.45rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  background: var(--surface-soft);
  font-size: 0.62rem;
  font-weight: 800;
}

.module-destination-link {
  color: inherit;
  font-weight: 700;
  text-decoration: none;
}

.module-destination-link:hover,
.module-destination-link:focus-visible {
  color: var(--primary);
  text-decoration: underline;
  text-underline-offset: 0.18rem;
}

.module-enable-control {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  cursor: pointer;
}

.account-summary > div > strong,
.account-summary > div > span {
  display: block;
}

.account-summary > div > strong {
  color: var(--muted);
  font-size: 0.65rem;
}

.account-summary > div > span {
  margin-top: 0.35rem;
  font-size: 0.78rem;
  font-weight: 800;
}

.username-editor {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 0.5rem;
}

.username-editor label {
  margin: 0;
}

.username-editor-status {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 0.68rem;
}

.username-editor-status[data-state="success"] {
  color: var(--success);
}

.username-editor-status[data-state="error"] {
  color: var(--danger);
}

.module-enabled-toggle:has(input:checked) {
  border-color: color-mix(in srgb, var(--success) 38%, var(--line));
  color: var(--success);
  background: var(--mint);
}

.module-enabled-toggle input {
  width: 0.9rem;
  min-height: 0.9rem;
  margin: 0;
}

.sort-buttons {
  display: flex;
  gap: 0.25rem;
}

.sort-buttons .icon-button {
  width: 2rem;
  min-height: 2rem;
  padding: 0;
  color: var(--primary);
  background: var(--primary-soft);
  box-shadow: none;
}

.settings-destinations {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
  gap: 0.5rem;
}

.settings-pdf-template {
  display: grid;
  gap: 0.7rem;
  margin-top: 0.65rem;
  padding: 0.75rem;
  border: 1px solid color-mix(in srgb, var(--primary) 20%, var(--line));
  border-radius: 0.85rem;
  background: color-mix(in srgb, var(--surface-soft) 86%, transparent);
}

.settings-pdf-template-copy {
  display: grid;
  gap: 0.2rem;
}

.settings-pdf-template-copy strong {
  font-size: 0.82rem;
}

.settings-pdf-template-copy > span,
.settings-pdf-template .help {
  margin: 0;
  color: var(--muted);
  font-size: 0.68rem;
  line-height: 1.8;
}

.settings-pdf-template-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.45rem;
}

.settings-pdf-template-actions .button,
.settings-pdf-template-actions button {
  width: 100%;
  min-height: 2.55rem;
  justify-content: center;
  padding: 0.48rem 0.62rem;
  font-size: 0.68rem;
  text-align: center;
}

.settings-template-file {
  position: relative;
  cursor: pointer;
}

.settings-template-file input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

.settings-template-file:has(input:focus-visible) {
  outline: 3px solid color-mix(in srgb, var(--primary) 55%, transparent);
  outline-offset: 0.15rem;
}

[data-price-pdf-template-status] {
  min-height: 1.2rem;
  color: var(--muted);
  font-size: 0.66rem;
  font-weight: 750;
}

[data-price-pdf-template-status][data-state="ready"] {
  color: var(--primary);
}

[data-price-pdf-template-status][data-state="running"] {
  color: var(--warning);
}

[data-price-pdf-template-status][data-state="success"] {
  color: var(--success);
}

[data-price-pdf-template-status][data-state="error"] {
  color: var(--danger);
}

.settings-pdf-template[data-template-mode="custom"] {
  border-color: color-mix(in srgb, var(--success) 38%, var(--line));
}

.settings-pdf-template[data-template-busy="true"] {
  cursor: progress;
}

.settings-pdf-template[data-template-busy="true"]
  .settings-pdf-template-actions {
  opacity: 0.68;
  pointer-events: none;
}

.settings-destination-card {
  display: grid;
  gap: 0.2rem;
  min-height: 3.8rem;
  align-content: center;
  padding: 0.65rem 0.75rem;
  border: 1px solid color-mix(in srgb, var(--neon-blue) 18%, var(--line));
  border-radius: 0.8rem;
  color: var(--ink);
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--surface) 94%, var(--neon-blue) 6%),
      color-mix(in srgb, var(--surface) 95%, var(--neon-pink) 5%)
    );
  text-decoration: none;
}

.settings-destination-card:hover {
  border-color: var(--neon-cyan);
  box-shadow: 0 0 22px color-mix(in srgb, var(--neon-blue) 14%, transparent);
}

.settings-destination-card span,
.settings-destination-card p,
.settings-destination-card small {
  margin: 0;
  color: var(--muted);
  font-size: 0.7rem;
}

.inventory-save-dock {
  position: sticky;
  z-index: 16;
  bottom:
    calc(var(--app-bar-height) + 0.85rem + env(safe-area-inset-bottom));
  display: grid;
  margin-top: 0.85rem;
  padding: 0.48rem;
  border: 1px solid color-mix(in srgb, var(--neon-cyan) 34%, var(--line));
  border-radius: 1rem;
  background: color-mix(in srgb, var(--surface) 90%, transparent);
  box-shadow:
    0 14px 34px color-mix(in srgb, var(--neon-blue) 22%, transparent);
  backdrop-filter: blur(18px) saturate(135%);
}

.inventory-save-dock[hidden] {
  display: none;
}

.inventory-detail-sheet .inventory-save-dock {
  bottom: 0.7rem;
}

.inventory-save-cta {
  width: 100%;
  min-height: 3.35rem;
  border-color: transparent;
  color: #fff;
  background:
    linear-gradient(135deg, var(--app-bar-accent), var(--app-bar-accent-end));
  box-shadow:
    0 10px 24px color-mix(in srgb, var(--app-bar-accent) 32%, transparent);
  font-weight: 900;
}

.settings-save {
  position: static;
  min-height: 3.3rem;
  margin-top: 0.25rem;
  color: #fff;
  background: linear-gradient(135deg, var(--neon-blue), var(--neon-violet) 55%, var(--neon-pink));
  box-shadow: 0 12px 32px color-mix(in srgb, var(--neon-blue) 34%, transparent);
}

.navigation-map-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0.8rem;
}

.navigation-map-heading h2,
.navigation-map-heading p {
  margin: 0;
}

.navigation-map-heading p {
  margin-top: 0.2rem;
  color: var(--muted);
  font-size: 0.72rem;
}

.navigation-tree,
.navigation-children {
  display: grid;
  gap: 0.45rem;
}

.navigation-children {
  margin: 0.45rem 1.2rem 0 0;
  padding-right: 0.7rem;
  border-right: 2px solid color-mix(in srgb, var(--neon-violet) 24%, var(--line));
}

.navigation-node {
  padding: 0.55rem;
  border: 1px solid var(--line);
  border-radius: 0.85rem;
  background: var(--surface);
}

.navigation-node-main {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.55rem;
}

.navigation-branch {
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 50%;
  background: var(--neon-cyan);
  box-shadow: 0 0 12px color-mix(in srgb, var(--neon-cyan) 55%, transparent);
}

.navigation-node h3,
.navigation-node p {
  margin: 0;
}

.navigation-node h3 {
  font-size: 0.82rem;
}

.navigation-node p,
.navigation-node code {
  color: var(--muted);
  font-size: 0.66rem;
}

.navigation-state {
  padding: 0.3rem 0.48rem;
  border-radius: 999px;
  font-size: 0.62rem;
  font-weight: 850;
}

.navigation-node-actions {
  display: grid;
  justify-items: end;
  gap: 0.4rem;
}

.navigation-module-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  color: var(--muted);
  font-size: 0.64rem;
  font-weight: 800;
  white-space: nowrap;
}

.navigation-module-toggle input {
  width: 1rem;
  min-height: 1rem;
  margin: 0;
}

.navigation-preferences-actions {
  display: flex;
  align-items: end;
  justify-content: flex-end;
  gap: 0.65rem;
  margin-top: 0.8rem;
  padding-top: 0.8rem;
  border-top: 1px solid var(--line);
}

.navigation-preferences-actions label {
  display: grid;
  min-width: min(15rem, 100%);
  gap: 0.25rem;
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 800;
}

.navigation-save-notice {
  margin-bottom: 0.75rem;
}

.navigation-node.is-allowed > .navigation-node-main .navigation-state {
  color: var(--success);
  background: var(--mint);
}

.navigation-node.is-blocked > .navigation-node-main .navigation-state {
  color: var(--danger);
  background: var(--coral);
}

.navigation-node.is-disabled > .navigation-node-main .navigation-state {
  color: var(--warning);
  background: var(--amber);
}

.navigation-node h3 a,
.navigation-route {
  color: inherit;
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.2em;
}

.navigation-route {
  display: inline-block;
  max-width: 100%;
  overflow-wrap: anywhere;
  color: var(--primary);
  font-size: 0.66rem;
}

.project-collaboration {
  position: relative;
  margin-block: 0.8rem 1rem;
  padding: 0.75rem 0.85rem;
  border: 1px solid var(--line);
  border-radius: 0.95rem;
  background: color-mix(in srgb, var(--surface) 94%, var(--primary-soft));
}

.project-collaboration-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.project-collaboration h2 {
  margin: 0 0 0.35rem;
  font-size: 0.8rem;
}

.project-member-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
}

.project-member-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  min-height: 2rem;
  padding: 0.25rem 0.55rem;
  border: 1px solid color-mix(in srgb, var(--primary) 20%, var(--line));
  border-radius: 999px;
  background: var(--surface);
  font-size: 0.7rem;
  font-weight: 750;
}

.project-member-chip > [aria-hidden="true"] {
  display: grid;
  width: 1.35rem;
  height: 1.35rem;
  place-items: center;
  border-radius: 50%;
  color: var(--primary);
  background: var(--primary-soft);
  font-size: 0.62rem;
}

.project-member-chip.is-inactive {
  color: var(--muted);
  border-style: dashed;
}

.project-share-menu {
  position: relative;
  flex: 0 0 auto;
}

.project-share-menu > summary {
  display: grid;
  width: 2.5rem;
  height: 2.5rem;
  place-items: center;
  list-style: none;
  cursor: pointer;
}

.project-share-menu > summary::-webkit-details-marker {
  display: none;
}

.project-share-popover {
  position: absolute;
  z-index: 20;
  inset-block-start: calc(100% + 0.45rem);
  inset-inline-end: 0;
  width: min(22rem, calc(100vw - 2rem));
  padding: 0.8rem;
  border: 1px solid var(--line);
  border-radius: 0.9rem;
  background: var(--surface);
  box-shadow: var(--shadow);
}

.project-share-popover form,
.project-member-options {
  display: grid;
  gap: 0.5rem;
}

.project-member-options {
  max-height: min(18rem, 45vh);
  overflow: auto;
}

.project-member-option {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  min-height: 2.65rem;
  margin: 0;
  padding: 0.45rem 0.55rem;
  border: 1px solid var(--line);
  border-radius: 0.7rem;
  background: var(--field);
}

.project-member-option input {
  flex: 0 0 auto;
}

.compact-status {
  margin: 0.55rem 0 0;
}

a.exchange-rate-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  text-decoration: none;
  box-shadow: 0 0 18px color-mix(in srgb, var(--neon-lime) 16%, transparent);
}

a.exchange-rate-chip::after {
  content: "‹";
  font-size: 1rem;
  line-height: 1;
}

.formula-settings {
  margin-top: 0.75rem;
  padding: 0.7rem;
  border: 1px solid color-mix(in srgb, var(--warning) 28%, var(--line));
  border-radius: 0.9rem;
  background: color-mix(in srgb, var(--amber) 35%, var(--surface));
}

.formula-settings > summary {
  color: var(--warning-ink);
  font-weight: 850;
}

.formula-settings[open] > summary {
  margin-bottom: 0.65rem;
}

.formula-review {
  margin-top: 0.65rem;
}

.formula-confirm-form {
  margin-top: 0.55rem;
}

.danger-confirm {
  min-height: 3.1rem;
  color: #fff;
  background: linear-gradient(135deg, var(--warning), var(--danger));
  box-shadow: 0 10px 26px color-mix(in srgb, var(--danger) 28%, transparent);
}

[data-sortable-item] {
  transition: transform 140ms ease, opacity 140ms ease, box-shadow 140ms ease;
}

[data-sortable-item].is-sorting {
  z-index: 3;
  opacity: 0.72;
  transform: scale(0.985);
  box-shadow: 0 12px 30px color-mix(in srgb, var(--neon-violet) 22%, transparent);
}

.drag-handle {
  touch-action: none;
  cursor: grab;
  user-select: none;
}

.drag-handle:active {
  cursor: grabbing;
}

[data-lazy-reveal] {
  opacity: 0.82;
  transform: translateY(0.3rem);
  transition:
    opacity 220ms ease calc(var(--lazy-index, 0) * 18ms),
    transform 250ms cubic-bezier(.2, .75, .2, 1)
      calc(var(--lazy-index, 0) * 18ms);
}

[data-lazy-reveal].lazy-visible {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  [data-lazy-reveal],
  [data-sortable-item] {
    transition: none;
  }

  .settings-section-summary::after {
    transition: none;
  }

  .context-sync-button[data-sync-state="running"]::before {
    animation: none;
  }
}

@media (max-width: 720px) {
  .settings-drawer {
    inset: auto 0 0;
    width: 100%;
    height: min(82dvh, 44rem);
  }

  .settings-drawer-shell {
    border: 1px solid var(--line);
    border-bottom: 0;
    border-radius: 1.2rem 1.2rem 0 0;
  }

  .settings-drawer-content {
    padding-inline: 0.55rem;
    padding-bottom: calc(0.65rem + env(safe-area-inset-bottom));
  }

  .settings-quick-actions {
    margin-inline: -0.55rem;
  }

  .account-summary {
    grid-template-columns: 1fr;
  }

  .username-editor {
    grid-template-columns: 1fr;
  }

  .username-editor-status {
    grid-column: 1;
  }

  .settings-section {
    padding: 0.72rem;
  }

  .settings-section-frame {
    gap: 0.5rem;
  }

  .sortable-row {
    grid-template-columns: auto minmax(0, 1fr) auto;
  }

  .module-enabled-toggles {
    grid-column: 2 / -1;
    justify-content: flex-start;
  }

  .settings-sync-actions {
    grid-template-columns: 1fr;
  }

  .settings-destinations {
    grid-template-columns: 1fr;
  }

  .settings-pdf-template-actions {
    grid-template-columns: 1fr;
  }

  .navigation-map-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .navigation-children {
    margin-right: 0.55rem;
  }

  .navigation-node-main {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .navigation-state {
    grid-column: 2;
    justify-self: start;
  }

  .navigation-node-actions {
    grid-column: 2;
    justify-items: start;
  }

  .navigation-preferences-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .navigation-preferences-actions button,
  .navigation-preferences-actions label {
    width: 100%;
  }

  .project-share-popover {
    position: fixed;
    inset: auto 0 0;
    width: 100%;
    max-height: 78dvh;
    overflow: auto;
    border-radius: 1.1rem 1.1rem 0 0;
  }

  .quick-task-dialog {
    inset: auto 0 0;
    width: 100%;
    max-height: 88dvh;
    margin: 0;
    border-radius: 1.2rem 1.2rem 0 0;
  }

  .quick-task-shell {
    max-height: 88dvh;
  }

  .floating-sync {
    inset-inline-end: max(0.65rem, env(safe-area-inset-right));
    bottom:
      calc(var(--app-bar-height) + 0.65rem + env(safe-area-inset-bottom));
  }

  .floating-sync-main {
    min-height: 2.65rem;
    padding-inline: 0.7rem;
  }
}

/* Product-first inventory and the price list itself are dense working surfaces. */
.price-list-heading,
.product-page-hero {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.price-list-heading {
  margin-bottom: 0.8rem;
  padding: 0.75rem 0.85rem;
  border: 1px solid color-mix(in srgb, var(--neon-blue) 20%, var(--line));
  border-radius: 0.9rem;
  background:
    linear-gradient(
      125deg,
      color-mix(in srgb, var(--primary-soft) 74%, transparent),
      color-mix(in srgb, var(--neon-cyan) 8%, var(--surface))
    );
}

.price-list-heading h2,
.product-page-hero h2 {
  margin: 0;
  font-size: clamp(1rem, 2vw, 1.3rem);
  line-height: 1.65;
}

.price-list-heading p,
.product-page-hero p {
  margin: 0.18rem 0 0;
  color: var(--muted);
  font-size: 0.72rem;
}

.price-export-actions {
  display: flex;
  flex: 0 0 auto;
  gap: 0.4rem;
}

.price-export-actions .button {
  min-height: 2.35rem;
  padding: 0.42rem 0.72rem;
}

.pricing-table-wrap {
  border: 1px solid var(--line);
  border-radius: 0.9rem;
  background: var(--surface);
}

.pricing-table {
  min-width: max-content;
  table-layout: auto;
}

.pricing-table th {
  position: sticky;
  z-index: 2;
  top: var(--sticky-header-offset, 3.7rem);
  min-width: 7rem;
  cursor: grab;
  user-select: none;
  white-space: nowrap;
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--primary-soft) 82%, var(--surface)),
      color-mix(in srgb, var(--neon-violet) 8%, var(--surface))
    );
}

.pricing-table th:active {
  cursor: grabbing;
}

.pricing-table th.is-dragging {
  opacity: 0.5;
  box-shadow: inset 0 -3px 0 var(--neon-cyan);
}

.column-drag-handle {
  display: inline-block;
  margin-left: 0.28rem;
  color: var(--neon-violet);
  font-size: 0.72rem;
  letter-spacing: -0.15em;
}

.price-product-cell {
  display: grid;
  grid-template-columns: minmax(4.25rem, 1fr) auto auto;
  align-items: center;
  gap: 0.4rem;
  min-width: 0;
}

.price-product-cell > .price-inline-form {
  position: absolute;
  inline-size: 0;
  block-size: 0;
  margin: 0;
  overflow: hidden;
}

.price-product-cell > div {
  display: grid;
  gap: 0.18rem;
  min-width: 0;
}

.price-product-cell strong {
  font-size: 0.78rem;
  line-height: 1.55;
}

.price-product-cell strong a,
.price-mobile-card h3 a {
  overflow-wrap: anywhere;
  color: inherit;
  text-decoration: none;
}

.pricing-badge.admission-status-link {
  text-decoration: none;
}

.pricing-badge.admission-status-link:hover,
.pricing-badge.admission-status-link:focus-visible {
  box-shadow: 0 0 0 3px color-mix(in srgb, currentColor 20%, transparent);
}

.admission-guidance {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-block: 0.75rem;
  padding: 0.7rem 0.8rem;
  border: 1px solid color-mix(in srgb, var(--warning) 30%, var(--line));
  border-radius: 0.75rem;
  background: var(--warning-surface);
}

.admission-guidance p {
  margin: 0;
}

#product-specifications,
#product-serials,
#product-price-editor {
  scroll-margin-top: 6rem;
}

.price-inventory-link {
  display: grid;
  width: 2rem;
  height: 2rem;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--neon-cyan) 32%, var(--line));
  border-radius: 0.65rem;
  color: var(--primary-dark);
  background: color-mix(in srgb, var(--primary-soft) 74%, transparent);
}

.price-inventory-link:hover,
.price-inventory-link:focus-visible {
  color: #fff;
  background: linear-gradient(135deg, var(--neon-blue), var(--neon-violet));
  box-shadow: 0 0 16px color-mix(in srgb, var(--neon-cyan) 28%, transparent);
}

.price-inventory-link svg {
  width: 1.05rem;
  height: 1.05rem;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.price-content-studio-link {
  display: inline-flex;
  min-height: 2rem;
  align-items: center;
  justify-content: center;
  padding: 0.25rem 0.55rem;
  border: 1px solid color-mix(in srgb, var(--neon-violet) 30%, var(--line));
  border-radius: 0.65rem;
  color: var(--primary-dark);
  background: color-mix(in srgb, var(--primary-soft) 68%, transparent);
  font-size: 0.66rem;
  font-weight: 700;
  text-decoration: none;
}

.price-product-cell > .price-content-studio-link {
  grid-column: 1 / -1;
  width: fit-content;
}

.price-content-studio-link:hover,
.price-content-studio-link:focus-visible {
  color: #fff;
  background: linear-gradient(135deg, var(--neon-blue), var(--neon-violet));
}

.price-inventory-unavailable {
  display: inline-grid;
  grid-template-columns: 1.7rem minmax(0, 1fr);
  align-items: center;
  gap: 0.38rem;
  max-width: 12rem;
  color: var(--muted);
}

.price-inventory-unavailable > span {
  display: grid;
  width: 1.7rem;
  height: 1.7rem;
  place-items: center;
  border: 1px dashed var(--line);
  border-radius: 0.55rem;
}

.price-inventory-unavailable small {
  overflow-wrap: anywhere;
  font-size: 0.56rem;
  line-height: 1.45;
}

.pricing-badge {
  width: fit-content;
  padding: 0.08rem 0.4rem;
  border-radius: 999px;
  font-size: 0.58rem;
  font-weight: 900;
}

.pricing-badge.priced {
  color: var(--success);
  background: color-mix(in srgb, var(--mint) 84%, transparent);
}

.pricing-badge.remaining {
  color: var(--warning-ink);
  background: color-mix(in srgb, var(--warning-surface) 86%, transparent);
}

.pricing-badge.blocked {
  color: var(--warning-ink);
  background: color-mix(in srgb, var(--warning) 18%, var(--surface));
}

.pricing-badge.conflict {
  color: var(--danger);
  background: color-mix(in srgb, var(--danger) 12%, var(--surface));
}

.price-edit-cell {
  min-width: 8rem;
}

.price-edit-cell input,
.price-mobile-specs input {
  width: 100%;
  min-width: 6.4rem;
  min-height: 2.25rem;
  padding: 0.34rem 0.48rem;
  border-color: color-mix(in srgb, var(--neon-blue) 20%, var(--line));
  border-radius: 0.65rem;
  direction: ltr;
  text-align: center;
  font-size: 0.72rem;
  font-weight: 800;
}

.price-edit-cell input:focus,
.price-mobile-specs input:focus {
  border-color: var(--neon-cyan);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--neon-cyan) 15%, transparent);
}

.price-row.is-dirty,
.price-mobile-card.is-dirty {
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--neon-pink) 52%, transparent);
}

.price-inline-save {
  min-height: 2.1rem;
  padding: 0.32rem 0.58rem;
  border-radius: 0.65rem;
  font-size: 0.65rem;
  background: linear-gradient(135deg, var(--neon-blue), var(--neon-violet));
}

.price-inline-save:disabled {
  opacity: 0.38;
  filter: grayscale(0.45);
  box-shadow: none;
}

.price-inline-save.is-saving {
  color: transparent;
  background-image:
    radial-gradient(circle, #fff 2px, transparent 3px),
    linear-gradient(135deg, var(--neon-blue), var(--neon-violet));
  background-size: 11px 11px, auto;
  animation: loading-shimmer 0.8s linear infinite;
}

.price-mobile-list {
  display: none;
}

.product-page-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-width: 0;
  max-width: 100%;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
  padding: 0.85rem 1rem;
  border: 1px solid color-mix(in srgb, var(--neon-cyan) 25%, var(--line));
  border-radius: 1rem;
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--neon-blue) 10%, var(--surface)),
      color-mix(in srgb, var(--neon-pink) 7%, var(--surface))
    );
  box-shadow: var(--shadow-soft);
}

.product-page-hero > div,
.product-page-hero h2,
.product-page-hero p {
  min-width: 0;
  overflow-wrap: anywhere;
}

.product-page-hero h2,
.product-page-hero p {
  margin-block: 0.12rem;
}

.product-back-action {
  flex: 0 0 auto;
}

.product-page-hero .eyebrow {
  color: var(--neon-violet);
  font-weight: 900;
}

.product-section {
  min-width: 0;
  max-width: 100%;
  padding: 0;
  overflow: clip;
}

.product-section > summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  min-height: 3.15rem;
  gap: 0.65rem;
  padding: 0.62rem 0.8rem;
  cursor: pointer;
  list-style: none;
  font-weight: 900;
}

.product-section > summary::-webkit-details-marker {
  display: none;
}

.product-section > summary::before {
  content: "‹";
  grid-column: 2;
  grid-row: 1;
  color: var(--primary);
  font-size: 1.1rem;
  line-height: 1;
  transition: transform 160ms ease;
}

.product-section[open] > summary::before {
  transform: rotate(-90deg);
}

.product-section > summary > span {
  grid-column: 1;
  grid-row: 1;
  min-width: 0;
  overflow-wrap: anywhere;
}

.product-section > summary > small {
  grid-column: 1 / -1;
  grid-row: 2;
  color: var(--muted);
  font-size: 0.62rem;
  font-weight: 700;
}

.product-section-body {
  min-width: 0;
  padding: 0 0.75rem 0.75rem;
}

.product-summary-section {
  margin-bottom: 0.75rem;
}

.product-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.55rem;
  min-width: 0;
}

.product-kpi {
  display: grid;
  gap: 0.1rem;
  min-width: 0;
  min-height: 6.2rem;
  align-content: center;
  padding: 0.65rem 0.75rem;
  border: 1px solid var(--line);
  border-radius: 0.9rem;
  background: var(--surface);
  box-shadow: var(--shadow-soft);
  color: inherit;
  text-decoration: none;
  transition:
    border-color 160ms ease,
    box-shadow 160ms ease,
    transform 160ms ease;
}

.product-kpi:hover,
.product-kpi:focus-visible {
  border-color: color-mix(in srgb, var(--primary) 44%, var(--line));
  box-shadow: var(--shadow);
  transform: translateY(-1px);
}

.product-kpi strong {
  color: var(--primary-dark);
  font-size: 1.35rem;
}

.product-kpi span,
.product-kpi small {
  color: var(--muted);
  overflow-wrap: anywhere;
  font-size: 0.65rem;
}

.product-kpi.untested {
  border-color: color-mix(in srgb, var(--warning) 28%, var(--line));
}

.product-kpi.ready {
  border-color: color-mix(in srgb, var(--success) 28%, var(--line));
}

.product-page-grid {
  display: grid;
  grid-template-columns: minmax(16rem, 0.72fr) minmax(22rem, 1.28fr);
  gap: 0.75rem;
  min-width: 0;
}

.accounting-product-facts th {
  width: 10rem;
  color: var(--muted);
}

.product-serials {
  grid-column: 1 / -1;
}

.product-facts-table,
.product-facts-table .table-wrap,
.product-serial-table {
  min-width: 0;
  max-width: 100%;
}

.product-facts-table table {
  width: 100%;
  table-layout: fixed;
}

.product-facts-table th {
  width: 38%;
}

.product-facts-table th,
.product-facts-table td {
  overflow-wrap: anywhere;
}

.product-action-guidance {
  display: grid;
  gap: 0.18rem;
  margin-bottom: 0.6rem;
  padding: 0.65rem 0.72rem;
  border: 1px solid var(--line);
  border-radius: 0.75rem;
}

.product-action-guidance.warning {
  border-color: color-mix(in srgb, var(--warning) 34%, var(--line));
  background: color-mix(in srgb, var(--warning-surface) 76%, var(--surface));
}

.product-action-guidance.success {
  border-color: color-mix(in srgb, var(--success) 30%, var(--line));
  background: color-mix(in srgb, var(--mint) 62%, var(--surface));
}

.product-action-guidance span {
  color: var(--muted);
  font-size: 0.68rem;
}

.product-serial-filter {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  margin-bottom: 0.55rem;
  padding: 0.5rem 0.62rem;
  border: 1px solid color-mix(in srgb, var(--primary) 24%, var(--line));
  border-radius: 0.72rem;
  background: color-mix(in srgb, var(--primary-soft) 42%, var(--surface));
  font-size: 0.68rem;
}

.product-serial-filter a {
  flex: 0 0 auto;
  font-weight: 850;
}

.product-section:target {
  border-color: color-mix(in srgb, var(--warning) 74%, var(--line));
  box-shadow:
    0 0 0 3px color-mix(in srgb, var(--warning) 18%, transparent),
    var(--shadow-soft);
}

.product-section:target > summary {
  color: var(--warning-ink);
  background: color-mix(in srgb, var(--warning-surface) 78%, transparent);
}

.product-serial-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.35rem;
  padding: 0.38rem 0.68rem;
  border: 1px solid color-mix(in srgb, var(--primary) 35%, var(--line));
  border-radius: 0.65rem;
  color: var(--primary-dark);
  text-align: center;
  text-decoration: none;
  font-size: 0.68rem;
  font-weight: 900;
  background: color-mix(in srgb, var(--primary-soft) 72%, var(--surface));
}

.product-serial-action:hover,
.product-serial-action:focus-visible {
  color: #fff;
  background: var(--primary);
}

.product-action-unavailable {
  display: grid;
  gap: 0.12rem;
  max-width: 14rem;
  color: var(--muted);
}

.product-action-unavailable strong {
  color: inherit;
  font-size: 0.68rem;
}

.product-action-unavailable small {
  overflow-wrap: anywhere;
  font-size: 0.58rem;
  line-height: 1.45;
}

.product-serial-mobile-list {
  display: none;
}

.inventory-product-table .product-count,
.inventory-product-cards .product-count {
  font-variant-numeric: tabular-nums;
  font-weight: 900;
}

.inventory-product-cards {
  display: none;
  width: 100%;
  min-width: 0;
}

@keyframes loading-shimmer {
  to {
    background-position: 22px 0, 0 0;
  }
}

@media (max-width: 760px) {
  .price-list-heading,
  .product-page-hero {
    align-items: stretch;
    flex-direction: column;
  }

  .price-export-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .pricing-table-wrap,
  .inventory-product-table {
    display: none;
  }

  .price-mobile-list,
  .inventory-product-cards {
    display: grid;
    width: 100%;
    min-width: 0;
    gap: 0.55rem;
  }

  .inventory-products-panel {
    min-width: 0;
    overflow: hidden;
  }

  .inventory-product-card {
    display: grid;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    gap: 0.5rem;
    overflow: hidden;
    padding: 0.68rem;
    border: 1px solid color-mix(in srgb, var(--neon-blue) 18%, var(--line));
    border-radius: 0.9rem;
    color: inherit;
    text-decoration: none;
    background:
      linear-gradient(
        135deg,
        color-mix(in srgb, var(--primary-soft) 34%, var(--surface)),
        var(--surface)
      );
    box-shadow: var(--shadow-soft);
  }

  .inventory-product-card > header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 0.5rem;
    min-width: 0;
  }

  .inventory-product-card > header > div,
  .inventory-product-card h3,
  .inventory-product-card p {
    min-width: 0;
  }

  .inventory-product-card h3 {
    margin: 0;
    overflow-wrap: anywhere;
    font-size: 0.8rem;
    line-height: 1.55;
  }

  .inventory-product-card p {
    margin: 0.12rem 0 0;
    overflow: hidden;
    color: var(--muted);
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.62rem;
  }

  .inventory-product-card > header > span {
    color: var(--neon-blue);
    font-size: 1.1rem;
    line-height: 1;
  }

  .inventory-product-card dl {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.32rem;
    min-width: 0;
    margin: 0;
  }

  .inventory-product-card dl > div {
    display: grid;
    min-width: 0;
    place-items: center;
    gap: 0.1rem;
    padding: 0.38rem 0.18rem;
    border: 1px solid color-mix(in srgb, var(--line) 78%, transparent);
    border-radius: 0.62rem;
    background: color-mix(in srgb, var(--primary-soft) 34%, var(--surface));
  }

  .inventory-product-card dt {
    overflow: hidden;
    max-width: 100%;
    color: var(--muted);
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.54rem;
  }

  .inventory-product-card dd {
    margin: 0;
    color: var(--primary-dark);
    font-size: 0.78rem;
    font-weight: 900;
  }

  .price-mobile-card {
    display: grid;
    gap: 0.55rem;
    padding: 0.72rem;
    border: 1px solid var(--line);
    border-radius: 0.95rem;
    background: var(--surface);
    box-shadow: var(--shadow-soft);
  }

  .price-mobile-card header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.65rem;
    flex-wrap: wrap;
  }

  .price-mobile-card .price-content-studio-link {
    width: 100%;
    min-height: 2.75rem;
  }

  .price-mobile-card h3 {
    margin: 0;
    font-size: 0.88rem;
    line-height: 1.6;
  }

  .price-mobile-specs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.35rem;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .price-mobile-specs li {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
    padding: 0.48rem;
    border: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
    border-radius: 0.7rem;
    background: color-mix(in srgb, var(--primary-soft) 36%, var(--surface));
  }

  .price-mobile-specs li > span {
    color: var(--muted);
    font-size: 0.6rem;
    font-weight: 800;
  }

  .price-mobile-specs bdi,
  .price-mobile-specs input {
    overflow: hidden;
    min-width: 0;
    text-overflow: ellipsis;
    font-size: 0.7rem;
    font-weight: 800;
  }

  .product-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .product-page-grid {
    grid-template-columns: 1fr;
  }

  .product-page-hero {
    padding: 0.68rem 0.72rem;
  }

  .product-page-hero h2 {
    font-size: 0.9rem;
    line-height: 1.6;
  }

  .product-back-action {
    width: 100%;
  }

  .product-section > summary {
    min-height: 2.85rem;
    padding: 0.5rem 0.62rem;
  }

  .product-section-body {
    padding: 0 0.55rem 0.55rem;
  }

  .product-facts-table table,
  .product-facts-table tbody {
    display: block;
    width: 100%;
  }

  .product-facts-table tr {
    display: grid;
    grid-template-columns: minmax(5.6rem, 0.38fr) minmax(0, 1fr);
    width: 100%;
  }

  .product-facts-table th,
  .product-facts-table td,
  .accounting-product-facts th {
    display: block;
    width: auto;
    padding: 0.44rem 0.48rem;
    line-height: 1.55;
  }

  .product-kpi {
    min-height: 4.8rem;
    padding: 0.5rem;
  }

  .product-kpi strong {
    font-size: 1.05rem;
  }

  .product-kpi small {
    font-size: 0.57rem;
    line-height: 1.45;
  }

  .product-serial-filter {
    align-items: flex-start;
    font-size: 0.62rem;
  }

  .product-serial-table {
    display: none;
  }

  .product-serial-mobile-list {
    display: grid;
    gap: 0.5rem;
    min-width: 0;
  }

  .product-serial-card {
    display: grid;
    min-width: 0;
    gap: 0.52rem;
    padding: 0.62rem;
    border: 1px solid var(--line);
    border-radius: 0.82rem;
    background: color-mix(in srgb, var(--primary-soft) 24%, var(--surface));
  }

  .product-serial-card.untested {
    border-color: color-mix(in srgb, var(--warning) 38%, var(--line));
  }

  .product-serial-card.review {
    border-color: color-mix(in srgb, var(--danger) 32%, var(--line));
  }

  .product-serial-card.ready {
    border-color: color-mix(in srgb, var(--success) 32%, var(--line));
  }

  .product-serial-card > header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    min-width: 0;
    gap: 0.5rem;
  }

  .product-serial-card > header > div {
    display: grid;
    min-width: 0;
    gap: 0.12rem;
  }

  .product-serial-card > header > div > span,
  .product-serial-card dt {
    color: var(--muted);
    font-size: 0.57rem;
    font-weight: 800;
  }

  .product-serial-card strong,
  .product-serial-card dd {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .product-serial-card dl {
    display: grid;
    gap: 0.35rem;
    margin: 0;
  }

  .product-serial-card dl > div {
    display: grid;
    grid-template-columns: 5.1rem minmax(0, 1fr);
    gap: 0.45rem;
    padding-block: 0.25rem;
    border-bottom: 1px dashed color-mix(in srgb, var(--line) 72%, transparent);
  }

  .product-serial-card dd {
    margin: 0;
    font-size: 0.66rem;
    line-height: 1.55;
  }

  .product-serial-card-action {
    display: grid;
  }

  .product-serial-action {
    width: 100%;
    min-height: 2.75rem;
  }

  .price-inventory-unavailable {
    max-width: 8rem;
  }
}

/* Compact persistent shell: keep navigation visible without sacrificing the work area. */
.app-header {
  grid-template-columns: 1fr;
  grid-template-rows: auto;
  min-height: 3.15rem;
  gap: 0;
  padding: 0.3rem max(0.75rem, calc((100% - 1180px) / 2));
}

.app-header .brand {
  grid-column: 1;
  grid-row: 1;
  justify-self: center;
}

.current-rate-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-block: 0.7rem;
  padding: 0.72rem 0.85rem;
  border: 1px solid color-mix(in srgb, var(--success) 28%, var(--line));
  border-radius: 0.85rem;
  color: var(--success);
  background: color-mix(in srgb, var(--mint) 64%, var(--surface));
}

.current-rate-card span {
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 800;
}

.current-rate-card strong {
  font-size: 1rem;
}

.rate-editor {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 0.55rem;
}

.rate-editor .help {
  grid-column: 1 / -1;
  margin: 0;
}

@media (max-width: 720px) {
  .app-header {
    min-height: calc(3.15rem + env(safe-area-inset-top));
    padding:
      calc(0.28rem + env(safe-area-inset-top))
      max(0.75rem, env(safe-area-inset-right))
      0.28rem
      max(0.75rem, env(safe-area-inset-left));
  }

  .page-pricing main,
  .page-inventory main {
    margin-top: 0.35rem;
  }

  .page-pricing .breadcrumb,
  .page-inventory .breadcrumb {
    min-height: 2.45rem;
    margin-bottom: 0.3rem;
  }

  .page-pricing .breadcrumb-home,
  .page-inventory .breadcrumb-home {
    width: 2rem;
    height: 2rem;
  }

  .page-pricing .price-mobile-controls {
    gap: 0.42rem;
  }

  .page-pricing .pricing-list-panel {
    margin-top: 0.45rem;
  }

  .page-pricing .price-mobile-list {
    gap: 0.42rem;
  }

  .page-pricing .price-mobile-card:not(:has(> .price-mobile-card-link)),
  .page-pricing .price-mobile-card {
    gap: 0.38rem;
    padding: 0.56rem;
    border-radius: 0.78rem;
  }

  .page-pricing .price-mobile-card h3 {
    font-size: 0.8rem;
    line-height: 1.45;
  }

  .page-pricing .price-mobile-specs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.26rem;
  }

  .page-pricing .price-mobile-specs li {
    gap: 0.08rem;
    min-height: 2.7rem;
    padding: 0.28rem 0.22rem;
    border-radius: 0.55rem;
  }

  .page-pricing .price-mobile-specs li > span {
    font-size: 0.52rem;
  }

  .page-pricing .price-mobile-specs bdi,
  .page-pricing .price-mobile-specs input {
    min-width: 0;
    min-height: 1.55rem;
    padding: 0.15rem;
    font-size: 0.62rem;
  }

  .page-pricing .price-inline-save:disabled {
    display: none;
  }

  .rate-editor {
    grid-template-columns: 1fr;
  }

  .rate-editor .help {
    grid-column: 1;
  }
}

.category-template-tabs {
  display: flex;
  gap: 0.4rem;
  margin-block: 0.8rem;
  padding-block-end: 0.25rem;
  overflow-x: auto;
  scrollbar-width: thin;
}

.category-template-tab {
  flex: 0 0 auto;
  padding: 0.48rem 0.72rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  background: var(--surface);
  text-decoration: none;
  font-size: 0.74rem;
  font-weight: 850;
}

.category-template-tab:hover,
.category-template-tab:focus-visible,
.category-template-tab.is-active {
  border-color: color-mix(in srgb, var(--primary) 48%, var(--line));
  color: var(--primary-strong);
  background: linear-gradient(
    135deg,
    color-mix(in srgb, var(--primary-soft) 88%, var(--surface)),
    color-mix(in srgb, var(--neon-cyan) 12%, var(--surface))
  );
  box-shadow: 0 0.45rem 1.1rem color-mix(in srgb, var(--primary) 16%, transparent);
}

/* Final grid authority: later page-specific rules must not fragment table behavior. */
table.console-grid {
  width: max-content;
  min-width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}

table.console-grid th,
table.console-grid td {
  min-width: 16px;
  padding: var(--grid-row-padding) 0.48rem;
  text-align: center;
  vertical-align: middle;
}

table.console-grid.console-grid-wrap th,
table.console-grid.console-grid-wrap td,
table.console-grid.console-grid-wrap th > *,
table.console-grid.console-grid-wrap td > * {
  overflow-wrap: anywhere;
  white-space: normal;
}

table.console-grid tbody tr:nth-child(odd) > td {
  background: color-mix(in srgb, var(--surface) 97%, var(--primary-soft));
}

table.console-grid tbody tr:nth-child(even) > td {
  background: color-mix(in srgb, var(--surface) 96%, var(--mint));
}

table.console-grid tbody tr:hover > td {
  background: var(--row-hover);
}

table.console-grid [data-grid-frozen="true"] {
  position: sticky;
  z-index: 6;
  inset-inline-start: var(--grid-row-selector-width, 0);
  border-inline-end: 1px solid color-mix(in srgb, var(--primary) 20%, var(--line));
  box-shadow: -8px 0 18px color-mix(in srgb, var(--ink) 5%, transparent);
}

table.console-grid thead [data-grid-frozen="true"] {
  z-index: 9;
  background: color-mix(in srgb, var(--surface) 80%, var(--primary-soft));
}

table.console-grid tbody tr:nth-child(odd) > [data-grid-frozen="true"] {
  background: color-mix(in srgb, var(--surface) 97%, var(--primary-soft));
}

table.console-grid tbody tr:nth-child(even) > [data-grid-frozen="true"] {
  background: color-mix(in srgb, var(--surface) 96%, var(--mint));
}

table.console-grid tbody tr:hover > [data-grid-frozen="true"] {
  background: var(--row-hover);
}

table.console-grid .console-grid-group-row > td {
  position: sticky;
  inset-inline-start: 0;
  z-index: 2;
  padding-block: .55rem;
  color: var(--primary);
  background: linear-gradient(90deg, color-mix(in srgb, var(--primary) 16%, var(--surface)), color-mix(in srgb, var(--mint) 18%, var(--surface)));
  border-block: 1px solid color-mix(in srgb, var(--primary) 26%, var(--line));
  text-align: start;
}

.console-grid-group-row td strong {
  margin-inline-end: .65rem;
}

.console-grid-group-row td span {
  color: var(--muted);
  font-size: .78rem;
}

.manual-price-composer {
  position: relative;
}

.manual-price-composer > summary {
  list-style: none;
  cursor: pointer;
}

.manual-price-composer > summary::-webkit-details-marker {
  display: none;
}

.manual-price-form {
  position: absolute;
  inset-inline-end: 0;
  top: calc(100% + .55rem);
  z-index: 24;
  width: min(850px, calc(100vw - 2rem));
  max-height: min(72vh, 720px);
  overflow: auto;
  padding: 1rem;
  border: 1px solid color-mix(in srgb, var(--primary) 32%, var(--line));
  border-radius: 1.15rem;
  background: color-mix(in srgb, var(--surface) 94%, transparent);
  box-shadow: 0 24px 70px color-mix(in srgb, var(--ink) 25%, transparent);
  backdrop-filter: blur(18px);
}

.manual-price-form-intro {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: .75rem;
  margin-bottom: .85rem;
}

.manual-price-form-intro span {
  color: var(--muted);
  font-size: .82rem;
}

.manual-price-fields {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: .65rem;
  margin-bottom: .9rem;
}

.manual-price-fields label,
.manual-price-fields input {
  width: 100%;
  min-width: 0;
}

.pricing-badge.manual {
  color: var(--success);
  background: color-mix(in srgb, var(--success) 12%, var(--surface));
  border-color: color-mix(in srgb, var(--success) 35%, var(--line));
}

@media (max-width: 760px) {
  .manual-price-form {
    position: fixed;
    inset: auto .7rem calc(var(--bottom-safe-space, 96px) + 1rem) .7rem;
    width: auto;
    max-height: 72vh;
  }

  .manual-price-form-intro {
    align-items: flex-start;
    flex-direction: column;
  }

  .manual-price-fields {
    grid-template-columns: 1fr 1fr;
  }
}

/* Desktop data workspace: full-width console shell with one calm command bar. */
:root {
  --workspace-inline-gap: clamp(1.5rem, 3vw, 4rem);
}

.console-grid-command-row {
  display: grid;
  grid-template-columns: minmax(6.5rem, 1fr) auto minmax(10rem, 18rem);
  align-items: center;
  gap: 0.55rem;
  width: 100%;
}

.console-grid-result-count {
  align-self: center;
  min-width: 6.5rem;
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 850;
  text-align: center;
  white-space: nowrap;
}

.console-grid-result-count[data-filtered="true"] {
  color: var(--primary);
}

.console-grid-copy-status {
  align-self: center;
  overflow: hidden;
  min-width: 0;
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.console-grid-copy-status[data-state="success"] {
  color: var(--success);
}

.console-grid-copy-status[data-state="error"] {
  color: var(--danger);
}

.console-grid-copy-status[data-state="pending"] {
  color: var(--primary);
}

.console-grid-output-menu {
  position: relative;
  align-self: center;
}

.console-grid-output-menu > summary {
  display: grid;
  min-height: 2.15rem;
  place-items: center;
  padding: 0.38rem 0.8rem;
  border: 1px solid color-mix(in srgb, var(--primary) 28%, var(--line));
  border-radius: 0.65rem;
  color: var(--primary);
  background: var(--surface);
  font-size: 0.72rem;
  font-weight: 900;
  cursor: pointer;
  list-style: none;
  white-space: nowrap;
}

.console-grid-output-menu > summary::-webkit-details-marker {
  display: none;
}

.console-grid-output-menu[open] > summary {
  border-color: var(--primary);
  background: var(--primary-soft);
}

.console-grid-output-menu:not([open]) > .console-grid-output-panel {
  display: none;
}

.console-grid-output-panel {
  position: absolute;
  z-index: 36;
  inset-block-start: calc(100% + 0.45rem);
  inset-inline-start: 0;
  display: grid;
  gap: 0.25rem;
  width: min(14rem, calc(100vw - 2rem));
  padding: 0.45rem;
  overflow: auto;
  border: 1px solid color-mix(in srgb, var(--primary) 28%, var(--line));
  border-radius: 0.85rem;
  background: var(--surface-raised);
  box-shadow: var(--shadow);
}

.console-grid-output-panel :is(button, a) {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  min-height: 2.35rem;
  padding: 0.45rem 0.6rem;
  border: 0;
  border-radius: 0.58rem;
  color: var(--ink);
  background: transparent;
  text-decoration: none;
  font: inherit;
  font-size: 0.75rem;
  font-weight: 800;
  cursor: pointer;
}

.console-grid-output-panel :is(button, a):hover,
.console-grid-output-panel :is(button, a):focus-visible {
  color: var(--primary);
  background: var(--primary-soft);
}

.console-grid-tone-control {
  display: grid;
  gap: 0.25rem;
  padding: 0.42rem 0.55rem;
  color: var(--muted);
  font-size: 0.7rem;
  font-weight: 800;
}

.console-grid-tone-control select {
  width: 100%;
  min-height: 2.1rem;
  border: 1px solid var(--line);
  border-radius: 0.58rem;
  color: var(--ink);
  background: var(--surface);
}

.column-drag-handle[role="button"] {
  display: inline-grid;
  width: 1.55rem;
  min-height: 1.55rem;
  place-items: center;
  border-radius: 0.42rem;
  cursor: grab;
  touch-action: none;
  user-select: none;
}

.column-drag-handle[role="button"]:active {
  cursor: grabbing;
}

.column-drag-handle[role="button"]:focus-visible,
.console-grid-toolbar :focus-visible,
.console-grid-context-menu :focus-visible {
  outline: 3px solid color-mix(in srgb, var(--primary) 55%, transparent);
  outline-offset: 2px;
}

table.console-grid {
  --grid-sticky-header-height: 3.3rem;
}

table.console-grid thead > tr:first-child > th {
  top: 0;
  box-sizing: border-box;
  height: var(--grid-sticky-header-height);
  min-height: var(--grid-sticky-header-height);
  padding-block: 0.35rem;
  overflow-wrap: anywhere;
  white-space: normal;
}

[data-grid-text-tone="muted"] {
  color: var(--muted);
}

[data-grid-text-tone="accent"] {
  color: var(--primary);
}

[data-grid-text-tone="success"] {
  color: var(--success);
}

[data-grid-text-tone="warning"] {
  color: var(--warning);
}

[data-grid-text-tone="danger"] {
  color: var(--danger);
}

[data-grid-text-tone="violet"] {
  color: var(--neon-violet);
}

[data-grid-text-tone] :is(a, bdi, input, select, textarea, strong) {
  color: inherit;
}

body:has(.price-save-dock:not([hidden])),
body:has(.update-ready-notice:not([hidden])) {
  padding-bottom:
    calc(var(--app-bar-height) + 9.5rem + env(safe-area-inset-bottom));
}

@media (min-width: 761px) {
  body.has-console-grid main[data-app-view],
  body.has-console-grid .session-bar {
    width: calc(100% - var(--workspace-inline-gap));
    max-width: none;
  }

  body.has-console-grid .page-heading {
    margin-block: 0.65rem 0.8rem;
  }

  body.has-console-grid .page-heading h1 {
    font-size: clamp(1.25rem, 1.8vw, 1.65rem);
  }

  body.page-pricing.has-console-grid .pricing-control-panel {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(18rem, 0.7fr);
    align-items: end;
    gap: 0.65rem;
    padding: 0.75rem;
    border-radius: 0.85rem;
    box-shadow: none;
  }

  body.page-pricing.has-console-grid .pricing-control-panel > .filter-panel {
    grid-template-columns: minmax(10rem, 0.65fr) minmax(16rem, 1.4fr) auto;
    gap: 0.55rem;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
  }

  body.page-pricing.has-console-grid .pricing-control-panel > .price-status-tabs {
    gap: 0.35rem;
  }

  body.page-pricing.has-console-grid .price-status-tabs .button {
    min-height: 2.35rem;
  }

  body.page-pricing.has-console-grid .pricing-list-panel {
    margin-top: 0.7rem;
    padding: 0.75rem;
    border-radius: 0.85rem;
    box-shadow: none;
  }

  body.page-pricing.has-console-grid .price-list-heading {
    margin-bottom: 0.5rem;
    padding: 0.6rem 0.75rem;
    border-radius: 0.65rem;
  }

  body.page-pricing.has-console-grid .console-grid-toolbar {
    margin-block: 0.5rem;
    padding: 0.45rem;
    border-radius: 0.65rem;
    box-shadow: none;
  }

  body.page-pricing.has-console-grid .pricing-table-wrap {
    border-radius: 0.65rem;
  }

  body.has-console-grid .table-wrap:has(> table.console-grid) {
    max-height:
      min(
        60rem,
        calc(100svh - var(--app-bar-height) - 8rem - env(safe-area-inset-bottom))
      );
    overflow: auto;
    overscroll-behavior: auto;
    scroll-padding-block: 5.1rem 1rem;
    scrollbar-gutter: stable both-edges;
  }
}

@media (min-width: 761px) and (max-width: 1100px) {
  body.page-pricing.has-console-grid .pricing-control-panel {
    grid-template-columns: 1fr;
  }

  .console-grid-command-row {
    grid-template-columns: minmax(14rem, 1fr) auto auto;
  }

  .console-grid-result-count {
    display: none;
  }
}

@media (max-width: 760px) {
  body.has-console-grid .console-grid-toolbar {
    display: flex;
    margin-block: 0.45rem;
    padding: 0.45rem;
  }

  .console-grid-command-row {
    display: block;
  }

  .console-grid-command-row > .console-grid-result-count,
  .console-grid-resizer,
  .column-drag-handle[role="button"] {
    display: none;
  }

  table.console-grid:not(.work-table):not(.inventory-table)
    .console-grid-resizer,
  table.product-workspace-table .console-grid-resizer,
  table.pricing-table.inventory-table .console-grid-resizer {
    display: block;
    inset-inline-end: -1rem;
    width: 2rem;
  }

  table.console-grid:not(.work-table):not(.inventory-table)
    .console-grid-resizer::after,
  table.product-workspace-table .console-grid-resizer::after,
  table.pricing-table.inventory-table .console-grid-resizer::after {
    inset-block: 16%;
  }

  table.console-grid:not(.work-table):not(.inventory-table)
    .column-drag-handle[role="button"],
  table.product-workspace-table .column-drag-handle[role="button"],
  table.pricing-table.inventory-table .column-drag-handle[role="button"] {
    display: inline-grid;
    width: 2.75rem;
    min-height: 2.75rem;
  }

  body.page-inventory
    table.product-workspace-products-table
    .column-drag-handle[role="button"] {
    position: absolute;
    z-index: 7;
    width: 1rem;
    min-height: 2rem;
    inset-block-start: 50%;
    inset-inline-start: 0;
    transform: translateY(-50%);
  }

  body.page-inventory
    table.product-workspace-products-table
    .column-drag-handle[role="button"]::before {
    position: absolute;
    inset-block: -0.375rem;
    inset-inline: -0.875rem;
    content: "";
  }

  body.page-inventory
    table.product-workspace-products-table
    .console-grid-resizer {
    z-index: 9;
  }

  .console-grid-command-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 0.45rem;
    width: 100%;
  }

  .console-grid-copy-status {
    min-width: 0;
  }

  body.has-console-grid main[data-app-view] {
    width: auto;
    margin-inline-start: max(0.75rem, env(safe-area-inset-right));
    margin-inline-end: max(0.75rem, env(safe-area-inset-left));
  }

  table.console-grid:is(.work-table, .inventory-table) td {
    min-width: 0;
    padding: 0.65rem 0.8rem;
    text-align: start;
  }

  table.console-grid:is(.work-table, .inventory-table)
    tbody tr:nth-child(odd) > td,
  table.console-grid:is(.work-table, .inventory-table)
    tbody tr:nth-child(even) > td {
    background: transparent;
  }

  .table-wrap:has(> table.work-table) {
    min-inline-size: 0;
    max-inline-size: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-inline: auto;
    -webkit-overflow-scrolling: touch;
  }

  .work-bulk-bar {
    position: static;
    align-items: stretch;
  }

  .work-row-selector {
    position: sticky;
    inset-inline-start: 0;
    z-index: 4;
    background: var(--surface) !important;
  }
}

/* Product workspace: one destination, two distinct read models. */
.product-workspace-switch {
  display: inline-grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(7rem, 1fr);
  gap: 0.25rem;
  max-width: 100%;
  margin-block: 0 0.7rem;
  padding: 0.25rem;
  border: 1px solid color-mix(in srgb, var(--primary) 22%, var(--line));
  border-radius: 0.85rem;
  background: var(--surface-soft);
}

.product-workspace-segment {
  display: inline-flex;
  min-height: 2.45rem;
  align-items: center;
  justify-content: center;
  padding: 0.42rem 0.75rem;
  border: 1px solid transparent;
  border-radius: 0.65rem;
  color: var(--muted);
  text-decoration: none;
  font-size: 0.76rem;
  font-weight: 900;
  white-space: nowrap;
}

.product-workspace-segment:hover,
.product-workspace-segment:focus-visible {
  color: var(--primary);
  background: color-mix(in srgb, var(--primary-soft) 76%, var(--surface));
}

.product-workspace-segment.is-current {
  border-color: color-mix(in srgb, var(--primary) 34%, var(--line));
  color: var(--primary-strong);
  background: var(--surface);
  box-shadow: var(--shadow-soft);
}

.sortable-row-copy {
  display: grid;
  min-width: 0;
  gap: 0.08rem;
}

.sortable-row-copy small {
  overflow: hidden;
  color: var(--muted);
  font-size: 0.64rem;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 760px) {
  .page-inventory .product-workspace-switch,
  .page-serials .product-workspace-switch {
    display: grid;
    width: 100%;
    grid-auto-columns: minmax(0, 1fr);
    margin-bottom: 0.55rem;
  }

  body.page-inventory .product-workspace-table-wrap,
  body.page-serials .product-workspace-table-wrap {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: auto;
    overscroll-behavior: auto;
    border: 1px solid var(--line);
    border-radius: 0.75rem;
    background: var(--surface);
    scrollbar-gutter: stable;
    -webkit-overflow-scrolling: touch;
  }

  body.page-inventory table.product-workspace-table,
  body.page-serials table.product-workspace-table {
    display: table;
    width: max-content;
    max-width: none;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
  }

  body.page-inventory table.product-workspace-products-table {
    min-width: 0;
  }

  body.page-serials table.product-workspace-serials-table {
    min-width: 42rem;
  }

  body.page-inventory table.product-workspace-table thead,
  body.page-serials table.product-workspace-table thead {
    position: static;
    display: table-header-group;
    width: auto;
    height: auto;
    overflow: visible;
    clip: auto;
  }

  body.page-inventory table.product-workspace-table tbody,
  body.page-serials table.product-workspace-table tbody {
    display: table-row-group;
  }

  body.page-inventory table.product-workspace-table tr,
  body.page-serials table.product-workspace-table tr {
    display: table-row;
    overflow: visible;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  body.page-inventory table.product-workspace-table :is(th, td),
  body.page-serials table.product-workspace-table :is(th, td) {
    display: table-cell;
    min-width: 5.5rem;
    padding: 0.48rem 0.55rem;
    font-size: 0.7rem;
    line-height: 1.55;
    text-align: start;
    vertical-align: middle;
  }

  body.page-inventory table.product-workspace-products-table :is(th, td) {
    min-width: 16px;
  }

  body.page-inventory table.product-workspace-table td::before,
  body.page-serials table.product-workspace-table td::before {
    content: none;
  }

}

/* Compact Mirza task detail: server truth first, progressive enhancement only. */
.mirza-task-detail,
.mirza-task-detail * {
  min-width: 0;
}

.mirza-task-detail {
  display: grid;
  gap: 0.55rem;
}

.task-detail-header {
  display: grid;
  gap: 0.65rem;
  padding: 0.8rem 0.9rem;
}

.task-detail-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}

.task-detail-heading h2 {
  margin: 0.28rem 0 0;
  overflow-wrap: anywhere;
  font-size: clamp(1rem, 2vw, 1.28rem);
  line-height: 1.55;
}

.task-status-pill,
.task-version,
.task-disclosure-count {
  display: inline-flex;
  min-height: 1.55rem;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 0.62rem;
  font-weight: 850;
  white-space: nowrap;
}

.task-status-pill {
  padding: 0.2rem 0.55rem;
  color: var(--primary-strong);
  background: var(--primary-soft);
}

.task-status-pill[data-task-status="DONE"] {
  color: var(--success-ink, #11673c);
  background: color-mix(in srgb, var(--success, #35b875) 18%, var(--surface));
}

.task-status-pill[data-task-status="BLOCKED"],
.task-status-pill[data-task-status="CANCELLED"] {
  color: var(--danger);
  background: color-mix(in srgb, var(--danger) 12%, var(--surface));
}

.task-status-pill[data-task-status="IN_PROGRESS"] {
  color: var(--primary-strong);
  background: color-mix(in srgb, var(--primary) 16%, var(--surface));
}

.task-version {
  padding: 0.2rem 0.5rem;
  color: var(--muted);
  background: var(--surface-soft);
}

.task-primary-actions {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  overflow-x: auto;
  padding-block: 0.05rem;
  scrollbar-width: thin;
}

.task-primary-actions .inline-form {
  flex: 0 0 auto;
  margin: 0;
}

.task-primary-actions button {
  min-height: 2.25rem;
  padding: 0.42rem 0.7rem;
  white-space: nowrap;
}

.task-fact-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.4rem;
}

.task-fact {
  display: block;
}

.task-fact > summary,
.task-disclosure > summary {
  cursor: pointer;
  list-style: none;
}

.task-fact > summary::-webkit-details-marker,
.task-disclosure > summary::-webkit-details-marker {
  display: none;
}

.task-fact-chip {
  display: flex;
  min-height: 3.4rem;
  align-items: center;
  gap: 0.48rem;
  width: 100%;
  padding: 0.48rem 0.55rem;
  border: 1px solid var(--line);
  border-radius: 0.75rem;
  color: var(--ink);
  background: var(--surface-panel);
  text-decoration: none;
}

a.task-fact-chip:hover,
a.task-fact-chip:focus-visible,
.task-fact > summary:hover,
.task-fact > summary:focus-visible,
.task-fact[open] > summary {
  border-color: color-mix(in srgb, var(--primary) 42%, var(--line));
  background: color-mix(in srgb, var(--primary-soft) 55%, var(--surface));
}

.task-fact-icon {
  display: grid;
  flex: 0 0 1.65rem;
  width: 1.65rem;
  height: 1.65rem;
  place-items: center;
  border-radius: 0.5rem;
  color: var(--primary-strong);
  background: var(--primary-soft);
  font-size: 0.85rem;
  font-weight: 900;
}

.task-fact-chip > span:last-child {
  display: grid;
  gap: 0.05rem;
  overflow: hidden;
}

.task-fact-chip small {
  color: var(--muted);
  font-size: 0.58rem;
  font-weight: 700;
}

.task-fact-chip strong {
  overflow: hidden;
  font-size: 0.68rem;
  line-height: 1.55;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-fact[open] {
  grid-column: span 2;
}

.task-editor-sheet {
  margin-top: 0.35rem;
  padding: 0.75rem;
  border: 1px solid color-mix(in srgb, var(--primary) 26%, var(--line));
  border-radius: 0.8rem;
  background: var(--surface-panel);
  box-shadow: var(--shadow-soft);
}

.task-editor-sheet h2 {
  margin: 0 0 0.6rem;
  font-size: 0.82rem;
}

.task-compact-form {
  display: grid;
  gap: 0.55rem;
}

.task-compact-form label,
.task-compact-form fieldset {
  margin: 0;
}

.task-compact-form :is(input, select, textarea) {
  margin-top: 0.22rem;
}

.task-editor-actions {
  position: sticky;
  bottom: 0;
  z-index: 2;
  padding-top: 0.4rem;
  background: linear-gradient(transparent, var(--surface-panel) 30%);
}

.task-stored-time {
  margin-bottom: 0.55rem;
}

.task-disclosure {
  padding: 0;
  overflow: clip;
}

.task-disclosure > summary {
  display: flex;
  min-height: 2.8rem;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
  padding: 0.65rem 0.8rem;
  font-size: 0.76rem;
  font-weight: 850;
}

.task-disclosure > summary::after {
  content: "⌄";
  margin-inline-start: auto;
  color: var(--muted);
  transition: transform 160ms ease;
}

.task-disclosure[open] > summary::after {
  transform: rotate(180deg);
}

.task-disclosure-count {
  min-width: 1.55rem;
  padding-inline: 0.35rem;
  color: var(--muted);
  background: var(--surface-soft);
}

.task-disclosure-body {
  padding: 0 0.8rem 0.8rem;
  border-top: 1px solid var(--line);
}

.task-disclosure-body > :first-child {
  margin-top: 0.7rem;
}

.task-disclosure-body > :last-child {
  margin-bottom: 0;
}

.mirza-task-detail .timeline {
  gap: 0.4rem;
}

.mirza-task-detail .timeline li {
  padding: 0.55rem 0.65rem;
}

.calendar-dialog-title {
  display: block;
  margin-bottom: 0.65rem;
  font-size: 0.88rem;
  text-align: start;
}

.jalali-dialog {
  max-height: min(90dvh, 42rem);
  overflow: auto;
}

@media (max-width: 760px) {
  .mirza-task-detail {
    gap: 0.42rem;
  }

  .task-detail-header {
    position: sticky;
    top: calc(var(--safe-top, 0px) + 0.25rem);
    z-index: 8;
    padding: 0.62rem 0.68rem;
    background: color-mix(in srgb, var(--surface-panel) 94%, transparent);
    backdrop-filter: blur(10px);
  }

  .task-detail-heading h2 {
    font-size: 0.92rem;
  }

  .task-fact-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.34rem;
  }

  .task-fact-chip {
    min-height: 3.05rem;
    padding: 0.4rem 0.45rem;
  }

  .task-fact-chip strong {
    font-size: 0.64rem;
  }

  .task-fact-grid > :last-child {
    grid-column: 1 / -1;
  }

  .task-fact[open] {
    grid-column: 1 / -1;
  }

  .task-editor-sheet {
    padding: 0.65rem;
  }

  .task-disclosure > summary {
    min-height: 2.55rem;
    padding: 0.55rem 0.68rem;
  }

  .task-disclosure-body {
    padding-inline: 0.68rem;
    padding-bottom: 0.68rem;
  }

  .jalali-dialog {
    width: min(calc(100vw - 1rem), 24rem);
    max-height: calc(100dvh - 1rem);
    padding: 0.75rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .task-disclosure > summary::after {
    transition: none;
  }
}

/* P30Console v2: Atlassian-calibrated operational shell.
   Keep this final layer scoped so domain markup and table behavior stay intact. */
body.console-shell-atlassian {
  --atlas-canvas: #e9f2ff;
  --atlas-surface: #ffffff;
  --atlas-surface-subtle: #f7f8f9;
  --atlas-surface-raised: #ffffff;
  --atlas-text: #172b4d;
  --atlas-text-subtle: #44546f;
  --atlas-border: #d9dde3;
  --atlas-border-strong: #b6c2cf;
  --atlas-primary: #0c66e4;
  --atlas-primary-hover: #0055cc;
  --atlas-selected: #ddebff;
  --atlas-danger: #ae2e24;
  --atlas-success: #216e4e;
  --atlas-warning: #974f0c;
  --atlas-row-even: #f8fafd;
  --atlas-row-hover: #edf4ff;
  --atlas-focus-ring: rgba(12, 102, 228, 0.24);
  --atlas-elevation: 0 12px 34px rgba(9, 30, 66, 0.12);
  --atlas-topbar-height: 48px;
  --atlas-sidebar-width: 320px;
  --atlas-control-height: 32px;
  --atlas-control-radius: 6px;
  --atlas-panel-radius: 8px;
  min-height: 100svh;
  overflow-x: hidden;
  color: var(--atlas-text);
  background: var(--atlas-canvas);
  font-size: 14px;
  line-height: 1.45;
}

:root[data-theme="dark"] body.console-shell-atlassian {
  --atlas-canvas: #081725;
  --atlas-surface: #0f2236;
  --atlas-surface-subtle: #162d45;
  --atlas-surface-raised: #19334d;
  --atlas-text: #e7f0fc;
  --atlas-text-subtle: #a2b5cc;
  --atlas-border: #29435f;
  --atlas-border-strong: #3b5875;
  --atlas-primary: #79aaff;
  --atlas-primary-hover: #a3c5ff;
  --atlas-selected: #193f6b;
  --atlas-danger: #ff9098;
  --atlas-success: #64deb5;
  --atlas-warning: #f3c76b;
  --atlas-row-even: #11283d;
  --atlas-row-hover: #193650;
  --atlas-focus-ring: rgba(121, 170, 255, 0.32);
  --atlas-elevation: 0 18px 48px rgba(0, 8, 20, 0.4);
}

body.console-shell-atlassian,
body.console-shell-atlassian :is(button, input, select, textarea) {
  font-family: "Vazirmatn", "Segoe UI", Tahoma, sans-serif;
}

body.console-shell-atlassian .app-header {
  position: fixed;
  z-index: 70;
  inset: 0 0 auto;
  display: grid;
  grid-template-areas: "brand search actions";
  grid-template-columns:
    var(--atlas-sidebar-width)
    minmax(320px, 780px)
    minmax(220px, 1fr);
  grid-template-rows: var(--atlas-topbar-height);
  min-height: var(--atlas-topbar-height);
  height: var(--atlas-topbar-height);
  align-items: center;
  gap: 8px;
  padding: 0;
  border: 0;
  border-bottom: 1px solid var(--atlas-border);
  background: var(--atlas-surface);
  box-shadow: none;
  backdrop-filter: none;
}

body.console-shell-atlassian .app-sidebar-brand {
  grid-area: brand;
  display: flex;
  width: 100%;
  height: var(--atlas-topbar-height);
  min-width: 0;
  align-items: center;
}

body.console-shell-atlassian .brand {
  display: flex;
  width: auto;
  height: var(--atlas-topbar-height);
  min-width: 0;
  flex: 1 1 auto;
  align-items: center;
  justify-content: flex-start;
  justify-self: stretch;
  gap: 9px;
  padding-inline: 16px;
  color: var(--atlas-text);
  text-align: start;
  text-decoration: none;
}

body.console-shell-atlassian .app-sidebar-toggle {
  display: grid;
  width: 36px;
  height: 36px;
  min-width: 36px;
  margin-inline-end: 8px;
  padding: 0;
  border: 0;
  border-radius: var(--atlas-control-radius);
  place-items: center;
  color: var(--atlas-text-subtle);
  background: transparent;
  cursor: pointer;
}

body.console-shell-atlassian .app-sidebar-toggle:hover {
  color: var(--atlas-text);
  background: var(--atlas-surface-subtle);
}

body.console-shell-atlassian .app-sidebar-toggle:focus-visible {
  outline: 2px solid var(--atlas-primary);
  outline-offset: 2px;
}

body.console-shell-atlassian .app-sidebar-toggle svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-width: 1.8;
}

body.console-shell-atlassian .brand-mark {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border-radius: 5px;
  color: #ffffff;
  background: var(--atlas-primary);
  box-shadow: none;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: -0.04em;
}

body.console-shell-atlassian .brand-copy {
  display: flex;
  min-width: 0;
  align-items: baseline;
  gap: 6px;
}

body.console-shell-atlassian .brand-copy strong {
  color: var(--atlas-text);
  font-size: 14px;
  font-weight: 700;
}

body.console-shell-atlassian .brand-copy small {
  color: var(--atlas-text-subtle);
  font-size: 11px;
  font-weight: 500;
}

body.console-shell-atlassian .global-search {
  grid-area: search;
  position: relative;
  display: flex;
  width: min(100%, 780px);
  height: var(--atlas-control-height);
  align-items: center;
  justify-self: center;
  margin: 0;
}

body.console-shell-atlassian .global-search input {
  width: 100%;
  height: var(--atlas-control-height);
  margin: 0;
  padding: 0 36px 0 12px;
  border: 1px solid var(--atlas-border-strong);
  border-radius: var(--atlas-control-radius);
  color: var(--atlas-text);
  background: var(--atlas-surface);
  box-shadow: none;
  font-size: 13px;
}

body.console-shell-atlassian .global-search input:hover {
  background: var(--atlas-surface-subtle);
}

body.console-shell-atlassian .global-search input:focus {
  border-color: var(--atlas-primary);
  outline: 2px solid var(--atlas-focus-ring);
  outline-offset: 0;
}

body.console-shell-atlassian .global-search-icon {
  position: absolute;
  z-index: 1;
  inset-inline-start: 10px;
  display: grid;
  width: 18px;
  height: 18px;
  place-items: center;
  color: var(--atlas-text-subtle);
  pointer-events: none;
}

body.console-shell-atlassian .global-search-icon svg,
body.console-shell-atlassian .global-icon-action svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

body.console-shell-atlassian .global-actions {
  grid-area: actions;
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  padding-inline: 16px;
}

body.console-shell-atlassian .global-create,
body.console-shell-atlassian .global-icon-action {
  display: inline-flex;
  min-height: var(--atlas-control-height);
  align-items: center;
  justify-content: center;
  border-radius: var(--atlas-control-radius);
  text-decoration: none;
}

body.console-shell-atlassian .global-create {
  gap: 5px;
  padding: 0 12px;
  color: #ffffff;
  background: var(--atlas-primary);
  font-size: 13px;
  font-weight: 700;
}

body.console-shell-atlassian .global-create:hover {
  color: #ffffff;
  background: var(--atlas-primary-hover);
}

body.console-shell-atlassian .global-icon-action {
  width: 32px;
  color: var(--atlas-text-subtle);
  background: transparent;
}

body.console-shell-atlassian .global-icon-action:hover {
  color: var(--atlas-text);
  background: var(--atlas-surface-subtle);
}

body.console-shell-atlassian .app-bar {
  position: fixed;
  z-index: 60;
  inset-block: var(--atlas-topbar-height) 0;
  right: 0;
  left: auto;
  width: var(--atlas-sidebar-width);
  height: auto;
  padding: 14px 12px 12px;
  border: 0;
  border-inline-start: 1px solid var(--atlas-border);
  border-radius: 0;
  background: var(--atlas-surface);
  box-shadow: none;
  backdrop-filter: none;
  transition: width 0.18s ease, padding 0.18s ease;
}

body.console-shell-atlassian .app-bar-track {
  display: flex;
  width: 100%;
  height: 100%;
  max-width: none;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: 3px;
  overflow-y: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.console-shell-atlassian .app-bar-track::before {
  display: block;
  margin: 2px 8px 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--atlas-border);
  color: var(--atlas-text-subtle);
  content: "فضای کاری";
  font-size: 11px;
  font-weight: 600;
}

body.console-shell-atlassian .app-bar-active-pill {
  display: none;
}

body.console-shell-atlassian .app-bar-item {
  position: relative;
  display: flex;
  width: 100%;
  min-height: 40px;
  flex: 0 0 40px;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  padding: 0 12px;
  border: 0;
  border-radius: var(--atlas-control-radius);
  color: var(--atlas-text-subtle);
  background: transparent;
  box-shadow: none;
  font-size: 14px;
  text-decoration: none;
}

body.console-shell-atlassian .app-bar-item:hover {
  color: var(--atlas-text);
  background: var(--atlas-surface-subtle);
  transform: none;
}

body.console-shell-atlassian .app-bar-item.app-bar-current {
  color: var(--atlas-primary);
  background: var(--atlas-selected);
  box-shadow: none;
}

body.console-shell-atlassian .app-bar-icon {
  display: grid;
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  place-items: center;
  color: currentColor;
}

body.console-shell-atlassian .app-bar-icon svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.7;
}

body.console-shell-atlassian .app-bar-label {
  display: inline;
  overflow: hidden;
  color: inherit;
  font-size: 13px;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.console-shell-atlassian .app-bar-indicator {
  display: none;
}

body.console-shell-atlassian .app-bar-item:last-child {
  margin-top: auto;
  border-top: 1px solid var(--atlas-border);
  border-radius: 0;
}

body.console-shell-atlassian main[data-app-view] {
  width: auto;
  max-width: none;
  min-width: 0;
  min-height: calc(100svh - var(--atlas-topbar-height));
  margin: var(--atlas-topbar-height) var(--atlas-sidebar-width) 0 0;
  padding: 0 24px 32px;
  color: var(--atlas-text);
  background: var(--atlas-canvas);
  animation: none;
  transition: margin-inline-start 0.18s ease;
}

body.console-shell-atlassian .storage-notice {
  min-height: 32px;
  margin: 0 -24px 8px;
  padding: 6px 24px;
  border: 0;
  border-bottom: 1px solid color-mix(in srgb, var(--atlas-warning) 28%, var(--atlas-border));
  border-radius: 0;
  color: var(--atlas-warning);
  background: color-mix(in srgb, #fff7d6 78%, var(--atlas-surface));
  box-shadow: none;
  font-size: 11px;
}

:root[data-theme="dark"] body.console-shell-atlassian .storage-notice {
  background: color-mix(
    in srgb,
    var(--atlas-warning) 14%,
    var(--atlas-surface)
  );
}

body.console-shell-atlassian .breadcrumb {
  min-height: 38px;
  margin: 0;
  padding: 14px 0 6px;
  color: var(--atlas-text-subtle);
  font-size: 12px;
}

body.console-shell-atlassian .breadcrumb a {
  color: var(--atlas-text-subtle);
}

body.console-shell-atlassian .breadcrumb-home {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border-radius: 4px;
  background: transparent;
}

body.console-shell-atlassian .breadcrumb-home:hover {
  background: var(--atlas-selected);
}

body.console-shell-atlassian .page-heading {
  position: relative;
  display: flex;
  min-height: 65px;
  align-items: center;
  gap: 10px;
  margin: 0 -24px;
  padding: 6px 24px 15px;
  border-bottom: 1px solid var(--atlas-border);
}

body.console-shell-atlassian .page-heading::before {
  display: grid;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  place-items: center;
  border-radius: 5px;
  color: #ffffff;
  background: var(--atlas-primary);
  content: "P30";
  font-size: 7px;
  font-weight: 900;
}

body.console-shell-atlassian .page-heading h1 {
  margin: 0;
  color: var(--atlas-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 24px;
}

body.console-shell-atlassian #work-browse {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  min-width: 0;
  gap: 12px;
  margin-top: 24px;
}

body.console-shell-atlassian :is(.card, .panel, .notice, .table-wrap) {
  border-color: var(--atlas-border);
  border-radius: var(--atlas-panel-radius);
  background: var(--atlas-surface);
  box-shadow: none;
}

body.console-shell-atlassian :is(.card, .panel):hover {
  border-color: var(--atlas-border);
  box-shadow: none;
  transform: none;
}

body.console-shell-atlassian
  :is(button, .button, input[type="submit"], input[type="button"]) {
  min-height: var(--atlas-control-height);
  padding: 0 12px;
  border: 1px solid transparent;
  border-radius: var(--atlas-control-radius);
  color: #ffffff;
  background: var(--atlas-primary);
  box-shadow: none;
  font-size: 12px;
  font-weight: 700;
  line-height: 30px;
}

body.console-shell-atlassian
  :is(button, .button, input[type="submit"], input[type="button"]):hover {
  color: #ffffff;
  background: var(--atlas-primary-hover);
  box-shadow: none;
  transform: none;
}

body.console-shell-atlassian
  :is(.button.secondary, button.secondary, .icon-button) {
  border-color: var(--atlas-border);
  color: var(--atlas-text);
  background: var(--atlas-surface);
}

body.console-shell-atlassian
  :is(.button.secondary, button.secondary, .icon-button):hover {
  border-color: var(--atlas-border-strong);
  color: var(--atlas-text);
  background: var(--atlas-surface-subtle);
}

body.console-shell-atlassian :is(input, select, textarea) {
  min-height: var(--atlas-control-height);
  margin: 0;
  border: 1px solid var(--atlas-border-strong);
  border-radius: var(--atlas-control-radius);
  color: var(--atlas-text);
  background: var(--atlas-surface);
  box-shadow: none;
  font-size: 12px;
}

body.console-shell-atlassian :is(input, select, textarea):focus {
  border-color: var(--atlas-primary);
  outline: 2px solid var(--atlas-focus-ring);
  outline-offset: 0;
  box-shadow: none;
}

body.console-shell-atlassian .pricing-control-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  width: 100%;
  min-width: 0;
  max-width: 100%;
  gap: 10px;
  margin: 0;
  padding: 12px;
}

body.console-shell-atlassian .pricing-control-panel .price-mobile-controls {
  display: none;
}

body.console-shell-atlassian .pricing-control-panel .filters {
  display: grid;
  grid-template-columns: 220px minmax(260px, 1fr) auto;
  align-items: end;
  gap: 8px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

body.console-shell-atlassian .pricing-control-panel .filters label,
body.console-shell-atlassian .page-work .filters label {
  display: grid;
  gap: 4px;
  min-width: 0;
  color: var(--atlas-text-subtle);
  font-size: 11px;
  font-weight: 600;
}

body.console-shell-atlassian .pricing-control-panel .filters :is(input, select) {
  width: 100%;
  height: var(--atlas-control-height);
}

body.console-shell-atlassian .price-status-tabs {
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 0;
  overflow-x: auto;
  padding: 0;
}

body.console-shell-atlassian .price-status-tabs .button {
  min-height: var(--atlas-control-height);
  padding: 0 11px;
  border: 0;
  color: var(--atlas-text-subtle);
  background: transparent;
  white-space: nowrap;
}

body.console-shell-atlassian .price-status-tabs .button[aria-current="page"] {
  color: var(--atlas-primary);
  background: var(--atlas-selected);
}

body.console-shell-atlassian .filter-fab {
  min-height: var(--atlas-control-height);
  border-radius: var(--atlas-control-radius);
  box-shadow: none;
}

body.console-shell-atlassian .pricing-list-panel {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  padding: 12px;
}

body.console-shell-atlassian .price-list-heading {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 44px;
  align-items: center;
  margin: 0;
  padding: 0 0 10px;
  border: 0;
  border-radius: 0;
  background: transparent;
}

body.console-shell-atlassian .price-list-heading h2 {
  color: var(--atlas-text);
  font-size: 16px;
  font-weight: 700;
  line-height: 22px;
}

body.console-shell-atlassian .price-list-heading p {
  margin-top: 2px;
  color: var(--atlas-text-subtle);
  font-size: 11px;
}

body.console-shell-atlassian .price-export-actions {
  align-items: center;
  gap: 6px;
}

body.console-shell-atlassian .price-export-actions .button {
  min-height: var(--atlas-control-height);
  padding: 0 10px;
}

body.console-shell-atlassian .manual-price-composer > summary {
  min-height: var(--atlas-control-height);
  list-style: none;
}

body.console-shell-atlassian .console-grid-toolbar {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 44px;
  align-items: center;
  gap: 6px;
  margin: 0 0 8px;
  padding: 6px 8px;
  border: 1px solid var(--atlas-border);
  border-radius: var(--atlas-control-radius);
  background: var(--atlas-surface);
  box-shadow: none;
}

/* Keep table options calm and scannable instead of inheriting primary buttons. */
body.console-shell-atlassian .console-grid-context-menu {
  box-sizing: border-box;
  gap: 1px;
  width: min(18rem, calc(100vw - 1rem));
  max-height: calc(100vh - 1rem);
  max-height: min(30rem, calc(100dvh - 1rem));
  padding: 4px;
  overflow-y: auto;
  overscroll-behavior: contain;
  border-color: var(--atlas-border-strong);
  border-radius: var(--atlas-panel-radius);
  color: var(--atlas-text);
  background: var(--atlas-surface-raised);
  box-shadow: 0 8px 24px rgba(9, 30, 66, 0.16);
  backdrop-filter: none;
  scrollbar-width: thin;
}

body.console-shell-atlassian .console-grid-context-menu button {
  min-height: 32px;
  padding: 6px 8px;
  border: 0;
  border-radius: var(--atlas-control-radius);
  color: var(--atlas-text);
  background: transparent;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.35;
  text-align: start;
}

body.console-shell-atlassian .console-grid-context-menu button:hover,
body.console-shell-atlassian .console-grid-context-menu button:focus-visible {
  color: var(--atlas-text);
  background: var(--atlas-surface-subtle);
}

body.console-shell-atlassian .console-grid-context-menu button:active {
  background: var(--atlas-selected);
}

body.console-shell-atlassian .console-grid-menu-heading {
  padding: 5px 8px 3px;
  color: var(--atlas-text-subtle);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

body.console-shell-atlassian .console-grid-filter-control {
  gap: 7px;
  margin: 2px 0;
  padding: 8px;
  border: 1px solid var(--atlas-border);
  border-radius: var(--atlas-control-radius);
  color: var(--atlas-text);
  background: var(--atlas-surface-subtle);
}

body.console-shell-atlassian .console-grid-filter-heading,
body.console-shell-atlassian .console-grid-filter-bulk-actions,
body.console-shell-atlassian .console-grid-filter-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

body.console-shell-atlassian .console-grid-filter-heading strong {
  font-size: 12px;
}

body.console-shell-atlassian .console-grid-filter-heading small,
body.console-shell-atlassian .console-grid-filter-selection-status {
  color: var(--atlas-text-subtle);
  font-size: 10px;
  font-weight: 500;
}

body.console-shell-atlassian .console-grid-filter-search {
  display: grid;
  gap: 3px;
  color: var(--atlas-text-subtle);
  font-size: 10px;
}

body.console-shell-atlassian .console-grid-filter-search input {
  margin: 0;
  padding: 5px 7px;
  border-color: var(--atlas-border-strong);
  background: var(--atlas-surface-raised);
}

body.console-shell-atlassian
  .console-grid-filter-bulk-actions
  button {
  width: auto;
  min-height: 24px;
  padding: 0;
  color: var(--atlas-primary);
  background: transparent;
  font-size: 11px;
}

body.console-shell-atlassian .console-grid-filter-values {
  display: grid;
  max-height: 11rem;
  overflow-y: auto;
  overscroll-behavior: contain;
  border-block: 1px solid var(--atlas-border);
  background: var(--atlas-surface-raised);
  scrollbar-width: thin;
}

body.console-shell-atlassian .console-grid-filter-value {
  display: grid;
  min-height: 34px;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px;
  padding: 4px 6px;
  color: var(--atlas-text);
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
}

body.console-shell-atlassian .console-grid-filter-value:hover {
  background: var(--atlas-surface-subtle);
}

body.console-shell-atlassian .console-grid-filter-value input {
  width: 16px;
  min-height: 16px;
  margin: 0;
}

body.console-shell-atlassian .console-grid-filter-value small {
  color: var(--atlas-text-subtle);
  font-size: 10px;
}

body.console-shell-atlassian .console-grid-filter-empty {
  margin: 0;
  padding: 12px 6px;
  color: var(--atlas-text-subtle);
  font-size: 11px;
  text-align: center;
}

body.console-shell-atlassian .console-grid-filter-actions {
  position: sticky;
  bottom: -4px;
  justify-content: flex-end;
  padding-top: 4px;
  background: var(--atlas-surface-subtle);
}

body.console-shell-atlassian
  .console-grid-context-menu
  :is(.console-grid-filter-cancel, .console-grid-filter-apply) {
  width: auto;
  min-width: 64px;
}

body.console-shell-atlassian
  .console-grid-context-menu
  .console-grid-filter-apply {
  color: #fff;
  background: var(--atlas-primary);
  font-weight: 700;
}

body.console-shell-atlassian
  .console-grid-context-menu
  .console-grid-filter-apply:is(:hover, :focus-visible) {
  color: #fff;
  background: var(--atlas-primary-hover);
}

body.console-shell-atlassian
  .console-grid-context-menu
  .console-grid-group-action {
  color: var(--atlas-text);
  background: transparent;
  font-weight: 500;
}

body.console-shell-atlassian
  .console-grid-context-menu
  :is(input:not([type="checkbox"]), select) {
  min-height: 32px;
  border-radius: 6px;
  font-size: 12px;
}

@media (pointer: coarse) {
  body.console-shell-atlassian .console-grid-context-menu button,
  body.console-shell-atlassian
    .console-grid-context-menu
    :is(input:not([type="checkbox"]), select) {
    min-height: 44px;
  }

  body.console-shell-atlassian .console-grid-filter-value {
    min-height: 44px;
  }
}

body.console-shell-atlassian .inventory-filter-form .inventory-filter-apply {
  margin-inline-start: auto;
  border-color: var(--atlas-primary);
  color: #fff;
  background: var(--atlas-primary);
  font-weight: 700;
}

body.console-shell-atlassian
  .inventory-filter-form
  .inventory-filter-apply:is(:hover, :focus-visible) {
  border-color: var(--atlas-primary-hover);
  color: #fff;
  background: var(--atlas-primary-hover);
}

body.console-shell-atlassian.page-inventory .inventory-filter-form select {
  border-color: var(--atlas-border-strong);
  color: var(--atlas-text);
  background: var(--atlas-surface-raised);
  font-weight: 600;
}

@media (max-width: 760px) {
  body.console-shell-atlassian
    .inventory-filter-form
    .inventory-filter-apply {
    width: 100%;
    margin-inline-start: 0;
    grid-column: 1 / -1;
    justify-self: stretch;
  }
}

table.console-grid.is-grid-reordering {
  user-select: none;
}

body.console-shell-atlassian .console-grid-command-row {
  min-height: 30px;
  align-items: center;
  gap: 6px;
}

body.console-shell-atlassian .console-grid-result-count {
  color: var(--atlas-text-subtle);
  font-size: 11px;
}

body.console-shell-atlassian
  :is(.console-grid-toolbar button, .console-grid-toolbar .button) {
  min-height: 30px;
  padding: 0 9px;
  line-height: 28px;
}

body.console-shell-atlassian .pricing-table-wrap {
  width: 100%;
  max-width: 100%;
  min-height: 360px;
  overflow: auto;
  border: 1px solid var(--atlas-border);
  border-radius: var(--atlas-control-radius);
  background: var(--atlas-surface);
  overscroll-behavior-inline: contain;
  box-shadow: none;
  scrollbar-width: thin;
}

body.console-shell-atlassian .pricing-table {
  border-collapse: separate;
  border-spacing: 0;
  color: var(--atlas-text);
}

body.console-shell-atlassian .pricing-table th {
  position: sticky;
  z-index: 4;
  top: 0;
  height: 40px;
  min-width: 112px;
  padding: 0 10px;
  border-bottom: 1px solid var(--atlas-border);
  border-inline-start: 1px solid var(--atlas-border);
  color: var(--atlas-text);
  background: var(--atlas-surface-subtle);
  box-shadow: none;
  font-size: 11px;
  font-weight: 700;
  line-height: 16px;
  text-align: start;
}

body.console-shell-atlassian .pricing-table td {
  min-height: 44px;
  padding: 7px 10px;
  border-bottom: 1px solid var(--atlas-border);
  color: var(--atlas-text);
  background: var(--atlas-surface);
  font-size: 12px;
  line-height: 18px;
  vertical-align: middle;
}

body.console-shell-atlassian .pricing-table tbody tr:nth-child(even) td {
  background: var(--atlas-row-even);
}

body.console-shell-atlassian .pricing-table tbody tr:hover td {
  background: var(--atlas-row-hover);
}

body.console-shell-atlassian .pricing-table tbody tr:only-child td[colspan] {
  height: 300px;
  color: var(--atlas-text-subtle);
  background: var(--atlas-surface);
  font-size: 13px;
  text-align: center;
  vertical-align: middle;
}

body.console-shell-atlassian .price-product-cell {
  box-shadow: none;
}

body.console-shell-atlassian .grid-row-selector {
  width: 16px;
  height: 16px;
  min-height: 16px;
}

body.console-shell-atlassian .column-drag-handle {
  color: var(--atlas-text-subtle);
}

/* Todoist-like information rhythm inside the same Atlassian shell. */
body.console-shell-atlassian.page-work #work-browse {
  width: min(100%, 1080px);
  margin-inline: auto;
}

body.console-shell-atlassian.page-work #work-browse > .panel:first-child,
body.console-shell-atlassian.page-work #work-browse > .notice {
  padding: 12px 14px;
}

body.console-shell-atlassian.page-work .quick-start {
  min-height: 64px;
  align-items: center;
  padding: 10px 12px;
  color: var(--atlas-text);
  background: var(--atlas-surface);
}

body.console-shell-atlassian.page-work .quick-start::before {
  content: none;
}

body.console-shell-atlassian.page-work .quick-start h2 {
  margin: 0 0 2px;
  color: var(--atlas-text);
  font-size: 14px;
}

body.console-shell-atlassian.page-work .quick-start p {
  margin: 0;
  color: var(--atlas-text-subtle);
  font-size: 11px;
}

body.console-shell-atlassian.page-work .work-counts {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}

body.console-shell-atlassian.page-work .work-counts > * {
  min-height: 42px;
  padding: 6px 9px;
  border: 1px solid var(--atlas-border);
  border-radius: var(--atlas-control-radius);
  background: var(--atlas-surface);
  box-shadow: none;
}

body.console-shell-atlassian.page-work .work-counts .metric {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

body.console-shell-atlassian.page-work .work-counts .metric span {
  color: var(--atlas-text-subtle);
  font-size: 11px;
}

body.console-shell-atlassian.page-work .work-counts .metric strong {
  color: var(--atlas-primary);
  font-size: 16px;
}

body.console-shell-atlassian.page-work .work-filter-disclosure {
  overflow: clip;
  margin: 0;
  border: 1px solid var(--atlas-border);
  border-radius: var(--atlas-panel-radius);
  background: var(--atlas-surface);
}

body.console-shell-atlassian.page-work .work-filter-disclosure > summary {
  display: flex;
  min-height: 44px;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  color: var(--atlas-text);
  cursor: pointer;
  list-style: none;
  font-size: 12px;
  font-weight: 700;
}

body.console-shell-atlassian.page-work
  .work-filter-disclosure
  > summary::-webkit-details-marker {
  display: none;
}

body.console-shell-atlassian.page-work
  .work-filter-disclosure
  > summary::before {
  width: 18px;
  color: var(--atlas-primary);
  content: "⌕";
  font-size: 17px;
  text-align: center;
}

body.console-shell-atlassian.page-work
  .work-filter-disclosure
  > summary::after {
  margin-inline-start: auto;
  color: var(--atlas-text-subtle);
  content: "⌄";
  font-size: 14px;
}

body.console-shell-atlassian.page-work
  .work-filter-disclosure[open]
  > summary {
  border-bottom: 1px solid var(--atlas-border);
}

body.console-shell-atlassian.page-work
  .work-filter-disclosure[open]
  > summary::after {
  content: "⌃";
}

body.console-shell-atlassian.page-work
  .work-filter-disclosure
  > summary
  small {
  margin-inline-start: 4px;
  color: var(--atlas-text-subtle);
  font-size: 11px;
  font-weight: 500;
}

body.console-shell-atlassian.page-work .filters.panel {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 10px 12px 12px;
  border: 0;
  border-radius: 0;
}

body.console-shell-atlassian.page-work .work-list-panel {
  min-width: 0;
  min-height: 420px;
  padding: 12px;
  border: 1px solid var(--atlas-border);
  border-radius: var(--atlas-panel-radius);
  background: var(--atlas-surface);
}

body.console-shell-atlassian.page-work .work-list-panel .console-grid-toolbar {
  margin-bottom: 8px;
}

body.console-shell-atlassian.page-work .work-list-panel .work-bulk-bar {
  margin: 0 0 8px;
}

body.console-shell-atlassian.page-work .work-bulk-bar[hidden] {
  display: none;
}

body.console-shell-atlassian.page-work .work-list-panel .table-wrap {
  min-height: 330px;
  margin: 0;
  overflow: auto;
  border: 1px solid var(--atlas-border);
  border-radius: var(--atlas-control-radius);
  overscroll-behavior-inline: contain;
  scrollbar-width: thin;
}

body.console-shell-atlassian.page-work .table-wrap :is(th, td) {
  height: 44px;
  padding: 7px 10px;
  border-color: var(--atlas-border);
  font-size: 12px;
}

body.console-shell-atlassian.page-work .table-wrap th {
  height: 40px;
  color: var(--atlas-text);
  background: var(--atlas-surface-subtle);
  font-size: 11px;
}

body.console-shell-atlassian.page-work
  .work-table
  tr[data-grid-empty-row="true"]
  td {
  height: 286px;
  color: var(--atlas-text-subtle);
  text-align: center;
  vertical-align: middle;
}

body.console-shell-atlassian.page-work #new-task {
  padding: 14px;
  border: 1px solid var(--atlas-border);
  border-top: 3px solid var(--atlas-primary);
  background: var(--atlas-surface);
  box-shadow: none;
}

body.console-shell-atlassian.page-work
  :is(.work-task-composer, .work-setup-disclosure) {
  overflow: clip;
  margin: 0;
  padding: 0;
  border: 1px solid var(--atlas-border);
  border-radius: var(--atlas-panel-radius);
  background: var(--atlas-surface);
}

body.console-shell-atlassian.page-work
  :is(.work-task-composer, .work-setup-disclosure)
  > summary {
  display: flex;
  min-height: 44px;
  align-items: center;
  gap: 8px;
  padding: 0 14px;
  color: var(--atlas-text);
  cursor: pointer;
  list-style: none;
  font-size: 13px;
  font-weight: 700;
}

body.console-shell-atlassian.page-work
  :is(.work-task-composer, .work-setup-disclosure)
  > summary::-webkit-details-marker {
  display: none;
}

body.console-shell-atlassian.page-work
  :is(.work-task-composer, .work-setup-disclosure)
  > summary::before {
  display: grid;
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  place-items: center;
  border-radius: 4px;
  color: var(--atlas-primary);
  background: var(--atlas-selected);
  content: "+";
  font-size: 18px;
  font-weight: 500;
  line-height: 1;
}

body.console-shell-atlassian.page-work
  :is(.work-task-composer, .work-setup-disclosure)[open]
  > summary {
  border-bottom: 1px solid var(--atlas-border);
}

body.console-shell-atlassian.page-work
  :is(.work-task-composer, .work-setup-disclosure)[open]
  > summary::before {
  content: "−";
}

body.console-shell-atlassian.page-work
  :is(.work-task-composer, .work-setup-disclosure)
  > summary
  small {
  margin-inline-start: auto;
  color: var(--atlas-text-subtle);
  font-size: 11px;
  font-weight: 500;
}

body.console-shell-atlassian.page-work .work-task-composer > #new-task {
  margin: 0;
  border: 0;
  border-radius: 0;
}

body.console-shell-atlassian.page-work .work-setup-grid {
  gap: 10px;
  margin: 0;
  padding: 0;
}

body.console-shell-atlassian.page-work .work-setup-grid > .panel {
  margin: 0;
}

body.console-shell-atlassian.page-work .work-setup-body {
  display: grid;
  gap: 12px;
  padding: 12px;
}

body.console-shell-atlassian.page-work .work-project-overview h2 {
  margin: 0 0 8px;
  color: var(--atlas-text);
  font-size: 13px;
}

body.console-shell-atlassian.page-work .work-project-overview .grid {
  gap: 8px;
}

body.console-shell-atlassian.page-work .work-project-overview .card {
  min-height: 56px;
  padding: 10px;
}

body.console-shell-atlassian.page-work .work-cycle-shortcut {
  display: flex;
  min-height: 54px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0;
  padding: 9px 12px;
}

body.console-shell-atlassian.page-work .work-cycle-shortcut h2 {
  margin: 0 0 2px;
  color: var(--atlas-text);
  font-size: 13px;
}

body.console-shell-atlassian.page-work .work-cycle-shortcut p {
  margin: 0;
  color: var(--atlas-text-subtle);
  font-size: 11px;
}

body.console-shell-atlassian .work-view-switcher {
  display: none;
}

@media (max-width: 760px) {
  body.console-shell-atlassian {
    --atlas-sidebar-width: 0px;
  }

  body.console-shell-atlassian .app-header {
    grid-template-areas: "brand actions";
    grid-template-columns: 1fr auto;
    padding-inline: 8px;
  }

  body.console-shell-atlassian .app-sidebar-brand {
    min-width: 0;
  }

  body.console-shell-atlassian .brand {
    padding-inline: 4px;
  }

  body.console-shell-atlassian .app-sidebar-toggle {
    display: none;
  }

  body.console-shell-atlassian .brand-copy small {
    display: none;
  }

  body.console-shell-atlassian .global-search {
    display: none;
  }

  body.console-shell-atlassian .global-actions {
    padding-inline: 0;
  }

  body.console-shell-atlassian .global-create {
    width: 40px;
    min-height: 40px;
    padding: 0;
  }

  body.console-shell-atlassian .global-create span:last-child {
    display: none;
  }

  body.console-shell-atlassian .global-icon-action {
    width: 40px;
    min-height: 40px;
  }

  body.console-shell-atlassian main[data-app-view] {
    width: 100%;
    min-height: 100svh;
    margin: var(--atlas-topbar-height) 0 0;
    padding: 0 12px calc(82px + env(safe-area-inset-bottom));
  }

  body.console-shell-atlassian .storage-notice {
    margin-inline: -12px;
    padding-inline: 12px;
  }

  body.console-shell-atlassian .breadcrumb {
    min-height: 34px;
    padding-top: 10px;
  }

  body.console-shell-atlassian .page-heading {
    min-height: 58px;
    margin-inline: -12px;
    padding: 6px 12px 12px;
  }

  body.console-shell-atlassian .page-heading h1 {
    font-size: 18px;
  }

  body.console-shell-atlassian #work-browse {
    gap: 8px;
    margin-top: 12px;
  }

  body.console-shell-atlassian .app-bar {
    inset: auto 8px calc(8px + env(safe-area-inset-bottom));
    right: 8px;
    left: 8px;
    width: auto;
    height: 64px;
    padding: 5px;
    border: 1px solid var(--atlas-border);
    border-radius: 12px;
    box-shadow: 0 8px 28px rgba(9, 30, 66, 0.18);
  }

  body.console-shell-atlassian .app-bar-track {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: center;
    gap: 2px;
    overflow: visible;
  }

  body.console-shell-atlassian .app-bar-track.app-bar-count-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  body.console-shell-atlassian .app-bar-track.app-bar-count-7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }

  body.console-shell-atlassian .app-bar-track::before {
    display: none;
  }

  body.console-shell-atlassian .app-bar-item,
  body.console-shell-atlassian .app-bar-item:last-child {
    display: grid;
    width: 100%;
    min-height: 52px;
    height: 52px;
    place-items: center;
    place-content: center;
    text-align: center;
    gap: 2px;
    margin: 0;
    padding: 3px 2px;
    border: 0;
    border-radius: 8px;
  }

  body.console-shell-atlassian .app-bar-icon {
    width: 20px;
    height: 20px;
    margin-inline: auto;
  }

  body.console-shell-atlassian .app-bar-label {
    display: -webkit-box;
    width: 100%;
    min-height: 20px;
    overflow: hidden;
    font-size: 9px;
    line-height: 10px;
    text-align: center;
    white-space: normal;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  body.console-shell-atlassian
    :is(button, .button, input[type="submit"], input[type="button"]) {
    min-height: 40px;
    line-height: 38px;
  }

  body.console-shell-atlassian :is(input, select, textarea) {
    min-height: 40px;
  }

  body.console-shell-atlassian .pricing-control-panel {
    padding: 10px;
  }

  body.console-shell-atlassian .pricing-control-panel .price-mobile-controls {
    display: grid;
    gap: 8px;
  }

  body.console-shell-atlassian .pricing-control-panel .filters {
    display: none;
    grid-template-columns: 1fr;
  }

  body.console-shell-atlassian
    .pricing-control-panel
    .filters.filter-open {
    display: grid;
  }

  body.console-shell-atlassian .price-status-tabs {
    padding-bottom: 2px;
  }

  body.console-shell-atlassian .price-status-tabs .button {
    min-height: 36px;
  }

  body.console-shell-atlassian .pricing-list-panel {
    padding: 10px;
  }

  body.console-shell-atlassian .price-list-heading {
    align-items: stretch;
    flex-direction: column;
  }

  body.console-shell-atlassian .price-export-actions {
    width: 100%;
    overflow-x: auto;
  }

  body.console-shell-atlassian .price-mobile-card,
  body.console-shell-atlassian .inventory-mobile-card {
    border: 1px solid var(--atlas-border);
    border-radius: var(--atlas-panel-radius);
    background: var(--atlas-surface);
    box-shadow: none;
  }

  body.console-shell-atlassian .price-mobile-card:hover,
  body.console-shell-atlassian .inventory-mobile-card:hover {
    border-color: var(--atlas-border-strong);
    box-shadow: none;
    transform: none;
  }

  body.console-shell-atlassian.page-work .work-counts {
    grid-template-columns: repeat(5, minmax(112px, 1fr));
    overflow-x: auto;
    padding-bottom: 3px;
    scrollbar-width: thin;
  }

  body.console-shell-atlassian.page-work .work-filter-disclosure > summary {
    min-height: 48px;
    padding: 0 10px;
  }

  body.console-shell-atlassian.page-work
    .work-filter-disclosure
    > summary
    small {
    overflow: hidden;
    max-width: 46%;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.console-shell-atlassian.page-work .filters.panel {
    grid-template-columns: 1fr;
  }

  body.console-shell-atlassian.page-work .quick-start {
    min-height: auto;
    padding: 12px;
  }

  body.console-shell-atlassian.page-work
    :is(.work-task-composer, .work-setup-disclosure)
    > summary {
    min-height: 48px;
    flex-wrap: wrap;
    padding: 8px 10px;
  }

  body.console-shell-atlassian.page-work
    :is(.work-task-composer, .work-setup-disclosure)
    > summary
    small {
    width: calc(100% - 28px);
    margin-inline-start: 28px;
  }

  body.console-shell-atlassian.page-work .work-task-composer > #new-task {
    padding: 12px 10px;
  }

  body.console-shell-atlassian.page-work .work-setup-grid {
    grid-template-columns: 1fr;
    padding: 0;
  }

  body.console-shell-atlassian.page-work .work-list-panel {
    min-height: 360px;
    padding: 8px;
  }

  body.console-shell-atlassian.page-work .work-list-panel .table-wrap {
    min-height: 300px;
    max-width: 100%;
  }

  body.console-shell-atlassian.page-work
    .work-table
    tr[data-grid-empty-row="true"]
    td {
    height: auto;
    min-height: 96px;
  }

  body.console-shell-atlassian.page-work .work-setup-body {
    padding: 10px;
  }

  body.console-shell-atlassian.page-work .work-cycle-shortcut {
    align-items: stretch;
    flex-direction: column;
  }

  body.console-shell-atlassian.page-work .work-cycle-shortcut .button {
    width: 100%;
  }
}

/* Modern navy dark mode: calm contrast, clear elevation and dense-table scan. */
:root[data-theme="dark"] body.console-shell-atlassian {
  background:
    radial-gradient(
      circle at 82% -8rem,
      color-mix(in srgb, var(--atlas-primary) 18%, transparent),
      transparent 34rem
    ),
    linear-gradient(180deg, #0a1b2c, var(--atlas-canvas) 28rem);
}

:root[data-theme="dark"] body.console-shell-atlassian .app-header {
  border-bottom-color: color-mix(
    in srgb,
    var(--atlas-primary) 16%,
    var(--atlas-border)
  );
  background: color-mix(
    in srgb,
    var(--atlas-surface) 92%,
    transparent
  );
  box-shadow: 0 1px 0 rgba(121, 170, 255, 0.08);
  backdrop-filter: blur(18px) saturate(125%);
}

:root[data-theme="dark"] body.console-shell-atlassian main[data-app-view] {
  background:
    radial-gradient(
      circle at 86% 0,
      color-mix(in srgb, var(--atlas-primary) 10%, transparent),
      transparent 30rem
    ),
    var(--atlas-canvas);
}

:root[data-theme="dark"] body.console-shell-atlassian .app-bar {
  border-inline-start-color: color-mix(
    in srgb,
    var(--atlas-primary) 14%,
    var(--atlas-border)
  );
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--atlas-surface-raised) 36%, var(--atlas-surface)),
      var(--atlas-surface) 16rem
    );
  box-shadow: -12px 0 38px rgba(0, 8, 20, 0.2);
}

:root[data-theme="dark"]
  body.console-shell-atlassian
  .app-bar-item.app-bar-current {
  color: #b9d3ff;
  background:
    linear-gradient(
      90deg,
      color-mix(in srgb, var(--atlas-selected) 88%, var(--atlas-surface)),
      color-mix(in srgb, var(--atlas-selected) 58%, var(--atlas-surface))
    );
}

:root[data-theme="dark"] body.console-shell-atlassian
  :is(.global-search input, input, select, textarea) {
  background: color-mix(
    in srgb,
    var(--atlas-surface-subtle) 72%,
    var(--atlas-surface)
  );
}

:root[data-theme="dark"] body.console-shell-atlassian
  :is(.global-search input, input, select, textarea):focus {
  background: var(--atlas-surface-raised);
  box-shadow: 0 0 0 1px var(--atlas-focus-ring);
}

:root[data-theme="dark"] body.console-shell-atlassian
  :is(.card, .panel, .notice, .table-wrap, .pricing-table-wrap) {
  border-color: color-mix(
    in srgb,
    var(--atlas-primary) 8%,
    var(--atlas-border)
  );
  background: color-mix(
    in srgb,
    var(--atlas-surface-raised) 16%,
    var(--atlas-surface)
  );
}

:root[data-theme="dark"] body.console-shell-atlassian
  :is(
    .settings-drawer-shell,
    .price-detail-sheet-shell,
    .inventory-detail-sheet-shell,
    .console-grid-context-menu
  ) {
  border-color: var(--atlas-border-strong);
  background: var(--atlas-surface-raised);
  box-shadow: var(--atlas-elevation);
}

:root[data-theme="dark"] body.console-shell-atlassian
  :is(.pricing-table, .work-table)
  thead
  th {
  color: #dbe9fa;
  background: color-mix(
    in srgb,
    var(--atlas-surface-raised) 64%,
    var(--atlas-surface-subtle)
  );
}

:root[data-theme="dark"] body.console-shell-atlassian
  :is(.pricing-table, .work-table)
  tbody
  tr:nth-child(odd)
  td {
  background: var(--atlas-surface);
}

:root[data-theme="dark"] body.console-shell-atlassian
  :is(.pricing-table, .work-table)
  tbody
  tr:nth-child(even)
  td {
  background: var(--atlas-row-even);
}

:root[data-theme="dark"] body.console-shell-atlassian
  :is(.pricing-table, .work-table)
  tbody
  tr:hover
  td {
  background: var(--atlas-row-hover);
}

:root[data-theme="dark"] body.console-shell-atlassian
  :is(.pricing-table, .work-table)
  td.is-grid-selected {
  background: color-mix(
    in srgb,
    var(--atlas-selected) 78%,
    var(--atlas-surface)
  );
  box-shadow: inset 0 0 0 1px var(--atlas-primary);
}

:root[data-theme="dark"] body.console-shell-atlassian
  :is(
    .settings-drawer-body,
    .pricing-table-wrap,
    .table-wrap,
    .app-bar-track
  ) {
  scrollbar-color: var(--atlas-border-strong) transparent;
}

@media (max-width: 760px) {
  :root[data-theme="dark"] body.console-shell-atlassian .app-bar {
    border-color: color-mix(
      in srgb,
      var(--atlas-primary) 20%,
      var(--atlas-border)
    );
    box-shadow: 0 16px 42px rgba(0, 7, 18, 0.5);
  }
}

/* Universal zebra authority for every hydrated Console table, including
   responsive card rows. Page-specific legacy rules must not flatten it. */
body.console-shell-atlassian
  table.console-grid
  tbody
  tr:not(.console-grid-group-row):nth-child(odd)
  > td {
  background: var(--atlas-surface);
}

body.console-shell-atlassian
  table.console-grid
  tbody
  tr:not(.console-grid-group-row):nth-child(even)
  > td {
  background: var(--atlas-row-even);
}

body.console-shell-atlassian
  table.console-grid
  tbody
  tr:not(.console-grid-group-row):hover
  > td {
  background: var(--atlas-row-hover);
}

body.console-shell-atlassian
  table.console-grid
  tbody
  tr
  > td.is-grid-selected {
  background: var(--atlas-selected);
}

body.console-shell-atlassian
  table.console-grid
  tbody
  tr:only-child
  > td[colspan] {
  background: var(--atlas-surface);
}

/* Mirza v3: a task-first Todoist-like flow inside the shared Console shell. */
body.console-shell-atlassian.page-work #work-browse {
  width: min(100%, 54rem);
}

.mirza-focus-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 0.8rem;
  padding: 0.35rem 0.1rem;
}

.mirza-focus-header h2 {
  margin: 0;
  color: var(--ink);
  font-size: clamp(1.15rem, 2.5vw, 1.55rem);
}

.mirza-focus-header p {
  margin: 0.18rem 0 0;
  color: var(--muted);
  font-size: 0.72rem;
}

.mirza-focus-nav {
  display: flex;
  gap: 0.28rem;
  padding: 0.2rem;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 0.75rem;
  background: var(--surface);
  scrollbar-width: none;
}

.mirza-focus-nav a {
  flex: 0 0 auto;
  padding: 0.38rem 0.58rem;
  border-radius: 0.55rem;
  color: var(--muted);
  text-decoration: none;
  font-size: 0.67rem;
  font-weight: 850;
  white-space: nowrap;
}

.mirza-focus-nav a:hover,
.mirza-focus-nav a:focus-visible,
.mirza-focus-nav a[aria-current="page"] {
  color: var(--primary-strong);
  background: var(--primary-soft);
}

body.console-shell-atlassian.page-work .work-counts {
  display: flex;
  gap: 0.35rem;
  padding-block: 0.05rem;
  overflow-x: auto;
  scrollbar-width: none;
}

body.console-shell-atlassian.page-work .work-counts > * {
  min-width: 7.2rem;
  min-height: 2.15rem;
  flex: 0 0 auto;
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface) 86%, var(--primary-soft));
}

body.console-shell-atlassian.page-work .work-counts .metric strong {
  font-size: 0.83rem;
}

body.console-shell-atlassian.page-work .work-list-panel {
  min-height: 0;
  padding: 0;
  overflow: hidden;
  border-color: color-mix(in srgb, var(--line) 82%, transparent);
  box-shadow: none;
}

body.console-shell-atlassian.page-work
  .work-list-panel
  .console-grid-toolbar {
  display: none;
}

body.console-shell-atlassian.page-work .work-list-panel .table-wrap {
  min-height: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
}

body.console-shell-atlassian.page-work .work-table,
body.console-shell-atlassian.page-work .work-table tbody {
  display: block;
  width: 100%;
  min-width: 0;
}

body.console-shell-atlassian.page-work .work-table thead {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

body.console-shell-atlassian.page-work .work-table tbody {
  counter-reset: mirza-task;
}

body.console-shell-atlassian.page-work .work-table tbody tr {
  display: grid;
  grid-template-columns: 2.2rem minmax(0, 1fr) auto auto;
  grid-template-rows: auto auto;
  align-items: center;
  gap: 0.08rem 0.5rem;
  min-height: 4.3rem;
  padding: 0.48rem 0.65rem;
  border: 0;
  border-bottom: 1px solid color-mix(in srgb, var(--line) 78%, transparent);
  border-radius: 0;
  background: var(--surface);
  box-shadow: none;
}

body.console-shell-atlassian.page-work .work-table tbody tr:last-child {
  border-bottom: 0;
}

body.console-shell-atlassian.page-work .work-table tbody tr:hover {
  background: color-mix(in srgb, var(--primary-soft) 38%, var(--surface));
}

body.console-shell-atlassian.page-work .work-table tbody tr > td {
  display: block;
  width: auto;
  height: auto;
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent !important;
  font-size: 0.67rem;
}

body.console-shell-atlassian.page-work .work-table td::before {
  content: none;
}

body.console-shell-atlassian.page-work
  .work-table
  td[data-label="ردیف"] {
  grid-column: 1;
  grid-row: 1 / 3;
}

body.console-shell-atlassian.page-work
  .work-table
  td[data-label="ردیف"]
  label {
  display: grid;
  place-items: center;
}

body.console-shell-atlassian.page-work
  .work-table
  td[data-label="ردیف"]
  span {
  display: none;
}

body.console-shell-atlassian.page-work
  .work-table
  td[data-label="کار"] {
  grid-column: 2;
  grid-row: 1;
  align-self: end;
}

body.console-shell-atlassian.page-work
  .work-table
  tr:not(:has(td[data-label="ردیف"]))
  td[data-label="کار"] {
  grid-column: 1 / 3;
}

body.console-shell-atlassian.page-work
  .work-table
  td[data-label="کار"]
  > .task-cell-content
  > a {
  color: var(--ink);
  font-size: 0.8rem;
  font-weight: 850;
  line-height: 1.55;
  text-decoration: none;
}

body.console-shell-atlassian.page-work
  .work-table
  td[data-label="پروژه"] {
  grid-column: 2;
  grid-row: 2;
  color: var(--muted);
}

body.console-shell-atlassian.page-work
  .work-table
  tr:not(:has(td[data-label="ردیف"]))
  td[data-label="پروژه"] {
  grid-column: 1 / 3;
}

body.console-shell-atlassian.page-work
  .work-table
  td[data-label="وضعیت"] {
  grid-column: 3;
  grid-row: 1;
  align-self: end;
  padding: 0.16rem 0.42rem;
  border-radius: 999px;
  color: var(--primary-strong);
  background: var(--primary-soft) !important;
  font-weight: 850;
  white-space: nowrap;
}

body.console-shell-atlassian.page-work
  .work-table
  td[data-label="اولویت"] {
  grid-column: 3;
  grid-row: 2;
  color: var(--muted);
  text-align: center;
}

body.console-shell-atlassian.page-work
  .work-table
  td[data-label="زمان"] {
  grid-column: 4;
  grid-row: 1 / 3;
  color: var(--muted);
  font-size: 0.62rem;
  white-space: normal;
  text-align: end;
}

body.console-shell-atlassian.page-work
  .work-table
  td[data-label="بخش"],
body.console-shell-atlassian.page-work
  .work-table
  td[data-label="مسئول"] {
  display: none;
}

body.console-shell-atlassian.page-work
  .work-table
  tr[data-grid-empty-row="true"] {
  display: grid;
  min-height: 9rem;
  place-items: center;
}

body.console-shell-atlassian.page-work
  .work-table
  tr[data-grid-empty-row="true"]
  td {
  grid-column: 1 / -1;
  height: auto;
  min-height: 0;
}

.task-composer-form {
  gap: 0.65rem;
}

.task-composer-form > h2 {
  margin: 0;
}

.task-composer-title input {
  min-height: 3.25rem;
  border-width: 0 0 1px;
  border-radius: 0;
  font-size: 1rem;
  font-weight: 750;
  background: transparent;
}

.task-composer-meta {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-items: start;
  gap: 0.55rem;
}

.task-composer-meta > :is(label, div, fieldset) {
  min-width: 0;
}

.field-hint {
  display: block;
  margin: 0.28rem 0 0;
  color: var(--muted);
  font-size: 0.62rem;
  font-weight: 550;
  line-height: 1.55;
}

.task-composer-actions {
  display: flex;
  justify-content: flex-end;
  padding-top: 0.15rem;
}

.task-label-picker {
  display: grid;
  gap: 0.48rem;
}

.task-label-search-label {
  max-width: 22rem;
}

.task-label-options {
  min-height: 2.7rem;
  align-items: center;
}

.task-label-option {
  padding: 0.28rem 0.48rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-soft);
}

.task-label-option:has(input:checked) {
  border-color: color-mix(in srgb, var(--primary) 45%, var(--line));
  color: var(--primary-strong);
  background: var(--primary-soft);
}

.task-label-create {
  width: fit-content;
  min-height: 2.25rem;
}

.task-origin-backlink {
  display: inline-flex;
  width: fit-content;
  min-height: 2.15rem;
  align-items: center;
  gap: 0.35rem;
  padding: 0.32rem 0.55rem;
  border: 1px solid color-mix(in srgb, var(--primary) 32%, var(--line));
  border-radius: 999px;
  color: var(--primary-strong);
  background: var(--primary-soft);
  text-decoration: none;
  font-size: 0.67rem;
  font-weight: 900;
}

.task-origin-backlink:hover,
.task-origin-backlink:focus-visible {
  border-color: var(--primary);
}

@media (max-width: 760px) {
  .mirza-focus-header {
    grid-template-columns: 1fr;
    gap: 0.55rem;
    padding-top: 0;
  }

  .mirza-focus-nav {
    width: 100%;
    margin-inline: 0;
  }

  body.console-shell-atlassian.page-work .work-table thead {
    display: none;
  }

  body.console-shell-atlassian.page-work .work-counts > * {
    min-width: 6.5rem;
  }

  body.console-shell-atlassian.page-work .work-list-panel {
    border-inline: 0;
    border-radius: 0;
  }

  body.console-shell-atlassian.page-work .work-table tbody {
    gap: 0;
  }

  body.console-shell-atlassian.page-work .work-table tbody tr {
    grid-template-columns: 1.9rem minmax(0, 1fr) auto;
    min-height: 4.15rem;
    margin: 0;
    padding: 0.48rem 0.25rem;
  }

  body.console-shell-atlassian.page-work
    .work-table
    td[data-label="وضعیت"] {
    grid-column: 3;
  }

  body.console-shell-atlassian.page-work
    .work-table
    td[data-label="اولویت"] {
    display: none;
  }

  body.console-shell-atlassian.page-work
    .work-table
    td[data-label="زمان"] {
    grid-column: 3;
    grid-row: 2;
    max-width: 7rem;
  }

  .quick-task-dialog {
    width: 100%;
    max-height: 92dvh;
    margin: auto 0 0;
    border-width: 1px 0 0;
    border-radius: 1.25rem 1.25rem 0 0;
  }

  .quick-task-shell {
    max-height: 92dvh;
  }

  .quick-task-header {
    min-height: 3.35rem;
    padding: 0.55rem 0.75rem;
    background: var(--surface);
  }

  .quick-task-body {
    min-height: 20rem;
    padding: 0.65rem 0.75rem
      calc(0.75rem + env(safe-area-inset-bottom));
  }

  .quick-task-body .task-composer-form {
    display: grid;
    grid-template-columns: 1fr;
    padding: 0;
  }

  .quick-task-body .task-composer-form > h2 {
    display: none;
  }

  .quick-task-body .task-composer-title input {
    min-height: 3.5rem;
    padding-inline: 0;
    font-size: 1.05rem;
  }

  .quick-task-body .task-composer-meta {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.45rem;
  }

  .quick-task-body .task-composer-meta > :nth-child(2) {
    grid-column: 1 / -1;
  }

  .quick-task-body .task-composer-meta .field-hint {
    margin-bottom: 0.25rem;
  }

  .quick-task-body .optional-fields {
    padding: 0;
    border: 0;
    background: transparent;
  }

  .quick-task-body .optional-fields > summary {
    min-height: 2.8rem;
    padding: 0.4rem 0;
    color: var(--muted);
  }

  .quick-task-body .optional-fields .form-grid {
    grid-template-columns: 1fr;
  }

  .quick-task-body .task-composer-actions {
    position: sticky;
    bottom: 0;
    z-index: 4;
    margin-inline: -0.75rem;
    padding: 0.65rem 0.75rem
      calc(0.65rem + env(safe-area-inset-bottom));
    border-top: 1px solid var(--line);
    background: color-mix(in srgb, var(--surface) 94%, transparent);
    backdrop-filter: blur(12px);
  }

  .quick-task-body .task-composer-actions button {
    width: 100%;
  }

  .card-mirza-action:not([data-mirza-detail-action]) {
    display: inline-flex;
    width: fit-content;
    max-width: 100%;
    min-height: 2.75rem;
  }

  .card-mirza-action[data-mirza-detail-action] {
    width: fit-content;
    min-height: 2.75rem;
  }
}
/* Content Studio uses the existing pricing shell and capabilities. */
.content-studio-quick-intake {
  display: grid;
  gap: 0.65rem;
  padding: 0.85rem;
  border: 1px solid var(--line);
  border-radius: 0.9rem;
  background: color-mix(in srgb, var(--surface) 88%, var(--primary-soft));
}

.content-studio-quick-intake.is-ready {
  border-color: color-mix(in srgb, var(--neon-cyan) 45%, var(--line));
}

.content-studio-quick-intake.is-blocked {
  border-color: color-mix(in srgb, #d97706 38%, var(--line));
}

.content-studio-quick-intake :is(h2, p, form) {
  margin: 0;
}

.content-studio-quick-intake .actions,
.content-studio-quick-intake form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}

.content-studio-shell {
  display: grid;
  grid-template-columns: minmax(15rem, 22rem) minmax(0, 1fr);
  gap: 1rem;
  align-items: start;
}

.content-studio-shell > .success-banner {
  grid-column: 1 / -1;
}

.content-studio-queue {
  position: sticky;
  top: 1rem;
  max-height: calc(100vh - 2rem);
  overflow: auto;
}

.content-studio-queue ol {
  display: grid;
  gap: .4rem;
  padding: 0;
  list-style: none;
}

.content-studio-queue a {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .25rem .75rem;
  padding: .75rem;
  color: inherit;
  text-decoration: none;
  border: 1px solid var(--line);
  border-radius: .75rem;
}

.content-studio-queue a:hover,
.content-studio-queue a:focus-visible {
  border-color: var(--primary);
  background: var(--surface);
}

.content-studio-queue small {
  grid-column: 1 / -1;
  color: var(--muted);
}

.content-studio-detail > header,
.content-studio-status,
.content-studio-actions {
  display: flex;
  gap: .75rem;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.content-studio-intro {
  margin: 1rem 0 1.25rem;
  padding: .85rem 1rem;
  border-inline-start: 4px solid var(--primary);
  border-radius: .65rem;
  background: var(--surface);
  color: var(--muted);
}

.content-studio-storefront-preview {
  display: grid;
  gap: .9rem;
  margin: 1rem 0 1.25rem;
  padding: 1rem;
  border: 1px solid color-mix(in srgb, var(--primary) 35%, var(--line));
  border-radius: .9rem;
  background: linear-gradient(135deg, var(--surface-raised), var(--surface));
}

.content-studio-storefront-preview header h3,
.content-studio-storefront-preview header p {
  margin: .35rem 0 0;
}

.content-studio-storefront-preview header p {
  color: var(--muted);
}

.content-studio-storefront-card {
  display: grid;
  grid-template-columns: minmax(12rem, 22rem) minmax(0, 1fr);
  gap: 1rem;
  align-items: start;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: .8rem;
  background: var(--surface-raised);
}

.content-studio-storefront-image {
  display: grid;
  min-height: 14rem;
  margin: 0;
  place-items: center;
  overflow: hidden;
  background: var(--surface);
}

.content-studio-storefront-image img {
  display: block;
  width: 100%;
  height: 100%;
  max-height: 24rem;
  object-fit: contain;
}

.content-studio-storefront-image figcaption,
.content-studio-image-unavailable {
  padding: .6rem .75rem;
  color: var(--muted);
  font-size: .88rem;
}

.content-studio-image-unavailable {
  text-align: center;
}

.content-studio-storefront-body {
  display: grid;
  gap: .7rem;
  padding: 1rem 1rem 1.1rem 0;
}

.content-studio-storefront-body h4,
.content-studio-storefront-body p {
  margin: 0;
}

.content-studio-storefront-code {
  color: var(--muted);
}

.content-studio-storefront-copy {
  display: grid;
  gap: .6rem;
  line-height: 1.85;
}

.content-studio-storefront-short {
  font-weight: 700;
}

.content-studio-storefront-long > :first-child,
.content-studio-storefront-short > :first-child {
  margin-top: 0;
}

.content-studio-storefront-long > :last-child,
.content-studio-storefront-short > :last-child {
  margin-bottom: 0;
}

.content-studio-search-preview {
  display: grid;
  gap: .3rem;
  padding: .8rem;
  border: 1px solid var(--line);
  border-radius: .65rem;
  background: var(--surface);
}

.content-studio-search-preview small,
.content-studio-search-preview span {
  color: var(--muted);
}

.content-studio-search-preview strong {
  color: #1a0dab;
}

.content-studio-search-preview p {
  color: #3c4043;
}

.content-studio-product-links {
  display: flex;
  gap: .75rem 1rem;
  align-items: center;
  flex-wrap: wrap;
  margin-block: .75rem;
}

.content-studio-product-links a {
  display: inline-flex;
  min-block-size: 44px;
  align-items: center;
}

.content-studio-product-links span {
  color: var(--muted);
}

.content-studio-step {
  display: grid;
  gap: 1rem;
  margin-top: 1rem;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: .9rem;
  background: var(--surface-raised);
}

.content-studio-step > header {
  display: grid;
  grid-template-columns: 2.75rem minmax(0, 1fr);
  gap: .75rem;
  align-items: start;
}

.content-studio-step > header > span,
.content-studio-technical > summary > span {
  display: inline-flex;
  width: 2.5rem;
  height: 2.5rem;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: var(--primary);
  color: #fff;
  font-weight: 800;
}

.content-studio-step > header h3,
.content-studio-step > header p {
  margin: 0;
}

.content-studio-step > header p,
.content-studio-step-state {
  margin-top: .25rem;
  color: var(--muted);
}

.content-studio-step-state {
  padding: .65rem .75rem;
  border-radius: .6rem;
  background: var(--surface);
}

.content-studio-media-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr));
  gap: .75rem;
}

.content-studio-media-card {
  display: grid;
  gap: .75rem;
  align-content: start;
}

.content-studio-media-card figure {
  display: grid;
  min-height: 12rem;
  margin: 0;
  place-items: center;
  overflow: hidden;
  border-radius: .75rem;
  background: var(--surface);
}

.content-studio-media-card img {
  display: block;
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.content-studio-choice-summary,
.content-studio-evidence dl {
  display: grid;
  gap: .45rem;
  margin: 0;
}

.content-studio-choice-summary > div,
.content-studio-evidence dl > div {
  display: grid;
  grid-template-columns: minmax(5rem, auto) minmax(0, 1fr);
  gap: .5rem;
}

.content-studio-choice-summary dt,
.content-studio-evidence dt {
  color: var(--muted);
}

.content-studio-choice-summary dd,
.content-studio-evidence dd {
  margin: 0;
  overflow-wrap: anywhere;
}

.content-studio-media-choice {
  display: grid;
  gap: .65rem;
}

.content-studio-media-choice label {
  display: flex;
  min-height: 2.75rem;
  gap: .55rem;
  align-items: center;
}

.content-studio-technical {
  margin-top: 1rem;
  padding: .85rem 1rem;
  border: 1px dashed var(--line);
  border-radius: .9rem;
  background: var(--surface);
}

.content-studio-technical > summary {
  display: flex;
  min-height: 2.75rem;
  gap: .65rem;
  align-items: center;
  cursor: pointer;
  font-weight: 750;
}

.content-studio-editor-evidence,
.content-studio-experimental-tools,
.content-studio-media-upload-fallback,
.content-studio-evidence {
  padding: .65rem .75rem;
  border: 1px solid var(--line);
  border-radius: .65rem;
  background: var(--surface);
}

.content-studio-editor-evidence > summary,
.content-studio-experimental-tools > summary,
.content-studio-media-upload-fallback > summary,
.content-studio-evidence > summary {
  min-height: 2.75rem;
  cursor: pointer;
  font-weight: 700;
}

.content-studio-status {
  display: grid;
  grid-template-columns: repeat(4, minmax(8rem, 1fr));
  margin: 1rem 0;
}

.content-studio-status > div {
  padding: .75rem;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: .75rem;
}

.content-studio-status dt {
  color: var(--muted);
  font-size: .82rem;
}

.content-studio-status dd {
  margin: .25rem 0 0;
  overflow-wrap: anywhere;
}

.content-studio-editor {
  display: grid;
  gap: 1rem;
  margin-top: 1rem;
}

.content-studio-editor fieldset {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
  border: 1px solid var(--line);
  border-radius: .75rem;
}

.content-studio-editor fieldset > .help {
  grid-column: 1 / -1;
}

.content-studio-editor label {
  display: grid;
  gap: .35rem;
}

.content-studio-editor textarea {
  min-height: 5rem;
  resize: vertical;
}

.content-studio-release-action {
  display: grid;
  gap: .65rem;
  max-width: 44rem;
  padding: .85rem;
  border: 1px solid color-mix(in srgb, var(--primary) 35%, var(--line));
  border-radius: .75rem;
  background: var(--surface);
}

.content-studio-release-action button {
  width: fit-content;
  min-height: 2.75rem;
}

.content-studio-action-explainer,
.content-studio-action-status {
  margin: 0;
  color: var(--muted);
  line-height: 1.7;
}

.content-studio-action-status:not(:empty) {
  color: var(--primary-strong);
  font-weight: 700;
}

.content-studio-action-error {
  max-width: 48rem;
  margin: 1.5rem auto;
}

@media (max-width: 760px) {
  .content-studio-shell {
    grid-template-columns: minmax(0, 1fr);
    gap: .65rem;
  }

  .content-studio-storefront-card {
    grid-template-columns: minmax(0, 1fr);
  }

  .content-studio-storefront-body {
    padding: 0 1rem 1rem;
  }

  .content-studio-queue {
    position: static;
    max-height: none;
    overflow: visible;
  }

  .content-studio-queue > header {
    display: grid;
    gap: .2rem;
  }

  .content-studio-queue ol {
    display: flex;
    max-width: 100%;
    gap: .55rem;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    padding-bottom: .25rem;
    scroll-snap-type: inline mandatory;
  }

  .content-studio-queue li {
    flex: 0 0 min(82vw, 19rem);
    scroll-snap-align: start;
  }

  .content-studio-queue a {
    min-height: 5rem;
  }

  .content-studio-storefront-preview {
    gap: .7rem;
    margin: .75rem 0 1rem;
    padding: .75rem;
  }

  .content-studio-storefront-image {
    min-height: 0;
    aspect-ratio: 4 / 3;
  }

  .content-studio-storefront-image img {
    max-height: none;
  }

  .content-studio-product-links {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: .25rem;
  }

  .content-studio-product-links a,
  .content-studio-product-links span {
    width: 100%;
    min-height: 2.75rem;
    padding: .45rem .6rem;
    border: 1px solid var(--line);
    border-radius: .55rem;
  }

  .content-studio-step > .table-wrap {
    overflow: visible;
  }

  .content-studio-step[data-studio-step="review"] .striped-table,
  .content-studio-step[data-studio-step="review"] .striped-table tbody,
  .content-studio-step[data-studio-step="review"] .striped-table tr,
  .content-studio-step[data-studio-step="review"] .striped-table td {
    display: block;
    width: 100%;
  }

  .content-studio-step[data-studio-step="review"] .striped-table thead {
    display: none;
  }

  .content-studio-step[data-studio-step="review"] .striped-table tr {
    margin-bottom: .65rem;
    padding: .7rem;
    border: 1px solid var(--line);
    border-radius: .7rem;
    background: var(--surface);
  }

  .content-studio-step[data-studio-step="review"] .striped-table td {
    display: grid;
    grid-template-columns: minmax(6.5rem, 40%) minmax(0, 1fr);
    gap: .5rem;
    align-items: center;
    padding: .4rem 0;
    border: 0;
  }

  .content-studio-step[data-studio-step="review"] .striped-table td::before {
    color: var(--muted);
    font-size: .82rem;
    font-weight: 700;
  }

  .content-studio-step[data-studio-step="review"] .striped-table td:nth-child(1)::before { content: "تصویر"; }
  .content-studio-step[data-studio-step="review"] .striped-table td:nth-child(2)::before { content: "آماده‌سازی"; }
  .content-studio-step[data-studio-step="review"] .striped-table td:nth-child(3)::before { content: "بررسی"; }
  .content-studio-step[data-studio-step="review"] .striped-table td:nth-child(4)::before { content: "اقدام"; }

  /* ConsoleTable prepends a selectable utility column to its enhanced grid.
     Keep the staff labels aligned with that five-cell live shape while the
     four-cell fallback above remains correct without the grid enhancer. */
  .content-studio-step[data-studio-step="review"] .striped-table.console-grid td:nth-child(1)::before { content: "انتخاب"; }
  .content-studio-step[data-studio-step="review"] .striped-table.console-grid td:nth-child(2)::before { content: "تصویر"; }
  .content-studio-step[data-studio-step="review"] .striped-table.console-grid td:nth-child(3)::before { content: "آماده‌سازی"; }
  .content-studio-step[data-studio-step="review"] .striped-table.console-grid td:nth-child(4)::before { content: "بررسی"; }
  .content-studio-step[data-studio-step="review"] .striped-table.console-grid td:nth-child(5)::before { content: "اقدام"; }

  .content-studio-release-action {
    padding: .75rem;
  }

  .content-studio-release-action button {
    width: 100%;
  }

  .content-studio-status,
  .content-studio-editor fieldset {
    grid-template-columns: minmax(0, 1fr);
  }

  .content-studio-step {
    padding: .85rem;
  }

  .content-studio-step > header {
    grid-template-columns: 2.5rem minmax(0, 1fr);
  }

  .content-studio-media-cards {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Mirza Work v4 — familiar Todoist-style information hierarchy and motion. */
.consignment-composer .editor-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap: .75rem; }
.consignment-composer .editor-form label:last-of-type { grid-column: 1 / -1; }
[data-consignment-catalog-results] { grid-column:1 / -1; display:grid; gap:.35rem; }
.consignment-catalog-option { text-align:right; border:1px solid var(--line, #d9ddd8); background:var(--surface, #fff); padding:.55rem .7rem; border-radius:.5rem; }
.consignment-card-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:.65rem; }
.consignment-case-card { display:grid; gap:.55rem; border:1px solid var(--line, #d9ddd8); border-radius:.8rem; padding:.75rem; background:var(--surface, #fff); }
.consignment-case-card h3 { margin:0; color:var(--text, #1e2723); font-size:1rem; }
.consignment-case-card p { margin:.1rem 0; color:var(--muted); }
.consignment-card-product { display:grid; gap:.15rem; }
.consignment-card-label { color:var(--primary); font-size:.72rem; font-weight:800; }
.consignment-card-label span, .consignment-card-serial span { color:var(--primary); }
.consignment-card-meta { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.25rem .55rem; align-items:center; }
.consignment-card-borrower span { color:#21745b; }
.consignment-card-date span { color:#6a5cc4; }
.consignment-card-notes { grid-column:1 / -1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.consignment-card-notes span { color:#a2631d; }
.consignment-card-actions { display:flex; flex-wrap:wrap; gap:.4rem; align-items:center; }
.consignment-card-actions form { margin:0; }
.consignment-returned { padding:.35rem .5rem; border-radius:.45rem; color:#0d6d4a !important; background:#eaf8f1; }
:root[data-theme="dark"] .consignment-returned { color:#9ae9c7 !important; background:#163f33; }
.consignment-list-controls { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; }
.consignment-list-controls > div:first-child { flex:1 1 13rem; }
.consignment-list-controls h2 { margin:0; }
.consignment-sort { display:flex; flex-wrap:wrap; gap:.35rem; }
.consignment-history-control { display:inline-flex; align-items:center; gap:.35rem; }
@media (max-width: 640px) { .consignment-composer .editor-form { grid-template-columns:1fr; } .consignment-card-grid { grid-template-columns:1fr; } .consignment-card-actions .button, .consignment-card-actions form { flex:1 1 8rem; } .consignment-card-actions form .button { width:100%; } }
body.console-shell-atlassian.page-work {
  --work-accent: #dc4c3e;
  --work-accent-strong: #b83a2f;
  --work-accent-soft: #fbe9e7;
  --primary: var(--work-accent);
  --primary-strong: var(--work-accent-strong);
  --primary-soft: var(--work-accent-soft);
}

:root[data-theme="dark"] body.console-shell-atlassian.page-work {
  --atlas-canvas: #1f1f1f;
  --atlas-surface: #282828;
  --atlas-surface-subtle: #303030;
  --atlas-surface-raised: #333333;
  --atlas-text: #f1f1f1;
  --atlas-text-subtle: #b7b7b7;
  --atlas-border: #3d3d3d;
  --atlas-border-strong: #555555;
  --atlas-row-even: #2b2b2b;
  --atlas-row-hover: #35302f;
  --surface: #282828;
  --surface-panel: #282828;
  --surface-soft: #303030;
  --ink: #f1f1f1;
  --muted: #b7b7b7;
  --line: #3d3d3d;
  --work-accent: #ff7066;
  --work-accent-strong: #ff9088;
  --work-accent-soft: #4b302e;
}

body.console-shell-atlassian.page-work .app-bar-item.app-bar-current {
  color: var(--work-accent-strong);
  background: var(--work-accent-soft);
}

body.console-shell-atlassian.page-work .global-create {
  background: var(--work-accent);
}

body.console-shell-atlassian.page-work .global-create:hover {
  background: var(--work-accent-strong);
}

body.console-shell-atlassian.page-work #work-browse {
  width: min(100%, 56rem);
  margin-inline: auto;
}

body.console-shell-atlassian.page-work .page-heading {
  width: min(100%, 56rem);
  margin-inline: auto;
}

body.console-shell-atlassian.page-work .mirza-focus-header {
  align-items: center;
  padding: 0.8rem 0 0.45rem;
}

body.console-shell-atlassian.page-work .mirza-focus-header p {
  display: none;
}

body.console-shell-atlassian.page-work .mirza-focus-nav {
  border: 0;
  background: transparent;
}

body.console-shell-atlassian.page-work .mirza-focus-nav a {
  min-height: 2rem;
}

body.console-shell-atlassian.page-work .work-counts {
  margin-block: 0.25rem 0.5rem;
  opacity: 0.82;
}

body.console-shell-atlassian.page-work .work-counts > * {
  min-width: auto;
  min-height: 1.8rem;
  padding: 0.25rem 0.6rem;
  border: 0;
  background: transparent;
}

body.console-shell-atlassian.page-work .work-list-panel {
  border: 0;
  background: transparent;
}

body.console-shell-atlassian.page-work .work-table tbody tr {
  grid-template-columns: 1.65rem minmax(0, 1fr) auto auto;
  min-height: 3.65rem;
  padding: 0.38rem 0.35rem;
  border-bottom-color: color-mix(in srgb, var(--line) 72%, transparent);
}

body.console-shell-atlassian.page-work
  .work-table
  tbody
  tr.is-keyboard-focused {
  outline: 2px solid color-mix(in srgb, var(--work-accent) 45%, transparent);
  outline-offset: -2px;
  background: color-mix(
    in srgb,
    var(--work-accent-soft) 58%,
    var(--surface)
  );
}

body.console-shell-atlassian.page-work .work-row-selector {
  opacity: 0;
  transition: opacity 120ms ease;
}

body.console-shell-atlassian.page-work
  .work-table
  tr:hover
  .work-row-selector,
body.console-shell-atlassian.page-work
  .work-table
  tr:focus
  .work-row-selector,
body.console-shell-atlassian.page-work
  .work-row-selector:has(input:checked) {
  opacity: 1;
}

.task-row-main {
  display: grid;
  grid-template-columns: 1.6rem minmax(0, 1fr);
  align-items: start;
  gap: 0.55rem;
}

.task-row-complete-form {
  margin: 0;
}

.task-complete-control,
.task-detail-complete {
  display: grid;
  width: 1.25rem;
  height: 1.25rem;
  min-width: 1.25rem;
  min-height: 1.25rem;
  place-items: center;
  padding: 0;
  border: 1.5px solid #808080;
  border-radius: 50%;
  color: transparent;
  background: transparent;
  box-shadow: none;
  font-size: 0.68rem;
  transition:
    color 120ms ease,
    border-color 120ms ease,
    background 120ms ease,
    transform 120ms ease;
}

.task-complete-control[data-task-priority="1"],
.task-detail-complete {
  border-color: var(--work-accent);
}

.task-complete-control[data-task-priority="2"] {
  border-color: #eb8909;
}

.task-complete-control[data-task-priority="3"] {
  border-color: #246fe0;
}

.task-complete-control:is(:hover, :focus-visible),
.task-detail-complete:is(:hover, :focus-visible) {
  color: var(--work-accent-strong);
  border-color: var(--work-accent);
  background: var(--work-accent-soft);
  transform: scale(1.06);
}

.task-complete-control.is-static[data-task-status="DONE"],
.task-detail-complete.is-static[data-task-status="DONE"] {
  color: #ffffff;
  border-color: #5b9b62;
  background: #5b9b62;
}

body.console-shell-atlassian.page-work
  .work-table
  td[data-label="کار"]
  > .task-row-main
  .task-cell-content
  > a {
  font-size: 0.82rem;
  font-weight: 650;
}

body.console-shell-atlassian.page-work
  .work-table
  td[data-label="پروژه"] {
  padding-inline-start: 2.15rem;
  color: var(--muted);
}

body.console-shell-atlassian.page-work
  .work-table
  td[data-label="پروژه"]
  > span {
  margin-inline-end: 0.18rem;
  color: var(--work-accent-strong);
}

body.console-shell-atlassian.page-work
  .work-table
  td[data-label="وضعیت"] {
  color: var(--muted);
  background: transparent !important;
  font-weight: 600;
}

.task-composer-form {
  position: relative;
}

.task-composer-title > span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

.task-composer-title input {
  padding-inline: 0.2rem;
  border: 0;
  font-size: 1.05rem;
  font-weight: 650;
}

.task-composer-title input:focus {
  outline: 0;
  box-shadow: none;
}

.task-quick-syntax {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.75rem;
  min-height: 1.5rem;
  align-items: center;
  color: var(--muted);
  font-size: 0.66rem;
}

.task-quick-syntax > span {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
}

kbd {
  display: inline-flex;
  min-width: 1.35rem;
  min-height: 1.35rem;
  align-items: center;
  justify-content: center;
  padding: 0.08rem 0.32rem;
  border: 1px solid var(--line);
  border-bottom-width: 2px;
  border-radius: 0.3rem;
  color: var(--ink);
  background: var(--surface-soft);
  font: inherit;
  font-size: 0.64rem;
  font-weight: 700;
}

.task-token-menu {
  z-index: 15;
  display: grid;
  width: min(24rem, 100%);
  max-height: 16rem;
  gap: 0.15rem;
  overflow-y: auto;
  padding: 0.35rem;
  border: 1px solid var(--line);
  border-radius: 0.6rem;
  background: var(--surface);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.16);
}

.task-token-menu[hidden] {
  display: none;
}

.task-token-menu button {
  display: flex;
  min-height: 2.35rem;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5rem;
  padding: 0.4rem 0.55rem;
  border: 0;
  color: var(--ink);
  background: transparent;
  text-align: start;
}

.task-token-menu button > span {
  color: var(--work-accent-strong);
}

.task-token-menu button:is(:hover, :focus-visible, .is-active) {
  background: var(--surface-soft);
}

.task-token-menu .task-token-create {
  color: var(--work-accent-strong);
}

.task-label-option > span,
.task-label-chip > span {
  margin-inline-end: 0.12rem;
  color: var(--work-accent-strong);
}

.quick-task-dialog {
  width: min(38rem, calc(100% - 2rem));
  border: 1px solid var(--line);
  border-radius: 0.85rem;
  background: var(--surface);
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.3);
}

.quick-task-dialog::backdrop,
.keyboard-shortcuts-dialog::backdrop {
  background: rgba(0, 0, 0, 0.44);
  backdrop-filter: blur(2px);
}

.quick-task-header {
  min-height: 3rem;
  padding: 0.45rem 0.7rem;
  border-bottom: 1px solid var(--line);
}

.quick-task-header strong {
  font-size: 0.78rem;
  font-weight: 650;
}

.quick-task-body {
  padding: 0.65rem 0.75rem 0.75rem;
}

.quick-task-body .task-composer-form {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.quick-task-body .task-composer-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.quick-task-body .task-composer-meta > :is(label, div) {
  flex: 1 1 8.5rem;
}

.quick-task-body .task-composer-meta :is(select, input) {
  min-height: 2.35rem;
}

.quick-task-body .task-composer-actions button {
  min-width: 7.5rem;
  background: var(--work-accent);
}

.keyboard-shortcuts-dialog {
  width: min(31rem, calc(100% - 2rem));
  max-height: min(80dvh, 42rem);
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 0.85rem;
  color: var(--ink);
  background: var(--surface);
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.3);
}

.keyboard-shortcuts-shell > header {
  display: flex;
  min-height: 3.25rem;
  align-items: center;
  justify-content: space-between;
  padding: 0.55rem 0.75rem;
  border-bottom: 1px solid var(--line);
}

.keyboard-shortcuts-list {
  display: grid;
  padding: 0.35rem 0.75rem 0.75rem;
}

.keyboard-shortcuts-list > div {
  display: flex;
  min-height: 2.6rem;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  border-bottom: 1px solid color-mix(in srgb, var(--line) 68%, transparent);
  font-size: 0.75rem;
}

.keyboard-shortcuts-list > div:last-child {
  border-bottom: 0;
}

body.console-shell-atlassian.page-work:has(.mirza-task-detail)
  main[data-app-view] {
  padding: 1rem 1.25rem 2rem;
  background: color-mix(in srgb, var(--atlas-canvas) 72%, #777777 12%);
}

body.console-shell-atlassian.page-work:has(.mirza-task-detail)
  .breadcrumb,
body.console-shell-atlassian.page-work:has(.mirza-task-detail)
  .page-heading {
  display: none;
}

body.console-shell-atlassian.page-work:has(.mirza-task-detail)
  #work-browse {
  width: min(100%, 70rem);
}

.mirza-task-detail {
  display: block;
  width: 100%;
  overflow: clip;
  border: 1px solid var(--line);
  border-radius: 0.9rem;
  background: var(--surface);
  box-shadow: 0 14px 44px rgba(0, 0, 0, 0.16);
}

.task-view-toolbar {
  position: static;
  display: flex;
  min-height: 3.25rem;
  align-items: center;
  justify-content: space-between;
  gap: 0.7rem;
  padding: 0.45rem 0.75rem;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: var(--surface);
  box-shadow: none;
}

.task-view-breadcrumb,
.task-view-toolbar-actions {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 0.45rem;
}

.task-view-breadcrumb > a:first-child {
  overflow: hidden;
  color: var(--muted);
  font-size: 0.72rem;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-view-breadcrumb > a:first-child span {
  margin-inline-end: 0.2rem;
  color: var(--work-accent-strong);
}

.task-origin-backlink {
  min-height: 1.85rem;
  padding: 0.2rem 0.45rem;
  border: 0;
  color: var(--muted);
  background: transparent;
  font-size: 0.64rem;
}

.task-origin-backlink:is(:hover, :focus-visible) {
  color: var(--ink);
  background: var(--surface-soft);
}

.task-view-close,
.task-status-menu > summary {
  display: grid;
  width: 2rem;
  height: 2rem;
  min-width: 2rem;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 0.4rem;
  color: var(--muted);
  background: transparent;
  font-size: 1.1rem;
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
  list-style: none;
}

.task-status-menu > summary::-webkit-details-marker {
  display: none;
}

.task-view-close:is(:hover, :focus-visible),
.task-status-menu > summary:is(:hover, :focus-visible) {
  color: var(--ink);
  background: var(--surface-soft);
}

.task-status-menu {
  position: relative;
}

.task-status-options {
  position: absolute;
  z-index: 30;
  inset-block-start: calc(100% + 0.3rem);
  inset-inline-end: 0;
  display: grid;
  min-width: 10rem;
  gap: 0.2rem;
  padding: 0.35rem;
  border: 1px solid var(--line);
  border-radius: 0.55rem;
  background: var(--surface);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.2);
}

.task-status-option {
  margin: 0;
}

.task-status-option button {
  width: 100%;
  min-height: 2.15rem;
  justify-content: flex-start;
  border: 0;
  color: var(--ink);
  background: transparent;
  text-align: start;
}

.task-status-option button:hover {
  background: var(--surface-soft);
}

.task-view-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(16rem, 19rem);
  min-height: min(44rem, calc(100dvh - 8rem));
}

.task-view-main {
  min-width: 0;
  padding: 2rem 2.25rem;
}

.task-view-sidebar {
  min-width: 0;
  padding: 1.3rem 1rem;
  border-inline-start: 1px solid var(--line);
  background: color-mix(in srgb, var(--surface-soft) 72%, var(--surface));
}

.task-core-heading {
  display: grid;
  grid-template-columns: 1.65rem minmax(0, 1fr);
  align-items: start;
  gap: 0.7rem;
}

.task-detail-complete-form {
  margin: 0.35rem 0 0;
}

.task-detail-complete {
  width: 1.45rem;
  height: 1.45rem;
  min-width: 1.45rem;
  min-height: 1.45rem;
}

.task-core-editor {
  display: grid;
  gap: 0.35rem;
}

.task-title-editor,
.task-description-editor {
  display: grid;
}

.task-title-editor > span,
.task-description-editor > span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

.task-title-editor input,
.task-description-editor textarea {
  width: 100%;
  min-height: 0;
  padding: 0.2rem 0.25rem;
  border: 1px solid transparent;
  border-radius: 0.35rem;
  color: var(--ink);
  background: transparent;
  box-shadow: none;
}

.task-title-editor input {
  font-size: clamp(1.05rem, 2.2vw, 1.35rem);
  font-weight: 750;
  line-height: 1.45;
}

.task-description-editor textarea {
  resize: vertical;
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.75;
}

.task-title-editor input:hover,
.task-description-editor textarea:hover {
  border-color: var(--line);
}

.task-title-editor input:focus,
.task-description-editor textarea:focus {
  border-color: color-mix(in srgb, var(--work-accent) 45%, var(--line));
  outline: 2px solid color-mix(in srgb, var(--work-accent) 18%, transparent);
}

.task-core-save {
  display: flex;
  min-height: 2rem;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
  opacity: 0;
  transition: opacity 120ms ease;
}

.task-core-editor:focus-within .task-core-save {
  opacity: 1;
}

.task-core-save button {
  min-height: 2rem;
  padding: 0.3rem 0.65rem;
  background: var(--work-accent);
}

.task-core-save small {
  color: var(--muted);
  font-size: 0.62rem;
}

.task-core-readonly h2 {
  margin: 0;
  font-size: clamp(1.05rem, 2.2vw, 1.35rem);
}

.task-core-readonly p {
  margin: 0.45rem 0 0;
  color: var(--muted);
  line-height: 1.75;
}

.task-sidebar-fields {
  display: grid;
}

.task-sidebar-field {
  display: block;
  min-height: 3.35rem;
  padding: 0.7rem 0.25rem;
  border: 0;
  border-bottom: 1px solid color-mix(in srgb, var(--line) 74%, transparent);
  border-radius: 0;
  color: var(--ink);
  background: transparent;
  text-decoration: none;
}

.task-sidebar-field > summary {
  display: flex;
  min-height: 1.9rem;
  align-items: center;
  justify-content: space-between;
  padding: 0;
  cursor: pointer;
  list-style: none;
}

.task-sidebar-field > summary::-webkit-details-marker {
  display: none;
}

.task-sidebar-field > span,
.task-sidebar-field > summary > span:first-child {
  display: grid;
  gap: 0.12rem;
}

.task-sidebar-field small {
  color: var(--muted);
  font-size: 0.65rem;
  font-weight: 600;
}

.task-sidebar-field strong {
  overflow: hidden;
  font-size: 0.74rem;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-sidebar-field:is(a, summary):hover,
.task-sidebar-field[open] {
  color: var(--ink);
}

.task-sidebar-field .task-editor-sheet {
  margin-top: 0.55rem;
  padding: 0.65rem;
  border-radius: 0.5rem;
  background: var(--surface);
  box-shadow: none;
}

.task-sidebar-field .task-disclosure-body {
  padding: 0.45rem 0 0;
  border-top: 0;
}

.task-label-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.4rem;
}

.task-label-chip {
  display: inline-flex;
  min-height: 1.75rem;
  align-items: center;
  padding: 0.15rem 0.45rem;
  border-radius: 0.35rem;
  color: var(--ink);
  background: color-mix(in srgb, #d9d7a5 55%, var(--surface));
  font-size: 0.68rem;
}

.task-view-main > .task-disclosure {
  margin-top: 1.3rem;
  border: 0;
  border-top: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.task-view-main > .task-disclosure > summary {
  padding-inline: 0;
}

.task-view-main > .task-disclosure .task-disclosure-body {
  padding-inline: 0;
  border-top: 0;
}

.task-view-main .task-subtask-list li,
.task-view-main .timeline li {
  border: 0;
  border-bottom: 1px solid color-mix(in srgb, var(--line) 70%, transparent);
  border-radius: 0;
  background: transparent;
}

@media (min-width: 761px) {
  body.console-shell-atlassian.app-sidebar-collapsed {
    --atlas-sidebar-width: 64px;
  }

  body.console-shell-atlassian.app-sidebar-collapsed .brand {
    display: none;
  }

  body.console-shell-atlassian.app-sidebar-collapsed .app-sidebar-toggle {
    margin-inline: auto;
  }

  body.console-shell-atlassian.app-sidebar-collapsed .app-bar {
    padding-inline: 8px;
  }

  body.console-shell-atlassian.app-sidebar-collapsed
    .app-bar-track::before,
  body.console-shell-atlassian.app-sidebar-collapsed .app-bar-label {
    display: none;
  }

  body.console-shell-atlassian.app-sidebar-collapsed .app-bar-item {
    justify-content: center;
    padding-inline: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.console-shell-atlassian .app-bar,
  body.console-shell-atlassian main[data-app-view] {
    transition: none;
  }
}

@media (max-width: 760px) {
  body.console-shell-atlassian.page-work main[data-app-view] {
    padding-inline: 0.75rem;
  }

  body.console-shell-atlassian.page-work #work-browse,
  body.console-shell-atlassian.page-work .page-heading {
    width: 100%;
  }

  body.console-shell-atlassian.page-work .work-counts {
    margin-inline: -0.25rem;
  }

  body.console-shell-atlassian.page-work .work-table tbody tr {
    grid-template-columns: 0 minmax(0, 1fr) auto;
    min-height: 3.8rem;
    padding: 0.42rem 0.1rem;
  }

  body.console-shell-atlassian.page-work .work-row-selector {
    display: none;
  }

  body.console-shell-atlassian.page-work
    .work-table
    td[data-label="کار"] {
    grid-column: 2;
  }

  body.console-shell-atlassian.page-work
    .work-table
    td[data-label="پروژه"] {
    grid-column: 2;
    padding-inline-start: 2.15rem;
  }

  body.console-shell-atlassian.page-work
    .work-table
    td[data-label="وضعیت"] {
    display: none;
  }

  body.console-shell-atlassian.page-work
    .work-table
    td[data-label="زمان"] {
    grid-column: 3;
  }

  .quick-task-dialog {
    width: 100%;
    max-height: 94dvh;
    border-radius: 1rem 1rem 0 0;
  }

  .quick-task-body .task-composer-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .quick-task-body .task-composer-meta > :nth-child(2) {
    grid-column: 1 / -1;
  }

  .task-quick-syntax > span:last-child {
    display: none;
  }

  body.console-shell-atlassian.page-work:has(.mirza-task-detail)
    main[data-app-view] {
    padding: 0;
    background: var(--surface);
  }

  body.console-shell-atlassian.page-work:has(.mirza-task-detail)
    #work-browse {
    width: 100%;
  }

  .mirza-task-detail {
    min-height: calc(100dvh - var(--atlas-topbar-height));
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  .task-view-toolbar {
    position: sticky;
    top: var(--atlas-topbar-height);
    z-index: 25;
    min-height: 3rem;
    padding: 0.4rem 0.55rem;
  }

  .task-origin-backlink span:last-child {
    display: none;
  }

  .task-view-layout {
    display: block;
    min-height: 0;
  }

  .task-view-main {
    padding: 1.25rem 1rem 0.75rem;
  }

  .task-view-sidebar {
    padding: 0 1rem 5rem;
    border-inline-start: 0;
    background: var(--surface);
  }

  .task-sidebar-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.35rem;
  }

  .task-sidebar-field {
    min-height: 3rem;
    padding: 0.55rem 0.65rem;
    border: 1px solid var(--line);
    border-radius: 0.55rem;
    background: var(--surface-soft);
  }

  .task-sidebar-field.task-disclosure {
    grid-column: 1 / -1;
  }

  .task-core-save {
    opacity: 1;
  }

  .keyboard-shortcuts-dialog {
    width: calc(100% - 1rem);
    max-height: 86dvh;
  }
}

/* Mirza Work v4.1 — keep generic Console controls from winning over task UI. */
body.console-shell-atlassian.page-work:not(:has(.mirza-task-detail))
  main[data-app-view]
  > .page-heading {
  display: none;
}

body.console-shell-atlassian.page-work:not(:has(.mirza-task-detail))
  main[data-app-view] {
  background: var(--surface);
}

body.console-shell-atlassian.page-work .work-counts {
  display: none;
}

body.console-shell-atlassian.page-work .work-task-composer {
  overflow: visible;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.console-shell-atlassian.page-work .work-task-composer > summary {
  min-height: 2.4rem;
  justify-content: flex-start;
  gap: 0.45rem;
  padding: 0.25rem 0.35rem;
  border: 0;
  color: var(--work-accent-strong);
  background: transparent;
}

body.console-shell-atlassian.page-work
  .work-task-composer
  > summary::before {
  content: "+";
  display: grid;
  width: 1.3rem;
  height: 1.3rem;
  place-items: center;
  border-radius: 50%;
  font-size: 1.05rem;
  line-height: 1;
}

body.console-shell-atlassian.page-work
  .work-task-composer
  > summary:is(:hover, :focus-visible)::before {
  color: #fff;
  background: var(--work-accent);
}

body.console-shell-atlassian.page-work
  .work-task-composer
  > summary
  small {
  display: none;
}

body.console-shell-atlassian.page-work .work-filter-disclosure,
body.console-shell-atlassian.page-work .work-setup-disclosure {
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.console-shell-atlassian.page-work .work-table tbody tr {
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.console-shell-atlassian.page-work
  :is(.task-complete-control, .task-detail-complete) {
  width: 1.35rem;
  height: 1.35rem;
  min-width: 1.35rem;
  min-height: 1.35rem;
  padding: 0;
  border: 1.5px solid var(--work-accent);
  border-radius: 50%;
  color: transparent;
  background: transparent;
  box-shadow: none;
  line-height: 1;
}

body.console-shell-atlassian.page-work
  :is(.task-complete-control, .task-detail-complete):is(
    :hover,
    :focus-visible
  ) {
  color: var(--work-accent-strong);
  border-color: var(--work-accent);
  background: var(--work-accent-soft);
}

body.console-shell-atlassian.page-work
  .task-detail-complete.is-static[data-task-status="DONE"] {
  color: #fff;
  border-color: #5b9b62;
  background: #5b9b62;
}

body.console-shell-atlassian.page-work
  :is(.task-title-editor input, .task-description-editor textarea) {
  min-height: 0;
  padding: 0.2rem 0.25rem;
  border: 1px solid transparent;
  border-radius: 0.35rem;
  color: var(--ink);
  background: transparent;
  box-shadow: none;
}

body.console-shell-atlassian.page-work .task-title-editor input {
  font-size: clamp(1.05rem, 2.2vw, 1.35rem);
  font-weight: 750;
  line-height: 1.45;
}

body.console-shell-atlassian.page-work .task-description-editor textarea {
  resize: vertical;
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.75;
}

body.console-shell-atlassian.page-work
  :is(.task-title-editor input, .task-description-editor textarea):hover {
  border-color: var(--line);
}

body.console-shell-atlassian.page-work
  :is(.task-title-editor input, .task-description-editor textarea):focus {
  border-color: color-mix(in srgb, var(--work-accent) 45%, var(--line));
  outline: 2px solid color-mix(in srgb, var(--work-accent) 18%, transparent);
}

@media (max-width: 760px) {
  body.console-shell-atlassian.page-work .mirza-focus-header {
    padding-top: 0.35rem;
  }

  body.console-shell-atlassian.page-work .work-task-composer {
    margin-block: 0.15rem 0.45rem;
  }

  body.console-shell-atlassian.page-work .work-filter-disclosure {
    margin-block: 0.15rem 0.25rem;
  }

  body.console-shell-atlassian.page-work .work-table tbody tr {
    padding-block: 0.5rem;
    border-bottom: 1px solid
      color-mix(in srgb, var(--line) 72%, transparent);
  }

  body.console-shell-atlassian.page-work .task-view-main {
    padding: 1.15rem 1rem 0.5rem;
  }

  body.console-shell-atlassian.page-work .task-core-heading {
    grid-template-columns: 1.45rem minmax(0, 1fr);
    gap: 0.55rem;
  }

  body.console-shell-atlassian.page-work .task-core-save {
    height: 0;
    min-height: 0;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
  }

  body.console-shell-atlassian.page-work
    .task-core-editor:focus-within
    .task-core-save {
    height: auto;
    min-height: 2rem;
    max-height: 3rem;
    opacity: 1;
    pointer-events: auto;
  }

  body.console-shell-atlassian.page-work .task-view-sidebar {
    padding: 0 1rem 5rem;
  }

  body.console-shell-atlassian.page-work .task-sidebar-fields {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

  body.console-shell-atlassian.page-work .task-sidebar-field {
    min-height: 3rem;
    padding: 0.55rem 0.15rem;
    border: 0;
    border-bottom: 1px solid
      color-mix(in srgb, var(--line) 72%, transparent);
    border-radius: 0;
    background: transparent;
  }

  body.console-shell-atlassian.page-work
    .task-sidebar-field.task-disclosure {
    grid-column: auto;
  }
}

/* Final board guards override retired Work-table compatibility layers above. */
body.console-shell-atlassian.page-work .work-list-panel,
body.console-shell-atlassian.page-work .work-board,
body.console-shell-atlassian.page-work .work-board-shell {
  min-width: 0;
  max-width: 100%;
  overflow: visible;
}

/* Mirza project sections: calm, touch-first task groups inspired by modern
   productivity apps while keeping P30Console colors, type and controls. */
body.console-shell-atlassian.page-work .project-task-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
  margin-block-start: 0.75rem;
  padding-block-end: 0.55rem;
  border-bottom: 1px solid var(--line);
}

body.console-shell-atlassian.page-work .project-task-heading h2,
body.console-shell-atlassian.page-work .project-task-heading p {
  margin: 0;
}

body.console-shell-atlassian.page-work .project-task-heading p {
  margin-block-start: 0.18rem;
  color: var(--muted);
  font-size: 0.7rem;
}

body.console-shell-atlassian.page-work .project-section-create {
  flex: 0 0 auto;
}

body.console-shell-atlassian.page-work .project-section-create > summary {
  min-height: 2.3rem;
  padding: 0.38rem 0.65rem;
  border-radius: 0.55rem;
  color: var(--work-accent-strong);
  font-size: 0.72rem;
  font-weight: 750;
  cursor: pointer;
  list-style: none;
}

body.console-shell-atlassian.page-work
  .project-section-create
  > summary::-webkit-details-marker {
  display: none;
}

body.console-shell-atlassian.page-work .project-section-create[open] {
  flex: 1 0 100%;
}

body.console-shell-atlassian.page-work .project-section-create > form {
  grid-template-columns: minmax(12rem, 1fr) auto;
  margin-block-start: 0.4rem;
  padding: 0.65rem;
  box-shadow: none;
}

body.console-shell-atlassian.page-work
  .work-board[data-board-kind="section"] {
  grid-template-columns: minmax(0, 1fr);
  gap: 0.9rem;
}

body.console-shell-atlassian.page-work .work-project-section-lane {
  gap: 0.4rem;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.console-shell-atlassian.page-work .work-project-section-lane > header {
  min-height: 2.6rem;
  padding-inline: 0.2rem;
  border-bottom: 1px solid var(--line);
}

body.console-shell-atlassian.page-work
  .work-project-section-lane
  > header
  h3 {
  font-size: 0.88rem;
  font-weight: 800;
}

body.console-shell-atlassian.page-work
  .work-project-section-lane
  .work-board-dropzone {
  gap: 0.42rem;
  min-height: 2.8rem;
}

body.console-shell-atlassian.page-work
  .work-board[data-board-kind="section"]
  .work-task-card {
  padding: 0.68rem 0.72rem;
  border-radius: 0.72rem;
  box-shadow: 0 2px 8px color-mix(in srgb, var(--ink) 6%, transparent);
  cursor: pointer;
}

body.console-shell-atlassian.page-work .work-section-inline-add {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin: 0;
  padding: 0.15rem 0.2rem 0.35rem;
}

body.console-shell-atlassian.page-work .work-section-inline-add input[name="title"] {
  min-height: 2.35rem;
  border-color: transparent;
  background: transparent;
  font-size: 0.76rem;
}

body.console-shell-atlassian.page-work
  .work-section-inline-add
  input[name="title"]:is(:hover, :focus) {
  border-color: var(--line);
  background: var(--surface-raised);
}

body.console-shell-atlassian.page-work .work-section-inline-add button {
  min-height: 2.35rem;
  padding-inline: 0.65rem;
}

body.console-shell-atlassian.page-work .task-composer-meta {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

@media (max-width: 720px) {
  body.console-shell-atlassian.page-work .project-task-heading {
    align-items: start;
    flex-direction: column;
    gap: 0.45rem;
  }

  body.console-shell-atlassian.page-work .project-section-create,
  body.console-shell-atlassian.page-work .project-section-create > summary {
    width: 100%;
  }

  body.console-shell-atlassian.page-work .project-section-create > summary {
    display: flex;
    min-height: 44px;
    align-items: center;
  }

  body.console-shell-atlassian.page-work .project-section-create > form {
    grid-template-columns: minmax(0, 1fr);
  }

  body.console-shell-atlassian.page-work .task-composer-meta {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  body.console-shell-atlassian.page-work
    .work-board[data-board-kind="section"]
    .work-task-card {
    min-height: 4.25rem;
    border-color: color-mix(in srgb, var(--line) 76%, transparent);
  }

  body.console-shell-atlassian.page-work .work-section-inline-add input[name="title"],
  body.console-shell-atlassian.page-work .work-section-inline-add button {
    min-height: 44px;
  }
}

@media (max-width: 720px) {
  body.console-shell-atlassian.page-work .work-board {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Mirza Work product management — compact on desktop, touch-safe on mobile. */
body.console-shell-atlassian.page-work .work-structure-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-block: 0.45rem 0;
  padding: 0.25rem 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.console-shell-atlassian.page-work .work-structure-links .button {
  min-height: 2rem;
  padding: 0.25rem 0.55rem;
  border-color: transparent;
  background: transparent;
  font-size: 0.7rem;
}

body.console-shell-atlassian.page-work .work-structure-links .button:is(
    :hover,
    :focus-visible
  ) {
  border-color: var(--line);
  background: var(--surface-soft);
}

body.console-shell-atlassian.page-work .work-structure-create > summary {
  display: flex;
  min-height: 2rem;
  align-items: center;
  padding: 0.25rem 0.55rem;
  border-radius: 0.38rem;
  color: var(--work-accent-strong);
  font-size: 0.7rem;
  font-weight: 700;
  cursor: pointer;
  list-style: none;
}

body.console-shell-atlassian.page-work
  .work-structure-create
  > summary::-webkit-details-marker {
  display: none;
}

body.console-shell-atlassian.page-work .work-structure-create[open] {
  flex: 1 0 100%;
}

body.console-shell-atlassian.page-work .work-structure-create[open] > summary {
  width: max-content;
  background: var(--work-accent-soft);
}

body.console-shell-atlassian.page-work .work-structure-create > form {
  display: grid;
  grid-template-columns: minmax(10rem, 1fr) minmax(12rem, 1.4fr) auto;
  align-items: end;
  gap: 0.45rem;
  margin-top: 0.35rem;
  padding: 0.55rem;
  border: 1px solid var(--line);
  border-radius: 0.5rem;
  background: var(--surface);
}

body.console-shell-atlassian.page-work .work-structure-create label {
  display: grid;
  gap: 0.2rem;
  color: var(--muted);
  font-size: 0.66rem;
}

body.console-shell-atlassian.page-work .work-management-page {
  display: grid;
  width: min(100%, 56rem);
  gap: 0.8rem;
  margin-inline: auto;
}

body.console-shell-atlassian.page-work .work-management-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
  padding-block: 0.3rem 0.65rem;
  border-bottom: 1px solid var(--line);
}

body.console-shell-atlassian.page-work .work-management-heading h1 {
  margin: 0.3rem 0 0;
  font-size: clamp(1.2rem, 2.4vw, 1.55rem);
}

body.console-shell-atlassian.page-work .work-management-heading p {
  margin: 0.2rem 0 0;
  color: var(--muted);
  font-size: 0.72rem;
}

body.console-shell-atlassian.page-work .work-management-heading > div > a {
  color: var(--muted);
  font-size: 0.68rem;
  text-decoration: none;
}

body.console-shell-atlassian.page-work .work-management-heading > div > a:is(
    :hover,
    :focus-visible
  ) {
  color: var(--work-accent-strong);
}

body.console-shell-atlassian.page-work .work-management-create {
  display: grid;
  grid-template-columns: minmax(10rem, 1fr) minmax(12rem, 1.5fr) auto;
  align-items: end;
  gap: 0.55rem;
  padding: 0.7rem;
  border-color: color-mix(in srgb, var(--work-accent) 24%, var(--line));
  background: color-mix(in srgb, var(--work-accent-soft) 35%, var(--surface));
  box-shadow: none;
}

body.console-shell-atlassian.page-work
  .work-management-page[data-work-management="labels"]
  .work-management-create {
  grid-template-columns: minmax(12rem, 1fr) minmax(7rem, auto);
}

body.console-shell-atlassian.page-work .work-management-create > header {
  grid-column: 1 / -1;
}

body.console-shell-atlassian.page-work .work-management-create h2,
body.console-shell-atlassian.page-work .work-management-create p {
  margin: 0;
}

body.console-shell-atlassian.page-work .work-management-create h2 {
  font-size: 0.9rem;
}

body.console-shell-atlassian.page-work .work-management-create p {
  margin-top: 0.12rem;
  color: var(--muted);
  font-size: 0.66rem;
}

body.console-shell-atlassian.page-work .work-management-create label,
body.console-shell-atlassian.page-work .work-management-editor label {
  display: grid;
  gap: 0.2rem;
  color: var(--muted);
  font-size: 0.66rem;
  font-weight: 650;
}

body.console-shell-atlassian.page-work .work-management-list {
  display: grid;
  gap: 0;
}

body.console-shell-atlassian.page-work .work-management-row {
  padding: 0.7rem 0.25rem;
  border-bottom: 1px solid color-mix(in srgb, var(--line) 74%, transparent);
}

body.console-shell-atlassian.page-work .work-management-row:last-child {
  border-bottom: 0;
}

body.console-shell-atlassian.page-work
  .work-management-row[data-state="archived"] {
  opacity: 0.72;
}

body.console-shell-atlassian.page-work .work-management-row-header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 0.75rem;
}

body.console-shell-atlassian.page-work .work-management-row-header h2,
body.console-shell-atlassian.page-work .work-management-row-header p {
  margin: 0;
}

body.console-shell-atlassian.page-work .work-management-row-header h2 {
  font-size: 0.82rem;
}

body.console-shell-atlassian.page-work .work-management-row-header h2 > span {
  margin-inline-end: 0.12rem;
  color: var(--work-accent-strong);
}

body.console-shell-atlassian.page-work .work-management-row-header p {
  margin-top: 0.15rem;
  color: var(--muted);
  font-size: 0.67rem;
}

body.console-shell-atlassian.page-work .work-state-badge {
  flex: 0 0 auto;
  min-height: 1.45rem;
  padding: 0.12rem 0.42rem;
  border-radius: 999px;
  color: var(--muted);
  background: var(--surface-soft);
  font-size: 0.61rem;
  font-weight: 700;
}

body.console-shell-atlassian.page-work .work-management-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: start;
  gap: 0.35rem;
  margin-top: 0.45rem;
}

body.console-shell-atlassian.page-work
  :is(.work-management-editor, .work-merge-menu) {
  position: relative;
}

body.console-shell-atlassian.page-work
  :is(.work-management-editor, .work-merge-menu)
  > summary {
  display: flex;
  min-height: 2rem;
  align-items: center;
  padding: 0.25rem 0.55rem;
  border: 1px solid var(--line);
  border-radius: 0.38rem;
  color: var(--ink);
  background: var(--surface);
  font-size: 0.68rem;
  font-weight: 650;
  cursor: pointer;
  list-style: none;
}

body.console-shell-atlassian.page-work
  :is(.work-management-editor, .work-merge-menu)
  > summary::-webkit-details-marker {
  display: none;
}

body.console-shell-atlassian.page-work
  :is(.work-management-editor, .work-merge-menu)[open]
  > summary {
  border-color: color-mix(in srgb, var(--work-accent) 45%, var(--line));
  background: var(--work-accent-soft);
}

body.console-shell-atlassian.page-work .work-management-editor > form,
body.console-shell-atlassian.page-work .work-merge-options {
  display: grid;
  gap: 0.45rem;
  margin-top: 0.4rem;
  padding: 0.6rem;
  border: 1px solid var(--line);
  border-radius: 0.5rem;
  background: var(--surface);
}

body.console-shell-atlassian.page-work .work-management-editor > form {
  grid-template-columns: minmax(9rem, 1fr) minmax(12rem, 1.4fr) auto;
  align-items: end;
}

body.console-shell-atlassian.page-work .work-merge-options {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.console-shell-atlassian.page-work .work-merge-options form,
body.console-shell-atlassian.page-work .work-management-actions {
  margin: 0;
}

body.console-shell-atlassian.page-work .work-merge-options button {
  width: 100%;
  justify-content: flex-start;
}

@media (min-width: 761px) {
  body.console-shell-atlassian.page-work
    .work-management-page
    :is(button, .button, input, select) {
    min-height: 2.1rem;
  }

  body.console-shell-atlassian.page-work
    .work-management-page
    :is(button, .button) {
    padding: 0.3rem 0.62rem;
    font-size: 0.68rem;
    line-height: 1.2;
  }
}

@media (max-width: 760px) {
  body.console-shell-atlassian.page-work .work-structure-create > summary {
    min-height: 2.75rem;
  }

  body.console-shell-atlassian.page-work .work-structure-create > form {
    grid-template-columns: minmax(0, 1fr);
  }

  body.console-shell-atlassian.page-work .work-structure-create > form button {
    width: 100%;
    min-height: 2.75rem;
  }

  body.console-shell-atlassian.page-work .work-management-page {
    width: 100%;
    gap: 0.7rem;
  }

  body.console-shell-atlassian.page-work .work-management-heading {
    align-items: start;
  }

  body.console-shell-atlassian.page-work .work-management-heading p {
    max-width: 27rem;
  }

  body.console-shell-atlassian.page-work .work-management-create,
  body.console-shell-atlassian.page-work
    .work-management-page[data-work-management="labels"]
    .work-management-create,
  body.console-shell-atlassian.page-work .work-management-editor > form {
    grid-template-columns: minmax(0, 1fr);
  }

  body.console-shell-atlassian.page-work .work-management-create > button,
  body.console-shell-atlassian.page-work
    .work-management-actions
    > button {
    width: 100%;
  }

  body.console-shell-atlassian.page-work .work-management-controls {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.console-shell-atlassian.page-work
    :is(.work-management-editor, .work-merge-menu)
    > summary,
  body.console-shell-atlassian.page-work
    .work-management-page
    :is(button, .button) {
    min-height: 2.75rem;
  }

  body.console-shell-atlassian.page-work .work-management-editor,
  body.console-shell-atlassian.page-work .work-merge-menu {
    min-width: 0;
  }

  body.console-shell-atlassian.page-work .work-management-editor[open],
  body.console-shell-atlassian.page-work .work-merge-menu[open] {
    grid-column: 1 / -1;
  }

  body.console-shell-atlassian.page-work .work-merge-options {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Mirza source context stays inside the shared desktop/mobile Quick Add. */
.quick-task-source-status {
  margin: 0;
  padding: 0.65rem 0.8rem;
  border: 1px solid color-mix(in srgb, var(--accent) 32%, var(--line));
  border-radius: 0.65rem;
  background: color-mix(in srgb, var(--accent) 8%, var(--surface));
  color: var(--muted);
  font-size: 0.86rem;
}

.quick-task-link-existing {
  padding: 0.75rem;
  border: 1px solid var(--line);
  border-radius: 0.75rem;
  background: var(--surface-raised);
}

.quick-task-link-existing > summary {
  cursor: pointer;
  font-weight: 700;
}

.quick-task-link-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.65rem;
  align-items: end;
  margin-top: 0.75rem;
}

.quick-task-link-form label {
  display: grid;
  gap: 0.35rem;
}

.quick-task-link-form select {
  min-width: 0;
  width: 100%;
}

.quick-task-without-source {
  margin: 0.45rem 0 0.2rem;
}

.content-studio-media-upload {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  margin: 1rem 0;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: 0.75rem;
  background: var(--surface-raised);
}

.content-studio-media-upload label {
  display: grid;
  gap: 0.35rem;
}

.content-studio-media-upload :is(button, .help) {
  grid-column: 1 / -1;
}

.content-studio-process-original {
  margin-top: 0.45rem;
}

.product-journey {
  margin-top: 1rem;
}

.product-journey-list {
  display: grid;
  gap: 0.65rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.product-journey-step {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(12rem, 16rem);
  gap: 0.8rem;
  align-items: center;
  padding: 0.85rem;
  border: 1px solid var(--line);
  border-inline-start: 4px solid var(--muted);
  border-radius: 0.75rem;
  background: var(--surface-raised);
}

.product-journey-ready {
  border-inline-start-color: var(--success);
}

.product-journey-pending {
  border-inline-start-color: var(--accent);
}

.product-journey-blocked {
  border-inline-start-color: var(--danger);
}

.product-journey-step p,
.product-journey-next small {
  display: block;
  margin: 0.35rem 0 0;
  color: var(--muted);
}

.product-journey-state {
  display: inline-flex;
  margin-inline-start: 0.45rem;
  padding: 0.12rem 0.4rem;
  border-radius: 999px;
  background: var(--surface);
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 700;
  direction: ltr;
}

.product-journey-next {
  display: grid;
  gap: 0.4rem;
  justify-items: stretch;
}

.product-journey-action {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  text-align: center;
}

@media (max-width: 520px) {
  .product-journey-step {
    grid-template-columns: minmax(0, 1fr);
  }

  .product-journey-action {
    width: 100%;
  }
}

@media (max-width: 520px) {
  .content-studio-media-upload {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 520px) {
  .quick-task-link-form {
    grid-template-columns: minmax(0, 1fr);
  }

  .quick-task-link-form button {
    width: 100%;
  }
}

/* Keep Content Studio touch targets usable after the shared Atlassian shell
   applies its compact control height.  This override is intentionally scoped
   so Accounting, Serials and Inventory keep their own density contracts. */
body.console-shell-atlassian.page-content_studio
  .content-studio-shell
  :is(button, select, textarea, input:not([type="hidden"]):not([type="checkbox"])) {
  min-block-size: 44px;
}

body.console-shell-atlassian.page-content_studio
  .content-studio-shell details > summary {
  display: flex;
  min-block-size: 44px;
  align-items: center;
  cursor: pointer;
}

body.console-shell-atlassian.page-content_studio
  :is(.content-studio-editor label, .content-studio-actions label) {
  min-block-size: 44px;
}

body.console-shell-atlassian.page-content_studio .content-studio-queue a {
  min-block-size: 44px;
}
