/* v1.9.7 — coloured used cards, unified centre action popups, readable stats. */

/* Opponents no longer show miniature used-card strips. The structured action
   popup tells the table what was played without crowding each seat. */
.opponent-used-row{display:none!important}

/* Used cards stay fully identifiable: retain the spice colours and only dim
   the card as a whole. */
.played-hand-card{
  opacity:.78!important;
  filter:brightness(.58) saturate(.76) contrast(.96)!important;
  border-style:solid!important;
  border-color:rgba(117,91,64,.78)!important;
  box-shadow:inset 0 0 0 1px rgba(15,12,9,.42),0 3px 9px rgba(0,0,0,.52)!important;
}
.played-hand-card .cube,
.played-hand-card .color-square,
.played-hand-card .caravan-cube{
  filter:brightness(1.42) saturate(1.32)!important;
  opacity:1!important;
}
.played-hand-card .trade-arrow,
.played-hand-card .upgrade-icon,
.played-hand-card strong{filter:brightness(1.28)!important}
.played-hand-card:hover{filter:brightness(.58) saturate(.76) contrast(.96)!important}
@keyframes usedCardArrive{from{opacity:0;transform:translateX(-14px) scale(.86)}to{opacity:.78;transform:translateX(0) scale(.96)}}

/* A presentation is a real table phase. The full-screen layer blocks another
   action until the current action and next-player notice have finished. */
body.turn-transition-active .game-card,
body.turn-transition-active .rest-action-card,
body.turn-transition-active [data-point-index],
body.turn-transition-active [data-market-index],
body.turn-transition-active [data-hand-card]{pointer-events:none!important}

.ai-action-replay.table-action-broadcast.unified-action-popup{
  position:fixed!important;
  inset:0!important;
  z-index:2100!important;
  width:auto!important;
  height:auto!important;
  max-height:none!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  transform:none!important;
  overflow:visible!important;
  pointer-events:auto!important;
  animation:none!important;
  backdrop-filter:none!important;
}
.table-action-scrim{
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 50% 45%,rgba(82,57,30,.18),transparent 42%),rgba(4,4,3,.66);
  backdrop-filter:blur(2px);
  animation:v197ScrimIn .22s ease both;
}
.table-action-stage{
  position:absolute;
  left:50%;
  top:50%;
  width:min(620px,calc(100vw - 280px));
  min-height:270px;
  padding:24px 28px 22px;
  border:1px solid rgba(224,176,94,.92);
  border-radius:22px;
  background:
    radial-gradient(circle at 50% 0,rgba(156,104,42,.30),transparent 43%),
    linear-gradient(145deg,rgba(40,29,21,.99),rgba(10,9,8,.99));
  box-shadow:0 35px 100px rgba(0,0,0,.9),0 0 55px rgba(220,166,75,.24),inset 0 1px rgba(255,255,255,.08);
  transform:translate(-50%,-50%);
  overflow:hidden;
  animation:v197StageIn .30s cubic-bezier(.2,.86,.2,1) both;
}
.table-action-stage::after{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(223,181,111,.16);
  border-radius:16px;
  pointer-events:none;
}
.broadcast-action-type{
  position:relative;
  z-index:2;
  width:max-content;
  margin:0 auto 14px;
  padding:5px 15px;
  border:1px solid rgba(231,189,111,.62);
  border-radius:999px;
  background:rgba(105,69,30,.42);
  color:#f4d79a;
  font-size:12px;
  font-weight:900;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.unified-action-main{
  position:relative;
  z-index:2;
  display:grid!important;
  grid-template-columns:150px minmax(0,1fr)!important;
  align-items:center;
  justify-content:center;
  gap:28px!important;
}
.unified-action-visual{display:grid;place-items:center;min-width:0}
.unified-action-copy{min-width:0;text-align:left}
.unified-action-copy>small{
  display:block;
  margin-bottom:7px;
  color:#c6a36d;
  font-size:10px;
  font-weight:800;
  letter-spacing:.11em;
  text-transform:uppercase;
}
.unified-action-copy h4{
  margin:0 0 15px!important;
  color:#f4deb0!important;
  font:800 clamp(21px,2vw,29px)/1.2 Georgia,"Noto Serif SC",serif!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
}
.unified-action-popup .ai-replay-card{
  display:grid!important;
  width:132px!important;
  height:198px!important;
  min-height:198px!important;
  padding:8px!important;
  border-radius:12px!important;
  box-shadow:0 20px 35px rgba(0,0,0,.68),0 0 24px rgba(228,181,91,.24)!important;
}
.unified-action-popup .broadcast-merchant-card{
  grid-template-rows:auto minmax(0,1fr)!important;
  color:#241a13!important;
  border:1px solid #7e674e!important;
  background:linear-gradient(165deg,#d7c5a5,#ad9068 66%,#765d43)!important;
}
.unified-action-popup .broadcast-merchant-card .card-type{
  display:block!important;
  padding-top:4px;
  color:#634a35;
  font-size:8px;
  font-weight:900;
  letter-spacing:.08em;
  text-align:center;
  text-transform:uppercase;
}
.unified-action-popup .broadcast-merchant-card .effect{
  min-height:0!important;
  height:100%!important;
  margin:0!important;
  padding:12px 7px!important;
}
.unified-action-popup .broadcast-merchant-card .cube{
  width:20px!important;
  height:20px!important;
  border-radius:4px!important;
}
.unified-action-popup .broadcast-merchant-card .cube-group{gap:4px!important;max-width:112px!important}
.unified-action-popup .broadcast-merchant-card .trade-arrow{font-size:24px!important;line-height:1!important}
.unified-action-popup .broadcast-merchant-card .upgrade-icon{font-size:44px!important}
.unified-action-popup .broadcast-merchant-card strong{font-size:17px!important}
.unified-action-popup .broadcast-point-card{
  grid-template-rows:62% 38%!important;
  background:linear-gradient(165deg,#e2d5bd,#b99e79 68%,#80664c)!important;
}
.unified-action-popup .broadcast-point-card .point-cost-top{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  padding:10px 5px!important;
  background:linear-gradient(180deg,#f0e7d7,#d2c0a3)!important;
}
.unified-action-popup .broadcast-point-card .point-cost-row{display:flex!important;gap:7px!important}
.unified-action-popup .broadcast-point-card .point-cost-cube{width:23px!important;height:23px!important;border-radius:5px!important}
.unified-action-popup .broadcast-point-card .broadcast-point-score{display:flex!important;align-items:center!important;justify-content:center!important;gap:6px!important}
.unified-action-popup .broadcast-point-card .point-value{font-size:49px!important;color:#3b2619!important}
.unified-action-popup .broadcast-point-card .point-unit{font-size:11px!important;color:#604934!important}
.unified-action-popup .ai-change{margin-top:2px}
.unified-action-popup .ai-change>small{display:block!important;margin-bottom:7px;color:#a98e67;font-size:9px}
.unified-action-popup .ai-change-row{justify-content:flex-start!important;gap:12px!important}
.unified-action-popup .color-summary{justify-content:flex-start;gap:5px}
.unified-action-popup .color-count{min-width:38px;padding:5px 7px}
.unified-action-popup .color-square{width:17px;height:17px}
.unified-action-popup .color-count b{font-size:13px}
.unified-action-popup .change-arrow{font-size:22px;color:#e2b968}
.unified-action-popup .subtle{font-size:12px;color:#baa88e}
.unified-action-popup .broadcast-reward{margin-top:12px;justify-content:flex-start}
.unified-action-popup .broadcast-reward small{font-size:10px}
.unified-action-popup .broadcast-reward .coin{width:29px;height:29px;font-size:10px}

/* Rest receives a full visual rather than a generic icon. */
.rest-replay-visual{
  position:relative;
  width:142px;
  height:176px;
  display:grid;
  place-items:center;
}
.rest-card-stack{position:relative;width:88px;height:132px;transform:rotate(-5deg)}
.rest-card-stack i{
  position:absolute;
  inset:0;
  border:2px solid #a8804b;
  border-radius:10px;
  background:radial-gradient(circle at 50% 43%,#c8923d 0 5%,transparent 6%),linear-gradient(145deg,#4d2e4f,#291a37);
  box-shadow:0 12px 25px rgba(0,0,0,.55),inset 0 0 0 4px rgba(231,195,123,.1);
}
.rest-card-stack i:nth-child(1){transform:translate(-13px,9px) rotate(-8deg);opacity:.58}
.rest-card-stack i:nth-child(2){transform:translate(12px,7px) rotate(8deg);opacity:.76}
.rest-card-stack i:nth-child(3){transform:none}
.rest-replay-arrow{
  position:absolute;
  right:-2px;
  bottom:5px;
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  border:1px solid #e0b665;
  border-radius:50%;
  color:#f2ce83;
  background:#18120de8;
  font-size:38px;
  box-shadow:0 0 24px rgba(226,175,77,.32);
  animation:v197RestTurn 1.5s ease-in-out infinite;
}
.rest-replay-visual>b{position:absolute;right:16px;bottom:21px;color:#fff2c8;font-size:11px;z-index:2}
.action-rest-copy{padding:9px 12px;border:1px solid rgba(185,143,75,.36);border-radius:9px;background:rgba(28,22,17,.7);color:#cbb895;font-size:12px}
.discard-replay-visual{width:130px;height:160px;display:grid;place-items:center;color:#e5bd72}
.discard-replay-visual span{font-size:82px;line-height:1}
.discard-replay-visual i{font-style:normal;font-size:31px;animation:v197DiscardDrop 1.15s ease-in-out infinite}

.unified-action-popup.leaving .table-action-scrim{animation:v197ScrimOut .45s ease forwards}
.unified-action-popup.leaving .table-action-stage{animation:v197StageOut .48s ease forwards}
.broadcast-source-flying{opacity:.18!important}

/* The next-turn notice is a separate blocking phase after the action popup. */
.turn-announcement{
  position:fixed!important;
  inset:0!important;
  z-index:2090!important;
  width:auto!important;
  padding:0!important;
  display:block!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  transform:none!important;
  pointer-events:auto!important;
  animation:none!important;
  backdrop-filter:none!important;
}
.turn-announcement-scrim{position:absolute;inset:0;background:rgba(4,4,3,.52);backdrop-filter:blur(1px);animation:v197ScrimIn .2s ease both}
.turn-announcement-card{
  position:absolute;
  left:50%;top:50%;
  width:min(430px,calc(100vw - 290px));
  padding:20px 26px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:7px;
  border:1px solid rgba(218,169,86,.84);
  border-radius:18px;
  background:radial-gradient(circle at 50% 0,rgba(156,104,42,.38),transparent 55%),rgba(13,11,9,.98);
  box-shadow:0 25px 80px rgba(0,0,0,.84),0 0 32px rgba(223,173,82,.24);
  transform:translate(-50%,-50%);
  text-align:center;
  animation:v197TurnIn .27s cubic-bezier(.2,.86,.2,1) both;
}
.turn-announcement-card small{color:#bd995e;font-size:9px;font-weight:900;letter-spacing:.18em;text-transform:uppercase}
.turn-announcement-card strong{color:#f3d798;font:800 clamp(23px,2.4vw,32px)/1.1 Georgia,"Noto Serif SC",serif}
.turn-announcement-card span{color:#c0ae90;font-size:12px}
.turn-announcement-card em{color:#806b4d;font-size:8px;font-style:normal;letter-spacing:.08em}
.turn-announcement.mine .turn-announcement-card{border-color:#f0bf59;box-shadow:0 25px 80px rgba(0,0,0,.84),0 0 42px rgba(240,181,68,.33)}
.turn-announcement.leaving .turn-announcement-scrim{animation:v197ScrimOut .4s ease forwards}
.turn-announcement.leaving .turn-announcement-card{animation:v197TurnOut .42s ease forwards}

/* Use the available table area: slightly larger cards, lane headings and
   opponent counts on desktop/tablet landscape. */
@media (orientation:landscape) and (min-height:561px){
  :root{--v160-card-w:clamp(72px,8.05vw,118px)!important}
  .landscape-board{grid-template-columns:clamp(125px,12.5vw,185px) minmax(0,1fr) clamp(125px,12.5vw,185px)!important}
  .official-card-track{gap:clamp(6px,.72vw,11px)!important}
  .official-lane-head{height:18px!important}
  .official-lane-head h3{font-size:clamp(12px,1vw,15px)!important;letter-spacing:.01em}
  .official-lane-head span{font-size:9px!important}
  .table-opponents .player-name,.landscape-right-rail .player-name{font-size:clamp(11px,.95vw,14px)!important}
  .table-opponents .seat-type,.landscape-right-rail .seat-type{font-size:8px!important}
  .table-opponents .opponent-seat,.landscape-right-rail .opponent-seat{padding:8px!important}
  .table-opponents .seat-avatar,.landscape-right-rail .seat-avatar{height:31px!important;min-height:31px!important;font-size:13px!important}
  .table-opponents .mini-caravan-grid,.landscape-right-rail .mini-caravan-grid{min-height:39px!important}
  .opponent-seat .seat-footer{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 43px!important;gap:5px!important}
  .opponent-seat .mini-stat{height:29px!important;padding:2px 5px!important;display:grid!important;grid-template-columns:auto 1fr!important;align-items:center!important;gap:4px!important}
  .opponent-seat .mini-stat b{font-size:17px!important;line-height:1!important;color:#f3d695!important}
  .opponent-seat .mini-stat small{display:block!important;color:#a99474!important;font-size:7px!important;line-height:1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .opponent-seat .coin-stack{width:43px!important;min-width:43px!important;grid-template-columns:repeat(2,20px)!important;gap:3px!important}
  .opponent-seat .seat-footer .coin{width:20px!important;height:20px!important;min-width:20px!important;font-size:8px!important}
}

@media (orientation:landscape) and (max-height:560px){
  .table-action-stage{width:min(500px,calc(100vw - 190px));min-height:205px;padding:14px 18px 13px;border-radius:15px}
  .broadcast-action-type{margin-bottom:8px;padding:3px 11px;font-size:8px}
  .unified-action-main{grid-template-columns:102px minmax(0,1fr)!important;gap:16px!important}
  .unified-action-popup .ai-replay-card{width:88px!important;height:132px!important;min-height:132px!important;padding:5px!important}
  .unified-action-popup .broadcast-merchant-card .effect{padding:7px 4px!important}
  .unified-action-popup .broadcast-merchant-card .cube{width:13px!important;height:13px!important}
  .unified-action-popup .broadcast-merchant-card .cube-group{gap:2px!important;max-width:78px!important}
  .unified-action-popup .broadcast-merchant-card .trade-arrow{font-size:16px!important}
  .unified-action-popup .broadcast-merchant-card .upgrade-icon{font-size:29px!important}
  .unified-action-popup .broadcast-merchant-card strong{font-size:11px!important}
  .unified-action-popup .broadcast-point-card .point-cost-cube{width:15px!important;height:15px!important}
  .unified-action-popup .broadcast-point-card .point-value{font-size:33px!important}
  .unified-action-copy>small{font-size:7px;margin-bottom:3px}
  .unified-action-copy h4{font-size:17px!important;margin-bottom:8px!important}
  .unified-action-popup .ai-change>small{font-size:6px;margin-bottom:3px}
  .unified-action-popup .color-count{min-width:27px;padding:3px 4px}
  .unified-action-popup .color-square{width:11px;height:11px}
  .unified-action-popup .color-count b{font-size:9px}
  .unified-action-popup .change-arrow{font-size:15px}
  .unified-action-popup .subtle,.action-rest-copy{font-size:8px}
  .rest-replay-visual{width:96px;height:136px}.rest-card-stack{width:61px;height:92px}.rest-replay-arrow{width:40px;height:40px;font-size:27px}.rest-replay-visual>b{right:11px;bottom:14px;font-size:8px}
  .turn-announcement-card{width:min(360px,calc(100vw - 190px));padding:12px 18px;border-radius:13px}
  .turn-announcement-card strong{font-size:20px}.turn-announcement-card span{font-size:9px}.turn-announcement-card em{font-size:6px}
  .played-hand-card{opacity:.8!important;filter:brightness(.59) saturate(.78)!important}
}

@media (prefers-reduced-motion:reduce){
  .table-action-scrim,.table-action-stage,.turn-announcement-scrim,.turn-announcement-card,.rest-replay-arrow,.discard-replay-visual i{animation:none!important}
}

@keyframes v197ScrimIn{from{opacity:0}to{opacity:1}}
@keyframes v197ScrimOut{to{opacity:0}}
@keyframes v197StageIn{from{opacity:0;transform:translate(-50%,-45%) scale(.91)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes v197StageOut{to{opacity:0;transform:translate(-50%,-55%) scale(.95)}}
@keyframes v197TurnIn{from{opacity:0;transform:translate(-50%,-45%) scale(.9)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes v197TurnOut{to{opacity:0;transform:translate(-50%,-56%) scale(.95)}}
@keyframes v197RestTurn{0%,100%{transform:rotate(-12deg) scale(.94)}50%{transform:rotate(18deg) scale(1.04)}}
@keyframes v197DiscardDrop{0%,100%{transform:translateY(-5px);opacity:.55}50%{transform:translateY(8px);opacity:1}}
/* Neutralise legacy H/P pseudo-labels now that the full labels fit. */
.opponent-seat .mini-stat small::before{content:none!important;display:none!important}
.unified-action-popup .ai-change{display:block!important}
.broadcast-flying-card.broadcast-merchant-card{
  color:#241a13!important;
  border:1px solid #7e674e!important;
  background:linear-gradient(165deg,#d7c5a5,#ad9068 66%,#765d43)!important;
  border-radius:12px!important;
}
.broadcast-flying-card.broadcast-merchant-card .card-type{display:none!important}
.broadcast-flying-card.broadcast-merchant-card .effect{height:100%!important;min-height:0!important;margin:0!important}
@media (orientation:landscape) and (max-height:560px){
  .opponent-seat .seat-footer{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 33px!important;gap:2px!important}
  .opponent-seat .mini-stat{height:21px!important;padding:1px 3px!important;display:grid!important;grid-template-columns:auto 1fr!important;align-items:center!important;gap:2px!important}
  .opponent-seat .mini-stat b{font-size:11px!important;line-height:1!important;color:#f3d695!important}
  .opponent-seat .mini-stat small{display:block!important;font-size:5px!important;line-height:1!important;color:#a99474!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
}
