/* A flat, arcane card table: no casino photography, WebGL or continuous effects.
   Soul's Marcellus titles + Barlow controls; plum, parchment, lilac and gold. */
.page-minijuegos .skip-link:not(:focus) { clip-path:inset(50%); }
.bj-game-links { display:flex; flex-wrap:wrap; gap:8px 24px; margin:0 0 24px; }
.bj-game-links a { display:inline-flex; align-items:center; gap:8px; min-height:44px; color:var(--arc-text); font-size:16px; text-decoration:underline; text-underline-offset:6px; }
.bj-game-links span { color:var(--arc-gold); font-size:12px; text-decoration:none; }
.bj-game {
  --bj-bg:#162122; --bj-table:#213638; --bj-text:#eef7f8; --bj-muted:#b0cccf;
  --bj-line:#547477; --bj-accent:#8bdee6; --bj-ink:#20393b; --bj-paper:#eef7f8;
  --bj-pink:#2da7b3; --bj-success:#a5e5cb;
  margin-top:40px; padding:clamp(16px,3vw,32px); border:1px solid var(--bj-line);
  border-radius:16px; background:var(--bj-bg); color:var(--bj-text); font:400 16px/1.5 var(--font-ui);
  scroll-margin-top:20px; isolation:isolate;
}
.bj-game * { box-sizing:border-box; }
.bj-game button,.bj-game summary { font-family:var(--font-ui); touch-action:manipulation; cursor:pointer; }
.bj-game button:disabled { opacity:.42; cursor:not-allowed; }
.bj-game button:focus-visible,.bj-game summary:focus-visible,.bj-game-links a:focus-visible { outline:3px solid #2d3d4f; outline-offset:4px; }
.bj-game h2,.bj-game h3,.bj-game p { margin:0; }
.bj-symbols { position:absolute; overflow:hidden; pointer-events:none; }
.bj-header { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px; margin-bottom:24px; }
.bj-title-lockup { display:flex; align-items:center; gap:16px; }
.bj-title-lockup > svg { width:44px; height:44px; fill:var(--bj-accent); }
.bj-game .bj-header h2 { font:400 clamp(32px,4vw,46px)/1.1 var(--font-display); letter-spacing:-.02em; color:var(--bj-text); }
.bj-header p { color:var(--bj-muted); margin-top:5px; }
.bj-free { padding:5px 0 5px 16px; border-left:2px solid var(--bj-accent); color:var(--bj-accent); font-size:14px; }
.bj-layout { display:grid; grid-template-columns:minmax(0,1fr) 264px; gap:28px; align-items:start; }
.bj-play-area,.bj-sidebar { min-width:0; }
.bj-table { position:relative; padding:24px; border:1px solid var(--bj-line); border-radius:64px 12px 64px 12px; background:var(--bj-table); overflow:hidden; }
.bj-table::before { content:""; position:absolute; inset:10px; border:1px solid #54747775; border-radius:54px 4px 54px 4px; pointer-events:none; }
.bj-table-mark { position:absolute; inset:0; display:grid; place-items:center; color:#9acacf; opacity:.065; pointer-events:none; }
.bj-table-mark svg { height:95%; max-width:100%; }
.bj-seat-label { position:relative; display:flex; align-items:center; justify-content:center; gap:10px; margin-bottom:12px; }
.bj-seat-label h3 { color:var(--bj-muted); font:500 15px/1.4 var(--font-ui); }
.bj-score { display:inline-block; min-width:38px; padding:3px 9px; border:1px solid #2d3d4f; border-radius:5px; color:var(--bj-text); text-align:center; font-size:16px; font-weight:600; font-variant-numeric:tabular-nums; }
.bj-score[data-bust="true"] { color:#beedf1; border-color:#2d3d4f; }
.bj-seat-label--player { margin:12px 0 0; }
.bj-seat-label--player h3 { color:var(--bj-text); }
.bj-hand { position:relative; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:8px; min-height:134px; list-style:none; margin:0; padding:0; }
.bj-card { position:relative; flex:0 0 92px; width:92px; height:130px; border:1px solid #fff8; border-radius:9px; background:var(--bj-paper); color:var(--bj-ink); box-shadow:0 4px 0 #0d1e1f60; overflow:hidden; }
.bj-card--red { color:var(--bj-pink); }
.bj-card-corner { position:absolute; top:8px; left:9px; display:grid; justify-items:center; gap:1px; font:700 23px/1 var(--font-ui); }
.bj-card-corner svg { width:14px; height:14px; fill:currentColor; }
.bj-card-corner--bottom { top:auto; left:auto; right:9px; bottom:8px; transform:rotate(180deg); }
.bj-card-pip { position:absolute; width:42px; height:42px; left:50%; top:50%; transform:translate(-50%,-50%); fill:currentColor; }
.bj-card--face .bj-card-pip { width:24px; height:24px; top:68%; }
.bj-card-face { position:absolute; inset:20px 0 auto; text-align:center; font:400 48px/1.3 var(--font-display); }
.bj-card--back { background:#315e62; color:#bbe6ea; border-color:#2d3d4f; }
.bj-card--back::before { content:""; position:absolute; inset:6px; border:1px solid #2d3d4f; border-radius:4px; }
.bj-card--back::after { content:""; position:absolute; width:150px; height:150px; top:34px; left:32px; border:1px solid #2d3d4f50; transform:rotate(45deg); }
.bj-card--back > svg { position:absolute; inset:16px 12px; width:calc(100% - 24px); height:calc(100% - 32px); }
.bj-card--placeholder { opacity:.48; background:transparent; box-shadow:none; border-style:dashed; }
.bj-card--placeholder::before,.bj-card--placeholder::after { display:none; }
.bj-card--new { animation:bj-deal-card .22s ease-out both; }
@keyframes bj-deal-card { from { transform:translateY(-12px) rotate(-5deg); opacity:0; } to { transform:none; opacity:1; } }
.bj-message { position:relative; display:grid; align-content:center; justify-items:center; min-height:118px; padding:20px 0; text-align:center; }
.bj-game .bj-message h3 { font:400 clamp(24px,2.6vw,32px)/1.2 var(--font-display); color:var(--bj-text); }
.bj-message p { margin-top:6px; max-width:46ch; font-size:15px; color:var(--bj-muted); }
.bj-game[data-result="blackjack"] .bj-message h3,.bj-game[data-result="win"] .bj-message h3 { color:var(--bj-success); }
.bj-game[data-result="lose"] .bj-message h3,.bj-game[data-result="bust"] .bj-message h3 { color:#beedf1; }
.bj-table-rule { position:relative; color:var(--bj-muted); text-align:center; margin-top:16px !important; font-size:12px; }
.bj-table-rule span { padding:0 6px; }
.bj-play-controls { display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:10px; margin-top:16px; }
.bj-button { min-height:50px; padding:12px 10px; border:1px solid #2d3d4f; border-radius:7px; background:#24393b; color:var(--bj-text); font-size:16px; font-weight:600; line-height:1.3; transition:background-color .15s,border-color .15s; }
.bj-button--primary { background:var(--bj-accent); color:var(--bj-ink); border-color:var(--bj-accent); }
.bj-button:not(:disabled):hover { background:#385b5e; border-color:#2d3d4f; }
.bj-button--primary:not(:disabled):hover { background:#161c26; border-color:#2d3d4f; }
.bj-button:not(:disabled):active { transform:translateY(1px); }
.bj-control-help { color:var(--bj-muted); font-size:13px; text-align:center; margin-top:12px !important; }
.bj-sidebar { display:grid; gap:24px; }
.bj-wallet { display:grid; padding-bottom:20px; border-bottom:1px solid var(--bj-line); }
.bj-wallet > span { font-size:16px; color:var(--bj-muted); }
.bj-wallet strong { color:var(--bj-accent); font:500 clamp(36px,4vw,48px)/1.2 var(--font-ui); font-variant-numeric:tabular-nums; letter-spacing:-.02em; margin:4px 0; overflow-wrap:anywhere; }
.bj-wallet small { color:var(--bj-muted); font-size:13px; }
.bj-bets { border:0; padding:0; margin:0; min-width:0; }
.bj-bets legend { padding:0; margin-bottom:12px; font-size:16px; color:var(--bj-text); }
.bj-chips { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.bj-chip { width:100%; min-width:44px; height:52px; padding:0; border:2px dashed #2d3d4f; border-radius:50%; background:#263d3f; color:var(--bj-text); font-size:17px; font-weight:600; }
.bj-chip[aria-pressed="true"] { color:var(--bj-ink); background:var(--bj-accent); border-color:#2e6065; box-shadow:0 0 0 2px var(--bj-accent); }
.bj-chip:not(:disabled):hover { border-style:solid; outline:1px solid var(--bj-text); outline-offset:2px; }
.bj-bets > p { margin-top:12px; font-size:13px; color:var(--bj-muted); }
.bj-record h3 { color:var(--bj-text); font:500 16px/1.4 var(--font-ui); margin-bottom:10px; }
.bj-record dl { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin:0; gap:8px; }
.bj-record dt { font-size:12px; color:var(--bj-muted); }
.bj-record dd { margin:2px 0 0; font-size:23px; color:var(--bj-text); font-variant-numeric:tabular-nums; }
.bj-rules { border-top:1px solid var(--bj-line); border-bottom:1px solid var(--bj-line); }
.bj-rules summary { min-height:48px; display:flex; align-items:center; justify-content:space-between; gap:12px; color:var(--bj-accent); font-size:15px; list-style:none; }
.bj-rules summary::-webkit-details-marker { display:none; }
.bj-rules summary span { font-size:24px; }
.bj-rules[open] summary span { transform:rotate(45deg); }
.bj-rules > div { padding:0 0 16px; color:var(--bj-muted); font-size:14px; }
.bj-rules p + p { margin-top:12px; }
.bj-rules b { color:var(--bj-text); }
.bj-footer { display:flex; align-items:center; gap:10px; margin-top:24px; padding-top:18px; border-top:1px solid var(--bj-line); color:var(--bj-muted); }
.bj-footer svg { flex:0 0 24px; width:24px; height:24px; }
.bj-footer p { font-size:13px; line-height:1.5; max-width:90ch; }
.bj-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (max-width:1000px) { .bj-layout { grid-template-columns:minmax(0,1fr) 230px; gap:20px; } .bj-table { padding:22px 16px; } .bj-card { flex-basis:80px; width:80px; height:116px; } .bj-hand { min-height:120px; } .bj-chip { height:48px; } }
@media (max-width:760px) {
  .bj-layout { display:flex; flex-direction:column; gap:20px; }
  .bj-sidebar { order:-1; width:100%; grid-template-columns:1fr 1.3fr; gap:16px; align-items:center; }
  .bj-wallet { border:0; padding:0; }
  .bj-wallet strong { font-size:36px; }
  .bj-record { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; gap:12px; padding-top:12px; border-top:1px solid var(--bj-line); }
  .bj-record h3 { margin:0; font-size:14px; }
  .bj-record dl { flex:1; max-width:250px; text-align:center; }
  .bj-record dd { font-size:19px; }
  .bj-rules { grid-column:1/-1; }
  .bj-play-area { width:100%; }
  .bj-free { font-size:13px; }
  .bj-header { margin-bottom:20px; }
  .bj-message { min-height:108px; }
}
@media (max-width:440px) {
  .bj-game { padding:16px 12px; border-radius:12px; margin-top:28px; }
  .bj-header { gap:12px; }
  .bj-title-lockup { gap:10px; }
  .bj-title-lockup > svg { width:32px; height:32px; }
  .bj-header p { font-size:14px; }
  .bj-free { border:0; padding:0; }
  .bj-sidebar { grid-template-columns:1fr; gap:16px; }
  .bj-wallet { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 10px; }
  .bj-wallet small { flex-basis:100%; }
  .bj-wallet strong { margin:0 0 0 auto; }
  .bj-chip { height:48px; border-radius:12px; }
  .bj-bets legend { margin-bottom:10px; }
  .bj-record { padding-top:10px; }
  .bj-table { padding:20px 12px; border-radius:32px 8px 32px 8px; }
  .bj-table::before { inset:6px; border-radius:26px 3px 26px 3px; }
  .bj-hand { gap:6px; min-height:110px; }
  .bj-card { flex-basis:72px; width:72px; height:104px; border-radius:6px; }
  .bj-card-corner { top:6px; left:6px; font-size:20px; }
  .bj-card-corner--bottom { top:auto; left:auto; right:6px; bottom:6px; }
  .bj-card-pip { width:32px; height:32px; }
  .bj-card-corner svg { width:11px; height:11px; }
  .bj-card-face { font-size:36px; }
  .bj-message { min-height:112px; padding:16px 0; }
  .bj-message p { font-size:14px; }
  .bj-table-rule { font-size:12px; padding:0 5px; }
  .bj-play-controls { grid-template-columns:1fr 1fr; gap:8px; }
  .bj-button--primary { grid-column:1/-1; }
}
@media (prefers-reduced-motion:reduce) { .bj-card--new { animation:none; } .bj-game * { transition:none !important; } }
