body * {
    box-sizing: border-box;
    flex-shrink: 0;
    margin: 0;
    padding: 0;
}

body {
    font-family: PingFangSC-Regular, Roboto, Helvetica Neue, Helvetica, Tahoma, Arial, PingFang SC-Light, Microsoft YaHei;
    margin: 0;
    padding: 0;
}

input {
    background-color: transparent;
    border: 0;
}

button {
    margin: 0;
    padding: 0;
    border: 1px solid transparent;
    outline: none;
    background-color: transparent;
}

button:active {
    opacity: 0.6;
}

.flex-col {
    display: flex;
    flex-direction: column;
}

.flex-row {
    display: flex;
    flex-direction: row;
}

.flex-relative{
    position: relative;
}

.bottom{
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    animation: shake 1s ease-in-out infinite;
    will-change: transform;
    backface-visibility: hidden;

    .install{
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}

.justify-start {
    display: flex;
    justify-content: flex-start;
}

.justify-center {
    display: flex;
    justify-content: center;
}

.justify-end {
    display: flex;
    justify-content: flex-end;
}

.justify-evenly {
    display: flex;
    justify-content: space-evenly;
}

.justify-around {
    display: flex;
    justify-content: space-around;
}

.justify-between {
    display: flex;
    justify-content: space-between;
}

.align-start {
    display: flex;
    align-items: flex-start;
}

.align-center {
    display: flex;
    align-items: center;
}

.align-end {
    display: flex;
    align-items: flex-end;
}

/* 关键帧：轻微左右+微旋转，更自然 */
@keyframes shake {
    0%   { transform: translateX(0)      rotate(0); }
    10%  { transform: translateX(-2px)   rotate(-1.2deg); }
    20%  { transform: translateX(3px)    rotate(1.2deg); }
    30%  { transform: translateX(-3px)   rotate(-1.1deg); }
    40%  { transform: translateX(3px)    rotate(1.1deg); }
    50%  { transform: translateX(-2px)   rotate(-1deg); }
    60%  { transform: translateX(2px)    rotate(1deg); }
    70%  { transform: translateX(-1px)   rotate(-0.8deg); }
    80%  { transform: translateX(1px)    rotate(0.8deg); }
    90%  { transform: translateX(-1px)   rotate(-0.5deg); }
    100% { transform: translateX(0)      rotate(0); }
}
