/* 안내 모듈 스타일 */
/* 클리어 화면: 코인 획득 */
.sheet.clear { position: relative; }
.sheet.clear.gd-on .meta-gain { display: none; }
.gd-reward { display: flex; flex-direction: column; align-items: center; gap: 2px; margin: 2px 0 12px; }
.gd-label { font-size: 13px; font-weight: 700; color: var(--ink-soft); }
.gd-big { display: inline-flex; align-items: center; gap: 8px; padding: 6px 22px 6px 12px; border-radius: 999px; background: linear-gradient(#fff6d6, #ffe7a3); box-shadow: inset 0 2px 0 rgba(255, 255, 255, .7), 0 3px 0 #efc25a, 0 8px 16px rgba(233, 169, 59, .28); }
.gd-big svg { width: 38px; height: 38px; }
.gd-amt { font: 400 34px/1.1 var(--display); color: #7a4a0c; font-variant-numeric: tabular-nums; min-width: 2.6ch; text-align: left; }
.gd-big.pop { animation: gd-pop .45s cubic-bezier(.3, 1.5, .5, 1); }
@keyframes gd-pop { from { transform: scale(.6); } 60% { transform: scale(1.12); } to { transform: scale(1); } }
.gd-bal { position: absolute; top: 12px; right: 14px; z-index: 2; }
.gd-bal svg { width: 20px; height: 20px; }
.gd-bal.bump { animation: gd-bump .22s ease-out; }
@keyframes gd-bump { 40% { transform: scale(1.18); } }
.gd-fly { position: absolute; z-index: 5; width: 26px; height: 26px; pointer-events: none; }
.gd-fly svg { width: 100%; height: 100%; display: block; }

/* 상점·방으로 이끄는 카드 */
.gd-card { margin-top: 14px; border: 2px solid #ffd785; background: #fffaf0; }
.gd-card .gd-thumb, .gd-card > svg.ic { width: 52px; height: 52px; object-fit: contain; flex: none; }
.gd-card.first { animation: gd-glow 1.6s ease-in-out infinite; }
@keyframes gd-glow { 0%, 100% { box-shadow: var(--shadow), 0 0 0 0 rgba(255, 196, 77, .55); } 50% { box-shadow: var(--shadow), 0 0 0 9px rgba(255, 196, 77, 0); } }

/* 상점에서 짚어 주기 */
.gd-spot { border-color: #ffb62e !important; animation: gd-glow 1.4s ease-in-out infinite; z-index: 1; }
.gd-point { position: absolute; left: 50%; top: -14px; transform: translate(-50%, -100%); pointer-events: none; animation: gd-bob .9s ease-in-out infinite; }
.gd-point span { display: block; padding: 6px 12px; border-radius: 12px; background: var(--ink); color: #fff; font-size: 13px; font-weight: 700; white-space: nowrap; }
.gd-point::after { content: ""; position: absolute; left: 50%; bottom: -6px; width: 12px; height: 12px; margin-left: -6px; background: var(--ink); transform: rotate(45deg); border-radius: 2px; }
@keyframes gd-bob { 50% { transform: translate(-50%, calc(-100% - 6px)); } }

/* 냥이 방 사용법 */
.gd-coach { position: absolute; left: 5%; right: 5%; top: 4%; z-index: 3500; display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 16px; background: rgba(255, 255, 255, .96); box-shadow: 0 4px 14px rgba(75, 44, 63, .22); animation: gd-drop .28s ease-out; }
.gd-coach p { flex: 1; margin: 0; font-size: 13.5px; font-weight: 700; line-height: 1.4; text-align: left; word-break: keep-all; }
.gd-coach .btn { width: auto; flex: none; padding: 8px 12px; font-size: 14px; white-space: nowrap; }
@keyframes gd-drop { from { opacity: 0; transform: translateY(-10px); } }
@media (prefers-reduced-motion: reduce) { .gd-card.first, .gd-spot, .gd-point, .gd-big.pop { animation: none !important; } }