/* ===== european-blackjack (ebj) ===== */
/* BLACKJACK COACH — the styles for casino-coach.js in the blackjack family
   (decisions A6, A12, A18-A22; Ronan 2026-10-07). The same rules as poker's
   Coach section in casino-readable.css, without the poker-only lines, so the
   blackjacks do not take poker's whole readability sheet. Copied byte-identical
   into each blackjack by kit/casino/build.js.
   No pale type: everything under 16px is 7:1+ and semi-bold. */
html body .coach-btn .btn-val{ font-family:Inter, system-ui, sans-serif; font-size:12.5px; font-weight:800; line-height:17px; white-space:nowrap; }
html body .coach-start{ z-index:200 !important; display:flex !important; align-items:center; justify-content:center; padding:16px; background:rgba(4,6,14,.78) !important; position:fixed; inset:0; }
html body .coach-start-card{
  width:min(440px, 100%); background:linear-gradient(155deg, #161b2e, #0b0e1a); border:1px solid #b8913f;
  border-radius:16px; padding:22px 20px; box-shadow:0 14px 40px rgba(0,0,0,.6); text-align:center; color:#f4ead2;
}
html body .coach-start-title{ font-family:Cinzel, serif; font-size:22px; font-weight:700; color:#f3d488; margin:0 0 6px; }
html body .coach-start-sub{ font-family:Inter, system-ui, sans-serif; font-size:14px; font-weight:600; color:#efe6cf; margin:0 0 16px; }
html body .coach-choices{ display:flex; gap:10px; }
html body .coach-choice{
  flex:1 1 0; min-height:88px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
  padding:12px 10px; border-radius:12px; cursor:pointer; text-align:center;
  background:#1c2338; border:2px solid #6d5a2c; color:#f4ead2; font-family:Inter, system-ui, sans-serif;
}
html body .coach-choice.selected{ border-color:#f3d488; background:#2b2a22; box-shadow:0 0 0 1px #f3d488 inset; }
html body .coach-choice:focus-visible{ outline:2px solid #f3d488; outline-offset:2px; }
html body .coach-choice-title{ font-family:Cinzel, serif; font-size:17px; font-weight:700; color:#f3d488; }
html body .coach-choice-desc{ font-size:13px; font-weight:600; color:#efe6cf; line-height:1.3; }
html body .coach-setup{ margin:14px 0 4px; text-align:left; }
html body .coach-setup-label{ font-family:"IBM Plex Mono", monospace; font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:#f3d488; margin-bottom:6px; }
html body .coach-setup .coach-choice{ min-height:64px; }
@media (max-width:400px){
  html body .coach-choices{ flex-direction:column; }
  html body .coach-choice{ min-height:64px; }
}
/* the HINT tag: its own element on the button's corner (tapping it never presses the button) */
html body .coach-hint-tag{
  position:absolute; z-index:300; padding:0 7px; height:17px; border-radius:999px; cursor:pointer;
  font-family:Inter, system-ui, sans-serif; font-size:12px; font-weight:800; letter-spacing:.06em; line-height:15px;
  background:#f3d488; color:#151007; border:1px solid #7a5d1d; box-shadow:0 2px 6px rgba(0,0,0,.45);
}
html body .coach-hint-tag:focus-visible{ outline:2px solid #fff; outline-offset:2px; }
html body .coach-reason{
  position:fixed; z-index:210; max-width:min(320px, calc(100vw - 16px)); padding:10px 12px; border-radius:10px;
  background:#0d1120; color:#f7efda; border:1px solid #f3d488; box-shadow:0 8px 22px rgba(0,0,0,.6);
  font-family:Inter, system-ui, sans-serif; font-size:13px; font-weight:600; line-height:1.4;
}
/* the old HINT drawn inside the button is gone: the tag replaces it (it could not be tapped on its own) */
html body .hinted::after{ content:none !important; display:none !important; }
/* Coach off: no hint at all (P3-1) — the tag, the reason, and each game's hint line */
html body.coach-off .coach-hint-tag, html body.coach-off .coach-reason,
html body.coach-off #hintBar, html body.coach-off #ebjHintLine, html body.coach-off #countBar{ display:none !important; }
/* the On/Off value reads like the header's own labels (until the header
   buttons go solid gold in the readability pass, when it turns dark on gold) */
html body .gold-icon-btn.coach-btn .btn-val{ color:inherit; font-size:13px; font-weight:800; line-height:16px; }

/* ===== single-card-blackjack (sdb) ===== */
/* BLACKJACK COACH — the styles for casino-coach.js in the blackjack family
   (decisions A6, A12, A18-A22; Ronan 2026-10-07). The same rules as poker's
   Coach section in casino-readable.css, without the poker-only lines, so the
   blackjacks do not take poker's whole readability sheet. Copied byte-identical
   into each blackjack by kit/casino/build.js.
   No pale type: everything under 16px is 7:1+ and semi-bold. */
html body .coach-btn .btn-val{ font-family:Inter, system-ui, sans-serif; font-size:12.5px; font-weight:800; line-height:17px; white-space:nowrap; }
html body .coach-start{ z-index:200 !important; display:flex !important; align-items:center; justify-content:center; padding:16px; background:rgba(4,6,14,.78) !important; position:fixed; inset:0; }
html body .coach-start-card{
  width:min(440px, 100%); background:linear-gradient(155deg, #161b2e, #0b0e1a); border:1px solid #b8913f;
  border-radius:16px; padding:22px 20px; box-shadow:0 14px 40px rgba(0,0,0,.6); text-align:center; color:#f4ead2;
}
html body .coach-start-title{ font-family:Cinzel, serif; font-size:22px; font-weight:700; color:#f3d488; margin:0 0 6px; }
html body .coach-start-sub{ font-family:Inter, system-ui, sans-serif; font-size:14px; font-weight:600; color:#efe6cf; margin:0 0 16px; }
html body .coach-choices{ display:flex; gap:10px; }
html body .coach-choice{
  flex:1 1 0; min-height:88px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
  padding:12px 10px; border-radius:12px; cursor:pointer; text-align:center;
  background:#1c2338; border:2px solid #6d5a2c; color:#f4ead2; font-family:Inter, system-ui, sans-serif;
}
html body .coach-choice.selected{ border-color:#f3d488; background:#2b2a22; box-shadow:0 0 0 1px #f3d488 inset; }
html body .coach-choice:focus-visible{ outline:2px solid #f3d488; outline-offset:2px; }
html body .coach-choice-title{ font-family:Cinzel, serif; font-size:17px; font-weight:700; color:#f3d488; }
html body .coach-choice-desc{ font-size:13px; font-weight:600; color:#efe6cf; line-height:1.3; }
html body .coach-setup{ margin:14px 0 4px; text-align:left; }
html body .coach-setup-label{ font-family:"IBM Plex Mono", monospace; font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:#f3d488; margin-bottom:6px; }
html body .coach-setup .coach-choice{ min-height:64px; }
@media (max-width:400px){
  html body .coach-choices{ flex-direction:column; }
  html body .coach-choice{ min-height:64px; }
}
/* the HINT tag: its own element on the button's corner (tapping it never presses the button) */
html body .coach-hint-tag{
  position:absolute; z-index:300; padding:0 7px; height:17px; border-radius:999px; cursor:pointer;
  font-family:Inter, system-ui, sans-serif; font-size:12px; font-weight:800; letter-spacing:.06em; line-height:15px;
  background:#f3d488; color:#151007; border:1px solid #7a5d1d; box-shadow:0 2px 6px rgba(0,0,0,.45);
}
html body .coach-hint-tag:focus-visible{ outline:2px solid #fff; outline-offset:2px; }
html body .coach-reason{
  position:fixed; z-index:210; max-width:min(320px, calc(100vw - 16px)); padding:10px 12px; border-radius:10px;
  background:#0d1120; color:#f7efda; border:1px solid #f3d488; box-shadow:0 8px 22px rgba(0,0,0,.6);
  font-family:Inter, system-ui, sans-serif; font-size:13px; font-weight:600; line-height:1.4;
}
/* the old HINT drawn inside the button is gone: the tag replaces it (it could not be tapped on its own) */
html body .hinted::after{ content:none !important; display:none !important; }
/* Coach off: no hint at all (P3-1) — the tag, the reason, and each game's hint line */
html body.coach-off .coach-hint-tag, html body.coach-off .coach-reason,
html body.coach-off #hintBar, html body.coach-off #sdbHintLine, html body.coach-off #countBar{ display:none !important; }
/* the On/Off value reads like the header's own labels (until the header
   buttons go solid gold in the readability pass, when it turns dark on gold) */
html body .gold-icon-btn.coach-btn .btn-val{ color:inherit; font-size:13px; font-weight:800; line-height:16px; }

/* ===== atlantic-city-blackjack (acbj) ===== */
/* BLACKJACK COACH — the styles for casino-coach.js in the blackjack family
   (decisions A6, A12, A18-A22; Ronan 2026-10-07). The same rules as poker's
   Coach section in casino-readable.css, without the poker-only lines, so the
   blackjacks do not take poker's whole readability sheet. Copied byte-identical
   into each blackjack by kit/casino/build.js.
   No pale type: everything under 16px is 7:1+ and semi-bold. */
html body .coach-btn .btn-val{ font-family:Inter, system-ui, sans-serif; font-size:12.5px; font-weight:800; line-height:17px; white-space:nowrap; }
html body .coach-start{ z-index:200 !important; display:flex !important; align-items:center; justify-content:center; padding:16px; background:rgba(4,6,14,.78) !important; position:fixed; inset:0; }
html body .coach-start-card{
  width:min(440px, 100%); background:linear-gradient(155deg, #161b2e, #0b0e1a); border:1px solid #b8913f;
  border-radius:16px; padding:22px 20px; box-shadow:0 14px 40px rgba(0,0,0,.6); text-align:center; color:#f4ead2;
}
html body .coach-start-title{ font-family:Cinzel, serif; font-size:22px; font-weight:700; color:#f3d488; margin:0 0 6px; }
html body .coach-start-sub{ font-family:Inter, system-ui, sans-serif; font-size:14px; font-weight:600; color:#efe6cf; margin:0 0 16px; }
html body .coach-choices{ display:flex; gap:10px; }
html body .coach-choice{
  flex:1 1 0; min-height:88px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
  padding:12px 10px; border-radius:12px; cursor:pointer; text-align:center;
  background:#1c2338; border:2px solid #6d5a2c; color:#f4ead2; font-family:Inter, system-ui, sans-serif;
}
html body .coach-choice.selected{ border-color:#f3d488; background:#2b2a22; box-shadow:0 0 0 1px #f3d488 inset; }
html body .coach-choice:focus-visible{ outline:2px solid #f3d488; outline-offset:2px; }
html body .coach-choice-title{ font-family:Cinzel, serif; font-size:17px; font-weight:700; color:#f3d488; }
html body .coach-choice-desc{ font-size:13px; font-weight:600; color:#efe6cf; line-height:1.3; }
html body .coach-setup{ margin:14px 0 4px; text-align:left; }
html body .coach-setup-label{ font-family:"IBM Plex Mono", monospace; font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:#f3d488; margin-bottom:6px; }
html body .coach-setup .coach-choice{ min-height:64px; }
@media (max-width:400px){
  html body .coach-choices{ flex-direction:column; }
  html body .coach-choice{ min-height:64px; }
}
/* the HINT tag: its own element on the button's corner (tapping it never presses the button) */
html body .coach-hint-tag{
  position:absolute; z-index:300; padding:0 7px; height:17px; border-radius:999px; cursor:pointer;
  font-family:Inter, system-ui, sans-serif; font-size:12px; font-weight:800; letter-spacing:.06em; line-height:15px;
  background:#f3d488; color:#151007; border:1px solid #7a5d1d; box-shadow:0 2px 6px rgba(0,0,0,.45);
}
html body .coach-hint-tag:focus-visible{ outline:2px solid #fff; outline-offset:2px; }
html body .coach-reason{
  position:fixed; z-index:210; max-width:min(320px, calc(100vw - 16px)); padding:10px 12px; border-radius:10px;
  background:#0d1120; color:#f7efda; border:1px solid #f3d488; box-shadow:0 8px 22px rgba(0,0,0,.6);
  font-family:Inter, system-ui, sans-serif; font-size:13px; font-weight:600; line-height:1.4;
}
/* the old HINT drawn inside the button is gone: the tag replaces it (it could not be tapped on its own) */
html body .hinted::after{ content:none !important; display:none !important; }
/* Coach off: no hint at all (P3-1) — the tag, the reason, and each game's hint line */
html body.coach-off .coach-hint-tag, html body.coach-off .coach-reason,
html body.coach-off #hintBar, html body.coach-off #acbjHintLine, html body.coach-off #countBar{ display:none !important; }
/* the On/Off value reads like the header's own labels (until the header
   buttons go solid gold in the readability pass, when it turns dark on gold) */
html body .gold-icon-btn.coach-btn .btn-val{ color:inherit; font-size:13px; font-weight:800; line-height:16px; }

/* ===== spanish-21- (s21) ===== */
/* BLACKJACK COACH — the styles for casino-coach.js in the blackjack family
   (decisions A6, A12, A18-A22; Ronan 2026-10-07). The same rules as poker's
   Coach section in casino-readable.css, without the poker-only lines, so the
   blackjacks do not take poker's whole readability sheet. Copied byte-identical
   into each blackjack by kit/casino/build.js.
   No pale type: everything under 16px is 7:1+ and semi-bold. */
html body .coach-btn .btn-val{ font-family:Inter, system-ui, sans-serif; font-size:12.5px; font-weight:800; line-height:17px; white-space:nowrap; }
html body .coach-start{ z-index:200 !important; display:flex !important; align-items:center; justify-content:center; padding:16px; background:rgba(4,6,14,.78) !important; position:fixed; inset:0; }
html body .coach-start-card{
  width:min(440px, 100%); background:linear-gradient(155deg, #161b2e, #0b0e1a); border:1px solid #b8913f;
  border-radius:16px; padding:22px 20px; box-shadow:0 14px 40px rgba(0,0,0,.6); text-align:center; color:#f4ead2;
}
html body .coach-start-title{ font-family:Cinzel, serif; font-size:22px; font-weight:700; color:#f3d488; margin:0 0 6px; }
html body .coach-start-sub{ font-family:Inter, system-ui, sans-serif; font-size:14px; font-weight:600; color:#efe6cf; margin:0 0 16px; }
html body .coach-choices{ display:flex; gap:10px; }
html body .coach-choice{
  flex:1 1 0; min-height:88px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
  padding:12px 10px; border-radius:12px; cursor:pointer; text-align:center;
  background:#1c2338; border:2px solid #6d5a2c; color:#f4ead2; font-family:Inter, system-ui, sans-serif;
}
html body .coach-choice.selected{ border-color:#f3d488; background:#2b2a22; box-shadow:0 0 0 1px #f3d488 inset; }
html body .coach-choice:focus-visible{ outline:2px solid #f3d488; outline-offset:2px; }
html body .coach-choice-title{ font-family:Cinzel, serif; font-size:17px; font-weight:700; color:#f3d488; }
html body .coach-choice-desc{ font-size:13px; font-weight:600; color:#efe6cf; line-height:1.3; }
html body .coach-setup{ margin:14px 0 4px; text-align:left; }
html body .coach-setup-label{ font-family:"IBM Plex Mono", monospace; font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:#f3d488; margin-bottom:6px; }
html body .coach-setup .coach-choice{ min-height:64px; }
@media (max-width:400px){
  html body .coach-choices{ flex-direction:column; }
  html body .coach-choice{ min-height:64px; }
}
/* the HINT tag: its own element on the button's corner (tapping it never presses the button) */
html body .coach-hint-tag{
  position:absolute; z-index:300; padding:0 7px; height:17px; border-radius:999px; cursor:pointer;
  font-family:Inter, system-ui, sans-serif; font-size:12px; font-weight:800; letter-spacing:.06em; line-height:15px;
  background:#f3d488; color:#151007; border:1px solid #7a5d1d; box-shadow:0 2px 6px rgba(0,0,0,.45);
}
html body .coach-hint-tag:focus-visible{ outline:2px solid #fff; outline-offset:2px; }
html body .coach-reason{
  position:fixed; z-index:210; max-width:min(320px, calc(100vw - 16px)); padding:10px 12px; border-radius:10px;
  background:#0d1120; color:#f7efda; border:1px solid #f3d488; box-shadow:0 8px 22px rgba(0,0,0,.6);
  font-family:Inter, system-ui, sans-serif; font-size:13px; font-weight:600; line-height:1.4;
}
/* the old HINT drawn inside the button is gone: the tag replaces it (it could not be tapped on its own) */
html body .hinted::after{ content:none !important; display:none !important; }
/* Coach off: no hint at all (P3-1) — the tag, the reason, and each game's hint line */
html body.coach-off .coach-hint-tag, html body.coach-off .coach-reason,
html body.coach-off #hintBar, html body.coach-off #s21HintLine, html body.coach-off #countBar{ display:none !important; }
/* the On/Off value reads like the header's own labels (until the header
   buttons go solid gold in the readability pass, when it turns dark on gold) */
html body .gold-icon-btn.coach-btn .btn-val{ color:inherit; font-size:13px; font-weight:800; line-height:16px; }

/* ===== vegas-strip-black (vsbj) ===== */
/* BLACKJACK COACH — the styles for casino-coach.js in the blackjack family
   (decisions A6, A12, A18-A22; Ronan 2026-10-07). The same rules as poker's
   Coach section in casino-readable.css, without the poker-only lines, so the
   blackjacks do not take poker's whole readability sheet. Copied byte-identical
   into each blackjack by kit/casino/build.js.
   No pale type: everything under 16px is 7:1+ and semi-bold. */
html body .coach-btn .btn-val{ font-family:Inter, system-ui, sans-serif; font-size:12.5px; font-weight:800; line-height:17px; white-space:nowrap; }
html body .coach-start{ z-index:200 !important; display:flex !important; align-items:center; justify-content:center; padding:16px; background:rgba(4,6,14,.78) !important; position:fixed; inset:0; }
html body .coach-start-card{
  width:min(440px, 100%); background:linear-gradient(155deg, #161b2e, #0b0e1a); border:1px solid #b8913f;
  border-radius:16px; padding:22px 20px; box-shadow:0 14px 40px rgba(0,0,0,.6); text-align:center; color:#f4ead2;
}
html body .coach-start-title{ font-family:Cinzel, serif; font-size:22px; font-weight:700; color:#f3d488; margin:0 0 6px; }
html body .coach-start-sub{ font-family:Inter, system-ui, sans-serif; font-size:14px; font-weight:600; color:#efe6cf; margin:0 0 16px; }
html body .coach-choices{ display:flex; gap:10px; }
html body .coach-choice{
  flex:1 1 0; min-height:88px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
  padding:12px 10px; border-radius:12px; cursor:pointer; text-align:center;
  background:#1c2338; border:2px solid #6d5a2c; color:#f4ead2; font-family:Inter, system-ui, sans-serif;
}
html body .coach-choice.selected{ border-color:#f3d488; background:#2b2a22; box-shadow:0 0 0 1px #f3d488 inset; }
html body .coach-choice:focus-visible{ outline:2px solid #f3d488; outline-offset:2px; }
html body .coach-choice-title{ font-family:Cinzel, serif; font-size:17px; font-weight:700; color:#f3d488; }
html body .coach-choice-desc{ font-size:13px; font-weight:600; color:#efe6cf; line-height:1.3; }
html body .coach-setup{ margin:14px 0 4px; text-align:left; }
html body .coach-setup-label{ font-family:"IBM Plex Mono", monospace; font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:#f3d488; margin-bottom:6px; }
html body .coach-setup .coach-choice{ min-height:64px; }
@media (max-width:400px){
  html body .coach-choices{ flex-direction:column; }
  html body .coach-choice{ min-height:64px; }
}
/* the HINT tag: its own element on the button's corner (tapping it never presses the button) */
html body .coach-hint-tag{
  position:absolute; z-index:300; padding:0 7px; height:17px; border-radius:999px; cursor:pointer;
  font-family:Inter, system-ui, sans-serif; font-size:12px; font-weight:800; letter-spacing:.06em; line-height:15px;
  background:#f3d488; color:#151007; border:1px solid #7a5d1d; box-shadow:0 2px 6px rgba(0,0,0,.45);
}
html body .coach-hint-tag:focus-visible{ outline:2px solid #fff; outline-offset:2px; }
html body .coach-reason{
  position:fixed; z-index:210; max-width:min(320px, calc(100vw - 16px)); padding:10px 12px; border-radius:10px;
  background:#0d1120; color:#f7efda; border:1px solid #f3d488; box-shadow:0 8px 22px rgba(0,0,0,.6);
  font-family:Inter, system-ui, sans-serif; font-size:13px; font-weight:600; line-height:1.4;
}
/* the old HINT drawn inside the button is gone: the tag replaces it (it could not be tapped on its own) */
html body .hinted::after{ content:none !important; display:none !important; }
/* Coach off: no hint at all (P3-1) — the tag, the reason, and each game's hint line */
html body.coach-off .coach-hint-tag, html body.coach-off .coach-reason,
html body.coach-off #hintBar, html body.coach-off #vsbjHintLine, html body.coach-off #countBar{ display:none !important; }
/* the On/Off value reads like the header's own labels (until the header
   buttons go solid gold in the readability pass, when it turns dark on gold) */
html body .gold-icon-btn.coach-btn .btn-val{ color:inherit; font-size:13px; font-weight:800; line-height:16px; }