/* SPLG Mobile Polish v1.0.1
   Final responsive layer for public, admin and user interfaces. */

:root{
    --splg-mobile-radius:18px;
    --splg-mobile-shadow:0 22px 58px rgba(0,0,0,.34);
}

.splg-mobile-menu-toggle,
.splg-mobile-close{
    display:none;
    align-items:center;
    justify-content:center;
    gap:8px;
    height:42px;
    min-width:42px;
    padding:0 12px;
    border:1px solid rgba(103,232,249,.18);
    border-radius:13px;
    background:rgba(255,255,255,.055);
    color:#f5fdff;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 12px 28px rgba(0,0,0,.16);
    cursor:pointer;
    font:800 12px/1 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
}
.mobile-menu-icon{
    position:relative;
    width:18px;
    height:14px;
    display:inline-block;
    border-top:2px solid currentColor;
    border-bottom:2px solid currentColor;
}
.mobile-menu-icon::after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    top:5px;
    border-top:2px solid currentColor;
}
.splg-mobile-close{
    width:40px;
    min-width:40px;
    padding:0;
    font-size:22px;
    line-height:1;
}
.splg-mobile-overlay{
    position:fixed;
    inset:0;
    z-index:1040;
    background:rgba(0,0,0,.64);
    backdrop-filter:blur(3px);
    -webkit-backdrop-filter:blur(3px);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .2s ease,visibility .2s ease;
}
body.splg-mobile-lock{overflow:hidden!important;touch-action:none}

/* ---------- ADMIN ---------- */
@media (max-width:920px){
    body.splg-admin-v41 .splg-mobile-menu-toggle,
    body.splg-admin-v41 .splg-mobile-close{display:inline-flex!important}
    body.splg-admin-v41 .splg-admin-layout{display:block!important;min-height:100vh!important}
    body.splg-admin-v41 .splg-sidebar{
        position:fixed!important;
        inset:0 auto 0 0!important;
        z-index:1060!important;
        width:min(300px,86vw)!important;
        max-width:300px!important;
        height:100dvh!important;
        padding:14px!important;
        overflow-y:auto!important;
        border-right:1px solid color-mix(in srgb,var(--splg-cyan) 22%,transparent)!important;
        border-bottom:0!important;
        transform:translateX(-104%)!important;
        transition:transform .24s cubic-bezier(.2,.8,.2,1)!important;
        box-shadow:28px 0 70px rgba(0,0,0,.46)!important;
    }
    body.splg-admin-v41.splg-admin-menu-open .splg-sidebar{transform:translateX(0)!important}
    body.splg-admin-v41.splg-admin-menu-open .splg-mobile-overlay{
        opacity:1;visibility:visible;pointer-events:auto;
    }
    body.splg-admin-v41 .splg-sidebar-mobile-head{
        display:flex!important;
        align-items:center!important;
        justify-content:space-between!important;
        gap:12px!important;
        margin-bottom:4px!important;
    }
    body.splg-admin-v41 .splg-logo-block{
        flex:1!important;
        height:86px!important;
        min-height:86px!important;
        margin:0!important;
        place-items:start!important;
        align-items:center!important;
        justify-content:flex-start!important;
        padding-left:6px!important;
    }
    body.splg-admin-v41 .splg-logo-ring{width:66px!important;height:66px!important;border-radius:20px!important}
    body.splg-admin-v41 .splg-logo-ring img,
    body.splg-admin-v41 .splg-logo-ring span{width:52px!important;height:52px!important;border-radius:16px!important}
    body.splg-admin-v41 .splg-sidebar-title{margin-top:10px!important;padding:0 10px!important}
    body.splg-admin-v41 .splg-nav{grid-template-columns:1fr!important;gap:6px!important}
    body.splg-admin-v41 .splg-nav a{
        min-height:44px!important;
        padding:0 12px!important;
        border-radius:12px!important;
        font-size:13px!important;
    }
    body.splg-admin-v41 .splg-main{display:block!important;width:100%!important;min-width:0!important}
    body.splg-admin-v41 .splg-topbar{
        position:sticky!important;
        top:0!important;
        z-index:1030!important;
        display:grid!important;
        grid-template-columns:auto minmax(180px,1fr) auto!important;
        align-items:center!important;
        gap:10px!important;
        min-height:64px!important;
        height:auto!important;
        padding:10px 14px!important;
        flex-direction:unset!important;
        background:rgba(7,15,18,.94)!important;
        border-bottom:1px solid color-mix(in srgb,var(--splg-cyan) 18%,transparent)!important;
        backdrop-filter:blur(16px)!important;
    }
    body.splg-admin-v41 .splg-search{width:100%!important;max-width:none!important;min-width:0!important}
    body.splg-admin-v41 .splg-top-actions{
        width:auto!important;
        min-width:0!important;
        justify-content:flex-end!important;
        flex-wrap:nowrap!important;
        gap:7px!important;
    }
    body.splg-admin-v41 .splg-top-action-v48,
    body.splg-admin-v41 .splg-top-pill{
        min-width:40px!important;
        width:40px!important;
        height:40px!important;
        padding:0!important;
        font-size:0!important;
        display:inline-flex!important;
        align-items:center!important;
        justify-content:center!important;
        border-radius:13px!important;
    }
    body.splg-admin-v41 .splg-top-action-v48 i,
    body.splg-admin-v41 .splg-top-pill i{font-size:16px!important;margin:0!important}
    body.splg-admin-v41 .splg-profile-btn{
        min-width:46px!important;
        width:auto!important;
        max-width:52px!important;
        height:46px!important;
        padding:3px!important;
        border-radius:14px!important;
    }
    body.splg-admin-v41 .splg-profile-copy{display:none!important}
    body.splg-admin-v41 .splg-profile-btn::after{display:none!important}
    body.splg-admin-v41 .splg-avatar{width:38px!important;height:38px!important;flex:0 0 38px!important}
    body.splg-admin-v41 .splg-content{width:100%!important;max-width:100%!important;padding:18px 14px 44px!important}
    body.splg-admin-v41 .splg-profile-menu{position:fixed!important;right:12px!important;left:auto!important;top:66px!important;min-width:min(280px,calc(100vw - 24px))!important}
}

@media (max-width:640px){
    body.splg-admin-v41 .splg-topbar{
        grid-template-columns:auto minmax(0,1fr) auto!important;
        padding:9px 10px!important;
    }
    body.splg-admin-v41 .splg-search{grid-column:1/-1!important;grid-row:2!important;height:42px!important}
    body.splg-admin-v41 .splg-mobile-menu-toggle{grid-column:1!important;grid-row:1!important}
    body.splg-admin-v41 .splg-top-actions{grid-column:3!important;grid-row:1!important}
    body.splg-admin-v41 .splg-content{padding:14px 10px 36px!important}
    body.splg-admin-v41 .panel-v24,
    body.splg-admin-v41 .panel,
    body.splg-admin-v41 .stat-card,
    body.splg-admin-v41 .settings-card-v24,
    body.splg-admin-v41 .admin-list-item-v24{
        border-radius:16px!important;
    }
    body.splg-admin-v41 .panel-v24,
    body.splg-admin-v41 .panel{padding:16px!important}
    body.splg-admin-v41 .admin-title,
    body.splg-admin-v41 .admin-title-v24,
    body.splg-admin-v41 .splg-welcome{padding:18px 16px!important;border-radius:18px!important}
    body.splg-admin-v41 .admin-title h1,
    body.splg-admin-v41 .admin-title-v24 h1,
    body.splg-admin-v41 .splg-welcome h1{font-size:23px!important;line-height:1.1!important}
    body.splg-admin-v41 .settings-savebar-v24{border-radius:16px!important;padding:12px!important}
    body.splg-admin-v41 .splg-mobile-menu-label{display:none}
}

/* ---------- USER DASHBOARD ---------- */
@media (max-width:860px){
    body.user-v44 .splg-mobile-menu-toggle,
    body.user-v44 .splg-mobile-close{display:inline-flex!important}
    body.user-v44 .user-shell{display:block!important;min-height:100vh!important}
    body.user-v44 .user-sidebar{
        position:fixed!important;
        inset:0 auto 0 0!important;
        z-index:1060!important;
        width:min(300px,86vw)!important;
        max-width:300px!important;
        height:100dvh!important;
        padding:14px!important;
        overflow-y:auto!important;
        border-right:1px solid color-mix(in srgb,var(--user-cyan) 22%,transparent)!important;
        border-bottom:0!important;
        transform:translateX(-104%)!important;
        transition:transform .24s cubic-bezier(.2,.8,.2,1)!important;
        box-shadow:28px 0 70px rgba(0,0,0,.46)!important;
    }
    body.user-v44.splg-user-menu-open .user-sidebar{transform:translateX(0)!important}
    body.user-v44.splg-user-menu-open .splg-mobile-overlay{opacity:1;visibility:visible;pointer-events:auto}
    body.user-v44 .user-sidebar-mobile-head{
        display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;margin-bottom:8px!important;
    }
    body.user-v44 .user-brand{
        flex:1!important;
        min-height:86px!important;
        padding:8px!important;
        border-bottom:0!important;
    }
    body.user-v44 .user-mark{width:54px!important;height:54px!important;border-radius:17px!important;flex:0 0 54px!important}
    body.user-v44 .user-mark img{width:100%!important;height:100%!important;object-fit:contain!important}
    body.user-v44 .user-brand b{font-size:15px!important;max-width:150px!important}
    body.user-v44 .user-nav{grid-template-columns:1fr!important;gap:6px!important}
    body.user-v44 .user-nav a{min-height:44px!important;border-radius:12px!important;padding:0 12px!important}
    body.user-v44 .user-main{display:block!important;width:100%!important;min-width:0!important}
    body.user-v44 .user-topbar{
        position:sticky!important;
        top:0!important;
        z-index:1030!important;
        display:grid!important;
        grid-template-columns:auto minmax(180px,1fr) auto!important;
        align-items:center!important;
        gap:10px!important;
        min-height:64px!important;
        height:auto!important;
        padding:10px 14px!important;
        flex-direction:unset!important;
        background:rgba(7,15,18,.94)!important;
        border-bottom:1px solid color-mix(in srgb,var(--user-cyan) 18%,transparent)!important;
        backdrop-filter:blur(16px)!important;
    }
    body.user-v44 .user-search{width:100%!important;max-width:none!important;min-width:0!important;margin:0!important}
    body.user-v44 .user-top-actions-v47{width:auto!important;min-width:0!important;justify-content:flex-end!important;gap:7px!important;margin:0!important}
    body.user-v44 .user-action-pill-v47{width:40px!important;min-width:40px!important;height:40px!important;padding:0!important;justify-content:center!important;border-radius:13px!important}
    body.user-v44 .user-action-pill-v47 b{display:none!important}
    body.user-v44 .user-profile-name-v47{display:none!important}
    body.user-v44 .user-profile-summary-v47{height:46px!important;min-height:46px!important;padding:3px!important;border-radius:14px!important}
    body.user-v44 .user-profile-summary-v47 .user-avatar-top{width:38px!important;height:38px!important}
    body.user-v44 .user-profile-menu-v47{position:fixed!important;right:12px!important;left:auto!important;top:66px!important;width:min(280px,calc(100vw - 24px))!important}
    body.user-v44 .user-page{width:100%!important;max-width:100%!important;padding:18px 14px 44px!important}
}

@media (max-width:640px){
    body.user-v44 .user-topbar{grid-template-columns:auto minmax(0,1fr) auto!important;padding:9px 10px!important}
    body.user-v44 .user-search{grid-column:1/-1!important;grid-row:2!important;height:42px!important}
    body.user-v44 .splg-mobile-menu-toggle{grid-column:1!important;grid-row:1!important}
    body.user-v44 .user-top-actions-v47{grid-column:3!important;grid-row:1!important}
    body.user-v44 .user-page{padding:14px 10px 36px!important}
    body.user-v44 .user-hero,
    body.user-v44 .user-card,
    body.user-v44 .user-panel,
    body.user-v44 .user-home-box,
    body.user-v44 .user-list-card{border-radius:16px!important}
    body.user-v44 .user-hero{padding:18px 16px!important;min-height:0!important}
    body.user-v44 .user-hero h1{font-size:23px!important;line-height:1.1!important}
    body.user-v44 .user-card,
    body.user-v44 .user-panel{padding:16px!important}
    body.user-v44 .splg-mobile-menu-label{display:none}
}

/* ---------- PUBLIC FRONTEND ---------- */
@media (max-width:640px){
    body:not(.splg-admin-v41):not(.user-v44) .splg-mobile-menu-toggle{display:inline-flex!important}
    body:not(.splg-admin-v41):not(.user-v44) .clean-topbar,
    body:not(.splg-admin-v41):not(.user-v44) header.topbar{
        position:sticky!important;
        top:0!important;
        z-index:1030!important;
        min-height:58px!important;
        height:58px!important;
        padding:8px 10px!important;
        gap:8px!important;
        overflow:visible!important;
        background:rgba(7,15,18,.94)!important;
        backdrop-filter:blur(16px)!important;
    }
    body:not(.splg-admin-v41):not(.user-v44) .clean-topbar > .clean-brand,
    body:not(.splg-admin-v41):not(.user-v44) .topbar > .brand{
        max-width:calc(100vw - 78px)!important;
        font-size:14px!important;
        gap:9px!important;
    }
    body:not(.splg-admin-v41):not(.user-v44) .clean-topbar .site-logo-img,
    body:not(.splg-admin-v41):not(.user-v44) .topbar .site-logo-img,
    body:not(.splg-admin-v41):not(.user-v44) .clean-topbar .brand-mark,
    body:not(.splg-admin-v41):not(.user-v44) .clean-topbar .clean-brand-mark,
    body:not(.splg-admin-v41):not(.user-v44) .topbar .brand-mark{
        width:30px!important;height:30px!important;min-width:30px!important;max-width:30px!important;max-height:30px!important;border-radius:9px!important;
    }
    body:not(.splg-admin-v41):not(.user-v44) .clean-topbar > .clean-nav,
    body:not(.splg-admin-v41):not(.user-v44) .topbar > .nav{
        position:absolute!important;
        top:calc(100% + 8px)!important;
        right:10px!important;
        left:auto!important;
        z-index:1060!important;
        width:min(250px,calc(100vw - 20px))!important;
        padding:10px!important;
        display:grid!important;
        grid-template-columns:1fr!important;
        gap:7px!important;
        border:1px solid rgba(103,232,249,.18)!important;
        border-radius:17px!important;
        background:rgba(8,17,22,.98)!important;
        box-shadow:var(--splg-mobile-shadow)!important;
        backdrop-filter:blur(18px)!important;
        opacity:0!important;
        visibility:hidden!important;
        pointer-events:none!important;
        transform:translateY(-6px)!important;
        transition:opacity .18s ease,transform .18s ease,visibility .18s ease!important;
    }
    body.splg-public-menu-open .clean-topbar > .clean-nav,
    body.splg-public-menu-open .topbar > .nav{
        opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:translateY(0)!important;
    }
    body:not(.splg-admin-v41):not(.user-v44) .clean-topbar .clean-nav a,
    body:not(.splg-admin-v41):not(.user-v44) .topbar .nav a{
        width:100%!important;
        min-height:44px!important;
        height:44px!important;
        padding:0 13px!important;
        justify-content:flex-start!important;
        border-radius:12px!important;
        font-size:13px!important;
    }
    body.splg-public-menu-open .splg-mobile-overlay{opacity:1;visibility:visible;pointer-events:auto}
    body:not(.splg-admin-v41):not(.user-v44) .hero-wrap-v50{width:calc(100% - 20px)!important}
    body:not(.splg-admin-v41):not(.user-v44) .hero-panel-v50,
    body.home-upload-only .clean-hero-content{
        width:100%!important;
        padding:28px 16px!important;
        border-radius:20px!important;
    }
    body:not(.splg-admin-v41):not(.user-v44) .hero-panel-v50 h1,
    body.home-upload-only .clean-hero h1{
        font-size:clamp(30px,9vw,40px)!important;
        line-height:1.02!important;
        letter-spacing:-.045em!important;
    }
    body:not(.splg-admin-v41):not(.user-v44) .hero-panel-v50 p,
    body.home-upload-only .clean-hero p{font-size:14px!important;line-height:1.6!important;margin-bottom:20px!important}
    body:not(.splg-admin-v41):not(.user-v44) .hero-actions-v50{gap:9px!important}
    body:not(.splg-admin-v41):not(.user-v44) .hero-actions-v50 .clean-primary,
    body:not(.splg-admin-v41):not(.user-v44) .hero-actions-v50 .clean-secondary{height:46px!important;border-radius:13px!important}
    body:not(.splg-admin-v41):not(.user-v44) .hero-info-v50{gap:6px!important}
    body:not(.splg-admin-v41):not(.user-v44) .hero-info-v50 span{min-height:28px!important;padding:0 9px!important;font-size:10px!important}
    body:not(.splg-admin-v41):not(.user-v44) .upload-modal-card-v50{width:calc(100vw - 18px)!important;padding:16px!important;border-radius:18px!important}
    body:not(.splg-admin-v41):not(.user-v44) .upload-modal-head-v50 strong{font-size:23px!important}
    body:not(.splg-admin-v41):not(.user-v44) .dropzone-v50{min-height:180px!important;border-radius:16px!important}
    body:not(.splg-admin-v41):not(.user-v44) .viewer-card,
    body:not(.splg-admin-v41):not(.user-v44) .album-card,
    body:not(.splg-admin-v41):not(.user-v44) .result-card,
    body:not(.splg-admin-v41):not(.user-v44) .auth-card,
    body:not(.splg-admin-v41):not(.user-v44) .panel,
    body:not(.splg-admin-v41):not(.user-v44) .card{border-radius:16px!important}
}

@media (max-width:390px){
    .splg-mobile-menu-toggle{height:40px;min-width:40px;padding:0 10px;border-radius:12px}
    body.splg-admin-v41 .splg-content,
    body.user-v44 .user-page{padding-left:8px!important;padding-right:8px!important}
    body:not(.splg-admin-v41):not(.user-v44) .clean-brand span:last-child,
    body:not(.splg-admin-v41):not(.user-v44) .brand span:last-child{max-width:170px!important}
}

@media (prefers-reduced-motion:reduce){
    .splg-sidebar,.user-sidebar,.clean-nav,.nav,.splg-mobile-overlay{transition:none!important}
}

/* v1.0.1 hotfixes discovered during real 360/390/430px rendering */
@media (max-width:920px){
    body.splg-admin-v41 .splg-admin-layout{z-index:auto!important}
}
@media (max-width:860px){
    body.user-v44 .user-shell{z-index:auto!important}
}
body.splg-admin-v41 .splg-profile-menu:not(.show){display:none!important}

@media (max-width:640px){
    body:not(.splg-admin-v41):not(.user-v44) .clean-topbar,
    body:not(.splg-admin-v41):not(.user-v44) header.topbar{z-index:1050!important}
    body.home-upload-only .clean-hero,
    body.home-upload-only .clean-hero-v50{
        min-height:calc(100dvh - 58px)!important;
        place-items:start center!important;
        padding:72px 0 32px!important;
    }
}
@media (max-width:640px){
    body.splg-public-menu-open:not(.splg-admin-v41):not(.user-v44) .clean-topbar > .clean-nav,
    body.splg-public-menu-open:not(.splg-admin-v41):not(.user-v44) .topbar > .nav{
        opacity:1!important;
        visibility:visible!important;
        pointer-events:auto!important;
        transform:translateY(0)!important;
    }
}