.mesa-felt{background:radial-gradient(at 50% 40%,#1e293b 0%,#0f172a 50%,#020617 100%)}.mesa-arena{width:100%;max-width:1200px;height:100dvh;margin:0 auto;padding:.5rem;display:flex}.mesa-board{flex:1;min-width:0}.mesa-stage{width:100%;height:100dvh;position:relative;overflow:hidden}.mesa-canvas{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;position:absolute}.mesa-hud{transform-origin:0 0;pointer-events:none;width:960px;height:540px;position:absolute}.mesa-hud :is(button,aside,.mesa-hold){pointer-events:auto}.mesa-rotate{display:none}@media (orientation:portrait) and (width<=640px){.mesa-rotate{z-index:50;color:#e2e8f0;background:radial-gradient(at 50% 40%,#1e293b 0%,#0f172a 50%,#020617 100%);flex-direction:column;justify-content:center;align-items:center;gap:.5rem;display:flex;position:fixed;inset:0}.mesa-board,.mesa-stage{display:none}}.mesa-felt{--card-w:5rem;--card-h:7rem;--card-text:9.5px}@media (width>=640px) and (height>=760px){.mesa-felt{--card-w:6rem;--card-h:9rem;--card-text:10.5px}}.mesa-art{flex:1;place-items:center;min-height:1.5rem;display:grid;overflow:hidden;container-type:size}.mesa-art>span{font-size:min(80cqh,60cqw);line-height:1}.mesa-zoom{zoom:2}.mesa-hold{user-select:none;-webkit-touch-callout:none}@keyframes mesa-in{0%{opacity:0;scale:.9}}.mesa-in{animation:.2s ease-out backwards mesa-in}@keyframes mesa-land{0%{opacity:0;scale:1.25}}.mesa-land{animation:.22s ease-out backwards mesa-land}@keyframes mesa-draw{0%{opacity:0;translate:0 1.5rem}}.mesa-draw{animation:.3s ease-out backwards mesa-draw}@keyframes mesa-out{to{opacity:0;filter:grayscale();scale:.8}}.mesa-out{pointer-events:none;animation:.4s ease-in forwards mesa-out}@keyframes mesa-cast{0%,70%{opacity:1}to{opacity:0;translate:0 -1rem}}.mesa-cast{animation:1.1s ease-in forwards mesa-cast}@keyframes mesa-float{0%{opacity:0}8%{opacity:1;translate:0}to{opacity:0;translate:0 -1.75rem}}.mesa-float{pointer-events:none;animation:1.2s ease-out both mesa-float}.mesa-hand{justify-content:center;padding:.625rem 0 .25rem;display:flex}.mesa-hand>*{margin-left:-.5rem;transition:transform .15s ease-out}.mesa-hand>:first-child{margin-left:0}@media (width>=640px){.mesa-hand>*{margin-left:-.375rem}}.mesa-hand>:hover{z-index:10;transform:translateY(-.75rem)scale(1.08)}.mesa-energy{align-items:center;gap:3px;display:flex}.mesa-gem{background:#0f172a99;border:2px solid #60a5fa80;border-radius:50%;flex:none;width:13px;height:13px;transition:background .15s}.mesa-gem[data-on]{background:linear-gradient(135deg,#60a5fa,#3b82f6);box-shadow:0 0 4px #60a5fa80}.mesa-gem[data-locked]{opacity:.7;background:0 0;border-color:#60a5fa33}.mesa-spell-gem{background:#0f172a99;border:2px solid #c084fcb3;border-radius:50%;flex:none;width:11px;height:11px}.mesa-spell-gem[data-on]{background:linear-gradient(135deg,#c084fc,#a855f7);box-shadow:0 0 4px #c084fc80}.mesa-turn-track{background:#ffffff0f;border:1px solid #ffffff14;border-radius:9999px;flex-direction:column;justify-content:space-between;align-items:center;width:2.25rem;padding:.25rem 0;display:flex;position:relative;overflow:hidden}.mesa-turn-thumb{z-index:0;background:linear-gradient(135deg,#fbbf24,#f59e0b);border-radius:9999px;height:calc(50% - 2px);transition:top .35s cubic-bezier(.4,0,.2,1);position:absolute;left:3px;right:3px;box-shadow:0 0 10px #fbbf2459}.mesa-turn-thumb[data-pos=top]{top:2px}.mesa-turn-thumb[data-pos=bottom]{top:50%}.mesa-turn-label{z-index:1;flex:1;place-items:center;width:100%;font-size:1.125rem;line-height:1;transition:opacity .25s;display:grid;position:relative}.mesa-turn-label[data-active]{filter:drop-shadow(0 0 3px #00000080)}@property --mesa-spin{syntax:"<angle>";inherits:false;initial-value:0deg}@keyframes mesa-spin{to{--mesa-spin:360deg}}.mesa-priority{box-shadow:0 0 14px #fbbf244d}.mesa-priority:before{content:"";background:conic-gradient(from var(--mesa-spin), #fbbf2440 0 50%, #f59e0b 70%, #fef3c7 80%, #f59e0b 90%, #fbbf2440);mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);-webkit-mask:linear-gradient(#000 0 0) content-box xor, linear-gradient(#000 0 0);pointer-events:none;border-radius:calc(.75rem + 2px);padding:2px;animation:2.4s linear infinite mesa-spin;position:absolute;inset:-2px}@media (prefers-reduced-motion:reduce){.mesa-priority:before{animation:none}}
