/* LottoLuma 2026-10-25 — uniform Your Lines toolbar and Irish Lotto 21 flag.
   Scoped to game-page workspace only; no generator or card drawing changes. */
body[data-game] #predictionWorkspace {
  container-type: inline-size;
}
body[data-game] #predictionWorkspace .workspace-head {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 18px 22px !important;
  align-items: center !important;
  min-width: 0;
  margin-bottom: 14px !important;
  padding: 20px clamp(14px,2vw,24px) !important;
  border: 1px solid #d3e4ef !important;
  border-radius: 17px !important;
  background: linear-gradient(116deg,#ffffff 0%,#f4faff 72%,#ebf6fb 100%) !important;
  box-shadow: 0 9px 23px rgba(30,77,113,.055);
}
body[data-game] #predictionWorkspace .workspace-head > div:first-child {
  min-width: 0;
}
body[data-game] #predictionWorkspace .workspace-head .eyebrow {
  margin:0 0 7px;
  color:#11628e !important;
  font-size:10px;
  letter-spacing:.105em;
  line-height:1.35;
}
body[data-game] #predictionWorkspace .workspace-head h2 {
  margin:0 0 5px !important;
  font-size:clamp(22px,2vw,27px) !important;
  line-height:1.16 !important;
  color:#102e48 !important;
  letter-spacing:-.035em;
}
body[data-game] #predictionWorkspace .workspace-head p {
  margin:0 !important;
  font-size:12px !important;
  line-height:1.55 !important;
  color:#55718a !important;
  max-width:60ch;
}
body[data-game] #predictionWorkspace .workspace-head #lineCounter {
  display:inline-block;
  margin:5px 0 0 4px;
  padding:3px 8px;
  background:#e7f4fc;
  border:1px solid #c9e3f2;
  border-radius:100px;
  color:#336c94;
  font-size:10px;
  font-weight:700;
  line-height:1.4;
  vertical-align:middle;
}
html[data-theme="dark"] body[data-game] #predictionWorkspace .workspace-head #lineCounter {
  background:#204b5f;border-color:#346f80;color:#c4f4f9;
}
body[data-game] #predictionWorkspace .workspace-actions {
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:8px !important;
  min-width:0;
}
body[data-game] #predictionWorkspace .workspace-actions > .button {
  display:inline-flex !important;
  flex:0 0 auto;
  align-items:center;
  justify-content:center;
  min-width:0 !important;
  min-height:39px !important;
  padding:10px 13px !important;
  white-space:nowrap;
  font-size:11px !important;
  letter-spacing:0 !important;
  line-height:1.25 !important;
  border-radius:11px !important;
  background:#fff !important;
  color:#185580 !important;
  border:1px solid #c7dae9 !important;
  box-shadow:0 2px 3px rgba(17,71,107,.025);
  transition:background-color .17s,border-color .17s,box-shadow .17s;
}
body[data-game] #predictionWorkspace .workspace-actions > .button:hover:not(:disabled),
body[data-game] #predictionWorkspace .workspace-actions > .button:focus-visible {
  background:#e8f5fc !important;
  border-color:#80bddc !important;
  box-shadow:0 3px 11px rgba(23,106,157,.12);
  transform:none !important;
}
body[data-game] #predictionWorkspace .workspace-actions > .button:disabled {
  opacity:.56 !important;
  cursor:not-allowed;
}
body[data-game] #predictionWorkspace .workspace-actions > .ll-toolbar-preview,
body[data-game] #predictionWorkspace .workspace-actions > .ir21-preview-shortcut {
  background:#e6f8f7 !important;
  border-color:#a1d7d7 !important;
  color:#056776 !important;
  font-weight:850;
}
body[data-game] .orbit-share-card-tool.ll-toolbar-preview-target {
  outline:3px solid #36c6ae;
  outline-offset:4px;
  transition:outline-color .2s;
}
/* Match the site's approved soft navy/teal appearance in dark mode. */
html[data-theme="dark"] body[data-game] #predictionWorkspace .workspace-head {
  background:linear-gradient(115deg,#102b3d 0%,#183649 100%) !important;
  border-color:#35576b !important;
  box-shadow:0 9px 23px rgba(0,0,0,.12);
}
html[data-theme="dark"] body[data-game] #predictionWorkspace .workspace-head h2 {color:#f0fbff !important;}
html[data-theme="dark"] body[data-game] #predictionWorkspace .workspace-head p {color:#b7d1de !important;}
html[data-theme="dark"] body[data-game] #predictionWorkspace .workspace-head .eyebrow {color:#7ce5cd !important;}
html[data-theme="dark"] body[data-game] #predictionWorkspace .workspace-actions > .button {
  background:#173c51 !important;
  color:#e4f5ff !important;
  border-color:#48677a !important;
  box-shadow:none;
}
html[data-theme="dark"] body[data-game] #predictionWorkspace .workspace-actions > .button:hover:not(:disabled) {background:#22556d !important;}
html[data-theme="dark"] body[data-game] #predictionWorkspace .workspace-actions > .ll-toolbar-preview,
html[data-theme="dark"] body[data-game] #predictionWorkspace .workspace-actions > .ir21-preview-shortcut {
  background:#135452 !important;
  color:#c1fff3 !important;
  border-color:#408d82 !important;
}
/* Use the same real Irish tricolour as the original Irish Lotto hero. */
body[data-game="irish-lotto-21"] .game-hero {
  --orbit-vivid-flag: url("country-flags/ie.svg");
}
/* Content-aware responsive rules: the studio workspace may be narrow on desktop too. */
@container (max-width:800px) {
  body[data-game] #predictionWorkspace .workspace-head {
    grid-template-columns:minmax(0,1fr) !important;
    gap:15px !important;
  }
  body[data-game] #predictionWorkspace .workspace-actions {justify-content:flex-start !important;}
}
@container (max-width:470px) {
  body[data-game] #predictionWorkspace .workspace-head {padding:16px 14px !important;}
  body[data-game] #predictionWorkspace .workspace-actions {display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px !important;}
  body[data-game] #predictionWorkspace .workspace-actions > .button {width:100%;white-space:normal;min-height:41px !important;padding:9px 8px !important;}
  body[data-game] #predictionWorkspace .workspace-actions > .ll-toolbar-preview,
  body[data-game] #predictionWorkspace .workspace-actions > .ir21-preview-shortcut {grid-column:1/-1;}
}
@media print {
  body[data-game] #predictionWorkspace .workspace-actions {display:none !important;}
  body[data-game] #predictionWorkspace .workspace-head {background:transparent !important;box-shadow:none !important;border:0 !important;}
}