/* ===== 弹窗：升级 / 商店 / 结算 / 排行榜 / 设置 / 登录 / 诅咒 / 复活 ===== */

        /* 弹窗入场动画：display 切换时自动重放 */
        @keyframes popIn {
            from { opacity: 0; transform: translate(-50%, -50%) scale(0.92); }
            to { opacity: 1; transform: translate(-50%, -50%) scale(1); }
        }
        #level-up-ui,
        #shop-ui,
        #game-over {
            animation: popIn .22s ease-out;
        }
        #revive-box {
            animation: popInCentered .22s ease-out;
        }
        @keyframes popInCentered {
            from { opacity: 0; transform: scale(0.92); }
            to { opacity: 1; transform: scale(1); }
        }
        #level-up-ui {
            position: fixed;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            background:
                repeating-linear-gradient(0deg, rgba(255,255,255,0.018) 0 2px, transparent 2px 4px),
                linear-gradient(180deg, rgba(20, 24, 48, 0.97), rgba(8, 10, 26, 0.98));
            backdrop-filter: blur(16px);
            padding: 40px 50px;
            border-radius: 8px;
            text-align: center;
            pointer-events: auto !important;
            border: 3px solid rgba(255, 200, 100, 0.35);
            box-shadow: 0 8px 0 rgba(3, 4, 12, 0.9), 0 0 80px rgba(255, 200, 0, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.08);
            display: none;
            min-width: 400px;
            z-index: 9999;
        }
        #level-up-ui * {
            pointer-events: auto !important;
        }
        #level-up-ui h2 {
            color: #ffcc44;
            font-size: 32px;
            margin-bottom: 10px;
            text-shadow: 0 3px 0 rgba(80, 40, 0, 0.8), 0 0 30px rgba(255, 200, 0, 0.25);
        }
        #level-up-ui .sub {
            color: #aab2d0;
            font-size: 16px;
            margin-bottom: 20px;
        }
        .upgrade-btn {
            display: block;
            width: 100%;
            margin: 10px 0;
            padding: 16px 20px;
            border-radius: 6px;
            border: 2px solid rgba(150, 170, 230, 0.25);
            background: linear-gradient(180deg, rgba(48, 56, 92, 0.6), rgba(26, 30, 58, 0.7));
            color: #fff;
            font-size: 18px;
            cursor: pointer;
            transition: all .15s ease;
            pointer-events: auto !important;
            box-shadow: 0 4px 0 rgba(4, 6, 14, 0.85), inset 0 1px 0 rgba(255, 255, 255, 0.07);
        }
        .upgrade-btn:hover {
            transform: translateY(-2px);
            background: linear-gradient(180deg, rgba(64, 76, 120, 0.7), rgba(34, 40, 74, 0.8));
            border-color: rgba(255, 200, 100, 0.55);
            box-shadow: 0 6px 0 rgba(4, 6, 14, 0.85), 0 0 20px rgba(255, 200, 100, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.1);
        }
        .upgrade-btn .desc {
            font-size: 13px;
            color: #97a0c4;
            margin-top: 4px;
        }
        /* ===== 深度优化：武器进化金色选项 ===== */
        .upgrade-btn.evolution {
            background: linear-gradient(180deg, rgba(120, 84, 16, 0.55), rgba(60, 40, 10, 0.75));
            border: 3px solid rgba(255, 204, 51, 0.85);
            box-shadow: 0 4px 0 rgba(60, 36, 4, 0.9), 0 0 24px rgba(255, 190, 40, 0.35), inset 0 1px 0 rgba(255,255,255,0.25);
            animation: evolvePulse 1.4s ease-in-out infinite;
        }
        .upgrade-btn.evolution:hover {
            background: linear-gradient(180deg, rgba(150, 104, 22, 0.65), rgba(80, 52, 14, 0.8));
            box-shadow: 0 6px 0 rgba(60, 36, 4, 0.9), 0 0 40px rgba(255, 200, 60, 0.55), inset 0 1px 0 rgba(255,255,255,0.3);
        }
        .upgrade-btn.evolution .desc { color: #ffcc66; }
        @keyframes evolvePulse {
            0%, 100% { box-shadow: 0 0 18px rgba(255,190,40,0.30), inset 0 1px 0 rgba(255,255,255,0.25); }
            50% { box-shadow: 0 0 36px rgba(255,200,60,0.55), inset 0 1px 0 rgba(255,255,255,0.3); }
        }
        /* ===== 深度优化：成就 Toast ===== */
        #achvToast {
            position: fixed;
            top: 76px;
            left: 50%;
            transform: translate(-50%, -24px);
            padding: 12px 26px;
            border-radius: 14px;
            background: linear-gradient(160deg, rgba(30,24,8,0.92), rgba(50,38,10,0.92));
            border: 1px solid rgba(255, 204, 51, 0.55);
            box-shadow: 0 8px 30px rgba(0,0,0,0.5), 0 0 22px rgba(255,190,40,0.28);
            color: #ffe9b0;
            font-size: 15px;
            opacity: 0;
            pointer-events: none;
            transition: opacity .3s ease, transform .3s ease;
            z-index: 10000;
        }
        #achvToast.show {
            opacity: 1;
            transform: translate(-50%, 0);
        }
        #achvToast b { color: #ffcc44; }
        #achvToast .stars { color: #ffd257; letter-spacing: 2px; margin-left: 6px; }
        /* ===== 深度优化：结算评星面板 ===== */
        .achv-result {
            margin: 14px auto 4px;
            max-width: 340px;
            background: rgba(255, 255, 255, 0.04);
            border: 1px solid rgba(255, 204, 51, 0.28);
            border-radius: 12px;
            padding: 12px 18px;
            text-align: left;
        }
        .achv-result .achv-total {
            font-size: 16px;
            color: #ffcc44;
            text-align: center;
            margin-bottom: 8px;
            padding-bottom: 8px;
            border-bottom: 1px dashed rgba(255,204,51,0.3);
        }
        .achv-result .stars {
            color: #ffd257;
            letter-spacing: 2px;
            text-shadow: 0 0 8px rgba(255, 200, 60, 0.5);
        }
        .achv-result .stars.big { font-size: 22px; }
        .achv-result .achv-row {
            display: flex;
            justify-content: space-between;
            font-size: 13px;
            color: #ddd;
            padding: 3px 0;
        }
        .achv-result .achv-best {
            margin-top: 8px;
            font-size: 12px;
            color: #9fd48a;
            text-align: center;
        }
        #shop-ui {
            position: fixed;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            background: rgba(0, 0, 0, 0.92);
            backdrop-filter: blur(16px);
            padding: 30px 40px;
            border-radius: 20px;
            text-align: center;
            pointer-events: auto !important;
            border: 2px solid rgba(255, 215, 0, 0.3);
            box-shadow: 0 0 80px rgba(255, 215, 0, 0.15);
            display: none;
            min-width: 400px;
            z-index: 9999;
        }
        #shop-ui * {
            pointer-events: auto !important;
        }
        #shop-ui h2 {
            color: #ffdd44;
            font-size: 28px;
            margin-bottom: 5px;
        }
        #shop-ui .sub {
            color: #aaa;
            font-size: 14px;
            margin-bottom: 15px;
        }
        .shop-item {
            display: flex;
            justify-content: space-between;
            align-items: center;
            background: rgba(255, 255, 255, 0.05);
            border: 1px solid rgba(255, 255, 255, 0.1);
            border-radius: 10px;
            padding: 12px 16px;
            margin: 8px 0;
            color: #fff;
            transition: .2s;
        }
        .shop-item:hover {
            background: rgba(255, 255, 255, 0.1);
        }
        .shop-item .info {
            text-align: left;
        }
        /* 商店条目像素图标（Tiny Dungeon tile dataURL） */
        .shop-item .shop-ico {
            width: 44px;
            height: 44px;
            flex: none;
            border-radius: 10px;
            border: 1px solid rgba(120,160,255,0.38);
            background-color: rgba(24,30,58,0.9);
            background-size: 74%;
            background-repeat: no-repeat;
            background-position: center;
            background-clip: padding-box;
            image-rendering: pixelated;
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.12), 0 2px 6px rgba(0,0,0,0.4);
        }
        .shop-item .info .name {
            font-weight: bold;
            font-size: 16px;
        }
        .shop-item .info .desc {
            font-size: 12px;
            color: #aaa;
        }
        .shop-item .price {
            color: #ffdd44;
            font-weight: bold;
            margin: 0 12px;
        }
        .shop-item .buy-btn {
            /* Kenney UI Pack（CC0）红色按钮贴图 */
            background: url('../assets/ui/btn_red.png') center / 100% 100% no-repeat;
            border: none;
            padding: 6px 18px;
            border-radius: 10px;
            color: #fff;
            font-weight: bold;
            cursor: pointer;
            transition: .2s;
            font-size: 14px;
            text-shadow: 0 1px 0 rgba(90, 20, 8, 0.7);
        }
        .shop-item .buy-btn:hover {
            transform: scale(1.05);
        }
        .shop-item .buy-btn:disabled {
            opacity: 0.4;
            cursor: not-allowed;
            transform: none;
        }
        .shop-close-btn {
            background: rgba(255, 255, 255, 0.1);
            border: 1px solid rgba(255, 255, 255, 0.2);
            padding: 8px 30px;
            border-radius: 8px;
            color: #fff;
            font-size: 16px;
            cursor: pointer;
            margin-top: 15px;
            transition: .2s;
            pointer-events: auto !important;
        }
        .shop-close-btn:hover {
            background: rgba(255, 255, 255, 0.2);
        }
        .shop-equip-slots {
            color: #88ffaa;
            font-size: 13px;
            margin-top: 5px;
            margin-bottom: 10px;
        }
        #game-over {
            position: fixed;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            background: rgba(0, 0, 0, 0.85);
            backdrop-filter: blur(12px);
            padding: 50px 60px;
            border-radius: 20px;
            text-align: center;
            pointer-events: auto !important;
            border: 1px solid rgba(255, 255, 255, 0.1);
            box-shadow: 0 0 80px rgba(255, 0, 0, 0.2);
            display: none;
            min-width: 320px;
            z-index: 9998;
        }
        #game-over h1 {
            color: #ff2244;
            font-size: 48px;
            margin-bottom: 10px;
            text-shadow: 0 0 30px rgba(255, 0, 50, 0.5);
        }
        #game-over .final-score {
            color: #ffcc44;
            font-size: 28px;
            margin: 15px 0;
        }
        #game-over .final-wave {
            color: #88ccff;
            font-size: 18px;
            margin-bottom: 20px;
        }
        #game-over .stats {
            color: #aaa;
            font-size: 14px;
            margin: 8px 0;
        }
        #restart-btn {
            pointer-events: auto !important;
            background: linear-gradient(135deg, #ff2244, #cc0033);
            border: none;
            color: #fff;
            font-size: 20px;
            font-weight: bold;
            padding: 14px 48px;
            border-radius: 50px;
            cursor: pointer;
            margin-top: 20px;
            transition: all .25s ease;
            box-shadow: 0 4px 25px rgba(255, 0, 50, 0.3);
        }
        #restart-btn:hover {
            transform: scale(1.06);
            box-shadow: 0 6px 35px rgba(255, 0, 50, 0.5);
        }
        #restart-btn:active {
            transform: scale(0.95);
        }
        #leaderboard-overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.7);
            backdrop-filter: blur(6px);
            z-index: 9997;
            display: none;
            justify-content: center;
            align-items: center;
            pointer-events: auto !important;
        }
        #leaderboard-box {
            background: rgba(20, 20, 40, 0.95);
            padding: 30px 40px;
            border-radius: 16px;
            border: 1px solid rgba(255, 255, 255, 0.1);
            box-shadow: 0 0 60px rgba(0, 0, 0, 0.8);
            min-width: 400px;
            max-width: 90%;
            max-height: 80vh;
            overflow-y: auto;
            text-align: center;
            pointer-events: auto !important;
        }
        #leaderboard-box h3 {
            color: #ffcc44;
            font-size: 28px;
            margin-bottom: 15px;
        }
        #leaderboard-box table {
            width: 100%;
            border-collapse: collapse;
            color: #ddd;
            font-size: 14px;
        }
        #leaderboard-box th {
            color: #88ddff;
            padding: 8px 4px;
            border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        }
        #leaderboard-box td {
            padding: 6px 4px;
            border-bottom: 1px solid rgba(255, 255, 255, 0.05);
        }
        #leaderboard-box .rank {
            color: #ffcc44;
            font-weight: bold;
        }
        #leaderboard-box .btn-close {
            /* Kenney UI Pack（CC0）灰色按钮贴图 */
            background: url('../assets/ui/btn_grey.png') center / 100% 100% no-repeat;
            border: none;
            padding: 8px 24px;
            border-radius: 10px;
            color: #fff;
            font-size: 16px;
            cursor: pointer;
            margin-top: 15px;
            transition: .2s;
            pointer-events: auto !important;
            text-shadow: 0 1px 0 rgba(20, 20, 30, 0.6);
        }
        #leaderboard-box .btn-close:hover {
            filter: brightness(1.15);
        }
        #leaderboard-box .no-data {
            color: #888;
            padding: 20px 0;
        }
        #settings-overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.6);
            backdrop-filter: blur(6px);
            z-index: 9996;
            display: none;
            justify-content: center;
            align-items: center;
            pointer-events: auto !important;
        }
        #settings-box {
            background: rgba(20, 20, 40, 0.95);
            padding: 30px 40px;
            border-radius: 16px;
            border: 1px solid rgba(255, 255, 255, 0.1);
            box-shadow: 0 0 60px rgba(0, 0, 0, 0.8);
            min-width: 300px;
            text-align: center;
            pointer-events: auto !important;
        }
        #settings-box h3 {
            color: #ffcc44;
            font-size: 24px;
            margin-bottom: 15px;
        }
        #settings-box label {
            color: #aaa;
            font-size: 14px;
            display: block;
            margin-bottom: 5px;
        }
        #settings-box input {
            background: rgba(255, 255, 255, 0.08);
            border: 1px solid rgba(255, 255, 255, 0.2);
            border-radius: 6px;
            padding: 8px 12px;
            color: #fff;
            font-size: 16px;
            width: 100%;
            text-align: center;
            outline: none;
            margin-bottom: 12px;
            pointer-events: auto !important;
        }
        #settings-box input:focus {
            border-color: #ffcc44;
        }
        #settings-box .btn {
            /* Kenney UI Pack（CC0）蓝色按钮贴图 */
            background: url('../assets/ui/btn_blue.png') center / 100% 100% no-repeat;
            border: none;
            padding: 8px 20px;
            border-radius: 10px;
            color: #fff;
            font-size: 14px;
            cursor: pointer;
            margin: 4px;
            font-weight: bold;
            transition: .2s;
            pointer-events: auto !important;
            text-shadow: 0 1px 0 rgba(10, 30, 70, 0.6);
        }
        #settings-box .btn:hover {
            transform: scale(1.05);
            filter: brightness(1.1);
        }
        #settings-box .btn-close {
            background: url('../assets/ui/btn_grey.png') center / 100% 100% no-repeat;
        }
        #settings-box .btn-close:hover {
            background: url('../assets/ui/btn_grey.png') center / 100% 100% no-repeat;
            filter: brightness(1.15);
        }
        #settings-box .wave-control {
            display: flex;
            gap: 10px;
            align-items: center;
            justify-content: center;
            margin-top: 10px;
        }
        #settings-box .wave-control input {
            width: 80px;
            margin: 0;
        }
        #settings-box .debug-hint {
            color: #888;
            font-size: 12px;
            margin-top: 8px;
        }
        #login-overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.85);
            backdrop-filter: blur(10px);
            z-index: 200;
            display: flex;
            justify-content: center;
            align-items: center;
            pointer-events: auto;
            transition: opacity .5s ease;
        }
        #login-overlay.hidden {
            display: none;
        }
        #login-box {
            background: rgba(20, 20, 40, 0.95);
            padding: 40px 50px;
            border-radius: 20px;
            border: 1px solid rgba(255, 255, 255, 0.1);
            box-shadow: 0 0 60px rgba(0, 0, 0, 0.8);
            min-width: 340px;
            max-width: 90%;
            text-align: center;
            pointer-events: auto;
        }
        /* 吉祥物立绘：探出面板顶部的悬浮效果 */
        #login-box .login-mascot {
            display: block;
            width: 78px;
            height: 104px;
            object-fit: contain;
            margin: -78px auto 4px;
            filter: drop-shadow(0 5px 0 rgba(4, 6, 16, 0.5)) drop-shadow(0 0 18px rgba(255, 200, 68, 0.35));
            animation: mascotFloat 3.2s ease-in-out infinite;
        }
        @keyframes mascotFloat {
            0%, 100% { transform: translateY(0); }
            50% { transform: translateY(-6px); }
        }
        #login-box h2 {
            color: #ffcc44;
            font-size: 30px;
            margin-bottom: 6px;
            text-shadow: 0 3px 0 rgba(70, 40, 0, 0.8), 0 0 24px rgba(255, 200, 0, 0.25);
        }
        #login-box .sub {
            color: #aab2d0;
            font-size: 15px;
            margin-bottom: 22px;
        }
        #login-box .field {
            margin-bottom: 15px;
            text-align: left;
        }
        #login-box label {
            color: #aaa;
            font-size: 14px;
            display: block;
            margin-bottom: 4px;
        }
        #login-box input {
            background: rgba(255, 255, 255, 0.08);
            border: 1px solid rgba(255, 255, 255, 0.2);
            border-radius: 8px;
            padding: 10px 14px;
            color: #fff;
            font-size: 16px;
            width: 100%;
            outline: none;
            transition: border .2s;
        }
        #login-box input:focus {
            border-color: #ffcc44;
        }
        #login-box .btn-login {
            /* Kenney UI Pack（CC0）红色按钮贴图 */
            background: url('../assets/ui/btn_red.png') center / 100% 100% no-repeat;
            border: none;
            padding: 12px 30px;
            border-radius: 12px;
            color: #fff;
            font-size: 18px;
            font-weight: bold;
            cursor: pointer;
            margin-top: 10px;
            width: 100%;
            transition: .2s;
            text-shadow: 0 2px 0 rgba(90, 20, 8, 0.7);
        }
        #login-box .btn-login:hover {
            transform: scale(1.02);
            filter: brightness(1.08);
        }
        #login-box .error {
            color: #ff6644;
            font-size: 14px;
            margin-top: 8px;
            min-height: 22px;
        }
        #curse-overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(15, 0, 25, 0.88);
            backdrop-filter: blur(10px);
            z-index: 10000;
            display: none;
            justify-content: center;
            align-items: center;
            pointer-events: auto;
        }
        #curse-box {
            background: rgba(35, 12, 55, 0.97);
            padding: 40px 50px;
            border-radius: 20px;
            border: 2px solid rgba(170, 80, 255, 0.45);
            box-shadow: 0 0 90px rgba(140, 50, 255, 0.3);
            text-align: center;
            min-width: 420px;
            max-width: 90%;
            pointer-events: auto;
            animation: curseFloat 3s ease-in-out infinite;
        }
        @keyframes curseFloat {
            0%,
            100% { box-shadow: 0 0 60px rgba(140,50,255,0.2), inset 0 0 20px rgba(140,50,255,0.05); }
            50% { box-shadow: 0 0 100px rgba(170,80,255,0.4), inset 0 0 35px rgba(140,50,255,0.12); }
        }
        #curse-box h2 {
            color: #cc88ff;
            font-size: 32px;
            margin-bottom: 6px;
            text-shadow: 0 0 30px rgba(170, 80, 255, 0.4);
        }
        #curse-box .sub {
            color: #9988bb;
            font-size: 14px;
            margin-bottom: 22px;
        }
        .curse-card,
        .bless-card {
            border-radius: 12px;
            padding: 14px 20px;
            margin: 10px 0;
            font-size: 17px;
        }
        .curse-card { background: rgba(255, 40, 70, 0.10); border: 2px solid rgba(255, 70, 100, 0.45); color: #ff8899; }
        .bless-card { background: rgba(60, 255, 140, 0.08); border: 2px solid rgba(80, 255, 150, 0.4); color: #88ffbb; }
        .curse-card .tag,
        .bless-card .tag {
            font-size: 12px;
            opacity: 0.75;
            display: block;
            margin-bottom: 4px;
            letter-spacing: 2px;
        }
        #curse-box .btn-group { display: flex; gap: 18px; justify-content: center; margin-top: 22px; }
        #curseAccept {
            /* Kenney UI Pack（CC0）蓝色按钮贴图（配合紫色辉光） */
            background: url('../assets/ui/btn_blue.png') center / 100% 100% no-repeat;
            border: none;
            padding: 12px 34px;
            border-radius: 12px;
            color: #fff;
            font-size: 18px;
            font-weight: bold;
            cursor: pointer;
            transition: .2s;
            box-shadow: 0 0 25px rgba(170, 80, 255, 0.35);
            pointer-events: auto;
            text-shadow: 0 1px 0 rgba(10, 30, 70, 0.6);
        }
        #curseAccept:hover { transform: scale(1.05); box-shadow: 0 0 40px rgba(190, 110, 255, 0.55); filter: brightness(1.1); }
        #curseRefuse {
            /* Kenney UI Pack（CC0）灰色按钮贴图 */
            background: url('../assets/ui/btn_grey.png') center / 100% 100% no-repeat;
            border: none;
            padding: 12px 34px;
            border-radius: 12px;
            color: #eee;
            font-size: 18px;
            cursor: pointer;
            transition: .2s;
            pointer-events: auto;
            text-shadow: 0 1px 0 rgba(20, 20, 30, 0.6);
        }
        #curseRefuse:hover { filter: brightness(1.15); color: #fff; }
        #revive-overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.8);
            backdrop-filter: blur(8px);
            z-index: 10000;
            display: none;
            justify-content: center;
            align-items: center;
            pointer-events: auto;
        }
        #revive-box {
            background: rgba(20, 20, 40, 0.95);
            padding: 40px 50px;
            border-radius: 20px;
            border: 2px solid rgba(255, 215, 0, 0.3);
            box-shadow: 0 0 60px rgba(255, 215, 0, 0.15);
            text-align: center;
            min-width: 340px;
            max-width: 90%;
            pointer-events: auto;
        }
        #revive-box h2 {
            color: #ffdd44;
            font-size: 32px;
            margin-bottom: 10px;
        }
        #revive-box p {
            color: #aaa;
            font-size: 18px;
            margin-bottom: 15px;
        }
        #revive-box .cost-info {
            color: #ffdd44;
            font-size: 20px;
            margin-bottom: 20px;
        }
        #revive-box .btn-group {
            display: flex;
            gap: 20px;
            justify-content: center;
        }
        #revive-box .btn-revive {
            /* Kenney UI Pack（CC0）绿色按钮贴图 */
            background: url('../assets/ui/btn_green.png') center / 100% 100% no-repeat;
            border: none;
            padding: 12px 36px;
            border-radius: 12px;
            color: #fff;
            font-size: 20px;
            font-weight: bold;
            cursor: pointer;
            transition: .2s;
            text-shadow: 0 2px 0 rgba(8, 60, 30, 0.7);
        }
        #revive-box .btn-revive:hover:not(:disabled) {
            transform: scale(1.05);
            filter: brightness(1.08);
        }
        #revive-box .btn-revive:disabled {
            opacity: 0.4;
            cursor: not-allowed;
        }
        #revive-box .btn-die {
            /* Kenney UI Pack（CC0）红色按钮贴图 */
            background: url('../assets/ui/btn_red.png') center / 100% 100% no-repeat;
            border: none;
            padding: 12px 36px;
            border-radius: 12px;
            color: #fff;
            font-size: 20px;
            font-weight: bold;
            cursor: pointer;
            transition: .2s;
            text-shadow: 0 2px 0 rgba(90, 20, 8, 0.7);
        }
        #revive-box .btn-die:hover {
            transform: scale(1.05);
            filter: brightness(1.08);
        }

        /* ===== Kenney UI Pack（CC0）9-slice 立体边框：弹窗统一贴图化 ===== */
        #login-box, #settings-box, #leaderboard-box, #revive-box, #curse-box,
        #level-up-ui, #shop-ui, #game-over {
            border: 14px solid transparent;
            border-image: url('../assets/ui/panel_blue.png') 14 stretch;
            border-radius: 0;
            box-shadow: 0 0 60px rgba(0, 0, 0, 0.55), 0 20px 50px rgba(0, 0, 0, 0.45);
        }

        /* ===== 玩法扩展：升级三选一 · 品质卡牌界面 ===== */
        #level-up-ui {
            max-width: 720px;
        }
        #level-up-ui .lu-head {
            text-align: center;
            margin-bottom: 18px;
        }
        #upgrade-options {
            display: flex;
            gap: 14px;
            justify-content: center;
            flex-wrap: wrap;
        }
        /* 三选一竖卡 */
        .up-card {
            position: relative;
            width: 196px;
            min-height: 250px;
            display: flex;
            flex-direction: column;
            align-items: center;
            padding: 34px 14px 40px;
            border-radius: 12px;
            border: 2px solid rgba(150,170,230,0.30);
            background:
                repeating-linear-gradient(0deg, rgba(255,255,255,0.02) 0 2px, transparent 2px 4px),
                linear-gradient(180deg, rgba(38,46,82,0.85), rgba(16,20,44,0.92));
            color: #dfe6ff;
            cursor: pointer;
            transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, filter .16s ease;
            animation: cardPop .34s cubic-bezier(.22,1.4,.36,1) backwards;
            overflow: hidden;
        }
        @keyframes cardPop {
            from { opacity: 0; transform: translateY(26px) scale(0.9); }
            to { opacity: 1; transform: translateY(0) scale(1); }
        }
        .up-card:hover {
            transform: translateY(-7px) scale(1.03);
            filter: brightness(1.12);
        }
        .up-card .up-badge {
            position: absolute;
            top: 8px;
            left: 50%;
            transform: translateX(-50%);
            font-size: 11px;
            letter-spacing: 2px;
            padding: 2px 10px;
            border-radius: 999px;
            background: rgba(255,255,255,0.08);
            border: 1px solid rgba(255,255,255,0.16);
            color: #b9c3e8;
            white-space: nowrap;
        }
        .up-card .up-ico {
            width: 64px;
            height: 64px;
            margin: 16px 0 12px;
            border-radius: 14px;
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center;
            background-color: rgba(8,12,28,0.55);
            border: 1px solid rgba(255,255,255,0.10);
        }
        .up-card .up-ico.up-emoji {
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 36px;
            line-height: 1;
        }
        .up-card .up-label {
            font-size: 17px;
            font-weight: 800;
            text-align: center;
            line-height: 1.25;
            text-shadow: 0 2px 0 rgba(6,8,18,0.75);
        }
        .up-card .up-desc {
            margin-top: 7px;
            font-size: 12.5px;
            color: #9aa5cc;
            text-align: center;
            line-height: 1.35;
        }
        .up-card .up-key {
            position: absolute;
            bottom: 9px;
            right: 10px;
            font-size: 12px;
            font-weight: 800;
            color: #cdd6f4;
            padding: 1px 8px;
            border-radius: 6px;
            border: 1px solid rgba(200,215,255,0.28);
            background: rgba(10,14,30,0.6);
        }
        /* —— 品质配色：普通(银灰) / 稀有(青蓝) / 史诗(金) / 进化(金红脉冲) —— */
        .up-card.rarity-common { border-color: rgba(178,190,220,0.42); }
        .up-card.rarity-common:hover { box-shadow: 0 10px 26px rgba(178,190,220,0.16); border-color: rgba(210,220,245,0.65); }
        .up-card.rarity-rare {
            border-color: rgba(80,190,255,0.60);
            box-shadow: 0 0 18px rgba(80,180,255,0.14), inset 0 0 22px rgba(80,180,255,0.05);
        }
        .up-card.rarity-rare .up-badge { color: #8fd8ff; border-color: rgba(120,200,255,0.45); background: rgba(60,140,220,0.14); }
        .up-card.rarity-rare:hover { box-shadow: 0 12px 30px rgba(80,180,255,0.24); border-color: rgba(130,210,255,0.85); }
        .up-card.rarity-epic {
            border-color: rgba(255,205,60,0.65);
            box-shadow: 0 0 22px rgba(255,200,40,0.18), inset 0 0 26px rgba(255,200,40,0.06);
            animation: cardPop .34s cubic-bezier(.22,1.4,.36,1) backwards, epicGlow 1.6s ease-in-out infinite;
        }
        .up-card.rarity-epic .up-badge { color: #ffdd66; border-color: rgba(255,210,70,0.55); background: rgba(150,110,10,0.18); }
        .up-card.rarity-epic .up-label { color: #ffe9a8; }
        .up-card.rarity-epic:hover { box-shadow: 0 14px 36px rgba(255,200,40,0.30); border-color: rgba(255,225,110,0.9); }
        @keyframes epicGlow {
            0%, 100% { box-shadow: 0 0 16px rgba(255,200,40,0.14), inset 0 0 22px rgba(255,200,40,0.05); }
            50% { box-shadow: 0 0 30px rgba(255,205,50,0.30), inset 0 0 30px rgba(255,200,40,0.10); }
        }
        .up-card.rarity-evolution {
            border-color: rgba(255,204,51,0.85);
            animation: cardPop .34s cubic-bezier(.22,1.4,.36,1) backwards, evolvePulse 1.4s ease-in-out infinite;
        }
