:root{font-family:ui-rounded,'PingFang TC','Microsoft JhengHei',sans-serif;color:#57394b;background:#fff6fa;font-size:16px;--accent:#b5386a;--soft:#ffe1ed}*{box-sizing:border-box}body{margin:0}button,select{font:inherit;color:inherit}button,a,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:1px solid #e5bdcc;background:white;border-radius:12px;padding:10px 15px;touch-action:manipulation}button:hover{background:var(--soft)}button:disabled{opacity:.5;cursor:default}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #7c59a4;outline-offset:3px}a{color:var(--accent);text-decoration:none}nav{max-width:1050px;margin:auto;padding:22px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{font-weight:800}main{max-width:1050px;margin:0 auto;padding:8px 20px 40px}h1{font-size:clamp(1.7rem,4vw,2.4rem);margin:12px 0}p{line-height:1.7}.subtitle{margin:0 0 20px;color:#795567}.toolbar{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin:16px 0}.toolbar label{display:flex;align-items:center;gap:8px}select{border:1px solid #d8aabf;border-radius:10px;background:white;padding:10px}.primary{background:var(--accent);color:white;border-color:var(--accent)}.primary:hover{background:#91365b}.status{background:white;border:1px solid #edcddd;border-radius:16px;padding:15px 18px;min-height:58px;margin:16px 0;line-height:1.5}.stats{display:flex;gap:12px;flex-wrap:wrap}.stat{padding:10px 16px;background:var(--soft);border-radius:12px;font-weight:700}.rules{background:#fff;border:1px solid #f0d4e0;border-radius:18px;padding:14px 20px;margin-top:20px}.rules summary{cursor:pointer;font-weight:700}.rules li{line-height:1.8}footer{font-size:.875rem;text-align:center;color:#795567;margin-top:30px}.memory-board{max-width:640px;display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:22px auto}.memory-card{aspect-ratio:1.15;font-size:clamp(1.8rem,6vw,3rem);border:2px solid #f3c88c;background:#fff0d8;box-shadow:0 4px 0 #efd4ad;transition:transform .15s,background .15s}.memory-card.shown{background:white;transform:translateY(2px);box-shadow:0 2px 0 #efd4ad}.memory-card.matched{background:#e7f3df;border-color:#9ebc86;opacity:.75}.active-turn{outline:2px solid var(--accent)}.solitaire{padding:20px;border:1px solid #b2d2c3;background:#e5f4ec;border-radius:24px;overflow:auto}.card-row,.tableau{display:grid;grid-template-columns:repeat(7,minmax(46px,1fr));gap:10px;min-width:340px}.card-row{margin-bottom:26px}.card,.slot{width:100%;aspect-ratio:2/2.8;min-height:64px;border-radius:9px;display:flex;align-items:flex-start;justify-content:flex-start;padding:7px;font-weight:800;font-size:clamp(.85rem,2.5vw,1.2rem);border:1px solid #c8b7bc;background:#fff;position:relative;box-shadow:0 2px 3px #68435615}.card::after{content:attr(data-suit);position:absolute;inset:35% 0 0;text-align:center;font-size:1.45em}.card.red{color:#bd3456}.card.black{color:#3f425d}.card.back{background:repeating-linear-gradient(45deg,#ffe0eb 0 8px,#fff1f7 8px 16px);align-items:center;justify-content:center;color:#b13969}.card.back::after{content:none}.slot{background:#d2e8dc;border:2px dashed #9db6aa;color:#547a66;align-items:center;justify-content:center}.card.selected{outline:3px solid #a13975;outline-offset:1px;z-index:2}.column{position:relative;min-height:340px}.column>.card{margin-top:-85%;height:auto}.column>.card:first-child{margin-top:0}.column>.card.back{margin-top:-100%}.column>.card.back:first-child{margin-top:0}.peach-wrap{position:relative;max-width:540px;margin:auto}canvas{display:block;width:100%;height:auto;border:2px solid #ecc6d7;border-radius:22px;background:#fff0f6;touch-action:none}.touch-controls{display:flex;justify-content:space-between;gap:10px;margin:12px auto;max-width:540px}.touch-group{display:flex;align-items:center;gap:6px}.touch-group button{font-size:1.5rem;min-width:52px;min-height:50px;touch-action:none;user-select:none}.touch-group span{font-size:.875rem}.hint{font-size:.875rem;color:#795567}@media(max-width:550px){nav{padding:15px}main{padding:4px 12px 28px}.solitaire{padding:10px}.card-row,.tableau{gap:5px;min-width:310px}.column{min-height:260px}.card,.slot{padding:4px}.memory-board{gap:8px}.toolbar{gap:8px}.touch-group{gap:3px}.touch-group button{min-width:44px;padding:8px}.status{padding:12px}}
:where([hidden]){display:none!important}
.solitaire .card{touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.solitaire .card:not(.back){cursor:grab}.card-drag-ghost{position:fixed;z-index:1000;pointer-events:none;opacity:.94;filter:drop-shadow(0 8px 9px #57394b44)}.drag-origin{opacity:.3}.drop-ready{outline:3px solid #548c68!important;outline-offset:3px;background-color:#cee8d6!important}.card-drag-ghost .card{pointer-events:none;cursor:grabbing}
.card.playing-card::after{content:none}.card-corner{position:absolute;font-size:clamp(10px,1.5vw,16px);line-height:1;letter-spacing:-.5px;white-space:nowrap}.card-corner.top{top:5%;left:5%}.card-corner.bottom{bottom:5%;right:5%;transform:rotate(180deg)}.card-pips{position:absolute;inset:22% 16%;pointer-events:none}.pip{position:absolute;font-size:clamp(10px,2vw,24px);line-height:1}.face-rank{display:grid;place-items:center;font-size:clamp(15px,3vw,36px)}
.tiles-main{max-width:760px}.tile-board{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;padding:22px 16px;background:#fff0d8;border:1px solid #efcfa1;border-radius:24px;margin:18px auto;max-width:580px}.tile-stack{position:relative;height:88px}.fruit-tile{position:absolute;left:calc(var(--layer)*2px);top:calc(var(--layer)*-3px);width:calc(100% - 7px);height:76px;font-size:clamp(24px,6vw,40px);padding:0;border-radius:12px;border:2px solid #dab168;border-bottom:6px solid #c6a35b;background:#fffef3;box-shadow:0 2px 3px #70411222;touch-action:manipulation}.fruit-tile.covered{background:#ded4ae;color:#776b4a;opacity:1;filter:brightness(.85)}.fruit-tile:disabled:not(.covered){opacity:.8}.stack-count{position:absolute;right:0;bottom:0;background:#886137;color:#fff;font-size:12px;padding:2px 6px;border-radius:8px;z-index:5;pointer-events:none}.tray-panel{position:sticky;bottom:8px;z-index:10;background:#fff8ec;border:2px solid #d9a354;border-radius:18px;padding:12px;box-shadow:0 5px 16px #82532522;max-width:580px;margin:auto}.tray-panel>b{font-size:14px}.tile-tray{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-top:10px}.tray-slot{aspect-ratio:1;display:grid;place-items:center;border-radius:9px;background:#eedaba;font-size:clamp(22px,5vw,35px);min-width:0}@media(max-width:480px){.tile-board{gap:8px;padding:18px 8px}.tile-stack{height:68px}.fruit-tile{height:58px}.tile-tray{gap:4px}}
@media(max-width:600px){.touch-controls{flex-wrap:wrap}.touch-group{flex:1 1 200px;justify-content:center}.touch-group button{min-width:48px}.touch-group span{min-width:50px}}.flying-card{box-shadow:0 8px 18px #57394b44;user-select:none}
.tiles-main #tile-board{position:relative;display:block;aspect-ratio:1;width:100%;max-width:580px;padding:0;margin:20px auto 28px;isolation:isolate;background:radial-gradient(ellipse at center,#fffaf0,#f6e1b6)}.tile-board .pyramid-tile{border:1px solid #d5b574;border-radius:10px;background:linear-gradient(#fffef4,#fff7dc);box-shadow:0 6px 0 #c19b45,0 7px 0 1px #997b3b,2px 9px 5px #77552855;display:grid;place-items:center;font-size:clamp(26px,6.5vw,44px);line-height:1;transition:filter .12s;user-select:none}.tile-board .pyramid-tile.covered{filter:brightness(.73) saturate(.65);opacity:1;background:#ede4c8;box-shadow:0 6px 0 #8f7947,0 7px 0 1px #827049,2px 9px 4px #55452044}.tile-board .pyramid-tile:not(:disabled):hover{filter:brightness(1.06)}.tile-board .pyramid-tile:not(:disabled):active{filter:brightness(1.12)}@media(max-width:430px){.tile-board .pyramid-tile{font-size:27px;border-radius:8px;box-shadow:0 5px 0 #c19b45,0 6px 0 1px #997b3b,1px 7px 3px #77552844}}
.peach-storybook{background:#f8f4eb;color:#68544a;--accent:#987369;--soft:#efe4d6}.peach-storybook canvas{border-color:#cbbbab;background:#fbf7ef}.peach-storybook .status,.peach-storybook .rules{border-color:#dfd1c0;background:#fffdf8}.peach-storybook button,.peach-storybook select{border-color:#cdb8a6}.peach-storybook .primary{background:#987369}.peach-storybook .primary:hover{background:#806157}.peach-storybook .stat{background:#efe4d6}.peach-storybook h1{color:#78594f}

/* A fixed footprint keeps tile size constant throughout all levels. */
.tiles-main #tile-board{max-width:480px;container-type:inline-size;background:linear-gradient(#fffdf1d9,#fffaf0dd),url('/storybook-background.webp?v=81d20338c1ac') center/cover;border-color:#cebea3}
.tile-board .pyramid-tile{font-size:10.6cqw;border-radius:8px;background:linear-gradient(#fffef9,#f6ecd9);text-shadow:0 1px 2px #74523015}
.tiles-main .tray-panel{max-width:480px;background:#fffaf0;border-color:#cdb896}
.tiles-main .tray-slot{background:#eee4d2}

/* Larger readable ranks and full-width seven-column mobile table. */
@media(max-width:600px){
 .solitaire-page main{padding-left:5px;padding-right:5px}.solitaire-page .solitaire{padding:5px 2px;border-radius:12px}
 .solitaire-page .card-row,.solitaire-page .tableau{grid-template-columns:repeat(7,minmax(0,1fr));gap:2px;min-width:0}
 .solitaire-page .card,.solitaire-page .slot{padding:2px;border-radius:5px;min-height:60px;font-size:14px}
 .solitaire-page .card-corner{font-size:clamp(14px,4.1vw,20px);font-weight:900;letter-spacing:-1px}
 .solitaire-page .pip{font-size:clamp(12px,3.5vw,18px)}.solitaire-page .face-rank{font-size:clamp(19px,5.6vw,28px);font-weight:900}
 .solitaire-page .card-pips{inset:27% 18%}.solitaire-page .card-row{margin-bottom:16px}
 .solitaire-page .card-corner.top{top:3px;left:2px}.solitaire-page .card-corner.bottom{bottom:3px;right:2px}
}

@media(max-width:700px){.card-corner .corner-suit{display:none}.solitaire-page .card-corner{letter-spacing:0}.solitaire-page .card-pips{inset:28% 20%}.solitaire-page .face-rank{font-size:clamp(18px,5vw,26px)}}