/* ===================================================================
   SIDEBAR 3.0 — воздушный список: без иконных коробок и плиток,
   активный пункт — янтарная пилюля. Гамма прежняя.
   =================================================================== */
.sb { --sb-accent: #f59e0b; --sb-accent2: #fbbf24; }

/* Фоновое свечение */
.sb-glow-top { position: absolute; top: -90px; left: -70px; width: 260px; height: 260px; border-radius: 50%;
    background: radial-gradient(circle, rgba(245,158,11,0.09), transparent 70%); pointer-events: none; }

/* ---------- Карточка пользователя ---------- */
.sb-user { position: relative; margin: 14px 14px 0; padding: 14px; border-radius: 18px; overflow: hidden;
    background: linear-gradient(160deg, rgba(245,158,11,0.09) 0%, rgba(255,255,255,0.03) 45%, rgba(255,255,255,0.02) 100%);
    border: 1px solid rgba(255,255,255,0.07); }
.sb-user::after { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px;
    background: linear-gradient(90deg, transparent, rgba(245,158,11,0.5), transparent); }
.sb-avatar { width: 42px; height: 42px; border-radius: 50%; overflow: hidden; flex-shrink: 0;
    outline: 2px solid rgba(245,158,11,0.35); outline-offset: 2px; }
.sb-balance { font-size: 20px; font-weight: 800; color: #fff; letter-spacing: -0.02em;
    font-variant-numeric: tabular-nums; line-height: 1.1; }
.sb-balance small { font-size: 12px; font-weight: 700; color: #9ca3af; margin-left: 4px; }
.sb-money-btn { display: flex; align-items: center; justify-content: center; gap: 6px; flex: 1;
    min-height: 36px; padding: 7px 10px; border-radius: 10px; font-size: 11.5px; font-weight: 700;
    text-decoration: none; border: none; cursor: pointer; font-family: inherit;
    transition: transform .15s ease, background .2s ease, border-color .2s ease, box-shadow .2s ease; }
.sb-money-btn:active { transform: scale(0.97); }
.sb-money-btn.dep { color: #0a0d13; background: linear-gradient(135deg, var(--sb-accent2), var(--sb-accent));
    box-shadow: 0 3px 12px -4px rgba(245,158,11,0.55); }
.sb-money-btn.dep:hover { box-shadow: 0 5px 16px -4px rgba(245,158,11,0.7); }
.sb-money-btn.wd { color: #d1d5db; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.08); }
.sb-money-btn.wd:hover { background: rgba(255,255,255,0.09); color: #fff; }

/* ---------- Главная кнопка «Город» ---------- */
.sb-city { position: relative; display: flex; align-items: center; gap: 12px; padding: 13px 14px;
    border-radius: 16px; overflow: hidden; text-decoration: none; width: 100%;
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 60%, #b45309 100%);
    box-shadow: 0 8px 24px -8px rgba(245,158,11,0.55), inset 0 1px 0 rgba(255,255,255,0.25);
    transition: transform .18s ease, box-shadow .18s ease; border: none; font-family: inherit; cursor: pointer; }
.sb-city:hover { transform: translateY(-1px);
    box-shadow: 0 12px 30px -8px rgba(245,158,11,0.65), inset 0 1px 0 rgba(255,255,255,0.25); }
.sb-city:active { transform: scale(0.98); }
.sb-city::after { content: ''; position: absolute; inset: 0; pointer-events: none;
    background: linear-gradient(115deg, transparent 30%, rgba(255,255,255,0.28) 50%, transparent 70%);
    transform: translateX(-130%); animation: sb-shine 4.5s ease-in-out infinite; }
@keyframes sb-shine { 0%, 60%, 100% { transform: translateX(-130%); } 25% { transform: translateX(130%); } }
.sb-city-ico { width: 40px; height: 40px; border-radius: 12px; display: flex; align-items: center;
    justify-content: center; background: rgba(0,0,0,0.22); flex-shrink: 0; }
.sb-city-title { font-size: 14px; font-weight: 800; color: #0c0a06; line-height: 1.15; }
.sb-city-sub { font-size: 10.5px; font-weight: 600; color: rgba(0,0,0,0.55); margin-top: 1px; }
.sb-city.is-active { outline: 2px solid rgba(251,191,36,0.6); outline-offset: 2px; }

/* ---------- Главные игровые кнопки: премиум-плитки 2×2 ---------- */
.sb-tiles { display:grid; grid-template-columns: 1fr 1fr; gap:9px; }
.sb-tile { --tc:#f59e0b; --tc-rgb:245,158,11;
    position:relative; display:flex; flex-direction:column; justify-content:space-between; gap:12px;
    min-height:94px; padding:12px; border-radius:16px; overflow:hidden; text-decoration:none; isolation:isolate;
    background:
        radial-gradient(120% 85% at 100% 0%, rgba(var(--tc-rgb),0.16), transparent 55%),
        linear-gradient(160deg, rgba(255,255,255,0.05), rgba(255,255,255,0.015));
    border:1px solid rgba(255,255,255,0.07);
    transition: transform .22s cubic-bezier(.2,.7,.3,1), border-color .22s ease, box-shadow .25s ease; }
.sb-tile:hover { transform: translateY(-3px); border-color: rgba(var(--tc-rgb),0.4);
    box-shadow: 0 14px 28px -16px rgba(var(--tc-rgb),0.75); }
.sb-tile:active { transform: translateY(-1px) scale(.985); }
/* Нижняя акцентная линия категории */
.sb-tile::after { content:''; position:absolute; left:12px; right:12px; bottom:0; height:2px; border-radius:2px 2px 0 0;
    background: linear-gradient(90deg, var(--tc), transparent 80%); opacity:.45; transition: opacity .25s ease; }
.sb-tile:hover::after, .sb-tile.is-active::after { opacity:1; }
.sb-tile.is-active { border-color: rgba(var(--tc-rgb),0.5);
    background:
        radial-gradient(120% 85% at 100% 0%, rgba(var(--tc-rgb),0.22), transparent 55%),
        linear-gradient(160deg, rgba(var(--tc-rgb),0.10), rgba(255,255,255,0.02)); }

.sb-tile-ico { width:38px; height:38px; border-radius:12px; display:flex; align-items:center; justify-content:center;
    color:#fff; flex-shrink:0;
    background: linear-gradient(150deg, rgba(var(--tc-rgb),0.95), rgba(var(--tc-rgb),0.45));
    box-shadow: 0 6px 14px -6px rgba(var(--tc-rgb),0.85), inset 0 1px 0 rgba(255,255,255,0.28);
    transition: transform .2s ease; }
.sb-tile:hover .sb-tile-ico { transform: scale(1.08) rotate(-3deg); }
.sb-tile-ico svg { width:19px; height:19px; }
.sb-tile-name { font-size:12.5px; font-weight:800; color:#fff; letter-spacing:-0.01em; line-height:1.1; }
.sb-tile-sub { font-size:9.5px; font-weight:500; color:#7b8494; margin-top:3px; }

/* Цвета категорий */
.sb-tile.t-shop { --tc:#10b981; --tc-rgb:16,185,129; }
.sb-tile.t-cases { --tc:#f59e0b; --tc-rgb:245,158,11; }
.sb-tile.t-analytics { --tc:#22d3ee; --tc-rgb:34,211,238; }
.sb-tile.t-ach { --tc:#a78bfa; --tc-rgb:167,139,250; }

/* Кейс: png парит без цветной подложки */
.sb-tile.t-cases .sb-tile-ico { background: transparent; box-shadow: none; }
.sb-tile .sb-case-img { width: 38px; height: 38px; margin: 0; }

/* ---------- Пункты меню: чистые строки ---------- */
.sb-item { position: relative; display: flex; align-items: center; gap: 12px; min-height: 44px;
    padding: 10px 12px; border-radius: 12px; text-decoration: none; width: 100%;
    color: #9aa3b2; background: transparent; border: none; font-family: inherit; font-size: inherit;
    text-align: left; cursor: pointer;
    transition: color .18s ease, background .18s ease; }
.sb-item:hover { color: #fff; background: rgba(255,255,255,0.05); }
.sb-item svg, .sb-item .sb-ic { width: 19px; height: 19px; flex-shrink: 0;
    transition: filter .2s ease, transform .2s ease; }
.sb-item:hover svg { transform: scale(1.08); }
.sb-item.is-active { color: #fff; background: rgba(245,158,11,0.10); }
.sb-item.is-active svg { filter: drop-shadow(0 0 6px rgba(245,158,11,0.6)); }
.sb-item.is-active::after { content: ''; width: 5px; height: 5px; border-radius: 50%;
    background: var(--sb-accent2); margin-left: auto; box-shadow: 0 0 8px rgba(245,158,11,0.7); flex-shrink: 0; }
.sb-item-label { font-size: 13px; font-weight: 600; min-width: 0; }
.sb-badge { margin-left: auto; padding: 3px 7px; border-radius: 7px; font-size: 10px; font-weight: 800; line-height: 1; flex-shrink: 0; }

/* Кейс-иконка */
.sb-case-img { width: 26px; height: 26px; object-fit: contain; margin: -4px -3px;
    filter: drop-shadow(0 0 5px rgba(245,158,11,0.4));
    animation: case-sway 2.4s ease-in-out infinite; transform-origin: bottom center; }
@keyframes case-sway {
    0%, 100% { transform: rotate(-8deg) translateY(0px); }
    25% { transform: rotate(8deg) translateY(-2px); }
    50% { transform: rotate(-5deg) translateY(0px); }
    75% { transform: rotate(6deg) translateY(-1px); }
}

/* LIVE-метка */
.sb-live { display: inline-flex; align-items: center; gap: 4px; margin-left: auto; flex-shrink: 0; }
.sb-live-text { font-size: 9px; font-weight: 800; letter-spacing: .12em; color: #fb7185; text-transform: uppercase; }

/* ---------- Заголовки секций ---------- */
.sb-section { display: flex; align-items: center; gap: 8px; padding: 0 4px; margin-bottom: 6px; }
.sb-section-label { font-size: 10px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: #6b7280; }
.sb-section-line { flex: 1; height: 1px; background: linear-gradient(90deg, rgba(255,255,255,0.08), transparent); }

@media (prefers-reduced-motion: reduce) {
    .sb-city::after, .sb-case-img { animation: none; }
    .sb-city:hover, .sb-tile:hover { transform: none; }
    .sb-tile:hover .sb-tile-ico { transform: none; }
}