/* Batch DEV191: every desktop calculator state uses the KL8 workbench frame. */

@media (min-width: 901px) and (max-width: 1699px) {
  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench {
    box-sizing: border-box !important;
    width: calc(80vw - 272px) !important;
    min-width: 0 !important;
    max-width: calc(100vw - 12px) !important;
    column-gap: 4px !important;
    transition: none !important;
    animation: none !important;
  }
}

@media (min-width: 1700px) and (max-width: 2100px) {
  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench {
    box-sizing: border-box !important;
    width: 64vw !important;
    min-width: 0 !important;
    max-width: calc(100vw - 12px) !important;
    column-gap: 4px !important;
    transition: none !important;
    animation: none !important;
  }
}

@media (min-width: 2101px) {
  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench {
    box-sizing: border-box !important;
    /* 批TGW-DEV228：封顶1600px（原 calc(80vw - 336px) 在3440带鱼屏算出2416px，按钮被拉成超宽条），内部复用已校准双栏布局 */
    width: min(1600px, calc(80vw - 336px)) !important;
    min-width: 0 !important;
    max-width: calc(100vw - 12px) !important;
    column-gap: 4px !important;
    transition: none !important;
    animation: none !important;
  }
}

@media (min-width: 901px) {
  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench > :is(
    .indicator-drawer__forms,
    .set-condition-calculator,
    .desktop-digit-analysis-workspace,
    .number-group-extractor,
    .indicator-config,
    #prizeCalculatorPanel
  ) {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench.is-prize-calculator-view
  > #prizeCalculatorPanel {
    column-gap: 4px !important;
  }
}

/* Keep the fixed five-digit controls readable when the KL8 frame is narrow. */
@media (min-width: 901px) and (max-width: 1449px) {
  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench.is-prize-calculator-view
  > #prizeCalculatorPanel .prize-calculator-inline-row:not(.is-digit-positions) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 4px !important;
    row-gap: 4px !important;
  }

  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench.is-prize-calculator-view
  > #prizeCalculatorPanel .prize-calculator-inline-row.is-floating-prizes {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench.is-prize-calculator-view
  > #prizeCalculatorPanel .prize-calculator-field--check > span {
    white-space: normal !important;
    line-height: 1.3 !important;
  }
}

@media (min-width: 1101px) and (max-width: 1449px) {
  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench.is-prize-calculator-view
  > #prizeCalculatorPanel .prize-calculator-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 4px !important;
    row-gap: 4px !important;
  }
}

@media (min-width: 1450px) and (max-width: 1699px) {
  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench.is-prize-calculator-view
  > #prizeCalculatorPanel .prize-calculator-fields {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    column-gap: 4px !important;
    row-gap: 4px !important;
  }
}

/* The KL8/SSQ/DLT inner grids must shrink with the fixed frame as well. */
@media (min-width: 901px) {
  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench
  > .set-condition-calculator > #desktopUnifiedLotteryCalculator#desktopUnifiedLotteryCalculator {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    column-gap: 4px !important;
    overflow-x: hidden !important;
  }
}

@media (min-width: 1101px) and (max-width: 1449px) {
  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench
  > .set-condition-calculator > #desktopUnifiedLotteryCalculator#desktopUnifiedLotteryCalculator:is(
    [data-desktop-unified-calculator="kl8"],
    [data-desktop-unified-calculator="ssq"],
    [data-desktop-unified-calculator="dlt"]
  ) {
    grid-template-columns: minmax(0, 1fr) 185px !important;
    grid-template-rows: minmax(360px, 1fr) 130px 144px !important;
    gap: 4px !important;
    padding: 0 4px 4px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench
  > .set-condition-calculator > #desktopUnifiedLotteryCalculator#desktopUnifiedLotteryCalculator[data-desktop-unified-calculator="kl8"] {
    grid-template-columns: 240px minmax(0, 1fr) !important;
    grid-template-rows: minmax(577px, auto) 130px 144px !important;
  }

  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench
  > .set-condition-calculator > #desktopUnifiedLotteryCalculator#desktopUnifiedLotteryCalculator:is(
    [data-desktop-unified-calculator="ssq"],
    [data-desktop-unified-calculator="dlt"]
  ) {
    grid-template-rows: minmax(451px, auto) 130px 144px !important;
  }

  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench
  > .set-condition-calculator > #desktopUnifiedLotteryCalculator#desktopUnifiedLotteryCalculator[data-desktop-unified-calculator="kl8"]
  > .desktop-unified-lottery-panel.is-active-lottery-panel > .desktop-kl8-left-stack {
    display: grid !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: minmax(0, 1fr) 100px !important;
    gap: 4px !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench
  > .set-condition-calculator > #desktopUnifiedLotteryCalculator#desktopUnifiedLotteryCalculator[data-desktop-unified-calculator="kl8"]
  > .desktop-unified-lottery-panel.is-active-lottery-panel > .desktop-kl8-left-stack > .desktop-kl8-rotation-host {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
  }

  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench
  > .set-condition-calculator > #desktopUnifiedLotteryCalculator#desktopUnifiedLotteryCalculator[data-desktop-unified-calculator="kl8"]
  > .desktop-unified-lottery-panel.is-active-lottery-panel > .desktop-kl8-left-stack > .lotto-n-out-n-panel {
    grid-column: 1 !important;
    grid-row: 2 !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
  }

  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench
  > .set-condition-calculator > #desktopUnifiedLotteryCalculator#desktopUnifiedLotteryCalculator:is(
    [data-desktop-unified-calculator="kl8"],
    [data-desktop-unified-calculator="ssq"],
    [data-desktop-unified-calculator="dlt"]
  ) [data-desktop-compact-mount] {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench
  > .set-condition-calculator > #desktopUnifiedLotteryCalculator#desktopUnifiedLotteryCalculator[data-desktop-unified-calculator="kl8"]
  > .desktop-unified-lottery-panel.is-active-lottery-panel > [data-desktop-compact-mount] {
    grid-column: 2 !important;
    grid-row: 1 !important;
  }

  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench
  > .set-condition-calculator > #desktopUnifiedLotteryCalculator#desktopUnifiedLotteryCalculator:is(
    [data-desktop-unified-calculator="kl8"],
    [data-desktop-unified-calculator="ssq"],
    [data-desktop-unified-calculator="dlt"]
  ) .mobile-lotto-results {
    grid-column: 1 !important;
    grid-row: 2 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
  }

  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench
  > .set-condition-calculator > #desktopUnifiedLotteryCalculator#desktopUnifiedLotteryCalculator:is(
    [data-desktop-unified-calculator="kl8"],
    [data-desktop-unified-calculator="ssq"],
    [data-desktop-unified-calculator="dlt"]
  ) > #indicatorListRail {
    display: grid !important;
    position: static !important;
    inset: auto !important;
    grid-column: 2 !important;
    grid-row: 2 !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench
  > .set-condition-calculator > #desktopUnifiedLotteryCalculator#desktopUnifiedLotteryCalculator:is(
    [data-desktop-unified-calculator="kl8"],
    [data-desktop-unified-calculator="ssq"],
    [data-desktop-unified-calculator="dlt"]
  ) > #indicatorListRail > #setCalculatorConditionPanel {
    display: grid !important;
    grid-template-rows: minmax(0, 1fr) !important;
    grid-row: 1 !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
  }

  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench
  > .set-condition-calculator > #desktopUnifiedLotteryCalculator#desktopUnifiedLotteryCalculator:is(
    [data-desktop-unified-calculator="kl8"],
    [data-desktop-unified-calculator="ssq"],
    [data-desktop-unified-calculator="dlt"]
  ) > #indicatorListRail {
    grid-template-rows: repeat(2, minmax(0, 1fr)) !important;
  }

  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench
  > .set-condition-calculator > #desktopUnifiedLotteryCalculator#desktopUnifiedLotteryCalculator:is(
    [data-desktop-unified-calculator="kl8"],
    [data-desktop-unified-calculator="ssq"],
    [data-desktop-unified-calculator="dlt"]
  ) > #indicatorListRail > #indicatorResultRail {
    grid-row: 2 !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench
  > .set-condition-calculator > #desktopUnifiedLotteryCalculator#desktopUnifiedLotteryCalculator:is(
    [data-desktop-unified-calculator="kl8"],
    [data-desktop-unified-calculator="ssq"],
    [data-desktop-unified-calculator="dlt"]
  ) > .desktop-unified-lottery-panel.is-active-lottery-panel > .desktop-official-analysis-workspace {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
  }
}

@media (min-width: 1450px) {
  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench
  > .set-condition-calculator > #desktopUnifiedLotteryCalculator#desktopUnifiedLotteryCalculator[data-desktop-unified-calculator="kl8"] {
    grid-template-columns: minmax(200px, 28fr) minmax(260px, 32fr) minmax(150px, 18fr) minmax(160px, 22fr) !important;
    grid-template-rows: minmax(0, 1fr) 144px !important;
    gap: 4px !important;
    padding: 0 4px 4px !important;
  }

  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench
  > .set-condition-calculator > #desktopUnifiedLotteryCalculator#desktopUnifiedLotteryCalculator:is(
    [data-desktop-unified-calculator="ssq"],
    [data-desktop-unified-calculator="dlt"]
  ) {
    grid-template-columns: minmax(180px, 20fr) minmax(300px, 36fr) minmax(160px, 22fr) minmax(160px, 22fr) !important;
    grid-template-rows: minmax(0, 1fr) 144px !important;
    gap: 4px !important;
    padding: 0 4px 4px !important;
  }

  html body
  #indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer#indicatorDrawer.is-realtime-number-tool.is-calculator-workbench
  > .set-condition-calculator > #desktopUnifiedLotteryCalculator#desktopUnifiedLotteryCalculator:is(
    [data-desktop-unified-calculator="kl8"],
    [data-desktop-unified-calculator="ssq"],
    [data-desktop-unified-calculator="dlt"]
  ) > .desktop-unified-lottery-panel.is-active-lottery-panel > .desktop-official-analysis-workspace {
    grid-row: 2 !important;
    height: 144px !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }
}