:root{--bg: #f4f6fb;--bg-soft: #eef2f9;--surface: #ffffff;--surface-2: #f8faf6;--ink: #1f2533;--ink-2: #5c6579;--ink-3: #7a8499;--line: #e6e9f2;--line-2: #eef0f6;--accent: #138101;--accent-ink: #0f6601;--accent-soft: #eef6ec;--ok: #2fa36b;--warn: #f59e0b;--danger: #e5484d;--brand: #138101;--brand-hover: #0f6601;--sitebar-h: 58px;--radius: 12px;--radius-sm: 8px;--shadow-sm: 0 1px 2px rgba(31, 37, 51, .05);--shadow-md: 0 4px 18px rgba(31, 37, 51, .06);--shadow-lg: 0 14px 40px -16px rgba(31, 37, 51, .22), 0 2px 8px rgba(31, 37, 51, .05);--font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Source Han Sans SC", sans-serif}*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:14px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}h1,h2,h3,p,ul,ol{margin:0}ul,ol{padding:0;list-style:none}button,input,select{font:inherit;color:inherit}button{cursor:pointer}code,kbd{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.site-bar{position:sticky;top:0;z-index:50;background:var(--brand);color:#fff;box-shadow:0 1px #00000014}.site-bar-inner{max-width:1220px;margin:0 auto;height:var(--sitebar-h);padding:0 22px;display:flex;align-items:center;gap:16px}.site-brand{display:inline-flex;align-items:center;gap:10px;flex:none;color:#fff;font-size:18px;font-weight:700;letter-spacing:.2px;text-decoration:none}.site-logo{width:38px;height:38px;border-radius:9px;object-fit:cover;flex:none}.site-brand:hover{color:#fff}.site-crumb{display:flex;align-items:center;gap:8px;min-width:0;font-size:13px;color:#ffffffb8}.site-crumb a{color:#ffffffd9;text-decoration:none;border-bottom:1px solid transparent}.site-crumb a:hover{color:#fff;border-bottom-color:#ffffff8c}.crumb-sep{opacity:.5}.crumb-now{color:#fff;font-weight:600;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.site-home{margin-left:auto;display:inline-flex;align-items:center;gap:6px;flex:none;height:32px;padding:0 13px;border-radius:8px;border:1px solid rgba(255,255,255,.32);background:#ffffff24;color:#fff;font-size:13px;font-weight:600;text-decoration:none;transition:background .15s,border-color .15s}.site-home svg{width:15px;height:15px}.site-home:hover{background:#ffffff42;border-color:#ffffff8c;color:#fff}.app{max-width:1220px;margin:0 auto;padding:22px 22px 64px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:4px 2px 20px;flex-wrap:wrap}.brand{display:flex;align-items:center;gap:13px}.logo{width:44px;height:44px;display:grid;place-items:center;border-radius:13px;color:#fff;background:linear-gradient(150deg,#35a820,#138101 55%,#0a5a00);box-shadow:0 6px 16px -6px #13810180,inset 0 1px #ffffff59;flex:none}.logo svg{width:24px;height:24px}.brand-text h1{font-size:19px;font-weight:700;letter-spacing:-.2px;line-height:1.25}.brand-text p{font-size:12.5px;color:var(--ink-3);letter-spacing:.1px}.topbar-badges{display:flex;gap:8px;flex-wrap:wrap}.topbar-badges li{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 11px;font-size:12.5px;font-weight:500;color:var(--ink-2);background:var(--surface);border:1px solid var(--line);border-radius:999px;box-shadow:var(--shadow-sm)}.topbar-badges svg{width:15px;height:15px;color:var(--accent);flex:none}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 372px;gap:20px;align-items:start}.stage{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-md);overflow:hidden;display:flex;flex-direction:column;position:sticky;top:calc(var(--sitebar-h) + 14px)}.stage-canvas{position:relative;display:grid;place-items:center;min-height:528px;padding:26px;background:radial-gradient(circle at 50% 0%,#fbfdf8 0%,transparent 62%),repeating-linear-gradient(45deg,#f8fbf5 0 10px,#f5f9f1 10px 20px)}.drop{width:100%;max-width:460px;border:1.5px dashed #d3ddcf;border-radius:18px;background:#ffffffc7;backdrop-filter:blur(2px);padding:54px 24px 46px;text-align:center;transition:border-color .18s,background .18s,transform .18s,box-shadow .18s;outline:none}.drop:hover,.drop:focus-visible{border-color:#8ecf80;background:#fff;box-shadow:0 10px 30px -16px #13810180}.drop.is-drag{border-color:var(--accent);background:var(--accent-soft);transform:scale(1.012)}.drop-icon{width:66px;height:66px;margin:0 auto 16px;display:grid;place-items:center;border-radius:50%;color:var(--accent);background:linear-gradient(180deg,#eef8ea,#e2f3dc);box-shadow:inset 0 1px #fff,0 4px 14px -6px #13810180}.drop-icon svg{width:26px;height:26px}.drop-title{font-size:16.5px;font-weight:650;letter-spacing:-.1px}.drop-hint{font-size:13px;color:var(--ink-3);margin-top:6px}.drop-hint kbd{font-size:11.5px;padding:1px 5px;border-radius:5px;background:#fff;border:1px solid var(--line);border-bottom-width:2px;color:var(--ink-2)}.drop-btn{margin-top:18px}.drop-tip{margin-top:16px;font-size:12px;color:var(--ink-3);padding-top:14px;border-top:1px dashed var(--line)}.processing{display:flex;flex-direction:column;align-items:center;gap:6px;padding:40px 24px;text-align:center}.proc-rings{position:relative;width:78px;height:78px;margin-bottom:14px}.proc-rings span{position:absolute;inset:0;border-radius:50%;border:2.5px solid transparent;border-top-color:var(--accent);animation:spin 1.15s cubic-bezier(.5,.15,.5,.85) infinite}.proc-rings span:nth-child(2){inset:9px;border-top-color:#4bb232;animation-duration:1.6s;animation-direction:reverse}.proc-rings span:nth-child(3){inset:18px;border-top-color:#a6d99a;animation-duration:2.1s}@keyframes spin{to{transform:rotate(360deg)}}.proc-title{font-size:15.5px;font-weight:650}.proc-bar{width:240px;height:5px;margin:12px 0 4px;background:var(--bg-soft);border-radius:99px;overflow:hidden}.proc-bar i{display:block;height:100%;width:0%;border-radius:99px;background:linear-gradient(90deg,#33a51f,var(--accent));transition:width .35s ease}.proc-sub{font-size:12.5px;color:var(--ink-3)}.preview{display:flex;justify-content:center;width:100%}.photo-shell{display:flex;flex-direction:column;align-items:center;gap:14px}.photo-frame{position:relative;width:min(100%,344px);border-radius:6px;overflow:hidden;box-shadow:var(--shadow-lg);line-height:0;background:#fff;transition:box-shadow .2s}.photo-frame:after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px #1018281a;border-radius:6px;pointer-events:none}#previewCanvas{display:block;width:100%;height:auto}.guides{position:absolute;inset:0;pointer-events:none}.guide{position:absolute;left:0;right:0;height:0;border-top:1px dashed rgba(19,129,1,.85)}.guide:after{content:attr(data-label);position:absolute;right:4px;top:-9px;font-size:9px;line-height:1;padding:2px 4px;border-radius:3px;color:#fff;background:#138101e6;letter-spacing:.3px}.guide-top{border-top-color:#138101cc}.guide-chin{border-top-color:#f59e0bf2}.guide-chin:after{background:#f59e0bf2}.photo-meta{display:flex;gap:10px;align-items:center;font-size:12.5px;color:var(--ink-2);background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:5px 14px;box-shadow:var(--shadow-sm);font-variant-numeric:tabular-nums}.photo-meta b{font-weight:650;color:var(--ink)}.photo-meta i{width:1px;height:11px;background:var(--line);display:block}.failed{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;padding:36px 24px}.failed-icon{width:52px;height:52px;display:grid;place-items:center;border-radius:50%;color:var(--danger);background:#fdeaea;margin-bottom:10px}.failed-icon svg{width:24px;height:24px}.failed-title{font-weight:650;font-size:15.5px}.failed-text{font-size:13px;color:var(--ink-3);max-width:330px}.failed .btn{margin-top:16px}.stage-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 16px;border-top:1px solid var(--line-2);background:var(--surface-2)}.stage-tools{display:flex;gap:6px}.tool{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 11px;font-size:12.5px;font-weight:500;color:var(--ink-2);background:var(--surface);border:1px solid var(--line);border-radius:8px;transition:background .15s,border-color .15s,color .15s}.tool svg{width:14px;height:14px}.tool:hover{background:#fff;border-color:#cfe0cb;color:var(--ink)}.tool[aria-pressed=true]{background:var(--accent-soft);border-color:#bcdcb4;color:var(--accent-ink)}.stage-note{font-size:12px;color:var(--ink-3);text-align:right}.panel{display:flex;flex-direction:column;gap:14px}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px 16px 14px;box-shadow:var(--shadow-sm)}.card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:13px}.card-head h2{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:650;letter-spacing:-.1px}.step{display:grid;place-items:center;width:19px;height:19px;border-radius:6px;font-size:11px;font-weight:700;color:var(--accent-ink);background:var(--accent-soft);font-variant-numeric:tabular-nums}.card-hint{font-size:11.5px;color:var(--ink-3)}.link-btn{background:none;border:0;padding:0;font-size:12px;color:var(--accent);border-bottom:1px solid transparent}.link-btn:hover{border-bottom-color:currentColor}.spec-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.spec{appearance:none;display:flex;flex-direction:column;align-items:flex-start;gap:1px;padding:8px 9px 7px;border-radius:var(--radius-sm);border:1px solid var(--line);background:var(--surface-2);text-align:left;transition:border-color .15s,background .15s,box-shadow .15s,transform .12s}.spec:hover{border-color:#c6e2c0;background:#fff}.spec:active{transform:scale(.985)}.spec b{font-size:12.8px;font-weight:600;letter-spacing:-.1px}.spec small{font-size:10.5px;color:var(--ink-3);font-variant-numeric:tabular-nums;letter-spacing:-.1px}.spec[aria-checked=true]{border-color:var(--accent);background:var(--accent-soft);box-shadow:0 0 0 1px var(--accent) inset,0 4px 12px -6px #13810199}.spec[aria-checked=true] b{color:var(--accent-ink)}.spec[aria-checked=true] small{color:#3f8f36}.swatch-row{display:flex;gap:9px;flex-wrap:wrap}.swatch{appearance:none;width:40px;height:40px;border-radius:12px;border:1px solid rgba(16,24,40,.12);position:relative;transition:transform .12s,box-shadow .15s;box-shadow:inset 0 1px #ffffff8c}.swatch:hover{transform:translateY(-2px)}.swatch:after{content:"";position:absolute;inset:-4px;border-radius:15px;border:2px solid transparent;transition:border-color .15s}.swatch[aria-checked=true]:after{border-color:var(--accent)}.swatch[aria-checked=true]{box-shadow:0 4px 12px -4px #10182847}.swatch span{display:none}.custom-color{display:flex;align-items:center;gap:9px;margin-top:12px;padding-top:11px;border-top:1px solid var(--line-2);font-size:12.5px;color:var(--ink-2)}.custom-color input[type=color]{width:30px;height:26px;padding:0;border:1px solid var(--line);border-radius:7px;background:#fff;cursor:pointer}.custom-color input[type=color]::-webkit-color-swatch-wrapper{padding:2px}.custom-color input[type=color]::-webkit-color-swatch{border:0;border-radius:5px}.custom-color code{font-size:11.5px;color:var(--ink-3);margin-left:auto}.slider-row{display:grid;grid-template-columns:56px minmax(0,1fr) 46px;align-items:center;gap:10px;margin-bottom:9px}.slider-row label{font-size:12.5px;color:var(--ink-2)}.slider-row output{font-size:11.5px;color:var(--ink-3);text-align:right;font-variant-numeric:tabular-nums}input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:18px;background:transparent;cursor:grab}input[type=range]:active{cursor:grabbing}input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:99px;background:linear-gradient(90deg,var(--accent) var(--fill, 50%),#e3e7ec var(--fill, 50%))}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:15px;height:15px;margin-top:-5.5px;border-radius:50%;background:#fff;border:1.5px solid var(--accent);box-shadow:0 1px 4px #10182838;transition:transform .12s}input[type=range]:active::-webkit-slider-thumb{transform:scale(1.12)}input[type=range]::-moz-range-track{height:4px;border-radius:99px;background:#e3e7ec}input[type=range]::-moz-range-progress{height:4px;border-radius:99px;background:var(--accent)}input[type=range]::-moz-range-thumb{width:13px;height:13px;border-radius:50%;background:#fff;border:1.5px solid var(--accent);box-shadow:0 1px 4px #10182838}input[type=range]:disabled{opacity:.45;cursor:not-allowed}input[type=range]:disabled::-webkit-slider-runnable-track{background:#e6e9f2}.mini-note{font-size:11.5px;color:var(--ink-3);line-height:1.5}.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid transparent;border-radius:8px;height:38px;padding:0 16px;font-size:13.5px;font-weight:600;letter-spacing:-.1px;transition:background .15s,border-color .15s,transform .1s,box-shadow .15s,opacity .15s;white-space:nowrap}.btn svg{width:16px;height:16px;flex:none}.btn:active{transform:translateY(.5px)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn-primary{color:#fff;background:var(--accent);border-color:var(--accent);box-shadow:0 6px 14px -9px #1381018c}.btn-primary:hover:not(:disabled){background:var(--accent-ink);border-color:var(--accent-ink)}.btn-ghost{color:var(--ink);background:var(--surface);border-color:var(--line);box-shadow:var(--shadow-sm)}.btn-ghost:hover:not(:disabled){border-color:#cfe0cb;background:#fff}.btn-lg{width:100%;height:44px;font-size:14.5px}.card-action{position:static}@media(min-height:1000px){.card-action{position:sticky;bottom:12px}}.sheet-row{display:flex;gap:8px;margin-top:8px}.sheet-row select{flex:1;min-width:0;height:38px;padding:0 10px;border-radius:8px;border:1px solid var(--line);background:var(--surface-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237a8499' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 8px center / 15px;appearance:none;font-size:12.5px;color:var(--ink-2);cursor:pointer}.sheet-row .btn{flex:none}#sheetNote{margin-top:9px}.tips{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin-top:22px}.tips article{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;box-shadow:var(--shadow-sm)}.tips h3{font-size:13px;font-weight:650;margin-bottom:9px;display:flex;align-items:center;gap:7px}.tips h3:before{content:"";width:3px;height:13px;border-radius:2px;background:var(--accent)}.tips ol,.tips ul{display:flex;flex-direction:column;gap:5px}.tips li{font-size:12.5px;color:var(--ink-2);padding-left:15px;position:relative}.tips li:before{content:"";position:absolute;left:4px;top:8.5px;width:4px;height:4px;border-radius:50%;background:#bcc7b9}.tips p{font-size:12.5px;color:var(--ink-2)}.tips b{color:var(--ink);font-weight:600}.foot{margin-top:26px;text-align:center;font-size:12px;color:var(--ink-3)}.foot a{color:var(--ink-2);text-decoration:none;border-bottom:1px solid var(--line)}.foot a:hover{color:var(--accent);border-bottom-color:currentColor}.foot-links{margin-top:7px;display:flex;align-items:center;justify-content:center;gap:8px;color:var(--ink-3)}.foot-links a{color:var(--ink-3);border-bottom-color:transparent}.foot-links a:hover{color:var(--accent);border-bottom-color:currentColor}.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,16px);padding:10px 18px;border-radius:999px;font-size:13px;font-weight:500;color:#fff;background:#1f2533f0;box-shadow:0 10px 30px -10px #00000080;opacity:0;pointer-events:none;transition:opacity .22s,transform .22s;max-width:calc(100vw - 40px);text-align:center;z-index:60;backdrop-filter:blur(6px)}.toast.show{opacity:1;transform:translate(-50%)}.toast.err{background:#c82028f2}@media(max-width:1040px){.workspace{grid-template-columns:minmax(0,1fr) 330px}.stage{position:static}}@media(max-width:880px){.site-bar-inner{padding:0 14px;gap:12px}.site-crumb{display:none}.site-brand{font-size:15.5px}.app{padding:16px 14px 40px}.workspace{grid-template-columns:minmax(0,1fr);gap:14px}.stage-canvas{min-height:0;padding:18px}.photo-frame{width:min(100%,300px)}.spec-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.card-action{position:static}.topbar-badges,.brand-text p,.stage-note{display:none}}@media(max-width:520px){.site-bar-inner{height:50px;padding:0 12px}.site-logo{width:26px;height:26px}.site-home{height:30px;padding:0 10px;font-size:12.5px}.spec-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.stage-canvas{min-height:0;padding:14px}.drop{padding:32px 18px}.photo-frame{width:min(100%,270px)}.processing{padding:26px 16px}.drop-tip{display:none}.slider-row{grid-template-columns:52px minmax(0,1fr) 42px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;transition-duration:.001ms!important}}