
/* Shared Kenny UI tokens. Scope to game surfaces; never change the app's rpx scale. */
:root, .app {
  --game-ui-build:"63.4.12";
  --game-bg:#f2f2f7; --game-surface:#fff; --game-fill:#e9e9ef;
  --game-text:#1c1c1e; --game-secondary:#606069; --game-line:#d1d1d8;
  --game-accent:#0066cc; --game-on-accent:#fff; --game-selection:#e6f0ff;
  --game-danger:#b42318; --game-success:#187541; --game-warning:#8a4b08;
  --game-disabled:#73737c; --game-radius:18px; --game-control-radius:14px;
  --game-icon-button:44px;
  --game-action-size:clamp(14px,calc(28 * var(--game-rpx)),17px);
  --game-font:-apple-system,BlinkMacSystemFont,"SF Pro Text","PingFang SC","Microsoft YaHei",sans-serif;
  /* Games need larger type and touch targets than data-dense Penny screens. */
  --game-rpx:calc(100vw / 750 * 1.1);
  --game-caption:clamp(13px,calc(24 * var(--game-rpx)),15px);
  --game-secondary-size:clamp(14px,calc(27 * var(--game-rpx)),17px);
  --game-body-size:clamp(16px,calc(31 * var(--game-rpx)),19px);
  --game-title-size:clamp(22px,calc(42 * var(--game-rpx)),28px);
  --game-display-size:clamp(28px,calc(50 * var(--game-rpx)),34px);
  --game-control-height:clamp(52px,calc(96 * var(--game-rpx)),60px);
  --game-nav-height:clamp(58px,calc(104 * var(--game-rpx)),66px);
}
:root[data-theme="dark"], .app.dark {
  --game-bg:#111113; --game-surface:#1c1c1e; --game-fill:#2c2c2e;
  --game-text:#f5f5f7; --game-secondary:#b3b3bc; --game-line:#48484e;
  --game-accent:#80b8ff; --game-on-accent:#09213f; --game-selection:#20354e;
  --game-danger:#ff9a90; --game-success:#79d9a0; --game-warning:#f4c078;
  --game-disabled:#9797a1;
}
.game-room { font-family:var(--game-font); background:var(--game-bg); color:var(--game-text); -webkit-font-smoothing:antialiased; }
.game-room button { min-width:44px; min-height:var(--game-control-height); max-width:100%; border-radius:var(--game-control-radius); font-family:inherit; font-size:var(--game-action-size); font-weight:600; letter-spacing:0; white-space:nowrap; }
.game-room button:focus-visible, .game-room a:focus-visible { outline:3px solid var(--game-accent); outline-offset:2px; }
.game-room button:disabled { color:var(--game-disabled); background:var(--game-fill); opacity:1; cursor:default; }
.game-room .primary { color:var(--game-on-accent); background:var(--game-accent); border-color:transparent; box-shadow:none; }
.game-room .primary:hover { filter:brightness(.96); }
.game-room .quiet { color:var(--game-accent); background:transparent; border-color:transparent; }
.game-room h1,.game-room h2,.game-room h3 { color:var(--game-text); font-weight:700; letter-spacing:-.5px; overflow-wrap:anywhere; }
.game-room .game-nav { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; min-height:var(--game-nav-height); gap:4px; padding:5px max(14px,env(safe-area-inset-right)) 5px max(14px,env(safe-area-inset-left)); background:var(--game-surface); border-bottom:1px solid var(--game-line); flex-shrink:0; }
.game-nav > :first-child { justify-self:start; }
.game-nav > :last-child { justify-self:end; }
.game-room .game-nav .nav-title { font-size:var(--game-body-size); font-weight:600; color:var(--game-text); letter-spacing:0; text-decoration:none; white-space:nowrap; }
.game-room .game-nav .nav-back { display:flex; align-items:center; min-height:var(--game-control-height); font-size:var(--game-body-size); padding:8px 0; white-space:nowrap; }
.game-room .game-nav .nav-actions { display:flex; gap:0; }
.game-room .game-nav .nav-actions button { padding:8px; font-size:18px; }
/* Host game center and card games use the same surfaces and controls. */
.app .log-game { background:var(--game-bg); color:var(--game-text); }
.app .kgc-center, .app .kgc-card-area { font-family:var(--game-font); max-width:760px; margin-inline:auto; }
.app .kgc-center { padding:16px 14px 28px; }
.app .kgc-title { font-size:var(--game-title-size); color:var(--game-text); }
.app .kgc-section-head { font-size:var(--game-secondary-size); color:var(--game-secondary); }
.app .kgc-game,.app .kgc-puzzle,.app .kgc-arcade { border-radius:var(--game-radius); background:var(--game-surface); color:var(--game-text); border:1px solid var(--game-line); box-shadow:none; }
.app .kgc-game { padding:16px; }
.app .kgc-game-art { height:100px; margin:-16px -16px 14px; }
.app .kgc-game-title { color:var(--game-text); font-size:var(--game-title-size); letter-spacing:0; }
.app .kgc-game-tag,.app .kgc-game-sub,.app .kgc-puzzle .kgc-game-tag,.app .kgc-puzzle .kgc-game-sub,.app .kgc-arcade .kgc-game-tag { color:var(--game-secondary); font-size:var(--game-secondary-size); }
.app .kgc-game-link,.app .kgc-puzzle .kgc-game-link,.app .kgc-arcade .kgc-game-link { color:var(--game-accent); border-color:var(--game-line); font-size:var(--game-body-size); min-height:var(--game-control-height); align-items:center; padding-top:8px; margin-top:12px; }
.app .kgc-puzzle { padding:16px; gap:16px; }
.app .kgc-puzzle-art { flex-basis:94px; height:106px; }
.app .kgc-arcade-copy { background:var(--game-surface); padding:16px; min-width:0; }
.app .kgc-arcade { grid-template-columns:minmax(0,1fr) minmax(0,1fr); min-height:150px; }
.app .kgc-arcade-art { min-height:150px; }
.app .kgc-arcade .kgc-game-link { margin-top:auto; }
.app .kgc-continue { background:var(--game-selection); border-color:var(--game-line); box-shadow:none; }
.app .kgc-continue-title,.app .kgc-arrow { color:var(--game-text); }
.app .kgc-continue-detail,.app .kgc-continue-label { color:var(--game-secondary); }
.app .kgc-card-area { --fg:var(--game-text); --txt:var(--game-text); --sub:var(--game-secondary); --muted:var(--game-secondary); --bg:var(--game-bg); --bg-elev:var(--game-surface); --line:var(--game-line); --accent:var(--game-accent); padding:0 12px 24px; }
.app .kgc-back-row { min-height:var(--game-nav-height); padding:0; gap:12px; }
.app .kgc-back { display:flex; align-items:center; min-height:var(--game-control-height); padding:0; color:var(--game-accent); background:transparent; border:0; border-radius:0; font-size:var(--game-body-size); flex-shrink:0; }
.app .kgc-back-caption { color:var(--game-text); font-size:var(--game-body-size); font-weight:600; }
.app .kgc-card-area .kb-top { display:flex; flex-direction:column; gap:12px; padding:0; margin-bottom:16px; }
.app .kgc-card-area .kb-seg { width:100%; padding:3px; background:var(--game-fill); border:0; box-shadow:none; }
.app .kgc-card-area .kb-seg-i { min-width:0; min-height:var(--game-control-height); color:var(--game-secondary); font-size:var(--game-body-size); }
.app .kgc-card-area .kb-seg-i.on { background:var(--game-surface); color:var(--game-text); box-shadow:0 1px 4px #00000012; }
.app .kgc-card-area .kcoin-float { position:relative; inset:auto; z-index:5; align-self:stretch; align-items:stretch; }
.app .kgc-card-area .kcoin-float-body { background:var(--game-surface); border:1px solid var(--game-line); border-radius:14px; box-shadow:none; animation:none; justify-content:space-between; align-items:center; flex-wrap:wrap; padding:4px 8px; }
.app .kgc-card-area .kcoin-float-main { min-width:0; flex:1; padding:4px; }
.app .kgc-card-area .kcoin-float-val { color:var(--game-text); font-size:var(--game-title-size); overflow-wrap:anywhere; }
.app .kgc-card-area .kcoin-float-num { min-width:0; }
.app .kgc-card-area .kcoin-float-side { flex-direction:row; border:0; padding:0; gap:4px; }
.app .kgc-card-area .kcoin-float-hist,.app .kgc-card-area .kcoin-float-fold { display:flex; align-items:center; justify-content:center; min-width:44px; min-height:var(--game-control-height); font-size:var(--game-secondary-size); padding:6px; background:transparent; color:var(--game-accent); }
.app .kgc-card-area .kcoin-float-dot { width:44px; height:44px; align-self:flex-end; background:var(--game-fill); color:var(--game-text); box-shadow:none; animation:none; font-size:18px; }
.app .kgc-card-area .kcoin-float-pnl.up,.app .kgc-card-area .pos { color:var(--game-success); }
.app .kgc-card-area .kcoin-float-pnl.down,.app .kgc-card-area .neg { color:var(--game-danger); }
.app .kgc-card-area .kh-pop { width:min(320px,100%); max-height:260px; color:var(--game-text); background:var(--game-surface); border-color:var(--game-line); box-shadow:0 8px 28px #0002; }
.app .kgc-card-area .kh-pop-date,.app .kgc-card-area .kh-pop-type,.app .kgc-card-area .kh-pop-hand,.app .kgc-card-area .kh-pop-empty { color:var(--game-secondary); }
.app .kgc-card-area .holdem-area,.app .kgc-card-area .gd-area { padding:0; min-width:0; }
.app .kgc-card-area .holdem-start,.app .kgc-card-area .gd-start { padding:20px 16px; background:var(--game-surface); border:1px solid var(--game-line); border-radius:var(--game-radius); overflow:visible; }
.app .kgc-card-area .hs-head,.app .kgc-card-area .gd-head { padding:0 0 16px; animation:none; text-align:left; }
.app .kgc-card-area .hs-title,.app .kgc-card-area .gd-title { font-size:var(--game-display-size); letter-spacing:-.5px; color:var(--game-text); }
.app .kgc-card-area .hs-sub,.app .kgc-card-area .gd-sub { font-size:var(--game-body-size); line-height:1.5; color:var(--game-secondary); }
.app .kgc-card-area .hs-blind-seg { gap:4px; background:var(--game-fill); padding:3px; border-radius:12px; animation:none; }
.app .kgc-card-area .hs-blind-opt { min-height:var(--game-control-height); min-width:0; padding:8px 2px; flex:1; display:flex; align-items:center; justify-content:center; font-size:var(--game-caption); border:0; border-radius:9px; background:transparent; color:var(--game-secondary); box-shadow:none; }
.app .kgc-card-area .hs-blind-opt.on { background:var(--game-surface); color:var(--game-accent); box-shadow:0 1px 4px #0001; }
.app .kgc-card-area .gd-diff { display:block; margin:0 0 18px; text-align:left; animation:none; }
.app .kgc-card-area .gd-diff-label { display:block; font-size:var(--game-secondary-size); color:var(--game-secondary); margin-bottom:8px; }
.app .kgc-card-area .gd-diff-opts { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:4px; }
.app .kgc-card-area .gd-diff-opt { display:flex; align-items:center; justify-content:center; min-height:var(--game-control-height); min-width:0; padding:8px 2px; border-radius:10px; font-size:var(--game-secondary-size); background:var(--game-fill); color:var(--game-secondary); border:1px solid transparent; box-shadow:none; }
.app .kgc-card-area .gd-diff-opt.on { background:var(--game-selection); color:var(--game-accent); border-color:var(--game-accent); }
.app .kgc-card-area .hs-btn,.app .kgc-card-area .gd-btn,.app .kgc-card-area .h-raise-ok,.app .kgc-card-area .h-result-btn.primary,.app .kgc-card-area .gd-result-btn.primary { background:var(--game-accent); color:var(--game-on-accent); border:0; box-shadow:none; min-height:var(--game-control-height); border-radius:12px; font-size:var(--game-body-size); font-weight:600; letter-spacing:0; animation:none; padding:12px; }
.app .kgc-card-area .hs-btn::after,.app .kgc-card-area .gd-btn::after { display:none; }
.app .kgc-card-area .gd-btn-t { font-size:var(--game-body-size); letter-spacing:0; }
.app .kgc-card-area .gd-btn-sub { font-size:var(--game-caption); opacity:1; }
.app .kgc-card-area .hs-brief,.app .kgc-card-area .gd-brief { padding:16px 0 0; margin:0; background:none; border:0; box-shadow:none; animation:none; }
.app .kgc-card-area .hs-brief-line,.app .kgc-card-area .gd-brief-line { font-size:var(--game-secondary-size); line-height:1.6; color:var(--game-secondary); }
.app .kgc-card-area .hs-brief-link,.app .kgc-card-area .gd-brief-link { display:flex; align-items:center; justify-content:center; min-height:var(--game-control-height); font-size:var(--game-body-size); color:var(--game-accent); background:none; border:0; padding:8px; }
.app .kgc-card-area .gd-wild-note { margin:0 0 16px; padding:10px; background:var(--game-fill); border-color:var(--game-line); }
.app .kgc-card-area .gd-wild-txt { color:var(--game-secondary); font-size:var(--game-secondary-size); }
.app .kgc-card-area .h-table,.app .kgc-card-area .gd-table,.app .kgc-card-area .h-result,.app .kgc-card-area .gd-result { background:var(--game-surface); border-color:var(--game-line); border-radius:var(--game-radius); box-shadow:none; }
.app .kgc-card-area .h-actions,.app .kgc-card-area .h-result-btns,.app .kgc-card-area .gd-result-btns,.app .kgc-card-area .h-raise-quick { flex-wrap:wrap; }
.app .kgc-card-area .h-btn,.app .kgc-card-area .gd-act-btn,.app .kgc-card-area .h-result-btn,.app .kgc-card-area .gd-result-btn,.app .kgc-card-area .h-quick-btn { min-height:var(--game-control-height); min-width:0; display:flex; align-items:center; justify-content:center; flex:1 1 64px; padding:10px 8px; border-radius:12px; font-size:var(--game-body-size); line-height:1.4; overflow-wrap:anywhere; box-shadow:none; }
.app .kgc-card-area .gd-act-btn { color:var(--game-accent); background:var(--game-selection); border-color:var(--game-line); }
.app .kgc-card-area .gd-act-btn.play { background:var(--game-accent); color:var(--game-on-accent); border-color:transparent; }
.app .kgc-card-area .gd-act-btn.dis { background:var(--game-fill); color:var(--game-disabled); opacity:1; }
.app .kgc-card-area .gd-act-btn.auto.on { background:var(--game-accent); color:var(--game-on-accent); }
.app .kgc-card-area .h-quick-btn { background:var(--game-fill); color:var(--game-text); border-color:var(--game-line); }
.app .kgc-card-area .gd-hand-turn,.app .kgc-card-area .gd-ai-mate { color:var(--game-success); }
.app .kgc-card-area .gd-session-end { min-height:var(--game-control-height); color:var(--game-danger); display:flex; justify-content:center; align-items:center; font-size:var(--game-body-size); }
.app .kgc-card-area .h-btn.fold { color:var(--game-danger); background:var(--game-fill); border-color:var(--game-line); }
.app .kgc-card-area .h-btn.check,.app .kgc-card-area .h-btn.call,.app .kgc-card-area .h-btn.raise { color:var(--game-accent); background:var(--game-selection); border-color:var(--game-accent); }
.app .kgc-card-area .h-raise-close { min-width:44px; min-height:44px; }
.app .kgc-card-area .h-raise-panel { background:var(--game-surface); border-color:var(--game-line); box-shadow:none; }
.app .kgc-card-area .h-ai-act,.app .kgc-card-area .gd-ai-act { color:var(--game-secondary); background:var(--game-surface); font-size:10px; box-shadow:none; }
.app .kgc-card-area .h-ai-act.check,.app .kgc-card-area .h-ai-act.call { color:var(--game-accent); }
.app .kgc-card-area .h-ai-act.raise { color:var(--game-warning); }
.app .kgc-card-area .gd-hand-info,.app .kgc-card-area .gd-session-hd { flex-wrap:wrap; }
.app .puzzle-shell,.app .strike-shell,.app .puzzle-loading,.app .strike-loading { background:var(--game-bg); color:var(--game-text); }
.app .puzzle-shell iframe,.app .strike-frame { background:var(--game-bg); }
.app .strike-loading { inset:0; }
.app .game-loading-back { color:var(--game-accent); min-height:44px; padding:12px; cursor:pointer; }
.app .kgc-card-area :is(.hs-btn,.gd-btn-t,.hs-blind-opt,.gd-diff-opt,.h-btn,.gd-act-btn,.h-quick-btn,.h-result-btn,.gd-result-btn,.gd-session-end),.app .kgc-game-link { white-space:nowrap; overflow-wrap:normal; }
.app .kgc-card-area .h-actions,.app .kgc-card-area .gd-actions,.app .kgc-card-area .h-raise-quick { display:grid; grid-template-columns:repeat(auto-fit,minmax(86px,1fr)); }
.app .kgc-card-area .h-btn,.app .kgc-card-area .gd-act-btn,.app .kgc-card-area .h-quick-btn { font-size:var(--game-body-size); }
.app .kgc-card-area .gd-btn-sub { font-size:var(--game-caption); white-space:nowrap; }
@media(max-width:360px) {
  .game-room .game-nav { padding-inline:8px; gap:2px; }
  .game-room .game-nav .nav-title { font-size:var(--game-body-size); }
  .app .kgc-game-title { font-size:var(--game-title-size); }
  .app .kgc-puzzle { gap:10px; }
  .app .kgc-puzzle-art { flex-basis:84px; }
}

/* Phone-first game hub. Each cover keeps the authored 16:10 geometry; the list
   scrolls naturally instead of cropping artwork to force four entries onscreen. */
.app .kgc-center {
  width:min(100%,680px);
  padding:14px 14px max(28px,env(safe-area-inset-bottom));
}
.app .kgc-heading { padding:2px 2px 14px; }
.app .kgc-title { font-size:var(--game-title-size); line-height:1.25; letter-spacing:-.35px; }
.app .kgc-continue {
  min-height:84px;
  gap:14px;
  margin:0 0 14px;
  padding:14px 16px;
  border-radius:18px;
}
.app .kgc-continue-copy { gap:3px; min-width:0; }
.app .kgc-continue-label { font-size:var(--game-secondary-size); }
.app .kgc-continue-title { font-size:var(--game-title-size); line-height:1.3; }
.app .kgc-continue-detail { font-size:var(--game-secondary-size); line-height:1.4; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.app .kgc-arrow { flex:0 0 auto; font-size:25px; }
.app .kgc-grid { grid-template-columns:1fr; gap:10px; }
.app .kgc-game,
.app .kgc-puzzle,
.app .kgc-arcade {
  display:grid;
  grid-template-columns:1fr;
  grid-template-rows:auto auto;
  min-height:0;
  padding:0;
  gap:0;
  overflow:hidden;
  border-radius:18px;
}
.app .kgc-game-art,
.app .kgc-puzzle-art,
.app .kgc-arcade-art {
  grid-column:1;
  grid-row:1;
  width:100%;
  height:auto;
  min-height:0;
  margin:0;
  aspect-ratio:16/10;
  flex-basis:auto;
}
.app .kgc-game-copy,
.app .kgc-arcade-copy {
  grid-column:1;
  grid-row:2;
  min-width:0;
  min-height:126px;
  padding:15px 16px 10px;
  background:var(--game-surface);
}
.app .kgc-game-title { margin-top:6px; font-size:var(--game-title-size); }
.app .kgc-game-link,
.app .kgc-puzzle .kgc-game-link,
.app .kgc-arcade .kgc-game-link {
  min-height:var(--game-control-height);
  margin-top:auto;
  padding-top:8px;
  font-size:var(--game-body-size);
}

/* Card rooms share one phone geometry and leave the app chrome to define the safe area. */
.app .kgc-card-area { width:min(100%,680px); padding:0 14px max(20px,env(safe-area-inset-bottom)); }
.app .kgc-card-area .holdem-start,
.app .kgc-card-area .gd-start { padding:18px 16px; }
.app .kgc-card-area .hs-head,
.app .kgc-card-area .gd-head { padding-bottom:14px; }
.app .kgc-card-area .hs-title,
.app .kgc-card-area .gd-title { font-size:var(--game-display-size); line-height:1.2; }
.app .kgc-card-area .hs-emblem,
.app .kgc-card-area .gd-emblem { width:54px; height:54px; margin-bottom:10px; }
.app .kgc-card-area .hs-emblem svg,
.app .kgc-card-area .gd-emblem svg { width:27px; height:27px; }
.app .kgc-card-area .h-table,
.app .kgc-card-area .gd-table { min-height:0; }

/* Playing cards and opponents use physical phone sizes. The legacy rpx values were
   designed for a 750-wide canvas and became too small on a 390px viewport. */
.app .kgc-card-area .h-table,
.app .kgc-card-area .gd-table { padding:12px; border-radius:18px; margin-bottom:8px; }
.app .kgc-card-area .h-ais,
.app .kgc-card-area .gd-ais { gap:6px; margin-bottom:8px; }
.app .kgc-card-area .h-ai,
.app .kgc-card-area .gd-ai { min-width:0; flex:1 1 0; max-width:104px; gap:3px; padding:7px 5px; border-radius:12px; }
.app .kgc-card-area .h-ai-av.svg,
.app .kgc-card-area .gd-ai-av { width:36px; height:36px; }
.app .kgc-card-area .h-ai-name,
.app .kgc-card-area .gd-ai-name { max-width:100%; font-size:11px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.app .kgc-card-area .h-cback { width:16px; height:23px; border-radius:3px; }
.app .kgc-card-area .h-cback.sm { width:14px; height:20px; }
.app .kgc-card-area .h-ai-act,
.app .kgc-card-area .gd-ai-act { font-size:10px; padding:3px 7px; }
.app .kgc-card-area .gd-ai-cnt { font-size:11px; }
.app .kgc-card-area .gd-ai-mate,
.app .kgc-card-area .gd-ai-place { font-size:9px; padding:3px 6px; }
.app .kgc-card-area .h-pot { gap:6px; margin-bottom:8px; font-size:17px; }
.app .kgc-card-area .h-pot-chip { width:16px; height:16px; }
.app .kgc-card-area .h-comm { min-height:82px; gap:6px; margin-bottom:8px; }
.app .kgc-card-area .h-card { width:42px; height:60px; border-radius:6px; }
.app .kgc-card-area .h-card.sm { width:32px; height:45px; border-radius:5px; }
.app .kgc-card-area .h-card.md { width:56px; height:78px; border-radius:8px; }
.app .kgc-card-area .h-card.xsm { width:22px; height:31px; border-radius:3px; }
.app .kgc-card-area .h-card-r { font-size:18px; }
.app .kgc-card-area .h-card-s { font-size:13px; }
.app .kgc-card-area .h-card.sm .h-card-r { font-size:14px; }
.app .kgc-card-area .h-card.sm .h-card-s { font-size:10px; }
.app .kgc-card-area .h-card.md .h-card-r { font-size:24px; }
.app .kgc-card-area .h-card.md .h-card-s { font-size:17px; }
.app .kgc-card-area .h-card.xsm .h-card-r { font-size:10px; }
.app .kgc-card-area .h-card.xsm .h-card-s { font-size:8px; }
.app .kgc-card-area .h-player { padding:9px; margin-bottom:8px; border-radius:14px; }
.app .kgc-card-area .h-player-cards { gap:8px; }
.app .kgc-card-area .gd-center { padding:2px 0 8px; }
.app .kgc-card-area .gd-level-chip { margin-bottom:5px; padding:4px 10px; font-size:10px; }
.app .kgc-card-area .gd-msg { margin-bottom:7px; font-size:var(--game-secondary-size); }
.app .kgc-card-area .gd-log { min-height:82px; gap:5px; padding:7px; border-radius:11px; }
.app .kgc-card-area .gd-log-empty { padding:24px 0; font-size:var(--game-secondary-size); }
.app .kgc-card-area .gd-hand-wrap { padding:8px 8px 5px; border-radius:14px; }
.app .kgc-card-area .gd-hand-info { gap:7px; padding-bottom:6px; }
.app .kgc-card-area .gd-hand-me { font-size:10px; padding:3px 7px; }
.app .kgc-card-area .gd-hand-cnt,
.app .kgc-card-area .gd-hand-sel,
.app .kgc-card-area .gd-hand-turn { font-size:var(--game-caption); }
.app .kgc-card-area .gd-hand-rows { gap:5px; padding-top:5px; }
.app .kgc-card-area .gd-hand-row { grid-template-columns:repeat(9,minmax(0,1fr)); gap:4px; }
.app .kgc-card-area .gd-card { height:52px; border-radius:6px; }
.app .kgc-card-area .gd-card-r { font-size:17px; }
.app .kgc-card-area .gd-card-s { font-size:12px; }
.app .kgc-card-area .gd-actions { gap:6px; padding:8px 0 2px; }

@media(min-width:640px) {
  .app .kgc-center { padding-inline:20px; }
  .app .kgc-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
  .app .kgc-game,
  .app .kgc-puzzle,
  .app .kgc-arcade { display:flex; min-height:0; }
  .app .kgc-game-art,
  .app .kgc-puzzle-art,
  .app .kgc-arcade-art { width:100%; height:auto; min-height:0; aspect-ratio:16/10; }
  .app .kgc-game-copy,
  .app .kgc-arcade-copy { min-height:118px; padding:14px 16px 12px; }
}

@media(max-width:360px) {
  .app .kgc-center { padding-inline:12px; }
  .app .kgc-game,
  .app .kgc-puzzle,
  .app .kgc-arcade { grid-template-columns:1fr; min-height:0; }
  .app .kgc-game-art,
  .app .kgc-puzzle-art,
  .app .kgc-arcade-art { width:100%; min-height:0; aspect-ratio:16/10; }
  .app .kgc-game-copy,
  .app .kgc-arcade-copy { min-height:118px; padding:13px 14px 9px; }
  .app .kgc-game-title { font-size:var(--game-title-size); }
  .app .kgc-card-area { padding-inline:10px; }
  .app .kgc-card-area .holdem-start,
  .app .kgc-card-area .gd-start { padding:16px 12px; }
  .app .kgc-card-area .h-table,
  .app .kgc-card-area .gd-table { padding:10px; }
  .app .kgc-card-area .h-comm { gap:4px; }
  .app .kgc-card-area .h-card.md { width:48px; height:67px; }
  .app .kgc-card-area .h-card.md .h-card-r { font-size:21px; }
  .app .kgc-card-area .h-card.md .h-card-s { font-size:15px; }
}

/* V62.10 mobile app contract
   The host and both iframe games now use the same 750rpx scale as Jenny/Penny.
   Keep this block last: it replaces the previous web-gallery geometry. */
:root, .app {
  /* iframe games must use the phone's short side in landscape; 100vw would
     double every control on wide iPhones. Host pages keep the app's --rpx. */
  --game-rpx:var(--rpx,calc(100vmin / 750 * 1.1));
  --game-caption:var(--type-footnote,calc(22 * var(--game-rpx)));
  --game-secondary-size:var(--type-secondary,calc(24 * var(--game-rpx)));
  --game-body-size:var(--type-action,calc(28 * var(--game-rpx)));
  --game-title-size:var(--type-title,calc(34 * var(--game-rpx)));
  --game-display-size:calc(44 * var(--game-rpx));
  --game-control-height:calc(84 * var(--game-rpx));
  --game-nav-height:calc(88 * var(--game-rpx));
  --game-radius:calc(20 * var(--game-rpx));
  --game-control-radius:14px;
}

/* Game center: one native grouped list, with the same density as Penny rows. */
.app .kgc-center {
  width:100%; max-width:none;
  padding:calc(18 * var(--rpx)) calc(24 * var(--rpx)) max(calc(36 * var(--rpx)),env(safe-area-inset-bottom));
}
.app .kgc-heading { padding:0 calc(4 * var(--rpx)) calc(18 * var(--rpx)); }
.app .kgc-title { font-size:calc(34 * var(--rpx)); line-height:1.25; letter-spacing:0; }
.app .kgc-continue {
  min-height:calc(128 * var(--rpx)); margin:0 0 calc(20 * var(--rpx));
  padding:calc(18 * var(--rpx)) calc(22 * var(--rpx)); gap:calc(18 * var(--rpx));
  border-radius:var(--r-lg);
}
.app .kgc-continue-copy { gap:calc(3 * var(--rpx)); }
.app .kgc-continue-label,.app .kgc-continue-detail { font-size:calc(22 * var(--rpx)); }
.app .kgc-continue-title { font-size:calc(30 * var(--rpx)); line-height:1.3; }
.app .kgc-arrow { font-size:calc(36 * var(--rpx)); }
.app .kgc-grid {
  display:block; overflow:hidden; gap:0;
  border:0.5px solid var(--line); border-radius:var(--r-lg); background:var(--bg-elev);
}
.app .kgc-game,.app .kgc-puzzle,.app .kgc-arcade {
  position:relative; display:grid;
  grid-template-columns:calc(164 * var(--rpx)) minmax(0,1fr);
  grid-template-rows:1fr;
  align-items:center; gap:calc(20 * var(--rpx));
  width:100%; min-height:calc(190 * var(--rpx));
  padding:calc(16 * var(--rpx)) calc(22 * var(--rpx));
  overflow:hidden; border:0; border-radius:0; background:transparent; box-shadow:none;
}
.app .kgc-game:not(:last-child)::after {
  content:""; position:absolute; left:calc(206 * var(--rpx)); right:0; bottom:0;
  height:0.5px; background:var(--line);
}
.app .kgc-game-art,.app .kgc-puzzle-art,.app .kgc-arcade-art {
  grid-column:1; grid-row:1; width:calc(164 * var(--rpx)); height:calc(132 * var(--rpx));
  min-height:0; margin:0; aspect-ratio:auto; flex-basis:auto;
  border-radius:var(--r-md); overflow:hidden;
}
.app .kgc-game-copy,.app .kgc-arcade-copy {
  position:relative; grid-column:2; grid-row:1; display:flex; justify-content:center;
  min-width:0; min-height:calc(132 * var(--rpx)); padding:0 calc(44 * var(--rpx)) 0 0;
  background:transparent;
}
.app .kgc-game-tag,.app .kgc-puzzle .kgc-game-tag,.app .kgc-arcade .kgc-game-tag {
  order:2; margin-top:calc(7 * var(--rpx)); font-size:calc(22 * var(--rpx)); line-height:1.4;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.app .kgc-game-title {
  order:1; margin:0; font-size:calc(30 * var(--rpx)); line-height:1.3; font-weight:650;
}
.app .kgc-game-link,.app .kgc-puzzle .kgc-game-link,.app .kgc-arcade .kgc-game-link {
  position:absolute; right:0; top:50%; width:calc(36 * var(--rpx)); min-height:calc(56 * var(--rpx));
  margin:0; padding:0; border:0; transform:translateY(-50%);
  display:flex; align-items:center; justify-content:center; color:var(--muted); font-size:0;
}
.app .kgc-game-link text:first-child { display:none; }
.app .kgc-game-link text:last-child { font-size:calc(34 * var(--rpx)); font-weight:400; }

/* Card game pages are app screens inside the existing shell, not floating webpages. */
.app .kgc-card-area {
  width:100%; max-width:none;
  padding:0 calc(24 * var(--rpx)) max(calc(32 * var(--rpx)),env(safe-area-inset-bottom));
}
.app .kgc-back-row { min-height:calc(84 * var(--rpx)); padding:0 calc(2 * var(--rpx)); }
.app .kgc-back,.app .kgc-back-caption { font-size:calc(28 * var(--rpx)); }
.app .kgc-back > text { font-size:calc(42 * var(--rpx)); line-height:1; }
.app .kgc-card-area .kb-top { gap:calc(12 * var(--rpx)); margin-bottom:calc(18 * var(--rpx)); }
.app .kgc-card-area .holdem-start,.app .kgc-card-area .gd-start {
  padding:calc(22 * var(--rpx)) 0; border:0; border-radius:0; background:transparent;
}
.app .kgc-card-area .hs-head,.app .kgc-card-area .gd-head { padding-bottom:calc(24 * var(--rpx)); }
.app .kgc-card-area .hs-title,.app .kgc-card-area .gd-title { font-size:calc(44 * var(--rpx)); }
.app .kgc-card-area .hs-sub,.app .kgc-card-area .gd-sub { margin-top:calc(8 * var(--rpx)); font-size:calc(24 * var(--rpx)); }
.app .kgc-card-area .hs-blind-seg { margin-bottom:calc(24 * var(--rpx)); }
.app .kgc-card-area .hs-blind-opt,.app .kgc-card-area .gd-diff-opt {
  min-height:calc(84 * var(--rpx)); font-size:calc(24 * var(--rpx));
}
.app .kgc-card-area .gd-diff { margin-bottom:calc(24 * var(--rpx)); }
.app .kgc-card-area .gd-diff-label { font-size:calc(24 * var(--rpx)); }
.app .kgc-card-area .hs-btn,.app .kgc-card-area .gd-btn,
.app .kgc-card-area .h-raise-ok,.app .kgc-card-area .h-result-btn.primary,
.app .kgc-card-area .gd-result-btn.primary {
  min-height:calc(88 * var(--rpx)); font-size:calc(28 * var(--rpx)); border-radius:var(--r-md);
}
.app .kgc-card-area .hs-brief-line,.app .kgc-card-area .gd-brief-line,
.app .kgc-card-area .gd-wild-txt { font-size:calc(23 * var(--rpx)); }
.app .kgc-card-area .hs-brief-link,.app .kgc-card-area .gd-brief-link {
  min-height:calc(76 * var(--rpx)); font-size:calc(26 * var(--rpx));
}
.app .kgc-card-area .h-btn,.app .kgc-card-area .gd-act-btn,
.app .kgc-card-area .h-result-btn,.app .kgc-card-area .gd-result-btn,
.app .kgc-card-area .h-quick-btn {
  min-height:calc(84 * var(--rpx)); font-size:calc(26 * var(--rpx));
}

@media(min-width:640px) {
  .app .kgc-center,.app .kgc-card-area { width:100%; max-width:none; }
  .app .kgc-grid { display:block; }
  .app .kgc-game,.app .kgc-puzzle,.app .kgc-arcade { display:grid; min-height:calc(190 * var(--rpx)); }
  .app .kgc-game-art,.app .kgc-puzzle-art,.app .kgc-arcade-art { width:calc(164 * var(--rpx)); height:calc(132 * var(--rpx)); aspect-ratio:auto; }
  .app .kgc-game-copy,.app .kgc-arcade-copy { min-height:calc(132 * var(--rpx)); padding:0 calc(44 * var(--rpx)) 0 0; }
}
@media(max-width:360px) {
  .app .kgc-center,.app .kgc-card-area { padding-left:calc(20 * var(--rpx)); padding-right:calc(20 * var(--rpx)); }
  .app .kgc-game,.app .kgc-puzzle,.app .kgc-arcade {
    grid-template-columns:calc(148 * var(--rpx)) minmax(0,1fr); gap:calc(16 * var(--rpx));
  }
  .app .kgc-game-art,.app .kgc-puzzle-art,.app .kgc-arcade-art { width:calc(148 * var(--rpx)); height:calc(120 * var(--rpx)); }
  .app .kgc-game:not(:last-child)::after { left:calc(186 * var(--rpx)); }
}

/* Strike keeps one clear rule: portrait is a native transition screen; battle is
   a full landscape surface with thumb-sized controls. */
.game-room .rotate-gate {
  padding:max(calc(44 * var(--game-rpx)),env(safe-area-inset-top)) max(calc(32 * var(--game-rpx)),env(safe-area-inset-right)) max(calc(44 * var(--game-rpx)),env(safe-area-inset-bottom)) max(calc(32 * var(--game-rpx)),env(safe-area-inset-left));
}
.game-room .rotate-gate h1 { font-size:var(--game-display-size); }
.game-room .rotate-gate p { font-size:var(--game-body-size); line-height:1.5; }
.game-room .rotate-gate .primary,.game-room .rotate-gate .quiet {
  width:min(100%,calc(620 * var(--game-rpx))); min-height:calc(88 * var(--game-rpx));
  font-size:var(--game-body-size); border-radius:var(--game-control-radius);
}
.game-room .rotate-phone { width:calc(160 * var(--game-rpx)); height:calc(98 * var(--game-rpx)); border-radius:calc(22 * var(--game-rpx)); }

@media(orientation:landscape) {
  .game-room .game,.game-room .arena { width:100vw; height:100dvh; min-height:0; }
  .game-room .stage { max-width:none; max-height:none; }
  .game-room header.game-nav {
    min-height:calc(88 * var(--game-rpx) + env(safe-area-inset-top));
    height:calc(88 * var(--game-rpx) + env(safe-area-inset-top));
    padding-left:max(calc(24 * var(--game-rpx)),env(safe-area-inset-left));
    padding-right:max(calc(24 * var(--game-rpx)),env(safe-area-inset-right));
  }
  .game-room header.game-nav .nav-back,.game-room header.game-nav .nav-title { font-size:var(--game-body-size); }
  .game-room header.game-nav .nav-actions button { min-width:calc(80 * var(--game-rpx)); min-height:calc(80 * var(--game-rpx)); font-size:calc(34 * var(--game-rpx)); }
  .game-room .weapon-controls {
    top:calc(100 * var(--game-rpx) + env(safe-area-inset-top));
    width:min(62vw,calc(1040 * var(--game-rpx))); gap:calc(10 * var(--game-rpx));
  }
  .game-room .weapon-controls button { min-height:calc(82 * var(--game-rpx)); padding:calc(12 * var(--game-rpx)); font-size:var(--game-body-size); }
  .game-room .touch-controls {
    left:max(calc(24 * var(--game-rpx)),env(safe-area-inset-left));
    right:max(calc(24 * var(--game-rpx)),env(safe-area-inset-right));
    bottom:max(calc(22 * var(--game-rpx)),env(safe-area-inset-bottom)); min-height:0;
  }
  .game-room .move-controls button { width:calc(122 * var(--game-rpx)); height:calc(122 * var(--game-rpx)); font-size:calc(44 * var(--game-rpx)); }
  .game-room .action-controls { width:calc(330 * var(--game-rpx)); height:calc(250 * var(--game-rpx)); flex-basis:calc(330 * var(--game-rpx)); }
  .game-room .action-controls .fire { width:calc(150 * var(--game-rpx)); height:calc(150 * var(--game-rpx)); font-size:calc(58 * var(--game-rpx)); }
  .game-room .action-controls .jump { left:calc(10 * var(--game-rpx)); bottom:calc(70 * var(--game-rpx)); width:calc(122 * var(--game-rpx)); height:calc(122 * var(--game-rpx)); font-size:calc(48 * var(--game-rpx)); }
  .game-room .action-controls .grenade { right:calc(12 * var(--game-rpx)); top:0; width:calc(94 * var(--game-rpx)); height:calc(94 * var(--game-rpx)); font-size:calc(36 * var(--game-rpx)); }
  .game-room .action-controls small { font-size:calc(22 * var(--game-rpx)); }
  .game-room .hud { top:calc(172 * var(--game-rpx)); }
  .game-room .hud-label,.game-room .hud-small,.game-room .mission-block { font-size:calc(21 * var(--game-rpx)); }
  .game-room #health { font-size:calc(28 * var(--game-rpx)); }
  .game-room #score { font-size:calc(36 * var(--game-rpx)); }
  .game-room .boss-meter { top:calc(245 * var(--game-rpx)); font-size:calc(21 * var(--game-rpx)); }
  .game-room .notice { font-size:calc(24 * var(--game-rpx)); }
}

/* V62.11.2: visual affordance only. Keep V62.10 phone geometry untouched. */
.game-room .quiet {
  color:var(--game-accent); background:var(--game-fill);
  border:1px solid var(--game-line);
}
.game-room .game-nav .nav-back { padding-inline:calc(18 * var(--game-rpx)); border-radius:999px; }
.game-room .game-nav .nav-actions button { border-radius:50%; }
.app .kgc-card-area .h-ai-name,
.app .kgc-card-area .gd-ai-name,
.app .kgc-card-area .h-ai-act,
.app .kgc-card-area .gd-ai-act,
.app .kgc-card-area .gd-ai-cnt,
.app .kgc-card-area .gd-ai-mate,
.app .kgc-card-area .gd-ai-place,
.app .kgc-card-area .gd-level-chip,
.app .kgc-card-area .gd-hand-me { font-size:calc(22 * var(--game-rpx)); }
.app .kgc-card-area .hs-brief-link,
.app .kgc-card-area .gd-brief-link {
  padding-inline:calc(20 * var(--rpx)); white-space:nowrap;
  color:var(--game-accent); background:var(--game-selection);
  border:1px solid var(--game-line); border-radius:999px;
}
.app .kgc-card-area .gd-session-end {
  min-height:calc(84 * var(--rpx)); padding-inline:calc(20 * var(--rpx));
  color:var(--game-danger); background:color-mix(in srgb,var(--game-danger) 10%,var(--game-surface));
  border:1px solid color-mix(in srgb,var(--game-danger) 35%,var(--game-line));
  border-radius:var(--r-md);
}

/* Text actions share the app specification; gameplay hit areas and icon controls retain their geometry. */
.app .kgc-card-area :is(.hs-btn,.gd-btn,.h-raise-ok,.h-btn,.gd-act-btn,.h-result-btn,.gd-result-btn,.h-quick-btn) { border-radius:var(--game-control-radius); font-size:var(--game-action-size); font-weight:600; letter-spacing:0; }
.app .kgc-card-area .gd-btn-t { font-size:var(--game-action-size); font-weight:600; }
.game-room #start,.game-room #restart { border-radius:var(--game-control-radius); font-size:var(--game-action-size); }
