html,body{max-width:100%;overflow-x:hidden}.game-shell{max-width:1120px;padding-top:18px}h1{font:700 32px/1.2 system-ui,sans-serif}.intro{margin-bottom:14px}.intro p{margin:0;font-size:15px}.toolbar{gap:8px;margin:12px 0}.toolbar button,.toolbar select,.toolbar input{min-height:38px;padding:7px 10px;font-size:14px;border-radius:5px}.toolbar label{font-size:14px}.meta,.scores{color:var(--muted);font-size:13px;margin:6px 0}.status{font-size:14px;margin:8px 0;min-height:21px}#seed{width:7.3em}.board{container-type:inline-size;--card-w:min(100px,calc((100cqw - 48px)/7));--card-h:calc(var(--card-w)*1.4);--up-gap:28px;--down-gap:15px;padding:24px;user-select:none;overflow:hidden;background:radial-gradient(ellipse at 50% 20%,#31594e,#1e3d37 90%);border:5px solid #43554b;border-radius:12px;box-shadow:inset 0 0 22px #06191270,0 3px 10px #0003}.board[data-mode=freecell]{--card-w:min(100px,calc((100cqw - 56px)/8))}.board[data-mode=spider]{--card-w:82px}.board button{touch-action:none}.reserves{display:flex;justify-content:space-between;align-items:start;gap:8px;margin-bottom:24px}.group{display:flex;gap:8px;align-items:start}.card,.slot{width:var(--card-w);height:var(--card-h);min-width:0;min-height:0;padding:0;border-radius:5px;position:relative;flex-shrink:0}.card,.card.up,button.card.up{display:block;border:0;background:#fff;color:#16242a;box-shadow:0 1px 2px #0009,0 0 0 1px #17292255}.card-face{display:block;width:100%;height:100%;pointer-events:none;user-select:none;max-width:none}.card.down{background:#fcfcf5}.card:hover:not(:disabled){background:#fff;border:0;filter:brightness(1.03)}.slot,button.slot{background:#09251f40;border:1px solid #9db6a04d;box-shadow:inset 0 1px 3px #0003;padding:0}.slot:hover:not(:disabled){background:#193a30;border-color:#c2d4b3}.stock{background:transparent!important;border:0!important;background-image:url('./assets/cards/B-1.svg')!important;background-size:100% 100%!important;box-shadow:2px 2px #d4dac9,3px 3px #324d3a!important}.stock-label,.count{position:absolute;bottom:10px;left:0;right:0;text-align:center;background:#153c36e8;color:#fff;font:600 12px/1.5 system-ui}.stock-label{bottom:29px}.ghost-suit{display:grid;place-items:center;height:100%;opacity:.35;color:#b2ceb5}.ghost-suit svg{width:38%;height:38%}.tableau-scroll{max-width:100%;overflow-x:auto;overflow-y:hidden;padding:4px 3px 12px;touch-action:pan-x pan-y}.tableau{display:flex;gap:8px;align-items:start;min-height:calc(var(--card-h) + 145px)}.column{width:var(--card-w);flex:0 0 var(--card-w);border-radius:5px;min-height:calc(var(--card-h) + 100px)}.pile{display:flex;flex-direction:column;min-height:var(--card-h)}.pile>.card+.card{margin-top:calc(var(--up-gap) - var(--card-h))}.pile>.down+.card{margin-top:calc(var(--down-gap) - var(--card-h))}.card.is-selected{outline:3px solid #ffe3a6;outline-offset:1px;filter:brightness(1.06)}.card.hinted,.slot.hinted,.column.hinted{outline:3px solid #c1e486;outline-offset:2px}.column.legal-target{background:#b7dda71c;box-shadow:0 0 0 2px #bddd9f80}.slot.legal-target,.card.legal-target{outline:2px solid #bddd9f;outline-offset:3px}.drop-hover{box-shadow:0 0 0 3px #f4d38c!important;background:#e5dc9d30!important}.dragging .is-selected{opacity:.3}.waste-fan{display:flex}.waste-fan>.peek+.card,.waste-fan>.peek+.peek{margin-left:calc(18px - var(--card-w))}.peek{pointer-events:none}.completed{display:flex;gap:5px}.pip-box{width:18px;height:25px;border:1px solid #98b89c66;border-radius:3px}.pip-box.filled{background:#d4e3ac}.scroll-hint{font-size:12px;margin:0 0 8px;color:#b9d2bd}.banner{margin:0 0 12px;color:#f6e8aa;font-weight:700}.drag-ghost{position:fixed;pointer-events:none;z-index:100;filter:drop-shadow(0 10px 8px #0006);transform:rotate(1deg);background:none;padding:0}.ghost-card{position:absolute;left:0;width:100%;aspect-ratio:5/7;border-radius:5px;box-shadow:0 1px 2px #0008;overflow:hidden;background:white}.card-flip{animation:card-flip 300ms ease-out;transform-origin:center}.card-flip .card-face{backface-visibility:hidden}@keyframes card-flip{0%{transform:perspective(600px) rotateY(-88deg)}65%{transform:perspective(600px) rotateY(12deg)}100%{transform:perspective(600px) rotateY(0)}}.help{padding:14px 0}.help h2{font:600 18px system-ui}.help p{font-size:14px}@media(max-width:650px){.game-shell{padding:16px 8px}.board{padding:10px;border-width:3px;--card-w:calc((100cqw - 24px)/7);--up-gap:23px;--down-gap:10px}.board[data-mode=freecell]{--card-w:calc((100cqw - 28px)/8)}.board[data-mode=spider]{--card-w:64px}.tableau,.group{gap:4px}.reserves{gap:4px;margin-bottom:18px}.stock-label,.count{font-size:9px;bottom:5px}.stock-label{bottom:18px}.card,.slot,.ghost-card{border-radius:3px}.toolbar{gap:6px}.toolbar button,.toolbar select,.toolbar input{font-size:12px;padding:7px 8px}.status{font-size:12px}.meta{font-size:11px}.column{min-height:calc(var(--card-h) + 80px)}}@media(prefers-reduced-motion:reduce){.card-flip{animation:none}.drag-ghost{transform:none}}
.card-draw{animation:card-draw 280ms cubic-bezier(.2,.7,.3,1)}@keyframes card-draw{0%{transform:translateX(var(--draw-x)) rotateY(-100deg)}45%{transform:translateX(calc(var(--draw-x)*.3)) rotateY(-35deg)}100%{transform:translateX(0) rotateY(0)}}@media(prefers-reduced-motion:reduce){.card-draw{animation:none}}
