:root{color-scheme:dark;--ink:#f0f1e9;--muted:#95afa6;--gold:#e3c082;--felt:#164b3d;--gap:clamp(6px,1.5vw,18px);--radius:11px;font-family:Segoe UI,system-ui,-apple-system,sans-serif;background:#0b211c;color:var(--ink)}
*{box-sizing:border-box}body{margin:0;min-width:280px;background:radial-gradient(ellipse at 50% 0%,#1e4738 0,transparent 65%),#0b211c;min-height:100vh}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}button,a,[role=button]{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:default;opacity:.36}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,[role=button]:focus-visible{outline:2px solid var(--gold);outline-offset:4px}button:active:not(:disabled){transform:translateY(1px)}
.app{max-width:1200px;margin:auto;padding:28px 44px 20px}.masthead,.intro,.toolbar,.table-footer,.page-footer{display:flex;align-items:center;justify-content:space-between}.masthead{gap:16px}.arcade-link{font-size:14px;letter-spacing:1px;color:#a9bfb5;display:flex;gap:12px;align-items:center}.arcade-link span{font-size:10px;letter-spacing:2.4px}.quiet-button{border:0;background:none;color:#a9bfb5;font-size:12px;padding:8px 0}.quiet-button span{margin-left:12px;color:var(--gold)}.intro{margin:36px 0 30px;gap:24px}.eyebrow{font-size:9px;letter-spacing:2.2px;color:var(--gold);font-weight:600;margin:0 0 12px}h1{font-family:Georgia,Times New Roman,serif;font-size:clamp(42px,5vw,66px);font-weight:400;letter-spacing:-2px;line-height:1;margin:0}.title-suit{font-family:Georgia,serif;font-size:.5em;color:var(--gold);display:inline-block;margin-left:20px;transform:rotate(-12deg)}.subtitle{font-size:13px;color:var(--muted);margin:12px 0 0}.stats{display:flex;gap:36px;text-align:center}.stats>div{min-width:57px}.stat-label{display:block;font-size:9px;letter-spacing:2px;color:#97b1a5;margin-bottom:8px}.stats strong{font-size:24px;font-weight:400;font-variant-numeric:tabular-nums;letter-spacing:1px}
.table-shell{border-radius:19px;border:1px solid #d6b57a38;background:radial-gradient(ellipse at 50% 15%,#28645155,transparent 80%),repeating-radial-gradient(circle at 0 0,#ffffff03 0 1px,transparent 1px 4px),#124432;box-shadow:0 20px 60px #0003,inset 0 0 70px #0002;overflow:hidden}.toolbar{padding:17px 25px;border-bottom:1px solid #f0dfbd13;gap:16px;background:#0b291f25}.game-type{font-size:10px;font-weight:600;letter-spacing:1.7px;color:#c9d6c8;white-space:nowrap;display:flex;gap:8px;align-items:center}.draw-type{font-weight:400;letter-spacing:0;color:#8faf9d}.status-dot{width:5px;height:5px;border-radius:50%;background:var(--gold);box-shadow:0 0 12px #f4d69b55}.actions{display:flex;gap:8px}.btn{border:1px solid #d9e5da26;border-radius:7px;color:#ecede3;background:#ffffff06;padding:9px 13px;min-height:38px;font-size:12px;font-weight:500;display:inline-flex;gap:7px;align-items:center;justify-content:center}.btn:hover:not(:disabled){background:#ffffff12}.btn>span:first-child{font-size:18px;line-height:1}.btn--gold{background:var(--gold);color:#183c2a;border-color:var(--gold);box-shadow:0 2px 10px #0001}.btn--gold:hover:not(:disabled){background:#efd29e}
.board{position:relative;padding:29px 27px 24px;--card-radius:clamp(5px,.8vw,10px);isolation:isolate}.top-row,.tableau{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:var(--gap)}.pile{aspect-ratio:5/7;position:relative;border:1px solid #eff4d82b;border-radius:var(--card-radius);background:#00241625;user-select:none}.slot-symbol{position:absolute;inset:0;display:grid;place-items:center;font-size:clamp(25px,4vw,48px);color:#d9dcb62c;font-family:Georgia,serif}.foundation::before{content:"";position:absolute;inset:7px;border:1px dashed #e3e7bd1b;border-radius:calc(var(--card-radius) - 2px)}.top-spacer{display:grid;place-items:center}.top-spacer>span{color:#d4bf8c18;font-size:35px;transform:rotate(-10deg)}.stock{cursor:pointer}.stock::after{content:attr(data-count);position:absolute;bottom:-24px;left:0;right:0;text-align:center;font-size:10px;letter-spacing:.5px;color:#b6cbba}.table-labels{display:flex;justify-content:space-between;color:#9cbaa08c;font-size:8px;letter-spacing:1.8px;margin:30px 0 23px}.tableau{min-height:290px;align-items:start;position:relative;z-index:1}.column{position:relative;min-height:65px;border-radius:var(--card-radius);user-select:none}.column:before{position:absolute;content:"K";top:0;left:0;right:0;aspect-ratio:5/7;border:1px solid #ecdfb61a;border-radius:var(--card-radius);color:#d4c39328;display:grid;place-items:center;font-family:Georgia,serif;font-size:27px}.table-watermark{position:absolute;bottom:38px;left:0;right:0;text-align:center;font-size:9px;letter-spacing:4px;color:#d4c39322;pointer-events:none;z-index:0}.table-watermark span{font-size:19px;padding:0 8px}
.card{position:absolute;left:0;width:100%;aspect-ratio:5/7;border-radius:var(--card-radius);background:#faf7ef;color:#233a34;box-shadow:0 2px 3px #0003,0 6px 15px #0002;user-select:none;touch-action:none;cursor:grab;border:1px solid #b8b4a1;overflow:hidden;transform:translateZ(0)}.card:after{content:"";position:absolute;inset:3px;border:1px solid #66776414;border-radius:calc(var(--card-radius) - 2px);pointer-events:none}.card.red{color:#bf3e3a}.corner{position:absolute;top:5%;left:8%;font-family:Georgia,serif;font-size:clamp(12px,2vw,23px);font-weight:700;line-height:1;display:flex;align-items:center;gap:2px;z-index:1}.corner.bottom{top:auto;left:auto;bottom:5%;right:8%;transform:rotate(180deg)}.corner .small-suit{font-family:Georgia,serif;font-size:.8em}.face{position:absolute;inset:23% 24%;display:grid;place-items:center;font-family:Georgia,serif}.ace{font-size:clamp(23px,5vw,65px)}.court{border:1px solid currentColor;inset:25% 23%;font-size:clamp(18px,3.9vw,47px);background:repeating-linear-gradient(45deg,#d1bb7f12 0 2px,transparent 2px 5px)}.court span{font-size:.5em}.pip{position:absolute;font-family:Georgia,serif;font-size:clamp(13px,2.1vw,27px);transform:translate(-50%,-50%);line-height:1}.back{background:#e6d8ae;cursor:default;border-color:#d3c295}.back:before{content:"";position:absolute;inset:5px;border:1px solid #e4c47799;border-radius:calc(var(--card-radius) - 3px);background:repeating-linear-gradient(45deg,transparent 0 6px,#d4c18a20 6px 7px),repeating-linear-gradient(-45deg,#244c48 0 6px,#d4c18a44 6px 7px);box-shadow:inset 0 0 0 3px #193f39}.back .back-emblem{position:absolute;inset:0;display:grid;place-items:center;color:#e2c886;font-family:Georgia,serif;font-size:clamp(20px,4vw,46px);text-shadow:0 1px 1px #0005}.selected{outline:3px solid #f2cf7b;outline-offset:1px;box-shadow:0 0 17px #f4d08e66}.drag-source{opacity:.2}.drop-valid{outline:2px dashed #e7cc86;outline-offset:5px}.hint-card{outline:3px solid #f7d889;outline-offset:2px;animation:hint-glow .9s ease-in-out 2}.hint-target{box-shadow:0 0 0 2px #e9cd7e,0 0 20px #ffe19b44}.table-footer{position:relative;border-top:1px solid #e3dbc219;padding:15px 25px;gap:14px;background:#0b291f38}.table-footer p{font-size:11px;color:#bbccbd;margin:0;line-height:1.6;max-width:65ch}.finish-button{flex-shrink:0;background:none;border:0;color:var(--gold);font-size:11px;padding:7px 0}.finish-button:disabled{color:#a4bb9f;opacity:.42}.finish-button span{margin-left:8px}.page-footer{margin:19px 2px 0;gap:20px;color:#78988a;font-size:10px}.page-footer>span:first-child{display:flex;gap:8px;align-items:center}.page-footer>span:last-child{font-size:8px;letter-spacing:1.7px}.save-dot{width:4px;height:4px;background:#89b89c;border-radius:50%;flex-shrink:0}.drag-layer{position:fixed;inset:0;pointer-events:none;z-index:50}.drag-layer .card{position:absolute;opacity:.96;box-shadow:0 14px 30px #0006;cursor:grabbing}.dialog{border:1px solid #e3c08255;background:#143b2f;color:var(--ink);padding:35px;border-radius:17px;width:min(510px,calc(100% - 32px));box-shadow:0 30px 120px #0008}.dialog::backdrop{background:#04160ecc;backdrop-filter:blur(5px)}.dialog h2{font:400 33px Georgia,serif;margin:0 0 15px}.dialog p,.dialog li{font-size:13px;line-height:1.8;color:#b9cbbf}.dialog .eyebrow{font-size:9px;color:var(--gold)}.dialog ul{padding-left:19px}.dialog li{padding-left:4px;margin:10px 0}.dialog-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:26px}.win-dialog{text-align:center}.win-suits{font:40px Georgia,serif;color:var(--gold);margin-bottom:20px}.win-suits span{color:#d97c6c}
@keyframes hint-glow{50%{filter:brightness(1.1)}}
@media(min-width:1300px){.app{padding-top:36px}.intro{margin-top:43px;margin-bottom:36px}.tableau{min-height:340px}}
@media(max-width:700px){.app{padding:18px 14px 15px}.intro{margin:27px 0 24px}.stats{gap:17px}.stats>div{min-width:39px}.stats strong{font-size:20px}.stat-label{font-size:8px;letter-spacing:1px}.subtitle{font-size:11px}.toolbar{padding:13px 13px;gap:10px}.game-type{font-size:8px;letter-spacing:1px}.draw-type{display:none}.btn{padding:8px 10px;font-size:11px;gap:5px;min-height:36px}.btn>span:first-child{font-size:16px}.actions{gap:6px}.board{padding:24px 13px 22px}.tableau{min-height:270px}.table-labels{font-size:7px;letter-spacing:1px;margin-top:29px;margin-bottom:19px}.table-footer{padding:12px 14px;align-items:flex-start;flex-direction:column;gap:5px}.table-footer p{font-size:10px}.finish-button{font-size:10px}.page-footer>span:last-child{display:none}.corner.bottom{display:none}.table-watermark{font-size:7px;letter-spacing:2px;bottom:38px}.arcade-link span{font-size:8px;letter-spacing:1.8px}.quiet-button{font-size:10px}.quiet-button span{margin-left:4px}.eyebrow{font-size:7px;letter-spacing:1.5px}.title-suit{margin-left:12px}.card:after{inset:2px}.back:before{inset:3px;box-shadow:inset 0 0 0 1px #193f39}.foundation:before{inset:4px}.selected{outline-width:2px}.slot-symbol{font-size:27px}.stock:after{font-size:8px}.column:before{font-size:19px}}
@media(max-width:370px){.app{padding-left:9px;padding-right:9px}.board{padding-left:9px;padding-right:9px}.toolbar{padding-left:10px;padding-right:10px}.stats{gap:10px}.stats strong{font-size:18px}.btn{padding:7px 8px}.game-type{letter-spacing:.4px}.actions{gap:4px}.title-suit{display:none}h1{font-size:42px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.stock .back{cursor:pointer}@media(max-width:700px){.pip{font-size:10px}}