/* Beat Pete accessibility layer (shared/a11y.js). Classes are kb- prefixed. */
.kb-sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

/* skip link: first thing Tab reaches, hidden until focused */
.kb-skip{position:fixed;left:12px;top:-60px;z-index:10000;background:#ffd54f;color:#1d1500;font:700 15px/1.2 system-ui,sans-serif;padding:10px 16px;border-radius:10px;text-decoration:none;box-shadow:0 4px 18px rgba(0,0,0,.5);transition:top .12s}
.kb-skip:focus,.kb-skip:focus-visible{top:12px;outline:3px solid #1d1500;outline-offset:2px}
main[tabindex="-1"]:focus{outline:none}

/* visible keyboard focus: gold ring with a dark inner ring so it reads on felt greens AND on light cards (>=3:1 against both).
   Only for keyboard focus (:focus-visible), so mouse clicks stay clean. */
:where(a,button,input,select,textarea,summary,[tabindex],[role=button],[role=radio],[role=tab]):focus-visible{
  outline:3px solid #ffd54f;outline-offset:2px;
  box-shadow:0 0 0 2px #15110a,0 0 0 5px rgba(21,17,10,.0)
}
:where(a,button,input,select,textarea,summary,[tabindex],[role=button],[role=radio],[role=tab]):focus:not(:focus-visible){outline:none}
.card:focus-visible,.cell:focus-visible,.c:focus-visible,.pile:focus-visible,.rl-cell:focus-visible,.rl-chip:focus-visible,.swatch:focus-visible,.hole:focus-visible,canvas:focus-visible{
  outline:3px solid #ffd54f;outline-offset:2px;box-shadow:0 0 0 2px #15110a;z-index:5
}
/* dark ring is what gives contrast on pale cards/light panels; on dialogs (dark) the gold is enough */
.amodal :focus-visible,.modal :focus-visible{box-shadow:none}
canvas:focus-visible{box-shadow:inset 0 0 0 2px #15110a}

/* keyboard help dialog */
.kb-help h2{display:flex;align-items:center;gap:8px}
.kb-keys{width:100%;border-collapse:collapse;margin:8px 0 12px;font-size:14px}
.kb-keys th,.kb-keys td{padding:7px 8px;border-bottom:1px solid rgba(128,128,128,.25);text-align:left;vertical-align:top;font-weight:400}
.kb-keys th{white-space:nowrap;width:1%}
.kb-keys kbd{display:inline-block;font:700 12.5px/1 ui-monospace,Menlo,Consolas,monospace;padding:4px 7px;border-radius:6px;border:1px solid rgba(128,128,128,.6);background:rgba(128,128,128,.14);color:inherit}

/* reduced motion: global safety net (cards.css has one for game pages; this covers info/home/casino/about too) */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
