.sb-face-difference-dialog { width:min(1120px,calc(100vw - 30px)); height:min(900px,calc(100vh - 30px)); }
.sb-face-difference-dialog [hidden] { display:none!important; }
.sb-face-difference-body { display:grid; grid-template-columns:minmax(0,1fr); flex:1 1 auto; min-height:0; overflow:hidden; background:#17181a; }
.sb-face-difference-stage { position:relative; display:grid; box-sizing:border-box; width:100%; height:100%; place-items:center; min-width:0; min-height:0; padding:18px; overflow:hidden; background-color:#e9e9ed; background-image:linear-gradient(45deg,#dedee3 25%,transparent 25%),linear-gradient(-45deg,#dedee3 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#dedee3 75%),linear-gradient(-45deg,transparent 75%,#dedee3 75%); background-size:20px 20px; background-position:0 0,0 10px,10px -10px,-10px 0; }
.sb-face-difference-stage canvas { display:block; max-width:none; max-height:none; background:#fff; box-shadow:0 18px 52px rgba(0,0,0,.24); touch-action:none; }
.sb-face-difference-stage > [data-status] { position:absolute; left:50%; top:18px; z-index:13; max-width:min(520px,calc(100% - 180px)); margin:0; padding:7px 11px; overflow:hidden; border:1px solid rgba(255,255,255,.16); border-radius:9px; background:rgba(25,25,27,.8); color:rgba(255,255,255,.86); font-size:11px; font-weight:500; line-height:1.35; text-align:center; text-overflow:ellipsis; white-space:nowrap; box-shadow:0 7px 22px rgba(0,0,0,.2); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); transform:translateX(-50%); pointer-events:none; }
.sb-face-difference-stage > [data-status].is-guide { display:flex; align-items:center; gap:9px; max-width:calc(100% - 48px); padding:8px 13px 8px 9px; overflow:visible; border-color:rgba(255,255,255,.66); border-radius:16px; background:rgba(24,24,26,.86); color:#fff; text-align:left; white-space:normal; box-shadow:0 9px 30px rgba(0,0,0,.26),0 0 0 1px rgba(255,213,74,.14); }
.sb-face-status-step { display:grid; width:24px; height:24px; flex:0 0 24px; place-items:center; border-radius:50%; background:#ffd54a; color:#2d260d; font-size:12px; font-weight:800; box-shadow:0 0 0 3px rgba(255,213,74,.12); }
.sb-face-status-copy { display:flex; min-width:0; flex-direction:column; gap:1px; }
.sb-face-status-copy strong,.sb-face-status-copy small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sb-face-status-copy strong { color:#fff; font-size:12px; font-weight:750; line-height:1.2; }
.sb-face-status-copy small { color:rgba(255,255,255,.78); font-size:12px; font-weight:500; line-height:1.3; }
.sb-face-difference-stage > [data-status]:not(.is-guide) .sb-face-status-copy small { color:inherit; font-size:inherit; font-weight:inherit; line-height:inherit; }
.sb-face-preview-actions:not([hidden]) ~ [data-status] { display:none!important; }
.sb-face-difference-stage.has-compare > [data-status] { top:58px; }
.sb-face-difference-overlay[data-face-step="mask"] .sb-face-difference-stage > [data-status] { top:18px; }
.sb-face-difference-overlay[data-face-step="select"] .sb-face-difference-stage canvas { cursor:crosshair; }
.sb-face-difference-stage .sb-region-compare-btn { right:18px; top:18px; bottom:auto; z-index:14; }
.sb-face-background-actions { position:absolute; left:50%; bottom:14px; z-index:14; transform:translateX(-50%); }
.sb-face-difference-stage.has-preview-actions .sb-face-background-actions { bottom:64px; }
.sb-face-background-actions .sb-region-background-action { min-width:132px; min-height:42px; padding:0 24px; border-color:#e1ac00; background:linear-gradient(180deg,#ffe477 0%,#ffd13f 52%,#f0b900 100%); color:#332600; box-shadow:0 4px 14px rgba(225,172,0,.24),inset 0 1px 0 rgba(255,255,255,.58); }
.sb-face-background-actions .sb-region-background-action:hover:not(:disabled) { border-color:#d59f00; background:linear-gradient(180deg,#ffea8e 0%,#ffd84f 52%,#f4c20a 100%); }
.sb-face-background-actions .sb-region-background-action:active:not(:disabled) { transform:scale(.96); box-shadow:0 1px 4px rgba(225,172,0,.2),inset 0 1px 0 rgba(255,255,255,.4); }
.sb-face-preview-actions { position:absolute; left:50%; bottom:14px; z-index:14; display:flex; align-items:center; gap:7px; max-width:calc(100% - 24px); transform:translateX(-50%); }
.sb-face-preview-actions .sb-face-reset-all { min-width:104px; border-color:rgba(200,62,52,.32); background:#fff1f1; color:#b24a50; font-weight:680; }
.sb-face-preview-actions .sb-face-reset-all:hover:not(:disabled) { border-color:rgba(200,62,52,.5); background:#ffe5e5; }
.sb-face-preview-actions .sb-face-reset-all:active:not(:disabled) { background:#ffd9d9; }
.sb-face-preview-actions .sb-face-apply { min-width:132px; }
.sb-face-preview-actions .sb-face-apply:disabled { opacity:.48; cursor:not-allowed; box-shadow:none; }
.sb-face-region-actions { position:absolute; z-index:15; inset:0; padding:0; pointer-events:none; }
.sb-face-region-action-group { position:absolute; display:flex; gap:4px; pointer-events:auto; transform:translate(-50%,calc(-100% - 12px)); }
.sb-face-region-actions .sb-btn { min-height:25px; padding:0 7px; border-radius:7px; background:rgba(250,250,252,.96); color:#45454a; font-size:9px; font-weight:680; white-space:nowrap; box-shadow:0 3px 9px rgba(23,24,28,.16); transition:transform .15s ease,background .15s ease,border-color .15s ease,box-shadow .15s ease; }
.sb-face-region-actions .sb-btn:hover:not(:disabled) { border-color:rgba(20,20,24,.28); background:#fff; transform:scale(1.025); box-shadow:0 5px 12px rgba(23,24,28,.2); }
.sb-face-region-actions .sb-btn:active:not(:disabled) { transform:translateY(1px) scale(.96); }
.sb-face-region-actions [data-region-action="retry"] { border-color:#e5c35a; background:#fff6cf; color:#654d00; }
.sb-face-region-actions [data-region-action="retry"]:hover:not(:disabled) { border-color:#d6ad2d; background:#ffefae; }
.sb-face-target-actions { position:absolute; z-index:15; display:flex; box-sizing:border-box; width:92px; max-width:calc(100% - 20px); flex-direction:column; gap:6px; padding:0; overflow:visible; border:0; background:transparent; box-shadow:none; pointer-events:auto; transform:translate(-50%,-50%); }
.sb-face-target-choice { display:grid; width:100%; min-height:43px; flex:1 1 50%; grid-template-columns:minmax(0,1fr); align-items:center; padding:5px 4px; border:1px solid rgba(255,255,255,.58); border-radius:10px; background:rgba(248,248,250,.94); color:#29292d; box-shadow:0 6px 18px rgba(23,24,28,.2),0 1px 4px rgba(23,24,28,.1); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); font:inherit; text-align:center; cursor:pointer; transition:background .15s ease,border-color .15s ease,box-shadow .15s ease,color .15s ease; }
.sb-face-target-choice:hover { border-color:rgba(229,195,90,.72); background:rgba(255,246,207,.96); box-shadow:0 7px 20px rgba(23,24,28,.22),0 1px 4px rgba(23,24,28,.1); }
.sb-face-target-choice:active { background:rgba(255,239,174,.96); }
.sb-face-target-choice:focus-visible { outline:2px solid #e6b719; outline-offset:-2px; }
.sb-face-target-choice-copy { display:flex; min-width:0; align-items:center; flex-direction:column; gap:1px; text-align:center; }
.sb-face-target-choice-copy strong,.sb-face-target-choice-copy small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; letter-spacing:0; }
.sb-face-target-choice-copy strong { font-size:11px; font-weight:750; line-height:1.25; }
.sb-face-target-choice-copy small { color:#77777d; font-size:9px; font-weight:520; line-height:1.3; }
.sb-face-target-actions.is-compact { gap:4px; }
.sb-face-target-actions.is-compact .sb-face-target-choice { min-height:35px; padding:4px 6px; border-radius:8px; }
.sb-face-target-actions.is-compact .sb-face-target-choice strong { font-size:10px; }
.sb-face-target-actions.is-compact .sb-face-target-choice small { font-size:8px; white-space:normal; }
.sb-face-target-actions.is-tight { gap:2px; }
.sb-face-target-actions.is-tight .sb-face-target-choice { min-height:20px; padding:2px 4px; border-radius:6px; text-align:center; }
.sb-face-target-actions.is-tight .sb-face-target-choice small { display:none; }
.sb-face-selection-tutorial { position:absolute; z-index:11; left:50%; top:42px; display:flex; align-items:center; gap:9px; max-width:calc(100% - 48px); padding:8px 13px 8px 9px; border:1px solid rgba(255,255,255,.66); border-radius:16px; background:rgba(30,30,32,.72); color:#fff; box-shadow:0 6px 20px rgba(0,0,0,.18); backdrop-filter:blur(12px); transform:translateX(-50%); pointer-events:none; }
.sb-face-difference-stage.has-status .sb-face-selection-tutorial { top:58px; }
.sb-face-selection-tutorial-step { display:grid; width:24px; height:24px; flex:0 0 24px; place-items:center; border-radius:50%; background:#ffd54a; color:#2d260d; font-size:12px; font-weight:800; box-shadow:0 0 0 3px rgba(255,213,74,.12); }
.sb-face-selection-tutorial-copy { display:flex; min-width:0; flex-direction:column; gap:1px; }
.sb-face-selection-tutorial-copy strong,.sb-face-selection-tutorial-copy small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sb-face-selection-tutorial-copy strong { font-size:12px; font-weight:750; line-height:1.2; }
.sb-face-selection-tutorial-copy small { color:rgba(255,255,255,.78); font-size:12px; font-weight:500; line-height:1.3; }
.sb-face-mask-guide { position:absolute; z-index:13; left:50%; top:18px; display:flex; align-items:center; gap:9px; max-width:calc(100% - 48px); padding:8px 13px 8px 9px; border:1px solid rgba(255,255,255,.66); border-radius:16px; background:rgba(24,24,26,.86); color:#fff; box-shadow:0 9px 30px rgba(0,0,0,.26),0 0 0 1px rgba(255,213,74,.14); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); transform:translateX(-50%); pointer-events:none; }
.sb-face-mask-guide-step { display:grid; width:24px; height:24px; flex:0 0 24px; place-items:center; border-radius:50%; background:#ffd54a; color:#2d260d; font-size:12px; font-weight:800; box-shadow:0 0 0 3px rgba(255,213,74,.12); }
.sb-face-mask-guide-copy { display:flex; min-width:0; flex-direction:column; gap:1px; }
.sb-face-mask-guide-copy strong,.sb-face-mask-guide-copy small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sb-face-mask-guide-copy strong { font-size:12px; font-weight:750; line-height:1.2; }
.sb-face-mask-guide-copy small { color:rgba(255,255,255,.78); font-size:12px; font-weight:500; line-height:1.3; }

.sb-face-difference-popover { --sb-face-popover-arrow-x:50%; --sb-face-popover-arrow-y:50%; position:absolute; z-index:12; display:flex; box-sizing:border-box; width:min(276px,calc(100% - 24px)); max-height:calc(100% - 94px); flex-direction:column; gap:8px; padding:8px; overflow:visible; border:1px solid rgba(20,20,24,.1); border-radius:12px; background:rgba(250,250,252,.97); color:#242426; box-shadow:0 10px 30px rgba(23,24,28,.16),0 1px 4px rgba(23,24,28,.08); backdrop-filter:blur(16px); }
.sb-face-difference-popover::after { content:""; position:absolute; left:var(--sb-face-popover-arrow-x); width:12px; height:12px; border:solid rgba(20,20,24,.1); background:#fafafc; transform:translateX(-50%) rotate(45deg); }
.sb-face-difference-popover[data-popover-side="above"]::after { bottom:-7px; border-width:0 1px 1px 0; }
.sb-face-difference-popover[data-popover-side="below"]::after { top:-7px; border-width:1px 0 0 1px; }
.sb-face-difference-popover[data-popover-side="right"]::after { left:-7px; top:var(--sb-face-popover-arrow-y); border-width:0 0 1px 1px; transform:translateY(-50%) rotate(45deg); }
.sb-face-difference-popover[data-popover-side="left"]::after { left:auto; right:-7px; top:var(--sb-face-popover-arrow-y); border-width:1px 1px 0 0; transform:translateY(-50%) rotate(45deg); }
.sb-face-difference-popover[data-popover-side="detached"]::after { display:none; }
.sb-face-panel-step { display:grid; min-height:0; gap:8px; }
.sb-face-panel-step[hidden] { display:none; }

.sb-face-difference-popover.is-mask.is-docked { left:50%; top:auto; bottom:14px; width:auto; max-width:calc(100% - 24px); max-height:none; padding:7px; transform:translateX(-50%); }
.sb-face-difference-popover.is-mask.is-following { bottom:auto; transform:translate(-50%,0); }
.sb-face-difference-popover.is-mask.is-following.is-mask-above { transform:translate(-50%,-100%); }
.sb-face-difference-popover.is-mask.is-docked::after { display:none; }
.sb-face-difference-popover.is-mask.is-docked.is-painting { visibility:hidden; pointer-events:none; }
.sb-face-difference-popover.is-library { width:min(360px,calc(100% - 24px)); max-height:calc(100% - 48px); padding:10px; }
.sb-face-difference-popover.is-library::after { display:block; }
.sb-face-difference-popover.is-library .sb-face-library-panel { display:flex; width:100%; min-height:0; padding:0; overflow:hidden; border:0; background:transparent; }
.sb-face-difference-popover.is-library .sb-face-library-head { min-height:32px; }
.sb-face-difference-popover.is-library .sb-face-library-grid { max-height:340px; }
.sb-face-difference-popover.is-review { left:50%!important; top:auto!important; bottom:14px!important; width:auto; max-width:calc(100% - 24px); transform:translateX(-50%); }
.sb-face-difference-popover.is-review::after { display:none; }
.sb-face-mask-toolbar { display:flex; align-items:center; justify-content:center; gap:7px; min-width:0; }
.sb-face-brush-control { display:grid; grid-template-columns:18px minmax(112px,150px) 34px; align-items:center; gap:7px; min-width:0; padding:0 5px; color:#64646a; }
.sb-face-brush-control input { width:100%; accent-color:#e4b719; }
.sb-face-brush-control b { color:#343438; font-size:11px; font-variant-numeric:tabular-nums; text-align:right; }
.sb-face-brush-icon { position:relative; display:block; width:16px; height:16px; transform:rotate(-38deg); }
.sb-face-brush-icon::before { content:""; position:absolute; left:7px; top:1px; width:3px; height:11px; border:1.5px solid currentColor; border-radius:3px; }
.sb-face-brush-icon::after { content:""; position:absolute; left:5px; bottom:0; width:7px; height:4px; border-radius:50%; background:currentColor; }
.sb-face-clear-btn { min-width:46px; height:34px; padding:0 10px; border:1px solid rgba(20,20,24,.09); border-radius:8px; background:#fff; color:#444448; font-size:11px; font-weight:650; cursor:pointer; }
.sb-face-mask-divider { width:1px; height:24px; background:rgba(20,20,24,.1); }
.sb-face-mask-toolbar > .sb-btn { min-height:34px; padding:0 13px; white-space:nowrap; }
.sb-face-mask-toolbar > .sb-btn:not(:disabled) { border-color:#e1ac00; background:linear-gradient(180deg,#ffe477 0%,#ffd13f 52%,#f0b900 100%); color:#332600; }
.sb-face-difference-overlay[data-face-step="mask"] .sb-face-difference-stage { padding-top:72px; padding-bottom:76px; }
.sb-face-difference-overlay[data-face-step="mask"] .sb-face-difference-stage canvas { cursor:none; }

.sb-face-selection-actions { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:5px; }
.sb-face-context-step { padding:0 6px; color:#77777c; font-size:11px; font-weight:650; white-space:nowrap; }
.sb-face-selection-actions .sb-btn { min-height:32px; white-space:nowrap; }
.sb-face-selection-actions .sb-region-primary-action:not(:disabled) { border-color:#e1ac00; background:linear-gradient(180deg,#ffe477 0%,#ffd13f 52%,#f0b900 100%); color:#332600; box-shadow:0 3px 10px rgba(225,172,0,.2),inset 0 1px 0 rgba(255,255,255,.58); }

.sb-face-icon-btn { display:grid; width:38px; height:38px; flex:0 0 38px; place-items:center; padding:0; border:1px solid rgba(20,20,24,.09); border-radius:8px; background:#fff; color:#29292c; font:500 20px/1 system-ui,sans-serif; cursor:pointer; transition:transform .14s ease,background .14s ease; }
.sb-face-icon-btn:hover:not(:disabled) { background:#f1f1f3; transform:scale(1.035); }
.sb-face-icon-btn:active:not(:disabled) { transform:scale(.965); }
.sb-face-icon-btn.primary { border-color:#e1ac00; background:linear-gradient(180deg,#ffe477 0%,#ffd13f 52%,#f0b900 100%); color:#332600; }
.sb-face-icon-btn:disabled { opacity:.38; cursor:not-allowed; }
.sb-face-step-actions { display:flex; align-items:center; justify-content:flex-end; gap:8px; }

.sb-face-region-list { display:none!important; }
.sb-face-library-panel { display:flex; min-width:0; min-height:0; flex-direction:column; gap:12px; padding:14px; overflow:hidden; border-left:1px solid rgba(20,20,24,.1); background:#f6f6f8; color:#242426; }
.sb-face-library-head { display:flex; min-height:38px; align-items:center; justify-content:flex-start; gap:9px; }
.sb-face-library-head > div { display:flex; min-width:0; align-items:baseline; gap:7px; }
.sb-face-library-back { margin-right:1px; }
.sb-face-library-upload { min-height:30px; margin-left:auto; padding:0 10px; border-color:rgba(20,20,24,.12); background:#fff; color:#4b4b50; font-size:10px; font-weight:680; white-space:nowrap; }
.sb-face-library-upload:hover:not(:disabled) { border-color:rgba(216,170,17,.72); background:#fffdf2; }
.sb-face-library-upload:disabled { opacity:.5; cursor:wait; }
.sb-face-library-head strong { color:#2d2d30; font-size:14px; font-weight:750; line-height:1; }
.sb-face-library-head [data-library-count] { color:#929298; font-size:9px; font-weight:600; white-space:nowrap; }
.sb-face-library-filters { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; padding-bottom:12px; border-bottom:1px solid rgba(20,20,24,.08); }
.sb-face-library-filters label { display:grid; min-width:0; gap:4px; color:#85858b; font-size:9px; font-weight:650; }
.sb-face-library-filters select { width:100%; min-width:0; height:34px; padding:0 9px; border:1px solid rgba(20,20,24,.1); border-radius:8px; background:#fff; color:#303034; font-size:10px; font-weight:600; }
.sb-face-library-filters select:focus-visible { outline:2px solid #ffd54a; outline-offset:1px; }
.sb-face-library-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-auto-rows:max-content; flex:1 1 auto; align-content:start; gap:8px; min-height:0; padding:2px; overflow-x:hidden; overflow-y:auto; }
.sb-face-library-grid:empty { display:none; }
.sb-face-library-item { display:block; aspect-ratio:1; min-width:0; padding:0; overflow:hidden; border:2px solid transparent; border-radius:8px; background:#e8e8eb; cursor:pointer; transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease; }
.sb-face-library-item:hover { border-color:rgba(216,170,17,.72); transform:scale(1.018); }
.sb-face-library-item.active { border-color:#d8aa11; box-shadow:0 0 0 2px rgba(255,213,74,.28); }
.sb-face-library-item:focus-visible { outline:2px solid #ffd54a; outline-offset:2px; }
.sb-face-library-item img { display:block; width:100%; height:100%; border-radius:6px; object-fit:cover; background:#ececef; }
.sb-face-library-empty { display:flex; min-height:160px; flex:1 1 auto; align-items:center; justify-content:center; flex-direction:column; gap:5px; padding:12px; color:#8b8b91; text-align:center; }
.sb-face-library-empty[hidden] { display:none; }
.sb-face-library-empty strong { margin-top:7px; color:#5f5f65; font-size:11px; font-weight:700; }
.sb-face-library-empty small { color:#9a9aa0; font-size:9px; line-height:1.45; }
.sb-face-empty-portrait { position:relative; display:block; width:44px; height:44px; border:1px solid rgba(90,90,98,.18); border-radius:50%; background:rgba(255,255,255,.52); }
.sb-face-empty-portrait::before { content:""; position:absolute; left:50%; top:9px; width:12px; height:12px; border:1.5px solid #aaaab0; border-radius:50%; transform:translateX(-50%); }
.sb-face-empty-portrait::after { content:""; position:absolute; left:50%; bottom:8px; width:22px; height:11px; border:1.5px solid #aaaab0; border-bottom:0; border-radius:14px 14px 0 0; transform:translateX(-50%); }
.sb-face-library-panel .sb-face-step-actions { margin-top:auto; padding-top:6px; }
.sb-face-library-panel .sb-face-generate { flex:1 1 auto; }
.sb-face-review-step { justify-items:center; }
.sb-face-apply { min-width:132px; }

.sb-face-generate,.sb-face-apply { min-height:42px; border-color:#e1ac00!important; background:linear-gradient(180deg,#ffe477 0%,#ffd13f 52%,#f0b900 100%)!important; color:#332600!important; }
.sb-face-generate.is-progress { --sb-face-progress:1%; position:relative; overflow:hidden; isolation:isolate; opacity:1; background:rgba(255,248,220,.94)!important; cursor:wait; }
.sb-face-generate.is-progress > span { position:relative; z-index:2; }
.sb-face-generate.is-progress::before,.sb-face-generate.is-progress::after { content:""; position:absolute; inset:0 auto 0 0; width:var(--sb-face-progress); pointer-events:none; transition:width .24s ease; }
.sb-face-generate.is-progress::before { z-index:0; background:linear-gradient(180deg,#ffe477 0%,#ffd13f 52%,#f0b900 100%); }
.sb-face-generate.is-progress::after { z-index:1; background-image:linear-gradient(110deg,transparent 16%,rgba(255,255,255,.72) 48%,transparent 78%); background-repeat:no-repeat; background-size:52px 100%; animation:sb-region-progress-shimmer 1.15s linear infinite; }
.sb-face-difference-overlay[data-face-step="generating"] .sb-face-library-grid,.sb-face-difference-overlay[data-face-step="generating"] .sb-face-library-filters { pointer-events:none; opacity:.56; }

html.theme-dark .sb-face-difference-popover { border-color:rgba(255,255,255,.1); background:rgba(30,30,32,.94); color:#f1f1f3; }
html.theme-dark .sb-face-difference-popover::after { border-color:rgba(255,255,255,.1); background:#1e1e20; }
html.theme-dark .sb-face-difference-stage > [data-status] { border-color:rgba(255,255,255,.16); background:rgba(25,25,27,.84); color:rgba(255,255,255,.88); }
html.theme-dark .sb-face-difference-stage > [data-status].is-guide { border-color:rgba(255,255,255,.66); background:rgba(24,24,26,.86); color:#fff; }
html.theme-dark .sb-face-preview-actions .sb-face-reset-all { border-color:#d86d70; background:#ffdede; color:#7f242b; box-shadow:0 2px 8px rgba(0,0,0,.34); }
html.theme-dark .sb-face-preview-actions .sb-face-reset-all:hover:not(:disabled) { border-color:#ef8b8d; background:#ffeaea; color:#681b22; }
html.theme-dark .sb-face-region-actions .sb-btn { border-color:rgba(255,255,255,.14); background:rgba(42,42,42,.96); color:#f1f1f3; box-shadow:0 4px 12px rgba(0,0,0,.28); }
html.theme-dark .sb-face-region-actions .sb-btn:hover:not(:disabled) { border-color:rgba(255,255,255,.28); background:#505054; }
html.theme-dark .sb-face-region-actions [data-region-action="retry"] { border-color:rgba(255,213,74,.4); background:rgba(255,213,74,.14); color:#ffe783; }
html.theme-dark .sb-face-region-actions [data-region-action="retry"]:hover:not(:disabled) { border-color:#d6ad2d; background:rgba(255,213,74,.24); }
html.theme-dark .sb-face-target-choice { border-color:rgba(255,255,255,.16); background:rgba(35,35,38,.94); color:#f2f2f4; box-shadow:0 10px 28px rgba(0,0,0,.38),0 1px 5px rgba(0,0,0,.24); }
html.theme-dark .sb-face-target-choice:hover { border-color:rgba(255,213,74,.36); background:rgba(65,61,43,.96); }
html.theme-dark .sb-face-target-choice:active { background:rgba(77,69,40,.96); }
html.theme-dark .sb-face-target-choice-copy small { color:#aaaab0; }
html.theme-dark .sb-face-library-panel { border-left-color:rgba(255,255,255,.1); background:#242426; color:#f1f1f3; }
html.theme-dark .sb-face-icon-btn,html.theme-dark .sb-face-library-item,html.theme-dark .sb-face-library-filters select { border-color:rgba(255,255,255,.1); background:#29292c; color:#f1f1f3; }
html.theme-dark .sb-face-library-head strong { color:#f1f1f3; }
html.theme-dark .sb-face-library-upload { border-color:rgba(255,255,255,.12); background:#29292c; color:#f1f1f3; }
html.theme-dark .sb-face-library-upload:hover:not(:disabled) { border-color:rgba(255,213,74,.52); background:#35352f; }
html.theme-dark .sb-face-library-filters { border-bottom-color:rgba(255,255,255,.08); }
html.theme-dark .sb-face-library-empty strong { color:#c5c5ca; }
html.theme-dark .sb-face-library-empty small { color:#7f7f86; }
html.theme-dark .sb-face-empty-portrait { border-color:rgba(255,255,255,.09); background:rgba(255,255,255,.025); }
html.theme-dark .sb-face-empty-portrait::before,html.theme-dark .sb-face-empty-portrait::after { border-color:#77777f; }
html.theme-dark .sb-face-context-step { color:#aaaab0; }
html.theme-dark .sb-face-background-actions .sb-region-background-action { border-color:#e1ac00; background:linear-gradient(180deg,#ffe477 0%,#ffd13f 52%,#f0b900 100%); color:#332600; }
html.theme-dark .sb-face-background-actions .sb-region-background-action:hover:not(:disabled) { border-color:#d59f00; background:linear-gradient(180deg,#ffea8e 0%,#ffd84f 52%,#f4c20a 100%); }
html.theme-dark .sb-face-clear-btn { border-color:rgba(255,255,255,.1); background:#29292c; color:#f1f1f3; }
html.theme-dark .sb-face-brush-control { color:#bdbdc3; }
html.theme-dark .sb-face-brush-control b { color:#f1f1f3; }
html.theme-dark .sb-face-mask-divider { background:rgba(255,255,255,.12); }

@media (max-width:760px) {
  .sb-face-difference-dialog { width:100vw; height:100vh; min-height:0; border-radius:0; }
  .sb-face-difference-stage { padding:10px; }
  .sb-face-difference-stage > [data-status] { top:58px; max-width:calc(100% - 28px); }
  .sb-face-difference-stage.has-compare > [data-status] { top:94px; }
  .sb-face-selection-tutorial { top:18px; max-width:calc(100% - 28px); }
  .sb-face-difference-stage.has-status .sb-face-selection-tutorial { top:98px; }
  .sb-face-mask-guide { top:14px; max-width:calc(100% - 28px); }
  .sb-face-library-panel { min-height:440px; border-top:1px solid rgba(20,20,24,.1); border-left:0; }
  .sb-face-difference-popover.is-library .sb-face-library-panel { min-height:0; border-top:0; }
  .sb-face-library-grid { grid-template-columns:repeat(3,minmax(0,1fr)); max-height:210px; }
  .sb-face-difference-popover.is-mask.is-docked { bottom:10px; width:calc(100% - 20px); overflow-x:auto; justify-content:flex-start; }
  .sb-face-mask-toolbar { width:max-content; min-width:100%; }
  .sb-face-brush-control { grid-template-columns:18px 106px 32px; }
}
@media (prefers-reduced-motion:reduce) { .sb-face-icon-btn,.sb-face-difference-popover,.sb-face-library-item,.sb-face-target-choice { transition:none; } .sb-face-generate.is-progress::after { animation:none; } }
@media (prefers-reduced-transparency:reduce) { .sb-face-target-choice { background:rgba(248,248,250,.98); backdrop-filter:none; -webkit-backdrop-filter:none; } html.theme-dark .sb-face-target-choice { background:rgba(35,35,38,.98); } }
