.game-wrapper{width:100%;color:var(--color-brand-base)}.game-container{background:var(--color-brand-base);background:color-mix(in srgb,var(--background)90%,transparent);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid var(--color-brand-base);border-color:color-mix(in srgb,var(--color-brand-base)15%,transparent);width:100%;max-width:650px;box-shadow:0 20px 40px -10px color-mix(in srgb,var(--color-brand-base)15%,transparent);text-align:center;border-radius:24px;margin:0 auto;padding:30px}.player-card{background:var(--background);border:1px solid var(--color-brand-base);border-color:color-mix(in srgb,var(--color-brand-base)15%,transparent);box-shadow:0 4px 6px -1px color-mix(in srgb,var(--color-brand-base)5%,transparent);border-radius:12px;flex:1;padding:15px;transition:all .2s}.player-card.active{border-color:var(--color-brand-primary);box-shadow:0 0 0 2px var(--color-brand-primary);background:#0187900d;transform:translateY(-2px)}.player-card.slowest{background:#ef44440d;border-color:#ef4444}.playing-card{background:var(--color-brand-on-surface);border:1px solid var(--color-brand-base);border-color:color-mix(in srgb,var(--color-brand-base)10%,transparent);cursor:default;-webkit-user-select:none;user-select:none;box-sizing:border-box;width:80px;height:115px;color:var(--color-brand-base);filter:brightness(.95);border-radius:8px;flex-direction:column;justify-content:space-between;padding:8px;transition:transform .2s;display:flex;box-shadow:0 4px 10px #0000004d}[data-theme=light] .playing-card{color:#1e293b;filter:none;background:#fff;box-shadow:0 4px 10px #0000001a}.playing-card.red{color:#ef4444}.playing-card.new-deal{animation:.5s cubic-bezier(.175,.885,.32,1.275) backwards deal-in}@media (max-width:768px){.game-container .flex.justify-center.gap-4.flex-wrap{grid-template-columns:repeat(2,1fr);place-items:center;gap:1rem;display:grid!important}}@keyframes dealCard{0%{opacity:0;transform:translateY(-50px)scale(.5)rotate(10deg)}to{opacity:1;transform:translateY(0)scale(1)rotate(0)}}.btn-react{cursor:pointer;min-width:120px;color:var(--color-brand-on-surface);text-transform:uppercase;letter-spacing:.5px;border:none;border-radius:12px;flex:1;padding:16px 10px;font-size:1.2rem;font-weight:700;transition:all .1s;box-shadow:0 6px #0003}.btn-react:active{transform:translateY(6px);box-shadow:0 0 #0003}.btn-react:disabled{opacity:.5;cursor:not-allowed;transform:translateY(6px);box-shadow:0 0 #0003}.p1-btn{background-color:var(--color-brand-primary)}.p2-btn{background-color:var(--color-brand-accent)}.p3-btn{background-color:var(--color-brand-base)}.p4-btn{background-color:#0b9e9c}input[type=number],input[type=text],select{background:var(--background);border:2px solid var(--color-brand-base);border-color:color-mix(in srgb,var(--color-brand-base)20%,transparent);width:100%;color:var(--color-brand-base);box-sizing:border-box;text-align:center;border-radius:12px;outline:none;padding:12px 15px;font-size:1.1rem;box-shadow:inset 0 2px 4px #0000000d}input[type=number]:focus,input[type=text]:focus{border-color:var(--color-brand-primary);box-shadow:0 0 0 3px #01879033}button.standard{cursor:pointer;color:var(--color-brand-on-surface);background-color:var(--color-brand-base);box-shadow:0 4px 6px -1px color-mix(in srgb,var(--color-brand-primary)20%,transparent);border:none;border-radius:12px;padding:12px 24px;font-size:1.1rem;font-weight:600;transition:all .2s}button.standard:hover{background-color:var(--color-brand-base);transform:translateY(-2px);box-shadow:0 6px 8px -2px #0054614d}#snackbar{visibility:hidden;color:#fff;text-align:center;z-index:1000;opacity:0;background-color:#333;border-radius:12px;min-width:250px;max-width:80%;padding:16px;font-size:1.1rem;font-weight:600;transition:visibility 0s .3s,opacity .3s linear,bottom .3s ease-out;position:fixed;bottom:30px;left:50%;transform:translate(-50%);box-shadow:0 10px 25px #0003}#snackbar.show{visibility:visible;opacity:1;transition:visibility,opacity .3s linear,bottom .3s ease-out;bottom:50px}#snackbar.success{background-color:var(--color-brand-accent);color:#fff}#snackbar.error{color:#fff;background-color:#ef4444}#snackbar.info{background-color:var(--color-brand-primary);color:#fff}.result-node{background:linear-gradient(135deg,var(--color-brand-base)0%,var(--foreground)100%);-webkit-user-select:none;user-select:none;border:3px solid #10b981;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;width:90px;height:130px;display:flex;position:relative;box-shadow:0 0 15px #10b98166}.result-node .text-brand-on-surface{color:var(--color-brand-on-surface)}.playing-card.selected,.result-node.selected{box-shadow:0 0 0 4px var(--color-brand-primary),0 10px 20px #0000004d}.playing-card.opacity-30{filter:blur(1px)}.target-btn{border:2px solid var(--color-brand-primary);color:var(--color-brand-primary);cursor:pointer;background:0 0;border-radius:10px;padding:10px 20px;font-weight:700;transition:all .2s}.target-btn.selected{background:var(--color-brand-primary);color:var(--color-brand-on-surface)}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:2000;background:#00546166;justify-content:center;align-items:center;width:100%;height:100%;display:none;position:fixed;top:0;left:0}.modal-overlay.show{display:flex}.modal-body ul{text-align:left;margin:10px 0;padding-left:0;list-style:none}.modal-body li{font-family:var(--font-mono);background:var(--color-brand-base);background:color-mix(in srgb,var(--color-brand-base)5%,transparent);border:1px solid var(--color-brand-base);border-color:color-mix(in srgb,var(--color-brand-base)20%,transparent);color:var(--color-brand-base);border-radius:6px;margin-bottom:8px;padding:8px 15px;font-size:1.2rem;font-weight:600}@media (max-width:600px){.game-container{border-radius:16px;padding:20px 16px}.player-card{flex:calc(50% - 10px);min-width:110px;padding:10px}.player-card .text-3xl{font-size:1.75rem}.playing-card{width:65px;height:95px;padding:6px}.playing-card .text-4xl{font-size:1.75rem}.playing-card .text-base{font-size:.8rem}.btn-react{min-width:calc(50% - 8px);padding:12px 10px;font-size:1rem}button.standard{padding:10px 16px;font-size:1rem}.status-bar{padding:10px 12px;font-size:.9rem}input[type=number],input[type=text],select{padding:10px 12px;font-size:1rem}.modal-content{padding:20px!important}}