/* 시즌2 · 로봇/로켓/격납고 그림 버전 (s2.css 다음에 불러옴) */

/* 아이템 바: 칸 수에 맞게 */
.itembar { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); }

/* 지도 모드 타일 3개 */
.mode-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.mode-tile { padding: 10px 6px; }
.mode-tile img.tile-ico { width: 72px; height: 72px; object-fit: contain; filter: drop-shadow(0 6px 10px rgba(0, 0, 0, 0.45)); transition: transform 0.2s; }
.mode-tile:hover img.tile-ico { transform: scale(1.08) rotate(-3deg); }
.mode-tile b { font-size: 1rem; }
.mode-tile small { font-size: 0.72rem; line-height: 1.3; }
.mode-tile.hangar { background: linear-gradient(150deg, #7ff0e0, #2d6a9c 55%, #1a2050); }
.mode-tile.launch img.tile-ico { animation: hover-up 1.6s infinite alternate ease-in-out; }
@keyframes hover-up { to { transform: translateY(-6px); } }

/* 수리 공장: 고장 난 그림 → 수리된 그림이 서서히 드러남 */
.robot-bay { height: 220px; }
.robot-bay .robot-img { position: absolute; left: 50%; top: 50%; width: 190px; height: 190px; object-fit: contain; filter: none; }
.robot-bay .robot-img.broken { opacity: calc(1 - var(--fix)); transform: translate(-50%, -48%) rotate(calc((1 - var(--fix)) * -6deg)); transition: opacity 0.7s, transform 0.7s; }
.robot-bay .robot-img.fixed { opacity: var(--fix); transform: translate(-50%, -50%) scale(calc(0.9 + var(--fix) * 0.1)); transition: opacity 0.7s, transform 0.7s; filter: drop-shadow(0 0 calc(var(--fix) * 22px) var(--cyan)); }
.robot-bay.clank .robot-img { animation: clank2 0.4s; }
@keyframes clank2 { 30% { transform: translate(-50%, -50%) scale(1.08) rotate(4deg); } }
.robot-bay.awake .robot-img.broken { display: none; }
.robot-bay.awake .robot-img.fixed { opacity: 1; animation: wakeup2 1.1s ease-out both, bob2 1.4s 1.1s infinite alternate ease-in-out; filter: drop-shadow(0 0 26px var(--rc, var(--cyan))); }
@keyframes wakeup2 { 0% { transform: translate(-50%, -40%) scale(0.7) rotate(-10deg); filter: brightness(0.4); } 45% { transform: translate(-50%, -55%) scale(1.2); filter: brightness(2.4) drop-shadow(0 0 50px #fff); } 100% { transform: translate(-50%, -50%) scale(1); } }
@keyframes bob2 { to { transform: translate(-50%, -56%); } }
.wake-ring { position: absolute; left: 50%; top: 50%; width: 60px; height: 60px; margin: -30px; border-radius: 50%; border: 4px solid var(--rc, var(--gold)); animation: ring 1.2s 0.3s ease-out both; }
@keyframes ring { from { transform: scale(0.3); opacity: 1; } to { transform: scale(5); opacity: 0; } }
.repair-done .robot-bay { height: 250px; }
.part img { width: 70%; height: 70%; object-fit: contain; opacity: 0.85; }
.part.now img { animation: spin 2.4s linear infinite; opacity: 1; }
@keyframes spin { to { transform: rotate(360deg); } }

/* 로켓: 실제 그림 + 엔진 단계별 불꽃 색 */
.rocket img { width: 120px; height: 150px; object-fit: contain; filter: drop-shadow(0 0 16px rgba(79, 227, 255, 0.5)); }
.launch-screen .pad { height: 240px; }
.blastoff .rocket img { width: 160px; height: 200px; }
.flame { --f1: var(--gold); --f2: #ff6a3d; }
.eng-2 .flame { --f1: #fff36b; --f2: #ffb52e; }
.eng-3 .flame { --f1: #9fe8ff; --f2: #3d7bff; }
.eng-4 .flame { --f1: #e0b3ff; --f2: #8a3dff; }
.eng-5 .flame { --f1: #fff; --f2: #ff6fa8; animation: rainbow 0.5s infinite alternate; }
.flame { background: linear-gradient(#fff, var(--f1) 35%, var(--f2) 75%, transparent); width: 34px; }
.turbo .flame { width: 46px; height: calc(30px + var(--power) * 80px); filter: blur(1px) drop-shadow(0 0 16px var(--f2)); }
.turbo-btn { position: absolute; left: 12px; bottom: 12px; z-index: 2; display: flex; align-items: center; gap: 6px; padding: 4px 10px 4px 4px; border-radius: 16px; border: 2px solid var(--gold); background: rgba(14, 18, 52, 0.85); color: var(--text); font: inherit; font-size: 0.8rem; line-height: 1.2; text-align: left; cursor: pointer; animation: pulse 0.8s infinite alternate; }
.turbo-btn img { width: 44px; height: 44px; object-fit: contain; }
.turbo-btn b { color: var(--gold); font-weight: 400; }
.turbo-tag { position: absolute; left: 12px; bottom: 12px; z-index: 2; padding: 4px 12px; border-radius: 99px; background: linear-gradient(90deg, #ff6a3d, var(--gold)); color: #4a2a00; }
.launch-screen.turbo .pad { box-shadow: inset 0 0 40px rgba(255, 106, 61, 0.5); border-color: #ff6a3d; }

/* 보스: 거대 로봇 */
.vs-mech { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 6px; width: 100%; }
.vs-mech .mech-img { width: 100%; max-width: 170px; justify-self: end; filter: drop-shadow(0 0 22px var(--cyan)); animation: slidein 0.6s ease-out both; }
.vs-mech b { font-family: 'Black Han Sans', var(--ui); font-size: 2.6rem; font-weight: 400; color: var(--gold); text-shadow: 0 0 20px var(--gold); }
.vs-mech .boss-img { width: 100%; max-width: 170px; animation: slidein2 0.6s ease-out both; }
.hud { grid-template-columns: 40px 1fr auto; }
.hud-mech { width: 40px; height: 40px; object-fit: contain; filter: drop-shadow(0 0 8px var(--cyan)); }
.mech-strike { position: absolute; left: 0; top: 30%; width: 150px; z-index: 4; pointer-events: none; filter: drop-shadow(0 0 20px var(--cyan)); animation: punch 0.7s cubic-bezier(0.2, 1.4, 0.4, 1) forwards; }
.mech-strike.laser { filter: drop-shadow(0 0 30px var(--gold)); }
@keyframes punch { 0% { transform: translate(-120%, 40%) scale(0.7); opacity: 0; } 45% { transform: translate(60%, -10%) scale(1.15) rotate(-8deg); opacity: 1; } 70% { transform: translate(45%, -6%) scale(1.05); } 100% { transform: translate(-80%, 30%) scale(0.8); opacity: 0; } }
.laser-beam { position: absolute; left: 20%; top: 26%; height: 18px; width: 70%; z-index: 3; pointer-events: none; border-radius: 9px; background: linear-gradient(90deg, #fff, var(--cyan) 30%, var(--gold) 70%, #fff); box-shadow: 0 0 30px var(--cyan), 0 0 60px var(--gold); transform-origin: left center; animation: beam 0.7s ease-out forwards; }
@keyframes beam { 0% { transform: scaleX(0); opacity: 1; } 40% { transform: scaleX(1); opacity: 1; } 100% { transform: scaleX(1) scaleY(0.2); opacity: 0; } }

/* 격납고 */
.up-card { display: grid; grid-template-columns: 120px 1fr; gap: 12px; align-items: center; padding: 12px; border-radius: 20px; background: var(--panel); border: 2px solid var(--panel-line); }
.up-card.engine { border-color: #ff9b3d; }
.up-card.core { border-color: var(--cyan); }
.up-art { position: relative; display: grid; place-items: center; height: 130px; }
.up-art img { position: relative; z-index: 1; max-height: 130px; object-fit: contain; }
.up-glow { position: absolute; inset: 15%; border-radius: 50%; background: radial-gradient(var(--cyan), transparent 70%); opacity: 0.25; }
.up-art.lv2 .up-glow { opacity: 0.4; } .up-art.lv3 .up-glow { opacity: 0.55; background: radial-gradient(#3d7bff, transparent 70%); }
.up-art.lv4 .up-glow { opacity: 0.7; background: radial-gradient(#8a3dff, transparent 70%); }
.up-art.lv5 .up-glow { opacity: 0.9; background: radial-gradient(var(--gold), var(--pink) 50%, transparent 72%); animation: pulse 0.9s infinite alternate; }
.up-info { display: grid; gap: 3px; min-width: 0; }
.up-info b { font-weight: 400; font-size: 1.15rem; }
.up-info small { font-size: 0.8rem; }
.up-info .next { color: var(--green); }
.up-info .btn { min-height: 44px; margin-top: 4px; }
.up-stars { color: var(--gold); letter-spacing: 2px; }
.max-tag { justify-self: start; padding: 2px 12px; border-radius: 99px; background: linear-gradient(90deg, var(--gold), var(--pink)); color: #4a2a00; }
.robot-dex { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.dex-cell { display: grid; justify-items: center; gap: 2px; padding: 8px 4px; border-radius: 16px; background: var(--panel); border: 2px solid var(--rc); text-align: center; }
.dex-cell img { width: 84px; height: 84px; object-fit: contain; }
.dex-cell b { font-weight: 400; font-size: 0.9rem; }
.dex-cell small { color: var(--muted); font-size: 0.72rem; }
.dex-cell.unknown { border-color: var(--panel-line); }
.dex-cell.unknown img { filter: brightness(0) drop-shadow(0 0 2px rgba(140, 170, 255, 0.6)); opacity: 0.7; }
.hub-grid a.wide { grid-column: span 2; }
.upgrade-fx .charge-art { border: 0; background: none; padding: 0; cursor: pointer; width: 200px; height: 200px; }
.upgrade-fx .charge-art img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 0 20px var(--cyan)); }
.upgrade-fx .charge-art.zap img { animation: chargezap 0.25s; }
@keyframes chargezap { 50% { transform: scale(1.08) rotate(3deg); filter: brightness(1.8) drop-shadow(0 0 40px var(--gold)); } }
.upgrade-fx .charge-art.powered img { animation: wakeup3 1s ease-out both; filter: drop-shadow(0 0 40px var(--gold)) drop-shadow(0 0 80px var(--pink)); }
@keyframes wakeup3 { 40% { transform: scale(1.3); filter: brightness(2.5); } }
.charge-bar { width: 220px; height: 14px; border-radius: 8px; background: rgba(255, 255, 255, 0.12); overflow: hidden; }
.charge-bar i { display: block; width: 0; height: 100%; background: linear-gradient(90deg, var(--cyan), var(--gold), var(--pink)); transition: width 0.2s; }
.up-result { display: grid; justify-items: center; gap: 6px; text-align: center; animation: pop 0.4s both; }
.up-result .great { font-family: 'Black Han Sans', var(--ui); font-size: 2.2rem; color: var(--gold); text-shadow: 0 0 24px var(--gold); animation: rainbow 0.5s infinite alternate; }
.up-result .ok { font-family: 'Black Han Sans', var(--ui); font-size: 1.8rem; color: var(--cyan); }

@media (prefers-reduced-motion: reduce) {
  .mode-tile.launch img.tile-ico, .part.now img, .turbo-btn, .up-art.lv5 .up-glow, .robot-bay.awake .robot-img.fixed { animation: none; }
}

/* ───── 배경 그림 3종 ───── */
.repair-screen { background: linear-gradient(rgba(14, 18, 52, 0.55), rgba(14, 18, 52, 0.92) 55%), url(../img/s2/bg_repair.webp) center top / cover no-repeat; }
.robot-bay { background: linear-gradient(rgba(14, 18, 52, 0.05), rgba(14, 18, 52, 0.35)), url(../img/s2/bg_repair.webp) center 36% / cover no-repeat; }
.robot-bay .robot-img { top: 46%; }
.launch-screen { background: linear-gradient(rgba(14, 18, 52, 0.45), rgba(14, 18, 52, 0.92) 55%), url(../img/s2/bg_launch.webp) center top / cover no-repeat; }
.pad, .blastoff { background: linear-gradient(rgba(14, 18, 52, 0), rgba(14, 18, 52, 0.25)), url(../img/s2/bg_launch.webp) center 34% / cover no-repeat; }
.blastoff { background-position: center 30%; }
.pad .rocket { margin-top: 18px; }
.boss-screen.cockpit { background: linear-gradient(rgba(14, 18, 52, 0.15), rgba(14, 18, 52, 0.55) 40%, rgba(14, 18, 52, 0.94) 62%), url(../img/s2/bg_cockpit.webp) center top / cover no-repeat; border-radius: 0; }
.boss-screen.cockpit::before { display: none; }
.boss-screen.cockpit .boss-top { background: none; }
.boss-intro .vs-mech { background: radial-gradient(circle, rgba(79, 227, 255, 0.2), transparent 70%); }

/* 백업 알림: ⚙️ 빨간 점 */
.icon-btn.nag { position: relative; }
.icon-btn.nag::after { content: ''; position: absolute; top: 4px; right: 4px; width: 12px; height: 12px; border-radius: 50%; background: var(--red); box-shadow: 0 0 8px var(--red); animation: pulse 0.8s infinite alternate; }