:root{
  font-family:Inter,ui-sans-serif,system-ui,sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
body{margin:0;min-height:100vh}
button,input,select{font:inherit}
button{cursor:pointer}
button:disabled{cursor:default}
#shell{max-width:1640px;margin:0 auto;padding:clamp(12px,1.7vw,26px)}
#game[hidden],#room-controls[hidden],#notice[hidden]{display:none}
.notice{position:sticky;top:54px;z-index:21;padding:11px 15px;border-radius:6px}
.ui-stack{display:flex;flex-direction:column;gap:10px}
.ui-row{display:flex;align-items:flex-start;gap:10px;flex-wrap:wrap}
.app-root{gap:12px}
.ui-badge{display:inline-flex;align-items:center;justify-content:center;border-radius:5px;font-size:12px;line-height:1.2;padding:6px 9px}
.ui-card-wrap{display:flex;flex-direction:column;align-items:center;gap:5px;min-width:0}
.playing-card{display:grid;place-items:center;position:relative;padding:0;overflow:hidden}
.playing-card::before{content:"";position:absolute;top:0;left:0;right:0}
.card-caption{line-height:1.1;text-align:center}
.ui-button,.secondary,.primary{border-radius:7px;padding:10px 14px;font-weight:750;min-height:40px}
.ui-button:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #4e8675;outline-offset:3px}
.ui-panel{padding:13px}
.panel-title{margin:0 0 10px;font-size:12px;text-transform:uppercase;letter-spacing:.12em}
.confirm-popover{position:fixed;z-index:1000;width:min(300px,calc(100vw - 20px));padding:16px;border-radius:9px;box-shadow:0 16px 50px #30231a33}
.confirm-popover[hidden]{display:none}
.confirm-eyebrow{font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.confirm-message{font-size:14px;line-height:1.45}
.confirm-actions,.dialog-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:14px}
.holding::after{content:"";position:absolute;left:0;bottom:0;height:5px;width:100%;background:#cb9562;animation:hold-progress var(--hold-ms) linear forwards}
@keyframes hold-progress{from{transform:scaleX(0);transform-origin:left}to{transform:scaleX(1);transform-origin:left}}
dialog{max-width:min(95vw,560px);border-radius:11px}
dialog::backdrop{background:#3d30277d}
@media(max-width:650px){#shell{padding:10px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
