*{box-sizing:border-box}html,body{margin:0;height:100%;background:#24170e;color:#fff;font-family:system-ui,-apple-system,sans-serif}canvas{display:block;width:100%;height:100dvh;touch-action:none}.hud,.quality-control,.cinematic-control,.hand-toolbar{background:#17100ce6;border:1px solid #b99b7144;border-radius:12px;box-shadow:0 12px 28px #0005}.hud,.quality-control{position:absolute;top:max(14px,env(safe-area-inset-top))}.hud{left:max(14px,env(safe-area-inset-left));padding:13px 16px;pointer-events:none;max-width:min(360px,65vw)}.hud strong{font-size:.86rem;letter-spacing:.09em;color:#f3cf92}.hud p{font-size:.86rem;line-height:1.45;margin:8px 0 0}.quality-control{right:max(14px,env(safe-area-inset-right));padding:9px 12px;display:flex;align-items:center;gap:9px;font-size:.82rem}.quality-control select{color:#fff;background:#3c3027;border:1px solid #957550;border-radius:7px;padding:6px;font:inherit}button{font:inherit;cursor:pointer}button:disabled{opacity:.43;cursor:not-allowed}.hand-toolbar{position:absolute;bottom:max(16px,env(safe-area-inset-bottom));left:50%;transform:translate(-50%);padding:8px 10px;display:flex;align-items:center;gap:10px}.card-options{display:flex;gap:7px}.card-option{padding:9px 13px;color:#f8ebd0;border:1px solid #997756;border-radius:7px;background:#3a3026;min-height:42px;font-weight:600}.card-option.selected{background:#255944;border-color:#dfc180;box-shadow:inset 0 0 0 1px #f6cb70}.play-action,.action{padding:11px 14px;background:#d9a35e;color:#221308;border:0;border-radius:9px;font-weight:700;white-space:nowrap}.play-action{min-height:42px}.action{position:absolute;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));box-shadow:0 7px 16px #0007}button:focus-visible,.quality-control select:focus-visible{outline:3px solid #fff;outline-offset:3px}@media(max-width:980px){.hand-toolbar{left:max(8px,env(safe-area-inset-left));transform:none}}@media(max-width:600px){.hud{left:8px;top:8px;padding:9px 10px;max-width:59vw}.hud strong{font-size:.73rem}.hud p{font-size:.72rem}.quality-control{right:8px;top:8px;font-size:.7rem;flex-direction:column;gap:3px;padding:7px}.quality-control select{font-size:.75rem}.hand-toolbar{bottom:calc(62px + env(safe-area-inset-bottom));right:8px;left:8px;justify-content:center;padding:7px;gap:7px}.card-option{min-width:37px;min-height:40px;padding:8px}.play-action{min-height:40px;padding:8px 10px;font-size:.83rem}.action{right:12px;bottom:calc(10px + env(safe-area-inset-bottom));font-size:.82rem}}.cinematic-control{position:absolute;right:max(14px,env(safe-area-inset-right));top:77px;display:flex;align-items:center;gap:8px;padding:9px 12px;font-size:.82rem;cursor:pointer}.cinematic-control input{width:17px;height:17px;accent-color:#d9a35e;cursor:pointer}@media(max-width:600px){.cinematic-control{top:86px;right:8px;padding:7px;max-width:132px;font-size:.72rem}}.overhead-panel{position:absolute;left:max(14px,env(safe-area-inset-left));top:156px;width:230px;padding:10px;border:1px solid #b99b7180;border-radius:11px;background:#19140ff0;color:#f6eddc;box-shadow:0 12px 28px #0008}.overhead-panel[hidden]{display:none}.overhead-title{text-align:center;font-size:.77rem;margin-bottom:6px}.overhead-table{position:relative;height:148px;border:5px solid #775035;border-radius:13px;background:#26573e}.overhead-slot{position:absolute;display:flex;flex-direction:column;align-items:center;gap:2px}.slot-across{top:4px;left:50%;transform:translate(-50%)}.slot-you{bottom:4px;left:50%;transform:translate(-50%)}.slot-right{right:5px;top:50%;transform:translateY(-50%)}.slot-left{left:5px;top:50%;transform:translateY(-50%)}.overhead-player{font-size:.59rem;color:#f6ddab;white-space:nowrap}.overhead-card{display:flex;justify-content:center;align-items:center;width:38px;height:31px;border-radius:5px;background:#f5efd9;color:#202932;font-weight:800;border:2px solid #cfbd99;font-size:1rem}.overhead-card.red-suit{color:#a21d2d}.overhead-card.leading{outline:3px solid #f6d163;outline-offset:1px;box-shadow:0 0 13px #f6d163a0}.overhead-card.tied{outline:2px dashed #f1b079;outline-offset:2px}.overhead-empty{font-size:1rem;opacity:.55}.overhead-result{margin:8px 0 0;font-size:.74rem;text-align:center}.overhead-toggle{position:absolute;top:126px;right:max(14px,env(safe-area-inset-right));background:#17100ceb;border-radius:8px;padding:7px;font-size:.75rem;display:flex;align-items:center;gap:6px}.overhead-toggle input{accent-color:#d9a35e}@media(max-width:600px){.overhead-panel{left:8px;top:146px;width:168px;padding:6px}.overhead-table{height:120px}.overhead-player{font-size:.51rem}.overhead-card{width:30px;height:26px;font-size:.81rem}.overhead-result{font-size:.67rem}.overhead-toggle{top:149px;right:8px;font-size:.68rem;max-width:125px}}.overhead-panel{z-index:5}.overhead-title{cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none;padding:6px 2px 9px;border-radius:7px}.overhead-title:active{cursor:grabbing}.overhead-title:focus-visible{outline:2px solid #ffe2a7;outline-offset:2px}@media(max-width:600px){.overhead-panel{max-width:calc(100vw - 16px)}}
