:root{--color-bg: #0f172a;--color-bg-secondary: #1e293b;--color-bg-tertiary: #334155;--color-text: #f1f5f9;--color-text-secondary: #94a3b8;--color-primary: #3b82f6;--color-primary-hover: #2563eb;--color-success: #22c55e;--color-error: #ef4444;--color-warning: #f59e0b;--color-red: #dc2626;--color-yellow: #eab308;--color-green: #16a34a;--color-black: #1e293b;--color-rook: #8b5cf6;--card-width: 80px;--card-height: 112px;--card-radius: 8px;--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, sans-serif}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-family);background-color:var(--color-bg);color:var(--color-text);min-height:100vh;overflow-x:hidden}#root{min-height:100vh;display:flex;flex-direction:column}button{font-family:inherit;cursor:pointer;border:none;border-radius:6px;padding:10px 20px;font-size:14px;font-weight:500;transition:all .2s ease}button:disabled{opacity:.5;cursor:not-allowed}input,select{font-family:inherit;font-size:14px;padding:10px 14px;border:1px solid var(--color-bg-tertiary);border-radius:6px;background:var(--color-bg-secondary);color:var(--color-text);outline:none;transition:border-color .2s ease}input:focus,select:focus{border-color:var(--color-primary)}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover:not(:disabled){background:var(--color-primary-hover)}.btn-secondary{background:var(--color-bg-tertiary);color:var(--color-text)}.btn-secondary:hover:not(:disabled){background:var(--color-bg-secondary)}.btn-success{background:var(--color-success);color:#fff}.btn-danger{background:var(--color-error);color:#fff}.card{width:var(--card-width);height:var(--card-height);border-radius:var(--card-radius);display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:700;font-size:24px;position:relative;box-shadow:0 2px 8px #0000004d;transition:transform .15s ease,box-shadow .15s ease;-webkit-user-select:none;user-select:none}.card-red{background:var(--color-red);color:#fff}.card-yellow{background:var(--color-yellow);color:#1e293b}.card-green{background:var(--color-green);color:#fff}.card-black{background:var(--color-black);color:#fff;border:1px solid #475569}.card-rook{background:linear-gradient(135deg,var(--color-rook),#a855f7);color:#fff;border:2px solid #ffd700}.card-back{background:linear-gradient(135deg,#1e3a5f,#0f172a);border:2px solid #334155}.card-back:after{content:"";position:absolute;top:8px;right:8px;bottom:8px;left:8px;border:1px solid #475569;border-radius:4px}.card-corner{position:absolute;font-size:12px;font-weight:600}.card-corner-top{top:6px;left:6px}.card-corner-bottom{bottom:6px;right:6px;transform:rotate(180deg)}.card-clickable{cursor:pointer}.card-clickable:hover{transform:translateY(-8px);box-shadow:0 8px 16px #0006}.card-dimmed{opacity:.4;cursor:not-allowed}.card-dimmed:hover{transform:none;box-shadow:0 2px 8px #0000004d}.card-selected{transform:translateY(-12px);box-shadow:0 8px 20px #3b82f680;outline:3px solid var(--color-primary)}.card-small{width:50px;height:70px;font-size:16px}.card-small .card-corner{font-size:9px}.rook-icon{font-size:32px}.card-small .rook-icon{font-size:20px}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes cardDeal{0%{opacity:0;transform:translateY(-50px) scale(.8)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes cardPlay{0%{transform:scale(1.1)}to{transform:scale(1)}}.animate-fade-in{animation:fadeIn .3s ease}.animate-slide-up{animation:slideUp .3s ease}.animate-slide-down{animation:slideDown .3s ease}.animate-pulse{animation:pulse 1.5s ease-in-out infinite}.animate-spin{animation:spin 1s linear infinite}.animate-card-deal{animation:cardDeal .4s ease}.animate-card-play{animation:cardPlay .2s ease}.thinking-dots{display:inline-flex;gap:4px}.thinking-dots span{width:8px;height:8px;background:var(--color-primary);border-radius:50%;animation:pulse 1s ease-in-out infinite}.thinking-dots span:nth-child(2){animation-delay:.2s}.thinking-dots span:nth-child(3){animation-delay:.4s}