/* Raised chart controls, matched to the calculator lottery colors. */
.app-shell button,
.chart3-dialog button {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.34), inset 0 -2px 0 rgba(0,0,0,.24), 0 2px 4px rgba(0,0,0,.34) !important;
  transition: filter .12s ease, transform .12s ease, box-shadow .12s ease !important;
}

.app-shell button:hover,
.app-shell button:focus-visible,
.chart3-dialog button:hover,
.chart3-dialog button:focus-visible {
  filter: brightness(1.24) saturate(1.08);
  transform: translateY(-1px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.48), inset 0 -2px 0 rgba(0,0,0,.2), 0 4px 7px rgba(0,0,0,.42) !important;
  outline: none;
}

.app-shell button:active,
.chart3-dialog button:active {
  filter: brightness(.9) saturate(1.04);
  transform: translateY(1px);
  box-shadow: inset 0 2px 5px rgba(0,0,0,.42), 0 1px 2px rgba(0,0,0,.3) !important;
}

.top-game-selector .game-button:is([data-game="fc3d"],[data-game="kl8"],[data-game="ssq"]),
html body #chartFunction3Dialog.chart3-dialog .chart3-game-button:is([data-chart3-game="fc3d"],[data-chart3-game="kl8"],[data-chart3-game="ssq"]) {
  border-color: #a89143 !important;
  background: linear-gradient(180deg,#756a3c 0%,#5e552f 100%) !important;
  color: #fff2b3 !important;
}

.top-game-selector .game-button:is([data-game="pl3"],[data-game="pl5"],[data-game="dlt"]),
html body #chartFunction3Dialog.chart3-dialog .chart3-game-button:is([data-chart3-game="pl3"],[data-chart3-game="pl5"],[data-chart3-game="dlt"]) {
  border-color: #69a187 !important;
  background: linear-gradient(180deg,#4f7966 0%,#3d604f 100%) !important;
  color: #e7fff2 !important;
}

.top-game-selector .game-button:is([data-game="fc3d"],[data-game="kl8"],[data-game="ssq"])[aria-pressed="true"],
html body #chartFunction3Dialog.chart3-dialog .chart3-game-button:is([data-chart3-game="fc3d"],[data-chart3-game="kl8"],[data-chart3-game="ssq"])[aria-pressed="true"] {
  border: 2px solid #ffe98a !important;
  background: linear-gradient(180deg,#ffe36a 0%,#d9a916 100%) !important;
  color: #211900 !important;
  filter: brightness(1.06);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.58), inset 0 -2px 0 rgba(78,55,0,.28), 0 0 0 2px rgba(255,233,138,.3), 0 3px 7px rgba(0,0,0,.4) !important;
}

.top-game-selector .game-button:is([data-game="pl3"],[data-game="pl5"],[data-game="dlt"])[aria-pressed="true"],
html body #chartFunction3Dialog.chart3-dialog .chart3-game-button:is([data-chart3-game="pl3"],[data-chart3-game="pl5"],[data-chart3-game="dlt"])[aria-pressed="true"] {
  border: 2px solid #a8f0c8 !important;
  background: linear-gradient(180deg,#70eab0 0%,#2bbd77 100%) !important;
  color: #fff !important;
  filter: brightness(1.06);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.5), inset 0 -2px 0 rgba(0,65,34,.28), 0 0 0 2px rgba(168,240,200,.28), 0 3px 7px rgba(0,0,0,.4) !important;
}

@media (min-width:681px) {
  .drawing-toolbar { right:auto !important; left:4px; width:fit-content !important; max-width:calc(100% - 8px) !important; }
  .drawing-toolbar__head,.drawing-toolbar__row { width:fit-content; max-width:100%; }
  .drawing-toolbar__drag { flex:0 1 auto !important; width:auto; }
  .chart-drawing-toolbar { top:76px; right:auto !important; left:10px; width:fit-content !important; max-width:calc(100% - 20px) !important; }
  .chart-drawing-toolbar__head,.chart-drawing-toolbar__row { width:fit-content; max-width:100%; }
  .chart-drawing-toolbar__drag { flex:0 1 auto !important; width:auto; }
}

.drawing-magnifier-lens,.chart-drawing-magnifier,.mobile-three-drawing-magnifier {
  position:fixed; z-index:2600; width:250px; height:180px; overflow:hidden;
  border:3px solid #ffe36a; border-radius:12px; background:#fff;
  box-shadow:0 8px 26px rgba(0,0,0,.62),inset 0 0 0 1px rgba(0,0,0,.24); pointer-events:none;
}
.drawing-magnifier-lens[hidden],.chart-drawing-magnifier[hidden],.mobile-three-drawing-magnifier[hidden] { display:none; }
.drawing-overlay.is-magnifier,.chart-drawing-surface.is-magnifier,.mobile-three-drawing-overlay.is-magnifier { cursor:zoom-in !important; }
.chart-drawing-magnifier__content,.mobile-three-drawing-magnifier__content { position:absolute; top:0; left:0; transform-origin:0 0; will-change:transform; }

@media (max-width:680px) {
  .drawing-magnifier-lens,.chart-drawing-magnifier,.mobile-three-drawing-magnifier { width:min(230px,calc(100vw - 16px)); height:160px; border-radius:9px; }
}
