.diy-phone[data-v-482d7bf4]{-ms-flex:1;flex:1;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:start;align-items:flex-start;padding:20px;overflow-y:auto;background:#e8e8e8;scrollbar-width:none}.phone-wrapper[data-v-482d7bf4]{width:375px;background:#fff;border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.12);overflow:hidden}.phone-header[data-v-482d7bf4]{height:44px;background:#fff;border-radius:8px 8px 0 0;-ms-flex-pack:justify;justify-content:space-between;padding:0 16px;font-size:12px;color:#333;position:relative}.phone-header[data-v-482d7bf4],.status-left[data-v-482d7bf4]{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.status-left[data-v-482d7bf4]{font-size:8px;letter-spacing:1px}.status-time[data-v-482d7bf4]{position:absolute;left:50%;transform:translateX(-50%);font-size:14px;font-weight:500}.status-battery[data-v-482d7bf4]{width:24px;height:12px;border:2px solid #333;border-radius:3px;position:relative}.status-battery[data-v-482d7bf4]:before{content:"";position:absolute;left:0;top:0;bottom:0;width:70%;background:#333;border-radius:1px}.status-battery[data-v-482d7bf4]:after{content:"";position:absolute;right:-4px;top:50%;transform:translateY(-50%);width:2px;height:6px;background:#333;border-radius:0 1px 1px 0}.phone-content[data-v-482d7bf4]{height:756px;overflow:auto;border-radius:0 0 8px 8px;scrollbar-width:none}.component-preview-draggable[data-v-482d7bf4]{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.mini-app-navbar[data-v-482d7bf4]{height:44px;background:#fff;-ms-flex-pack:justify;justify-content:space-between;padding:0 12px;border-bottom:1px solid #f0f0f0}.mini-app-navbar[data-v-482d7bf4],.navbar-left[data-v-482d7bf4]{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.navbar-left[data-v-482d7bf4]{width:60px}.navbar-title[data-v-482d7bf4]{-ms-flex:1;flex:1;text-align:center;font-size:16px;font-weight:500;color:#333}.navbar-right[data-v-482d7bf4]{width:80px;-ms-flex-pack:end;justify-content:flex-end;gap:8px}.navbar-more[data-v-482d7bf4],.navbar-right[data-v-482d7bf4]{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.navbar-more[data-v-482d7bf4]{gap:3px;padding:6px 10px;background:#f5f5f5;border-radius:14px}.more-dot[data-v-482d7bf4]{background:#333;border-radius:50%}.more-dot.small[data-v-482d7bf4]{width:4px;height:4px}.more-dot.large[data-v-482d7bf4]{width:6px;height:6px}.navbar-home[data-v-482d7bf4]{width:20px;height:20px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;border:2px solid #333;border-radius:50%;-ms-flex-negative:0;flex-shrink:0}.home-dot[data-v-482d7bf4]{width:6px;height:6px;background:#333;border-radius:50%}.miniapp-content[data-v-482d7bf4]{min-height:100%;padding-top:44px}.component-preview[data-v-482d7bf4]{position:relative;margin:0;background:transparent;cursor:move;transition:all .3s;outline:2px solid transparent;outline-offset:-2px}.component-preview[data-v-482d7bf4]:hover{outline-color:#1890ff;z-index:99999}.component-preview.active[data-v-482d7bf4]{outline-color:#1890ff;outline-style:solid;box-shadow:0 0 8px rgba(24,144,255,.5)}.component-preview.sortable-ghost[data-v-482d7bf4]{opacity:.5;background:#f0f9ff}.component-preview.sortable-drag[data-v-482d7bf4]{opacity:.8;box-shadow:0 4px 12px rgba(0,0,0,.15);cursor:move}.component-preview.drop-hover[data-v-482d7bf4]{outline-color:#1890ff;outline-style:solid;box-shadow:0 0 12px rgba(24,144,255,.3)}.component-preview.goods-component[data-v-482d7bf4]{padding-left:12px;padding-right:12px;outline:none}.component-preview.goods-component.active>[data-v-482d7bf4],.component-preview.goods-component:hover>[data-v-482d7bf4]{outline:2px solid #1890ff;outline-offset:-2px;box-shadow:0 0 8px rgba(24,144,255,.5)}.component-preview-wrapper[data-v-482d7bf4]{position:relative}.drop-indicator[data-v-482d7bf4]{position:relative;height:40px;margin:0;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;animation:dropIndicatorFadeIn-data-v-482d7bf4 .2s ease}@keyframes dropIndicatorFadeIn-data-v-482d7bf4{0%{opacity:0;transform:scaleY(.5)}to{opacity:1;transform:scaleY(1)}}.drop-indicator-line[data-v-482d7bf4]{position:absolute;left:0;right:0;height:3px;background:linear-gradient(90deg,#1890ff,#40a9ff 50%,#1890ff);border-radius:2px;box-shadow:0 0 8px rgba(24,144,255,.5);animation:dropLinePulse-data-v-482d7bf4 1.5s ease-in-out infinite}@keyframes dropLinePulse-data-v-482d7bf4{0%,to{opacity:1;transform:scaleX(1)}50%{opacity:.7;transform:scaleX(.98)}}.drop-indicator-line[data-v-482d7bf4]:after,.drop-indicator-line[data-v-482d7bf4]:before{content:"";position:absolute;top:50%;width:8px;height:8px;background:#1890ff;border-radius:50%;transform:translateY(-50%);box-shadow:0 0 6px rgba(24,144,255,.6)}.drop-indicator-line[data-v-482d7bf4]:before{left:-4px}.drop-indicator-line[data-v-482d7bf4]:after{right:-4px}.drop-indicator-text[data-v-482d7bf4]{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#1890ff;color:#fff;padding:4px 12px;border-radius:12px;font-size:12px;font-weight:500;white-space:nowrap;box-shadow:0 2px 8px rgba(24,144,255,.3);z-index:1}.empty-tip[data-v-482d7bf4]{text-align:center;padding:60px 20px;color:#999;border:2px dashed #d9d9d9;border-radius:8px;transition:all .3s;background:#fff}.empty-tip[data-v-482d7bf4]:hover{border-color:#1890ff;background:#e6f7ff}