/* Taiwan Granddad — shared game kit v1
   Granddad guide bubble, passport stamp modal, lantern confetti,
   mode + sound toggles, chunky buttons. Include after page styles. */

:root{
  --tgk-bg:#1A1428; --tgk-card:#241934; --tgk-tile:#2A1F3A; --tgk-hover:#332244;
  --tgk-text:#FFFFFF; --tgk-sec:#B3B3B3; --tgk-muted:#7A7080;
  --tgk-gold:#C4964A; --tgk-green:#1D9E75; --tgk-red:#E24B4A; --tgk-orange:#E85A20;
  --tgk-hand:'Gochi Hand',cursive; --tgk-hero:'Shojumaru',serif;
}

/* ===== Chunky tappable buttons ===== */
.tgk-btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;
  min-height:56px;border-radius:14px;padding:14px 18px;font-size:17px;font-weight:700;color:#fff;
  border:1px solid rgba(255,255,255,.14);background:var(--tgk-tile);
  transition:transform .08s ease, filter .15s;cursor:pointer;-webkit-tap-highlight-color:transparent;user-select:none;}
.tgk-btn:active{transform:scale(.96);}
.tgk-btn.gold{background:linear-gradient(135deg,#C4964A,#8f6a2e);}
.tgk-btn.green{background:linear-gradient(135deg,#1FB07F,#147a58);}
.tgk-btn.red{background:linear-gradient(135deg,#EE6A33,#b8401a);}
.tgk-btn.ghost{background:transparent;border:1.5px solid var(--tgk-tile);color:var(--tgk-sec);}

/* ===== Card squash feedback ===== */
.tgk-press{transition:transform .08s ease;-webkit-tap-highlight-color:transparent;user-select:none;cursor:pointer;}
.tgk-press:active{transform:scale(.95);}

/* ===== Granddad guide bubble ===== */
.tgk-granddad{position:fixed;left:10px;right:10px;bottom:76px;z-index:220;display:flex;align-items:flex-end;gap:8px;
  pointer-events:none;opacity:0;transform:translateY(14px);transition:opacity .25s,transform .25s;}
.tgk-granddad.on{opacity:1;transform:translateY(0);pointer-events:auto;}
.tgk-gd-face{font-size:40px;line-height:1;filter:drop-shadow(0 4px 8px rgba(0,0,0,.5));flex-shrink:0;}
.tgk-gd-face img{width:52px;height:52px;display:block;}
.tgk-gd-bubble{background:#FDF6E3;color:#3A2E20;border-radius:16px 16px 16px 4px;padding:12px 15px;
  font-family:var(--tgk-hand);font-size:18px;line-height:1.3;box-shadow:0 6px 20px rgba(0,0,0,.45);max-width:480px;}
.tgk-gd-bubble small{display:block;font-family:'Open Sans',sans-serif;font-size:10px;font-weight:700;
  text-transform:uppercase;letter-spacing:.6px;color:#a08a5f;margin-bottom:2px;}

/* ===== Toggle pills (mode + sound) ===== */
.tgk-toggles{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;padding:6px 16px;}
.tgk-pill{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:8px 14px;border-radius:999px;
  background:var(--tgk-card);border:1.5px solid var(--tgk-tile);font-size:13px;font-weight:700;color:var(--tgk-sec);
  cursor:pointer;-webkit-tap-highlight-color:transparent;user-select:none;transition:transform .08s;}
.tgk-pill:active{transform:scale(.95);}
.tgk-pill.on{border-color:var(--tgk-gold);color:#fff;background:rgba(196,150,74,.16);}

/* ===== Stamp award overlay ===== */
.tgk-stamp-ov{position:fixed;inset:0;z-index:300;background:rgba(14,10,26,.9);display:none;
  align-items:center;justify-content:center;padding:24px;}
.tgk-stamp-ov.on{display:flex;}
.tgk-stamp-card{background:var(--tgk-card);border:1px solid var(--tgk-tile);border-radius:20px;padding:28px 22px;
  text-align:center;max-width:340px;width:100%;animation:tgkPop .4s cubic-bezier(.2,1.6,.4,1);}
.tgk-stamp-ring{width:120px;height:120px;margin:0 auto 12px;border-radius:50%;border:4px dashed var(--tgk-gold);
  display:flex;align-items:center;justify-content:center;font-size:56px;background:rgba(196,150,74,.1);
  animation:tgkStampIn .5s cubic-bezier(.2,1.8,.4,1) .15s backwards;}
.tgk-stamp-title{font-family:var(--tgk-hero);font-size:22px;
  background:linear-gradient(180deg,#fff,#E7D9B6);-webkit-background-clip:text;background-clip:text;color:transparent;}
.tgk-stamp-sub{font-family:var(--tgk-hand);font-size:19px;color:var(--tgk-gold);margin:4px 0 16px;}
.tgk-stamp-card .tgk-btn{margin-top:10px;}
@keyframes tgkPop{from{transform:scale(.7);opacity:0;}to{transform:scale(1);opacity:1;}}
@keyframes tgkStampIn{from{transform:scale(2.4) rotate(-18deg);opacity:0;}to{transform:scale(1) rotate(-6deg);opacity:1;}}

/* ===== Lantern confetti ===== */
.tgk-confetti{position:fixed;inset:0;pointer-events:none;z-index:290;overflow:hidden;}
.tgk-confetti span{position:absolute;top:-40px;font-size:22px;animation:tgkFall linear forwards;}
@keyframes tgkFall{to{transform:translateY(110vh) rotate(340deg);opacity:.9;}}

/* ===== Result banner (inline win/lose strip) ===== */
.tgk-result{margin:14px 16px;border-radius:14px;padding:14px 16px;text-align:center;font-weight:700;font-size:16px;display:none;}
.tgk-result.on{display:block;animation:tgkPop .3s cubic-bezier(.2,1.6,.4,1);}
.tgk-result.win{background:rgba(29,158,117,.16);border:1.5px solid var(--tgk-green);color:#3fd29a;}
.tgk-result.lose{background:rgba(226,75,74,.14);border:1.5px solid rgba(226,75,74,.5);color:#f0908f;}

/* ===== Shared game page header ===== */
.tgk-head{text-align:center;padding:22px 16px 4px;}
.tgk-title{font-family:var(--tgk-hero);font-size:26px;line-height:1.15;
  background:linear-gradient(180deg,#fff,#F0C8A0);-webkit-background-clip:text;background-clip:text;color:transparent;}
.tgk-sub{font-family:var(--tgk-hand);font-size:18px;color:var(--tgk-gold);margin-top:4px;}

/* ===== Stamp target chip ===== */
.tgk-target{display:flex;align-items:center;justify-content:center;gap:8px;margin:10px 16px 0;
  background:var(--tgk-card);border:1.5px dashed var(--tgk-gold);border-radius:999px;padding:9px 16px;
  font-size:13.5px;font-weight:700;color:var(--tgk-sec);}
.tgk-target b{color:#fff;}
.tgk-target.stamped{border-style:solid;border-color:var(--tgk-green);color:#3fd29a;}

@media (prefers-reduced-motion: reduce){
  .tgk-confetti span{display:none;}
  .tgk-stamp-ring,.tgk-stamp-card,.tgk-result.on{animation:none;}
}
