*{box-sizing:border-box}:root{--font-ui: "PingFang SC", "HarmonyOS Sans SC", "MiSans", "Microsoft YaHei UI", "Noto Sans CJK SC", "Hiragino Sans GB", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-display: var(--font-ui);--font-mono: "SF Mono", "Cascadia Mono", "JetBrains Mono", "Menlo", "Consolas", monospace;--accent: #c96442;--accent-strong: #9f4a2f;--accent-soft: #f6e5dc;--accent-border: #e6b7a4;--bg: #f4efe7;--border: #ded4c7;--danger: #a43f3f;--danger-border: #e9b8ad;--danger-soft: #faece8;--info: #5d4a2f;--info-border: #dec9a4;--info-soft: #fbf4e5;--ink: #2f2a24;--ink-strong: #171512;--muted: #786f64;--shadow: rgba(47, 42, 36, .1);--surface: #fffaf2;--surface-muted: #f8f1e8;--surface-raised: #fffcf7;--warm-border: #e2c994;--warm-soft: #fbf1dc;--radius: 14px;--radius-sm: 10px;color:var(--ink);background:var(--bg);font-family:var(--font-ui);font-weight:460}body{margin:0}button,input,textarea,select{font:inherit}button{cursor:pointer;transition:background-color .16s ease,border-color .16s ease,box-shadow .16s ease,color .16s ease,transform .16s ease}button:disabled{cursor:not-allowed;opacity:.55}.app-shell{display:grid;grid-template-columns:minmax(340px,420px) minmax(0,1fr);min-height:100dvh;background:linear-gradient(90deg,rgba(255,250,242,.94),rgba(255,250,242,.78) 420px,transparent 420px),var(--bg)}.control-pane{border-right:1px solid var(--border);background:#fffaf2eb;padding:24px 22px;font-size:14px;overflow-y:auto}.brand{display:flex;gap:14px;align-items:center;margin-bottom:26px}.brand-mark{width:48px;height:48px;border-radius:8px;box-shadow:0 10px 24px #11182729}.brand h1,.brand p,h2{margin:0}.brand h1{font-family:var(--font-display);font-size:26px;font-weight:700;letter-spacing:0;line-height:1.08}.brand p{color:var(--muted);font-size:13px;font-weight:500;margin-top:5px}.section{margin-top:15px}.section-card{border:1px solid var(--border);border-radius:12px;background:#fffcf7c7;padding:10px;box-shadow:0 1px #2f2a2408}.label{display:block;color:var(--muted);font-size:12px;font-weight:560;letter-spacing:0;margin-bottom:7px}.textarea,.input,.select,.number{width:100%;border:1px solid var(--border);border-radius:10px;background:var(--surface-raised);color:var(--ink-strong);font-size:14px;outline:none;box-shadow:0 1px #2f2a2408}.textarea,.input,.select{padding:9px 11px}.select{min-height:38px;line-height:1.2}.input::placeholder,.textarea::placeholder{color:#9a938a;font-weight:460}.textarea{resize:vertical;min-height:96px;line-height:1.5}.number{width:58px;padding:8px 9px}.textarea:focus,.input:focus,.select:focus,.number:focus{border-color:var(--accent);box-shadow:0 0 0 3px #c9644229}.style-select,.style-option{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;width:100%;border:1px solid var(--border);border-radius:10px;background:#fffcf7d1;color:var(--ink);padding:8px 10px;text-align:left}.style-select{min-height:42px}.style-select:hover,.style-option:hover{border-color:#c7b9aa;background:var(--surface-raised)}.style-select svg{color:var(--muted);transition:transform .16s ease}.style-select.open svg{transform:rotate(180deg)}.style-select strong,.style-select small,.style-option strong,.style-option small{display:block}.style-select strong,.style-option strong{font-family:var(--font-display);font-size:14px;font-weight:600}.style-select small,.style-option small{color:var(--muted);font-size:11px;margin-top:2px}.style-options{display:grid;gap:7px;margin-top:8px}.style-option{grid-template-columns:auto minmax(0,1fr);min-height:40px;padding:7px 10px}.style-option.selected{border-color:var(--accent);background:#fff3e8;box-shadow:0 0 0 1px #c9644229 inset}.swatch{width:18px;height:18px;flex:0 0 auto;border-radius:50%;box-shadow:0 0 0 3px #fffaf2e6,0 0 0 4px #2f2a2414}.segmented,.layout-segmented{display:grid;gap:5px;border-radius:12px;background:#eee5da;padding:5px}.segmented{grid-template-columns:repeat(3,1fr)}.layout-segmented{grid-template-columns:repeat(3,1fr);border:1px solid var(--border);background:#f3eadf}.segmented button,.layout-segmented button{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:0;border-radius:9px;background:transparent;padding:8px 6px;color:var(--muted);font-size:13px;font-weight:560}.segmented button.active,.layout-segmented button.active{background:var(--surface-raised);color:var(--accent);box-shadow:0 4px 12px #2f2a2414}.layout-segmented button.active{background:var(--accent);color:#fff}.inline-row,.two-col{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end}.two-col{grid-template-columns:1fr 1fr}.collection-items{display:grid;gap:8px;margin-top:8px}.collection-toggle{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;align-items:center;width:100%;min-height:38px;margin-top:10px;border:1px solid var(--border);border-radius:10px;background:#fffcf7b8;padding:7px 10px;color:var(--ink);text-align:left}.collection-toggle:hover{border-color:#c7b9aa;background:var(--surface-raised)}.collection-toggle span{display:grid;gap:1px;min-width:0}.collection-toggle strong{font-family:var(--font-display);font-size:13px;font-weight:600}.collection-toggle small{overflow:hidden;color:var(--muted);font-size:11px;font-weight:460;text-overflow:ellipsis;white-space:nowrap}.collection-toggle em{border-radius:999px;background:var(--accent-soft);color:var(--accent-strong);font-size:11px;font-style:normal;font-weight:600;padding:3px 7px}.collection-toggle svg{color:var(--muted);transition:transform .16s ease}.collection-toggle.open svg{transform:rotate(180deg)}.count-controls{display:inline-flex;align-items:center;gap:6px;justify-content:flex-end}.count-controls button{min-width:32px;border:1px solid var(--accent-border);border-radius:9px;background:var(--surface-raised);padding:7px 9px;color:var(--accent);font-size:13px;font-weight:600}.count-controls button.active{background:var(--accent);color:#fff;box-shadow:0 6px 14px #c964422e}.checks{display:grid;gap:7px}.check-option{display:flex;min-height:36px;gap:9px;align-items:center;border:1px solid var(--border);border-radius:10px;background:#fffcf7d1;color:var(--ink);padding:8px 10px;font-size:14px;font-weight:500}.check-option input{width:15px;height:15px;accent-color:var(--accent)}.reference-card{border:1px solid var(--border);border-radius:12px;background:#fffcf7d1;padding:11px;box-shadow:0 1px #2f2a2408}.reference-head{display:flex;align-items:start;justify-content:space-between;gap:12px}.reference-head .label{margin-bottom:4px}.reference-head p{margin:0;color:var(--muted);font-size:11px;font-weight:500;line-height:1.45}.switch{position:relative;display:inline-flex;width:40px;height:22px;flex:0 0 auto}.switch input{position:absolute;opacity:0}.switch span{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:999px;background:#ded4c7;pointer-events:none;transition:background .18s ease}.switch span:after{position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #2f2a243d;content:"";transition:transform .18s ease}.switch input:checked+span{background:var(--accent)}.switch input:checked+span:after{transform:translate(18px)}.text-card{border:1px solid var(--border);border-radius:12px;background:#fffcf7d1;padding:11px;box-shadow:0 1px #2f2a2408}.text-card.enabled{border-color:var(--accent-border);background:#fff7ed;box-shadow:0 0 0 1px #c9644214 inset}.text-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.text-title{display:inline-flex;align-items:center;gap:8px;color:var(--ink);font-family:var(--font-display);font-size:14px;font-weight:600}.text-title svg{width:17px;height:17px;color:var(--muted)}.text-body{display:grid;gap:9px;margin-top:10px;border:1px solid rgba(222,212,199,.78);border-radius:11px;background:var(--surface-raised);padding:10px}.text-input{min-height:38px;font-size:13px;font-weight:520}.text-input::placeholder{color:#9a938a}.text-style-segmented{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.text-style-segmented button{min-height:36px;border:1px solid var(--border);border-radius:9px;background:var(--surface-raised);color:var(--muted);font-size:13px;font-weight:640}.text-style-segmented button:hover{border-color:var(--accent-border);color:var(--ink)}.text-style-segmented button.active{border-color:var(--accent);background:#fff3e8;color:var(--accent-strong);box-shadow:0 0 0 1px var(--accent) inset}.reference-upload{display:inline-flex;width:100%;min-height:68px;align-items:center;justify-content:center;gap:8px;margin-top:10px;border:1px dashed #cdbfad;border-radius:11px;background:#fffcf7d1;color:var(--muted);font-size:13px;font-weight:620}.reference-upload svg{width:18px;height:18px}.reference-preview{display:grid;grid-template-columns:96px 1fr;gap:10px;margin-top:12px;align-items:center}.reference-preview img{width:96px;height:96px;border:1px solid var(--border);border-radius:10px;background:#fff;object-fit:cover}.reference-actions{display:grid;gap:8px}.reference-actions button{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid var(--border);border-radius:10px;background:var(--surface-raised);padding:9px 10px;color:var(--ink);font-weight:650}.workspace{display:grid;gap:20px;align-content:start;padding:24px;overflow-y:auto}.prompt-panel,.upload-panel,.pieces-panel{border:1px solid var(--border);border-radius:16px;background:#fffcf7eb;padding:19px;box-shadow:0 14px 34px #2f2a2414}.upload-panel{container-type:inline-size}.panel-heading{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-bottom:16px}.panel-heading h2{color:var(--ink-strong);font-family:var(--font-display);font-size:24px;font-weight:700;letter-spacing:0;line-height:1.18}.eyebrow{margin:0 0 4px;color:var(--accent);font-size:11px;font-weight:700;letter-spacing:0;text-transform:uppercase}.primary-button,.secondary-button,.tool-button,.danger-button,.piece-card button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;border-radius:11px;padding:10px 14px;font-family:var(--font-display);font-weight:600}.primary-button{border:1px solid var(--accent);background:var(--accent);color:#fff;box-shadow:0 8px 18px #c9644233}.primary-button:hover{background:var(--accent-strong);border-color:var(--accent-strong);transform:translateY(-1px)}.secondary-button,.tool-button,.piece-card button{border:1px solid var(--border);background:var(--surface-raised);color:var(--ink)}.secondary-button:hover,.tool-button:hover,.piece-card button:hover{border-color:#c7b9aa;background:#fff7ed}.danger-button{border:1px solid var(--danger-border);background:var(--danger-soft);color:var(--danger)}.danger-button:hover{border-color:var(--danger)}.prompt-output{min-height:210px;max-height:360px;overflow:auto;overflow-wrap:anywhere;white-space:pre-wrap;border:1px solid var(--accent-border);border-radius:13px;background:#fff8ee;margin:0;padding:17px;color:var(--ink);font-family:var(--font-mono);font-size:12.5px;font-weight:450;line-height:1.68;-moz-tab-size:2;tab-size:2;text-align:left}.prompt-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.prompt-meta span{border:1px solid var(--border);border-radius:999px;padding:5px 10px;background:var(--surface-muted);color:var(--muted);font-size:12px;font-weight:500}.reference-note{margin-top:12px;border:1px solid var(--info-border);border-radius:8px;background:var(--info-soft);padding:10px 12px;color:var(--info);font-size:13px;font-weight:520;line-height:1.5}.reference-note strong{display:block;margin-bottom:2px}.dropzone{display:grid;width:100%;min-height:220px;place-items:center;border:1.5px dashed #cdbfad;border-radius:14px;background:#f8f1e8b3;color:var(--muted);font-weight:620}.dropzone:hover{border-color:var(--accent);background:#fff7ed;color:var(--ink)}.image-workbench{display:grid;grid-template-columns:minmax(112px,150px) minmax(280px,1fr) minmax(160px,200px);gap:14px;min-height:430px}.image-list{display:grid;align-content:start;gap:8px;max-height:520px;overflow-y:auto}.thumb{display:grid;grid-template-columns:46px 1fr;gap:8px;align-items:center;border:1px solid var(--border);border-radius:12px;background:var(--surface-raised);padding:7px;text-align:left}.thumb.active{border-color:var(--accent);background:#fff3e8;box-shadow:0 0 0 1px #c9644229 inset}.thumb img{width:46px;height:46px;object-fit:cover;border-radius:6px}.thumb span{overflow:hidden;color:var(--ink);font-size:12px;font-weight:620;text-overflow:ellipsis;white-space:nowrap}.preview-area{display:grid;min-width:0;min-height:430px;place-items:center;border:1px solid var(--border);border-radius:14px;overflow:hidden}.preview-area img{max-width:100%;max-height:520px;object-fit:contain}.tools{display:grid;min-width:0;align-content:start;gap:10px}.tool-button,.danger-button{min-width:0;width:100%;white-space:normal}.grid-controls{display:grid;grid-template-columns:1fr auto 1fr auto;gap:6px;align-items:center;color:var(--muted);font-weight:620}.error{margin:14px 0 0;border:1px solid var(--danger-border);border-radius:8px;background:var(--danger-soft);padding:10px 12px;color:var(--danger);font-weight:600}.empty-pieces{display:grid;min-height:140px;place-items:center;border:1px dashed #cdbfad;border-radius:14px;background:#f8f1e870;color:var(--muted);font-weight:620}.pieces-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}.pieces-layout{display:grid;gap:16px}.pieces-layout.with-crop{grid-template-columns:minmax(0,1fr) 340px}.piece-card{border:1px solid var(--border);border-radius:14px;overflow:hidden;background:var(--surface-raised)}.piece-card.selected{border-color:var(--accent);box-shadow:0 0 0 2px #c9644238}.piece-image{display:grid;width:100%;border:0;aspect-ratio:1;place-items:center;padding:12px}.piece-image img{max-width:100%;max-height:100%;object-fit:contain}.piece-actions{display:grid;grid-template-columns:1fr 1.25fr;gap:6px;border-top:1px solid var(--border);padding:8px}.piece-actions button{min-height:36px;margin:0;padding:7px 8px;font-size:12px}.crop-editor{align-self:start;border:1px solid var(--accent-border);border-radius:16px;background:var(--accent-soft);padding:14px}.crop-heading{display:flex;justify-content:space-between;gap:12px;margin-bottom:12px}.crop-heading h3,.crop-heading p{margin:0}.crop-heading h3{color:var(--accent-strong);font-size:15px}.crop-heading p{margin-top:4px;color:var(--accent);font-size:12px;font-weight:560}.crop-heading button{align-self:start;border:1px solid var(--accent-border);border-radius:999px;background:var(--surface-raised);padding:6px 10px;color:var(--ink);font-size:12px;font-weight:680}.crop-preview{position:relative;display:grid;aspect-ratio:1;place-items:center;overflow:hidden;border-radius:14px;padding:14px}.crop-preview img{max-width:100%;max-height:100%;object-fit:contain}.crop-mask{position:absolute;top:0;right:0;bottom:0;left:0;background:#2f2a240d;pointer-events:none}.crop-frame{position:absolute;border:2px dashed var(--accent);border-radius:10px;background:#c964421a;box-shadow:0 0 0 999px #2f2a2429;pointer-events:none;transition:inset .14s ease}.crop-sliders{display:grid;gap:10px;margin-top:14px}.crop-sliders label{display:grid;grid-template-columns:28px 1fr 48px;gap:10px;align-items:center;color:var(--muted);font-size:12px;font-weight:680}.crop-sliders input{accent-color:var(--accent)}.crop-sliders code{text-align:right;color:var(--muted)}.crop-apply{width:100%;margin-top:14px}.checkerboard{background-color:var(--surface-muted);background-image:linear-gradient(45deg,#eadfce 25%,transparent 25%),linear-gradient(-45deg,#eadfce 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#eadfce 75%),linear-gradient(-45deg,transparent 75%,#eadfce 75%);background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px}.spin{animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@container (max-width: 760px){.image-workbench{grid-template-columns:1fr}.image-list{grid-auto-flow:column;grid-auto-columns:minmax(130px,160px);overflow-x:auto}.preview-area{min-height:320px}.tools{grid-template-columns:repeat(auto-fit,minmax(148px,1fr))}.grid-controls{min-height:40px}}@media(max-width:1180px){.app-shell{grid-template-columns:1fr}.control-pane{border-right:0;border-bottom:1px solid var(--border)}.pieces-layout.with-crop{grid-template-columns:1fr}}@media(max-width:620px){.control-pane,.workspace{padding:16px}.style-grid,.two-col{grid-template-columns:1fr}.panel-heading{align-items:stretch;flex-direction:column}}
