:root{color-scheme:dark;--cream:#f6f0df;--muted:#acc3b6;--gold:#e1c17a;--green:#154c40;--border:rgba(221,237,219,.13);font-family:ui-sans-serif,system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif}*{box-sizing:border-box}body{margin:0;background:#0c2d28;color:var(--cream);min-height:100dvh;background-image:radial-gradient(ellipse at 50% 15%,#1e5141 0%,transparent 65%),repeating-linear-gradient(120deg,transparent,transparent 3px,#ffffff01 4px);-webkit-tap-highlight-color:transparent}button,input,a{font:inherit}button{cursor:pointer;color:inherit;border:0;background:none;touch-action:manipulation}button:disabled{opacity:.38;cursor:default}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:4px}button:hover:enabled{filter:brightness(1.12)}a{color:inherit;text-decoration:none}.app{max-width:1080px;margin:auto;padding:0 26px}header{height:94px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border)}.brand{display:flex;gap:12px;align-items:center;font-size:22px;letter-spacing:2px;font-weight:700}.brand small{display:block;font-size:9px;letter-spacing:2.6px;color:var(--muted);margin-top:5px}.brand-mark{font:42px Georgia;color:var(--gold);width:48px;text-align:center}.header-actions{display:flex;gap:18px;align-items:center}.icon-button{border:1px solid #abc3b544;border-radius:50%;width:28px;height:28px;color:var(--muted);font:18px Georgia}.rank-button{border:1px solid #dcc38470;padding:10px 17px;border-radius:9px;font-size:13px;color:var(--gold)}.rank-button span{font-size:19px;margin-right:6px}.intro{display:flex;align-items:flex-end;justify-content:space-between;padding:31px 2px 26px}.eyebrow{font-size:9px;letter-spacing:2.8px;color:#a0bbab}h1{font-weight:500;font-size:28px;letter-spacing:2px;margin:9px 0 0}.player{font-size:12px;color:var(--muted);max-width:40%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}main{position:relative;border:1px solid #86ab8735;border-radius:18px;background:radial-gradient(ellipse at 50% 35%,#28664d55,transparent 80%),#124936;box-shadow:0 22px 60px #001e2455,inset 0 1px 0 #ffffff06;padding:22px 20px 18px}.table-top{display:flex;justify-content:space-between;align-items:center}.mode-button{display:flex;gap:9px;align-items:center;background:#073f2c80;border:1px solid #9cb89433;border-radius:25px;padding:10px 13px;font-size:12px}.mode-dot{width:6px;height:6px;background:var(--gold);border-radius:50%}.chevron{color:var(--muted);margin-left:6px}.stats{display:flex;gap:38px}.stats div{display:flex;flex-direction:column;gap:3px;min-width:43px}.stats small{font-size:10px;color:#a8c3ad}.stats strong{font:24px Georgia,serif;font-variant-numeric:tabular-nums;letter-spacing:1px}.stats div:first-child strong{color:var(--gold)}.table-meta{display:flex;justify-content:space-between;color:#9bbb9f;font-size:11px;margin:24px 0 17px;gap:12px;min-height:16px}.board{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:9px;min-height:340px;user-select:none;position:relative}.column{position:relative;border-radius:7px;min-height:100%;outline:1px solid transparent}.column:before{content:'♠';position:absolute;top:0;left:0;right:0;height:104px;border:1px dashed #acc5aa32;border-radius:7px;color:#abc5a721;display:grid;place-items:center;font:28px Georgia}.column.target:before{border:2px solid #e1c17ab0;background:#e1c17a10}.card{position:absolute;left:0;width:100%;height:105px;background:#f6f3e9;border:1px solid #dedccf;border-radius:6px;color:#1c3c34;box-shadow:0 2px 3px #001c2450;text-align:left;padding:5px 6px;display:block;overflow:hidden;touch-action:none;transition:box-shadow .15s,background .15s}.card .corner{display:flex;gap:4px;align-items:center;font:700 20px Georgia;line-height:21px}.card .suit-large{position:absolute;left:0;right:0;top:40%;text-align:center;font:35px Georgia;opacity:.85}.card .bottom-corner{position:absolute;bottom:4px;right:5px;font:17px Georgia;transform:rotate(180deg)}.card.red{color:#b64b48}.card.down{background:repeating-linear-gradient(45deg,#477467 0px,#477467 2px,#3c695e 2px,#3c695e 5px);border:1px solid #9bb3a0;box-shadow:inset 0 0 0 3px #326354,0 2px 3px #001c2450}.card.down:after{content:'';position:absolute;inset:6px;border:1px solid #c4d0ae33;border-radius:2px}.card.selected{background:#fff2bd;border:2px solid var(--gold);box-shadow:0 0 0 2px #edc87280;transform:translateY(-3px)}.card.hinted{box-shadow:0 0 0 3px var(--gold);background:#fff1bf}.table-bottom{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-top:18px;margin-top:12px;border-top:1px solid #a5cba01a}.foundations{display:flex;gap:7px}.foundation{width:32px;height:44px;display:grid;place-items:center;border:1px dashed #a7c39940;border-radius:4px;color:#a7c39935;font:23px Georgia}.foundation.done{background:#e9ddb7;color:#355443;border:1px solid var(--gold);box-shadow:0 2px 5px #002b2855}.deal{display:flex;gap:12px;align-items:center;text-align:left;font-size:12px;min-height:55px}.deal b{display:inline-block;margin-left:5px;font-size:10px;color:var(--gold)}.deal small{display:block;color:#9dbb9d;font-size:9px;margin-top:4px}.stock-pile{display:block;position:relative;width:50px;height:54px}.stock-pile i{position:absolute;top:0;left:0;width:36px;height:52px;background:repeating-linear-gradient(45deg,#477467 0,#477467 2px,#3c695e 2px,#3c695e 5px);border:1px solid #a4bba3;border-radius:4px;box-shadow:inset 0 0 0 3px #326354;display:grid;place-items:center;font:26px Georgia;color:#c1d0b8}.stock-pile i:nth-child(2){left:5px;top:2px}.stock-pile i:nth-child(3){left:10px;top:4px}.toolbar{display:flex;justify-content:center;gap:12px;padding-top:24px}.toolbar button{display:flex;align-items:center;justify-content:center;gap:9px;background:#1d493a;border:1px solid #a7bc9d2a;border-radius:10px;min-width:115px;padding:12px 16px;font-size:12px}.toolbar button span{font-size:23px;line-height:22px;color:#d4d9bc}.toolbar button:nth-child(3){background:#ddc58b;color:#244235;border-color:#ddc58b}.toolbar button:nth-child(3) span{color:inherit}footer{display:flex;justify-content:center;align-items:center;gap:7px;color:#83a38d;font-size:10px;padding:22px 0 24px}.save-dot{width:5px;height:5px;background:#8bae84;border-radius:50%}.footer-separator{margin:0 4px}.toast{position:fixed;left:50%;bottom:calc(28px + env(safe-area-inset-bottom));transform:translate(-50%,20px);background:#f2e8ce;color:#294236;border:1px solid #d6c187;padding:13px 19px;border-radius:11px;font-size:13px;z-index:20;max-width:90vw;width:max-content;box-shadow:0 6px 30px #0004;opacity:0;pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:translate(-50%,0)}dialog{color:#233f35;border:none;border-radius:22px;padding:0;width:min(460px,calc(100vw - 32px));background:#f4efe2;box-shadow:0 24px 100px #001c2499;max-height:88dvh;overflow:auto}dialog::backdrop{background:#062b27c9;backdrop-filter:blur(6px)}.modal-body{padding:30px}.modal-top{display:flex;justify-content:space-between;align-items:center}.modal-top button{font-size:25px;color:#78907c;padding:0 4px}.modal-icon{text-align:center;color:#2e5844;font:60px Georgia;margin:7px 0 8px}.modal-body h2{font-size:24px;margin:8px 0 10px;font-weight:600}.modal-body p{color:#6d7f70;line-height:1.8;font-size:13px;margin:9px 0 19px}.welcome{text-align:center}.welcome .eyebrow{color:#758571;letter-spacing:2px}.form-label{display:block;font-size:12px;text-align:left;margin:23px 0 8px}input{width:100%;border:1px solid #bdc7b6;background:#fffcf5;border-radius:9px;padding:13px;color:#294638;outline:none;font-size:16px}input:focus{border-color:#426e50;box-shadow:0 0 0 3px #78966d25}.primary{width:100%;background:#28583e;color:#fcf5e6;border-radius:9px;padding:14px;margin-top:15px;font-size:14px}.secondary{width:100%;border:1px solid #b3c1ab;color:#466347;border-radius:9px;padding:12px;margin-top:9px;font-size:13px}.fineprint{font-size:10px!important;line-height:1.6!important;margin-bottom:0!important}.form-error{font-size:12px;color:#aa473d;min-height:16px;margin-top:8px;text-align:left}.mode-options{display:grid;gap:10px;margin-top:22px}.mode-option{background:#fffaf0;border:1px solid #ced2bf;border-radius:12px;padding:16px;text-align:left;display:flex;align-items:center;gap:17px;color:#31533e}.mode-option>span{font:26px Georgia;min-width:59px}.mode-option strong{display:block;font-size:15px}.mode-option small{display:block;font-size:11px;margin-top:5px;color:#7f8b78}.mode-option.active{border-color:#5b7956;background:#e6ead7}.rules-list{padding-left:19px;font-size:13px;line-height:1.95;color:#5b715e}.rules-list li{margin-bottom:8px}.tabs{display:flex;background:#e6e7d9;border-radius:8px;padding:4px;gap:4px;margin:18px 0}.tabs button{flex:1;padding:9px 0;border-radius:6px;color:#6e806c;font-size:12px}.tabs .active{background:#fff9eb;color:#31543d;box-shadow:0 1px 4px #344b331a}.rank-row{display:grid;grid-template-columns:32px 1fr 65px;align-items:center;gap:9px;border-bottom:1px solid #dce0ce;padding:13px 2px}.rank-row .number{font:19px Georgia;color:#8b967d}.rank-row:nth-child(-n+3) .number{color:#b18b3b}.rank-row .name{font-size:13px;overflow-wrap:anywhere}.rank-row .name small{display:block;color:#8a957e;font-size:10px;margin-top:4px}.rank-row .points{text-align:right;font:21px Georgia;color:#315a3d}.rank-row.me{background:#e4e9d5;border-radius:7px}.rank-empty{text-align:center;padding:30px 10px;color:#86947b;font-size:13px;line-height:2}.rank-note{font-size:11px!important;margin:14px 0 0!important}.win-score{font:64px Georgia;color:#3e6347;margin:18px 0 0}.win-label{font-size:12px;color:#8b967f}.drag-ghost{position:fixed;pointer-events:none;z-index:50;opacity:.85;transform:rotate(-4deg);filter:drop-shadow(0 8px 8px #0005)}
@media(min-width:760px) and (min-height:850px){.board{min-height:400px}.intro{padding:38px 2px 30px}.toolbar{padding-top:28px}}
@media(max-width:600px){.app{padding:0 12px}header{height:74px}.brand{font-size:19px;gap:6px;letter-spacing:1px}.brand-mark{font-size:35px;width:34px}.brand small{font-size:7px;letter-spacing:2px}.header-actions{gap:13px}.rank-button{padding:8px 10px;font-size:11px}.rank-button span{font-size:16px}.icon-button{width:25px;height:25px;font-size:16px}.intro{padding:24px 2px 22px}.eyebrow{font-size:7px;letter-spacing:1.6px}h1{font-size:21px;letter-spacing:1px;margin-top:7px}.player{font-size:10px;max-width:35%}main{padding:17px 9px 14px;border-radius:14px}.stats{gap:16px}.stats div{min-width:31px}.stats strong{font-size:20px;letter-spacing:.3px}.stats small{font-size:9px}.mode-button{padding:9px 10px;font-size:10px;gap:6px}.chevron{margin:0}.table-meta{font-size:9px;margin:20px 1px 13px;gap:5px}.board{gap:3px;min-height:330px}.column:before{height:57px;border-radius:4px;font-size:20px}.card{height:57px;border-radius:4px;padding:3px 2px}.card .corner{font-size:15px;gap:0;line-height:17px;letter-spacing:-.5px;justify-content:space-between}.card .corner .suit{font-size:12px}.card .suit-large{font-size:21px;top:42%}.card .bottom-corner{display:none}.card.down{box-shadow:inset 0 0 0 2px #326354}.card.down:after{inset:4px}.table-bottom{gap:8px;margin-top:9px;padding-top:14px}.foundations{gap:4px}.foundation{width:21px;height:31px;font-size:16px}.deal{gap:6px;font-size:10px;min-height:44px;padding:0}.deal small{font-size:8px}.stock-pile{width:35px;height:41px}.stock-pile i{width:25px;height:36px;font-size:19px}.stock-pile i:nth-child(2){left:4px}.stock-pile i:nth-child(3){left:8px}.toolbar{gap:8px;padding-top:18px}.toolbar button{min-width:0;flex:1;padding:10px 0;font-size:11px;gap:5px;border-radius:9px}.toolbar button span{font-size:21px}footer{font-size:9px;padding:19px 0 calc(18px + env(safe-area-inset-bottom))}.modal-body{padding:25px}.modal-body h2{font-size:22px}}
@media(max-width:360px){.app{padding:0 8px}main{padding:14px 6px}.board{gap:2px}.card .corner{font-size:14px}.stats{gap:11px}.foundation{width:18px}.foundations{gap:3px}.player{font-size:9px}.intro h1{font-size:19px}}
@media(orientation:landscape) and (max-height:550px){header{height:53px}.intro{display:none}main{margin-top:12px}.board{min-height:190px}.table-meta{margin:10px 0}.toolbar{padding-top:12px}footer{padding:10px 0}.card{height:80px}.column:before{height:80px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.card .corner{position:absolute;top:5px;left:6px;right:6px}
@media(max-width:600px){.card .corner{top:3px;left:2px;right:2px}}
@media(max-width:360px){.card .corner{font-size:12px}.card .corner .suit{font-size:10px}}