.srm-nav, .srm-backdrop, .srm-sheet { display: none !important; }

@media (max-width: 992px) {

    .srm-nav, .srm-sheet {
        font-family: -apple-system, BlinkMacSystemFont, 'Inter', 'Segoe UI', sans-serif;
    }

    body { padding-bottom: calc(80px + env(safe-area-inset-bottom)) !important; }

    @keyframes srmShimmer { 0%{background-position:200% 0}100%{background-position:-200% 0} }
    @keyframes srmDotPulse { 0%,100%{transform:scale(1)}50%{transform:scale(1.35)} }
    @keyframes srmBlueBlink { 0%,49%{opacity:1}50%,100%{opacity:.25} }
    @keyframes srmGreenGlow { 0%,100%{box-shadow:0 0 0 0 rgba(0,200,91,.55)}50%{box-shadow:0 0 0 4px rgba(0,200,91,0)} }

    .srm-nav {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        position: fixed !important;
        bottom: 0 !important; left: 0 !important; right: 0 !important;
        width: 100% !important;
        padding: 8px 12px calc(12px + env(safe-area-inset-bottom)) !important;
        visibility: visible !important;
        background: rgba(255, 255, 255, 0.96) !important;
        backdrop-filter: blur(20px) saturate(160%) !important;
        -webkit-backdrop-filter: blur(20px) saturate(160%) !important;
        border-top: 1.5px solid rgba(75, 108, 255, 0.12) !important;
        border-radius: 22px 22px 0 0 !important;
        box-shadow: 0 -4px 24px rgba(0,0,0,.10), 0 -1px 0 rgba(75,108,255,.06) !important;
        z-index: 99990 !important;
    }

    .srm-nav::before {
        content: '';
        position: absolute; top: 0; left: 10%; right: 10%; height: 2.5px; border-radius: 0 0 2px 2px;
        background: linear-gradient(90deg, transparent, #4b6cff 25%, #00c85b 50%, #4b6cff 75%, transparent);
        background-size: 200% 100%;
        animation: srmShimmer 2.8s linear infinite;
    }

    .srm-item, .srm-more-btn {
        display: flex !important; flex-direction: column !important;
        align-items: center !important; justify-content: center !important;
        gap: 4px !important; width: 20% !important;
        text-decoration: none !important; background: none !important; border: none !important;
        color: #94a3b8 !important;
        font-size: 10px !important; font-weight: 700 !important;
        padding: 4px 0 !important; cursor: pointer !important;
        -webkit-tap-highlight-color: transparent !important;
        transition: color .2s, transform .18s !important;
        position: relative !important;
    }
    .srm-item:active, .srm-more-btn:active { transform: scale(.92) !important; }

    .srm-icon {
        width: 26px !important; height: 26px !important;
        display: flex !important; align-items: center !important; justify-content: center !important;
        border-radius: 9px !important; transition: all .22s !important;
        position: relative !important;
    }
    .srm-icon svg {
        width: 20px !important; height: 20px !important;
        fill: none !important; stroke: #64748b !important;
        stroke-width: 2 !important; stroke-linecap: round !important; stroke-linejoin: round !important;
        transition: stroke .22s !important;
    }
    .srm-lbl { color: #64748b !important; transition: color .22s !important; }

    .srm-item.srm-active .srm-icon { background: rgba(75,108,255,.10) !important; }
    .srm-item.srm-active .srm-icon svg { stroke: #4b6cff !important; }
    .srm-item.srm-active .srm-lbl { color: #4b6cff !important; }
    .srm-more-btn.srm-active .srm-icon { background: rgba(75,108,255,.10) !important; }
    .srm-more-btn.srm-active .srm-icon svg { fill: #4b6cff !important; stroke: none !important; }
    .srm-more-btn.srm-active .srm-lbl { color: #4b6cff !important; }
    .srm-more-btn .srm-icon svg { fill: #64748b !important; stroke: none !important; }

    .srm-dot {
        position: absolute !important; top: -1px !important; right: -1px !important;
        width: 7px !important; height: 7px !important;
        background: #00c85b !important; border-radius: 50% !important;
        border: 1.5px solid #fff !important;
        animation: srmDotPulse 1.8s ease-in-out infinite !important;
    }

    .srm-center-wrap {
        width: 20% !important; display: flex !important;
        justify-content: center !important; align-items: center !important;
        position: relative !important;
    }
    .srm-fab {
        position: absolute !important; top: -36px !important;
        width: 58px !important; height: 58px !important;
        border-radius: 18px !important;
        background: linear-gradient(145deg, #00c85b, #00a64c) !important;
        border: 3.5px solid #fff !important;
        box-shadow: 0 6px 20px rgba(0,200,91,.40), 0 2px 6px rgba(0,200,91,.20) !important;
        display: flex !important; flex-direction: column !important;
        align-items: center !important; justify-content: center !important; gap: 2px !important;
        text-decoration: none !important; color: #fff !important;
        -webkit-tap-highlight-color: transparent !important;
        transition: transform .22s cubic-bezier(.34,1.56,.64,1), box-shadow .22s !important;
    }
    .srm-fab svg { width: 20px !important; height: 20px !important; fill: #fff !important; stroke: none !important; }
    .srm-fab span {
        font-size: 9px !important; font-weight: 900 !important;
        letter-spacing: .8px !important; text-transform: uppercase !important; color: #fff !important;
    }
    .srm-fab:active { transform: scale(.91) !important; box-shadow: 0 3px 10px rgba(0,200,91,.30) !important; }

    .srm-backdrop {
        display: block !important;
        position: fixed !important; inset: 0 !important;
        background: rgba(15, 23, 42, 0.45) !important;
        backdrop-filter: blur(6px) !important; -webkit-backdrop-filter: blur(6px) !important;
        z-index: 99991 !important;
        opacity: 0 !important; pointer-events: none !important;
        transition: opacity .3s ease !important;
        visibility: visible !important;
    }
    .srm-backdrop.srm-open { opacity: 1 !important; pointer-events: auto !important; }

    .srm-sheet {
        display: flex !important; flex-direction: column !important;
        position: fixed !important; bottom: 0 !important; left: 0 !important; right: 0 !important;
        max-height: 88vh !important;
        background: #ffffff !important;
        border-radius: 28px 28px 0 0 !important;
        border-top: 1.5px solid rgba(75,108,255,.15) !important;
        box-shadow: 0 -12px 48px rgba(0,0,0,.14) !important;
        z-index: 99992 !important;
        transform: translateY(100%) !important;
        transition: transform .42s cubic-bezier(.25,1,.3,1) !important;
        visibility: visible !important;
    }
    .srm-sheet.srm-open { transform: translateY(0) !important; }

    .srm-handle {
        width: 38px !important; height: 4px !important; border-radius: 2px !important;
        background: #e2e8f0 !important;
        margin: 12px auto 0 !important; flex-shrink: 0 !important;
    }

    .srm-sheet-head {
        display: flex !important; align-items: center !important; justify-content: space-between !important;
        padding: 16px 20px 14px !important;
        background: #fafafa !important;
        flex-shrink: 0 !important;
    }
    .srm-sheet-title-row {
        display: flex !important; align-items: center !important; gap: 10px !important;
    }
    .srm-sheet-ico {
        width: 32px !important; height: 32px !important; border-radius: 9px !important;
        background: rgba(75,108,255,.10) !important;
        display: flex !important; align-items: center !important; justify-content: center !important;
        flex-shrink: 0 !important;
    }
    .srm-sheet-ico svg { width: 16px !important; height: 16px !important; stroke: #4b6cff !important; stroke-width: 2.2 !important; fill: none !important; }
    .srm-sheet-title { margin: 0 !important; font-size: 17px !important; font-weight: 900 !important; letter-spacing: -.3px !important; color: #1e293b !important; }

    .srm-close-btn {
        width: 32px !important; height: 32px !important; border-radius: 10px !important;
        background: #f1f5f9 !important; border: none !important;
        display: flex !important; align-items: center !important; justify-content: center !important;
        color: #64748b !important; cursor: pointer !important;
        transition: all .2s !important; -webkit-tap-highlight-color: transparent !important; flex-shrink: 0 !important;
    }
    .srm-close-btn svg { width: 16px !important; height: 16px !important; stroke: currentColor !important; stroke-width: 2.5 !important; fill: none !important; }
    .srm-close-btn:active { transform: scale(.88) !important; background: #e2e8f0 !important; }

    .srm-divider { height: 1px !important; margin: 0 20px !important; background: #f1f5f9 !important; flex-shrink: 0 !important; }

    .srm-body {
        padding: 16px 16px calc(28px + env(safe-area-inset-bottom)) !important;
        overflow-y: auto !important; flex: 1 !important;
        -webkit-overflow-scrolling: touch !important;
        background: #fff !important;
    }

    .srm-section { margin-bottom: 22px !important; }

    .srm-sec-label {
        display: flex !important; align-items: center !important; gap: 7px !important;
        font-size: 10px !important; font-weight: 800 !important;
        text-transform: uppercase !important; letter-spacing: 1.2px !important;
        color: #94a3b8 !important; margin-bottom: 12px !important;
    }
    .srm-sec-dot {
        width: 3px !important; height: 13px !important; border-radius: 2px !important;
        background: #4b6cff !important; flex-shrink: 0 !important; display: inline-block !important;
    }

    .srm-grid { display: grid !important; grid-template-columns: repeat(2, 1fr) !important; gap: 9px !important; }

    .srm-grid-item {
        display: flex !important; align-items: center !important; gap: 10px !important;
        padding: 11px 13px !important; border-radius: 14px !important;
        text-decoration: none !important;
        background: #f8fafc !important;
        border: 1px solid #e8edf5 !important;
        -webkit-tap-highlight-color: transparent !important;
        transition: transform .16s, background .16s, box-shadow .16s !important;
    }
    .srm-grid-item:active {
        transform: scale(.94) !important;
        background: #f1f5f9 !important;
        box-shadow: 0 2px 8px rgba(75,108,255,.08) !important;
    }

    .srm-grid-ico {
        width: 36px !important; height: 36px !important; border-radius: 10px !important;
        display: flex !important; align-items: center !important; justify-content: center !important;
        flex-shrink: 0 !important;
    }
    .srm-grid-ico svg { width: 17px !important; height: 17px !important; fill: none !important; stroke-width: 2 !important; stroke-linecap: round !important; stroke-linejoin: round !important; }

    .srm-grid-txt { flex: 1 !important; min-width: 0 !important; display: flex !important; flex-direction: column !important; gap: 3px !important; }

    .srm-grid-name {
        display: block !important; font-size: 12.5px !important; font-weight: 700 !important;
        color: #1e293b !important;
        white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important;
    }

    .srm-ic-blue   { background: rgba(59,130,246,.10) !important; }
    .srm-ic-blue   svg { stroke: #2563eb !important; }
    .srm-ic-orange { background: rgba(249,115,22,.10) !important; }
    .srm-ic-orange svg { stroke: #ea580c !important; }
    .srm-ic-green  { background: rgba(34,197,94,.10) !important; }
    .srm-ic-green  svg { stroke: #16a34a !important; }
    .srm-ic-red    { background: rgba(220,38,38,.10) !important; }
    .srm-ic-red    svg { stroke: #dc2626 !important; }
    .srm-ic-purple { background: rgba(139,92,246,.10) !important; }
    .srm-ic-purple svg { stroke: #7c3aed !important; }
    .srm-ic-teal   { background: rgba(20,184,166,.10) !important; }
    .srm-ic-teal   svg { stroke: #0d9488 !important; }
    .srm-ic-amber  { background: rgba(245,158,11,.10) !important; }
    .srm-ic-amber  svg { stroke: #d97706 !important; }

    .srm-badge {
        display: inline-block !important;
        font-size: 8.5px !important; font-weight: 800 !important;
        padding: 2px 6px !important; border-radius: 999px !important;
        text-transform: uppercase !important; letter-spacing: .05em !important;
        width: fit-content !important;
    }
    .srm-new {
        background: rgba(75,108,255,.10) !important;
        border: 1px solid rgba(75,108,255,.25) !important;
        color: #4b6cff !important;
        animation: srmBlueBlink 1.1s step-end infinite !important;
    }
    .srm-live {
        background: rgba(0,200,91,.10) !important;
        border: 1px solid rgba(0,200,91,.25) !important;
        color: #00c85b !important;
        animation: srmGreenGlow 2s ease-in-out infinite !important;
    }
    .srm-hot {
        background: rgba(217,119,6,.10) !important;
        border: 1px solid rgba(217,119,6,.25) !important;
        color: #b45309 !important;
    }

}