.img-layout { display: grid; grid-template-columns: 1.4fr 1fr; gap: 14px; align-items: start; }
@media (max-width: 960px) { .img-layout { grid-template-columns: 1fr; } }
.settings { position: sticky; top: 64px; }
.settings h3 { margin-top: 4px; }
.spacer { flex: 1; }
#list li { gap: 12px; }
#list img { width: 56px; height: 56px; object-fit: cover; border-radius: 6px; background: repeating-conic-gradient(var(--hover) 0 25%, transparent 0 50%) 0 0/12px 12px; flex: none; }
#list .info { flex: 1; min-width: 0; }
#list .info b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
#list .info span { color: var(--subtle); font-size: 12px; }
#list .res { font-size: 12px; text-align: right; }
.editor { border: 1px solid var(--border); border-radius: 10px; padding: 16px; background: var(--surface); color: var(--text); width: min(960px, calc(100% - 24px)); box-shadow: var(--shadow); }
.editor::backdrop { background: rgba(0,0,0,.45); }
.ed-stage { position: relative; margin: 12px 0; display: flex; justify-content: center; background: repeating-conic-gradient(var(--hover) 0 25%, transparent 0 50%) 0 0/16px 16px; border-radius: 6px; touch-action: none; user-select: none; }
#ed-canvas { max-width: 100%; max-height: 62vh; display: block; }
.ed-box { position: absolute; border: 2px solid #fff; box-shadow: 0 0 0 9999px rgba(0,0,0,.45), 0 0 0 1px #000 inset; pointer-events: none; }