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