/* Giyani Labs — Games Corner. Uses the site's :root tokens (site.css). */
.gc{--gc-good:#1E9E5A;--gc-good-soft:#E7F6EE;--gc-red:#E5484D;--gc-blue:#3B6FE5}
:root[data-theme="dark"] .gc{--gc-good:#3ECF8E;--gc-good-soft:#0F231A;--gc-red:#FF6369;--gc-blue:#6E9BFF}
.gc *{box-sizing:border-box}
.gc a{text-decoration:none;color:inherit}
.gc-badge{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.gc-badge::before{content:"";width:20px;height:2px;background:var(--accent);border-radius:2px}
.gc-btn{display:inline-flex;align-items:center;gap:8px;font:inherit;font-weight:700;font-size:15px;cursor:pointer;padding:13px 24px;border-radius:999px;border:1px solid transparent;transition:.25s cubic-bezier(.22,.61,.36,1)}
.gc-btn-primary{background:var(--accent);color:#fff;box-shadow:0 12px 26px -10px rgba(242,96,26,.6)}
.gc-btn-primary:hover{transform:translateY(-2px)}
.gc-btn-ghost{background:transparent;border-color:var(--line);color:var(--ink)}
.gc-btn-ghost:hover{border-color:var(--accent);color:var(--accent)}
.gc-btn[disabled]{opacity:.5;cursor:not-allowed;transform:none}

/* hub */
.gc-hero{position:relative;text-align:center;padding:56px 0 80px;overflow:hidden}
.gc-hero .glow{position:absolute;top:-38%;left:50%;transform:translateX(-50%);width:680px;height:520px;max-width:120vw;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 24%,transparent),transparent 62%);opacity:.5;pointer-events:none}
.gc-hero .inner{position:relative;z-index:1}
.gc-hero h1{font-size:clamp(32px,6vw,56px);margin:14px 0;letter-spacing:-.03em;line-height:1.06}
.gc-hero .sub{color:var(--muted);font-size:17px;max-width:500px;margin:0 auto 22px}
.gc-livestat{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--muted);margin-bottom:36px}
.gc-livestat .dot{width:8px;height:8px;border-radius:50%;background:var(--gc-good);box-shadow:0 0 0 4px color-mix(in srgb,var(--gc-good) 20%,transparent)}
.gc-game{max-width:520px;margin:0 auto;background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:40px 32px;box-shadow:var(--shadow,0 20px 46px -20px rgba(11,18,32,.18))}
.gc-game .em{font-size:56px;display:block;margin-bottom:14px}
.gc-game h2{font-size:28px;margin-bottom:10px;letter-spacing:-.02em}
.gc-game p{color:var(--muted);font-size:15px;max-width:360px;margin:0 auto 22px}
.gc-tags{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:24px}
.gc-tags span{font-size:12px;font-weight:700;padding:5px 12px;border-radius:999px;background:var(--accent-soft);color:var(--accent)}
.gc-soon{margin-top:34px;font-size:13px;color:var(--muted)}
.gc-soon b{color:var(--ink-soft);font-weight:700}

/* play layout */
.gc-wrap{padding:34px 0 80px}
.gc-top{text-align:center;margin-bottom:26px}
.gc-back{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--muted);margin-bottom:12px}
.gc-back:hover{color:var(--accent)}
.gc-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:18px;align-items:start}
.gc-card{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:26px}
.gc-play{text-align:center;position:relative}
.gc-daily{display:flex;align-items:center;gap:10px;padding:11px 15px;border-radius:14px;background:var(--accent-soft);font-size:13.5px;font-weight:600;margin-bottom:22px;text-align:left}
.gc-modes{display:flex;gap:8px;justify-content:center;margin-bottom:8px}
.gc-mode{font:inherit;font-size:13px;font-weight:700;padding:8px 16px;border-radius:999px;border:1px solid var(--line);background:var(--bg);color:var(--muted);cursor:pointer}
.gc-mode.on{background:var(--accent);color:#fff;border-color:transparent}
.gc-diffs{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.gc-diff{font:inherit;font-size:12.5px;font-weight:700;padding:7px 13px;border-radius:999px;border:1px solid var(--line);background:var(--bg);color:var(--muted);cursor:pointer}
.gc-diff.on{background:var(--ink);color:var(--bg);border-color:transparent}
.gc-ring{width:120px;height:120px;border-radius:50%;margin:14px auto 6px;display:grid;place-items:center;font-size:36px;font-weight:800;background:conic-gradient(var(--accent) var(--p,100%),var(--line) 0);position:relative;transition:background .3s linear}
.gc-ring.warn{--rc:#E9A23B}.gc-ring.danger{background:conic-gradient(var(--gc-red) var(--p,100%),var(--line) 0)}
.gc-ring::before{content:"";position:absolute;inset:9px;border-radius:50%;background:var(--surface)}
.gc-ring span{position:relative}
.gc-rlabel{font-size:12px;color:var(--muted);margin-bottom:18px}
.gc-metrics{display:flex;justify-content:center;gap:36px;margin-bottom:22px}
.gc-metrics b{font-size:24px;font-weight:800;display:block}
.gc-metrics small{font-size:11.5px;color:var(--muted)}
.gc-form{display:flex;gap:10px;max-width:320px;margin:0 auto 14px}
.gc-form input{flex:1;font:inherit;font-size:18px;font-weight:700;text-align:center;padding:14px;border-radius:14px;border:1px solid var(--line);background:var(--bg);color:var(--ink)}
.gc-form input:focus{outline:none;border-color:var(--accent)}
.gc-hint{font-weight:700;color:var(--accent);margin-bottom:16px;font-size:15px;min-height:22px}
.gc-chips{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;min-height:30px}
.gc-chip{font-size:13px;font-weight:700;padding:6px 13px;border-radius:999px;background:var(--surface-2);border:1px solid var(--line)}
.gc-chip.hi{color:var(--gc-red)}.gc-chip.lo{color:var(--gc-blue)}
/* end-of-round heat recolor (hot → cold) */
.gc-chip.h0{background:var(--gc-good-soft);color:var(--gc-good);border-color:transparent}
.gc-chip.h1{background:color-mix(in srgb,#E9A23B 18%,transparent);color:#B87910;border-color:transparent}
.gc-chip.h2{background:color-mix(in srgb,#F97316 18%,transparent);color:#F97316;border-color:transparent}
.gc-chip.h3{background:color-mix(in srgb,var(--gc-red) 15%,transparent);color:var(--gc-red);border-color:transparent}
.gc-start{display:flex;flex-direction:column;align-items:center;gap:14px;padding:20px 0}
.gc-start .gc-btn{min-width:220px;justify-content:center}
.gc-hide{display:none!important}

/* result overlay */
.gc-result{position:absolute;inset:0;background:color-mix(in srgb,var(--surface) 94%,transparent);backdrop-filter:blur(3px);border-radius:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:26px;text-align:center;z-index:5}
.gc-result .em{font-size:52px}
.gc-result h3{font-size:26px;letter-spacing:-.02em}
.gc-result p{color:var(--muted);font-size:15px}
.gc-result .score{font-size:40px;font-weight:800;color:var(--accent)}
.gc-namewrap{display:flex;gap:8px;max-width:300px;width:100%}
.gc-namewrap input{flex:1;font:inherit;font-weight:600;padding:12px;border-radius:12px;border:1px solid var(--line);background:var(--bg);color:var(--ink)}
.gc-result-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}

/* leaderboard */
.gc-lbhead{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.gc-lbhead h3{font-size:17px;margin:0;letter-spacing:-.01em}
.gc-lbtabs{display:flex;gap:6px;margin-bottom:8px}
.gc-lbtab{font:inherit;font-size:12.5px;font-weight:600;padding:6px 13px;border-radius:999px;border:1px solid var(--line);background:var(--bg);color:var(--muted);cursor:pointer}
.gc-lbtab.on{background:var(--accent);color:#fff;border-color:transparent}
.gc-row{display:flex;align-items:center;gap:12px;padding:10px 8px;border-bottom:1px solid var(--line);font-size:14.5px}
.gc-row .rk{width:28px;font-weight:800;color:var(--muted);text-align:center}
.gc-row .nm{flex:1;font-weight:600;display:flex;align-items:center;gap:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gc-row .flag{font-size:16px}
.gc-row .pts{font-weight:800;font-variant-numeric:tabular-nums}
.gc-row.me{background:var(--accent-soft);border-radius:12px;border-bottom-color:transparent}
.gc-empty{color:var(--muted);font-size:14px;text-align:center;padding:26px 0}

/* streaks, stats, countdown, share grid */
.gc-streak{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:700;color:var(--accent);background:var(--accent-soft);border:1px solid color-mix(in srgb,var(--accent) 28%,transparent);padding:6px 14px;border-radius:999px}
.gc-streak b{font-weight:800}
.gc-statbar{display:flex;gap:8px 18px;flex-wrap:wrap;justify-content:center;font-size:12.5px;color:var(--muted)}
.gc-statbar b{color:var(--ink);font-weight:800;font-variant-numeric:tabular-nums}
.gc-countdown{font-size:12.5px;color:var(--muted);font-weight:600}
.gc-countdown b{color:var(--accent);font-variant-numeric:tabular-nums}
.gc-pb{font-size:13px;font-weight:800;color:#fff;background:linear-gradient(90deg,var(--accent),var(--accent-2));padding:5px 14px;border-radius:999px;animation:gc-bump .5s}
.gc-gridline{font-size:26px;letter-spacing:4px;line-height:1.1}
.gc-resstreak{font-size:14px;font-weight:700;color:var(--accent)}
.gc-rowstreak{font-size:12px;font-weight:700;color:var(--accent);margin-left:2px}
.gc-dailydone{font-size:14px;line-height:1.5;color:var(--ink-soft);background:var(--gc-good-soft);border:1px solid color-mix(in srgb,var(--gc-good) 30%,transparent);border-radius:14px;padding:14px 16px;max-width:340px}
.gc-dailydone b{color:var(--gc-good)}
.gc-dailydone a{color:var(--accent);font-weight:700}
.gc-friends{display:inline-block;margin-top:10px;font-size:13.5px;font-weight:700;color:var(--accent)}
.gc-friends:hover{text-decoration:underline}
.gc-nameinput{font:inherit;font-size:15px;font-weight:600;text-align:center;padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:var(--bg);color:var(--ink);max-width:280px;width:100%}
.gc-nameinput:focus{outline:none;border-color:var(--accent)}
.gc-nameinput.gc-need{border-color:var(--gc-red);animation:gc-shake .4s}

/* game feel — sound toggle + animations */
.gc-mute{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:var(--bg);color:var(--muted);cursor:pointer;display:grid;place-items:center;font-size:15px;z-index:6}
.gc-mute:hover{color:var(--accent);border-color:var(--accent)}
@keyframes gc-pop{0%{transform:scale(.85);opacity:0}60%{transform:scale(1.04)}100%{transform:scale(1);opacity:1}}
.gc-result{animation:gc-pop .38s cubic-bezier(.22,.61,.36,1)}
@keyframes gc-shake{10%,90%{transform:translateX(-2px)}20%,80%{transform:translateX(4px)}30%,50%,70%{transform:translateX(-9px)}40%,60%{transform:translateX(9px)}}
.gc-shake{animation:gc-shake .5s}
@keyframes gc-reveal{0%{transform:scale(.3) rotate(-8deg);opacity:0}60%{transform:scale(1.25) rotate(3deg)}100%{transform:scale(1) rotate(0)}}
.gc-reveal{display:inline-block;font-weight:800;color:var(--accent);animation:gc-reveal .55s cubic-bezier(.22,.61,.36,1)}
@keyframes gc-scorepop{0%{transform:scale(.2);opacity:0}70%{transform:scale(1.15)}100%{transform:scale(1)}}
.gc-result .score:not(.gc-hide){animation:gc-scorepop .5s .1s backwards cubic-bezier(.34,1.56,.64,1)}
@keyframes gc-bump{0%,100%{transform:scale(1)}30%{transform:scale(1.3)}}
.gc-bump{display:inline-block;animation:gc-bump .35s}
@media(prefers-reduced-motion:reduce){.gc-shake,.gc-reveal,.gc-bump,.gc-result,.gc-result .score{animation:none!important}}

/* confetti */
.gc-confetti{position:fixed;inset:0;pointer-events:none;z-index:60;overflow:hidden}
.gc-confetti i{position:absolute;top:-12px;width:9px;height:14px;opacity:.9;animation:gcfall linear forwards}
@keyframes gcfall{to{transform:translateY(105vh) rotate(680deg);opacity:.4}}

@media(max-width:760px){.gc-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.gc-confetti{display:none}.gc-ring{transition:none}}