代码 (第4/12页)

ndex:   10;

    }

    .back-btn   {

    cursor:   pointer;

    transition:   all   0.2s   ease;

    width:   32px;

    height:   32px;

    display:   flex;

    align-items:   center;

    justify-content:   center;

    border-radius:   8px;

    }

    .back-btn:hover   {

    background:   rgba(0,   0,   0,   0.05);

    transform:   scale(1.05);

    }

    .card   {

    background:   white;

    border-radius:   16px;

    padding:   18px;

    margin-bottom:   16px;

    box-shadow:   0   2px   12px   rgba(0,   0,   0,   0.05);

    border:   1px   solid   rgba(0,   0,   0,   0.03);

    transition:   all   0.3s   ease;

    }

    .card:hover   {

    box-shadow:   0   4px   20px   rgba(0,   0,   0,   0.08);

    transform:   translateY(-2px);

    }

    .chat-bubble   {

    max-width:   75%;

    border-radius:   18px;

    padding:   12px   16px;

    margin-bottom:   12px;

    box-shadow:   0   1px   2px   rgba(0,   0,   0,   0.1);

    position:   relative;

    animation:   fadeIn   0.3s   ease;

    }

    @keyframes   fadeIn   {

    from   {   opacity:   0;   transform:   translateY(10px);   }

    to   {   opacity:   1;   transform:   translateY(0);   }

    }

    .chat-left   {

    background:   f1f1f1;

    align-self:   flex-start;

    border-bottom-left-radius:   4px;

    }

    .chat-right   {

    background:   000;

    color:   white;

    align-self:   flex-end;

    border-bottom-right-radius:   4px;

    }

    .chat-container   {