:root{
  --bg:#080b12; --panel:#111827e8; --panel2:#172033f0; --line:#7b6231; --gold:#e8c56a;
  --text:#f4ead2; --muted:#c7b991; --red:#d96565; --green:#76d787; --blue:#77a8ff; --purple:#b388ff;
}
*{box-sizing:border-box} body{margin:0;background:radial-gradient(circle at 50% 0%,#20293c,#07090f 55%,#030407);color:var(--text);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Noto Sans KR",sans-serif;min-height:100vh;overflow-x:hidden}
button{font-family:inherit;border:1px solid #a98843;background:linear-gradient(#f0d277,#a86d23);color:#1b1206;font-weight:800;border-radius:12px;padding:11px 15px;cursor:pointer;box-shadow:0 4px 0 #4d3214,0 0 18px #0008;transition:.12s transform,.12s filter}button:hover{filter:brightness(1.08)}button:active{transform:translateY(3px);box-shadow:0 1px 0 #4d3214}button.secondary{background:linear-gradient(#8bb5ff,#2d5698);border-color:#96bdff;color:#07111f}button.ghost{background:#151b28;border:1px solid #4c5d7a;color:#dce8ff;box-shadow:none;padding:9px 12px}button.danger{border-color:#81474a;color:#ffc7c7}button:disabled{opacity:.45;cursor:not-allowed;filter:grayscale(.5)}
#app{max-width:1180px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column;padding:12px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 12px;border:1px solid #2a3651;border-radius:18px;background:#0c111ce8;box-shadow:0 0 30px #0008;position:sticky;top:8px;z-index:10;backdrop-filter:blur(8px)}.brand{font-size:24px;font-weight:900;letter-spacing:-.03em;color:var(--gold)}.subtitle{font-size:12px;color:var(--muted)}.top-actions{display:flex;gap:8px}.footer{font-size:12px;color:#998d74;display:flex;justify-content:space-between;padding:14px 4px;gap:10px;flex-wrap:wrap}.glass{background:linear-gradient(135deg,#111827ee,#0b0f18dd);border:1px solid #5c4b2c;border-radius:22px;box-shadow:0 15px 60px #000b, inset 0 0 0 1px #ffffff12}.title-screen{position:relative;margin-top:14px;height:calc(100vh - 132px);min-height:560px;overflow:hidden;border-radius:26px;border:1px solid #34415b;background:#111}.title-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;image-rendering:auto;filter:saturate(1.05) contrast(1.05)}.title-panel{position:absolute;left:38px;bottom:38px;width:min(520px,calc(100% - 76px));padding:28px}.title-panel h1{font-size:54px;line-height:1;margin:0 0 12px;color:var(--gold);text-shadow:0 3px 0 #3a230a}.title-panel p{line-height:1.7;color:#f5e8c9;margin:0 0 24px}.button-row{display:flex;gap:12px;flex-wrap:wrap}.layout{display:grid;grid-template-columns:1.15fr .85fr;gap:14px;margin-top:14px}.card{border:1px solid #31405c;background:linear-gradient(180deg,#121927,#0c111a);border-radius:20px;padding:14px;box-shadow:0 12px 40px #0007}.card h2,.card h3{margin:0 0 10px;color:var(--gold)}.nav{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}.statline{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.pill{padding:9px 11px;border-radius:14px;background:#182235;border:1px solid #344563;color:#e9efff;font-size:13px}.scene{position:relative;min-height:450px;border-radius:20px;overflow:hidden;border:1px solid #3c4b66;background:#10151f}.scene-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.74) saturate(1.08)}.scene::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#0000,#07101dcc 72%,#03060add)}.battle-field{position:relative;z-index:1;height:500px;display:grid;grid-template-columns:1fr 1fr;align-items:end;padding:24px 34px 154px}.unit{display:flex;flex-direction:column;align-items:center;gap:8px}.unit.enemy{align-items:center}.unit-img{max-width:min(330px,42vw);max-height:230px;object-fit:contain;filter:drop-shadow(0 16px 18px #000c);border-radius:12px}.player-img{max-width:205px}.enemy-img{max-width:270px}.boss-img{max-width:360px}.nameplate{font-weight:900;background:#05070bcc;border:1px solid #6b5831;border-radius:999px;padding:7px 14px;color:#ffefbf;box-shadow:0 0 16px #000b}.hpbar{width:min(320px,38vw);height:18px;background:#260d12;border:1px solid #7e383c;border-radius:999px;overflow:hidden}.hpfill{height:100%;background:linear-gradient(90deg,#b52235,#ff6f77);transition:.35s width}.mpfill{height:100%;background:linear-gradient(90deg,#3f65cf,#8ab4ff);transition:.35s width}.battle-ui{position:absolute;z-index:2;left:18px;right:18px;bottom:16px;height:124px;display:grid;grid-template-columns:1fr auto;gap:10px;align-items:stretch}.log{background:#070a10e6;border:1px solid #4d5b75;border-radius:16px;padding:12px;height:104px;min-height:104px;max-height:104px;overflow-y:auto;overflow-x:hidden;line-height:1.55;color:#e9e2d1;overscroll-behavior:contain}.skills{display:grid;grid-template-columns:repeat(2,150px);gap:8px;height:104px;align-self:stretch}.skill-btn{padding:10px 8px;font-size:13px}.shake{animation:shake .25s linear}.flash{animation:flash .28s linear}.float-dmg{position:absolute;z-index:5;font-size:32px;font-weight:1000;color:#ffdad7;text-shadow:0 3px 0 #5d1010,0 0 16px #ff5454;animation:floatDmg .8s ease-out forwards;pointer-events:none}@keyframes floatDmg{from{opacity:0;transform:translateY(10px) scale(.7)}20%{opacity:1}to{opacity:0;transform:translateY(-54px) scale(1.1)}}@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-8px)}50%{transform:translateX(7px)}75%{transform:translateX(-4px)}}@keyframes flash{0%,100%{filter:drop-shadow(0 16px 18px #000c)}50%{filter:drop-shadow(0 0 28px #fff) brightness(1.7)}}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}.asset-card{background:#101827;border:1px solid #33425d;border-radius:16px;padding:10px;display:flex;flex-direction:column;gap:8px;min-height:180px}.asset-card img{width:100%;height:92px;object-fit:contain;background:#05070a;border-radius:10px;border:1px solid #26334a}.asset-card .title{font-weight:900;color:#ffe3a1}.asset-card .desc{font-size:12px;color:#c8d0df;line-height:1.4}.slot-list{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.slot{min-height:112px;background:#101827;border:1px solid #3c4d69;border-radius:16px;padding:8px;text-align:center}.slot img{width:100%;height:54px;object-fit:contain}.slot b{display:block;color:#ffe39e;font-size:12px}.slot span{font-size:11px;color:#b9c3d5}.reward{border-color:#866b2b;background:linear-gradient(180deg,#211b0d,#111827)}.hub{position:relative;min-height:410px;border-radius:20px;overflow:hidden;border:1px solid #3c4b66}.hub img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.7)}.hub-content{position:relative;z-index:1;padding:22px;max-width:620px}.panel-title{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px}.small{font-size:12px;color:#aeb8ca}.notice{border:1px solid #4b6447;background:#132415;border-radius:14px;padding:10px;color:#d6ffd8;line-height:1.5;margin:10px 0}.bosswarn{border-color:#7d3a45;background:#2a1015;color:#ffd1d5}.dex-img{width:100%;max-height:220px;object-fit:cover;border-radius:16px;border:1px solid #3d4a60;margin-bottom:10px}.progress{height:12px;background:#12141c;border-radius:999px;overflow:hidden;border:1px solid #3c4d69}.progress>div{height:100%;background:linear-gradient(90deg,#c99a3e,#ffe88a)}.modal{position:fixed;inset:0;background:#000b;display:flex;align-items:center;justify-content:center;padding:18px;z-index:50}.modal-card{max-width:720px;width:100%;padding:24px}.hidden{display:none!important}@media(max-width:900px){.layout{grid-template-columns:1fr}.scene{min-height:560px}.battle-ui{height:190px;grid-template-columns:1fr;align-items:stretch}.log{height:82px;min-height:82px;max-height:82px}.skills{grid-template-columns:repeat(2,1fr);height:96px}.skill-btn{width:100%;padding:8px 6px}.title-panel h1{font-size:40px}.battle-field{height:560px;padding:18px 12px 214px}.unit-img{max-width:44vw;max-height:190px}.boss-img{max-width:48vw}.hpbar{width:min(280px,42vw)}.slot-list{grid-template-columns:repeat(2,1fr)}.statline{grid-template-columns:repeat(2,1fr)}}

/* Synthesis altar fix */
.alter-note{font-size:12px;color:#c7b991}.altar-layout{display:grid;grid-template-columns:.92fr 1.08fr;gap:14px;margin-top:14px}.synthesis-preview{border:1px solid #725b2f;background:linear-gradient(180deg,#1b1720,#101827);border-radius:18px;padding:12px;margin:12px 0}.synthesis-preview h3{margin:0 0 10px;color:#ffe6a6}.compare{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}.guide-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:8px 0 14px}.guide-steps div{background:#101827;border:1px solid #40516d;border-radius:14px;padding:9px;text-align:center;font-size:12px}.guide-steps b{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:999px;background:#e8c56a;color:#1b1206;margin-right:4px}.part-heading{margin-top:16px!important;border-top:1px solid #30405b;padding-top:12px}.part-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}.part-card{position:relative}.part-card.selected{border-color:#e8c56a;box-shadow:0 0 0 2px #e8c56a44,0 0 24px #e8c56a22}.part-card.equipped::before{content:"장착중";position:absolute;top:8px;right:8px;font-size:11px;background:#243b1f;color:#d9ffd3;border:1px solid #5d9860;border-radius:999px;padding:3px 7px}.part-card.locked{opacity:.56;filter:grayscale(.35)}.synthesis-actions{margin-top:12px}.guide-modal ol{line-height:1.8;padding-left:22px}.guide-modal li{margin:6px 0}.guide-modal h2{color:#e8c56a;margin-top:0}
@media(max-width:900px){.altar-layout{grid-template-columns:1fr}.compare{grid-template-columns:1fr}.guide-steps{grid-template-columns:repeat(2,1fr)}}

/* V.0.4 skill descriptions + Firebase save UI */
#versionLabel{color:var(--gold);font-weight:900;letter-spacing:.02em}.cloud-status{font-size:13px}.cloud-on{color:#b9ffd0}.cloud-off{color:#ffd89c}.skills{grid-template-columns:repeat(2,190px)}.skill-btn{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;line-height:1.25}.skill-btn b{font-size:13px}.skill-btn span{font-size:11px;opacity:.9}.skill-btn em{font-style:normal;font-size:10px;opacity:.75;color:#281802}.skill-btn.secondary em{color:#07111f}.guide-modal{max-height:86vh;overflow:auto}.guide-modal.wide{max-width:960px}.skill-guide-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px;margin:8px 0 14px}.skill-help{background:#101827;border:1px solid #40516d;border-radius:14px;padding:10px}.skill-help b{display:block;color:#ffe39e}.skill-help span{display:block;font-size:12px;color:#a9c8ff;margin:3px 0}.skill-help p{margin:0;color:#dfe6f5;font-size:12px;line-height:1.45}.skill-list{display:grid;gap:8px;margin:8px 0}.skill-card{display:grid;grid-template-columns:70px 1fr;gap:10px;background:#0d1421;border:1px solid #33425d;border-radius:14px;padding:8px;align-items:center}.skill-card img{width:70px;height:54px;object-fit:contain;background:#05070a;border-radius:10px}.skill-card b{color:#ffe3a1}.skill-card p{margin:3px 0;color:#d9e1ef;line-height:1.45;font-size:12px}.skill-card span{color:#aeb8ca;font-size:11px}.part-card .desc{min-height:94px}.top-actions{flex-wrap:wrap;justify-content:flex-end}
@media(max-width:900px){.skills{grid-template-columns:repeat(2,1fr)}.skill-btn em{display:none}.topbar{align-items:flex-start}.brand{font-size:20px}.top-actions button{padding:7px 9px;font-size:12px}}
/* keep battle log fixed while allowing richer skill descriptions */
.battle-ui{height:168px}.log{height:148px;min-height:148px;max-height:148px}.skills{height:148px}.battle-field{padding-bottom:204px}.skill-btn{overflow:hidden}.skill-btn em{display:block;max-height:30px;overflow:hidden}
@media(max-width:900px){.battle-ui{height:220px}.log{height:92px;min-height:92px;max-height:92px}.skills{height:116px}.battle-field{padding-bottom:244px}.skill-btn b{font-size:12px}.skill-btn span{font-size:10px}}

/* V.0.6 account login modal */
.auth-modal{max-width:520px}.auth-divider{display:flex;align-items:center;gap:10px;margin:14px 0;color:#aeb8ca;font-size:13px}.auth-divider::before,.auth-divider::after{content:"";height:1px;background:#3b4b68;flex:1}.auth-label{display:grid;gap:6px;margin:10px 0;color:#ffe3a1;font-weight:800}.auth-label input{width:100%;box-sizing:border-box;border:1px solid #40516d;background:#070a10;color:#eef4ff;border-radius:12px;padding:12px 13px;font-size:14px;outline:none}.auth-label input:focus{border-color:#e8c56a;box-shadow:0 0 0 3px #e8c56a22}.hidden{display:none!important}

/* V.0.8 dex detail + skill info buttons */
.skill-wrap{position:relative;min-width:190px;height:100%}.skill-wrap .skill-btn{width:100%;height:100%;padding-right:32px}.skill-info{position:absolute;right:6px;top:6px;width:22px;height:22px;border-radius:50%;padding:0;font-size:13px;font-weight:1000;line-height:1;background:#f4d06b;color:#211300;border:1px solid #fff1a8;box-shadow:0 2px 8px #0008;z-index:3}.skill-info:hover{transform:translateY(-1px);filter:brightness(1.08)}.dex-grid .dex-card{appearance:none;text-align:left;color:inherit;cursor:pointer;width:100%;font-family:inherit}.dex-card:hover{transform:translateY(-2px);border-color:#f0c85d;box-shadow:0 10px 24px #0007}.dex-detail{max-width:900px}.dex-detail-head{display:grid;grid-template-columns:220px 1fr;gap:16px;align-items:center}.dex-detail-head>img{width:100%;height:170px;object-fit:contain;background:#05070a;border:1px solid #374760;border-radius:16px}.dex-statline{margin-top:10px}.drop-list{display:grid;gap:10px;margin:10px 0}.drop-row{display:grid;grid-template-columns:78px 1fr 70px;gap:10px;align-items:center;background:#0d1421;border:1px solid #33425d;border-radius:16px;padding:10px}.drop-row img{width:78px;height:58px;object-fit:contain;background:#05070a;border-radius:10px}.drop-row b{display:block;color:#ffe3a1}.drop-row span{display:block;color:#a9c8ff;font-size:12px;margin:2px 0}.drop-row p{margin:0;color:#dfe6f5;font-size:12px;line-height:1.35}.drop-row strong{font-size:22px;color:#ffe88a;text-align:right}
@media(max-width:900px){.skill-wrap{min-width:0}.skill-wrap .skill-btn{padding-right:30px}.skill-info{width:21px;height:21px;font-size:12px}.dex-detail-head{grid-template-columns:1fr}.dex-detail-head>img{height:150px}.drop-row{grid-template-columns:58px 1fr 54px}.drop-row img{width:58px;height:48px}.drop-row strong{font-size:18px}.dex-statline{grid-template-columns:repeat(2,1fr)}}

/* V.0.9 character unlock / coin system */

.character-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin-top:12px}
.character-card img{height:170px;object-fit:contain;background:linear-gradient(180deg,#202a3b,#0b0f18);border-radius:14px;padding:6px}
.character-card.selected{outline:2px solid var(--gold);box-shadow:0 0 24px #e8c56a55}
.character-card.locked{filter:saturate(.75)}
.character-card .desc{min-height:128px}
.coin-preview{width:100%;max-height:170px;object-fit:contain;background:#0b0f18;border-radius:16px;border:1px solid #31405c;padding:10px}
.grade-list{display:grid;gap:8px;margin-top:12px}
.grade-list>div{display:flex;align-items:center;justify-content:space-between;border:1px solid #31405c;background:#121927;border-radius:12px;padding:10px 12px}
.grade-list span,.coin-pill{color:var(--gold);font-weight:900}
.wide-statline{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
.dex-statline{grid-template-columns:repeat(auto-fit,minmax(100px,1fr))}
.unit-img{object-fit:contain}
.player-img,.enemy-img{filter:drop-shadow(0 10px 18px #000b)}
.asset-card img{object-fit:contain}


/* V.1.8 파츠 희귀도 테두리 */
.grade-common{border-color:#8f7650!important;box-shadow:inset 0 0 0 1px rgba(180,140,90,.45)}
.grade-rare{border-color:#69aaff!important;box-shadow:inset 0 0 0 1px rgba(105,170,255,.8),0 0 14px rgba(105,170,255,.18)}
.grade-elite{border-color:#f0c850!important;box-shadow:inset 0 0 0 1px rgba(240,200,80,.9),0 0 18px rgba(240,200,80,.22)}
.grade-extinct{border-color:#69e696!important;box-shadow:inset 0 0 0 1px rgba(105,230,150,.9),0 0 20px rgba(105,230,150,.24)}
.grade-divine{border-color:#fff5be!important;box-shadow:inset 0 0 0 1px rgba(255,245,190,1),0 0 26px rgba(255,245,190,.35),0 0 8px rgba(255,220,120,.24)}
.upgrade-list{display:flex;flex-direction:column;gap:10px;margin-top:12px}.upgrade-row{display:grid;grid-template-columns:54px 1fr auto auto;gap:10px;align-items:center;background:rgba(255,255,255,.06);border-radius:14px;padding:10px}.upgrade-row img{width:54px;height:54px;object-fit:contain}.upgrade-row span{font-size:12px;opacity:.82}.part-inventory-grid .asset-card img{object-fit:contain}.raid-card img{height:130px;object-fit:contain}.dex-statline{gap:6px;flex-wrap:wrap}.part-card .title{min-height:32px}@media(max-width:760px){.upgrade-row{grid-template-columns:46px 1fr;}.upgrade-row button{grid-column:2}.upgrade-row img{width:46px;height:46px}}

/* V.1.1 flee button */
.flee-skill {
  border-color: rgba(255, 170, 120, .45) !important;
  background: linear-gradient(180deg, rgba(90, 45, 35, .88), rgba(36, 20, 22, .92)) !important;
}
.flee-skill:hover {
  filter: brightness(1.08);
}

/* V.1.3 player status / coin heal */
.status-layout{grid-template-columns:0.9fr 1.1fr}.status-summary{display:grid;gap:12px;margin:12px 0}.status-meter{background:#0d1421;border:1px solid #33425d;border-radius:16px;padding:12px;display:grid;gap:8px}.status-meter b{color:#ffe3a1}.status-meter span{font-size:13px;color:#dfe6f5}.status-hpbar{width:100%;max-width:100%}.heal-panel{margin-top:14px;border:1px solid #725b2f;background:linear-gradient(180deg,#1b1720,#101827);border-radius:18px;padding:14px}.equipment-status{display:grid;gap:14px}.status-hero{display:grid;grid-template-columns:120px 1fr;gap:14px;align-items:center;background:#0d1421;border:1px solid #33425d;border-radius:18px;padding:12px}.status-hero img{width:120px;height:150px;object-fit:contain;background:#05070a;border-radius:14px}.status-hero h3{margin:0;color:#ffe3a1}.status-hero p{margin:4px 0;color:#dfe6f5;line-height:1.45}.status-hero span{font-size:12px;color:#aeb8ca}.status-parts{display:grid;gap:10px}.status-part{display:grid;grid-template-columns:76px 1fr;gap:10px;align-items:center;background:#0d1421;border:1px solid #33425d;border-radius:16px;padding:10px}.status-part img{width:76px;height:62px;object-fit:contain;background:#05070a;border-radius:12px}.status-part b{display:block;color:#ffe3a1}.status-part span{display:block;color:#a9c8ff;font-size:12px;margin:2px 0}.status-part p{margin:0;color:#dfe6f5;font-size:12px;line-height:1.35}.status-part small{color:#c7b991}
@media(max-width:900px){.status-layout{grid-template-columns:1fr}.status-hero{grid-template-columns:88px 1fr}.status-hero img{width:88px;height:112px}.status-part{grid-template-columns:58px 1fr}.status-part img{width:58px;height:50px}}

/* V.1.4 mobile battle fix + clearer heal/upgrade layout */
@media(max-width:900px){
  .scene{min-height:740px;overflow:visible;}
  .battle-field{height:510px;padding:16px 10px 300px;align-items:end;}
  .battle-ui{left:10px;right:10px;bottom:12px;height:278px;grid-template-columns:1fr;gap:8px;}
  .battle-ui .log{height:96px;min-height:96px;max-height:96px;font-size:14px;}
  .battle-ui .skills{height:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;overflow:visible;}
  .skill-wrap{min-width:0;height:78px;}
  .skill-wrap .skill-btn{height:78px;min-height:78px;padding:8px 30px 8px 8px;}
  .battle-ui .skills>.flee-skill{grid-column:1/-1;min-height:48px;height:48px;padding:7px 10px;}
  .skill-btn b{font-size:12px}.skill-btn span{font-size:10px}.skill-btn em{display:none!important;}
  .unit-img{max-height:170px}.player-img{max-width:38vw}.enemy-img{max-width:40vw}.boss-img{max-width:46vw}.hpbar{height:16px;}
}
@media(max-width:430px){
  #app{padding:8px}.topbar{top:4px}.scene{min-height:760px}.battle-field{height:500px;padding-bottom:306px}.battle-ui{height:286px}.button-row button{font-size:12px;padding:9px 10px}.nav button{font-size:12px;padding:8px 9px}
}


/* V.1.6 flee button always visible */
.skills .flee-skill{
  grid-column:1 / -1;
  width:100%;
  min-height:54px;
  height:54px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  text-align:center;
  font-weight:900;
  color:#fff3dc !important;
}
.skills .flee-skill b{font-size:14px;line-height:1.1;color:#fff3dc;}
.skills .flee-skill span{font-size:11px;opacity:.92;color:#ffd9bd;}
@media(max-width:900px){
  .scene{min-height:830px;}
  .battle-field{height:520px;padding-bottom:326px;}
  .battle-ui{height:318px;bottom:10px;grid-template-columns:1fr;}
  .battle-ui .log{height:84px;min-height:84px;max-height:84px;font-size:13px;}
  .battle-ui .skills{height:214px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;overflow:visible;}
  .skill-wrap{height:62px;}
  .skill-wrap .skill-btn{height:62px;min-height:62px;padding:7px 30px 7px 8px;}
  .battle-ui .skills>.flee-skill{grid-column:1/-1;height:44px;min-height:44px;padding:6px 10px;margin-top:0;}
  .skills .flee-skill b{font-size:13px;}
  .skills .flee-skill span{font-size:10px;}
}
@media(max-width:430px){
  .scene{min-height:850px;}
  .battle-field{height:520px;padding-bottom:330px;}
  .battle-ui{height:324px;}
}

/* V.1.7 battle top-left flee button */
.battle-flee-top{
  position:absolute;
  top:14px;
  left:14px;
  z-index:6;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:2px;
  min-width:128px;
  padding:9px 13px;
  border-radius:16px;
  border:1px solid rgba(255,190,130,.65);
  background:linear-gradient(180deg,rgba(91,45,35,.95),rgba(30,16,18,.96));
  color:#fff1d8;
  box-shadow:0 10px 22px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.06) inset;
  text-align:left;
}
.battle-flee-top b{font-size:14px;line-height:1.1;color:#fff3dc;}
.battle-flee-top span{font-size:11px;color:#ffd7b2;opacity:.95;}
.battle-flee-top:hover{filter:brightness(1.08);transform:translateY(-1px)}
@media(max-width:900px){
  .battle-flee-top{top:10px;left:10px;min-width:104px;padding:7px 10px;border-radius:14px;}
  .battle-flee-top b{font-size:13px;}
  .battle-flee-top span{font-size:10px;}
}

/* V.1.8 divine part visibility fix */
.drop-row.grade-divine,.asset-card.grade-divine,.slot.grade-divine{background:linear-gradient(180deg,rgba(62,48,16,.92),rgba(17,24,39,.94));}
.drop-row.grade-rare,.asset-card.grade-rare,.slot.grade-rare{background:linear-gradient(180deg,rgba(13,28,54,.92),rgba(17,24,39,.94));}
.drop-row.grade-elite,.asset-card.grade-elite,.slot.grade-elite{background:linear-gradient(180deg,rgba(49,37,12,.92),rgba(17,24,39,.94));}
.drop-row.grade-extinct,.asset-card.grade-extinct,.slot.grade-extinct{background:linear-gradient(180deg,rgba(11,45,30,.9),rgba(17,24,39,.94));}


/* V.1.11 nav coin display */
.nav-coin{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid #e8c56a88;
  background:linear-gradient(180deg,#2a210d,#141821);
  color:#ffe39e;
  font-weight:1000;
  box-shadow:0 4px 14px #0005,inset 0 0 0 1px #fff2;
  white-space:nowrap;
}
@media(max-width:760px){
  .nav-coin{font-size:12px;min-height:34px;padding:7px 10px;order:99;width:100%;}
}

.nav-coin-strong{
  margin-left:4px;
  border-width:2px;
  color:#fff0b6;
  background:linear-gradient(180deg,#4a3309,#1b1720);
  text-shadow:0 1px 0 #000;
}
.nav-coin-strong b{font-size:16px;color:#ffffff;}

/* V.1.18 upgrade row layout fix: keep text readable and push action buttons to the right */
.upgrade-row{
  grid-template-columns:54px minmax(170px,1fr) auto !important;
  align-items:center !important;
}
.upgrade-info{
  min-width:0;
  overflow:hidden;
}
.upgrade-info b,
.upgrade-info span{
  display:block;
  white-space:normal;
  word-break:keep-all;
  overflow-wrap:break-word;
  line-height:1.45;
}
.upgrade-actions{
  display:flex;
  gap:10px;
  justify-content:flex-end;
  align-items:center;
  flex-wrap:wrap;
  min-width:0;
}
.upgrade-actions button{
  white-space:nowrap;
  min-width:160px;
  padding-left:14px;
  padding-right:14px;
}
@media(max-width:760px){
  .upgrade-row{
    grid-template-columns:46px 1fr !important;
  }
  .upgrade-row img{
    width:46px!important;
    height:46px!important;
  }
  .upgrade-actions{
    grid-column:1 / -1;
    width:100%;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
  }
  .upgrade-actions button{
    min-width:0;
    width:100%;
    white-space:normal;
    line-height:1.25;
  }
}
@media(max-width:420px){
  .upgrade-actions{grid-template-columns:1fr;}
}

/* V.1.20 bulk sale / character skill UI polish */
.bulk-sell-list{display:grid;gap:14px;margin-top:14px;}
.bulk-sell-option{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;padding:14px;border:1px solid rgba(139,166,220,.45);border-radius:18px;background:rgba(10,16,30,.55);}
.bulk-sell-option p{margin:6px 0;color:#d7dce9;line-height:1.45;}
.bulk-sell-option span{display:inline-block;color:#f5d77b;font-weight:700;}
.bulk-sell-option button{white-space:nowrap;}
@media (max-width: 720px){.bulk-sell-option{grid-template-columns:1fr}.bulk-sell-option button{width:100%;}}

/* V.1.22 upgrade preview + dex rarity borders */
.upgrade-row{
  grid-template-columns:54px minmax(0,1fr) minmax(180px,auto) !important;
}
.upgrade-info{min-width:0;}
.upgrade-info b,.upgrade-info span{word-break:keep-all;overflow-wrap:normal;}
.upgrade-preview-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:8px;}
.preview-block{border:1px solid rgba(255,255,255,.14);background:rgba(0,0,0,.18);border-radius:12px;padding:8px;display:grid;gap:4px;}
.preview-block>b{color:#ffe3a1;font-size:12px;}
.preview-block>span{font-size:12px;opacity:.9;}
.upgrade-preview{display:grid;gap:3px;font-size:12px;}
.upgrade-preview em{font-style:normal;color:#9effc4;font-weight:900;margin-left:4px;}
.dex-card.grade-common,.dex-detail.grade-common{border-color:#8f7650!important;box-shadow:inset 0 0 0 1px rgba(180,140,90,.5),0 8px 22px rgba(0,0,0,.25)}
.dex-card.grade-rare,.dex-detail.grade-rare{border-color:#4aa3ff!important;box-shadow:inset 0 0 0 1px rgba(74,163,255,.65),0 0 18px rgba(74,163,255,.18)}
.dex-card.grade-elite,.dex-detail.grade-elite{border-color:#f5c84b!important;box-shadow:inset 0 0 0 1px rgba(245,200,75,.7),0 0 20px rgba(245,200,75,.2)}
.dex-card.grade-extinct,.dex-detail.grade-extinct{border-color:#48d184!important;box-shadow:inset 0 0 0 1px rgba(72,209,132,.7),0 0 20px rgba(72,209,132,.18)}
.dex-card.grade-divine,.dex-detail.grade-divine{border-color:#fff1a8!important;box-shadow:inset 0 0 0 1px rgba(255,241,168,.85),0 0 26px rgba(255,218,91,.35)}
@media(max-width:760px){
  .upgrade-row{grid-template-columns:46px 1fr !important;}
  .upgrade-actions{grid-column:1 / -1;display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%;}
  .upgrade-preview-grid{grid-template-columns:1fr;}
}

.pet-card.selected{box-shadow:0 0 0 3px rgba(255,230,120,.9),0 0 22px rgba(255,210,90,.35)}
.nav-coin{font-weight:800;white-space:nowrap;padding:.55rem .7rem;border-radius:999px;background:rgba(255,220,120,.12);border:1px solid rgba(255,220,120,.35)}

/* V.1.29 강화/승급 행 강제 정렬: 정보는 왼쪽, 버튼 2개는 오른쪽 묶음 */
.upgrade-list .upgrade-row{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  grid-template-columns:none!important;
  overflow:hidden!important;
}
.upgrade-list .upgrade-row>img{
  flex:0 0 58px!important;
  width:58px!important;
  height:58px!important;
  object-fit:contain!important;
}
.upgrade-list .upgrade-info{
  flex:1 1 auto!important;
  min-width:260px!important;
  max-width:none!important;
  overflow:visible!important;
}
.upgrade-list .upgrade-info b,
.upgrade-list .upgrade-info span{
  white-space:normal!important;
  word-break:keep-all!important;
  overflow-wrap:break-word!important;
  writing-mode:horizontal-tb!important;
  text-orientation:mixed!important;
}
.upgrade-list .upgrade-actions{
  flex:0 0 280px!important;
  margin-left:auto!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:stretch!important;
  gap:8px!important;
  width:280px!important;
  min-width:260px!important;
}
.upgrade-list .upgrade-actions button{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  white-space:normal!important;
  line-height:1.25!important;
  padding:12px 14px!important;
}
@media(max-width:720px){
  .upgrade-list .upgrade-row{
    flex-wrap:wrap!important;
    align-items:flex-start!important;
  }
  .upgrade-list .upgrade-row>img{
    flex:0 0 50px!important;
    width:50px!important;
    height:50px!important;
  }
  .upgrade-list .upgrade-info{
    flex:1 1 calc(100% - 70px)!important;
    min-width:220px!important;
  }
  .upgrade-list .upgrade-actions{
    flex:1 1 100%!important;
    width:100%!important;
    min-width:0!important;
    margin-left:0!important;
    flex-direction:row!important;
  }
  .upgrade-list .upgrade-actions button{
    flex:1 1 0!important;
  }
}
@media(max-width:430px){
  .upgrade-list .upgrade-info{min-width:0!important;}
  .upgrade-list .upgrade-actions{flex-direction:column!important;}
}

/* V.1.30 fixes */
.nav button.active-tab,
.nav button:disabled.active-tab {
  filter: grayscale(1) brightness(.72);
  opacity: .72;
  cursor: not-allowed;
  box-shadow: none;
}
.sort-toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin: 10px 0 16px;
  padding: 10px;
  border: 1px solid rgba(139,166,210,.35);
  border-radius: 14px;
  background: rgba(7,12,25,.45);
}
.sort-toolbar span { color: #f5da78; font-weight: 800; margin-right: 4px; }
.sort-toolbar button { padding: 8px 12px; font-size: 14px; min-height: 36px; }
.sort-toolbar .active-sort,
.sort-toolbar button:disabled.active-sort {
  background: linear-gradient(180deg,#4d5567,#303644);
  color: #d8dbe4;
  border-color: rgba(255,255,255,.18);
  filter: grayscale(.8);
  cursor: not-allowed;
}
.part-origin {
  display: inline-block;
  margin: 4px 0 3px;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  border: 1px solid rgba(255,255,255,.2);
}
.origin-dino { color: #ffd18a; background: rgba(128,73,24,.35); border-color: rgba(255,177,75,.45); }
.origin-bird { color: #c6e8ff; background: rgba(38,91,143,.28); border-color: rgba(124,190,255,.38); }
.cap-panel {
  margin-top: 16px;
  padding: 14px;
  border-radius: 16px;
  border: 1px solid rgba(245,218,120,.35);
  background: rgba(30,24,10,.42);
}
.cap-panel h3 { margin-top: 0; }
.cap-panel button { margin-top: 10px; }
@media (max-width: 760px) {
  .sort-toolbar { gap: 6px; }
  .sort-toolbar button { flex: 1 1 42%; font-size: 13px; }
}

/* V.1.33 dex filters and grade sort */
.dex-toolbar{display:grid;gap:10px;margin:12px 0;padding:10px;border:1px solid #30405b;border-radius:16px;background:rgba(6,10,18,.45)}
.dex-filter-group{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.dex-filter-group>b{color:#ffe39e;min-width:42px}
.dex-filter-group button{padding:7px 10px;border-radius:999px;font-size:12px;box-shadow:none;background:#151b28;color:#dce8ff;border-color:#4c5d7a}
.dex-filter-group button.dex-filter-active,.dex-filter-group button:disabled{background:#3a3f4b!important;color:#9aa3b4!important;border-color:#5a6375!important;filter:grayscale(.8);opacity:.85}
.dex-summary{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:10px 0;color:#dbe5f7;font-size:13px}
.dex-count-pill{display:inline-flex;align-items:center;border:1px solid #465673;border-radius:999px;padding:4px 8px;background:#101827;font-weight:800;font-size:12px;color:#f2e7ca}
.dex-main-card .dex-grid{margin-top:10px}
@media(max-width:760px){.dex-toolbar{gap:8px}.dex-filter-group{align-items:flex-start}.dex-filter-group>b{width:100%;min-width:0}.dex-filter-group button{font-size:11px;padding:6px 8px}}

/* V.1.36 pet combat UI */
.pet-battle-badge{margin-top:8px;display:flex;align-items:center;gap:8px;justify-content:center;font-size:12px;color:#f7e9bd;background:rgba(0,0,0,.28);border:1px solid rgba(240,192,64,.4);border-radius:12px;padding:6px 8px;max-width:220px;margin-left:auto;margin-right:auto}
.pet-battle-badge img{width:42px;height:42px;object-fit:contain;image-rendering:pixelated}
.pet-battle-badge.muted{opacity:.65;color:#bbb}
.pet-effect-panel{margin-top:14px}
@media(max-width:760px){.pet-battle-badge{font-size:11px;padding:5px}.pet-battle-badge img{width:34px;height:34px}}


/* V.1.37 ritual button restore + pet assist below flee */
.battle-ui{height:244px;}
.battle-field{padding-bottom:284px;}
.battle-ui .log{height:224px;min-height:224px;max-height:224px;}
.battle-ui .skills{height:224px;display:grid;grid-template-columns:repeat(2,190px);grid-auto-rows:64px;gap:8px;align-content:start;overflow:visible;}
.battle-ui .skill-wrap{min-width:0;height:64px;}
.battle-ui .skill-wrap .skill-btn{height:64px;min-height:64px;}
.battle-ui .skills>.flee-skill{grid-column:1/-1;height:46px;min-height:46px;padding:7px 10px;}
.battle-ui .skill-wrap-pet{grid-column:1/-1;height:46px;}
.battle-ui .skill-wrap-pet .skill-btn{height:46px;min-height:46px;align-items:center;text-align:center;padding:7px 34px 7px 10px;}
.battle-ui .skill-wrap-pet .skill-btn em{display:none!important;}
.battle-ui .skill-wrap-pet .skill-info{top:12px;}
@media(max-width:900px){
  .scene{min-height:930px;}
  .battle-field{height:520px;padding-bottom:402px;}
  .battle-ui{height:390px;bottom:10px;grid-template-columns:1fr;}
  .battle-ui .log{height:82px;min-height:82px;max-height:82px;font-size:13px;}
  .battle-ui .skills{height:292px;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:58px;gap:7px;}
  .battle-ui .skill-wrap{height:58px;}
  .battle-ui .skill-wrap .skill-btn{height:58px;min-height:58px;padding:7px 30px 7px 8px;}
  .battle-ui .skills>.flee-skill{height:42px;min-height:42px;grid-column:1/-1;padding:6px 10px;}
  .battle-ui .skill-wrap-pet{height:42px;grid-column:1/-1;}
  .battle-ui .skill-wrap-pet .skill-btn{height:42px;min-height:42px;padding:6px 30px 6px 10px;}
}
@media(max-width:430px){
  .scene{min-height:950px;}
  .battle-field{height:520px;padding-bottom:410px;}
  .battle-ui{height:398px;}
}

/* V.1.39: 펫 협공은 좌측 상단 도망가기 바로 아래에 고정 */
.battle-pet-top{
  position:absolute;
  top:76px;
  left:16px;
  z-index:8;
  min-width:118px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:2px;
  padding:8px 12px;
  border-radius:16px;
  border:1px solid rgba(112,185,255,.72);
  background:linear-gradient(180deg,rgba(45,92,150,.95),rgba(20,42,78,.95));
  color:#eaf5ff;
  box-shadow:0 8px 22px rgba(0,0,0,.35),0 0 18px rgba(82,160,255,.22);
}
.battle-pet-top b{font-size:14px;line-height:1.1;color:#eaf5ff;}
.battle-pet-top span{font-size:11px;color:#bdddff;opacity:.96;}
.battle-pet-top:hover{filter:brightness(1.08);transform:translateY(-1px)}
.battle-pet-top.disabled,
.battle-pet-top:disabled{opacity:.48;filter:grayscale(.4);cursor:not-allowed;transform:none;}
@media(max-width:760px){
  .battle-pet-top{top:66px;left:10px;min-width:104px;padding:7px 10px;border-radius:14px;}
  .battle-pet-top b{font-size:13px;}
  .battle-pet-top span{font-size:10px;}
  .battle-ui .skills>.skill-wrap-pet{display:none!important;}
}

/* V.1.40: 스킬 영역은 기본 4개 버튼만 표시, 도망/펫은 좌측 상단 고정 */
.battle-ui{
  height:168px !important;
  grid-template-columns:1fr auto !important;
  gap:10px !important;
}
.battle-field{padding-bottom:204px !important;}
.battle-ui .log{
  height:148px !important;
  min-height:148px !important;
  max-height:148px !important;
}
.battle-ui .skills{
  height:148px !important;
  display:grid !important;
  grid-template-columns:repeat(2,150px) !important;
  grid-template-rows:repeat(2,70px) !important;
  grid-auto-rows:70px !important;
  gap:8px !important;
  align-content:start !important;
  overflow:visible !important;
}
.battle-ui .skills>.flee-skill,
.battle-ui .skill-wrap-pet{display:none !important;}
.battle-ui .skill-wrap{height:70px !important;min-width:0;}
.battle-ui .skill-wrap .skill-btn{height:70px !important;min-height:70px !important;padding:9px 32px 8px 9px;}
@media(max-width:900px){
  .scene{min-height:760px !important;}
  .battle-field{height:520px !important;padding-bottom:300px !important;}
  .battle-ui{height:286px !important;bottom:10px !important;grid-template-columns:1fr !important;}
  .battle-ui .log{height:90px !important;min-height:90px !important;max-height:90px !important;font-size:13px;}
  .battle-ui .skills{height:184px !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;grid-template-rows:repeat(2,86px) !important;grid-auto-rows:86px !important;gap:8px !important;}
  .battle-ui .skill-wrap{height:86px !important;}
  .battle-ui .skill-wrap .skill-btn{height:86px !important;min-height:86px !important;padding:8px 30px 8px 8px;}
}
@media(max-width:430px){
  .scene{min-height:780px !important;}
  .battle-field{height:520px !important;padding-bottom:306px !important;}
  .battle-ui{height:292px !important;}
}

/* V.1.41: 전투 하단 UI를 살짝 아래로 낮춰 대형 공룡 HP바를 가리지 않게 조정 */
.battle-ui{
  height:136px !important;
  bottom:10px !important;
  grid-template-columns:1fr auto !important;
  gap:10px !important;
}
.battle-field{
  padding-bottom:172px !important;
}
.battle-ui .log{
  height:116px !important;
  min-height:116px !important;
  max-height:116px !important;
}
.battle-ui .skills{
  height:116px !important;
  display:grid !important;
  grid-template-columns:repeat(2,150px) !important;
  grid-template-rows:repeat(2,54px) !important;
  grid-auto-rows:54px !important;
  gap:8px !important;
  align-content:start !important;
  overflow:visible !important;
}
.battle-ui .skill-wrap{
  height:54px !important;
  min-width:0 !important;
}
.battle-ui .skill-wrap .skill-btn{
  height:54px !important;
  min-height:54px !important;
  padding:7px 32px 6px 9px !important;
}
.battle-ui .skill-btn b{font-size:12px !important;line-height:1.12 !important;}
.battle-ui .skill-btn span{font-size:10px !important;line-height:1.15 !important;}
.battle-ui .skill-btn em{display:none !important;}
@media(max-width:900px){
  .scene{min-height:730px !important;}
  .battle-field{height:520px !important;padding-bottom:278px !important;}
  .battle-ui{height:264px !important;bottom:8px !important;grid-template-columns:1fr !important;}
  .battle-ui .log{height:82px !important;min-height:82px !important;max-height:82px !important;font-size:13px !important;}
  .battle-ui .skills{height:174px !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;grid-template-rows:repeat(2,82px) !important;grid-auto-rows:82px !important;gap:8px !important;}
  .battle-ui .skill-wrap{height:82px !important;}
  .battle-ui .skill-wrap .skill-btn{height:82px !important;min-height:82px !important;padding:8px 30px 8px 8px !important;}
  .battle-ui .skill-btn b{font-size:12px !important;}
  .battle-ui .skill-btn span{font-size:10px !important;}
}
@media(max-width:430px){
  .scene{min-height:748px !important;}
  .battle-field{height:520px !important;padding-bottom:284px !important;}
  .battle-ui{height:270px !important;}
}


/* V.1.43: account-independent battle layout guard
   Old saves can unlock large dino/raid enemies; this keeps HP bars and controls in fixed safe lanes. */
.scene{min-height:620px !important;}
.battle-field{
  height:560px !important;
  padding:54px 34px 176px !important;
  box-sizing:border-box !important;
  align-items:end !important;
  overflow:hidden !important;
}
.battle-field .unit{
  min-height:300px !important;
  max-height:330px !important;
  justify-content:flex-end !important;
  overflow:visible !important;
}
.battle-field .unit-img{
  max-height:178px !important;
  width:auto !important;
  object-fit:contain !important;
  flex:0 0 auto !important;
}
.battle-field .enemy-img{max-height:184px !important;}
.battle-field .boss-img{max-height:198px !important;}
.battle-field .hpbar{
  flex:0 0 18px !important;
  margin-top:4px !important;
}
.battle-field .small{min-height:18px !important;}
.battle-ui{
  bottom:10px !important;
  height:136px !important;
  z-index:4 !important;
}
.battle-ui .log{height:116px !important;min-height:116px !important;max-height:116px !important;}
.battle-ui .skills{height:116px !important;grid-template-rows:repeat(2,54px) !important;grid-auto-rows:54px !important;}
.battle-ui .skill-wrap,.battle-ui .skill-wrap .skill-btn{height:54px !important;min-height:54px !important;}
@media(max-width:900px){
  .scene{min-height:760px !important;}
  .battle-field{height:570px !important;padding:52px 10px 292px !important;}
  .battle-field .unit{min-height:250px !important;max-height:270px !important;}
  .battle-field .unit-img{max-height:138px !important;max-width:42vw !important;}
  .battle-field .enemy-img{max-height:146px !important;}
  .battle-field .boss-img{max-height:154px !important;}
  .battle-field .nameplate{font-size:13px !important;padding:6px 10px !important;max-width:42vw;text-align:center;white-space:normal;line-height:1.15;}
  .battle-field .hpbar{width:min(260px,40vw) !important;height:16px !important;}
  .battle-field .small{font-size:12px !important;line-height:1.2 !important;}
  .battle-ui{height:270px !important;bottom:8px !important;grid-template-columns:1fr !important;}
  .battle-ui .log{height:82px !important;min-height:82px !important;max-height:82px !important;}
  .battle-ui .skills{height:176px !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;grid-template-rows:repeat(2,84px) !important;grid-auto-rows:84px !important;gap:8px !important;}
  .battle-ui .skill-wrap,.battle-ui .skill-wrap .skill-btn{height:84px !important;min-height:84px !important;}
}
@media(max-width:430px){
  .scene{min-height:780px !important;}
  .battle-field{height:570px !important;padding-bottom:300px !important;}
  .battle-ui{height:278px !important;}
  .battle-field .unit-img{max-height:128px !important;}
  .battle-field .boss-img{max-height:138px !important;}
}