*{box-sizing:border-box}html,body,#app{margin:0;width:100%;height:100%;min-height:100%;background:#fff;color:#2a2622}.diy-shell{--preview-min: clamp(220px, 46dvh, 52dvh);--actions-h: 52px;--panel-h: clamp(200px, 34dvh, 300px);--panel-max: calc(100% - var(--preview-min) - var(--actions-h));--stage-size: 280px;--finish-gap: 12px;--finish-edge: 12px;--c-bg: #ffffff;--c-text: #2a2622;--c-muted: #8a8278;--c-subtle: #9a9186;--c-border: #eeeae3;--c-border-soft: #e5e0d8;--c-panel-bg: #ffffff;--c-accent: #c45c26;--c-dark: #1f1b17;--c-card-bg: #ffffff;position:relative;width:100%;height:100%;min-height:100%;display:flex;flex-direction:column;background:var(--c-bg);color:var(--c-text);font-family:-apple-system,BlinkMacSystemFont,PingFang SC,Segoe UI,sans-serif;overflow:hidden;user-select:none;-webkit-user-select:none;touch-action:manipulation;transition:background .2s ease}.diy-shell.is-delete-mode{background:#fff}.diy-top{position:absolute;top:0;left:0;right:0;z-index:30;padding:10px 12px calc(8px + env(safe-area-inset-top));display:flex;flex-direction:column;gap:8px;pointer-events:none}.diy-pills{display:flex;flex-wrap:wrap;gap:6px;pointer-events:auto}.diy-pill{border:none;background:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:999px;padding:4px 10px;font-size:12px;display:inline-flex;align-items:center;gap:4px;color:var(--c-text);box-shadow:0 1px 4px #0000000f}.diy-pill.muted{color:var(--c-muted)}.diy-pill .lbl{opacity:.65;font-size:11px}.diy-meta-row{display:flex;flex-wrap:wrap;gap:8px;pointer-events:auto}.diy-title-input{flex:1;min-width:140px;border:1px solid var(--c-border-soft);border-radius:999px;padding:6px 12px;font-size:12px;background:#fff;color:var(--c-text);box-shadow:0 1px 4px #0000000a}.diy-title-input:focus{outline:none;border-color:var(--c-accent)}.diy-target-wrap{display:inline-flex;align-items:center;gap:4px;border:1px solid var(--c-border-soft);border-radius:999px;padding:4px 10px;background:#fff;font-size:12px;box-shadow:0 1px 4px #0000000a}.diy-target-label,.diy-target-unit{color:var(--c-muted);font-size:11px;white-space:nowrap}.diy-target-input{width:52px;border:none;background:transparent;font:inherit;font-weight:600;color:var(--c-text);text-align:center;padding:0}.diy-target-input:focus{outline:none}.diy-length-status{margin:0;padding:6px 10px;border-radius:8px;font-size:11px;line-height:1.4;pointer-events:auto}.diy-length-status.is-ok{background:#ecfdf3;color:#166534}.diy-length-status.is-under{background:#fffbeb;color:#92400e}.diy-length-status.is-over{background:#fef2f2;color:#b91c1c}.diy-pill strong{font-weight:600}.diy-preview-area{flex:1 1 var(--preview-min);min-height:var(--preview-min);min-width:0;display:flex;align-items:center;justify-content:center;padding:clamp(72px,14dvh,112px) 12px 8px;box-sizing:border-box;position:relative;background:var(--c-bg);overflow:hidden;pointer-events:none;z-index:1}.diy-stage{position:relative;width:var(--stage-size);height:var(--stage-size);flex:0 0 auto;pointer-events:none}.diy-ring-wrap{position:relative;width:100%;height:100%;pointer-events:none}.diy-ring{position:relative;width:100%;height:100%;border-radius:50%;background:transparent;pointer-events:auto}.diy-actions{flex:0 0 auto;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:8px 12px;background:var(--c-bg);position:relative;z-index:40;pointer-events:auto}.diy-clear-btn,.diy-finish-btn{position:static;margin:0;min-height:36px;padding:7px 14px;font:inherit;font-size:13px;font-weight:600;line-height:1.4;border:none;border-radius:999px;cursor:pointer;pointer-events:auto;white-space:nowrap;-webkit-tap-highlight-color:transparent}.diy-clear-btn{color:var(--c-text);background:#fff;box-shadow:0 2px 10px #1e18101f;border:1px solid var(--c-border-soft)}.diy-clear-btn:disabled{opacity:.45;cursor:not-allowed}.diy-finish-btn{margin-left:auto;color:#fff;background:var(--c-accent);box-shadow:0 2px 10px #c45c2647}.diy-finish-btn:disabled{opacity:.72;cursor:not-allowed}.diy-fly-bead{position:fixed;z-index:120;margin:0;padding:0;border-radius:50%;overflow:hidden;pointer-events:none;box-shadow:4px 8px 16px #281e1447;background:transparent;will-change:left,top,width,height,transform;transition:left .42s cubic-bezier(.22,1,.36,1),top .42s cubic-bezier(.22,1,.36,1),width .42s cubic-bezier(.22,1,.36,1),height .42s cubic-bezier(.22,1,.36,1),transform .42s cubic-bezier(.22,1,.36,1)}.diy-fly-bead.is-accessory{border-radius:4px;overflow:visible;box-shadow:none;filter:drop-shadow(3px 4px 10px rgba(40,30,20,.28))}.diy-fly-bead img,.diy-fly-bead .diy-fly-fallback{width:100%;height:100%;display:block;object-fit:cover;border-radius:inherit}.diy-fly-bead.is-accessory img{object-fit:contain;border-radius:0}.diy-fly-fallback{background:#ddd}.diy-toast{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);z-index:80;padding:10px 16px;border-radius:999px;background:#1f1b17e0;color:#fff;font-size:13px;pointer-events:none;box-shadow:0 4px 16px #0000002e}.diy-ring.is-empty{border:none}.diy-rope{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;overflow:visible}.diy-ring-brand{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-content:center;text-align:center;pointer-events:none;z-index:0}.diy-ring-brand strong{font-family:Songti SC,"Noto Serif SC",Georgia,serif;font-size:clamp(22px,6vw,30px);font-weight:600;color:var(--c-text);letter-spacing:.12em;opacity:.2;white-space:nowrap}.diy-bead{position:absolute;left:50%;top:50%;z-index:2;border-radius:50%;overflow:hidden;cursor:grab;box-shadow:4px 5px 12px #281e1447;transition:transform .28s cubic-bezier(.34,1.4,.64,1),box-shadow .2s,opacity .15s;background:#ddd;touch-action:none}.diy-bead.is-accessory{border-radius:4px;overflow:visible;background:transparent;box-shadow:none;filter:drop-shadow(3px 4px 8px rgba(40,30,20,.28))}.diy-bead img,.diy-bead .diy-bead-fallback{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}.diy-bead.is-accessory img{object-fit:contain;border-radius:0}.diy-bead .diy-bead-fallback{border-radius:50%}.diy-bead.is-accessory .diy-bead-fallback{border-radius:4px}.diy-bead.is-dragging{cursor:grabbing;z-index:80;transition:none;box-shadow:8px 12px 24px #281e1461}.diy-bead.is-delete{opacity:.4;filter:grayscale(.35)}.diy-drop-hint{position:absolute;left:50%;top:50%;width:14px;height:14px;border-radius:50%;border:2px solid rgba(196,92,38,.55);background:#c45c261f;pointer-events:none;z-index:40}.diy-drag-hint{position:absolute;bottom:12px;left:50%;transform:translate(-50%);margin:0;padding:6px 12px;font-size:12px;color:#5c5348;background:#fff;border-radius:999px;white-space:nowrap;z-index:20;box-shadow:0 2px 8px #0000000f;pointer-events:none}.diy-drag-hint:empty{display:none}.diy-drag-hint.is-danger{color:#fff;background:#b43c28e6}.diy-panel{position:relative;flex:0 0 auto;height:min(var(--panel-h),var(--panel-max));max-height:var(--panel-max);min-height:0;background:var(--c-bg);border-radius:22px 22px 0 0;box-shadow:0 -8px 28px #1e181014;display:flex;flex-direction:column;z-index:30;pointer-events:auto}.diy-panel-handle{height:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.diy-panel-handle span{width:44px;height:3px;border-radius:999px;background:#d8d2c8}.diy-panel-toolbar{padding:0 12px 10px;border-bottom:1px solid var(--c-border);display:flex;flex-wrap:nowrap;gap:8px;align-items:center;flex-shrink:0}.diy-panel-toolbar .diy-search{flex:1 1 auto;min-width:0;width:auto!important;max-width:none!important;height:36px!important;min-height:36px!important;box-sizing:border-box!important;margin:0!important;font:inherit;font-size:13px!important;line-height:36px!important;border:1px solid var(--c-border-soft)!important;border-radius:999px!important;padding:0 14px!important;background:#f7f4ef!important;color:var(--c-text)!important;outline:none;-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important}.diy-panel-toolbar .diy-search::placeholder{color:var(--c-muted);line-height:36px}.diy-panel-toolbar .diy-search:focus{border-color:#c45c2673!important;background:#fff!important}.diy-panel-toolbar .diy-search::-webkit-search-decoration,.diy-panel-toolbar .diy-search::-webkit-search-cancel-button,.diy-panel-toolbar .diy-search::-webkit-search-results-button,.diy-panel-toolbar .diy-search::-webkit-search-results-decoration{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.diy-picker-tabs{display:flex;flex-shrink:0;gap:8px}.diy-picker-tab{font:inherit;font-size:13px;border:1px solid var(--c-border-soft);background:var(--c-panel-bg);color:var(--c-muted);border-radius:999px;padding:6px 16px;cursor:pointer}.diy-picker-tab.is-active{background:var(--c-dark);border-color:var(--c-dark);color:#fff}.diy-panel-body{flex:1;min-height:0;display:flex}.diy-cats{width:88px;background:var(--c-panel-bg);border-right:1px solid var(--c-border);overflow-y:auto;flex-shrink:0}.diy-cat{width:100%;border:none;background:transparent;text-align:left;padding:12px 10px;font-size:13px;color:var(--c-subtle);cursor:pointer;position:relative;border-bottom:1px solid #efebe4}.diy-cat.is-active{background:var(--c-bg);color:var(--c-dark);font-weight:600}.diy-cat.is-active:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:16px;background:var(--c-accent);border-radius:0 2px 2px 0}.diy-grid-col{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column}.diy-grid-wrap{flex:1;min-height:0;overflow-x:hidden;overflow-y:auto;padding:8px;-webkit-overflow-scrolling:touch}.diy-picker-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:auto;gap:8px;width:100%}.diy-picker-item{display:flex;flex-direction:column;align-items:stretch;align-self:start;width:100%;padding:0;margin:0;border:1px solid #ebe6de;border-radius:12px;background:var(--c-bg);cursor:pointer;text-align:left;overflow:hidden;-moz-appearance:none;appearance:none;-webkit-appearance:none;font:inherit;color:inherit;transition:transform .15s ease,box-shadow .15s ease;touch-action:manipulation;pointer-events:auto}.diy-picker-item:active{transform:scale(.97)}.diy-picker-thumb{height:52px;flex-shrink:0;display:flex;align-items:center;justify-content:center;padding:6px;background:var(--c-card-bg)}.diy-picker-thumb img{max-width:100%;max-height:100%;object-fit:contain;display:block}.diy-picker-fallback{width:30px;height:30px;border-radius:50%;display:block;flex-shrink:0}.diy-picker-meta{padding:3px 5px 6px;flex-shrink:0}.diy-picker-name{display:block;font-size:12px;line-height:1.25;color:var(--c-text);min-height:2.4em;max-height:2.4em;overflow:hidden;text-overflow:ellipsis;text-align:center;word-break:break-all}.diy-picker-row{display:flex;justify-content:space-between;font-size:11px;color:var(--c-muted);margin-top:2px}.diy-picker-price{color:var(--c-accent);font-weight:600}.diy-picker-empty{grid-column:1 / -1;text-align:center;padding:40px 12px;color:var(--c-subtle);font-size:13px}.diy-picker-pager{display:flex;align-items:center;justify-content:center;gap:10px;padding:6px 8px 10px;flex-shrink:0;border-top:1px solid var(--c-border)}.diy-picker-page-btn{font:inherit;font-size:12px;border:1px solid var(--c-border-soft);background:var(--c-bg);color:#5c5348;border-radius:999px;padding:5px 14px;cursor:pointer}.diy-picker-page-btn:disabled{opacity:.45;cursor:not-allowed}.diy-picker-page-info{font-size:12px;color:var(--c-subtle);min-width:120px;text-align:center}.page[data-v-e998722c]{width:100%;height:100%;min-height:100%;overflow:hidden;background:#fff}.stage[data-v-e998722c]{width:100%;height:100%;min-height:0}