:root {
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
  --app-top-clearance: 10px;
  --app-safe-top: calc(var(--safe-top) + var(--app-top-clearance));
  --plano-viewport-height: 100dvh;
  --plano-viewport-gap: 0px;
  --plano-theme: #20B2AA;
  --plano-theme-rgb: 32, 178, 170;
  --plano10-blue: var(--plano-theme);
  --plano10-ink: #111114;
  --picture-split-top: var(--app-safe-top);
  --picture-split-height: min(34dvh, 300px);
  --picture-divider-size: 0px;
  --picture-split-bottom: calc(var(--picture-split-top) + var(--picture-split-height) + var(--picture-divider-size));
}

html.plano-lab-phone {
  --safe-top: 30px;
  --safe-bottom: 18px;
}

*, *::before, *::after {
  box-sizing: border-box;
}
html, body {
  width: 100%;
  height: var(--plano-viewport-height);
  min-height: var(--plano-viewport-height);
  margin: 0;
  overflow: hidden;
  background: transparent;
}
body.plano10-app {
  color: var(--plano10-ink);
  background: transparent;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", sans-serif;
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
  touch-action: none;
}

body.plano10-app button, body.plano10-app input, body.plano10-app select {
  font: inherit;
}
#viewer, #viewer *, #labels-workspace, #labels-workspace * {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
}
body.plano10-app button:focus-visible, body.plano10-app select:focus-visible {
  outline: 3px solid rgba(var(--plano-theme-rgb), .42);
  outline-offset: 2px;
}
.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Canonical application shell. */
#app {
  position: fixed;
  inset: 0 0 auto;
  min-width: 0;
  width: auto;
  height: var(--plano-viewport-height);
  background: transparent;
}


.planogram-dropdown {
  position: fixed;
  z-index: 310;
  max-height: min(52vh, 320px);
  overflow-y: auto;
  padding: 5px;
  border: 1px solid rgba(255,255,255,.78);
  border-radius: 20px;
  background: rgba(247,248,250,.90);
  box-shadow: 0 18px 46px rgba(20,25,34,.22), inset 0 1px 0 rgba(255,255,255,.90);
  color: var(--plano10-ink);

}
.planogram-dropdown[hidden] { display: none !important; }
.planogram-dropdown-option {
  display: block;
  width: 100%;
  min-height: 42px;
  padding: 7px 10px;
  border: 0;
  border-radius: 14px;
  background: transparent;
  color: var(--plano10-ink);
  text-align: left;
  font-size: 13px;
  font-weight: 620;
}
.planogram-dropdown-option.active { background: rgba(32,178,170,.15); color:#106e69; }
.planogram-dropdown-option.combined-option {
  display:grid;
  gap:2px;
}
.planogram-dropdown-option.combined-option strong {
  overflow:hidden;
  font-size:13px;
  font-weight:720;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.planogram-dropdown-option.combined-option small {
  color:rgba(60,60,67,.62);
  font-size:9px;
  font-weight:560;
}
#page-label {
  display: none;
  min-width: 0;
  flex: 1 1 auto;
  padding-left: 2px;
  color: #fff;
  font-size: 14px;
  font-weight: 720;
}
#page-label > span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#page-label > span + span {
  margin-top: 3px;
  color: rgba(255,255,255,.78);
  font-size: 10px;
  font-weight: 600;
}


/* Document engine canvas and continuous pages. */
#viewer {
  position: fixed;
  inset: 0 0 auto;
  height: var(--plano-viewport-height);
  min-width: 0;
  overflow: auto;
  padding: 0;
  background: transparent;
  scroll-padding-top: var(--app-safe-top);
  scroll-padding-bottom: calc(var(--safe-bottom) + var(--controller-height, 42px) + 20px);
  touch-action: pan-x pan-y;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: none;
}
#pdf-canvas, #overlay {
  display: none;
}
#pdf-stack {
  width: max-content;
  min-width: 100%;
  padding: 0;
  transform-origin: 0 0;
}
#pdf-stack.is-pinching {
  will-change: transform;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.stack-page {
  position: relative;
  margin: 0 0 12px;
  background: #fff;
  box-shadow: 0 2px 12px rgba(0,0,0,.24);
}
.stack-page:last-child {
  margin-bottom: 0;
}
.stack-page-canvas {
  display: block;
  width: 100%;
  height: 100%;
  background: #fff;
}
.stack-overlay {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.stack-page-number {
  position: absolute;
  right: 8px;
  bottom: 6px;
  padding: 2px 6px;
  border-radius: 8px;
  background: rgba(30,30,33,.58);
  color: #fff;
  font-size: 9px;
}
#empty-state {
  position: absolute;
  inset: 0;
  display: flex;
  padding: 40px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  text-align: center;
}
#empty-state[style*="display: none"] {
  display: none !important;
}
#empty-state .icon {
  display: grid;
  width: 66px;
  height: 66px;
  place-items: center;
  border-radius: 20px;
  background: rgba(255,255,255,.64);
  color: #7b8490;
}
#empty-state .icon svg {
  width: 34px;
  height: 34px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
#empty-state h2 {
  margin: 2px 0 0;
  font-size: 20px;
}
#empty-state p {
  max-width: 280px;
  margin: 0;
  color: #687182;
  font-size: 14px;
  line-height: 1.42;
}
#empty-open {
  all: unset;
  padding: 11px 25px;
  margin-top: 5px;
  border-radius: 12px;
  background: #087be9;
  box-shadow: 0 7px 18px rgba(8,123,233,.25);
  color: #fff;
  font-size: 15px;
  font-weight: 650;
  cursor: pointer;
}
.duplicate-badge {
  position: absolute;
  z-index: 5;
  padding: 3px 7px;
  border-radius: 6px;
  background: #ffd60a;
  color: #151515;
  box-shadow: 0 2px 7px rgba(0,0,0,.22);
  font-size: 10px;
  font-weight: 800;
  pointer-events: none;
}
.plano10-search-row-highlight {
  position: absolute;
  z-index: 7;
  border: 0;
  border-radius: 0;
  background: rgba(32,178,170,.24);
  box-shadow: none;
  pointer-events: none;
}
:is(.seq-location-dot, .picture-location-pin) {
  position:absolute;
  z-index:10;
  width:0 !important;
  height:0 !important;
  border:0 !important;
  border-left:9px solid transparent !important;
  border-right:9px solid transparent !important;
  border-bottom:14px solid #20B2AA !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  filter:drop-shadow(0 2px 3px rgba(18,112,106,.34));
  transform:translate(-50%,0) !important;
  transform-origin:50% 50% !important;
  box-sizing:content-box !important;
  pointer-events:none;
}
:is(.seq-location-dot, .picture-location-pin)::after { content:none !important; }
:is(.seq-location-dot, .picture-location-pin).is-duplicate {
  border-bottom-color:#ffd60a !important;
  background:transparent !important;
  filter:drop-shadow(0 2px 3px rgba(120,86,0,.3));
}

.plano10-price-label-icon {
  position: relative;
  display: grid;
  width: 24px;
  height: 17px;
  place-items: center;
  overflow: hidden;
  border: 1.5px solid currentColor;
  border-radius: 4px;
  color: inherit;
}
.plano10-price-label-icon::before { content: none; }
.plano10-price-label-icon::after {
  content: "Label";
  font-size: 6.5px;
  font-weight: 800;
  letter-spacing: -.03em;
  line-height: 1;
}
.plano10-price-label-icon > i { display: none; }

/* Pages drawer and clean options popover. */
#thumb-backdrop.plano10-page-backdrop {
  position: fixed;
  z-index: 150;
  inset: 0;
  display: none;
  background: rgba(29,38,53,.05);
}
#thumb-backdrop.plano10-page-backdrop.show {
  display: block;
}
#thumb-panel.plano10-page-picker {
  position: fixed;
  z-index: 155;
  top: calc(var(--app-safe-top) + 55px);
  right: 0;
  bottom: 0;
  width: clamp(118px,31vw,220px);
  padding: 34px 8px calc(var(--safe-bottom) + 16px);
  overflow-x: hidden;
  overflow-y: auto;
  border-left: .5px solid rgba(60,60,67,.14);
  background: rgba(244,245,248,.94);
  box-shadow: -10px 0 30px rgba(29,38,53,.11);

  opacity: 0;
  pointer-events: none;
  transform: translateX(106%);
  transition: opacity 220ms ease, transform 280ms cubic-bezier(.2,.8,.2,1);
}
#thumb-panel.plano10-page-picker.open {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(0);
}
#thumb-panel::-webkit-scrollbar {
  display: none;
}
.plano10-page-title {
  position: absolute;
  top: 10px;
  left: 12px;
  color: #73737a;
  font-size: 9px;
  font-weight: 650;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.plano10-page-card {
  position: relative;
  width: 100%;
  margin: 0 0 10px;
  padding: 7px 7px 24px;
  overflow: visible;
  border: .5px solid rgba(60,60,67,.11);
  border-radius: 11px;
  background: rgba(255,255,255,.8);
  box-shadow: 0 4px 12px rgba(32,40,53,.07);
  cursor: pointer;
}
.plano10-page-card.current {
  border-color: #2f85e7;
  background: rgba(240,247,255,.94);
  box-shadow: 0 0 0 2px rgba(47,133,231,.16),0 4px 12px rgba(32,40,53,.07);
}
.plano10-page-card canvas {
  display: block;
  width: 100%;
  border-radius: 5px;
  background: #fff;
}
.plano10-page-number {
  position: absolute;
  right: 4px;
  bottom: 5px;
  left: 4px;
  color: #5f6066;
  font-size: 9px;
  font-weight: 550;
  text-align: center;
}
.plano10-page-more {
  all: unset;
  box-sizing: border-box;
  position: absolute;
  z-index: 2;
  top: 5px;
  right: 5px;
  display: grid;
  width: 27px;
  height: 23px;
  padding-bottom: 4px;
  place-items: center;
  border: .5px solid rgba(60,60,67,.1);
  border-radius: 12px;
  background: rgba(250,250,252,.9);
  box-shadow: 0 2px 6px rgba(0,0,0,.08);
  color: #36373b;
  font-size: 10px;
  cursor: pointer;
}
.plano10-page-check {
  position: absolute;
  bottom: 4px;
  left: 5px;
  display: none;
  width: 18px;
  height: 18px;
  place-items: center;
  border-radius: 50%;
  background: #2f85e7;
  box-shadow: 0 2px 5px rgba(47,133,231,.3);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
}
.plano10-page-card.current .plano10-page-check {
  display: grid;
}
#page-context-menu.plano10-page-menu {
  position: fixed;
  z-index: 170;
  right: calc(clamp(118px,31vw,220px) + 8px);
  top: calc(var(--app-safe-top) + 65px);
  display: flex;
  width: 188px;
  padding: 8px;
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 18px;
  flex-direction: column;
  background: rgba(247,247,249,.94);
  box-shadow: 0 18px 45px rgba(18,25,36,.28);

  animation: plano10-menu-in 180ms ease-out;
}
#page-context-menu[hidden] {
  display: none !important;
}
#page-context-menu button {
  all: unset;
  box-sizing: border-box;
  display: flex;
  min-height: 38px;
  padding: 0 9px;
  align-items: center;
  border-top: 1px solid rgba(60,60,67,.1);
  color: #15171b;
  font-size: 12px;
  cursor: pointer;
}
#page-context-menu button:first-child {
  border-top: 0;
}
#page-context-menu button.destructive {
  color: #ff453a;
}
#page-context-menu .menu-separator {
  height: 6px;
  border-top: 1px solid rgba(60,60,67,.1);
}
@keyframes plano10-menu-in { from { opacity: 0; transform: translateX(8px) scale(.97); } to { opacity: 1; transform: none; } }

/* Labels workspace: real PDF engine underneath, UI Lab presentation above. */
#labels-workspace.plano10-labels-workspace {
  position: fixed;
  z-index: 120;
  inset: 0 0 auto;
  height: var(--plano-viewport-height);
  display: none;
  overflow: hidden;
  background: transparent;
  pointer-events: none;
}
#labels-workspace.plano10-labels-workspace.active {
  display: block;
}
.plano10-label-panel {
  position: absolute;
  z-index: 8;
  inset: 0;
  pointer-events: none;
}
#labels-focus-card {
  position: absolute;
  z-index: 8;
  left: 50%;
  display: block;
  padding: 10px 12px 12px;
  border: 1px solid rgba(255,255,255,.84);
  border-radius: 18px;
  background: rgba(252,252,251,.92);
  box-shadow: 0 13px 30px rgba(22,29,40,.2);
  transform-origin: 50% 50%;

  pointer-events: auto;
  will-change: left,top,transform;
}
#labels-focus-barcode-wrap {
  position: relative;
  display: grid;
  width: 100%;
  height: 42px;
  overflow: hidden;
  place-items: center;
  border: 1px solid rgba(32,178,170,.42);
  border-radius: 11px;
  background: linear-gradient(180deg,rgba(225,249,247,.78),rgba(255,255,255,.94));
  box-shadow: inset 0 0 0 1px rgba(32,178,170,.08),0 2px 7px rgba(32,178,170,.10);
}
#labels-focus-canvas {
  display: block;
  width: 75%;
  height: 25.5px;
  max-height: 25.5px;
  overflow: visible;
}
#labels-focus-barcode-wrap.empty {
  background: rgba(230,232,235,.75);
}
#labels-shelf-end-line {
  width: 34%;
  height: 4px;
  margin: 5px auto 0;
  border-radius: 999px;
  background: #ff3b30;
}
#labels-shelf-end-line[hidden] { display: none !important; }
#labels-focus-meta {
  padding: 0 1px 7px;
  color: #111114;
}
.labels-data-field {
  min-width: 0;
}
.labels-data-field > .label {
  display: block;
  margin-bottom: 2px;
  color: rgba(18,120,114,.82);
  font-size: 9px;
  font-weight: 760;
  letter-spacing: .04em;
  line-height: 1.1;
  text-transform: uppercase;
}
.labels-data-field strong {
  display: block;
  color: #111114;
  font-size: 22px;
  font-variant-numeric: tabular-nums;
  font-weight: 820;
  line-height: 1.1;
}
.labels-description-field strong {
  display: -webkit-box;
  overflow: hidden;
  font-size: 12px;
  white-space: normal;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.labels-data-grid {
  display: grid;
  margin-top: 7px;
  grid-template-columns: minmax(0,.58fr) minmax(0,1.15fr) minmax(0,.62fr) minmax(0,.9fr) minmax(0,.45fr);
  column-gap: 7px;
  row-gap: 9px;
}
.labels-number-field strong {
  overflow: hidden;
  font-family: "SF Mono",ui-monospace,monospace;
  font-size: 20px;
  letter-spacing: 0;
  text-decoration: none;
}

.labels-facings-field strong {
  min-width: 30px;
  padding: 0 4px;
  border-radius: 5px;
  text-align: center;
}
.labels-facings-field.is-combined strong {
  background: #ffd60a;
}
#labels-focus-facings.is-combined {
  background: #ffd60a;
}
/* Labels calibration/options, flashes and feedback. */
#barcode-options-panel {
  position: fixed;
  z-index: 210;
  inset: 0;
  display: grid;
  padding: calc(var(--app-safe-top) + 18px) 14px calc(var(--safe-bottom) + 18px);
  place-items: center;
  background: rgba(8,11,16,.46);

  pointer-events: auto;
}
#barcode-options-panel[hidden] {
  display: none !important;
}
.barcode-options-card {
  width: min(520px,100%);
  max-height: 92dvh;
  padding: 15px;
  overflow-y: auto;
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 22px;
  background: rgba(248,248,250,.96);
  box-shadow: 0 24px 60px rgba(0,0,0,.3);
}
.barcode-options-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.barcode-options-header h2 {
  margin: 0;
  font-size: 18px;
}
.barcode-options-header button, .beep-calibration-actions button {
  border: 0;
  border-radius: 10px;
  background: rgba(118,118,128,.12);
  color: #333;
  padding: 9px 11px;
}
.beep-calibration-card {
  margin: 13px 0;
  padding: 12px;
  border-radius: 14px;
  background: #fff;
}
.beep-calibration-heading, .beep-live-meter {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.beep-calibration-heading div {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.beep-calibration-heading small, .calibration-steps small, #bc-calibration-help, .barcode-browse-note, .volume-key-note {
  color: #77777e;
  font-size: 10px;
  line-height: 1.4;
}
.calibration-steps {
  display: grid;
  margin: 12px 0;
  padding: 0;
  gap: 7px;
  list-style: none;
}
.calibration-steps li {
  display: flex;
  align-items: center;
  gap: 8px;
}
.calibration-steps li > span {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border-radius: 50%;
  background: #e9f3ff;
  color: #0874e8;
}
.calibration-steps li div {
  display: flex;
  flex-direction: column;
}
.beep-calibration-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.beep-sensitivity-row {
  display: grid;
  margin-top: 12px;
  gap: 5px;
  font-size: 11px;
}
.beep-sensitivity-row input {
  width: 100%;
}
.beep-live-meter {
  margin-top: 10px;
  font-size: 10px;
}
.beep-live-meter progress {
  flex: 1;
}
.barcode-option-row {
  display: flex;
  min-height: 48px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.barcode-option-row > span:first-child {
  display: flex;
  flex-direction: column;
  font-size: 12px;
}
#esl-skip-flash, #beep-success-flash {
  position: fixed;
  z-index: 230;
  top: 50%;
  left: 50%;
  display: none;
  color: #27ad5f;
  font-size: 74px;
  font-weight: 800;
  filter: drop-shadow(0 4px 8px rgba(9,70,34,.28));
  transform: translate(-50%,-50%);
}
#esl-skip-flash.show, #beep-success-flash.show {
  display: block;
  animation: plano10-flash 650ms ease both;
}
@keyframes plano10-flash { 0% { opacity: 0; transform: translate(-50%,-50%) scale(.65); } 28% { opacity: 1; transform: translate(-50%,-50%) scale(1.08); } 100% { opacity: 0; transform: translate(-50%,-50%) scale(.9); } }

/* Full-screen Settings copied from the approved UI Lab proportions. */
#info-panel.plano10-settings-screen {
  position: fixed;
  z-index: 300;
  inset: 0;
  display: none;
  background: #f2f2f7;
}
#info-panel.plano10-settings-screen.show {
  display: block;
}
.plano10-settings-sheet {
  position: relative;
  width: 100%;
  height: 100%;
  background: #f2f2f7;
}
.settings-nav {
  position: absolute;
  z-index: 3;
  top: 0;
  left: 0;
  display: grid;
  width: 100%;
  height: calc(var(--app-safe-top) + 52px);
  padding: calc(var(--app-safe-top) + 7px) 12px 7px;
  grid-template-columns: 40px 1fr 40px;
  align-items: center;
  border-bottom: 1px solid rgba(60,60,67,.17);
  background: rgba(246,246,249,.88);

}
.settings-nav button {
  all: unset;
  box-sizing: border-box;
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 11px;
  color: #0874e8;
  cursor: pointer;
}
.settings-nav button svg, .settings-action-row > svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.settings-nav strong {
  text-align: center;
  font-size: 14px;
  letter-spacing: -.01em;
}
.settings-scroll {
  position: absolute;
  inset: calc(var(--app-safe-top) + 52px) 0 0;
  padding: 12px 15px calc(var(--safe-bottom) + 40px);
  overflow-y: auto;
  overscroll-behavior-y:none;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.settings-scroll::-webkit-scrollbar {
  display: none;
}
.settings-scroll h2 {
  margin: 2px 3px 12px;
  color: #050505;
  font-size: 31px;
  font-weight: 740;
  letter-spacing: -.045em;
}
.settings-section {
  margin-bottom: 22px;
}
.settings-section-title {
  display: block;
  margin: 0 16px 6px;
  color: #73737b;
  font-size: 10px;
  font-weight: 500;
}
.settings-group {
  overflow: hidden;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 0 0 .5px rgba(60,60,67,.08);
}
.settings-conditional-group { background:#f7f7fa; }
.settings-conditional-group[hidden] { display:none !important; }
.settings-select-row select {
  width:min(48%,190px);
  min-width:132px;
  height:34px;
  padding:0 25px 0 9px;
  border:1px solid rgba(60,60,67,.15);
  border-radius:9px;
  background:#fff;
  color:#303034;
  font-size:11px;
}
.settings-row, .settings-action-row, .settings-slider-row, .settings-expanded-row {
  position: relative;
  min-height: 50px;
}
.settings-row, .settings-action-row {
  display: grid;
  padding: 0 11px;
  grid-template-columns: 30px minmax(0,1fr) auto auto;
  align-items: center;
  gap: 9px;
}
.settings-row::after, .settings-action-row::after, .settings-slider-row::after, .settings-expanded-row::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 50px;
  height: .5px;
  background: rgba(60,60,67,.2);
  content: "";
}
.settings-group > :last-child::after {
  display: none;
}
.settings-icon {
  display: grid;
  width: 27px;
  height: 27px;
  place-items: center;
  border-radius: 7px;
  color: #fff;
}
.settings-icon svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.settings-icon.blue{
  background: #2f7be9;
}.settings-icon.coral{
  background: #ff6b57;
}.settings-icon.amber{
  background: #f3a51b;
}.settings-icon.slate{
  background: #747c88;
}.settings-icon.purple{
  background: #816ee2;
}.settings-icon.red{
  background: #f04e55;
}.settings-icon.green{
  background: #39a95b;
}.settings-icon.violet{
  background: #7462d3;
}.settings-icon.cyan{
  background: #3aa6bb;
}.settings-icon.indigo{
  background: #5966d9;
}
.settings-row-label, .settings-action-row > span:nth-child(2) {
  overflow: hidden;
  color: #1c1c1e;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.settings-row small, .settings-action-row small {
  color: #85858b;
  font-size: 11px;
  white-space: nowrap;
}
.settings-action-row {
  width: 100%;
  border: 0;
  background: transparent;
  text-align: left;
  cursor: pointer;
}
.settings-action-row:disabled {
  opacity: .4;
}
.settings-action-row > svg {
  width: 16px;
  height: 16px;
  color: #c4c4ca;
}
.settings-copy-row {
  position:relative;
  display:grid;
  min-height:64px;
  padding:7px 11px;
  grid-template-columns:30px minmax(0,1fr) 126px;
  align-items:center;
  gap:9px;
}
.settings-copy-row::after {
  position:absolute;
  right:0;
  bottom:0;
  left:50px;
  height:.5px;
  background:rgba(60,60,67,.2);
  content:"";
}
.settings-copy-label { display:grid; min-width:0; gap:2px; }
.settings-copy-label strong { color:#1c1c1e; font-size:13px; font-weight:500; }
.settings-copy-label small { color:#85858b; font-size:10px; white-space:nowrap; }
.settings-copy-row .copy-behavior-choices {
  display:grid;
  padding:2px;
  grid-template-columns:1fr 1fr;
  gap:2px;
  border-radius:9px;
  background:#ececf1;
}
.settings-copy-row .copy-behavior-choices button {
  min-height:29px;
  padding:0 6px;
  border:0;
  border-radius:7px;
  background:transparent;
  color:#65656b;
  font-size:10px;
  font-weight:650;
}
.settings-copy-row .copy-behavior-choices button[aria-pressed="true"],
.settings-copy-row .copy-behavior-choices button.is-selected {
  background:#fff;
  box-shadow:0 2px 5px rgba(40,40,45,.14),0 0 0 .5px rgba(60,60,67,.1);
  color:#111;
}

.settings-expanded-row {
  display: flex;
  padding: 10px 11px 11px 50px;
  flex-direction: column;
  gap: 9px;
  color: #5e5e64;
  font-size: 11px;
}
.sound-choices {
  display: grid;
  padding: 3px;
  grid-template-columns: repeat(3,1fr);
  gap: 3px;
  border-radius: 9px;
  background: #ececf1;
}
.sound-choices button {
  min-height: 29px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #65656b;
  font-size: 10px;
  font-weight: 650;
}
.sound-choices button.is-selected {
  background: #fff;
  box-shadow: 0 2px 5px rgba(40,40,45,.14),0 0 0 .5px rgba(60,60,67,.1);
  color: #111;
}
.settings-slider-row {
  display: grid;
  min-height: 58px;
  padding: 8px 11px 9px 50px;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 9px;
  color: #1c1c1e;
  font-size: 11px;
}
.settings-slider-row input {
  width: 100%;
  accent-color: #147ce5;
}
.settings-slider-row strong {
  min-width: 31px;
  color: #74747a;
  font-size: 10px;
  text-align: right;
}
.strictness-row {
  padding-left: 11px;
  grid-template-columns: 30px 1fr auto;
}
.strictness-row input {
  grid-column: 2/-1;
}
.settings-note, .settings-file-detail {
  padding: 9px 12px 11px 50px;
  color: #7a7a80;
  font-size: 9px;
  line-height: 1.4;
}
.settings-file-detail {
  display: none;
  margin: 8px 0 0;
  padding-left: 16px;
}.settings-file-detail.show {
  display: block;
}
.settings-section-footnote {
  margin: 7px 16px 0;
  color: #7a7a80;
  font-size: 9px;
  line-height: 1.45;
}
.help-scroll {
  padding-bottom: calc(34px + var(--safe-bottom));
}
.help-intro {
  margin: -2px 3px 16px;
  color: #6f6f76;
  font-size: 11px;
  line-height: 1.5;
}
.help-section {
  margin-bottom: 12px;
  overflow: hidden;
  border-radius: 13px;
  background: #fff;
  box-shadow: 0 0 0 .5px rgba(60,60,67,.08);
}
.help-section summary {
  position: relative;
  display: grid;
  min-height: 58px;
  padding: 10px 40px 10px 14px;
  align-content: center;
  gap: 2px;
  cursor: pointer;
  list-style: none;
}
.help-section summary::-webkit-details-marker { display: none; }
.help-section summary::after {
  position: absolute;
  top: 50%;
  right: 15px;
  width: 8px;
  height: 8px;
  border-right: 1.8px solid #9999a0;
  border-bottom: 1.8px solid #9999a0;
  content: "";
  transform: translateY(-65%) rotate(45deg);
  transition: transform 160ms ease;
}
.help-section[open] summary::after {
  transform: translateY(-35%) rotate(225deg);
}
.help-section summary span {
  color: #1c1c1e;
  font-size: 14px;
  font-weight: 650;
}
.help-section summary small {
  color: #85858b;
  font-size: 10px;
  font-weight: 450;
}
.help-section-body {
  border-top: .5px solid rgba(60,60,67,.18);
}
.help-item {
  position: relative;
  padding: 11px 14px 12px;
}
.help-item + .help-item::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 14px;
  height: .5px;
  background: rgba(60,60,67,.16);
  content: "";
}
.help-item strong {
  display: block;
  margin-bottom: 3px;
  color: #1c1c1e;
  font-size: 12px;
  font-weight: 650;
}
.help-item p {
  margin: 0;
  color: #66666d;
  font-size: 10px;
  line-height: 1.5;
}
.settings-update-detail {
  display: none;
  padding: 0 14px 12px 50px;
  color: #73737a;
  font-size: 10px;
}.settings-update-detail.show {
  display: block;
}
.update-description {
  margin: 0 0 6px;
  line-height: 1.45;
}.update-status {
  min-height: 14px;
}.update-progress {
  height: 4px;
  overflow: hidden;
  border-radius: 999px;
  background: #dedee3;
}.update-progress span {
  display: block;
  width: 45%;
  height: 100%;
  background: #087be9;
  animation: plano10-progress 1s ease-in-out infinite alternate;
}
@keyframes plano10-progress { to { transform: translateX(120%); } }
.ios-switch {
  position: relative;
  display: block;
  width: 43px;
  height: 26px;
}
.ios-switch input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}
.ios-switch > span {
  position: absolute;
  inset: 0;
  border-radius: 999px;
  background: #c8ccd2;
  box-shadow: inset 0 0 0 .5px rgba(60,60,67,.08);
  transition: background .18s ease;
}
.ios-switch > span::after {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 2px 5px rgba(25,31,41,.25);
  content: "";
  transition: transform .18s ease;
}
.ios-switch input:checked + span {
  background: #34c759;
}.ios-switch input:checked + span::after {
  transform: translateX(17px);
}

#help-panel {
  position: fixed;
  z-index: 310;
  inset: 0;
  display: none;
  background: #f2f2f7;
}
#help-panel.show {
  display: block;
  animation: version-history-in .28s cubic-bezier(.22,.8,.25,1);
}

/* Server-backed version history and guarded rollback. */
#version-history-panel {
  position: fixed;
  z-index: 310;
  inset: 0;
  display: none;
  background: #f2f2f7;
}
#version-history-panel.show {
  display: block;
  animation: version-history-in .28s cubic-bezier(.22,.8,.25,1);
}
@keyframes version-history-in { from { opacity: 0; transform: translateX(5%); } to { opacity: 1; transform: translateX(0); } }
.settings-nav button:disabled {
  opacity: .38;
  pointer-events: none;
}
.version-history-scroll {
  padding-bottom: calc(var(--safe-bottom) + 54px);
}
.version-history-intro {
  margin: -3px 4px 14px;
  color: #6d6d73;
  font-size: 11px;
  line-height: 1.45;
}
.version-current-card {
  display: flex;
  margin-bottom: 17px;
  padding: 14px 15px;
  align-items: center;
  justify-content: space-between;
  border-radius: 14px;
  background: linear-gradient(135deg,#356fd9,#5365d9);
  box-shadow: 0 8px 22px rgba(44,76,150,.2);
  color: #fff;
}
.version-current-card span {
  font-size: 11px;
  opacity: .82;
}
.version-current-card strong {
  font-size: 14px;
  letter-spacing: -.02em;
}
.version-history-status {
  min-height: 19px;
  margin: 0 6px 7px;
  color: #77777e;
  font-size: 10px;
  line-height: 1.35;
}
.version-history-status.success {
  color: #38814b;
}.version-history-status.error {
  color: #c83b43;
}
.version-history-list {
  overflow: hidden;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 0 0 .5px rgba(60,60,67,.09);
}
.version-backup-row {
  position: relative;
  display: grid;
  width: 100%;
  min-height: 68px;
  padding: 10px 12px 10px 15px;
  border: 0;
  grid-template-columns: minmax(0,1fr) auto 17px;
  align-items: center;
  gap: 9px;
  background: transparent;
  color: #1c1c1e;
  text-align: left;
  cursor: pointer;
}
.version-backup-row::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 15px;
  height: .5px;
  background: rgba(60,60,67,.2);
  content: "";
}
.version-backup-row:last-child::after {
  display: none;
}
.version-backup-row:active {
  background: rgba(118,118,128,.09);
}
.version-backup-main, .version-backup-meta {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 3px;
}
.version-backup-main strong {
  overflow: hidden;
  font-size: 14px;
  letter-spacing: -.02em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.version-backup-main small, .version-backup-meta small {
  color: #85858c;
  font-size: 9px;
  line-height: 1.25;
}
.version-backup-meta {
  align-items: flex-end;
  text-align: right;
}
.version-backup-meta em {
  padding: 3px 6px;
  border-radius: 999px;
  background: #e9f5ec;
  color: #2f8346;
  font-size: 8px;
  font-style: normal;
  font-weight: 700;
  white-space: nowrap;
}
.version-backup-row > svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: #c4c4ca;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.version-history-empty {
  display: flex;
  min-height: 128px;
  padding: 25px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 7px;
  text-align: center;
}
.version-history-empty strong {
  font-size: 14px;
}.version-history-empty span {
  max-width: 250px;
  color: #85858c;
  font-size: 10px;
  line-height: 1.4;
}
.restore-confirm-panel {
  position: fixed;
  z-index: 620;
  inset: 0;
  display: flex;
  visibility: hidden;
  padding: 16px 16px calc(var(--safe-bottom) + 16px);
  align-items: flex-end;
  justify-content: center;
  background: rgba(18,20,25,0);
  opacity: 0;
  pointer-events: none;
  transition: opacity .22s ease,background .22s ease,visibility 0s linear .34s;
}
.restore-confirm-panel.show {
  visibility: visible;
  background: rgba(18,20,25,.4);
  opacity: 1;
  pointer-events: auto;
  transition-delay: 0s;

}
.restore-confirm-sheet {
  width: min(430px,100%);
  padding: 20px 17px 15px;
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 24px;
  background: rgba(249,249,251,.96);
  box-shadow: 0 24px 70px rgba(0,0,0,.32);
  text-align: center;
  transform: translateY(calc(100% + 30px));
  transition: transform .34s cubic-bezier(.22,.8,.25,1);
}
.restore-confirm-panel.show .restore-confirm-sheet {
  transform: translateY(0);
}
.restore-confirm-icon {
  display: grid;
  width: 43px;
  height: 43px;
  margin: 0 auto 10px;
  place-items: center;
  border-radius: 13px;
  background: #5966d9;
  color: #fff;
}
.restore-confirm-icon svg {
  width: 24px;
  height: 24px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.restore-confirm-sheet h3 {
  margin: 0 0 7px;
  font-size: 19px;
  letter-spacing: -.03em;
}
.restore-confirm-sheet p {
  margin: 0 auto 17px;
  max-width: 340px;
  color: #6d6d73;
  font-size: 11px;
  line-height: 1.45;
}
.restore-confirm-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.restore-confirm-actions button {
  min-height: 45px;
  border: 0;
  border-radius: 13px;
  background: rgba(118,118,128,.13);
  color: #303036;
  font-size: 13px;
  font-weight: 680;
}
.restore-confirm-actions button:last-child {
  background: #176fe5;
  color: #fff;
}.restore-confirm-actions button:disabled {
  opacity: .5;
}

/* Camera, loading, confirmation and fault surfaces. */
#camera-mode {
  position: fixed;
  z-index: 400;
  inset: 0;
  display: none;
  flex-direction: column;
  background: #000;
}
#camera-mode.active {
  display: flex;
}
#camera-video {
  width: 100%;
  flex: 1;
  object-fit: cover;
}
#camera-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
#scan-frame {
  width: min(80%,320px);
  height: 180px;
  border: 2px solid rgba(255,255,255,.75);
  border-radius: 20px;
  box-shadow: 0 0 0 100vmax rgba(0,0,0,.4);
}
#scan-hint {
  margin-top: 16px;
  color: rgba(255,255,255,.85);
  font-size: 15px;
}
#camera-bottom {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  padding: 12px 12px calc(var(--safe-bottom) + 12px);
  justify-content: center;
  gap: 8px;
}
#camera-bottom button {
  min-width: 96px;
  min-height: 43px;
  border: 1px solid rgba(255,255,255,.24);
  border-radius: 999px;
  background: rgba(255,255,255,.14);
  color: #fff;
  font-weight: 700;
}
#camera-continuous {
  border-color: rgba(32,178,170,.52) !important;
  background: rgba(32,178,170,.20) !important;
}
#camera-continuous.active {
  border-color: rgba(255,255,255,.74) !important;
  background: #20B2AA !important;
  box-shadow: 0 3px 14px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.32);
}
#camera-result-card {
  position:absolute;
  z-index:2;
  left:50%;
  bottom:calc(var(--safe-bottom) + 76px);
  width:min(calc(100% - 28px),390px);
  transform:translateX(-50%);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.36);
  border-radius:22px;
  background:rgba(247,247,249,.94);
  box-shadow:0 12px 36px rgba(0,0,0,.38);
  color:#101014;
}
#camera-result-card[hidden] { display:none !important; }
.camera-result-details { padding:16px 17px 13px; }
#camera-result-name { display:block; font-size:17px; line-height:1.24; font-weight:760; }
.camera-result-details dl { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:13px 0 0; }
.camera-result-details dl div { min-width:0; }
.camera-result-details dt { color:rgba(60,60,67,.66); font-size:11px; font-weight:650; }
.camera-result-details dd { margin:3px 0 0; overflow:hidden; text-overflow:ellipsis; color:#101014; font-size:15px; font-weight:720; white-space:nowrap; }
.camera-result-actions { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(60,60,67,.16); }
.camera-result-actions button {
  min-height:48px;
  border:0;
  border-right:1px solid rgba(60,60,67,.14);
  background:transparent;
  color:#137f7a;
  font-size:15px;
  font-weight:720;
}
.camera-result-actions button:last-child { border-right:0; color:#3a3a40; }
.camera-result-actions button:active { background:rgba(32,178,170,.10); }

#loading {
  position: fixed;
  z-index: 500;
  inset: 0;
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  background: rgba(0,0,0,.62);
  color: #fff;

}
#loading.active {
  display: flex;
}
.bay-sweep-spinner { display:inline-grid;width:32px;height:32px;place-items:center;color:#20B2AA;flex:0 0 auto; }
.bay-sweep-spinner.is-small { width:24px;height:24px; }
.bay-sweep-spinner svg { display:block;width:100%;height:100%;fill:currentColor;transform-origin:50% 50%;animation:bay-sweep-rotate 800ms steps(8,end) infinite; }
@keyframes bay-sweep-rotate { to { transform:rotate(360deg); } }
@keyframes bay-sweep-breathe { 0%,100% { opacity:.38; } 50% { opacity:1; } }
@media (prefers-reduced-motion:reduce) { .bay-sweep-spinner svg { animation:bay-sweep-breathe 1.2s ease-in-out infinite; } }
#toast {
  position: fixed;
  z-index: 600;
  bottom: calc(var(--safe-bottom) + 90px);
  left: 50%;
  max-width: 90vw;
  padding: 10px 18px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 999px;
  background: rgba(43,43,47,.9);
  color: #fff;
  font-size: 13px;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%,70px);
  transition: opacity .25s ease,transform .25s ease;
  white-space: nowrap;

}
#toast.show {
  opacity: 1;
  transform: translate(-50%,0);
}
#diag {
  display: none !important;
}
.copy-panel, .error-popup {
  position: fixed;
  z-index: 650;
  inset: 0;
  display: none;
  padding: 20px;
  place-items: center;
  background: rgba(8,11,16,.46);

}
.copy-panel.show, .error-popup.show {
  display: grid;
}
.copy-sheet, .error-popup-card {
  width: min(330px,100%);
  padding: 15px;
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 20px;
  background: rgba(248,248,250,.97);
  box-shadow: 0 24px 60px rgba(0,0,0,.3);
}
.copy-title, .error-popup-header {
  margin-bottom: 12px;
  font-size: 15px;
  font-weight: 700;
}
.copy-value, #error-popup-text {
  width: 100%;
  min-height: 40px;
  padding: 9px;
  border: 1px solid rgba(60,60,67,.16);
  border-radius: 10px;
  background: #fff;
  color: #111;
}
#error-popup-text {
  min-height: 150px;
  resize: none;
}
.copy-actions, .error-popup-actions {
  display: grid;
  margin-top: 12px;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.copy-actions button, .error-popup-actions button {
  min-height: 39px;
  border: 0;
  border-radius: 11px;
  background: rgba(118,118,128,.12);
  color: #444;
}.copy-actions button:last-child,.error-popup-actions button:last-child{
  background: #087be9;
  color: #fff;
}

@media (orientation: landscape) {

  #labels-workspace.plano10-labels-workspace { inset: calc(var(--app-safe-top) + 55px) 0 0; }
  .settings-scroll { padding-right: 32px; padding-left: max(48px,var(--safe-left)); }
  .settings-scroll h2 { font-size: 26px; }
}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior: auto!important; animation-duration: .01ms!important; animation-iteration-count: 1!important; transition-duration: .01ms!important; }
}




.labels-main-mask {
  position: absolute;
  z-index: 2;
  border: 0;
  background: #fff;
  pointer-events: none;
}
.labels-main-hit {
  position: absolute;
  z-index: 4;
  background: transparent;
  pointer-events: auto;
}
.labels-main-row {
  position: absolute;
  z-index: 3;
  border: 0;
  background: rgba(32,178,170,.24);
  box-shadow: none;
  pointer-events: none;
}
.plano10-search-row-highlight.is-duplicate,
.labels-main-row.is-duplicate {
  background: rgba(255,214,10,.30) !important;
}



.about-plano-details{
  padding: 8px 16px 12px 62px;
  background: rgba(255,255,255,.45);
}.about-plano-details div{
  display: flex;
  justify-content: space-between;
  padding: 7px 0;
  border-top: 1px solid rgba(60,60,67,.09);
  font-size: 14px;
}.settings-mic-row select{
  width: min(48%, 180px);
  min-width: 140px;
  font-size: 13px;
}
/* Labels audio controls. */
.listen-v2-actions{
  grid-template-columns: 1fr 1fr !important;
}
.listen-v2-actions #bc-calibrate-reset{
  grid-column: 1/-1;
}
.listen-profile-results{
  display: grid;
  gap: 7px;
  margin: 12px 0;
  padding: 10px;
  border-radius: 12px;
  background: rgba(120,120,128,.08);
}
.listen-profile-results>div{
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 11px;
}
.listen-profile-results strong{
  font-weight: 650;
  text-align: right;
}


.labels-main-seq-dot {
  position: absolute;
  z-index: 6;
  width: 18px;
  height: 18px;
  border: 2px solid rgba(255,255,255,.96);
  border-radius: 50%;
  transform: translate(-50%,0);
  pointer-events: none;
  box-sizing: border-box;
}
.labels-main-seq-dot.is-active {
  background: #20B2AA;
  box-shadow: 0 2px 10px rgba(18,112,106,.38),0 0 0 2px rgba(32,178,170,.18);
}
.labels-main-seq-dot.is-duplicate {
  background: #ffd60a;
  box-shadow: 0 2px 10px rgba(150,110,0,.35),0 0 0 2px rgba(255,214,10,.18);
}

.labels-item-field strong,
.labels-seq-field strong {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}


body.labels-mode #page-label {
  display: none !important;
}




.labels-facings-field,
.labels-bay-field {
  text-align: center;
}
.labels-bay-field {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.labels-bay-field > .label {
  width: 100%;
  text-align: center;
}
.labels-facings-value {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: center;
  gap: 5px;
}
.labels-duplicate-icon {
  display: inline-grid;
  width: 19px;
  height: 19px;
  flex: 0 0 19px;
  place-items: center;
  color: #111;
}
.labels-duplicate-icon[hidden] {
  display: none !important;
}
.labels-duplicate-icon svg {
  width: 19px;
  height: 19px;
  overflow: visible;
  fill: #ffd60a;
  stroke: #111;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}


/* Adjustable current-bay picture split. */
#picture-split {
  position: fixed;
  z-index: 130;
  top: var(--picture-split-top);
  right: 0;
  left: 0;
  height: calc(var(--picture-split-height) + var(--picture-divider-size));
  overflow: visible;
  border-radius: 0 0 34px 34px;
  background: #d4d7dc;
  box-shadow: 0 18px 34px rgba(15,20,28,.30),0 5px 10px rgba(15,20,28,.16);
  opacity: 0;
  pointer-events: none;
  transform: translateY(calc(-100% - var(--picture-split-top)));
  transition: transform 380ms cubic-bezier(.22,.78,.2,1), opacity 180ms ease;
}
body.picture-split-open #picture-split {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}
#picture-viewport {
  position: absolute;
  inset: 0 0 var(--picture-divider-size);
  overflow: auto;
  overscroll-behavior: contain;
  border-radius: 0 0 30px 30px;
  background: #cfd3d8;
  touch-action: pan-x pan-y;
  -webkit-overflow-scrolling: touch;
}
#picture-stage {
  position: relative;
  display: flex;
  min-width: 100%;
  min-height: 100%;
  align-items: flex-start;
  justify-content: center;
  transform-origin: 0 0;
}
#picture-canvas {
  display: block;
  flex: 0 0 auto;
  background: #fff;
  box-shadow: 0 2px 12px rgba(0,0,0,.22);
}
#picture-overlay {
  position: absolute;
  z-index: 3;
  inset: 0;
  pointer-events: none;
}
.picture-location-pin {
  z-index:6;
  filter:drop-shadow(0 0 1px rgba(255,255,255,.98)) drop-shadow(0 0 2px rgba(255,255,255,.92)) drop-shadow(0 3px 5px rgba(0,0,0,.52)) !important;
  transform:translate(-50%,0) scale(1.12) !important;
}
.picture-location-pin.is-duplicate {
  filter:drop-shadow(0 0 1px rgba(255,255,255,.98)) drop-shadow(0 0 2px rgba(255,255,255,.92)) drop-shadow(0 3px 5px rgba(90,62,0,.48)) !important;
}
#picture-divider {
  position:absolute;
  right:0;
  bottom:0;
  left:0;
  display:block;
  height:0;
  place-items:center;
  overflow:visible;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  cursor:ns-resize;
  opacity:1;
  pointer-events:auto;
  touch-action:none;
  transition:box-shadow 150ms ease,background 150ms ease;
}
#picture-divider.is-dragging {
  background:transparent;
  box-shadow:none;
}
body.picture-split-open #viewer {
  inset: var(--picture-split-bottom) 0 auto !important;
  height: calc(var(--plano-viewport-height) - var(--picture-split-bottom)) !important;
  transition: top 380ms cubic-bezier(.22,.78,.2,1);
}
body.picture-split-open #pdf-stack {
  padding-top: max(calc(var(--app-safe-top) + 86px), var(--picture-center-pad, 116px)) !important;
  padding-bottom: max(86px, var(--picture-center-pad, 116px)) !important;
}
body.picture-split-open #labels-workspace.plano10-labels-workspace {
  inset: var(--picture-split-bottom) 0 auto !important;
  height: calc(var(--plano-viewport-height) - var(--picture-split-bottom)) !important;
}


.edit-bin-panel {
  position: fixed;
  z-index: 420;
  inset: 0;
  display: flex;
  align-items: flex-end;
  background: rgba(10,13,18,.34);

}
.edit-bin-panel[hidden] {
  display: none !important;
}
.edit-bin-sheet {
  width: 100%;
  max-height: min(72dvh, 560px);
  padding: 10px 12px calc(var(--safe-bottom) + 14px);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.72);
  border-bottom: 0;
  border-radius: 22px 22px 0 0;
  background: rgba(246,247,250,.96);
  box-shadow: 0 -18px 42px rgba(0,0,0,.24);
  color: #111114;
}
.edit-bin-header {
  display: grid;
  height: 40px;
  grid-template-columns: 72px 1fr 72px;
  align-items: center;
}
.edit-bin-header strong {
  text-align: center;
  font-size: 15px;
}
.edit-bin-header button {
  border: 0;
  background: transparent;
  color: #0874e8;
  font-size: 14px;
}
#edit-bin-cancel { text-align: left; }
#edit-bin-remove {
  text-align: right;
  color: #ff453a;
  font-weight: 700;
}
#edit-bin-remove:disabled {
  color: rgba(60,60,67,.32);
}
.edit-bin-sheet > p {
  margin: 2px 4px 10px;
  color: rgba(60,60,67,.72);
  font-size: 12px;
  line-height: 1.35;
}
.edit-bin-list {
  max-height: calc(min(72dvh, 560px) - 105px);
  overflow-y: auto;
  border-radius: 14px;
  background: #fff;
  -webkit-overflow-scrolling: touch;
}
.edit-bin-option {
  display: grid;
  min-height: 52px;
  padding: 8px 12px;
  grid-template-columns: 24px minmax(0,1fr);
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid rgba(60,60,67,.10);
}
.edit-bin-option:last-child { border-bottom: 0; }
.edit-bin-option input {
  width: 20px;
  height: 20px;
  margin: 0;
  accent-color: #ff453a;
}
.edit-bin-option span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 14px;
  font-weight: 630;
}
.edit-bin-empty {
  padding: 24px 14px;
  color: rgba(60,60,67,.70);
  text-align: center;
  font-size: 13px;
}

#picture-page-selector {
  position: absolute;
  z-index: 6;
  top: 7px;
  left: 50%;
  display: flex;
  max-width: calc(100% - 24px);
  height: 25px;
  padding: 3px;
  gap: 3px;
  overflow-x: auto;
  border: 1px solid rgba(255,255,255,.44);
  border-radius: 11px;
  background: rgba(56,63,73,.72);
  box-shadow: 0 5px 14px rgba(0,0,0,.20);

  transform: translateX(-50%);
  scrollbar-width: none;
}
#picture-page-selector[hidden] { display: none !important; }
#picture-page-selector::-webkit-scrollbar { display: none; }
#picture-page-selector button {
  min-width: 46px;
  height: 17px;
  padding: 0 8px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: rgba(255,255,255,.80);
  font-size: 10px;
  font-weight: 720;
  line-height: 17px;
  white-space: nowrap;
}
#picture-page-selector button.active {
  background: rgba(255,255,255,.27);
  color: #fff;
}

.insert-panel {
  position: fixed;
  z-index: 430;
  inset: 0;
  display: flex;
  align-items: flex-end;
  background: rgba(10,13,18,.38);

}
.insert-panel[hidden] { display: none !important; }
.insert-sheet {
  width: 100%;
  max-height: calc(100dvh - var(--app-safe-top) - 12px);
  padding: 8px 12px calc(var(--safe-bottom) + 14px);
  overflow-y: auto;
  border: 1px solid rgba(255,255,255,.74);
  border-bottom: 0;
  border-radius: 22px 22px 0 0;
  background: rgba(246,247,250,.98);
  box-shadow: 0 -20px 46px rgba(0,0,0,.25);
  color: #111114;
  -webkit-overflow-scrolling: touch;
}
.insert-header {
  position: sticky;
  z-index: 4;
  top: -8px;
  display: grid;
  height: 46px;
  grid-template-columns: 70px 1fr 70px;
  align-items: center;
  background: rgba(246,247,250,.96);
}
.insert-header strong {
  text-align: center;
  font-size: 15px;
}
.insert-header button {
  border: 0;
  background: transparent;
  color: var(--plano-theme);
  font-size: 14px;
}
#insert-cancel { text-align: left; }
#insert-save { text-align: right; font-weight: 720; }
.insert-prompt {
  margin: 9px 3px 8px;
  color: rgba(60,60,67,.72);
  font-size: 13px;
  line-height: 1.35;
}
.insert-bay-options {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 7px;
}
.insert-bay-options button {
  height: 40px;
  border: 0;
  border-radius: 11px;
  background: #fff;
  box-shadow: inset 0 0 0 1px rgba(60,60,67,.10);
  color: #222226;
  font-size: 13px;
  font-weight: 680;
}
.insert-bay-options button.active {
  background: var(--plano-theme);
  box-shadow: none;
  color: #fff;
}
.insert-source-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}
.insert-source-actions button {
  display: grid;
  min-height: 72px;
  grid-template-rows: 30px 18px;
  place-items: center;
  border: 0;
  border-radius: 14px;
  background: #fff;
  box-shadow: inset 0 0 0 1px rgba(60,60,67,.10);
  color: var(--plano-theme);
  font-size: 13px;
  font-weight: 690;
}
.insert-source-actions svg,
.insert-edit-actions svg {
  width: 25px;
  height: 25px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
#insert-preview-wrap {
  position: relative;
  display: grid;
  width: 100%;
  min-height: 250px;
  max-height: 44dvh;
  margin: 4px 0 10px;
  overflow: hidden;
  place-items: center;
  border-radius: 15px;
  background: #cfd3d8;
}
#insert-preview {
  display: block;
  max-width: 100%;
  max-height: 44dvh;
  background: #fff;
  box-shadow: 0 4px 18px rgba(0,0,0,.22);
}
.insert-edit-actions {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 8px;
}
.insert-edit-actions button {
  display: flex;
  height: 42px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 0;
  border-radius: 11px;
  background: #fff;
  color: #0874e8;
  font-size: 13px;
  font-weight: 680;
}
.insert-edit-actions svg { width: 20px; height: 20px; }
.insert-edit-actions button.active { background: #ff9f0a; color: #fff; }
.insert-straighten-control {
  display: grid;
  margin-top: 11px;
  grid-template-columns: 72px 1fr 38px;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 640;
}
.insert-straighten-control output {
  color: rgba(60,60,67,.72);
  text-align: right;
}
.insert-panel input[type="range"] {
  width: 100%;
  accent-color: var(--plano-theme);
}


/* Labels reserves real overlay space so the document can scroll fully clear of the expanded card and controls. */
body.labels-mode #pdf-stack,
body.labels-entering #pdf-stack,
body.labels-ready #pdf-stack,
body.labels-leaving #pdf-stack {
  padding-top: var(--labels-view-top-padding, calc(var(--app-safe-top) + 86px)) !important;
  padding-bottom: var(--labels-view-bottom-padding, 190px) !important;
}

.combine-panel {
  position: fixed;
  z-index: 430;
  inset: 0;
  display: flex;
  align-items: flex-end;
  background: rgba(10,13,18,.38);

}
.combine-panel[hidden] { display: none !important; }
.combine-sheet {
  width: 100%;
  max-height: min(82dvh, 660px);
  padding: 8px 12px calc(var(--safe-bottom) + 14px);
  overflow-y: auto;
  border: 1px solid rgba(255,255,255,.74);
  border-bottom: 0;
  border-radius: 22px 22px 0 0;
  background: rgba(246,247,250,.98);
  box-shadow: 0 -20px 46px rgba(0,0,0,.25);
  color: #111114;
  -webkit-overflow-scrolling: touch;
}
.combine-header {
  position: sticky;
  z-index: 3;
  top: -8px;
  display: grid;
  height: 46px;
  grid-template-columns: 70px 1fr 70px;
  align-items: center;
  background: rgba(246,247,250,.96);
}
.combine-header strong { text-align: center; font-size: 15px; }
.combine-header button {
  border: 0;
  background: transparent;
  color: #0874e8;
  font-size: 14px;
}
#combine-cancel { text-align: left; }
#combine-save { text-align: right; font-weight: 720; }
.combine-sheet > p {
  margin: 4px 4px 10px;
  color: rgba(60,60,67,.72);
  font-size: 12px;
  line-height: 1.4;
}
.combine-current {
  margin-bottom: 9px;
  padding: 11px 12px;
  border-radius: 13px;
  background: rgba(10,132,255,.10);
  color: #075fab;
  font-size: 12px;
  font-weight: 720;
}
.combine-list {
  overflow: hidden;
  border-radius: 14px;
  background: #fff;
}
.combine-option {
  display: grid;
  min-height: 66px;
  padding: 8px 10px;
  grid-template-columns: 24px minmax(0,1fr) 112px;
  align-items: center;
  gap: 8px;
  border-bottom: 1px solid rgba(60,60,67,.10);
}
.combine-option:last-child { border-bottom: 0; }
.combine-option > input {
  width: 20px;
  height: 20px;
  margin: 0;
  accent-color: #0a84ff;
}
.combine-option-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 650;
}
.combine-position {
  display: grid;
  padding: 2px;
  grid-template-columns: 1fr 1fr;
  gap: 2px;
  border-radius: 9px;
  background: rgba(118,118,128,.12);
  opacity: .38;
  pointer-events: none;
}
.combine-option.selected .combine-position {
  opacity: 1;
  pointer-events: auto;
}
.combine-current-option {
  background: rgba(10,132,255,.055);
}
.combine-anchor-badge {
  justify-self: end;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(10,132,255,.11);
  color: #0874e8;
  font-size: 10px;
  font-weight: 720;
}
.combine-position button {
  height: 26px;
  padding: 0 4px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: rgba(60,60,67,.78);
  font-size: 10px;
  font-weight: 690;
}
.combine-position button.active {
  background: #fff;
  color: #111114;
  box-shadow: 0 1px 4px rgba(0,0,0,.12);
}
.combine-empty {
  padding: 22px 12px;
  color: rgba(60,60,67,.66);
  text-align: center;
  font-size: 12px;
}
.combine-add-files {
  display: flex;
  width: 100%;
  height: 44px;
  margin-top: 10px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 0;
  border-radius: 12px;
  background: #0a84ff;
  color: #fff;
  font-size: 13px;
  font-weight: 710;
}
.combine-add-files svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Multi-photo Create workflow. */
.create-panel {
  position: fixed;
  z-index: 435;
  inset: 0;
  display: flex;
  align-items: flex-end;
  background: rgba(10,13,18,.42);

}
.create-panel[hidden] { display: none !important; }
.create-sheet {
  width: 100%;
  max-height: calc(100dvh - var(--app-safe-top) - 8px);
  padding: 8px 12px calc(var(--safe-bottom) + 14px);
  overflow-y: auto;
  border: 1px solid rgba(255,255,255,.74);
  border-bottom: 0;
  border-radius: 22px 22px 0 0;
  background: rgba(246,247,250,.985);
  box-shadow: 0 -20px 46px rgba(0,0,0,.25);
  color: #111114;
  -webkit-overflow-scrolling: touch;
}
.create-header {
  position: sticky;
  z-index: 5;
  top: -8px;
  display: grid;
  height: 46px;
  grid-template-columns: 70px 1fr 70px;
  align-items: center;
  background: rgba(246,247,250,.97);
}
.create-header strong { text-align: center; font-size: 15px; }
.create-header button {
  border: 0;
  background: transparent;
  color: #0874e8;
  font-size: 14px;
}
#create-cancel { text-align: left; }
#create-save { text-align: right; font-weight: 730; }
#create-save:disabled { color: rgba(60,60,67,.35); }
.create-name-field {
  display: grid;
  grid-template-columns: 46px minmax(0,1fr);
  align-items: center;
  margin: 2px 0 10px;
  padding: 0 12px;
  border-radius: 13px;
  background: #fff;
  font-size: 12px;
  font-weight: 700;
}
.create-name-field input {
  min-width: 0;
  height: 44px;
  border: 0;
  outline: 0;
  background: transparent;
  color: #111114;
  font: inherit;
  font-weight: 540;
}
.create-source-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}
.create-source-actions button {
  display: flex;
  height: 48px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 0;
  border-radius: 13px;
  background: #0a84ff;
  color: #fff;
  font-size: 12px;
  font-weight: 710;
}
.create-source-actions button:last-child { background: #2d2d30; }
.create-source-actions svg,
.create-page-actions svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.create-empty {
  margin: 12px 3px 4px;
  color: rgba(60,60,67,.68);
  text-align: center;
  font-size: 12px;
  line-height: 1.4;
}
.create-editor[hidden] { display: none !important; }
.create-page-strip {
  display: flex;
  height: 80px;
  margin: 11px -2px 8px;
  padding: 2px;
  gap: 7px;
  overflow-x: auto;
  scrollbar-width: none;
}
.create-page-strip::-webkit-scrollbar { display: none; }
.create-page-card {
  position: relative;
  flex: 0 0 58px;
  height: 74px;
  padding: 3px;
  overflow: hidden;
  border: 2px solid transparent;
  border-radius: 10px;
  background: #d7d9dd;
}
.create-page-card.active { border-color: #0a84ff; background: #fff; }
.create-page-card canvas {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 6px;
  background: #fff;
}
.create-page-card span {
  position: absolute;
  right: 4px;
  bottom: 4px;
  min-width: 17px;
  height: 17px;
  padding: 0 4px;
  border-radius: 8px;
  background: rgba(0,0,0,.68);
  color: #fff;
  font-size: 9px;
  font-weight: 750;
  line-height: 17px;
  text-align: center;
}
#create-preview-wrap {
  display: grid;
  width: 100%;
  min-height: 250px;
  max-height: 44dvh;
  margin-bottom: 9px;
  overflow: hidden;
  place-items: center;
  border-radius: 15px;
  background: #1c1c1e;
}
#create-crop-stage {
  position: relative;
  display: grid;
  max-width: 100%;
  max-height: 44dvh;
  place-items: center;
}
#create-preview {
  display: block;
  max-width: 100%;
  max-height: 44dvh;
  background: #fff;
  box-shadow: 0 4px 18px rgba(0,0,0,.22);
}
#create-crop-overlay {
  position: absolute;
  z-index: 3;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  touch-action: none;
}
#create-crop-overlay[hidden] { display: none !important; }
#create-crop-polygon {
  fill: rgba(255,139,31,.08);
  stroke: #ff9f0a;
  stroke-width: 3;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}
#create-crop-grid line {
  stroke: rgba(255,159,10,.82);
  stroke-width: 1;
  stroke-dasharray: 7 7;
  vector-effect: non-scaling-stroke;
}
#create-crop-handles [data-crop-handle] {
  fill: #ff9f0a;
  stroke: #fff;
  stroke-width: 1.6;
  vector-effect: non-scaling-stroke;
  cursor: grab;
  touch-action: none;
}
#create-crop-handles [data-crop-handle]:active { cursor: grabbing; }
#create-crop-handles .corner-handle { r: 10px; }
#create-crop-handles .edge-handle { width: 28px; height: 10px; rx: 4px; }
#create-crop-magnifier {
  position: absolute;
  z-index: 8;
  top: 10px;
  right: 10px;
  width: 112px;
  height: 112px;
  overflow: hidden;
  border: 4px solid #fff;
  border-radius: 50%;
  background: #111;
  box-shadow: 0 5px 18px rgba(0,0,0,.46);
  pointer-events: none;
}
#create-crop-magnifier[hidden] { display: none !important; }
#create-crop-magnifier canvas { width: 100%; height: 100%; }
#create-crop-magnifier span::before,
#create-crop-magnifier span::after {
  position: absolute;
  top: 50%;
  left: 50%;
  content: "";
  background: #f5f6f8;
  box-shadow: 0 0 0 1px rgba(0,0,0,.22);
  transform: translate(-50%,-50%);
}
#create-crop-magnifier span::before { width: 42px; height: 1px; }
#create-crop-magnifier span::after { width: 1px; height: 42px; }
.create-page-actions,
.create-order-actions {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 7px;
}
.create-page-actions button,
.create-order-actions button {
  display: grid;
  min-height: 58px;
  grid-template-rows: 25px 15px;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 0;
  border-radius: 14px;
  background: #2c2c2e;
  color: #fff;
  font-size: 11px;
  font-weight: 680;
}
.create-page-actions button.active { background: #ff9f0a; }
.create-order-actions { margin-top: 7px; }
.create-order-actions button {
  min-height: 34px;
  display: flex;
  color: rgba(60,60,67,.78);
  background: #fff;
  font-size: 10px;
}
.create-order-actions button.destructive { color: #ff453a; }
.create-order-actions button:disabled { opacity: .32; }
.create-filter-strip {
  display: grid;
  margin-top: 9px;
  padding: 7px;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 7px;
  border-radius: 15px;
  background: #2c2c2e;
}
.create-filter-strip button {
  display: grid;
  min-width: 0;
  padding: 5px 3px 7px;
  grid-template-rows: 54px 16px;
  place-items: center;
  gap: 4px;
  border: 0;
  border-radius: 11px;
  background: transparent;
  color: rgba(255,255,255,.92);
  font-size: 10px;
  font-weight: 650;
}
.create-filter-strip button.active { background: #df8128; color: #fff; }
.create-filter-strip canvas {
  display: block;
  width: 76px;
  height: 54px;
  border-radius: 7px;
  background: #111;
  object-fit: cover;
}
.create-ocr-field {
  display: grid;
  margin-top: 11px;
  padding: 10px 11px;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: center;
  gap: 10px;
  border-radius: 13px;
  background: #fff;
}
.create-ocr-field > span { display: grid; gap: 2px; }
.create-ocr-field strong { font-size: 12px; }
.create-ocr-field small { color: rgba(60,60,67,.62); font-size: 9px; font-weight: 520; }
.create-ocr-field select {
  max-width: 144px;
  height: 32px;
  border: 0;
  border-radius: 9px;
  background: rgba(118,118,128,.12);
  color: #111114;
  font-size: 10px;
  font-weight: 650;
}
.create-ocr-status {
  margin: 6px 4px 0;
  color: rgba(60,60,67,.64);
  font-size: 10px;
  line-height: 1.35;
}

/* Export assembled and modified planograms. */
.export-panel {
  position: fixed;
  z-index: 438;
  inset: 0;
  display: flex;
  align-items: flex-end;
  background: rgba(10,13,18,.42);

}
.export-panel[hidden] { display: none !important; }
.export-sheet {
  width: 100%;
  max-height: min(82dvh,680px);
  padding: 8px 12px calc(var(--safe-bottom) + 14px);
  overflow-y: auto;
  border: 1px solid rgba(255,255,255,.74);
  border-bottom: 0;
  border-radius: 22px 22px 0 0;
  background: rgba(246,247,250,.985);
  box-shadow: 0 -20px 46px rgba(0,0,0,.25);
  color: #111114;
  -webkit-overflow-scrolling: touch;
}
.export-header {
  display: grid;
  height: 46px;
  grid-template-columns: 70px 1fr 70px;
  align-items: center;
}
.export-header strong { text-align: center; font-size: 15px; }
.export-header button {
  border: 0;
  background: transparent;
  color: #0874e8;
  text-align: left;
  font-size: 14px;
}
.export-current {
  margin: 2px 0 8px;
  padding: 11px 12px;
  overflow: hidden;
  border-radius: 13px;
  background: rgba(10,132,255,.10);
  color: #075fab;
  font-size: 12px;
  font-weight: 720;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.export-sheet > p:not(.export-note) {
  margin: 5px 4px 10px;
  color: rgba(60,60,67,.70);
  font-size: 12px;
  line-height: 1.4;
}
.export-options {
  overflow: hidden;
  border-radius: 14px;
  background: #fff;
}
.export-options label {
  display: grid;
  min-height: 62px;
  padding: 9px 12px;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid rgba(60,60,67,.10);
}
.export-options label:last-child { border-bottom: 0; }
.export-options label.disabled { opacity: .42; }
.export-options label > span { display: grid; gap: 3px; }
.export-options strong { font-size: 13px; }
.export-options small { color: rgba(60,60,67,.62); font-size: 10px; font-weight: 520; }
.export-options input {
  width: 22px;
  height: 22px;
  margin: 0;
  accent-color: #0a84ff;
}
.export-summary {
  display: flex;
  margin: 10px 2px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: rgba(60,60,67,.72);
  font-size: 11px;
}
.export-summary strong { color: #111114; font-size: 12px; }
#export-action {
  display: flex;
  width: 100%;
  height: 48px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 0;
  border-radius: 13px;
  background: #0a84ff;
  color: #fff;
  font-size: 14px;
  font-weight: 730;
}
#export-action:disabled { opacity: .48; }
#export-action svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}
#export-download {
  display: flex;
  width: 100%;
  height: 42px;
  margin-top: 8px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 1px solid rgba(10,132,255,.28);
  border-radius: 13px;
  background: rgba(10,132,255,.08);
  color: #0874e8;
  font-size: 12px;
  font-weight: 690;
}
#export-download[hidden] { display: none !important; }
#export-download svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.export-note {
  margin: 8px 4px 0;
  color: rgba(60,60,67,.58);
  text-align: center;
  font-size: 10px;
  line-height: 1.35;
}


/* ─── Plano selected-row shelf pointer and Insert editor ─── */


.picture-shelf-pointer {
  position:absolute;
  z-index:8;
  display:grid;
  width:38px;
  height:30px;
  place-items:center;
  border-radius:15px;
  background:#20B2AA;
  color:#fff;
  font-size:15px;
  font-weight:820;
  line-height:1;
  font-variant-numeric:tabular-nums;
  box-shadow:0 4px 10px rgba(18,112,106,.28);
  filter:drop-shadow(0 2px 3px rgba(18,112,106,.28));
  transform:translateY(-50%);
  pointer-events:none;
}
.picture-shelf-pointer::before {
  content:"";
  position:absolute;
  top:50%;
  width:0;
  height:0;
  transform:translateY(-50%);
  border-top:9px solid transparent;
  border-bottom:9px solid transparent;
}
.picture-shelf-pointer-right {
  right:8px;
}
.picture-shelf-pointer-right::before {
  left:-10px;
  border-right:12px solid #20B2AA;
}
.picture-shelf-pointer-left {
  left:8px;
}
.picture-shelf-pointer-left::before {
  right:-10px;
  border-left:12px solid #20B2AA;
}
.picture-shelf-pointer[hidden] { display:none !important; }

.row-check-control {
  position:absolute;
  z-index:9;
  display:grid;
  width:var(--row-check-size,18px);
  height:var(--row-check-size,18px);
  padding:0;
  place-items:center;
  border:max(1px,calc(var(--row-check-size,18px) * .083)) solid rgba(60,60,67,.50);
  border-radius:max(3px,calc(var(--row-check-size,18px) * .22));
  background:rgba(255,255,255,.92);
  box-shadow:0 1px 3px rgba(0,0,0,.12);
  color:#fff;
  pointer-events:auto;
  touch-action:manipulation;
}
.row-check-control::before { content:"";position:absolute;top:50%;left:50%;width:max(22px,100%);height:max(22px,100%);transform:translate(-50%,-50%); }
.row-check-control svg { width:78%;height:78%;fill:none;stroke:currentColor;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round;opacity:0; }
.row-check-control .selection-glyph-x { display:none; }
.row-check-control.is-checked { border-color:#20B2AA;background:#20B2AA;color:#fff; }
.row-check-control.is-checked svg { opacity:1; }
.row-check-control.is-checked[data-selection-mode="skip"] .selection-glyph-check { display:none; }
.row-check-control.is-checked[data-selection-mode="skip"] .selection-glyph-x { display:block; }
.row-check-control.is-checked[data-selection-mode="only"] { background:#fff;color:#20B2AA;border-color:#20B2AA; }
.row-check-control.is-checked[data-selection-mode="only"] .selection-glyph-check { display:block; }
.row-check-control.is-checked[data-selection-mode="only"] .selection-glyph-x { display:none; }

/* Insert now uses the same detected-corner / perspective workflow as Create. */
#insert-crop-stage {
  position: relative;
  display: block;
  max-width: 100%;
  max-height: 44dvh;
}
#insert-crop-overlay {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  touch-action: none;
}
#insert-crop-overlay[hidden] { display: none !important; }
#insert-crop-polygon {
  fill: rgba(255,159,10,.08);
  stroke: #ff9f0a;
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
}
#insert-crop-grid line {
  stroke: rgba(255,255,255,.68);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}
#insert-crop-handles [data-insert-crop-handle] {
  fill: #ff9f0a;
  stroke: #fff;
  stroke-width: 2;
  cursor: grab;
  vector-effect: non-scaling-stroke;
}
#insert-crop-handles [data-insert-crop-handle]:active { cursor: grabbing; }
#insert-crop-magnifier {
  position: absolute;
  z-index: 6;
  top: 10px;
  left: 50%;
  width: 108px;
  height: 108px;
  overflow: hidden;
  border: 3px solid #fff;
  border-radius: 54px;
  background: #111;
  box-shadow: 0 5px 18px rgba(0,0,0,.34);
  transform: translateX(-50%);
  pointer-events: none;
}
#insert-crop-magnifier[hidden] { display: none !important; }
#insert-crop-magnifier canvas { width: 100%; height: 100%; }
#insert-crop-magnifier span::before,
#insert-crop-magnifier span::after {
  position: absolute;
  top: 50%;
  left: 50%;
  background: rgba(255,159,10,.95);
  content: "";
  transform: translate(-50%,-50%);
}
#insert-crop-magnifier span::before { width: 42px; height: 1px; }
#insert-crop-magnifier span::after { width: 1px; height: 42px; }
.insert-filter-strip { margin-top: 8px; }
.insert-filter-strip button.active { background: var(--plano-theme); color: #fff; }
.insert-reset-button {
  width: 100%;
  height: 40px;
  margin-top: 10px;
  border: 0;
  border-radius: 11px;
  background: rgba(118,118,128,.12);
  color: #3a3a3c;
  font-size: 12px;
  font-weight: 620;
}



/* App-wide iOS safe-area and scroll-boundary guard. Interactive sheets may
   reach the bottom safe area, but their usable content never enters the top
   system blur/status region and scroll containers do not rubber-band past end. */
#thumb-panel.plano10-page-picker,
.planogram-dropdown,
.settings-scroll,
.edit-bin-list,
.insert-sheet,
.combine-sheet,
.create-sheet,
.export-sheet,
.labels-bay-panel,
.product-info-sheet { overscroll-behavior:none; }
.edit-bin-panel,
.insert-panel,
.combine-panel,
.create-panel,
.export-panel,
.restore-confirm-panel { padding-top:var(--app-safe-top); }
.edit-bin-sheet,
.insert-sheet,
.combine-sheet,
.create-sheet,
.export-sheet,
.restore-confirm-sheet { max-height:calc(var(--plano-viewport-height) - var(--app-safe-top) - 8px); }

/* ─── Plano v11.0.40 divider stability ─── */
body.picture-split-open #viewer,
body.picture-split-open #pdf-stack { overflow-anchor:none !important; }
body.picture-divider-dragging #viewer { transition:none !important; }
body.picture-divider-dragging #pdf-stack { scroll-behavior:auto !important; }

/* Plano workspace shell. The Planogram viewer remains mounted underneath so
   returning Home never destroys the current PDF/view state. */
.plano-home,
.plano-section-view {
  position:fixed;
  z-index:500;
  inset:0;
  height:var(--plano-viewport-height);
  max-height:var(--plano-viewport-height);
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:none;
  background:#f2f2f7;
  color:#111114;
  -webkit-overflow-scrolling:touch;
}
.plano-home[hidden],
.plano-section-view[hidden] { display:none !important; }
.plano-home-content {
  width:min(720px,100%);
  min-height:100%;
  margin:0 auto;
  padding:calc(var(--app-safe-top) + 32px) max(18px,var(--safe-right)) calc(var(--safe-bottom) + 28px) max(18px,var(--safe-left));
}
.plano-home-header { display:flex; align-items:end; justify-content:space-between; margin-bottom:28px; }
.plano-home-eyebrow { margin:0 0 4px; color:rgba(60,60,67,.58); font-size:13px; font-weight:650; letter-spacing:.02em; }
.plano-home-header h1 { margin:0; font-size:36px; line-height:1; font-weight:800; letter-spacing:-.035em; }
.plano-home-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.plano-home-tile {
  appearance:none;
  display:flex;
  min-height:132px;
  padding:18px;
  align-items:flex-start;
  gap:14px;
  border:1px solid rgba(255,255,255,.9);
  border-radius:24px;
  background:rgba(255,255,255,.92);
  box-shadow:0 8px 24px rgba(25,30,40,.08),inset 0 1px 0 rgba(255,255,255,.96);
  color:#111114;
  text-align:left;
  transition:transform 150ms ease,box-shadow 180ms ease;
}
.plano-home-tile:active { transform:scale(.975); box-shadow:0 4px 14px rgba(25,30,40,.08),inset 0 1px 0 rgba(255,255,255,.95); }
.plano-home-tile > span:last-child { display:grid; min-width:0; gap:4px; padding-top:3px; }
.plano-home-tile strong { font-size:18px; font-weight:750; letter-spacing:-.015em; }
.plano-home-tile small { color:rgba(60,60,67,.58); font-size:12px; font-weight:560; line-height:1.25; }
.plano-home-icon {
  display:grid;
  width:46px;
  height:46px;
  flex:0 0 46px;
  place-items:center;
  border-radius:14px;
  background:var(--plano-theme);
  color:#fff;
  box-shadow:0 5px 13px rgba(var(--plano-theme-rgb),.22);
}
.plano-home-icon svg { width:25px; height:25px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.plano-home-icon-text { font-size:23px; font-weight:800; }
.plano-section-view { padding:calc(var(--app-safe-top) + 18px) max(18px,var(--safe-right)) calc(var(--safe-bottom) + 24px) max(18px,var(--safe-left)); }
.plano-section-header { display:flex; width:min(720px,100%); margin:0 auto; align-items:center; gap:12px; }
.plano-section-header button,
.workspace-home-button {
  appearance:none;
  display:grid;
  width:46px;
  height:46px;
  padding:0;
  place-items:center;
  border:1px solid rgba(255,255,255,.76);
  border-radius:23px;
  background:rgba(247,248,250,.97);
  box-shadow:0 8px 24px rgba(20,25,34,.15),inset 0 1px 0 rgba(255,255,255,.88);
  color:#111114;
}
.plano-section-header button svg,
.workspace-home-button svg { width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:2.35; stroke-linecap:round; stroke-linejoin:round; }
.plano-section-header h1 { margin:0; font-size:28px; font-weight:780; letter-spacing:-.025em; }
.plano-section-empty { display:grid; width:min(720px,100%); min-height:45vh; margin:0 auto; place-items:center; color:rgba(60,60,67,.62); text-align:center; }
.workspace-home-button {
  position:fixed;
  z-index:230;
  top:calc(var(--app-safe-top) + 18px);
  left:max(10px,var(--safe-left));
  transition:transform 160ms ease,opacity 180ms ease;
}
.workspace-home-button:active { transform:scale(.92); }
.workspace-home-button[hidden],
body.labels-mode .workspace-home-button,
body.labels-entering .workspace-home-button,
body.labels-ready .workspace-home-button,
body.labels-leaving .workspace-home-button { display:none !important; }
@media (max-width:520px) {
  .plano-home-grid { grid-template-columns:1fr; }
  .plano-home-tile { min-height:92px; }
}
@media (orientation:landscape) {
  .workspace-home-button { top:calc(var(--app-safe-top) + 15px); }
}

/* Workspace apps: Notes, Asana and Websites. */
.workspace-app-panel {
  width:min(760px,100%);
  margin:18px auto 0;
}
.workspace-app-panel[hidden] { display:none !important; }
.workspace-toolbar,
.website-form {
  display:flex;
  align-items:center;
  gap:9px;
  margin-bottom:12px;
}
.workspace-search {
  display:flex;
  min-height:42px;
  flex:1;
  align-items:center;
  gap:8px;
  padding:0 12px;
  border:1px solid rgba(60,60,67,.13);
  border-radius:13px;
  background:rgba(255,255,255,.82);
  box-shadow:0 2px 8px rgba(0,0,0,.05),inset 0 1px 0 rgba(255,255,255,.9);
}
.workspace-search svg { width:18px;height:18px;fill:none;stroke:#85858c;stroke-width:2; }
.workspace-search input,
.website-form input {
  min-width:0;
  border:0;
  outline:0;
  background:transparent;
  color:#161617;
  font:inherit;
}
.workspace-search input { width:100%; }
.workspace-primary-action {
  min-height:42px;
  padding:0 15px;
  border:1px solid rgba(255,255,255,.62);
  border-radius:13px;
  background:#20B2AA;
  color:#fff;
  box-shadow:0 5px 13px rgba(32,178,170,.22),inset 0 1px 0 rgba(255,255,255,.28);
  font-size:13px;
  font-weight:760;
}
.workspace-primary-action:disabled { opacity:.46; box-shadow:none; }
.notes-layout {
  display:grid;
  min-height:55vh;
  grid-template-columns:minmax(180px,34%) 1fr;
  overflow:hidden;
  border:1px solid rgba(60,60,67,.11);
  border-radius:18px;
  background:rgba(255,255,255,.78);
  box-shadow:0 8px 28px rgba(0,0,0,.06);
}
.notes-list {
  overflow:auto;
  border-right:1px solid rgba(60,60,67,.10);
  background:rgba(246,246,248,.72);
}
.note-list-row {
  display:grid;
  width:100%;
  padding:13px 14px;
  border:0;
  border-bottom:1px solid rgba(60,60,67,.08);
  background:transparent;
  text-align:left;
  gap:3px;
}
.note-list-row.is-selected { background:rgba(32,178,170,.12); }
.note-list-row strong { overflow:hidden;font-size:14px;text-overflow:ellipsis;white-space:nowrap; }
.note-list-row span { overflow:hidden;color:#64646a;font-size:11px;text-overflow:ellipsis;white-space:nowrap; }
.note-list-row small { color:#9a9aa0;font-size:9px; }
.notes-editor {
  display:flex;
  min-width:0;
  min-height:55vh;
  flex-direction:column;
  padding:20px;
  background:rgba(255,255,255,.9);
}
.notes-editor[hidden] { display:none !important; }
.notes-title {
  width:100%;
  border:0;
  outline:0;
  background:transparent;
  color:#161617;
  font-size:24px;
  font-weight:790;
  letter-spacing:-.03em;
}
.notes-body {
  width:100%;
  min-height:38vh;
  margin-top:10px;
  flex:1;
  resize:none;
  border:0;
  outline:0;
  background:transparent;
  color:#2d2d31;
  font:15px/1.5 -apple-system,BlinkMacSystemFont,"SF Pro Text",sans-serif;
}
.notes-editor-footer { display:flex;align-items:center;justify-content:space-between;gap:10px;color:#9a9aa0; }
.notes-editor-footer button { border:0;background:transparent;color:#d43c32;font-weight:650; }
.workspace-empty-state {
  display:grid;
  min-height:210px;
  padding:30px;
  place-content:center;
  justify-items:center;
  gap:6px;
  color:#7d7d83;
  text-align:center;
}
.workspace-empty-state strong { color:#4d4d52;font-size:15px; }
.workspace-empty-state span { max-width:360px;font-size:11px;line-height:1.45; }
.notes-layout > .workspace-empty-state { grid-column:1 / -1; }
.notes-layout:has(.notes-editor:not([hidden])) > .workspace-empty-state { display:none; }
.website-form {
  display:grid;
  grid-template-columns:minmax(120px,.8fr) minmax(190px,1.5fr) auto;
  padding:10px;
  border:1px solid rgba(60,60,67,.11);
  border-radius:16px;
  background:rgba(255,255,255,.82);
}
.website-form input {
  min-height:38px;
  padding:0 11px;
  border:1px solid rgba(60,60,67,.11);
  border-radius:11px;
  background:rgba(248,248,250,.92);
}
.website-list { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px; }
.website-card {
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  border:1px solid rgba(60,60,67,.10);
  border-radius:15px;
  background:rgba(255,255,255,.82);
  box-shadow:0 4px 14px rgba(0,0,0,.05);
  overflow:hidden;
}
.website-open {
  display:flex;
  min-width:0;
  padding:11px;
  align-items:center;
  gap:10px;
  border:0;
  background:transparent;
  text-align:left;
}
.website-open > span:last-child { display:grid;min-width:0;gap:2px; }
.website-open strong,.website-open small { overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.website-open strong { font-size:13px; }
.website-open small { color:#85858c;font-size:9px; }
.website-icon {
  position:relative;
  display:grid;
  width:38px;
  height:38px;
  flex:0 0 auto;
  place-items:center;
  overflow:hidden;
  border-radius:10px;
  background:#ececf1;
  color:#5b5b61;
  font-size:16px;
  font-weight:800;
}
.website-icon img { position:absolute;inset:4px;width:30px;height:30px;object-fit:contain;border-radius:7px; }
.website-icon.has-image b { visibility:hidden; }
.website-remove { width:40px;height:46px;border:0;background:transparent;color:#a1a1a8;font-size:22px; }
.website-browser {
  position:fixed;
  z-index:700;
  inset:0;
  display:flex;
  flex-direction:column;
  padding-top:var(--app-safe-top);
  background:#fff;
}
.website-browser[hidden] { display:none !important; }
.website-browser-bar {
  display:grid;
  min-height:52px;
  grid-template-columns:54px 1fr 60px;
  align-items:center;
  border-bottom:1px solid rgba(60,60,67,.13);
  background:rgba(248,248,250,.96);
}
.website-browser-bar button { height:44px;border:0;background:transparent;color:#20B2AA;font-weight:720; }
.website-browser-bar button svg { width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.2; }
.website-browser-bar strong { overflow:hidden;text-align:center;text-overflow:ellipsis;white-space:nowrap; }
.website-browser iframe { width:100%;min-height:0;flex:1;border:0;background:#fff; }
/* Asana workspace styles are defined in src/styles/asana-workspace.css. */
/* ─── Planogram library, workspace selection and split quick snaps ─── */
.planogram-library-panel { display:grid; gap:14px; }
.planogram-library-section {
  overflow:hidden;
  border:1px solid rgba(60,60,67,.11);
  border-radius:20px;
  background:rgba(255,255,255,.84);
  box-shadow:0 8px 24px rgba(0,0,0,.055),inset 0 1px 0 rgba(255,255,255,.92);
}
.planogram-library-heading {
  display:flex;
  min-height:62px;
  padding:10px 12px 10px 15px;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border-bottom:1px solid rgba(60,60,67,.09);
}
.planogram-library-heading > div { display:grid; min-width:0; gap:2px; }
.planogram-library-heading strong { font-size:16px; font-weight:760; }
.planogram-library-heading small { color:rgba(60,60,67,.58); font-size:10px; }
.planogram-library-list { display:grid; }
.planogram-library-row {
  appearance:none;
  display:flex;
  width:100%;
  min-height:58px;
  padding:10px 14px;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border:0;
  border-bottom:1px solid rgba(60,60,67,.08);
  background:transparent;
  color:#151517;
  text-align:left;
}
.planogram-library-row:last-child { border-bottom:0; }
.planogram-library-row.is-active { background:rgba(32,178,170,.09); }
.planogram-library-row > span:first-child { display:grid; min-width:0; gap:3px; }
.planogram-library-row strong,.planogram-library-row small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.planogram-library-row strong { font-size:14px; }
.planogram-library-row small { color:#85858c; font-size:10px; }
.planogram-library-chevron { color:#a0a0a7; font-size:27px; line-height:1; }
.planogram-library-section > .workspace-empty-state[hidden] { display:none !important; }
.planogram-library-section > .workspace-empty-state { min-height:116px; }
.planogram-cloud-status {
  padding:5px 8px;
  border-radius:9px;
  background:rgba(118,118,128,.10);
  color:#77777e;
  font-size:10px;
  font-weight:720;
}
.planogram-cloud-status[data-state="ready"] { background:rgba(32,178,170,.12);color:#137f79; }
.planogram-cloud-status[data-state="error"] { background:rgba(215,62,54,.11);color:#b7322c; }
.cloud-library-toolbar {
  display:grid;
  grid-template-columns:minmax(170px,1fr) repeat(3,auto);
  gap:7px;
  padding:10px 12px;
  border-bottom:1px solid rgba(60,60,67,.08);
}
.cloud-library-toolbar button {
  min-height:38px;
  padding:0 10px;
  border:1px solid rgba(60,60,67,.12);
  border-radius:11px;
  background:#f7f8fa;
  color:#27272a;
  font-size:11px;
  font-weight:730;
}
.cloud-library-toolbar .workspace-primary-action { border-color:#20B2AA;background:#20B2AA;color:#fff; }
.cloud-library-search { min-width:0; }
.cloud-library-search input { min-width:0; }
.cloud-library-breadcrumb { display:flex;gap:2px;padding:8px 12px;overflow-x:auto;border-bottom:1px solid rgba(60,60,67,.08); }
.cloud-library-breadcrumb button { min-height:30px;padding:0 8px;border:0;border-radius:8px;background:transparent;color:#148e88;font-size:11px;font-weight:720;white-space:nowrap; }
.cloud-library-breadcrumb button:not(:last-child)::after { content:" ›";color:#a1a1a7; }
.cloud-library-breadcrumb button:disabled { color:#4b4b50;opacity:1; }
.cloud-library-row { display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;min-height:66px;border-bottom:1px solid rgba(60,60,67,.08); }
.cloud-library-row:last-child { border-bottom:0; }
.cloud-library-open { appearance:none;display:flex;min-width:0;min-height:64px;padding:9px 12px;align-items:center;gap:10px;border:0;background:transparent;color:#171719;text-align:left; }
.cloud-library-open > span:last-child { display:grid;min-width:0;gap:3px; }
.cloud-library-open strong,.cloud-library-open small { overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.cloud-library-open strong { font-size:13px; }
.cloud-library-open small { color:#85858c;font-size:9px; }
.cloud-library-icon { display:grid;width:38px;height:38px;flex:0 0 38px;place-items:center;border-radius:10px;background:rgba(32,178,170,.11);color:#148e88;font-size:9px;font-weight:850; }
.cloud-library-row.is-folder .cloud-library-icon { background:#e8f1ff;color:#3a76b9;font-size:17px; }
.cloud-library-actions { display:flex;padding:7px 10px 7px 0;align-items:center;gap:6px; }
.cloud-library-actions > button { min-height:34px;padding:0 8px;border:0;border-radius:9px;background:rgba(118,118,128,.09);color:#68686e;font-size:10px;font-weight:720; }
.cloud-library-actions .cloud-recycle-action { color:#b34039; }
.cloud-save-local { display:flex;min-height:34px;padding:0 8px;align-items:center;gap:5px;border-radius:9px;background:rgba(32,178,170,.10);color:#147d78;font-size:10px;font-weight:730;white-space:nowrap; }
.cloud-save-local input { width:17px;height:17px;accent-color:#20B2AA; }
.cloud-save-local.is-update { background:rgba(230,151,48,.13);color:#9a5d11; }
.cloud-trash-panel { position:fixed;z-index:740;inset:0;display:grid;padding:calc(var(--app-safe-top) + 12px) max(12px,var(--safe-right)) calc(var(--safe-bottom) + 12px) max(12px,var(--safe-left));place-items:end center;background:rgba(18,18,20,.34); }
.cloud-trash-panel[hidden] { display:none !important; }
.cloud-trash-sheet { display:grid;width:min(680px,100%);max-height:calc(var(--plano-viewport-height) - var(--app-safe-top) - var(--safe-bottom) - 24px);overflow:auto;border-radius:22px;background:#f7f7f8;box-shadow:0 22px 70px rgba(0,0,0,.28); }
.cloud-trash-sheet > header { position:sticky;z-index:1;top:0;display:flex;min-height:54px;padding:0 14px;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(60,60,67,.10);background:rgba(247,247,248,.96); }
.cloud-trash-sheet > header strong { font-size:18px; }
.cloud-trash-sheet > header button { min-height:34px;padding:0 11px;border:0;border-radius:17px;background:rgba(32,178,170,.13);color:#147f79;font-weight:760; }
.cloud-trash-sheet > p { margin:12px 14px;color:#77777d;font-size:11px;line-height:1.45; }
.cloud-trash-list { display:grid;padding:0 12px 12px; }
.cloud-trash-row { display:flex;min-height:58px;padding:8px 4px;align-items:center;gap:7px;border-bottom:1px solid rgba(60,60,67,.09); }
.cloud-trash-row > span { display:grid;min-width:0;flex:1;gap:2px; }
.cloud-trash-row strong,.cloud-trash-row small { overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.cloud-trash-row small { color:#85858c;font-size:9px; }
.cloud-trash-row button { min-height:34px;padding:0 9px;border:0;border-radius:9px;background:rgba(32,178,170,.12);color:#147f79;font-size:10px;font-weight:740; }
.cloud-trash-row .cloud-danger-action { background:rgba(215,62,54,.10);color:#b7322c; }
@media (max-width:620px) {
  .cloud-library-toolbar { grid-template-columns:1fr 1fr 1fr; }
  .cloud-library-search { grid-column:1 / -1; }
  .cloud-library-row { grid-template-columns:1fr; }
  .cloud-library-actions { padding:0 10px 9px 60px;justify-content:flex-start; }
}
.planogram-library-tools {
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:7px;
  padding:9px;
  border:1px solid rgba(60,60,67,.10);
  border-radius:18px;
  background:rgba(255,255,255,.78);
}
.planogram-library-tools button {
  appearance:none;
  display:grid;
  min-height:62px;
  padding:7px 5px 6px;
  place-items:center;
  align-content:center;
  gap:4px;
  border:1px solid rgba(0,0,0,.15);
  border-radius:12px;
  background:rgba(247,248,250,.96);
  box-shadow:0 4px 10px rgba(0,0,0,.10),inset 0 1px 0 rgba(255,255,255,.9);
  color:#1b1b1d;
  font-size:11px;
  font-weight:720;
}
.planogram-tool-icon {
  display:grid;
  width:29px;
  height:29px;
  place-items:center;
  border-radius:9px;
  background:rgba(32,178,170,.13);
  color:#158f89;
}
.planogram-tool-icon svg {
  width:20px;
  height:20px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.planogram-tool-name { line-height:1; white-space:nowrap; }
.planogram-library-tools button:active { transform:translateY(1px) scale(.985); }
@media (max-width:430px) { .planogram-library-tools { grid-template-columns:repeat(3,minmax(0,1fr)); } }

.viewer-selection-bar {
  position:fixed;
  z-index:225;
  top:calc(var(--app-safe-top) + 18px);
  left:calc(max(10px,var(--safe-left)) + 54px);
  right:calc(max(10px,var(--safe-right)) + 54px);
  display:flex;
  min-width:0;
  height:46px;
  align-items:center;
  gap:7px;
  /* The bar is almost entirely real controls (Planogram + Bay). Keeping
     pointer-events:none on the parent and re-enabling it on the children is
     unreliable on mobile Safari/WebKit, where taps can fail to reach the
     child button. Let the fixed control bar participate in hit testing
     normally; the tiny 7px gap simply behaves as outside-control space. */
  pointer-events:auto;
}
.viewer-dropdown-button {
  appearance:none;
  display:flex;
  min-width:0;
  height:46px;
  padding:0 13px;
  align-items:center;
  justify-content:center;
  gap:6px;
  border:1px solid rgba(255,255,255,.78);
  border-radius:23px;
  background:rgba(247,248,250,.97);
  box-shadow:0 8px 24px rgba(20,25,34,.15),inset 0 1px 0 rgba(255,255,255,.9);
  color:#111114;
  pointer-events:auto;
  font-size:13px;
  font-weight:740;
}
#planogram-select.viewer-dropdown-button { flex:1 1 auto; justify-content:flex-start; overflow:hidden; }
#planogram-select-label { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#top-bay-picker.viewer-dropdown-button { flex:0 0 auto; width:auto; min-width:82px; touch-action:manipulation; }
.viewer-dropdown-prefix { color:rgba(60,60,67,.58); font-size:10px; font-weight:700; }
.viewer-dropdown-button .top-bay-number { position:static; width:auto; transform:none; color:inherit; font-size:18px; font-weight:820; line-height:1; }
.viewer-dropdown-button .planogram-select-chevron { width:13px; height:13px; flex:0 0 13px; fill:none; stroke:currentColor; stroke-width:1.8; }
body:not(.plano-document-ready) .viewer-selection-bar,
body.labels-mode .viewer-selection-bar,
body.labels-entering .viewer-selection-bar,
body.labels-ready .viewer-selection-bar,
body.labels-leaving .viewer-selection-bar { display:none !important; }

.picture-snap-controls {
  position:absolute;
  z-index:4;
  left:max(7px,var(--safe-left));
  top:-27px;
  display:flex;
  height:34px;
  align-items:center;
  gap:3px;
  transform:translateY(-50%);
}
.picture-snap-controls[hidden] { display:none !important; }
.picture-snap-controls button {
  appearance:none;
  display:grid;
  width:24px;
  height:44px;
  padding:0;
  place-items:center;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.picture-snap-controls button span {
  display:block;
  width:7px;
  height:7px;
  border-radius:50%;
  background:rgba(60,60,67,.42);
  box-shadow:0 1px 2px rgba(255,255,255,.55);
}
.picture-snap-controls button.is-current span { width:9px; height:9px; background:#20B2AA; }
body.labels-ready .picture-shelf-pointer,
body.labels-mode .picture-shelf-pointer { transform:translateY(calc(-50% + 40px)); }

.insert-position-options { margin-bottom:10px; }
.insert-position-options[hidden] { display:none !important; }
.insert-position-buttons { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.insert-position-buttons button {
  min-height:42px;
  border:1px solid rgba(60,60,67,.14);
  border-radius:12px;
  background:rgba(247,248,250,.96);
  box-shadow:0 3px 8px rgba(0,0,0,.08),inset 0 1px 0 rgba(255,255,255,.9);
  color:#171719;
  font-size:12px;
  font-weight:700;
}
.insert-position-buttons button.active { background:#20B2AA; color:#fff; border-color:rgba(20,120,116,.42); }

 /* v11.0.40 professional home dashboard: Asana-like section cards with recent activity. */
.plano-home { background:#f7f7f8; }
.plano-home-content {
  width:min(720px,100%);
  padding:calc(var(--app-safe-top) + 26px) max(16px,var(--safe-right)) calc(var(--safe-bottom) + 30px) max(16px,var(--safe-left));
}
.plano-home-header { margin-bottom:20px; padding:0 4px; }
.plano-home-eyebrow { display:none; }
.plano-home-header h1 { font-size:34px; font-weight:760; letter-spacing:-.035em; }
.plano-home-dashboard { display:grid; gap:14px; }
.plano-home-settings { margin-top:24px; }
.plano-home-settings > h2 { margin:18px 4px 8px;color:#77777d;font-size:12px;font-weight:720;letter-spacing:.04em;text-transform:uppercase; }
.plano-home-settings-group { margin:0; }
.plano-home-settings .settings-file-detail { margin:10px 4px 0; }
.plano-home-card {
  overflow:hidden;
  border:1px solid rgba(60,60,67,.09);
  border-radius:24px;
  background:#fff;
  box-shadow:0 1px 2px rgba(0,0,0,.025);
}
.plano-home-card-header {
  appearance:none;
  display:flex;
  width:100%;
  min-height:76px;
  padding:15px 16px 13px;
  align-items:center;
  gap:13px;
  border:0;
  background:transparent;
  color:#171719;
  text-align:left;
}
.plano-home-card-header:active { background:rgba(118,118,128,.06); }
.plano-home-card-copy { display:grid; min-width:0; flex:1; gap:2px; }
.plano-home-card-copy strong { font-size:19px; font-weight:710; letter-spacing:-.018em; }
.plano-home-card-copy small { color:#75757b; font-size:12px; font-weight:500; line-height:1.25; }
.plano-home-card-chevron { color:#9b9ba1; font-size:30px; font-weight:300; line-height:1; transform:translateY(-1px); }
.plano-home-card .plano-home-icon {
  width:44px;
  height:44px;
  flex-basis:44px;
  border-radius:13px;
  box-shadow:none;
}
.plano-home-activity {
  padding:0 16px 13px 73px;
}
.plano-home-activity-label {
  display:block;
  margin:0 0 5px;
  color:#8b8b91;
  font-size:11px;
  font-weight:650;
  letter-spacing:.01em;
}
.plano-home-recent-list { display:grid; min-height:24px; }
.plano-home-recent-row {
  appearance:none;
  display:flex;
  width:100%;
  min-height:34px;
  padding:6px 0;
  align-items:center;
  gap:8px;
  overflow:hidden;
  border:0;
  border-top:1px solid rgba(60,60,67,.07);
  background:transparent;
  color:#242426;
  text-align:left;
}
.plano-home-recent-row:first-child { border-top:0; }
.plano-home-recent-row:active { opacity:.58; }
.plano-home-recent-row strong {
  min-width:0;
  flex:1;
  overflow:hidden;
  font-size:14px;
  font-weight:570;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.plano-home-recent-row small {
  flex:0 0 auto;
  color:#929298;
  font-size:10px;
  font-weight:520;
}
.plano-home-recent-dot {
  width:7px;
  height:7px;
  flex:0 0 7px;
  border-radius:50%;
  background:var(--plano-theme);
}
.plano-home-recent-empty { color:#a0a0a5; font-size:13px; line-height:24px; }
@media (max-width:520px) {
  .plano-home-dashboard { gap:12px; }
  .plano-home-card { border-radius:22px; }
  .plano-home-activity { padding-left:73px; }
}

/* v11.0.40 — every Plano surface begins below the iOS blur/safe boundary. */
#viewer {
  top:var(--app-safe-top);
  height:calc(var(--plano-viewport-height) - var(--app-safe-top));
}
#labels-workspace.plano10-labels-workspace {
  top:var(--app-safe-top);
  height:calc(var(--plano-viewport-height) - var(--app-safe-top));
}
.selection-panel,
.edit-bin-panel,
.restore-confirm-panel {
  padding-top:var(--app-safe-top);
}

/* Account replaces the settings block that previously lived directly on Home. */
.plano-auth-gate {
  position:fixed;
  z-index:2000;
  inset:0;
  display:grid;
  padding:calc(var(--app-safe-top) + 18px) max(16px,var(--safe-right)) calc(var(--safe-bottom) + 18px) max(16px,var(--safe-left));
  place-items:center;
  overflow:auto;
  background:linear-gradient(145deg,#f2fbfa 0%,#f7f7f8 48%,#eef3f8 100%);
}
.plano-auth-gate[hidden] { display:none !important; }
.plano-auth-card { display:grid;width:min(430px,100%);padding:28px;gap:13px;border:1px solid rgba(60,60,67,.10);border-radius:28px;background:rgba(255,255,255,.94);box-shadow:0 24px 70px rgba(38,60,66,.16); }
.plano-auth-brand { display:grid;width:52px;height:52px;place-items:center;border-radius:16px;background:#20B2AA;color:#fff;font-size:27px;font-weight:850;box-shadow:0 9px 22px rgba(32,178,170,.28); }
.plano-auth-card h1 { margin:0;font-size:29px;letter-spacing:-.035em; }
.plano-auth-intro,.plano-auth-replacement p { margin:0;color:#6f7076;font-size:12px;line-height:1.5; }
.plano-auth-form,.plano-auth-replacement { display:grid;gap:9px; }
.plano-auth-replacement[hidden] { display:none !important; }
.plano-auth-form label { font-size:11px;font-weight:730;color:#55565b; }
.plano-auth-form input { min-height:48px;padding:0 13px;border:1px solid rgba(60,60,67,.18);border-radius:13px;background:#f8f8fa;font-size:17px;outline:none; }
.plano-auth-form input:focus { border-color:#20B2AA;box-shadow:0 0 0 3px rgba(32,178,170,.13); }
.plano-auth-form .workspace-primary-action,.plano-auth-replacement .workspace-primary-action { min-height:47px;border:0;border-radius:13px;background:#20B2AA;color:#fff;font-size:14px;font-weight:790; }
.plano-auth-secondary { min-height:38px;border:0;background:transparent;color:#148e88;font-weight:720; }
.plano-auth-status { min-height:18px;margin:0;color:#6f7076;font-size:11px;line-height:1.4;text-align:center; }
.plano-auth-status[data-state="error"] { color:#b7322c; }
.plano-auth-device-list { display:grid;gap:7px; }
.plano-auth-device-row { display:flex;min-height:54px;padding:8px 10px;align-items:center;gap:10px;border:1px solid rgba(60,60,67,.12);border-radius:13px;background:#f8f8fa; }
.plano-auth-device-row input { width:19px;height:19px;accent-color:#20B2AA; }
.plano-auth-device-row span { display:grid;gap:2px; }
.plano-auth-device-row small { color:#77777d;font-size:10px; }
.plano-account-identity .settings-row-label { display:grid;gap:2px; }
.plano-account-identity .settings-row-label strong { overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
[data-plano-owner-only][hidden] { display:none !important; }
.plano-home-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.plano-account-button {
  appearance:none;
  display:flex;
  min-height:42px;
  padding:0 13px;
  align-items:center;
  gap:6px;
  border:1px solid rgba(60,60,67,.10);
  border-radius:21px;
  background:#fff;
  box-shadow:0 2px 8px rgba(0,0,0,.06),inset 0 1px 0 rgba(255,255,255,.9);
  color:#1d1d1f;
  font-size:13px;
  font-weight:690;
}
.plano-account-button svg { width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round; }
.plano-account-panel {
  position:fixed;
  z-index:510;
  inset:0;
  width:100%;
  height:var(--plano-viewport-height);
  margin:0 !important;
  padding:var(--app-safe-top) max(10px,var(--safe-right)) var(--safe-bottom) max(10px,var(--safe-left));
  overflow:hidden;
  background:#f7f7f8;
}
.plano-account-panel[hidden] { display:none !important; }
.plano-account-sheet {
  display:grid;
  width:min(720px,100%);
  height:calc(var(--plano-viewport-height) - var(--app-safe-top) - var(--safe-bottom));
  margin:0 auto;
  grid-template-rows:52px minmax(0,1fr);
  overflow:hidden;
}
.plano-account-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 4px;
  border-bottom:1px solid rgba(60,60,67,.10);
}
.plano-account-header strong { font-size:20px;font-weight:760;letter-spacing:-.02em; }
.plano-account-header button { min-height:36px;padding:0 12px;border:0;border-radius:18px;background:rgba(32,178,170,.12);color:#158f89;font-size:14px;font-weight:760; }
.plano-account-scroll { min-height:0;overflow:auto;padding:2px 0 28px;overscroll-behavior:contain;-webkit-overflow-scrolling:touch; }
.plano-account-panel.plano-home-settings > h2 { margin-top:18px; }
.plano-account-scroll > h2 { margin:18px 4px 8px;color:#77777d;font-size:12px;font-weight:720;letter-spacing:.04em;text-transform:uppercase; }
.plano-account-scroll .settings-file-detail { margin:10px 4px 0; }

/* v11.0.47 — task-owned controls, Labels totals, presets and local-library swipes. */
#labels-focus-meta{display:flex;align-items:flex-start;gap:10px}
#labels-focus-meta .labels-description-field{min-width:0;flex:1 1 auto}
.labels-count-box{display:flex;align-items:center;margin:-2px 0 0 auto;color:#101114;flex:0 0 auto}
.labels-count-column{display:grid;min-width:46px;text-align:center;line-height:1}
.labels-count-column small{font-size:8px;line-height:1.1;text-transform:uppercase;letter-spacing:.08em;color:#278f89;font-weight:800;margin-bottom:3px}
.labels-count-column strong{font-size:24px;line-height:1;font-weight:850;font-variant-numeric:tabular-nums}
.labels-current-check{width:31px;height:31px;border:1.5px solid #20B2AA;border-radius:9px;background:#20B2AA;color:#fff;display:grid;place-items:center;flex:0 0 31px;pointer-events:none}
.labels-current-check svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.labels-current-check .selection-glyph-x{display:none}
.labels-current-check[data-selection-mode="skip"] .selection-glyph-check{display:none}
.labels-current-check[data-selection-mode="skip"] .selection-glyph-x{display:block}
.labels-current-check[data-selection-mode="only"]{background:#fff;color:#20B2AA}
.labels-current-check[data-selection-mode="only"] .selection-glyph-check{display:block}
.labels-current-check[data-selection-mode="only"] .selection-glyph-x{display:none}
.labels-count-settings{display:grid;gap:12px;padding:12px;border-radius:16px;background:rgba(255,255,255,.72)}
.labels-count-settings-heading,.tool-preset-heading,.labels-preset-heading,.sequence-move-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.labels-count-settings-heading small,.tool-preset-heading small,.sequence-move-heading small{font-size:10px;color:#737780}
#labels-advanced-toggle{border:0;background:rgba(32,178,170,.12);color:#137d78;border-radius:9px;padding:7px 9px;font-weight:750}
.labels-filter-options{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.labels-filter-options button{border:1px solid rgba(0,0,0,.08);border-radius:11px;background:#fff;padding:8px 5px;display:grid;gap:4px;place-items:center;font-size:10px}.labels-filter-options button[aria-checked="true"]{outline:2px solid rgba(32,178,170,.5)}
.labels-mode-symbol{width:18px;height:18px;border-radius:5px;border:1px solid #20B2AA;background:#20B2AA;color:#fff;display:grid;place-items:center}.labels-mode-symbol.only{background:#fff;border-color:#20B2AA;color:#20B2AA}.labels-mode-symbol.skip{background:#20B2AA;border-color:#20B2AA;color:#fff}
.labels-count-summary-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}.labels-count-summary-grid div{background:#f5f6f7;border-radius:10px;padding:8px;display:grid;gap:2px}.labels-count-summary-grid span{font-size:9px;color:#6e737a}.labels-count-summary-grid strong{font-size:17px;font-variant-numeric:tabular-nums}
.labels-bay-totals-wrap{display:grid;gap:6px}.labels-bay-totals-wrap>strong{font-size:10px;color:#6e737a}.labels-bay-totals{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px}.labels-bay-totals>div{flex:0 0 auto;min-width:62px;background:#f5f6f7;border-radius:10px;padding:7px 9px;display:grid;gap:2px}.labels-bay-totals span{font-size:9px;color:#6e737a}.labels-bay-totals strong{font-size:15px;font-variant-numeric:tabular-nums}
.tool-preset-editor,.labels-preset-editor,.labels-advanced-panel{display:grid;gap:8px}.tool-preset-list,.sequence-move-list{display:grid;gap:6px}.tool-preset-row,.sequence-move-row{display:flex;align-items:center;gap:6px;border-radius:10px;background:#f5f6f7;overflow:hidden}.tool-preset-row>button:first-child{flex:1;border:0;background:transparent;display:flex;align-items:center;gap:7px;padding:9px;text-align:left}.preset-check{display:grid;place-items:center;width:20px;height:20px;border-radius:6px;background:#20b2aa;color:#fff;font-weight:900}.preset-delete,.sequence-move-row>button{border:0;background:transparent;padding:8px 11px;font-size:18px;color:#71757b}.tool-preset-create,.sequence-move-create{display:flex;gap:6px}.tool-preset-create input,.sequence-move-create input,.sequence-move-create select{min-width:0;flex:1;border:1px solid rgba(0,0,0,.12);border-radius:9px;padding:8px;background:#fff}.tool-preset-create button,.sequence-move-create button{border:0;border-radius:9px;background:#20b2aa;color:#fff;padding:8px 10px;font-weight:750}.sequence-move-row>span{flex:1;padding:8px;display:flex;gap:5px}.sequence-move-row small{text-transform:capitalize;color:#777}
.selection-tool-toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 4px}.selection-tool-toggle>span:first-child{display:grid;gap:2px}.selection-tool-toggle small{font-size:10px;color:#777}
.row-selection-tool.is-disabled{filter:grayscale(1);opacity:.42}
#labels-focus-seq[data-moved="true"]:after{content:' MOVED';font-size:8px;color:#e0731e;vertical-align:top;margin-left:4px;letter-spacing:.04em}
.selection-create-preview{display:flex;justify-content:space-between;gap:12px;padding:11px;border-radius:12px;background:rgba(32,178,170,.09)}
.planogram-library-swipe{position:relative;overflow:hidden;border-radius:14px}.planogram-library-swipe-actions{position:absolute;inset:0 0 0 auto;display:flex;justify-content:flex-end;background:#dadcdf}.planogram-library-swipe-actions button{width:70px;border:0;color:#fff;font-weight:750}.planogram-library-swipe-actions button[data-planogram-swipe-action="export"]{background:#6d7885}.planogram-library-swipe-actions button[data-planogram-swipe-action="move"]{background:#20a7a0}.planogram-library-swipe-actions button[data-planogram-swipe-action="delete"]{background:#d94a43}.planogram-library-swipe .planogram-library-row{position:relative;z-index:1;width:100%;transition:transform .2s ease;background:var(--workspace-card,#fff)}
/* Fullscreen is one state: every non-document chrome leaves together. */
body.viewer-immersive:not(.labels-mode):not(.labels-entering):not(.labels-ready) #viewer-selection-bar,
body.viewer-immersive:not(.labels-mode):not(.labels-entering):not(.labels-ready) #topbar,
body.viewer-immersive:not(.labels-mode):not(.labels-entering):not(.labels-ready) #bay-strip,
body.viewer-immersive:not(.labels-mode):not(.labels-entering):not(.labels-ready) #row-selection-tool,
body.viewer-immersive:not(.labels-mode):not(.labels-entering):not(.labels-ready) #page-edge-tab,
body.viewer-immersive:not(.labels-mode):not(.labels-entering):not(.labels-ready) #picture-divider,
body.viewer-immersive:not(.labels-mode):not(.labels-entering):not(.labels-ready) #workspace-home-button,
body.viewer-immersive:not(.labels-mode):not(.labels-entering):not(.labels-ready) #picture-page-selector{opacity:0!important;pointer-events:none!important;transform:translateY(-14px);transition:opacity .18s ease,transform .18s ease}
.labels-total-scope-control{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:11px}.labels-total-scope-control select{border:1px solid rgba(0,0,0,.12);border-radius:9px;background:#fff;padding:7px 9px}
.labels-count-open{appearance:none;border:0;background:transparent;color:inherit;display:flex;align-items:center;gap:9px;padding:0}

/* v11.0.47 correction pass — tool ownership, mobile sheets, list preview and idle viewer boundary. */
:root { --idle-document-top-gap:64px; }
body.plano-document-ready:not(.picture-split-open):not(.labels-mode):not(.labels-entering):not(.labels-ready):not(.labels-leaving) #pdf-stack::before {
  content:"";
  display:block;
  width:1px;
  height:var(--idle-document-top-gap);
  pointer-events:none;
}
body.plano-document-ready:not(.picture-split-open):not(.labels-mode):not(.labels-entering):not(.labels-ready):not(.labels-leaving) #pdf-stack {
  overflow-anchor:none;
}

.row-selection-tool {
  min-width:52px;
  min-height:52px;
  padding:0 !important;
  border:1px solid rgba(20,120,116,.50) !important;
  border-radius:26px !important;
  background:#20B2AA !important;
  color:#fff !important;
  box-shadow:0 4px 12px rgba(0,0,0,.16),0 1px 5px rgba(32,178,170,.28),inset 0 1px 0 rgba(255,255,255,.28) !important;
  transform-origin:left center;
}
.row-selection-tool .selection-glyph-x{display:none}
.row-selection-tool[data-selection-mode="skip"] .selection-glyph-check{display:none}
.row-selection-tool[data-selection-mode="skip"] .selection-glyph-x{display:block}
.row-selection-tool[data-selection-mode="only"]{background:#fff !important;color:#20B2AA !important;border-color:#20B2AA !important}
.row-selection-tool[data-selection-mode="only"] .selection-glyph-check{display:block}
.row-selection-tool[data-selection-mode="only"] .selection-glyph-x{display:none}
.row-selection-tool.is-disabled { opacity:.55; filter:grayscale(.7); }
body.labels-mode .row-selection-tool,
body.labels-entering .row-selection-tool,
body.labels-ready .row-selection-tool { display:none !important; }

#barcode-options-panel.labels-modal-panel,
#barcode-options-panel {
  box-sizing:border-box;
  position:fixed !important;
  inset:0 !important;
  z-index:2140 !important;
  place-items:start center;
  padding:calc(var(--app-safe-top, 0px) + 8px) max(10px,var(--safe-right,0px)) calc(var(--safe-bottom,0px) + 10px) max(10px,var(--safe-left,0px));
  overflow:hidden;
  background:rgba(0,0,0,.22);
}
#barcode-options-panel:not([hidden]) { display:grid !important; }
#barcode-options-panel .barcode-options-card {
  box-sizing:border-box;
  width:min(520px,calc(100vw - max(10px,var(--safe-left,0px)) - max(10px,var(--safe-right,0px)) - 4px));
  max-height:calc(100dvh - var(--app-safe-top,0px) - var(--safe-bottom,0px) - 20px);
  overflow:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-y;
  padding:14px;
}
.labels-count-open {
  min-height:54px;
  padding:6px 27px 6px 8px !important;
  position:relative;
  border:1px solid rgba(32,178,170,.34) !important;
  border-radius:14px !important;
  background:rgba(32,178,170,.07) !important;
}
.labels-count-open::after { content:"›"; position:absolute; right:9px; top:50%; transform:translateY(-52%); color:#147e79; font-size:22px; font-weight:800; }
.labels-filter-options button,.tool-preset-row button,.sequence-move-row button { touch-action:manipulation; }
#labels-advanced-toggle::after { content:"⌄"; margin-left:3px; }
#labels-advanced-toggle[aria-expanded="true"]::after { content:"⌃"; }
.labels-advanced-panel[hidden] { display:none !important; }
.sequence-move-create { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:7px; }
.sequence-move-create input:first-child { grid-column:1; }
.sequence-move-create select { grid-column:2; min-width:90px; }
.sequence-move-create input:nth-of-type(2) { grid-column:1; }
.sequence-move-create button { grid-column:2; }

.labels-options-sheet,.beep-calibration-sheet,.planogram-options-sheet { padding-bottom:18px; max-height:min(84dvh,760px); overflow:auto; }
.labels-tool-settings { margin:8px 0 14px; }
.planogram-options-list { display:grid; gap:8px; }
.planogram-options-list > button {
  width:100%; min-height:58px; padding:10px 12px; border:0; border-radius:14px; background:#f3f4f6;
  display:flex; align-items:center; justify-content:space-between; gap:12px; text-align:left; color:#111;
}
.planogram-options-list > button span { display:grid; gap:2px; }
.planogram-options-list > button strong { font-size:15px; }
.planogram-options-list > button small { color:#6b7280; font-size:11px; }
.planogram-options-list > button svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; }

.selection-items-source { display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 11px;border-radius:13px;background:#f5f6f7; }
.selection-items-source > div { display:grid;gap:2px;min-width:0; }
.selection-items-source strong { font-size:14px; }
.selection-items-source small { font-size:10px;color:#72767d; }
.selection-items-source button { flex:0 0 auto;border:0;border-radius:10px;background:rgba(32,178,170,.13);color:#147d78;padding:9px 11px;font-weight:800; }
.selection-create-preview { display:grid; gap:8px; animation:selection-preview-unfold 260ms cubic-bezier(.2,.82,.2,1) both; }
#selection-create-preview[hidden],#selection-create-preview-loading[hidden],#selection-create-preview-pages[hidden]{display:none!important;}
.selection-create-preview-heading { display:flex; justify-content:space-between; gap:8px; align-items:baseline; }
.selection-create-preview-loading { min-height:92px;display:flex;align-items:center;justify-content:center;gap:10px;border:1px solid rgba(32,178,170,.20);border-radius:12px;background:rgba(32,178,170,.055);font-size:11px;font-weight:750;color:#3f6966; }
.selection-create-preview-pages { display:grid; gap:8px; max-height:min(46vh,430px); overflow:auto; overscroll-behavior:contain; padding:6px; border:1px solid rgba(0,0,0,.13); border-radius:12px; background:#eceff1; }
.selection-create-preview-page { position:relative;overflow:hidden;border-radius:7px;background:white;box-shadow:0 1px 4px rgba(0,0,0,.16); }
.selection-create-preview-canvas { display:block; width:100%; height:auto; background:white; }
@keyframes selection-preview-unfold { from { opacity:0;transform:translateY(10px) scaleY(.92);transform-origin:bottom; } to { opacity:1;transform:none; } }
#row-selection-panel .selection-sheet { transform-origin:left bottom; }
#row-selection-panel.is-opening .selection-sheet { animation:checkbox-drop-open 330ms cubic-bezier(.18,.82,.18,1) both; }
#row-selection-panel.is-closing .selection-sheet { animation:checkbox-drop-close 300ms cubic-bezier(.4,0,.5,1) both; }
@keyframes checkbox-drop-open { 0% { opacity:.2;clip-path:inset(calc(100% - 54px) calc(100% - 54px) 0 0 round 27px);transform:translateY(12px) scale(.94);border-radius:30px 42% 42% 30px; } 48% { opacity:1;clip-path:inset(36% 48% 0 0 round 24px);transform:translateY(0) scale(.98,1.02);border-radius:28px 46% 42% 28px; } 100% { opacity:1;clip-path:inset(0 round 0);transform:none;border-radius:var(--selection-sheet-radius,20px); } }
@keyframes checkbox-drop-close { 0% { opacity:1;clip-path:inset(0 round 0);transform:none;border-radius:var(--selection-sheet-radius,20px); } 52% { opacity:.9;clip-path:inset(34% 46% 0 0 round 24px);transform:scale(.98,1.02);border-radius:28px 46% 42% 28px; } 100% { opacity:0;clip-path:inset(calc(100% - 54px) calc(100% - 54px) 0 0 round 27px);transform:translateY(12px) scale(.94);border-radius:30px 42% 42% 30px; } }
@media (prefers-reduced-motion:reduce) { #row-selection-panel.is-opening .selection-sheet,#row-selection-panel.is-closing .selection-sheet,.selection-create-preview { animation:none; } }

@media (max-width:390px) {
  #barcode-options-panel .barcode-options-card { padding:12px; }
  .labels-count-settings { padding:10px; }
  .labels-filter-options { gap:5px; }
  .labels-filter-options button { min-width:0; padding:8px 3px; }
  .tool-preset-create { display:grid; grid-template-columns:minmax(0,1fr) auto; }
}

/*
 * Plano unified controller
 *
 * One persistent bottom control morphs between Idle, Search, Navigation and
 * Labels. The adjustable Picture divider remains an independent resize seam.
 */

:root {
  --controller-height: 46px;
  --controller-bottom: max(8px, var(--safe-bottom));
  --controller-radius: 22px;
  --controller-ink: rgba(20, 20, 23, .94);
  --controller-secondary: rgba(60, 60, 67, .64);
  --controller-theme: var(--plano-theme);
  --controller-theme-rgb: var(--plano-theme-rgb);
  --controller-blue: var(--controller-theme);
  --controller-surface-fill: rgba(247, 248, 250, .97);
  --controller-panel: rgba(248, 249, 252, .98);
  --controller-border: rgba(255, 255, 255, .82);
  --controller-divider: rgba(60, 60, 67, .14);
  --controller-shadow: 0 12px 34px rgba(25, 30, 40, .20), 0 2px 7px rgba(25, 30, 40, .10);
  --controller-bubble-height: 46px;
  --controller-bubble-radius: 23px;
  --controller-bubble-gap: 7px;
  --controller-idle-width: 46px;
  --controller-idle-height: 46px;
  --controller-search-width: min(424px,calc(100vw - max(8px,var(--safe-left)) - max(8px,var(--safe-right))));
  --plano10-keyboard-height: 218px;
  --plano-keyboard-visible-height: calc(var(--plano10-keyboard-height) + var(--safe-bottom));
}

/* The PDF owns the space formerly reserved by the old top and centre bars. */
body:not(.labels-mode):not(.labels-entering):not(.labels-ready):not(.labels-leaving) #topbar.plano10-topbar {
  display: none !important;
}
body:not(.picture-split-open):not(.labels-mode):not(.labels-entering):not(.labels-ready):not(.labels-leaving) #pdf-stack {
  padding-bottom: calc(var(--safe-bottom) + var(--controller-height) + 24px) !important;
}

/* Picture split: a narrow movable divider only. */
#shelf-resize-handle {
  all:unset;
  box-sizing:border-box;
  display:grid;
  position:absolute;
  left:50%;
  bottom:0;
  width:96px;
  height:44px;
  transform:translate(-50%,0);
  place-items:center;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  cursor:ns-resize;
  touch-action:none;
}
#shelf-resize-handle span {
  width:44px !important;
  height:4.5px !important;
  border-radius:999px;
  background:rgba(60,60,67,.42) !important;
  box-shadow:0 1px 0 rgba(255,255,255,.55) !important;
  transition:width 140ms ease,background 140ms ease,box-shadow 140ms ease,transform 140ms ease;
}
#picture-divider.is-dragging #shelf-resize-handle span {
  width:50px !important;
  background:rgba(32,178,170,.96) !important;
  box-shadow:0 1px 4px rgba(32,178,170,.30) !important;
  transform:scaleY(1.08);
}
#shelf-resize-handle:focus-visible {
  outline:2px solid rgba(0,122,255,.48);
  outline-offset:-6px;
  border-radius:999px;
}

/* Checkbox Tool lives at the bottom-left in Idle and Labels. Hidden means it
   occupies no space; the central controller keeps its normal responsive fit. */
.row-selection-tool {
  position:fixed;
  z-index:212;
  left:max(8px,var(--safe-left));
  bottom:var(--controller-bottom);
  display:flex;
  height:52px;
  width:52px;
  padding:0;
  align-items:center;
  justify-content:flex-start;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.88);
  border-radius:26px;
  background:rgba(247,248,250,.94);
  box-shadow:0 7px 20px rgba(17,30,34,.22),0 2px 7px rgba(32,178,170,.26),inset 0 1px 0 rgba(255,255,255,.38);
  color:var(--controller-ink);
  transition:width 280ms cubic-bezier(.22,.78,.2,1),opacity 180ms ease,transform 180ms ease,box-shadow 180ms ease;
  -webkit-backdrop-filter:blur(26px) saturate(170%);
  backdrop-filter:blur(26px) saturate(170%);
}
.row-selection-tool[hidden] { display:none !important; }
.row-selection-tool .row-selection-tool-icon {
  box-sizing:border-box;
  flex:0 0 34px;
  width:34px;
  height:34px;
  margin-left:9px;
  padding:0;
  fill:none;
  stroke:currentColor;
  stroke-width:2.35;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.row-selection-tool .row-selection-complete-text { display:none;padding:0 14px 0 8px;font-size:13px;font-weight:820;white-space:nowrap; }
.row-selection-tool.is-announcing { transform:scale(1.04); }
body.labels-mode .row-selection-tool,
body.labels-ready .row-selection-tool,
body.labels-entering .row-selection-tool { left:max(8px,var(--safe-left)); }

body.row-selection-visible #control-shelf.plano-controller:not([data-state="labels"]) {
  max-width:calc(100vw - max(8px,var(--safe-left)) - max(8px,var(--safe-right)) - 60px);
}

/* Unified floating controller. */
#control-shelf.plano-controller {
  position: fixed;
  z-index: 210;
  right: max(8px, var(--safe-right));
  bottom: var(--controller-bottom);
  left: auto;
  display: block;
  width: auto;
  max-width: calc(100vw - max(8px,var(--safe-left)) - max(8px,var(--safe-right)));
  opacity: 1;
  pointer-events: auto;
  transform: none;
  transition: bottom 430ms cubic-bezier(.22,.84,.24,1), opacity 190ms ease, transform 430ms cubic-bezier(.22,.84,.24,1);
}
body:not(.plano-document-ready) #control-shelf,
body.viewer-immersive:not(.labels-mode):not(.labels-entering):not(.labels-ready) #control-shelf {
  opacity: 0;
  pointer-events: none;
  transform: translateY(18px) scale(.92);
}
body.plano-keyboard-open #control-shelf {
  bottom: calc(var(--plano-keyboard-visible-height) + 8px);
}

.shelf-control,
#navigation-controls button,
#labels-control-dock .control-button {
  all: unset;
  box-sizing: border-box;
  position: relative;
  display: grid;
  min-width: 0;
  height: var(--controller-bubble-height);
  place-items: center;
  border-radius: var(--controller-bubble-radius);
  color: var(--controller-ink);
  cursor: pointer;
  transition: background 180ms ease, color 180ms ease, opacity 180ms ease, transform 160ms ease;
}
.shelf-control:active,
#navigation-controls button:active,
#labels-control-dock .control-button:active { transform: scale(.92); }
.shelf-control svg,
#navigation-controls svg,
#labels-control-dock svg {
  width: 24px;
  height: 24px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.25;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.shelf-round-control {
  width: 46px;
  flex: 0 0 46px;
}
.shelf-icon-control {
  width: 46px;
  flex: 0 0 46px;
}
.shelf-icon-control:active { background: rgba(255,255,255,.30); }
#navigation-controls[hidden] { display: none !important; }
body.navigation-mode #navigation-controls[hidden] { display: grid !important; }

/* Labels / barcode controls use the same four-bubble language as the rest of
   the Version 11 controller: (X) (Previous/Back) (Next) (Mic · Settings). */
#labels-control-dock {
  position: static !important;
  display: flex !important;
  width: auto !important;
  height: var(--controller-bubble-height) !important;
  min-width: 0;
  flex: 1 1 auto;
  order: 2;
  align-items: stretch;
  justify-content: space-between;
  gap: var(--controller-bubble-gap) !important;
  pointer-events: auto !important;
  transform: none !important;
}
#labels-history-stack {
  position: relative;
  display: block !important;
  width: 86px;
  height: var(--controller-bubble-height);
  flex: 0 0 86px;
  overflow: hidden;
  border-radius: var(--controller-bubble-radius);
  pointer-events: auto !important;
}
#labels-history-stack .control-button {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0 !important;
  border: 0 !important;
  border-radius: inherit !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--controller-ink) !important;
}
#labels-history-stack .control-button::before,
#labels-history-stack .control-button::after,
#labels-next::before,
#labels-next::after,
#labels-side-stack .control-button::before,
#labels-side-stack .control-button::after { display: none !important; content: none !important; }
#labels-previous {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
#labels-next {
  position:relative;
  width: min(33vw, 160px) !important;
  height: var(--controller-bubble-height) !important;
  min-width:58px;
  min-height:46px;
  padding: 0 !important;
  flex: 0 0 min(33vw, 160px);
  border: 1px solid rgba(255,255,255,.76) !important;
  border-radius: var(--controller-bubble-radius) !important;
  background: rgba(247,248,250,.97) !important;
  box-shadow: 0 8px 24px rgba(25,30,40,.15), 0 1px 4px rgba(32,178,170,.09), inset 0 1px 0 rgba(255,255,255,.88), inset 0 -1px 0 rgba(105,110,120,.06) !important;
  color: var(--controller-ink) !important;
  touch-action:none;
  transition:box-shadow 180ms ease,background 180ms ease,border-color 180ms ease;
}
#labels-next > .labels-next-arrow { width:24px;height:24px;stroke-width:2.25; }
.labels-next-layout-hint { position:absolute;right:6px;top:50%;width:19px;height:24px;transform:translateY(-50%);opacity:.84;pointer-events:none; }
.labels-next-layout-hint img { display:block;width:100%;height:100%;object-fit:contain; }
.labels-next-edit-glyph { display:none;pointer-events:none;align-items:center;justify-content:center;gap:5px;color:#0d756f; }
.labels-next-edit-glyph svg { width:23px !important;height:23px !important;fill:none;stroke:currentColor;stroke-width:1.8 !important;stroke-linecap:round;stroke-linejoin:round; }
.labels-next-edit-glyph small { font-size:8px;font-weight:900;letter-spacing:.05em; }
.labels-next-resize-copy { display:none;position:absolute;right:31px;bottom:8px;padding:3px 5px;border-radius:7px;background:rgba(255,255,255,.90);color:#0d756f;font-size:8px;font-weight:850;line-height:1;white-space:nowrap;pointer-events:none; }
.labels-next-resize-handle { display:none;position:absolute;right:3px;bottom:3px;width:30px;height:30px;padding:4px;border:0;border-radius:8px;place-items:center;pointer-events:auto;touch-action:none;box-sizing:border-box; }
.labels-next-resize-handle img { display:block;width:22px;height:22px;object-fit:contain;pointer-events:none; }
body.labels-next-detached #labels-next { position:fixed !important;z-index:2115 !important;left:var(--labels-next-left) !important;top:var(--labels-next-top) !important;width:var(--labels-next-width) !important;height:var(--labels-next-height) !important;flex:none !important;margin:0 !important; }
body.labels-next-detached #labels-history-stack { width:auto;flex:1 1 auto; }
body.labels-next-customizing #labels-next { border-color:#20B2AA !important;background:rgba(235,255,253,.98) !important;box-shadow:0 0 0 3px rgba(32,178,170,.22),0 9px 28px rgba(32,178,170,.28) !important; }
body.labels-next-customizing #labels-next .labels-next-arrow,
body.labels-next-customizing #labels-next .labels-next-layout-hint { display:none; }
body.labels-next-customizing #labels-next .labels-next-edit-glyph { display:flex; }
body.labels-next-customizing #labels-next .labels-next-resize-copy { display:block; }
body.labels-next-customizing #labels-next .labels-next-resize-handle { display:grid; }
#labels-side-stack {
  display: grid !important;
  width: 100px !important;
  height: var(--controller-bubble-height) !important;
  flex: 0 0 100px;
  grid-template-columns: 1fr 1fr !important;
  grid-template-rows: 1fr !important;
  gap: 0 !important;
  overflow: hidden;
  border-radius: var(--controller-bubble-radius);
}
#labels-side-stack .control-button {
  width: 50px !important;
  height: var(--controller-bubble-height) !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--controller-ink) !important;

}
#labels-side-stack .control-button + .control-button { border-left: 0 !important; }
#labels-side-stack svg,
#labels-history-stack svg { width: 24px; height: 24px; stroke-width: 2.25; }
#labels-control-dock.orientation-turning #labels-previous svg,
#labels-control-dock.orientation-turning #labels-next > .labels-next-arrow,
#labels-control-dock.orientation-turning #labels-listen svg,
#labels-control-dock.orientation-turning #labels-more svg {
  animation: plano-label-symbol-turn 560ms cubic-bezier(.2,.8,.2,1);
}
#labels-control-dock[data-orientation="landscape"] #labels-previous svg,
#labels-control-dock[data-orientation="landscape"] #labels-next > .labels-next-arrow,
#labels-control-dock[data-orientation="landscape"] #labels-listen svg,
#labels-control-dock[data-orientation="landscape"] #labels-more svg {
  transform: rotate(var(--labels-symbol-angle,0deg));
}
@keyframes plano-label-symbol-turn {
  45% { transform: rotate(var(--labels-symbol-turn,90deg)) scale(.9); }
  100% { transform: rotate(var(--labels-symbol-angle,0deg)); }
}
#labels-listen[aria-pressed="true"] {
  background: rgba(32,178,170,.13) !important;
  color: var(--controller-theme) !important;
}
#labels-listen[aria-pressed="true"]::after {
  position: absolute;
  top: 7px;
  right: 7px;
  display: block !important;
  width: 7px;
  height: 7px;
  border: 1.5px solid rgba(255,255,255,.95);
  border-radius: 50%;
  background: #34c759;
  box-shadow: 0 0 0 2px rgba(52,199,89,.18);
  content: "" !important;
}
/* Copy behavior is shared by the main Settings screen and a long-press
   popover anchored to the selected-result Copy button. */
.copy-behavior-popover {
  position: fixed;
  z-index: 225;
  width: min(238px, calc(100vw - 20px));
  padding: 12px;
  border: 1px solid rgba(255,255,255,.76);
  border-radius: 20px;
  background: var(--controller-panel);
  box-shadow: 0 16px 44px rgba(20,25,34,.24), inset 0 1px 0 rgba(255,255,255,.84);
  color: var(--controller-ink);

}
.copy-behavior-popover[hidden] { display:none !important; }
.copy-behavior-popover > strong { display:block; font-size:14px; font-weight:720; }
.copy-behavior-popover > small { display:block; margin:2px 0 10px; color:var(--controller-secondary); font-size:10px; }
.copy-behavior-choices {
  display:grid;
  width:100%;
  padding:2px;
  grid-template-columns:1fr 1fr;
  gap:2px;
  border-radius:12px;
  background:rgba(118,118,128,.15);
}
.copy-behavior-choices button {
  min-width:0;
  height:30px;
  padding:0 10px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:var(--controller-secondary);
  font-size:11px;
  font-weight:680;
}
.copy-behavior-choices button[aria-pressed="true"],
.copy-behavior-choices button.is-selected {
  background:rgba(255,255,255,.82);
  box-shadow:0 1px 4px rgba(20,25,34,.12);
  color:var(--controller-ink);
}

/* Planogram dropdown and independent top-right bay selector. */
.shelf-corner-tools {
  position: fixed;
  z-index: 230;
  top: calc(var(--app-safe-top) + 18px);
  right: max(10px, var(--safe-right));
  display: flex;
  align-items: center;
  gap: 7px;
  transition: opacity 220ms ease, transform 360ms cubic-bezier(.2,.82,.2,1);
}
.shelf-corner-button,
.top-bay-picker {
  all: unset;
  box-sizing: border-box;
  display: grid;
  width: 46px;
  height: 46px;
  place-items: center;
  border: 1px solid rgba(255,255,255,.76);
  border-radius: 23px;
  background: rgba(247,248,250,.97);
  box-shadow: 0 8px 24px rgba(20,25,34,.15), inset 0 1px 0 rgba(255,255,255,.88);
  color: var(--controller-ink);
  cursor: pointer;

  transition: transform 160ms ease, background 180ms ease, box-shadow 180ms ease, opacity 180ms ease;
}
.shelf-corner-button[hidden] { display:none !important; }
.shelf-corner-button:active { transform:scale(.92); }
.shelf-corner-button svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
#shelf-more svg path { fill:none; stroke:currentColor; }

body:not(.plano-document-ready) #top-bay-picker {
  opacity:0;
  pointer-events:none;
  transform:translateY(-6px) scale(.92);
}
.top-bay-picker {
  z-index:5;
  overflow:visible;
  touch-action:manipulation;
  background:rgba(247,248,250,.97);
}
.top-bay-picker.is-open { box-shadow:0 9px 26px rgba(20,25,34,.18),inset 0 1px 0 rgba(255,255,255,.92); }
.top-bay-picker.has-selected-bay {
  border-color: rgba(32,178,170,.60);
  background: var(--controller-theme);
  color: #fff;
}
.top-bay-picker.has-selected-bay .top-bay-number { color:#fff; }
.top-bay-panel {
  position:absolute;
  z-index:3;
  top:106px;
  right:0;
  display:flex;
  width:min(430px,calc(100vw - max(10px,var(--safe-left)) - max(10px,var(--safe-right))));
  max-height:min(560px,calc(100dvh - var(--app-safe-top) - 70px));
  padding:8px;
  flex-direction:column;
  gap:7px;
  overflow:auto;
  border-radius:22px;
  transform-origin:right top;
  animation:plano-top-bay-panel-open 220ms cubic-bezier(.2,.82,.2,1) both;
}
.top-bay-panel[hidden] { display:none !important; }
.top-bay-panel.is-preparing #top-bay-strip-slot::before {
  content:"Loading bays…";
  display:grid;
  min-height:38px;
  place-items:center;
  color:rgba(60,60,67,.64);
  font-size:11px;
  font-weight:700;
}
.top-bay-panel.is-preparing #bay-strip {
  opacity:.35;
  pointer-events:none;
}
@keyframes plano-top-bay-panel-open {
  from { opacity:.35; transform:translateY(-4px) scale(.98); }
  to { opacity:1; transform:none; }
}
.top-bay-panel-header {
  display:grid;
  min-height:36px;
  grid-template-columns:36px minmax(0,1fr) 36px;
  align-items:center;
  gap:7px;
}
.top-bay-panel-header > strong {
  overflow:hidden;
  color:#111114;
  font-size:14px;
  font-weight:760;
  text-align:center;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#bay-panel-picture {
  display:grid;
  width:36px;
  height:36px;
  place-items:center;
  border:0;
  border-radius:10px;
  background:rgba(118,118,128,.18);
  color:rgba(60,60,67,.58);
  box-shadow:0 1px 3px rgba(32,178,170,.07);
}
#bay-panel-picture.active { background:var(--controller-theme); color:#fff; box-shadow:0 1px 4px rgba(32,178,170,.18); }
#bay-panel-picture svg { width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round; }
.top-bay-planogram-slot,
.top-bay-strip-slot { min-width:0; overflow:visible; }
#top-bay-panel #planogram-select {
  all:unset;
  box-sizing:border-box;
  display:flex !important;
  width:100%;
  min-height:34px;
  padding:0 10px;
  align-items:center;
  justify-content:space-between;
  gap:6px;
  border-radius:9px;
  background:rgba(255,255,255,.90);
  box-shadow:0 1px 2px rgba(32,178,170,.06);
  color:#0a0b0c;
  font-size:12px;
  font-weight:670;
  cursor:pointer;
}
#top-bay-panel #planogram-select-label { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#top-bay-panel .planogram-select-chevron { width:13px; height:13px; flex:0 0 13px; stroke:currentColor; }
#top-bay-panel #bay-strip {
  position:static !important;
  display:block !important;
  width:100%;
  height:auto !important;
  margin:0;
  padding:0 !important;
  overflow:visible;
  background:transparent;
}
#top-bay-panel #bay-strip[hidden] { display:none !important; }
#top-bay-panel .combined-bay-rows { display:flex; width:100%; flex-direction:column; gap:5px; }
#top-bay-panel .combined-bay-row {
  display:grid;
  width:100%;
  min-height:32px;
  grid-template-columns:minmax(88px,118px) minmax(0,1fr);
  align-items:center;
  gap:6px;
}
#top-bay-panel .combined-bay-name {
  overflow:hidden;
  color:rgba(60,60,67,.72);
  font-size:10px;
  font-weight:720;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#top-bay-panel .topbar-bay-track {
  display:flex;
  width:100%;
  min-height:32px;
  align-items:center;
  gap:4px;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
}
#top-bay-panel .topbar-bay-track::-webkit-scrollbar { display:none; }
#top-bay-panel .bay-strip-button {
  min-width:44px;
  height:30px;
  padding:0 9px;
  flex:0 0 auto;
  border:0;
  border-radius:8px;
  background:rgba(255,255,255,.91);
  box-shadow:0 1px 2px rgba(32,178,170,.06);
  color:#101112;
  font-size:10px;
  font-weight:650;
  white-space:nowrap;
}
#top-bay-panel .bay-strip-button.active {
  background:var(--controller-theme);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45);
  color:#fff;
  font-weight:760;
}
.bay-panel-actions {
  display:grid;
  width:100%;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:5px;
}
.bay-panel-actions button {
  display:grid;
  min-width:0;
  height:50px;
  grid-template-rows:23px 14px;
  place-items:center;
  border:0;
  border-radius:10px;
  background:rgba(118,118,128,.10);
  color:var(--controller-ink);
  font-size:10px;
  font-weight:680;
}
.bay-panel-actions button:active { background:rgba(32,178,170,.15); color:#106e69; }
.bay-panel-actions svg { width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round; }
body.labels-mode .shelf-corner-tools,
body.labels-entering .shelf-corner-tools,
body.labels-ready .shelf-corner-tools,
body.labels-leaving .shelf-corner-tools { opacity:0; pointer-events:none; transform:translateY(-9px) scale(.92); }

#page-edge-tab {
  appearance:none;
  position:fixed;
  z-index:229;
  top:calc(var(--app-safe-top) + 76px);
  right:0;
  display:grid;
  width:14px;
  height:58px;
  padding:0;
  place-items:center;
  border:1px solid rgba(60,60,67,.16);
  border-right:0;
  border-radius:12px 0 0 12px;
  background:rgba(246,247,250,.96) !important;
  box-shadow:-5px 4px 16px rgba(20,25,34,.14) !important;
  color:rgba(60,60,67,.55);
  cursor:pointer;
  touch-action:manipulation;
}
#page-edge-tab span { width:3px;height:24px;border-radius:999px;background:currentColor; }
#page-edge-tab:active { width:18px;background:#fff !important; }
#page-edge-tab[hidden] { display:none !important; }
body:not(.plano-document-ready) #page-edge-tab,
body.labels-mode #page-edge-tab,
body.labels-entering #page-edge-tab,
body.labels-ready #page-edge-tab,
body.labels-leaving #page-edge-tab { display: none; }

/* Barcode card: content material, not an old dark toolbar. */
body.labels-mode #topbar.plano10-topbar,
body.labels-entering #topbar.plano10-topbar,
body.labels-ready #topbar.plano10-topbar,
body.labels-leaving #topbar.plano10-topbar {
  position: fixed !important;
  z-index: 205 !important;
  top: calc(var(--app-safe-top) + 7px) !important;
  right: 8px !important;
  left: 8px !important;
  display: flex !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  opacity: 1 !important;
  transform: none !important;
}
#topbar.plano10-topbar::after { display: none !important; content: none !important; }
#topbar #labels-focus-card,
body.labels-mode #topbar #labels-focus-card,
body.labels-entering #topbar #labels-focus-card,
body.labels-ready #topbar #labels-focus-card,
body.labels-leaving #topbar #labels-focus-card {
  position: relative !important;
  inset: auto !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 10px 12px 11px !important;
  border: 1px solid rgba(32,178,170,.34) !important;
  border-radius: 23px !important;
  background: linear-gradient(180deg,rgba(224,249,247,.98) 0,rgba(249,250,252,.97) 30px,rgba(249,250,252,.95) 100%) !important;
  box-shadow: 0 13px 34px rgba(20,25,34,.18),0 2px 8px rgba(32,178,170,.14),inset 0 1px 0 rgba(255,255,255,.88) !important;
  color: #111114 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translateY(-10px) scale(.96) !important;
  transform-origin: top center !important;

  transition: opacity 220ms ease, transform 420ms cubic-bezier(.2,.82,.2,1) !important;
}
body.labels-card-visible #topbar #labels-focus-card,
body.labels-ready #topbar #labels-focus-card {
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: none !important;
}
/* Optional copy picker. */
.copy-picker-options {
  display: grid;
  gap: 5px;
  margin: 8px 0;
}
.copy-picker-options[hidden] { display: none !important; }
.copy-picker-options button {
  display: grid;
  min-height: 46px;
  padding: 7px 11px;
  grid-template-columns: 95px minmax(0,1fr);
  align-items: center;
  gap: 8px;
  border: 0;
  border-radius: 13px;
  background: rgba(118,118,128,.10);
  color: #111114;
  text-align: left;
}
.copy-picker-options button span { color: rgba(60,60,67,.68); font-size: 11px; font-weight: 620; }
.copy-picker-options button strong { overflow: hidden; font-size: 12px; font-weight: 690; text-overflow: ellipsis; white-space: nowrap; }
.copy-panel.is-picker .copy-value,
.copy-panel.is-picker .copy-actions #copy-confirm { display: none !important; }

/* ─── Plano v11.0.40 compact controller ─── */
.controller-surface {
  position:relative;
  display:flex;
  width:auto;
  height:auto;
  padding:0;
  align-items:flex-end;
  justify-content:flex-end;
  gap:var(--controller-bubble-gap);
  overflow:visible;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;

  isolation:auto;
  transition:width 440ms cubic-bezier(.2,.82,.2,1),height 320ms cubic-bezier(.2,.82,.2,1);
}
.controller-surface::before,
.controller-surface::after { display:none; }

/* Simple translucent control material. No blur or shader layer. */
.shelf-bubble,
#shelf-search-slot #search-wrap,
#shelf-search-slot #search-status,
.top-bay-panel,
.shelf-corner-button,
.top-bay-picker,
#labels-next,
.copy-behavior-popover {
  border:1px solid rgba(0,0,0,.18) !important;
  background:rgba(247,247,249,.97) !important;
  box-shadow:0 4px 12px rgba(0,0,0,.18),0 1px 5px rgba(32,178,170,.22),inset 0 1px 0 rgba(255,255,255,.82) !important;
}
.shelf-bubble,
.shelf-corner-button,
.top-bay-picker {
  transition:transform 120ms ease,background 150ms ease,box-shadow 150ms ease,opacity 180ms ease;
}
.shelf-bubble:active,
.shelf-corner-button:active,
.top-bay-picker:active,
.shelf-bubble:has(> button:active) {
  transform:translateY(1px) scale(.985);
  background:rgba(238,239,242,.98) !important;
  box-shadow:0 2px 6px rgba(0,0,0,.16),0 1px 4px rgba(32,178,170,.18),inset 0 1px 0 rgba(255,255,255,.72) !important;
}

#shelf-exit {
  display:none;
  width:var(--controller-bubble-height);
  height:var(--controller-bubble-height);
  flex:0 0 var(--controller-bubble-height);
  border-radius:var(--controller-bubble-radius);
}
#shelf-exit svg { width:22px; height:22px; stroke-width:2.25; }

/* Idle: Search is independent. Bay selection now lives at the top-right. */
#shelf-search-bubble {
  position:relative;
  display:grid;
  width:var(--controller-idle-width);
  height:var(--controller-idle-height);
  flex:0 0 var(--controller-idle-width);
  overflow:hidden;
  border-radius:var(--controller-bubble-radius);
  transform-origin:right center;
}
.shelf-primary { display:block; width:100%; height:100%; }
.shelf-search-control {
  width:100%;
  height:100%;
  padding:0;
  border:0;
  border-radius:inherit;
  background:transparent;
  color:#08090a;
}
.shelf-search-control svg { width:24px; height:24px; stroke-width:2.25; }
#shelf-navigation-search { display:none; }
#shelf-search-slot,
#shelf-navigation-actions,
#shelf-labels-slot { display:none; }

/* Search: (X) (scan + input + counter + clear) (Up/Down). */
#control-shelf[data-state="search"] .controller-surface {
  width:var(--controller-search-width);
  height:var(--controller-bubble-height);
}
#control-shelf[data-state="search"] #shelf-exit { display:grid; order:1; }
#control-shelf[data-state="search"] #shelf-search-slot {
  display:block;
  min-width:0;
  flex:1 1 auto;
  order:2;
  border:0;
  background:transparent;
  box-shadow:none;

}
#control-shelf[data-state="search"] #shelf-search-bubble { display:none; }
#shelf-search-slot #searchbar.plano10-search-dock {
  position:static !important;
  display:grid;
  width:100%;
  height:46px;
  grid-template-columns:minmax(0,1fr) 92px;
  align-items:stretch;
  gap:var(--controller-bubble-gap);
  opacity:1;
  transform:none;
  transition:none;
}
#shelf-search-slot #searchbar.show { opacity:1; transform:none; pointer-events:auto; }
#shelf-search-slot #search-wrap {
  position:relative;
  display:grid;
  min-width:0;
  height:46px;
  padding:0 9px 0 6px;
  grid-template-columns:30px minmax(0,1fr) auto 18px;
  align-items:center;
  gap:5px;
  border-radius:23px;
  color:#050506;
}
#shelf-search-slot #search-wrap > svg { display:none; }
#shelf-search-scan {
  all:unset;
  box-sizing:border-box;
  display:grid !important;
  width:30px;
  height:30px;
  grid-column:1;
  grid-row:1;
  place-items:center;
  border:1px solid rgba(32,178,170,.34);
  border-radius:50%;
  background:rgba(32,178,170,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72),0 1px 3px rgba(32,178,170,.12);
  color:#148f89;
  cursor:pointer;
}
#shelf-search-scan svg { width:21px; height:21px; fill:none; stroke:currentColor !important; stroke-width:2.25; stroke-linecap:round; stroke-linejoin:round; }
#shelf-search-slot #search-input {
  all:unset;
  box-sizing:border-box;
  display:block;
  width:100%;
  min-width:0;
  height:100%;
  grid-column:2;
  grid-row:1;
  overflow:hidden;
  color:#050506;
  font-size:16px;
  font-weight:560;
  letter-spacing:-.01em;
  line-height:46px;
  text-overflow:clip;
  white-space:nowrap;
  pointer-events:none;
  caret-color:transparent;
}
#shelf-search-slot #search-input::placeholder { color:rgba(60,60,67,.44); opacity:1; font-weight:500; }
#shelf-search-slot #search-wrap::after {
  position:absolute;
  top:50%;
  left:calc(41px + var(--search-caret-x,0px));
  width:2px;
  height:22px;
  border-radius:2px;
  background:var(--controller-theme);
  content:"";
  opacity:0;
  transform:translateY(-50%);
  pointer-events:none;
}
body.plano-keyboard-open #shelf-search-slot #search-wrap::after { animation:plano-caret 1.05s steps(1,end) infinite; }
@keyframes plano-caret { 0%,48%{opacity:1} 49%,100%{opacity:0} }
#shelf-search-slot .plano10-search-count { grid-column:3; color:#050506 !important; font-size:12px; font-weight:600; font-variant-numeric:tabular-nums; white-space:nowrap; }
#shelf-search-slot #search-clear {
  all:unset;
  box-sizing:border-box;
  display:none;
  width:17px;
  height:17px;
  grid-column:4;
  place-items:center;
  border-radius:9px;
  background:rgba(60,60,67,.20);
  color:#fff;
  font-size:10px;
  font-weight:700;
  cursor:pointer;
}
#shelf-search-slot #search-clear.show { display:grid; }
#shelf-search-slot #search-status { display:grid !important; visibility:visible !important; width:92px; height:46px; border-radius:23px; overflow:hidden; }
#shelf-search-slot #search-status .search-nav { display:grid; width:100%; height:100%; grid-template-columns:1fr 1fr; }
#shelf-search-slot #search-status button { all:unset; display:grid; place-items:center; color:rgba(60,60,67,.72); }
#shelf-search-slot #search-status button + button { border-left:1px solid rgba(60,60,67,.10); }
#shelf-search-slot #search-status button:disabled { opacity:.25; }
#shelf-search-slot #search-status svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:2.25; stroke-linecap:round; stroke-linejoin:round; }

/* Result selected / Navigation: (X) (Label · Copy · Info) (Up/Down) (Search). */
#control-shelf[data-state="navigation"] .controller-surface {
  width:min(424px,calc(100vw - max(8px,var(--safe-left)) - max(8px,var(--safe-right))));
  height:var(--controller-bubble-height);
  align-items:flex-end;
  justify-content:space-between;
  gap:0;
}
#control-shelf[data-state="navigation"] #shelf-exit { display:grid; order:1; }
#control-shelf[data-state="navigation"] #shelf-navigation-actions { display:contents; }
#control-shelf[data-state="navigation"] .shelf-action-group,
#control-shelf[data-state="navigation"] #shelf-navigation-slot {
  width:118px;
  height:var(--controller-bubble-height);
  flex:0 0 118px;
  border-radius:var(--controller-bubble-radius);
}
#control-shelf[data-state="navigation"] .shelf-action-group { display:grid; grid-template-columns:1fr 7px 1fr 7px 1fr; align-items:center; order:2; overflow:hidden; }
.shelf-action-dot { color:rgba(60,60,67,.40); font-size:15px; font-weight:600; text-align:center; }
#control-shelf[data-state="navigation"] .shelf-action-group .shelf-icon-control { width:100%; height:46px; }
#control-shelf[data-state="navigation"] .shelf-action-group svg { width:22px; height:22px; }
#control-shelf[data-state="navigation"] #shelf-navigation-slot { display:block; order:3; overflow:hidden; }
#navigation-controls.navigation-controls { position:static; display:grid !important; width:100%; height:46px; grid-template-columns:1fr 1fr; gap:0; transform:none; }
#navigation-controls .navigation-main-button { width:auto; height:46px; border-radius:0; background:transparent; box-shadow:none; color:rgba(60,60,67,.72); }
#navigation-controls .navigation-main-button + .navigation-main-button { border-left:1px solid rgba(60,60,67,.10); }
#navigation-controls .navigation-main-button svg { width:22px; height:22px; stroke-width:2.25; }
#control-shelf[data-state="navigation"] #shelf-search-bubble { display:grid; width:46px; height:46px; flex:0 0 46px; order:4; }
#control-shelf[data-state="navigation"] #shelf-primary { display:none !important; }
#control-shelf[data-state="navigation"] #shelf-navigation-search { display:grid; width:100%; height:100%; }

/* Labels keeps its established controls; bay selection stays at top. */
#control-shelf[data-state="labels"] .controller-surface {
  width: var(--controller-search-width);
  min-height: var(--controller-bubble-height);
  justify-content: space-between;
}
#control-shelf[data-state="labels"] #shelf-exit { display:grid; order:1; }
#control-shelf[data-state="labels"] #shelf-search-bubble { display:none; }
#control-shelf[data-state="labels"] #shelf-labels-slot { display:contents; }
#control-shelf[data-state="labels"] #labels-control-dock { order:2; }

/* Search Enter -> selected result: actions, Up/Down and the independent Search
   bubble settle into the bottom row. */
#control-shelf.result-selected-opening #shelf-exit,
#control-shelf.result-selected-opening .shelf-action-group,
#control-shelf.result-selected-opening #shelf-navigation-slot,
#control-shelf.result-selected-opening #shelf-search-bubble { animation:plano-result-selected-drop 500ms cubic-bezier(.2,.82,.2,1) both; }
#control-shelf.result-selected-opening .shelf-action-group { animation-delay:40ms; }
#control-shelf.result-selected-opening #shelf-navigation-slot { animation-delay:80ms; }
#control-shelf.result-selected-opening #shelf-search-bubble { animation-delay:110ms; }
@keyframes plano-result-selected-drop { from{opacity:.15;transform:translateY(-20px) scale(.94)} to{opacity:1;transform:none} }
#control-shelf.navigation-opening .shelf-action-group,
#control-shelf.navigation-opening #shelf-navigation-slot,
#control-shelf.navigation-opening #shelf-exit,
#control-shelf.navigation-opening #shelf-search-bubble { animation:plano-result-selected-drop 360ms cubic-bezier(.2,.82,.2,1); }

/* Keyboard/keypad: single canonical implementation with compact iOS-like proportions. */
#plano-keyboard.plano10-keyboard {
  position:fixed;
  z-index:195;
  inset:0;
  visibility:hidden;
  pointer-events:none;
}
#plano-keyboard.plano10-keyboard.is-open { visibility:visible; }
.plano10-keyboard-panel {
  position:absolute;
  right:0;
  bottom:0;
  left:0;
  height:calc(var(--plano10-keyboard-height) + var(--safe-bottom));
  padding:7px max(6px,var(--safe-right)) calc(8px + var(--safe-bottom)) max(6px,var(--safe-left));
  border-top:1px solid rgba(255,255,255,.60);
  border-radius:22px 22px 0 0;
  background:rgba(205,209,216,.80);
  box-shadow:0 -12px 32px rgba(20,25,34,.18),inset 0 1px 0 rgba(255,255,255,.52);
  opacity:0;
  pointer-events:none;
  transform:translateY(108%);

  transition:opacity 180ms ease,transform 360ms cubic-bezier(.22,.84,.28,1);
}
#plano-keyboard.is-open .plano10-keyboard-panel { opacity:1;pointer-events:auto;transform:none; }
.plano10-keyboard-layout {
  display:grid;
  width:100%;
  height:100%;
  grid-template-rows:repeat(4,minmax(0,1fr));
  gap:6px;
}
.plano10-keyboard-layout[hidden] { display:none !important; }
.plano10-key-row {
  display:flex;
  min-height:0;
  align-items:stretch;
  justify-content:center;
  gap:5px;
}
.plano10-key-row.is-indented { padding-inline:4.5%; }
.plano10-key {
  all:unset;
  box-sizing:border-box;
  display:grid;
  min-width:0;
  height:100%;
  padding:0;
  flex:1 1 0;
  place-items:center;
  border:.5px solid rgba(255,255,255,.64);
  border-radius:7px;
  background:rgba(255,255,255,.91);
  box-shadow:0 1px 0 rgba(0,0,0,.25),0 1px 3px rgba(0,0,0,.09);
  color:#050506;
  font-size:23px;
  font-weight:490;
  text-shadow:none;
  cursor:pointer;
  transition:background 120ms ease,transform 120ms ease;
}
.plano10-key:active { background:rgba(190,193,200,.94);transform:translateY(1px) scale(.98); }
.plano10-key.modifier,
.plano10-key.mode,
.plano10-key.keypad-action:not(.keypad-enter) { background:rgba(173,178,187,.84);font-weight:500; }
.plano10-key svg { width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.85;stroke-linecap:round;stroke-linejoin:round; }
.plano10-key.space { flex:3.3 1 0; }
.plano10-key.mode { flex:1.2 1 0;font-size:16px; }
.plano10-key.search-submit { flex:1.7 1 0;background:var(--controller-theme);box-shadow:0 2px 6px rgba(32,178,170,.28),inset 0 1px 0 rgba(255,255,255,.28);color:#fff; }
.plano10-key.search-submit svg { width:27px;height:27px;stroke-width:2; }
.plano10-number-keyboard {
  display:grid;
  grid-template-columns:minmax(0,3fr) minmax(92px,1fr);
  grid-template-rows:1fr;
  gap:6px;
}
.plano10-number-keyboard[hidden] { display:none !important; }
.plano10-keypad-digits { display:grid;min-width:0;grid-template-rows:repeat(4,minmax(0,1fr));gap:6px; }
.plano10-number-keyboard .plano10-key-row { padding:0; }
.plano10-number-keyboard .plano10-key { font-size:23px; }
.plano10-number-keyboard .plano10-key-row:last-child .plano10-key { font-size:16px; }
.plano10-number-keyboard .plano10-key-row:last-child .plano10-key[data-action="character"] { font-size:23px; }
.plano10-number-keyboard > .keypad-enter,
.plano10-key.keypad-enter {
  width:100%;
  height:100%;
  border-radius:9px;
  background:var(--controller-theme);
  box-shadow:0 2px 6px rgba(32,178,170,.28),inset 0 1px 0 rgba(255,255,255,.28);
  color:#fff;
}
.plano10-key.keypad-enter svg { width:28px;height:28px;stroke-width:2; }

@media (max-width:365px) {
  :root { --controller-bubble-gap:4px;--plano10-keyboard-height:210px; }
  #control-shelf[data-state="search"] .controller-surface,
  #control-shelf[data-state="navigation"] .controller-surface { width:calc(100vw - 10px); }
  #control-shelf[data-state="navigation"] .shelf-action-group,
  #control-shelf[data-state="navigation"] #shelf-navigation-slot { width:102px;flex-basis:102px; }
  #labels-next { width:33vw !important;flex-basis:33vw; }
  #labels-side-stack { width:85px !important; flex-basis:85px; }
  #labels-side-stack .control-button { width:42.5px !important; }
}
@media (max-width:355px) {
  :root { --controller-bubble-gap:4px; }
}
@media (max-width:330px) {
}
@media (orientation:landscape) {
  :root { --plano10-keyboard-height:170px; }
  #control-shelf[data-state="labels"] .controller-surface { width:var(--controller-search-width); }
  .shelf-corner-tools { top:calc(var(--app-safe-top) + 15px); }
  #topbar #labels-focus-card { padding-top:7px !important;padding-bottom:8px !important; }
}
@media (prefers-reduced-transparency:reduce) {
  .shelf-bubble,
  #shelf-search-slot #search-wrap,
  #shelf-search-slot #search-status,
  .top-bay-panel,
  .shelf-corner-button,
  .top-bay-picker {
    background:rgba(247,248,250,.99) !important;

  }
}
@media (prefers-reduced-motion:reduce) {
  #control-shelf,
  #shelf-search-bubble,
  #shelf-search-slot #searchbar,
  .top-bay-panel,
  .top-bay-number,
  .plano10-keyboard-panel { transition-duration:1ms !important; animation-duration:1ms !important; }
}


/* Labels bay selector: planogram names and bay buttons only. */
#labels-focus-bay-button { all:unset;box-sizing:border-box;display:grid;min-width:38px;min-height:24px;padding:0 6px;place-items:center;border:1px solid rgba(32,178,170,.24);border-radius:8px;background:rgba(32,178,170,.11);color:inherit;cursor:pointer; }
#labels-focus-bay-button strong { width:100%;text-align:center; }
#labels-focus-bay-button:active { background:rgba(32,178,170,.20); }
.labels-bay-panel { position:fixed;z-index:335;width:min(390px,calc(100vw - 16px));max-height:min(42dvh,320px);padding:8px;overflow:auto;border:1px solid rgba(255,255,255,.82);border-radius:18px;background:rgba(247,248,250,.97);box-shadow:0 12px 32px rgba(25,30,40,.16),0 1px 4px rgba(32,178,170,.09); }
.labels-bay-panel[hidden] { display:none !important; }
.labels-bay-panel .combined-bay-rows { display:flex;flex-direction:column;gap:5px; }
.labels-bay-panel .combined-bay-row { display:grid;grid-template-columns:minmax(78px,112px) minmax(0,1fr);align-items:center;gap:6px;min-height:32px; }
.labels-bay-panel .combined-bay-name { overflow:hidden;color:rgba(60,60,67,.72);font-size:10px;font-weight:720;text-overflow:ellipsis;white-space:nowrap; }
.labels-bay-panel .topbar-bay-track { display:flex;min-width:0;min-height:32px;align-items:center;gap:4px;overflow-x:auto;scrollbar-width:none; }
.labels-bay-panel .topbar-bay-track::-webkit-scrollbar { display:none; }
.labels-bay-panel .bay-strip-button { min-width:44px;height:30px;padding:0 9px;flex:0 0 auto;border:0;border-radius:8px;background:rgba(255,255,255,.88);box-shadow:0 1px 2px rgba(32,178,170,.06);color:#101112;font-size:10px;font-weight:650;white-space:nowrap; }
.labels-bay-panel .bay-strip-button.active { background:var(--controller-theme);color:#fff;font-weight:760; }


.top-bay-picker.has-selected-bay,
#bay-panel-picture.active {
  border-color: rgba(20,120,116,.40) !important;
  background: rgba(32,178,170,.94) !important;
  color: #101113 !important;
  box-shadow:
    0 3px 10px rgba(0,0,0,.14),
    0 1px 5px rgba(32,178,170,.28),
    inset 0 1px 0 rgba(255,255,255,.35) !important;
}
.top-bay-picker.has-selected-bay .top-bay-number { color:#101113 !important; }

/* Product information test window. */
.product-info-panel {
  position: fixed;
  z-index: 670;
  inset: 0;
  display: none;
  padding: max(18px,var(--app-safe-top)) 16px max(18px,var(--safe-bottom));
  place-items: center;
  background: rgba(8,11,16,.42);
}
.product-info-panel.show { display:grid; }
.product-info-sheet {
  width: min(380px,100%);
  max-height: min(620px,calc(100dvh - 36px - var(--app-safe-top) - var(--safe-bottom)));
  overflow: auto;
  border: 1px solid rgba(0,0,0,.16);
  border-radius: 24px;
  background: rgba(245,245,247,.98);
  box-shadow: 0 24px 64px rgba(0,0,0,.34), 0 2px 8px rgba(32,178,170,.18), inset 0 1px 0 rgba(255,255,255,.82);
  color: #111114;
}
.product-info-header {
  position: sticky;
  z-index: 2;
  top: 0;
  display: grid;
  min-height: 60px;
  padding: 10px 12px 8px 16px;
  grid-template-columns: 1fr 40px;
  align-items: center;
  gap: 8px;
  background: rgba(245,245,247,.97);
  border-bottom: 1px solid rgba(60,60,67,.12);
}
.product-info-header > div { display:grid;gap:1px; }
.product-info-header span { color:rgba(60,60,67,.62);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.06em; }
.product-info-header strong { font-size:16px;font-weight:760;line-height:1.2; }
#product-info-close {
  all: unset;
  box-sizing: border-box;
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border-radius: 18px;
  background: rgba(118,118,128,.13);
  cursor: pointer;
}
#product-info-close svg { width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round; }
.product-info-loading,
.product-info-error { padding:30px 22px;color:rgba(60,60,67,.72);font-size:13px;font-weight:600;text-align:center;line-height:1.4; }
.product-info-error { color:#b42318; }
.product-info-content { display:grid; }
.product-info-photo-wrap {
  position:relative;
  display:grid;
  min-height:0;
  place-items:center;
  overflow:hidden;
  background:#fff;
}
#product-info-photo { display:block;width:100%;height:min(245px,31dvh);object-fit:contain;background:#fff; }
.product-info-photo-placeholder { display:grid;min-height:150px;place-items:center;color:rgba(60,60,67,.55);font-size:12px;font-weight:650; }
#product-info-photo[hidden],
.product-info-photo-placeholder[hidden] { display:none !important; }
.product-info-details { display:grid;padding:16px 18px 18px;gap:10px; }
#product-info-name { font-size:17px;font-weight:740;line-height:1.28; }
.product-info-price { color:#111114;font-size:31px;font-weight:790;letter-spacing:-.035em;line-height:1; }
.product-info-price.is-unavailable { color:rgba(60,60,67,.60);font-size:15px;font-weight:650;letter-spacing:0;line-height:1.3; }
.product-info-meta { display:flex;align-items:center;justify-content:space-between;padding-top:3px;color:rgba(60,60,67,.68);font-size:12px; }
.product-info-meta strong { color:#111114;font-size:13px;font-variant-numeric:tabular-nums; }
#product-info-open {
  min-height:44px;
  margin-top:3px;
  border:1px solid rgba(20,120,116,.28);
  border-radius:14px;
  background:rgba(32,178,170,.82);
  color:#101113;
  font-size:14px;
  font-weight:740;
}
@media (orientation:landscape) {
  .product-info-sheet { width:min(560px,calc(100vw - 48px)); }
  .product-info-content { grid-template-columns:minmax(220px,46%) 1fr; }
  .product-info-photo-wrap,#product-info-photo { min-height:0;height:100%;max-height:300px; }
}


/* ─── Plano v11.0.40 Search/results and high-contrast primary controls ─── */
#shelf-search-slot {
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  transform:none !important;
}
#shelf-search-bubble,
.top-bay-picker {
  border:1px solid rgba(20,120,116,.50) !important;
  background:#20B2AA !important;
  color:#fff !important;
  box-shadow:0 4px 12px rgba(0,0,0,.16),0 1px 5px rgba(32,178,170,.28),inset 0 1px 0 rgba(255,255,255,.28) !important;
}
#shelf-search,
#shelf-navigation-search {
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:#fff !important;
}
.top-bay-picker .top-bay-number,
.top-bay-picker.has-selected-bay .top-bay-number { color:#fff !important; }
#shelf-search-slot #search-status,
#control-shelf[data-state="navigation"] #shelf-navigation-slot {
  border-color:rgba(20,120,116,.50) !important;
  background:#20B2AA !important;
  color:#fff !important;
}
#shelf-search-slot #search-status button,
#navigation-controls .navigation-main-button { color:#fff !important; }
#shelf-search-slot #search-status button + button,
#navigation-controls .navigation-main-button + .navigation-main-button { border-left-color:rgba(255,255,255,.24) !important; }
#shelf-search-slot #search-status button:disabled { opacity:.42; }

/* Give standalone controls the same defined edge, lift and press response as
   the Search arrow capsule while preserving each control's existing colour. */
#top-bay-panel #planogram-select,
#top-bay-panel .bay-strip-button,
#top-bay-panel .bay-panel-actions button,
#bay-panel-picture,
#labels-next,
#product-info-close,
#product-info-open {
  border:1px solid rgba(0,0,0,.18) !important;
  box-shadow:
    0 4px 12px rgba(0,0,0,.16),
    0 1px 4px rgba(32,178,170,.18),
    inset 0 1px 0 rgba(255,255,255,.72) !important;
  transition:transform 120ms ease,box-shadow 140ms ease,background 140ms ease;
}
#top-bay-panel #planogram-select:active,
#top-bay-panel .bay-strip-button:active,
#top-bay-panel .bay-panel-actions button:active,
#bay-panel-picture:active,
#labels-next:active,
#product-info-close:active,
#product-info-open:active {
  transform:translateY(1px) scale(.985);
  box-shadow:
    0 2px 6px rgba(0,0,0,.15),
    0 1px 3px rgba(32,178,170,.15),
    inset 0 1px 0 rgba(255,255,255,.58) !important;
}

.selection-panel {
  position:fixed;
  z-index:520;
  inset:0;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:0 max(8px,var(--safe-right)) max(8px,var(--safe-bottom)) max(8px,var(--safe-left));
  background:rgba(16,18,22,.22);
  opacity:0;
  pointer-events:none;
  transition:opacity 180ms ease;
}
.selection-panel.show { opacity:1;pointer-events:auto; }
.selection-panel[aria-hidden="true"] { visibility:hidden; }
.selection-sheet {
  box-sizing:border-box;
  width:min(560px,100%);
  max-height:min(720px,calc(100dvh - max(16px,var(--safe-top)) - 16px));
  padding:8px 14px 14px;
  overflow:auto;
  border:1px solid rgba(255,255,255,.78);
  border-radius:26px;
  background:rgba(246,247,250,.91);
  box-shadow:0 24px 64px rgba(20,25,34,.28),inset 0 1px 0 rgba(255,255,255,.92);
  transform:translateY(28px) scale(.985);
  transition:transform 300ms cubic-bezier(.22,.78,.2,1);
  -webkit-backdrop-filter:blur(34px) saturate(180%);
  backdrop-filter:blur(34px) saturate(180%);
}
.selection-panel.show .selection-sheet { transform:translateY(0) scale(1); }
.selection-grabber { width:36px;height:5px;margin:0 auto 8px;border-radius:999px;background:rgba(60,60,67,.28); }
.selection-header { display:grid;grid-template-columns:1fr auto;align-items:center;min-height:44px;gap:12px; }
.selection-header > div { display:grid;gap:2px; }
.selection-header strong { font-size:18px;font-weight:780;letter-spacing:-.02em; }
.selection-header small { color:rgba(60,60,67,.66);font-size:12px;font-weight:620; }
.selection-header button { min-height:36px;padding:0 12px;border:0;border-radius:18px;background:rgba(0,122,255,.12);color:#007aff;font-size:14px;font-weight:760; }
.selection-sheet h3 { margin:14px 4px 8px;color:rgba(60,60,67,.70);font-size:12px;font-weight:790;letter-spacing:.04em;text-transform:uppercase; }
.selection-modes,.selection-choice-group,.selection-destination { display:grid;overflow:hidden;border:1px solid rgba(60,60,67,.12);border-radius:16px;background:rgba(255,255,255,.58); }
.selection-modes button { display:grid;grid-template-columns:38px minmax(0,1fr);min-height:62px;padding:8px 48px 8px 10px;position:relative;align-items:center;column-gap:10px;border:0;border-bottom:1px solid rgba(60,60,67,.11);background:transparent;text-align:left; }
.selection-modes button:last-child { border-bottom:0; }
.selection-modes button::after { content:"";position:absolute;right:16px;top:50%;width:20px;height:20px;border:2px solid rgba(60,60,67,.28);border-radius:50%;transform:translateY(-50%); }
.selection-modes button[aria-checked="true"]::after { border:6px solid #007aff;background:#fff; }
.selection-mode-copy { display:grid;gap:2px;min-width:0; }
.selection-mode-example { display:grid;width:34px;height:34px;place-items:center;border:1.5px solid #20B2AA;border-radius:10px;background:#20B2AA;color:#fff;box-shadow:0 3px 8px rgba(32,178,170,.18),inset 0 1px 0 rgba(255,255,255,.28); }
.selection-mode-example svg { width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round; }
.selection-mode-example .selection-glyph-x { display:none; }
.selection-mode-example[data-mode-example="skip"] .selection-glyph-check { display:none; }
.selection-mode-example[data-mode-example="skip"] .selection-glyph-x { display:block; }
.selection-mode-example[data-mode-example="only"] { background:#fff;color:#20B2AA;box-shadow:0 3px 8px rgba(0,0,0,.08),inset 0 1px 0 rgba(255,255,255,.8); }
.selection-modes strong,.selection-choice-group strong { font-size:14px;font-weight:760; }
.selection-modes small,.selection-choice-group small { color:rgba(60,60,67,.64);font-size:11px;font-weight:600; }
.selection-actions,.post-save-actions { display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px; }
.selection-actions button,.post-save-actions button,.selection-hide { min-height:44px;border:0;border-radius:14px;background:rgba(118,118,128,.13);color:#111114;font-size:14px;font-weight:720; }
.selection-primary { width:100%;min-height:48px;margin-top:10px;border:0;border-radius:15px;background:#007aff;color:white;font-size:15px;font-weight:780; }
.selection-primary:disabled { opacity:.42; }
.selection-hide { display:grid;width:100%;margin-top:10px;padding:8px 12px; }
.selection-hide small { color:rgba(60,60,67,.64);font-size:10px; }
.selection-field { display:grid;gap:6px;margin:12px 0; }
.selection-field span,.selection-choice-group > strong { padding:0 4px;color:rgba(60,60,67,.70);font-size:12px;font-weight:780;text-transform:uppercase;letter-spacing:.04em; }
.selection-field input { box-sizing:border-box;width:100%;height:46px;padding:0 13px;border:1px solid rgba(60,60,67,.14);border-radius:14px;background:rgba(255,255,255,.74);font:700 15px system-ui;color:#111114; }
.selection-choice-group { margin-bottom:12px;overflow:visible;padding:10px 12px;gap:10px; }
.selection-choice-group > label { display:flex;align-items:center;justify-content:space-between;gap:12px; }
.selection-choice-group > label > span:first-child { display:grid;gap:2px; }
.selection-destination { margin:0;padding:7px 12px 10px; }
.selection-destination legend { padding:0 5px;color:rgba(60,60,67,.70);font-size:12px;font-weight:780;text-transform:uppercase; }
.selection-destination label { display:flex;min-height:40px;align-items:center;gap:10px;border-bottom:1px solid rgba(60,60,67,.10);font-size:14px;font-weight:700; }
.selection-destination label:last-child { border-bottom:0; }
.selection-destination .is-disabled { opacity:.42; }
.selection-destination small { font-size:10px;font-weight:600; }
.selection-bay-layout { margin:0 0 12px; }
.selection-bay-layout label > span { display:grid;gap:2px; }
.selection-bay-layout label > span strong { font-size:14px;font-weight:760; }
.selection-bay-layout label > span small { color:rgba(60,60,67,.64);font-size:10px;font-weight:600;line-height:1.25; }
.post-save-sheet p { margin:8px 0 2px;color:rgba(60,60,67,.75);font-size:14px;line-height:1.4; }
.post-save-actions button:last-child { background:#007aff;color:#fff; }

#top-bay-picker.viewer-dropdown-button {
  position:static !important;
  inset:auto !important;
  width:auto !important;
  height:46px !important;
  border-radius:23px !important;
}
.top-bay-panel {
  position:fixed !important;
  top:calc(var(--app-safe-top) + 72px) !important;
  left:max(12px,var(--safe-left)) !important;
  right:auto !important;
  width:min(430px,calc(100vw - max(12px,var(--safe-left)) - max(12px,var(--safe-right)))) !important;
  max-height:min(560px,calc(100dvh - var(--app-safe-top) - 84px)) !important;
}
.shelf-corner-tools { top:calc(var(--app-safe-top) + 18px); }

/* Search stays circular but uses the exact same raised material as the Bay control. */
#top-bay-picker.viewer-dropdown-button,
#shelf-search-bubble {
  border:1px solid rgba(20,120,116,.50) !important;
  background:#20B2AA !important;
  color:#fff !important;
  box-shadow:0 4px 12px rgba(0,0,0,.16),0 1px 5px rgba(32,178,170,.28),inset 0 1px 0 rgba(255,255,255,.28) !important;
}
#shelf-search-bubble {
  width:46px !important;
  min-width:46px !important;
  max-width:46px !important;
  height:46px !important;
  min-height:46px !important;
  max-height:46px !important;
  flex:0 0 46px !important;
  aspect-ratio:1 / 1;
  border-radius:50% !important;
  overflow:hidden !important;
}
#shelf-search-bubble #shelf-primary,
#shelf-search-bubble #shelf-search,
#shelf-search-bubble #shelf-navigation-search {
  border-radius:50% !important;
}

/* v11.0.40 — Checkbox Tool, Search and Create List interaction geometry. */
.row-selection-tool {
  border-color:rgba(20,120,116,.50) !important;
  background:#20B2AA !important;
  color:#fff !important;
  box-shadow:0 4px 12px rgba(0,0,0,.16),0 1px 5px rgba(32,178,170,.28),inset 0 1px 0 rgba(255,255,255,.28) !important;
}
.row-selection-tool svg {
  box-sizing:border-box;
  width:34px;
  height:34px;
  padding:0;
  flex:0 0 34px;
  stroke-width:2.35;
}
/* The standalone Checkbox Tool must never squeeze Search. Search owns the
   full controller width while open and the standalone tool yields entirely. */
body.row-selection-visible #control-shelf[data-state="search"].plano-controller {
  max-width:calc(100vw - max(8px,var(--safe-left)) - max(8px,var(--safe-right)));
}
body.selection-select-now-active.row-selection-visible #control-shelf[data-state="search"].plano-controller {
  max-width:calc(100vw - max(8px,var(--safe-left)) - max(8px,var(--safe-right)) - 60px);
}
body:has(#control-shelf[data-state="search"]):not(.selection-select-now-active) .row-selection-tool,
body.plano-keyboard-open:not(.selection-select-now-active) .row-selection-tool {
  opacity:0;
  pointer-events:none;
  transform:translateY(12px) scale(.9);
}
.row-selection-tool.is-select-now-complete { width:156px; }
.row-selection-tool.is-select-now-complete .row-selection-complete-text { display:block; }
.row-selection-tool.is-select-now-complete .row-selection-tool-icon { flex-basis:34px;width:34px;height:34px;margin-left:9px;padding:0; }
.row-selection-tool.is-select-now-search-collapsed { width:52px;opacity:1 !important;pointer-events:auto !important;transform:none !important; }
.row-selection-tool.is-select-now-search-collapsed .row-selection-complete-text { display:none; }
#shelf-search-slot #search-wrap {
  grid-template-columns:30px minmax(0,1fr) auto 18px auto;
}
#shelf-search-slot #search-row-check {
  all:unset;
  box-sizing:border-box;
  display:grid;
  width:34px;
  height:34px;
  grid-column:5;
  grid-row:1;
  place-items:center;
  border:1px solid rgba(32,178,170,.58);
  border-radius:50%;
  background:#fff;
  box-shadow:0 3px 8px rgba(0,0,0,.10),inset 0 1px 0 rgba(255,255,255,.65);
  color:#20B2AA;
  cursor:pointer;
}
#shelf-search-slot #search-row-check[hidden] { display:none !important; }
#shelf-search-slot #search-row-check svg {
  width:24px;
  height:24px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.15;
  stroke-linecap:round;
  stroke-linejoin:round;
  opacity:0;
}
#shelf-search-slot #search-row-check .selection-glyph-x { display:none; }
#shelf-search-slot #search-row-check[aria-pressed="true"] { background:#20B2AA;color:#fff;box-shadow:0 2px 6px rgba(0,0,0,.16),inset 0 2px 4px rgba(0,0,0,.08); }
#shelf-search-slot #search-row-check[aria-pressed="true"] svg { opacity:1; }
#shelf-search-slot #search-row-check[aria-pressed="true"][data-selection-mode="skip"] .selection-glyph-check { display:none; }
#shelf-search-slot #search-row-check[aria-pressed="true"][data-selection-mode="skip"] .selection-glyph-x { display:block; }
#shelf-search-slot #search-row-check[aria-pressed="true"][data-selection-mode="only"] { background:#fff;color:#20B2AA;border-color:#20B2AA; }
#shelf-search-slot #search-row-check[aria-pressed="true"][data-selection-mode="only"] .selection-glyph-check { display:block; }
#shelf-search-slot #search-row-check[aria-pressed="true"][data-selection-mode="only"] .selection-glyph-x { display:none; }
.selection-create-header {
  display:flex;
  min-height:44px;
  align-items:center;
  justify-content:center;
  text-align:center;
}
.selection-create-header strong { width:100%;text-align:center; }
.selection-pages-button {
  appearance:none;
  display:flex;
  width:100%;
  min-height:58px;
  margin:0 0 12px;
  padding:9px 12px;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border:1px solid rgba(60,60,67,.12);
  border-radius:16px;
  background:rgba(255,255,255,.58);
  color:#111114;
  text-align:left;
}
.selection-pages-button > span { display:grid;gap:2px; }
.selection-pages-button strong { font-size:14px;font-weight:760; }
.selection-pages-button small { color:rgba(60,60,67,.64);font-size:11px;font-weight:600; }
.selection-pages-button svg { width:24px;height:24px;flex:0 0 24px;fill:none;stroke:#20B2AA;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round; }
.selection-create-export-note { margin:7px 4px 0;color:rgba(60,60,67,.64);font-size:11px;font-weight:600;text-align:center; }
.selection-cancel {
  appearance:none;
  display:block;
  width:100%;
  min-height:44px;
  margin-top:8px;
  border:0;
  border-radius:14px;
  background:rgba(118,118,128,.13);
  color:#111114;
  font-size:14px;
  font-weight:720;
}
/* Multi-select mode reuses the real Pages scroller so the user sees the same
   page thumbnails they already use for document navigation. */
body.thumb-selection-mode #thumb-backdrop.plano10-page-backdrop { z-index:550;display:block; }
body.thumb-selection-mode #thumb-panel.plano10-page-picker { z-index:555; }
body.thumb-selection-mode #thumb-panel .plano10-page-more { display:none !important; }
body.thumb-selection-mode #thumb-panel .plano10-page-card.current { border-color:rgba(60,60,67,.11);background:rgba(255,255,255,.8);box-shadow:0 4px 12px rgba(32,40,53,.07); }
body.thumb-selection-mode #thumb-panel .plano10-page-card.current .plano10-page-check { display:none; }
body.thumb-selection-mode #thumb-panel .plano10-page-card.is-selected {
  border-color:#20B2AA;
  background:rgba(32,178,170,.08);
  box-shadow:0 0 0 2px rgba(32,178,170,.14),0 4px 12px rgba(32,40,53,.07);
}
body.thumb-selection-mode #thumb-panel .plano10-page-card.is-selected .plano10-page-check { display:grid;background:#20B2AA; }
.plano10-page-selection-bar {
  position:sticky;
  z-index:5;
  top:-34px;
  display:flex;
  height:34px;
  margin:-34px 0 8px;
  padding:0 2px;
  align-items:center;
  justify-content:space-between;
  background:rgba(244,245,248,.96);
}
.plano10-page-selection-bar strong { color:#55565d;font-size:10px;font-weight:760;letter-spacing:.04em;text-transform:uppercase; }
.plano10-page-selection-bar button { min-height:28px;padding:0 9px;border:0;border-radius:14px;background:#20B2AA;color:#fff;font-size:11px;font-weight:760; }
/* v11.0.47: disabled Checkbox Tool remains in its established location. */
.row-selection-tool.is-disabled{filter:grayscale(1);opacity:.42}

.asana-workspace {
  --asana-bg:#fff;
  --asana-surface:#fff;
  --asana-raised:#f3f3f5;
  --asana-border:rgba(60,60,67,.17);
  --asana-divider:rgba(60,60,67,.10);
  --asana-text:#202124;
  --asana-muted:#74747c;
  --asana-accent:#6d5bd0;
  --asana-coral:#f06a6a;
  --asana-green:#2f9e74;
  position:relative;
  width:100%;
  min-width:0;
  min-height:100dvh;
  overflow-x:hidden;
  padding:0 0 env(safe-area-inset-bottom);
  color:var(--asana-text);
  background:var(--asana-bg);
  color-scheme:light dark;
}

@media (prefers-color-scheme:dark) {
  .asana-workspace {
    --asana-bg:#1e1f21;
    --asana-surface:#252629;
    --asana-raised:#2b2c30;
    --asana-border:rgba(255,255,255,.15);
    --asana-divider:rgba(255,255,255,.10);
    --asana-text:#f5f4f3;
    --asana-muted:#aaa8ad;
    --asana-accent:#a58cff;
  }
}

body[data-workspace-section="asana"] .plano-section-header { display:none!important; }
body[data-workspace-section="asana"] .plano-section-view { overflow-x:hidden;padding:var(--app-safe-top) 0 0;background:var(--asana-bg,#fff); }
body[data-workspace-section="asana"] #workspace-asana-panel { width:100%;max-width:none;margin:0; }

.plano-home-icon-asana { background:#fff; }
.plano-home-icon-asana .asana-brand-mark { display:block;width:32px;height:24px; }
.asana-brand-mark { width:34px;height:26px;flex:0 0 auto; }
.asana-app-header {
  position:sticky;
  z-index:80;
  top:0;
  display:flex;
  width:100%;
  min-width:0;
  min-height:56px;
  padding:6px 10px;
  align-items:center;
  gap:8px;
  border-bottom:1px solid var(--asana-divider);
  background:color-mix(in srgb,var(--asana-bg) 96%,transparent);
}
.asana-app-brand { display:flex!important;min-width:0;flex:1;align-items:center;gap:10px; }
.asana-app-brand > div { display:grid;min-width:0;gap:1px; }
.asana-app-header strong { overflow:hidden;font-size:20px;font-weight:730;letter-spacing:-.03em;text-overflow:ellipsis;white-space:nowrap; }
.asana-app-header span { overflow:hidden;color:var(--asana-muted);font-size:10px;text-overflow:ellipsis;white-space:nowrap; }
.asana-plano-home,.asana-search-button {
  appearance:none;
  display:grid;
  width:38px;
  height:38px;
  flex:0 0 38px;
  place-items:center;
  border:0;
  border-radius:50%;
  background:transparent;
  color:var(--asana-muted);
}
.asana-plano-home:active,.asana-search-button:active { background:var(--asana-raised); }
.asana-plano-home svg,.asana-search-button svg { width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round; }

.asana-content {
  width:100%;
  min-width:0;
  min-height:calc(100dvh - 120px);
  overflow-x:hidden;
  padding:0 10px 24px;
  background:var(--asana-bg);
}
.asana-content[data-asana-view="task"] { padding-bottom:170px; }
.asana-content * { box-sizing:border-box;min-width:0; }
.asana-content button,.asana-content input,.asana-content select,.asana-content textarea { max-width:100%;font:inherit; }
.asana-content button { color:inherit; }
.asana-search-controls { position:sticky;z-index:79;top:56px;width:100%;margin:0;padding:7px 10px;background:var(--asana-bg); }
.asana-search-controls[hidden] { display:none!important; }
.asana-search-controls form { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px; }
.asana-search-controls input { min-height:42px;padding:0 12px;border:0;border-radius:12px;background:var(--asana-raised);color:var(--asana-text);font-size:13px; }
.asana-search-controls button { min-height:40px;padding:0 13px;border:0;border-radius:11px;background:var(--asana-raised);color:var(--asana-accent);font-size:11px;font-weight:700; }


.asana-workspace .workspace-empty-state { color:var(--asana-text); }
.asana-native-section { width:100%;margin:8px 0 12px;padding:12px;border:1px solid var(--asana-divider);border-radius:18px;background:var(--asana-surface); }
.asana-native-section h2 { margin:0 0 7px;font-size:15px;letter-spacing:-.015em; }
.asana-native-list,.asana-job-list,.asana-subtask-list,.asana-document-list { display:grid;width:100%; }
.asana-task-empty { margin:0;padding:8px 2px;color:var(--asana-muted);font-size:11px;line-height:1.45; }

.asana-home-pager { overflow:hidden; }
.asana-home-page-track { display:grid;width:calc(100% + 24px);grid-auto-flow:column;grid-auto-columns:calc(100% - 24px);margin:0 -12px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none; }
.asana-home-page-track::-webkit-scrollbar { display:none; }
.asana-home-page { display:grid;width:100%;padding:0 12px;align-content:start;scroll-snap-align:start;scroll-snap-stop:always; }
.asana-home-task-row,.asana-home-project-row { appearance:none;display:grid;width:100%;min-height:52px;padding:6px 2px;align-items:center;gap:10px;border:0;background:transparent;color:var(--asana-text);text-align:left; }
.asana-home-task-row { grid-template-columns:28px minmax(0,1fr); }
.asana-home-project-row { grid-template-columns:40px minmax(0,1fr); }
.asana-home-task-row strong,.asana-home-project-row strong { overflow:hidden;font-size:13px;font-weight:590;text-overflow:ellipsis;white-space:nowrap; }
.asana-home-task-row.is-complete strong { color:var(--asana-muted); }
.asana-home-task-check { display:grid;width:24px;height:24px;place-items:center;border:1.5px solid var(--asana-muted);border-radius:50%;color:var(--asana-muted);font-size:13px;font-weight:800; }
.asana-home-task-check.is-complete { border-color:#63b792;background:#63b792;color:#fff; }
.asana-home-project-row .asana-project-icon { width:38px;height:38px;border-radius:9px; }
.asana-home-page-dots { display:flex;min-height:25px;align-items:center;justify-content:center;gap:8px; }
.asana-home-page-dot { width:7px;height:7px;padding:0;border:0;border-radius:50%;background:var(--asana-border); }
.asana-home-page-dot.is-active { background:var(--asana-muted); }
.asana-home-see-all { width:100%;min-height:40px;margin-top:2px;border:1px solid var(--asana-divider);border-radius:11px;background:transparent;color:var(--asana-text);font-size:12px;font-weight:650; }

.asana-job-row,.asana-subtask-row,.asana-document-row {
  appearance:none;
  display:grid;
  width:100%;
  min-height:54px;
  padding:8px 4px;
  align-items:center;
  gap:10px;
  border:0;
  border-bottom:1px solid var(--asana-divider);
  background:transparent;
  color:inherit;
  text-align:left;
  text-decoration:none;
}
.asana-job-row:last-child,.asana-subtask-row:last-child,.asana-document-row:last-child { border-bottom:0; }
.asana-job-row { grid-template-columns:34px minmax(0,1fr) auto; }
.asana-job-row strong,.asana-job-row small,.asana-document-row strong,.asana-document-row small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.asana-job-row strong { font-size:13px; }
.asana-job-row small,.asana-document-row small { margin-top:3px;color:var(--asana-muted);font-size:10px; }
.asana-job-due { min-width:62px;padding:7px 8px;border-radius:7px;background:rgba(44,168,136,.12);color:#23956f;font-size:10px;font-weight:720;text-align:center; }
.asana-row-chevron { color:var(--asana-muted);font-size:25px;line-height:1; }

.asana-project-row { display:grid;width:100%;grid-template-columns:minmax(0,1fr) 44px;align-items:center;border-bottom:1px solid var(--asana-divider); }
.asana-project-row:last-child { border-bottom:0; }
.asana-project-open { appearance:none;display:grid;width:100%;min-height:64px;grid-template-columns:42px minmax(0,1fr) auto;padding:10px 4px;align-items:center;gap:10px;border:0;background:transparent;text-align:left; }
.asana-project-open strong,.asana-project-open small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.asana-project-open strong { font-size:13px; }
.asana-project-open small { margin-top:3px;color:var(--asana-muted);font-size:10px; }
.asana-project-icon { display:grid;width:38px;height:38px;place-items:center;overflow:hidden;border-radius:10px;background:var(--asana-accent);color:#fff;font-size:17px;font-weight:800; }
.asana-project-icon img { width:100%;height:100%;object-fit:cover; }
.asana-project-star { display:grid;width:40px;height:40px;padding:0;place-items:center;border:0;border-radius:50%;background:transparent;color:var(--asana-muted);font-size:23px; }
.asana-project-star.is-starred { color:#f4b942; }

.asana-avatar { display:grid;width:32px;height:32px;place-items:center;overflow:hidden;border-radius:50%;background:#74d5e8;color:#173a44;font-size:10px;font-weight:750;line-height:1; }
.asana-avatar img { width:100%;height:100%;object-fit:cover; }

.asana-detail-header { display:flex;width:100%;align-items:center;gap:10px; }
.asana-detail-header > button:first-child { display:grid;width:38px;height:38px;flex:0 0 38px;padding:0;place-items:center;border:0;border-radius:12px;background:var(--asana-raised);color:var(--asana-text);font-size:27px;line-height:1; }
.asana-task-empty { color:var(--asana-muted); }
.asana-task-notes { width:100%;min-height:46px;margin:0 0 8px;padding:9px 12px;border:1px solid var(--asana-divider);border-radius:10px;background:transparent;color:var(--asana-text);font-size:11px;text-align:left;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere; }
.asana-task-notes:not(.has-notes) { color:var(--asana-muted);text-align:center;font-size:12px;font-weight:620; }
.asana-task-action-message { margin:8px 12px;padding:10px 12px;border-radius:11px;background:#fff3f2;color:#a5312f;font-size:12px;line-height:1.35; }
.asana-task-action-message[data-tone="success"] { background:#e9f8f1;color:#18745e; }
.asana-task-action-message[hidden] { display:none!important; }

.asana-project-list-view { display:grid;width:calc(100% + 20px);margin:0 -10px;padding:0;gap:0; }
.asana-project-header { min-height:62px;padding:8px 12px;border-bottom:1px solid var(--asana-divider); }
.asana-project-heading { display:flex!important;min-width:0;flex:1;align-items:center;gap:9px; }
.asana-project-heading > span:last-child { display:grid;min-width:0;gap:2px; }
.asana-project-heading strong { overflow:hidden;font-size:15px;text-overflow:ellipsis;white-space:nowrap; }
.asana-project-heading small { color:var(--asana-muted);font-size:10px; }
.asana-project-header-icon { width:36px;height:36px;flex:0 0 36px; }
.asana-project-view-toolbar { position:sticky;z-index:5;top:56px;display:flex;width:100%;min-height:49px;padding:7px 13px;align-items:center;justify-content:space-between;border-bottom:1px solid var(--asana-divider);background:var(--asana-bg); }
.asana-project-view-toolbar strong { font-size:14px; }
.asana-project-manage { min-height:34px;padding:0 12px;border:1px solid var(--asana-border);border-radius:9px;background:var(--asana-raised);color:var(--asana-text);font-size:11px;font-weight:700; }
.asana-project-brief { padding:12px 14px;border-bottom:1px solid var(--asana-divider); }
.asana-project-groups { display:grid;width:100%; }
.asana-project-group { width:100%;border-bottom:1px solid var(--asana-divider); }
.asana-project-group-toggle { appearance:none;display:flex;width:100%;min-height:50px;padding:8px 14px;align-items:center;gap:9px;border:0;background:transparent;color:var(--asana-text);text-align:left; }
.asana-project-group-toggle strong { min-width:0;flex:1;overflow:hidden;font-size:13px;font-weight:700;text-overflow:ellipsis;white-space:nowrap; }
.asana-project-group-arrow { width:15px;color:var(--asana-muted);font-size:21px;line-height:1;text-align:center; }
.asana-project-group-count { display:grid;min-width:24px;height:24px;padding:0 6px;place-items:center;border-radius:12px;background:var(--asana-raised);color:var(--asana-muted);font-size:10px;font-weight:700; }
.asana-project-group-body { width:100%; }
.asana-project-group-body[hidden] { display:none!important; }
.asana-project-task-list { display:grid;width:100%;border-top:1px solid var(--asana-divider); }
.asana-project-task-row { display:grid;width:100%;padding:0 14px;border-bottom:1px solid var(--asana-divider);background:var(--asana-surface); }
.asana-project-task-row:last-child { border-bottom:0; }
.asana-project-task-row.is-complete .asana-project-task-name { color:var(--asana-muted);text-decoration:line-through; }
.asana-project-task-main { display:flex;width:100%;min-height:52px;align-items:center;gap:9px; }
.asana-project-complete { width:22px;height:22px;flex:0 0 22px;padding:0;border:1.5px solid var(--asana-muted);border-radius:50%;background:transparent;color:#fff;font-size:11px; }
.asana-project-complete.is-complete { border-color:var(--asana-green);background:var(--asana-green); }
.asana-project-task-name { min-width:0;flex:1;overflow:hidden;border:0;background:transparent;color:var(--asana-text);font-size:12px;text-align:left;text-overflow:ellipsis;white-space:nowrap; }
.asana-project-field-grid { display:grid;width:100%;grid-template-columns:repeat(auto-fit,minmax(132px,1fr));padding:0 0 10px 31px;gap:7px; }
.asana-project-field-cell { display:grid;min-height:52px;padding:6px 8px;align-content:center;gap:3px;border-radius:8px;background:var(--asana-raised); }
.asana-project-field-label { overflow:hidden;color:var(--asana-muted);font-size:9px;font-weight:700;text-overflow:ellipsis;white-space:nowrap; }
.asana-project-field-cell input,.asana-project-field-cell select { width:100%;height:28px;padding:0;border:0;background:transparent;color:var(--asana-text);font-size:11px; }
.asana-field-readonly { overflow:hidden;color:var(--asana-muted);font-size:11px;text-overflow:ellipsis;white-space:nowrap; }
.asana-document-row { grid-template-columns:minmax(0,1fr) auto;padding:10px 14px; }
.asana-document-actions,.asana-attachment-actions { display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap; }
.asana-document-actions a,.asana-document-actions button,.asana-attachment-actions a,.asana-attachment-actions button { min-height:32px;padding:0 9px;border:0;border-radius:9px;background:var(--asana-raised);color:var(--asana-accent);font-size:9px;font-weight:700;text-decoration:none; }

.asana-manage-backdrop,.asana-photo-menu-backdrop,.asana-attachment-action-backdrop { position:fixed;z-index:120;inset:0;display:flex;padding:18px;align-items:flex-end;justify-content:center;background:rgba(0,0,0,.34); }
.asana-manage-backdrop { z-index:140; }
.asana-manage-sheet,.asana-photo-menu,.asana-attachment-action-sheet { display:grid;width:min(100%,520px);overflow-y:auto;border:1px solid var(--asana-border);border-radius:22px;background:var(--asana-bg);box-shadow:0 16px 50px rgba(0,0,0,.24); }
.asana-photo-menu,.asana-attachment-action-sheet { max-height:min(82dvh,720px); }
.asana-manage-grabber { width:42px;height:4px;margin:8px auto 3px;border-radius:4px;background:var(--asana-border); }
.asana-manage-header { display:grid;min-height:48px;grid-template-columns:minmax(70px,1fr) auto minmax(70px,1fr);padding:0 14px;align-items:center;border-bottom:1px solid var(--asana-divider); }
.asana-manage-header strong { font-size:13px;text-align:center; }
.asana-manage-header button { padding:0;border:0;background:transparent;color:var(--asana-accent);font-size:11px;font-weight:700; }
.asana-manage-header button:last-child { justify-self:end; }
.asana-manage-body { display:grid;padding:8px 14px 22px; }
.asana-manage-body h3 { margin:15px 4px 5px;color:var(--asana-muted);font-size:10px;text-transform:uppercase;letter-spacing:.08em; }
.asana-manage-navigation,.asana-manage-option { display:flex;width:100%;min-height:52px;padding:8px 5px;align-items:center;justify-content:space-between;gap:12px;border:0;border-bottom:1px solid var(--asana-divider);background:transparent;text-align:left; }
.asana-manage-navigation > span:first-child,.asana-manage-option > span:first-child { display:grid;gap:3px; }
.asana-manage-navigation strong,.asana-manage-option strong { font-size:13px; }
.asana-manage-navigation small,.asana-manage-option small { color:var(--asana-muted);font-size:10px; }
.asana-manage-check { color:var(--asana-accent);font-weight:800; }
.asana-project-survey-form { display:grid;padding:12px 0;gap:12px; }
.asana-project-survey-form p { margin:0;color:var(--asana-muted);font-size:12px;line-height:1.45; }
.asana-project-survey-form input { width:100%;min-height:46px;padding:0 12px;border:1px solid var(--asana-border);border-radius:10px;background:var(--asana-raised);color:var(--asana-text); }
.asana-project-survey-form button { min-height:44px;border:0;border-radius:10px;background:var(--asana-accent);color:#fff;font-size:12px;font-weight:750; }

.asana-task-detail { display:grid;width:100%;padding:2px 2px 24px;gap:0; }
.asana-task-header { min-height:42px;justify-content:space-between; }
.asana-task-header > span { flex:1; }
.asana-task-header > button:first-child { width:34px;height:34px;flex-basis:34px;border-radius:9px;background:transparent; }
.asana-task-header .asana-task-complete { min-height:36px;padding:0 12px;border:1px solid var(--asana-border);border-radius:18px;background:transparent;color:var(--asana-green);font-size:11px;font-weight:700; }
.asana-task-header .asana-task-complete.is-complete { border-color:var(--asana-green);background:color-mix(in srgb,var(--asana-green) 15%,transparent); }
.asana-task-title { margin:6px 2px 10px;font-size:20px;line-height:1.2;letter-spacing:-.025em;overflow-wrap:anywhere; }
.asana-task-detail h2 { margin:0;padding:13px 2px 6px;border-top:1px solid var(--asana-divider);font-size:12px; }
.asana-task-meta-grid { display:grid;width:100%;grid-template-columns:minmax(0,1fr) minmax(0,1fr);margin-bottom:8px;gap:6px; }
.asana-task-meta-field { display:grid;min-height:58px;grid-template-columns:34px minmax(0,1fr);padding:7px 8px;align-items:center;gap:8px;border:1px solid var(--asana-divider);border-radius:10px;background:var(--asana-surface); }
.asana-task-assignee-avatar,.asana-task-due-icon { display:grid;width:32px;height:32px;place-items:center;border-radius:50%; }
.asana-task-due-icon { border:1px solid color-mix(in srgb,var(--asana-green) 70%,var(--asana-border));color:var(--asana-green); }
.asana-task-due-icon svg { width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round; }
.asana-task-meta-copy { display:grid;min-width:0;gap:1px; }
.asana-task-meta-copy small { color:var(--asana-muted);font-size:9px;font-weight:650; }
.asana-task-meta-copy input,.asana-task-meta-copy select { appearance:none;width:100%;height:27px;padding:0;border:0;background:transparent;color:var(--asana-text);font-size:11px;font-weight:600; }
.asana-edit-field { position:relative;display:grid;min-height:54px;padding:7px 9px;align-content:center;gap:3px;border:1px solid var(--asana-divider);border-radius:9px;background:var(--asana-surface); }
.asana-edit-field > span { color:var(--asana-muted);font-size:9px;font-weight:700; }
.asana-edit-field input,.asana-edit-field select { width:100%;height:29px;padding:0;border:0;background:transparent;color:var(--asana-text);font-size:11px; }
.asana-edit-field .asana-task-assignee-avatar { position:absolute;top:7px;right:7px;width:24px;height:24px; }
.asana-task-projects { display:grid;width:100%;padding-bottom:8px;gap:5px; }
.asana-task-project-field { display:grid;width:100%;grid-template-columns:minmax(0,1fr) minmax(120px,.72fr);align-items:center;gap:8px;border:1px solid var(--asana-divider);border-radius:11px;background:var(--asana-surface); }
.asana-task-project-chip { display:flex;width:100%;min-height:44px;padding:6px 8px;align-items:center;gap:8px;border:0;background:transparent;color:var(--asana-accent);text-align:left; }
.asana-task-project-icon { width:30px;height:30px;flex:0 0 30px;border-radius:8px;font-size:13px; }
.asana-task-project-chip > span:last-child { overflow:hidden;font-size:11px;font-weight:700;text-overflow:ellipsis;white-space:nowrap; }
.asana-task-project-field select { height:36px;margin-right:7px;padding:0 7px;border:0;border-radius:8px;background:var(--asana-raised);color:var(--asana-text);font-size:10px; }
.asana-open-survey { display:flex;width:100%;min-height:46px;margin:4px 0 8px;padding:6px 10px;align-items:center;gap:9px;border:1px solid color-mix(in srgb,var(--asana-accent) 40%,var(--asana-border));border-radius:10px;background:color-mix(in srgb,var(--asana-accent) 10%,transparent);color:var(--asana-accent);text-align:left; }
.asana-survey-site-icon { display:grid;width:32px;height:32px;place-items:center;border-radius:9px;background:var(--asana-accent);color:#fff;font-size:19px; }
.asana-open-survey strong { font-size:12px; }
.asana-task-field-list { display:grid;width:100%;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));padding-bottom:8px;gap:6px; }
.asana-subtask-row { grid-template-columns:28px minmax(0,1fr) auto; }
.asana-subtask-row .is-complete { color:var(--asana-green); }
.asana-subtask-row strong { overflow:hidden;font-size:12px;text-overflow:ellipsis;white-space:nowrap; }
.asana-subtask-row small { color:var(--asana-muted);font-size:9px; }
.asana-add-subtask { width:100%;min-height:44px;margin:5px 0 8px;border:1px solid var(--asana-divider);border-radius:10px;background:transparent;color:var(--asana-text);font-size:11px;font-weight:620; }

.asana-attachment-grid { display:grid;width:100%;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px; }
.asana-attachment-card { display:grid;width:100%;padding:8px;gap:7px;border:1px solid var(--asana-border);border-radius:12px;background:var(--asana-surface);touch-action:pan-y; }
.asana-attachment-card > img { width:100%;height:96px;border-radius:8px;background:var(--asana-raised);object-fit:cover; }
.asana-attachment-card > span strong,.asana-attachment-card > span small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.asana-attachment-card > span strong { font-size:10px; }
.asana-attachment-card > span small { margin-top:2px;color:var(--asana-muted);font-size:8px; }
.asana-attachment-menu-button { min-width:34px;padding:0!important;color:var(--asana-muted)!important; }
.asana-comment-section { display:grid;gap:8px; }
.asana-comment-list { display:grid;gap:8px; }
.asana-comment-row { display:grid;grid-template-columns:30px minmax(0,1fr) auto;padding:8px;border-radius:9px;background:var(--asana-raised);column-gap:8px; }
.asana-comment-row .asana-avatar { width:28px;height:28px;grid-row:1 / span 2; }
.asana-comment-row strong { font-size:10px; }
.asana-comment-row p { grid-column:2 / -1;margin:4px 0 0;font-size:11px;line-height:1.42;overflow-wrap:anywhere; }
.asana-comment-row small { color:var(--asana-muted);font-size:8px; }

.asana-task-composer { position:fixed;z-index:86;right:max(0px,calc((100vw - 760px)/2));bottom:calc(64px + env(safe-area-inset-bottom));left:max(0px,calc((100vw - 760px)/2));display:grid;max-height:46dvh;overflow-y:auto;padding:7px 10px 5px;border:0;border-top:1px solid var(--asana-border);border-radius:0;background:color-mix(in srgb,var(--asana-bg) 97%,transparent);box-shadow:none; }
.asana-task-composer textarea { width:100%;min-height:40px;max-height:88px;resize:none;padding:8px 2px 5px;border:0;background:transparent;color:var(--asana-text);font-size:12px;line-height:1.35; }
.asana-task-composer textarea:focus { outline:0; }
.asana-composer-toolbar { display:flex;min-height:40px;align-items:center;gap:6px;border-top:1px solid var(--asana-divider); }
.asana-composer-icon,.asana-composer-send { display:grid;width:36px;height:36px;padding:0;place-items:center;border:0;border-radius:9px;background:transparent;color:var(--asana-muted); }
.asana-composer-icon svg,.asana-composer-send svg { width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round; }
.asana-composer-spacer { flex:1; }
.asana-composer-send { width:42px;height:36px;background:#4b78dd;color:#fff; }
.asana-composer-send svg { width:20px;height:20px;fill:currentColor;stroke:none; }
.asana-composer-stage { display:grid;max-height:160px;overflow-y:auto;padding:1px 0 7px;gap:5px; }
.asana-staged-file { display:grid;grid-template-columns:42px minmax(0,1fr) 32px;min-height:48px;padding:5px;align-items:center;gap:8px;border-radius:9px;background:var(--asana-raised); }
.asana-staged-file img,.asana-staged-file-icon { display:grid;width:42px;height:38px;place-items:center;border-radius:7px;background:var(--asana-bg);object-fit:cover; }
.asana-staged-file strong,.asana-staged-file small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.asana-staged-file strong { font-size:10px; }
.asana-staged-file small { margin-top:3px;color:#d08a24;font-size:8px; }
.asana-staged-file small.is-complete { color:var(--asana-green); }
.asana-staged-file small.is-upload-failed { color:var(--asana-coral); }
.asana-staged-file > button { width:30px;height:30px;padding:0;border:0;border-radius:50%;background:var(--asana-bg);color:var(--asana-muted);font-size:20px; }
.asana-camera-repeat-actions { display:flex;justify-content:flex-end;gap:7px; }
.asana-camera-repeat-actions button { min-height:32px;padding:0 9px;border:0;border-radius:8px;background:var(--asana-bg);color:var(--asana-accent);font-size:9px;font-weight:700; }
.asana-photo-menu-backdrop[hidden] { display:none!important; }
.asana-photo-menu,.asana-attachment-action-sheet { padding:0 14px 14px;gap:7px; }
.asana-photo-menu > strong,.asana-attachment-action-sheet > strong { padding:6px 2px 10px;font-size:15px; }
.asana-photo-menu button,.asana-attachment-action-sheet button,.asana-attachment-action-sheet a { display:flex;min-height:47px;padding:0 12px;align-items:center;border:0;border-radius:10px;background:var(--asana-raised);color:var(--asana-text);font-size:12px;font-weight:650;text-decoration:none; }
.asana-photo-menu .asana-photo-cancel,.asana-attachment-action-sheet .asana-attachment-cancel { justify-content:center;background:transparent;color:var(--asana-accent); }
.asana-attachment-action-sheet .asana-delete-attachment { color:#d64242; }

.asana-calendar-shell { width:100%;padding:8px 0 88px; }
.asana-calendar-header { display:grid;grid-template-columns:42px minmax(0,1fr) 42px;min-height:52px;align-items:center; }
.asana-calendar-header strong { font-size:15px;text-align:center; }
.asana-calendar-header button { width:40px;height:40px;padding:0;border:0;border-radius:12px;background:var(--asana-raised);font-size:24px; }
.asana-calendar-weekdays,.asana-calendar-grid { display:grid;width:100%;grid-template-columns:repeat(7,minmax(0,1fr)); }
.asana-calendar-weekdays span { padding:8px 0;color:var(--asana-muted);font-size:9px;text-align:center; }
.asana-calendar-day { display:grid;min-height:62px;padding:5px 1px;place-items:center;align-content:start;gap:5px;border:0;border-radius:13px;background:transparent;color:var(--asana-text); }
.asana-calendar-day.is-outside { opacity:.42; }
.asana-calendar-day.is-selected { background:color-mix(in srgb,var(--asana-accent) 24%,transparent);color:var(--asana-accent); }
.asana-calendar-date { font-size:12px; }
.asana-calendar-people { display:flex;min-height:18px;justify-content:center; }
.asana-calendar-avatar { width:18px;height:18px;margin-left:-3px;border:1px solid var(--asana-bg);font-size:6px; }
.asana-calendar-avatar:first-child { margin-left:0; }
.asana-calendar-agenda { display:grid;margin:12px -10px 0;padding:14px 10px 70px;border-top:1px solid var(--asana-border);gap:2px; }
.asana-calendar-agenda > h3 { margin:0 4px 8px;color:var(--asana-accent);font-size:15px; }
.asana-calendar-agenda-row { appearance:none;display:grid;width:100%;min-height:62px;grid-template-columns:30px minmax(0,1fr) auto 32px;padding:8px 3px;align-items:center;gap:8px;border:0;border-bottom:1px solid var(--asana-divider);background:transparent;text-align:left; }
.asana-calendar-complete { display:grid;width:24px;height:24px;place-items:center;border:1.5px solid var(--asana-muted);border-radius:50%;color:var(--asana-muted); }
.asana-calendar-complete.is-complete { border-color:var(--asana-green);background:var(--asana-green);color:#fff; }
.asana-calendar-agenda-row strong,.asana-calendar-agenda-row small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.asana-calendar-agenda-row strong { font-size:12px; }
.asana-calendar-agenda-row small,.asana-calendar-row-date { color:var(--asana-muted);font-size:9px; }


.asana-account-screen { display:grid;padding:12px 0 30px;gap:12px; }
.asana-account-profile { display:grid;padding:20px;place-items:center;gap:5px;border:1px solid var(--asana-divider);border-radius:18px;background:var(--asana-surface); }
.asana-account-logo { display:grid;width:58px;height:58px;place-items:center;border-radius:18px;background:var(--asana-raised); }
.asana-account-profile strong { font-size:17px; }
.asana-account-profile small { color:var(--asana-muted);font-size:10px; }
.asana-account-card { display:grid;padding:14px;border:1px solid var(--asana-divider);border-radius:17px;background:var(--asana-surface);gap:8px; }
.asana-account-card h2 { margin:0 0 4px;font-size:14px; }
.asana-account-action,.asana-account-workspace-row { display:flex;width:100%;min-height:48px;padding:8px 10px;align-items:center;justify-content:space-between;border:0;border-radius:10px;background:var(--asana-raised);color:var(--asana-text);font-size:11px;text-decoration:none; }
.asana-account-workspace-row span:first-child { display:grid;text-align:left;gap:2px; }
.asana-account-workspace-row small { color:var(--asana-muted);font-size:9px; }
.asana-account-check { color:var(--asana-green);font-weight:800; }
.asana-account-field { display:grid;gap:5px;color:var(--asana-muted);font-size:10px; }
.asana-account-field select { width:100%;height:44px;padding:0 10px;border:0;border-radius:10px;background:var(--asana-raised);color:var(--asana-text);font-size:11px; }
.asana-account-signout { color:#d64242; }

@media (min-width:760px) {
  .asana-content { max-width:1040px;margin:0 auto;padding-right:20px;padding-left:20px; }
  .asana-content[data-asana-view="project"] { max-width:none; }
  .asana-native-section { padding:18px 20px; }
  .asana-attachment-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

@media (orientation:landscape) {
  .asana-calendar-day { min-height:55px; }
}

@media (max-width:390px) {
  .asana-project-field-grid { grid-template-columns:1fr;padding-left:31px; }
  .asana-task-project-field { grid-template-columns:1fr;gap:0; }
  .asana-attachment-grid { grid-template-columns:1fr; }
}


/* v11.0.40 — Asana reference-aligned navigation, Home, Workload and documents */
.asana-app-header { min-height:58px;padding:7px 10px;gap:7px; }
.asana-header-spacer { flex:1; }
.asana-plano-home,.asana-workload-button,.asana-search-button,.asana-settings-button { appearance:none;display:flex;height:38px;align-items:center;justify-content:center;border:0;border-radius:11px;background:transparent;color:var(--asana-text); }
.asana-plano-home { width:auto;min-width:76px;padding:0 10px 0 7px;gap:3px;background:var(--plano-theme,#20B2AA);color:#fff;font-size:12px;font-weight:750; }
.asana-plano-home span,.asana-workload-button span { color:inherit;font-size:12px;font-weight:750; }
.asana-plano-home svg { width:20px;height:20px; }
.asana-workload-button { width:auto;min-width:98px;padding:0 9px;gap:6px;background:var(--asana-raised);font-size:11px; }
.asana-workload-button[aria-pressed="true"] { background:color-mix(in srgb,var(--plano-theme,#20B2AA) 16%,var(--asana-raised));color:var(--plano-theme,#20B2AA); }
.asana-workload-button svg { width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round; }
.asana-search-button,.asana-settings-button { width:38px;flex:0 0 38px; }
.asana-search-button svg { width:21px;height:21px; }
.asana-settings-button { font-size:20px;letter-spacing:1px; }
.asana-plano-home:active,.asana-workload-button:active,.asana-search-button:active,.asana-settings-button:active { filter:brightness(.96); }
.asana-content { min-height:calc(100dvh - 58px);padding-bottom:calc(24px + env(safe-area-inset-bottom)); }
.asana-content[data-asana-view="task"] { padding-bottom:calc(132px + env(safe-area-inset-bottom)); }
.asana-search-controls { top:58px; }

.asana-native-section { margin:7px 0 10px;padding:11px 12px;border-radius:15px; }
.asana-home-projects-box h2 { margin-bottom:5px; }
.asana-home-project-divider { height:1px;margin:8px 0 10px;background:var(--asana-divider); }
.asana-home-page { padding:0 12px; }
.asana-home-task-row { display:grid;grid-template-columns:28px minmax(0,1fr);width:100%;min-height:46px;padding:4px 2px;align-items:center;gap:9px; }
.asana-home-task-row.is-complete .asana-home-task-open strong { color:var(--asana-muted);text-decoration:line-through; }
.asana-home-task-open { width:100%;height:100%;padding:0;border:0;background:transparent;color:var(--asana-text);text-align:left; }
.asana-home-task-open strong { display:block;overflow:hidden;font-size:13px;font-weight:590;text-overflow:ellipsis;white-space:nowrap; }
.asana-home-task-check { padding:0;background:transparent; }
.asana-home-project-row { min-height:48px;padding:4px 2px; }
.asana-home-project-row .asana-project-icon { width:36px;height:36px; }
.asana-home-page-controls { display:grid;grid-template-columns:32px 1fr 32px;min-height:30px;align-items:center; }
.asana-home-page-arrow { width:30px;height:28px;padding:0;border:0;border-radius:8px;background:transparent;color:var(--asana-muted);font-size:20px; }
.asana-home-page-dots { min-height:24px; }
.asana-home-page-dot { display:block; }

.asana-manage-backdrop { padding-bottom:calc(18px + env(safe-area-inset-bottom)); }
.asana-manage-sheet { max-height:min(calc(100dvh - 72px - env(safe-area-inset-bottom)),720px); }

.asana-task-title { margin:5px 2px 9px;font-size:20px; }
.asana-task-meta-grid { gap:0;border-top:1px solid var(--asana-divider);border-bottom:1px solid var(--asana-divider); }
.asana-edit-field { min-height:58px;padding:7px 8px;border:0;border-radius:0;background:transparent; }
.asana-edit-field + .asana-edit-field { border-left:1px solid var(--asana-divider); }
.asana-edit-field input,.asana-edit-field select,.asana-project-field-cell select,.asana-project-field-cell input,.asana-task-field-list select { appearance:none;-webkit-appearance:none;background-image:none; }
.asana-task-project-field { display:block;border:0;border-radius:0;background:transparent; }
.asana-task-project-chip { min-height:42px;padding:5px 3px;color:var(--asana-text); }
.asana-task-project-chip > span:last-child { font-size:12px;font-weight:600; }
.asana-task-field-list { gap:0;border:1px solid var(--asana-divider);border-radius:11px;overflow:hidden; }
.asana-task-field-list .asana-edit-field { min-height:50px;border-bottom:1px solid var(--asana-divider); }
.asana-task-field-list .asana-edit-field:last-child { border-bottom:0; }
.asana-task-detail h2 { padding-top:14px;font-size:13px; }
.asana-task-notes,.asana-task-empty { font-size:12px; }

.asana-document-list { border-top:1px solid var(--asana-divider); }
.asana-document-row { grid-template-columns:minmax(0,1fr);min-height:60px;padding:7px 12px;gap:5px; }
.asana-document-name,.asana-attachment-name { display:block;width:100%;padding:0;border:0;background:transparent;color:var(--asana-text);text-align:left; }
.asana-document-name strong,.asana-document-name small,.asana-attachment-name strong,.asana-attachment-name small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.asana-document-name strong { font-size:12px; }
.asana-document-name small { margin-top:2px;color:var(--asana-muted);font-size:9px; }
.asana-document-actions { justify-content:flex-start;flex-wrap:nowrap; }
.asana-document-actions button { min-height:30px;padding:0 8px;border-radius:7px;font-size:9px;white-space:nowrap; }
.asana-attachment-card > .asana-attachment-name strong,.asana-attachment-card > .asana-attachment-name small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.asana-attachment-card > .asana-attachment-name strong { font-size:10px; }
.asana-attachment-card > .asana-attachment-name small { margin-top:2px;color:var(--asana-muted);font-size:8px; }

.asana-task-composer { bottom:env(safe-area-inset-bottom); }
.asana-composer-icon,.asana-composer-send { border-radius:8px; }
.asana-composer-send { background:var(--plano-theme,#20B2AA); }

.asana-workload-toolbar { position:relative;z-index:4;display:flex;justify-content:flex-end;padding:7px 0 5px;background:var(--asana-bg); }
.asana-workload-view-switch { display:grid;grid-template-columns:1fr 1fr;width:164px;height:36px;padding:3px;border:1px solid var(--asana-border);border-radius:10px;background:var(--asana-raised); }
.asana-workload-view-switch button { border:0;border-radius:7px;background:transparent;color:var(--asana-muted);font-size:10px;font-weight:700; }
.asana-workload-view-switch button.is-selected { background:var(--asana-bg);color:var(--asana-text);box-shadow:0 1px 3px rgba(0,0,0,.08); }
.asana-calendar-shell { display:grid;width:100%;height:calc(100dvh - var(--app-safe-top) - 58px);padding:0;grid-template-rows:auto auto auto minmax(0,1fr);overflow:hidden; }
.asana-workload-list-shell { grid-template-rows:auto auto minmax(0,1fr); }
.asana-calendar-month-zone { padding:0 0 4px; }
.asana-calendar-header { min-height:44px; }
.asana-calendar-header button { width:36px;height:36px;border-radius:9px;background:transparent; }
.asana-calendar-day { position:relative;min-height:42px;padding:4px 1px;align-content:center;gap:2px;border-radius:50%; }
.asana-calendar-day.is-selected { background:var(--plano-theme,#20B2AA);color:#fff; }
.asana-calendar-task-dot { position:absolute;right:3px;bottom:1px;display:grid;min-width:11px;height:11px;padding:0 2px;place-items:center;border-radius:6px;background:var(--asana-accent);color:#fff;font-size:7px; }
.asana-calendar-today { justify-self:center;min-height:30px;margin:2px 0 4px;padding:0 12px;border:1px solid var(--asana-border);border-radius:15px;background:var(--asana-bg);color:var(--plano-theme,#20B2AA);font-size:10px;font-weight:750; }
.asana-calendar-today[hidden] { visibility:hidden; }
.asana-workload-agenda { display:block;min-height:0;margin:0 -10px;padding:0 10px calc(22px + env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior-y:none;border-top:1px solid var(--asana-border);scroll-behavior:smooth; }
.asana-workload-day { scroll-margin-top:4px; }
.asana-workload-day > h3 { position:sticky;z-index:2;top:0;margin:0 -10px;padding:10px 14px 6px;background:var(--asana-bg);color:var(--asana-text);font-size:13px;font-weight:750; }
.asana-calendar-agenda-row { display:grid;grid-template-columns:30px minmax(0,1fr);min-height:54px;padding:6px 3px;align-items:center;gap:8px;border-bottom:1px solid var(--asana-divider); }
.asana-calendar-task-open { width:100%;min-height:42px;padding:0;border:0;background:transparent;color:var(--asana-text);text-align:left; }
.asana-calendar-task-open > span { display:block; }
.asana-calendar-agenda-row.is-complete strong { color:var(--asana-muted);text-decoration:line-through; }
.asana-calendar-complete { padding:0;background:transparent; }

.asana-settings-backdrop,.asana-document-preview-backdrop { position:fixed;z-index:150;inset:0;display:flex;padding:14px 12px calc(14px + env(safe-area-inset-bottom));align-items:flex-end;justify-content:center;background:rgba(0,0,0,.34); }
.asana-settings-sheet { display:grid;width:min(100%,540px);max-height:calc(100dvh - var(--app-safe-top) - 20px);overflow-y:auto;padding:0 12px 16px;border:1px solid var(--asana-border);border-radius:20px;background:var(--asana-bg);box-shadow:0 16px 50px rgba(0,0,0,.24);gap:10px; }
.asana-settings-sheet-header { position:sticky;z-index:2;top:0;display:flex;min-height:50px;align-items:center;justify-content:space-between;border-bottom:1px solid var(--asana-divider);background:var(--asana-bg); }
.asana-settings-sheet-header strong { font-size:14px; }
.asana-settings-sheet-header button { border:0;background:transparent;color:var(--plano-theme,#20B2AA);font-size:11px;font-weight:750; }
.asana-settings-sheet .asana-account-profile { padding:12px;border-radius:13px; }
.asana-settings-sheet .asana-account-logo { width:42px;height:42px;border-radius:12px; }
.asana-home-order-row { display:flex;min-height:42px;padding:3px 0;align-items:center;justify-content:space-between;border-bottom:1px solid var(--asana-divider); }
.asana-home-order-row:last-child { border-bottom:0; }
.asana-home-order-row strong { font-size:11px; }
.asana-home-order-actions { display:flex;gap:5px; }
.asana-home-order-actions button { width:32px;height:30px;padding:0;border:0;border-radius:8px;background:var(--asana-raised);font-size:15px; }
.asana-home-order-actions button:disabled { opacity:.3; }
.asana-account-field select { appearance:none;-webkit-appearance:none;background-image:none; }

.asana-document-preview-backdrop { z-index:170;padding:var(--app-safe-top) 0 0;align-items:stretch; }
.asana-document-preview { display:grid;width:min(100%,900px);height:100%;margin:0 auto;grid-template-rows:52px minmax(0,1fr);overflow:hidden;background:var(--asana-bg); }
.asana-document-preview-header { display:flex;padding:0 12px;align-items:center;justify-content:space-between;border-bottom:1px solid var(--asana-border); }
.asana-document-preview-header strong { overflow:hidden;font-size:13px;text-overflow:ellipsis;white-space:nowrap; }
.asana-document-preview-header button { width:38px;height:38px;border:0;border-radius:50%;background:var(--asana-raised);font-size:22px; }
.asana-document-preview-body { min-height:0;overflow:auto;padding:10px; }
.asana-document-preview-frame { width:100%;height:calc(100% - 44px);min-height:70dvh;border:0;background:#fff; }
.asana-document-preview-image { display:block;max-width:100%;max-height:calc(100dvh - 130px);margin:auto;object-fit:contain; }
.asana-zip-preview { display:grid; }
.asana-zip-row { display:grid;grid-template-columns:minmax(0,1fr) auto;padding:8px 4px;border-bottom:1px solid var(--asana-divider);gap:10px; }
.asana-zip-row span { overflow:hidden;font-size:11px;text-overflow:ellipsis;white-space:nowrap; }
.asana-zip-row small { color:var(--asana-muted);font-size:9px; }
.asana-xlsx-preview { width:100%;overflow:auto; }
.asana-xlsx-preview table { border-collapse:collapse;font-size:10px; }
.asana-xlsx-preview td { min-width:90px;padding:5px 7px;border:1px solid var(--asana-border);white-space:nowrap; }
.asana-docx-preview { margin:0;white-space:pre-wrap;font:12px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.asana-document-preview-footer { display:flex;padding:10px 0;justify-content:flex-end; }
.asana-document-preview-footer a { min-height:36px;padding:0 14px;display:flex;align-items:center;border-radius:9px;background:var(--asana-raised);color:var(--plano-theme,#20B2AA);font-size:11px;font-weight:750;text-decoration:none; }

/* v11.0.40 — iOS-safe stationary Asana chrome and bounded page scrolling. */
body[data-workspace-section="asana"] .plano-section-view {
  height:var(--plano-viewport-height);
  max-height:var(--plano-viewport-height);
  padding:0;
  overflow:hidden;
  overscroll-behavior:none;
}
body[data-workspace-section="asana"] #workspace-asana-panel {
  height:100%;
  max-height:100%;
  margin:0;
}
.asana-workspace {
  display:flex;
  min-height:0;
  height:100%;
  max-height:100%;
  padding:var(--app-safe-top) 0 var(--safe-bottom);
  flex-direction:column;
  overflow:hidden;
  overscroll-behavior:none;
}
.asana-app-header {
  position:relative;
  z-index:80;
  top:auto;
  flex:0 0 58px;
}
.asana-search-controls {
  position:relative;
  z-index:79;
  top:auto;
  flex:0 0 auto;
}
.asana-content {
  min-height:0;
  height:auto;
  flex:1 1 auto;
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:none;
  -webkit-overflow-scrolling:touch;
}
.asana-project-view-toolbar { top:0; }
.asana-manage-backdrop,
.asana-photo-menu-backdrop,
.asana-attachment-action-backdrop,
.asana-settings-backdrop,
.asana-document-preview-backdrop {
  padding-top:calc(var(--app-safe-top) + 8px);
}
.asana-manage-sheet,
.asana-photo-menu,
.asana-attachment-action-sheet,
.asana-settings-sheet,
.asana-document-preview { overscroll-behavior:none; }