:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--lane:44px;--card-w:40px;--card-h:56px;--gap:1px;--hidden-step:9px;--face-step:22px;--accent:#f1c96b;--felt:#174a3b;--felt-dark:#0d3027;--panel:#112f29;--ink:#f7fbf8;--muted:#b9d6cc}
*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#0b251f;color:var(--ink)}body{padding:max(2px,env(safe-area-inset-top)) max(2px,env(safe-area-inset-right)) max(2px,env(safe-area-inset-bottom)) max(2px,env(safe-area-inset-left));user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}button,select,input{font:inherit}button{color:inherit}button:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
html[data-theme="midnight"]{--felt:#263c65;--felt-dark:#121d38;--panel:#17213b;--accent:#92c5ff;--muted:#c7d6ee}
html[data-motion-profile="instant"] *{scroll-behavior:auto!important;animation-duration:.001ms!important;transition-duration:.001ms!important}
.app{height:100%;max-width:1200px;margin:0 auto;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;gap:4px}.app>*{min-width:0}.topbar{min-height:46px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:2px 4px}.brand{display:flex;align-items:center;gap:8px;min-width:0}.brand-mark{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:linear-gradient(145deg,#d7b359,#80651e);color:#10271f;font-size:1.4rem;box-shadow:0 4px 12px rgba(0,0,0,.35)}.brand div{display:grid;min-width:0}.brand div>span{font-size:.64rem;text-transform:uppercase;letter-spacing:.1em;color:#a9d3c5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.brand strong{font-size:clamp(1rem,3.8vw,1.35rem);white-space:nowrap}.header-actions{display:flex;gap:4px}.icon-button,.toolbar button,.pile-action,.pile-target,.tableau-target,.rail-open,#dialogClose,#railClose,.dialog-actions button{min-width:44px;min-height:44px;border:1px solid #528d7b;border-radius:10px;background:#16463b;cursor:pointer}.icon-button{font-size:1rem;padding:0}.icon-button[aria-pressed="true"]{background:#694531}
.control-band{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px;align-items:center}.hud{display:grid;grid-template-columns:repeat(4,minmax(54px,1fr));gap:3px}.hud div{min-height:42px;border:1px solid #356c5c;border-radius:9px;background:rgba(16,54,46,.88);padding:4px 6px;display:grid;align-content:center}.hud span{font-size:.58rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.hud strong{font-size:.96rem}.toolbar{display:flex;gap:3px;overflow-x:auto;scrollbar-width:none}.toolbar::-webkit-scrollbar{display:none}.toolbar button{padding:0 10px;white-space:nowrap}.toolbar button:disabled{opacity:.42;cursor:not-allowed}
.board{position:relative;min-height:0;overflow:hidden;border:1px solid #3d7465;border-radius:13px;background:radial-gradient(circle at 50% -20%,color-mix(in srgb,var(--felt) 88%,white),var(--felt) 42%,var(--felt-dark));padding:4px 2px;touch-action:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 8px 22px rgba(0,0,0,.25)}.top-row{height:calc(var(--card-h) + 7px);display:grid;grid-template-columns:repeat(7,var(--lane));justify-content:center;gap:var(--gap);margin-bottom:3px}.top-spacer{width:var(--lane)}.pile-slot{position:relative;width:var(--lane);height:var(--card-h);min-width:44px;min-height:44px;border:1px dashed rgba(198,231,221,.5);border-radius:7px;background:rgba(3,30,24,.28)}.card-pile{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:visible}.card-pile .playing-card{pointer-events:auto;transform:translateX(calc(-50% + var(--pile-shift,0px)))}.pile-action,.pile-target{position:absolute;inset:0;width:100%;height:100%;padding:0;background:rgba(20,65,54,.58);font-weight:800}.pile-action{z-index:80}.pile-action span{display:grid;place-items:center;position:absolute;right:1px;bottom:1px;min-width:17px;height:17px;border-radius:8px;background:#f0ce79;color:#10271f;font-size:.58rem}.pile-caption{position:absolute;left:0;right:0;bottom:-15px;text-align:center;color:var(--muted);font-size:.52rem}.foundation-slot .pile-target{z-index:1;font-size:1.25rem;color:#e7f5ef}.pile-target.red{color:#f38994}.board.has-selection .foundation-slot.is-legal-target{box-shadow:inset 0 0 0 2px var(--accent)}.board.has-selection .foundation-slot.is-legal-target .pile-target{background:rgba(54,105,86,.84)}
.tableau{height:calc(100% - var(--card-h) - 10px);min-height:178px;display:grid;grid-template-columns:repeat(7,var(--lane));justify-content:center;gap:var(--gap)}.tableau-column{position:relative;width:var(--lane);height:100%;min-width:44px;border-radius:7px;background:rgba(1,23,18,.18)}.tableau-column.is-drop-target{box-shadow:inset 0 0 0 3px var(--accent);background:rgba(241,201,107,.09)}.foundation-slot.is-drop-target{box-shadow:inset 0 0 0 3px var(--accent)}.foundation-slot.is-drop-target .pile-target{background:rgba(54,105,86,.92)}.column-number{position:absolute;top:0;left:0;right:0;text-align:center;font-size:.52rem;color:#82bcaa;pointer-events:none}.tableau-stack{position:absolute;inset:14px 0 8px}.playing-card{position:absolute;left:50%;width:var(--lane);height:var(--card-h);min-width:44px;border:0;background:transparent;padding:0;transform:translateX(-50%);cursor:pointer;touch-action:none}.playing-card:disabled{cursor:default}.card-face{position:absolute;top:0;left:50%;width:var(--card-w);height:var(--card-h);transform:translateX(-50%);overflow:hidden;border-radius:6px;border:1px solid #cfd8d5;background:#fff;box-shadow:0 2px 5px rgba(0,0,0,.32)}.card-art{position:absolute;inset:0;display:block;background-image:url("assets/cards-atlas.png");background-repeat:no-repeat;background-size:1300% 400%;background-position:var(--sprite-x) var(--sprite-y);background-color:#fff}.playing-card.face-down .card-face{background:repeating-linear-gradient(45deg,#315f56 0 5px,#1f443c 5px 10px);border-color:#9ac5b8}.playing-card.face-down .card-art{display:none}.playing-card.is-selected .card-face{box-shadow:0 0 0 3px var(--accent),0 8px 13px rgba(0,0,0,.38);transform:translate(-50%,-5px)}.playing-card.is-run .card-face{box-shadow:0 0 0 2px var(--accent),0 5px 9px rgba(0,0,0,.35)}.playing-card.is-hint .card-face{animation:hintPulse .85s ease-in-out 2}.tableau-target,.rail-open{position:absolute;left:0;width:100%;height:44px;padding:0 1px;font-size:.53rem}.tableau-target{bottom:4px;opacity:0;pointer-events:none;background:#245d4d}.board.has-selection .tableau-column.is-legal-target .tableau-target{opacity:1;pointer-events:auto}.tableau-column.is-legal-target{box-shadow:inset 0 0 0 2px var(--accent);background:rgba(241,201,107,.07)}.rail-open{display:none;bottom:1px;color:#d9eee8;font-size:.66rem;font-weight:800}
.drag-ghost{position:fixed;left:0;top:0;z-index:100;overflow:visible;pointer-events:none;display:none;will-change:transform;contain:layout;transform:translate3d(0,0,0)}.drag-ghost:not([hidden]){display:block}.drag-ghost-card{position:absolute;left:0;width:100%;height:var(--card-h);overflow:hidden;border-radius:6px;border:2px solid var(--accent);background-color:#fff;background-image:url("assets/cards-atlas.png");background-repeat:no-repeat;background-size:1300% 400%;background-position:var(--sprite-x) var(--sprite-y);box-shadow:0 7px 18px rgba(0,0,0,.42)}.drag-ghost.is-touch .drag-ghost-card{box-shadow:0 9px 22px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.22)}.drag-ghost.has-run::after{content:attr(data-run-size);position:absolute;right:-8px;top:-9px;z-index:30;display:grid;place-items:center;min-width:23px;height:23px;padding:0 4px;border-radius:12px;background:var(--accent);color:#10271f;font-size:.72rem;font-weight:900;box-shadow:0 2px 6px rgba(0,0,0,.35)}
.status-bar{min-height:31px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:1px 5px;color:var(--muted);font-size:.7rem}.status-bar p{margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.status-bar #statusMessage{color:var(--ink);flex:1}.status-bar #statusMessage[data-tone="success"]{color:#dff5e9}.status-bar #statusMessage[data-tone="error"]{color:#ffc5c5}.keyboard-hint{font-size:.62rem}.game-tip{position:fixed;z-index:130;right:max(8px,env(safe-area-inset-right));bottom:max(36px,calc(env(safe-area-inset-bottom) + 36px));display:none;gap:6px;align-items:flex-start;max-width:min(68vw,300px);padding:7px 10px;border:1px solid #80bda9;border-radius:10px;background:#143c33;box-shadow:0 6px 18px rgba(0,0,0,.3);font-size:.76rem;line-height:1.3;opacity:0;transform:translateY(8px);transition:opacity .2s,transform .2s;cursor:pointer}.game-tip:not([hidden]){display:flex}.game-tip.is-visible{opacity:1;transform:translateY(0)}.game-tip.is-fading{opacity:0;pointer-events:none}
.app-dialog{width:min(94vw,620px);max-height:min(90vh,760px);border:1px solid #73b39f;border-radius:15px;background:#102f28;color:var(--ink);padding:0}.app-dialog::backdrop{background:rgba(1,14,11,.76)}.app-dialog article{display:grid;grid-template-rows:auto minmax(0,1fr) auto;max-height:inherit;padding:12px}.app-dialog header{display:flex;align-items:center;justify-content:space-between;gap:8px}.app-dialog header span{font-size:.62rem;text-transform:uppercase;letter-spacing:.12em;color:#a9d3c5}.app-dialog h2{margin:2px 0 0;font-size:1.2rem}.dialog-content{overflow:auto;padding:10px 1px;line-height:1.45}.dialog-content p{margin:.4rem 0}.dialog-content ul{padding-left:1.25rem}.dialog-lead{color:#dceee8}.dialog-actions{display:flex;justify-content:flex-end;gap:6px;flex-wrap:wrap}.dialog-actions button{padding:0 14px}.dialog-actions .primary{background:#d7b65e;color:#10271f;border-color:#f3d988;font-weight:800}.dialog-actions .danger{background:#6b352e}.settings-grid{display:grid;gap:8px}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;border-bottom:1px solid #315e52}.setting-row span{display:grid}.setting-row small{color:var(--muted)}select{min-height:44px;border:1px solid #5a9583;border-radius:8px;background:#173e35;color:var(--ink);padding:0 8px}.toggle{width:48px;height:28px}.stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}.stats-grid div{border:1px solid #35695b;border-radius:9px;padding:8px}.stats-grid span{display:block;color:var(--muted);font-size:.7rem}.rail-options{display:grid;gap:6px;overflow:auto;padding:8px 0}.rail-option{min-height:44px;border:1px solid #5f9d8b;border-radius:9px;background:#194a3f;color:var(--ink);text-align:left;padding:8px 12px;cursor:pointer}
.mode-picker{display:grid;gap:10px}.mode-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.mode-choice{min-height:112px;border:1px solid #5f9d8b;border-radius:12px;background:#153f36;color:var(--ink);padding:9px;display:grid;grid-template-columns:112px minmax(0,1fr);align-items:center;gap:8px;text-align:left;cursor:pointer}.mode-choice:hover,.mode-choice:focus-visible{background:#1b5144}.mode-choice.is-current{box-shadow:inset 0 0 0 2px var(--accent)}.mode-choice-copy{display:grid;gap:3px}.mode-choice-copy strong{font-size:.92rem}.mode-choice-copy small{color:var(--muted);line-height:1.25}.mode-choice-copy em{font-size:.67rem;color:#f3d988;font-style:normal}.mode-demo{position:relative;display:block;width:104px;height:62px}.demo-stock-back{position:absolute;left:2px;top:8px;width:34px;height:48px;border-radius:5px;border:1px solid #9ac5b8;background:repeating-linear-gradient(45deg,#315f56 0 4px,#1f443c 4px 8px)}.demo-waste-cards{position:absolute;left:45px;top:8px;width:58px;height:48px}.tutorial-card{position:absolute;display:block;width:34px;height:48px;border-radius:5px;border:1px solid #d7dfdc;background:#fff url("assets/cards-atlas.png") no-repeat;background-size:1300% 400%;background-position:var(--sprite-x) var(--sprite-y);box-shadow:0 2px 5px rgba(0,0,0,.32)}.demo-waste-cards .tutorial-card:nth-child(1){left:0}.demo-waste-cards .tutorial-card:nth-child(2){left:9px}.demo-waste-cards .tutorial-card:nth-child(3){left:18px}.mode-demo.draw1 .demo-waste-cards .tutorial-card{left:10px}
.tutorial{display:grid;gap:9px}.tutorial-progress{display:flex;justify-content:center;gap:7px;min-height:10px}.tutorial-progress span{display:block;width:8px;height:8px;border-radius:50%;background:#47786a}.tutorial-progress span.is-active{width:24px;border-radius:5px;background:var(--accent)}.tutorial-paged .tutorial-step{min-height:250px}.tutorial-step{display:grid;grid-template-columns:minmax(0,1fr) 190px;gap:10px;align-items:center;padding:8px;border:1px solid #315e52;border-radius:12px;background:rgba(20,63,54,.58)}.tutorial-copy{display:grid;grid-template-columns:28px minmax(0,1fr);gap:7px}.tutorial-copy>span{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--accent);color:#10271f;font-weight:900}.tutorial-copy strong{display:block}.tutorial-copy p{margin:.2rem 0 0;color:var(--muted);font-size:.8rem;line-height:1.35}.tutorial-scene{position:relative;height:104px;border-radius:10px;background:rgba(3,28,23,.7);overflow:hidden}.tutorial-run-scene .tutorial-destination{position:absolute;right:20px;top:9px;width:34px;height:48px}.tutorial-run-scene .tutorial-destination .tutorial-card{left:0;top:0}.tutorial-moving-run{position:absolute;left:16px;top:10px;width:34px;height:78px;animation:tutorialRunMove 2.7s ease-in-out infinite}.tutorial-moving-run .tutorial-card:first-child{left:0;top:0}.tutorial-moving-run .tutorial-card:last-child{left:0;top:24px}.tutorial-motion-arrow{position:absolute;left:50%;top:43%;transform:translate(-50%,-50%);color:var(--accent);font-weight:900;font-size:1.1rem}.tutorial-foundation-scene .tutorial-card:nth-child(1){left:20px;top:28px}.tutorial-foundation-scene .tutorial-card:nth-child(2){left:58px;top:28px}.tutorial-foundation-scene .tutorial-card:nth-child(3){left:96px;top:28px}.tutorial-foundation-scene .tutorial-motion-arrow{left:50%;top:10px;width:100%;text-align:center;font-size:.72rem}.tutorial-stock-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}.tutorial-stock-option{min-width:0;border:1px solid #315e52;border-radius:9px;padding:4px;display:grid;justify-items:center}.tutorial-stock-option.is-active{box-shadow:inset 0 0 0 2px var(--accent)}.tutorial-stock-option strong{font-size:.72rem}.tutorial-stock-option .mode-demo{transform:scale(.78);transform-origin:center;margin:-5px 0}.tutorial-stock-option small{font-size:.58rem;color:var(--muted);text-align:center;line-height:1.2}.tutorial-note{font-size:.72rem;color:#d9eee8;border-left:3px solid var(--accent);padding-left:8px}
@keyframes hintPulse{50%{transform:translateX(-50%) translateY(-7px);filter:brightness(1.15)}}@keyframes tutorialRunMove{0%,18%{transform:translate(0,0)}55%,78%{transform:translate(105px,22px)}100%{transform:translate(0,0)}}
html[data-motion-profile="instant"] .tutorial-moving-run{animation:none;transform:translate(105px,22px)}
@media (prefers-reduced-motion:reduce){html:not([data-motion="swift"]):not([data-motion="full"]) *{scroll-behavior:auto!important;animation-duration:.001ms!important;transition-duration:.001ms!important}.tutorial-moving-run{animation:none!important;transform:translate(105px,22px)}}
@media(max-width:720px){.control-band{grid-template-columns:1fr}.toolbar{justify-content:stretch}.toolbar button{flex:1}.keyboard-hint{display:none}.mode-grid{grid-template-columns:1fr}.tutorial-step{grid-template-columns:1fr}.tutorial-scene{height:92px}.tutorial-run-scene,.tutorial-foundation-scene{max-width:260px;width:100%;justify-self:center}}
@media(max-width:480px){.toolbar{overflow-x:visible}.toolbar button{min-width:0;padding:0 5px;font-size:.92rem}.toolbar #autoFinishButton span,.toolbar #newDealButton span{font-size:0}.toolbar #autoFinishButton span::after{content:"Finish";font-size:.92rem}.toolbar #newDealButton span::after{content:"Deal";font-size:.92rem}.app-dialog article{padding:9px}.mode-choice{min-height:96px;grid-template-columns:98px 1fr;padding:7px}.mode-demo{transform:scale(.9);transform-origin:left center}.tutorial{gap:6px}.tutorial-step{padding:6px}.tutorial-copy p{font-size:.74rem}.tutorial-stock-option .mode-demo{transform:scale(.68);margin:-9px 0}.tutorial-note{margin:.2rem 0!important}}
@media(max-width:360px){.app{gap:2px}.topbar{min-height:42px;gap:3px}.brand{gap:5px;flex:1;min-width:0}.brand-mark{width:34px;height:34px;flex:0 0 34px}.brand strong{display:none}.brand div>span{display:block;font-size:.52rem;letter-spacing:.04em;max-width:82px}.header-actions{gap:1px}.icon-button{min-width:44px;min-height:44px}.control-band{gap:2px}.hud div{min-height:32px;padding:2px 4px}.hud span{display:block;font-size:.48rem;letter-spacing:.04em}.hud strong{font-size:.8rem}.toolbar button{min-height:44px;min-width:44px;padding:0 7px}.toolbar button span{display:none}.board{border-radius:8px;padding-top:2px}.tableau-column.has-run-choice .tableau-stack{bottom:48px}.tableau-column.has-run-choice .tableau-target{bottom:48px}.tableau-column.has-run-choice .rail-open{display:block}.status-bar{font-size:.62rem}.game-tip{bottom:max(76px,calc(env(safe-area-inset-bottom) + 76px));max-width:min(72vw,230px);font-size:.7rem;padding:6px 8px}.pile-caption{display:none}.mode-choice{grid-template-columns:86px 1fr}.mode-demo{transform:scale(.78)}.mode-choice-copy strong{font-size:.82rem}.mode-choice-copy small{font-size:.66rem}.mode-choice-copy em{font-size:.6rem}}
@media(max-height:650px){.keyboard-hint{display:none}.topbar{min-height:38px}.brand-mark{width:34px;height:34px}.hud div{min-height:34px}.hud span{display:block;font-size:.48rem;letter-spacing:.04em}.toolbar button{min-height:44px}.status-bar{min-height:24px}.top-row{margin-bottom:1px}.board{border-radius:8px}}@media(max-height:650px) and (min-width:361px){.brand div>span{display:none}}