/* games.css — שפּיל צענטער, the kids' Game Center (Oct 26 2026) */
.gc{max-width:900px;margin:0 auto;padding:4px 4px 30px;font-family:"Arial Hebrew","Noto Sans Hebrew",system-ui,-apple-system,Arial,sans-serif}
.gc h1{margin:4px 0 2px;font-size:28px;line-height:1.2}
.gc-top{text-align:center;padding:10px 6px 4px}.gc-top p{margin:2px 0 10px;color:var(--mut)}
.gc-en{direction:ltr;font-size:13px;color:var(--mut)}
.gc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(158px,1fr));gap:12px}
.gc-tile{--k:#2F80ED;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:136px;border-radius:20px;background:radial-gradient(120% 90% at 30% 0%,color-mix(in srgb,var(--k) 75%,#fff) 0%,var(--k) 55%,color-mix(in srgb,var(--k) 70%,#000) 100%);color:#fff;text-decoration:none;box-shadow:var(--sh);padding:12px 8px;text-align:center;transition:transform .12s}
.gc-tile:active{transform:scale(.96)}.gc-ico{font-size:44px;line-height:1.1;filter:drop-shadow(0 2px 3px rgba(0,0,0,.25))}
.gc-tile b{font-size:19px;line-height:1.2}.gc-tile small{font-size:12px;opacity:.92}.gc-tile i{font-style:normal;font-size:12.5px;opacity:.9}
.gc-best{position:absolute;top:6px;left:8px;font-style:normal;font-size:12px;background:rgba(255,255,255,.25);border-radius:999px;padding:1px 7px}
.gc-note{text-align:center;color:var(--mut);font-size:13.5px;margin:16px 0 6px}
.gc-row{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:10px 0 0}
.gc-btn{border:1px solid var(--line);background:var(--panel);color:var(--txt);border-radius:999px;padding:9px 15px;font:600 15px inherit;font-family:inherit;cursor:pointer;text-decoration:none}
.gc-go{border:0;background:var(--btn);color:#fff;border-radius:999px;padding:13px 26px;font:700 19px inherit;font-family:inherit;cursor:pointer;margin:8px 0}
.gc-home{display:flex;align-items:center;gap:14px;margin:10px 16px 6px;padding:12px 16px;border-radius:22px;background:linear-gradient(135deg,#1A63C7,#6A1B9A);color:#fff;text-decoration:none;box-shadow:var(--sh)}
.gc-hi{font-size:38px}.gc-ht{flex:1;display:flex;flex-direction:column}.gc-ht b{font-size:21px}.gc-ht small{font-size:12.5px;opacity:.9;direction:ltr;text-align:right}.gc-hgo{font-size:30px;opacity:.8}
.gc-kcb{display:flex;align-items:center;gap:10px;justify-content:center;margin:0 0 14px;padding:12px 14px;border-radius:18px;background:linear-gradient(135deg,#1A63C7,#6A1B9A);color:#fff;text-decoration:none;box-shadow:var(--sh)}
.gc-kcb span{font-size:30px}.gc-kcb b{font-size:21px}.gc-kcb small{font-size:12.5px;opacity:.9}
.gc-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:4px 2px 8px}
.gc-head h1{flex:1;font-size:23px;margin:0}.gc-head h1 small{font-size:13px;color:var(--mut);font-weight:600}
.gc-back{text-decoration:none;color:var(--gold);font-weight:700;font-size:15px;width:100%}
.gc-mute{border:1px solid var(--line);background:var(--panel);border-radius:999px;width:44px;height:44px;font-size:21px;cursor:pointer}
.gc-stage{display:flex;flex-direction:column;align-items:center;gap:8px;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.gc-load{color:var(--mut);padding:30px;text-align:center}
.gc-canvas{display:block;border-radius:16px;box-shadow:var(--sh2);background:#fff;touch-action:none;max-width:100%}
.gc-hud{display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:center;align-items:center;font-size:15px;color:var(--txt);min-height:24px;position:relative;width:100%;max-width:720px}
.gc-hud b{color:var(--gold2)}.gc-next{font-size:22px}
.gc-prog{display:block;width:100%;height:7px;border-radius:9px;background:var(--line);overflow:hidden}.gc-prog b{display:block;height:100%;background:linear-gradient(90deg,#43A047,#FBC02D);transition:width .3s}
.gc-help{text-align:center;color:var(--mut);font-size:13.5px;margin:4px 0 0;max-width:620px}
.gc-pad{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.gc-pb{min-width:58px;height:54px;border:0;border-radius:16px;background:var(--panel);box-shadow:var(--sh);font-size:24px;cursor:pointer;touch-action:manipulation;padding:0 12px;color:var(--txt)}
.gc-pb:active{transform:scale(.94);background:#E3F0FF}
.gc-pad2 .gc-pb{font-size:19px;font-weight:700}
@media (hover:hover) and (pointer:fine){.gc-pad:not(.gc-pad2){opacity:.75}}
.gc-seg{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.gc-seg button{border:1px solid var(--line);background:var(--panel);border-radius:14px;padding:7px 12px;font:600 15px inherit;font-family:inherit;cursor:pointer;color:var(--txt);display:flex;flex-direction:column;align-items:center;line-height:1.2}
.gc-seg button small{font-size:11px;color:var(--mut)}.gc-seg button.on{background:var(--btn);color:#fff;border-color:transparent}.gc-seg button.on small{color:#e8f0ff}
.gc-card{background:var(--panel);border-radius:20px;box-shadow:var(--sh);padding:16px;text-align:center;width:100%;max-width:640px}
.gc-card h2{margin:4px 0 8px}
.gc-win{animation:gcIn .3s ease}@keyframes gcIn{from{transform:scale(.9);opacity:0}}
/* trivia */
.gc-tq{width:100%;max-width:640px;display:flex;flex-direction:column;gap:8px}
.gc-tqbar{display:flex;justify-content:space-between;font-size:15px;padding:0 4px}
.gc-time{height:9px;border-radius:9px;background:var(--line);overflow:hidden}.gc-time i{display:block;height:100%;background:#43A047;transition:width .1s linear}.gc-time i.low{background:#E53935}
.gc-cat{color:var(--mut);font-size:13px}.gc-q{font-size:22px;line-height:1.35;margin:6px 0 12px}
.gc-opts{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:480px){.gc-opts{grid-template-columns:1fr}}
.gc-opt{border:2px solid var(--line);background:var(--bg2);color:var(--txt);border-radius:16px;padding:12px 10px;font:600 18px inherit;font-family:inherit;cursor:pointer;min-height:54px}
.gc-opt.ok{background:#dff5e1;border-color:#43a047;color:#1b5e20}.gc-opt.no{background:#fde2e1;border-color:#e53935;color:#8e1b1b}.gc-opt.gone{visibility:hidden}
.gc-msg{min-height:26px;font-weight:700;font-size:17px;margin:8px 0 0}
.gc-life{display:flex;gap:8px;justify-content:center}.gc-life button{border:1px solid var(--line);background:var(--panel);border-radius:999px;padding:8px 13px;font:600 15px inherit;font-family:inherit;cursor:pointer}.gc-life button:disabled{opacity:.35}
.gc-cats{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin:8px 0}.gc-cats span{background:var(--bg);border-radius:999px;padding:4px 10px;font-size:14px}
/* word search */
.gc-ws{width:100%;max-width:560px;display:flex;flex-direction:column;align-items:center;gap:8px}
.gc-wsh{font-size:17px}
.gc-wsg{display:grid;grid-template-columns:repeat(var(--n),1fr);width:100%;max-width:min(560px,92vw);aspect-ratio:1;background:var(--panel);border-radius:14px;box-shadow:var(--sh);padding:6px;touch-action:none;gap:2px}
.gc-wsg span{display:flex;align-items:center;justify-content:center;font-size:clamp(15px,4.6vw,26px);font-weight:700;border-radius:8px;cursor:pointer;color:var(--txt)}
.gc-wsg span.sel{background:#FFF59D!important;outline:2px solid #FBC02D}.gc-wsg span.first{outline:3px solid #1A63C7}
.gc-wsl{display:flex;flex-wrap:wrap;gap:6px 10px;justify-content:center;font-size:18px;font-weight:600}.gc-wsl span.got{text-decoration:line-through;color:#43A047;opacity:.7}
/* chess & checkers */
.gc-board{display:grid;grid-template-columns:repeat(8,1fr);width:min(92vw,520px);aspect-ratio:1;border-radius:10px;overflow:hidden;box-shadow:var(--sh2);border:6px solid #6D4C41}
.gc-board .sq{border:0;padding:0;display:flex;align-items:center;justify-content:center;position:relative;cursor:pointer;aspect-ratio:1}
.gc-board .l{background:#F0D9B5}.gc-board .d{background:#B58863}
.gc-board .sel{box-shadow:inset 0 0 0 4px #FBC02D}.gc-board .last{background-image:linear-gradient(rgba(255,235,59,.35),rgba(255,235,59,.35))}
.gc-board .dot::after{content:"";width:28%;height:28%;border-radius:50%;background:rgba(26,99,199,.55)}.gc-board .cap{box-shadow:inset 0 0 0 4px rgba(229,57,53,.75)}
.gc-board .chk{background:radial-gradient(circle,#ff5252 0%,#B58863 75%)}
.pc{font-size:min(10vw,54px);line-height:1;font-family:"Segoe UI Symbol","DejaVu Sans","Noto Sans Symbols 2","Arial Unicode MS",serif}
.pc.w{color:#fff;text-shadow:0 0 2px #000,0 0 2px #000,0 1px 1px #000}.pc.b{color:#212121;text-shadow:0 0 1px #fff}
.gc-bmsg{min-height:24px;font-weight:700;font-size:16px;margin:2px 0;text-align:center}
.gc-ck .ck{width:76%;height:76%;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:min(6vw,30px);box-shadow:0 3px 0 rgba(0,0,0,.35),inset 0 -4px 0 rgba(0,0,0,.15)}
.gc-ck .ck.w{background:#FFF8E1;color:#C62828;border:3px solid #E0C38C}.gc-ck .ck.b{background:#3E2723;color:#FFD54F;border:3px solid #1B0F0B}
.gc-ck .can{box-shadow:inset 0 0 0 3px rgba(67,160,71,.8)}
/* match-3 */
.gc-m3{display:grid;grid-template-columns:repeat(8,1fr);width:min(92vw,480px);aspect-ratio:1;background:linear-gradient(160deg,#283593,#4527A0);border-radius:16px;padding:6px;gap:3px;box-shadow:var(--sh2);touch-action:none;overflow:hidden}
.m3{border:0;border-radius:10px;background:rgba(255,255,255,.14);font-size:min(7.4vw,38px);line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;transition:transform .12s}
.m3.sel{background:rgba(255,235,59,.55);transform:scale(1.08)}.m3.pop{animation:m3pop .23s forwards}.m3[data-fall]{animation:m3fall .26s ease-in}
.m3.star{background:radial-gradient(circle,#FFF59D,#FBC02D);box-shadow:0 0 10px #FFEB3B}
@keyframes m3pop{to{transform:scale(0);opacity:0}}@keyframes m3fall{from{transform:translateY(calc(var(--f) * -100%))}}
/* sudoku */
.gc-sd{display:grid;grid-template-columns:repeat(var(--n),1fr);width:min(92vw,470px);aspect-ratio:1;border:3px solid #0B2545;border-radius:8px;overflow:hidden;background:#fff;box-shadow:var(--sh)}
.sdc{border:0;border-left:1px solid #CFD8DC;border-bottom:1px solid #CFD8DC;background:#fff;font:700 clamp(18px,5.5vw,30px) inherit;font-family:inherit;color:#1A63C7;cursor:pointer;padding:0;aspect-ratio:1}
.sdc.giv{color:#0B2545;background:#F5F7FA}.sdc.peer{background:#EEF5FF}.sdc.same{background:#FFF3C4}.sdc.sel{background:#FFE082}.sdc.bad{color:#E53935;background:#FDE2E1}
.sdc.bl{border-left:3px solid #0B2545}.sdc.bb{border-bottom:3px solid #0B2545}
.gc-sdk{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;max-width:470px}
.gc-sdk button{width:46px;height:50px;border:0;border-radius:12px;background:var(--panel);box-shadow:var(--sh);font:700 24px inherit;font-family:inherit;cursor:pointer;color:var(--txt)}
.gc-sdk button:active{transform:scale(.93)}