/* ============================================================
   C-GESTUS Planner 2.2.2 · Menu Leque / Edge Fan
   Mantém os modos Compacto, Direto e Clássico da 2.2.x.
   O estilo "hub" passa a ser o leque radial recomendado.
   ============================================================ */

:root{
    --v222-blue:#1599db;
    --v222-blue-deep:#0872c7;
    --v222-ink:#142e3b;
    --v222-glass:rgba(255,255,255,.78);
    --v222-glass-strong:rgba(255,255,255,.94);
    --v222-line:rgba(74,151,193,.22);
    --v222-glow:0 0 0 1px rgba(92,190,239,.16),0 18px 52px rgba(9,91,142,.16)
}

/* A cortina fica leve. O menu é a própria geometria, não uma caixa. */
body[data-menu-desktop="hub"] .v21-modal-backdrop,
body[data-menu-mobile="hub"] .v21-modal-backdrop{
    background:rgba(18,35,44,.22)!important;
    backdrop-filter:blur(7px) saturate(.88)!important;
    -webkit-backdrop-filter:blur(7px) saturate(.88)!important
}

@media(min-width:821px){
    body[data-menu-desktop="hub"] .v222-fan-menu{
        inset:62px 0 0 0!important;
        left:0!important;
        top:62px!important;
        width:100vw!important;
        height:calc(100vh - 62px)!important;
        max-height:none!important;
        transform:none!important;
        border:0!important;
        border-radius:0!important;
        background:transparent!important;
        box-shadow:none!important;
        overflow:visible!important;
        pointer-events:none!important;
        animation:none!important
    }
    body[data-menu-desktop="hub"] .v222-fan-menu>*{
        pointer-events:auto
    }
    body[data-menu-desktop="hub"] .v222-fan-head{
        position:fixed!important;
        left:350px!important;
        top:78px!important;
        width:auto!important;
        min-height:0!important;
        padding:7px 9px 7px 12px!important;
        border:1px solid rgba(108,157,182,.16)!important;
        border-radius:13px!important;
        background:rgba(255,255,255,.72)!important;
        box-shadow:0 8px 26px rgba(17,53,70,.08)!important;
        backdrop-filter:blur(16px)!important;
        -webkit-backdrop-filter:blur(16px)!important;
        transition:opacity .16s ease,transform .16s ease!important
    }
    body[data-menu-desktop="hub"] .v222-fan-menu[data-section="home"] .v222-fan-head,
    body[data-menu-desktop="hub"] .v222-fan-menu[data-section="create"] .v222-fan-head{
        opacity:0!important;
        transform:translateY(-6px)!important;
        pointer-events:none!important
    }
    body[data-menu-desktop="hub"] .v222-fan-head p{display:none!important}
    body[data-menu-desktop="hub"] .v222-fan-head h2{font-size:13px!important;margin:0!important}
    body[data-menu-desktop="hub"] .v220-hub-head-actions button{
        width:30px!important;height:30px!important;border-radius:9px!important
    }
    body[data-menu-desktop="hub"] .v222-fan-body{
        position:absolute!important;
        inset:0!important;
        padding:0!important;
        overflow:visible!important;
        pointer-events:none!important
    }
    body[data-menu-desktop="hub"] .v222-fan-body>[data-hub-panel]{pointer-events:auto}

    /* Menu principal em leque, ancorado à margem esquerda. */
    body[data-menu-desktop="hub"] .v222-fan-home{
        position:absolute!important;
        inset:0!important;
        display:block!important;
        min-height:0!important
    }
    body[data-menu-desktop="hub"] .v222-fan-stage{
        position:absolute;
        left:-112px;
        top:50%;
        width:565px;
        height:620px;
        transform:translateY(-50%);
        filter:drop-shadow(0 20px 45px rgba(15,59,82,.09))
    }
    .v222-fan-rails,
    .v222-create-rails{
        position:absolute;
        left:98px;
        top:50%;
        width:410px;
        height:410px;
        transform:translate(-50%,-50%);
        border:1px solid rgba(35,160,219,.10);
        border-radius:50%;
        background:
            radial-gradient(circle,rgba(27,154,218,.055) 0 19%,transparent 19.5% 35%,rgba(27,154,218,.045) 35.5% 35.8%,transparent 36.3% 54%,rgba(27,154,218,.035) 54.5% 54.8%,transparent 55.3%);
        box-shadow:inset 0 0 70px rgba(255,255,255,.38);
        pointer-events:none
    }
    .v222-fan-node{
        position:absolute!important;
        left:183px!important;
        top:calc(50% - 37px)!important;
        width:188px!important;
        min-height:74px!important;
        display:grid!important;
        grid-template-columns:38px minmax(0,1fr)!important;
        align-items:center!important;
        gap:8px!important;
        padding:9px 14px!important;
        transform-origin:-86px 37px!important;
        border:1px solid rgba(89,151,181,.19)!important;
        border-radius:16px 28px 28px 16px!important;
        clip-path:polygon(7% 0,100% 0,94% 100%,0 100%)!important;
        background:
            linear-gradient(145deg,rgba(255,255,255,.96),rgba(247,251,253,.76))!important;
        box-shadow:
            0 13px 34px rgba(17,58,78,.09),
            inset 0 1px 0 rgba(255,255,255,.96)!important;
        backdrop-filter:blur(18px) saturate(1.12)!important;
        -webkit-backdrop-filter:blur(18px) saturate(1.12)!important;
        color:var(--v222-ink)!important;
        overflow:hidden!important;
        transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease!important
    }
    .v222-fan-node::after{
        content:"";
        position:absolute;
        inset:0;
        background:linear-gradient(100deg,transparent 0 46%,rgba(255,255,255,.62) 50%,transparent 55%);
        transform:translateX(-130%);
        transition:transform .42s ease;
        pointer-events:none
    }
    .v222-fan-node:hover::after{transform:translateX(130%)}
    .v222-fan-node:hover{
        border-color:rgba(25,156,218,.36)!important;
        box-shadow:0 18px 40px rgba(11,92,139,.15),inset 0 1px 0 #fff!important
    }
    .v222-node-icon{
        width:36px;height:36px;display:grid;place-items:center;border-radius:12px;
        color:#0b86cc;background:rgba(19,151,215,.075)
    }
    .v222-node-icon .apm-icon{width:20px!important;height:20px!important}
    .v222-node-copy{display:grid;gap:2px;text-align:left}
    .v222-node-copy strong{font-size:10px!important;line-height:1.15!important}
    .v222-node-copy small{font-size:6.5px!important;color:#8a9aa2!important;line-height:1.2!important}

    .v222-node-create{transform:rotate(-42deg)!important;border-color:rgba(20,153,218,.34)!important;background:linear-gradient(145deg,rgba(25,162,225,.96),rgba(8,114,199,.94))!important;color:#fff!important}
    .v222-node-create .v222-node-icon,.v222-node-create .v222-node-copy{transform:rotate(42deg)!important}
    .v222-node-create .v222-node-icon{background:rgba(255,255,255,.14)!important;color:#fff!important}
    .v222-node-create .v222-node-copy small{color:rgba(255,255,255,.72)!important}
    .v222-node-organize{transform:rotate(-21deg)!important}
    .v222-node-organize .v222-node-icon,.v222-node-organize .v222-node-copy{transform:rotate(21deg)!important}
    .v222-node-apps{transform:rotate(0)!important}
    .v222-node-customize{transform:rotate(21deg)!important}
    .v222-node-customize .v222-node-icon,.v222-node-customize .v222-node-copy{transform:rotate(-21deg)!important}
    .v222-node-system{transform:rotate(42deg)!important}
    .v222-node-system .v222-node-icon,.v222-node-system .v222-node-copy{transform:rotate(-42deg)!important}

    .v222-node-create:hover{transform:rotate(-42deg) translateX(5px)!important}
    .v222-node-organize:hover{transform:rotate(-21deg) translateX(5px)!important}
    .v222-node-apps:hover{transform:translateX(5px)!important}
    .v222-node-customize:hover{transform:rotate(21deg) translateX(5px)!important}
    .v222-node-system:hover{transform:rotate(42deg) translateX(5px)!important}

    .v222-fan-core,
    .v222-create-core{
        position:absolute;
        left:52px;
        top:50%;
        width:92px;
        height:92px;
        transform:translate(-50%,-50%);
        display:grid;
        place-items:center;
        align-content:center;
        gap:2px;
        padding:0;
        border:1px solid rgba(255,255,255,.72);
        border-radius:50%;
        background:
            radial-gradient(circle at 35% 28%,rgba(255,255,255,.30),transparent 28%),
            linear-gradient(145deg,#159fdf,#076abf);
        color:#fff;
        box-shadow:0 16px 44px rgba(7,102,169,.26),0 0 0 9px rgba(21,157,220,.075);
        cursor:pointer;
        z-index:8
    }
    .v222-fan-core img{width:44px;height:44px;object-fit:contain;filter:brightness(0) invert(1);opacity:.94}
    .v222-fan-core span,.v222-create-core span{font-size:6.5px;font-weight:900;letter-spacing:.07em}
    .v222-fan-core:hover,.v222-create-core:hover{box-shadow:0 20px 52px rgba(7,102,169,.33),0 0 0 12px rgba(21,157,220,.08)}

    /* Criar usa um segundo leque, mais externo e com seis ações. */
    body[data-menu-desktop="hub"] .v222-create-panel{
        position:absolute!important;
        inset:0!important;
        min-height:0!important
    }
    body[data-menu-desktop="hub"] .v222-create-stage{
        position:absolute;
        left:-120px;
        top:50%;
        width:650px;
        height:670px;
        transform:translateY(-50%)
    }
    body[data-menu-desktop="hub"] .v222-create-rails{
        left:105px;width:490px;height:490px
    }
    .v222-create-action{
        position:absolute!important;
        left:228px!important;
        top:calc(50% - 34px)!important;
        width:174px!important;
        height:68px!important;
        display:grid!important;
        grid-template-columns:34px 1fr!important;
        place-items:initial!important;
        align-items:center!important;
        gap:7px!important;
        padding:8px 13px!important;
        transform-origin:-116px 34px!important;
        border:1px solid rgba(63,156,205,.25)!important;
        border-radius:15px 27px 27px 15px!important;
        clip-path:polygon(7% 0,100% 0,94% 100%,0 100%)!important;
        background:linear-gradient(145deg,rgba(255,255,255,.97),rgba(241,248,252,.83))!important;
        color:#17313f!important;
        box-shadow:0 12px 32px rgba(13,72,105,.12),inset 0 1px 0 #fff!important;
        backdrop-filter:blur(18px)!important;
        -webkit-backdrop-filter:blur(18px)!important;
        transition:transform .16s ease,box-shadow .16s ease!important
    }
    .v222-create-action .apm-icon{width:22px!important;height:22px!important;color:#0a8ad0!important}
    .v222-create-action span{font-size:9px!important;font-weight:850!important;text-align:left!important}
    .v222-create-task{transform:rotate(-55deg)!important}
    .v222-create-task>*{transform:rotate(55deg)!important}
    .v222-create-event{transform:rotate(-33deg)!important}
    .v222-create-event>*{transform:rotate(33deg)!important}
    .v222-create-finance{transform:rotate(-11deg)!important}
    .v222-create-finance>*{transform:rotate(11deg)!important}
    .v222-create-routine{transform:rotate(11deg)!important}
    .v222-create-routine>*{transform:rotate(-11deg)!important}
    .v222-create-project{transform:rotate(33deg)!important}
    .v222-create-project>*{transform:rotate(-33deg)!important}
    .v222-create-followup{transform:rotate(55deg)!important}
    .v222-create-followup>*{transform:rotate(-55deg)!important}
    .v222-create-task:hover{transform:rotate(-55deg) translateX(5px)!important}
    .v222-create-event:hover{transform:rotate(-33deg) translateX(5px)!important}
    .v222-create-finance:hover{transform:rotate(-11deg) translateX(5px)!important}
    .v222-create-routine:hover{transform:rotate(11deg) translateX(5px)!important}
    .v222-create-project:hover{transform:rotate(33deg) translateX(5px)!important}
    .v222-create-followup:hover{transform:rotate(55deg) translateX(5px)!important}
    .v222-create-core{left:57px;background:linear-gradient(145deg,#263a45,#112630)!important;box-shadow:0 16px 44px rgba(7,26,37,.25),0 0 0 9px rgba(21,157,220,.065)!important}
    .v222-create-core .apm-icon{width:23px!important;height:23px!important}

    /* Organizar / aplicações / personalização / sistema abrem num painel compacto,
       mantendo o leque como porta de entrada e não como contentor gigante. */
    body[data-menu-desktop="hub"] .v222-fan-body>[data-hub-panel="organize"],
    body[data-menu-desktop="hub"] .v222-fan-body>[data-hub-panel="applications"],
    body[data-menu-desktop="hub"] .v222-fan-body>[data-hub-panel="customize"],
    body[data-menu-desktop="hub"] .v222-fan-body>[data-hub-panel="system"]{
        position:absolute!important;
        left:330px!important;
        top:68px!important;
        width:min(760px,calc(100vw - 370px))!important;
        max-height:calc(100vh - 150px)!important;
        overflow:auto!important;
        padding:16px!important;
        border:1px solid rgba(83,142,172,.17)!important;
        border-radius:22px!important;
        background:rgba(250,252,253,.90)!important;
        box-shadow:0 28px 80px rgba(14,44,60,.15)!important;
        backdrop-filter:blur(25px) saturate(1.08)!important;
        -webkit-backdrop-filter:blur(25px) saturate(1.08)!important
    }
    body[data-menu-desktop="hub"] .v222-fan-footer{
        position:fixed!important;
        left:22px!important;
        bottom:22px!important;
        width:255px!important;
        min-height:52px!important;
        padding:7px 8px 7px 12px!important;
        border:1px solid rgba(88,144,172,.16)!important;
        border-radius:15px!important;
        background:rgba(255,255,255,.76)!important;
        box-shadow:0 10px 30px rgba(16,54,72,.09)!important;
        backdrop-filter:blur(18px)!important;
        -webkit-backdrop-filter:blur(18px)!important
    }
}

/* Entrada com sensação de peças que se abrem, mas sem exagerar. */
body[data-motion="1"] .v222-fan-node,
body[data-motion="1"] .v222-create-action{
    animation:v222-fan-piece-in .24s cubic-bezier(.2,.75,.25,1) both
}
body[data-motion="1"] .v222-node-create{animation-delay:.02s}
body[data-motion="1"] .v222-node-organize{animation-delay:.045s}
body[data-motion="1"] .v222-node-apps{animation-delay:.07s}
body[data-motion="1"] .v222-node-customize{animation-delay:.095s}
body[data-motion="1"] .v222-node-system{animation-delay:.12s}
body[data-motion="1"] .v222-create-task{animation-delay:.02s}
body[data-motion="1"] .v222-create-event{animation-delay:.04s}
body[data-motion="1"] .v222-create-finance{animation-delay:.06s}
body[data-motion="1"] .v222-create-routine{animation-delay:.08s}
body[data-motion="1"] .v222-create-project{animation-delay:.10s}
body[data-motion="1"] .v222-create-followup{animation-delay:.12s}
@keyframes v222-fan-piece-in{
    from{opacity:0;filter:blur(3px)}
    to{opacity:1;filter:blur(0)}
}

/* Dark: vidro grafite, não preto absoluto. */
html[data-theme="dark"] .v222-fan-node,
html[data-theme="dark"] .v222-create-action{
    background:linear-gradient(145deg,rgba(48,61,68,.95),rgba(37,48,54,.84))!important;
    border-color:rgba(130,173,193,.19)!important;
    color:#eef5f7!important;
    box-shadow:0 15px 38px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.055)!important
}
html[data-theme="dark"] .v222-node-create{
    background:linear-gradient(145deg,#169bdc,#0870c2)!important
}
html[data-theme="dark"] .v222-node-copy small{color:#94a6ad!important}
html[data-theme="dark"] .v222-node-create .v222-node-copy small{color:rgba(255,255,255,.72)!important}
html[data-theme="dark"] .v222-fan-rails,
html[data-theme="dark"] .v222-create-rails{border-color:rgba(71,177,225,.12);box-shadow:none}
html[data-theme="dark"] .v222-fan-menu[data-section]:not([data-section="home"]):not([data-section="create"]) .v220-hub-panel{
    background:rgba(40,51,57,.92)!important
}
html[data-theme="dark"] .v222-fan-footer{
    background:rgba(42,54,60,.88)!important;border-color:rgba(121,165,184,.18)!important
}

/* ------------------------------------------------------------
   Telefone / PWA: o mesmo conceito, numa meia-lua menor pela esquerda.
   O botão de abertura continua pequeno junto à marca.
   ------------------------------------------------------------ */
@media(max-width:820px){
    body[data-menu-mobile="hub"] .v222-fan-menu{
        inset:58px 0 0 0!important;
        left:0!important;
        top:58px!important;
        bottom:0!important;
        width:100vw!important;
        height:calc(100dvh - 58px)!important;
        max-height:none!important;
        transform:none!important;
        border:0!important;
        border-radius:0!important;
        background:transparent!important;
        box-shadow:none!important;
        overflow:visible!important;
        animation:none!important;
        pointer-events:none!important
    }
    body[data-menu-mobile="hub"] .v222-fan-menu>*{pointer-events:auto}
    body[data-menu-mobile="hub"] .v222-fan-head{
        position:fixed!important;
        left:12px!important;
        top:70px!important;
        width:auto!important;
        min-height:0!important;
        padding:6px 8px 6px 10px!important;
        border:1px solid rgba(91,147,174,.16)!important;
        border-radius:12px!important;
        background:rgba(255,255,255,.82)!important;
        box-shadow:0 7px 20px rgba(17,53,70,.07)!important;
        backdrop-filter:blur(16px)!important;
        -webkit-backdrop-filter:blur(16px)!important
    }
    body[data-menu-mobile="hub"] .v222-fan-menu[data-section="home"] .v222-fan-head,
    body[data-menu-mobile="hub"] .v222-fan-menu[data-section="create"] .v222-fan-head{
        opacity:0!important;pointer-events:none!important
    }
    body[data-menu-mobile="hub"] .v222-fan-head p{display:none!important}
    body[data-menu-mobile="hub"] .v222-fan-head h2{font-size:12px!important}
    body[data-menu-mobile="hub"] .v222-fan-body{
        position:absolute!important;inset:0!important;padding:0!important;overflow:visible!important;pointer-events:none!important
    }
    body[data-menu-mobile="hub"] .v222-fan-body>[data-hub-panel]{pointer-events:auto}
    body[data-menu-mobile="hub"] .v222-fan-home{position:absolute!important;inset:0!important;display:block!important}
    body[data-menu-mobile="hub"] .v222-fan-stage{
        position:absolute;
        left:-118px;
        top:46%;
        width:440px;
        height:470px;
        transform:translateY(-50%)
    }
    body[data-menu-mobile="hub"] .v222-fan-rails{
        left:92px;width:335px;height:335px
    }
    body[data-menu-mobile="hub"] .v222-fan-node{
        left:162px!important;
        top:calc(50% - 28px)!important;
        width:148px!important;
        min-height:56px!important;
        grid-template-columns:29px 1fr!important;
        gap:6px!important;
        padding:7px 9px!important;
        transform-origin:-72px 28px!important;
        border-radius:13px 23px 23px 13px!important
    }
    body[data-menu-mobile="hub"] .v222-node-icon{width:28px;height:28px;border-radius:9px}
    body[data-menu-mobile="hub"] .v222-node-icon .apm-icon{width:17px!important;height:17px!important}
    body[data-menu-mobile="hub"] .v222-node-copy strong{font-size:8px!important}
    body[data-menu-mobile="hub"] .v222-node-copy small{font-size:5.3px!important}
    body[data-menu-mobile="hub"] .v222-node-create{transform:rotate(-46deg)!important}
    body[data-menu-mobile="hub"] .v222-node-create .v222-node-icon,
    body[data-menu-mobile="hub"] .v222-node-create .v222-node-copy{transform:rotate(46deg)!important}
    body[data-menu-mobile="hub"] .v222-node-organize{transform:rotate(-23deg)!important}
    body[data-menu-mobile="hub"] .v222-node-organize .v222-node-icon,
    body[data-menu-mobile="hub"] .v222-node-organize .v222-node-copy{transform:rotate(23deg)!important}
    body[data-menu-mobile="hub"] .v222-node-apps{transform:none!important}
    body[data-menu-mobile="hub"] .v222-node-customize{transform:rotate(23deg)!important}
    body[data-menu-mobile="hub"] .v222-node-customize .v222-node-icon,
    body[data-menu-mobile="hub"] .v222-node-customize .v222-node-copy{transform:rotate(-23deg)!important}
    body[data-menu-mobile="hub"] .v222-node-system{transform:rotate(46deg)!important}
    body[data-menu-mobile="hub"] .v222-node-system .v222-node-icon,
    body[data-menu-mobile="hub"] .v222-node-system .v222-node-copy{transform:rotate(-46deg)!important}
    body[data-menu-mobile="hub"] .v222-fan-node:hover{filter:brightness(1.02)}
    body[data-menu-mobile="hub"] .v222-fan-core{
        left:55px;width:74px;height:74px
    }
    body[data-menu-mobile="hub"] .v222-fan-core img{width:35px;height:35px}

    /* Criar ocupa uma meia-lua maior, mas deixa metade do ecrã visível. */
    body[data-menu-mobile="hub"] .v222-create-panel{position:absolute!important;inset:0!important}
    body[data-menu-mobile="hub"] .v222-create-stage{
        position:absolute;left:-125px;top:47%;width:500px;height:520px;transform:translateY(-50%)
    }
    body[data-menu-mobile="hub"] .v222-create-rails{left:98px;width:390px;height:390px}
    body[data-menu-mobile="hub"] .v222-create-action{
        left:194px!important;
        top:calc(50% - 27px)!important;
        width:145px!important;
        height:54px!important;
        grid-template-columns:28px 1fr!important;
        gap:5px!important;
        padding:6px 9px!important;
        transform-origin:-90px 27px!important;
        border-radius:12px 22px 22px 12px!important
    }
    body[data-menu-mobile="hub"] .v222-create-action .apm-icon{width:18px!important;height:18px!important}
    body[data-menu-mobile="hub"] .v222-create-action span{font-size:7.5px!important}
    body[data-menu-mobile="hub"] .v222-create-task{transform:rotate(-58deg)!important}
    body[data-menu-mobile="hub"] .v222-create-task>*{transform:rotate(58deg)!important}
    body[data-menu-mobile="hub"] .v222-create-event{transform:rotate(-35deg)!important}
    body[data-menu-mobile="hub"] .v222-create-event>*{transform:rotate(35deg)!important}
    body[data-menu-mobile="hub"] .v222-create-finance{transform:rotate(-12deg)!important}
    body[data-menu-mobile="hub"] .v222-create-finance>*{transform:rotate(12deg)!important}
    body[data-menu-mobile="hub"] .v222-create-routine{transform:rotate(12deg)!important}
    body[data-menu-mobile="hub"] .v222-create-routine>*{transform:rotate(-12deg)!important}
    body[data-menu-mobile="hub"] .v222-create-project{transform:rotate(35deg)!important}
    body[data-menu-mobile="hub"] .v222-create-project>*{transform:rotate(-35deg)!important}
    body[data-menu-mobile="hub"] .v222-create-followup{transform:rotate(58deg)!important}
    body[data-menu-mobile="hub"] .v222-create-followup>*{transform:rotate(-58deg)!important}
    body[data-menu-mobile="hub"] .v222-create-core{left:56px;width:72px;height:72px}

    /* As áreas maiores transformam-se numa folha compacta. */
    body[data-menu-mobile="hub"] .v222-fan-body>[data-hub-panel="organize"],
    body[data-menu-mobile="hub"] .v222-fan-body>[data-hub-panel="applications"],
    body[data-menu-mobile="hub"] .v222-fan-body>[data-hub-panel="customize"],
    body[data-menu-mobile="hub"] .v222-fan-body>[data-hub-panel="system"]{
        position:fixed!important;
        left:8px!important;
        right:8px!important;
        bottom:calc(8px + env(safe-area-inset-bottom))!important;
        top:auto!important;
        width:auto!important;
        max-height:72dvh!important;
        overflow:auto!important;
        padding:12px!important;
        border:1px solid rgba(88,148,178,.18)!important;
        border-radius:20px!important;
        background:rgba(250,252,253,.94)!important;
        box-shadow:0 24px 70px rgba(13,44,60,.18)!important;
        backdrop-filter:blur(24px)!important;
        -webkit-backdrop-filter:blur(24px)!important
    }
    body[data-menu-mobile="hub"] .v222-fan-footer{
        position:fixed!important;
        left:12px!important;
        bottom:calc(12px + env(safe-area-inset-bottom))!important;
        width:auto!important;
        min-height:42px!important;
        padding:5px!important;
        border:0!important;
        background:transparent!important;
        box-shadow:none!important
    }
    body[data-menu-mobile="hub"] .v222-fan-footer>span{display:none!important}
    body[data-menu-mobile="hub"] .v222-fan-footer .v212-logout-button{
        min-width:78px!important;min-height:38px!important;background:rgba(255,255,255,.88)!important;box-shadow:0 8px 24px rgba(16,54,72,.10)!important
    }
    body[data-menu-mobile="hub"] .v222-fan-menu[data-section="organize"] .v222-fan-footer,
    body[data-menu-mobile="hub"] .v222-fan-menu[data-section="applications"] .v222-fan-footer,
    body[data-menu-mobile="hub"] .v222-fan-menu[data-section="customize"] .v222-fan-footer,
    body[data-menu-mobile="hub"] .v222-fan-menu[data-section="system"] .v222-fan-footer{display:none!important}
}

@media(max-width:390px){
    body[data-menu-mobile="hub"] .v222-fan-stage{left:-132px;transform:translateY(-50%) scale(.93);transform-origin:left center}
    body[data-menu-mobile="hub"] .v222-create-stage{left:-140px;transform:translateY(-50%) scale(.91);transform-origin:left center}
}

@media(prefers-reduced-motion:reduce){
    .v222-fan-node,.v222-create-action{animation:none!important;transition:none!important}
}