.poker-game { --poker-card-width:72px; --poker-card-height:102px; }
.poker-game .poker-eyebrow { font-size:12px; letter-spacing:.18em; color:var(--accent); }
.poker-game .poker-tabs { display:flex; flex-wrap:wrap; gap:8px; margin:18px 0 4px; }
.poker-game .poker-notice { min-height:42px; padding:9px 2px; font-size:14px; color:var(--muted); }
.poker-game .poker-tools { flex-wrap:wrap; gap:8px; padding:12px 0; }
.poker-game .poker-small { font-size:12px; line-height:1.7; }
.poker-game .poker-felt { padding:24px; color:#f6f1df; border-radius:22px; background:radial-gradient(ellipse at 50% 30%,#286554,#174b3f 75%); border:7px solid #c5ae89; box-shadow:inset 0 0 0 2px #dfcba955,0 15px 30px #153b3012; }
.poker-game .poker-card { display:inline-flex; flex-direction:column; position:relative; width:var(--poker-card-width); height:var(--poker-card-height); flex-shrink:0; color:#222b2b; background:#fffdf7; border:1px solid #b5b1a5; border-radius:7px; box-shadow:0 2px 4px #06271935; overflow:hidden; user-select:none; vertical-align:top; }
.poker-game .poker-card-red { color:#b33b4d; }
.poker-game .poker-corner { display:flex; align-items:flex-start; flex-direction:column; position:absolute; left:5px; top:3px; font:700 16px/1.04 Georgia,serif; }
.poker-game .poker-corner small { font-size:15px; }
.poker-game .poker-corner-bottom { top:auto; bottom:3px; left:auto; right:5px; transform:rotate(180deg); }
.poker-game .poker-symbol { margin:auto; font:34px Georgia,serif; }
.poker-game .poker-card-joker .poker-corner { font-size:11px; }
.poker-game .poker-card-back { background:#eee7d5; padding:4px; }
.poker-game .poker-card-back i { width:100%; height:100%; display:block; border:2px solid #dfd4bf; border-radius:3px; background:repeating-linear-gradient(45deg,#b24f66 0 3px,#994558 3px 6px); }
.poker-game .poker-card-button { padding:0; border:0; background:transparent; width:var(--poker-card-width); height:var(--poker-card-height); border-radius:7px; color:inherit; cursor:pointer; flex-shrink:0; }
.poker-game .poker-card-button:disabled { cursor:default; opacity:1; }
.poker-game .poker-card-button:focus-visible { outline:3px solid #f3cd6b; outline-offset:3px; z-index:100; }
.poker-game .poker-selected .poker-card { outline:3px solid #ffc965; outline-offset:-3px; background:#fff5d7; }
.poker-game .poker-slot { display:flex; align-items:center; justify-content:center; width:var(--poker-card-width); height:var(--poker-card-height); color:#cfdfd4; border:2px dashed #f2ebd942; border-radius:7px; background:#123e323b; font:22px Georgia,serif; cursor:pointer; }
.poker-game .poker-lobby { display:grid; grid-template-columns:.9fr 1.1fr; gap:36px; align-items:center; padding:32px; }
.poker-game .poker-lobby h3 { font-size:26px; margin:16px 0; }
.poker-game .poker-lobby p { line-height:1.8; }
.poker-game .poker-lobby-art { height:270px; border-radius:18px; display:flex; justify-content:center; align-items:center; background:radial-gradient(ellipse at 50% 50%,#3a7761,#1e5143); position:relative; overflow:hidden; }
.poker-game .poker-lobby-art .poker-card:nth-child(1) { transform:translateX(18px) rotate(-22deg); }
.poker-game .poker-lobby-art .poker-card:nth-child(2) { transform:translateY(-12px); z-index:1; }
.poker-game .poker-lobby-art .poker-card:nth-child(3) { transform:translateX(-18px) rotate(22deg); }
.poker-game .poker-lobby-art > span:last-child { position:absolute; bottom:5px; right:12px; font-size:84px; color:#ffffff12; }
.poker-game .poker-lobby-options { display:grid; gap:14px; margin-top:24px; }
.poker-game .poker-stats { margin:20px 0; }
.poker-game .poker-help { margin-top:20px; padding:18px 22px; }
.poker-game .poker-help summary,.poker-game .poker-log summary { cursor:pointer; font-weight:700; }
.poker-game .poker-help p { font-size:14px; line-height:1.8; color:var(--muted); }
.poker-game .poker-sol-top { display:flex; justify-content:space-between; gap:12px; margin-bottom:25px; }
.poker-game .poker-stock-zone { display:flex; gap:16px; }
.poker-game .poker-stock { background:transparent; border:0; padding:0; position:relative; color:inherit; width:var(--poker-card-width); cursor:pointer; }
.poker-game .poker-stock>span:last-child { display:block; position:absolute; bottom:-19px; width:100%; font-size:11px; }
.poker-game .poker-waste { width:calc(var(--poker-card-width) + 14px); height:var(--poker-card-height); position:relative; }
.poker-game .poker-waste-covered { position:absolute; }
.poker-game .poker-waste-top { position:absolute; right:0; }
.poker-game .poker-foundations { display:flex; gap:14px; }
.poker-game .poker-foundation { position:relative; }
.poker-game .poker-pile-label { position:absolute; bottom:-20px; left:0; width:100%; text-align:center; font-size:11px; }
.poker-game .poker-columns { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:14px; }
.poker-game .poker-column { min-height:var(--pile-height); position:relative; }
.poker-game .poker-column .poker-slot,.poker-game .poker-column .poker-card-button,.poker-game .poker-column .poker-card { width:100%; max-width:90px; }
.poker-game .poker-tableau-card { position:absolute; left:0; }
.poker-game .poker-table-caption { font-size:12px; padding:16px 0 0; line-height:1.7; }
.poker-game .poker-result { text-align:center; padding:30px; margin-top:20px; }
.poker-game .poker-result>span { font:44px Georgia,serif; color:var(--accent); letter-spacing:12px; }
.poker-game .poker-opponents { display:flex; justify-content:space-between; gap:12px; }
.poker-game .poker-opponent { width:36%; max-width:320px; padding:12px 16px; display:grid; gap:8px; border-radius:14px; border:2px solid transparent; }
.poker-game .poker-active-player { border:2px solid #efc771!important; background:#ffffff0d; }
.poker-game .poker-avatar { font-size:26px; }
.poker-game .poker-opponent .badge { color:#eef6df; background:#ffffff18; }
.poker-game .poker-opponent-cards { --poker-card-width:32px; --poker-card-height:44px; display:flex; gap:3px; flex-wrap:wrap; max-height:115px; overflow:auto; }
.poker-game .poker-opponent-cards .poker-corner { left:2px; top:2px; font-size:10px; }
.poker-game .poker-opponent-cards .poker-corner small { font-size:9px; }
.poker-game .poker-opponent-cards .poker-symbol { font-size:15px; }
.poker-game .poker-opponent-cards .poker-corner-bottom { display:none; }
.poker-game .poker-ddz-center { display:flex; align-items:center; justify-content:center; gap:35px; padding:15px 0 25px; min-height:155px; }
.poker-game .poker-bottom { --poker-card-width:36px; --poker-card-height:50px; text-align:center; display:grid; gap:8px; }
.poker-game .poker-bottom>div { display:flex; gap:3px; }
.poker-game .poker-bottom .poker-corner { font-size:11px; left:3px; top:2px; }
.poker-game .poker-bottom .poker-corner small { font-size:10px; }
.poker-game .poker-bottom .poker-corner-bottom { display:none; }
.poker-game .poker-bottom .poker-symbol { font-size:20px; }
.poker-game .poker-last { flex:1; min-width:0; max-width:620px; display:grid; gap:10px; text-align:center; --poker-card-width:48px; --poker-card-height:67px; }
.poker-game .poker-last>div { display:flex; justify-content:center; flex-wrap:wrap; gap:3px; min-height:67px; }
.poker-game .poker-last .poker-corner { font-size:12px; }
.poker-game .poker-last .poker-corner small { font-size:11px; }
.poker-game .poker-last .poker-corner-bottom { display:none; }
.poker-game .poker-last .poker-symbol { font-size:24px; }
.poker-game .poker-lead-mark { font:64px Georgia,serif; color:#fff2; }
.poker-game .poker-you-label { display:flex; justify-content:space-between; padding:10px 0; font-size:14px; }
.poker-game .poker-ddz-hand { display:flex; flex-wrap:wrap; align-items:flex-end; padding:20px 0 8px; gap:5px; }
.poker-game .poker-ddz-hand .poker-selected { transform:translateY(-12px); }
.poker-game .poker-ddz-actions,.poker-game .poker-bj-actions { display:flex; align-items:center; flex-wrap:wrap; justify-content:center; gap:10px; padding:22px 0 8px; }
.poker-game .poker-ddz-actions>.btn,.poker-game .poker-bj-actions>.btn { border-color:#f1eddd50; background:#f8f4e8; color:#244939; }
.poker-game .poker-ddz-actions>.primary,.poker-game .poker-bj-actions>.primary { background:#f0c773; color:#233e34; }
.poker-game .poker-ddz-actions>span { width:100%; text-align:center; font-size:13px; }
.poker-game .poker-log { margin-top:16px; padding:16px 22px; }
.poker-game .poker-log li { font-size:13px; line-height:1.8; word-break:break-word; }
.poker-game .poker-bj-title { display:grid; justify-items:center; gap:7px; margin-bottom:22px; }
.poker-game .poker-bj-title span { letter-spacing:.3em; font:24px Georgia,serif; color:#efcc85; }
.poker-game .poker-bj-title small { color:#c3d5c8; }
.poker-game .poker-dealer { padding:15px; text-align:center; }
.poker-game .poker-dealer h3,.poker-game .poker-bj-one h3 { font-size:16px; display:flex; align-items:center; gap:15px; justify-content:center; }
.poker-game .poker-dealer h3 span,.poker-game .poker-bj-one h3 span { font-size:13px; font-weight:400; }
.poker-game .poker-bj-cards { display:flex; justify-content:center; flex-wrap:wrap; gap:6px; margin:12px 0; }
.poker-game .poker-bj-hands { display:flex; flex-wrap:wrap; gap:15px; justify-content:center; margin-top:25px; }
.poker-game .poker-bj-one { min-width:170px; flex:1; text-align:center; border:2px solid transparent; border-radius:15px; padding:15px; }
.poker-game .poker-bj-one .badge { color:#f4ecd9; background:#ffffff13; }
.poker-game .poker-bj-result { display:block; margin:15px 0 0; font-size:15px; color:#f2d896; }
.poker-game .poker-bj-summary { text-align:center; }
.poker-game .poker-bj-summary h3 { color:#f4d295; font-size:26px; }
.poker-game .poker-confirm { max-width:620px; padding:28px; margin:25px auto; }
.poker-game .poker-confirm p { line-height:1.8; }
@media(max-width:800px) {
  .poker-game { --poker-card-width:58px; --poker-card-height:82px; }
  .poker-game .poker-felt { padding:18px; border-width:5px; }
  .poker-game .poker-lobby { grid-template-columns:1fr; gap:24px; }
  .poker-game .poker-lobby-art { height:180px; }
  .poker-game .poker-foundations,.poker-game .poker-stock-zone { gap:8px; }
  .poker-game .poker-columns { gap:8px; }
  .poker-game .poker-ddz-hand { --poker-card-width:50px; --poker-card-height:74px; gap:4px; }
  .poker-game .poker-ddz-center { gap:18px; }
}
@media(max-width:480px) {
  .poker-game { --poker-card-width:34px; --poker-card-height:54px; }
  .poker-game .poker-felt { padding:10px; border-width:3px; border-radius:14px; }
  .poker-game .poker-card { border-radius:4px; }
  .poker-game .poker-corner { font-size:12px; top:3px; left:3px; }
  .poker-game .poker-corner small { font-size:10px; }
  .poker-game .poker-corner-bottom { right:3px; bottom:3px; }
  .poker-game .poker-symbol { font-size:18px; }
  .poker-game .poker-sol-top { gap:6px; }
  .poker-game .poker-foundations,.poker-game .poker-stock-zone { gap:5px; }
  .poker-game .poker-waste { width:40px; }
  .poker-game .poker-columns { gap:4px; }
  .poker-game .poker-column .poker-slot,.poker-game .poker-column .poker-card-button,.poker-game .poker-column .poker-card { width:100%; }
  .poker-game .poker-column .poker-corner-bottom { display:none; }
  .poker-game .poker-column .poker-symbol { font-size:17px; }
  .poker-game .poker-pile-label { font-size:9px; }
  .poker-game .poker-slot { font-size:15px; }
  .poker-game .poker-tools .btn { padding:9px 10px; font-size:12px; }
  .poker-game .poker-lobby { padding:18px; }
  .poker-game .poker-lobby-art { --poker-card-width:58px; --poker-card-height:82px; }
  .poker-game .poker-lobby h3 { font-size:22px; }
  .poker-game .poker-opponent { width:46%; padding:8px; font-size:12px; }
  .poker-game .poker-opponent .badge { font-size:10px; }
  .poker-game .poker-avatar { font-size:21px; }
  .poker-game .poker-ddz-center { flex-direction:column; gap:14px; }
  .poker-game .poker-bottom { --poker-card-width:30px; --poker-card-height:43px; }
  .poker-game .poker-last { --poker-card-width:34px; --poker-card-height:50px; width:100%; }
  .poker-game .poker-last .poker-corner { font-size:11px; left:2px; }
  .poker-game .poker-last .poker-symbol { font-size:18px; }
  .poker-game .poker-ddz-hand { --poker-card-width:35px; --poker-card-height:55px; gap:3px; row-gap:17px; }
  .poker-game .poker-ddz-actions { gap:7px; }
  .poker-game .poker-ddz-actions .btn { padding:10px 12px; }
  .poker-game .poker-blackjack { --poker-card-width:49px; --poker-card-height:72px; }
  .poker-game .poker-bj-title span { font-size:18px; letter-spacing:.2em; }
  .poker-game .poker-bj-one { min-width:150px; padding:10px; }
  .poker-game .poker-bj-actions { gap:7px; }
  .poker-game .poker-help { padding:15px; }
}
