/* styles.css */
:root {
    --phone-width: 100vw;  /* 修改为100vw */
    --frame-width: 0;      /* 设为0 */
    --frame-color: #D4AF37;
    --phone-bg: #B0C4DE;
    --phone-border: #4169E1;
    --frame-radius: 15px;
    --phone-radius: 0;     /* 设为0 */
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    height: 100vh;
    overflow: hidden;
    background: #f0f0f0;
}

.art-frame {
    display: none; /* 直接隐藏艺术框 */
}

.phone-border {
     position: fixed;
    right: 0;
    top: 0;
    width: var(--phone-width);
    height: 100vh;
    border: 5px solid var(--phone-border);
    border-radius: var(--phone-radius);
    background: var(--phone-bg);
    box-shadow: -5px 0 15px rgba(0,0,0,0.2);
    z-index: 2;
    padding: 0px;
    overflow-y: auto;  /* 允许垂直滚动 */
    overflow-x: hidden; /* 防止水平滚动 */
    -ms-overflow-style: none;  /* IE 和 Edge 隐藏滚动条 */
    scrollbar-width: none;  /* Firefox 隐藏滚动条 */
    
  }