/* GIFTSHOW1027 v2 隅に浮かぶ飾り・舞う粒・登場・人のカードの印。段（gs-t1〜4）が上がるほど派手。動きは transform・opacity */
.gs-fx-dark{--c1:#c78bff;--c2:#ff9ad9;--c3:#ffd77a}
.gs-fx-light{--c1:#ffe08a;--c2:#fffbe8;--c3:#ffc94a}
.gs-fx-heart{--c1:#ff9fcf;--c2:#ffe0ef;--c3:#ffd76b}
.gs-fx-gold{--c1:#ffd25a;--c2:#fff1b8;--c3:#ffae2e}
.gs-layer{position:fixed;inset:0;z-index:880;pointer-events:none} /* 下のナビ（z900）より下・ページの浮かぶ物より上 */
.gs-cv{position:fixed;left:0;top:0;z-index:85;pointer-events:none}
.gs-layer.is-hide .gs-cv,.gs-layer.is-hide .gs-stk,.gs-layer.is-hide .gs-mist{display:none}

/* ---- 飾り ---- */
.gs-stk{position:fixed;z-index:90;width:var(--s,110px);height:var(--s,110px);pointer-events:none;transition:opacity .35s}
.gs-stk>i,.gs-stk>span{position:absolute;pointer-events:none}
.gs-stk.is-wait{opacity:0}
.gs-stk.is-land{animation:gs-land .55s cubic-bezier(.3,1.6,.5,1)}
.gs-aura{inset:-16%;border-radius:50%;background:radial-gradient(closest-side,rgba(255,255,255,.95),var(--c1) 42%,rgba(255,255,255,0) 74%);opacity:.5;animation:gs-pulse 2.8s ease-in-out infinite}
.gs-t2 .gs-aura{opacity:.62}.gs-t3 .gs-aura{inset:-24%;opacity:.78}.gs-t4 .gs-aura{inset:-30%;opacity:.92;animation-duration:2.2s}
.gs-rays{inset:-40%;border-radius:50%;opacity:.5;
	background:repeating-conic-gradient(from 0deg,var(--c3) 0 6deg,rgba(255,255,255,0) 6deg 19deg);
	-webkit-mask:radial-gradient(closest-side,#000 22%,transparent 100%);mask:radial-gradient(closest-side,#000 22%,transparent 100%);animation:gs-spin 18s linear infinite}
.gs-t3 .gs-rays{inset:-52%;opacity:.62}
.gs-t4 .gs-rays{inset:-62%;opacity:.72;animation-duration:14s}
.gs-stk:not(.is-main) .gs-rays{inset:-28%;opacity:.38}
.gs-stk:not(.is-main) .gs-aura{inset:-10%}
.gs-rays--2{background:repeating-conic-gradient(from 9deg,var(--c1) 0 4deg,rgba(255,255,255,0) 4deg 15deg)!important;animation:gs-spin 24s linear infinite reverse!important;opacity:.55!important}
.gs-orb{inset:-26%;transform:rotate(-14deg) scaleY(.34)}
.gs-ring{position:absolute;inset:0;border-radius:50%;border:3px solid;border-color:var(--c3) rgba(255,255,255,.2) var(--c1) rgba(255,255,255,.75);box-shadow:0 0 12px var(--c1);animation:gs-spin 3.4s linear infinite}
.gs-t4 .gs-ring{border-width:4px;animation-duration:2.6s}
.gs-sat{position:absolute;width:11px;height:30px;margin:-15px 0 0 -5.5px;border-radius:50%;background:radial-gradient(closest-side,#fff,var(--c3) 55%,rgba(255,255,255,0))}
.gs-sat1{left:50%;top:0}.gs-sat2{left:50%;top:100%}.gs-sat3{left:0;top:50%}
.gs-bob{inset:0;display:grid;place-items:center;animation:gs-float 4.2s ease-in-out infinite;z-index:1}
.gs-im{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 0 6px var(--c1)) drop-shadow(0 4px 8px rgba(80,40,120,.25))}
.gs-t4 .gs-im{filter:drop-shadow(0 0 10px var(--c1)) drop-shadow(0 0 3px #fff)}
.gs-emo{font-size:calc(var(--s,110px)*.6);line-height:1}
.gs-tw{z-index:2;width:14px;height:14px;background:#fff;opacity:0;clip-path:polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%);
	filter:drop-shadow(0 0 4px var(--c3));animation:gs-tw 2.6s ease-in-out infinite}
.gs-tw1{top:2%;left:8%}.gs-tw2{top:14%;right:-2%;width:10px;height:10px;animation-delay:.7s}.gs-tw3{bottom:6%;left:-4%;width:11px;height:11px;animation-delay:1.3s}
.gs-tw4{bottom:-2%;right:12%;animation-delay:1.9s}.gs-tw5{top:44%;right:-8%;width:9px;height:9px;animation-delay:1s}.gs-tw6{top:-6%;left:46%;width:18px;height:18px;animation-delay:.35s}
.gs-flash{inset:-34%;z-index:3;border-radius:50%;opacity:0;background:radial-gradient(closest-side,#fff,rgba(255,255,255,.7) 30%,var(--c3) 48%,rgba(255,255,255,0) 72%)}
.gs-stk.is-flash .gs-flash{animation:gs-flash .95s ease-out}
.gs-hit{position:absolute;inset:24%;z-index:4;border:0;border-radius:50%;background:transparent;padding:0;cursor:pointer;pointer-events:auto;-webkit-tap-highlight-color:transparent}
.gs-hit:focus-visible{outline:3px solid var(--c3);outline-offset:2px}

/* ---- 最上段: 画面の下から霧 ---- */
.gs-mist{position:fixed;left:-10%;right:-10%;bottom:0;height:46vh;z-index:84;pointer-events:none;
	background:radial-gradient(55% 70% at 28% 100%,color-mix(in srgb,var(--c1) 46%,transparent),transparent 72%),radial-gradient(48% 62% at 78% 100%,color-mix(in srgb,var(--c2) 40%,transparent),transparent 72%);
	animation:gs-mist 9s ease-in-out infinite alternate}
.gs-mist--2{height:34vh;opacity:.8;background:radial-gradient(40% 70% at 55% 100%,color-mix(in srgb,var(--c1) 40%,transparent),transparent 70%),radial-gradient(30% 50% at 10% 100%,color-mix(in srgb,var(--c3) 26%,transparent),transparent 70%);animation-duration:12s;animation-direction:alternate-reverse}

/* ---- 目のボタン・吹き出し ---- */
.gs-eye{position:fixed;right:4px;top:45%;z-index:92;width:32px;height:32px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.8);box-shadow:0 2px 8px rgba(90,50,130,.22);font-size:15px;line-height:32px;pointer-events:auto;cursor:pointer;opacity:.8}
.gs-bub{position:fixed;z-index:2147483000;width:min(250px,calc(100vw - 16px));padding:10px 30px 10px 12px;border-radius:14px;background:#fff;color:#4f3b59;box-shadow:0 8px 26px rgba(80,40,120,.28),inset 0 0 0 1.5px #f0d48a;font-size:12px;line-height:1.5}
.gs-bub__x{position:absolute;right:4px;top:4px;width:26px;height:26px;border:0;border-radius:50%;background:#f6eefb;color:#7a5a92;font-size:15px;line-height:26px;padding:0;cursor:pointer}
.gs-bub__n{display:block;font-size:14px;color:#5a2b86}
.gs-bub__f{display:block;font-weight:800;color:#a3367a;text-decoration:none}
.gs-bub__f.is-hid{color:#8a7a99}
.gs-bub__l{display:inline-block;margin-top:3px;padding:1px 9px;border-radius:999px;background:#fff6e0;box-shadow:inset 0 0 0 1px #efd59a;font-size:11px;font-weight:800;color:#86560f}
.gs-bub__ck{display:flex;align-items:center;gap:6px;margin:8px 0 0;font-weight:700;cursor:pointer}
.gs-bub__ck input{width:18px;height:18px;margin:0;flex:0 0 auto;accent-color:#b06ad6}
.gs-bub__m{display:block;color:#8b7f95;font-size:10.5px}

/* ---- 登場 ---- */
.gs-intro{position:fixed;inset:0;z-index:2147482000;pointer-events:auto;--hs:min(60vw,240px)}
.gs-it3{--hs:min(70vw,290px)}.gs-it4{--hs:min(80vw,340px)}
.gs-intro>i{position:fixed;pointer-events:none}
.gs-dim{inset:0;background:radial-gradient(circle at 50% 44%,rgba(60,30,100,.28),rgba(18,10,36,.6));animation:gs-in .45s ease-out both}
.gs-beam{left:50%;top:-5%;bottom:20%;width:min(54vw,260px);margin-left:max(-27vw,-130px);transform-origin:50% 0;
	background:linear-gradient(to bottom,rgba(255,250,225,.75),rgba(255,236,190,.35) 55%,rgba(255,255,255,0));-webkit-mask:linear-gradient(to right,transparent,#000 30%,#000 70%,transparent);mask:linear-gradient(to right,transparent,#000 30%,#000 70%,transparent);
	animation:gs-beam 1s ease-out .15s both}
.gs-edge{inset:0;box-shadow:inset 0 0 36px 8px var(--c1),inset 0 0 90px 18px color-mix(in srgb,var(--c3) 70%,transparent);animation:gs-edge 1.1s ease-in-out .2s infinite alternate both}
.gs-hero{position:fixed;width:var(--hs);height:var(--hs);left:calc(50% - var(--hs)/2);top:calc(44% - var(--hs)/2)}
.gs-hero__in{position:absolute;inset:0;display:grid;place-items:center;animation:gs-pop .7s cubic-bezier(.3,1.5,.5,1) both}
.gs-it3 .gs-hero__in{animation:gs-desc 1.25s cubic-bezier(.2,.8,.3,1) both}
.gs-it4 .gs-hero__in{animation:gs-desc 1.6s cubic-bezier(.2,.8,.3,1) .2s both}
.gs-hero__in>i{position:absolute}
.gs-hero__in img{position:relative;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 0 14px var(--c1)) drop-shadow(0 0 4px #fff)}
.gs-hero__in .gs-emo{font-size:calc(var(--hs)*.6)}
.gs-hero__in .gs-aura{inset:-20%;opacity:1}
.gs-hero__in .gs-rays{inset:-60%;opacity:.8}
.gs-rip{position:absolute;inset:8%;border-radius:50%;border:4px solid var(--c3);box-shadow:0 0 18px var(--c1),inset 0 0 18px var(--c1);opacity:0;animation:gs-rip 1.1s ease-out .55s both}
.gs-it3 .gs-rip{animation-delay:1.15s}.gs-it4 .gs-rip{animation-delay:1.7s}
.gs-rip--2{animation-delay:1.45s!important;border-color:var(--c1)}
.gs-it4 .gs-rip--2{animation-delay:2s!important}
.gs-cap{position:fixed;left:50%;top:calc(44% + var(--hs)/2 + 14px);transform:translateX(-50%);margin:0;max-width:86vw;padding:7px 18px;border-radius:999px;background:rgba(255,255,255,.94);
	box-shadow:0 6px 20px rgba(60,20,100,.3),inset 0 0 0 1.5px var(--c3);text-align:center;white-space:nowrap;animation:gs-cap .5s ease-out .6s both}
.gs-it3 .gs-cap{animation-delay:1.2s}.gs-it4 .gs-cap{animation-delay:1.7s}
.gs-cap b{display:block;font-size:16px;font-weight:900;color:#5a2b86}
.gs-cap small{display:block;font-size:12px;font-weight:800;color:#a3367a}
.gs-intro.is-out{pointer-events:none}
.gs-intro.is-out>i,.gs-intro.is-out .gs-cap,.gs-intro.is-out .gs-rays,.gs-intro.is-out .gs-rip{transition:opacity .5s;opacity:0!important;animation:none}

@keyframes gs-spin{to{transform:rotate(360deg)}}
@keyframes gs-pulse{0%,100%{transform:scale(.92)}50%{transform:scale(1.06)}}
@keyframes gs-float{0%,100%{transform:translateY(0) rotate(-1.5deg)}50%{transform:translateY(-7%) rotate(1.5deg)}}
@keyframes gs-tw{0%,100%{opacity:0;transform:scale(.4) rotate(0)}45%{opacity:1;transform:scale(1) rotate(45deg)}70%{opacity:0;transform:scale(.6) rotate(90deg)}}
@keyframes gs-flash{0%{opacity:0;transform:scale(.4)}25%{opacity:.95;transform:scale(1)}100%{opacity:0;transform:scale(1.35)}}
@keyframes gs-land{0%{transform:scale(1.25)}100%{transform:scale(1)}}
@keyframes gs-mist{0%{transform:translateX(-5%) scaleY(.94);opacity:.75}100%{transform:translateX(5%) scaleY(1.06);opacity:1}}
@keyframes gs-in{from{opacity:0}to{opacity:1}}
@keyframes gs-beam{0%{opacity:0;transform:scaleX(.1)}40%{opacity:1}100%{opacity:.85;transform:scaleX(1)}}
@keyframes gs-edge{from{opacity:.45}to{opacity:1}}
@keyframes gs-pop{0%{opacity:0;transform:scale(.25)}60%{opacity:1;transform:scale(1.1)}100%{transform:scale(1)}}
@keyframes gs-desc{0%{opacity:0;transform:translateY(-62vh) rotate(-540deg) scale(.3)}70%{opacity:1;transform:translateY(3%) rotate(8deg) scale(1.06)}100%{opacity:1;transform:translateY(0) rotate(0) scale(1)}}
@keyframes gs-rip{0%{opacity:.95;transform:scale(.6)}100%{opacity:0;transform:scale(2.3)}}
@keyframes gs-cap{from{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%,0)}}

/* 動きを減らす設定: 止まった豪華版（光・帯・きらめきは止めたまま見せる） */
@media (prefers-reduced-motion:reduce){
	.gs-layer *,.gs-intro *{animation:none!important;transition:none!important}
	.gs-tw{opacity:.9}.gs-flash{display:none}.gs-stk.is-wait{opacity:1}
}
@media (max-width:359px){.gs-eye{width:28px;height:28px;line-height:28px;font-size:13px}}

/* ---- 人のカードの小さな印 ---- */
.msc-chip.gs-chip{position:relative;overflow:hidden;gap:4px;padding:1px 8px 1px 3px;background:linear-gradient(120deg,#fff3d2,#ffe2f2);color:#7a3a8c;box-shadow:inset 0 0 0 1px #efc766}
.msc-chip.gs-chip--t3,.msc-chip.gs-chip--t4{background:linear-gradient(120deg,#ffe7a3,#ffc9ea 60%,#e3c8ff);box-shadow:inset 0 0 0 1.5px #e9b440,0 0 8px rgba(255,200,90,.6)}
.gs-chip img{width:18px;height:18px;object-fit:contain}
.gs-chip b{font-weight:800}
.gs-chip small{font-size:10px;color:#a3367a}
.gs-chip::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:35%;background:linear-gradient(100deg,rgba(255,255,255,0),rgba(255,255,255,.8),rgba(255,255,255,0));transform:translateX(0) skewX(-14deg);animation:gs-sweep 4.5s ease-in-out infinite;pointer-events:none}
@keyframes gs-sweep{0%,55%{transform:translateX(0) skewX(-14deg)}85%,100%{transform:translateX(420%) skewX(-14deg)}}
@media (prefers-reduced-motion:reduce){.gs-chip::after{animation:none;display:none}}