:root{--card-width:80px;--card-height:116px;--card-radius:8px;--gap:6px;--board-bg:#1a3c6b;--card-bg:#fff;--card-back-bg:#2c5aa0;--card-border:#bbb;--card-shadow:0 2px 4px #0000004d;--red:#d32f2f;--black:#222}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{width:100%;height:100%;overflow:hidden}body{background:var(--board-bg);-webkit-user-select:none;user-select:none;touch-action:manipulation;font-family:Segoe UI,system-ui,-apple-system,sans-serif}.board{height:100dvh;padding:var(--gap);gap:var(--gap);flex-direction:column;max-width:960px;margin:0 auto;display:flex}.board-header{flex-shrink:0;justify-content:space-between;align-items:center;padding:4px 0;display:flex}.board-header h1{color:#fff;text-shadow:0 1px 2px #0000004d;align-items:center;gap:4px;font-size:1.3rem;font-weight:700;display:flex}.gear-btn{color:#ffffffb3;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:4px;transition:color .15s,background .15s;display:flex}.gear-btn:hover{color:#fff;background:#ffffff26}.gear-btn:active{transform:scale(.9)}.modal-overlay{z-index:3000;background:#000000a6;justify-content:center;align-items:center;padding:16px;animation:.2s fadeIn;display:flex;position:fixed;inset:0}.modal-content{color:#333;text-align:left;background:#fff;border-radius:14px;width:100%;max-width:640px;max-height:85vh;padding:28px 32px 32px;line-height:1.65;position:relative;overflow-y:auto;box-shadow:0 16px 50px #0006}.modal-close{color:#999;cursor:pointer;background:0 0;border:none;padding:0 4px;font-size:1.8rem;line-height:1;transition:color .15s;position:absolute;top:12px;right:16px}.modal-close:hover{color:#333}.seo-article h1{color:#1a3c6b;margin-bottom:16px;padding-right:30px;font-size:1.4rem;line-height:1.3}.seo-article h2{color:#1a3c6b;margin:20px 0 8px;font-size:1.1rem}.seo-article p{margin-bottom:12px;font-size:.95rem}.seo-article ul,.seo-article ol{margin:8px 0 12px 20px;font-size:.95rem}.seo-article li{margin-bottom:6px}@media (width<=520px){.modal-content{max-height:90vh;padding:20px 18px 24px}.seo-article h1{font-size:1.15rem}.seo-article h2{font-size:1rem}.seo-article p,.seo-article ul,.seo-article ol{font-size:.88rem}}.board-controls{align-items:center;gap:8px;display:flex}.move-counter{color:#ffffffd9;font-size:.85rem;font-weight:500}.btn{color:#fff;cursor:pointer;background:#fff3;border:none;border-radius:6px;padding:6px 14px;font-size:.8rem;font-weight:600;transition:background .15s}.btn:hover{background:#ffffff59}.btn:active{transform:scale(.96)}.btn-new{color:#333;background:#e8a735}.btn-new:hover{background:#f0b840}.difficulty-row{flex-wrap:wrap;flex-shrink:0;align-items:center;gap:6px;display:flex}.difficulty-label{color:#ffffffb3;font-size:.8rem;font-weight:500}.btn-diff{padding:4px 10px;font-size:.75rem}.btn-diff-active{color:#fff;background:#ffffff73;font-weight:700}.stock-area{margin-left:auto}.btn-deal{color:#fff;background:#4a8f5c;padding:5px 12px;font-size:.8rem}.btn-deal:hover{background:#5aa86c}.btn-disabled{opacity:.4;cursor:not-allowed}.btn-disabled:hover{background:#4a8f5c}.stock-empty-label{color:#fff6;font-size:.75rem}.card{width:var(--card-width);height:var(--card-height);border-radius:var(--card-radius);cursor:pointer;transition:box-shadow .15s;position:absolute;top:0;left:0}.card-front{background:var(--card-bg);border:1.5px solid var(--card-border);box-shadow:var(--card-shadow);flex-direction:column;justify-content:space-between;padding:3px 5px;display:flex;overflow:hidden}.card-red{color:var(--red)}.card-black{color:var(--black)}.card-corner{flex-direction:column;align-items:center;line-height:1;display:flex}.card-corner-bottom{align-self:flex-end;transform:rotate(180deg)}.card-rank{font-size:.85rem;font-weight:700}.card-suit{font-size:.7rem}.card-center{text-align:center;font-size:1.8rem;line-height:1;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.card-back{background:var(--card-back-bg);box-shadow:var(--card-shadow);border:1.5px solid #1e4080;justify-content:center;align-items:center;display:flex;overflow:hidden}.card-back-pattern{color:#ffffff59;text-align:center;font-size:1.2rem}.card-empty{background:#0000001a;border:2px dashed #ffffff4d;justify-content:center;align-items:center;display:flex}.empty-label{color:#ffffff59;font-size:1.5rem}.card.selected{outline-offset:-1px;outline:3px solid #4fc3f7;box-shadow:0 0 12px #4fc3f799}.card.dragging{opacity:.85;pointer-events:none;box-shadow:0 8px 20px #0006}.tableau{gap:var(--gap);-webkit-overflow-scrolling:touch;flex:1;min-height:0;display:flex;overflow-y:auto}.tableau-pile{width:var(--card-width);min-height:var(--card-height);flex:1;min-width:0;position:relative}.tableau-card{position:absolute;left:0}.win-overlay{z-index:2000;background:#0009;justify-content:center;align-items:center;animation:.3s fadeIn;display:flex;position:fixed;inset:0}.win-dialog{text-align:center;background:#fff;border-radius:16px;padding:32px 40px;box-shadow:0 12px 40px #0006}.win-dialog h2{color:#333;margin-bottom:8px;font-size:1.8rem}.win-dialog p{color:#666;margin-bottom:20px;font-size:1rem}.win-dialog .btn-new{padding:10px 28px;font-size:1rem}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media (width<=520px){:root{--card-width:32px;--card-height:48px;--card-radius:4px;--gap:2px}.board{padding:3px}.board-header h1{font-size:.9rem}.move-counter{font-size:.65rem}.btn{padding:3px 6px;font-size:.65rem}.card-rank{font-size:.45rem}.card-suit{font-size:.35rem}.card-center{font-size:.8rem}.card-back-pattern{font-size:.5rem}.empty-label{font-size:.7rem}.difficulty-label{font-size:.65rem}.btn-diff{padding:3px 6px;font-size:.6rem}.btn-deal{padding:3px 8px;font-size:.65rem}.win-dialog{margin:16px;padding:20px 24px}.win-dialog h2{font-size:1.3rem}}@media (width>=521px) and (width<=768px){:root{--card-width:52px;--card-height:76px;--gap:4px}.card-center{font-size:1.2rem}.card-rank{font-size:.65rem}.card-suit{font-size:.55rem}}@media (width>=1100px){:root{--card-width:88px;--card-height:128px;--gap:8px}.board{max-width:1060px}.card-rank{font-size:1rem}.card-suit{font-size:.85rem}.card-center{font-size:2.2rem}}@media (height<=500px) and (orientation:landscape){:root{--card-width:40px;--card-height:58px;--gap:2px}.board-header{padding:0}.board-header h1{font-size:.85rem}}