/* 炸金花牌桌：深绿绒面 + 黄铜筹码。结构保证和大厅一致——
   遮罩层只有带上 data-open 才接收点击，残留的牌桌不会吃掉大厅的按钮。 */
.zjh-view{position:fixed;inset:0;z-index:70;display:flex;flex-direction:column;height:100vh;height:100dvh;max-height:100dvh;overflow:hidden;padding-bottom:env(safe-area-inset-bottom,0);background:radial-gradient(120% 80% at 50% 0%,#123528 0%,#0b2019 45%,#06120d 100%);color:#efe9dd}
.zjh-view[hidden]{display:none}
.zjh-view{pointer-events:none}
.zjh-view[data-open]{pointer-events:auto}

/* ── 顶部栏 ── */
.zjh-top{display:flex;align-items:center;gap:10px;padding:8px 12px;background:rgba(9,24,18,.66);backdrop-filter:blur(8px);border-bottom:1px solid rgba(190,224,207,.14);flex:0 0 auto;z-index:6}
.zjh-top .text-button{color:#f4efe4}
.zjh-title{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.3}
.zjh-title .eyebrow{color:#a8cfba;font-size:11px;letter-spacing:.06em}
.zjh-title strong{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.zjh-top-actions{display:flex;gap:6px;align-items:center}

/* ── 邀请卡 ── */
.zjh-invite{flex:0 0 auto;margin:10px 12px 0;padding:10px 12px;border-radius:14px;background:rgba(255,217,138,.08);border:1px solid rgba(255,217,138,.3)}
.zjh-invite-note{margin:0 0 8px;font-size:12.5px;color:#cfe3d6}
.zjh-invite-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:6px}
.zjh-invite-row strong{letter-spacing:.18em;font-size:18px;color:#ffd98a}

/* ── 牌桌本体 ── */
.zjh-felt{position:relative;flex:1;min-height:0;margin:10px 12px 0;border-radius:26px;background:
  radial-gradient(115% 88% at 50% 44%,#154230 0%,#0e3223 46%,#071a12 100%);
  box-shadow:inset 0 0 0 2px rgba(255,217,138,.16),inset 0 0 70px rgba(0,0,0,.58),0 18px 40px rgba(0,0,0,.44);
  overflow:hidden}
.zjh-felt-ring{position:absolute;inset:12px;border-radius:22px;border:1px dashed rgba(255,217,138,.16);pointer-events:none}

/* 底池 */
.zjh-pot{position:absolute;left:50%;top:47%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:2px;min-width:126px;padding:10px 16px 12px;border-radius:18px;background:rgba(6,20,14,.55);border:1px solid rgba(255,217,138,.34);box-shadow:0 10px 24px rgba(0,0,0,.35);z-index:4}
.zjh-pot-label{font-size:11px;letter-spacing:.2em;color:#a8cfba}
.zjh-pot strong{font-size:26px;line-height:1.05;color:#ffd98a;text-shadow:0 2px 10px rgba(255,180,60,.35)}
.zjh-pot-stake{font-size:11.5px;color:#cfe3d6}
.zjh-pot-chips{position:relative;height:26px;width:86px;margin-top:4px}
.zjh-clock{position:absolute;left:8px;right:8px;bottom:-9px;height:3px;border-radius:3px;background:rgba(255,217,138,.18);overflow:hidden}
.zjh-clock[hidden]{display:none}
.zjh-clock span{display:block;height:100%;background:linear-gradient(90deg,#ffd98a,#ffb04a);transform-origin:left center;transition:transform .25s linear}

/* 筹码：位置上必须自己定位，光泽用绝对定位的子层，才不会跟着滑出牌桌 */
.zjh-chip{position:relative;display:block;width:22px;height:22px;border-radius:50%;
  background:radial-gradient(circle at 34% 28%,#fff3cf 0%,#ffd98a 26%,#e0a13c 62%,#a9701f 100%);
  box-shadow:0 2px 5px rgba(0,0,0,.4),inset 0 0 0 2px rgba(255,255,255,.28);flex:0 0 auto}
.zjh-chip::after{content:'';position:absolute;left:16%;top:12%;width:34%;height:24%;border-radius:50%;background:rgba(255,255,255,.62);filter:blur(.4px)}
.zjh-pot-chips .zjh-chip{position:absolute;left:50%;top:0;margin-left:-11px;transform:translate(calc(var(--x,0) * 1px),calc(var(--y,0) * 1px))}
.zjh-fly{position:absolute;inset:0;pointer-events:none;z-index:8}
.zjh-chip.fly{position:fixed;left:0;top:0;margin:0;animation:zjh-fly .68s cubic-bezier(.25,.9,.3,1) forwards;animation-delay:var(--delay,0ms)}
@keyframes zjh-fly{
  0%{opacity:0;transform:translate(0,0) scale(.7)}
  18%{opacity:1;transform:translate(calc(var(--dx,0px) * .2),calc(var(--dy,0px) * .2 - 16px)) scale(1.06)}
  100%{opacity:.15;transform:translate(var(--dx,0px),var(--dy,0px)) scale(.8)}
}

/* ── 座位 ── */
.zjh-seats{position:absolute;inset:0}
.zjh-seat{position:absolute;width:150px;padding:8px;border-radius:16px;background:rgba(8,24,18,.62);border:1px solid rgba(190,224,207,.16);box-shadow:0 8px 20px rgba(0,0,0,.3);display:flex;flex-direction:column;gap:6px;transition:opacity .25s,filter .25s,border-color .25s,transform .25s}
.zjh-seat[data-pos="bottom"]{left:50%;bottom:6px;transform:translateX(-50%)}
.zjh-seat[data-pos="top"]{left:50%;top:6px;transform:translateX(-50%)}
.zjh-seat[data-pos="left"]{left:6px;top:40%;transform:translateY(-50%)}
.zjh-seat[data-pos="right"]{right:6px;top:40%;transform:translateY(-50%)}
.zjh-seat.me{z-index:3}
.zjh-seat.turn{border-color:rgba(255,217,138,.75);box-shadow:0 0 0 1px rgba(255,217,138,.5),0 10px 26px rgba(0,0,0,.36);animation:zjh-pulse 1.6s ease-in-out infinite}
.zjh-seat.auto{filter:saturate(.75)}
.zjh-seat.folded{opacity:.45;filter:grayscale(.5)}
.zjh-seat.winner{border-color:#ffd98a;box-shadow:0 0 0 2px rgba(255,217,138,.65),0 0 34px rgba(255,190,80,.45)}
.zjh-seat.payout{animation:zjh-pay .9s ease}
@keyframes zjh-pay{0%,100%{filter:none}40%{filter:brightness(1.28) drop-shadow(0 0 12px rgba(255,190,80,.55))}}
@keyframes zjh-pulse{0%,100%{box-shadow:0 0 0 1px rgba(255,217,138,.4),0 10px 26px rgba(0,0,0,.36)}50%{box-shadow:0 0 0 3px rgba(255,217,138,.7),0 10px 30px rgba(0,0,0,.4)}}
.zjh-seat-head{display:flex;align-items:center;gap:7px;min-width:0}
.zjh-avatar-slot{flex:0 0 auto;display:block}
.zjh-avatar{position:relative;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#20432f;border:1.5px solid rgba(255,217,138,.42);overflow:hidden;font-size:13px;font-weight:700;color:#ffd98a}
.zjh-avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .25s}
.zjh-avatar.has-photo img{opacity:1}
.zjh-seat-copy{min-width:0;display:flex;flex-direction:column;line-height:1.25}
.zjh-name{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.zjh-badges{font-size:10.5px;color:#a8cfba;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.zjh-seat-hand{display:flex;justify-content:center}
.zjh-seat-foot{display:flex;justify-content:space-between;gap:6px;font-size:10.5px;color:#cfe3d6}
.zjh-seat-net{font-size:11.5px;text-align:center;font-weight:700;color:#cfe3d6}
.zjh-seat-net.up{color:#8fe0a6}
.zjh-seat-net.down{color:#ff9c8a}
.zjh-turn{position:absolute;inset:-1px;border-radius:inherit;pointer-events:none}

/* ── 牌 ── */
.zjh-card{position:relative;flex:0 0 auto;width:var(--zjh-card-w,44px);height:calc(var(--zjh-card-w,44px) * 1.4);border-radius:calc(var(--zjh-card-w,44px) * .14);perspective:600px}
.zjh-card.small{--zjh-card-w:28px}
.zjh-card.face{background:transparent;border:none;box-shadow:none}
.zjh-card.face .ddz-card{width:100%;height:100%;--ddz-card-w:var(--zjh-card-w,44px)}
.zjh-card.back{background:linear-gradient(150deg,#1d4a6d 0%,#153a58 62%,#0f2b42 100%);border:1px solid rgba(255,217,138,.4);box-shadow:0 2px 6px rgba(0,0,0,.36);overflow:hidden}
.zjh-card.back .zjh-card-lattice{position:absolute;inset:0;background-image:repeating-linear-gradient(45deg,rgba(255,217,138,.16) 0 2px,transparent 2px 6px),repeating-linear-gradient(-45deg,rgba(255,217,138,.12) 0 2px,transparent 2px 6px)}
.zjh-card.back .zjh-card-mark{position:absolute;inset:0;display:grid;place-items:center;font-size:calc(var(--zjh-card-w,44px) * .42);color:#ffd98a;text-shadow:0 1px 3px rgba(0,0,0,.5)}
.zjh-hand{display:flex;align-items:flex-end;gap:4px}
.zjh-hand.small .zjh-card-slide{--zjh-card-w:28px}
.zjh-card-slide{position:relative;display:block;width:var(--zjh-card-w,44px);height:calc(var(--zjh-card-w,44px) * 1.4)}
.zjh-hand.small .zjh-card-slide{--zjh-card-w:28px}
.zjh-card-slide .zjh-card{width:100%;height:100%}
.zjh-peek-cover{position:absolute;inset:0;border-radius:calc(var(--zjh-card-w,44px) * .14);background:linear-gradient(150deg,#1d4a6d,#0f2b42);border:1px solid rgba(255,217,138,.4);transform-origin:left center;transition:transform .5s cubic-bezier(.3,.9,.3,1),opacity .4s ease}
.zjh-card-slide.revealed .zjh-peek-cover{transform:scaleX(.04);opacity:0}
.zjh-card-slide{animation:zjh-deal .34s cubic-bezier(.25,.9,.3,1.15) backwards;animation-delay:calc(var(--order,var(--i,0)) * 70ms)}
@keyframes zjh-deal{from{opacity:0;transform:translateY(-22px) rotate(-6deg) scale(.86)}to{opacity:1;transform:none}}

/* ── 我的牌 ── */
.zjh-my-hand{position:relative;flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 12px 4px;--zjh-card-w:58px}
.zjh-my-hand .zjh-hand{--zjh-card-w:58px}
.zjh-my-hand .zjh-hand .zjh-card{width:var(--zjh-card-w)}
.zjh-my-hand .zjh-hand .zjh-card-slide{--zjh-card-w:58px}
.zjh-my-rank{font-size:12.5px;font-weight:700;color:#ffd98a;letter-spacing:.04em}
.zjh-my-hint{font-size:12px;color:#a8cfba}
.zjh-my-hand.empty{opacity:.4}

/* ── 操作区 ── */
.zjh-actions{flex:0 0 auto;display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;padding:8px 12px 4px;min-height:52px}
.zjh-action{font-size:14px}
.zjh-action.zjh-look{box-shadow:0 0 0 1px rgba(255,217,138,.6),0 8px 20px rgba(255,180,60,.28)}
.zjh-waiting-tip{margin:0;font-size:12.5px;color:#a8cfba}
.zjh-note{margin:0;text-align:center;font-size:11.5px;color:#a8cfba;min-height:14px}

/* 加注/比牌面板 */
.zjh-sheets{position:fixed;inset:0;z-index:9;pointer-events:none}
.zjh-sheets > *{pointer-events:auto}
.zjh-sheet{position:fixed;left:50%;bottom:calc(14px + env(safe-area-inset-bottom,0));transform:translateX(-50%);width:min(420px,calc(100vw - 24px));padding:14px;border-radius:18px;background:linear-gradient(180deg,#16382a,#0e2a1f);border:1px solid rgba(255,217,138,.34);box-shadow:0 20px 46px rgba(0,0,0,.5);z-index:9;display:flex;flex-direction:column;gap:10px}
.zjh-sheet-head{display:flex;flex-direction:column;gap:2px}
.zjh-sheet-head strong{font-size:15px}
.zjh-sheet-head .muted{font-size:11.5px;color:#a8cfba}
.zjh-sheet-value{display:flex;align-items:baseline;gap:6px}
.zjh-sheet-value strong{font-size:26px;color:#ffd98a}
.zjh-sheet-value .muted{font-size:12px;color:#a8cfba}
.zjh-range{width:100%;accent-color:#ffd98a}
.zjh-sheet-quick{display:flex;gap:6px;flex-wrap:wrap}
.zjh-quick{border:1px solid rgba(255,217,138,.4);background:rgba(255,217,138,.1);color:#ffd98a;border-radius:999px;padding:5px 12px;font-size:12.5px}
.zjh-sheet-targets{display:flex;gap:8px;flex-wrap:wrap}
.zjh-target{border:1px solid rgba(190,224,207,.3);background:rgba(190,224,207,.08);color:#f4efe4;border-radius:12px;padding:8px 12px;font-size:13px}
.zjh-sheet-actions{display:flex;justify-content:flex-end;gap:8px}

/* ── 牌局记录 ── */
.zjh-log{flex:0 0 auto;max-height:76px;overflow:hidden;padding:4px 14px 8px;display:flex;flex-direction:column;gap:2px}
.zjh-log-line{margin:0;font-size:11.5px;color:#9dc2ae}
.zjh-log-line:last-child{color:#f4efe4}

/* ── 结算 ── */
.zjh-result{position:fixed;inset:0;z-index:12;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:14px;padding:calc(22px + env(safe-area-inset-top,0)) 22px calc(22px + env(safe-area-inset-bottom,0));background:rgba(5,16,11,.78);backdrop-filter:blur(4px);animation:zjh-fade .25s ease;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
/* 首尾留出 auto 外边距：内容少时居中，内容多时可滚动，不会把顶部按钮顶到屏幕外。 */
.zjh-result>:first-child{margin-top:auto}
.zjh-result>:last-child{margin-bottom:auto}
.zjh-result[hidden]{display:none}
.zjh-result-head{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}
.zjh-result-icon{font-size:34px}
.zjh-result-head strong{font-size:20px}
.zjh-result-head small{font-size:12px;color:#a8cfba}
.zjh-result.won .zjh-result-head strong{color:#8fe0a6}
.zjh-result.lost .zjh-result-head strong{color:#ff9c8a}
.zjh-result-rows{width:min(360px,100%);display:flex;flex-direction:column;gap:6px;padding:12px;border-radius:16px;background:rgba(8,24,18,.72);border:1px solid rgba(190,224,207,.18)}
.zjh-result-row{display:flex;justify-content:space-between;font-size:13px;color:#cfe3d6}
.zjh-result-row.me{color:#f4efe4;font-weight:700}
.zjh-result-row .up{color:#8fe0a6}
.zjh-result-row .down{color:#ff9c8a}
.zjh-result-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:4px}
.zjh-result-hands{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;max-width:min(560px,100%)}
.zjh-result-hand{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:11px;color:#a8cfba}
@keyframes zjh-fade{from{opacity:0}to{opacity:1}}

/* ── 玩法说明 ── */
.zjh-rules{position:fixed;inset:0;z-index:13;display:flex;flex-direction:column;gap:10px;align-items:center;justify-content:flex-start;padding:calc(20px + env(safe-area-inset-top,0)) 22px calc(20px + env(safe-area-inset-bottom,0));background:rgba(5,16,11,.86);backdrop-filter:blur(4px);overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.zjh-rules>:first-child{margin-top:auto}
.zjh-rules>:last-child{margin-bottom:auto}
.zjh-rules[hidden]{display:none}
.zjh-rules strong{font-size:17px}
.zjh-rules p{margin:0;font-size:13px;line-height:1.6;color:#dbeade}
.zjh-rules .muted{color:#a8cfba}
/* 玩法说明必须自己能关：以前只能点被它盖住的顶栏按钮，等于关不掉。 */
.zjh-rules-back{align-self:flex-start;color:#ffd98a}
.zjh-rules-copy{width:min(520px,100%);display:flex;flex-direction:column;gap:8px;align-items:flex-start}

/* ── 窄屏 ── */
@media (max-width:460px){
  .zjh-my-hand{--zjh-card-w:50px;padding-top:6px}
  .zjh-my-hand .zjh-hand{--zjh-card-w:50px}
  .zjh-my-hand .zjh-hand .zjh-card-slide{--zjh-card-w:50px}
  .zjh-seat{width:108px;padding:6px}
  .zjh-card.small,.zjh-hand.small .zjh-card-slide{--zjh-card-w:24px}
  .zjh-seat[data-pos="left"]{left:4px}
  .zjh-seat[data-pos="right"]{right:4px}
  .zjh-pot strong{font-size:22px}
  .zjh-pot{min-width:104px;padding:8px 12px 10px}
  .zjh-log{max-height:62px}
}
@media (prefers-reduced-motion:reduce){
  .zjh-card-slide,.zjh-seat.turn,.zjh-chip.fly,.zjh-seat.payout{animation:none}
  .zjh-peek-cover{transition:opacity .2s}
}

/* 动作按钮站在深绿绒面上，白底会亮得刺眼，统一压成暗底 + 金边。 */
.zjh-view .zjh-action.secondary-button{
  color:#f2ead9;
  background:linear-gradient(180deg,rgba(255,217,138,.14),rgba(255,217,138,.05));
  border:1px solid rgba(255,217,138,.42);
  box-shadow:inset 0 0 14px rgba(0,0,0,.35);
}
.zjh-view .zjh-action.secondary-button:active{background:linear-gradient(180deg,rgba(255,217,138,.22),rgba(255,217,138,.1))}
.zjh-view .zjh-action.primary-button{
  color:#2a1c09;
  background:linear-gradient(140deg,#f4dcae,#d9b46c);
  border:none;
}
.zjh-view .zjh-action.text-button{color:#d8e6dc}
.zjh-view .zjh-action:disabled{opacity:.42}
