:root{--text:#6b6375;--text-h:#08060d;--bg:#fff;--border:#e5e4e7;--code-bg:#f4f3ec;--accent:#aa3bff;--accent-bg:#aa3bff1a;--accent-border:#aa3bff80;--social-bg:#f4f3ec80;--shadow:#0000001a 0 10px 15px -3px, #0000000d 0 4px 6px -2px;--sans:system-ui, "Segoe UI", Roboto, sans-serif;--heading:system-ui, "Segoe UI", Roboto, sans-serif;--mono:ui-monospace, Consolas, monospace;font:18px/145% var(--sans);letter-spacing:.18px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}@media (width<=1024px){:root{font-size:16px}}@media (prefers-color-scheme:dark){:root{--text:#9ca3af;--text-h:#f3f4f6;--bg:#16171d;--border:#2e303a;--code-bg:#1f2028;--accent:#c084fc;--accent-bg:#c084fc26;--accent-border:#c084fc80;--social-bg:#2f303a80;--shadow:#0006 0 10px 15px -3px, #00000040 0 4px 6px -2px}#social .button-icon{filter:invert()brightness(2)}}body{margin:0}h1,h2{font-family:var(--heading);color:var(--text-h);font-weight:500}h1{letter-spacing:-1.68px;margin:32px 0;font-size:56px}@media (width<=1024px){h1{margin:20px 0;font-size:36px}}h2{letter-spacing:-.24px;margin:0 0 8px;font-size:24px;line-height:118%}@media (width<=1024px){h2{font-size:20px}}p{margin:0}code,.counter{font-family:var(--mono);color:var(--text-h);border-radius:4px;display:inline-flex}code{background:var(--code-bg);padding:4px 8px;font-size:15px;line-height:135%}.counter{color:var(--accent);background:var(--accent-bg);border:2px solid #0000;border-radius:5px;margin-bottom:24px;padding:5px 10px;font-size:16px;transition:border-color .3s}.counter:hover{border-color:var(--accent-border)}.counter:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.hero{position:relative}.hero .base,.hero .framework,.hero .vite{margin:0 auto;inset-inline:0}.hero .base{z-index:0;width:170px;position:relative}.hero .framework,.hero .vite{position:absolute}.hero .framework{z-index:1;height:28px;top:34px;transform:perspective(2000px)rotate(300deg)rotateX(44deg)rotateY(39deg)scale(1.4)}.hero .vite{z-index:0;width:auto;height:26px;top:107px;transform:perspective(2000px)rotate(300deg)rotateX(40deg)rotateY(39deg)scale(.8)}#app{text-align:center;border-inline:1px solid var(--border);box-sizing:border-box;flex-direction:column;width:1126px;max-width:100%;min-height:100svh;margin:0 auto;display:flex}#center{flex-direction:column;flex-grow:1;place-content:center;place-items:center;gap:25px;display:flex}@media (width<=1024px){#center{gap:18px;padding:32px 20px 24px}}#next-steps{border-top:1px solid var(--border);text-align:left;display:flex}#next-steps>div{flex:1 1 0;padding:32px}@media (width<=1024px){#next-steps>div{padding:24px 20px}}#next-steps .icon{width:22px;height:22px;margin-bottom:16px}@media (width<=1024px){#next-steps{text-align:center;flex-direction:column}}#docs{border-right:1px solid var(--border)}@media (width<=1024px){#docs{border-right:none;border-bottom:1px solid var(--border)}}#next-steps ul{gap:8px;margin:32px 0 0;padding:0;list-style:none;display:flex}#next-steps ul .logo{height:18px}#next-steps ul a{color:var(--text-h);background:var(--social-bg);border-radius:6px;align-items:center;gap:8px;padding:6px 12px;font-size:16px;text-decoration:none;transition:box-shadow .3s;display:flex}#next-steps ul a:hover{box-shadow:var(--shadow)}#next-steps ul a .button-icon{width:18px;height:18px}@media (width<=1024px){#next-steps ul{flex-wrap:wrap;justify-content:center;margin-top:20px}#next-steps ul li{flex:calc(50% - 8px)}#next-steps ul a{box-sizing:border-box;justify-content:center;width:100%}}#spacer{border-top:1px solid var(--border);height:88px}@media (width<=1024px){#spacer{height:48px}}.ticks{width:100%;position:relative}.ticks:before,.ticks:after{content:"";border:5px solid #0000;position:absolute;top:-4.5px}.ticks:before{border-left-color:var(--border);left:0}.ticks:after{border-right-color:var(--border);right:0}:root{--cream:#fffaf2;--paper:#fff;--ink:#302c35;--muted:#807985;--pink:#ff6f91;--pink-dark:#ed5279;--pink-soft:#fff0f4;--yellow:#ffd86b;--mint:#78d7bd;--blue:#73bdf4;--purple:#a98be8;--line:#eee7df;--soft-shadow:0 18px 50px #64483117;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:var(--ink);background:var(--cream);font:16px/1.6 PingFang SC,Microsoft YaHei,system-ui,sans-serif}*{box-sizing:border-box}html{background:var(--cream);min-width:320px}body{min-width:320px;min-height:100vh;color:var(--ink);background:radial-gradient(circle at 8% 4%, #ffd86b3d, transparent 22rem), radial-gradient(circle at 92% 10%, #78d7bd2e, transparent 24rem), var(--cream)}button,input{font:inherit}button{-webkit-tap-highlight-color:transparent}#app{width:100%;max-width:none;min-height:100vh;text-align:initial;border:0}.app-shell{flex-direction:column;min-height:100vh;display:flex}.brand-header{justify-content:space-between;align-items:center;gap:32px;width:min(1120px,100% - 48px);margin:0 auto;padding:30px 0 22px;display:flex}.brand-lockup{align-items:center;gap:14px;display:flex}.brand-lockup strong{color:var(--ink);letter-spacing:-.02em;font-size:clamp(21px,2vw,28px);line-height:1.1;display:block}.brand-kicker{color:var(--pink-dark);letter-spacing:.18em;margin:0 0 4px;font-size:12px;font-weight:800}.brand-note{max-width:430px;color:var(--muted);text-align:right;margin:0;font-size:14px}.bead-mark{background:var(--paper);width:52px;height:52px;box-shadow:var(--soft-shadow);border-radius:16px;grid-template-columns:repeat(3,1fr);gap:3px;padding:7px;display:grid;transform:rotate(-3deg)}.bead-mark span{background:var(--pink);border-radius:50%}.bead-mark span:nth-child(2),.bead-mark span:nth-child(8){background:var(--yellow)}.bead-mark span:nth-child(3),.bead-mark span:nth-child(7){background:var(--mint)}.bead-mark span:nth-child(4){background:var(--blue)}.bead-mark span:nth-child(6){background:var(--purple)}.step-nav{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#ffffffd1;border:1px solid #eee7dfe6;border-radius:22px;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:min(1120px,100% - 48px);margin:0 auto;padding:10px;display:grid;box-shadow:0 8px 30px #6448310d}.step-item{color:#aaa3ab;border-radius:14px;justify-content:center;align-items:center;gap:9px;min-width:0;padding:10px 12px;display:flex}.step-item span{background:#fff;border:1px solid #e6dfe5;border-radius:50%;flex:0 0 28px;place-items:center;width:28px;height:28px;font-size:10px;font-weight:800;display:grid}.step-item b{text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:700;overflow:hidden}.step-item.active{color:#fff;background:var(--pink);box-shadow:0 8px 22px #ff6f913d}.step-item.active span{color:var(--pink-dark);border-color:#fff}.step-item.done{color:#478e7d;background:#eefaf6}.step-item.done span{color:#fff;border-color:var(--mint);background:var(--mint)}.app-main{flex:1;width:min(1120px,100% - 48px);margin:24px auto 0}html body #app .page{width:100%;min-height:0;box-shadow:var(--soft-shadow);background:#fffffff0;border:1px solid #eee7dff5;border-radius:30px;padding:clamp(24px,5vw,58px);overflow:visible}html body #app .page h1{color:var(--ink);letter-spacing:-.035em;margin:0 0 8px;font-size:clamp(25px,4vw,38px);font-weight:800}html body #app .page .desc{color:var(--muted);font-size:14px}html body #app .top-bar{min-height:46px;margin-bottom:10px}html body #app .top-bar h1,html body #app .pattern-viewer-bar h1{color:var(--ink);letter-spacing:-.035em;margin:0;font-size:clamp(25px,4vw,38px);font-weight:800;line-height:1.2}html body #app .back-btn{border:1px solid var(--line);min-height:40px;color:var(--muted);background:#fff;border-radius:12px;padding:8px 12px;font-size:14px;font-weight:700}html body #app .back-btn:hover{color:var(--pink-dark);border-color:#ffc5d3;transform:translate(-2px)}html body #app .upload-box,html body #app .crop-area{background:#fff;border:2px dashed #f5a8ba;border-radius:26px;width:min(100%,500px);box-shadow:inset 0 0 0 8px #fff0f4b3}html body #app .upload-box:hover{border-color:var(--pink);background:#fff8fa}html body #app .upload-placeholder{color:var(--pink-dark);font-weight:750}html body #app .upload-icon{color:#fff;background:var(--pink);border-radius:20px;place-items:center;width:64px;height:64px;margin:0 auto 14px;display:grid;box-shadow:0 10px 24px #ff6f9138}html body #app .upload-placeholder small{color:#9f97a1;font-weight:500}html body #app .preview-area,html body #app .control-card,html body #app .info-card,html body #app .stats-card,html body #app .summary-card,html body #app .tip{border:1px solid var(--line);background:#fff;box-shadow:0 10px 32px #6448310e}html body #app .preview-area{border-radius:24px;width:min(100%,720px);max-height:70vh;padding:clamp(10px,2.4vw,20px)}html body #app .control-card,html body #app .info-card,html body #app .stats-card,html body #app .summary-card,html body #app .tip{border-radius:18px;width:min(100%,720px);max-width:none;padding:18px 20px}html body #app .control-title{color:var(--ink);font-size:15px}html body #app .slider-row,html body #app .summary-card,html body #app .info-card{color:var(--muted)}html body #app .range-input{min-height:30px;accent-color:var(--pink)}html body #app .action-row{gap:12px;width:min(100%,720px);max-width:none}html body #app .action-btn,html body #app .next-btn,html body #app .confirm-btn,html body #app .restart-btn{color:#fff;background:var(--pink);border-radius:16px;min-height:50px;font-weight:750;transition:background .2s,box-shadow .2s,transform .2s;box-shadow:0 10px 22px #ff6f9133}html body #app .next-btn,html body #app .confirm-btn,html body #app .restart-btn,html body #app .change-btn{width:min(100%,500px);max-width:none}html body #app .action-btn:hover,html body #app .next-btn:hover,html body #app .confirm-btn:hover,html body #app .restart-btn:hover{background:var(--pink-dark);transform:translateY(-1px);box-shadow:0 12px 26px #ed527940}html body #app .action-btn.secondary,html body #app .change-btn{color:var(--pink-dark);box-shadow:none;background:#fff;border:1px solid #f6b7c6;border-radius:16px}html body #app .next-btn:disabled,html body #app .confirm-btn:disabled{color:#a9a3aa;box-shadow:none;background:#e9e5e8;transform:none}html body #app .summary-desc{color:#9a6572;margin:18px auto 0;font-weight:650}html body #app .controls-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;width:min(100%,920px);margin:14px auto 0;display:grid}html body #app .controls-grid .control-card{width:100%;min-width:0;margin:0;padding:14px 16px}html body #app .controls-grid .control-title{margin-bottom:8px;font-size:14px}html body #app .controls-grid .control-title strong{color:var(--pink-dark);font-size:17px}html body #app .controls-grid .slider-row{margin-bottom:2px;font-size:11px}html body #app .follow-modal{border-radius:24px;max-width:360px;padding:28px 22px 22px;box-shadow:0 24px 80px #24181e3d}html body #app .modal-close{color:var(--pink-dark);background:var(--pink-soft)}html body #app .qrcode-img{border-radius:14px;width:min(100%,260px);height:auto}.site-footer{color:#9a939c;justify-content:space-between;gap:24px;width:min(1120px,100% - 48px);margin:0 auto;padding:28px 0 34px;font-size:12px;display:flex}@media (width<=720px){.brand-header,.step-nav,.app-main,.site-footer{width:min(100% - 28px,1120px)}.brand-header{padding:20px 0 16px}.brand-note{display:none}.bead-mark{border-radius:14px;width:46px;height:46px}.brand-lockup strong{font-size:21px}.step-nav{border-radius:18px;gap:4px;padding:7px}.step-item{border-radius:12px;flex-direction:column;gap:4px;padding:8px 4px}.step-item span{flex-basis:24px;width:24px;height:24px;font-size:9px}.step-item b{max-width:100%;font-size:10px}.app-main{margin-top:14px}html body #app .page{border-radius:22px;padding:24px 16px 28px}html body #app .page h1{font-size:25px}html body #app .top-bar{padding-top:44px}html body #app .top-bar .back-btn{top:0}html body #app .upload-box,html body #app .crop-area{border-radius:20px;width:100%}html body #app .action-row{grid-template-columns:1fr}html body #app .controls-grid{grid-template-columns:1fr;gap:8px}html body #app .controls-grid .control-card{padding:10px 14px}html body #app .controls-grid .control-title{text-align:left;margin-bottom:2px}html body #app .controls-grid .slider-row{margin-bottom:-2px}html body #app .action-btn,html body #app .next-btn,html body #app .confirm-btn,html body #app .restart-btn,html body #app .change-btn{border-radius:14px;min-height:48px}html body #app .control-card,html body #app .info-card,html body #app .stats-card,html body #app .summary-card,html body #app .tip{padding:16px}html body #app .modal-mask{padding:14px}.site-footer{text-align:center;flex-direction:column;gap:4px;padding:22px 0 28px}}@media (width<=380px){.brand-header,.step-nav,.app-main,.site-footer{width:min(100% - 20px,1120px)}.step-item b{font-size:9px}html body #app .page{padding-inline:12px}}.page[data-v-f54a5603]{box-sizing:border-box;text-align:center;background:#fff7fb;min-height:100vh;padding:24px}h1[data-v-f54a5603]{color:#333;margin:24px 0 8px;font-size:26px}.desc[data-v-f54a5603]{color:#777;margin:0 0 24px;font-size:14px}.upload-box[data-v-f54a5603]{aspect-ratio:1;touch-action:manipulation;cursor:pointer;-webkit-user-select:none;user-select:none;background:#fff;border:2px dashed #ff9ec0;border-radius:24px;justify-content:center;align-items:center;width:min(92vw,360px);margin:0 auto;display:flex;position:relative;overflow:hidden}.upload-box.has-image[data-v-f54a5603]{touch-action:none}.upload-box.dragging[data-v-f54a5603]{cursor:grabbing}.upload-box input[data-v-f54a5603]{z-index:2;opacity:0;cursor:pointer;width:100%;height:100%;margin:0;padding:0;display:block;position:absolute;inset:0}.upload-box.has-image input[data-v-f54a5603]{pointer-events:none}.upload-placeholder[data-v-f54a5603]{color:#ff8fb3}.upload-icon[data-v-f54a5603]{margin-bottom:12px;font-size:48px;line-height:1}.upload-placeholder small[data-v-f54a5603]{color:#aaa;margin-top:8px;display:block}.preview-img[data-v-f54a5603]{object-fit:contain;transform-origin:50%;will-change:transform;cursor:grab;pointer-events:none;width:100%;height:100%;transition:transform 80ms ease-out}.next-btn[data-v-f54a5603],.change-btn[data-v-f54a5603]{box-sizing:border-box;border-radius:26px;width:100%;max-width:360px;height:52px;margin-left:auto;margin-right:auto;font-size:16px;font-weight:600;display:block}.next-btn[data-v-f54a5603]{color:#fff;background:#ff8fb3;border:none;margin-top:24px}.change-btn[data-v-f54a5603]{color:#ff7da8;background:#fff;border:2px solid #ffb6cc;margin-top:25px}.change-btn[data-v-f54a5603]:hover{background:#fff5f8}.next-btn[data-v-f54a5603]:hover{background:#ff7aa6}.next-btn[data-v-f54a5603]:disabled{color:#999;background:#ddd}.page[data-v-c861eb57]{box-sizing:border-box;text-align:center;background:#fff7fb;min-height:100vh;padding:20px;overflow:hidden}.top-bar[data-v-c861eb57]{justify-content:center;align-items:center;margin-bottom:16px;display:flex;position:relative}.back-btn[data-v-c861eb57]{color:#ff8fb3;cursor:pointer;background:0 0;border:none;font-size:16px;position:absolute;left:0}h1[data-v-c861eb57]{color:#333;margin:0;font-size:24px}.desc[data-v-c861eb57]{color:#777;margin-bottom:16px;font-size:14px}.crop-area[data-v-c861eb57]{aspect-ratio:1;touch-action:none;background:#fff;border:2px dashed #ffb6cc;border-radius:24px;width:min(92vw,360px);margin:0 auto;position:relative;overflow:hidden}.crop-img[data-v-c861eb57]{object-fit:contain;transform-origin:50%;pointer-events:none;-webkit-user-select:none;user-select:none;width:100%;max-width:none;height:100%;display:block}.crop-box[data-v-c861eb57]{box-sizing:border-box;cursor:move;touch-action:none;background:#ffffff26;border:2px solid #ff7da8;position:absolute;box-shadow:0 0 0 999px #00000038}.crop-handle[data-v-c861eb57]{box-sizing:border-box;background:#fff;border:2px solid #ff7da8;border-radius:50%;width:18px;height:18px;position:absolute}.crop-handle.nw[data-v-c861eb57]{cursor:nwse-resize;top:-10px;left:-10px}.crop-handle.ne[data-v-c861eb57]{cursor:nesw-resize;top:-10px;right:-10px}.crop-handle.sw[data-v-c861eb57]{cursor:nesw-resize;bottom:-10px;left:-10px}.crop-handle.se[data-v-c861eb57]{cursor:nwse-resize;bottom:-10px;right:-10px}.empty[data-v-c861eb57]{color:#999;justify-content:center;align-items:center;height:100%;display:flex}.tip[data-v-c861eb57]{box-sizing:border-box;color:#777;background:#fff;border-radius:16px;width:100%;max-width:360px;margin:16px auto 0;padding:12px;font-size:13px}.confirm-btn[data-v-c861eb57]{color:#fff;cursor:pointer;background:#ff8fb3;border:none;border-radius:28px;width:100%;max-width:360px;margin-top:20px;padding:14px 0;font-size:16px}.confirm-btn[data-v-c861eb57]:disabled{color:#999;cursor:not-allowed;background:#ddd}[data-v-c861eb57] .cropper-container,[data-v-c861eb57] .cropper-wrap-box,[data-v-c861eb57] .cropper-canvas,[data-v-c861eb57] .cropper-drag-box,[data-v-c861eb57] .cropper-crop-box,[data-v-c861eb57] .cropper-face{touch-action:none!important}[data-v-c861eb57] .cropper-face{cursor:move}[data-v-c861eb57] .cropper-view-box{outline:1px solid #ff8fb3}[data-v-c861eb57] .cropper-point{width:12px;height:12px}.page[data-v-d04612b6]{box-sizing:border-box;text-align:center;background:#fff7fb;min-height:100vh;padding:20px}.top-bar[data-v-d04612b6]{justify-content:center;align-items:center;margin-bottom:16px;display:flex;position:relative}.back-btn[data-v-d04612b6]{color:#ff8fb3;cursor:pointer;background:0 0;border:none;font-size:16px;position:absolute;left:0}h1[data-v-d04612b6]{color:#333;margin:0;font-size:24px}.desc[data-v-d04612b6]{color:#777;margin-bottom:16px;font-size:14px}.preview-area[data-v-d04612b6]{box-sizing:border-box;-webkit-overflow-scrolling:touch;background:#fff;border:2px solid #ffd1df;border-radius:24px;width:min(92vw,360px);max-height:480px;margin:0 auto;padding:16px;overflow:auto}.pattern-canvas[data-v-d04612b6]{width:100%;height:auto;image-rendering:pixelated;background:#f5f5f5;border-radius:12px;display:block}.action-row[data-v-d04612b6]{grid-template-columns:repeat(2,1fr);gap:12px;width:100%;max-width:360px;margin:16px auto 0;display:grid}.action-btn[data-v-d04612b6]{color:#fff;cursor:pointer;background:#ff8fb3;border:none;border-radius:24px;padding:12px 8px;font-size:15px}.action-btn.secondary[data-v-d04612b6]{color:#ff7da8;background:#fff;border:1px solid #ffb6cc}.pattern-viewer[data-v-d04612b6]{z-index:30;box-sizing:border-box;background:#f7f7f7;flex-direction:column;display:flex;position:fixed;inset:0}.pattern-viewer-bar[data-v-d04612b6]{background:#fff;border-bottom:1px solid #eee;flex:none;justify-content:center;align-items:center;min-height:46px;padding:12px 16px;display:flex;position:relative}.pattern-viewer-bar h1[data-v-d04612b6]{color:#333;margin:0;font-size:24px;line-height:1.2}.pattern-viewer-back[data-v-d04612b6]{color:#777077;cursor:pointer;background:#fff;border:1px solid #eee7df;border-radius:12px;min-height:40px;padding:8px 12px;font-size:14px;font-weight:700;position:absolute;left:16px}.pattern-viewer-content[data-v-d04612b6]{-webkit-overflow-scrolling:touch;color:#666;flex:1;place-items:start center;min-height:0;padding:16px;display:grid;overflow:auto}.pattern-viewer-image[data-v-d04612b6]{background:#fff;max-width:100%;height:auto;display:block}.pattern-viewer-error[data-v-d04612b6]{color:#ff3b30}.pattern-viewer-tip[data-v-d04612b6]{color:#777;background:#fff;flex:none;margin:0;padding:10px 16px;font-size:13px}.control-card[data-v-d04612b6],.info-card[data-v-d04612b6],.stats-card[data-v-d04612b6]{box-sizing:border-box;background:#fff;border-radius:18px;width:100%;max-width:360px;margin:16px auto 0;padding:14px}.control-title[data-v-d04612b6]{color:#555;margin-bottom:12px;font-size:15px;font-weight:700}.slider-row[data-v-d04612b6]{color:#666;justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px;font-size:14px;display:flex}.slider-row strong[data-v-d04612b6]{color:#333;font-size:15px}.range-input[data-v-d04612b6]{accent-color:#ff8fb3;width:100%}.size-list[data-v-d04612b6]{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.mode-list[data-v-d04612b6]{grid-template-columns:repeat(2,1fr);gap:12px;display:grid}.size-btn[data-v-d04612b6],.mode-btn[data-v-d04612b6]{color:#666;cursor:pointer;background:#fff7fb;border:1px solid #ffd1df;border-radius:18px;padding:10px 0;font-size:14px}.size-btn.active[data-v-d04612b6],.mode-btn.active[data-v-d04612b6]{color:#fff;background:#ff8fb3;border-color:#ff8fb3}.info-card[data-v-d04612b6]{color:#666;font-size:14px;line-height:1.8}.stat-row[data-v-d04612b6]{border-bottom:1px solid #f2f2f2;grid-template-columns:28px 1fr auto;align-items:center;gap:8px;padding:8px 0;font-size:14px;display:grid}.stat-row[data-v-d04612b6]:last-child{border-bottom:none}.color-dot[data-v-d04612b6]{border:1px solid #ddd;border-radius:6px;width:20px;height:20px}.color-id[data-v-d04612b6]{text-align:left;color:#333;font-weight:700}.color-count[data-v-d04612b6]{color:#777}.restart-btn[data-v-d04612b6]{color:#fff;cursor:pointer;background:#ff8fb3;border:none;border-radius:28px;width:100%;max-width:360px;margin-top:20px;padding:14px 0;font-size:16px}.summary-desc[data-v-d04612b6]{color:#ff3b30;margin-top:16px}.page[data-v-07c509fb]{box-sizing:border-box;text-align:center;background:#fff7fb;min-height:100vh;padding:20px}.top-bar[data-v-07c509fb]{justify-content:center;align-items:center;margin-bottom:16px;display:flex;position:relative}.back-btn[data-v-07c509fb]{color:#ff8fb3;cursor:pointer;background:0 0;border:none;font-size:16px;position:absolute;left:0}h1[data-v-07c509fb]{color:#333;margin:0;font-size:24px}.summary-card[data-v-07c509fb],.stats-card[data-v-07c509fb]{box-sizing:border-box;background:#fff;border-radius:18px;width:100%;max-width:360px;margin:16px auto 0;padding:14px}.summary-card[data-v-07c509fb]{color:#666;font-size:14px;line-height:1.8}.control-title[data-v-07c509fb]{color:#555;margin-bottom:12px;font-size:15px;font-weight:700}.stat-row[data-v-07c509fb]{border-bottom:1px solid #f2f2f2;grid-template-columns:28px 1fr auto;align-items:center;gap:8px;padding:8px 0;font-size:14px;display:grid}.stat-row[data-v-07c509fb]:last-child{border-bottom:none}.color-dot[data-v-07c509fb]{border:1px solid #ddd;border-radius:6px;width:20px;height:20px}.color-id[data-v-07c509fb]{text-align:left;color:#333;font-weight:700}.color-count[data-v-07c509fb]{color:#777}
