/* Xelo RPG (XRPG) - mobile-first UI */

.xrpg-center{display:flex;align-items:center;justify-content:center;min-height:160px;color:var(--muted)}

.xrpg-screen{display:flex;flex-direction:column;gap:12px}

.xrpg-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:4px}
.xrpg-title{font-weight:900;font-size:18px;line-height:1.1;color:var(--ink)}
.xrpg-sub{font-size:12px;color:var(--muted)}

.xrpg-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}

.xrpg-btn{appearance:none;border:1px solid var(--ghost-border);background:var(--accent);color:var(--accent-ink);border-radius:12px;padding:10px 12px;font-weight:800;cursor:pointer}
.xrpg-btn.secondary{background:var(--ghost);color:var(--ink)}

/* Sticky topbar */
.xrpg-topbar{position:sticky;top:0;z-index:50;display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:10px 0;background:color-mix(in srgb, var(--card) 90%, transparent);backdrop-filter:blur(10px)}

/* Home button (메인) */
.xrpg-btn.secondary.xrpg-btnHome{background:color-mix(in srgb, #60a5fa 22%, var(--ghost));border-color:color-mix(in srgb, #60a5fa 28%, var(--ghost-border))}
.xrpg-btn.secondary.xrpg-btnHome:hover{filter:brightness(1.03)}

/* Big nav buttons */
.xrpg-btnNavBig{padding:14px 16px;border-radius:16px;font-size:15px;font-weight:900;min-width:96px}
.xrpg-btnNavFull{width:100%;justify-content:center}
.xrpg-btn:disabled{opacity:.5;cursor:not-allowed}

.xrpg-panel{border:1px solid var(--ghost-border);border-radius:14px;padding:12px;background:color-mix(in srgb, var(--ghost) 65%, transparent)}
.xrpg-panel-title{font-weight:900;margin-bottom:8px;color:var(--ink)}

.xrpg-log{white-space:pre-wrap;font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;font-size:12px;line-height:1.35;color:var(--ink)}

/* 카드 상세: 능력치 breakdown (모바일 게임 스타일) */
.xrpg-statsBreakdown{background:linear-gradient(145deg, color-mix(in srgb, var(--card) 98%, var(--ghost)), color-mix(in srgb, var(--ghost) 50%, transparent));border:1px solid var(--ghost-border);border-radius:14px;padding:14px;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.xrpg-stat-header{font-size:13px;font-weight:800;color:var(--ink);margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid var(--ghost-border);letter-spacing:.02em}
.xrpg-stat-lines{display:flex;flex-direction:column;gap:8px}
.xrpg-stat-line{display:flex;flex-wrap:wrap;align-items:center;gap:4px;font-size:13px;line-height:1.5;color:var(--ink)}
.xrpg-stat-label{font-weight:600;color:var(--muted);min-width:72px}
.xrpg-stat-total{font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums}
.xrpg-stat-breakdown{display:inline-flex;flex-wrap:wrap;align-items:center;gap:2px}
.xrpg-stat-chip{display:inline-flex;align-items:center;gap:3px;padding:2px 6px;border-radius:8px;background:color-mix(in srgb, var(--ghost) 80%, transparent);font-size:11px;font-weight:700;color:var(--ink)}
.xrpg-stat-icon{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;color:var(--ink);min-width:20px;min-height:20px;flex-shrink:0}
.xrpg-stat-icon svg{display:block;width:20px;height:20px}
.xrpg-stat-icon--set svg{width:32px;height:16px}
.xrpg-set-section-title{font-size:12px;font-weight:800;color:var(--ink);margin-top:14px;margin-bottom:6px}
.xrpg-set-line{font-size:12px;color:var(--ink);margin-left:8px;margin-bottom:4px}

/* 카드 상세: 스킬 (설명 + 실제효과) */
.xrpg-skillBreakdown{background:linear-gradient(145deg, color-mix(in srgb, var(--card) 98%, var(--ghost)), color-mix(in srgb, var(--ghost) 50%, transparent));border:1px solid var(--ghost-border);border-radius:14px;padding:14px;box-shadow:0 2px 8px rgba(0,0,0,.06);display:flex;flex-direction:column;gap:12px}
.xrpg-skill-line{border-left:3px solid var(--accent);padding-left:10px}
.xrpg-skill-name{display:block;font-size:13px;font-weight:800;color:var(--ink);margin-bottom:4px}
.xrpg-skill-desc{font-size:12px;color:var(--ink);line-height:1.45}
.xrpg-skill-effect{color:var(--muted);font-weight:600;font-size:11px}

.xrpg-cardgrid{display:grid;grid-template-columns:repeat(1, minmax(0, 1fr));gap:10px}
@media (min-width: 680px){
  .xrpg-cardgrid{grid-template-columns:repeat(2, minmax(0, 1fr));}
}

/* Codex (shop-like) */
.xrpg-codexFilters{position:sticky;top:0;z-index:20;background:color-mix(in srgb, var(--card) 92%, transparent);backdrop-filter:blur(10px)}
.xrpg-filterGroup{margin-top:10px}
.xrpg-filterTitle{font-weight:900;color:var(--ink);margin-bottom:6px}
.xrpg-filterOptions{display:flex;flex-wrap:wrap;gap:10px}
.xrpg-filterOpt{display:inline-flex;gap:6px;align-items:center;font-size:12px;color:var(--ink);padding:6px 8px;border-radius:999px;border:1px solid var(--ghost-border);background:color-mix(in srgb, var(--ghost) 72%, transparent)}

/* Codex tabs (browser-tab style) */
.xrpg-codexTabs{display:flex;gap:0;margin:0 0 0 0;padding:0 8px 0 0;border-bottom:1px solid var(--ghost-border);background:color-mix(in srgb, var(--ghost) 50%, transparent);border-radius:10px 10px 0 0;overflow-x:auto}
.xrpg-codexTab{appearance:none;padding:10px 16px;border:1px solid var(--ghost-border);border-bottom:none;border-radius:8px 8px 0 0;background:color-mix(in srgb, var(--ghost) 60%, transparent);color:var(--muted);font-size:13px;font-weight:600;cursor:pointer;margin-right:2px;white-space:nowrap}
.xrpg-codexTab:hover{background:color-mix(in srgb, var(--ghost) 75%, transparent);color:var(--ink)}
.xrpg-codexTab--active{background:var(--card);color:var(--ink);border-color:var(--ghost-border);margin-bottom:-1px;padding-bottom:11px}
.xrpg-codexContent{margin-top:0;padding-top:12px}

.xrpg-filterSelect{padding:8px 12px;border-radius:10px;border:1px solid var(--ghost-border);background:var(--card);color:var(--ink);font-size:13px}
.xrpg-filterRow{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.xrpg-filterRow .xrpg-filterLabel{font-size:12px;color:var(--muted);margin-left:8px}
.xrpg-filterSearch{flex:1;min-width:120px;padding:8px 12px;border-radius:10px;border:1px solid var(--ghost-border);background:var(--card);color:var(--ink);font-size:13px}
.xrpg-filterReset{margin-left:auto}

.xrpg-codexGrid{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:10px}
@media (min-width: 680px){
  .xrpg-codexGrid{grid-template-columns:repeat(4, minmax(0,1fr));}
}

.xrpg-cardTile{appearance:none;border:1px solid var(--ghost-border);background:color-mix(in srgb, var(--ghost) 65%, transparent);border-radius:14px;padding:10px;cursor:pointer;text-align:left;display:flex;flex-direction:column;gap:8px}
.xrpg-cardTile:hover{border-color:color-mix(in srgb, var(--accent) 40%, var(--ghost-border))}

/* Rarity pastel tiles */
.xrpg-cardTile.r-epic{background:color-mix(in srgb, #facc15 22%, var(--ghost));}
.xrpg-cardTile.r-mythic{background:color-mix(in srgb, #fb7185 20%, var(--ghost));}
.xrpg-cardTile.r-rare{background:color-mix(in srgb, #60a5fa 20%, var(--ghost));}
.xrpg-cardTile.r-uncommon{background:color-mix(in srgb, #86efac 18%, var(--ghost));}
.xrpg-cardTile.r-common{background:color-mix(in srgb, #cbd5e1 18%, var(--ghost));}

.xrpg-cardImg{width:100%;aspect-ratio:1/1;border-radius:12px;object-fit:cover;border:1px solid rgba(0,0,0,.08);background:rgba(0,0,0,.04)}
.xrpg-cardMeta{display:flex;flex-direction:column;gap:2px}
.xrpg-cardName{font-weight:900;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.xrpg-cardTile.unowned{filter:grayscale(1);opacity:0.55}

/* Item tiles (weapon/armor/accessory/pet in codex) */
.xrpg-codexGrid--items .xrpg-itemTile{cursor:default}
.xrpg-itemTile{display:flex;flex-direction:column;gap:8px}
.xrpg-itemIcon{width:100%;aspect-ratio:1;border-radius:12px;background:color-mix(in srgb, var(--ghost) 80%, transparent);display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:900;color:var(--muted);border:1px solid rgba(0,0,0,.06)}

/* Card art in detail page */
.xrpg-cardArt{width:100%;max-width:420px;aspect-ratio:2/3;object-fit:cover;border-radius:16px;border:1px solid var(--ghost-border);display:block;background:rgba(0,0,0,.04)}

/* XRPG Modal (custom dialog to avoid alert/confirm suppression) */
.xrpg-modalOverlay{position:fixed;inset:0;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;padding:16px;z-index:9999}
.xrpg-modal{width:min(560px, 100%);border:1px solid var(--ghost-border);border-radius:16px;background:color-mix(in srgb, var(--card) 92%, transparent);backdrop-filter:blur(10px);padding:14px}
/* 잠김 안내 모달: 에러가 아닌 안내 스타일 */
.xrpg-modal--lock{border-color:color-mix(in srgb, #60a5fa 35%, var(--ghost-border));background:color-mix(in srgb, #e0f2fe 12%, var(--card));padding:20px 18px;text-align:center}
.xrpg-modal--lock .xrpg-modal-title{font-size:18px;font-weight:800;color:var(--ink);margin-bottom:6px;display:flex;align-items:center;justify-content:center;gap:8px}
.xrpg-modal--lock .xrpg-modal-title::before{content:'🔒';font-size:22px}
.xrpg-modal--lock .xrpg-modal-body{white-space:pre-wrap;font-size:14px;line-height:1.5;color:var(--muted);margin-bottom:16px}
.xrpg-modal--lock .xrpg-row{justify-content:center}
.xrpg-modal--lock .xrpg-btn{min-width:100px}

/* Home (start screen) */
.xrpg-homeHero{overflow:hidden;border:1px solid var(--ghost-border);border-radius:18px;background:color-mix(in srgb, var(--ghost) 55%, transparent);}
@media (max-width: 420px){.xrpg-homeHero{border-radius:16px;}}

/* hero image on top (full-bleed) */
.xrpg-homeHeroImgWrap{position:relative;width:100%;height:260px;overflow:hidden}
@media (max-width: 420px){.xrpg-homeHeroImgWrap{height:210px;}}
.xrpg-homeHeroBg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:1;pointer-events:none;}
.xrpg-homeHeroOverlay{position:absolute;inset:0;background:linear-gradient(180deg, rgba(2,6,23,.05), rgba(2,6,23,.40));pointer-events:none;}

/* content goes UNDER the image */
.xrpg-homeHeroInner{display:flex;flex-direction:column;gap:10px;align-items:center;justify-content:center;padding:14px;}
@media (max-width: 420px){.xrpg-homeHeroInner{padding:12px;gap:8px;}}
.xrpg-titleImg{width:min(320px, 92%);height:auto;filter:drop-shadow(0 10px 18px rgba(0,0,0,.55));}
@media (max-width: 420px){.xrpg-titleImg{width:min(260px, 92%);}}
.xrpg-homeMenu{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media (min-width:680px){.xrpg-homeMenu{grid-template-columns:repeat(4,minmax(0,1fr));}}
.xrpg-homePrimary{width:100%;padding:14px 14px;border-radius:16px;font-size:16px;letter-spacing:.6px}
@media (max-width: 420px){.xrpg-homePrimary{padding:13px 14px;font-size:15px;border-radius:15px}}

/* Fancy START/CONTINUE button */
.xrpg-homePrimaryFancy{
  border-radius:18px;
  padding:16px 16px;
  font-size:17px;
  letter-spacing:1.2px;
  text-transform:uppercase;
  border:1px solid rgba(255,255,255,.22);
  background:linear-gradient(135deg, rgba(15,23,42,.82), rgba(59,130,246,.45), rgba(245,158,11,.35));
  color:#fff;
  box-shadow:0 18px 38px rgba(0,0,0,.35);
  backdrop-filter:blur(8px);
}
.xrpg-homePrimaryFancy:hover{filter:brightness(1.08)}
.xrpg-homePrimaryFancy:active{transform:translateY(1px);filter:brightness(0.98)}
.xrpg-chip{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:6px 10px;border-radius:999px;border:1px solid var(--ghost-border);background:color-mix(in srgb, var(--ghost) 70%, transparent);font-size:12px;color:var(--muted);text-align:center;max-width:100%;flex-wrap:wrap}
@media (max-width: 420px){.xrpg-chip{font-size:11px;padding:6px 8px}}

/* Party preview (party select) */
.xrpg-partyPreview{display:grid;grid-template-columns:repeat(5, minmax(0,1fr));gap:8px;margin:8px 0 10px}
@media (max-width: 560px){
  .xrpg-partyPreview{grid-template-columns:repeat(3, minmax(0,1fr));}
}
.xrpg-partyCard{border:1px solid var(--ghost-border);border-radius:14px;padding:8px;background:color-mix(in srgb, var(--ghost) 68%, transparent);display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.xrpg-partyCard.r-epic{background:color-mix(in srgb, #f59e0b 16%, var(--ghost));}
.xrpg-partyCard.r-mythic{background:color-mix(in srgb, #fb7185 14%, var(--ghost));}
.xrpg-partyCard.r-rare{background:color-mix(in srgb, #60a5fa 14%, var(--ghost));}
.xrpg-partyCard.r-uncommon{background:color-mix(in srgb, #86efac 12%, var(--ghost));}
.xrpg-partyCard.r-common{background:color-mix(in srgb, #cbd5e1 12%, var(--ghost));}
.xrpg-partyImg{width:100%;aspect-ratio:1/1;border-radius:12px;object-fit:cover;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.10)}
.xrpg-partyName{width:100%;font-weight:900;font-size:12px;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink)}

/* Home party panel: cards row + names row + buff */
.xrpg-homePartyBody{display:flex;flex-direction:column;gap:8px}
.xrpg-homePartyCards{display:grid;grid-template-columns:repeat(5, minmax(0,1fr));gap:6px}
@media (max-width: 560px){.xrpg-homePartyCards{grid-template-columns:repeat(3, minmax(0,1fr))}}
.xrpg-homePartySlot{display:flex;flex-direction:column;gap:4px;border-radius:12px;padding:6px;background:color-mix(in srgb, var(--ghost) 68%, transparent);border:1px solid var(--ghost-border)}
.xrpg-homePartySlotEmpty{background:color-mix(in srgb, var(--ghost) 50%, transparent)}
.xrpg-partyImg--empty{width:100%;aspect-ratio:1/1;border-radius:12px;background:rgba(0,0,0,.08);border:1px dashed var(--ghost-border)}
.xrpg-homePartyBuffSection{margin-top:4px;padding-top:8px;border-top:1px solid var(--ghost-border)}
.xrpg-homePartyBuffSection .xrpg-panel-title{margin-bottom:6px}
.xrpg-partySelectBuffSection{margin-top:8px;padding-top:8px;border-top:1px solid var(--ghost-border)}
.xrpg-partySelectBuffSection .xrpg-panel-title{margin-bottom:6px}
.xrpg-homePartyBuffs{display:flex;flex-direction:column;gap:4px}
.xrpg-homePartyBuffsRow{display:flex;flex-direction:row;flex-wrap:nowrap;gap:8px;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;padding-bottom:4px}
.xrpg-homePartyBuffItem{display:flex;align-items:center;gap:6px;flex-shrink:0;white-space:nowrap}
.xrpg-homePartyBuffItem .xrpg-buffIcon{flex-shrink:0}
.xrpg-homePartyBuffRow{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.xrpg-homePartyBuffRow .xrpg-buffIcon{flex-shrink:0}
.xrpg-homePartyBuffDesc{font-size:12px;color:var(--ink);line-height:1.3}

/* Map legend */
.xrpg-mapLegend{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 10px;margin-bottom:10px}
.xrpg-mapLegendItem{display:flex;gap:8px;align-items:flex-start;padding:8px 10px;border-radius:12px;border:1px solid var(--ghost-border);background:color-mix(in srgb, var(--ghost) 72%, transparent)}
.xrpg-mapLegendIcon{width:22px;flex:0 0 22px;font-size:16px;line-height:1.2}
.xrpg-mapLegendTitle{font-weight:900;font-size:12px;color:var(--ink);line-height:1.15}
.xrpg-mapLegendSub{margin-top:3px;font-size:11px;opacity:.75;color:var(--muted);line-height:1.2}
.xrpg-mapNodeBtn{white-space:nowrap;word-break:keep-all}
.xrpg-mapRunInfo{font-size:12px;font-weight:700;color:var(--muted);padding:4px 0;margin-bottom:4px}

/* Battle screen flash + shake */
.xrpg-flash{position:fixed;inset:0;opacity:0;pointer-events:none;z-index:9997;transition:opacity .12s ease}
.xrpg-flash.is-on{opacity:1}
body.xrpg-shake-sm{animation:xrpgShakeSm .25s linear 1}
body.xrpg-shake-md{animation:xrpgShakeMd .25s linear 1}
body.xrpg-shake-lg{animation:xrpgShakeLg .25s linear 1}
body.xrpg-shake-impact{animation:xrpgShakeImpact .2s linear 1}
@keyframes xrpgShakeSm{0%{transform:translate(0,0)}25%{transform:translate(1px,-1px)}50%{transform:translate(-1px,1px)}75%{transform:translate(1px,1px)}100%{transform:translate(0,0)}}
@keyframes xrpgShakeMd{0%{transform:translate(0,0)}25%{transform:translate(2px,-2px)}50%{transform:translate(-2px,2px)}75%{transform:translate(2px,2px)}100%{transform:translate(0,0)}}
@keyframes xrpgShakeLg{0%{transform:translate(0,0)}25%{transform:translate(4px,-3px)}50%{transform:translate(-4px,3px)}75%{transform:translate(3px,4px)}100%{transform:translate(0,0)}}
@keyframes xrpgShakeImpact{0%{transform:translate(0,0)}20%{transform:translate(5px,0)}40%{transform:translate(-5px,-4px)}60%{transform:translate(4px,5px)}80%{transform:translate(-4px,2px)}100%{transform:translate(0,0)}}

/* XRPG toast */
.xrpg-toast{position:fixed;left:50%;top:50%;transform:translate(-50%, calc(-50% + 8px));opacity:0;z-index:9999;
  padding:10px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.18);
  background:rgba(0,0,0,.45);backdrop-filter:blur(10px);
  color:#e5e7eb;font-weight:900;font-size:13px;max-width:min(560px, calc(100% - 24px));
  white-space:pre-wrap;text-align:center;box-shadow:0 18px 38px rgba(0,0,0,.35);
  transition:opacity .18s ease, transform .18s ease;
}
.xrpg-toast.is-visible{opacity:1;transform:translate(-50%, -50%)}

/* Battle — 헤더 없음, 뷰포트 고정, PC에서도 정돈된 레이아웃 */
.xrpg-screen--battle .xrpg-header{display:none!important}
.xrpg-screen--battle{position:fixed!important;inset:0!important;z-index:40!important;width:100vw!important;height:100vh!important;display:flex!important;flex-direction:column!important;gap:0!important;overflow:hidden!important;background:#0f172a!important}
.xrpg-screen--battle > .xrpg-battleTopRow{flex-shrink:0!important;background:linear-gradient(180deg,#1e293b 0%,#0f172a 100%);border-bottom:1px solid rgba(255,255,255,.12);padding:10px 14px}
.xrpg-screen--battle .xrpg-battleRound{color:#f1f5f9}
.xrpg-screen--battle > .xrpg-battleArea{flex:1 1 0%!important;min-height:40vh!important;height:0!important;overflow:auto!important;display:flex!important;flex-direction:column!important;align-items:center!important}
.xrpg-screen--battle .xrpg-battleArea > .xrpg-battleWrap{flex:1!important;min-height:0!important;width:100%!important;max-width:900px!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;position:relative!important;margin:0 auto}
.xrpg-screen--battle .xrpg-battleWrap .xrpg-battleContent{flex:1!important;min-height:0!important;display:flex!important;flex-direction:column!important;gap:20px!important;overflow:auto!important;padding:12px 16px!important;justify-content:center!important}
.xrpg-battleRound{font-size:1.15rem!important;font-weight:800!important;letter-spacing:.04em!important;padding:6px 14px}
.xrpg-screen--battle .xrpg-battleWrap .xrpg-battleContent .xrpg-panel{flex:0 1 auto!important;min-height:60px!important;display:flex!important;flex-direction:column!important;overflow:visible!important}
.xrpg-screen--battle .xrpg-battleWrap .xrpg-battleContent .xrpg-panel .xrpg-teamHeader{flex-shrink:0!important}
.xrpg-screen--battle .xrpg-battleWrap .xrpg-battleContent .xrpg-panel .xrpg-battleGrid{flex:0 0 auto!important;min-height:0!important;display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;grid-template-rows:auto!important;gap:6px!important;align-items:start!important;overflow:visible!important}
.xrpg-battleLineLayer{position:absolute;inset:0;pointer-events:none;z-index:5}
.xrpg-battleLineLayer svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.xrpg-battleWrap{display:flex;flex-direction:column;gap:12px}

/* 3단계 공격 연출: Ready(오버레이+스포트라이트) / Action(투사체) / Impact(타격 플래시) */
.xrpg-battleOverlay{position:absolute;inset:0;pointer-events:none;z-index:30;animation:xrpgOverlayIn .15s ease-out 1}
.xrpg-battleOverlay-panel{background:rgba(0,0,0,.55)}
@keyframes xrpgOverlayIn{0%{opacity:0}100%{opacity:1}}
.xrpg-unit--spotlight{position:relative;z-index:50}
.xrpg-unit--impact{animation:xrpgImpactFlash .1s ease-out 1}
@keyframes xrpgImpactFlash{0%{box-shadow:inset 0 0 0 0 rgba(239,68,68,0);filter:brightness(1)}50%{box-shadow:inset 0 0 0 6px rgba(239,68,68,.75);filter:brightness(1.4)}100%{box-shadow:inset 0 0 0 0 rgba(239,68,68,0);filter:brightness(1)}}
.xrpg-projectile{position:absolute;z-index:10;pointer-events:none}
.xrpg-projectileTrailSeg{transition:opacity .05s linear}
.xrpg-battleGrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
/* 카드: 가로 5장 꽉 채움, 이미지 크게(정사각 비율 유지), 이름·HP/MP 바 바로 아래 */
.xrpg-unit{border:1px solid var(--ghost-border);border-radius:12px;padding:6px;background:color-mix(in srgb, var(--ghost) 68%, transparent);display:flex;flex-direction:column;gap:0;min-height:80px;min-width:0;overflow:hidden}
.xrpg-screen--battle .xrpg-unit{overflow:visible;flex:0 0 auto}
.xrpg-screen--battle .xrpg-unit .xrpg-unitTop{flex:none;min-height:0;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start}
.xrpg-screen--battle .xrpg-unit .xrpg-unitImgWrap{flex:none;min-height:0;display:flex;flex-direction:column;align-items:stretch;width:100%;gap:2px}
.xrpg-screen--battle .xrpg-unit .xrpg-unitImgWrap .xrpg-unitImg{width:100%;height:auto;min-height:0;max-height:min(140px,26vh);aspect-ratio:1;object-fit:contain;border-radius:10px;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.25);flex:none;display:block}
.xrpg-screen--battle .xrpg-unit .xrpg-unitNameUnder{flex-shrink:0;font-size:10px;line-height:1.1;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;opacity:.92}
.xrpg-screen--battle .xrpg-unit .xrpg-bars{flex-shrink:0;margin-top:0;padding-top:2px;min-height:28px}
.xrpg-screen--battle .xrpg-unit .xrpg-bar{height:12px;min-height:10px}
.xrpg-unitImg--empty{width:100%;height:auto;aspect-ratio:1;border-radius:8px;background:rgba(0,0,0,.2);border:1px solid rgba(255,255,255,.1)}

/* rarity pastel backgrounds */
.xrpg-unit.r-common{background:color-mix(in srgb, #94a3b8 14%, var(--ghost));}
.xrpg-unit.r-uncommon{background:color-mix(in srgb, #22c55e 14%, var(--ghost));}
.xrpg-unit.r-rare{background:color-mix(in srgb, #3b82f6 14%, var(--ghost));}
.xrpg-unit.r-mythic{background:color-mix(in srgb, #ef4444 14%, var(--ghost));}
.xrpg-unit.r-epic{background:color-mix(in srgb, #f59e0b 16%, var(--ghost));}
.xrpg-unit.r-enemy{background:color-mix(in srgb, #111827 10%, var(--ghost));}
.xrpg-unitTop{display:flex;gap:8px;align-items:flex-start}
.xrpg-unitImgWrap{display:flex;flex-direction:column;gap:4px;align-items:flex-start;min-width:34px}
/* (unitMeta/buffRow deprecated; buffs now shown in team header) */
.xrpg-buffItemRow{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.xrpg-buffText{font-size:11px;font-weight:700;color:var(--ink);white-space:nowrap}
.xrpg-buffIcon{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:6px;border:1px solid rgba(255,255,255,.20);background:rgba(0,0,0,.18);font-size:11px;font-weight:900;line-height:1;color:#e5e7eb;flex-shrink:0}
.xrpg-buffIcon.atk{background:rgba(245,158,11,.22)}
.xrpg-buffIcon.def{background:rgba(59,130,246,.22)}
.xrpg-buffIcon.hit{background:rgba(34,197,94,.22)}
.xrpg-buffIcon.hp{background:rgba(244,114,182,.22)}
.xrpg-buffIcon.mp{background:rgba(139,92,246,.22)}

.xrpg-teamHeader{display:flex;align-items:center;justify-content:flex-start;gap:10px;flex-wrap:wrap}
.xrpg-teamHeaderTitle{font-weight:900;color:var(--ink)}
.xrpg-teamBuffs{display:flex;flex-wrap:wrap;gap:4px;justify-content:flex-start}

/* Battle — 다크 헤더 바·유닛 카드 (참고 디자인) */
.xrpg-screen--battle .xrpg-teamHeaderBar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;background:linear-gradient(180deg,#1e293b 0%,#0f172a 100%);border:1px solid rgba(255,255,255,.12);border-radius:10px 10px 0 0;padding:8px 12px;min-height:40px}
.xrpg-screen--battle .xrpg-teamHeaderBar .xrpg-teamHeaderTitle{color:#f1f5f9;font-size:14px;font-weight:900;letter-spacing:.02em}
.xrpg-screen--battle .xrpg-teamBuffsWrap{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.xrpg-screen--battle .xrpg-battlePanel{background:linear-gradient(180deg,rgba(30,41,59,.5) 0%,rgba(15,23,42,.6) 100%);border:1px solid rgba(255,255,255,.1);border-radius:12px;overflow:hidden}
.xrpg-screen--battle .xrpg-battlePanel .xrpg-teamHeaderBar{border-radius:0;border-left:none;border-right:none;border-top:none}
.xrpg-screen--battle .xrpg-unit{background:linear-gradient(180deg,rgba(30,41,59,.4) 0%,rgba(15,23,42,.5) 100%);border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:6px;min-height:100px}
.xrpg-screen--battle .xrpg-unit .xrpg-unitNameBar{background:rgba(15,23,42,.85);border-radius:8px;padding:4px 8px;margin-top:4px;border:1px solid rgba(255,255,255,.1)}
.xrpg-screen--battle .xrpg-unit .xrpg-unitNameBar .xrpg-unitNameUnder{color:#f1f5f9;font-size:11px;font-weight:900;display:block;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;opacity:1}
.xrpg-screen--battle .xrpg-unit .xrpg-unitDesc{font-size:10px;color:rgba(241,245,249,.75);margin-top:2px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.xrpg-screen--battle .xrpg-unit .xrpg-unitSkills{display:flex;gap:6px;margin-top:4px;justify-content:center;align-items:stretch;min-height:44px;flex-shrink:0}
.xrpg-screen--battle .xrpg-skillSlot{display:flex;align-items:center;justify-content:center;min-width:36px;min-height:36px;padding:4px;border-radius:8px;background:rgba(15,23,42,.8);border:1px solid rgba(255,255,255,.15);flex-shrink:0}
.xrpg-screen--battle .xrpg-skillIcon{width:28px;height:28px;display:block;object-fit:contain}
.xrpg-screen--battle .xrpg-skillSlot--ult:not(.xrpg-skillSlot--no-ult){border-color:rgba(239,68,68,.55);background:rgba(30,41,59,.85)}
.xrpg-screen--battle .xrpg-skillSlot--no-ult{opacity:.5;border-color:rgba(255,255,255,.08);background:rgba(15,23,42,.6)}
.xrpg-screen--battle .xrpg-skillSlot--no-ult .xrpg-skillIcon{filter:grayscale(0.6)}
.xrpg-screen--battle .xrpg-skillSlot--active{animation:xrpgSkillSlotActive .42s ease-out 1}
.xrpg-screen--battle .xrpg-skillSlot--ult.xrpg-skillSlot--active{animation:xrpgSkillSlotActiveUlt .42s ease-out 1}
@keyframes xrpgSkillSlotActive{0%{box-shadow:0 0 0 rgba(255,255,255,0);transform:scale(1)}55%{box-shadow:0 0 0 3px rgba(250,204,21,.65);transform:scale(1.12)}100%{box-shadow:0 0 0 rgba(255,255,255,0);transform:scale(1)}}
@keyframes xrpgSkillSlotActiveUlt{0%{box-shadow:0 0 0 rgba(239,68,68,0);transform:scale(1)}55%{box-shadow:0 0 0 3px rgba(239,68,68,.8);transform:scale(1.12)}100%{box-shadow:0 0 0 rgba(239,68,68,0);transform:scale(1)}}
.xrpg-screen--battle .xrpg-unitEmpty{background:rgba(15,23,42,.7);border:1px dashed rgba(255,255,255,.18);opacity:.85}
.xrpg-screen--battle .xrpg-unitEmpty .xrpg-unitImg--empty{background:rgba(15,23,42,.9);border-color:rgba(255,255,255,.12)}
.xrpg-screen--battle .xrpg-unitEmpty .xrpg-unitNameBar{background:rgba(15,23,42,.95)}
.xrpg-screen--battle .xrpg-unitEmpty .xrpg-unitDesc{color:rgba(241,245,249,.5)}

/* debuff tint */
.xrpg-buffIcon.debuff{background:rgba(0,0,0,.24);border-color:rgba(239,68,68,.28)}
.xrpg-buffIcon.debuff.atk{background:rgba(239,68,68,.22)}
.xrpg-buffIcon.debuff.def{background:rgba(239,68,68,.18)}
.xrpg-buffIcon.debuff.hit{background:rgba(239,68,68,.16)}
.xrpg-buffIcon.debuff.hp{background:rgba(239,68,68,.18)}
.xrpg-buffIcon.debuff.mp{background:rgba(239,68,68,.18)}

/* Gacha UI */
.xrpg-currencyBar{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.xrpg-currencyChip{display:inline-flex;align-items:center;gap:8px;padding:8px 10px;border-radius:999px;border:1px solid var(--ghost-border);background:color-mix(in srgb, var(--ghost) 70%, transparent);font-weight:900;font-size:13px;color:var(--ink)}
.xrpg-currencyIcon{width:22px;height:22px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;background:rgba(0,0,0,.18);border:1px solid rgba(255,255,255,.18);overflow:hidden}
.xrpg-currencyIcon img{width:18px;height:18px;display:block}
.xrpg-currencyIcon.gold{background:rgba(245,158,11,.18)}
.xrpg-currencyIcon.dia{background:rgba(59,130,246,.18)}
.xrpg-homeCurrencyBar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:12px}

/* Home: 난이도·시작층 선택 (모바일 대응) */
.xrpg-homeOptions{width:100%;max-width:520px;display:flex;flex-direction:column;gap:16px;padding:12px 0;}
.xrpg-homeOptionGroup{display:flex;flex-direction:column;gap:8px;}
.xrpg-homeOptionLabel{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);}
.xrpg-homeDiffRow{display:flex;flex-wrap:wrap;gap:6px;}
.xrpg-homeDiffBtn{padding:8px 12px;border-radius:10px;font-size:12px;font-weight:700;min-width:0;}
.xrpg-homeDiffBtn.is-active{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);}
.xrpg-homeFloorGrid{display:grid;grid-template-columns:repeat(5, 1fr);gap:6px;}
@media (min-width:420px){.xrpg-homeFloorGrid{grid-template-columns:repeat(10, 1fr);}}
.xrpg-homeFloorBtn{padding:8px 6px;border-radius:10px;font-size:11px;font-weight:800;min-width:0;}
.xrpg-homeFloorBtn.is-active{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);}
@media (max-width:419px){.xrpg-homeFloorBtn{font-size:10px;padding:6px 4px;}}
.xrpg-currencyChip--epic{background:color-mix(in srgb, #eab308 18%, var(--ghost));border-color:rgba(234,179,8,.4);color:var(--ink)}
.xrpg-currencyChip--mythic{background:color-mix(in srgb, #dc2626 18%, var(--ghost));border-color:rgba(220,38,38,.4);color:var(--ink)}
.xrpg-currencyIcon--epic{background:rgba(234,179,8,.45);color:#1c1917;font-weight:900;font-size:11px}
.xrpg-currencyIcon--mythic{background:rgba(220,38,38,.45);color:#fff;font-weight:900;font-size:11px}

.xrpg-rateOverlay{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:9999;display:flex;align-items:center;justify-content:center;padding:16px}
.xrpg-rateBox{width:min(520px, 100%);border:1px solid var(--ghost-border);border-radius:16px;background:color-mix(in srgb, var(--card) 92%, transparent);backdrop-filter:blur(10px);padding:14px}
.xrpg-rateList{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.xrpg-rateRow{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-radius:14px;border:1px solid var(--ghost-border);background:color-mix(in srgb, var(--ghost) 72%, transparent);font-weight:900}
.xrpg-rateRow .rar{letter-spacing:.4px}
.xrpg-rateRow.r-epic{border-color:rgba(245,158,11,.35);background:color-mix(in srgb, rgba(245,158,11,.18) 55%, var(--ghost))}
.xrpg-rateRow.r-mythic{border-color:rgba(251,113,133,.35);background:color-mix(in srgb, rgba(251,113,133,.16) 55%, var(--ghost))}
.xrpg-rateRow.r-rare{border-color:rgba(96,165,250,.35);background:color-mix(in srgb, rgba(96,165,250,.16) 55%, var(--ghost))}
.xrpg-rateRow.r-uncommon{border-color:rgba(134,239,172,.35);background:color-mix(in srgb, rgba(134,239,172,.14) 55%, var(--ghost))}
.xrpg-rateRow.r-common{border-color:rgba(203,213,225,.35);background:color-mix(in srgb, rgba(203,213,225,.12) 55%, var(--ghost))}

/* 뽑기 결과 + 광채 */
.xrpg-gachaResultOverlay .xrpg-modal{max-width:380px;width:calc(100% - 24px);box-sizing:border-box}
.xrpg-gachaResultBox{display:flex;flex-direction:column;gap:12px}
.xrpg-gachaResultBody{display:flex;flex-direction:column;gap:4px;max-height:50vh;overflow:auto}
.xrpg-gachaResultLine{padding:5px 10px;border-radius:8px;font-weight:800;font-size:11px;letter-spacing:.2px;line-height:1.25;border:1px solid}
.xrpg-gachaResultLine.r-epic{color:#b45309;border-color:rgba(245,158,11,.5);background:color-mix(in srgb, rgba(245,158,11,.2) 60%, var(--ghost));text-shadow:0 0 12px rgba(245,158,11,.4)}
.xrpg-gachaResultLine.r-mythic{color:#be123c;border-color:rgba(251,113,133,.5);background:color-mix(in srgb, rgba(251,113,133,.2) 60%, var(--ghost));text-shadow:0 0 12px rgba(251,113,133,.4)}
.xrpg-gachaResultLine.r-rare{color:#1d4ed8;border-color:rgba(96,165,250,.4);background:color-mix(in srgb, rgba(96,165,250,.15) 55%, var(--ghost))}
.xrpg-gachaResultLine.r-uncommon{color:#15803d;border-color:rgba(134,239,172,.4);background:color-mix(in srgb, rgba(134,239,172,.12) 55%, var(--ghost))}
.xrpg-gachaResultLine.r-common{color:#475569;border-color:rgba(203,213,225,.4);background:color-mix(in srgb, rgba(203,213,225,.1) 55%, var(--ghost))}
.xrpg-gachaFlash{position:fixed;inset:0;z-index:10000;pointer-events:none;animation:xrpgGachaFlash linear forwards}
.xrpg-gachaFlash-epic{background:linear-gradient(135deg, rgba(250,204,21,.45) 0%, rgba(245,158,11,.35) 50%, rgba(250,204,21,.25) 100%);opacity:0}
.xrpg-gachaFlash-mythic{background:linear-gradient(135deg, rgba(239,68,68,.5) 0%, rgba(185,28,28,.4) 50%, rgba(239,68,68,.3) 100%);opacity:0}
@keyframes xrpgGachaFlash{0%{opacity:1}30%{opacity:.85}70%{opacity:.6}100%{opacity:0}}

/* 확률표 진행도 + 피티 */
.xrpg-gachaStageProgress{margin-top:8px;margin-bottom:8px}
.xrpg-stageBarWrap{margin-top:6px}
.xrpg-stageBarBg{height:20px;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.12);border:1px solid var(--ghost-border)}
.xrpg-stageBarFill{height:100%;border-radius:999px;background:linear-gradient(90deg,#3b82f6,#60a5fa);transition:width .25s ease}
.xrpg-stageBarLabel{margin-top:4px;font-size:12px;font-weight:800;color:var(--muted)}
.xrpg-pityBlock{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px;margin-bottom:8px}
.xrpg-pityRow{display:flex;align-items:center;gap:6px;padding:6px 10px;border-radius:10px;font-size:12px;font-weight:800}
.xrpg-pity-mythic{background:color-mix(in srgb, rgba(251,113,133,.25) 50%, var(--ghost));border:1px solid rgba(251,113,133,.4)}
.xrpg-pity-epic{background:color-mix(in srgb, rgba(245,158,11,.2) 50%, var(--ghost));border:1px solid rgba(245,158,11,.4)}
.xrpg-pityLabel{color:var(--muted)}
.xrpg-pityVal{color:var(--ink)}

.xrpg-barLine{display:flex;align-items:center;gap:8px}
.xrpg-barNum{min-width:28px;text-align:right;font-size:11px;color:var(--muted);font-weight:900}

.xrpg-unitImg{width:34px;height:34px;border-radius:10px;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.12);object-fit:cover;flex:0 0 auto}
.xrpg-screen--battle .xrpg-unitImg{width:100%;height:auto;min-height:0}
.xrpg-unitNameUnder{font-weight:900;font-size:11px;line-height:1.05;max-width:42px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.92}
.xrpg-unitName{font-weight:900;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.xrpg-bars{display:flex;flex-direction:column;gap:4px;margin-top:4px}
.xrpg-bar{position:relative;height:16px;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08)}
.xrpg-bar > div{height:100%}
.xrpg-barText{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:900;color:#e5e7eb;text-shadow:0 1px 6px rgba(0,0,0,.6);z-index:2;pointer-events:none}
.xrpg-hp{position:relative;z-index:1;background:linear-gradient(90deg,#22c55e,#16a34a)}
.xrpg-mp{position:relative;z-index:1;background:linear-gradient(90deg,#60a5fa,#2563eb)}
.xrpg-unit.dead{opacity:.35;filter:grayscale(0.7)}
.xrpg-unit.fx-hit{animation:xrpgHit .28s ease-out 1}
.xrpg-unit.fx-cast{animation:xrpgCast .35s ease-out 1}
.xrpg-unit.fx-swing{animation:xrpgSwing .22s ease-out 1}
.xrpg-unit.fx-ult-hit{animation:xrpgUltHit .36s ease-out 1}

/* skill fx (job flavored) */
.xrpg-unit.fx-s1-knight{animation:xrpgSkillGlowBlue .38s ease-out 1}
.xrpg-unit.fx-s2-knight{animation:xrpgSkillGlowCyan .38s ease-out 1}
.xrpg-unit.fx-ult-knight{animation:xrpgSkillGlowGold .48s ease-out 1}

.xrpg-unit.fx-s1-mage{animation:xrpgSkillGlowPurple .38s ease-out 1}
.xrpg-unit.fx-s2-mage{animation:xrpgSkillGlowBlue .38s ease-out 1}
.xrpg-unit.fx-ult-mage{animation:xrpgSkillGlowPink .48s ease-out 1}

.xrpg-unit.fx-s1-archer{animation:xrpgSkillGlowGreen .38s ease-out 1}
.xrpg-unit.fx-s2-archer{animation:xrpgSkillGlowCyan .38s ease-out 1}
.xrpg-unit.fx-ult-archer{animation:xrpgSkillGlowGold .48s ease-out 1}

.xrpg-unit.fx-s1-spellblade{animation:xrpgSkillGlowPink .38s ease-out 1}
.xrpg-unit.fx-s2-spellblade{animation:xrpgSkillGlowPurple .38s ease-out 1}
.xrpg-unit.fx-ult-spellblade{animation:xrpgSkillGlowGold .48s ease-out 1}

.xrpg-unit.fx-s1-cleric{animation:xrpgSkillGlowCyan .38s ease-out 1}
.xrpg-unit.fx-s2-cleric{animation:xrpgSkillGlowGreen .38s ease-out 1}
.xrpg-unit.fx-ult-cleric{animation:xrpgSkillGlowGold .48s ease-out 1}

@keyframes xrpgHit{0%{transform:translateY(0);box-shadow:0 0 0 rgba(0,0,0,0)}50%{transform:translateY(-2px);box-shadow:0 0 0 2px rgba(239,68,68,.35)}100%{transform:translateY(0);box-shadow:0 0 0 rgba(0,0,0,0)}}
@keyframes xrpgUltHit{0%{transform:translateY(0);box-shadow:0 0 0 rgba(0,0,0,0)}45%{transform:translateY(-3px);box-shadow:0 0 0 3px rgba(250,204,21,.55)}100%{transform:translateY(0);box-shadow:0 0 0 rgba(0,0,0,0)}}
@keyframes xrpgCast{0%{transform:translateY(0);box-shadow:0 0 0 rgba(0,0,0,0)}50%{transform:translateY(-2px);box-shadow:0 0 0 2px rgba(59,130,246,.35)}100%{transform:translateY(0);box-shadow:0 0 0 rgba(0,0,0,0)}}
@keyframes xrpgSwing{0%{transform:translateX(0)}50%{transform:translateX(2px)}100%{transform:translateX(0)}}

@keyframes xrpgSkillGlowBlue{0%{transform:translateY(0);box-shadow:0 0 0 rgba(0,0,0,0)}55%{transform:translateY(-2px);box-shadow:0 0 0 2px rgba(96,165,250,.55)}100%{transform:translateY(0);box-shadow:0 0 0 rgba(0,0,0,0)}}
@keyframes xrpgSkillGlowCyan{0%{transform:translateY(0);box-shadow:0 0 0 rgba(0,0,0,0)}55%{transform:translateY(-2px);box-shadow:0 0 0 2px rgba(34,211,238,.55)}100%{transform:translateY(0);box-shadow:0 0 0 rgba(0,0,0,0)}}
@keyframes xrpgSkillGlowGreen{0%{transform:translateY(0);box-shadow:0 0 0 rgba(0,0,0,0)}55%{transform:translateY(-2px);box-shadow:0 0 0 2px rgba(34,197,94,.55)}100%{transform:translateY(0);box-shadow:0 0 0 rgba(0,0,0,0)}}
@keyframes xrpgSkillGlowPurple{0%{transform:translateY(0);box-shadow:0 0 0 rgba(0,0,0,0)}55%{transform:translateY(-2px);box-shadow:0 0 0 2px rgba(168,85,247,.55)}100%{transform:translateY(0);box-shadow:0 0 0 rgba(0,0,0,0)}}
@keyframes xrpgSkillGlowPink{0%{transform:translateY(0);box-shadow:0 0 0 rgba(0,0,0,0)}55%{transform:translateY(-2px);box-shadow:0 0 0 2px rgba(251,113,133,.55)}100%{transform:translateY(0);box-shadow:0 0 0 rgba(0,0,0,0)}}
@keyframes xrpgSkillGlowGold{0%{transform:translateY(0);box-shadow:0 0 0 rgba(0,0,0,0)}55%{transform:translateY(-3px);box-shadow:0 0 0 3px rgba(250,204,21,.60)}100%{transform:translateY(0);box-shadow:0 0 0 rgba(0,0,0,0)}}

/* extra fx classes (name/kind based) */
.xrpg-unit.fx-guard{animation:xrpgSkillGlowBlue .44s ease-out 1}
.xrpg-unit.fx-evasion{animation:xrpgSkillGlowPurple .44s ease-out 1}
.xrpg-unit.fx-regen{animation:xrpgSkillGlowGreen .50s ease-out 1}
.xrpg-unit.fx-summon-archer{animation:xrpgSkillGlowGold .44s ease-out 1}
.xrpg-unit.fx-summon-knight{animation:xrpgSkillGlowGold .44s ease-out 1}
.xrpg-unit.fx-summon-spellblade{animation:xrpgSkillGlowGold .44s ease-out 1}

.xrpg-unit.fx-shieldbash{animation:xrpgSkillGlowCyan .40s ease-out 1}
.xrpg-unit.fx-formation{animation:xrpgSkillGlowBlue .42s ease-out 1}
.xrpg-unit.fx-fireball{animation:xrpgSkillGlowPink .42s ease-out 1}
.xrpg-unit.fx-manawave{animation:xrpgSkillGlowBlue .42s ease-out 1}
.xrpg-unit.fx-rapidshot{animation:xrpgSkillGlowGreen .36s ease-out 1}
.xrpg-unit.fx-aim{animation:xrpgSkillGlowGreen .46s ease-out 1}
.xrpg-unit.fx-runecut{animation:xrpgSkillGlowPurple .40s ease-out 1}
.xrpg-unit.fx-runeaoe{animation:xrpgSkillGlowPink .46s ease-out 1}
.xrpg-unit.fx-heallight{animation:xrpgSkillGlowCyan .46s ease-out 1}
.xrpg-unit.fx-blessing{animation:xrpgSkillGlowGreen .46s ease-out 1}
.xrpg-float{position:fixed;z-index:9998;pointer-events:none;font-weight:900;font-size:16px;text-shadow:0 2px 12px rgba(0,0,0,.65);padding:4px 8px;border-radius:999px;background:rgba(0,0,0,.35);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.18)}
@media (max-width: 420px){.xrpg-float{font-size:14px;padding:3px 7px;}}

/* 시뮬레이터 */
.xrpg-simulatorContent{display:flex;flex-direction:column;gap:12px;padding:12px;max-width:900px;margin:0 auto}
.xrpg-simTable{width:100%;border-collapse:collapse;font-size:12px;margin-top:6px}
.xrpg-simTable th,.xrpg-simTable td{padding:6px 8px;text-align:left;border:1px solid var(--ghost-border)}
.xrpg-simTable th{background:rgba(0,0,0,.15);font-weight:800}
.xrpg-simSummary p{margin:4px 0;font-size:13px;font-weight:700}
.xrpg-label{display:block;font-size:11px;font-weight:800;color:var(--muted);margin-bottom:2px}
.xrpg-select,.xrpg-input{padding:6px 8px;border-radius:8px;border:1px solid var(--ghost-border);background:var(--ghost);color:var(--ink);font-size:12px}
.xrpg-checkLabel{display:inline-flex;align-items:center;gap:4px;font-size:12px;cursor:pointer;margin-right:8px}
.xrpg-checkLabel input{cursor:pointer}
