/*==================================================
    NEON BEAST IDLE — UI POLISH (Oct 2026)
    Loaded LAST (after animations.css) so it wins over
    the older layers in main.css. Icons + small UI only.
      - icon sizes: nav 32, stats 38, header 28, level buttons 30
      - stats: no glow box behind the icon
      - wallet button: no fill behind the icon, thin outline
      - material rarity colour + glow (instead of the blur box)
      - level card: Hunt Time box, icon labels
      - "Loading" in place of a picture while it loads
==================================================*/

:root{
    --nb-theme:#8b3fff;                 /* the one button colour */
    --nb-theme-line:rgba(139,63,255,.75);

    --r-common:#c9d3ea;
    --r-uncommon:#35ff96;
    --r-rare:#3fa9ff;
    --r-epic:#b46bff;
    --r-legendary:#ffbe3c;
    --r-mythic:#ff4f7e;
    --r-ultimate:#ffffff;
}

/*--------------------------------------------------
    SIDEBAR NAV — 32px icons
--------------------------------------------------*/
.sidebar-nav-link .nav-icon{ width:32px; height:32px; }
.sidebar-nav-link .nav-icon img{ width:32px; height:32px; }

/*--------------------------------------------------
    PLAYER STATS — 38px icons, no glow box
--------------------------------------------------*/
.stat-icon-box,
.player-stats .stat-icon-box,
.stat-chest .stat-icon-box{
    width:38px;
    height:38px;
    background:none !important;
    box-shadow:none !important;
    border:none !important;
    border-radius:0;
}
.stat-icon-box img,
.player-stats .stat-icon-box img{
    width:38px;
    height:38px;
    object-fit:contain;
    filter:none;
}

/* prestige box: count + Beast Token bonus, tappable */
.stat-prestige{ cursor:pointer; }
.stat-prestige:focus-visible{ outline:2px solid var(--nb-theme); outline-offset:2px; }
.stat-prestige .stat-bonus{
    font-style:normal;
    font-size:11px;
    font-weight:700;
    color:#ffd76a;
    margin-left:4px;
    text-shadow:none;
}

/*--------------------------------------------------
    HEADER — 28px button icons
--------------------------------------------------*/
.top-btn .ui-icon,
.mail-btn .ui-icon{ width:28px; height:28px; }
.top-btn img{ width:28px; height:28px; }
.mail-btn.has-mail .ui-icon img{ filter:drop-shadow(0 0 6px rgba(255,215,106,.8)); }

/* wallet button: no fill behind the icon, thin theme outline */
#walletBtn{
    background:transparent !important;
    border:1px solid var(--nb-theme-line) !important;
    box-shadow:none !important;
}
#walletBtn:hover{ border-color:var(--nb-theme) !important; background:rgba(139,63,255,.08) !important; }
#walletBtn .ui-icon{
    width:28px;
    height:28px;
    background:none !important;
    box-shadow:none !important;
    border:none !important;
}
#walletBtn .ui-icon img, #walletBtn img{ width:28px; height:28px; }

/*--------------------------------------------------
    LEVEL CARD — 30px button icons
--------------------------------------------------*/
.hunt-btn .ui-icon,
.buy-btn .ui-icon{ width:30px; height:30px; }
.buy-btn .ui-icon img, .hunt-btn .ui-icon img{ width:30px; height:30px; }
.buy-btn{ gap:6px; }

.lvl-inline-icon{ width:20px; height:20px; object-fit:contain; vertical-align:middle; }
.level-stat span{ display:flex; align-items:center; justify-content:flex-end; gap:5px; }
.lvl-stat-icon{ width:20px; height:20px; object-fit:contain; flex-shrink:0; }

/* Hunt time line (under Income/sec): one full hunt + how much faster it got */
.level-hunttime{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:6px;
    color:#c8d7ff;
    font-size:13px;
    margin-top:2px;
}
.level-hunttime strong{
    font-family:var(--font-display,"Orbitron",sans-serif);
    font-size:15px;
    color:#fff;
}
.level-hunttime .hunt-cut{
    padding:1px 8px;
    border-radius:20px;
    font-size:11px;
    font-weight:700;
    color:#9fb3d6;
    background:rgba(255,255,255,.06);
    white-space:nowrap;
}
.level-hunttime .hunt-cut.is-cut{ color:#35ff96; background:rgba(53,255,150,.12); }
.level-hunttime.just-cut strong{ animation:huntCutFlash 1.2s ease-out; }
@keyframes huntCutFlash{
    0%{ color:#35ff96; text-shadow:0 0 14px rgba(53,255,150,.9); }
    100%{ color:#fff; }
}
.lvl-clock{ width:16px; height:16px; color:#9fb3d6; flex-shrink:0; }
.hunt-timer .timer-icon{ display:inline-flex; }
.hunt-timer .timer-icon .lvl-clock{ width:15px; height:15px; color:#dbe4f5; }

/* lock icons (were emoji) */
.lvl-lock-icon{ width:18px; height:18px; vertical-align:-3px; color:#ffc83d; }
.slot-lock .ui-icon{ width:34px; height:34px; color:#9fb3d6; }
.slot-lock-icon svg{ width:26px; height:26px; color:#ffc83d; }
.ui-icon + .lvl-lock-icon{ margin-left:0; }

/* Beast Token today (levels 3-7) */
.level-bc-today img{ width:20px; height:20px; object-fit:contain; }

/*--------------------------------------------------
    MATERIALS — rarity colour + glow per row
    (Leather + Stone Core show as Uncommon)
--------------------------------------------------*/
.inventory-icon{
    background:none !important;
    box-shadow:none !important;
    border-radius:12px;
    position:relative;
    --mat:var(--r-common);
}
.inventory-icon::before{
    content:"";
    position:absolute;
    inset:3px;
    border-radius:50%;
    background:radial-gradient(circle, color-mix(in srgb, var(--mat) 34%, transparent) 0%, transparent 70%);
    pointer-events:none;
}
.inventory-icon img{
    position:relative;
    width:40px;
    height:40px;
    filter:drop-shadow(0 0 5px color-mix(in srgb, var(--mat) 70%, transparent));
}
.mat-icon-empty{ font-size:18px; font-weight:800; color:var(--mat); }

.inventory-item{ border-left:3px solid var(--mat, rgba(139,63,255,.25)); }
.inventory-item .inventory-name{ color:var(--mat, #fff); }

.inventory-item.mat-r-common{ --mat:var(--r-common); }
.inventory-item.mat-r-uncommon{ --mat:var(--r-uncommon); }
.inventory-item.mat-r-rare{ --mat:var(--r-rare); }
.inventory-item.mat-r-epic{ --mat:var(--r-epic); }
.inventory-item.mat-r-legendary{ --mat:var(--r-legendary); }
.inventory-item.mat-r-mythic{ --mat:var(--r-mythic); }
.inventory-item[class*="mat-r-"] .inventory-icon{ --mat:inherit; }
.inventory-item.mat-r-common .inventory-name{ color:#fff; }

.inventory-item.mat-r-epic,
.inventory-item.mat-r-legendary,
.inventory-item.mat-r-mythic{
    border-color:color-mix(in srgb, var(--mat) 45%, transparent);
    border-left-color:var(--mat);
}
.inventory-item.mat-r-legendary .inventory-icon::before,
.inventory-item.mat-r-mythic .inventory-icon::before{ animation:matGlow 2.4s ease-in-out infinite; }
@keyframes matGlow{
    0%,100%{ opacity:.6; transform:scale(.92); }
    50%{ opacity:1; transform:scale(1.08); }
}

/* the uncommon colour in tags / filters */
.lvl-mat-uncommon{ color:var(--r-uncommon); }
.mk-rarity-uncommon{ color:var(--r-uncommon); background:rgba(53,255,150,.14); }
.mk-rarity-common{ color:var(--r-common); }

/* same colours on every material picture outside the sidebar */
.pop-tile-icon img, .mk-rc-img img{ filter:drop-shadow(0 0 4px rgba(255,255,255,.18)); }

/*--------------------------------------------------
    "Loading" where a picture will be
--------------------------------------------------*/
.img-wait{
    position:relative;
    display:grid;
    place-items:center;
    width:100%;
    min-height:60px;
}
.img-wait > img{ grid-area:1 / 1; transition:opacity .25s; }
.img-wait.is-loading > img,
.img-wait.is-failed > img{ opacity:0; }
.img-wait-text{
    grid-area:1 / 1;
    display:none;
    flex-direction:column;
    align-items:center;
    gap:8px;
    font-size:12px;
    font-weight:700;
    letter-spacing:1px;
    text-transform:uppercase;
    color:#9fb3d6;
    z-index:6;
    pointer-events:none;
}
.img-wait.is-loading .img-wait-text{ display:flex; }
.img-wait-spin{
    width:26px;
    height:26px;
    border-radius:50%;
    border:3px solid rgba(139,63,255,.25);
    border-top-color:var(--nb-theme);
    animation:imgWaitSpin .8s linear infinite;
}
@keyframes imgWaitSpin{ to{ transform:rotate(360deg); } }

/* boss portrait: the wrap itself is the .img-wait box */
.boss-portrait-wrap.img-wait{ display:block; }
.boss-portrait-wrap.img-wait .img-wait-text{
    position:absolute;
    inset:0;
    justify-content:center;
}

/* PvP card art: the picture now sits inside .img-wait */
.pvp-card-art > .img-wait{ justify-self:center; max-width:150px; aspect-ratio:1; }
.pvp-card-art > .img-wait > img{ width:100%; max-width:150px; aspect-ratio:1; object-fit:contain; }

/* narrow centre column (3-column layout): Owned / Total Cost stack on the
   right so the level name and text get the width (was squeezed before) */
@media (max-width:1400px){
    .level-stats{ flex-direction:column; align-items:flex-end; gap:6px; }
    .level-stat span{ margin-bottom:2px; }
    .level-stat strong{ font-size:18px; }
}

/* level buttons: 30px icons only where the card is wide enough */
@media (max-width:1500px){
    .buy-btn .ui-icon, .buy-btn .ui-icon img{ width:24px; height:24px; }
}

/*--------------------------------------------------
    PHONES
--------------------------------------------------*/
@media (max-width:820px){
    .sidebar-nav-link .nav-icon, .sidebar-nav-link .nav-icon img{ width:30px; height:30px; }

    .hunt-btn .ui-icon, .hunt-btn .ui-icon img{ width:24px; height:24px; }
    .buy-btn .ui-icon, .buy-btn .ui-icon img, .buy-btn img{ width:20px; height:20px; }

    .top-btn .ui-icon, .top-btn img, .mail-btn .ui-icon,
    #walletBtn .ui-icon, #walletBtn .ui-icon img{ width:24px; height:24px; }

    .coin-card img{ width:24px; height:24px; }

    .level-stat span{ font-size:10px; }
    .lvl-stat-icon{ width:16px; height:16px; }
    .level-hunttime{ font-size:12px; }
    .level-hunttime strong{ font-size:14px; }

    .pvp-card-art > .img-wait{ max-height:110px; }
}

/*==================================================
    BATCH R (Oct 2026)
==================================================*/

/* ---------- top bar: bigger icons + coins ---------- */
.top-btn .ui-icon, .mail-btn .ui-icon, .top-btn img{ width:34px; height:34px; }
#walletBtn .ui-icon, #walletBtn .ui-icon img, #walletBtn img{ width:32px; height:32px; }
.coin-card img{ width:46px; height:46px; }
.coin-card-click{ cursor:pointer; }
.coin-card-click:focus-visible{ outline:2px solid var(--nb-theme); outline-offset:2px; }
@media (max-width:820px){
    .top-btn .ui-icon, .top-btn img, .mail-btn .ui-icon,
    #walletBtn .ui-icon, #walletBtn .ui-icon img{ width:26px; height:26px; }
    .coin-card img{ width:28px; height:28px; }
}

/* ---------- coin history popup ---------- */
.coin-history{ max-height:46vh; overflow-y:auto; }
.coin-history .bc-hist-time{ min-width:92px; white-space:nowrap; }
.coin-hist-day{
    margin:10px 0 4px;
    font-size:11px;
    font-weight:800;
    letter-spacing:1px;
    text-transform:uppercase;
    color:#9fb3d6;
}

/* ---------- Beast card: auto hunt time ---------- */
.beast-auto-hunt{
    display:flex;
    align-items:baseline;
    flex-wrap:wrap;
    gap:6px;
    margin:4px 0 6px;
    font-size:12px;
    color:#c8d7ff;
}
.beast-auto-hunt strong{ color:#fff; font-size:14px; }
.beast-auto-hunt small{ color:#35ff96; font-size:11px; font-weight:700; }

/* ---------- materials panel ---------- */
.mat-listed{ display:block; font-style:normal; font-size:10px; font-weight:700; color:#ffd76a; white-space:nowrap; }
.mat-full{ font-style:normal; font-size:10px; font-weight:800; color:#ff6b8b; text-transform:uppercase; }
.side-upgrade-storage{
    width:100%;
    margin-top:10px;
    padding:10px 12px;
    border:none;
    border-radius:12px;
    background:var(--nb-theme);
    color:#fff;
    font-weight:800;
    letter-spacing:.4px;
    cursor:pointer;
}
.side-upgrade-storage:hover{ filter:brightness(1.12); }
.side-upgrade-storage:disabled{ opacity:.5; cursor:default; filter:none; }

/* ---------- leaderboard: one line per player ---------- */
.lb-info{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px 14px;
    margin:10px 0 6px;
    padding:10px 14px;
    border-radius:12px;
    background:rgba(139,63,255,.10);
    border:1px solid rgba(139,63,255,.30);
    font-size:13px;
    color:#c8d7ff;
}
.lb-info strong{ color:#fff; font-family:var(--font-display,"Orbitron",sans-serif); font-size:14px; }
.lb-info b{ color:#ffd76a; }
.lb-rewards{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin:0 0 8px;
}
.lb-rewards span{
    padding:3px 10px;
    border-radius:999px;
    font-size:11px;
    font-weight:700;
    color:#9fb3d6;
    background:rgba(255,255,255,.05);
    border:1px solid rgba(255,255,255,.08);
}
.lb-rewards b{ color:#ffd76a; }
.lb-head,
#leaderboardContent .leaderboard-row{
    display:grid !important;
    grid-template-columns:52px minmax(0, 1fr) auto 84px;
    align-items:center;
    gap:10px;
}
.lb-head{
    padding:4px 16px;
    font-size:10px;
    font-weight:800;
    letter-spacing:1px;
    text-transform:uppercase;
    color:#7f8db0;
}
.lb-head span:nth-child(3), .lb-head span:nth-child(4){ text-align:right; }
#leaderboardContent .leaderboard-row{ padding:10px 16px; }
#leaderboardContent .leaderboard-name{
    display:flex;
    align-items:center;
    gap:8px;
    min-width:0;
    white-space:nowrap;
    overflow:hidden;
}
#leaderboardContent .leaderboard-name[role="button"]{ cursor:pointer; }
#leaderboardContent .leaderboard-name[role="button"]:hover .lb-name-text{ text-decoration:underline; }
#leaderboardContent .lb-name-text{ overflow:hidden; text-overflow:ellipsis; }
#leaderboardContent .lb-title-badge{ flex-shrink:0; }
#leaderboardContent .leaderboard-value{ text-align:right; white-space:nowrap; }
.leaderboard-reward{ text-align:right; white-space:nowrap; font-size:12px; font-weight:800; color:#ffd76a; }
@media (max-width:640px){
    .lb-head, #leaderboardContent .leaderboard-row{ grid-template-columns:40px minmax(0, 1fr) auto 64px; gap:6px; }
    #leaderboardContent .leaderboard-row{ padding:9px 10px; }
    #leaderboardContent .lb-title-badge{ display:none; }
}

/* ---------- Arena: season strip ---------- */
.pvp-season-strip{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px 14px;
    margin:0 0 12px;
    padding:9px 14px;
    border-radius:12px;
    background:rgba(255,215,106,.08);
    border:1px solid rgba(255,215,106,.28);
    font-size:13px;
    color:#e6dcc0;
}
.pvp-season-strip strong{ color:#ffd76a; font-family:var(--font-display,"Orbitron",sans-serif); }
.pvp-season-strip b{ color:#fff; }
.pvp-season-strip a{ margin-left:auto; color:#c58bff; font-weight:800; text-decoration:none; }
.pvp-season-strip a:hover{ text-decoration:underline; }

/* ---------- boss looks: one per week / month ---------- */
.boss-element-chip{
    display:inline-block;
    margin-left:6px;
    padding:2px 10px;
    border-radius:999px;
    font-size:12px;
    vertical-align:middle;
    color:var(--boss-c, #ffd2a8);
    background:rgba(255,255,255,.06);
    border:1px solid var(--boss-c, rgba(255,255,255,.12));
    font-family:inherit;
}
.boss-screen[class*="boss-look-"] .boss-aura{
    background:radial-gradient(circle, color-mix(in srgb, var(--boss-c) 55%, transparent), color-mix(in srgb, var(--boss-c) 14%, transparent) 45%, transparent 70%);
}
.boss-screen[class*="boss-look-"] .boss-sparkles span{ background:var(--boss-c) !important; box-shadow:0 0 6px var(--boss-c) !important; }
.boss-screen[class*="boss-look-"] .boss-title{ text-shadow:0 0 18px color-mix(in srgb, var(--boss-c) 70%, transparent); }
.boss-screen[class*="boss-look-"] .boss-portrait-img{ filter:var(--boss-f, none) !important; }
.boss-screen[class*="boss-look-"] .boss-resting .boss-portrait-img{ filter:var(--boss-f, none) grayscale(.3) brightness(.85) !important; }

/* weekly (picture is orange: Lava = as is) */
.boss-screen.boss-look-w0{ --boss-c:#ff7a2e; --boss-f:none; }
.boss-screen.boss-look-w1{ --boss-c:#5fd4ff; --boss-f:hue-rotate(175deg) saturate(1.1); }
.boss-screen.boss-look-w2{ --boss-c:#a86bff; --boss-f:hue-rotate(235deg) saturate(.85) brightness(.88); }
.boss-screen.boss-look-w3{ --boss-c:#ffe14d; --boss-f:hue-rotate(22deg) saturate(1.4) brightness(1.08); }
.boss-screen.boss-look-w4{ --boss-c:#5cff8a; --boss-f:hue-rotate(85deg) saturate(1.15); }
.boss-screen.boss-look-w5{ --boss-c:#ff6fd0; --boss-f:hue-rotate(295deg) saturate(1.2); }

/* monthly (picture is red: Neon Overlord = as is) */
.boss-screen.boss-look-m0{  --boss-c:#ff4f6a; --boss-f:none; }
.boss-screen.boss-look-m1{  --boss-c:#4f7dff; --boss-f:hue-rotate(220deg) brightness(.85); }
.boss-screen.boss-look-m2{  --boss-c:#ffe9a8; --boss-f:hue-rotate(45deg) saturate(.8) brightness(1.15); }
.boss-screen.boss-look-m3{  --boss-c:#c9d3ea; --boss-f:grayscale(.6) brightness(1.1); }
.boss-screen.boss-look-m4{  --boss-c:#ff7a2e; --boss-f:hue-rotate(25deg) saturate(1.3); }
.boss-screen.boss-look-m5{  --boss-c:#8a5cff; --boss-f:hue-rotate(270deg) brightness(.8); }
.boss-screen.boss-look-m6{  --boss-c:#45c8ff; --boss-f:hue-rotate(185deg); }
.boss-screen.boss-look-m7{  --boss-c:#ff2440; --boss-f:hue-rotate(-8deg) saturate(1.4) brightness(.85); }
.boss-screen.boss-look-m8{  --boss-c:#a8f0ff; --boss-f:hue-rotate(195deg) saturate(.6) brightness(1.2); }
.boss-screen.boss-look-m9{  --boss-c:#ffc23d; --boss-f:hue-rotate(50deg) saturate(1.5) brightness(1.1); }
.boss-screen.boss-look-m10{ --boss-c:#7dff5c; --boss-f:hue-rotate(110deg) saturate(1.3); }
.boss-screen.boss-look-m11{ --boss-c:#ff7ae0; --boss-f:hue-rotate(300deg) brightness(.85); }

/* ---------- daily quest difficulty ---------- */
.quest-diff{
    display:inline-block;
    margin-left:6px;
    padding:1px 8px;
    border-radius:999px;
    font-style:normal;
    font-size:10px;
    font-weight:800;
    letter-spacing:.6px;
    text-transform:uppercase;
    vertical-align:middle;
}
.quest-diff-easy{ color:#35ff96; background:rgba(53,255,150,.12); }
.quest-diff-medium{ color:#5fb8ff; background:rgba(63,169,255,.14); }
.quest-diff-hard{ color:#ffbe3c; background:rgba(255,190,60,.14); }
.quest-diff-veryhard{ color:#ff5c8a; background:rgba(255,70,120,.14); }

/* ---------- referrals ---------- */
.ref-earned{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:10px;
}
.ref-earned > div{
    display:grid;
    grid-template-columns:36px 1fr;
    grid-template-rows:auto auto;
    column-gap:10px;
    align-items:center;
    padding:12px;
    border-radius:14px;
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.08);
}
.ref-earned img{ grid-row:1 / 3; width:36px; height:36px; object-fit:contain; }
.ref-earned span{ font-size:11px; color:#9fb3d6; font-weight:700; }
.ref-earned strong{ font-size:18px; color:#fff; }
@media (max-width:640px){ .ref-earned{ grid-template-columns:1fr; } }

/* ---------- player profile ---------- */
.prof-loading{ min-height:200px; }
.prof-head{
    display:grid;
    grid-template-columns:72px minmax(0, 1fr) minmax(180px, 260px);
    align-items:center;
    gap:16px;
    padding:18px;
    border-radius:18px;
    background:linear-gradient(135deg, rgba(139,63,255,.16), rgba(0,229,255,.06));
    border:1px solid rgba(139,63,255,.35);
}
.prof-head.prof-frame-frameGold{ border-color:rgba(255,215,106,.7); box-shadow:0 0 18px rgba(255,215,106,.22); }
.prof-head.prof-frame-frameSilver{ border-color:rgba(217,226,236,.6); }
.prof-head.prof-frame-frameBronze{ border-color:rgba(205,127,50,.7); }
.prof-avatar{
    width:72px;
    height:72px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:rgba(0,0,0,.35);
    border:2px solid var(--nb-theme);
}
.prof-avatar img{ width:52px; height:52px; object-fit:contain; }
.prof-who{ min-width:0; display:flex; flex-direction:column; gap:4px; }
.prof-who h3{ margin:0; font-size:22px; color:#fff; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.prof-who small{ color:#9fb3d6; }
.prof-who .lb-title-badge{ align-self:flex-start; }
.prof-level span{ font-size:13px; color:#c8d7ff; }
.prof-level b{ font-size:20px; color:#fff; font-family:var(--font-display,"Orbitron",sans-serif); }
.prof-xp{ height:8px; margin:6px 0 4px; border-radius:99px; background:rgba(255,255,255,.08); overflow:hidden; }
.prof-xp i{ display:block; height:100%; background:var(--nb-theme); border-radius:99px; }
.prof-level small{ font-size:11px; color:#9fb3d6; }
.prof-section{
    margin:20px 0 10px;
    font-size:12px;
    font-weight:800;
    letter-spacing:1.4px;
    text-transform:uppercase;
    color:#9fb3d6;
}
.prof-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(170px, 1fr));
    gap:10px;
}
.prof-tile{
    display:flex;
    align-items:center;
    gap:12px;
    padding:12px 14px;
    border-radius:14px;
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.08);
}
.prof-tile img{ width:38px; height:38px; object-fit:contain; flex-shrink:0; }
.prof-tile div{ display:flex; flex-direction:column; min-width:0; }
.prof-tile span{ font-size:11px; font-weight:700; color:#9fb3d6; }
.prof-tile strong{ font-size:18px; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.prof-tile small{ font-size:11px; color:#7f8db0; }
.prof-card-title{ text-align:center; margin:-4px 0 10px; }
@media (max-width:820px){
    .prof-head{ grid-template-columns:56px minmax(0, 1fr); }
    .prof-avatar{ width:56px; height:56px; }
    .prof-avatar img{ width:40px; height:40px; }
    .prof-level{ grid-column:1 / -1; }
    .prof-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}

/*==================================================
    BATCH S (Oct 2026)
==================================================*/

/* ---------- level card: Beast Token estimate ---------- */
.level-bc-today .lvl-bc-est{ flex-basis:100%; font-size:12px; color:#b9c3da; font-weight:600; }
.level-bc-today .lvl-bc-est b{ color:#35ff96; font-size:12px; }

/* ---------- Equipment: 2 slots per level ---------- */
.gear-two-note{ margin:-4px 0 12px; font-size:13px; color:#b9c3da; line-height:1.5; }
.gear-two-note b{ color:#fff; }
.gear-two-note a{ color:#c58bff; font-weight:700; }
.gear-level-two{ display:flex; flex-direction:column; gap:10px; }
.gear-sock-pair{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.gear-sock{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:6px;
    padding:10px;
    border-radius:14px;
    text-align:center;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(255,255,255,.08);
    min-width:0;
}
.gear-sock.empty{ border-style:dashed; }
.gear-sock.locked{ opacity:.75; }
.gear-sock-label{
    align-self:stretch;
    font-size:10px;
    font-weight:800;
    letter-spacing:1px;
    text-transform:uppercase;
    color:#9fb3d6;
}
.gear-sock .gear-level-item img{ width:64px; height:64px; object-fit:contain; border-radius:10px; }
.gear-sock .gear-level-item strong{ display:block; font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%; }
.gear-sock .slot-empty-icon .ui-icon{ width:22px; height:22px; color:#ffc83d; }
.gear-sock .craft-btn{ width:100%; padding:8px 6px; font-size:12px; }
.gear-sock .gear-level-actions{ display:flex; gap:6px; flex-wrap:wrap; justify-content:center; }
.gear-sock.rarity-uncommon{ border-color:rgba(53,255,150,.45); }
.gear-sock.rarity-rare{ border-color:rgba(0,170,255,.55); }
.gear-sock.rarity-epic{ border-color:rgba(170,80,255,.65); }
.gear-sock.rarity-legendary{ border-color:rgba(255,190,60,.7); }
.gear-sock.rarity-mythic{ border-color:rgba(255,70,120,.75); }
.gear-sock.rarity-ultimate{ border-color:#fff; }
@media (max-width:340px){ .gear-sock-pair{ grid-template-columns:1fr; } }

/* ---------- Blend: auto select ---------- */
.blend-auto-row{ display:flex; align-items:center; justify-content:center; gap:10px; flex-wrap:wrap; margin:6px 0 2px; }
.blend-auto-row small{ font-size:11px; color:#9fb3d6; }

/* ---------- Material shop ---------- */
.mshop-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:12px; margin-top:10px; }
.mshop-card{
    --mat:var(--r-legendary);
    display:flex;
    flex-direction:column;
    gap:10px;
    padding:14px;
    border-radius:16px;
    background:linear-gradient(160deg, color-mix(in srgb, var(--mat) 10%, transparent), rgba(14,10,26,.85) 60%);
    border:1px solid color-mix(in srgb, var(--mat) 45%, transparent);
}
.mshop-card.mat-r-mythic{ --mat:var(--r-mythic); }
.mshop-card .inventory-icon{ --mat:inherit; }
.mshop-top{ display:flex; align-items:center; gap:10px; }
.mshop-name{ display:flex; flex-direction:column; min-width:0; flex:1; }
.mshop-name strong{ color:#fff; font-size:15px; }
.mshop-left{ font-size:11px; font-weight:800; color:#35ff96; white-space:nowrap; }
.mshop-left.out{ color:#ff6b8b; }
.mshop-qty{ display:flex; align-items:center; justify-content:space-between; font-size:12px; color:#9fb3d6; }
.mshop-pays{ display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:6px; }
.mshop-pay{ display:flex; align-items:center; justify-content:center; gap:5px; padding:8px 4px; font-size:12px; min-width:0; }
.mshop-pay img{ width:20px; height:20px; object-fit:contain; flex-shrink:0; }
.mshop-pay span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
/* 2 levels per row = 4 slots (Oct 2026) */
#gearRoot .gear-level-grid{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px; }
#gearRoot .gear-level-two{ min-height:0; padding:12px; }
.gear-sock .slot-empty-icon{ width:46px; height:46px; font-size:22px; }
.gear-sock .beast-slot-hint{ min-height:28px; font-size:11px; line-height:1.3; }
.gear-sock .unequipGuardianBtn, .gear-sock .gear-repair-btn{ width:100%; margin:0; padding:7px 6px; font-size:12px; }
.gear-sock .gear-item-stat{ font-size:12px; line-height:1.3; }
@media (max-width:820px){ #gearRoot .gear-level-grid{ grid-template-columns:1fr; } }

/* level lock badge in the menu (Oct 2026) */
.sidebar-nav-link .nav-lock{ margin-left:auto; display:inline-flex; align-items:center; gap:4px; padding:2px 7px; border-radius:999px; background:rgba(255,200,61,.12); border:1px solid rgba(255,200,61,.35); color:#ffc83d; font-size:10px; font-weight:700; line-height:1; }
.sidebar-nav-link .nav-lock .ui-icon, .sidebar-nav-link .nav-lock svg{ width:12px; height:12px; }
.sidebar-nav-link.nav-level-locked{ opacity:.7; }

/* material shop shared stock (Oct 2026) */
.mshop-stock{ display:grid; grid-template-columns:1fr auto; gap:4px 8px; align-items:center; font-size:12px; margin:8px 0 4px; }
.mshop-stock span{ opacity:.75; }
.mshop-stock-bar{ grid-column:1 / -1; height:6px; border-radius:999px; background:rgba(255,255,255,.08); overflow:hidden; }
.mshop-stock-bar i{ display:block; height:100%; background:linear-gradient(90deg, #00e5ff, #a855f7); }

/* referral link: full width box, normal size Copy button (Oct 2026) */
#referralsContent .ref-top{ grid-template-columns:1fr; }
#referralsContent .ref-top.ref-top-two{ grid-template-columns:1fr 1fr; align-items:stretch; }
@media (max-width:820px){ #referralsContent .ref-top.ref-top-two{ grid-template-columns:1fr; } }
.ref-join .ref-rules{ margin:6px 0 0; }
.ref-by{ color:#fff; font-size:18px; }
#referralsContent .ref-link-row{ align-items:stretch; }
#referralsContent .ref-link-row input{ font-size:13px; padding:12px; }
#referralsContent .ref-link-row .craft-btn{ flex:0 0 auto; width:auto; min-width:0; padding:10px 18px; font-size:13px; }
.ref-join{ margin-top:0; }
.ref-join p{ margin:0 0 4px; }

.rent-lv-lock{ display:flex; gap:10px; align-items:center; }
.rent-lv-lock .ui-icon, .rent-lv-lock svg{ width:20px; height:20px; color:#ffc83d; flex:0 0 auto; }

/* 2nd socket effect on the level card (Oct 2026) */
.level-income .income-weapon{ display:block; font-size:11px; color:#ffc83d; font-weight:600; }
.level-income .income-weapon:empty{ display:none; }

/* bulk blend (Oct 2026): choice boxes + picked slots in rows of 3 */
.blend-count-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(0, 1fr)); gap:10px; margin:10px 0 4px; }
.blend-count-card{ display:flex; flex-direction:column; align-items:center; gap:2px; padding:14px 6px; border-radius:12px; border:1px solid rgba(0,229,255,.35); background:rgba(8,6,18,.6); color:#fff; font:inherit; cursor:pointer; }
.blend-count-card:hover{ border-color:#00e5ff; background:rgba(0,229,255,.08); }
.blend-count-card strong{ font-size:24px; line-height:1; color:#00e5ff; }
.blend-count-card span{ font-size:12px; font-weight:700; }
.blend-count-card small{ font-size:11px; color:#9aa6c0; }
.blend-pick-slots{ display:grid; grid-template-columns:repeat(3, 84px); justify-content:center; gap:10px; }
