/* First-person demo: a perspective tabletop with upright pieces and readable UI. */
.first-person-demo.at-table .table {
  grid-template-rows:22px minmax(0,1fr) 22px auto;
  background:radial-gradient(ellipse at 50% 18%,#45544955,transparent 65%),linear-gradient(#162a2b,#102526 60%,#172d27);
  border:1px solid #6e79614d;
  box-shadow:inset 0 1px 0 #bad9ad26,0 5px 20px #07161988;
  border-radius:19px;
}
.first-person-demo.at-table .table::before{display:none}
.first-person-demo.at-table .your-hand{display:none}
.first-person-demo.at-table .table #room-panel.action-panel{grid-row:4}
.first-person-demo.at-table .table-arena{perspective:700px;overflow:visible;isolation:isolate}
.first-person-demo.at-table .table-arena::before{
  content:'';position:absolute;z-index:-1;inset:4% -7% 5%;border:9px solid #95603b;border-radius:48% 48% 39% 39%;
  transform:rotateX(38deg);transform-origin:50% 65%;
  background:radial-gradient(ellipse at 50% 26%,#489978,#227b62 45%,#145541 95%);
  box-shadow:inset 0 0 0 2px #e4b479,inset 0 0 0 5px #143b35,inset 0 10px 26px #06292366,0 9px 0 #5b3829,0 15px 0 #35261f,0 24px 22px #030e14b0;
}
.first-person-demo.at-table .table-arena::after{
  content:'';position:absolute;inset:12% 1% 15%;z-index:-1;border:1px solid #c4d1a447;border-radius:48%;transform:rotateX(38deg);pointer-events:none;
  background:repeating-linear-gradient(105deg,#ffffff02 0 1px,transparent 1px 4px);
}
.first-person-demo.at-table .table .seat{
  --seat-width:94px;--seat-height:84px;--portrait-width:38px;--portrait-size:36px;--cup-width:54px;--model-size:54px;
  width:var(--seat-width);height:var(--seat-height);grid-template-columns:var(--portrait-width) var(--cup-width);column-gap:2px;
  transform:translate(-50%,-50%);right:auto;z-index:2;
}
.first-person-demo.at-table .table .seat:nth-child(2){left:max(calc(var(--seat-width)/2),13%);top:55%}
.first-person-demo.at-table .table .seat:nth-child(3){left:14%;top:30%}
.first-person-demo.at-table .table .seat:nth-child(4){left:50%;top:20%}
.first-person-demo.at-table .table .seat:nth-child(5){left:86%;top:30%}
.first-person-demo.at-table .table .seat:nth-child(6){left:min(calc(100% - var(--seat-width)/2),87%);top:55%}
.first-person-demo.at-table .table .seat:nth-child(3),.first-person-demo.at-table .table .seat:nth-child(4),.first-person-demo.at-table .table .seat:nth-child(5){
 --seat-width:78px;--seat-height:70px;--portrait-width:32px;--portrait-size:30px;--cup-width:44px;--model-size:44px;
}
.first-person-demo.at-table .table .seat:nth-child(5),.first-person-demo.at-table .table .seat:nth-child(6){grid-template-columns:var(--cup-width) var(--portrait-width)}
.first-person-demo.at-table .table .seat.is-you{
 --seat-width:164px;--seat-height:144px;--portrait-width:42px;--portrait-size:40px;--cup-width:120px;--model-size:116px;
 left:50%;top:auto;bottom:5px;transform:translateX(-50%);z-index:4;
}
.first-person-demo.at-table .table .seat .seat-name{font-size:11px;line-height:15px;height:15px}
.first-person-demo.at-table .table .seat .seat-coins{font-size:10px;line-height:14px;min-height:16px;padding:0 1px}
.first-person-demo.at-table .table .seat.is-you .seat-name{font-size:13px;line-height:17px;height:17px}
.first-person-demo.at-table .table .seat.is-you .seat-coins{font-size:12px;line-height:16px;min-height:18px}
.first-person-demo.at-table .table .seat .cup-space{width:var(--cup-width);height:auto;gap:5px;align-self:center}
.first-person-demo.at-table .table .cup-model{position:relative;isolation:isolate;width:var(--model-size);height:var(--model-size);flex:none;transform-origin:50% 88%}
.first-person-demo.at-table .table .seat .dice-cup{position:absolute;inset:0;width:100%;height:100%;min-height:0;z-index:2;object-fit:contain;transform:none;opacity:1;transition:opacity .28s;filter:drop-shadow(0 5px 3px #041f2499)}
.first-person-demo.at-table .table .seat .table-hand{display:none}
.first-person-demo.at-table .table .seat.is-you .dice-cup{opacity:.2;filter:drop-shadow(0 4px 2px #0006)}
.first-person-demo.at-table .table .seat.is-you .table-hand,
.first-person-demo.at-table .table.is-revealed .seat .table-hand{
 display:grid;position:absolute;inset:auto 8% 12%;z-index:1;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px 2px;transform:none;align-items:center;justify-items:center;
 padding:8px 5px 6px;border-radius:40% 40% 32% 32%;background:radial-gradient(ellipse,#294d40,#102e28);box-shadow:0 4px 0 #081c1b,inset 0 1px 2px #768e6666;
}
.first-person-demo.at-table .table .seat .table-hand .die{grid-column:span 2;width:27px;height:29px;padding:5px;gap:2px;border-radius:6px;transform:rotate(-5deg);opacity:1;outline:none}
.first-person-demo.at-table .table .seat .table-hand .die:nth-child(2n){transform:rotate(6deg)}
.first-person-demo.at-table .table .seat .table-hand .die:nth-child(4){grid-column:2 / span 2}
.first-person-demo.at-table .table .seat .table-hand .die:nth-child(5){grid-column:4 / span 2}
.first-person-demo.at-table .table.is-revealed .seat:not(.is-you) .table-hand{inset:auto 3% 9%;gap:2px 1px;padding:2px}
.first-person-demo.at-table .table.is-revealed .seat:not(.is-you) .table-hand .die{width:11px;height:12px;padding:2px;gap:1px;border-radius:3px;box-shadow:0 1px 0 #7e1722}
.first-person-demo.at-table .table.is-revealed .seat .dice-cup{opacity:.16}
.first-person-demo.at-table .table.cups-shaking .seat.is-you .dice-cup{opacity:1;transition:none}
.first-person-demo.at-table .table.cups-shaking .seat .table-hand{visibility:hidden}
.first-person-demo.at-table .table .seat .seat-bid{height:21px;min-width:0;font-size:9px;gap:1px;padding:1px}
.first-person-demo.at-table .table .seat .seat-bid strong{font-size:14px}
.first-person-demo.at-table .table .seat .seat-bid .die{width:14px;height:15px;padding:2px;gap:1px}
.first-person-demo.at-table .table .seat .seat-bid-unit{display:none}
.first-person-demo.at-table .table .seat.is-you .seat-bid{width:78px;align-self:center;height:23px;font-size:11px}
.first-person-demo.at-table .table .seat.is-you .seat-bid-unit{display:inline}
.first-person-demo.at-table .table .center-stage{display:block;top:40%;width:110px;z-index:1}
.first-person-demo.at-table .table .center-stage h2{font-size:16px}
.first-person-demo.at-table .table .stage-eyebrow{display:block;font-size:10px}
.first-person-demo.at-table .table .current-bid{height:33px}
.first-person-demo.at-table .table .bid-number{font-size:30px}
.first-person-demo.at-table .table .current-bid .die{width:26px;height:28px;padding:5px}
.first-person-demo.at-table .table .seat .seat-social-bubble{top:auto;bottom:calc(100% + 2px);left:50%;right:auto;transform:translateX(-50%);max-width:90px;max-height:30px}
.first-person-demo.at-table .table #room-panel.action-panel{background:linear-gradient(#243c32,#193329);border:1px solid #e8cf992e;border-radius:12px;padding:5px 3px 3px}
@media(min-width:900px) and (min-height:520px){
 .first-person-demo.at-table .table{grid-template-columns:minmax(0,1fr) 300px;grid-template-rows:25px minmax(0,1fr) 28px}
 .first-person-demo.at-table .table #room-panel.action-panel{grid-column:2;grid-row:2/-1;padding:14px}
}
@media(min-width:900px) and (min-height:650px){
 .first-person-demo.at-table .table{grid-template-columns:minmax(0,1fr) 300px;grid-template-rows:25px minmax(0,1fr) 28px}
 .first-person-demo.at-table .table #room-panel.action-panel{grid-column:2;grid-row:2/-1;padding:14px}
 .first-person-demo.at-table .table .seat{--seat-width:144px;--seat-height:114px;--portrait-width:58px;--portrait-size:54px;--cup-width:84px;--model-size:80px}
 .first-person-demo.at-table .table .seat:nth-child(3),.first-person-demo.at-table .table .seat:nth-child(4),.first-person-demo.at-table .table .seat:nth-child(5){--seat-width:118px;--seat-height:94px;--portrait-width:50px;--portrait-size:46px;--cup-width:66px;--model-size:62px}
 .first-person-demo.at-table .table .seat.is-you{--seat-width:238px;--seat-height:192px;--portrait-width:66px;--portrait-size:62px;--cup-width:170px;--model-size:164px;bottom:10px}
 .first-person-demo.at-table .table .seat .seat-name{font-size:14px;height:19px;line-height:19px}
 .first-person-demo.at-table .table .seat .seat-coins{font-size:12px;line-height:17px;min-height:19px}
 .first-person-demo.at-table .table .seat.is-you .table-hand .die{width:35px;height:37px;padding:7px}
 .first-person-demo.at-table .table .center-stage{top:40%;width:140px}
}
@media(orientation:landscape) and (max-height:519px){
 .first-person-demo.at-table .table{grid-template-columns:minmax(0,1fr) clamp(185px,32vw,245px);grid-template-rows:20px minmax(0,1fr) 20px}
 .first-person-demo.at-table .table #room-panel.action-panel{grid-column:2;grid-row:2/-1;padding:6px}
}
@media(max-width:360px),(orientation:portrait) and (max-height:640px),(orientation:landscape) and (max-height:519px){
 .first-person-demo.at-table .table .seat{--seat-width:76px;--seat-height:70px;--portrait-width:32px;--portrait-size:29px;--cup-width:42px;--model-size:42px}
 .first-person-demo.at-table .table .seat:nth-child(3),.first-person-demo.at-table .table .seat:nth-child(4),.first-person-demo.at-table .table .seat:nth-child(5){--seat-width:68px;--seat-height:62px;--portrait-width:28px;--portrait-size:26px;--cup-width:38px;--model-size:36px}
 .first-person-demo.at-table .table-arena::before,.first-person-demo.at-table .table-arena::after{transform:rotateX(28deg)}
 .first-person-demo.at-table .table .seat:nth-child(3){left:13%;top:27%}.first-person-demo.at-table .table .seat:nth-child(4){top:22%}.first-person-demo.at-table .table .seat:nth-child(5){left:87%;top:27%}
 .first-person-demo.at-table .table .seat:nth-child(2){left:max(calc(var(--seat-width)/2),13%);top:66%}.first-person-demo.at-table .table .seat:nth-child(6){left:min(calc(100% - var(--seat-width)/2),87%);top:66%}
 .first-person-demo.at-table .table .seat.is-you{--seat-width:128px;--seat-height:122px;--portrait-width:32px;--portrait-size:30px;--cup-width:94px;--model-size:94px;bottom:0}
 .first-person-demo.at-table .table .seat .seat-name,.first-person-demo.at-table .table .seat.is-you .seat-name{font-size:10px;line-height:13px;height:13px}
 .first-person-demo.at-table .table .seat .seat-coins,.first-person-demo.at-table .table .seat.is-you .seat-coins{font-size:9px;line-height:12px;min-height:14px}
 .first-person-demo.at-table .table .seat.is-you .table-hand .die{width:21px;height:23px;padding:4px;gap:1px;border-radius:4px}
 .first-person-demo.at-table .table .seat.is-you .table-hand{gap:4px 1px;padding:5px 2px}
 .first-person-demo.at-table .table .center-stage{display:none}
 .first-person-demo.at-table .turn-last-bid{display:inline}
 .first-person-demo.at-table .table .seat .seat-social-bubble{display:none}
}
@media(max-height:560px) and (orientation:portrait){
 .first-person-demo.at-table .table{grid-template-rows:20px minmax(0,1fr) 20px auto}
 .first-person-demo.at-table .bid-wheel{height:76px;padding:16px 0}
}
@media(prefers-reduced-motion:reduce){.first-person-demo.at-table .table .seat .dice-cup{transition:none}}
/* Narrow in-app browser panels retain space between the foreground and side seats. */
@media(max-width:319px){
 .first-person-demo.at-table .table .seat:nth-child(2),.first-person-demo.at-table .table .seat:nth-child(6){--seat-width:70px;--portrait-width:28px;--portrait-size:26px;--cup-width:40px;--model-size:40px}
}