:root{--paper:#fafaf8;--stage:#f0f0ed;--ink:#343438;--muted:#696971;--line:#dededa;--accent:#544b60;--accent-hover:#423a4c;--selected:#eeecf0;--control-border:#d5d5d1;--selection-border:#82768f;--error:#934557;--shadow:#34343826;--radius:3px;--thread-a:#a494c5;--thread-b:#91abc3;--thread-c:#e3d5aa;--ease:cubic-bezier(.22,.68,.22,1)}
*{box-sizing:border-box}[hidden]{display:none!important}html{scroll-behavior:smooth;scroll-padding-top:24px}body{font-variant-numeric:tabular-nums;line-break:strict;margin:0;background:var(--paper);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei",sans-serif;font-size:14px;line-height:1.6;-webkit-font-smoothing:antialiased}button,a,input{ -webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button{border:0;background:none;padding:0}a{color:inherit;text-decoration:none}button:disabled{cursor:default;opacity:.35}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:5px}button:active:not(:disabled){transform:scale(.98)}::selection{background:#ddd8e3;color:var(--ink)}.icon-defs{position:absolute;width:0;height:0;overflow:hidden}.icon{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.site-header{height:82px;margin:0 48px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:32px}.brand{display:flex;gap:11px;align-items:center}.brand>svg{width:42px;height:35px;fill:none;stroke:var(--accent);stroke-width:1.5;stroke-linecap:round}.brand>span{font-family:Georgia,serif;font-size:46px;letter-spacing:-3px;line-height:1}.brand-dot{color:var(--accent)}a:hover{color:var(--accent)}.brand small{font-size:13px;letter-spacing:2px;color:var(--muted);margin:15px 0 0 8px}.site-header nav{display:flex;gap:40px;margin:0 36px 0 0;align-items:center;height:100%}.site-header nav a,.site-header nav button{position:relative;font-size:14px;transition:color .2s}.site-header nav a:hover,.site-header nav button:hover{color:var(--accent)}.site-header nav .active:after{content:"";width:4px;height:4px;border-radius:50%;background:var(--accent);position:absolute;left:calc(50% - 2px);bottom:-12px}.bag-trigger{display:flex;align-items:center;gap:10px}.bag-trigger .icon{width:21px;height:23px}#bag-count{font-size:13px;border:1px solid var(--control-border);border-radius:50%;min-width:22px;height:22px;line-height:20px;text-align:center;transition:transform .2s}#bag-count.bump{animation:bump .35s var(--ease)}
main{max-width:1536px;margin:auto;padding:0 48px}.breadcrumb{display:flex;gap:14px;align-items:center;color:var(--muted);font-size:13px;height:54px}.breadcrumb-divider{color:var(--control-border)}.breadcrumb>span:nth-child(3){color:var(--ink)}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 390px;gap:58px;align-items:start}.preview{background:var(--stage);position:relative;min-width:0;aspect-ratio:1.3;isolation:isolate;overflow:hidden}.bracelet-stage{position:absolute;inset:3% 0 7%;display:flex;align-items:center;justify-content:center}.bracelet-svg{width:100%;height:100%;overflow:visible;transform:scale(var(--zoom,1));transition:transform .35s var(--ease)}.entry .bracelet-stage{animation:arrive .5s var(--ease) backwards}.entry .config{animation:arrive .5s .07s var(--ease) backwards}.strand-main,.cord-stop{transition:stroke .5s var(--ease),stop-color .5s var(--ease)}.preview-caption{position:absolute;left:30px;right:30px;bottom:97px;display:flex;justify-content:space-between;align-items:center;color:var(--ink);font-size:13px}.preview-caption>span:first-child{font-family:"Songti SC",STSong,serif;font-size:18px;letter-spacing:1px}.preview-tools{position:absolute;left:30px;right:30px;bottom:52px;display:flex;align-items:center;justify-content:space-between}.preview-tools>button{display:flex;align-items:center;gap:9px;font-size:13px;min-height:32px}.preview-tools>button:hover{color:var(--accent)}.preview-tools .icon{width:17px;height:17px}.zoom-tools{display:flex;align-items:center;gap:14px;font-size:13px;font-variant-numeric:tabular-nums;color:var(--muted)}.zoom-tools button{width:27px;height:28px;display:grid;place-items:center;border:1px solid var(--control-border);border-radius:50%;transition:background .2s}.zoom-tools button:hover{background:var(--selected)}.material-tag{position:absolute;bottom:19px;left:30px;display:flex;gap:9px;align-items:center;font-size:13px;color:var(--muted)}.config{min-width:0}.product-title-row{display:flex;justify-content:space-between;align-items:center;gap:10px}h1{font-family:"Songti SC",STSong,serif;font-size:28px;font-weight:500;margin:0;line-height:1.4;letter-spacing:0}.price{font-family:Georgia,serif;font-size:24px;letter-spacing:-.5px;font-variant-numeric:tabular-nums;white-space:nowrap}.product-heading{padding-bottom:20px}fieldset{border:0;margin:0;padding:17px 0 15px;border-top:1px solid var(--line);min-width:0}legend{padding:0;float:left;width:100%;display:flex;gap:11px;align-items:center;font-size:14px;margin-bottom:12px;font-weight:500}legend+*{clear:both}.step-number{font-family:Georgia,serif;color:var(--muted);font-size:14px;font-style:italic;font-weight:400}.legend-note{margin-left:auto;font-size:13px;font-weight:400;color:var(--muted)}.thread-slots{display:flex;gap:8px;margin:1px 0 16px}.thread-slot{height:42px;border:1px solid var(--control-border);border-radius:var(--radius);flex:1;display:flex;align-items:center;justify-content:center;gap:9px;position:relative;transition:background .2s,border-color .2s}.thread-slot.active{border-color:var(--selection-border);background:var(--selected)}.thread-slot:hover{background:var(--selected)}.thread-slot .mini-thread{width:32px;height:11px;border-radius:20px;background:repeating-linear-gradient(135deg,transparent 0 2px,#ffffff45 2px 3px,transparent 3px 5px),var(--swatch);box-shadow:inset 0 -2px 2px var(--shadow);transform:rotate(-12deg)}.thread-slot span:last-child{font-size:13px}.swatch-row{display:flex;justify-content:space-between;gap:8px}.swatch{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;position:relative}.swatch:before{content:"";display:block;width:24px;height:24px;border-radius:50%;background:repeating-linear-gradient(120deg,transparent 0 2px,#ffffff36 2px 3px,transparent 3px 5px),var(--swatch);box-shadow:inset 0 -2px 3px #3434381f}.swatch[aria-pressed=true]{outline:1px solid var(--accent);outline-offset:2px}.swatch:hover{transform:translateY(-2px)}.swatch[aria-pressed=true]:after{content:"";position:absolute;width:4px;height:4px;border-radius:50%;background:#fff;box-shadow:0 0 0 1px #544b6066}.color-picker-caption{display:flex;font-size:13px;color:var(--muted);margin-top:9px}.option-grid{display:grid;gap:8px}.weave-grid{grid-template-columns:repeat(3,1fr)}.weave-choice{border:1px solid var(--line);border-radius:var(--radius);display:flex;flex-direction:column;align-items:center;gap:5px;padding:9px 8px 7px;transition:border-color .2s,background .2s}.weave-choice svg{width:82px;height:18px;overflow:visible}.weave-choice span{font-size:13px}.option-grid button.selected{border-color:var(--selection-border);background:var(--selected)}.option-grid button:hover{border-color:var(--selection-border)}.bead-grid{grid-template-columns:repeat(4,1fr)}.bead-choice{border:1px solid var(--line);border-radius:var(--radius);padding:9px 3px 6px;display:flex;flex-direction:column;gap:2px;align-items:center;transition:background .2s,border-color .2s}.bead-choice svg{width:28px;height:23px}.bead-choice span{font-size:13px;white-space:nowrap}.bead-choice small{font-size:13px;color:var(--muted);line-height:1.3}.text-button{margin-left:auto;font-size:13px;font-weight:400;color:var(--accent);text-decoration:underline;text-underline-offset:4px;min-height:24px}.size-options{display:flex;gap:7px}.size-choice{border:1px solid var(--line);border-radius:var(--radius);padding:7px 0;flex:1;font-size:13px;font-variant-numeric:tabular-nums;transition:background .2s,border-color .2s}.size-choice.selected{background:var(--selected);border-color:var(--selection-border)}.size-choice:hover{border-color:var(--selection-border)}.size-choice small{font-size:13px;color:var(--muted);margin-left:2px}.size-hint{margin:9px 0 0;font-size:13px;color:var(--muted)}.size-section{padding-bottom:17px}.primary-button{background:var(--accent);color:#fff;min-height:49px;border-radius:var(--radius);width:100%;display:flex;align-items:center;justify-content:center;gap:10px;padding:10px 16px;transition:background .2s,transform .14s var(--ease)}.primary-button:hover{background:var(--accent-hover)}.primary-button .arrow{margin-left:auto}.primary-button span{margin-right:auto}.delivery{margin:12px 0 0;text-align:center;color:var(--muted);font-size:13px}.error{color:var(--error);font-size:13px;margin:10px 0 0}.inspiration{margin-top:47px;padding:33px 0 38px;border-top:1px solid var(--line);scroll-margin-top:20px}.section-heading{display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin-bottom:25px}.section-heading h2{font-family:"Songti SC",STSong,serif;font-weight:500;font-size:24px;letter-spacing:.5px;margin:0}.palettes{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.palette{display:flex;align-items:center;text-align:left;gap:20px;border:0;padding:11px 0 21px;transition:color .2s}.palette:hover{color:var(--accent)}.palette-art{width:92px;height:64px;flex-shrink:0}.palette-art svg{width:100%;height:100%;overflow:visible}.palette strong{font-family:"Songti SC",STSong,serif;font-weight:500;font-size:18px;display:block;margin-bottom:2px}.palette small{font-size:13px;color:var(--muted)}.palette>.icon{margin-left:auto;width:18px}.text-link{display:flex;gap:14px;align-items:center;font-size:13px;border-bottom:1px solid var(--control-border);padding-bottom:7px}.text-link .icon{width:17px}footer{margin:0 48px;display:flex;align-items:center;gap:32px;border-top:1px solid var(--line);padding:24px 0 28px;color:var(--muted);font-size:13px}footer>.text-link{margin-left:auto;font-size:13px}footer>span{font-size:13px}.footer-brand{font-family:Georgia,serif;font-size:24px;letter-spacing:-1px;color:var(--ink)}
dialog{color:var(--ink);border:1px solid var(--line);padding:0;background:var(--paper);max-height:calc(100dvh - 48px);border-radius:6px;box-shadow:0 2px 8px #34343812,0 16px 64px var(--shadow)}dialog::backdrop{background:#34343845;backdrop-filter:blur(3px)}dialog[open]{display:flex;flex-direction:column;animation:dialog-in .3s var(--ease)}.info-dialog{width:min(500px,calc(100% - 36px))}.dialog-header{display:flex;justify-content:space-between;align-items:center;padding:24px 28px 20px;border-bottom:1px solid var(--line);gap:16px;flex-shrink:0}.dialog-header h2{font-family:"Songti SC",STSong,serif;font-size:24px;font-weight:500;line-height:1.4;margin:0}.dialog-header h2 span{font-family:Georgia,serif;font-size:20px;color:var(--muted);margin-left:8px}.close-button{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;transition:background .2s}.close-button:hover{background:var(--stage)}.dialog-body{padding:25px 28px;overflow-y:auto;min-height:0}.dialog-body p{font-size:14px;line-height:1.9;color:var(--muted);margin:0 0 18px}.dialog-body h3{font-size:14px;font-weight:500;margin:24px 0 8px}.measure-graphic{width:100%;height:130px;margin-bottom:20px;background:var(--stage);border-radius:3px}.measure-graphic path{fill:none;stroke:var(--accent);stroke-linecap:round;stroke-width:2}.bag-dialog{width:min(580px,calc(100% - 36px))}.dialog-footer{padding:20px 28px 25px;border-top:1px solid var(--line);flex-shrink:0}.bag-total{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.bag-total>span{font-family:Georgia,serif;font-size:24px}.bag-item{display:grid;grid-template-columns:116px 1fr;gap:20px;padding:0 0 25px;margin:0 0 25px;border-bottom:1px solid var(--line)}.bag-item:last-child{margin-bottom:0;border-bottom:0;padding-bottom:0}.bag-thumb{height:120px;background:var(--stage)}.bag-thumb svg{width:100%;height:100%}.bag-item h3{margin:0 0 7px;font-family:"Songti SC",STSong,serif;font-size:18px}.bag-item p{font-size:13px;line-height:1.8;margin-bottom:6px}.bag-item-bottom{display:flex;justify-content:space-between;align-items:center}.bag-item-bottom>span{font-family:Georgia,serif;font-size:21px}.remove-item{font-size:13px;color:var(--muted);text-decoration:underline;text-underline-offset:3px;min-height:28px}.empty-bag{padding:15px 0 25px;text-align:center}.empty-bag>.icon{width:48px;height:48px;stroke:var(--control-border);margin-bottom:15px}.empty-bag h3{font-size:18px;font-family:"Songti SC",STSong,serif}.empty-bag p{font-size:13px}.toast{position:fixed;bottom:28px;left:50%;transform:translate(-50%,10px);background:var(--accent);color:white;font-size:13px;border-radius:3px;padding:10px 19px;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:20;white-space:nowrap}.toast.visible{opacity:1;transform:translate(-50%,0)}.mobile-purchase{display:none}.compact-preview{display:none}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes arrive{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}@keyframes bump{50%{transform:scale(1.2)}}@keyframes dialog-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1537px){.site-header,footer{max-width:1440px;margin:auto}.preview{aspect-ratio:1.15}}@media(max-width:1190px){.site-header{margin:0 32px}.brand small{display:none}main{padding:0 32px}.workspace{grid-template-columns:minmax(0,1fr) 350px;gap:32px}.preview{aspect-ratio:.86}.palette{gap:12px}.palette-art{width:70px}footer{margin:0 32px}.site-header nav{gap:28px}}
@media(max-width:800px){.site-header{height:76px;margin:0 24px}.site-header nav{gap:20px;margin:0}.brand>span{font-size:38px}.brand>svg{width:32px}.bag-label{display:none}.site-header nav button{display:none}main{padding:0 24px}.workspace{gap:28px;grid-template-columns:minmax(0,1fr) 315px}.preview{aspect-ratio:.67}.preview-caption,.preview-tools{left:20px;right:20px}.material-tag{left:20px}.palettes{gap:20px}.palette-art{width:50px}.palette{gap:10px}.palette strong{font-size:16px}.palette small{font-size:13px}.text-link{font-size:13px}footer{margin:0 24px}}
@media(max-width:650px){html{scroll-padding-top:78px;scroll-padding-bottom:105px}.config button{scroll-margin-top:78px;scroll-margin-bottom:105px}.compact-preview{position:fixed;display:block;top:0;left:0;right:0;z-index:5;background:var(--paper);border-bottom:1px solid var(--line);transform:translateY(-105%);visibility:hidden;transition:transform .25s var(--ease),visibility .25s}.compact-preview.visible{transform:translateY(0);visibility:visible}.compact-preview>button{display:flex;align-items:center;gap:12px;padding:7px 20px;width:100%;text-align:left;min-height:61px}.compact-thumb{width:62px;height:47px;flex-shrink:0}.compact-preview strong{font-size:13px;display:block;font-weight:500}.compact-preview small{font-size:13px;color:var(--muted);display:block;margin-top:2px}.compact-return{font-size:13px;color:var(--accent);margin-left:auto}.site-header{height:68px;margin:0 20px;gap:15px}.brand{gap:6px}.brand>svg{width:30px;height:27px}.brand>span{font-size:38px}.brand small{display:none}.site-header nav{gap:0;flex:1;justify-content:center}.site-header nav a{font-size:13px}.site-header nav a:nth-child(2){display:none}.bag-trigger{gap:6px}#bag-count{min-width:20px;height:20px;line-height:18px;font-size:13px}.bag-trigger .icon{width:20px}main{padding:0 20px}.breadcrumb{height:47px;font-size:13px;gap:10px}.workspace{grid-template-columns:1fr;gap:22px}.preview{aspect-ratio:1.19}.bracelet-stage{inset:-5% -2% 20%}.preview-caption{left:18px;right:18px;bottom:73px}.preview-caption>span:first-child{font-size:18px}.preview-tools{left:18px;right:18px;bottom:30px}.preview-tools>button{font-size:13px}.zoom-tools{gap:10px;font-size:13px}.zoom-tools button{width:32px;height:32px}.material-tag{left:18px;bottom:7px;font-size:13px;gap:6px}.config{animation:none}h1{font-size:28px}.product-heading{padding-bottom:20px}.price{font-size:24px}legend{font-size:14px;margin-bottom:15px}.legend-note{font-size:13px}.thread-slot{height:46px}.thread-slot span:last-child{font-size:13px}.thread-slots{margin-bottom:12px}.swatch{width:36px;height:44px}.swatch:before{width:26px;height:26px}.swatch[aria-pressed=true]{outline:0}.swatch[aria-pressed=true]:before{outline:1px solid var(--accent);outline-offset:4px}.swatch-row{gap:5px}.color-picker-caption{font-size:13px}.weave-choice{min-height:72px;padding:13px 5px 10px}.weave-choice span,.bead-choice span{font-size:13px}.bead-choice{min-height:76px}.bead-choice small{font-size:13px}.size-choice{min-height:43px;font-size:13px}.size-hint{font-size:13px}.text-button{font-size:13px;min-height:30px}.purchase>.primary-button{display:none}.delivery{font-size:13px;margin-top:4px}.inspiration{margin-top:38px;padding:31px 0}.section-heading{display:block;margin-bottom:20px}.section-heading h2{font-size:24px}.palettes{grid-template-columns:1fr;gap:0}.palette{gap:18px;padding:15px 0}.palette-art{width:82px;height:48px}.palette strong{font-size:18px}.palette small{font-size:13px}.palette+.palette{border-top:1px solid var(--line)}.text-link{font-size:13px}.mobile-purchase{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:4;align-items:center;gap:18px;background:var(--paper);border-top:1px solid var(--line);padding:13px 20px calc(13px + env(safe-area-inset-bottom))}.mobile-purchase>div{display:flex;flex-direction:column;min-width:120px;gap:2px}.mobile-product{font-size:13px;color:var(--muted)}.mobile-purchase .price{font-size:24px;line-height:1.2}.mobile-purchase .primary-button{min-height:48px;font-size:14px;gap:15px}.toast{bottom:99px;font-size:13px}footer{margin:0 20px;padding:23px 0 115px;gap:18px;flex-wrap:wrap;font-size:13px}footer>.text-link{margin-left:auto;font-size:13px}footer>span{width:100%;order:3}.dialog-header{padding:22px 20px 18px}.dialog-body{padding:22px 20px}.dialog-footer{padding:18px 20px 22px}.dialog-header h2{font-size:24px}.bag-item{grid-template-columns:90px 1fr;gap:15px}.bag-thumb{height:100px}.bag-item p{font-size:13px}.bag-item h3{font-size:18px}.bag-dialog{max-height:calc(100dvh - 32px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}