*{box-sizing:border-box}html{background:#f5faf5}body.new-game-page{margin:0;min-height:100vh;background:radial-gradient(circle at 85% 18%,#e7f9df 0,transparent 34%),linear-gradient(#f5fbf7,#eef6f6);color:#173b36;font-family:system-ui,-apple-system,'Segoe UI',sans-serif}button,select{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:3px solid #eeaa16;outline-offset:2px}body .game-main{width:min(1160px,100% - 24px);margin:18px auto 38px}.game-title{display:flex;justify-content:space-between;align-items:center;min-height:145px;padding:14px 28px;border:1px solid #b6dacd;border-radius:24px;background:linear-gradient(115deg,#e2f7da,#faf6d4 68%,#dbf0fc);box-shadow:0 10px 24px #16543a13;overflow:hidden}.game-title h1{margin:4px 0;color:#087b56;font-size:clamp(1.8rem,4.5vw,3.3rem);line-height:1.1}.game-title p{margin:0;font-weight:650}.eyebrow{color:#146660;font-size:.72rem;letter-spacing:.15em;font-weight:900}.title-mascot{display:flex;align-items:center;gap:8px}.title-mascot img{height:125px;width:106px;object-fit:contain}.title-mascot span{background:#fff;border:2px solid #8ccea9;border-radius:18px;padding:9px 12px;max-width:185px;box-shadow:0 5px 14px #0b5b4520;font-size:.88rem;font-weight:750}.game-shell{margin-top:14px;border:1px solid #d5e6dd;border-radius:22px;background:#fff;padding:14px;box-shadow:0 10px 28px #15334412;min-height:400px}.game-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 12px}.game-toolbar label{font-weight:800}.game-toolbar button,.game-toolbar select,.game-stage button.action{border:1px solid #a6cdb6;border-radius:12px;min-height:42px;padding:7px 13px;background:#effbf2;color:#155c3d;font-weight:750}.game-toolbar button:hover,.game-stage button.action:hover{background:#dbf5e1}.game-toolbar select{background:white}.game-toolbar #game-status{margin-left:auto;padding:5px 11px;border-radius:20px;background:#fff6d8;font-size:.86rem;font-weight:800}.game-stage{min-height:300px}.game-help,.reward-note{margin:12px 2px 0;color:#49625c;font-size:.88rem;line-height:1.45}.reward-note{font-size:.78rem;color:#6b6455}.result-banner{margin:10px 0;padding:12px;border-radius:12px;background:#e6f7e8;color:#085439;font-weight:900;text-align:center}.result-banner.error{background:#fff0ec;color:#8f3425}.game-stage canvas{display:block;max-width:100%;height:auto;margin:auto;border-radius:18px;touch-action:none}.game-stage .secondary{color:#4a5c56;font-size:.87rem}.game-stage .mascot-face{display:inline-block;width:28px;height:28px;object-fit:cover;object-position:center 18%;vertical-align:middle;border-radius:50%}
/* Klondike */
.sol-board{background:linear-gradient(145deg,#096c4d,#065338);border:9px solid #98693f;border-radius:20px;padding:clamp(6px,1.5vw,18px);min-height:610px;overflow-x:auto}.sol-top,.sol-table{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:clamp(3px,.8vw,12px);max-width:850px;margin-inline:auto}.sol-top{margin-bottom:28px}.sol-pile{position:relative;min-width:0;min-height:144px;border:2px dashed #ffffff55;border-radius:9px;cursor:pointer}.sol-pile.foundation{border-radius:9px}.sol-card{display:block;position:absolute;left:0;top:0;width:100%;height:144px;border-radius:9px;background:linear-gradient(150deg,#fffefb,#f8faf7);border:1px solid #cdd7d0;color:#1e3031;font-weight:900;box-shadow:0 4px 8px #00271940;user-select:none;touch-action:manipulation;text-align:left;padding:0}.sol-card.red{color:#c52242}.sol-card.back{background:repeating-linear-gradient(45deg,#095a4e 0 5px,#0c7259 5px 10px);border:5px double #ead994;overflow:hidden}.sol-card.back::after{content:"✦";position:absolute;inset:21% 17%;display:grid;place-items:center;border:2px solid #eedb96;border-radius:10px;color:#f8e5a1;background:#0e7256;font-size:1.8rem}.sol-card.face{background:linear-gradient(150deg,#fffdfa,#f5f7ee);box-shadow:inset 0 0 0 3px #e8d5a5,0 4px 8px #00271940}.sol-card.selected{outline:4px solid #ffe655;outline-offset:-3px}.sol-card .corner{position:absolute;left:8px;top:6px;display:flex;flex-direction:column;align-items:center;font-size:clamp(.92rem,1.6vw,1.28rem);line-height:1.02}.sol-card .corner.bottom{left:auto;top:auto;right:8px;bottom:6px;transform:rotate(180deg)}.sol-card .center-suit{position:absolute;inset:0;display:grid;place-items:center;font-size:clamp(2.1rem,4vw,3.8rem);font-weight:700;opacity:.89}.sol-card.face .center-suit{font-size:clamp(1.85rem,3.4vw,3.3rem)}.sol-card .court-rank{position:absolute;left:50%;top:63%;transform:translate(-50%,-50%);font-size:.8rem;letter-spacing:.04em}.sol-pile .pile-icon{position:absolute;inset:0;display:grid;place-items:center;color:#fff8;font-size:1.9rem;font-weight:800;pointer-events:none}.sol-meta{display:flex;gap:14px;flex-wrap:wrap;margin:0 0 10px;color:#f0ffdb;font-size:.86rem;font-weight:750}.sol-pile.tableau{min-height:360px}.sol-pile.tableau .sol-card{top:calc(var(--i)*30px)}.sol-pile.tableau .sol-card:not(.back){top:calc(var(--i)*34px)}
/* 10 by 10 block */
.block-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,240px);gap:22px;align-items:start;padding:14px;border-radius:20px;background:linear-gradient(145deg,#e9edf9,#f6eaff)}.block-board{display:grid;grid-template-columns:repeat(var(--size),1fr);gap:3px;width:min(100%,570px);aspect-ratio:1;background:#3d537b;border:8px solid #3d537b;border-radius:12px;touch-action:none}.block-cell,.mini-cell{border:0;border-radius:5px;background:#8294b5;min-width:0;min-height:0;padding:0}.block-cell.filled,.mini-cell.filled{background:linear-gradient(145deg,#ffdd74,#f47951);box-shadow:inset -3px -3px 2px #b74d75aa,inset 2px 2px 2px #ffffffaa}.block-cell.preview{background:#b9f8b1}.block-cell.invalid{background:#f89ca3}.block-side{display:grid;gap:12px}.block-piece{display:grid;place-items:center;min-height:96px;border:2px solid #bac2e7;border-radius:12px;background:#fff;touch-action:none}.block-piece.active{border-color:#24ab73;box-shadow:0 0 0 3px #24ab7355}.block-piece.empty{opacity:.35}.mini-grid{display:grid;gap:3px;width:65px;height:65px}.block-score{font-weight:900;color:#3e3079}.block-instructions{font-size:.85rem;color:#455970}
@media(max-width:700px){body .game-main{width:calc(100% - 16px);margin:9px auto 26px}.game-title{padding:9px 12px;min-height:100px;border-radius:16px}.game-title h1{font-size:1.62rem}.eyebrow{font-size:.59rem}.title-mascot img{width:62px;height:82px}.title-mascot span{display:none}.game-shell{padding:9px;border-radius:14px}.game-toolbar{gap:5px}.game-toolbar button,.game-toolbar select{min-height:38px;padding:5px 8px}.game-toolbar #game-status{margin-left:0}.sol-board{min-height:380px;border-width:5px}.sol-card{height:clamp(65px,17vw,95px);border-radius:5px}.sol-pile{min-height:clamp(65px,17vw,95px)}.sol-pile.tableau{min-height:230px}.sol-table,.sol-top{gap:3px}.sol-card .corner{font-size:clamp(.62rem,2.5vw,.85rem);left:3px;top:3px}.sol-card .corner.bottom{right:3px;bottom:3px}.sol-card .center-suit{font-size:clamp(1.25rem,5vw,2rem)}.sol-card.face .center-suit{font-size:clamp(1.15rem,4vw,1.75rem)}.sol-card .court-rank{font-size:.6rem}.sol-card.back::after{inset:20% 12%;font-size:1rem}.sol-pile.tableau .sol-card{top:calc(var(--i)*22px)}.sol-pile.tableau .sol-card:not(.back){top:calc(var(--i)*25px)}.block-layout{grid-template-columns:1fr;gap:10px;padding:5px}.block-side{grid-template-columns:repeat(3,1fr)}.block-piece{min-height:68px}.block-score,.block-instructions{grid-column:1/-1}.mini-grid{width:48px;height:48px}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}

.block-cell.filled.pho{background-image:url('/new-games/art/pho-block.webp'),linear-gradient(145deg,#f1eec4,#63d9aa);background-size:90% auto,cover;background-repeat:no-repeat;background-position:center 10%,center;box-shadow:inset 0 0 0 2px #e6f9cc,0 0 7px #fff8b3}
.game-shell button.action{border:1px solid #a6cdb6;border-radius:12px;min-height:42px;padding:7px 13px;background:#effbf2;color:#155c3d;font-weight:750}
.game-shell button.action:hover{background:#dbf5e1}
.new-game-page .site-footer a{color:#e5ffec}
/* Keep the playfields readable on wide screens without altering their touch geometry. */
@media (min-width:800px){body[data-game="pho-bubble"] .game-stage canvas{width:min(100%,520px)}body[data-game="pho-fishing"] .game-stage canvas{width:min(100%,1050px)}}

/* V103: true pip counts with separate corner indices and mirrored court art. */
.sol-card .card-pips{position:absolute;inset:13% 17%;pointer-events:none}.sol-card .pip{position:absolute;width:clamp(9px,1.5vw,21px);height:auto;aspect-ratio:1;transform:translate(-50%,-50%)}.sol-card .pip-down{transform:translate(-50%,-50%) rotate(180deg)}.sol-card .pip-symbol{display:block;width:100%;height:100%}.sol-card .ace-pips .pip{width:clamp(16px,3vw,38px)}.sol-card .court-art{position:absolute;inset:8% 18%;width:64%;height:84%;pointer-events:none}.sol-card .corner{z-index:1}@media(max-width:700px){.sol-card .card-pips{inset:18% 16%}.sol-card .pip{width:clamp(7px,2.1vw,13px)}.sol-card .ace-pips .pip{width:clamp(13px,4vw,22px)}}
