:root{--bg:#12141a;--bg-elevated:#1b1e27;--bg-hover:#232733;--border:#2e3342;--text:#e6e8ee;--text-dim:#9aa0b0;--accent:#4f8cff;--accent-hover:#6b9dff;--accent-skin:#0ea5e9;--accent-skin-hover:#38bdf8;--danger:#ff5c5c;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0;font-family:PingFang TC,Noto Sans TC,Microsoft JhengHei,-apple-system,system-ui,sans-serif;line-height:1.6}.app{flex-direction:column;max-width:960px;min-height:100vh;margin:0 auto;padding:1.5rem 1rem 3rem;display:flex}.app-header{text-align:center;flex-direction:column;align-items:center;margin-bottom:1.5rem;display:flex}.feature-nav{background:var(--bg-elevated);border:1px solid var(--border);border-radius:9999px;gap:.25rem;margin-bottom:1.25rem;padding:.3rem;display:inline-flex;box-shadow:0 4px 20px #00000040}.nav-tab-btn{color:var(--text-dim);cursor:pointer;background:0 0;border:1px solid #0000;border-radius:9999px;align-items:center;gap:.4rem;padding:.45rem 1.15rem;font-size:.95rem;font-weight:500;transition:all .2s;display:flex}.nav-tab-btn:hover:not(.active){color:var(--text);background:var(--bg-hover)}.nav-tab-btn.active{color:#fff;background:#283145;border-color:#4f8cff66;box-shadow:0 2px 8px #00000059}.tab-icon{font-size:1.05rem}.app-header h1{letter-spacing:-.02em;margin:0 0 .25rem;font-size:1.6rem}.subtitle,.hint-text{color:var(--text-dim);margin:.25rem 0;font-size:.875rem}.app-main{flex:1}.app-footer{text-align:center;color:var(--text-dim);margin-top:2rem;font-size:.8rem}.upload-zone{border:2px dashed var(--border);text-align:center;cursor:pointer;background:var(--bg-elevated);border-radius:12px;padding:3.5rem 1.5rem;transition:border-color .15s,background .15s}.upload-zone:hover,.upload-zone.dragging{border-color:var(--accent);background:var(--bg-hover)}.upload-icon{color:var(--text-dim);margin-bottom:.75rem}.upload-title{margin:0 0 .5rem;font-size:1.05rem}.upload-hint{color:var(--text-dim);margin:0;font-size:.85rem}.error-message{color:var(--danger);background:#ff5c5c1a;border:1px solid #ff5c5c59;border-radius:8px;margin:1rem 0 0;padding:.6rem .9rem;font-size:.9rem}.notice{color:var(--text-dim);background:var(--bg-elevated);border:1px solid var(--border);border-radius:8px;margin:0 0 1rem;padding:.5rem .9rem;font-size:.85rem}.skintone-intro-wrapper{flex-direction:column;align-items:center;display:flex}.feature-badge{color:var(--accent-skin-hover);background:#0ea5e926;border:1px solid #0ea5e959;border-radius:999px;margin-bottom:.6rem;padding:.25rem .75rem;font-size:.82rem;font-weight:600;display:inline-block}.intro-text{text-align:center;color:var(--text-dim);max-width:580px;margin:0 0 1.5rem;font-size:.9rem}button{font:inherit;color:var(--text);background:var(--bg-elevated);border:1px solid var(--border);cursor:pointer;border-radius:8px;padding:.5rem 1rem;transition:background .15s,border-color .15s}button:hover:not(:disabled){background:var(--bg-hover);border-color:var(--accent)}button:disabled{opacity:.45;cursor:not-allowed}button.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}button.primary:hover:not(:disabled){background:var(--accent-hover)}button.skin-primary-btn{background:var(--accent-skin);border-color:var(--accent-skin)}button.skin-primary-btn:hover:not(:disabled){background:var(--accent-skin-hover);border-color:var(--accent-skin-hover)}button.active{border-color:var(--accent);color:var(--accent)}.mode-selection-bar{background:var(--bg-elevated);border:1px solid var(--border);border-radius:10px;margin-bottom:.75rem;padding:.75rem 1rem}.direction-tabs{gap:.5rem;margin-bottom:.5rem;display:flex}.direction-btn{text-align:center;border:1px solid var(--border);background:var(--bg);color:var(--text-dim);border-radius:6px;flex:1;padding:.5rem .75rem;font-size:.88rem;font-weight:500;transition:all .15s}.direction-btn:hover{color:var(--text);border-color:var(--accent-skin)}.direction-btn.active{border-color:var(--accent-skin);color:#fff;background:#0ea5e92e;font-weight:600}.direction-hint{color:var(--text-dim);background:#0003;border-radius:4px;padding:.4rem .6rem;font-size:.8rem}.toolbar{background:var(--bg-elevated);border:1px solid var(--border);border-radius:10px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem 1.25rem;margin-bottom:.75rem;padding:.6rem .9rem;display:flex}.tool-selector{gap:.4rem;display:flex}.tool-btn{padding:.45rem .75rem;font-size:.85rem}.tool-btn.active{border-color:var(--accent-skin);color:#fff;background:#0ea5e933}.sample-indicator{border:1px solid var(--border);background:#00000040;border-radius:6px;align-items:center;gap:.5rem;padding:.35rem .7rem;font-size:.85rem;display:flex}.sample-label{color:var(--text-dim)}.sample-chip{align-items:center;gap:.4rem;display:flex}.color-dot{border:1px solid #fff6;border-radius:50%;width:16px;height:16px;display:inline-block;box-shadow:0 1px 4px #00000080}.sample-hex{color:#fff;font-family:monospace;font-weight:600}.sample-prompt{color:#f59e0b;font-style:italic}.sliders-bar{background:var(--bg-elevated);border:1px solid var(--border);border-radius:10px;flex-wrap:wrap;align-items:center;gap:.75rem 1.25rem;margin-bottom:.75rem;padding:.6rem .9rem;display:flex}.brush-control{white-space:nowrap;align-items:center;gap:.6rem;font-size:.86rem;display:flex}.brush-control input[type=range]{width:110px;accent-color:var(--accent)}.skin-tone-editor .brush-control input[type=range]{accent-color:var(--accent-skin)}.brush-value{color:var(--text-dim);font-variant-numeric:tabular-nums;min-width:3.2em;font-size:.82rem}.toolbar-buttons{flex-wrap:wrap;gap:.5rem;display:flex}.canvas-container{width:100%}.canvas-stack{border:1px solid var(--border);border-radius:8px;max-width:100%;position:relative;overflow:hidden}.base-canvas,.overlay-canvas{width:100%;height:auto;display:block}.overlay-canvas{cursor:crosshair;touch-action:none;position:absolute;inset:0}.overlay-canvas.erasing{cursor:cell}.overlay-canvas.eyedropper{cursor:copy}.action-bar{flex-wrap:wrap;justify-content:flex-end;gap:.75rem;margin-top:1rem;display:flex}.processing{text-align:center;padding:4rem 1rem}.spinner{border:4px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:44px;height:44px;margin:0 auto 1rem;animation:.9s linear infinite spin}.spinner.skin-spinner{border-top-color:var(--accent-skin)}@keyframes spin{to{transform:rotate(360deg)}}.compare-container{border:1px solid var(--border);cursor:ew-resize;touch-action:pan-y;-webkit-user-select:none;user-select:none;border-radius:8px;width:100%;position:relative;overflow:hidden}.compare-layer{width:100%;height:auto;display:block}.compare-clip{position:absolute;inset:0 auto 0 0;overflow:hidden}.compare-divider{pointer-events:none;background:#fff;width:2px;margin-left:-1px;position:absolute;top:0;bottom:0;box-shadow:0 0 6px #0009}.compare-label{pointer-events:none;background:#0000008c;border-radius:999px;padding:.15rem .6rem;font-size:.75rem;position:absolute;top:.6rem}.label-before{right:.6rem}.label-after{left:.6rem}.result-view .hint-text{text-align:center}.ai-magic-btn{color:#d8b4fe;background:linear-gradient(135deg,#9333ea40,#3b82f640);border:1px solid #a855f780;font-weight:600;transition:all .2s}.ai-magic-btn:hover:not(:disabled){color:#fff;background:linear-gradient(135deg,#9333ea73,#3b82f673);border-color:#c084fc;box-shadow:0 0 12px #a855f759}.bg-intro-wrapper{flex-direction:column;align-items:center;display:flex}.bg-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem 1rem;display:flex}.bg-selector,.manual-tools{flex-wrap:wrap;align-items:center;gap:.4rem;display:flex}.control-label{color:var(--text-dim);margin-right:.2rem;font-size:.85rem}.bg-chip-btn{border:1px solid var(--border);background:var(--bg);cursor:pointer;border-radius:6px;padding:.35rem .65rem;font-size:.82rem}.bg-chip-btn.active{border-color:var(--accent);background:var(--bg-hover);color:#fff;font-weight:600}.bg-chip-label{border:1px solid var(--border);background:var(--bg);cursor:pointer;border-radius:6px;align-items:center;gap:.3rem;padding:.35rem .65rem;font-size:.82rem;display:inline-flex}.bg-chip-label.active{border-color:var(--accent);color:#fff}.bg-chip-label input[type=color]{cursor:pointer;background:0 0;border:none;width:20px;height:20px;padding:0}.checkerboard-bg{background-color:#1a1d24;background-image:linear-gradient(45deg,#242833 25%,#0000 25%),linear-gradient(-45deg,#242833 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#242833 75%),linear-gradient(-45deg,#0000 75%,#242833 75%);background-position:0 0,0 10px,10px -10px,-10px 0;background-size:20px 20px}.bg-display-canvas{width:100%;height:auto;display:block}.checkerboard-bg.interactive .bg-display-canvas{cursor:crosshair;touch-action:none}.bg-primary-btn{background:#8b5cf6;border-color:#8b5cf6}.bg-primary-btn:hover:not(:disabled){background:#a78bfa;border-color:#a78bfa}.spinner.bg-spinner{border-top-color:#8b5cf6}@media (width<=680px){.direction-tabs{flex-direction:column}.sliders-bar{flex-direction:column;align-items:stretch}.brush-control{justify-content:space-between}.brush-control input[type=range]{flex:1;width:auto}}@media (width<=560px){.app{padding:1rem .75rem 2rem}.app-header h1{font-size:1.3rem}.nav-tab-btn{padding:.4rem .8rem;font-size:.88rem}.upload-zone{padding:2.5rem 1rem}.toolbar{flex-direction:column;align-items:stretch}.toolbar-buttons{justify-content:space-between}.toolbar-buttons button{flex:1}.action-bar{flex-direction:column-reverse}.action-bar button{width:100%;padding:.7rem 1rem}}.crop-modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:9999;background:#0a0e17d9;justify-content:center;align-items:center;padding:1.5rem;animation:.2s ease-out fadeIn;display:flex;position:fixed;inset:0}.crop-modal-content{background:#181d28;border:1px solid #ffffff1f;border-radius:16px;flex-direction:column;width:100%;max-width:960px;max-height:90vh;display:flex;overflow:hidden;box-shadow:0 24px 64px #0009}.crop-modal-header{background:#141822;border-bottom:1px solid #ffffff14;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;padding:1rem 1.5rem;display:flex}.crop-title-group{align-items:center;gap:.75rem;display:flex}.crop-modal-title{color:#fff;font-size:1.1rem;font-weight:700}.crop-dimensions{color:#79a8ff;background:#4f8cff26;border:1px solid #4f8cff4d;border-radius:6px;padding:.2rem .6rem;font-family:monospace;font-size:.82rem}.crop-aspect-buttons{background:#0d1117;border:1px solid #ffffff0f;border-radius:8px;gap:.35rem;padding:.25rem;display:flex}.crop-ratio-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;border-radius:6px;padding:.3rem .7rem;font-size:.82rem;transition:all .15s}.crop-ratio-btn:hover{color:#fff;background:#ffffff0f}.crop-ratio-btn.active{color:#fff;background:#2f4575;font-weight:600}.crop-stage{-webkit-user-select:none;user-select:none;touch-action:none;background:#0b0f17;flex:1;min-height:380px;max-height:calc(85vh - 150px);position:relative;overflow:hidden}.crop-source-image,.crop-source-canvas{pointer-events:none;background-image:linear-gradient(45deg,#181d28 25%,#0000 25%),linear-gradient(-45deg,#181d28 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#181d28 75%),linear-gradient(-45deg,#0000 75%,#181d28 75%);background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px;position:absolute;box-shadow:0 4px 20px #00000080}.crop-scrim{pointer-events:none;background:#000000a6;position:absolute}.crop-box{box-sizing:border-box;cursor:move;touch-action:none;border:2px solid #4f8cff;position:absolute;box-shadow:0 0 0 1px #0006}.crop-grid-line{pointer-events:none;background:#ffffff40;position:absolute}.crop-grid-h1{height:1px;top:33.333%;left:0;right:0}.crop-grid-h2{height:1px;top:66.666%;left:0;right:0}.crop-grid-v1{width:1px;top:0;bottom:0;left:33.333%}.crop-grid-v2{width:1px;top:0;bottom:0;left:66.666%}.crop-handle{touch-action:none;background:#fff;border:2px solid #3b82f6;border-radius:2px;width:12px;height:12px;position:absolute;box-shadow:0 2px 4px #0006}.crop-handle.nw{cursor:nwse-resize;top:-6px;left:-6px}.crop-handle.n{cursor:ns-resize;top:-6px;left:calc(50% - 6px)}.crop-handle.ne{cursor:nesw-resize;top:-6px;right:-6px}.crop-handle.e{cursor:ew-resize;top:calc(50% - 6px);right:-6px}.crop-handle.se{cursor:nwse-resize;bottom:-6px;right:-6px}.crop-handle.s{cursor:ns-resize;bottom:-6px;left:calc(50% - 6px)}.crop-handle.sw{cursor:nesw-resize;bottom:-6px;left:-6px}.crop-handle.w{cursor:ew-resize;top:calc(50% - 6px);left:-6px}.crop-modal-footer{background:#141822;border-top:1px solid #ffffff14;justify-content:flex-end;gap:.75rem;padding:1rem 1.5rem;display:flex}.mode-toggle-group{background:#0d1117cc;border:1px solid #ffffff14;border-radius:8px;gap:.2rem;padding:.2rem;display:flex}.mode-chip-btn{color:#94a3b8;cursor:pointer;white-space:nowrap;background:0 0;border:none;border-radius:6px;padding:.35rem .65rem;font-size:.82rem;font-weight:500;transition:all .15s}.mode-chip-btn:hover{color:#fff;background:#ffffff0f}.mode-chip-btn.active{color:#fff;background:#2563eb;font-weight:600;box-shadow:0 2px 8px #2563eb66}.detected-badge{letter-spacing:.02em;border-radius:20px;align-items:center;padding:.25rem .75rem;font-size:.8rem;font-weight:600;display:inline-flex}.detected-badge.portrait{color:#60a5fa;background:#3b82f62e;border:1px solid #3b82f659}.detected-badge.object{color:#c084fc;background:#a855f72e;border:1px solid #a855f759}.dual-upload-wrapper{text-align:center;max-width:980px;margin:0 auto}.dual-cards-container{flex-wrap:wrap;justify-content:center;align-items:center;gap:1.5rem;margin:2rem 0;display:flex}.dual-upload-card{cursor:pointer;background:#141824;border:2px dashed #ffffff26;border-radius:16px;flex-direction:column;flex:1;justify-content:center;align-items:center;min-width:280px;max-width:420px;min-height:240px;padding:1.5rem;transition:all .2s;display:flex;position:relative}.dual-upload-card:hover{background:#171d2b;border-color:#4f8cff}.dual-upload-card.dragging{background:#3b82f61a;border-color:#3b82f6}.dual-upload-card.loaded{cursor:default;border-style:solid;border-color:#fff3}.card-badge{color:#fff;background:#2563eb;border-radius:6px;padding:.2rem .6rem;font-size:.75rem;font-weight:700;position:absolute;top:1rem;left:1rem}.card-role-hint{color:#94a3b8;font-size:.78rem;position:absolute;top:1.1rem;right:1rem}.card-empty{flex-direction:column;align-items:center;gap:.75rem;margin-top:1rem;display:flex}.upload-emoji{font-size:2.8rem}.upload-tip{color:#cbd5e1;font-size:.95rem;font-weight:500}.card-preview{flex-direction:column;align-items:center;gap:.75rem;width:100%;margin-top:1.2rem;display:flex}.thumbnail-img{object-fit:contain;background:#0d1117;border:1px solid #ffffff1a;border-radius:8px;max-width:160px;max-height:140px}.card-info{flex-direction:column;align-items:center;gap:.2rem;display:flex}.card-info .file-name{color:#e2e8f0;text-overflow:ellipsis;white-space:nowrap;max-width:240px;font-size:.85rem;font-weight:600;overflow:hidden}.card-info .file-size{color:#94a3b8;font-family:monospace;font-size:.75rem}.card-remove-btn{color:#f87171;cursor:pointer;background:#ef444426;border:1px solid #ef44444d;border-radius:6px;padding:.3rem .8rem;font-size:.8rem;transition:all .15s}.card-remove-btn:hover{color:#fff;background:#ef44444d}.dual-swap-divider{flex-direction:column;align-items:center;gap:.35rem;display:flex}.swap-circle-btn{color:#e2e8f0;cursor:pointer;background:#1e293b;border:2px solid #ffffff26;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;font-size:1.3rem;transition:all .2s;display:flex}.swap-circle-btn:hover:not(:disabled){color:#fff;background:#3b82f6;border-color:#60a5fa;transform:rotate(180deg)}.swap-circle-btn:disabled{opacity:.4;cursor:not-allowed}.swap-hint{color:#64748b;font-size:.75rem}.merge-launch-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#3b82f6 0%,#8b5cf6 100%);border:none;border-radius:12px;padding:.8rem 2.2rem;font-size:1.05rem;font-weight:700;transition:all .2s;box-shadow:0 8px 24px #3b82f64d}.merge-launch-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 12px 32px #8b5cf666}.merge-launch-btn:disabled{opacity:.4;cursor:not-allowed;box-shadow:none}.merge-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;display:flex}.merge-sliders{background:#141822;border:1px solid #ffffff0f;border-radius:12px;flex-wrap:wrap;align-items:center;gap:1.25rem;margin-bottom:1rem;padding:.75rem 1.25rem;display:flex}.checkbox-control{color:#cbd5e1;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:.4rem;font-size:.88rem;display:inline-flex}.checkbox-control input[type=checkbox]{accent-color:#8b5cf6;cursor:pointer;width:16px;height:16px}.merge-primary-btn{background:linear-gradient(135deg,#2563eb 0%,#7c3aed 100%);border:none}.merge-display-canvas{touch-action:none;display:block}.headswap-upload-wrapper,.headswap-viewer-wrapper{flex-direction:column;align-items:center;width:100%;max-width:1100px;margin:0 auto;display:flex}.headswap-cards-grid{grid-template-columns:1fr 60px 1fr;align-items:center;gap:20px;width:100%;margin:24px 0 16px;display:grid}@media (width<=820px){.headswap-cards-grid{grid-template-columns:1fr;gap:16px}.headswap-swap-col{order:2;margin:8px auto}}.headswap-card-box{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#1a1f2eb3;border:1px solid #ffffff14;border-radius:16px;flex-direction:column;padding:18px;transition:border-color .2s,box-shadow .2s;display:flex;box-shadow:0 8px 32px #00000040}.headswap-card-box:hover{border-color:#6366f159;box-shadow:0 12px 36px #6366f11a}.headswap-card-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.headswap-card-header .card-badge{color:#fff;letter-spacing:.5px;background:linear-gradient(135deg,#6366f1 0%,#4f46e5 100%);border-radius:20px;padding:4px 12px;font-size:13px;font-weight:600;position:static}.headswap-card-header .card-badge.target{background:linear-gradient(135deg,#8b5cf6 0%,#6d28d9 100%)}.headswap-card-header .card-hint{color:#94a3b8;font-size:12px}.headswap-dropzone{cursor:pointer;background:#0f172a73;border:2px dashed #ffffff24;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;min-height:240px;transition:all .2s;display:flex;position:relative;overflow:hidden}.headswap-dropzone:hover{background:#6366f10d;border-color:#6366f1}.headswap-dropzone.dragging{background:#a855f71f;border-color:#a855f7;transform:scale(.99)}.headswap-dropzone.loaded{cursor:default;background:#0f172ab3;border-style:solid;border-color:#6366f14d;padding:12px}.headswap-dropzone .card-empty{flex-direction:column;align-items:center;gap:8px;padding:24px;display:flex}.headswap-dropzone .upload-emoji{font-size:44px}.headswap-dropzone .upload-title{color:#f1f5f9;margin:0;font-size:15px;font-weight:600}.headswap-dropzone .upload-sub{color:#64748b;margin:0;font-size:12px}.headswap-swap-col{flex-direction:column;justify-content:center;align-items:center;gap:6px;display:flex}.headswap-swap-col .swap-circle-btn{color:#cbd5e1;cursor:pointer;background:#1e293b;border:1px solid #ffffff26;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;font-size:18px;transition:all .2s;display:flex}.headswap-swap-col .swap-circle-btn:hover:not(:disabled){color:#fff;background:#6366f1;border-color:#6366f1;transform:rotate(180deg)}.headswap-swap-col .swap-hint{color:#64748b;white-space:nowrap;font-size:11px}.presets-row{border-top:1px solid #ffffff0f;flex-direction:column;gap:8px;margin-top:14px;padding-top:12px;display:flex}.presets-label{color:#94a3b8;font-size:12px;font-weight:500}.presets-items{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.preset-btn{cursor:pointer;background:#1e293b99;border:1px solid #ffffff14;border-radius:10px;flex-direction:column;align-items:center;gap:4px;padding:6px 4px;transition:all .2s;display:flex}.preset-btn:hover{background:#6366f133;border-color:#6366f1;transform:translateY(-2px)}.preset-thumb{object-fit:cover;border-radius:8px;width:48px;height:48px}.preset-name{color:#cbd5e1;white-space:nowrap;text-overflow:ellipsis;max-width:100%;font-size:11px;overflow:hidden}.headswap-action-footer{flex-direction:column;align-items:center;gap:12px;width:100%;margin-top:12px;display:flex}.headswap-generate-btn{color:#fff;cursor:pointer;letter-spacing:.5px;background:linear-gradient(135deg,#6366f1 0%,#a855f7 50%,#ec4899 100%);border:none;border-radius:14px;width:100%;max-width:440px;padding:16px 32px;font-size:17px;font-weight:700;transition:all .2s;box-shadow:0 8px 24px #a855f759}.headswap-generate-btn:hover:not(:disabled){filter:brightness(1.08);transform:translateY(-2px);box-shadow:0 12px 32px #a855f780}.headswap-generate-btn:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}.privacy-guarantee-hint{color:#64748b;text-align:center;margin:0;font-size:12px}.headswap-top-nav{background:#0f172ab3;border:1px solid #ffffff14;border-radius:14px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;width:100%;margin-bottom:14px;padding:12px 18px;display:flex}.headswap-top-nav .status-indicator{align-items:center;gap:8px;display:flex}.headswap-top-nav .sparkle-icon{font-size:18px}.headswap-top-nav .status-label{color:#f1f5f9;font-size:14px;font-weight:600}.headswap-top-nav .detected-tag{color:#4ade80;background:#22c55e26;border:1px solid #22c55e4d;border-radius:12px;padding:2px 8px;font-size:12px}.headswap-top-nav .detected-tag.fallback{color:#fde047;background:#eab30826;border-color:#eab3084d}.top-nav-actions{align-items:center;gap:10px;display:flex}.btn-toggle-compare{color:#cbd5e1;cursor:pointer;background:#1e293b;border:1px solid #ffffff1f;border-radius:8px;padding:6px 14px;font-size:13px;transition:all .2s}.btn-toggle-compare.active{color:#a5b4fc;background:#6366f133;border-color:#6366f1}.btn-nav-outline{color:#cbd5e1;cursor:pointer;background:0 0;border:1px solid #ffffff26;border-radius:8px;padding:6px 14px;font-size:13px;transition:all .2s}.btn-nav-outline:hover{background:#ffffff14}.btn-nav-danger{color:#fca5a5;cursor:pointer;background:#ef44441a;border:1px solid #ef444440;border-radius:8px;padding:6px 14px;font-size:13px;transition:all .2s}.btn-nav-danger:hover{background:#ef444440}.headswap-controls-bar{background:#0f172a99;border:1px solid #ffffff0f;border-radius:12px;flex-wrap:wrap;align-items:center;gap:16px;width:100%;margin-bottom:14px;padding:12px 18px;display:flex}.ctrl-item{color:#cbd5e1;align-items:center;gap:8px;font-size:13px;display:flex}.ctrl-item.ctrl-mini{gap:4px}.ctrl-name{color:#94a3b8;white-space:nowrap;font-weight:500}.ctrl-val{color:#a5b4fc;min-width:38px;font-family:monospace;font-size:12px}.ctrl-checkbox-item{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:6px;display:flex}.ctrl-checkbox-item input[type=checkbox]{accent-color:#6366f1;cursor:pointer;width:16px;height:16px}.ctrl-checkbox-label{color:#cbd5e1;font-size:13px;font-weight:500}.drag-hint-tip{color:#64748b;margin-left:auto;font-size:12px}.headswap-canvas-viewport{background:#090d16;border:1px solid #ffffff14;border-radius:16px;justify-content:center;align-items:center;width:100%;min-height:480px;padding:16px;display:flex;box-shadow:inset 0 2px 12px #00000080}.headswap-canvas-stage{max-width:100%;position:relative}.headswap-canvas-stage.interactive{cursor:grab}.headswap-canvas-stage.interactive:active{cursor:grabbing}.headswap-interactive-canvas{border-radius:8px;display:block;box-shadow:0 8px 30px #0006}.headswap-download-footer{flex-direction:column;align-items:center;gap:10px;width:100%;margin-top:18px;display:flex}.btn-download-headswap{color:#fff;cursor:pointer;background:linear-gradient(135deg,#22c55e 0%,#16a34a 100%);border:none;border-radius:12px;padding:14px 36px;font-size:16px;font-weight:700;transition:all .2s;box-shadow:0 6px 20px #22c55e59}.btn-download-headswap:hover{filter:brightness(1.08);transform:translateY(-2px);box-shadow:0 10px 28px #22c55e73}.zero-history-note{color:#64748b;text-align:center;margin:0;font-size:12px}.headswap-loading-box{flex-direction:column;justify-content:center;align-items:center;gap:12px;width:100%;padding:60px 20px;display:flex}.headswap-loading-box .loading-title{color:#f1f5f9;margin:0;font-size:16px;font-weight:600}.headswap-loading-box .loading-sub{color:#64748b;margin:0;font-size:13px}.ctrl-flip-btn{color:#cbd5e1;cursor:pointer;-webkit-user-select:none;user-select:none;background:#ffffff12;border:1px solid #ffffff26;border-radius:8px;align-items:center;gap:5px;padding:5px 12px;font-size:13px;font-weight:500;transition:all .2s;display:inline-flex}.ctrl-flip-btn:hover{color:#e0e7ff;background:#6366f12e;border-color:#6366f166}.ctrl-flip-btn.active{color:#fff;background:linear-gradient(135deg,#6366f1,#8b5cf6);border-color:#a5b4fc;box-shadow:0 0 12px #6366f173}.ctrl-flip-btn .flip-icon{font-size:14px}.card-actions-group{align-items:center;gap:6px;margin-left:auto;display:flex}.card-action-btn{cursor:pointer;border-radius:6px;padding:4px 10px;font-size:12px;font-weight:500;transition:all .2s}.card-action-btn.crop-btn{color:#7dd3fc;background:#0ea5e926;border:1px solid #0ea5e959}.card-action-btn.crop-btn:hover{color:#fff;background:#0ea5e94d;border-color:#38bdf8}.card-action-btn.remove-btn{color:#fca5a5;background:#ef444426;border:1px solid #ef44444d}.card-action-btn.remove-btn:hover{color:#fff;background:#ef44444d}.highlight-gif{color:#38bdf8;font-weight:600}.gif-badge-tip{color:#7dd3fc;text-align:center;background:#0ea5e91f;border:1px solid #0ea5e959;border-radius:8px;margin-bottom:12px;padding:8px 16px;font-size:13px;font-weight:500}.gif-progress-bar-wrap{background:#ffffff1a;border-radius:4px;width:240px;height:8px;margin:12px auto 6px;overflow:hidden}.gif-progress-bar-fill{background:linear-gradient(90deg,#38bdf8,#818cf8);border-radius:4px;height:100%;transition:width .1s linear}.gif-progress-counter{color:#a5b4fc;margin-bottom:6px;font-family:monospace;font-size:13px}.gif-live-badge{color:#6ee7b7;text-align:center;background:#10b98126;border:1px solid #10b9814d;border-radius:8px;margin-bottom:12px;padding:6px 14px;font-size:13px}.gifmaker-container{width:100%;max-width:960px;margin:0 auto}.gifmaker-empty-dropzone{justify-content:center;align-items:center;min-height:380px;display:flex}.gifmaker-drop-box{text-align:center;cursor:pointer;background:#0f172a99;border:2px dashed #ffffff2e;border-radius:18px;width:100%;max-width:680px;padding:48px 24px;transition:all .2s}.gifmaker-drop-box:hover{background:#0ea5e914;border-color:#38bdf8}.gifmaker-drop-box .drop-icon{margin-bottom:12px;font-size:54px}.gifmaker-drop-box h3{color:#f1f5f9;margin-bottom:8px;font-size:18px;font-weight:600}.gifmaker-drop-box .drop-sub{color:#94a3b8;margin-bottom:20px;font-size:13px}.btn-demo-preset{color:#a5b4fc;cursor:pointer;background:#6366f126;border:1px solid #6366f166;border-radius:20px;padding:8px 18px;font-size:13px;font-weight:500;transition:all .2s}.btn-demo-preset:hover{color:#fff;background:#6366f14d}.gifmaker-workspace{flex-direction:column;gap:18px;display:flex}.gifmaker-preview-section{background:#090d16;border:1px solid #ffffff14;border-radius:16px;flex-direction:column;align-items:center;padding:18px;display:flex}.gifmaker-status-header{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;margin-bottom:14px;display:flex}.interpolated-badge{color:#a5b4fc;background:#6366f133;border:1px solid #6366f166;border-radius:20px;padding:5px 14px;font-size:13px;font-weight:600}.raw-badge{color:#94a3b8;background:#ffffff14;border-radius:20px;padding:5px 14px;font-size:13px}.computing-badge{color:#fbbf24;background:#f59e0b26;border:1px solid #f59e0b59;border-radius:12px;padding:4px 10px;font-family:monospace;font-size:12px}.gifmaker-canvas-wrap{background:#00000059;border-radius:12px;justify-content:center;align-items:center;width:100%;max-width:480px;height:320px;margin-bottom:16px;display:flex;overflow:hidden}.gifmaker-preview-canvas{object-fit:contain;max-width:100%;max-height:100%;box-shadow:0 4px 20px #00000080}.gifmaker-playback-controls{flex-wrap:wrap;justify-content:center;align-items:center;gap:16px;width:100%;display:flex}.btn-play-pause{color:#fff;cursor:pointer;background:#3b82f6;border:none;border-radius:8px;padding:8px 18px;font-size:13px;font-weight:600;transition:background .2s}.btn-play-pause:hover{background:#2563eb}.control-slider-group{color:#cbd5e1;align-items:center;gap:8px;font-size:13px;display:flex}.control-slider-group input[type=range]{accent-color:#38bdf8;width:120px}.slider-val{color:#38bdf8;min-width:90px;font-family:monospace;font-size:12px}.mode-toggle-group{background:#ffffff0f;border-radius:8px;gap:4px;padding:3px;display:flex}.btn-mode-pill{color:#94a3b8;cursor:pointer;background:0 0;border:none;border-radius:6px;padding:5px 12px;font-size:12px;transition:all .2s}.btn-mode-pill.active{color:#fff;background:#475569;font-weight:600}.scrub-indicator{color:#94a3b8;font-family:monospace;font-size:12px}.gifmaker-ai-panel{background:#1e293b80;border:1px solid #6366f14d;border-radius:14px;padding:16px 20px}.ai-panel-header{flex-direction:column;gap:4px;margin-bottom:14px;display:flex}.switch-label{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:8px;display:inline-flex}.switch-label input[type=checkbox]{accent-color:#6366f1;width:18px;height:18px}.switch-text{color:#e0e7ff;font-size:15px;font-weight:600}.ai-desc{color:#94a3b8;margin-left:26px;font-size:12px}.ai-controls-row{border-top:1px solid #ffffff14;flex-wrap:wrap;align-items:center;gap:24px;margin-left:26px;padding-top:10px;display:flex}.ai-param-item{color:#cbd5e1;align-items:center;gap:8px;font-size:13px;display:flex}.ai-param-item input[type=range]{accent-color:#6366f1;width:130px}.param-name{color:#94a3b8;font-weight:500}.param-value{color:#a5b4fc;min-width:45px;font-family:monospace;font-size:13px}.gifmaker-timeline-section{background:#111827;border:1px solid #ffffff14;border-radius:16px;padding:18px}.timeline-header{justify-content:space-between;align-items:center;margin-bottom:14px;display:flex}.timeline-title-row h4{color:#f3f4f6;margin-bottom:2px;font-size:15px}.timeline-hint{color:#64748b;font-size:12px}.timeline-actions{gap:8px;display:flex}.btn-add-more{color:#38bdf8;cursor:pointer;background:#38bdf826;border:1px solid #38bdf859;border-radius:6px;padding:5px 12px;font-size:12px;font-weight:500}.btn-add-more:hover{background:#38bdf840}.btn-clear-all{color:#fca5a5;cursor:pointer;background:#ef444426;border:1px solid #ef44444d;border-radius:6px;padding:5px 12px;font-size:12px}.timeline-frames-track{gap:12px;padding-bottom:12px;display:flex;overflow-x:auto}.timeline-frame-card{background:#1e293b;border:2px solid #0000;border-radius:10px;flex-direction:column;flex:0 0 110px;align-items:center;padding:8px;transition:all .2s;display:flex;position:relative}.timeline-frame-card.keyframe{border-color:#6366f159}.timeline-frame-card:hover{border-color:#38bdf880}.timeline-frame-card.current{border-color:#38bdf8;box-shadow:0 0 10px #38bdf84d}.frame-badge{color:#cbd5e1;background:#0009;border-radius:4px;padding:2px 6px;font-family:monospace;font-size:10px;position:absolute;top:4px;left:4px}.frame-thumb{object-fit:cover;border-radius:6px;width:90px;height:90px;margin-bottom:8px}.frame-actions{justify-content:center;gap:4px;width:100%;display:flex}.frame-actions button{color:#94a3b8;cursor:pointer;background:#ffffff14;border:none;border-radius:4px;justify-content:center;align-items:center;width:26px;height:24px;font-size:11px;display:flex}.frame-actions button:hover:not(:disabled){color:#fff;background:#334155}.frame-actions button.btn-del-frame:hover{color:#fff;background:#ef4444}.gifmaker-export-bar{border-top:1px solid #ffffff14;justify-content:space-between;align-items:center;margin-top:18px;padding-top:14px;display:flex}.btn-export-gif{color:#fff;cursor:pointer;background:linear-gradient(135deg,#0ea5e9,#6366f1);border:none;border-radius:8px;padding:10px 24px;font-size:14px;font-weight:600;transition:all .2s;box-shadow:0 4px 14px #0ea5e959}.btn-export-gif:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 18px #0ea5e980}.privacy-pill{color:#64748b;font-size:12px}
