:root{font-family:ui-rounded,'PingFang TC','Microsoft JhengHei',sans-serif;color:#624b41;background:#f8f4eb;font-size:16px}*{box-sizing:border-box}[hidden]{display:none!important}html:has(.game-app),body.game-app{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}.game-app{height:100dvh!important;display:flex;flex-direction:column;background:#f8f4eb;touch-action:manipulation;padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px)}
.game-app button,.game-app select,.game-app input{font:inherit;color:inherit}.game-app button{border:1px solid #d6c4b2;background:#fffdf7;border-radius:12px;padding:8px 13px;min-height:42px;cursor:pointer;touch-action:manipulation;box-shadow:none;transition:none}.game-app button:disabled{opacity:.45}.game-app a{color:#6b4f44;text-decoration:none}.game-app button:focus-visible,.game-app a:focus-visible{outline:3px solid #b16f42;outline-offset:2px}
.game-app .screen-header{height:58px;min-height:58px;max-width:none;padding:6px 16px;display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0;background:#fffaf3;border-bottom:1px solid #e5d7c7;letter-spacing:0}.game-app .home-link{font-size:18px;font-weight:800;white-space:nowrap;min-height:42px;display:flex;align-items:center}.game-app .screen-header h1{font-size:20px;margin:0;letter-spacing:0}.screen-tools{display:flex;gap:6px}.game-app .screen-tools button{padding:6px 10px;font-size:18px;min-width:40px}.game-app .screen-main{width:100%;max-width:none;margin:0;padding:0 8px;min-height:0;flex:1;display:grid;grid-template-rows:36px minmax(0,1fr) auto;gap:4px;overflow:hidden}.screen-stats{display:flex;align-items:center;justify-content:center;gap:18px;font-weight:700;font-size:15px;min-height:0;white-space:nowrap}.screen-stats b,.screen-stats strong{font-size:18px;color:inherit}.screen-stats button{min-height:30px!important;padding:0 10px!important;font-size:23px!important}.screen-actions{display:flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:3px 0 7px}.arena{position:relative;display:flex;align-items:center;justify-content:center;min-height:0;min-width:0;overflow:hidden;touch-action:none}.game-stage{position:relative;flex:none;margin:0!important;padding:0!important;max-width:none!important;max-height:none!important;overflow:hidden;border:1px solid #d6c3a7;border-radius:14px;background:#fff9ed}.game-stage canvas{width:100%!important;height:100%!important;display:block;border:0!important;border-radius:0!important;touch-action:none}.game-app .sr-status{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip-path:inset(50%);white-space:nowrap;margin:0!important;padding:0!important;border:0!important}
.game-app .center-result,.game-app .scene-launch,.game-app .overlay{position:absolute;inset:0;transform:none;width:auto;height:auto;max-width:none;border:0;border-radius:0;margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:18px;background:#fffaf2e8;text-align:center;z-index:50;overflow:auto;box-shadow:none}.center-result h2,.overlay h2{margin:0;font-size:26px}.center-result p,.overlay p{margin:0;font-size:15px;line-height:1.5}.game-app .scene-launch{pointer-events:none;background:#fffaf260}.game-app .scene-launch button{pointer-events:auto;font-size:20px;padding:14px 28px}.game-app .center-result button,.game-app #start{background:#a26e58;color:white;border-color:#a26e58;font-weight:700}.game-app .sour-lemon{font-size:90px}.victory-star{font-size:80px;color:#e1b34c;animation:success-bounce .65s ease-out 2}.victory{animation:success-in .25s ease-out}@keyframes success-bounce{50%{transform:scale(1.3) rotate(12deg)}}@keyframes success-in{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}
.game-dialog{position:fixed;width:min(94vw,520px);max-height:85dvh;overflow:auto;overscroll-behavior:contain;background:#fffaf3;border:1px solid #cdb79f;border-radius:20px;padding:18px;color:#624b41;touch-action:pan-y}.game-dialog::backdrop{background:#352c2670}.game-dialog>form{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:0 0 12px}.game-dialog h2{font-size:22px;margin:0}.dialog-content p,.dialog-content li{font-size:16px;line-height:1.65}.dialog-content label{display:grid;gap:8px;margin:14px 0}.dialog-content select{max-width:100%;padding:12px;border:1px solid #cdb79f;border-radius:10px;background:white}.dialog-content .levels{display:grid;gap:8px}.dialog-content .fruit-picker{max-width:none}.dialog-content button.selected{background:#eee0c6;border-color:#a88049}
.game-app[data-game=memory] .screen-main{grid-template-rows:32px minmax(0,1fr) auto}.tile-stage #tile-board{position:absolute;inset:0;width:100%;height:100%;max-width:none;margin:0;padding:0;border:0;border-radius:0;aspect-ratio:auto;background:linear-gradient(#fffcf1e8,#ede6d3ee);isolation:isolate;container-type:inline-size}.tile-stage .pyramid-tile{border-radius:7px;font-size:10cqw;box-shadow:0 4px 0 #baa170,0 5px 0 1px #977b4a,1px 7px 3px #77552844}.tile-stage .pyramid-tile.covered{box-shadow:0 4px 0 #98845e,0 5px 0 1px #827049;filter:brightness(.78) saturate(.75)}.game-app .tile-tray{width:min(100%,540px);display:grid;grid-template-columns:repeat(7,1fr);gap:5px;margin:0;padding:6px;border-radius:14px;background:#e6d8bc}.game-app .tray-slot{height:clamp(34px,7vh,58px);aspect-ratio:auto;font-size:28px;background:#fff9e7;border-radius:9px}.game-app .tray-slot>.fruit-art{width:auto;aspect-ratio:1;max-width:100%}
.game-app .solitaire{position:relative;width:100%;height:100%;max-width:1050px;padding:5px;background:#e8efe1;overflow:hidden;border-radius:14px;display:flex;flex-direction:column;gap:8px}.game-app .card-row,.game-app .tableau{min-width:0;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px}.game-app .card-row{margin:0;flex:none;max-height:28%;height:clamp(58px,18vh,128px)}.game-app .card-row>.card,.game-app .card-row>.slot{height:100%;aspect-ratio:auto;min-height:0}.game-app .tableau{flex:1;min-height:0;height:0}.game-app .column{position:relative;min-height:0!important;height:100%;overflow:visible}.game-app .column>.card,.game-app .column>.slot{height:clamp(58px,18vh,128px);min-height:0;aspect-ratio:auto;margin:0;padding:2px}.game-app .card-corner{font-size:clamp(14px,2.4vw,20px);letter-spacing:0}.game-app .card-pips{inset:27% 18%}.game-app .pip{font-size:clamp(11px,2vw,22px)}.game-app .face-rank{font-size:clamp(18px,4vw,30px)}
.game-app .mine-stage{border:0;background:none}.game-app #board-scroll{width:100%;height:100%;padding:4px;border:1px solid #b6a674;border-radius:12px;background:#e5d8a2;overflow:hidden;touch-action:none}.game-app .mine-board{gap:2px;width:max-content;margin:0}.game-app .cell{width:var(--mine-cell,31px);height:var(--mine-cell,31px);min-height:0;padding:0;border-radius:4px;font-size:clamp(12px,2vw,18px);background:#fff0a3;border:1px solid #c5ac4a;border-bottom-width:2px;display:grid;place-items:center}.game-app .cell.revealed{background:#fffdf0;border:1px solid #ddd4b4}.game-app .cell.mine{background:#ffd4a6}.game-app .cell.flagged{background:#ffdf78}.game-app #turn{display:flex;align-items:center;gap:8px}.game-app #result-fruit{font-size:50px}
.game-app #score-form{display:grid;gap:8px;max-width:100%;width:270px;margin:0}.game-app #score-form input{min-height:42px;width:100%;border:1px solid #cdb79f;border-radius:9px;padding:8px}.game-app #score-form p{font-size:12px}.game-app .welcome-icon{font-size:42px;margin:0}.game-app .board-wrap{aspect-ratio:auto}.game-app .overlay{backdrop-filter:none}.game-app #name-note{line-height:1.3}
@media(max-width:600px){.game-app .screen-header{padding:4px 8px;height:52px;min-height:52px;gap:5px}.game-app .home-link{font-size:17px}.game-app .screen-header h1{display:none}.game-app .screen-main{padding:0 5px}.game-app .screen-tools button{min-width:38px;max-width:100px;font-size:16px}.screen-stats{gap:10px;font-size:14px}.screen-actions{gap:7px}.game-app .card-corner .corner-suit{display:none}.game-app .card-row,.game-app .tableau{gap:2px}.game-app .solitaire{padding:3px}.game-app .card-corner{font-size:16px}.game-app .card-row,.game-app .column>.card,.game-app .column>.slot{height:clamp(62px,14vh,100px)}.game-app .pip{font-size:12px}.game-app .face-rank{font-size:20px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important}}

.theme-icon{display:block;width:86%;height:86%;background-size:500% 400%;background-repeat:no-repeat;mix-blend-mode:normal;pointer-events:none}.tile-stage .pyramid-tile{display:flex;align-items:center;justify-content:center;padding:0;min-height:0;line-height:1}.tile-stage .pyramid-tile>.fruit-art{width:88%;height:88%;font-size:inherit}.tray-slot{display:flex;align-items:center;justify-content:center}.game-app .arena,.game-app canvas,.game-app button{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.game-app .screen-actions:empty{display:none}.game-app .scene-launch{z-index:60}

.game-app #board-scroll{max-height:none}.game-app[data-game=peach] .screen-stats{font-size:14px;gap:8px}.game-app .card-row .card.back,.game-app .column .card.back{align-items:center;justify-content:center}.game-app .primary:hover{transform:none}

/* Centered controls and stable card geometry. */
.game-app .screen-header{justify-content:center;gap:24px;flex-shrink:0}.game-app .screen-header h1{display:block;font-size:20px;white-space:nowrap}.game-app .home-link{font-size:17px}.game-app .solitaire{max-width:none;padding:5px}.game-app .card-row{height:var(--card-height,100px);max-height:none}.game-app .column>.card,.game-app .column>.slot{height:var(--card-height,100px)}.game-app .slot{background:#9cad99;border:2px dashed #647a66;color:#354936}.game-app .card-row>.slot{background:#9cad99}.game-app .tile-stage .pyramid-tile.covered{opacity:1!important;background:#ded4b9!important;filter:brightness(.84) saturate(.8)}.game-app .tile-stage .pyramid-tile{opacity:1!important;background:linear-gradient(#fffef9,#f6ecd9)}.game-app .cell.exploded{background:#f6b188;outline:2px solid #bb593c;outline-offset:-2px}
.game-app[data-game=gomoku] .screen-main{grid-template-rows:36px minmax(0,1fr) auto auto}.game-app .board-result{display:flex;justify-content:center;align-items:center;gap:10px;text-align:center;flex-wrap:wrap;padding:5px;margin:0;background:none;border:0}.game-app .board-result h2{font-size:20px;margin:0}.game-app .board-result p{display:none}.game-app .board-result #result-fruit{font-size:28px}
@media(max-width:700px){.game-app[data-game=snake] .screen-main{padding-left:0;padding-right:0}.game-app[data-game=snake] .game-stage{border-radius:8px}}
@media(max-width:600px){.game-app .screen-header{gap:8px;padding:4px 10px}.game-app .screen-header h1{font-size:16px}.game-app .home-link{font-size:14px}.game-app .screen-tools{gap:3px}.game-app .screen-tools button{min-width:32px;padding:6px;font-size:15px}.game-app .card-row,.game-app .column>.card,.game-app .column>.slot{height:var(--card-height,75px)}.game-app .solitaire{padding:5px}.game-app .screen-header .home-link{font-size:0}.game-app .screen-header .home-link::after{content:'← 首頁';font-size:14px}}

/* Orange taps must not smart-zoom, while an intentional pinch can zoom back out. */
.game-app[data-game=memory] .arena,.game-app[data-game=memory] #tile-board,.game-app[data-game=memory] .pyramid-tile,.game-app[data-game=memory] .tile-tray{touch-action:manipulation}
.game-app[data-game=memory] .game-dialog{touch-action:pan-y pinch-zoom}

/* Header controls follow the play surface instead of clustering at its center. */
.game-app .screen-header{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);column-gap:10px;margin:0 auto;padding-left:0;padding-right:0;max-width:100%;box-sizing:border-box}.game-app .screen-header .home-link{justify-self:start}.game-app .screen-header h1{justify-self:center}.game-app .screen-header .screen-tools{justify-self:end}
@media(max-width:600px){.game-app .screen-header{column-gap:6px}.game-app .screen-tools{gap:2px}.game-app .screen-tools button{min-width:30px;padding:6px 5px}.game-app .screen-header h1{font-size:15px}}

.game-app .theme-loading{background:#fffaf2;z-index:70}.game-app .theme-loading h2{font-size:21px}.theme-spinner{width:38px;height:38px;border:4px solid #ead6b9;border-top-color:#b77a48;border-radius:50%;animation:theme-spin .8s linear infinite}@keyframes theme-spin{to{transform:rotate(360deg)}}

/* Difficulty stays visible beside the controls below each game. */
.game-app .difficulty-actions{flex-wrap:wrap;column-gap:14px;row-gap:4px}.game-app .difficulty-control{display:flex;align-items:center;gap:7px;margin:0;font-size:14px;font-weight:700;white-space:nowrap}.game-app .difficulty-control select{min-height:42px;max-width:110px;padding:7px 24px 7px 10px;border:1px solid #c9ae8c;border-radius:12px;background:#fffdf7;font-size:16px}.game-app .difficulty-control select:focus-visible{outline:3px solid #b16f42;outline-offset:2px}.game-app .difficulty-control .levels{display:flex;gap:4px;margin:0}.game-app .difficulty-control .levels button{padding:7px 10px;font-size:14px}.game-app .difficulty-control .selected{background:#eee0c6;border-color:#a88049;font-weight:800}
@media(max-width:600px){.game-app .difficulty-actions{column-gap:6px}.game-app .difficulty-actions>button{padding:7px 9px;font-size:14px}.game-app .difficulty-control{gap:5px}.game-app .difficulty-control select{max-width:90px}.game-app[data-game=solitaire] .difficulty-actions{column-gap:6px}.game-app[data-game=solitaire] .difficulty-control{flex-basis:100%;justify-content:center}}

/* Size the painted subject, accounting for whitespace in each source icon. */
.game-app .cell>.fruit-art{width:100%;height:100%;display:block;line-height:1;min-width:0;min-height:0}
.game-app .tile-stage .pyramid-tile>.fruit-art,.game-app .tile-stage .pyramid-tile>.theme-icon,.game-app .tray-slot>.fruit-art,.game-app .tray-slot>.theme-icon{width:100%;height:100%;aspect-ratio:1}
.game-app .tray-slot{overflow:hidden}.game-app .tray-slot>.fruit-art,.game-app .tray-slot>.theme-icon{width:auto;max-width:100%;flex-shrink:1}
.game-app .card-pips{inset:23% 12%}.game-app .face-rank{font-size:clamp(22px,4vw,34px)}

/* Keep header tools compact even after their state is initialized. */
.game-app .screen-header{grid-template-columns:auto minmax(0,1fr) auto;row-gap:0}
.game-app .screen-header h1{min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;text-align:center;line-height:1.2}
.game-app .screen-header .screen-tools{flex-wrap:nowrap;flex-shrink:0;align-items:center}
.game-app .screen-header .screen-tools button{flex:0 0 40px;width:40px;min-width:40px;max-width:40px;height:42px;padding:0;display:grid;place-items:center;line-height:1}
@media(max-width:600px){.game-app .screen-header .screen-tools button{flex-basis:34px;width:34px;min-width:34px;max-width:34px}.game-app .screen-header{column-gap:8px}}

.theme-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.theme-choices button:last-child{grid-column:1/-1}.theme-choices button{font-weight:700}

.game-app .peach-end{position:absolute;z-index:65;left:50%;transform:translateX(-50%);width:min(90%,290px);padding:12px;border:1px solid #c9a68a;border-radius:16px;background:#fffaf3;box-shadow:0 3px 14px #654b3930;text-align:center}.game-app .peach-end h2{font-size:20px;margin:0 0 6px}.game-app .peach-end p{font-size:14px;line-height:1.5;margin:0 0 9px}.game-app .peach-end>div{display:flex;justify-content:center;gap:6px}.game-app .peach-end button{font-size:14px;padding:7px 9px}

#rank-entries{padding:0;list-style:none;margin:10px 0}#rank-entries li{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid #e5d7c7}#rank-entries li span{overflow-wrap:anywhere}#rank-entries b{white-space:nowrap}#rank-submit{border:1px solid #d6c4b2;border-radius:12px;padding:12px;margin-bottom:12px}#rank-name{min-width:0;width:100%;padding:9px;border:1px solid #c9ae8c;border-radius:8px;font-size:16px}.game-app[data-game=mines] .difficulty-actions{flex-wrap:wrap}@media(max-width:600px){.game-app[data-game=mines] .difficulty-actions .difficulty-control{flex-basis:100%;justify-content:center}}

/* Full-width Peach touch surface and explicit Safari gesture ownership. */
@media(max-width:700px){.game-app[data-game=peach] .screen-main{padding-left:0;padding-right:0}.game-app[data-game=peach] .peach-wrap{border:0;border-radius:0}}
.game-app[data-game=peach] .screen-header *,.game-app[data-game=peach] .screen-main,.game-app[data-game=peach] .screen-main *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.game-app[data-game=solitaire] .solitaire,.game-app[data-game=solitaire] .solitaire *,.game-app[data-game=solitaire] .card-drag-ghost *{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.game-app .peach-end{max-height:calc(100% - 32px);overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y}.peach-end #rank-submit{margin:10px 0;padding:10px;text-align:left}.peach-end #rank-submit label{display:block;font-size:14px}.peach-end #rank-save{width:100%;margin-top:8px}.peach-end #rank-save-note{margin:8px 0 0}.peach-end #rank-result{display:none}.game-app[data-game=peach] .screen-main #rank-name{-webkit-user-select:text;user-select:text;touch-action:manipulation}
/* Shared centered title with comfortable screen-edge spacing. */
.game-app .screen-header{width:100%;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);padding-left:20px;padding-right:20px;column-gap:12px}.game-app .screen-header h1{max-width:50vw}.game-app .screen-actions{flex-wrap:wrap}.game-app .settings-action{white-space:nowrap}
.game-app[data-game=gomoku] .screen-main{grid-template-rows:clamp(64px,10dvh,88px) minmax(0,1fr) auto auto}.game-app[data-game=gomoku] .screen-stats{align-self:stretch;justify-content:center}.game-app[data-game=gomoku] #turn{padding:8px 20px;border-radius:99px;background:#fffaf3;border:1px solid #e5d7c7;gap:10px}.game-app[data-game=gomoku] #turn strong{font-size:24px}.game-app[data-game=gomoku] #turn small{font-size:18px}.game-app[data-game=gomoku] #turn .piece{font-size:30px;width:36px;height:36px}.game-app #modes{display:flex;flex-wrap:wrap;gap:8px}
@media(max-width:700px){.game-app .screen-header{padding-left:16px;padding-right:16px;column-gap:8px}.game-app .screen-header h1{font-size:16px;max-width:calc(100vw - 192px)}.game-app[data-game=snake] #detail{font-size:22px;line-height:1.6;font-weight:800}.game-app[data-game=memory] .tile-tray{flex-basis:100%}}
@media(hover:hover) and (pointer:fine){.game-app[data-game=snake] #pause{display:none}}


.game-app[data-game=gomoku] .arena{align-items:flex-start}

.game-app #mine-win #rank-submit{width:min(100%,300px);flex-shrink:0;text-align:left;margin:0;padding:10px}.game-app #mine-win #rank-submit label{display:block;font-size:16px}.game-app #mine-win #rank-save{width:100%;margin-top:8px}.game-app #mine-win #rank-save-note{font-size:14px;margin-top:6px}.game-app #mine-win .victory-star{font-size:44px}.game-app #mine-win{justify-content:safe center}

.game-app[data-game=memory] .tile-tray{grid-template-columns:repeat(7,minmax(0,1fr))}
.game-app[data-game=memory] .tray-slot{width:100%;height:auto;min-height:0;aspect-ratio:1;align-self:start}
