:root{
  --bg:#12142a; --card:#1c1f3d; --card2:#242851; --ink:#f3f4ff; --mute:#a9aed6;
  --tier:#8fa4d8; --tier2:#5b74c4;
  --ok:#37d67a; --bad:#ff5d6c; --warn:#ffb020; --gold:#ffd54a; --acc:#7c6cff;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:radial-gradient(1200px 600px at 50% -200px,#2a2670,transparent),var(--bg);color:var(--ink);
  font-family:system-ui,-apple-system,"Apple SD Gothic Neo","Noto Sans KR","Noto Sans CJK KR",sans-serif;line-height:1.45}
.wrap{max-width:560px;margin:0 auto;padding:12px 12px calc(40px + env(safe-area-inset-bottom))}
.top{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;padding:8px 2px}
h1{margin:0;font-size:1.5rem;letter-spacing:-.02em}
h2{margin:0 0 10px;font-size:1.05rem}
.sub{margin:2px 0 0;color:var(--mute);font-size:.92rem}
.card{background:var(--card);border-radius:18px;padding:14px;margin:12px 0;box-shadow:0 6px 24px #0005}
button{font:inherit;color:inherit;border:0;border-radius:12px;padding:10px 14px;cursor:pointer;background:var(--card2);min-height:44px}
button:disabled{opacity:.5;cursor:not-allowed}
button.primary{background:var(--acc);font-weight:700}
button.ghost{background:transparent;border:1px solid #4b4f86}
button.small{min-height:34px;padding:6px 10px;font-size:.85rem}
.row{display:flex;gap:8px;margin-top:10px;align-items:center}
.row.wrapbtn{flex-wrap:wrap}
.sharebtns{display:grid;gap:8px;margin-top:10px}
.sharebtns button{width:100%;border-radius:14px;font-weight:800;line-height:1.25}
.sharebtns small,.spshare small,.spimg small{word-break:keep-all;display:block;font-size:.78rem;font-weight:600;opacity:.85;margin-top:2px;line-height:1.25}
.bigshare{min-height:62px;font-size:1.1rem;font-weight:900!important;box-shadow:0 4px 0 #4a3dc4}
.bigshare:active:not(:disabled){transform:translateY(3px);box-shadow:0 1px 0 #4a3dc4}
.sharealt{min-height:52px}
.sharealt small{color:var(--mute);opacity:1}
.sharecopy{min-height:44px}
input,select{font:inherit;color:var(--ink);background:#10122a;border:1px solid #3d4180;border-radius:10px;padding:8px 10px;width:100%;min-height:40px}
label{display:block;font-size:.85rem;color:var(--mute)}
label input,label select{margin-top:4px;color:var(--ink)}
label.check{display:flex;gap:8px;align-items:center;color:var(--ink);margin-top:8px}
label.check input{width:auto;min-height:0}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
fieldset{border:1px solid #3d4180;border-radius:12px;margin:10px 0;padding:8px 10px}
legend{padding:0 6px;color:var(--mute);font-size:.82rem}
summary{cursor:pointer;color:var(--mute);margin:6px 0}
.help{margin:0 0 8px;color:var(--mute);font-size:.85rem}

/* 무대 */
.stage{text-align:center}
.presetbar{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin-bottom:6px}
.presetbar button{min-height:34px;padding:5px 10px;font-size:.82rem;border:1px solid #3d4180;background:transparent}
.presetbar button.on{background:var(--acc);border-color:var(--acc);font-weight:700}
.stage[data-tier="0"]{--tier:#9fb2e6;--tier2:#5b74c4}   /* +0~+4  회색/파랑 */
.stage[data-tier="1"]{--tier:#5ee0a0;--tier2:#b78cff}   /* +5~+9  초록/보라 */
.stage[data-tier="2"]{--tier:#ff7a45;--tier2:#ff3d55}   /* +10~+12 빨강/주황 */
.stage[data-tier="3"]{--tier:#ffd54a;--tier2:#ff9f1a}   /* +13~+15 금색 */
.weaponwrap{position:relative;width:min(78vw,300px);margin:30px auto 8px}
.weaponbox{position:relative;width:100%;aspect-ratio:1;display:grid;place-items:center;overflow:hidden;border-radius:24px;
  background:radial-gradient(circle at 50% 50%,#10285c 0%,#07143a 85%);border:2px solid var(--tier);box-shadow:0 0 0 1px #0007,0 0 22px color-mix(in srgb,var(--tier) 45%,transparent),inset 0 0 28px #0008;transition:border-color .25s,box-shadow .25s}
.weaponbox img{width:100%;height:100%;object-fit:cover;position:relative;z-index:2;user-select:none;-webkit-user-drag:none}
.lvl{position:absolute;left:50%;top:-18px;transform:translateX(-50%);z-index:3;min-width:4.2em;text-align:center;background:#0d0f22;border:3px solid var(--tier);border-radius:999px;padding:2px 16px;font-weight:900;font-size:1.5rem;line-height:1.35;color:var(--tier);
  box-shadow:0 0 14px color-mix(in srgb,var(--tier) 55%,transparent);transition:color .25s,border-color .25s}
.stage[data-tier="3"] .lvl{background:linear-gradient(180deg,#2a2208,#0d0f22)}
.burst{position:absolute;inset:0;z-index:3;opacity:0;pointer-events:none}
.result{min-height:1.8em;line-height:1.8em;font-size:1.25rem;font-weight:800}
.result.success{color:var(--ok)} .result.keep{color:var(--mute)} .result.drop{color:var(--warn)} .result.destroy{color:var(--bad)}
.odds{color:var(--mute);font-size:.9rem;margin:2px 0 10px;min-height:2.9em;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:0 .4em}
.odds b{color:var(--ink)}
.bigbtn{width:100%;min-height:72px;font-size:1.7rem;font-weight:900;background:linear-gradient(180deg,#ffd54a,#ff9f1a);color:#2a1a00;box-shadow:0 6px 0 #b86a00,0 10px 20px #0006;border-radius:18px;letter-spacing:.1em;touch-action:manipulation}
.bigbtn:active:not(:disabled){transform:translateY(4px);box-shadow:0 2px 0 #b86a00}
.warn{margin-top:10px;background:#3a2a10;border:1px solid var(--warn);color:#ffd9a0;border-radius:12px;padding:8px 10px;font-size:.88rem}

/* 애니메이션 (CSS만) */
@keyframes pop{0%{transform:scale(1)}40%{transform:scale(1.18) rotate(-3deg)}100%{transform:scale(1)}}
@keyframes shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-10px) rotate(-3deg)}40%{transform:translateX(9px) rotate(3deg)}60%{transform:translateX(-6px)}80%{transform:translateX(4px)}}
@keyframes sink{0%{transform:translateY(0)}40%{transform:translateY(14px) scale(.94)}100%{transform:translateY(0)}}
@keyframes shatter{0%{transform:scale(1);filter:none;opacity:1}30%{transform:scale(1.15) rotate(6deg);filter:brightness(2.2) saturate(0)}100%{transform:scale(.2) rotate(40deg);filter:brightness(.4);opacity:0}}
@keyframes rebirth{0%{transform:scale(.3);opacity:0}100%{transform:scale(1);opacity:1}}
@keyframes flash{0%{opacity:.95;transform:scale(.6)}100%{opacity:0;transform:scale(1.15)}}
.weaponbox.success img{animation:pop .5s ease-out}
.weaponbox.success .burst{background:radial-gradient(circle,#ffffffcc,color-mix(in srgb,var(--tier) 60%,transparent) 45%,transparent 72%);animation:flash .6s ease-out}
.weaponbox.keep img{animation:shake .35s}
.weaponbox.drop img{animation:sink .5s}
.weaponbox.drop .burst{background:radial-gradient(circle,#ffb020aa,transparent 68%);animation:flash .5s ease-out}
.weaponbox.destroy img{animation:shatter .6s ease-in forwards}
.weaponbox.destroy .burst{background:radial-gradient(circle,#ff5d6cbb,transparent 68%);animation:flash .7s ease-out}
.weaponbox.rebirth img{animation:rebirth .4s ease-out}
.weaponbox.max img{animation:pop .8s ease-out 2}
@media (prefers-reduced-motion:reduce){.weaponbox img,.weaponbox .burst{animation:none!important} *{transition:none!important;scroll-behavior:auto!important}}

.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;text-align:center}
.stats div{background:var(--card2);border-radius:12px;padding:8px 4px}
.stats span{display:block;font-size:.72rem;color:var(--mute)}
.stats b{font-size:1.15rem}

.log{list-style:none;margin:0;padding:0;max-height:240px;overflow:auto;font-size:.88rem;font-variant-numeric:tabular-nums}
.log li{padding:4px 2px;border-bottom:1px solid #2c3068;display:flex;gap:8px}
.log .n{color:var(--mute);min-width:3.2em}
.log .success{color:var(--ok)} .log .drop{color:var(--warn)} .log .destroy{color:var(--bad)} .log .keep{color:var(--mute)}

.msg{min-height:1.2em;color:var(--ok);font-size:.88rem;margin-top:6px}
.cta{margin-top:10px;border:1px dashed #5a5fa8;border-radius:14px;padding:12px;background:#171a38}
.cta h3{margin:0 0 4px;font-size:1rem}
.cta p{margin:4px 0;color:var(--mute);font-size:.88rem}
.cta a.btn{display:inline-block;margin:6px 6px 0 0;padding:8px 12px;background:var(--acc);border-radius:10px;color:#fff;text-decoration:none;font-weight:700}
.cta .disc{font-size:.75rem;color:#8e93c5}

/* 표 */
.tablewrap{overflow-x:auto;margin:8px -4px}
table{border-collapse:collapse;width:100%;min-width:520px;font-size:.84rem;font-variant-numeric:tabular-nums}
th,td{padding:4px 4px;text-align:center;border-bottom:1px solid #2c3068;white-space:nowrap}
th{color:var(--mute);font-weight:600;position:sticky;top:0;background:var(--card)}
td input{width:5.4em;min-height:34px;padding:4px 6px;text-align:right}
td input.cost{width:5em}
tr.cur td{background:#2b2f66}
td.sum.bad{color:var(--bad);font-weight:800}
td.sum.ok{color:var(--ok)}
.tag{font-size:.7rem;padding:1px 6px;border-radius:999px;border:1px solid #4b4f86}
.tag.secondary{color:#7fd0ff;border-color:#7fd0ff} .tag.real{color:var(--ok);border-color:var(--ok)} .tag.unverified{color:var(--warn);border-color:var(--warn)} .tag.adapted{color:var(--mute)} .tag.custom{color:var(--gold);border-color:var(--gold)}

/* 시뮬 */
#simOut{margin-top:10px}
.bars{display:flex;align-items:flex-end;gap:3px;height:150px;margin:8px 0 2px}
.bars .col{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;min-width:0}
.bars .bar{width:100%;background:linear-gradient(180deg,var(--gold),#ff9f1a);border-radius:4px 4px 0 0;min-height:1px}
.bars .pct{font-size:.66rem;color:var(--mute);height:1.2em}
.axis{display:flex;gap:3px;font-size:.7rem;color:var(--mute);text-align:center}
.axis span{flex:1}
.simstats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:8px;font-size:.82rem;text-align:center}
.simstats div{background:var(--card2);border-radius:10px;padding:6px 2px}
.simstats b{display:block;font-size:1rem}

.foot{color:var(--mute);font-size:.8rem;padding:4px 6px}
.foot .mini{font-size:.72rem}
.foot a{color:#b7bcff}
[hidden]{display:none!important}

.note{background:#171a38;border:1px solid #3d4180;border-radius:12px;padding:8px 10px;margin:0 0 8px;font-size:.84rem;color:var(--mute)}
.note b{color:var(--ink)} .note p{margin:4px 0 0}
.legend ul{list-style:none;margin:6px 0;padding:0;font-size:.82rem;color:var(--mute)}
.legend li{margin:5px 0}
.sharepreview{display:block;margin:10px auto 0;max-width:100%;height:auto;border-radius:14px;border:1px solid #3d4180}

/* 포커스 (키보드) */
:focus-visible{outline:3px solid #ffd54a;outline-offset:2px}
button:focus-visible,summary:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #ffd54a;outline-offset:2px}

/* JS 없음 / 불러오기 실패 안내 */
.nojs{margin:12px;padding:12px 14px;border:1px solid var(--warn);background:#3a2a10;color:#ffe2b0;border-radius:12px;font-size:.92rem}
.nojs code{background:#0007;padding:1px 5px;border-radius:6px}

/* 첫 방문 힌트 */
.hint{margin-top:10px;display:flex;gap:10px;align-items:center;justify-content:space-between;text-align:left;background:#171a38;border:1px solid var(--tier);border-radius:12px;padding:8px 10px;font-size:.86rem;color:var(--ink)}
.hint button{flex:none}

/* 확률표 보기 */
.oddscard>summary{font-size:1.05rem;font-weight:700;color:var(--ink);margin:0;list-style:none;min-height:32px;display:flex;align-items:center;gap:8px}
.oddscard>summary::-webkit-details-marker{display:none}
.oddscard>summary::before{content:'▸';color:var(--gold);transition:transform .15s}
.oddscard[open]>summary::before{transform:rotate(90deg)}
.oddscard[open]>summary{margin-bottom:10px}
.outcomes{list-style:none;margin:0 0 10px;padding:0;font-size:.86rem;color:var(--mute)}
.outcomes li{padding:4px 0 4px 10px;border-left:4px solid #4b4f86;margin:4px 0}
.outcomes .success{border-color:var(--ok)} .outcomes .keep{border-color:var(--mute)} .outcomes .drop{border-color:var(--warn)} .outcomes .destroy{border-color:var(--bad)}
#oddsTable{min-width:0;font-size:.82rem}
#oddsTable td.lv{font-weight:700;color:var(--ink)}

/* 내 운 점수 */
.luckout{margin-top:8px;min-height:1.4em;color:var(--mute);font-size:.9rem}
.luckscore{font-size:2rem;font-weight:900;color:var(--gold);line-height:1.2}
.luckverdict{font-weight:800;color:var(--ink);margin-bottom:6px}
.luckout p{margin:4px 0}

.footlinks{margin:6px 0 0}
.foot p{margin:6px 0}

/* 내 기록 */
.records h2{font-size:.95rem;color:var(--mute);margin-bottom:8px}
.recgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;text-align:center}
.recgrid div{background:var(--card2);border-radius:12px;padding:8px 2px;min-width:0}
.recgrid span{display:block;font-size:.66rem;color:var(--mute);line-height:1.25;min-height:2.5em}
.recgrid b{font-size:1.05rem;font-variant-numeric:tabular-nums}

/* 도전 링크 배너 + 목표 표시 */
.challenge{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:10px 0 0;padding:10px 12px;border-radius:14px;
  background:linear-gradient(90deg,#3a1630,#2a1f4a);border:1px solid #ff5d6c;color:#ffe3e6;font-weight:700;font-size:.95rem}
.challenge button{flex:none}
.goal{min-height:2.6em;display:flex;align-items:center;justify-content:center;margin:2px 0 0;padding:4px 10px;border-radius:12px;
  background:#171a38;border:1px dashed var(--tier);color:var(--ink);font-size:.88rem;font-weight:700;line-height:1.3}
.goal.reached{border-style:solid;color:var(--ok);border-color:var(--ok)}
.goal.passed{border-style:solid;color:var(--gold);border-color:var(--gold)}

/* 공유 패널: 화면 한가운데(큰 화면) / 아래에서 올라오는 시트(작은 화면) 모달. position:fixed 라서 페이지를 어디까지 내렸든 지금 보이는 화면 안에 뜬다. */
@keyframes spslide{0%{transform:translateY(28px);opacity:0}100%{transform:translateY(0);opacity:1}}
@keyframes spfade{0%{opacity:0}100%{opacity:1}}
.spback{position:fixed;inset:0;z-index:49;background:rgba(5,7,20,.78);animation:spfade .2s ease-out}
.spanel{position:fixed;z-index:50;left:0;right:0;top:0;bottom:0;margin:auto;height:fit-content;
  width:min(540px,calc(100% - 16px));max-height:calc(100vh - 16px);max-height:calc(100dvh - 16px);overflow:auto;overscroll-behavior:contain;
  background:linear-gradient(180deg,#2a1d3f,#1c1f3d 60%);border:2px solid var(--bad);border-radius:20px;padding:14px 14px 12px;
  box-shadow:0 10px 50px #000c,0 0 30px #ff5d6c40;animation:spslide .25s ease-out}
@media (max-width:599px){
  .spanel{top:auto;bottom:0;width:100%;max-height:calc(100vh - 12px);max-height:calc(100dvh - 12px - env(safe-area-inset-top));
    border-radius:22px 22px 0 0;border-bottom-width:0;padding:14px 14px calc(12px + env(safe-area-inset-bottom))}
}
@media (max-height:700px){ .spcard{width:84px;height:105px} .spjoke{margin-bottom:6px} .spluck{margin-top:6px} }
.spanel:focus{outline:none}
.spclose{position:absolute;top:6px;right:6px;min-height:40px;min-width:40px;padding:0;background:#0006;border-radius:999px;font-size:1.05rem}
.sphead{margin:0 44px 4px 0;font-size:1.25rem;line-height:1.3;color:#ffd3d8;letter-spacing:-.01em}
.spjoke{margin:0 0 10px;color:var(--mute);font-size:.9rem}
.spbody{display:flex;gap:12px;align-items:center}
.spcard{flex:none;width:108px;height:135px;border-radius:10px;border:1px solid #4b4f86;box-shadow:0 4px 14px #0008}
.spstats{flex:1;display:grid;gap:6px;min-width:0}
.spstats div{display:flex;justify-content:space-between;align-items:baseline;gap:8px;background:#0003;border-radius:10px;padding:6px 10px}
.spstats span{font-size:.8rem;color:var(--mute)}
.spstats b{font-size:1.1rem;font-variant-numeric:tabular-nums;color:var(--ink)}
.spstats div:first-child b{color:var(--bad);font-size:1.3rem}
.spluck{margin:10px 0 0;font-size:.95rem;font-weight:800;color:var(--gold)}
.spluck small{display:block;color:var(--mute);font-weight:600;font-size:.8rem}
.spodds{margin:4px 0 10px;font-size:.78rem;color:var(--mute)}
.spshare{width:100%;min-height:58px;line-height:1.25;font-weight:900;font-size:1.05rem;background:var(--acc);border-radius:14px;box-shadow:0 4px 0 #4a3dc4}
.spimg{width:100%;min-height:52px;margin-top:8px;padding:6px 10px;border-radius:14px;font-weight:800;line-height:1.25}
.spimg small{color:var(--mute);opacity:1}
.sphint{word-break:keep-all;text-wrap:balance;margin:8px 0 0;font-size:.76rem;line-height:1.35;color:var(--mute);text-align:center}
.spshare:active:not(:disabled){transform:translateY(3px);box-shadow:0 1px 0 #4a3dc4}
.sprow{display:grid;grid-template-columns:1fr 1.3fr;gap:8px;margin-top:10px}
.sprow2{grid-template-columns:1fr 1fr}
.sprow1{grid-template-columns:1fr}
.sprow button{min-height:52px;border-radius:14px;font-weight:800}
.spretry{background:linear-gradient(180deg,#ffd54a,#ff9f1a);color:#2a1a00;font-size:1.1rem;font-weight:900;box-shadow:0 4px 0 #b86a00}
.spretry:active{transform:translateY(3px);box-shadow:0 1px 0 #b86a00}
.spanel.arming .spshare,.spanel.arming .spimg,.spanel.arming #spCopy,.spanel.arming #spLink,.spanel.arming #spRetry{pointer-events:none} /* 연타하던 손가락이 실수로 공유를 누르지 않게 잠깐 잠금 */
.spanel .msg{min-height:1.3em;margin-top:6px}
@media (prefers-reduced-motion:reduce){.spanel,.spback{animation:none!important}}

.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);max-width:min(92vw,420px);z-index:1000;background:#1a1d4a;color:#fff;border:1px solid var(--acc);border-radius:999px;padding:10px 18px;font-size:.92rem;font-weight:700;text-align:center;box-shadow:0 6px 20px #0008;pointer-events:none}
.toast[hidden]{display:none}
body.sheet-open .toast{bottom:auto;top:calc(12px + env(safe-area-inset-top,0px))}   /* 시트가 떠 있으면 버튼을 가리지 않게 위쪽에 */

/* 쿠팡 파트너스 광고 (receipt-card 와 같은 구성: 라벨 + 고지 문구가 위, 배너는 높이를 미리 확보해서 늦게 떠도 밀리지 않음) */
.ad-slot{position:relative;max-width:100%;margin:10px 0 0;overflow:hidden;contain:layout paint}
.ad-disclosure{display:flex;gap:8px;align-items:flex-start;margin:0 0 6px;min-height:calc(1.45em * 3);font-size:.75rem;line-height:1.45;color:var(--mute);word-break:keep-all}
.ad-label{flex:none;border:1px solid #4b4f86;border-radius:4px;padding:0 5px;font-size:.7rem;color:var(--mute)}
.ad-disclosure-label-only{min-height:0}
/* 위쪽 배너: 헤더 바로 아래(첫 화면), 아래로 여백을 둬서 강화 칸과 붙지 않게. 아래쪽 배너: 강화 칸 아래, 위로 여백 */
.ad-slot-top{margin:4px 0 12px}
.ad-slot-bottom{margin:14px 0 0}
.ad-box{width:100%;max-width:100%;overflow:hidden}
.ad-box.banner{height:var(--ad-h,140px);min-height:var(--ad-h,140px)}
.ad-box iframe{display:block;max-width:100%}
.ad-box ins{display:block!important;width:100%}
.ad-link{display:flex;align-items:center;justify-content:center;min-height:48px;padding:10px 14px;border-radius:12px;border:1px solid #4b4f86;background:#171a38;color:var(--ink);text-decoration:none;font-weight:700;text-align:center;word-break:keep-all}

/* 강화 긴장 연출: 결과를 보여 주기 전 ms(--charge-ms) 동안 무기가 점점 세게 빛나고 떨리고, 아래 진행 막대가 찬다 */
@keyframes chargeShake{0.0%{transform:translate(0.40px,-0.12px) rotate(0.00deg) scale(1.000);filter:drop-shadow(0 0 4px var(--tier)) brightness(1.00)}4.2%{transform:translate(-0.46px,0.14px) rotate(-0.03deg) scale(1.002);filter:drop-shadow(0 0 5px var(--tier)) brightness(1.02)}8.3%{transform:translate(0.57px,-0.17px) rotate(0.08deg) scale(1.004);filter:drop-shadow(0 0 5px var(--tier)) brightness(1.05)}12.5%{transform:translate(-0.71px,0.21px) rotate(-0.14deg) scale(1.006);filter:drop-shadow(0 0 6px var(--tier)) brightness(1.07)}16.7%{transform:translate(0.88px,-0.26px) rotate(0.22deg) scale(1.008);filter:drop-shadow(0 0 7px var(--tier)) brightness(1.09)}20.8%{transform:translate(-1.07px,0.32px) rotate(-0.30deg) scale(1.010);filter:drop-shadow(0 0 8px var(--tier)) brightness(1.11)}25.0%{transform:translate(1.27px,-0.38px) rotate(0.40deg) scale(1.012);filter:drop-shadow(0 0 10px var(--tier)) brightness(1.14)}29.2%{transform:translate(-1.50px,0.45px) rotate(-0.50deg) scale(1.015);filter:drop-shadow(0 0 11px var(--tier)) brightness(1.16)}33.3%{transform:translate(1.75px,-0.52px) rotate(0.62deg) scale(1.017);filter:drop-shadow(0 0 12px var(--tier)) brightness(1.18)}37.5%{transform:translate(-2.01px,0.60px) rotate(-0.73deg) scale(1.019);filter:drop-shadow(0 0 13px var(--tier)) brightness(1.21)}41.7%{transform:translate(2.28px,-0.68px) rotate(0.86deg) scale(1.021);filter:drop-shadow(0 0 15px var(--tier)) brightness(1.23)}45.8%{transform:translate(-2.57px,0.77px) rotate(-0.99deg) scale(1.023);filter:drop-shadow(0 0 16px var(--tier)) brightness(1.25)}50.0%{transform:translate(2.87px,-0.86px) rotate(1.13deg) scale(1.025);filter:drop-shadow(0 0 18px var(--tier)) brightness(1.27)}54.2%{transform:translate(-3.19px,0.96px) rotate(-1.28deg) scale(1.027);filter:drop-shadow(0 0 19px var(--tier)) brightness(1.30)}58.3%{transform:translate(3.52px,-1.06px) rotate(1.43deg) scale(1.029);filter:drop-shadow(0 0 21px var(--tier)) brightness(1.32)}62.5%{transform:translate(-3.86px,1.16px) rotate(-1.58deg) scale(1.031);filter:drop-shadow(0 0 22px var(--tier)) brightness(1.34)}66.7%{transform:translate(4.21px,-1.26px) rotate(1.74deg) scale(1.033);filter:drop-shadow(0 0 24px var(--tier)) brightness(1.37)}70.8%{transform:translate(-4.57px,1.37px) rotate(-1.91deg) scale(1.035);filter:drop-shadow(0 0 26px var(--tier)) brightness(1.39)}75.0%{transform:translate(4.95px,-1.48px) rotate(2.08deg) scale(1.038);filter:drop-shadow(0 0 27px var(--tier)) brightness(1.41)}79.2%{transform:translate(-5.33px,1.60px) rotate(-2.25deg) scale(1.040);filter:drop-shadow(0 0 29px var(--tier)) brightness(1.44)}83.3%{transform:translate(5.73px,-1.72px) rotate(2.43deg) scale(1.042);filter:drop-shadow(0 0 31px var(--tier)) brightness(1.46)}87.5%{transform:translate(-6.13px,1.84px) rotate(-2.62deg) scale(1.044);filter:drop-shadow(0 0 33px var(--tier)) brightness(1.48)}91.7%{transform:translate(6.54px,-1.96px) rotate(2.81deg) scale(1.046);filter:drop-shadow(0 0 34px var(--tier)) brightness(1.50)}95.8%{transform:translate(-6.97px,2.09px) rotate(-3.00deg) scale(1.048);filter:drop-shadow(0 0 36px var(--tier)) brightness(1.53)}100.0%{transform:translate(7.40px,-2.22px) rotate(3.20deg) scale(1.050);filter:drop-shadow(0 0 38px var(--tier)) brightness(1.55)}}
@keyframes chargeGlow{0%{opacity:.05;transform:scale(.55)}50%{opacity:.5}100%{opacity:.95;transform:scale(1.05)}}
@keyframes chargeFill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.weaponbox.charging img{animation:chargeShake var(--charge-ms,1000ms) ease-in forwards;will-change:transform}
.weaponbox.charging .burst{background:radial-gradient(circle,#ffffffd0,color-mix(in srgb,var(--tier) 65%,transparent) 40%,transparent 72%);animation:chargeGlow var(--charge-ms,1000ms) ease-in forwards}
.chargebar{position:absolute;left:14px;right:14px;bottom:12px;height:10px;border-radius:999px;background:#0008;border:1px solid #ffffff40;z-index:4;overflow:hidden}
.chargebar i{display:block;height:100%;transform-origin:left center;transform:scaleX(0);background:linear-gradient(90deg,var(--tier),#fff);border-radius:999px}
.weaponbox.charging .chargebar i{animation:chargeFill var(--charge-ms,1000ms) linear forwards}
.result.charging{color:#ffe08a;font-weight:800}
#enhanceBtn:disabled{opacity:1;filter:saturate(.55) brightness(.9);cursor:progress}
body.enh-hold main.wrap{pointer-events:none}
/* 움직임 줄이기: 떨림/빛 없음(위쪽 규칙이 img/burst 애니메이션을 끔). 진행 막대만 남기되 막대는 단계적으로 */
@media (prefers-reduced-motion:reduce){.weaponbox.charging img,.weaponbox.charging .burst{animation:none!important;filter:none}.weaponbox.charging .chargebar i{animation:chargeFill var(--charge-ms,300ms) linear forwards!important}}

/* 결과 오버레이: 무기 그림 위에 떴다가 사라진다(--ro-ms 동안). pointer-events:none 이라 탭을 막지 않고, 끝나면 JS 가 DOM 에서 지운다 */
.result-overlay{position:absolute;inset:0;z-index:6;display:grid;place-items:center;pointer-events:none;overflow:hidden;border-radius:inherit;animation:roFade var(--ro-ms,1200ms) ease-out forwards}
.ro-text{position:relative;font-weight:900;font-size:clamp(2.6rem,15vw,4.2rem);letter-spacing:-.02em;line-height:1;text-align:center;white-space:nowrap;paint-order:stroke fill;-webkit-text-stroke:4px #0009;animation:roPop var(--ro-ms,1200ms) cubic-bezier(.2,1.4,.4,1) forwards}
.ro-success{background:radial-gradient(circle at 50% 50%,#ffe9a066,#2fe38a22 55%,transparent 75%)}
.ro-success .ro-text{color:#7dffb3;text-shadow:0 0 18px #2fe38a,0 0 36px #ffd54a,0 3px 0 #0a5a30}
.ro-fail{background:radial-gradient(circle at 50% 50%,#9aa0b455,transparent 70%)}
.ro-fail .ro-text{color:#d6d9e6;font-size:clamp(2.2rem,12vw,3.4rem);text-shadow:0 0 12px #ff9a3c99,0 3px 0 #4a3a2a}
.ro-destroy{background:radial-gradient(circle at 50% 50%,#ff3b4ecc,#a1121f66 55%,transparent 80%);animation:roFade var(--ro-ms,1200ms) ease-out forwards,roFlash .35s ease-out}
.ro-destroy .ro-text{color:#ff6b78;text-shadow:0 0 18px #ff1f3a,0 0 34px #ff1f3a99,0 3px 0 #5a0610}
.ro-crack{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#fff;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 3px #ff1f3a);opacity:.9;animation:roCrack .5s ease-out both}
.ro-sp{position:absolute;left:50%;top:50%;width:10px;height:10px;margin:-5px 0 0 -5px;background:#fff6c4;clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);transform:rotate(var(--a)) translateY(0) scale(0);animation:roSpark calc(var(--ro-ms,1200ms) * .7) ease-out forwards}
@keyframes roFade{0%{opacity:0}12%{opacity:1}62%{opacity:1}100%{opacity:0}}
@keyframes roPop{0%{transform:scale(.3)}18%{transform:scale(1.22)}30%{transform:scale(.96)}42%,100%{transform:scale(1)}}
@keyframes roFlash{0%{filter:brightness(2.4)}100%{filter:none}}
@keyframes roCrack{0%{clip-path:inset(0 0 100% 0);opacity:0}30%{opacity:1}100%{clip-path:inset(0);opacity:.9}}
@keyframes roSpark{0%{transform:rotate(var(--a)) translateY(0) scale(0);opacity:1}25%{opacity:1}100%{transform:rotate(var(--a)) translateY(-120px) scale(1.3);opacity:0}}
@keyframes screenShake{0%,100%{transform:translate(0,0)}15%{transform:translate(-7px,3px) rotate(-.4deg)}30%{transform:translate(6px,-4px) rotate(.4deg)}45%{transform:translate(-5px,-2px)}60%{transform:translate(4px,3px)}80%{transform:translate(-2px,1px)}}
.stage.screen-shake{animation:screenShake .45s ease-out}
/* 움직임 줄이기: 단순 페이드(팝인/흔들림/반짝임/균열 모두 없음) */
.result-overlay.ro-calm{animation:roFadeCalm var(--ro-ms,800ms) ease-in-out forwards}
.result-overlay.ro-calm .ro-text{animation:none;transform:none}
.result-overlay.ro-calm .ro-crack{animation:none;clip-path:none}
@keyframes roFadeCalm{0%{opacity:0}25%{opacity:1}70%{opacity:1}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.stage.screen-shake{animation:none!important}.result-overlay .ro-text,.result-overlay .ro-crack{animation:none!important}}

/* 폭 380px 이상 폰: 고지 문구가 두 줄이면 충분(첫 화면에서 강화 버튼이 덜 밀림) */
@media (min-width:380px){
  .ad-slot .ad-disclosure{min-height:calc(1.45em * 2)}
  .ad-slot .ad-disclosure-label-only{min-height:0}
}
/* PC(폭 900px 이상): 위·아래 배너가 모두 보임. 위 배너 위/아래 16~20px, 아래 배너 위/아래 28px 안팎으로 균형 있게.
   위 배너가 들어가도 강화 버튼이 1280x800 첫 화면 안에 있도록 무기 그림을 조금 줄이고(300→250px) 고지 문구는 한 줄 높이만 확보한다(내용은 그대로). */
@media (min-width:900px){
  .ad-slot-top{margin:16px 0 20px}
  .ad-slot-bottom{margin:28px 0 28px}
  .ad-slot .ad-disclosure{min-height:1.45em;margin-bottom:6px}
  .weaponwrap{width:250px;margin:22px auto 6px}
}
