


.cg-fan{transform-style:flat}
.c3{--th:3px;transform-style:flat;perspective:1100px;touch-action:none;transition:transform 1.1s cubic-bezier(.2,.85,.25,1)}
.c3 .f{transform:translateZ(calc(var(--th) / 2));box-shadow:0 22px 38px -16px rgba(0,0,0,.9),0 3px 8px rgba(0,0,0,.45),0 0 0 1px rgba(233,196,106,.2)}
.c3 .f.back{transform:rotateY(180deg) translateZ(calc(var(--th) / 2))}
.c3 .f::after{mix-blend-mode:normal;background:linear-gradient(115deg,transparent 32%,rgba(255,255,255,.13) 46%,transparent 58%);background-size:250% 100%;background-position:var(--shine,120%) 0}
.e{position:absolute;background:linear-gradient(90deg,#070a18,#2c3360 50%,#070a18);backface-visibility:visible;-webkit-backface-visibility:visible;pointer-events:none}
.e.l,.e.r{top:2px;bottom:2px;width:var(--th)}
.e.l{left:calc(var(--th) / -2);transform:rotateY(-90deg)}
.e.r{right:calc(var(--th) / -2);transform:rotateY(90deg)}
.e.t,.e.b{left:2px;right:2px;height:var(--th);background:linear-gradient(180deg,#070a18,#2c3360 50%,#070a18)}
.e.t{top:calc(var(--th) / -2);transform:rotateX(90deg)}
.e.b{bottom:calc(var(--th) / -2);transform:rotateX(-90deg)}
.c3.held{transition:none;cursor:grabbing}
.c3.held .f{box-shadow:0 calc(26px + var(--lift,0) * 44px) calc(40px + var(--lift,0) * 40px) -18px rgba(0,0,0,.92),0 0 0 1px rgba(233,196,106,.35)}
.c3.away{opacity:0;transition:opacity .12s}
.cg-stage-ctl span b{color:var(--gold);font-weight:700}


html.cg-noscroll{overflow:hidden}
.ins{position:fixed;inset:0;z-index:95;display:grid;grid-template-rows:auto minmax(0,1fr) auto;justify-items:center;align-items:center;gap:10px;padding:14px 16px 16px;
  background:radial-gradient(80% 70% at 50% 45%,rgba(22,32,74,.94),rgba(3,5,15,.97));opacity:0;transition:opacity .35s;touch-action:none;overscroll-behavior:contain}
.ins.on{opacity:1}
.ins[hidden]{display:none}
.ins-top{width:min(100%,760px);display:flex;align-items:center;justify-content:space-between;gap:12px}
.ins-info{margin:0;display:flex;flex-direction:column;gap:3px}
.ins-info b{font:800 20px/1.1 var(--serif);color:#fff}
.ins-info span{font:11px/1.4 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}
.ins-x{flex:none;width:44px;height:44px;border-radius:50%;border:1px solid var(--rule);background:rgba(255,255,255,.06);color:#fff;font-size:26px;line-height:1;cursor:pointer}
.ins-x:hover,.ins-x:focus-visible{border-color:var(--gold);outline:none}
.ins-card{--th:4px;position:relative;width:min(86vw,calc(min(70vh,700px) * .7168));aspect-ratio:744/1038;perspective:1500px;transition:transform .5s cubic-bezier(.2,.8,.2,1);cursor:grab;touch-action:none}
.ins.zoomed .ins-card{cursor:move}
.ins-tilt,.ins-zoom,.ins-card .in{position:absolute;inset:0;transform-style:preserve-3d}
.ins-tilt{will-change:transform}
.ins-zoom{transition:transform .12s ease-out}
.ins-card .in{transition:transform .8s cubic-bezier(.3,.7,.2,1)}
.ins-card .in.flip{transform:rotateY(180deg)}
.ins-card .f{position:absolute;inset:0;border-radius:4.6%/3.3%;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden;isolation:isolate;transform:translateZ(calc(var(--th) / 2));
  box-shadow:0 40px 80px -30px #000,0 0 0 1px rgba(233,196,106,.3)}
.ins-card .f.back{transform:rotateY(180deg) translateZ(calc(var(--th) / 2))}
.ins-card .f img{display:block;width:100%;height:100%;object-fit:cover;user-select:none;-webkit-user-select:none}
.ins-sheen{position:absolute;inset:0;pointer-events:none;background:radial-gradient(60% 45% at var(--sx,50%) var(--sy,40%),rgba(255,255,255,.2),transparent 70%);mix-blend-mode:soft-light}

.ins-foil{position:absolute;inset:0;pointer-events:none}
.ins-foil.fx-holo{background:linear-gradient(calc(115deg + var(--hue,0deg)),transparent 15%,#ff6ec7 30%,#ffd36e 40%,#7dff9e 50%,#6ee7ff 60%,#a78bff 70%,transparent 85%);background-size:240% 240%;background-position:var(--sx,50%) var(--sy,50%);mix-blend-mode:screen;opacity:.3}
.ins-foil.fx-holo::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(calc(60deg + var(--hue,0deg)),rgba(255,255,255,.0) 0 6px,rgba(255,255,255,.18) 7px 8px);mix-blend-mode:overlay}
.ins-foil i{position:absolute;display:block}
.ins-foil.fx-medal i{border-radius:1.6%/1.15%;mix-blend-mode:overlay;background:linear-gradient(115deg,rgba(255,255,255,0) 25%,rgba(255,255,255,.95) 45%,rgba(255,255,255,0) 62%),var(--m);background-size:320% 100%,100% 100%;background-position:var(--sx,50%) 0,0 0;opacity:.9}
.ins-foil.fx-medal i.fx-g{--m:linear-gradient(160deg,#fff4c2,#e5b43c 45%,#8f6417)}
.ins-foil.fx-medal i.fx-s{--m:linear-gradient(160deg,#ffffff,#c2c9d6 45%,#6f798c)}
.ins-foil.fx-medal i.fx-b{--m:linear-gradient(160deg,#ffd9bd,#c97a45 45%,#6e3816)}
.ins-foil.fx-frame i.fx-frame{inset:2.85% 4%;padding:1.9%;border-radius:3.4%/2.4%;
  background:linear-gradient(115deg,#8f6417 0%,#e5b43c 30%,#fff6cf var(--sx,50%),#e5b43c 70%,#8f6417 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  box-shadow:0 0 6px rgba(255,214,120,.35)}
.ins-bar{width:min(100%,760px);display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px 14px}
.ins-seg{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.ins-seg span{font:10.5px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-faint);margin-right:2px}
.ins-seg button,.ins-ctl button{min-height:36px;padding:0 12px;border-radius:999px;border:1px solid var(--rule);background:rgba(255,255,255,.05);color:var(--ink);font:600 13px var(--sans);cursor:pointer}
.ins-seg button[aria-pressed="true"]{border-color:var(--gold);background:rgba(244,185,66,.16);color:#fff}
.ins-ctl{display:flex;align-items:center;gap:6px}
.ins-ctl button{min-width:36px;padding:0 10px;font-size:16px}
.ins-ctl #inspFlip{font-size:13px;padding:0 14px}
.ins-ctl span{font:12px var(--mono);color:var(--ink-faint);min-width:44px;text-align:center}
.ins-note{grid-column:1/-1;margin:0;min-height:1.3em;font-size:13.5px;color:var(--gold)}
.ins-tip{grid-column:1/-1;margin:0;font:10.5px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint)}
@media (max-width:620px){
  .ins{padding:10px 12px 12px;gap:8px}
  .ins-card{width:min(88vw,calc(62vh * .7168))}
  .ins-bar{grid-template-columns:1fr}
  .ins-ctl{justify-content:flex-start}
  .ins-info b{font-size:17px}
  .ins-seg button{min-height:34px;padding:0 10px;font-size:12.5px}
}


.cg-g-hud{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.cg-g-mode{display:flex;gap:4px;padding:3px;border:1px solid var(--rule);border-radius:999px;background:rgba(0,0,0,.25)}
.cg-g-mode button{min-height:32px;padding:0 12px;border:0;border-radius:999px;background:none;color:var(--ink-faint);font:600 12.5px var(--sans);cursor:pointer}
.cg-g-mode button[aria-pressed="true"]{background:var(--gold);color:#1a1405}
.cg-g-score{display:flex;align-items:center;gap:12px;font:11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint)}
.cg-g-score b{font:800 18px/1 var(--serif);color:#fff;letter-spacing:0;font-variant-numeric:tabular-nums;margin-left:4px}
.cg-g-streak{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:999px;background:linear-gradient(90deg,#ff7a2f,#f4b942);color:#1a1004;font-weight:700;animation:cgPulse 1.2s ease-in-out infinite}
.cg-g-streak[hidden]{display:none}
.cg-g-streak b{color:#1a1004;font-size:14px}
@keyframes cgPulse{50%{box-shadow:0 0 18px rgba(255,140,50,.6)}}
.cg-g-sound{min-height:32px;padding:0 12px;border-radius:999px;border:1px solid var(--rule);background:none;color:var(--ink-faint);font:600 12px var(--sans);cursor:pointer}
.cg-g-sound[aria-pressed="true"]{color:#fff;border-color:var(--gold)}
.cg-g-daily{margin:0 0 6px;min-height:0;font-size:13.5px;color:var(--gold);text-align:center}
.cg-g-daily:empty{display:none}
.cg-timer.hurry{animation:cgHurry .5s ease-in-out infinite alternate}
.cg-timer.hurry .fg{stroke:#ff6b5b}
@keyframes cgHurry{to{transform:scale(1.12)}}
.cg-g-table{position:relative}
.cg-g-card.shake{animation:cgShake .42s ease}
@keyframes cgShake{20%{translate:-7px 0}40%{translate:6px 0}60%{translate:-4px 0}80%{translate:2px 0}}
.cg-g-stats button[data-medal="g"]{border-color:#e5b43c;box-shadow:inset 0 0 0 1px rgba(229,180,60,.5),0 0 14px rgba(229,180,60,.25)}
.cg-g-stats button[data-medal="s"]{border-color:#c2c9d6;box-shadow:inset 0 0 0 1px rgba(194,201,214,.45)}
.cg-g-stats button[data-medal="b"]{border-color:#c97a45;box-shadow:inset 0 0 0 1px rgba(201,122,69,.45)}
.cg-g-stats button[data-medal="g"] b{color:#ffd970}.cg-g-stats button[data-medal="s"] b{color:#eef2f8}.cg-g-stats button[data-medal="b"] b{color:#f3ad7c}

.cg-battle{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:6;display:grid;grid-template-columns:auto 1fr;grid-template-areas:"y yb" "s s" "m mb";align-items:center;gap:6px 10px;
  width:min(92%,340px);padding:12px 14px;border-radius:16px;background:rgba(5,8,24,.9);border:1px solid var(--rule);box-shadow:0 20px 40px -12px #000;animation:cgPop .25s ease-out}
.cg-battle[hidden]{display:none}
.cg-battle b{font:800 30px/1 var(--serif);color:#fff;font-variant-numeric:tabular-nums;min-width:2.2ch;text-align:right;transition:transform .2s,color .2s}
#btYou{grid-area:y}#btMe{grid-area:m}
.cg-battle i{display:block;height:10px;border-radius:5px;background:rgba(255,255,255,.08);overflow:hidden}
.cg-battle i.y{grid-area:yb}.cg-battle i.m{grid-area:mb}
.cg-battle s{display:block;height:100%;transform-origin:0 50%;transform:scaleX(0);border-radius:5px}
.cg-battle i.y s{background:linear-gradient(90deg,#b8862a,#f6dc8c)}.cg-battle i.m s{background:linear-gradient(90deg,#3a64c8,#9fe3ff)}
.cg-battle em{grid-area:s;font:700 11px var(--mono);font-style:normal;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-faint);text-align:center}
.cg-battle.you #btYou{color:var(--gold);transform:scale(1.25)}
.cg-battle.me #btMe{color:#9fe3ff;transform:scale(1.25)}
@keyframes cgPop{from{opacity:0;transform:translate(-50%,-50%) scale(.85)}}

.cg-medal{position:absolute;left:50%;top:6%;transform:translateX(-50%);z-index:7;padding:10px 18px;border-radius:14px;text-align:center;white-space:nowrap;box-shadow:0 14px 34px -10px #000;animation:cgMedal 1.5s ease both}
.cg-medal[hidden]{display:none}
.cg-medal b{display:block;font:800 19px/1.1 var(--serif);color:#1a1405}
.cg-medal span{display:block;margin-top:3px;font:600 11.5px var(--sans);color:rgba(26,20,5,.8)}
.cg-medal.g{background:linear-gradient(160deg,#fff1b8,#f2c95a 45%,#b8862a)}
.cg-medal.s{background:linear-gradient(160deg,#fff,#d3d9e3 45%,#8e98aa)}
.cg-medal.b{background:linear-gradient(160deg,#ffd2b0,#d48a55 45%,#8a4a24)}
@keyframes cgMedal{0%{opacity:0;transform:translateX(-50%) scale(.6) rotate(-4deg)}14%{opacity:1;transform:translateX(-50%) scale(1.08)}24%{transform:translateX(-50%) scale(1)}82%{opacity:1}100%{opacity:0;transform:translateX(-50%) translateY(-10px)}}
.cg-float{position:absolute;left:50%;top:30%;z-index:8;font:800 26px/1 var(--serif);color:var(--gold);text-shadow:0 2px 10px #000;pointer-events:none;animation:cgFloat 1.2s ease-out forwards}
@keyframes cgFloat{from{opacity:0;transform:translate(-50%,10px) scale(.8)}20%{opacity:1;transform:translate(-50%,0) scale(1.1)}to{opacity:0;transform:translate(-50%,-46px)}}

.cg-pack{position:absolute;left:50%;top:50%;width:min(46%,210px);aspect-ratio:480/700;transform:translate(-50%,-50%);z-index:5;border:0;padding:0;background:none;cursor:default}
.cg-pack[hidden]{display:none}
.cg-pack .pk-body,.cg-pack .pk-top{position:absolute;left:0;right:0;border-radius:10px;
  background:linear-gradient(115deg,#7a5a14 0%,#e9c46a 22%,#fff2c4 34%,#d9a93e 48%,#6c4c10 62%,#e9c46a 80%,#a37a22 100%);background-size:220% 100%;animation:cgFoil 3s linear infinite;
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.25),0 22px 40px -14px #000}
.cg-pack .pk-top{top:0;height:14%;border-radius:10px 10px 3px 3px;clip-path:polygon(0 0,100% 0,100% 70%,94% 100%,88% 70%,82% 100%,76% 70%,70% 100%,64% 70%,58% 100%,52% 70%,46% 100%,40% 70%,34% 100%,28% 70%,22% 100%,16% 70%,10% 100%,4% 70%,0 100%);transition:transform .45s cubic-bezier(.3,.7,.3,1),opacity .45s}
.cg-pack .pk-body{top:12%;bottom:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#2a1c03;transition:transform .45s ease-in,opacity .45s}
.cg-pack .pk-body img{width:38%;filter:drop-shadow(0 2px 3px rgba(0,0,0,.35))}
.cg-pack .pk-body b{font:800 clamp(16px,2.2vw,22px)/1 var(--serif)}
.cg-pack .pk-body small{font:700 10px var(--mono);letter-spacing:.16em;text-transform:uppercase;opacity:.75}
@keyframes cgFoil{to{background-position:-220% 0}}
.cg-pack.shake{animation:cgPackShake .5s ease}
@keyframes cgPackShake{20%{transform:translate(-50%,-50%) rotate(-4deg)}40%{transform:translate(-50%,-50%) rotate(4deg)}60%{transform:translate(-50%,-50%) rotate(-3deg)}80%{transform:translate(-50%,-50%) rotate(2deg)}}
.cg-pack.torn .pk-top{transform:translate(30%,-90%) rotate(18deg);opacity:0}
.cg-pack.torn .pk-body{transform:translateY(40%) scale(.92);opacity:0;transition-delay:.25s}
.cg-burst{position:absolute;left:50%;top:50%;width:min(30%,150px);aspect-ratio:480/670;transform:translate(-50%,-50%);z-index:6;pointer-events:none}
.cg-burst[hidden]{display:none}
.cg-burst img{position:absolute;inset:0;width:100%;height:100%;border-radius:9px;box-shadow:0 16px 30px -12px #000;transition:transform .55s cubic-bezier(.2,.9,.25,1.15),opacity .4s;transform:translateY(20%) scale(.7)}
.cg-burst img.m{box-shadow:0 0 0 2px #e5b43c,0 0 22px rgba(229,180,60,.7),0 16px 30px -12px #000}
.cg-burst.out img{transform:translateX(calc(var(--k) * 62%)) translateY(calc(var(--k) * var(--k) * 5% - 6%)) rotate(calc(var(--k) * 9deg));transition-delay:calc((var(--k) + 2) * 60ms)}
.cg-burst.home img{transform:translateX(-95%) translateY(0) scale(.85);opacity:0;transition-duration:.38s}

.cg-game.ended .cg-g-table{opacity:.35;transition:opacity .4s}
.cg-g-end{margin-top:12px;padding:16px;border-radius:16px;border:1px solid var(--gold);background:rgba(244,185,66,.07);text-align:center;animation:cgPop2 .35s ease-out}
.cg-g-end[hidden]{display:none}
.cg-g-end .t{margin:0;font:800 24px/1.1 var(--serif);color:#fff}
.cg-g-sum{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0}
.cg-g-sum span{display:flex;flex-direction:column;gap:3px;font:10px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint)}
.cg-g-sum b{font:800 24px/1 var(--serif);color:var(--gold);letter-spacing:0}
.cg-g-end .s{margin:0 0 12px;font-size:14px;color:var(--ink)}
.cg-g-end .s b{color:var(--gold)}
.cg-g-endbtn{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
@keyframes cgPop2{from{opacity:0;transform:translateY(8px)}}
@media (max-width:520px){.cg-g-hud{justify-content:center}.cg-g-sum b{font-size:20px}.cg-battle b{font-size:24px}.cg-medal b{font-size:16px}}
@media (prefers-reduced-motion:reduce){.cg-g-streak,.cg-pack .pk-body,.cg-pack .pk-top,.cg-timer.hurry{animation:none}}

.cg-dbar[data-medal="g"] b{background:linear-gradient(90deg,#b8862a,#f6dc8c)}.cg-dbar[data-medal="s"] b{background:linear-gradient(90deg,#8e98aa,#f4f6fa)}.cg-dbar[data-medal="b"] b{background:linear-gradient(90deg,#8a4a24,#f0b48a)}
.cg-dbar[data-medal="g"] em::after{content:" 1st";color:#ffd970;font-size:.8em}.cg-dbar[data-medal="s"] em::after{content:" 2nd";color:#eef2f8;font-size:.8em}.cg-dbar[data-medal="b"] em::after{content:" 3rd";color:#f3ad7c;font-size:.8em}



.ins-bar{grid-template-columns:1fr;justify-items:center}
.ins-tip{text-align:center}

.ins-top,.ins-bar{position:relative;z-index:2}
.ins-bar{pointer-events:none}.ins-bar>*{pointer-events:auto}
.ins.zoomed .ins-ctl,.ins.zoomed .ins-info{background:rgba(3,5,15,.84);border-radius:14px;padding:6px 10px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.ins.zoomed .ins-tip{visibility:hidden}


.cg-who{display:grid;gap:10px;margin:16px 0 0}
.cg-who label{display:grid;gap:4px;font-size:14px;color:#9aa4b8}
.cg-who input:not([type=checkbox]){width:100%;box-sizing:border-box;padding:11px 12px;border-radius:10px;border:1px solid rgba(221,227,238,.2);background:#0c121d;color:#fff;font:inherit;font-size:16px}
.cg-who input:focus-visible{outline:2px solid #f4b942;outline-offset:1px}
.cg-who .cg-tick{display:block;line-height:1.45}
.cg-who .cg-tick a{color:#f4b942}
.cg-who .cg-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.cg-err{margin:4px 0 0;color:#ff9b8a;font-size:14px}
.cg-who [hidden]{display:none}
