
/* ================= SIDEBAR ================= */
.sidebar-overlay{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.68);
    backdrop-filter:blur(3px);
    opacity:0;
    visibility:hidden;
    transition:opacity .25s ease,visibility .25s ease;
    z-index:1990;
}
.sidebar-overlay.active{
    opacity:1;
    visibility:visible;
}

.side-menu{
    position:fixed;
    top:0;
    left:0;
    width:min(86vw,360px);
    height:100dvh;
    background:linear-gradient(180deg,#111214 0%,#0c0d0f 100%);
    border-right:1px solid #292b2f;
    box-shadow:14px 0 40px rgba(0,0,0,.45);
    transform:translateX(-105%);
    transition:transform .28s cubic-bezier(.22,.61,.36,1);
    z-index:2000;
    overflow-y:auto;
    overscroll-behavior:contain;
    scrollbar-width:none;
}
.side-menu::-webkit-scrollbar{display:none}
.side-menu.active{transform:translateX(0)}

.side-head{
    height:64px;
    padding:9px 11px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    border-bottom:1px solid #282a2e;
    background:#121417;
    position:sticky;
    top:0;
    z-index:2;
}
.side-logo{
    width:110px;
    max-height:38px;
    object-fit:contain;
}
.side-close{
    width:38px;
    height:38px;
    border:1px solid #34373c;
    border-radius:10px;
    background:#1d2024;
    color:#ddd;
    cursor:pointer;
    font-size:22px;
    line-height:1;
}

.side-promo{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:7px;
    padding:10px;
}
.side-promo-card{
    min-height:75px;
    border:1px solid #303238;
    border-radius:10px;
    padding:10px;
    background:linear-gradient(145deg,#22252a,#151619);
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
}
.side-promo-card:first-child{
    border-color:rgba(36,217,138,.4);
    background:linear-gradient(145deg,#302818,#181714);
}
.side-promo-card strong{font-size:11px;color:#eee}
.side-promo-card small{font-size:8px;color:#aaa;margin-top:4px}

.side-tabs{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:6px;
    padding:0 10px 11px;
}
.side-tab{
    height:35px;
    border:1px solid #303238;
    border-radius:8px;
    background:#181a1e;
    color:#aaa;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    font-size:10px;
    font-weight:800;
    text-decoration:none;
}
.side-tab.active{
    color:#6bf0b2;
    border-color:rgba(36,217,138,.45);
    background:#242119;
}

.side-section{
    padding:10px 10px 5px;
    color:#74767b;
    font-size:9px;
    font-weight:900;
    letter-spacing:1.3px;
}
.side-link{
    margin:2px 8px;
    min-height:43px;
    padding:0 11px;
    display:flex;
    align-items:center;
    gap:11px;
    border-radius:9px;
    color:#c8c9cc;
    text-decoration:none;
    font-size:11px;
    font-weight:700;
    border:1px solid transparent;
}
.side-link:hover,
.side-link.active{
    color:#6bf0b2;
    background:#1b1b1a;
    border-color:rgba(36,217,138,.18);
}
.side-icon{
    width:20px;
    text-align:center;
    font-size:15px;
    color:#9b9da2;
}
.side-link:hover .side-icon,
.side-link.active .side-icon{color:#24d98a}
.side-arrow{
    margin-left:auto;
    color:#62646a;
    font-size:13px;
}
.side-divider{
    height:1px;
    background:#24262a;
    margin:8px 18px;
}
.side-auth{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:7px;
    padding:14px 18px 22px;
}
.side-auth a{
    height:40px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:9px;
    font-size:10px;
    font-weight:900;
    text-decoration:none;
}
.side-auth .side-login{
    color:#ddd;
    background:#202226;
    border:1px solid #34373c;
}
.side-auth .side-register{
    color:#111;
    background:linear-gradient(135deg,#57efab,#0fa969);
    border:1px solid #2ee59a;
}
body.sidebar-open{overflow:hidden}

/* Sidebar responsive polish */
.side-menu{width:min(86vw,360px);max-width:100%;}
.side-head,.side-promo,.side-tabs,.side-section,.side-divider,.side-auth{max-width:100%}
.side-promo-card,.side-link,.side-tab,.side-auth a{min-width:0}
.side-promo-card strong,.side-promo-card small,.side-link>span:nth-child(2){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (min-width:700px){
  .side-menu{width:min(380px,42vw)}
  .side-promo{grid-template-columns:1fr 1fr}
}
@media (max-width:380px){
  .side-menu{width:90vw}
  .side-promo{grid-template-columns:1fr}
  .side-promo-card{min-height:58px}
  .side-link{margin-left:6px;margin-right:6px}
  .side-auth{padding-left:12px;padding-right:12px}
}
/* Sidebar responsive polish */
.side-menu{width:min(86vw,360px);max-width:100%}.side-promo-card,.side-link,.side-tab,.side-auth a{min-width:0}.side-promo-card strong,.side-promo-card small,.side-link>span:nth-child(2){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (min-width:700px){.side-menu{width:min(380px,42vw)}.side-promo{grid-template-columns:1fr 1fr}}
@media (max-width:380px){.side-menu{width:90vw}.side-promo{grid-template-columns:1fr}.side-promo-card{min-height:58px}.side-link{margin-left:6px;margin-right:6px}.side-auth{padding-left:12px;padding-right:12px}}


/* Final sidebar mobile/desktop usability */
.side-menu{display:flex;flex-direction:column;}
.side-head{flex:0 0 auto;}
.side-promo,.side-tabs,.side-section,.side-divider,.side-link{flex-shrink:0;}
.side-auth{position:sticky;bottom:0;z-index:8;flex-shrink:0;background:linear-gradient(180deg,rgba(12,13,15,.94),#0c0d0f 35%);backdrop-filter:blur(10px);border-top:1px solid #24262a;padding-bottom:calc(14px + env(safe-area-inset-bottom));}
@media(max-height:620px){.side-head{height:56px}.side-promo{padding:7px}.side-promo-card{min-height:58px;padding:8px}.side-tabs{padding-bottom:7px}.side-link{min-height:38px}.side-auth{padding-top:9px;padding-bottom:calc(9px + env(safe-area-inset-bottom));}}

/* Category artwork — public sidebar only */
.side-link .side-icon img{
    width:20px;
    height:20px;
    display:block;
    object-fit:contain;
}
.side-link.active .side-icon img,
.side-link:hover .side-icon img{
    transform:scale(1.04);
}

/* ================= MEMBER SIDEBAR REDESIGN ================= */
.side-menu{
    background:linear-gradient(180deg,#111d25 0%,#15232c 100%) !important;
    border-right:1px solid #263b48 !important;
    padding-bottom:12px;
}
.side-head{background:#14212a !important;border-bottom:1px solid #263b48 !important}
.side-close{background:#23333d !important;border-color:#354b58 !important;color:#aebcc5 !important}
.side-profile-card{margin:10px 14px 8px;padding:11px 10px 10px;border-radius:13px;background:linear-gradient(145deg,#1a2b35,#17262f);border:1px solid #263f4d;box-shadow:0 10px 25px rgba(0,0,0,.18)}
.side-profile-top{display:flex;align-items:center;gap:9px}.side-avatar{width:45px;height:45px;border-radius:50%;overflow:hidden;display:grid;place-items:center;flex:0 0 45px;background:linear-gradient(145deg,#60757f,#263841);border:2px solid #455b66;box-shadow:0 4px 12px rgba(0,0,0,.25)}.side-avatar img{width:100%;height:100%;object-fit:cover}.side-avatar span{font-size:18px;font-weight:900;color:#fff}.side-profile-info{min-width:0;display:flex;flex-direction:column;gap:3px}.side-profile-info strong{font-size:13px;color:#f1f6f8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.side-profile-info span{font-size:10px;color:#a9bac4}.side-balance{margin-top:9px;font-size:20px;font-weight:900;color:#f4f8f9;letter-spacing:.2px}.side-wallet-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:9px}.side-wallet-btn{height:39px;border-radius:9px;display:flex;align-items:center;justify-content:center;gap:7px;text-decoration:none;font-size:10px;font-weight:900}.side-wallet-btn.withdraw{background:linear-gradient(145deg,#d9f26d,#b7e33e);color:#1c280c}.side-wallet-btn.deposit{background:#b8bdd7;color:#1c2332}.side-wallet-btn span{font-size:15px}
.side-feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px 6px;padding:8px 18px 10px}.side-feature{position:relative;min-width:0;text-decoration:none;color:#f0f4f6;display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px}.feature-icon{width:45px;height:45px;border-radius:10px;background:linear-gradient(145deg,#5b654b,#38423a);border:1px solid #65705b;display:grid;place-items:center;font-size:25px;box-shadow:0 5px 10px rgba(0,0,0,.2)}.side-feature b{font-family:Georgia,serif;font-size:9px;line-height:1.12;font-weight:700}.feature-badge{position:absolute;right:8px;top:34px;width:14px;height:14px;border-radius:50%;background:#d7202f;color:#fff;font-size:8px;display:grid;place-items:center;border:1px solid #6f0d17;font-style:normal}.side-feature:hover .feature-icon{transform:translateY(-1px);border-color:#7fefaf}.side-service{margin:4px 14px 0;min-height:51px;padding:7px 9px;border-radius:11px;border:1px solid #314955;background:linear-gradient(145deg,#22343e,#1b2b34);display:flex;align-items:center;gap:8px;color:#fff;text-decoration:none}.service-avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#263d46;font-size:20px;flex:0 0 34px}.side-service>span:nth-child(2){min-width:0;flex:1}.side-service strong{display:block;font-size:10px}.side-service small{display:block;margin-top:2px;color:#93a7b2;font-size:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.side-service>b{font-size:18px;color:#d6b13d}.side-share{margin:7px 14px 0;height:17px;display:flex;align-items:center;justify-content:center;color:#d3a72e;font-size:7px;border-top:1px solid #324550;border-bottom:1px solid #324550}.side-socials{display:flex;justify-content:space-around;padding:8px 22px 2px}.side-socials a{width:25px;height:25px;border-radius:50%;display:grid;place-items:center;text-decoration:none;background:#20323c;color:#fff;font-size:15px;font-weight:900;border:1px solid #314854}.side-socials a:hover{border-color:#63e8a6;color:#63e8a6}
@media(max-width:380px){.side-profile-card{margin-left:10px;margin-right:10px}.side-feature-grid{padding-left:12px;padding-right:12px;gap:7px 4px}.feature-icon{width:42px;height:42px}.side-service{margin-left:10px;margin-right:10px}.side-socials{padding-left:16px;padding-right:16px}}


/* ================= MEMBER SIDEBAR — GREEN THEME ================= */
.side-menu{
    background:linear-gradient(180deg,#071b13 0%,#0b261b 48%,#081a12 100%) !important;
    border-right:1px solid #174d35 !important;
}
.side-head{background:#091c14 !important;border-bottom:1px solid #174d35 !important}
.side-close{background:#123324 !important;border-color:#245c42 !important;color:#b8e9cf !important}
.side-profile-card{
    background:linear-gradient(145deg,#0e3322,#0a2519) !important;
    border-color:#1d6243 !important;
    box-shadow:0 10px 25px rgba(0,0,0,.22) !important;
}
.side-avatar{
    background:linear-gradient(145deg,#245d43,#123625) !important;
    border-color:#2e7654 !important;
}
.side-profile-info strong{color:#f2fff8 !important}
.side-profile-info span{color:#9ccbb4 !important}
.side-balance{color:#effff6 !important}
.side-wallet-btn.withdraw{
    background:linear-gradient(145deg,#5ce59b,#20bd70) !important;
    color:#062014 !important;
}
.side-wallet-btn.deposit{
    background:linear-gradient(145deg,#c9f4dd,#8bdcb5) !important;
    color:#0a2b1b !important;
}
.side-feature .feature-icon{
    background:linear-gradient(145deg,#1e5a3e,#123d2b) !important;
    border-color:#347a59 !important;
}
.side-feature:hover .feature-icon{border-color:#6bf0ad !important}
.side-service{
    background:linear-gradient(145deg,#123726,#0d2b1e) !important;
    border-color:#276246 !important;
}
.service-avatar{background:#184731 !important}
.side-service>b{color:#5bea9d !important}
.side-share{color:#5bea9d !important;border-color:#23583f !important}
.side-socials a{
    background:#123526 !important;
    border-color:#276046 !important;
}
.side-socials a:hover{border-color:#63e8a6 !important;color:#63e8a6 !important}


/* ================= MEMBER SIDEBAR — PREMIUM POLISH V27 ================= */
.side-menu{
    font-family:"Poppins","Inter",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
    background:
      radial-gradient(circle at 100% 0%,rgba(72,226,147,.10),transparent 28%),
      linear-gradient(180deg,#061810 0%,#092218 46%,#06150f 100%) !important;
    border-right:1px solid rgba(82,225,155,.24) !important;
}
.side-head{
    background:rgba(5,22,15,.94) !important;
    border-bottom:1px solid rgba(82,225,155,.16) !important;
    box-shadow:0 6px 22px rgba(0,0,0,.12);
}
.side-logo{filter:drop-shadow(0 5px 12px rgba(48,230,142,.10));}
.side-close{
    width:36px;height:36px;border-radius:11px;
    background:rgba(28,74,52,.55) !important;
    border:1px solid rgba(100,235,169,.20) !important;
    color:#b9f5d5 !important;
    font-family:inherit;font-weight:500;
    transition:.2s ease;
}
.side-close:hover{transform:rotate(90deg);background:#174b34 !important;color:#fff !important}
.side-profile-card{
    margin:12px 12px 9px !important;
    padding:12px !important;
    border-radius:16px !important;
    background:linear-gradient(145deg,rgba(18,64,43,.94),rgba(7,35,23,.98)) !important;
    border:1px solid rgba(87,226,151,.20) !important;
    box-shadow:0 14px 30px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.035) !important;
}
.side-avatar{
    width:48px;height:48px;flex-basis:48px;border:2px solid rgba(101,239,171,.34) !important;
    background:linear-gradient(145deg,#1f6848,#0c3020) !important;
}
.side-profile-info strong{font-size:12px !important;letter-spacing:.1px}
.side-profile-info span{font-size:9px !important;color:#8fc8aa !important}
.side-balance{font-size:21px !important;letter-spacing:.3px;text-shadow:0 4px 15px rgba(75,231,153,.08)}
.side-wallet-actions{gap:8px !important;margin-top:10px !important}
.side-wallet-btn{height:41px !important;border-radius:11px !important;gap:8px !important;font-family:inherit !important;font-size:10px !important;letter-spacing:.05px;box-shadow:0 5px 12px rgba(0,0,0,.12);transition:transform .18s ease,filter .18s ease}
.side-wallet-btn:hover{transform:translateY(-1px);filter:brightness(1.04)}
.side-wallet-btn.withdraw{background:linear-gradient(135deg,#8be84e,#35cf7d) !important;color:#062113 !important}
.side-wallet-btn.deposit{background:linear-gradient(135deg,#d8f8e8,#83dfb5) !important;color:#0a2d1d !important}
.wallet-icon{width:21px;height:21px;display:grid;place-items:center}
.wallet-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.side-feature-grid{padding:8px 15px 11px !important;gap:10px 5px !important}
.side-feature{gap:5px !important}
.feature-icon{
    width:47px;height:47px;border-radius:13px !important;
    background:linear-gradient(145deg,#1a5c3d,#0d3926) !important;
    border:1px solid rgba(98,231,164,.24) !important;
    box-shadow:0 7px 15px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.04) !important;
    font-size:24px;transition:.18s ease;
}
.side-feature b{font-family:inherit !important;font-size:8.5px !important;font-weight:700 !important;color:#e9f8f0}
.side-feature:hover .feature-icon{transform:translateY(-2px) scale(1.02);box-shadow:0 10px 18px rgba(23,190,108,.12),inset 0 1px 0 rgba(255,255,255,.06)}
.feature-badge{background:#ff3150 !important;border-color:#8f1428 !important;box-shadow:0 3px 8px rgba(255,49,80,.25)}
.side-service{
    margin:4px 12px 0 !important;min-height:56px !important;padding:8px 10px !important;
    border-radius:13px !important;
    background:linear-gradient(145deg,#123e2b,#0c2c1f) !important;
    border:1px solid rgba(91,224,155,.20) !important;
    box-shadow:0 8px 18px rgba(0,0,0,.14);
}
.service-avatar{width:36px;height:36px;flex-basis:36px;background:linear-gradient(145deg,#1d6244,#103824) !important;border:1px solid rgba(105,238,175,.16);}
.service-avatar svg{width:21px;height:21px;fill:none;stroke:#8af0bc;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.side-service strong{font-size:10px !important;letter-spacing:.1px}.side-service small{font-family:inherit !important;color:#89bda4 !important;font-size:7.5px !important}
.side-service>b{color:#67eaa5 !important;font-size:25px;font-weight:400}
.side-share{margin:8px 12px 0 !important;height:22px !important;color:#7eeab0 !important;border-color:rgba(87,226,151,.16) !important;font-size:8px !important;font-weight:700;letter-spacing:.15px}
.side-socials{padding:9px 18px 3px !important;gap:10px;justify-content:center !important}
.side-socials a{
    width:30px !important;height:30px !important;border-radius:10px !important;
    background:#102f22 !important;border:1px solid rgba(92,222,154,.18) !important;
    box-shadow:0 5px 12px rgba(0,0,0,.14);transition:.18s ease;
}
.side-socials a img{width:16px;height:16px;display:block}
.side-socials a:hover{transform:translateY(-2px);background:#174b34 !important;border-color:#67eaa5 !important;color:#fff !important}
@media(max-width:380px){.side-feature-grid{padding-left:12px !important;padding-right:12px !important}.feature-icon{width:44px;height:44px}.side-profile-card{margin-left:10px !important;margin-right:10px !important}.side-service{margin-left:10px !important;margin-right:10px !important}.side-socials{padding-left:14px !important;padding-right:14px !important}}


/* ================= MEMBER SIDEBAR — NAV BACKGROUND + ACTIVITY ART ================= */
.side-menu{
    background:
      linear-gradient(180deg,rgba(3,17,12,.70) 0%,rgba(4,20,14,.76) 52%,rgba(3,15,11,.82) 100%),
      url("https://rk55w8.com/assets/nav_bg.d0b10e3a.png") center top / cover no-repeat !important;
    background-attachment:scroll !important;
}
.side-head{background:rgba(5,19,14,.82) !important}
.side-profile-card{background:linear-gradient(145deg,rgba(10,48,32,.82),rgba(5,29,19,.90)) !important}
.side-feature-grid{position:relative}
.side-feature .feature-icon{
    background:linear-gradient(145deg,rgba(16,65,42,.62),rgba(7,37,25,.70)) !important;
    border-color:rgba(101,220,160,.18) !important;
}
.side-feature .feature-icon img{
    width:100%;
    height:100%;
    padding:3px;
    object-fit:contain;
    display:block;
    border-radius:12px;
}
.side-feature .feature-fallback{font-size:23px;line-height:1}
.side-feature:hover .feature-icon{
    background:linear-gradient(145deg,rgba(21,83,54,.70),rgba(8,43,28,.78)) !important;
}

/* ================= MEMBER SIDEBAR — SIX FEATURE GRID + LANGUAGE PICKER ================= */
.side-feature-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:12px 6px !important;padding:9px 15px 12px !important}
.side-feature{font-family:"Poppins","Inter",system-ui,-apple-system,"Segoe UI",sans-serif !important}
.side-feature button,.side-language-trigger{appearance:none;-webkit-appearance:none;border:0;cursor:pointer;background:transparent;padding:0;width:100%}
.side-language-trigger .feature-icon{display:grid}
.language-icon{display:grid;place-items:center;width:100%;height:100%}
.language-icon svg{width:25px;height:25px;fill:none;stroke:#c8f8df;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.side-feature .feature-icon img{width:36px;height:36px;object-fit:contain;display:block}
.language-modal{position:fixed;inset:0;z-index:5000;opacity:0;visibility:hidden;pointer-events:none;transition:.2s ease}
.language-modal.active{opacity:1;visibility:visible;pointer-events:auto}
.language-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(5px)}
.language-dialog{position:absolute;left:50%;top:50%;transform:translate(-50%,-46%) scale(.97);width:min(88vw,320px);max-height:min(68vh,480px);overflow:hidden;border:1px solid rgba(88,231,157,.24);border-radius:18px;background:linear-gradient(180deg,#0b2418,#07170f);box-shadow:0 25px 70px rgba(0,0,0,.55);transition:.2s ease}
.language-modal.active .language-dialog{transform:translate(-50%,-50%) scale(1)}
.language-dialog-head{display:flex;align-items:center;justify-content:space-between;padding:16px;border-bottom:1px solid rgba(91,224,155,.14)}
.language-dialog-head strong{display:block;color:#effff6;font-size:15px}.language-dialog-head small{display:block;color:#8ebfa5;font-size:9px;margin-top:3px}
.language-close{width:32px;height:32px;border-radius:9px;border:1px solid rgba(105,235,170,.2);background:#113622;color:#c7f6dd;font-size:20px;cursor:pointer}
.language-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:7px;padding:12px;overflow:auto;max-height:calc(min(68vh,480px) - 68px)}
.language-grid button{display:flex;align-items:center;gap:9px;min-height:44px;padding:8px 10px;border:1px solid rgba(94,222,158,.13);border-radius:11px;background:rgba(16,55,37,.62);color:#e9f8f0;cursor:pointer;text-align:left;font-family:inherit;transition:.15s ease}
.language-grid button:hover,.language-grid button.selected{border-color:rgba(100,238,173,.48);background:rgba(27,91,60,.75);transform:translateY(-1px)}
.language-grid button span{font-size:20px;line-height:1}.language-grid button b{font-size:10px;font-weight:700}
body.language-picker-open{overflow:hidden}
@media(max-width:380px){.language-grid{grid-template-columns:1fr}.language-dialog{width:94vw}.side-feature-grid{gap:10px 4px !important}}
