:root{color:var(--text-body);background-color:var(--app-bg-color);background-image:var(--app-bg-image);background-size:cover;background-position:center;background-attachment:fixed;background-repeat:no-repeat;background-blend-mode:var(--app-bg-blend);--font-rounded: "Arial Rounded MT Bold", "Avenir Next Rounded", "Nunito", "Yuanti SC", "STYuanti", "Hiragino Maru Gothic ProN", "PingFang SC", "Microsoft YaHei", sans-serif;font-family:var(--font-rounded);font-synthesis:none;text-rendering:geometricPrecision;-webkit-font-smoothing:antialiased;--app-bg-color: #9ac4ff;--app-bg-image: url("data:image/svg+xml,%3csvg%20width='1920'%20height='1081'%20viewBox='0%200%201920%201081'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3crect%20width='1920'%20height='1081'%20fill='url(%23paint0_linear_4483_788)'/%3e%3cdefs%3e%3clinearGradient%20id='paint0_linear_4483_788'%20x1='960'%20y1='0'%20x2='960'%20y2='1081'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%239AC4FF'/%3e%3cstop%20offset='0.692308'%20stop-color='%23E7F1FF'/%3e%3cstop%20offset='0.961538'%20stop-color='%23FFF3E7'/%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e");--app-bg-blend: normal;--text-strong: #000000;--text-body: #000000;--text-soft: rgba(0, 0, 0, .52);--text-muted: rgba(0, 0, 0, .46);--icon-ink: #000000;--pattern-download-icon-filter: none;--pattern-download-panel-blur: blur(36px) saturate(1.08);--header-title: #000000;--header-subtitle: #000000;--control-label: #000000;--card-title: rgba(0, 0, 0, .5);--decor-text: #000000;--preview-border: rgba(255, 255, 255, .82);--preview-dash: rgba(255, 255, 255, .36);--preview-surface: var(--glass-surface);--section-divider: var(--glass-surface);--range-fill: rgba(92, 103, 113, .62);--range-rest: rgba(255, 255, 255, .42);--range-thumb: #687076;--range-thumb-border: #ffffff;--style-surface: rgba(0, 0, 0, .06);--option-surface: rgba(0, 0, 0, .1);--option-selected: rgba(0, 0, 0, .4);--selected-ink: #ffffff;--paper: rgba(0, 0, 0, .06);--paper-strong: rgba(0, 0, 0, .06);--line: rgba(255, 255, 255, .68);--muted: #000000;--shadow: 0 18px 60px rgba(30, 85, 128, .12);--glass-surface: rgba(0, 0, 0, .06);--glass-surface-strong: rgba(0, 0, 0, .06);--glass-surface-hover: rgba(0, 0, 0, .1);--glass-border: rgba(255, 255, 255, .82);--glass-shadow: none;--glass-shadow-soft: none;--glass-blur: blur(16px) saturate(1.12);--crop-dialog-surface: rgba(255, 255, 255, .6);--crop-dialog-ink: #000000;--crop-dialog-blur: blur(28px) saturate(1.18);--crop-overlay-blur: blur(18px);--chip-surface: rgba(0, 0, 0, .1);--chip-surface-hover: rgba(0, 0, 0, .14);--chip-surface-muted: rgba(0, 0, 0, .08);--chip-border: #ffffff;--chip-ink: #000000;--pink: #ffdfe1;--pink-line: #ff8f98;--blue: #e3f2ff;--blue-line: #88c6ff;--mint: #dff8ef;--ink: #000000}:root[data-theme=night]{color:#fff;background:#061a2d;--app-bg-color: #061a2d;--app-bg-image: url(/assets/dark-DnSFgPY1.svg);--app-bg-blend: normal;--text-strong: #ffffff;--text-body: #ffffff;--text-soft: rgba(255, 255, 255, .64);--text-muted: rgba(255, 255, 255, .54);--icon-ink: #ffffff;--pattern-download-icon-filter: brightness(0) invert(1);--header-title: #ffffff;--header-subtitle: #ffffff;--control-label: #ffffff;--card-title: rgba(255, 255, 255, .58);--decor-text: #ffffff;--preview-border: rgba(255, 255, 255, .42);--preview-dash: rgba(255, 255, 255, .24);--preview-surface: var(--glass-surface);--section-divider: var(--glass-surface);--range-fill: rgba(210, 230, 244, .78);--range-rest: rgba(255, 255, 255, .28);--range-thumb: #e1eff9;--range-thumb-border: #ffffff;--style-surface: rgba(255, 255, 255, .08);--option-surface: rgba(255, 255, 255, .2);--option-selected: rgba(255, 255, 255, .8);--selected-ink: #000000;--paper: rgba(255, 255, 255, .08);--paper-strong: rgba(255, 255, 255, .08);--line: rgba(255, 255, 255, .34);--muted: #ffffff;--shadow: 0 20px 64px rgba(0, 0, 0, .3);--glass-surface: rgba(255, 255, 255, .08);--glass-surface-strong: rgba(255, 255, 255, .08);--glass-surface-hover: rgba(255, 255, 255, .2);--glass-border: rgba(255, 255, 255, .42);--glass-shadow: none;--glass-shadow-soft: none;--crop-dialog-ink: #000000;--chip-surface: rgba(255, 255, 255, .2);--chip-surface-hover: rgba(255, 255, 255, .28);--chip-surface-muted: rgba(255, 255, 255, .12);--chip-border: rgba(255, 255, 255, .88);--chip-ink: #ffffff;--blue: rgba(95, 150, 205, .42);--mint: rgba(105, 215, 185, .26);--ink: #ffffff}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;min-width:320px;min-height:100vh;overflow-x:hidden;background-image:var(--app-bg-image);background-color:var(--app-bg-color);background-size:cover;background-position:center;background-attachment:fixed;background-repeat:no-repeat;background-blend-mode:var(--app-bg-blend);color:var(--text-body)}button,input{font:inherit;font-family:var(--font-rounded)}button{appearance:none;-webkit-appearance:none;border:0;background:transparent;color:inherit;outline:0;touch-action:manipulation}button::-moz-focus-inner{border:0;padding:0}.app-shell{min-height:100vh;padding:48px 28px 42px}.utility-actions{--utility-label-size: 13px;--utility-label-weight: 800;position:fixed;top:18px;right:22px;z-index:40;display:inline-flex;align-items:center;gap:10px}.utility-button{min-height:38px;padding:0 13px;border:0;border-radius:999px;background:var(--glass-surface-strong);color:var(--text-strong);box-shadow:none;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);display:inline-flex;align-items:center;justify-content:center;gap:7px;cursor:pointer;font-size:var(--utility-label-size);font-weight:var(--utility-label-weight)}.utility-button:hover{background:var(--glass-surface-hover)}.audio-menu{position:relative;display:inline-flex;align-items:center}.audio-panel{position:absolute;top:calc(100% + 12px);left:0;z-index:45;width:220px;padding:18px 20px;border-radius:8px;background:var(--glass-surface-strong);color:var(--text-strong);box-shadow:none;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);display:grid;gap:18px}.audio-slider{display:grid;grid-template-columns:max-content 132px;align-items:center;gap:8px;font-size:var(--utility-label-size);font-weight:var(--utility-label-weight);line-height:1}.audio-slider input[type=range]{--range-progress: var(--audio-progress);width:100%;min-width:0;height:24px;margin:0;border:0;background:transparent;cursor:pointer;accent-color:var(--range-thumb);touch-action:pan-y;-webkit-appearance:none;appearance:none}.audio-slider input[type=range]::-webkit-slider-runnable-track{height:8px;border-radius:999px;background:linear-gradient(90deg,var(--range-fill) 0 var(--range-progress),var(--range-rest) var(--range-progress) 100%)}.audio-slider input[type=range]::-webkit-slider-thumb{width:18px;height:18px;margin-top:-5px;border:3px solid var(--range-thumb-border);border-radius:50%;background:var(--range-thumb);box-shadow:0 1px 4px #40382f2e;-webkit-appearance:none;appearance:none}.audio-slider input[type=range]::-moz-range-track{height:8px;border-radius:999px;background:linear-gradient(90deg,var(--range-fill) 0 var(--range-progress),var(--range-rest) var(--range-progress) 100%)}.audio-slider input[type=range]::-moz-range-thumb{width:18px;height:18px;border:3px solid var(--range-thumb-border);border-radius:50%;background:var(--range-thumb);box-shadow:0 1px 4px #40382f2e}.app-header{display:flex;justify-content:center;align-items:center;margin-bottom:42px}.app-title-image{display:block;width:min(440px,78vw);height:auto}.workspace{display:grid;grid-template-columns:minmax(330px,500px) minmax(360px,470px);gap:56px;align-items:start;justify-content:center;width:min(1100px,100%);margin:0 auto}.preview-pane{position:sticky;top:24px;align-self:start}.preview-card{width:100%;aspect-ratio:.86;min-height:460px;padding:24px;border:0;border-radius:20px;background:var(--glass-surface);position:relative}.preview-card:before{content:"";display:none;position:absolute;inset:-3px;border-radius:22px;pointer-events:none;opacity:.44;background:linear-gradient(90deg,transparent 0 12px,var(--preview-dash) 12px 15px,transparent 15px 27px) top left / 27px 2px repeat-x,linear-gradient(90deg,transparent 0 12px,var(--preview-dash) 12px 15px,transparent 15px 27px) bottom left / 27px 2px repeat-x,linear-gradient(0deg,transparent 0 12px,var(--preview-dash) 12px 15px,transparent 15px 27px) top left / 2px 27px repeat-y,linear-gradient(0deg,transparent 0 12px,var(--preview-dash) 12px 15px,transparent 15px 27px) top right / 2px 27px repeat-y}.confetti-burst{position:absolute;left:50%;top:50%;z-index:24;width:1px;height:1px;pointer-events:none}.confetti-burst span{position:absolute;left:0;top:0;width:8px;height:13px;border-radius:3px;background:var(--confetti);box-shadow:0 0 0 1px #ffffff61 inset;opacity:0;transform:translate(-50%,-50%) scale(.2) rotate(0);animation:confetti-pop .76s cubic-bezier(.14,.82,.3,1) var(--confetti-delay) both}@keyframes confetti-pop{0%{opacity:0;transform:translate(-50%,-50%) scale(.2) rotate(0)}18%{opacity:1}to{opacity:0;transform:translate(calc(-50% + var(--confetti-x)),calc(-50% + var(--confetti-y))) scale(1) rotate(var(--confetti-rotate))}}.board-history-actions{position:absolute;top:16px;left:16px;z-index:12;display:inline-flex;gap:8px}.history-button{width:36px;height:36px;border:0;border-radius:50%;background:var(--glass-surface);color:var(--text-body);display:grid;place-items:center;cursor:pointer}.history-button:hover{background:var(--glass-surface-hover)}.history-button:disabled{opacity:.38;cursor:not-allowed}.history-button:disabled:hover{background:var(--glass-surface)}.board-close{position:absolute;top:16px;right:16px;z-index:12;width:36px;height:36px;border:0;border-radius:50%;background:var(--glass-surface);color:var(--text-body);display:grid;place-items:center;cursor:pointer}.board-close:hover{background:var(--glass-surface-hover)}.board-switch-controls{position:absolute;inset:0;z-index:13;pointer-events:none}.preview-card.has-pattern-download-menu .board-switch-controls{opacity:0;visibility:hidden;pointer-events:none}.board-switch-button{position:absolute;top:50%;width:38px;height:38px;padding:0;border:0;border-radius:50%;background:var(--glass-surface);color:var(--text-body);display:grid;place-items:center;cursor:pointer;pointer-events:auto;transform:translateY(-50%)}.board-switch-button.prev{left:12px}.board-switch-button.next{right:12px}.board-switch-button:hover{background:var(--glass-surface-hover)}.board-switch-button:disabled{opacity:.34;cursor:not-allowed}.board-switch-button:disabled:hover{background:var(--glass-surface)}.page-control{position:absolute;left:50%;bottom:16px;z-index:12;transform:translate(-50%);min-height:24px;padding:6px 9px;border:0;border-radius:999px;background:var(--glass-surface);display:inline-flex;align-items:center;justify-content:center;gap:8px}.page-dot{width:9px;height:9px;padding:0;border:0;border-radius:999px;background:var(--chip-surface);cursor:pointer;transform:scale(1);transform-origin:center;transition:width .36s cubic-bezier(.2,.88,.2,1),background-color .3s ease,opacity .3s ease,transform .36s cubic-bezier(.2,.88,.2,1);will-change:width,transform,opacity}.page-dot.active{width:24px;background:var(--option-selected);transform:scaleX(1.04)}.rosette-stage{--artwork-offset-y: -7%;--artwork-offset-px: -4px;--artwork-scale: .92;position:relative;width:100%;height:100%;display:grid;place-items:center;container-type:size;-webkit-user-select:none;user-select:none;touch-action:pan-y}.rosette-stage.is-drawing{cursor:crosshair;touch-action:none}.rosette-stage.has-decor-brush{cursor:none}.board-motion-layer{position:absolute;inset:0;z-index:2;display:grid;place-items:center}@keyframes board-slide-next{0%{translate:22px 0;scale:.995}to{translate:0 0;scale:1}}@keyframes board-slide-prev{0%{translate:-22px 0;scale:.995}to{translate:0 0;scale:1}}.badge-artwork{position:relative;z-index:2;width:min(78%,380px);width:min(78cqw,47cqh,380px);aspect-ratio:.58;transform:translateY(calc(var(--artwork-offset-y) + var(--artwork-offset-px))) scale(var(--artwork-scale));transform-origin:50% 50%}.rosette-stage.board-motion-next .board-motion-layer{animation:board-slide-next .42s cubic-bezier(.16,1,.3,1) both;will-change:translate,scale}.rosette-stage.board-motion-prev .board-motion-layer{animation:board-slide-prev .42s cubic-bezier(.16,1,.3,1) both;will-change:translate,scale}.rosette-stack{position:absolute;left:50%;top:34%;width:100%;aspect-ratio:1;display:grid;place-items:center;z-index:3;margin-top:0;transform:translate(-50%,-50%);transform-origin:50% 50%}.ribbon-fan{position:absolute;z-index:1;inset:0;pointer-events:none}.preview-ribbon{position:absolute;top:46%;width:19%;height:46%;min-width:0;transform-origin:50% 0%;opacity:.92}.petal-ring{position:absolute;inset:0;margin:auto;border-radius:50%;transform-origin:50% 50%;pointer-events:none}.petal{position:absolute;left:50%;top:50%;width:26%;height:38%;transform:translate(-50%,-102%) rotate(var(--angle)) translateY(-31%);transform-origin:50% 100%}.material-piece-svg{width:100%;height:100%;display:block;overflow:visible}.material-pattern-layer{opacity:.46;pointer-events:none}.pattern-solid{background:var(--piece-color)}.pattern-stripe{background:repeating-linear-gradient(90deg,transparent 0 9px,rgba(255,255,255,.46) 9px 15px),var(--piece-color)}.pattern-dots{background:radial-gradient(circle,rgba(255,255,255,.68) 0 3px,transparent 3.4px) 0 0 / 15px 15px,var(--piece-color)}.pattern-lace{background:radial-gradient(circle at 50% 10%,rgba(255,255,255,.8) 0 8px,transparent 8.5px) 0 0 / 22px 18px repeat-x,repeating-radial-gradient(circle at 50% 100%,rgba(255,255,255,.28) 0 2px,transparent 2px 6px),var(--piece-color);border:1px dashed rgba(255,255,255,.8)}.pattern-gingham{background:linear-gradient(90deg,rgba(255,255,255,.36) 50%,transparent 50%) 0 0 / 20px 20px,linear-gradient(0deg,rgba(255,255,255,.32) 50%,transparent 50%) 0 0 / 20px 20px,var(--piece-color)}.center-medallion{position:relative;z-index:5;width:45.6%;aspect-ratio:1;overflow:visible}.center-material-svg{width:100%;height:100%;display:block;overflow:visible}.checker{display:block;width:100%;height:100%;background:linear-gradient(45deg,#eeeeee 25%,transparent 25% 75%,#eeeeee 75%),linear-gradient(45deg,#eeeeee 25%,transparent 25% 75%,#eeeeee 75%);background-color:#fff;background-position:0 0,10px 10px;background-size:20px 20px}.decoration{position:absolute;z-index:9;width:var(--decor-size);height:var(--decor-size);border:0;padding:0;display:grid;place-items:center;color:var(--decor-color);background:transparent;transform:translate(-50%,-50%) rotate(var(--decor-rotation));cursor:grab;outline:0;touch-action:none;will-change:left,top,transform}.decoration:active{cursor:grabbing}.decoration.active{filter:none}.decor-image{border-radius:0;background:transparent;overflow:visible}.decor-image.active{filter:none}.decor-draw{width:100%;height:100%;display:block;place-items:normal;transform:translate(0) rotate(var(--decor-rotation));transform-origin:0 0;pointer-events:none}.decoration img{width:100%;height:100%;object-fit:contain;border-radius:0;background:transparent;box-shadow:none;display:block;pointer-events:none}.decor-brush-preview{position:absolute;z-index:12;display:grid;place-items:center;pointer-events:none;transform:translate(-50%,-50%) rotate(var(--preview-rotation));transform-origin:center;will-change:left,top,transform}.decor-brush-preview img{width:100%;height:100%;object-fit:contain;display:block}.decoration-selection{position:absolute;inset:-7px;border:2px solid #1894ff;pointer-events:none}.selection-handle{position:absolute;width:8px;height:8px;background:#fff;border:2px solid #1894ff;box-sizing:border-box;pointer-events:auto;cursor:nwse-resize;touch-action:none}.decoration-delete{position:absolute;left:-18px;top:-18px;z-index:2;width:18px;height:18px;padding:0;border:2px solid #1894ff;border-radius:50%;background:#fff;color:#1894ff;display:grid;place-items:center;pointer-events:auto;cursor:pointer;touch-action:none}.decoration-delete svg{display:block;width:11px;height:11px}.handle-ne,.handle-sw{cursor:nesw-resize}.handle-nw{left:-5px;top:-5px}.handle-ne{right:-5px;top:-5px}.handle-se{right:-5px;bottom:-5px}.handle-sw{left:-5px;bottom:-5px}.rotation-handle{position:absolute;left:50%;top:-30px;width:12px;height:12px;border:2px solid #1894ff;border-radius:50%;background:#fff;box-sizing:border-box;transform:translate(-50%);pointer-events:auto;cursor:grab;touch-action:none}.rotation-handle:before{content:"";position:absolute;left:50%;top:10px;width:2px;height:18px;background:#1894ff;transform:translate(-50%)}.button-decor{width:30px;height:30px;border-radius:50%;display:block;background:radial-gradient(circle at 38% 38%,rgba(255,255,255,.95) 0 3px,transparent 3.4px),radial-gradient(circle at 62% 38%,rgba(255,255,255,.95) 0 3px,transparent 3.4px),radial-gradient(circle at 38% 62%,rgba(255,255,255,.95) 0 3px,transparent 3.4px),radial-gradient(circle at 62% 62%,rgba(255,255,255,.95) 0 3px,transparent 3.4px),currentColor;box-shadow:inset 0 -4px 8px #0000001f,0 7px 16px #463c3029}.decor-draw svg,.drawing-preview{width:100%;height:100%;overflow:visible;pointer-events:none}.draw-main-stroke{stroke-width:var(--draw-stroke-width)}.draw-hit-stroke{stroke-width:calc(var(--draw-stroke-width) + 8);pointer-events:stroke}.draw-selection{pointer-events:none}.drawing-preview{position:absolute;inset:0;z-index:10}.preview-actions-tray{position:relative;z-index:34}.primary-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:20px}.soft-button{min-height:72px;border:0;border-radius:16px;display:inline-flex;align-items:center;justify-content:center;gap:9px;background:#fffdf8cc;cursor:pointer;transition:transform .16s ease,background-color .16s ease}.soft-button:hover{transform:translateY(-2px)}.soft-button:disabled{opacity:1;color:var(--text-soft);cursor:not-allowed;transform:none}.soft-button:disabled:hover{transform:none}.soft-button.danger{color:var(--text-body);background:var(--glass-surface)}.soft-button.save{position:relative;color:var(--text-body);background:var(--glass-surface)}.soft-button.save .confetti-burst{left:50%;top:48%}.soft-button.danger:disabled,.soft-button.save:disabled{color:var(--text-soft)}.pattern-download-menu{position:absolute;left:20px;bottom:20px;z-index:14;display:inline-grid;justify-items:start}.pattern-download-options{position:absolute;left:0;bottom:calc(100% + 8px);min-width:132px;padding:7px;border-radius:16px;background:var(--glass-surface-strong);color:var(--icon-ink);box-shadow:none;overflow:hidden;isolation:isolate;-webkit-backdrop-filter:var(--pattern-download-panel-blur);backdrop-filter:var(--pattern-download-panel-blur);display:grid;gap:4px}.pattern-download-option{min-height:38px;padding:0 10px;border:0;border-radius:12px;background:transparent;color:var(--icon-ink);box-shadow:none;display:inline-flex;align-items:center;justify-content:flex-start;gap:8px;font-size:13px;line-height:1;font-weight:700;white-space:nowrap;cursor:pointer;touch-action:manipulation;transition:transform .16s ease,background-color .16s ease}.pattern-download-icon{width:18px;height:18px;flex:0 0 auto;object-fit:contain;filter:var(--pattern-download-icon-filter)}.pattern-download-option:hover{background:var(--glass-surface-hover)}.pattern-download-trigger{width:44px;height:44px;min-height:44px;border:0;padding:0;border-radius:50%;background:var(--glass-surface-strong);color:var(--icon-ink);box-shadow:none;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);display:inline-flex;align-items:center;justify-content:center;gap:5px;font-size:12px;line-height:1;font-weight:700;cursor:pointer;touch-action:manipulation;transition:transform .16s ease,background-color .16s ease}.pattern-download-trigger:hover{transform:translateY(-2px);background:var(--glass-surface-hover)}.reset-confirm-card{position:absolute;left:0;right:0;bottom:calc(100% + 10px);z-index:35;margin:0;padding:12px;border-radius:16px;background:var(--glass-surface);color:var(--text-body);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);display:grid;gap:12px}.reset-confirm-copy{display:grid;gap:4px;font-size:14px;line-height:1.35}.reset-confirm-copy strong{color:var(--text-strong);font-size:15px}.reset-confirm-copy span{color:var(--text-soft)}.reset-confirm-actions{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.reset-confirm-actions .soft-button{min-height:42px;border-radius:12px;font-size:13px}.controls-shell{height:auto;overflow:visible;padding:2px 0 30px}.status-line{min-height:30px;margin:0 0 12px;color:var(--text-soft);font-size:14px}.panel-section h2,.section-title-row h2{margin:0;color:var(--text-strong);font-size:20px;font-weight:800;letter-spacing:0}.panel-section>h2{margin:0 0 14px}.section-title-row{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px}.section-title-row span{align-self:center;color:var(--text-muted);font-size:13px;line-height:1;white-space:nowrap}.upload-layout{display:grid;grid-template-columns:1fr 126px;gap:22px}.image-drop{height:132px;min-height:132px;border:0;border-radius:18px;background:var(--paper-strong);color:var(--text-soft);display:grid;place-items:center;align-content:center;gap:8px;cursor:pointer;overflow:hidden;align-self:start}.image-drop.has-image{padding:10px}.image-drop-preview{width:min(112px,100%);height:min(112px,100%);aspect-ratio:1;border-radius:50%;padding:6px;display:block;background:#fff}.image-drop-preview img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block}.image-drop>span:not(.image-drop-preview){font-size:13px}.image-drop>svg,.icon-button>svg{color:var(--icon-ink);opacity:1;stroke-opacity:1}.upload-actions{display:grid;gap:20px}.icon-button{min-height:58px;border:0;border-radius:18px;background:#fffdf8c7;color:var(--text-soft);display:grid;place-items:center;cursor:pointer}.detected-palette{display:inline-flex;align-items:center;gap:8px;margin-top:14px;color:var(--text-soft);font-size:13px}.detected-palette span,.quick-palette button{width:22px;height:22px;border-radius:7px;background:var(--swatch);border:0}.crop-overlay{position:fixed;inset:0;z-index:30;display:grid;place-items:center;padding:18px;background:#ffffff29;-webkit-backdrop-filter:var(--crop-overlay-blur);backdrop-filter:var(--crop-overlay-blur)}.crop-dialog{width:min(390px,100%);padding:18px;border:0;border-radius:22px;background:var(--crop-dialog-surface);color:var(--crop-dialog-ink);box-shadow:none;-webkit-backdrop-filter:var(--crop-dialog-blur);backdrop-filter:var(--crop-dialog-blur)}.crop-dialog-header{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px}.crop-dialog-header h2{margin:0;color:inherit;font-size:20px;font-weight:800;letter-spacing:0}.crop-close{width:36px;height:36px;border:0;border-radius:50%;background:var(--chip-surface);color:var(--chip-ink);display:grid;place-items:center;cursor:pointer}.crop-dialog .crop-close{color:#000}.crop-frame{position:relative;width:var(--crop-size);height:var(--crop-size);max-width:100%;margin:0 auto;border-radius:50%;overflow:hidden;cursor:grab;touch-action:none;background:linear-gradient(45deg,#eeeeee 25%,transparent 25% 75%,#eeeeee 75%),linear-gradient(45deg,#eeeeee 25%,transparent 25% 75%,#eeeeee 75%);background-color:#fff;background-position:0 0,10px 10px;background-size:20px 20px;box-shadow:0 0 0 10px #ffffff9e,0 15px 42px #41362b29}.crop-frame:active{cursor:grabbing}.crop-frame img{position:absolute;left:0;top:0;max-width:none;object-fit:fill;-webkit-user-select:none;user-select:none;pointer-events:none;transform-origin:0 0;will-change:transform}.crop-zoom{display:grid;grid-template-columns:44px 1fr;align-items:center;gap:14px;margin:22px 2px 16px;color:inherit;font-size:16px;font-weight:800}.crop-zoom input{width:100%;accent-color:#8f8b84}.crop-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}.crop-button{min-height:48px;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;font-size:15px;font-weight:800}.crop-button.secondary,.crop-button.primary{border:0;background:var(--glass-surface);color:inherit}.section-divider{border:0;height:2px;margin:26px 0;border-radius:999px;background:var(--glass-surface)}.control-card{position:relative;display:grid;row-gap:12px;margin-bottom:16px;padding:22px 26px;border-radius:18px;border:0;background:#fffdf8c2;box-shadow:0 13px 32px #453d3312;overflow:visible}.card-head{display:flex;align-items:center;justify-content:space-between;gap:14px}.card-head h3{margin:0;color:var(--card-title);font-size:15px;font-weight:700}.remove-button{width:30px;height:30px;border:0;border-radius:50%;background:var(--chip-surface);color:var(--chip-ink);display:grid;place-items:center;cursor:pointer;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}.control-line{display:grid;grid-template-columns:54px minmax(0,1fr);align-items:center;column-gap:12px;row-gap:0;min-height:38px;font-size:18px;font-weight:700}.control-line+.control-line{margin-top:0}.control-line>span{color:var(--control-label)}.arrangement-control-line{grid-template-columns:minmax(54px,max-content) minmax(0,1fr);column-gap:12px}.arrangement-control-line.is-english{grid-template-columns:minmax(86px,max-content) minmax(0,1fr);column-gap:16px}.counter{display:inline-flex;align-items:center;gap:7px}.counter span,.counter button,.counter input,.dimension-output{min-width:30px;height:24px;border:0;border-radius:8px;background:var(--chip-surface);color:var(--chip-ink);display:inline-grid;place-items:center;font-size:13px;font-weight:800;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}.counter button{cursor:pointer}.counter input{width:38px;border:0;outline:0;text-align:center}.counter input::-webkit-outer-spin-button,.counter input::-webkit-inner-spin-button{appearance:none;margin:0}.dimension-slider{display:grid;grid-template-columns:54px minmax(0,1fr);align-items:center;column-gap:12px;min-height:38px;margin-top:0;color:var(--control-label);font-size:18px;font-weight:700}.dimension-range{display:grid;grid-template-columns:minmax(0,1fr) 52px;align-items:center;gap:10px}.dimension-range input[type=range]{width:100%;height:24px;margin:0;appearance:none;background:transparent;cursor:pointer}.dimension-range input[type=range]::-webkit-slider-runnable-track{height:10px;border-radius:999px;background:linear-gradient(90deg,var(--range-fill) 0 var(--range-progress),var(--range-rest) var(--range-progress) 100%)}.dimension-range input[type=range]::-webkit-slider-thumb{appearance:none;width:22px;height:22px;margin-top:-6px;border:3px solid var(--range-thumb-border);border-radius:50%;background:var(--range-thumb);box-shadow:0 1px 4px #40382f2e}.dimension-range input[type=range]::-moz-range-track{height:10px;border-radius:999px;background:linear-gradient(90deg,var(--range-fill) 0 var(--range-progress),var(--range-rest) var(--range-progress) 100%)}.dimension-range input[type=range]::-moz-range-thumb{width:18px;height:18px;border:3px solid var(--range-thumb-border);border-radius:50%;background:var(--range-thumb);box-shadow:0 1px 4px #40382f2e}.dimension-range output,.dimension-output{justify-self:end;width:38px;min-width:38px;height:24px;border-radius:8px;background:var(--chip-surface);color:var(--chip-ink);display:grid;place-items:center;font-size:13px;font-weight:800}.rotation-value{box-sizing:border-box}.rotation-value input{min-width:0;width:100%;border:0;background:transparent;color:inherit;font:inherit;text-align:center;outline:0}.rotation-value input::-webkit-outer-spin-button,.rotation-value input::-webkit-inner-spin-button{appearance:none;margin:0}.color-row{display:inline-flex;align-items:center;flex-wrap:wrap;gap:10px;min-height:34px}.color-dot{width:24px;height:24px;border-radius:50%;border:2px solid transparent;background:var(--dot);cursor:pointer}.color-dot.active{border-color:#fff;box-shadow:0 0 0 2px #9aa1a6}.tiny-add,.tiny-remove{width:24px;height:24px;border:0;border-radius:50%;background:var(--option-surface);display:inline-grid;place-items:center;color:var(--chip-ink);cursor:pointer}.tiny-remove:disabled{opacity:.42;cursor:not-allowed;background:var(--chip-surface-muted)}.style-shelf{position:relative;grid-column:1 / -1;width:100%;margin-top:8px;padding:10px;border-radius:14px;background:var(--style-surface);box-shadow:0 10px 24px #4b423717}.pattern-options{display:grid;grid-template-columns:repeat(5,minmax(48px,1fr));gap:7px}.pattern-options button{min-height:42px;border:0;border-radius:10px;background:var(--option-surface);color:var(--text-soft);display:grid;place-items:center;gap:4px;font-size:12px;cursor:pointer}.pattern-options button.selected,.arrangement-row button.selected{background:var(--option-selected);color:var(--selected-ink)}.pattern-sample{width:28px;height:16px;border-radius:6px;display:block}.quick-palette{display:flex;align-items:center;flex-wrap:nowrap;gap:8px;margin-top:10px;max-width:100%;overflow-x:auto;padding-bottom:2px;scrollbar-width:thin}.quick-palette.has-overflow-right{-webkit-mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 28px),rgba(0,0,0,0) 100%);mask-image:linear-gradient(90deg,#000 0 calc(100% - 28px),#0000)}.quick-palette button{flex:0 0 22px;cursor:pointer}.native-color{position:relative;flex:0 0 auto;min-width:54px;min-height:28px;padding:0 10px;border-radius:9px;background:var(--option-surface);color:var(--text-soft);font-size:12px;display:inline-grid;place-items:center;cursor:pointer;overflow:hidden}.native-color input{position:absolute;inset:0;opacity:0;cursor:pointer}.arrangement-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;min-width:0}.arrangement-row button{width:100%;min-width:0;min-height:30px;border:0;border-radius:8px;padding:0 8px;background:var(--option-surface);color:var(--text-soft);display:inline-flex;align-items:center;justify-content:center;font-size:12px;line-height:1;text-align:center;white-space:nowrap;cursor:pointer}.arrangement-label{display:inline-flex;align-items:center;justify-content:center;width:auto;max-width:100%;line-height:1;text-align:center}.add-layer-button{width:100%;min-height:74px;border:0;border-radius:18px;background:#fffdf8cc;color:var(--text-soft);display:inline-flex;align-items:center;justify-content:center;gap:10px;cursor:pointer}.decor-toolbar{display:grid;grid-template-columns:1fr 1fr auto;gap:12px;margin-bottom:14px}.decor-tool,.draw-color,.decor-preset,.decor-chip{border:0;border-radius:14px;background:#fffdf8d1;color:var(--decor-text)}.decor-tool{min-height:54px;display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer}.decor-tool.active{background:var(--mint)}.draw-color{width:54px;height:54px;position:relative;display:grid;place-items:center;cursor:pointer;overflow:hidden}.draw-color span{width:25px;height:25px;border-radius:50%;background:var(--draw);box-shadow:0 0 0 3px #fff}.draw-color input{position:absolute;inset:0;opacity:0;cursor:pointer}.decor-presets{display:grid;grid-template-columns:repeat(3,minmax(92px,1fr));gap:12px}.decor-preset{min-height:82px;display:grid;place-items:center;align-content:center;gap:6px;cursor:pointer}.decor-preset.active{background:var(--option-selected);color:var(--selected-ink)}.decor-preset-icon{width:auto;height:25px;max-width:44px;object-fit:contain;display:block;pointer-events:none}.decor-preset span{color:var(--text-soft);font-size:13px}.decor-preset.active span{color:inherit}.decor-list{display:flex;gap:9px;flex-wrap:wrap;margin-top:14px}.decor-chip{min-height:34px;padding:0 10px 0 12px;display:inline-flex;align-items:center;gap:8px;cursor:pointer}.decor-chip.active{background:var(--blue)}.hidden-input{display:none}.soft-button,.history-button,.board-close,.board-switch-button,.utility-button,.page-control,.page-dot,.image-drop,.icon-button,.crop-close,.crop-button,.control-card,.style-shelf,.pattern-options button,.native-color,.arrangement-row button,.add-layer-button,.decor-tool,.draw-color,.decor-preset,.decor-chip{border:0;background:var(--glass-surface);box-shadow:none;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur)}.preview-card,.crop-dialog{border:0;box-shadow:none;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur)}.preview-card{background:var(--glass-surface)}.crop-dialog{background:var(--crop-dialog-surface);-webkit-backdrop-filter:var(--crop-dialog-blur);backdrop-filter:var(--crop-dialog-blur)}.soft-button:hover,.history-button:hover,.board-close:hover,.board-switch-button:hover,.icon-button:hover,.crop-close:hover,.crop-button:hover,.pattern-options button:hover,.native-color:hover,.arrangement-row button:hover,.add-layer-button:hover{background:var(--glass-surface-hover)}.decor-tool:hover,.draw-color:hover,.decor-preset:hover,.decor-chip:hover{background:var(--glass-surface);box-shadow:none;filter:none}.decor-tool.active:hover,.decor-preset.active:hover,.decor-chip.active:hover{background:var(--option-selected)}.remove-button:hover,.counter button:not(:disabled):hover,.tiny-add:hover,.tiny-remove:not(:disabled):hover{background:var(--chip-surface-hover)}.soft-button.danger,.soft-button.save{color:var(--text-body);background:var(--glass-surface)}.decor-tool.active,.decor-chip.active,.pattern-options button.selected,.arrangement-row button.selected{background:var(--option-selected);color:var(--selected-ink)}.dimension-range input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(90deg,var(--range-fill) 0 var(--range-progress),var(--range-rest) var(--range-progress) 100%)}.dimension-range input[type=range]::-moz-range-track{background:linear-gradient(90deg,var(--range-fill) 0 var(--range-progress),var(--range-rest) var(--range-progress) 100%)}.dimension-range input[type=range]::-webkit-slider-thumb{border-color:var(--range-thumb-border);background:var(--range-thumb)}.dimension-range input[type=range]::-moz-range-thumb{border-color:var(--range-thumb-border);background:var(--range-thumb)}.counter button,.tiny-add,.tiny-remove,.history-button,.board-close,.remove-button,.icon-button,.crop-close{padding:0;line-height:0;display:inline-grid;place-items:center}.counter button>svg,.tiny-add>svg,.tiny-remove>svg,.history-button>svg,.board-close>svg,.utility-button>svg,.remove-button>svg,.icon-button>svg,.crop-close>svg{display:block;margin:auto;flex:0 0 auto}@media(max-width:1020px){.workspace{gap:34px;grid-template-columns:minmax(320px,520px) minmax(336px,430px)}.app-shell{padding-inline:20px}}@media(max-width:900px){:root{--mobile-bg-overscan: 160px}body{overflow-x:hidden;overflow-y:auto;position:relative;isolation:isolate;background-image:none;background-color:var(--app-bg-color);background-size:cover;background-position:center;background-attachment:fixed;background-repeat:no-repeat;background-blend-mode:var(--app-bg-blend)}body:before{content:"";position:fixed;top:calc(var(--mobile-bg-overscan) * -1);right:0;bottom:calc(var(--mobile-bg-overscan) * -1);left:0;z-index:0;width:100vw;height:auto;min-height:calc(100dvh + (var(--mobile-bg-overscan) * 2));pointer-events:none;background-image:var(--app-bg-image);background-color:var(--app-bg-color);background-size:cover;background-position:center;background-repeat:no-repeat;background-blend-mode:var(--app-bg-blend);transform:translateZ(0)}#root{position:relative;z-index:1;background:transparent;overflow-x:clip;min-height:100vh;min-height:100dvh}.app-shell{padding:76px 16px 42px;background:transparent;min-height:100vh;min-height:100dvh}.utility-actions{top:14px;right:16px}.audio-panel{top:calc(100% + 10px);right:0;left:auto;width:min(220px,calc(100vw - 24px))}.app-header{margin-bottom:24px}.app-title-image{width:min(340px,82vw)}.workspace{grid-template-columns:1fr;gap:18px}.preview-pane{position:sticky;top:64px;z-index:30;align-self:start}.preview-card{aspect-ratio:auto;height:clamp(210px,46vh,320px);min-height:0;padding:16px}.preview-card .board-history-actions{top:12px;left:12px;gap:6px}.history-button,.board-close{width:32px;height:32px}.board-close{top:12px;right:12px}.page-control{bottom:12px;min-height:22px;padding:5px 8px;gap:7px}.rosette-stage{--artwork-offset-y: -9%;--artwork-scale: .84}.primary-actions{margin-top:10px;gap:10px}.soft-button{min-height:44px;padding:0 12px;border-radius:12px;font-size:13px;gap:6px}.controls-shell{height:auto;max-height:none;position:static;overflow:visible;padding-right:0}}@media(max-width:560px){:root{--font-rounded: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif}html{-webkit-text-size-adjust:100%;text-size-adjust:100%}.panel-section h2,.section-title-row h2,.crop-dialog-header h2{font-weight:700}.control-line,.dimension-slider,.arrangement-row button,.pattern-options button,.native-color,.utility-button,.soft-button,.counter span,.counter button,.dimension-output,.crop-button{font-weight:600}.status-line,.section-title-row span,.card-head h3{font-weight:500}.app-shell{padding-inline:12px}.utility-actions{--utility-label-size: 12px;--utility-label-weight: 600;right:12px;gap:7px}.utility-button{min-height:34px;padding:0 10px}.audio-panel{width:min(210px,calc(100vw - 24px));padding:16px;gap:16px}.audio-slider{grid-template-columns:max-content 116px;gap:6px}.preview-card{min-height:360px;border-radius:16px}.preview-pane{top:58px}.preview-card{height:clamp(188px,42vh,280px);min-height:0;padding:14px}.primary-actions{gap:9px}.soft-button{min-height:58px;border-radius:13px;flex-direction:column;gap:4px;font-size:13px}.primary-actions .soft-button{min-height:42px;flex-direction:row;gap:5px;padding:0 9px;font-size:12px}.primary-actions .soft-button svg{width:15px;height:15px}.upload-layout{grid-template-columns:1fr 82px;gap:12px}.upload-actions{gap:12px}.control-card{padding:18px 16px}.control-line{grid-template-columns:46px minmax(0,1fr);font-size:16px}.arrangement-control-line,.arrangement-control-line.is-english{grid-template-columns:1fr;row-gap:8px}.arrangement-row button{min-height:32px;line-height:1}.dimension-slider{grid-template-columns:46px minmax(0,1fr);font-size:16px}.pattern-options,.decor-presets{grid-template-columns:repeat(3,1fr)}}