/* 連続ギフトの演出（COMBO1026）。動きは transform と opacity だけ。どれも押せない（pointer-events:none） */
/* 数の札: 上の帯（.hgf-band・高さ約62px）のすぐ下 */
.gcb{position:fixed;z-index:100003;left:50%;top:calc(env(safe-area-inset-top,0px) + 80px);display:flex;align-items:center;gap:8px;max-width:calc(100vw - 32px);box-sizing:border-box;padding:6px 14px 6px 6px;border-radius:999px;color:#fff;background:linear-gradient(100deg,#3b1d5e,#7a2f7c 60%,#b5477a);border:1.5px solid rgba(255,221,140,.75);box-shadow:0 8px 22px rgba(40,10,60,.35);pointer-events:none;font-family:inherit;line-height:1.25;transform:translate(-50%,-12px) scale(.9);opacity:0}
.gcb.is-in{animation:gcbIn .42s cubic-bezier(.2,1.5,.4,1) forwards}
.gcb.is-out{animation:gcbOut .35s ease-in forwards}
.gcb__glow{position:absolute;inset:-8px;border-radius:999px;background:radial-gradient(closest-side,rgba(255,214,110,.55),rgba(255,214,110,0));opacity:0;z-index:-1}
.gcb__art{flex:0 0 auto;width:38px;height:38px;border-radius:50%;object-fit:cover;background:rgba(255,255,255,.16)}
.gcb__art--emo{display:flex;align-items:center;justify-content:center;font-size:22px}
.gcb__n{flex:0 0 auto;font-size:26px;font-weight:900;letter-spacing:.02em;color:#ffe08a;text-shadow:0 2px 0 rgba(80,30,0,.45)}
.gcb__n i{font-style:normal;font-size:.62em;margin-right:1px}
.gcb__p{flex:0 0 auto;padding:2px 7px;border-radius:999px;font-size:12px;font-weight:900;color:#3a2000;background:#ffe08a}
.gcb--dt .gcb__p{color:#fff;background:#7a2fb0}
.gcb__t{min-width:0;font-size:12px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gcb__t small{display:block;font-size:9.5px;letter-spacing:.12em;color:#ffe08a;font-weight:900}
/* ×3: 光が強くなる */
.gcb--t3{border-color:#ffd25e}
.gcb--t3 .gcb__glow{animation:gcbGlow 1.1s ease-in-out infinite}
.gcb--t3 .gcb__n{font-size:30px}
/* ×5 */
.gcb--t5{background:linear-gradient(100deg,#5a2a00,#b8741a 55%,#e8b13a);border-color:#fff1b8}
.gcb--t5 .gcb__glow{inset:-14px;background:radial-gradient(closest-side,rgba(255,226,140,.8),rgba(255,214,110,0));animation:gcbGlow .8s ease-in-out infinite}
.gcb--t5 .gcb__n{font-size:34px;color:#fff6cf}
/* ×10 */
.gcb--t10{background:linear-gradient(100deg,#6b3a00,#e0a020 50%,#fff0a8);border:2px solid #fff;color:#3a2000}
.gcb--t10 .gcb__t,.gcb--t10 .gcb__t small{color:#3a2000}
.gcb--t10 .gcb__glow{inset:-20px;background:radial-gradient(closest-side,rgba(255,240,170,.95),rgba(255,214,110,0));animation:gcbGlow .6s ease-in-out infinite}
.gcb--t10 .gcb__n{font-size:38px;color:#fff;text-shadow:0 2px 0 #8a4b00,0 0 2px #8a4b00}
/* 堕天ギフト: 闇の色 */
.gcb--dt{background:linear-gradient(100deg,#0d0814,#2a1040 55%,#5a1430);border-color:rgba(190,120,255,.8)}
.gcb--dt .gcb__glow{background:radial-gradient(closest-side,rgba(155,77,255,.6),rgba(155,77,255,0))}
.gcb--dt .gcb__n,.gcb--dt .gcb__t small{color:#e6c6ff}
.gcb--dt.gcb--t5,.gcb--dt.gcb--t10{background:linear-gradient(100deg,#07040b,#3a0f5a 50%,#8a1035);border-color:#e6c6ff;color:#fff}
.gcb--dt.gcb--t10 .gcb__t,.gcb--dt.gcb--t10 .gcb__t small{color:#f3e6ff}
.gcb--dt.gcb--t10 .gcb__n{color:#fff;text-shadow:0 0 2px #2a0040,0 2px 0 #5a0f2a}
.gcb--dt.gcb--t5 .gcb__glow,.gcb--dt.gcb--t10 .gcb__glow{background:radial-gradient(closest-side,rgba(190,90,255,.85),rgba(155,77,255,0))}
@keyframes gcbIn{0%{transform:translate(-50%,-12px) scale(.9);opacity:0}60%{transform:translate(-50%,0) scale(1.12);opacity:1}100%{transform:translate(-50%,0) scale(1);opacity:1}}
@keyframes gcbOut{from{transform:translate(-50%,0) scale(1);opacity:1}to{transform:translate(-50%,-10px) scale(.95);opacity:0}}
@keyframes gcbGlow{0%,100%{opacity:.35}50%{opacity:1}}

/* ×5〜: 画面のふちが光る（影は動かさず、重ねた枠の濃さだけを変える） */
.gcb-edge{position:fixed;inset:0;z-index:100001;pointer-events:none;box-shadow:inset 0 0 0 3px rgba(255,226,140,.9),inset 0 0 48px 12px rgba(255,190,60,.55);opacity:0;animation:gcbEdge 2.2s ease-in-out forwards}
.gcb-edge.is-max{box-shadow:inset 0 0 0 4px #fff3c4,inset 0 0 70px 20px rgba(255,200,70,.7)}
.gcb-edge--dt{box-shadow:inset 0 0 0 3px rgba(200,140,255,.9),inset 0 0 52px 14px rgba(120,30,170,.6)}
.gcb-edge--dt.is-max{box-shadow:inset 0 0 0 4px #e6c6ff,inset 0 0 76px 22px rgba(150,20,90,.7)}
@keyframes gcbEdge{0%{opacity:0}18%{opacity:1}40%{opacity:.4}60%{opacity:1}100%{opacity:0}}

/* ×10・×20…: 全画面（3.9秒・押せない＝操作は塞がない） */
.gcb-fs{position:fixed;inset:0;z-index:100002;pointer-events:none;overflow:hidden;display:flex;align-items:center;justify-content:center;opacity:0;animation:gcbFs 3.9s ease-in-out forwards;contain:strict}
@keyframes gcbFs{0%{opacity:0}8%{opacity:1}86%{opacity:1}100%{opacity:0}}
.gcb-fs__bg,.gcb-fs__veil{position:absolute;inset:0}
.gcb-fs__lord{position:absolute;left:50%;top:22%;width:min(70vw,340px);margin-left:calc(min(70vw,340px) / -2)}
.gcb-fs__lord img{display:block;width:100%;height:auto}
.gcb-fs__txt{position:relative;text-align:center;margin-top:34vh;color:#fff;transform:scale(.4);opacity:0;animation:gcbTxt .7s .55s cubic-bezier(.2,1.6,.4,1) forwards}
.gcb-fs__txt b{display:block;font-size:min(22vw,96px);font-weight:900;line-height:1;letter-spacing:.02em}
.gcb-fs__txt b i{font-style:normal;font-size:.55em;margin-right:2px}
.gcb-fs__txt span{display:block;margin-top:2px;font-size:min(7vw,30px);font-weight:900;letter-spacing:.24em}
.gcb-fs__txt small{display:inline-block;margin:10px auto 0;max-width:86vw;padding:3px 12px;border-radius:999px;background:rgba(30,12,0,.5);font-size:13px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@keyframes gcbTxt{to{transform:scale(1);opacity:1}}
.gcb-fs__fx{position:absolute;top:-6vh;width:8px;height:14px;border-radius:2px;opacity:0;animation:gcbFall 2.6s linear forwards}
@keyframes gcbFall{0%{transform:translate(0,0) rotate(0);opacity:0}10%{opacity:1}100%{transform:translate(var(--x),112vh) rotate(var(--r));opacity:.9}}
/* 金の光 */
.gcb-fs--gold .gcb-fs__bg{background:radial-gradient(circle at 50% 45%,rgba(255,236,170,.75),rgba(230,160,40,.45) 40%,rgba(60,30,0,.55) 80%)}
.gcb-fs__rays{position:absolute;left:50%;top:45%;width:150vmax;height:150vmax;margin:-75vmax 0 0 -75vmax;background:center/contain no-repeat;opacity:.8;animation:gcbSpin 3.9s linear forwards}
@keyframes gcbSpin{from{transform:rotate(0) scale(.7)}to{transform:rotate(60deg) scale(1.05)}}
.gcb-fs--gold .gcb-fs__lord{transform:translateY(-30vh) scale(.6);opacity:0;animation:gcbCrown .9s .1s cubic-bezier(.2,1.4,.4,1) forwards}
@keyframes gcbCrown{to{transform:none;opacity:1}}
.gcb-fs--gold .gcb-fs__fx{background:linear-gradient(#fff6cf,#e6a91e)}
.gcb-fs--gold .gcb-fs__fx:nth-child(3n){width:5px;height:5px;border-radius:50%;background:#fff}
.gcb-fs--gold .gcb-fs__txt b{color:#fff6cf;text-shadow:0 3px 0 #9a5a00,0 0 24px rgba(255,200,80,.9)}
.gcb-fs--gold .gcb-fs__txt span{color:#fff;text-shadow:0 2px 0 #9a5a00}
.gcb-fs--gold .gcb-fs__txt small{color:#fff;text-shadow:0 1px 3px rgba(60,30,0,.8)}
/* 堕天ギフト: 魔王が降りてくる闇 */
.gcb-fs--dt .gcb-fs__bg{background:center/cover no-repeat #07040b;opacity:0;animation:gcbDark .6s ease-out forwards}
@keyframes gcbDark{to{opacity:.92}}
.gcb-fs--dt .gcb-fs__veil{background:radial-gradient(circle at 50% 38%,rgba(155,77,255,.35),rgba(7,4,11,.2) 35%,rgba(7,4,11,.85) 85%)}
.gcb-fs--dt .gcb-fs__lord{transform:translateY(-70vh) scale(.8);opacity:0;animation:gcbLord 1.7s .25s cubic-bezier(.15,.85,.3,1) forwards}
@keyframes gcbLord{0%{transform:translateY(-70vh) scale(.8);opacity:0}25%{opacity:1}100%{transform:none;opacity:1}}
.gcb-fs--dt .gcb-fs__lord::after{content:"";position:absolute;inset:-30%;z-index:-1;background:radial-gradient(closest-side,rgba(170,80,255,.7),rgba(120,20,90,0));opacity:0;animation:gcbGlow 1.2s 1.6s ease-in-out infinite}
.gcb-fs--dt .gcb-fs__fx{width:6px;height:22px;border-radius:50% 50% 50% 50%/80% 80% 20% 20%;background:linear-gradient(#2a0a24,#8a1035)}
.gcb-fs--dt .gcb-fs__txt b{color:#f3e6ff;text-shadow:0 3px 0 #3a0050,0 0 26px rgba(170,80,255,.95)}
.gcb-fs--dt .gcb-fs__txt span{color:#ff9cc0;text-shadow:0 2px 0 #3a0010;letter-spacing:.3em}
.gcb-fs--dt .gcb-fs__txt small{color:#e6d6f5}

/* 動きを減らす設定: 数の札だけ（画面側でもふちの光・全画面は出さない）。動きを止めて薄く出す */
.gcb.is-reduced,.gcb.is-reduced.is-in{animation:none;transform:translate(-50%,0);opacity:1}
.gcb.is-reduced.is-out{animation:none;opacity:0}
@media (prefers-reduced-motion:reduce){
	.gcb,.gcb.is-in,.gcb .gcb__glow{animation:none!important}
	.gcb.is-in{transform:translate(-50%,0);opacity:1}
	.gcb-edge,.gcb-fs{display:none!important}
}
