*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--felt: #008080;--felt-dk:#006060;--font: "Segoe UI", system-ui, sans-serif;--card-w: clamp(58px, 8.5vw, 90px);--card-h: calc(var(--card-w) * 1.4);--card-r: calc(var(--card-w) * .07);--off-dn: calc(var(--card-w) * .22);--off-up: calc(var(--card-w) * .32)}html,body{height:100%}body{background:var(--felt);color:#fff;font-family:var(--font);min-height:100vh;padding-bottom:10px}.app{width:100%}.hero-tagline{background:#1a1a2e;border-bottom:3px solid #e63946;padding:8px 24px;text-align:center;display:flex;flex-wrap:wrap;align-items:baseline;justify-content:center;gap:0 12px}.hero-main{font-size:1.3rem;font-weight:900;color:#e63946;letter-spacing:-.3px;line-height:1.4;text-transform:uppercase}.hero-sub{font-size:1.1rem;font-weight:700;color:#fff}.hero-cta{font-size:.78rem;color:#aaa;font-style:italic;width:100%;line-height:1.2;padding-bottom:2px}.banner{display:flex;align-items:center;gap:14px;background:silver;border-bottom:3px solid #808080;padding:8px 20px;margin-bottom:12px;color:#000}.banner-logo{font-size:1.6rem;flex-shrink:0}.banner-text{flex:1}.banner-title{font-size:.9rem;font-weight:800;color:navy;margin-bottom:2px}.banner-sub{font-size:.78rem;color:#333;line-height:1.4}.banner-sub strong{color:#060;font-size:.88rem;font-weight:800}.banner-badge{flex-shrink:0;background:navy;border:2px solid #c0c0c0;border-radius:4px;padding:5px 12px;text-align:center;font-size:1.4rem;font-weight:900;color:#fff;line-height:1.1;min-width:80px}.banner-badge span{display:block;font-size:.55rem;font-weight:400;color:#a0c0ff;text-transform:uppercase;letter-spacing:.5px}.board{padding:0 16px;-webkit-user-select:none;user-select:none;height:530px;overflow:hidden}.top-row{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:14px}.top-left,.top-right{display:flex;gap:12px;align-items:flex-start}.pile-wrap{position:relative;cursor:pointer;flex-shrink:0}.pile-wrap.foundation{cursor:default}.pile-count{position:absolute;bottom:-20px;left:0;right:0;text-align:center;font-size:.7rem;color:#ffffff73;white-space:nowrap}.card{width:var(--card-w);height:var(--card-h);border-radius:var(--card-r);flex-shrink:0;position:relative}.card-face{background:#fff;border:1px solid #bbb;box-shadow:2px 2px 5px #0006}.card-face.red{color:#c00}.card-face.black{color:#111}.card-back{background-color:navy;background-image:linear-gradient(45deg,#0000aa 25%,transparent 25%),linear-gradient(-45deg,#0000aa 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#0000aa 75%),linear-gradient(-45deg,transparent 75%,#0000aa 75%);background-size:8px 8px;background-position:0 0,0 4px,4px -4px,-4px 0;border:2px solid #000066;box-shadow:2px 2px 4px #00000080}.card-empty{border:2px solid rgba(0,0,0,.3);background:#00000026;border-radius:var(--card-r);display:flex;align-items:center;justify-content:center;font-size:calc(var(--card-w) * .3);color:#00000059}.corner{position:absolute;display:flex;flex-direction:column;align-items:center;line-height:1;padding:calc(var(--card-w) * .05) calc(var(--card-w) * .07)}.corner.tl{top:0;left:0}.corner.br{bottom:0;right:0;transform:rotate(180deg)}.rnk{font-size:calc(var(--card-w) * .18);font-weight:800}.sym{font-size:calc(var(--card-w) * .13)}.center-sym{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:calc(var(--card-w) * .35);line-height:1}.tableau{display:grid;grid-template-columns:repeat(7,var(--card-w));gap:calc((100% - 7 * var(--card-w)) / 6);align-items:start}.tableau-col{position:relative}.controls{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-top:10px;padding:10px 20px;background:silver;border-top:3px solid #ffffff;border-bottom:2px solid #808080;color:#000}.ctrl-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.btn{padding:6px 14px;font-size:.85rem;font-weight:700;border:none;border-radius:7px;cursor:pointer;transition:opacity .15s,transform .1s}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.4;cursor:default}.btn-secondary,.btn-primary,.btn-start,.btn-stop{background:silver;color:#000;border-top:2px solid #fff;border-left:2px solid #fff;border-bottom:2px solid #808080;border-right:2px solid #808080;border-radius:0}.btn:active{border-top:2px solid #808080;border-left:2px solid #808080;border-bottom:2px solid #fff;border-right:2px solid #fff;transform:none}.btn-start{background:navy;color:#fff;border-color:#6060c0 #000040 #000040 #6060c0}.btn-stop{background:maroon;color:#fff;border-color:#c06060 #400000 #400000 #c06060}.rank-select{padding:6px 10px;font-size:.85rem;font-weight:700;color:#000;background:silver;border-top:2px solid #808080;border-left:2px solid #808080;border-bottom:2px solid #fff;border-right:2px solid #fff;border-radius:0;cursor:pointer}.stats{display:flex;gap:16px}.stat{text-align:center}.stat-val{font-size:1.2rem;font-weight:800;color:navy;line-height:1}.stat-key{font-size:.68rem;color:#555;text-transform:uppercase;letter-spacing:.5px;margin-top:3px}.win-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000a6;display:flex;align-items:center;justify-content:center;z-index:100}.win-box{background:silver;border-top:3px solid #fff;border-left:3px solid #fff;border-bottom:3px solid #808080;border-right:3px solid #808080;padding:40px 52px;text-align:center}.win-title{font-size:2.2rem;font-weight:900;color:navy;margin-bottom:10px}.win-id{font-size:1rem;font-weight:700;color:navy;margin-bottom:6px}.win-sub{font-size:1rem;color:#333;margin-bottom:24px}.win-box.won .win-title{color:#060}.win-box.lost .win-title{color:maroon}.btn-next{background:navy;color:#fff;font-size:1.1rem;padding:12px 32px;border-top:2px solid #6060c0;border-left:2px solid #6060c0;border-bottom:2px solid #000040;border-right:2px solid #000040;border-radius:0;cursor:pointer;font-weight:700}.btn-next:active{border-top:2px solid #000040;border-left:2px solid #000040;border-bottom:2px solid #6060c0;border-right:2px solid #6060c0}.case-id{font-family:Courier New,monospace;color:navy;font-size:1rem}.stat-pos{color:#060}.stat-neg{color:maroon}.case-log{margin:24px 24px 0;background:silver;border-top:3px solid #fff;border-left:3px solid #fff;border-bottom:3px solid #808080;border-right:3px solid #808080;padding:16px 20px}.log-title{font-size:.85rem;font-weight:800;color:navy;text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px}.log-list{display:flex;flex-direction:column;gap:4px}.log-entry{display:flex;gap:16px;align-items:center;font-size:.8rem;padding:4px 8px;background:#fff;border:1px solid #bbb}.log-entry.positive{border-left:4px solid #006600}.log-entry.negative{border-left:4px solid #800000}.log-id{font-family:Courier New,monospace;color:navy;flex-shrink:0}.log-result{flex:1;color:#333}.log-moves{flex-shrink:0;color:#555;font-size:.75rem}.footer{margin-top:20px;padding:10px 28px;font-size:.72rem;color:#ffffff8c;text-align:center;border-top:1px solid rgba(255,255,255,.15)}