/*==================================================
    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:#c5fb62;            /* lime: same as the Uncommon NFT cards (Oct 2026) */
    --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(197,251,98,.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; }
    /* phones (bug #50): the title badge goes under the name instead of being hidden */
    #leaderboardContent .leaderboard-name{ flex-direction:column; align-items:flex-start; justify-content:center; gap:3px; }
    #leaderboardContent .leaderboard-name .lb-name-text{ max-width:100%; }
    #leaderboardContent .lb-title-badge{ display:inline-block; max-width:100%; overflow:hidden; text-overflow:ellipsis; }
}

/* ---------- 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(197,251,98,.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; }
/* Oct 2026 (beta bug #9): "≈ 40/sec · hunt 5.0s" under Neon per hunt */
.level-income .income-sec{ display:block; font-size:11px; opacity:.75; font-weight:500; }
.level-income .income-sec: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; }

/*==================================================
    UI POLISH 15 OCT 2026
==================================================*/

/* ---------- slots: the content sits in the MIDDLE of a tall row
   (a Beast / gear NFT in one slot makes the whole row taller) ---------- */
#temporaryGuardianContainer .beast-slot-unlocked-body,
#temporaryGuardianContainer .beast-slot-locked-body{ flex:1; flex-direction:column; justify-content:center; }
#temporaryGuardianContainer .beast-slot > .beast-slot-empty-body{ flex:1; justify-content:center; }
#temporaryGuardianContainer .beast-slot.has-beast .beast-slot-unlocked-body{ justify-content:flex-start; }
.gear-sock.empty .gear-sock-label{ margin-bottom:auto; }
.gear-sock.empty .craft-btn{ margin-top:auto; }

/* ---------- Equipment cooldown: the same gold ring + timer as My Beasts ---------- */
.gear-sock .slot-empty-icon.on-cooldown{
    width:64px; height:64px;
    font-size:15px; font-weight:800; letter-spacing:.5px;
    color:#ffd76a;
    background:rgba(255,215,106,.06);
    border-color:rgba(255,215,106,.5);
}
.gear-sock .beast-slot-hint.cd-hint{ color:#c9d4e3; font-weight:700; }

/* ---------- hunt timer: a FIXED width, so "9.99s" -> "10.00s" no longer
   pushes the text and the progress bar around (phone + PC) ---------- */
.hunt-timer .hunt-timer-value{
    display:inline-block;
    width:4.2em;
    min-width:0;
    text-align:right;
    white-space:nowrap;
    letter-spacing:.5px;
    font-variant-numeric:tabular-nums;
    font-feature-settings:"tnum" 1;
}
.level-progress .hunt-timer{ flex:0 0 auto; }
/* the bar takes the room that is left (it no longer changes when the numbers do) */
.level-progress .progress-bar{ flex:1 1 auto; width:auto; min-width:0; }

/* ---------- Arena loadout care: Repair equipment (left) · Feed Beast (middle) ·
   Repair gear (right), lined up with the board, theme colour ---------- */
.al-care.al-care-3{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1.6fr) minmax(0,1fr);
    gap:12px;
    margin:10px 0 6px;
}
.al-care-cell{ display:flex; justify-content:center; min-width:0; }
.al-care-cell:empty{ visibility:hidden; }
.al-care .al-care-btn{ margin:0; height:auto; min-height:40px; padding:9px 10px; font-size:13px; line-height:1.2; white-space:normal; }
@media (max-width:820px){
    .al-care.al-care-3{ grid-template-columns:repeat(3, minmax(0,1fr)); gap:6px; }
    .al-care .al-care-btn{ font-size:11.5px; padding:8px 4px; }
}

/* Forge: equipped NFTs are listed too, marked */
.forge-eq-tag{ color:#35ff96; font-weight:700; }

/* Battle Power (right panel): opens the Arena loadout */
.stat-battle-power{ cursor:pointer; transition:border-color .2s, box-shadow .2s; }
.stat-battle-power:hover{ border-color:rgba(139,63,255,.6); box-shadow:0 0 14px rgba(139,63,255,.25); }
.stat-battle-power .stat-text span{ letter-spacing:.2px; white-space:nowrap; font-size:min(1em, 11px); }
/* the label never cuts to "BATTLE PO...": smaller, and it may go on 2 lines */
.player-stats .stat-battle-power .stat-text span,
.stat-battle-power .stat-text span{ font-size:10px !important; letter-spacing:0 !important; white-space:normal !important; line-height:1.15; overflow:visible; }

/* ---------- level animations (js/levelFx.js) ---------- */
.level-hero > canvas.level-fx{
    position:absolute; inset:0;
    width:100%; height:100%;
    z-index:0;
    pointer-events:none;
}
body.level-fx-off .level-hero > canvas.level-fx{ display:none; }
.wallet-dropdown .level-fx-btn{
    padding:9px; border-radius:10px;
    background:rgba(139,63,255,.14); border:1px solid rgba(139,63,255,.45);
    color:#d9c2ff; font-weight:700; font-size:13px; cursor:pointer; transition:.2s;
}
.wallet-dropdown .level-fx-btn:hover{ background:rgba(139,63,255,.26); }

/* ---------- popups: no scroll bars on PC either (still scrolls with the wheel / finger) ---------- */
.game-popup-box,
.game-popup-box *{ scrollbar-width:none; -ms-overflow-style:none; }
.game-popup-box::-webkit-scrollbar,
.game-popup-box *::-webkit-scrollbar{ width:0; height:0; display:none; }

/* ---------- Shop: how many packs to buy (beta) ---------- */
.shop-pack .shop-qty-row{ gap:4px; margin:8px 0 6px; }
.shop-pack .shop-qty-row .pack-qty-input{ padding:7px 4px; font-size:13px; -moz-appearance:textfield; }
.shop-pack .shop-qty-row .pack-qty-input::-webkit-outer-spin-button,
.shop-pack .shop-qty-row .pack-qty-input::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.shop-pack .shop-qty-row .pack-qty-max-btn{
    flex:0 0 34px; height:32px; padding:0;
    border-color:var(--nb-theme-line); color:#e6d6ff; background:rgba(139,63,255,.14);
    font-size:11px;
}
.shop-pack .shop-qty-row .shop-qty-step{ font-size:17px; line-height:1; }
.shop-pack .shop-qty-row .pack-qty-max-btn:hover{ background:rgba(139,63,255,.3); }
.shop-pack .shop-qty-left{ display:block; margin-top:5px; font-size:11px; color:#9fb3d6; text-align:center; }
@media (max-width:480px){
    .shop-pack .shop-qty-row .pack-qty-max-btn{ flex-basis:26px; height:30px; }
    .shop-pack .shop-qty-row .pack-qty-max-btn:last-child{ flex-basis:32px; font-size:10px; }
}

/* ---------- Arena loadout: bigger NFT pictures + the rarity under them ---------- */
.al-slot img{ width:72px; height:72px; }
.al-slot-rarity{ font-size:11px; font-weight:800; letter-spacing:.4px; text-transform:uppercase; line-height:1.1; }
.al-r-common{ color:#C9D4E3; } .al-r-uncommon{ color:#C5FB62; } .al-r-rare{ color:#00C8FF; }
.al-r-epic{ color:#A259FF; } .al-r-legendary{ color:#FFCC33; } .al-r-mythic{ color:#FF7A1A; } .al-r-ultimate{ color:#FF3B5C; }
@media (max-width:820px){
    .al-slot img{ width:58px; height:58px; }
    .al-slot-rarity{ font-size:10px; }
}

/* ---------- NO scroll bars anywhere in the game (Oct 2026) ----------
   The square bars looked wrong next to the round panel corners.
   Every panel / page / list still scrolls with the wheel, touchpad or finger. */
html, body, *{ scrollbar-width:none !important; -ms-overflow-style:none !important; }
::-webkit-scrollbar,
*::-webkit-scrollbar,
#left-sidebar::-webkit-scrollbar,
#center-panel::-webkit-scrollbar,
#right-sidebar::-webkit-scrollbar{ width:0 !important; height:0 !important; display:none !important; background:transparent !important; }

/* ---------- Arena > Battle: bigger gear pictures around the Beast + their rarity ---------- */
.pvp-gear-col{ gap:4px; }
.pvp-gear-wrap{ display:flex; flex-direction:column; align-items:center; gap:2px; min-width:0; }
.pvp-gear{ width:48px; height:48px; border-radius:10px; }
.pvp-gear img{ width:40px !important; height:40px; }
.pvp-gear-r{ font-size:9px; font-weight:800; letter-spacing:.3px; text-transform:uppercase; line-height:1.1; white-space:nowrap; }
.pvp-gear-r:not([class*="al-r-"]){ color:#9aa6c0; }
@media (max-width:820px){
    .pvp-gear{ width:40px; height:40px; border-radius:9px; }
    .pvp-gear img{ width:32px !important; height:32px; }
    .pvp-gear-r{ font-size:8px; letter-spacing:0; }
}

/* ---------- Equipment: Repair + Unequip side by side in ONE row ---------- */
.gear-sock .gear-level-actions{ flex-direction:row !important; flex-wrap:nowrap !important; gap:6px; width:100%; }
.gear-sock .gear-level-actions > button{ flex:1 1 0; width:auto !important; min-width:0; min-height:36px; margin:0 !important; padding:7px 4px; font-size:12px; border-radius:10px; }
.gear-sock .gear-repair-btn:disabled{ opacity:.45; cursor:not-allowed; filter:grayscale(.4); }
/* Narrow screens / 50% window: the slot is only ~110px wide, two buttons side by side get squeezed
   (Repair became a sliver, "Unequip" ran out of its button). Under 170px the two buttons stack. */
.gear-sock{ container-type:inline-size; container-name:gearsock; }
.gear-sock .gear-level-actions > button{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.gear-sock .gear-level-actions .unequipGuardianBtn{ padding:7px 4px !important; min-height:36px; font-size:12px !important; }
@container gearsock (max-width:170px){
    .gear-sock .gear-level-actions{ flex-direction:column !important; }
    .gear-sock .gear-level-actions > button{ flex:0 0 auto; width:100% !important; }
}

/* Leaderboards (17 Oct): This/Last + season/pool info in ONE row */
.lb-toprow{ display:flex; align-items:center; gap:10px; margin:4px 0 10px; flex-wrap:nowrap; }
.lb-toprow .lb-view-toggle{ margin:0; flex:0 0 auto; }
.lb-toprow .lb-view-toggle button{ white-space:nowrap; flex:0 0 auto; }
.lb-toprow .lb-info > *{ flex:0 0 auto; }
.lb-toprow .lb-info{ overflow:hidden; }
.lb-toprow .lb-info{ margin:0 0 0 auto; padding:6px 8px 6px 12px; flex:0 1 auto; min-width:0; justify-content:flex-start; flex-wrap:nowrap; white-space:nowrap; font-size:12px; gap:10px; }
.lb-toprow .lb-info strong{ font-size:13px; }
.lb-rewards-btn{ padding:5px 12px; border:none; border-radius:9px; background:linear-gradient(90deg,#6b3bff,#00b8ff); color:#fff; font:inherit; font-size:12px; font-weight:700; cursor:pointer; }
.lb-rw-note{ font-size:13px; color:#aeb8d6; margin:0 0 10px; }
.lb-rw-note b{ color:#ffd76a; }
.lb-rw-table{ display:flex; flex-direction:column; gap:4px; }
.lb-rw-row{ display:grid; grid-template-columns:70px 1fr auto; gap:10px; padding:7px 10px; border-radius:9px; background:rgba(255,255,255,.04); font-size:13px; text-align:left; }
.lb-rw-row b{ color:#ffd76a; }
@media (max-width:700px){
    .lb-toprow{ gap:6px; }
    .lb-toprow .lb-view-toggle{ padding:3px; gap:2px; }
    .lb-toprow .lb-view-toggle button{ padding:6px 8px; font-size:11px; }
    .lb-toprow .lb-info{ padding:5px 5px 5px 8px; gap:6px; font-size:11px; }
    .lb-toprow .lb-info strong{ font-size:11px; }
    .lb-toprow .lb-i-ends, .lb-toprow .lb-i-unit, .lb-toprow .lb-info.has-btn .lb-i-pool{ display:none; }
    .lb-rewards-btn{ padding:5px 8px; font-size:11px; }
}

/* Beta banner Bugs button + Bugs & testers popup (17 Oct) */
.beta-banner{ display:flex; align-items:center; justify-content:center; gap:8px 10px; flex-wrap:wrap; }
/* Oct 2026: bigger, in the theme colour (players missed the small ones) */
.beta-bug-btn{ min-height:38px; padding:8px 22px; border:none; border-radius:10px; background:linear-gradient(100deg, #6B3BFF, #8b3fff); box-shadow:0 0 14px rgba(139,63,255,.45); color:#fff; font:inherit; font-size:15px; font-weight:800; letter-spacing:.03em; cursor:pointer; transition:.2s; }
.beta-bug-btn:hover{ transform:translateY(-2px); box-shadow:0 0 20px rgba(139,63,255,.7); }
@media (max-width:820px){ .beta-bug-btn{ min-height:36px; padding:7px 16px; font-size:14px; } }

/* Oct 2026: screenshot upload in the bug form (bugReport.js) */
.bug-shot{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:6px; }
.bug-shot .bug-shot-btn{ width:auto; margin-top:0; padding:0 18px; }
.bug-shot-status{ font-size:12px; opacity:.85; }
.bug-shot-preview:empty{ display:none; }
.bug-shot-preview img{ display:block; max-width:100%; max-height:160px; border-radius:8px; margin:4px 0 8px; border:1px solid rgba(255,255,255,.15); }
.bug-panel{ text-align:left; width:100%; }
.game-popup-box:has(.bug-panel){ width:min(600px, 94vw) !important; max-width:min(600px, 94vw) !important; }
.bug-tabs{ display:flex; gap:4px; padding:4px; margin:0 0 12px; border-radius:12px; background:rgba(20,12,38,.7); border:1px solid rgba(139,63,255,.3); }
.bug-tabs button{ flex:1 1 0; padding:7px 6px; border:none; border-radius:9px; background:none; color:#aeb8d6; font:inherit; font-weight:700; font-size:12px; cursor:pointer; white-space:nowrap; }
.bug-tabs button.active{ background:linear-gradient(90deg,#6b3bff,#00b8ff); color:#fff; }
.bug-body{ max-height:min(58vh, 520px); overflow-y:auto; padding-right:2px; }
.bug-note{ font-size:12px; color:#aeb8d6; margin:0 0 10px; line-height:1.45; }
.bug-note b{ color:#ffd76a; }
.bug-note.small{ font-size:11px; margin-top:6px; text-align:center; }
.bug-lbl{ display:block; font-size:12px; font-weight:700; color:#cfd6f0; margin:8px 0 4px; }
.bug-panel .game-popup-input{ width:100%; box-sizing:border-box; margin:0; }
.bug-ta{ min-height:84px; resize:vertical; font:inherit; }
.bug-ta.small{ min-height:56px; }
.bug-check{ display:flex; gap:8px; align-items:flex-start; font-size:12px; color:#cfd6f0; margin:10px 0; }
.bug-send{ width:100%; margin-top:6px; }
.bug-err{ color:#ff7a8a; font-size:12px; font-weight:700; margin:6px 0; }
.bug-similar{ margin:8px 0; padding:10px; border-radius:12px; background:rgba(255,215,106,.08); border:1px solid rgba(255,215,106,.3); font-size:12px; }
.bug-similar p{ margin:0 0 8px; color:#ffd76a; font-weight:700; }
.bug-similar > .pvp-secondary-btn{ width:100%; margin-top:6px; }
.bug-list{ display:flex; flex-direction:column; gap:6px; }
.bug-row{ display:flex; align-items:center; gap:8px; padding:8px 10px; border-radius:10px; background:rgba(255,255,255,.04); border:1px solid rgba(139,63,255,.18); }
.bug-row.bug-you{ border-color:rgba(0,229,255,.6); }
.bug-row-main{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:2px; }
.bug-row-main b{ font-size:13px; color:#fff; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bug-row-main span{ font-size:11px; color:#8f9bbf; }
.bug-row .pvp-secondary-btn{ flex:0 0 auto; padding:6px 10px; font-size:11px; }
.bug-pill{ flex:0 0 auto; padding:3px 8px; border-radius:999px; font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.03em; background:rgba(255,255,255,.08); color:#cfd6f0; }
.bug-st-verified{ background:rgba(0,229,255,.15); color:#00E5FF; }
.bug-st-fixed{ background:rgba(197,251,98,.15); color:#C5FB62; }
.bug-st-duplicate, .bug-st-notbug{ background:rgba(255,255,255,.05); color:#8f9bbf; }
.bug-pts{ flex:0 0 auto; min-width:34px; text-align:right; font-weight:800; color:#ffd76a; font-size:13px; }
.bug-rank{ flex:0 0 auto; width:30px; font-weight:800; color:#ffd76a; }
.bug-me{ display:grid; grid-template-columns:repeat(4, 1fr); gap:6px; margin-bottom:10px; }
.bug-me div{ display:flex; flex-direction:column; align-items:center; gap:2px; padding:8px 4px; border-radius:10px; background:rgba(139,63,255,.12); }
.bug-me span{ font-size:10px; color:#aeb8d6; text-align:center; }
.bug-me b{ font-size:16px; color:#fff; }
@media (max-width:700px){
    .bug-me{ grid-template-columns:repeat(2, 1fr); }
    .bug-tabs button{ font-size:11px; padding:7px 4px; }
}

/* Download app icon next to X / Discord: hidden inside the installed app */
body.is-app .install-app-link{ display:none !important; }

/* Login: beta access code (18 Oct) */
.lg-code-wrap{ display:flex; flex-direction:column; align-items:center; gap:6px; margin:4px 0 12px; }
#loginGate.checking .lg-code-wrap{ display:none; }
.lg-code-label{ font-size:12px; font-weight:800; color:#cfd6f0; letter-spacing:.04em; }
.lg-code-label span{ color:#8f9bbf; font-weight:600; }
.lg-code-input{ width:min(260px, 80vw); box-sizing:border-box; padding:10px 14px; border-radius:12px; border:1px solid rgba(0,229,255,.5); background:rgba(11,11,20,.7); color:#fff; font:inherit; font-size:16px; font-weight:800; letter-spacing:.12em; text-align:center; text-transform:uppercase; }
.lg-code-input::placeholder{ color:#4f5878; letter-spacing:.12em; }
.lg-code-input:focus{ outline:none; border-color:#00E5FF; box-shadow:0 0 0 3px rgba(0,229,255,.18); }
.lg-code-input.lg-code-need{ border-color:#ffd76a; box-shadow:0 0 0 3px rgba(255,215,106,.2); }
.lg-code-hint{ font-size:11px; color:#8f9bbf; max-width:280px; }
.inv-code{ font-family:ui-monospace, Menlo, monospace; letter-spacing:.06em; }
.inv-h{ margin:12px 0 6px; font-size:13px; color:#fff; }
.inv-prizes{ display:grid; grid-template-columns:1fr; gap:4px; margin:0 0 6px; }
.inv-prizes div{ display:flex; gap:10px; align-items:center; padding:6px 10px; border-radius:9px; background:rgba(255,215,106,.07); border:1px solid rgba(255,215,106,.2); font-size:12px; }
.inv-prizes span{ flex:0 0 34px; font-weight:800; color:#ffd76a; }
.inv-prizes b{ color:#fff; font-weight:700; }
@media (max-width:700px){ .bug-tabs button{ font-size:10.5px; padding:7px 2px; } }

/* Top bar "App" button (18 Oct): download / install the game as an app */
.top-app-btn{ display:inline-flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; font-weight:800; font-size:10px; letter-spacing:.04em; color:#B8C6E3; }
.top-app-btn svg{ width:18px; height:18px; }
.top-app-btn:hover{ color:#00E5FF; }
@media (max-width:700px){ .top-app-btn{ display:none !important; } }

/* No more hover blinking (18 Oct): a "lift" on hover moved the box away
   from the cursor at its edge -> hover off -> back -> fast blinking.
   The lift is gone; the glow / border / shadow on hover stays. */
.top-btn:hover, .guardian-slot:hover, .equipment-slot:hover, .stat-item:hover, .coin-card:hover,
.inventory-item:hover, .craft-btn:hover:not(:disabled), #devButton:hover, .promo-play-btn:hover,
.beast-slot:hover, .beast-slot .craftGuardianBtn:hover, .equipGuardianBtn:hover, .guardian-equip-btn:hover,
.mock-nft-card:hover, .add-guardian-nft-thumb:hover, .claimFreeBeastBtn:hover, .upgrade-storage-btn:hover,
.exchange-card:hover, .openPrestigeBtn:hover, .login-gate-btn:hover, .pack-card:hover, .pack-card button:hover,
.mk-card:hover, .mk-stat-click:hover, .mk-sell-card:hover:not(:disabled), .mk-act-row:hover, .shop-pack:hover,
.as-card:hover, .inv-click:hover, .sidebar-social a:hover, .level-card:hover, .hunt-btn:hover, .buy-btn:hover,
.unlock-btn:hover, .boss-clickable:hover, .slot-empty-icon.clickable:hover{ transform:none !important; }

/* My Beasts (18 Oct): the wallet list left the page; "+ Add Beast" opens the list with the big card */
.wallet-guardians-section{ display:none !important; }

/* Oct 2026: X post quest: "Open post" and "Claim" side by side, same size + colour */
.quest-action-pair{ display:flex; gap:10px; align-items:center; }
.quest-action-pair .quest-btn.craft-btn{ width:auto; flex:1 1 0; min-width:120px; height:40px; margin-top:0; padding:0 16px; white-space:nowrap; }
@media (max-width:600px){ .quest-action-pair{ width:100%; } .quest-action-pair .quest-btn.craft-btn{ min-width:0; } }

/* Oct 2026: Bugs + Invite always side by side (PC and phone) */
.beta-btn-row{ display:inline-flex; flex-wrap:nowrap; gap:10px; align-items:center; }
@media (max-width:820px){ .beta-btn-row{ width:100%; justify-content:center; } .beta-btn-row .beta-bug-btn{ flex:1 1 0; max-width:200px; } }

/* Oct 2026 (beta bug #24): next level progress bar on each hunting card */
.level-unlock-progress .unlock-text{ display:block; }
.level-unlock-progress .unlock-bar{ display:block; height:8px; margin:5px 0 4px; border-radius:999px; background:rgba(255,255,255,.1); overflow:hidden; }
.level-unlock-progress .unlock-bar i{ display:block; height:100%; border-radius:999px; background:linear-gradient(90deg,#ffd76a,#ffb020); transition:width .4s; }
.level-unlock-progress .unlock-left{ display:block; font-size:11px; font-weight:600; color:#cbbfe8; }
@media (max-width:600px){ .level-unlock-progress{ font-size:12px; } .level-unlock-progress .unlock-bar{ height:10px; } }

/* Oct 2026: Neon on its way, next to the header balance */
.neon-onway{ display:block; font-size:11px; font-weight:700; color:#35ff96; line-height:1.1; }
.neon-onway:empty{ display:none; }

/* Oct 2026: Bugs > Testers: your rank box + your row under the top 20 */
.bug-me .bug-me-rank b{ color:#ffd76a; }
.bug-me{ grid-template-columns:repeat(5, 1fr); }
@media (max-width:420px){ .bug-me{ grid-template-columns:repeat(3, 1fr); } }
.bug-row-gap{ text-align:center; opacity:.5; letter-spacing:4px; margin:2px 0; }

/* Oct 2026 (beta): gold name shine ran 1.3 times per loop, so the 2nd pass was cut
   off and jumped back. Now the light passes exactly once per loop, smooth. */
.pvp-card.cos-nameGold .pvp-card-name,
.leaderboard-name.lb-cos-nameGold{
    background-size:200% 100% !important;
    animation:cosShimmerLoop 3s linear infinite !important;
}
@keyframes cosShimmerLoop{ from{ background-position:0% 0; } to{ background-position:-200% 0; } }

/* Oct 2026 (beta): every cosmetic shine now runs ONE clean pass per loop
   (the title-row sheen ran 1.5 passes, so the 2nd one was cut off) */
.leaderboard-row.lb-titled::after{
    background-repeat:no-repeat !important;
    animation:lbSheenOnce 4.5s linear infinite !important;
}
@keyframes lbSheenOnce{ from{ background-position:100% 0; } to{ background-position:-10% 0; } }
/* colour loops that ended on another colour than they started: jumped every loop */
.lb-badge-titleImmortal{ background-image:linear-gradient(90deg, #ff4d6d, #ffd76a, #35ffb0, #00d5ff, #a259ff, #ff4d6d) !important; }
.leaderboard-row.lb-cos-frameDiamond{
    background:linear-gradient(100deg, rgba(124,200,255,.14), rgba(10,18,40,.6) 50%, rgba(124,200,255,.14)) !important;
    background-size:200% 100% !important;
}
@media (prefers-reduced-motion:reduce){ .leaderboard-row.lb-titled::after{ animation:none !important; } }

/* Oct 2026: My Beasts "Swap slot" (theme colour, above Unequip) */
.swapGuardianBtn{ width:100%; padding:10px; margin-bottom:8px; border:none; border-radius:8px;
    background:linear-gradient(100deg, #6B3BFF, #8b3fff); box-shadow:0 0 12px rgba(139,63,255,.35);
    color:#fff; font-weight:700; font-size:12px; cursor:pointer; }
.swapGuardianBtn:hover{ box-shadow:0 0 18px rgba(139,63,255,.6); }

/* Oct 2026: Marketplace listings: Prev / Next */
.mk-pager{ display:flex; align-items:center; justify-content:flex-end; gap:10px; margin:14px 0 4px; flex-wrap:wrap; }
.mk-pager span{ font-size:12px; color:#aeb8d6; margin-right:4px; }
.mk-pager-btn{ height:34px; padding:0 16px; border:none; border-radius:8px; cursor:pointer;
    background:linear-gradient(100deg, #6B3BFF, #8b3fff); box-shadow:0 0 10px rgba(139,63,255,.35);
    color:#fff; font-weight:700; font-size:12px; }
.mk-pager-btn:disabled{ opacity:.4; cursor:not-allowed; box-shadow:none; }