/* Seats are positioned around the felt, relative to the current player. */
.arena{display:grid;grid-template-columns:105px minmax(0,1fr) 105px;grid-template-rows:auto auto auto auto;column-gap:10px;align-items:center}.arena .seats{display:contents}.arena .seat{position:relative;transform:none;margin:0;min-height:114px;justify-content:center;align-self:center;min-width:0}.arena .seat-r2{grid-area:1/2;justify-self:center;width:130px;margin-bottom:14px}.arena .seat-r1{grid-area:2/3}.arena .seat-r3{grid-area:2/1}.arena .felt{grid-area:2/2;width:100%;min-width:0;min-height:490px;margin:0;border-radius:85px;border-width:7px}.arena .your-side{grid-area:3/1/4/4;margin-top:18px}.arena .actions{grid-area:4/1/5/4}.arena:not(.four-players){grid-template-columns:minmax(0,1fr)}.arena:not(.four-players) .seat-r1{grid-area:1/1;justify-self:center;width:130px;margin-bottom:14px}.arena:not(.four-players) .felt{grid-area:2/1}.arena:not(.four-players) .your-side{grid-area:3/1}.arena:not(.four-players) .actions{grid-area:4/1}.arena .felt-brand{font-size:10px;letter-spacing:3px;top:22px;width:100%;pointer-events:none}.arena .felt-brand span{font-size:6px;letter-spacing:1.5px}.arena .vira{top:50px;left:auto;right:14px;z-index:1}.arena .vira>span{font-size:7px}.arena .vira .card{width:36px;height:50px;border-radius:4px}.arena #status{left:12px;right:12px;bottom:16px;font-size:11px}.arena .played{top:64px;bottom:45px;left:6px;right:6px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:0;align-items:center;justify-items:center}.arena .played-slot{width:100%;max-width:112px;transform:none;animation:none}.arena .relative-0{grid-area:3/2}.arena .relative-1{grid-area:2/3}.arena .relative-2{grid-area:1/2}.arena .relative-3{grid-area:2/1}.arena:not(.four-players) .relative-1{grid-area:1/2}.played-fan{display:flex;position:relative;justify-content:center;align-items:center;padding:0 4px 0 16px;min-height:96px}.laid-card{position:relative;flex:0 0 auto;margin-left:-16px;transform:rotate(calc((var(--card-index) - (var(--card-count) - 1)/2)*7deg));transition:transform .15s;z-index:calc(1 + var(--card-index))}.arena .played .card{width:57px;height:80px;border-radius:5px}.arena .played-slot small{margin:0 auto;font-size:8px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.trick-number{position:absolute;right:1px;bottom:-6px;font-size:8px;line-height:15px;width:15px;height:15px;border-radius:50%;background:#102b22;border:1px solid #d5bb7c;color:#f2dda6;z-index:2}.laid-card:hover{z-index:10;transform:translateY(-7px) rotate(0)}.spanish-card{padding:0!important;overflow:hidden;border:0;background:#fff8e6}.spanish-card .card-art{display:block;width:100%;height:100%;object-fit:fill;pointer-events:none;border-radius:inherit}.spanish-card .piece{position:absolute;bottom:3px;font-size:7px;letter-spacing:.2px;left:50%;transform:translateX(-50%);white-space:nowrap;padding:2px 4px;z-index:2}.hand .spanish-card{width:91px;height:127px}.mini-cards>div{padding:0;overflow:hidden;background:transparent}.mini-cards img{width:100%;height:100%;object-fit:fill;display:block}.response-clock{display:flex;align-items:center;position:relative;max-width:100%;padding:11px 16px 15px;margin-bottom:22px;border:1px solid #eac57840;border-radius:10px;background:#eac57808;gap:16px}.response-clock>div:first-child{flex:1;min-width:0}.response-clock span{display:block;font-size:12px;color:#f0e9d2}.response-clock small{text-align:left;margin:4px 0 0;font-size:9px;color:#a3b49f}.response-clock strong{font:700 28px 'DM Sans',sans-serif;font-variant-numeric:tabular-nums;color:var(--gold);min-width:54px;text-align:right}.clock-track{position:absolute;bottom:0;left:0;right:0;height:3px;overflow:hidden;border-radius:0 0 10px 10px}.clock-track i{display:block;height:100%;background:var(--gold);transition:width .1s linear}.response-clock.urgent{border-color:#e38d66;background:#a74d2a22}.response-clock.urgent strong{color:#ffb28c}.response-clock.urgent .clock-track i{background:#ffb28c}.deal-label{bottom:42px;font-size:8px;letter-spacing:1.5px}.callout{font-size:18px;max-width:98%;padding:12px 15px;top:46%}.arena .flying-card{padding:0}.flying-card.spanish-card{width:57px!important;height:80px!important}.arena:not(.four-players) .played-fan{min-height:110px}.arena:not(.four-players) .played .card{width:68px;height:95px}@media(max-width:1100px) and (min-width:851px){.arena{grid-template-columns:77px minmax(0,1fr) 77px;column-gap:5px}.arena .seat strong{font-size:10px}.arena .felt{border-width:5px;border-radius:55px}.arena .played .card{width:43px;height:61px}.played-fan{min-height:80px;padding-left:20px}.laid-card{margin-left:-20px}.arena .played-slot small{font-size:7px}.arena .felt-brand{font-size:8px}.arena .vira{right:8px}.arena .vira .card{width:30px;height:42px}.callout{font-size:14px}}@media(max-width:620px){.arena{grid-template-columns:57px minmax(0,1fr) 57px;column-gap:4px}.arena .seat{min-height:103px;border-radius:10px;padding:9px 3px}.arena .seat-r2{width:112px;min-height:98px;margin-bottom:12px}.arena .seat strong{font-size:9px}.arena .seat small{font-size:8px}.arena .seat .avatar{padding:5px 8px;font-size:11px}.arena .backs i{width:14px;height:20px}.arena .felt{min-height:410px;border-width:4px;border-radius:48px}.arena .felt-brand{font-size:7px;letter-spacing:1.8px;top:21px}.arena .felt-brand span{font-size:5px;letter-spacing:.8px}.arena .played{top:66px;bottom:42px;left:1px;right:1px}.arena .played .card{width:41px;height:57px;border-radius:3px}.played-fan{min-height:78px;padding-left:22px;padding-right:1px}.laid-card{margin-left:-22px}.arena .played-slot{max-width:88px}.arena .played-slot small{font-size:6px}.trick-number{font-size:7px;height:12px;width:12px;line-height:11px;bottom:-4px}.arena .vira{top:44px;right:7px}.arena .vira .card{width:25px;height:35px;border-radius:3px}.arena .vira>span{font-size:5px;letter-spacing:1px}.arena #status{font-size:9px;bottom:12px;left:7px;right:7px}.arena .your-side{margin-top:16px}.hand .spanish-card{width:81px;height:113px}.arena:not(.four-players) .felt{min-height:410px}.arena:not(.four-players) .played .card{width:62px;height:86px}.arena:not(.four-players) .played-slot{max-width:130px}.arena:not(.four-players) .played-fan{min-height:100px}.response-clock{margin-bottom:15px;padding:9px 12px 12px}.response-clock span{font-size:11px}.response-clock strong{font-size:24px}.callout{font-size:13px;padding:11px 9px}.flying-card.spanish-card{width:41px!important;height:57px!important}.deal-label{bottom:37px;font-size:6px;letter-spacing:1px}}@media(max-width:360px){.arena{grid-template-columns:49px minmax(0,1fr) 49px;column-gap:3px}.arena .seat strong{font-size:8px}.arena .played .card{width:37px;height:52px}.laid-card{margin-left:-23px}.played-fan{padding-left:23px}.hand .spanish-card{width:74px;height:103px}.arena .felt-brand{font-size:6px}}@media(prefers-reduced-motion:reduce){.clock-track i,.laid-card{transition:none}}
