:root{--card-w: 86px;--card-h: 120px;--gap: 16px;--board-pad: 24px;--app-pad: 16px;--waste-fan: 20px;--board-w: calc(7 * var(--card-w) + 6 * var(--gap) + 2 * var(--board-pad));--felt: #2f7a4d;--felt-dark: #1f5434}*{box-sizing:border-box}html,body{margin:0;padding:0}body{min-height:100vh;font-family:Segoe UI,Noto Sans,Arial,sans-serif;color:#eaf3ec;background:radial-gradient(1200px 600px at 50% -10%,rgba(255,255,255,.12),transparent 60%),linear-gradient(160deg,var(--felt) 0%,var(--felt-dark) 100%);-webkit-user-select:none;user-select:none}#app{display:flex;flex-direction:column;align-items:center;padding:20px var(--app-pad) 40px}.topbar{width:var(--board-w);max-width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 auto 18px}.topbar h1{margin:0;font-size:24px;letter-spacing:.5px;white-space:nowrap}.controls{display:flex;gap:8px}.controls button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid rgba(255,255,255,.35);background:#ffffff1a;color:#eaf3ec;padding:8px 14px;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:background .15s ease,transform .05s ease}.controls button:hover{background:#ffffff38}.controls button:active{transform:translateY(1px)}.stats{display:flex;gap:16px;font-size:14px;white-space:nowrap}.stats b{color:#fff}.board{width:var(--board-w);max-width:100%;margin:0 auto;padding:var(--board-pad);border-radius:18px;background:#00000029;box-shadow:inset 0 0 0 1px #ffffff14,0 10px 30px #00000040}.top-row{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:24px}.stock-area,.foundations,.tableau{display:flex;gap:var(--gap)}.pile{position:relative;width:var(--card-w);height:var(--card-h);border-radius:8px}.waste{width:var(--card-w)}.stock{cursor:pointer}.tableau-col{min-height:var(--card-h)}.drop-target{outline:3px solid rgba(255,235,59,.95);outline-offset:2px;border-radius:10px}.card{position:absolute;top:0;left:0;width:var(--card-w);height:var(--card-h);border-radius:8px;cursor:grab;touch-action:none}.card:active{cursor:grabbing}.card--face{--suit-color: #1b1d26;background:linear-gradient(180deg,#fff,#f2f5f9);border:1px solid #c7cfd9;color:var(--suit-color);box-shadow:0 2px 5px #00000059}.card--back{background:repeating-linear-gradient(45deg,rgba(255,255,255,.06) 0 6px,transparent 6px 12px),linear-gradient(160deg,#316b9c,#16304d);border:1px solid #0e2540;box-shadow:inset 0 0 0 5px #ffffff29,0 2px 5px #00000059}.card--empty{background:#ffffff0f;border:2px dashed rgba(255,255,255,.28);box-shadow:none;cursor:default}.card--dragging{opacity:.35}.card-corner{position:absolute;display:flex;flex-direction:column;align-items:center;line-height:1;font-weight:700}.card-corner--tl{top:calc(var(--card-h) * .05);left:calc(var(--card-w) * .09)}.card-corner--br{bottom:calc(var(--card-h) * .05);right:calc(var(--card-w) * .09);transform:rotate(180deg)}.card-rank{font-size:calc(var(--card-w) * .19)}.card-suit{font-size:calc(var(--card-w) * .17);margin-top:1px}.card-center{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:calc(var(--card-w) * .5)}.card-simple{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--card-h) * .04);line-height:1;font-weight:700}.card-simple-rank{font-size:calc(var(--card-h) * .36)}.card-simple-suit{font-size:calc(var(--card-h) * .4)}.stock-recycle{display:flex;align-items:center;justify-content:center;font-size:calc(var(--card-w) * .36);color:#ffffffbf;border-style:solid;cursor:pointer}.foundation-hint{display:flex;align-items:center;justify-content:center;font-size:calc(var(--card-w) * .4);opacity:.55}.drag-ghost{position:fixed;left:0;top:0;z-index:1000;pointer-events:none}.drag-ghost .card{position:absolute;top:0;left:0;cursor:grabbing}.hint{width:var(--board-w);max-width:100%;margin:16px auto 0;font-size:13px;line-height:1.5;text-align:center;opacity:.85}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2000;display:flex;align-items:center;justify-content:center;background:#0000008c}.overlay.hidden{display:none}.modal-card{background:#fff;color:#1f2a24;padding:32px 40px;border-radius:16px;text-align:center;max-width:380px;box-shadow:0 20px 60px #0006}.modal-card h2{margin:0 0 16px;font-size:26px}.modal-card p{margin:6px 0;font-size:16px;line-height:1.5}.modal-card .actions{display:flex;gap:12px;justify-content:center;margin-top:22px}.modal-card button{border:1px solid #2f7a4d;background:#2f7a4d;color:#fff;font-size:16px;padding:10px 20px;border-radius:8px;cursor:pointer}.modal-card button:hover{background:#25653f}.modal-card button.secondary{border:1px solid #c7cfd9;background:#fff;color:#37424b}.modal-card button.secondary:hover{background:#f1f4f7}@media(max-width:560px){.topbar{flex-direction:column;gap:10px}.stats{gap:12px}.controls{flex-wrap:wrap;justify-content:center}}@media(orientation:landscape)and (max-height:520px){#app{padding:8px var(--app-pad) 12px}.topbar{margin:0 auto 8px}.top-row{margin-bottom:12px}.hint{display:none}}