:root{--bg:#080c16;--bg2:#0d1220;--card:rgba(14,19,36,.85);--border:rgba(108,140,255,.08);--text:#e2e8f0;--muted:#6b7a99;--accent:#6c8cff;--accent2:#a78bfa;--danger:#ef4444;--success:#22c55e;--warn:#f59e0b;--gold:#fbbf24;--sidebar-w:240px;--glow:0 0 20px rgba(108,140,255,.06)}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Inter',sans-serif;background:var(--bg);color:var(--text);min-height:100vh;overflow-x:hidden;background-image:radial-gradient(ellipse at 20% 0%,rgba(108,140,255,.04) 0%,transparent 50%),radial-gradient(ellipse at 80% 100%,rgba(167,139,250,.03) 0%,transparent 50%)}
.screen{display:none;min-height:100vh}.screen.active{display:flex}
.hidden{display:none!important}

/* ===== AUTH ===== */
#auth-screen{align-items:center;justify-content:center;background:radial-gradient(ellipse at 30% 20%,rgba(108,140,255,.06) 0%,var(--bg) 60%),radial-gradient(ellipse at 70% 80%,rgba(167,139,250,.04) 0%,var(--bg) 60%)}
.auth-container{width:100%;max-width:440px;padding:20px}
.auth-logo{text-align:center;margin-bottom:32px}
.auth-logo h1{font-size:42px;font-weight:900;background:linear-gradient(135deg,#00d4ff,var(--accent2),#ff3e9d);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:4px;filter:drop-shadow(0 0 20px rgba(108,140,255,.15))}
.auth-sub{color:var(--muted);font-size:15px}
.auth-card{background:linear-gradient(145deg,rgba(14,19,36,.95),rgba(10,14,26,.98));border:1px solid rgba(108,140,255,.1);border-radius:20px;padding:36px 32px;box-shadow:0 16px 48px rgba(0,0,0,.5),var(--glow);backdrop-filter:blur(12px)}
.auth-card h2{font-size:22px;font-weight:800;margin-bottom:20px;text-align:center}
.auth-card input{display:block;width:100%;padding:14px 16px;margin-bottom:12px;background:rgba(255,255,255,.03);border:1px solid rgba(108,140,255,.1);border-radius:12px;color:var(--text);font-size:14px;outline:none;transition:.3s}
.auth-card input:focus{border-color:var(--accent);box-shadow:0 0 16px rgba(108,140,255,.12)}
.auth-card button{width:100%;padding:14px;background:linear-gradient(135deg,var(--accent),var(--accent2));border:none;border-radius:12px;color:#fff;font-size:15px;font-weight:700;cursor:pointer;margin-top:4px;transition:.3s;box-shadow:0 4px 16px rgba(108,140,255,.2)}
.auth-card button:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(108,140,255,.3)}
.auth-error{color:var(--danger);font-size:12px;margin-top:8px;text-align:center;min-height:16px}
.auth-switch{text-align:center;font-size:13px;color:var(--muted);margin-top:16px}
.auth-switch a{color:var(--accent);text-decoration:none;font-weight:600}
.auth-switch a:hover{text-decoration:underline}

/* Starter picker */
.starter-pick{margin:16px 0 8px}
.starter-label{font-size:13px;font-weight:600;margin-bottom:10px;color:var(--muted)}
.starter-grid{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.starter-opt{width:72px;height:72px;border-radius:14px;border:2px solid var(--border);background:var(--bg);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.2s;position:relative}
.starter-opt:hover{border-color:var(--accent);transform:translateY(-2px)}
.starter-opt.selected{border-color:var(--accent);background:rgba(108,140,255,.1);box-shadow:0 0 12px rgba(108,140,255,.2)}
.starter-opt img{width:48px;height:48px;image-rendering:auto;object-fit:contain}
.starter-opt .starter-name{position:absolute;bottom:-16px;font-size:9px;color:var(--muted);white-space:nowrap}

/* ===== DASHBOARD LAYOUT ===== */
#dash-screen{min-height:100vh}#dash-screen.active{display:flex}

/* Sidebar */
.sidebar{width:var(--sidebar-w);background:#000;border-right:1px solid rgba(255,255,255,.04);display:flex;flex-direction:column;padding:0;position:fixed;top:0;left:0;bottom:0;z-index:10}
.sidebar-header{padding:24px 20px 16px;border-bottom:1px solid rgba(255,255,255,.06);display:flex;align-items:center;gap:12px}
.user-avatar{width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,#fff,#888);display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0;box-shadow:0 0 20px rgba(255,255,255,.08)}
.user-info{overflow:hidden}
.user-name{font-size:14px;font-weight:700;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff}
.user-diamonds{font-size:12px;color:var(--gold);font-weight:600}
.sidebar-tabs{flex:1;padding:12px 8px;display:flex;flex-direction:column;gap:1px;overflow-y:auto}
.tab-btn{display:flex;align-items:center;gap:10px;padding:11px 14px;border:none;border-radius:0;background:transparent;color:rgba(255,255,255,.55);font-size:11px;font-weight:600;letter-spacing:1.2px;text-transform:uppercase;cursor:pointer;transition:all .2s;text-align:left;width:100%;position:relative;border-left:2px solid transparent}
.tab-btn::before{display:none}
.tab-btn:hover{color:rgba(255,255,255,.85);background:rgba(255,255,255,.04)}
.tab-btn.active{color:#fff;background:rgba(255,255,255,.06);border-left-color:#fff;font-weight:700}
.tab-btn.horde-tab{border-left:2px solid transparent;margin-top:6px;background:transparent;border-radius:0;border-top:1px solid rgba(255,0,0,.08)}
.tab-btn.horde-tab:hover{color:#ff4444;background:rgba(255,0,0,.04);border-left-color:rgba(255,0,0,.4)}
.tab-btn.horde-tab.active{color:#ff2222;background:linear-gradient(90deg,rgba(255,0,0,.1),transparent);border-left-color:#ff2222;text-shadow:0 0 12px rgba(255,0,0,.5);box-shadow:inset 0 0 30px rgba(255,0,0,.03)}
.logout-btn{margin:12px;padding:10px;border:1px solid rgba(255,255,255,.08);border-radius:8px;background:transparent;color:rgba(255,255,255,.4);font-size:11px;font-weight:600;cursor:pointer;transition:.2s;letter-spacing:.5px;text-transform:uppercase}
.logout-btn:hover{background:rgba(255,0,0,.06);color:#ff4444;border-color:rgba(255,0,0,.15)}

/* Main content */
.main-content{flex:1;margin-left:var(--sidebar-w);padding:28px 32px;overflow-y:auto;min-height:100vh}
.tab-panel{display:none}.tab-panel.active{display:block}
.tab-title{font-size:26px;font-weight:900;margin-bottom:24px;background:linear-gradient(135deg,var(--text),var(--accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.section-title{font-size:16px;font-weight:700;margin:24px 0 12px;color:var(--text)}
.muted-text{color:var(--muted);font-size:14px}

/* Overview stats */
.overview-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:14px;margin-bottom:24px}
.stat-card{background:linear-gradient(145deg,rgba(14,19,36,.9),rgba(10,14,26,.95));border:1px solid rgba(108,140,255,.08);border-radius:16px;padding:20px;text-align:center;transition:.3s;position:relative;overflow:hidden}
.stat-card::after{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(108,140,255,.2),transparent);opacity:0;transition:.3s}
.stat-card:hover{border-color:rgba(108,140,255,.2);transform:translateY(-3px);box-shadow:0 8px 24px rgba(108,140,255,.08)}
.stat-card:hover::after{opacity:1}
.stat-icon{font-size:28px;margin-bottom:8px}
.stat-value{font-size:24px;font-weight:800;color:var(--text)}
.stat-label{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-top:4px}

/* Party header */
.party-header{display:flex;align-items:center;justify-content:space-between;margin:24px 0 14px;flex-wrap:wrap;gap:10px}
.party-header-right{display:flex;align-items:center;gap:10px}
.party-power{font-size:15px;font-weight:900;letter-spacing:1px;padding:7px 18px;border-radius:12px;background:linear-gradient(135deg,rgba(108,140,255,.08),rgba(167,139,250,.08));border:1px solid rgba(108,140,255,.15);color:#fff;position:relative;overflow:hidden}
.party-power::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(108,140,255,.06),transparent);animation:powerShimmer 3s ease-in-out infinite}
@keyframes powerShimmer{0%,100%{transform:translateX(-100%)}50%{transform:translateX(100%)}}
.auto-equip-btn{padding:7px 16px;border-radius:10px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04);color:rgba(255,255,255,.7);font-size:11px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;cursor:pointer;transition:all .25s}
.auto-equip-btn:hover{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.2);transform:translateY(-1px);box-shadow:0 4px 16px rgba(255,255,255,.06)}
.auto-equip-btn:disabled{opacity:.4;cursor:not-allowed}
/* Party row */
.party-row{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;max-width:660px}
/* Circular party slots */
.party-slot{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 6px;cursor:pointer;transition:all .25s;border-radius:16px}
.party-slot:hover{transform:translateY(-3px)}
.party-slot-filled{background:linear-gradient(145deg,rgba(14,19,36,.9),rgba(10,14,26,.95));border:2px solid rgba(108,140,255,.12)}
.party-slot-filled:hover{border-color:rgba(108,140,255,.35);box-shadow:0 6px 20px rgba(108,140,255,.1)}
.party-slot-empty{background:rgba(255,255,255,.02);border:2px dashed rgba(108,140,255,.15)}
.party-slot-empty:hover{border-color:rgba(108,140,255,.35);background:rgba(108,140,255,.04)}
.party-slot-sprite{width:64px;height:64px;image-rendering:auto;object-fit:contain;display:block;filter:drop-shadow(0 2px 6px rgba(0,0,0,.4));border-radius:50%;background:radial-gradient(circle,rgba(108,140,255,.06) 0%,transparent 70%)}
.party-slot-plus{width:64px;height:64px;border-radius:50%;background:rgba(108,140,255,.06);border:2px dashed rgba(108,140,255,.15);display:flex;align-items:center;justify-content:center;font-size:28px;color:rgba(108,140,255,.4);font-weight:300;transition:all .25s}
.party-slot-empty:hover .party-slot-plus{color:var(--accent);border-color:var(--accent);background:rgba(108,140,255,.1)}
.party-slot-name{font-size:11px;font-weight:700;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:90px}
.party-slot-lv{font-size:10px;color:var(--muted)}
/* Release button in modal */
.modal-release-btn{display:block;width:100%;padding:10px;background:rgba(239,68,68,.08);border:1px solid rgba(239,68,68,.25);border-radius:12px;color:#ef4444;font-size:13px;font-weight:700;cursor:pointer;transition:.3s}
.modal-release-btn:hover{background:rgba(239,68,68,.18);border-color:#ef4444}
/* Modal actions layout */
.pm-equip-section{margin:16px 0 10px;width:100%}
.pm-actions-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%;margin-top:10px}
.modal-action-btn{display:flex;align-items:center;justify-content:center;gap:6px;padding:10px 8px;border:none;border-radius:12px;font-size:12px;font-weight:700;cursor:pointer;transition:.2s;color:#fff;}
.btn-mote{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);color:#e2e8f0}
.btn-mote:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2);color:#fff}
.btn-liberar{background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.25);color:#ef4444}
.btn-liberar:hover{background:rgba(239,68,68,.2);border-color:#ef4444}
.btn-shiny{background:linear-gradient(135deg, rgba(255,111,242,.2), rgba(255,111,242,.1));border:1px solid rgba(255,111,242,.4);color:#ff6ff2}
.btn-shiny:hover{background:linear-gradient(135deg, rgba(255,111,242,.3), rgba(255,111,242,.15));border-color:#ff6ff2}
.btn-exp{background:linear-gradient(135deg, rgba(0,229,255,.2), rgba(0,229,255,.1));border:1px solid rgba(0,229,255,.4);color:#00e5ff}
.btn-exp:hover{background:linear-gradient(135deg, rgba(0,229,255,.3), rgba(0,229,255,.15));border-color:#00e5ff}
/* Equip slot circles */
.equip-slots-label{font-size:12px;color:var(--muted);text-align:center;margin-bottom:8px;font-weight:600}
.equip-slots-row{display:flex;gap:8px;justify-content:center}
.equip-slot-circle{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:800;cursor:pointer;transition:all .2s;border:2px solid;overflow:hidden;background-clip:padding-box;}
.equip-slot-circle.free{background:rgba(34,197,94,.1);border-color:rgba(34,197,94,.35);color:#22c55e}
.equip-slot-circle.free:hover{background:rgba(34,197,94,.25);border-color:#22c55e;transform:scale(1.15)}
.equip-slot-circle.occupied{background:rgba(20,25,40,.8);border-color:rgba(108,140,255,.3);color:#6c8cff;box-shadow:inset 0 0 10px rgba(0,0,0,0.5)}
.equip-slot-circle.occupied:hover{background:rgba(30,35,55,.9);border-color:rgba(108,140,255,.6);transform:scale(1.15);box-shadow:inset 0 0 15px rgba(0,0,0,0.5)}
.equip-btn{width:100%;padding:10px;border:none;border-radius:10px;font-size:13px;font-weight:700;cursor:pointer;transition:.2s}
.equip-btn-remove{background:rgba(239,68,68,.12);border:1px solid rgba(239,68,68,.3);color:#ef4444}
.equip-btn-remove:hover{background:rgba(239,68,68,.22)}
/* Slot picker modal */
.slot-picker-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.8);backdrop-filter:blur(8px);z-index:150;align-items:center;justify-content:center;padding:20px}
.slot-picker-card{background:linear-gradient(145deg,rgba(14,19,36,.98),rgba(8,12,22,.99));border:1px solid rgba(108,140,255,.15);border-radius:20px;max-width:520px;width:100%;max-height:80vh;overflow-y:auto;padding:24px;position:relative;animation:modalIn .25s ease}
.slot-picker-title{font-size:20px;font-weight:800;margin:0 0 4px;text-align:center}
.slot-picker-sub{font-size:13px;color:var(--muted);text-align:center;margin:0 0 16px}
.slot-picker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:8px}
.slot-picker-item{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 4px;background:rgba(255,255,255,.03);border:1px solid rgba(108,140,255,.08);border-radius:12px;cursor:pointer;transition:all .2s}
.slot-picker-item:hover{background:rgba(108,140,255,.1);border-color:var(--accent);transform:translateY(-3px);box-shadow:0 6px 18px rgba(108,140,255,.12)}
.slot-picker-sprite{width:56px;height:56px;object-fit:contain;image-rendering:auto}
.slot-picker-name{font-size:10px;font-weight:700;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:80px}
.slot-picker-lv{font-size:9px;color:var(--muted)}
/* Slot picker filters */
.sp-filters{display:flex;gap:4px;flex-wrap:wrap;justify-content:center;margin-bottom:14px}
.sp-filter{padding:5px 10px;border-radius:8px;border:1px solid rgba(108,140,255,.12);background:rgba(255,255,255,.03);color:var(--muted);font-size:10px;font-weight:700;cursor:pointer;transition:all .2s;white-space:nowrap}
.sp-filter:hover{border-color:var(--accent);color:var(--text);background:rgba(108,140,255,.06)}
.sp-filter.active{background:rgba(108,140,255,.15);border-color:var(--accent);color:var(--accent)}
.sp-stat{font-size:9px;font-weight:800;color:var(--accent);background:rgba(108,140,255,.1);padding:1px 6px;border-radius:4px;margin-top:1px}
/* Release confirmation modal */
.release-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.85);backdrop-filter:blur(8px);z-index:200;align-items:center;justify-content:center;padding:20px}
.release-card{background:linear-gradient(145deg,rgba(20,14,14,.98),rgba(15,10,10,.99));border:1px solid rgba(239,68,68,.2);border-radius:20px;max-width:380px;width:100%;padding:32px 28px;text-align:center;animation:modalIn .25s ease}
.release-icon{font-size:48px;margin-bottom:12px}
.release-title{font-size:20px;font-weight:800;margin:0 0 10px;color:#fff}
.release-desc{font-size:13px;color:#94a3b8;line-height:1.5;margin:0 0 24px}
.release-desc strong{color:#ef4444}
.release-btns{display:flex;gap:10px}
.release-cancel{flex:1;padding:12px;border:1px solid rgba(255,255,255,.12);border-radius:12px;background:transparent;color:var(--muted);font-size:14px;font-weight:600;cursor:pointer;transition:.2s}
.release-cancel:hover{background:rgba(255,255,255,.05);color:#fff}
.release-confirm{flex:1;padding:12px;border:none;border-radius:12px;background:linear-gradient(135deg,#dc2626,#ef4444);color:#fff;font-size:14px;font-weight:700;cursor:pointer;transition:.2s;box-shadow:0 4px 14px rgba(239,68,68,.3)}
.release-confirm:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(239,68,68,.4)}
/* Pokemon grid */
/* Pokemon toolbar */
.pk-toolbar{display:flex;align-items:center;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.pk-search-wrap{position:relative;flex:1;min-width:180px}
.pk-search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:14px;pointer-events:none}
.pk-search{width:100%;padding:10px 12px 10px 36px;background:rgba(255,255,255,.04);border:1px solid var(--border);border-radius:10px;color:var(--text);font-size:13px;outline:none;transition:.3s}
.pk-search:focus{border-color:var(--accent);box-shadow:0 0 12px rgba(108,140,255,.15)}
.pk-search::placeholder{color:var(--muted)}
.pk-sort{padding:10px 14px;background:rgba(255,255,255,.04);border:1px solid var(--border);border-radius:10px;color:var(--text);font-size:12px;outline:none;cursor:pointer;min-width:150px}
.pk-sort:focus{border-color:var(--accent)}
.pk-sort option{background:#1a1f35;color:#e2e8f0}
.pk-count{font-size:12px;color:var(--muted);font-weight:600;white-space:nowrap}
/* Pokemon grid - premium cards */
.pokemon-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}
.poke-card{background:linear-gradient(145deg,rgba(26,31,53,.9),rgba(17,24,39,.95));border:1px solid rgba(108,140,255,.1);border-radius:16px;padding:12px 10px;text-align:center;transition:.3s;cursor:pointer;position:relative;overflow:hidden}
.poke-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,rgba(108,140,255,.3),transparent);opacity:0;transition:.3s}
.poke-card:hover{border-color:rgba(108,140,255,.35);transform:translateY(-4px);box-shadow:0 12px 32px rgba(108,140,255,.12)}
.poke-card:hover::before{opacity:1}
.poke-shiny{border-color:rgba(248,208,48,.25);background:linear-gradient(145deg,rgba(40,35,20,.9),rgba(17,24,39,.95))}
.poke-shiny:hover{border-color:rgba(248,208,48,.5);box-shadow:0 12px 32px rgba(248,208,48,.12)}
.poke-card img,.pk-sprite{width:72px;height:72px;image-rendering:auto;object-fit:contain;display:block;margin:0 auto 4px;filter:drop-shadow(0 2px 6px rgba(0,0,0,.4))}
.poke-card .pk-name{font-size:12px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:2px}
.pk-meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:3px}
.poke-card .pk-lv{font-size:10px;color:var(--muted)}
.pk-grade{font-size:13px;font-weight:900;letter-spacing:.5px;text-shadow:0 0 8px currentColor}
.pk-types{display:flex;justify-content:center;gap:3px;margin-bottom:4px}
.pk-types .tbadge{font-size:8px;padding:1px 5px;border-radius:4px}
.pk-hp-bar{width:100%;height:3px;background:rgba(255,255,255,.06);border-radius:2px;overflow:hidden;margin-top:3px}
.pk-hp-fill{height:100%;border-radius:2px;transition:width .3s}
.pk-bst{font-size:9px;color:var(--muted);margin-top:3px;font-weight:600}
.pk-expshare-badge{position:absolute;top:6px;right:6px;background:linear-gradient(135deg,#00e5ff,#00b8d4);color:#000;font-size:8px;font-weight:800;padding:2px 6px;border-radius:6px;box-shadow:0 0 8px rgba(0,229,255,0.5);z-index:2;letter-spacing:0.3px}
.starter-sprite{width:52px;height:52px;object-fit:contain}
/* Modal rename button */
.modal-rename-btn{display:block;width:100%;padding:10px;margin-top:6px;background:linear-gradient(135deg,rgba(167,139,250,.15),rgba(108,140,255,.15));border:1px solid rgba(167,139,250,.3);border-radius:12px;color:var(--accent2);font-size:13px;font-weight:700;cursor:pointer;transition:.3s}
.modal-rename-btn:hover{background:linear-gradient(135deg,rgba(167,139,250,.25),rgba(108,140,255,.25));border-color:var(--accent2)}

/* Items grid */
.items-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.item-card{background:linear-gradient(145deg,rgba(14,19,36,.9),rgba(10,14,26,.95));border:1px solid rgba(108,140,255,.08);border-radius:14px;padding:16px;display:flex;align-items:center;gap:12px;transition:all .25s;min-height:60px}
.item-card:hover{border-color:rgba(108,140,255,.25);transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.3)}
.item-card .item-icon{font-size:28px;flex-shrink:0;width:40px;text-align:center}
.item-card .item-sprite{width:40px;height:40px;image-rendering:pixelated;flex-shrink:0}
.item-card .item-name{font-size:13px;font-weight:700;color:#e2e8f0;line-height:1.3}
.item-card .item-qty{font-size:11px;color:var(--muted);margin-top:2px}
.item-holder{font-size:10px;color:#00e5ff;margin-top:4px;line-height:1.3;display:flex;align-items:center;gap:4px}

/* PvP */
.pvp-stats{display:flex;gap:14px;margin-bottom:20px;flex-wrap:wrap}
.pvp-stat{background:linear-gradient(145deg,rgba(14,19,36,.9),rgba(10,14,26,.95));border:1px solid rgba(108,140,255,.08);border-radius:14px;padding:16px 24px;text-align:center;transition:.3s}
.pvp-stat:hover{border-color:rgba(108,140,255,.15);transform:translateY(-2px)}
.pvp-stat .pvp-val{font-size:28px;font-weight:800}.pvp-stat .pvp-lbl{font-size:11px;color:var(--muted);text-transform:uppercase}
.leaderboard{background:linear-gradient(145deg,rgba(14,19,36,.9),rgba(10,14,26,.95));border:1px solid rgba(108,140,255,.08);border-radius:14px;overflow:hidden}
.lb-row{display:flex;align-items:center;padding:10px 16px;border-bottom:1px solid rgba(255,255,255,.03);gap:12px}
.lb-row:last-child{border-bottom:none}
.lb-row.me{background:rgba(108,140,255,.06)}
.lb-rank{font-size:14px;font-weight:800;color:var(--gold);width:30px;text-align:center}
.lb-name{flex:1;font-size:13px;font-weight:600}.lb-elo{font-size:13px;font-weight:700;color:var(--accent)}
.lb-wl{font-size:11px;color:var(--muted)}

/* Houses */
.houses-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}
.house-card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:16px;text-align:center}
.house-card .house-icon{font-size:32px;margin-bottom:8px}
.house-card .house-name{font-size:13px;font-weight:700}
.house-card .house-price{font-size:12px;color:var(--gold)}

/* ===== POKEMON DETAIL MODAL ===== */
.poke-modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.75);backdrop-filter:blur(8px);z-index:100;align-items:center;justify-content:center;padding:20px}
.poke-modal-card{background:linear-gradient(145deg,rgba(14,19,36,.98),rgba(8,12,22,.99));border:1px solid rgba(108,140,255,.12);border-radius:24px;max-width:440px;width:100%;padding:0;position:relative;box-shadow:0 24px 64px rgba(0,0,0,.6),0 0 40px rgba(108,140,255,.04);overflow:hidden;animation:modalIn .25s ease}
@keyframes modalIn{from{opacity:0;transform:scale(.92) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}
.modal-close{position:absolute;top:12px;right:14px;background:none;border:none;color:var(--muted);font-size:20px;cursor:pointer;z-index:2;transition:.2s}
.modal-close:hover{color:var(--text)}
.modal-sprite-wrap{background:linear-gradient(135deg,rgba(108,140,255,.1),rgba(167,139,250,.08));padding:24px;text-align:center;position:relative}
.modal-sprite{width:120px;height:120px;object-fit:contain;image-rendering:auto;display:block;margin:0 auto}
.shiny-badge{position:absolute;top:12px;left:14px;background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#000;font-size:10px;font-weight:800;padding:3px 8px;border-radius:6px}
.modal-info{padding:20px 24px 24px}
.modal-info h3{font-size:20px;font-weight:800;margin-bottom:6px}
.modal-info h3 small{font-size:13px;color:var(--muted);font-weight:600}
.modal-types{display:flex;gap:6px;margin-bottom:8px}
.modal-nature{font-size:12px;color:var(--accent2);margin-bottom:4px}
.modal-ability{font-size:12px;color:#c084fc;margin-bottom:10px;text-transform:capitalize}
.modal-bst{margin-top:10px;padding-top:8px;border-top:1px solid var(--border)}
.bst-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px;font-size:11px;font-weight:700;color:var(--muted)}
.bst-grade{font-size:13px;font-weight:900;letter-spacing:.5px}
.bst-bar{height:8px;border-radius:4px}
.tbadge{display:inline-block;padding:2px 10px;border-radius:6px;font-size:10px;font-weight:700;text-transform:uppercase;color:#fff;letter-spacing:.3px}
.type-normal{background:#a8a878}.type-fire{background:#f08030}.type-water{background:#6890f0}.type-electric{background:#f8d030;color:#333}
.type-grass{background:#78c850}.type-ice{background:#98d8d8;color:#333}.type-fighting{background:#c03028}.type-poison{background:#a040a0}
.type-ground{background:#e0c068;color:#333}.type-flying{background:#a890f0}.type-psychic{background:#f85888}.type-bug{background:#a8b820}
.type-rock{background:#b8a038}.type-ghost{background:#705898}.type-dragon{background:#7038f8}.type-dark{background:#705848}
.type-steel{background:#b8b8d0;color:#333}.type-fairy{background:#ee99ac}
.modal-hp{display:flex;align-items:center;gap:8px;margin-bottom:16px;font-size:12px;font-weight:600}
.modal-hp .hp-bar{flex:1}
.hp-bar{height:8px;background:rgba(255,255,255,.08);border-radius:4px;overflow:hidden}
.hp-bar-lg{height:10px}
.hp-fill{height:100%;border-radius:4px;transition:width .3s}
.hp-text{font-size:11px;color:var(--muted);font-weight:600}
.modal-stats{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.ms{display:flex;align-items:center;gap:8px}
.ms-l{font-size:10px;font-weight:700;color:var(--muted);width:48px;text-align:right;text-transform:uppercase}
.ms-bar{flex:1;height:6px;background:rgba(255,255,255,.06);border-radius:3px;overflow:hidden}
.ms-bar div{height:100%;border-radius:3px;transition:width .4s}
.ms-v{font-size:11px;font-weight:700;width:30px;text-align:right}
.modal-id{font-size:11px;color:var(--muted);padding-top:10px;border-top:1px solid var(--border)}
.modal-party-btn{width:100%;margin-top:12px;padding:10px;background:linear-gradient(135deg,var(--accent),var(--accent2));border:none;border-radius:10px;color:#fff;font-size:13px;font-weight:700;cursor:pointer;transition:.2s}
.modal-party-btn:hover{transform:translateY(-1px);box-shadow:0 4px 14px rgba(108,140,255,.3)}
.modal-moves-section{margin-top:14px;padding-top:12px;border-top:1px solid var(--border)}
.modal-moves-section h4{font-size:13px;font-weight:700;margin-bottom:8px;color:var(--text)}
.modal-moves-loading{font-size:12px;color:var(--muted)}
.modal-moves-grid{display:flex;flex-direction:column;gap:6px}
.modal-move{display:flex;align-items:center;gap:8px;padding:6px 8px;background:rgba(255,255,255,.03);border-radius:8px}
.modal-move .tbadge{min-width:52px;text-align:center;font-size:9px}
.move-name{flex:1;font-size:12px;font-weight:600}
.move-pow{font-size:11px;color:var(--muted);min-width:28px;text-align:right}
.move-cat{font-size:14px;min-width:20px;text-align:center}

/* ===== ROULETTE ===== */
.roulette-tab{background:linear-gradient(135deg,rgba(248,208,48,.08),rgba(255,62,157,.08));border:1px solid rgba(248,208,48,.15);margin-top:4px}
.roulette-tab.active{background:linear-gradient(135deg,rgba(248,208,48,.15),rgba(255,62,157,.15));border-color:#f8d030}
.roulette-sub{color:var(--muted);font-size:14px;margin-bottom:20px}
.roulette-layout{display:flex;gap:24px;align-items:flex-start}
.roulette-main{flex:1;min-width:0}
.roulette-wrapper{position:relative;margin:0 auto 20px}
.roulette-pointer{position:absolute;top:-8px;left:50%;transform:translateX(-50%);font-size:24px;color:var(--accent);z-index:3;filter:drop-shadow(0 2px 4px rgba(108,140,255,.4));animation:pointerPulse 1s ease-in-out infinite}
@keyframes pointerPulse{0%,100%{transform:translateX(-50%) scale(1)}50%{transform:translateX(-50%) scale(1.2)}}
.roulette-track{overflow:hidden;border-radius:16px;border:1px solid rgba(108,140,255,.1);background:linear-gradient(145deg,rgba(14,19,36,.9),rgba(10,14,26,.95));height:160px;position:relative}
.roulette-track::before,.roulette-track::after{content:'';position:absolute;top:0;bottom:0;width:60px;z-index:2;pointer-events:none}
.roulette-track::before{left:0;background:linear-gradient(to right,rgba(10,14,26,.95),transparent)}
.roulette-track::after{right:0;background:linear-gradient(to left,rgba(10,14,26,.95),transparent)}
.roulette-strip{display:flex;gap:8px;padding:12px 8px;will-change:transform}
.rslot{min-width:124px;background:rgba(255,255,255,.03);border:2px solid var(--border);border-radius:14px;padding:10px;text-align:center;flex-shrink:0;transition:.2s}
.rslot-sprite{width:64px;height:64px;object-fit:contain;display:block;margin:0 auto 4px}
.rslot-name{font-size:11px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rslot-rarity{font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;margin-top:2px}
.rslot-legendary{background:linear-gradient(135deg,rgba(255,62,157,.08),rgba(167,139,250,.08));animation:legendGlow 2s ease-in-out infinite}
@keyframes legendGlow{0%,100%{box-shadow:0 0 8px rgba(255,62,157,.2)}50%{box-shadow:0 0 20px rgba(255,62,157,.4)}}
.roulette-info{text-align:center;margin-bottom:16px}
.roulette-timer{font-size:14px;font-weight:600;margin-bottom:12px}
.roulette-spin-btn{padding:14px 40px;background:linear-gradient(135deg,#f8d030,#f08030);border:none;border-radius:14px;color:#fff;font-size:16px;font-weight:800;cursor:pointer;transition:.3s;box-shadow:0 4px 16px rgba(248,208,48,.3)}
.roulette-spin-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 24px rgba(248,208,48,.4)}
.roulette-spin-btn:disabled{opacity:.5;cursor:not-allowed;filter:grayscale(.5)}
.roulette-buy-btn{display:block;margin:10px auto 0;padding:12px 32px;background:linear-gradient(135deg,#a78bfa,#6c8cff);border:none;border-radius:12px;color:#fff;font-size:14px;font-weight:700;cursor:pointer;transition:.3s;box-shadow:0 4px 14px rgba(167,139,250,.3)}
.roulette-buy-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 20px rgba(167,139,250,.4)}
.roulette-buy-btn:disabled{opacity:.4;cursor:not-allowed;filter:grayscale(.4)}
.roulette-result{text-align:center;margin-top:16px;position:relative;overflow:hidden}
.rresult-card{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:24px;display:inline-block;text-align:center;animation:modalIn .4s ease}
.rresult-card h3{font-size:18px;font-weight:800;margin:8px 0}
.rresult-sprite-wrap{margin-bottom:8px}
.rresult-sprite{width:96px;height:96px;object-fit:contain;display:block;margin:0 auto}
.rresult-legendary{border-color:#ff3e9d;box-shadow:0 0 24px rgba(255,62,157,.3)}
.rresult-rare{border-color:#f8d030;box-shadow:0 0 20px rgba(248,208,48,.25)}
.rresult-uncommon{border-color:#6890f0;box-shadow:0 0 16px rgba(104,144,240,.2)}
.confetti{position:absolute;top:-10px;width:8px;height:8px;border-radius:50%;animation:confettiFall 2.5s ease-out forwards}
@keyframes confettiFall{0%{transform:translateY(0) rotate(0);opacity:1}100%{transform:translateY(400px) rotate(720deg);opacity:0}}
/* Prizes panel */
.roulette-prizes-panel{width:280px;flex-shrink:0;background:linear-gradient(145deg,rgba(14,19,36,.9),rgba(10,14,26,.95));border:1px solid rgba(108,140,255,.08);border-radius:16px;padding:16px;max-height:520px;overflow-y:auto}
.roulette-prizes-panel h3{font-size:15px;font-weight:800;margin-bottom:12px}
.rprize-row{display:flex;align-items:center;gap:8px;padding:8px;border-radius:10px;margin-bottom:4px;transition:.2s;border-left:3px solid transparent}
.rprize-row:hover{background:rgba(255,255,255,.03)}
.rprize-common{border-left-color:#a8a878}.rprize-uncommon{border-left-color:#6890f0}.rprize-rare{border-left-color:#f8d030}.rprize-legendary{border-left-color:#ff3e9d;background:linear-gradient(90deg,rgba(255,62,157,.05),transparent)}
.rprize-sprite{width:40px;height:40px;object-fit:contain;flex-shrink:0}
.rprize-info{flex:1;min-width:0}
.rprize-name{display:block;font-size:12px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rprize-types{display:flex;gap:3px;margin-top:2px}
.rprize-types .tbadge{font-size:8px;padding:1px 6px}
.rprize-badge{text-align:right;flex-shrink:0}
.rprize-rarity-label{display:block;font-size:10px;font-weight:800;text-transform:uppercase}
.rprize-pct{display:block;font-size:9px;opacity:.7}
@media(max-width:900px){.roulette-layout{flex-direction:column}.roulette-prizes-panel{width:100%}}
/* Recent wins feed */
.roulette-feed{margin-top:20px;background:var(--card);border:1px solid var(--border);border-radius:16px;padding:16px;max-height:340px;overflow-y:auto}
.roulette-feed h3{font-size:14px;font-weight:800;margin-bottom:10px}
.rfeed-row{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:8px;margin-bottom:3px;border-left:3px solid var(--border);transition:.2s}
.rfeed-row:hover{background:rgba(255,255,255,.03)}
.rfeed-common{border-left-color:#a8a878}.rfeed-uncommon{border-left-color:#6890f0}.rfeed-rare{border-left-color:#f8d030}.rfeed-legendary{border-left-color:#ff3e9d;background:linear-gradient(90deg,rgba(255,62,157,.04),transparent)}
.rfeed-sprite-wrap{flex-shrink:0}.rfeed-sprite{width:32px;height:32px;object-fit:contain}
.rfeed-info{flex:1;font-size:12px;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rfeed-user{color:var(--accent);font-weight:700}
.rfeed-rarity{font-size:10px;font-weight:800;text-transform:uppercase}
.rfeed-time{font-size:10px;color:var(--muted);flex-shrink:0}

/* Horde tab — override screens to work as tab-internal views */
#horde-container{min-height:calc(100vh - 80px)}
.horde-view{display:none;min-height:calc(100vh - 80px)}.horde-view.active{display:flex}
#tab-horde .horde-view{min-height:auto}
#tab-horde #battle-screen.active{display:flex;flex-direction:column;min-height:calc(100vh - 80px)}
#tab-horde #pick-screen.active{display:flex;flex-direction:column;align-items:center;padding:24px 0}
#tab-horde #between-screen.active{display:flex;align-items:center;justify-content:center;min-height:400px}
#tab-horde #gameover-screen.active{display:flex;align-items:center;justify-content:center;min-height:400px}

/* Battle HUD enhancements */
.hud-types{display:flex;gap:3px;margin:2px 0}
.hud-types .tbadge{font-size:7px;padding:1px 5px;border-radius:4px}
.effect-banner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:35;pointer-events:none;font-size:28px;font-weight:900;padding:10px 36px;border-radius:14px;animation:ebAnim 1.5s ease-out forwards;letter-spacing:1px;text-shadow:0 3px 12px rgba(0,0,0,.7)}
.eb-super{color:#22c55e;background:linear-gradient(135deg,rgba(34,197,94,.25),rgba(34,197,94,.1));border:2px solid rgba(34,197,94,.4)}
.eb-weak{color:#f59e0b;background:linear-gradient(135deg,rgba(245,158,11,.2),rgba(245,158,11,.08));border:2px solid rgba(245,158,11,.3);font-size:20px}
.eb-immune{color:#a78bfa;background:linear-gradient(135deg,rgba(167,139,250,.25),rgba(167,139,250,.08));border:2px solid rgba(167,139,250,.4);font-size:24px}
.eb-ability{color:#60a5fa;background:linear-gradient(135deg,rgba(96,165,250,.2),rgba(96,165,250,.08));border:2px solid rgba(96,165,250,.4);font-size:22px}
.eb-buff{color:#34d399;background:linear-gradient(135deg,rgba(52,211,153,.2),rgba(52,211,153,.08));border:2px solid rgba(52,211,153,.3);font-size:20px}
.eb-neutral{color:#cbd5e1;background:linear-gradient(135deg,rgba(203,213,225,.15),rgba(203,213,225,.05));border:2px solid rgba(203,213,225,.2);font-size:18px}
.eb-normal{color:#e2e8f0;background:linear-gradient(135deg,rgba(226,232,240,.12),rgba(226,232,240,.05));border:1px solid rgba(226,232,240,.15);font-size:18px}
@keyframes ebAnim{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}10%{opacity:1;transform:translate(-50%,-50%) scale(1.15)}25%{transform:translate(-50%,-50%) scale(1)}75%{opacity:1}100%{opacity:0;transform:translate(-50%,-50%) translateY(-20px) scale(.9)}}
.move-btn{position:relative}
.move-btn[title]:hover::after{content:attr(title);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);background:rgba(0,0,0,.92);color:#e2e8f0;font-size:11px;font-weight:400;padding:6px 10px;border-radius:8px;white-space:normal;max-width:220px;z-index:40;pointer-events:none;line-height:1.4;border:1px solid rgba(255,255,255,.1);box-shadow:0 4px 12px rgba(0,0,0,.5)}
.mv-meta{color:var(--muted);font-size:10px;min-width:22px;text-align:right}

/* Forced switch panel */
.forced-switch-overlay{position:absolute;inset:0;z-index:50;background:rgba(0,0,0,.75);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;animation:fadeIn .3s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.forced-switch-panel{background:var(--card);border:1px solid var(--border);border-radius:20px;padding:28px 24px;max-width:480px;width:92%;text-align:center;animation:slideUp .3s ease}
@keyframes slideUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.forced-switch-panel h3{font-size:20px;font-weight:900;margin-bottom:6px;color:var(--danger)}
.forced-switch-panel p{font-size:13px;color:var(--muted);margin-bottom:16px}
.forced-switch-grid{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.fs-card{background:var(--bg2);border:2px solid var(--border);border-radius:14px;padding:12px;cursor:pointer;transition:.2s;text-align:center;min-width:90px;flex:1;max-width:120px}
.fs-card:hover{border-color:var(--accent);transform:translateY(-3px);box-shadow:0 6px 20px rgba(108,140,255,.2)}
.fs-recommended{border-color:var(--accent);background:rgba(108,140,255,.08)}
.fs-sprite-wrap{margin-bottom:4px}.fs-sprite{width:56px;height:56px;object-fit:contain}
.fs-name{font-size:11px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fs-types{display:flex;gap:2px;justify-content:center;margin:3px 0}.fs-types .tbadge{font-size:7px;padding:1px 4px}
.fs-hp{font-size:10px;font-weight:600;margin-bottom:3px}
.fs-tag{font-size:8px;font-weight:800;color:var(--accent);text-transform:uppercase;margin-top:4px;letter-spacing:.5px}

/* Toast notifications */
#toast-container{position:fixed;top:20px;right:20px;z-index:200;display:flex;flex-direction:column;gap:8px;pointer-events:none}
.toast{pointer-events:auto;background:var(--card);border:1px solid var(--border);border-radius:12px;padding:12px 16px;display:flex;align-items:center;gap:10px;box-shadow:0 8px 32px rgba(0,0,0,.4);opacity:0;transform:translateX(40px);transition:all .3s ease;max-width:360px;font-size:13px}
.toast.show{opacity:1;transform:translateX(0)}
.toast-success{border-color:var(--success);background:linear-gradient(135deg,rgba(34,197,94,.08),var(--card))}
.toast-error{border-color:var(--danger);background:linear-gradient(135deg,rgba(239,68,68,.08),var(--card))}
.toast-info{border-color:var(--accent);background:linear-gradient(135deg,rgba(108,140,255,.08),var(--card))}
.toast-close{background:none;border:none;color:var(--muted);font-size:18px;cursor:pointer;padding:0 2px;margin-left:auto}
/* Confirm modal */
.confirm-card{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:28px;max-width:340px;text-align:center;animation:modalIn .2s ease}
.confirm-card p{font-size:15px;font-weight:600;margin-bottom:20px}
.confirm-btns{display:flex;gap:10px;justify-content:center}
.confirm-no{padding:10px 20px;border-radius:10px;border:1px solid var(--border);background:transparent;color:var(--muted);font-weight:600;cursor:pointer;transition:.2s}
.confirm-no:hover{background:rgba(255,255,255,.04)}
.confirm-yes{padding:10px 20px;border-radius:10px;border:none;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff;font-weight:700;cursor:pointer;transition:.2s}
.confirm-yes:hover{transform:translateY(-1px);box-shadow:0 4px 14px rgba(108,140,255,.3)}

/* ═══ TM SHOP — Premium Redesign ═══ */
.tm-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:16px}
.tm-subtabs{display:flex;gap:6px}
.tm-subtab{padding:8px 18px;border-radius:10px;border:1px solid var(--border);background:transparent;color:var(--muted);font-size:13px;font-weight:700;cursor:pointer;transition:.25s;position:relative}
.tm-subtab.active{background:var(--accent);color:#fff;border-color:var(--accent);box-shadow:0 2px 12px rgba(108,140,255,.3)}
.tm-subtab:hover:not(.active){background:rgba(108,140,255,.08);color:var(--text)}
.tm-inv-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;border-radius:9px;background:#ef4444;color:#fff;font-size:10px;font-weight:900;margin-left:4px;padding:0 4px}
.tm-subpanel{display:none}.tm-subpanel.active{display:block}

.tm-shop-controls{display:flex;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.tm-search-wrap{flex:1;min-width:200px;position:relative}
.tm-search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:14px;pointer-events:none}
.tm-search{width:100%;padding:10px 14px 10px 36px;border-radius:12px;border:1px solid var(--border);background:var(--card);color:var(--text);font-size:14px;outline:none;transition:.2s;box-sizing:border-box}
.tm-search:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(108,140,255,.15)}
.tm-type-filter{padding:10px 14px;border-radius:12px;border:1px solid var(--border);background:var(--card);color:var(--text);font-size:13px;outline:none;cursor:pointer}

.tm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;max-height:65vh;overflow-y:auto;padding:4px 2px}
.tm-empty{text-align:center;padding:60px 20px;color:var(--muted);font-size:16px}

/* TM Card */
.tm-card{display:flex;align-items:center;gap:14px;background:var(--card);border:1px solid var(--border);border-radius:16px;padding:14px 16px;cursor:pointer;transition:all .25s ease;position:relative;overflow:hidden}
.tm-card::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,var(--tm-color,transparent) -200%,transparent 60%);opacity:.06;transition:.3s}
.tm-card:hover{transform:translateY(-3px);box-shadow:0 8px 28px rgba(0,0,0,.35);border-color:rgba(108,140,255,.4)}
.tm-card:hover::before{opacity:.12}

/* TM Disc (like game cartridge) */
.tm-disc{width:48px;height:48px;border-radius:50%;background:conic-gradient(from 0deg,var(--tm-color,#888) 0%,color-mix(in srgb,var(--tm-color,#888),#fff 30%) 25%,var(--tm-color,#888) 50%,color-mix(in srgb,var(--tm-color,#888),#000 25%) 75%,var(--tm-color,#888) 100%);display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 2px 8px rgba(0,0,0,.3),inset 0 1px 3px rgba(255,255,255,.2);animation:tm-spin 8s linear infinite;position:relative}
.tm-disc::after{content:'';position:absolute;width:14px;height:14px;border-radius:50%;background:radial-gradient(circle,#333 40%,#222 100%);border:2px solid #555}
.tm-disc-inner{position:absolute;font-size:8px;font-weight:900;color:rgba(255,255,255,.7);text-shadow:0 1px 2px rgba(0,0,0,.5);top:3px;left:50%;transform:translateX(-50%)}
@keyframes tm-spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}

/* Large disc for detail modal */
.tm-disc-lg{width:72px;height:72px;border-radius:50%;background:conic-gradient(from 0deg,var(--tm-color,#888) 0%,color-mix(in srgb,var(--tm-color,#888),#fff 30%) 25%,var(--tm-color,#888) 50%,color-mix(in srgb,var(--tm-color,#888),#000 25%) 75%,var(--tm-color,#888) 100%);display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 4px 16px rgba(0,0,0,.4),inset 0 2px 5px rgba(255,255,255,.2);animation:tm-spin 6s linear infinite;position:relative}
.tm-disc-lg::after{content:'';position:absolute;width:20px;height:20px;border-radius:50%;background:radial-gradient(circle,#333 40%,#222 100%);border:2px solid #555}
.tm-disc-lg .tm-disc-inner{font-size:10px;top:6px}

.tm-info{flex:1;min-width:0}
.tm-name{font-size:14px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:4px}
.tm-meta{display:flex;gap:6px;margin-bottom:4px;flex-wrap:wrap}
.tm-type-pill{display:inline-block;padding:2px 8px;border-radius:6px;font-size:10px;font-weight:800;color:#fff;text-transform:uppercase;letter-spacing:.3px}
.tm-class-pill{display:inline-block;padding:2px 8px;border-radius:6px;font-size:10px;font-weight:600;color:var(--muted);background:rgba(255,255,255,.05);border:1px solid var(--border)}
.tm-stats-row{display:flex;gap:10px;font-size:11px;color:var(--muted)}
.tm-price{font-size:15px;font-weight:900;color:var(--gold);flex-shrink:0;white-space:nowrap}
.tm-use-btn{color:var(--accent)!important;font-size:13px}

/* TM Detail Modal */
.tm-modal-card{max-width:520px;width:92%;max-height:85vh;overflow-y:auto}
.tm-detail-header{display:flex;align-items:center;gap:18px;padding:20px;border-radius:14px;margin-bottom:16px}
.tm-detail-name{font-size:20px;font-weight:900;margin:0 0 6px}
.tm-detail-meta{display:flex;gap:6px}
.tm-detail-desc{padding:12px 16px;background:rgba(255,255,255,.03);border:1px solid var(--border);border-radius:12px;font-size:13px;line-height:1.5;color:var(--text);margin-bottom:14px}
.tm-detail-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:16px}
.tm-stat-item{text-align:center;padding:10px;background:rgba(255,255,255,.03);border:1px solid var(--border);border-radius:10px}
.tm-stat-label{display:block;font-size:10px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:2px}
.tm-stat-val{font-size:18px;font-weight:900;color:var(--text)}

.tm-detail-buy{display:flex;justify-content:space-between;align-items:center;padding:16px;background:rgba(108,140,255,.06);border:1px solid rgba(108,140,255,.15);border-radius:14px}
.tm-detail-price{font-size:22px;font-weight:900;color:var(--gold)}
.tm-buy-btn{padding:12px 28px;border-radius:12px;border:none;background:linear-gradient(135deg,var(--accent),#8b5cf6);color:#fff;font-size:14px;font-weight:800;cursor:pointer;transition:.25s;box-shadow:0 4px 14px rgba(108,140,255,.3)}
.tm-buy-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(108,140,255,.4)}

/* Compatibility Grid */
.tm-detail-compat{margin-top:12px}
.tm-compat-title{font-size:14px;font-weight:700;margin-bottom:10px}
.tm-compat-loading{color:var(--muted);text-align:center;padding:20px}
.tm-compat-none{color:#ef4444;text-align:center;padding:16px;font-size:13px}
.tm-compat-info{color:var(--muted);font-size:12px;margin-top:8px;padding:4px 0}
.tm-compat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:8px;max-height:250px;overflow-y:auto}
.tm-compat-poke{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 6px;background:rgba(108,140,255,.05);border:1px solid var(--border);border-radius:12px;cursor:pointer;transition:.2s}
.tm-compat-poke:hover{background:rgba(108,140,255,.12);border-color:var(--accent);transform:translateY(-2px)}
.tm-compat-sprite{width:48px;height:48px;object-fit:contain;image-rendering:pixelated}
.tm-compat-name{font-size:11px;font-weight:700;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:90px}
.tm-compat-moves{font-size:9px;color:var(--muted)}

/* Replace list */
.tm-replace-list{display:flex;flex-direction:column;gap:6px}
.tm-replace-option{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:rgba(239,68,68,.06);border:1px solid rgba(239,68,68,.2);border-radius:12px;cursor:pointer;transition:.2s}
.tm-replace-option:hover{background:rgba(239,68,68,.12);border-color:var(--danger)}
.tm-replace-x{color:var(--danger);font-weight:700;font-size:12px}

::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}


/* ===== TM FULLSCREEN MODAL ===== */
.tm-fullmodal-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: rgba(0,0,0,.75);
  backdrop-filter: blur(6px);
  justify-content: center;
  align-items: center;
  opacity: 0;
  transition: opacity .2s ease;
}
.tm-fullmodal-overlay.show { opacity: 1; }
.tm-fullmodal-card {
  position: relative;
  background: var(--bg2, #0d1220);
  border: 1px solid var(--border, rgba(108,140,255,.12));
  border-radius: 18px;
  width: 90vw;
  max-width: 520px;
  max-height: 85vh;
  overflow-y: auto;
  box-shadow: 0 24px 80px rgba(0,0,0,.6), 0 0 40px rgba(108,140,255,.08);
  animation: tmModalIn .25s ease;
}
@keyframes tmModalIn { from { transform: scale(.92) translateY(20px); opacity: 0; } to { transform: none; opacity: 1; } }
.tm-fullmodal-close {
  position: absolute;
  top: 12px; right: 14px;
  width: 34px; height: 34px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.4);
  color: #fff;
  font-size: 16px;
  cursor: pointer;
  z-index: 2;
  display: flex; align-items: center; justify-content: center;
  transition: background .15s, transform .15s;
}
.tm-fullmodal-close:hover { background: rgba(239,68,68,.5); transform: scale(1.1); }
.tm-fullmodal-header {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 24px 20px 16px;
  border-radius: 18px 18px 0 0;
}
.tm-fullmodal-title h3 {
  margin: 0;
  font-size: 20px;
  font-weight: 800;
  color: #fff;
}
.tm-fullmodal-badges { display: flex; gap: 6px; margin-top: 6px; }
.tm-fullmodal-desc {
  padding: 0 20px 12px;
  font-size: 13px;
  color: var(--muted, #8896b3);
  line-height: 1.5;
  border-bottom: 1px solid var(--border, rgba(108,140,255,.08));
}
.tm-fullmodal-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  padding: 14px 20px;
  border-bottom: 1px solid var(--border, rgba(108,140,255,.08));
}
.tm-fstat {
  text-align: center;
  background: rgba(108,140,255,.06);
  border-radius: 10px;
  padding: 10px 6px;
}
.tm-fstat-label {
  display: block;
  font-size: 10px;
  font-weight: 700;
  color: var(--muted, #6b7a99);
  letter-spacing: .08em;
  margin-bottom: 4px;
  text-transform: uppercase;
}
.tm-fstat-val {
  display: block;
  font-size: 22px;
  font-weight: 800;
  color: #fff;
}
.tm-fullmodal-buy {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 20px;
  border-bottom: 1px solid var(--border, rgba(108,140,255,.08));
}
.tm-fullmodal-price {
  font-size: 16px;
  color: var(--accent2, #a78bfa);
}
.tm-fullmodal-price strong { font-size: 20px; }
.tm-fullmodal-buy-btn {
  padding: 10px 22px;
  border-radius: 10px;
  border: none;
  background: linear-gradient(135deg, var(--accent, #6c8cff), var(--accent2, #a78bfa));
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  transition: transform .15s, box-shadow .15s;
}
.tm-fullmodal-buy-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(108,140,255,.3);
}
.tm-fullmodal-compat {
  padding: 14px 20px 20px;
}
.tm-fullmodal-compat h4 {
  margin: 0 0 12px;
  font-size: 14px;
  font-weight: 700;
  color: var(--text, #e2e8f0);
}
.tm-compat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
  gap: 8px;
}
.tm-compat-poke {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 10px 6px;
  background: rgba(108,140,255,.06);
  border: 1px solid rgba(108,140,255,.08);
  border-radius: 12px;
  cursor: pointer;
  transition: all .15s;
}
.tm-compat-poke:hover {
  background: rgba(108,140,255,.14);
  border-color: var(--accent, #6c8cff);
  transform: translateY(-2px);
}
.tm-compat-sprite { width: 48px; height: 48px; image-rendering: pixelated; }
.tm-compat-name { font-size: 11px; font-weight: 600; color: #fff; text-align: center; }
.tm-compat-moves { font-size: 10px; color: var(--muted, #6b7a99); }
.tm-compat-none { color: var(--muted); font-size: 13px; }
.tm-compat-info { color: var(--muted); font-size: 12px; margin-top: 8px; }
.tm-compat-loading { color: var(--muted); font-size: 13px; }
.tm-compat-title { margin: 0 0 10px; font-size: 14px; font-weight: 700; color: var(--text); }
.tm-replace-list { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; }
.tm-replace-option {
  display: flex; justify-content: space-between; align-items: center;
  padding: 10px 14px; background: rgba(108,140,255,.06); border-radius: 10px;
  border: 1px solid rgba(108,140,255,.08); cursor: pointer; transition: all .15s;
}
.tm-replace-option:hover { background: rgba(239,68,68,.12); border-color: rgba(239,68,68,.3); }
.tm-replace-x { font-size: 12px; color: var(--danger, #ef4444); font-weight: 600; }

/* Scrollbar for modal */
.tm-fullmodal-card::-webkit-scrollbar { width: 6px; }
.tm-fullmodal-card::-webkit-scrollbar-track { background: transparent; }
.tm-fullmodal-card::-webkit-scrollbar-thumb { background: rgba(108,140,255,.2); border-radius: 3px; }

/* TM items in inventory */
.tm-item-card{display:flex;align-items:center;gap:12px;border-left:3px solid;cursor:default;transition:all .15s}
.tm-item-card>div{flex:1;min-width:0;overflow:hidden}
.tm-disc-sm{width:36px;height:36px;border-radius:50%;background:radial-gradient(circle at 35% 35%,var(--tm-color) 30%,color-mix(in srgb,var(--tm-color) 50%,#000) 100%);display:flex;align-items:center;justify-content:center;flex-shrink:0;border:2px solid rgba(255,255,255,.15)}
.tm-disc-sm .tm-disc-inner{font-size:10px;font-weight:800;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5)}
.tm-use-inv-btn{margin-left:auto;padding:5px 14px;border-radius:8px;border:none;background:linear-gradient(135deg,var(--accent,#6c8cff),var(--accent2,#a78bfa));color:#fff;font-size:12px;font-weight:700;cursor:pointer;transition:transform .15s}
.tm-use-inv-btn:hover{transform:scale(1.05)}

/* TM PokeAPI sprites */
.tm-sprite{width:40px;height:40px;image-rendering:pixelated;flex-shrink:0}
.tm-modal-sprite{width:56px;height:56px;image-rendering:pixelated;flex-shrink:0}
.tm-inv-sprite{width:32px;height:32px;image-rendering:pixelated;flex-shrink:0}

/* EXP bars */
.pk-exp-bar{width:100%;height:4px;background:rgba(255,255,255,.08);border-radius:2px;margin:2px 0 4px;overflow:hidden}
.pk-exp-fill{height:100%;background:linear-gradient(90deg,#60a5fa,#818cf8);border-radius:2px;transition:width .3s}
.modal-exp{display:flex;align-items:center;gap:8px;margin:4px 0 8px}
.modal-exp span:first-child{font-size:12px;font-weight:700;color:#60a5fa;min-width:28px}
.exp-bar{flex:1;height:8px;background:rgba(255,255,255,.08);border-radius:4px;overflow:hidden}
.exp-fill{height:100%;background:linear-gradient(90deg,#60a5fa,#818cf8);border-radius:4px;transition:width .3s}
.exp-text{font-size:11px;color:#94a3b8;min-width:60px;text-align:right}

/* Premium sidebar overrides */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
.sidebar{font-family:'Inter',sans-serif}
.nav-icon{width:18px;height:18px;flex-shrink:0;opacity:.5;transition:opacity .2s}
.tab-btn:hover .nav-icon,.tab-btn.active .nav-icon{opacity:1}
.tab-btn.active .nav-icon{stroke:#fff}
/* Roulette tab — gold accent */
.roulette-tab{border-left:2px solid transparent!important;border-top:1px solid rgba(251,191,36,.08)!important;background:transparent!important;border-radius:0!important}
.roulette-tab:hover{color:#fbbf24!important;background:rgba(251,191,36,.04)!important;border-left-color:rgba(251,191,36,.4)!important}
.roulette-tab.active{color:#fbbf24!important;background:linear-gradient(90deg,rgba(251,191,36,.08),transparent)!important;border-left-color:#fbbf24!important;text-shadow:0 0 12px rgba(251,191,36,.4)!important}
.roulette-tab.active .nav-icon{stroke:#fbbf24!important}
/* Safari tab — NEON GREEN */
.safari-tab{border-left:2px solid transparent!important;border-top:1px solid rgba(0,255,100,.06)!important;background:transparent!important;border-radius:0!important;color:rgba(255,255,255,.4)!important}
.safari-tab:hover{color:#00ff64!important;background:rgba(0,255,100,.04)!important;border-left-color:rgba(0,255,100,.4)!important}
.safari-tab.active{color:#00ff64!important;background:linear-gradient(90deg,rgba(0,255,100,.08),transparent)!important;border-left-color:#00ff64!important;text-shadow:0 0 16px rgba(0,255,100,.6)!important;box-shadow:inset 0 0 30px rgba(0,255,100,.02)!important}
.safari-tab.active .nav-icon{stroke:#00ff64!important;filter:drop-shadow(0 0 4px rgba(0,255,100,.5))!important}
/* Horde tab — NEON RED (already in base, reinforce) */
.horde-tab{border-top:1px solid rgba(255,0,0,.06)!important}
.horde-tab.active .nav-icon{stroke:#ff2222!important;filter:drop-shadow(0 0 4px rgba(255,0,0,.5))!important}

/* Pending Moves Modal */
.pm-overlay{position:fixed;inset:0;background:rgba(0,0,0,.85);backdrop-filter:blur(8px);display:none;align-items:center;justify-content:center;z-index:10000;animation:fadeIn .3s}
.pm-modal{background:linear-gradient(145deg,#1a1d2e,#12141f);border:1px solid rgba(99,102,241,.2);border-radius:16px;padding:28px;max-width:420px;width:90%;box-shadow:0 24px 64px rgba(0,0,0,.5)}
.pm-header{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.pm-sprite{width:56px;height:56px;image-rendering:pixelated}
.pm-poke-name{font-family:'Inter',sans-serif;font-size:18px;font-weight:700;color:#fff}
.pm-poke-name small{font-weight:400;color:#94a3b8}
.pm-subtitle{font-size:12px;color:#818cf8;font-weight:500;letter-spacing:.5px;text-transform:uppercase;margin-top:2px}
.pm-new-move{margin-bottom:18px}
.pm-new-label,.pm-current-label{font-family:'Inter',sans-serif;font-size:10px;font-weight:600;letter-spacing:1.5px;color:#64748b;text-transform:uppercase;margin-bottom:8px}
.pm-move-card{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:10px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);margin-bottom:6px;transition:all .15s}
.pm-move-card.pm-new{border-color:var(--mc);background:rgba(255,255,255,.06);box-shadow:0 0 20px rgba(99,102,241,.1)}
.pm-type-pill{font-size:9px;font-weight:700;letter-spacing:1px;text-transform:uppercase;padding:2px 8px;border-radius:4px;color:#fff}
.pm-move-name{flex:1;font-size:14px;font-weight:600;color:#e2e8f0}
.pm-move-stats{font-size:12px;color:#94a3b8}
.pm-current{margin-bottom:16px}
.pm-replaceable{cursor:pointer}
.pm-replaceable:hover{background:rgba(239,68,68,.1);border-color:rgba(239,68,68,.3);transform:translateX(4px)}
.pm-replace-icon{font-size:14px;opacity:.4;transition:opacity .15s}
.pm-replaceable:hover .pm-replace-icon{opacity:1}
.pm-learn-btn{width:100%;padding:12px;border:none;border-radius:10px;background:linear-gradient(135deg,#6366f1,#818cf8);color:#fff;font-family:'Inter',sans-serif;font-size:14px;font-weight:700;cursor:pointer;margin-bottom:8px;transition:transform .15s}
.pm-learn-btn:hover{transform:scale(1.02)}
.pm-skip-btn{width:100%;padding:10px;border:1px solid rgba(255,255,255,.1);border-radius:10px;background:transparent;color:#94a3b8;font-family:'Inter',sans-serif;font-size:13px;font-weight:500;cursor:pointer;transition:all .15s}
.pm-skip-btn:hover{background:rgba(255,255,255,.04);color:#e2e8f0}

/* Market sub-tabs */
.market-nav{display:flex;gap:0;margin-bottom:16px;border-bottom:1px solid rgba(255,255,255,.08)}
.market-sub{flex:1;padding:10px 16px;border:none;background:transparent;color:#64748b;font-family:'Inter',sans-serif;font-size:11px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;cursor:pointer;border-bottom:2px solid transparent;transition:all .2s}
.market-sub:hover{color:#e2e8f0}
.market-sub.active{color:#818cf8;border-bottom-color:#6366f1}
.market-panel{display:none}.market-panel.active{display:block}
/* Marketplace */
.mp-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;flex-wrap:wrap;gap:8px}
.mp-actions{display:flex;gap:8px}
.mp-btn{padding:8px 16px;border:1px solid rgba(99,102,241,.3);border-radius:8px;background:rgba(99,102,241,.08);color:#818cf8;font-family:'Inter',sans-serif;font-size:12px;font-weight:600;cursor:pointer;transition:all .15s}
.mp-btn:hover{background:rgba(99,102,241,.15);border-color:#6366f1}
.mp-sell-btn{border-color:rgba(245,158,11,.3);background:rgba(245,158,11,.08);color:#fbbf24}
.mp-sell-btn:hover{background:rgba(245,158,11,.15)}
.mp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.mp-card{display:flex;align-items:center;gap:12px;padding:12px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:12px;transition:all .15s}
.mp-card:hover{background:rgba(255,255,255,.05);border-color:rgba(99,102,241,.2)}
.mp-card.mp-mine{border-color:rgba(245,158,11,.15)}
.mp-sprite-wrap{width:56px;height:56px;flex-shrink:0}
.mp-sprite{width:56px;height:56px;image-rendering:pixelated}
.mp-info{flex:1;min-width:0}
.mp-name{font-size:14px;font-weight:600;color:#e2e8f0}
.mp-name small{font-weight:400;color:#94a3b8}
.mp-types{display:flex;gap:4px;margin-top:2px}
.mp-seller{font-size:11px;color:#64748b;margin-top:2px}
.mp-price{font-size:16px;font-weight:700;color:#fbbf24;white-space:nowrap}
.mp-buy-btn{padding:6px 14px;border:none;border-radius:8px;background:linear-gradient(135deg,#6366f1,#818cf8);color:#fff;font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap}
.mp-buy-btn:hover{transform:scale(1.05)}
.mp-cancel-btn{padding:6px 12px;border:1px solid rgba(239,68,68,.3);border-radius:8px;background:transparent;color:#f87171;font-size:12px;cursor:pointer}
/* Sell modal */
.sell-list{max-height:400px;overflow-y:auto}
.sell-item{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.05)}
.sell-sprite{width:40px;height:40px;image-rendering:pixelated}
.sell-name{flex:1;font-size:13px;color:#e2e8f0;font-weight:500}
.sell-price-input{width:80px;padding:6px 8px;border:1px solid rgba(255,255,255,.15);border-radius:6px;background:rgba(255,255,255,.05);color:#fff;font-size:13px;text-align:center}
.sell-price-input::placeholder{color:#64748b}
.sell-confirm-btn{padding:6px 12px;border:none;border-radius:6px;background:linear-gradient(135deg,#f59e0b,#fbbf24);color:#1a1d2e;font-size:12px;font-weight:700;cursor:pointer}

/* Prize refresh timer */
.prize-timer{font-family:'Inter',sans-serif;font-size:12px;color:#94a3b8;padding:6px 12px;margin:-4px 0 8px;background:rgba(255,255,255,.03);border-radius:8px;text-align:center;letter-spacing:.3px}
.prize-timer strong{color:#818cf8}

/* Wide 2-column Pokemon modal */
.poke-modal-wide{max-width:680px!important;width:95%!important}
.pm-grid{display:grid;grid-template-columns:240px 1fr;gap:0;min-height:0}
.pm-left{padding:20px;display:flex;flex-direction:column;align-items:center;gap:6px;border-right:1px solid rgba(255,255,255,.06)}
.pm-left .modal-sprite-wrap{width:120px;height:120px;margin:0}
.pm-left .modal-sprite{width:120px;height:120px}
.pm-pname{font-size:18px;font-weight:700;color:#fff;text-align:center;margin:0}
.pm-pname small{font-weight:400;color:#94a3b8;font-size:13px}
.pm-meta{font-size:12px;color:#94a3b8;text-align:center}
.pm-meta strong{color:#e2e8f0}
.pm-left .modal-hp,.pm-left .modal-exp{width:100%;font-size:12px}
.pm-btns{display:flex;gap:6px;width:100%;margin-top:4px}
.pm-btns .modal-party-btn,.pm-btns .modal-rename-btn{flex:1;padding:8px 0;font-size:12px;border-radius:8px}
.pm-left .modal-id{font-size:10px;color:#64748b;text-align:center}
.pm-right{padding:20px;overflow-y:auto;max-height:460px}
.pm-stats-title,.pm-moves-title{font-family:'Inter',sans-serif;font-size:10px;font-weight:600;letter-spacing:1.5px;color:#64748b;text-transform:uppercase;margin-bottom:8px;display:flex;align-items:center;justify-content:space-between}
.pm-stats-title .bst-grade{font-size:11px;font-weight:700}
.pm-moves-title{margin-top:16px}
.pm-right .modal-stats{gap:4px}
.pm-right .ms{gap:6px}
.pm-right .ms-l{min-width:46px;font-size:10px}
.pm-right .ms-v{font-size:12px}
@media(max-width:640px){
  .pm-grid{grid-template-columns:1fr}
  .pm-left{border-right:none;border-bottom:1px solid rgba(255,255,255,.06);padding:16px}
  .pm-left .modal-sprite-wrap{width:80px;height:80px}
  .pm-left .modal-sprite{width:80px;height:80px}
}

/* Fix sprite centering in modal */
.pm-left .modal-sprite-wrap{display:flex;align-items:center;justify-content:center;width:140px;height:140px;margin:0 auto;overflow:hidden}
.pm-left .modal-sprite{width:120px!important;height:120px!important;object-fit:contain;image-rendering:pixelated;margin:0 auto;display:block}
.pm-left{align-items:center;text-align:center;padding:24px 16px}
.pm-pname{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}

/* Party bar — team slots with sprites, names, HP */
.team-slot{width:88px;border-radius:12px;border:2px solid rgba(255,255,255,.08);background:rgba(15,20,35,.85);cursor:pointer;position:relative;overflow:visible;display:flex;flex-direction:column;align-items:center;padding:6px 4px 4px;transition:all .2s;gap:1px}
.team-slot:hover:not(.fainted){border-color:var(--accent,#6c8cff);transform:translateY(-3px);box-shadow:0 4px 12px rgba(108,140,255,.15)}
.team-slot.active{border-color:#6c8cff;box-shadow:0 0 14px rgba(108,140,255,.3);background:rgba(108,140,255,.1)}
.team-slot.fainted{opacity:.3;border-color:#ef4444;cursor:default;filter:grayscale(.6)}
.ts-active-tag{position:absolute;top:-10px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,#6366f1,#818cf8);color:#fff;font-size:7px;font-weight:800;letter-spacing:.8px;padding:2px 8px;border-radius:6px;z-index:2;white-space:nowrap;text-transform:uppercase;box-shadow:0 2px 8px rgba(99,102,241,.4)}
.ts-sprite-wrap{width:52px;height:52px;display:flex;align-items:center;justify-content:center}
.ts-sprite{width:52px;height:52px;image-rendering:auto;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(0,0,0,.4))}
.team-slot:hover:not(.fainted) .ts-sprite{transform:scale(1.1)}
.team-slot.fainted .ts-sprite{filter:grayscale(1) brightness(.5)}
.ts-name{font-size:9px;font-weight:700;color:#e2e8f0;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;line-height:1.2}
.ts-hp-bar{width:100%;height:3px;background:rgba(255,255,255,.1);border-radius:2px;overflow:hidden}
.ts-hp-fill{height:100%;border-radius:2px;transition:width .3s}
.ts-hp-text{font-size:8px;color:#94a3b8;text-align:center;line-height:1}

/* Status effect popups */
.status-popup{position:absolute;top:10%;left:50%;transform:translateX(-50%);font-size:14px;font-weight:900;letter-spacing:1px;z-index:20;animation:statusPopAnim 1.5s ease forwards;pointer-events:none;white-space:nowrap;text-transform:uppercase}
@keyframes statusPopAnim{0%{opacity:0;transform:translateX(-50%) translateY(10px) scale(.8)}15%{opacity:1;transform:translateX(-50%) translateY(0) scale(1.1)}30%{transform:translateX(-50%) translateY(-5px) scale(1)}80%{opacity:1}100%{opacity:0;transform:translateX(-50%) translateY(-20px)}}
.status-dmg-pop{position:absolute;top:30%;left:50%;transform:translateX(-50%);font-size:16px;font-weight:900;z-index:20;animation:statusDmgAnim 1.2s ease forwards;pointer-events:none}
@keyframes statusDmgAnim{0%{opacity:0;transform:translateX(-50%) translateY(0)}20%{opacity:1;transform:translateX(-50%) translateY(-10px)}100%{opacity:0;transform:translateX(-50%) translateY(-30px)}}
/* Status tags on sprites */
.status-tag{display:inline-block;font-size:8px;font-weight:800;padding:2px 6px;border-radius:4px;text-transform:uppercase;letter-spacing:.5px;color:#fff;margin-bottom:2px}
.st-burn{background:#f08030;box-shadow:0 0 6px rgba(240,128,48,.4)}
.st-poison,.st-badly_poisoned{background:#a040a0;box-shadow:0 0 6px rgba(160,64,160,.4)}
.st-paralysis{background:#f8d030;color:#333;box-shadow:0 0 6px rgba(248,208,48,.4)}
.st-sleep{background:#705898;box-shadow:0 0 6px rgba(112,88,152,.4)}
.st-freeze{background:#98d8d8;color:#333;box-shadow:0 0 6px rgba(152,216,216,.4)}
.st-confusion{background:#f85888;box-shadow:0 0 6px rgba(248,88,136,.4)}
.st-flinch{background:#705848;box-shadow:0 0 6px rgba(112,88,72,.4)}
.st-trapped{background:#c03028;box-shadow:0 0 6px rgba(192,48,40,.4)}
.st-leech_seed,.st-leech{background:#78c850;color:#333;box-shadow:0 0 6px rgba(120,200,80,.4)}
.st-curse{background:#705898;box-shadow:0 0 6px rgba(112,88,152,.4)}

/* Stat stage icons (persistent buff/debuff indicators) */
.stage-icons{display:flex;gap:3px;flex-wrap:wrap;margin-top:3px;justify-content:center}
.stage-icons span{font-size:9px;font-weight:800;padding:1px 4px;border-radius:4px;line-height:1.2;letter-spacing:.3px}
.stage-up{background:rgba(34,197,94,.2);color:#22c55e;border:1px solid rgba(34,197,94,.3);text-shadow:0 0 4px rgba(34,197,94,.4)}
.stage-down{background:rgba(239,68,68,.2);color:#ef4444;border:1px solid rgba(239,68,68,.3);text-shadow:0 0 4px rgba(239,68,68,.4)}

/* Stat change popup (floating ▲ATK / ▼DEF) */
.stat-popup{position:absolute;top:15%;left:50%;transform:translateX(-50%);font-size:13px;font-weight:900;z-index:25;pointer-events:none;animation:statPopFloat 1.2s ease forwards;white-space:nowrap;text-transform:uppercase;letter-spacing:.5px;padding:3px 8px;border-radius:6px}
.stat-up{color:#22c55e;background:rgba(34,197,94,.15);border:1px solid rgba(34,197,94,.3);text-shadow:0 0 8px rgba(34,197,94,.5)}
.stat-down{color:#ef4444;background:rgba(239,68,68,.15);border:1px solid rgba(239,68,68,.3);text-shadow:0 0 8px rgba(239,68,68,.5)}
@keyframes statPopFloat{0%{opacity:0;transform:translateX(-50%) translateY(10px) scale(.8)}15%{opacity:1;transform:translateX(-50%) translateY(0) scale(1.1)}30%{transform:translateX(-50%) translateY(-5px) scale(1)}80%{opacity:1}100%{opacity:0;transform:translateX(-50%) translateY(-25px)}}

/* Heal popup */
.heal-popup{position:absolute;top:20%;left:50%;transform:translateX(-50%);font-size:14px;font-weight:900;color:#22c55e;z-index:25;pointer-events:none;animation:statPopFloat 1s ease forwards;text-shadow:0 0 8px rgba(34,197,94,.5)}

/* Log stat colors */
.log-stat-up{color:#22c55e}
.log-stat-down{color:#ef4444}
.log-heal{color:#22c55e}


/* ═══ SAFARI ZONE ═══ */
.safari-tab{color:rgba(255,255,255,.4)!important}
.safari-view{display:none}.safari-view:not(.hidden){display:block}
.safari-hero{text-align:center;padding:40px 20px;background:linear-gradient(135deg,rgba(34,197,94,.08),rgba(16,185,129,.05));border-radius:16px;border:1px solid rgba(34,197,94,.15)}
.safari-hero-icon{font-size:48px;margin-bottom:12px}
.safari-hero h2{font-size:24px;margin:0 0 8px;color:#22c55e}
.safari-hero p{color:#999;margin:0 0 20px;font-size:14px}
.safari-search-btn{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;border:none;padding:14px 32px;border-radius:12px;font-size:16px;font-weight:700;cursor:pointer;transition:all .3s;box-shadow:0 4px 15px rgba(34,197,94,.3)}
.safari-search-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(34,197,94,.4)}
.safari-balls-preview{margin-top:20px;display:flex;justify-content:center;gap:12px;flex-wrap:wrap}
.safari-balls-preview .ball-item{background:rgba(255,255,255,.05);padding:8px 14px;border-radius:8px;font-size:13px;border:1px solid rgba(255,255,255,.08)}
.safari-battle-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.safari-badge{background:linear-gradient(135deg,#22c55e,#16a34a);padding:6px 14px;border-radius:8px;font-size:12px;font-weight:800}
.safari-run-btn{background:rgba(239,68,68,.15);border:1px solid rgba(239,68,68,.3);color:#ef4444;padding:6px 14px;border-radius:8px;font-size:12px;cursor:pointer}
#safari-wild-side .battle-sprite{max-width:120px;max-height:120px;width:auto;height:auto;object-fit:contain}
/* Capture panel */
.safari-capture-panel{text-align:center;background:rgba(30,30,40,.9);border-radius:16px;border:1px solid rgba(34,197,94,.2);padding:30px;max-width:500px;margin:20px auto}
.safari-capture-panel h3{font-size:20px;margin:0 0 16px;color:#22c55e}
.safari-capture-preview{display:flex;justify-content:center;margin:16px 0}
.safari-capture-preview img{width:100px;height:100px;object-fit:contain}
.ball-selector{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:16px 0}
.ball-option{background:rgba(255,255,255,.05);border:2px solid rgba(255,255,255,.1);border-radius:12px;padding:10px 16px;cursor:pointer;text-align:center;transition:all .2s;min-width:80px}
.ball-option:hover,.ball-option.selected{border-color:#22c55e;background:rgba(34,197,94,.1);transform:translateY(-2px)}
.ball-option .ball-icon{font-size:24px}
.ball-option .ball-name{font-size:11px;color:#ccc;margin-top:4px}
.ball-option .ball-qty{font-size:10px;color:#888}
.capture-qty{margin:16px 0;display:flex;align-items:center;justify-content:center;gap:10px}
.capture-qty label{color:#ccc;font-size:13px}
.qty-input{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);color:#fff;border-radius:8px;padding:8px 12px;width:60px;text-align:center;font-size:14px}
.capture-actions{display:flex;gap:12px;justify-content:center;margin-top:16px}
.capture-btn{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;border:none;padding:12px 28px;border-radius:12px;font-size:15px;font-weight:700;cursor:pointer;transition:all .3s}
.capture-btn:hover{transform:translateY(-2px);box-shadow:0 4px 15px rgba(239,68,68,.3)}
.skip-btn{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.15);color:#ccc;padding:12px 28px;border-radius:12px;font-size:15px;cursor:pointer}
/* Result panel */
.safari-result-panel{text-align:center;padding:40px 20px;max-width:500px;margin:20px auto}
.safari-result-panel h2{font-size:24px;margin:0 0 16px}
.safari-result-panel img{width:120px;height:120px;object-fit:contain;margin:12px auto}
.safari-result-panel .result-info{color:#ccc;font-size:14px;margin:8px 0}
/* Ball shake animation */
.ball-shake{animation:ballShake 0.5s ease;display:inline-block}
@keyframes ballShake{0%,100%{transform:rotate(0)}25%{transform:rotate(-20deg)}50%{transform:rotate(20deg)}75%{transform:rotate(-10deg)}}
.ball-attempt{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:8px;margin:4px;font-size:13px;background:rgba(255,255,255,.05)}
.ball-attempt.success{background:rgba(34,197,94,.15);color:#22c55e}
.ball-attempt.fail{background:rgba(239,68,68,.1);color:#ef4444}
.attempts-display{display:flex;flex-wrap:wrap;justify-content:center;gap:4px;margin:16px 0}

/* ═══ POKÉBALLS SHOP ═══ */
.balls-shop-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 16px;
  padding: 16px 0;
}
.ball-shop-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 14px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  transition: all 0.25s;
  position: relative;
  overflow: hidden;
}
.ball-shop-card:hover {
  border-color: rgba(255,255,255,0.2);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.3);
}
.ball-shop-icon {
  font-size: 48px;
  filter: drop-shadow(0 4px 12px rgba(0,0,0,0.4));
}
.ball-shop-name {
  font-weight: 700;
  font-size: 16px;
  color: #fff;
}
.ball-shop-rate {
  font-size: 12px;
  color: rgba(255,255,255,0.5);
}
.ball-shop-price {
  font-size: 14px;
  font-weight: 600;
  color: #60a5fa;
}
.ball-shop-owned {
  font-size: 12px;
  color: rgba(255,255,255,0.4);
}
.ball-shop-qty {
  display: flex;
  align-items: center;
  gap: 8px;
}
.ball-shop-qty input {
  width: 50px;
  text-align: center;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 8px;
  color: #fff;
  font-size: 14px;
  padding: 4px;
}
.ball-buy-btn {
  background: linear-gradient(135deg, #3b82f6, #8b5cf6);
  border: none;
  color: #fff;
  padding: 8px 20px;
  border-radius: 10px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  font-size: 13px;
}
.ball-buy-btn:hover {
  transform: scale(1.05);
  box-shadow: 0 4px 16px rgba(99,102,241,0.4);
}
.ball-buy-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
  transform: none;
}
.ball-rarity-badge {
  position: absolute;
  top: 8px;
  right: 8px;
  font-size: 10px;
  padding: 2px 8px;
  border-radius: 6px;
  font-weight: 600;
  text-transform: uppercase;
}
.ball-rarity-common { background: rgba(96,165,250,0.2); color: #60a5fa; }
.ball-rarity-great { background: rgba(52,211,153,0.2); color: #34d399; }
.ball-rarity-ultra { background: rgba(251,191,36,0.2); color: #fbbf24; }
.ball-rarity-master { background: rgba(167,139,250,0.2); color: #a78bfa; }

.ball-section-title {
  grid-column: 1 / -1;
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  padding: 12px 0 4px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  margin-bottom: 4px;
}
.ball-section-grid {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}
.ball-shop-sprite {
  width: 48px;
  height: 48px;
  image-rendering: pixelated;
  filter: drop-shadow(0 2px 8px rgba(0,0,0,0.5));
}
.ball-shop-condition {
  font-size: 11px;
  color: #fbbf24;
  text-align: center;
  line-height: 1.3;
  min-height: 28px;
}

.ball-icon-sprite {
  width: 36px;
  height: 36px;
  image-rendering: pixelated;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,0.5));
}
.ball-rate {
  font-size: 10px;
  color: #fbbf24;
}

.ball-no-effect {
  opacity: 0.6;
  border-color: rgba(251,191,36,0.15);
}
.ball-no-effect:hover { opacity: 0.8; }
.ball-noeffect-badge {
  position: absolute;
  top: 6px;
  right: 6px;
  font-size: 9px;
  padding: 2px 7px;
  border-radius: 6px;
  font-weight: 600;
  background: rgba(251,146,60,0.2);
  color: #fb923c;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}

.item-sprite {
  width: 32px;
  height: 32px;
  image-rendering: pixelated;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,0.4));
}

/* ═══ BALL CONFIRM MODAL ═══ */
.ball-confirm-overlay {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,0,0,0.7);
  backdrop-filter: blur(4px);
  display: flex; align-items: center; justify-content: center;
  animation: fadeIn 0.15s ease;
}
.ball-confirm-modal {
  background: #1a1a2e;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 18px;
  padding: 28px 32px;
  min-width: 300px;
  max-width: 380px;
  text-align: center;
  box-shadow: 0 20px 60px rgba(0,0,0,0.6);
  animation: scaleIn 0.2s ease;
}
@keyframes scaleIn { from { transform: scale(0.9); opacity: 0; } to { transform: scale(1); opacity: 1; } }
.ball-confirm-sprite {
  width: 64px; height: 64px;
  image-rendering: pixelated;
  filter: drop-shadow(0 4px 16px rgba(99,102,241,0.4));
  margin-bottom: 8px;
}
.ball-confirm-modal h3 {
  margin: 0 0 16px; font-size: 18px; color: #fff; font-weight: 700;
}
.ball-confirm-item {
  font-size: 15px; color: #a78bfa; font-weight: 600; margin-bottom: 14px;
}
.ball-confirm-details {
  background: rgba(255,255,255,0.04);
  border-radius: 10px;
  padding: 12px 16px;
  margin-bottom: 20px;
}
.ball-confirm-row {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 13px; color: rgba(255,255,255,0.6); padding: 4px 0;
}
.ball-confirm-divider {
  height: 1px; background: rgba(255,255,255,0.08); margin: 8px 0;
}
.ball-confirm-total {
  font-size: 16px !important; font-weight: 700; color: #fff !important;
}
.ball-confirm-total span:last-child { color: #60a5fa; }
.ball-confirm-buttons {
  display: flex; gap: 10px;
}
.ball-confirm-cancel {
  flex: 1; padding: 10px; border-radius: 10px;
  background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1);
  color: rgba(255,255,255,0.6); font-weight: 600; cursor: pointer;
  transition: all 0.2s; font-size: 13px;
}
.ball-confirm-cancel:hover { background: rgba(255,255,255,0.1); color: #fff; }
.ball-confirm-ok {
  flex: 1; padding: 10px; border-radius: 10px;
  background: linear-gradient(135deg, #3b82f6, #8b5cf6);
  border: none; color: #fff; font-weight: 600; cursor: pointer;
  transition: all 0.2s; font-size: 13px;
}
.ball-confirm-ok:hover { transform: scale(1.03); box-shadow: 0 4px 16px rgba(99,102,241,0.4); }

/* ═══ CAPTURE ANIMATION ═══ */
.capture-anim-overlay {
  position:fixed;inset:0;z-index:9999;
  background:radial-gradient(ellipse at center,#0a0a1a 0%,#000 100%);
  display:flex;align-items:center;justify-content:center;
  animation:fadeIn .3s ease;
}
.capture-anim-scene {
  display:flex;flex-direction:column;align-items:center;gap:16px;
  min-width:320px;max-width:400px;
}
.capture-anim-poke {
  transition:all .6s ease;
}
.capture-anim-poke img { width:120px;height:120px;image-rendering:pixelated; }
.capture-anim-poke.poke-shrink { transform:scale(0);opacity:0;transition:all .5s ease-in; }
.capture-anim-poke.poke-breakfree { transform:scale(1.2);opacity:1;animation:breakFree .6s ease; }
@keyframes breakFree { 0%{transform:scale(0);opacity:0} 50%{transform:scale(1.3)} 100%{transform:scale(1)} }
.capture-anim-ball {
  width:50px;height:50px;display:flex;align-items:center;justify-content:center;
  font-size:32px;opacity:0;transition:all .3s ease;
}
.capture-anim-ball.ball-throw { opacity:1;animation:throwBall .7s ease-out; }
@keyframes throwBall { 0%{transform:translateY(200px) scale(.3);opacity:0} 60%{transform:translateY(-20px) scale(1.1)} 100%{transform:translateY(0) scale(1);opacity:1} }
.capture-anim-ball.ball-landed { opacity:1;transform:translateY(0); }
.capture-anim-ball.ball-shake-right { opacity:1;animation:shakeR .35s ease; }
.capture-anim-ball.ball-shake-left { opacity:1;animation:shakeL .35s ease; }
@keyframes shakeR { 0%{transform:rotate(0)} 25%{transform:rotate(20deg)} 75%{transform:rotate(-5deg)} 100%{transform:rotate(0)} }
@keyframes shakeL { 0%{transform:rotate(0)} 25%{transform:rotate(-20deg)} 75%{transform:rotate(5deg)} 100%{transform:rotate(0)} }
.capture-anim-ball.ball-click { opacity:1;animation:clickBall .4s ease; }
@keyframes clickBall { 0%{transform:scale(1)} 30%{transform:scale(.85)} 60%{transform:scale(1.05)} 100%{transform:scale(1)} }
.capture-anim-ball.ball-break { opacity:1;animation:breakBall .5s ease-out forwards; }
@keyframes breakBall { 0%{transform:scale(1);opacity:1} 50%{transform:scale(1.3);opacity:.7} 100%{transform:scale(0);opacity:0} }
.capture-anim-log {
  background:rgba(255,255,255,.04);border-radius:12px;padding:12px 16px;
  max-height:120px;overflow-y:auto;width:100%;font-size:12px;color:rgba(255,255,255,.5);
}
.cap-log-line { padding:2px 0; }
.cap-fail { color:#ef4444; }
.cap-success { color:#22c55e;font-weight:700; }

/* Capture preview */
.capture-poke-img { width:96px;height:96px;image-rendering:pixelated;filter:drop-shadow(0 4px 16px rgba(99,102,241,.4)); }
.capture-poke-name { font-size:18px;font-weight:700;color:#fff;margin-top:8px; }
.capture-poke-lv { font-size:14px;color:rgba(255,255,255,.5);font-weight:400; }

/* Result animations */
.result-caught,.result-escaped { text-align:center;padding:20px; }
.result-poke-img { width:128px;height:128px;image-rendering:pixelated;margin:12px 0; }
.caught-bounce { animation:caughtBounce 1s ease infinite; }
@keyframes caughtBounce { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-12px)} }
.escaped-fade { opacity:.4;filter:grayscale(1); }
.result-name { font-size:20px;font-weight:700;color:#fff;margin:8px 0; }
.result-name span { font-size:14px;color:rgba(255,255,255,.4); }
.result-stat { font-size:13px;color:rgba(255,255,255,.4);margin-bottom:16px; }
.result-sparkles { position:absolute;inset:0;pointer-events:none;overflow:hidden; }
.glow-btn { box-shadow:0 0 20px rgba(99,102,241,.4);animation:glowPulse 2s ease infinite; }
@keyframes glowPulse { 0%,100%{box-shadow:0 0 20px rgba(99,102,241,.3)} 50%{box-shadow:0 0 30px rgba(99,102,241,.6)} }

/* Status badges */
.status-badge {
  display:inline-block;font-size:9px;font-weight:700;padding:1px 6px;border-radius:4px;
  margin:2px 0;letter-spacing:0.5px;text-transform:uppercase;
}
.status-burn { background:#ef4444;color:#fff; }
.status-poison,.status-badly_poisoned { background:#a855f7;color:#fff; }
.status-paralysis { background:#eab308;color:#000; }
.status-sleep { background:#6b7280;color:#fff; }
.status-freeze { background:#38bdf8;color:#000; }
.status-confusion { background:#f472b6;color:#fff; }


/* ═══ BATTLE BACKGROUNDS ═══ */
#safari-field {
  background: 
    linear-gradient(rgba(0,0,0,0.35), rgba(0,0,0,0.2) 40%, rgba(0,0,0,0.3)),
    url('/bg-safari.png') center / cover no-repeat;
  border-radius: 14px;
}
#safari-field .slot-info,
#safari-field .slot-name {
  text-shadow: 0 1px 4px rgba(0,0,0,0.8);
}
#safari-field .hp-bar {
  background: rgba(0,0,0,0.5);
  border: 1px solid rgba(255,255,255,0.15);
}
#safari-field .hp-text {
  text-shadow: 0 1px 3px rgba(0,0,0,0.9);
}
#battle-field {
  background: url('/bg-cave.png') center bottom / cover no-repeat;
  border-radius: 14px;
}

#safari-field .slot-name { color: white !important; font-weight: bold; text-shadow: 1px 1px 2px black !important; }
#safari-field .slot-name small { color: white !important; font-weight: bold; text-shadow: 1px 1px 2px black !important; }
#safari-field .hp-text { color: white !important; font-weight: bold; text-shadow: 1px 1px 2px black !important; }


/* ---- Pending Moves Tab ---- */
.pending-moves-list { display:flex; flex-direction:column; gap:16px; }
.pending-poke-card {
  background:rgba(30,41,59,0.8); border:1px solid rgba(100,116,139,0.3); border-radius:14px;
  padding:16px; backdrop-filter:blur(8px);
}
.pending-poke-header {
  display:flex; align-items:center; gap:12px; margin-bottom:12px; padding-bottom:12px;
  border-bottom:1px solid rgba(100,116,139,0.2);
}
.pending-poke-header img { width:48px; height:48px; image-rendering:pixelated; }
.pending-poke-header .poke-info { flex:1; }
.pending-poke-header .poke-name { font-weight:700; color:#f8fafc; font-size:15px; }
.pending-poke-header .poke-level { color:#94a3b8; font-size:13px; }
.pending-poke-current {
  display:grid; grid-template-columns:repeat(2,1fr); gap:6px; margin-bottom:12px;
}
.current-move-slot {
  background:rgba(51,65,85,0.6); border:1px solid rgba(100,116,139,0.2); border-radius:8px;
  padding:6px 10px; font-size:12px; color:#cbd5e1; display:flex; align-items:center; gap:6px;
}
.current-move-slot .move-slot-num { color:#475569; font-weight:700; font-size:10px; min-width:14px; }
.current-move-slot .move-name { flex:1; }
.pending-move-row {
  background:linear-gradient(135deg,rgba(34,197,94,0.1),rgba(16,185,129,0.05));
  border:1px solid rgba(34,197,94,0.3); border-radius:10px; padding:12px; margin-top:8px;
}
.pending-move-row .new-move-label { color:#22c55e; font-weight:700; font-size:13px; margin-bottom:8px; }
.pending-move-row .new-move-name { font-size:15px; font-weight:600; color:#f8fafc; }
.pending-move-row .new-move-meta { font-size:12px; color:#94a3b8; margin-top:4px; }
.pending-move-actions { display:flex; gap:8px; margin-top:10px; flex-wrap:wrap; }
.pending-move-actions button {
  padding:6px 14px; border-radius:8px; border:none; font-size:12px; font-weight:600; cursor:pointer;
  transition:all 0.2s;
}
.pending-move-actions .replace-btn {
  background:rgba(59,130,246,0.2); color:#60a5fa; border:1px solid rgba(59,130,246,0.3);
}
.pending-move-actions .replace-btn:hover { background:rgba(59,130,246,0.4); }
.pending-move-actions .add-btn {
  background:rgba(34,197,94,0.2); color:#22c55e; border:1px solid rgba(34,197,94,0.3);
}
.pending-move-actions .add-btn:hover { background:rgba(34,197,94,0.4); }
.pending-move-actions .skip-btn {
  background:rgba(239,68,68,0.15); color:#ef4444; border:1px solid rgba(239,68,68,0.2);
}
.pending-move-actions .skip-btn:hover { background:rgba(239,68,68,0.3); }
.moves-tab.has-pending { border-left:3px solid #22c55e !important; }
.pending-move-badge {
  background:#22c55e; color:#000; border-radius:10px; font-size:10px; font-weight:700;
  padding:1px 6px; margin-left:6px; display:inline-block;
}
.no-pending-moves {
  text-align:center; color:#64748b; padding:60px 20px; font-size:15px;
}
.no-pending-moves .no-moves-icon { font-size:48px; margin-bottom:12px; display:block; }

/* ═══ EPIC ENTRANCES (SAFARI) ═══ */
.epic-legendary img.battle-sprite {
  animation: legendaryEntrance 2s ease-out forwards;
  filter: drop-shadow(0 0 20px rgba(255, 215, 0, 0.8));
}
.epic-ultrabeast img.battle-sprite {
  animation: ubEntrance 2s cubic-bezier(0.68, -0.55, 0.27, 1.55) forwards;
  filter: drop-shadow(0 0 20px rgba(138, 43, 226, 0.8)) hue-rotate(45deg);
}
@keyframes legendaryEntrance {
  0% { transform: translateY(-200px) scale(0.1); opacity: 0; }
  50% { transform: translateY(20px) scale(1.2); opacity: 1; filter: drop-shadow(0 0 40px rgba(255, 255, 255, 1)); }
  70% { transform: translateY(-10px) scale(0.9); }
  100% { transform: translateY(0) scale(1); filter: drop-shadow(0 0 20px rgba(255, 215, 0, 0.8)); }
}
@keyframes ubEntrance {
  0% { transform: scale(3) rotate(45deg); opacity: 0; filter: blur(10px); }
  50% { transform: scale(0.5) rotate(-15deg); opacity: 1; filter: blur(0px); }
  100% { transform: scale(1) rotate(0deg); }
}


/* ==========================
   ADMIN PANEL (PREMIUM)
   ========================== */
.admin-user-card {
  background: rgba(15, 23, 42, 0.7);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 12px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  backdrop-filter: blur(8px);
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
  transition: transform 0.2s, box-shadow 0.2s;
}
.admin-user-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.3);
  border-color: rgba(255, 255, 255, 0.2);
}
.auc-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.auc-avatar-wrap {
  width: 48px;
  height: 48px;
  background: rgba(255, 255, 255, 0.05);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.auc-avatar-wrap .ow-sprite-avatar {
  width: 32px;
  height: 32px;
  background-size: cover;
  image-rendering: pixelated;
}
.auc-online-dot { color: #22c55e; font-size: 10px; margin-right: 4px; text-shadow: 0 0 6px rgba(34,197,94,0.6); }
.auc-offline-dot { color: #475569; font-size: 10px; margin-right: 4px; }

/* ==========================
   ADMIN PANEL (PREMIUM)
   ========================== */

/* Header bar */
.admin-header-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 24px;
  padding: 20px 24px;
  background: linear-gradient(135deg, rgba(255,111,242,.06), rgba(167,139,250,.04));
  border: 1px solid rgba(255,111,242,.15);
  border-radius: 16px;
  flex-wrap: wrap;
}
.admin-header-left {
  display: flex;
  align-items: center;
  gap: 14px;
}
.admin-icon-wrap {
  width: 48px;
  height: 48px;
  background: linear-gradient(135deg, rgba(255,111,242,.15), rgba(167,139,250,.1));
  border: 1px solid rgba(255,111,242,.3);
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  flex-shrink: 0;
}
.admin-title {
  font-size: 22px;
  font-weight: 900;
  margin: 0;
  background: linear-gradient(135deg, #ff6ff2, #a78bfa);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.admin-subtitle {
  font-size: 12px;
  color: #94a3b8;
  margin: 2px 0 0;
}
.admin-stats-mini {
  display: flex;
  gap: 10px;
}
.admin-stat-chip {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 8px 16px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  min-width: 70px;
}
.admin-stat-num {
  font-size: 20px;
  font-weight: 900;
  color: #ff6ff2;
}
.admin-stat-label {
  font-size: 9px;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 700;
}

/* Search bar */
.admin-search-bar {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}
.admin-search-input-wrap {
  flex: 1;
  min-width: 200px;
  position: relative;
}
.admin-search-icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  color: #64748b;
  pointer-events: none;
}
.admin-search-input {
  width: 100%;
  padding: 12px 14px 12px 42px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,111,242,.2);
  border-radius: 12px;
  color: #e2e8f0;
  font-size: 14px;
  outline: none;
  transition: border-color .2s, box-shadow .2s;
  box-sizing: border-box;
}
.admin-search-input:focus {
  border-color: #ff6ff2;
  box-shadow: 0 0 16px rgba(255,111,242,.12);
}
.admin-search-input::placeholder {
  color: #64748b;
}
.admin-search-btn {
  padding: 12px 22px;
  background: linear-gradient(135deg, #ff3e9d, #ff6ff2);
  border: none;
  border-radius: 12px;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: transform .2s, box-shadow .2s;
  display: flex;
  align-items: center;
  gap: 6px;
  box-shadow: 0 4px 14px rgba(255,62,157,.25);
}
.admin-search-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(255,62,157,.35);
}
.admin-showall-btn {
  padding: 12px 18px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 12px;
  color: #94a3b8;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: .2s;
}
.admin-showall-btn:hover {
  background: rgba(255,255,255,.08);
  color: #fff;
  border-color: rgba(255,255,255,.2);
}

/* Users grid */
.admin-users-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 12px;
  max-height: 65vh;
  overflow-y: auto;
  padding-right: 4px;
}

/* Empty state */
.admin-empty-state {
  grid-column: 1 / -1;
  text-align: center;
  padding: 60px 20px;
  color: #64748b;
}
.admin-empty-icon {
  font-size: 48px;
  margin-bottom: 12px;
  opacity: .5;
}
.admin-empty-state p {
  font-size: 14px;
  margin: 0;
}
.admin-empty-state strong {
  color: #ff6ff2;
}

/* User cards */
.admin-user-card {
  background: linear-gradient(145deg, rgba(15, 23, 42, 0.8), rgba(10, 14, 26, 0.9));
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  backdrop-filter: blur(8px);
  transition: transform 0.25s, box-shadow 0.25s, border-color 0.25s;
}
.admin-user-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.35), 0 0 20px rgba(255,111,242,.06);
  border-color: rgba(255,111,242,.2);
}

/* Card header */
.auc-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.auc-avatar-wrap {
  width: 44px;
  height: 44px;
  background: linear-gradient(135deg, rgba(255,111,242,.1), rgba(167,139,250,.1));
  border: 1px solid rgba(255,111,242,.2);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex-shrink: 0;
}
.auc-avatar-wrap .ow-sprite-avatar {
  width: 32px;
  height: 32px;
  background-size: cover;
  image-rendering: pixelated;
}
.auc-info {
  flex: 1;
  min-width: 0;
}
.auc-name {
  font-size: 15px;
  font-weight: 700;
  color: #f8fafc;
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.auc-id {
  font-size: 11px;
  color: #475569;
  font-weight: 500;
}
.auc-role {
  font-size: 11px;
  font-weight: 700;
  margin-top: 2px;
  letter-spacing: .3px;
}
.auc-stats {
  display: flex;
  gap: 14px;
  font-size: 12px;
  color: #94a3b8;
}
.auc-stats span {
  display: flex;
  align-items: center;
  gap: 4px;
}
.auc-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.auc-btn {
  padding: 7px 12px;
  border-radius: 8px;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s;
  display: flex;
  align-items: center;
  gap: 4px;
  border: 1px solid;
  letter-spacing: .2px;
}
.auc-btn:hover {
  transform: translateY(-1px);
}
.auc-btn.diam { background: rgba(0, 229, 255, 0.1); color: #00e5ff; border-color: rgba(0, 229, 255, 0.25); }
.auc-btn.diam:hover { background: rgba(0, 229, 255, 0.2); box-shadow: 0 4px 12px rgba(0, 229, 255, .15); }
.auc-btn.item { background: rgba(250, 204, 21, 0.1); color: #facc15; border-color: rgba(250, 204, 21, 0.25); }
.auc-btn.item:hover { background: rgba(250, 204, 21, 0.2); box-shadow: 0 4px 12px rgba(250, 204, 21, .15); }
.auc-btn.poke { background: rgba(34, 197, 94, 0.1); color: #22c55e; border-color: rgba(34, 197, 94, 0.25); }
.auc-btn.poke:hover { background: rgba(34, 197, 94, 0.2); box-shadow: 0 4px 12px rgba(34, 197, 94, .15); }
.auc-btn.del { background: rgba(239, 68, 68, 0.1); color: #ef4444; border-color: rgba(239, 68, 68, 0.25); margin-left: auto; }
.auc-btn.del:hover { background: rgba(239, 68, 68, 0.2); box-shadow: 0 4px 12px rgba(239, 68, 68, .15); }

/* Admin tab button in sidebar */
.admin-tab { border-left: 2px solid transparent !important; border-top: 1px solid rgba(255,111,242,.06) !important; }
.admin-tab:hover { color: #ff6ff2 !important; background: rgba(255,111,242,.04) !important; border-left-color: rgba(255,111,242,.4) !important; }
.admin-tab.active { color: #ff6ff2 !important; background: linear-gradient(90deg,rgba(255,111,242,.08),transparent) !important; border-left-color: #ff6ff2 !important; text-shadow: 0 0 12px rgba(255,111,242,.4) !important; }

/* Admin backup button */
.admin-backup-btn {
  padding: 8px 16px;
  border-radius: 10px;
  border: 1px solid rgba(34,197,94,0.3);
  background: rgba(34,197,94,0.1);
  color: #22c55e;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s;
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}
.admin-backup-btn:hover {
  background: rgba(34,197,94,0.2);
  box-shadow: 0 4px 16px rgba(34,197,94,0.15);
  transform: translateY(-1px);
}
.admin-backup-btn:disabled {
  opacity: 0.6;
  cursor: wait;
}

/* ===== MISSIONS TAB ===== */
.missions-tab { border-left: 2px solid transparent !important; border-top: 1px solid rgba(251,191,36,.06) !important; }
.missions-tab:hover { color: #fbbf24 !important; background: rgba(251,191,36,.04) !important; border-left-color: rgba(251,191,36,.4) !important; }
.missions-tab.active { color: #fbbf24 !important; background: linear-gradient(90deg,rgba(251,191,36,.08),transparent) !important; border-left-color: #fbbf24 !important; text-shadow: 0 0 12px rgba(251,191,36,.4) !important; }

.missions-sub { color: #94a3b8; font-size: 14px; margin: 0 0 16px; }

.missions-timer {
  background: linear-gradient(135deg, rgba(99,102,241,0.15), rgba(139,92,246,0.1));
  border: 1px solid rgba(139,92,246,0.3); border-radius: 12px;
  padding: 10px 16px; margin-bottom: 20px; display: flex; gap: 20px;
  align-items: center; font-size: 13px; color: #c4b5fd; flex-wrap: wrap;
}
.missions-timer .timer-item { display: flex; align-items: center; gap: 6px; }
.missions-timer .timer-icon { font-size: 16px; }
.missions-timer .timer-label { color: #94a3b8; }
.missions-timer .timer-value { font-weight: 700; color: #e2e8f0; font-variant-numeric: tabular-nums; }

.missions-section { margin-bottom: 24px; }
.missions-section-title {
  font-size: 16px; font-weight: 700; color: #e2e8f0; margin: 0 0 12px;
  padding-bottom: 8px; border-bottom: 1px solid rgba(255,255,255,0.06);
}

.missions-grid { display: flex; flex-direction: column; gap: 12px; }

.mission-card {
  background: linear-gradient(135deg, rgba(255,255,255,0.04), rgba(255,255,255,0.01));
  border: 1px solid rgba(255,255,255,0.08); border-radius: 14px; padding: 16px;
  display: flex; align-items: center; gap: 14px;
  transition: all 0.3s ease; position: relative; overflow: hidden;
}
.mission-card::before {
  content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px;
  background: var(--mission-accent, #a78bfa); border-radius: 4px 0 0 4px;
}
.mission-card:hover {
  background: linear-gradient(135deg, rgba(255,255,255,0.06), rgba(255,255,255,0.02));
  border-color: rgba(255,255,255,0.15); transform: translateY(-1px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.3);
}
.mission-card.completed { border-color: rgba(34,197,94,0.3); background: linear-gradient(135deg, rgba(34,197,94,0.06), rgba(34,197,94,0.02)); }
.mission-card.claimed { opacity: 0.55; border-color: rgba(255,255,255,0.05); }

.mission-icon {
  width: 48px; height: 48px; border-radius: 12px; display: flex;
  align-items: center; justify-content: center; font-size: 24px;
  background: rgba(255,255,255,0.05); flex-shrink: 0;
}

.mission-info { flex: 1; min-width: 0; }
.mission-name { font-size: 14px; font-weight: 600; color: #e2e8f0; margin-bottom: 4px; }
.mission-desc { font-size: 12px; color: #94a3b8; margin-bottom: 8px; }
.mission-progress-bar { height: 8px; background: rgba(255,255,255,0.06); border-radius: 4px; overflow: hidden; }
.mission-progress-fill {
  height: 100%; border-radius: 4px;
  background: linear-gradient(90deg, var(--mission-accent, #a78bfa), var(--mission-accent-light, #c4b5fd));
  transition: width 0.6s cubic-bezier(0.25, 1, 0.5, 1); position: relative;
}
.mission-progress-fill::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
  animation: mshimmer 2s ease-in-out infinite;
}
@keyframes mshimmer { 0%{transform:translateX(-100%)} 100%{transform:translateX(100%)} }
.mission-card.completed .mission-progress-fill { background: linear-gradient(90deg, #22c55e, #4ade80); }
.mission-card.claimed .mission-progress-fill::after { display: none; }

.mission-progress-text { font-size: 11px; color: #94a3b8; margin-top: 4px; font-variant-numeric: tabular-nums; }

.mission-right { display: flex; flex-direction: column; align-items: center; gap: 6px; flex-shrink: 0; }
.mission-reward { display: flex; align-items: center; gap: 4px; font-size: 14px; font-weight: 700; color: #fbbf24; }

.mission-claim-btn {
  padding: 8px 16px; border: none; border-radius: 10px; font-size: 12px; font-weight: 700;
  cursor: pointer; transition: all 0.2s; text-transform: uppercase; letter-spacing: 0.5px;
}
.mission-claim-btn.ready {
  background: linear-gradient(135deg, #22c55e, #16a34a); color: #fff;
  box-shadow: 0 4px 12px rgba(34,197,94,0.3); animation: mpulse 2s ease-in-out infinite;
}
.mission-claim-btn.ready:hover { transform: scale(1.05); box-shadow: 0 6px 20px rgba(34,197,94,0.4); }
@keyframes mpulse { 0%,100%{box-shadow:0 4px 12px rgba(34,197,94,.3)} 50%{box-shadow:0 4px 20px rgba(34,197,94,.5)} }
.mission-claim-btn.claimed { background: rgba(255,255,255,0.06); color: #64748b; cursor: default; }
.mission-claim-btn.in-progress { background: rgba(255,255,255,0.04); color: #64748b; cursor: default; border: 1px solid rgba(255,255,255,0.08); }

@media (max-width: 600px) {
  .mission-card { padding: 12px; gap: 10px; }
  .mission-icon { width: 40px; height: 40px; font-size: 20px; }
  .missions-timer { flex-direction: column; gap: 8px; font-size: 12px; }
}

/* ============================================ */
/*  PVP ARENA                                   */
/* ============================================ */

/* Search box */
.pvp-search-box { position: relative; margin: 16px 0; }
.pvp-search-box input {
  width: 100%; padding: 12px 18px; border-radius: 12px; border: 1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.06); color: #e2e8f0; font-size: 15px; outline: none;
  backdrop-filter: blur(8px); transition: all .2s;
}
.pvp-search-box input:focus { border-color: rgba(96,165,250,0.5); box-shadow: 0 0 20px rgba(96,165,250,0.15); }
.pvp-search-results {
  position: absolute; top: 100%; left: 0; right: 0; z-index: 50; max-height: 360px; overflow-y: auto;
  background: rgba(15,23,42,0.96); border: 1px solid rgba(255,255,255,0.1); border-radius: 12px;
  display: none; backdrop-filter: blur(12px); box-shadow: 0 12px 40px rgba(0,0,0,0.5);
}
.pvp-search-results.visible { display: block; }

.pvp-search-row {
  display: flex; align-items: center; gap: 12px; padding: 10px 16px; cursor: pointer;
  transition: background .15s; border-bottom: 1px solid rgba(255,255,255,0.04);
}
.pvp-search-row:hover { background: rgba(96,165,250,0.1); }
.pvp-search-row:last-child { border-bottom: none; }
.pvp-search-online { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.pvp-search-online.on { background: #22c55e; box-shadow: 0 0 8px #22c55e; }
.pvp-search-online.off { background: #475569; }
.pvp-search-name { flex: 1; font-weight: 600; color: #e2e8f0; font-size: 14px; }
.pvp-search-elo { color: #94a3b8; font-size: 12px; }
.pvp-search-btn {
  padding: 5px 14px; border-radius: 8px; border: none; font-weight: 700; font-size: 12px;
  cursor: pointer; transition: all .2s;
  background: linear-gradient(135deg, #ef4444, #dc2626); color: #fff;
}
.pvp-search-btn:hover { transform: scale(1.05); box-shadow: 0 4px 15px rgba(239,68,68,0.4); }
.pvp-search-btn:disabled { opacity: 0.4; cursor: default; transform: none; }

/* Ranking Tabs */
.pvp-rank-tabs {
  display: flex; gap: 6px; flex-wrap: wrap; margin: 16px 0 12px;
  padding: 4px; background: rgba(255,255,255,0.04); border-radius: 12px;
}
.pvp-rank-tab {
  padding: 8px 14px; border: none; border-radius: 10px; background: transparent;
  color: #94a3b8; font-size: 12px; font-weight: 600; cursor: pointer; transition: all .2s;
  white-space: nowrap;
}
.pvp-rank-tab:hover { color: #e2e8f0; background: rgba(255,255,255,0.06); }
.pvp-rank-tab.active { background: rgba(96,165,250,0.2); color: #60a5fa; box-shadow: 0 2px 8px rgba(96,165,250,0.15); }

/* Ranking List */
.pvp-ranking-list { display: flex; flex-direction: column; gap: 4px; }
.pvp-rank-row {
  display: flex; align-items: center; gap: 12px; padding: 10px 16px;
  background: rgba(255,255,255,0.03); border-radius: 10px; transition: background .15s;
  border: 1px solid rgba(255,255,255,0.04);
}
.pvp-rank-row:hover { background: rgba(255,255,255,0.06); }
.pvp-rank-row.me { background: rgba(96,165,250,0.08); border-color: rgba(96,165,250,0.2); }
.pvp-rank-pos {
  width: 30px; text-align: center; font-weight: 900; font-size: 16px; flex-shrink: 0;
}
.pvp-rank-pos.gold { color: #fbbf24; }
.pvp-rank-pos.silver { color: #cbd5e1; }
.pvp-rank-pos.bronze { color: #d97706; }
.pvp-rank-name { flex: 1; font-weight: 600; color: #e2e8f0; font-size: 14px; }
.pvp-rank-avatar {
  width: 28px; height: 28px; flex-shrink: 0; border-radius: 50%;
  image-rendering: pixelated; background: rgba(255,255,255,0.06);
  border: 2px solid rgba(255,255,255,0.1);
}
.pvp-rank-row.me .pvp-rank-avatar { border-color: rgba(96,165,250,0.4); }
.pvp-rank-pokemon {
  width: 40px; height: 40px; flex-shrink: 0; image-rendering: pixelated;
  filter: drop-shadow(0 0 3px rgba(255,255,255,0.15));
}
.pvp-rank-val { font-weight: 700; color: #60a5fa; font-size: 15px; min-width: 60px; text-align: right; }
.pvp-rank-sub { color: #64748b; font-size: 11px; margin-top: 1px; }

/* ============================================ */
/*  PVP NOTIFICATION POPUP (top-left)           */
/* ============================================ */
.pvp-notif {
  position: fixed; top: 20px; left: 20px; z-index: 9999;
  background: rgba(15,23,42,0.95); border: 1px solid rgba(239,68,68,0.4);
  border-radius: 16px; padding: 16px 20px; min-width: 320px; max-width: 400px;
  backdrop-filter: blur(16px); box-shadow: 0 12px 40px rgba(0,0,0,0.6), 0 0 30px rgba(239,68,68,0.15);
  animation: pvpSlideIn .4s cubic-bezier(.16,1,.3,1);
  font-family: 'Inter', sans-serif;
}
.pvp-notif.closing { animation: pvpSlideOut .3s ease-in forwards; }
@keyframes pvpSlideIn { from { transform: translateX(-120%); opacity: 0; } to { transform: translateX(0); opacity: 1; } }
@keyframes pvpSlideOut { from { transform: translateX(0); opacity: 1; } to { transform: translateX(-120%); opacity: 0; } }

.pvp-notif-title { font-size: 16px; font-weight: 800; color: #ef4444; margin-bottom: 6px; }
.pvp-notif-body { font-size: 13px; color: #cbd5e1; margin-bottom: 12px; line-height: 1.5; }
.pvp-notif-stake { color: #fbbf24; font-weight: 700; }
.pvp-notif-timer {
  width: 100%; height: 4px; border-radius: 4px; background: rgba(255,255,255,0.08);
  margin-bottom: 12px; overflow: hidden;
}
.pvp-notif-timer-fill { height: 100%; background: linear-gradient(90deg, #ef4444, #f59e0b); border-radius: 4px; transition: width 1s linear; }
.pvp-notif-actions { display: flex; gap: 10px; }
.pvp-notif-btn {
  flex: 1; padding: 10px; border: none; border-radius: 10px; font-weight: 700; font-size: 13px;
  cursor: pointer; transition: all .2s;
}
.pvp-notif-btn.accept { background: linear-gradient(135deg, #22c55e, #16a34a); color: #fff; }
.pvp-notif-btn.accept:hover { transform: scale(1.03); box-shadow: 0 4px 15px rgba(34,197,94,0.4); }
.pvp-notif-btn.reject { background: rgba(255,255,255,0.08); color: #94a3b8; }
.pvp-notif-btn.reject:hover { background: rgba(239,68,68,0.2); color: #ef4444; }

/* ============================================ */
/*  PVP CHALLENGE MODAL                         */
/* ============================================ */
.pvp-modal-overlay {
  position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 9000;
  background: rgba(0,0,0,0.6); backdrop-filter: blur(4px);
  display: flex; align-items: center; justify-content: center;
  animation: fadeIn .2s;
}
.pvp-modal {
  background: rgba(15,23,42,0.97); border: 1px solid rgba(255,255,255,0.1);
  border-radius: 20px; padding: 28px; min-width: 340px; max-width: 440px; width: 90%;
  box-shadow: 0 20px 60px rgba(0,0,0,0.5); backdrop-filter: blur(16px);
}
.pvp-modal h3 { margin: 0 0 16px; font-size: 20px; color: #e2e8f0; text-align: center; }
.pvp-modal-target { text-align: center; color: #60a5fa; font-weight: 700; font-size: 16px; margin-bottom: 16px; }
.pvp-modal-stake-label { color: #94a3b8; font-size: 13px; margin-bottom: 6px; }
.pvp-modal-stake-input {
  width: 100%; padding: 12px; border-radius: 10px; border: 1px solid rgba(255,255,255,0.1);
  background: rgba(255,255,255,0.06); color: #fbbf24; font-size: 18px; font-weight: 700;
  text-align: center; outline: none;
}
.pvp-modal-stake-input:focus { border-color: rgba(251,191,36,0.4); }
.pvp-modal-diamonds { text-align: center; color: #64748b; font-size: 12px; margin: 6px 0 16px; }
.pvp-modal-actions { display: flex; gap: 10px; }
.pvp-modal-actions button {
  flex: 1; padding: 12px; border: none; border-radius: 12px; font-weight: 700; font-size: 14px; cursor: pointer; transition: all .2s;
}
.pvp-modal-send { background: linear-gradient(135deg, #ef4444, #dc2626); color: #fff; }
.pvp-modal-send:hover { transform: scale(1.03); box-shadow: 0 4px 15px rgba(239,68,68,0.4); }
.pvp-modal-cancel { background: rgba(255,255,255,0.08); color: #94a3b8; }
.pvp-modal-cancel:hover { background: rgba(255,255,255,0.12); }

/* ============================================ */
/*  PVP TEAM SELECT MODAL                       */
/* ============================================ */
.pvp-team-overlay {
  position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 9500;
  background: rgba(0,0,0,0.7); backdrop-filter: blur(6px);
  display: flex; align-items: center; justify-content: center;
  animation: fadeIn .2s;
}
.pvp-team-modal {
  background: rgba(15,23,42,0.97); border: 1px solid rgba(255,255,255,0.1);
  border-radius: 20px; padding: 24px; width: 95%; max-width: 600px; max-height: 85vh; overflow-y: auto;
  box-shadow: 0 20px 60px rgba(0,0,0,0.6);
}
.pvp-team-modal h3 { margin: 0 0 8px; font-size: 18px; color: #e2e8f0; text-align: center; }
.pvp-team-timer { text-align: center; color: #f59e0b; font-size: 13px; margin-bottom: 12px; }
.pvp-team-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 8px; margin-bottom: 16px;
}
.pvp-team-card {
  padding: 10px; border-radius: 12px; border: 2px solid rgba(255,255,255,0.06);
  background: rgba(255,255,255,0.03); cursor: pointer; text-align: center; transition: all .2s;
}
.pvp-team-card:hover { border-color: rgba(96,165,250,0.3); background: rgba(96,165,250,0.06); }
.pvp-team-card.selected { border-color: #22c55e; background: rgba(34,197,94,0.1); box-shadow: 0 0 12px rgba(34,197,94,0.2); }
.pvp-team-card.disabled { opacity: 0.3; cursor: default; }
.pvp-team-card img { width: 56px; height: 56px; image-rendering: pixelated; }
.pvp-team-card .ptc-name { font-size: 11px; font-weight: 600; color: #e2e8f0; margin-top: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pvp-team-card .ptc-lv { font-size: 10px; color: #94a3b8; }
.pvp-team-confirm {
  width: 100%; padding: 14px; border: none; border-radius: 12px;
  background: linear-gradient(135deg, #22c55e, #16a34a); color: #fff;
  font-weight: 800; font-size: 15px; cursor: pointer; transition: all .2s;
}
.pvp-team-confirm:hover { transform: scale(1.02); box-shadow: 0 6px 20px rgba(34,197,94,0.4); }
.pvp-team-confirm:disabled { opacity: 0.4; cursor: default; transform: none; }
.pvp-team-count { text-align: center; color: #94a3b8; font-size: 12px; margin-bottom: 12px; }

/* ===== PVP BATTLE OVERLAY ===== */
.pvp-battle-overlay {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,0,0,0.92);
  display: flex; align-items: center; justify-content: center;
  animation: fadeIn 0.4s ease;
}
.pvp-battle-scene {
  width: 95%; max-width: 800px; max-height: 95vh;
  display: flex; flex-direction: column; gap: 8px;
  overflow-y: auto; padding: 12px;
}
.pvp-battle-header {
  display: flex; justify-content: space-between; align-items: center;
  padding: 8px 16px; background: linear-gradient(135deg, rgba(99,102,241,0.3), rgba(139,92,246,0.3));
  border-radius: 12px; border: 1px solid rgba(139,92,246,0.3);
  color: #e2e8f0; font-weight: 600; font-size: 15px;
}
.pvp-surrender-btn {
  background: rgba(239,68,68,0.2); border: 1px solid rgba(239,68,68,0.4);
  color: #fca5a5; padding: 6px 14px; border-radius: 8px; cursor: pointer;
  font-size: 12px; transition: all 0.2s;
}
.pvp-surrender-btn:hover { background: rgba(239,68,68,0.4); }
.pvp-info-bar {
  text-align: center; color: #94a3b8; font-size: 12px;
  padding: 4px 12px; background: rgba(255,255,255,0.04); border-radius: 8px;
}
.pvp-battle-overlay .battle-field {
  background:
    linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.15) 40%, rgba(0,0,0,0.25)),
    radial-gradient(ellipse at 70% 20%, rgba(139,92,246,0.15), transparent 60%),
    radial-gradient(ellipse at 30% 80%, rgba(108,140,255,0.1), transparent 60%),
    linear-gradient(180deg, #0d1225 0%, #111a35 50%, #0a1020 100%);
  border-radius: 14px; min-height: 320px; position: relative;
  overflow: visible !important;
}
.pvp-battle-overlay .slot-info,
.pvp-battle-overlay .slot-name { text-shadow: 0 1px 4px rgba(0,0,0,0.8); }
.pvp-battle-overlay .slot-name { color: white !important; font-weight: bold; }
.pvp-battle-overlay .slot-name small { color: white !important; }
.pvp-battle-overlay .hp-bar { background: rgba(0,0,0,0.5); border: 1px solid rgba(255,255,255,0.15); }
.pvp-battle-overlay .hp-text { color: white !important; text-shadow: 1px 1px 2px black; }
.pvp-battle-overlay .battle-log { border-radius: 0 0 12px 12px; max-height: 120px; min-height: 60px; }
.pvp-battle-overlay .enemy-side { overflow: visible; }
.pvp-battle-overlay .enemy-slot { overflow: visible; }
.pvp-battle-overlay .dmg-pop { top: 30% !important; z-index: 30; }
.pvp-battle-overlay .effect-banner { z-index: 35; }
.pvp-battle-overlay .mv-announce { z-index: 35; }
.pvp-battle-overlay .atk-impact { z-index: 25; }
.pvp-battle-overlay .pkm-flash { z-index: 20; border-radius: 14px; }
@media (max-height: 800px) {
  .pvp-battle-scene { gap: 4px; padding: 8px; }
  .pvp-battle-overlay .battle-field { min-height: 250px; }
  .pvp-battle-overlay .battle-log { max-height: 90px; font-size: 10px; }
  .pvp-battle-overlay .move-grid { gap: 4px; }
  .pvp-battle-overlay .move-btn { padding: 8px 10px; font-size: 11px; }
  .pvp-battle-overlay .team-slot { width: 72px; }
  .pvp-battle-overlay .ts-sprite { width: 40px; height: 40px; }
}

/* ===== ADMIN SUB-TABS ===== */
.admin-subtabs{display:flex;gap:6px;padding:0 0 12px;border-bottom:1px solid rgba(255,255,255,0.06);margin-bottom:12px}
.admin-subtab{padding:8px 18px;border-radius:8px;border:1px solid rgba(255,255,255,0.08);background:rgba(255,255,255,0.03);color:var(--muted);font-size:12px;font-weight:700;cursor:pointer;transition:all .2s;font-family:inherit}
.admin-subtab:hover{color:var(--text);border-color:rgba(255,255,255,0.15)}
.admin-subtab.active{background:linear-gradient(135deg,rgba(108,140,255,0.15),rgba(108,140,255,0.08));color:var(--accent);border-color:rgba(108,140,255,0.3)}

/* ===== SPRITE DEBUGGER ===== */
.sd-controls{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:10px 0;margin-bottom:10px}
.sd-type-filter{display:flex;gap:4px}
.filter-chip{padding:6px 14px;border-radius:8px;border:1px solid rgba(255,255,255,0.08);background:rgba(255,255,255,0.03);color:var(--muted);font-size:11px;font-weight:700;cursor:pointer;transition:all .2s;font-family:inherit}
.filter-chip:hover{color:var(--text);border-color:rgba(255,255,255,0.15)}
.filter-chip.active{background:linear-gradient(135deg,rgba(108,140,255,0.15),rgba(108,140,255,0.08));color:var(--accent);border-color:rgba(108,140,255,0.3)}
.sd-enable-check{position:absolute;top:4px;left:4px;font-size:10px;display:flex;align-items:center;gap:2px;z-index:2;cursor:pointer}
.sd-enable-check input{width:12px;height:12px;cursor:pointer}
.sd-search{background:rgba(255,255,255,0.05);border:1px solid var(--border);border-radius:8px;padding:8px 14px;color:var(--text);font-size:12px;outline:none;min-width:200px;font-family:inherit}
.sd-search:focus{border-color:var(--accent)}
.sd-check{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--muted);cursor:pointer;padding:6px 12px;border-radius:8px;border:1px solid var(--border);background:rgba(255,255,255,0.03);transition:all .2s}
.sd-check:has(input:checked){color:var(--accent);border-color:rgba(108,140,255,0.3);background:rgba(108,140,255,0.1)}
.sd-check input{display:none}
.sd-dir-btns{display:flex;gap:4px}
.sd-dir{width:32px;height:32px;border-radius:6px;border:1px solid var(--border);background:rgba(255,255,255,0.04);color:var(--text);font-size:13px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;padding:0}
.sd-dir:hover{background:rgba(255,255,255,0.08)}
.sd-dir.active{background:var(--accent);border-color:var(--accent);color:#fff}
.sd-stats{display:flex;gap:10px;font-size:11px;font-weight:700;margin-left:auto}
.sd-stat-ok{color:#22c55e}
.sd-stat-fail{color:#ef4444}
.sd-stat-total{color:var(--muted)}
.sd-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:6px}
.sd-card{background:rgba(255,255,255,0.03);border:1px solid var(--border);border-radius:10px;padding:8px 6px 6px;text-align:center;position:relative;transition:all .2s}
.sd-card:hover{transform:translateY(-2px);border-color:rgba(255,255,255,0.12)}
.sd-card.ok{border-color:rgba(34,197,94,0.2)}
.sd-card.fail{border-color:rgba(239,68,68,0.2);opacity:0.5}
.sd-card-id{position:absolute;top:3px;left:5px;font-size:8px;font-weight:700;color:var(--muted)}
.sd-card-status{position:absolute;top:3px;right:5px;font-size:9px}
.sd-canvas-wrap{width:64px;height:64px;margin:0 auto 4px;display:flex;align-items:center;justify-content:center;image-rendering:pixelated}
.sd-canvas-wrap canvas{image-rendering:pixelated;image-rendering:crisp-edges}
.sd-card-name{font-size:9px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}