/* Lotto Orbit — Unified Historical Analysis + Draw Checker polish
   Scoped to 27 lottery studios. Styling only: existing inputs, IDs,
   Javascript, lottery-specific wording, layouts and comparison logic remain. */
html[data-theme] body[data-game].vp-site-studio {
  --lo-data-edge: var(--lo-rule, #d8e5ed);
  --lo-data-surface: var(--lo-surface, #fff);
  --lo-data-soft: var(--lo-quiet, #f2f8fa);
  --lo-data-ink: var(--lo-ink, #193347);
  --lo-data-muted: var(--lo-subtext, #627a8d);
  --lo-data-blue: var(--lo-azure, #216da4);
  --lo-data-gap: clamp(15px, 1.7vw, 22px);
}

/* Give expanded panels breathing room; original bodies begin flush with header. */
html[data-theme] body[data-game].vp-site-studio main.container :is(#historyTools,#checkTools).details-block[open] > .details-content {
  padding: clamp(18px,2.1vw,28px) !important;
  background: var(--lo-data-surface) !important;
  min-width:0 !important;
  display:flow-root !important;
  color:var(--lo-data-ink) !important;
}
html[data-theme] body[data-game].vp-site-studio :is(#historyTools,#checkTools) .details-content > :first-child {margin-top:0 !important}
html[data-theme] body[data-game].vp-site-studio :is(#historyTools,#checkTools) .details-content > :last-child {margin-bottom:0 !important}
html[data-theme] body[data-game].vp-site-studio :is(#historyTools,#checkTools) .details-content .control-label,
html[data-theme] body[data-game].vp-site-studio #historyTools .atlas-history-period > label {
  display:block;
  margin:0 0 9px !important;
  font-size:11.5px !important;
  font-weight:800 !important;
  line-height:1.45 !important;
  letter-spacing:.01em !important;
  color:var(--lo-data-ink) !important;
  text-transform:none;
}
html[data-theme] body[data-game].vp-site-studio :is(#historyTools,#checkTools) .details-content .hint,
html[data-theme] body[data-game].vp-site-studio :is(#historyTools,#checkTools) .details-content :is(.atlas-draw-fieldnote,.atlas-draw-footnote),
html[data-theme] body[data-game].vp-site-studio #historyTools .atlas-history-period small {
  font-size:12px !important;
  line-height:1.65 !important;
  color:var(--lo-data-muted) !important;
  opacity:1 !important;
}
html[data-theme] body[data-game].vp-site-studio :is(#historyTools,#checkTools) .details-content :is(input:not([type=hidden]),select,textarea) {
  min-width:0 !important;
  box-sizing:border-box !important;
  max-width:100% !important;
  border-radius:11px !important;
  border:1px solid var(--lo-data-edge) !important;
  background:var(--lo-data-soft) !important;
  color:var(--lo-data-ink) !important;
  font-size:13px !important;
  line-height:1.5 !important;
  padding:12px 13px !important;
  box-shadow:none !important;
}
html[data-theme] body[data-game].vp-site-studio :is(#historyTools,#checkTools) .details-content :is(input:not([type=hidden]),select):not([type=checkbox]) {
  min-height:46px !important;
}
html[data-theme] body[data-game].vp-site-studio :is(#historyTools,#checkTools) .details-content input::placeholder,
html[data-theme] body[data-game].vp-site-studio :is(#historyTools,#checkTools) .details-content textarea::placeholder {
  color:var(--lo-data-muted) !important;
  opacity:.82 !important;
}
html[data-theme] body[data-game].vp-site-studio :is(#historyTools,#checkTools) .details-content :is(input,select,textarea):focus-visible {
  outline:2px solid var(--lo-data-blue) !important;
  outline-offset:2px !important;
  border-color:var(--lo-data-blue) !important;
}

/* HISTORY: balanced form and explanation columns; no flush title or wasted gutters. */
html[data-theme] body[data-game].vp-site-studio #historyTools .details-content > .grid-2 {
  display:grid !important;
  grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr) !important;
  gap:clamp(18px,2.2vw,30px) !important;
  align-items:start !important;
  margin:0 0 20px !important;
}
html[data-theme] body[data-game].vp-site-studio #historyTools .details-content > .grid-2 > div {min-width:0 !important;}
html[data-theme] body[data-game].vp-site-studio #historyTools #historyInput {
  display:block;
  width:100% !important;
  min-height:154px !important;
  height:auto !important;
  max-height:340px;
  resize:vertical;
  margin:0 0 12px !important;
}
html[data-theme] body[data-game].vp-site-studio #historyTools .action-cluster {
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:10px !important;
  margin:0 0 19px !important;
}
html[data-theme] body[data-game].vp-site-studio #historyTools .action-cluster .button {
  width:100% !important;
  min-height:43px !important;
  padding:10px !important;
  border-radius:10px !important;
  line-height:1.35 !important;
  font-size:11.5px !important;
  font-weight:750 !important;
  letter-spacing:0 !important;
}
html[data-theme] body[data-game].vp-site-studio #historyTools label[for="historyFile"] {margin-top:0 !important;}
html[data-theme] body[data-game].vp-site-studio #historyTools #historyFile {
  width:100% !important;
  display:block;
  padding:8px 11px !important;
  min-height:46px !important;
  font-size:11.5px !important;
}
html[data-theme] body[data-game].vp-site-studio #historyTools #historyFile::file-selector-button {
  margin-right:12px;
  min-height:28px;
  padding:5px 12px;
  border:1px solid var(--lo-data-edge);
  border-radius:8px;
  background:var(--lo-data-surface);
  color:var(--lo-data-ink);
  font:700 11px Montserrat,system-ui,sans-serif;
  cursor:pointer;
}
html[data-theme] body[data-game].vp-site-studio #historyTools .grid-2 h3 {
  font-size:17px !important;
  line-height:1.35 !important;
  margin:0 0 11px !important;
  color:var(--lo-data-ink) !important;
}
html[data-theme] body[data-game].vp-site-studio #historyTools .grid-2 .hint {
  margin:0 0 11px !important;
}
html[data-theme] body[data-game].vp-site-studio #historyTools .grid-2 .callout {
  padding:15px 17px !important;
  margin:14px 0 0 !important;
  border:1px solid var(--lo-data-edge) !important;
  border-radius:13px !important;
  background:var(--lo-data-soft) !important;
  color:var(--lo-data-muted) !important;
  font-size:12px !important;
  line-height:1.65 !important;
}
html[data-theme] body[data-game].vp-site-studio #historyTools .grid-2 .callout strong {color:var(--lo-data-blue) !important;}
/* Period picker is a compact horizontal toolbar (only one frame). */
html[data-theme] body[data-game].vp-site-studio #historyTools .atlas-history-period {
  width:100% !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(205px,270px) !important;
  gap:7px 18px !important;
  align-items:center !important;
  padding:16px 18px !important;
  margin:0 0 15px !important;
  background:var(--lo-data-soft) !important;
  border:1px solid var(--lo-data-edge) !important;
  border-radius:14px !important;
  box-shadow:none !important;
}
html[data-theme] body[data-game].vp-site-studio #historyTools .atlas-history-period label {margin:0 !important;}
html[data-theme] body[data-game].vp-site-studio #historyTools .atlas-history-period select {
  width:100% !important;
  max-width:100% !important;
  justify-self:end !important;
  background:var(--lo-data-surface) !important;
  padding-right:36px !important;
}
html[data-theme] body[data-game].vp-site-studio #historyTools .atlas-history-period small {
  grid-column:1 / -1 !important;
  max-width:none !important;
  margin:0 !important;
}
html[data-theme] body[data-game].vp-site-studio #historyTools #historyResults {
  margin:0 !important;
  min-width:0 !important;
  overflow-wrap:anywhere;
}
html[data-theme] body[data-game].vp-site-studio #historyTools #historyResults:not(:empty) {
  padding:12px 14px;
  border-radius:12px;
  border:1px solid var(--lo-data-edge);
  background:var(--lo-data-soft);
  font-size:12px;
}

/* CHECKER: prompt, optional date, and result sets with consistent vertical rhythm. */
html[data-theme] body[data-game].vp-site-studio #checkTools .details-content > :is(.hint,.atlas-draw-footnote) {
  margin:0 0 14px !important;
}
html[data-theme] body[data-game].vp-site-studio #checkTools :is(.atlas-draw-intro,.atlas-new-draw-note) {
  margin:0 0 18px !important;
  min-width:0 !important;
  padding:17px 19px !important;
  border:1px solid var(--lo-data-edge) !important;
  border-left:3px solid var(--lo-data-blue) !important;
  border-radius:13px !important;
  background:var(--lo-data-soft) !important;
  box-shadow:none !important;
  color:var(--lo-data-ink) !important;
}
html[data-theme] body[data-game].vp-site-studio #checkTools :is(.atlas-draw-intro,.atlas-new-draw-note) h3 {
  margin:5px 0 8px !important;
  font-size:17px !important;
  line-height:1.4 !important;
  color:var(--lo-data-ink) !important;
}
html[data-theme] body[data-game].vp-site-studio #checkTools :is(.atlas-draw-intro,.atlas-new-draw-note) p {
  margin:4px 0 0 !important;
  font-size:12px !important;
  line-height:1.65 !important;
  color:var(--lo-data-muted) !important;
  max-width:90ch !important;
}
html[data-theme] body[data-game].vp-site-studio #checkTools .atlas-draw-intro .atlas-draw-orb {display:none !important;}
html[data-theme] body[data-game].vp-site-studio #checkTools .atlas-draw-date {
  margin:0 0 18px !important;
  padding:14px 17px !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(220px,320px) !important;
  gap:7px 17px !important;
  align-items:center !important;
  background:var(--lo-data-soft) !important;
  border:1px solid var(--lo-data-edge) !important;
  border-radius:13px !important;
}
html[data-theme] body[data-game].vp-site-studio #checkTools .atlas-draw-date label {margin:0 !important;}
html[data-theme] body[data-game].vp-site-studio #checkTools .atlas-draw-date input {width:100% !important;background:var(--lo-data-surface) !important;}
html[data-theme] body[data-game].vp-site-studio #checkTools .atlas-draw-date .hint {
  grid-column:1/-1;
  margin:0 !important;
}
html[data-theme] body[data-game].vp-site-studio #checkTools .atlas-draw-grid,
html[data-theme] body[data-game].vp-site-studio #checkTools .details-content > .grid-2 {
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr)) !important;
  gap:15px !important;
  align-items:stretch !important;
  min-width:0 !important;
  margin:0 0 18px !important;
}
html[data-theme] body[data-game].vp-site-studio #checkTools .atlas-draw-card {
  min-width:0 !important;
  box-sizing:border-box !important;
  margin:0 !important;
  padding:18px 17px 16px !important;
  border:1px solid var(--lo-data-edge) !important;
  border-radius:15px !important;
  background:var(--lo-data-surface) !important;
  box-shadow:none !important;
}
html[data-theme] body[data-game].vp-site-studio #checkTools .atlas-draw-card legend {
  color:var(--lo-data-blue) !important;
  font-size:11px !important;
  font-weight:850 !important;
  line-height:1.5 !important;
  letter-spacing:.015em !important;
  padding:0 8px !important;
  max-width:100% !important;
  white-space:normal !important;
}
html[data-theme] body[data-game].vp-site-studio #checkTools .atlas-draw-card .control-label {
  margin:10px 0 7px !important;
  line-height:1.45 !important;
}
html[data-theme] body[data-game].vp-site-studio #checkTools .atlas-draw-card :is(input,textarea) {
  width:100% !important;
  display:block !important;
  min-height:46px !important;
  margin:0 0 11px !important;
}
html[data-theme] body[data-game].vp-site-studio #checkTools .atlas-draw-card textarea {min-height:105px !important;resize:vertical;}
html[data-theme] body[data-game].vp-site-studio #checkTools .atlas-draw-card .atlas-draw-fieldnote {
  margin:6px 0 0 !important;
  font-size:11px !important;
  line-height:1.55 !important;
}
html[data-theme] body[data-game].vp-site-studio #checkTools .atlas-draw-card .atlas-draw-step {
  display:inline-grid;place-items:center;
  width:25px;height:25px;
  margin-right:7px;
  background:var(--lo-data-soft);
  color:var(--lo-data-blue);
  border:1px solid var(--lo-data-edge);
  border-radius:50%;
  font-size:10px;font-weight:800;
}
html[data-theme] body[data-game].vp-site-studio #checkTools .details-content > .hero-buttons {
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  flex-wrap:wrap !important;
  padding:16px 0 0 !important;
  margin:0 0 10px !important;
  border-top:1px solid var(--lo-data-edge) !important;
}
html[data-theme] body[data-game].vp-site-studio #checkTools .details-content > .hero-buttons .button {
  min-height:44px !important;
  padding:11px 16px !important;
  font-size:11.5px !important;
  letter-spacing:0 !important;
  font-weight:750 !important;
  border-radius:10px !important;
  margin:0 !important;
}
html[data-theme] body[data-game].vp-site-studio #checkTools :is(#resultOverview,#checkOutput) {margin:0 0 11px !important;min-width:0;}
html[data-theme] body[data-game].vp-site-studio #checkTools .details-content > .hint:last-child {margin-bottom:0 !important;}

/* Readable studio fields and stable mobile stacking. */
@media(max-width:900px) {
  html[data-theme] body[data-game].vp-site-studio #historyTools .details-content > .grid-2 {grid-template-columns:1fr !important;gap:19px !important;}
}
@media(max-width:650px) {
  html[data-theme] body[data-game].vp-site-studio main.container :is(#historyTools,#checkTools).details-block[open] > .details-content {padding:17px 14px !important;}
  html[data-theme] body[data-game].vp-site-studio #historyTools .atlas-history-period,
  html[data-theme] body[data-game].vp-site-studio #checkTools .atlas-draw-date {grid-template-columns:1fr !important;padding:14px !important;}
  html[data-theme] body[data-game].vp-site-studio #historyTools .atlas-history-period select {justify-self:stretch !important;}
  html[data-theme] body[data-game].vp-site-studio #historyTools .action-cluster {grid-template-columns:1fr 1fr !important;gap:8px !important;}
  html[data-theme] body[data-game].vp-site-studio #checkTools .details-content > .hero-buttons {display:grid !important;grid-template-columns:1fr 1fr !important;}
  html[data-theme] body[data-game].vp-site-studio #checkTools .details-content > .hero-buttons .button {width:100% !important;padding:10px 8px !important;font-size:10.5px !important;}
  html[data-theme] body[data-game].vp-site-studio #checkTools .atlas-draw-grid,
  html[data-theme] body[data-game].vp-site-studio #checkTools .details-content > .grid-2 {grid-template-columns:1fr !important;gap:15px !important;}
  html[data-theme] body[data-game].vp-site-studio #checkTools .atlas-draw-card {padding:15px !important;}
  html[data-theme] body[data-game].vp-site-studio #checkTools .atlas-draw-intro,
  html[data-theme] body[data-game].vp-site-studio #checkTools .atlas-new-draw-note {padding:14px 15px !important;}
}
@media(prefers-reduced-motion: reduce){
  html[data-theme] body[data-game].vp-site-studio #historyTools * ,
  html[data-theme] body[data-game].vp-site-studio #checkTools * {transition:none !important;}
}
/* The history script inserts its own status/analysis panels. Avoid wrapping
   those in a second decorative border. */
html[data-theme] body[data-game].vp-site-studio #historyTools #historyResults:not(:empty) {
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
}
html[data-theme] body[data-game].vp-site-studio #historyTools #historyResults > :first-child {margin-top:0 !important;}
html[data-theme] body[data-game].vp-site-studio #historyTools #historyResults > :last-child {margin-bottom:0 !important;}
