.btn-soft{background:var(--brand-soft);border-color:transparent;color:var(--brand-dark)}.btn-soft:hover{background:#e0e2fb}.bg-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:.8rem;box-shadow:var(--shadow)}.bg-editor{display:flex;flex-direction:column;height:clamp(470px,88svh,820px);gap:.75rem;animation:editorIn .4s ease both}.bg-stage{position:relative;flex:0 0 48%;min-height:0;display:flex;flex-direction:column;gap:.5rem}.bg-controls{flex:1 1 auto;min-height:0;overflow-y:auto;padding-right:6px}@media(min-width:861px){.bg-editor{display:grid;grid-template-columns:minmax(0,1fr) minmax(310px,380px);gap:1.25rem;align-items:start;height:auto}.bg-stage{position:sticky;top:72px;z-index:1;flex:initial;max-height:calc(100svh - 100px)}}.bg-drop{display:grid;place-items:center;align-content:center;gap:.4rem;text-align:center;padding:clamp(2rem,6vw,3.5rem) 1rem;border:2px dashed var(--border-strong);border-radius:var(--radius-lg);background:radial-gradient(120% 120% at 50% 0%,var(--brand-soft),transparent 60%),var(--bg-soft);color:var(--text-soft);min-height:340px;transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease}.bg-drop.is-dragover{border-color:var(--brand);border-style:solid;box-shadow:0 0 0 4px var(--brand-soft);transform:scale(1.006)}.bg-drop.is-busy{opacity:.65}.bg-drop.is-dragover .drop-illu{animation-play-state:paused;transform:scale(1.06)}.bg-drop-title{font-weight:750;font-size:1.3rem;color:var(--text);letter-spacing:-.01em}.bg-drop-sub{color:var(--text-soft)}.bg-drop .btn{margin-top:.5rem}.bg-hint{font-size:.85rem;margin-top:.15rem}.bg-error{color:#b91c1c;font-size:.9rem;margin-top:.5rem}.bg-view{position:relative;flex:1 1 auto;min-height:0;width:100%;overflow:hidden;border:1px solid var(--border);border-radius:var(--radius);background:repeating-conic-gradient(#e9eef5 0% 25%,#f7f9fc 0% 50%) 50% / 22px 22px}@media(max-width:860px){.bg-view{min-height:200px}}.bg-img{position:absolute;inset:0;margin:auto;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}.bg-after{opacity:0;transition:opacity .25s ease}.bg-view.show-after .bg-after{opacity:1}.bg-view.show-after .bg-before{opacity:0}.bg-before{transition:opacity .25s ease}.bg-progress{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:.6rem;padding:1rem;text-align:center;background:#ffffffd1;backdrop-filter:blur(2px)}.bg-spin{width:34px;height:34px;border-radius:50%;border:3px solid var(--brand-soft);border-top-color:var(--brand);animation:bgspin .8s linear infinite}@keyframes bgspin{to{transform:rotate(360deg)}}.bg-progress-label{font-weight:650;color:var(--text)}.bg-progress-sub{font-size:.82rem;color:var(--text-soft);max-width:22rem}.bg-bar{width:min(240px,70%);height:8px;border-radius:999px;background:var(--bg-sunken);overflow:hidden}.bg-bar>span{display:block;height:100%;background:var(--brand);border-radius:999px;transition:width .2s ease}.bg-toggle{display:inline-flex;align-self:flex-start;gap:2px;padding:3px;background:var(--bg-sunken);border-radius:var(--radius-sm)}.bg-toggle .seg-btn{padding:.32rem .85rem}.bg-field{display:flex;flex-direction:column;gap:.3rem;font-size:.86rem;color:var(--text-soft);flex:1 1 auto}.bg-field>span{display:inline-flex;align-items:center;gap:.35rem}.bg-field b{color:var(--text)}.bg-field input[type=range]{width:100%;accent-color:var(--brand)}.bg-field-sm{display:flex;flex-direction:column;gap:.3rem;font-size:.82rem;color:var(--text-soft)}.bg-field-sm input[type=color]{width:100%;height:38px;padding:2px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--surface);cursor:pointer}.bg-help{font-size:.8rem;margin-top:.4rem}.bg-swatches{display:flex;flex-wrap:wrap;gap:.5rem}.bg-swatch{width:30px;height:30px;border-radius:8px;border:2px solid var(--border);cursor:pointer;padding:0;position:relative;box-shadow:inset 0 0 0 1px #0000000f}.bg-swatch.is-on{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}.bg-swatch-custom{display:inline-grid;place-items:center;background:conic-gradient(from 0deg,#ef4444,#f59e0b,#22c55e,#3b82f6,#a855f7,#ef4444);overflow:hidden}.bg-swatch-custom input[type=color]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.bg-bgname{font-size:.82rem;margin-top:.35rem;word-break:break-all}.bg-actions{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.6rem}.bg-actions .btn{flex:1 1 auto;justify-content:center}.bg-actions .btn-ghost{flex:0 0 auto}@media(prefers-reduced-motion:reduce){.bg-editor,.bg-spin,.bg-after,.bg-before{animation:none;transition:none}}.mode-links[data-astro-cid-scofa3ar]{display:flex;flex-wrap:wrap;gap:.5rem;margin:.25rem 0 1.75rem}.mode-chip[data-astro-cid-scofa3ar]{display:inline-flex;align-items:center;padding:.4rem .8rem;border:1px solid var(--border);border-radius:999px;background:var(--surface);color:var(--text-soft);font-size:.9rem;font-weight:600;text-decoration:none;transition:border-color .15s ease,color .15s ease,background .15s ease}.mode-chip[data-astro-cid-scofa3ar]:hover{border-color:var(--brand);color:var(--brand-dark);background:var(--brand-soft);text-decoration:none}.mode-chip-all[data-astro-cid-scofa3ar]{border-color:var(--accent);color:var(--accent-text)}