:root{color-scheme:dark;--felt:#07594b;--felt-dark:#063f36;--gold:#f2c866;--card:#fffdf8;--ink:#17212b;--red:#c92d3b;--card-w:clamp(42px,11.7vw,86px);--card-h:calc(var(--card-w)*1.38)}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;background:radial-gradient(circle at 50% -10%,#11836e,var(--felt-dark) 56%,#032b25);color:#fff;font-family:Inter,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;touch-action:manipulation}
button{font:inherit}
.app-shell{width:min(100%,980px);min-height:100vh;margin:auto;padding:max(14px,env(safe-area-inset-top)) 12px max(30px,env(safe-area-inset-bottom))}
header{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;padding:4px 4px 12px}
.eyebrow{margin:0;color:var(--gold);font-size:11px;font-weight:800;letter-spacing:.18em}
h1{margin:2px 0 0;font-family:Georgia,serif;font-size:clamp(24px,5vw,38px)}
.stats{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.stats span{min-width:68px;padding:7px 9px;border:1px solid #ffffff2b;border-radius:10px;background:#001d1980;color:#bddbd5;font-size:11px;text-align:center}
.stats strong{display:block;color:#fff;font-size:15px}
.toolbar{display:flex;gap:7px;overflow-x:auto;padding:7px 3px}
.toolbar button,.win-card button{border:1px solid #ffffff35;border-radius:10px;background:#ffffff17;color:#fff;padding:9px 13px;white-space:nowrap;cursor:pointer}
.toolbar button:disabled{opacity:.38}
.toolbar .primary,.win-card .primary{background:var(--gold);border-color:var(--gold);color:#2e2511;font-weight:800}
.message{min-height:22px;margin:5px 4px 8px;color:#d1e8e2;font-size:13px}
.board{padding:12px 6px 24px;border:1px solid #ffffff1f;border-radius:18px;background:linear-gradient(145deg,#ffffff0b,#001b1747);box-shadow:0 22px 60px #001b1770;overflow:hidden}
.top-row{display:grid;grid-template-columns:var(--card-w) var(--card-w) 1fr repeat(4,var(--card-w));gap:clamp(4px,1.3vw,10px);align-items:start}
.top-spacer{min-width:0}
.foundations{display:contents}
.pile,.card{width:var(--card-w);height:var(--card-h);border-radius:clamp(5px,1.5vw,10px)}
.pile{position:relative;border:2px dashed #ffffff4a;background:#001d1938;color:#ffffff88;display:grid;place-items:center;padding:0;cursor:pointer}
.pile:focus-visible,.card:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.pile.empty::after{content:attr(data-symbol);font-size:clamp(24px,6vw,42px);opacity:.5}
.stock.has-cards{border-style:solid;border-color:#f7db90;background:repeating-linear-gradient(135deg,#163b63 0 6px,#23527d 6px 12px);box-shadow:inset 0 0 0 3px #fff,0 3px 0 #bda769}
.stock.has-cards::after{content:"◆";font-size:24px;color:#f7db90}
.stock.recycle::after{content:"↻";font-size:30px}
.card{position:relative;border:1px solid #d6d0c5;background:linear-gradient(145deg,#fff,#f5f0e5);color:var(--ink);padding:4px;box-shadow:0 3px 7px #001e1966;cursor:pointer;user-select:none}
.card.red{color:var(--red)}
.card.face-down{border:3px solid #fff;background:repeating-linear-gradient(45deg,#173f6d 0 5px,#28638d 5px 10px);color:transparent}
.card .corner{position:absolute;top:4px;left:5px;font-family:Georgia,serif;font-size:clamp(11px,3vw,18px);font-weight:700;line-height:.9;text-align:center}
.card .symbol{display:grid;height:100%;place-items:center;font-size:clamp(20px,6vw,46px)}
.card.selected{outline:4px solid var(--gold);outline-offset:-2px;transform:translateY(-5px)}
.tableau{display:grid;grid-template-columns:repeat(7,var(--card-w));gap:clamp(4px,1.3vw,10px);margin-top:clamp(12px,3vw,24px)}
.column{min-height:calc(var(--card-h)*3.6);border-radius:10px}
.column.empty{border:2px dashed #ffffff30;min-height:var(--card-h)}
.column .card{display:block}
.column .card:not(:first-child){margin-top:calc(var(--card-h)*-.72)}
.column .card.face-down:not(:first-child){margin-top:calc(var(--card-h)*-.84)}
.help{margin:15px 3px;padding:15px 18px;border-radius:14px;background:#001d1975;color:#d7ebe6;font-size:14px;line-height:1.55}
.help h2{margin:0 0 6px;color:var(--gold);font-size:18px}
.help p{margin:6px 0}
.win-dialog{position:fixed;inset:0;z-index:20;display:grid;place-items:center;padding:20px;background:#001713c9;backdrop-filter:blur(7px)}
.win-card{width:min(360px,100%);padding:28px;border:1px solid #ffe7a366;border-radius:22px;background:linear-gradient(155deg,#0a6958,#053d34);box-shadow:0 25px 80px #0009;text-align:center}
.win-card h2{font:700 32px Georgia,serif;margin:10px 0}
.confetti{color:var(--gold);font-size:30px;letter-spacing:.25em}
[hidden]{display:none!important}
@media(max-width:600px){.app-shell{padding-left:6px;padding-right:6px}header{align-items:flex-start;flex-direction:column}.stats{justify-content:flex-start}.stats span{min-width:63px}.board{padding-left:3px;padding-right:3px}.top-row,.tableau{gap:3px}.message{font-size:12px}}